@anker-in/headless-ui 1.1.9-alpha.1764674322345 → 1.1.9-alpha.1764744576825
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/AiuiProvider/index.d.ts +5 -0
- package/dist/cjs/biz-components/AiuiProvider/index.js +1 -1
- package/dist/cjs/biz-components/AiuiProvider/index.js.map +2 -2
- package/dist/cjs/biz-components/Category/SwiperCategory.js +1 -1
- package/dist/cjs/biz-components/Category/SwiperCategory.js.map +1 -1
- 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/CreativeModule/index.js +1 -1
- package/dist/cjs/biz-components/CreativeModule/index.js.map +2 -2
- package/dist/cjs/biz-components/GraphicMore/index.js +1 -1
- package/dist/cjs/biz-components/GraphicMore/index.js.map +2 -2
- package/dist/cjs/biz-components/Listing/components/PaidShipping/index.d.ts +1 -1
- package/dist/cjs/biz-components/Listing/hooks/useBenefits.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/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js +1 -1
- package/dist/cjs/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js.map +2 -2
- package/dist/cjs/biz-components/ShelfDisplay/couponType.d.ts +50 -0
- package/dist/cjs/biz-components/ShelfDisplay/couponType.js +2 -0
- package/dist/cjs/biz-components/ShelfDisplay/couponType.js.map +7 -0
- package/dist/cjs/biz-components/ShelfDisplay/couponUtils.d.ts +37 -0
- package/dist/cjs/biz-components/ShelfDisplay/couponUtils.js +2 -0
- package/dist/cjs/biz-components/ShelfDisplay/couponUtils.js.map +7 -0
- package/dist/cjs/biz-components/ShelfDisplay/handleCoupon.d.ts +28 -0
- package/dist/cjs/biz-components/ShelfDisplay/handleCoupon.js +2 -0
- package/dist/cjs/biz-components/ShelfDisplay/handleCoupon.js.map +7 -0
- package/dist/cjs/biz-components/ShelfDisplay/index.js +1 -1
- package/dist/cjs/biz-components/ShelfDisplay/index.js.map +3 -3
- package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js +4 -4
- package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js.map +3 -3
- package/dist/cjs/biz-components/ShelfDisplay/useUDCGroup.d.ts +0 -0
- package/dist/cjs/biz-components/ShelfDisplay/useUDCGroup.js +2 -0
- package/dist/cjs/biz-components/ShelfDisplay/useUDCGroup.js.map +7 -0
- package/dist/cjs/components/ExposureDetector.d.ts +3 -3
- package/dist/cjs/components/ExposureDetector.js +1 -1
- package/dist/cjs/components/ExposureDetector.js.map +2 -2
- package/dist/cjs/components/alert.d.ts +5 -0
- package/dist/cjs/components/alert.js.map +2 -2
- package/dist/cjs/components/avatar.d.ts +5 -0
- package/dist/cjs/components/avatar.js.map +2 -2
- package/dist/cjs/components/badge.d.ts +5 -0
- package/dist/cjs/components/badge.js.map +2 -2
- package/dist/cjs/components/board.d.ts +5 -0
- package/dist/cjs/components/board.js.map +2 -2
- package/dist/cjs/components/button.d.ts +5 -0
- package/dist/cjs/components/button.js.map +2 -2
- package/dist/cjs/components/checkbox.d.ts +5 -0
- package/dist/cjs/components/checkbox.js.map +2 -2
- package/dist/cjs/components/color.d.ts +7 -1
- package/dist/cjs/components/color.js +1 -1
- package/dist/cjs/components/color.js.map +2 -2
- package/dist/cjs/components/container.d.ts +5 -0
- package/dist/cjs/components/container.js.map +2 -2
- package/dist/cjs/components/{gird.d.ts → grid.d.ts} +5 -0
- package/dist/cjs/components/{gird.js → grid.js} +1 -1
- package/dist/cjs/components/{gird.js.map → grid.js.map} +4 -4
- package/dist/cjs/components/heading.d.ts +5 -0
- package/dist/cjs/components/heading.js.map +2 -2
- package/dist/cjs/components/index.d.ts +1 -1
- package/dist/cjs/components/index.js +1 -1
- package/dist/cjs/components/index.js.map +2 -2
- package/dist/cjs/components/input-number.d.ts +5 -0
- package/dist/cjs/components/input-number.js.map +2 -2
- package/dist/cjs/components/input.d.ts +5 -0
- package/dist/cjs/components/input.js.map +2 -2
- package/dist/cjs/components/link.d.ts +7 -2
- package/dist/cjs/components/link.js +1 -1
- package/dist/cjs/components/link.js.map +2 -2
- package/dist/cjs/components/loadingDots.d.ts +5 -0
- package/dist/cjs/components/loadingDots.js.map +2 -2
- package/dist/cjs/components/picture.d.ts +5 -0
- package/dist/cjs/components/picture.js.map +2 -2
- package/dist/cjs/components/radio.d.ts +5 -0
- package/dist/cjs/components/radio.js.map +2 -2
- package/dist/cjs/components/skeleton.d.ts +5 -0
- package/dist/cjs/components/skeleton.js.map +2 -2
- package/dist/cjs/components/text.d.ts +5 -0
- package/dist/cjs/components/text.js.map +2 -2
- package/dist/cjs/components/theme.d.ts +4 -3
- package/dist/cjs/components/theme.js.map +2 -2
- package/dist/cjs/shared/Styles.js +1 -1
- package/dist/cjs/shared/Styles.js.map +2 -2
- package/dist/cjs/stories/grid.stories.js +1 -1
- package/dist/cjs/stories/grid.stories.js.map +2 -2
- package/dist/cjs/stories/heading.stories.js +4 -2
- package/dist/cjs/stories/heading.stories.js.map +2 -2
- package/dist/cjs/stories/link.stories.js +1 -1
- package/dist/cjs/stories/link.stories.js.map +1 -1
- package/dist/cjs/stories/text.stories.js +4 -2
- package/dist/cjs/stories/text.stories.js.map +2 -2
- package/dist/esm/biz-components/AiuiProvider/index.d.ts +5 -0
- package/dist/esm/biz-components/AiuiProvider/index.js +1 -1
- package/dist/esm/biz-components/AiuiProvider/index.js.map +2 -2
- package/dist/esm/biz-components/Category/SwiperCategory.js +1 -1
- package/dist/esm/biz-components/Category/SwiperCategory.js.map +1 -1
- 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/CreativeModule/index.js +1 -1
- package/dist/esm/biz-components/CreativeModule/index.js.map +1 -1
- package/dist/esm/biz-components/GraphicMore/index.js +1 -1
- package/dist/esm/biz-components/GraphicMore/index.js.map +1 -1
- package/dist/esm/biz-components/Listing/components/PaidShipping/index.d.ts +1 -1
- package/dist/esm/biz-components/Listing/hooks/useBenefits.js.map +2 -2
- package/dist/esm/biz-components/MediaPlayerSticky/index.js +1 -1
- package/dist/esm/biz-components/MediaPlayerSticky/index.js.map +1 -1
- package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js +1 -1
- package/dist/esm/biz-components/MultiLayoutGraphicBlock/MultiLayoutGraphicBlock.js.map +1 -1
- package/dist/esm/biz-components/ShelfDisplay/couponType.d.ts +50 -0
- package/dist/esm/biz-components/ShelfDisplay/couponType.js +1 -0
- package/dist/esm/biz-components/ShelfDisplay/couponType.js.map +7 -0
- package/dist/esm/biz-components/ShelfDisplay/couponUtils.d.ts +37 -0
- package/dist/esm/biz-components/ShelfDisplay/couponUtils.js +2 -0
- package/dist/esm/biz-components/ShelfDisplay/couponUtils.js.map +7 -0
- package/dist/esm/biz-components/ShelfDisplay/handleCoupon.d.ts +28 -0
- package/dist/esm/biz-components/ShelfDisplay/handleCoupon.js +2 -0
- package/dist/esm/biz-components/ShelfDisplay/handleCoupon.js.map +7 -0
- package/dist/esm/biz-components/ShelfDisplay/index.js +1 -1
- package/dist/esm/biz-components/ShelfDisplay/index.js.map +3 -3
- package/dist/esm/biz-components/ShelfDisplay/shelfDisplayItem.js +5 -5
- package/dist/esm/biz-components/ShelfDisplay/shelfDisplayItem.js.map +3 -3
- package/dist/esm/biz-components/ShelfDisplay/useUDCGroup.d.ts +0 -0
- package/dist/esm/biz-components/ShelfDisplay/useUDCGroup.js +2 -0
- package/dist/esm/biz-components/ShelfDisplay/useUDCGroup.js.map +7 -0
- package/dist/esm/components/ExposureDetector.d.ts +3 -3
- package/dist/esm/components/ExposureDetector.js +1 -1
- package/dist/esm/components/ExposureDetector.js.map +2 -2
- package/dist/esm/components/alert.d.ts +5 -0
- package/dist/esm/components/alert.js.map +2 -2
- package/dist/esm/components/avatar.d.ts +5 -0
- package/dist/esm/components/avatar.js.map +2 -2
- package/dist/esm/components/badge.d.ts +5 -0
- package/dist/esm/components/badge.js.map +2 -2
- package/dist/esm/components/board.d.ts +5 -0
- package/dist/esm/components/board.js.map +2 -2
- package/dist/esm/components/button.d.ts +5 -0
- package/dist/esm/components/button.js.map +2 -2
- package/dist/esm/components/checkbox.d.ts +5 -0
- package/dist/esm/components/checkbox.js.map +2 -2
- package/dist/esm/components/color.d.ts +7 -1
- package/dist/esm/components/color.js +1 -1
- package/dist/esm/components/color.js.map +2 -2
- package/dist/esm/components/container.d.ts +5 -0
- package/dist/esm/components/container.js.map +2 -2
- package/dist/esm/components/{gird.d.ts → grid.d.ts} +5 -0
- package/dist/esm/components/{gird.js → grid.js} +1 -1
- package/dist/esm/components/{gird.js.map → grid.js.map} +3 -3
- package/dist/esm/components/heading.d.ts +5 -0
- package/dist/esm/components/heading.js.map +2 -2
- package/dist/esm/components/index.d.ts +1 -1
- package/dist/esm/components/index.js +1 -1
- package/dist/esm/components/index.js.map +1 -1
- package/dist/esm/components/input-number.d.ts +5 -0
- package/dist/esm/components/input-number.js.map +2 -2
- package/dist/esm/components/input.d.ts +5 -0
- package/dist/esm/components/input.js.map +2 -2
- package/dist/esm/components/link.d.ts +7 -2
- package/dist/esm/components/link.js +1 -1
- package/dist/esm/components/link.js.map +2 -2
- package/dist/esm/components/loadingDots.d.ts +5 -0
- package/dist/esm/components/loadingDots.js.map +2 -2
- package/dist/esm/components/picture.d.ts +5 -0
- package/dist/esm/components/picture.js.map +2 -2
- package/dist/esm/components/radio.d.ts +5 -0
- package/dist/esm/components/radio.js.map +2 -2
- package/dist/esm/components/skeleton.d.ts +5 -0
- package/dist/esm/components/skeleton.js.map +2 -2
- package/dist/esm/components/text.d.ts +5 -0
- package/dist/esm/components/text.js.map +2 -2
- package/dist/esm/components/theme.d.ts +4 -3
- package/dist/esm/components/theme.js.map +2 -2
- package/dist/esm/shared/Styles.js +1 -1
- package/dist/esm/shared/Styles.js.map +1 -1
- package/dist/esm/stories/grid.stories.js +1 -1
- package/dist/esm/stories/grid.stories.js.map +1 -1
- package/dist/esm/stories/heading.stories.js +4 -2
- package/dist/esm/stories/heading.stories.js.map +3 -3
- package/dist/esm/stories/link.stories.js +1 -1
- package/dist/esm/stories/link.stories.js.map +1 -1
- package/dist/esm/stories/text.stories.js +5 -3
- package/dist/esm/stories/text.stories.js.map +3 -3
- package/dist/tokens/base.css +51 -86
- package/package.json +4 -6
- package/style.css +8 -62
- package/tailwind.config.js +8 -31
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/color.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cn } from '../helpers/index.js'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\nconst colorVariants = cva('', {\n variants: {\n color: {\n brand0: 'bg-brand-0',\n brand1: 'bg-brand-1',\n success0: 'bg-success-0',\n success1: 'bg-success-1',\n
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,WAAAE,IAAA,eAAAC,EAAAH,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cn } from '../helpers/index.js'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\nconst colorVariants = cva('', {\n variants: {\n color: {\n brand0: 'bg-brand-0',\n brand1: 'bg-brand-1',\n success0: 'bg-success-0',\n success1: 'bg-success-1',\n\n warning0: 'bg-warning-0',\n warning1: 'bg-warning-1',\n\n error0: 'bg-error-0',\n error1: 'bg-error-1',\n\n infoPrimary: 'bg-info-primary',\n infoSecondary: 'bg-info-secondary',\n infoTertiary: 'bg-info-tertiary',\n infoQuaternary: 'bg-info-quaternary',\n infoWhite: 'bg-info-white',\n\n containerPrimary: 'bg-container-primary',\n containerSecondary0: 'bg-container-secondary-0',\n containerSecondary1: 'bg-container-secondary-1',\n\n bg0: 'bg-bg-0',\n bg1: 'bg-bg-1',\n lines: 'bg-lines',\n masks0: 'bg-masks-0',\n masks1: 'bg-masks-1',\n },\n },\n defaultVariants: {\n color: 'brand0',\n },\n})\ntype ColorElement = React.ElementRef<'div'>\ntype ColorDivProps = ComponentPropsWithout<'div', RemovedProps>\ninterface CommonColorProps extends VariantProps<typeof colorVariants> {}\ntype ColorProps = CommonColorProps & ColorDivProps\n\n/**\n * Color - \u989C\u8272\u5BB9\u5668\n *\n * @description \u63D0\u4F9B\u4E3B\u9898\u8272\u5F69\u914D\u7F6E\u7684\u5BB9\u5668\u7EC4\u4EF6\uFF0C\u652F\u6301\u54C1\u724C\u8272\u3001\u72B6\u6001\u8272\u7B49\u591A\u79CD\u9884\u8BBE\u989C\u8272\n * @deprecated \u5DF2\u4F5C\u5E9F\uFF0C\u8BF7\u4F7F\u7528 \u9ED8\u8BA4\u7684\u914D\u8272 \u6216 \u76F4\u63A5\u8BBE\u7F6E\u989C\u8272\n */\nconst Color = React.forwardRef<ColorElement, ColorProps>((props, forwardedRef) => {\n const { children, color = 'brand0', className, ...colorProps } = props\n return (\n <Slot\n {...colorProps}\n ref={forwardedRef}\n className={cn(\n colorVariants({\n color,\n }),\n className\n )}\n >\n {children}\n </Slot>\n )\n})\nColor.displayName = 'Color'\nexport { Color }\nexport type { ColorProps }\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,WAAAE,IAAA,eAAAC,EAAAH,GAsDI,IAAAI,EAAA,6BAtDJC,EAAuB,oBACvBC,EAAqB,gCACrBC,EAAmB,+BACnBC,EAAuC,oCAEvC,MAAMC,KAAgB,OAAI,GAAI,CAC5B,SAAU,CACR,MAAO,CACL,OAAQ,aACR,OAAQ,aACR,SAAU,eACV,SAAU,eAEV,SAAU,eACV,SAAU,eAEV,OAAQ,aACR,OAAQ,aAER,YAAa,kBACb,cAAe,oBACf,aAAc,mBACd,eAAgB,qBAChB,UAAW,gBAEX,iBAAkB,uBAClB,oBAAqB,2BACrB,oBAAqB,2BAErB,IAAK,UACL,IAAK,UACL,MAAO,WACP,OAAQ,aACR,OAAQ,YACV,CACF,EACA,gBAAiB,CACf,MAAO,QACT,CACF,CAAC,EAYKP,EAAQG,EAAM,WAAqC,CAACK,EAAOC,IAAiB,CAChF,KAAM,CAAE,SAAAC,EAAU,MAAAC,EAAQ,SAAU,UAAAC,EAAW,GAAGC,CAAW,EAAIL,EACjE,SACE,OAAC,QACE,GAAGK,EACJ,IAAKJ,EACL,aAAW,MACTF,EAAc,CACZ,MAAAI,CACF,CAAC,EACDC,CACF,EAEC,SAAAF,EACH,CAEJ,CAAC,EACDV,EAAM,YAAc",
|
|
6
6
|
"names": ["color_exports", "__export", "Color", "__toCommonJS", "import_jsx_runtime", "React", "import_react_slot", "import_helpers", "import_class_variance_authority", "colorVariants", "props", "forwardedRef", "children", "color", "className", "colorProps"]
|
|
7
7
|
}
|
|
@@ -10,6 +10,11 @@ type ContainerProps = {
|
|
|
10
10
|
spaceBottom?: SpaceBottom;
|
|
11
11
|
mode?: Mode;
|
|
12
12
|
} & React.ComponentPropsWithoutRef<'div'>;
|
|
13
|
+
/**
|
|
14
|
+
* Container - 容器
|
|
15
|
+
*
|
|
16
|
+
* @description 页面布局容器组件,提供响应式间距和最大宽度限制,支持不同模式和间距配置
|
|
17
|
+
*/
|
|
13
18
|
declare const Container: React.ForwardRefExoticComponent<{
|
|
14
19
|
asChild?: boolean | undefined;
|
|
15
20
|
children?: React.ReactNode;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/container.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react'\nimport { cn } from '../helpers/utils.js'\nimport { Slot } from '@radix-ui/react-slot'\nimport type { Mode, SpaceY, SpaceTop, SpaceBottom } from '../types/props.js'\n\ntype ContainerElement = React.ElementRef<'div'>\ntype ContainerProps = {\n asChild?: boolean\n children?: React.ReactNode\n className?: string\n childClassName?: string\n spaceY?: SpaceY\n spaceTop?: SpaceTop\n spaceBottom?: SpaceBottom\n mode?: Mode\n} & React.ComponentPropsWithoutRef<'div'>\n\nconst Fragment = ({ children }: { children: React.ReactNode }) => {\n return <>{children}</>\n}\n\nconst Section = React.forwardRef<ContainerElement, ContainerProps>(({ ...props }, forwardedRef) => {\n const {\n asChild,\n children,\n className,\n childClassName,\n spaceY = 'none',\n spaceTop = 'none',\n spaceBottom = 'none',\n ...containerProps\n } = props\n\n const Comp = asChild ? Slot : 'div'\n\n const spaceY_map: any = {\n default: 'tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]',\n none: '',\n }\n\n const spaceTop_map: any = {\n default: 'tablet:pt-[80px] laptop:pt-[96px] desktop:pt-[112px] lg-desktop:pt-[128px] pt-[64px]',\n none: '',\n }\n\n const spaceBottom_map: any = {\n default: 'tablet:pb-[80px] laptop:pb-[96px] desktop:pb-[112px] lg-desktop:pb-[128px] pb-[64px]',\n none: '',\n }\n\n return (\n <Comp\n {...containerProps}\n ref={forwardedRef}\n className={cn(className, 'ipc_container', 'relative z-10 w-full overflow-hidden bg-white')}\n >\n <div\n className={cn(\n 'lg-desktop:max-w-full mx-auto size-full',\n 'tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-4',\n childClassName,\n spaceY_map?.[spaceY] || spaceY,\n spaceTop_map?.[spaceTop] || spaceTop,\n spaceBottom_map?.[spaceBottom] || spaceBottom\n )}\n >\n {children}\n </div>\n </Comp>\n )\n})\n\nconst Container = React.forwardRef<ContainerElement, ContainerProps>(({ ...props }, forwardedRef) => {\n const { children, mode = 'section' } = props\n\n const componentsMap: {\n [P in Mode]: React.ComponentType<any> | string\n } = {\n section: Section,\n fragment: Fragment,\n }\n\n const Component = componentsMap![mode!]\n\n return (\n <Component {...props} ref={forwardedRef}>\n {children}\n </Component>\n )\n})\n\nContainer.displayName = 'Container'\n\nexport { Container }\nexport type { ContainerProps }\n"],
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,eAAAE,IAAA,eAAAC,EAAAH,GAkBS,IAAAI,EAAA,6BAlBTC,EAAkB,oBAClBC,EAAmB,+BACnBC,EAAqB,gCAerB,MAAMC,EAAW,CAAC,CAAE,SAAAC,CAAS,OACpB,mBAAG,SAAAA,EAAS,EAGfC,EAAU,EAAAC,QAAM,WAA6C,CAAC,CAAE,GAAGC,CAAM,EAAGC,IAAiB,CACjG,KAAM,CACJ,QAAAC,EACA,SAAAL,EACA,UAAAM,EACA,eAAAC,EACA,OAAAC,EAAS,OACT,SAAAC,EAAW,OACX,YAAAC,EAAc,OACd,GAAGC,CACL,EAAIR,EAEES,EAAOP,EAAU,OAAO,MAExBQ,EAAkB,CACtB,QAAS,uFACT,KAAM,EACR,EAEMC,EAAoB,CACxB,QAAS,uFACT,KAAM,EACR,EAEMC,EAAuB,CAC3B,QAAS,uFACT,KAAM,EACR,EAEA,SACE,OAACH,EAAA,CACE,GAAGD,EACJ,IAAKP,EACL,aAAW,MAAGE,EAAW,gBAAiB,+CAA+C,EAEzF,mBAAC,OACC,aAAW,MACT,0CACA,8EACAC,EACAM,IAAaL,CAAM,GAAKA,EACxBM,IAAeL,CAAQ,GAAKA,EAC5BM,IAAkBL,CAAW,GAAKA,CACpC,EAEC,SAAAV,EACH,EACF,CAEJ,CAAC,
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { cn } from '../helpers/utils.js'\nimport { Slot } from '@radix-ui/react-slot'\nimport type { Mode, SpaceY, SpaceTop, SpaceBottom } from '../types/props.js'\n\ntype ContainerElement = React.ElementRef<'div'>\ntype ContainerProps = {\n asChild?: boolean\n children?: React.ReactNode\n className?: string\n childClassName?: string\n spaceY?: SpaceY\n spaceTop?: SpaceTop\n spaceBottom?: SpaceBottom\n mode?: Mode\n} & React.ComponentPropsWithoutRef<'div'>\n\nconst Fragment = ({ children }: { children: React.ReactNode }) => {\n return <>{children}</>\n}\n\nconst Section = React.forwardRef<ContainerElement, ContainerProps>(({ ...props }, forwardedRef) => {\n const {\n asChild,\n children,\n className,\n childClassName,\n spaceY = 'none',\n spaceTop = 'none',\n spaceBottom = 'none',\n ...containerProps\n } = props\n\n const Comp = asChild ? Slot : 'div'\n\n const spaceY_map: any = {\n default: 'tablet:my-[80px] laptop:my-[96px] desktop:my-[112px] lg-desktop:my-[128px] my-[64px]',\n none: '',\n }\n\n const spaceTop_map: any = {\n default: 'tablet:pt-[80px] laptop:pt-[96px] desktop:pt-[112px] lg-desktop:pt-[128px] pt-[64px]',\n none: '',\n }\n\n const spaceBottom_map: any = {\n default: 'tablet:pb-[80px] laptop:pb-[96px] desktop:pb-[112px] lg-desktop:pb-[128px] pb-[64px]',\n none: '',\n }\n\n return (\n <Comp\n {...containerProps}\n ref={forwardedRef}\n className={cn(className, 'ipc_container', 'relative z-10 w-full overflow-hidden bg-white')}\n >\n <div\n className={cn(\n 'lg-desktop:max-w-full mx-auto size-full',\n 'tablet:px-8 laptop:px-16 desktop:px-16 lg-desktop:px-[calc(50%-832px)] px-4',\n childClassName,\n spaceY_map?.[spaceY] || spaceY,\n spaceTop_map?.[spaceTop] || spaceTop,\n spaceBottom_map?.[spaceBottom] || spaceBottom\n )}\n >\n {children}\n </div>\n </Comp>\n )\n})\n\n/**\n * Container - \u5BB9\u5668\n *\n * @description \u9875\u9762\u5E03\u5C40\u5BB9\u5668\u7EC4\u4EF6\uFF0C\u63D0\u4F9B\u54CD\u5E94\u5F0F\u95F4\u8DDD\u548C\u6700\u5927\u5BBD\u5EA6\u9650\u5236\uFF0C\u652F\u6301\u4E0D\u540C\u6A21\u5F0F\u548C\u95F4\u8DDD\u914D\u7F6E\n */\nconst Container = React.forwardRef<ContainerElement, ContainerProps>(({ ...props }, forwardedRef) => {\n const { children, mode = 'section' } = props\n\n const componentsMap: {\n [P in Mode]: React.ComponentType<any> | string\n } = {\n section: Section,\n fragment: Fragment,\n }\n\n const Component = componentsMap![mode!]\n\n return (\n <Component {...props} ref={forwardedRef}>\n {children}\n </Component>\n )\n})\n\nContainer.displayName = 'Container'\n\nexport { Container }\nexport type { ContainerProps }\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,eAAAE,IAAA,eAAAC,EAAAH,GAkBS,IAAAI,EAAA,6BAlBTC,EAAkB,oBAClBC,EAAmB,+BACnBC,EAAqB,gCAerB,MAAMC,EAAW,CAAC,CAAE,SAAAC,CAAS,OACpB,mBAAG,SAAAA,EAAS,EAGfC,EAAU,EAAAC,QAAM,WAA6C,CAAC,CAAE,GAAGC,CAAM,EAAGC,IAAiB,CACjG,KAAM,CACJ,QAAAC,EACA,SAAAL,EACA,UAAAM,EACA,eAAAC,EACA,OAAAC,EAAS,OACT,SAAAC,EAAW,OACX,YAAAC,EAAc,OACd,GAAGC,CACL,EAAIR,EAEES,EAAOP,EAAU,OAAO,MAExBQ,EAAkB,CACtB,QAAS,uFACT,KAAM,EACR,EAEMC,EAAoB,CACxB,QAAS,uFACT,KAAM,EACR,EAEMC,EAAuB,CAC3B,QAAS,uFACT,KAAM,EACR,EAEA,SACE,OAACH,EAAA,CACE,GAAGD,EACJ,IAAKP,EACL,aAAW,MAAGE,EAAW,gBAAiB,+CAA+C,EAEzF,mBAAC,OACC,aAAW,MACT,0CACA,8EACAC,EACAM,IAAaL,CAAM,GAAKA,EACxBM,IAAeL,CAAQ,GAAKA,EAC5BM,IAAkBL,CAAW,GAAKA,CACpC,EAEC,SAAAV,EACH,EACF,CAEJ,CAAC,EAOKP,EAAY,EAAAS,QAAM,WAA6C,CAAC,CAAE,GAAGC,CAAM,EAAGC,IAAiB,CACnG,KAAM,CAAE,SAAAJ,EAAU,KAAAgB,EAAO,SAAU,EAAIb,EASjCc,EALF,CACF,QAAShB,EACT,SAAUF,CACZ,EAEiCiB,CAAK,EAEtC,SACE,OAACC,EAAA,CAAW,GAAGd,EAAO,IAAKC,EACxB,SAAAJ,EACH,CAEJ,CAAC,EAEDP,EAAU,YAAc",
|
|
6
6
|
"names": ["container_exports", "__export", "Container", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "import_react_slot", "Fragment", "children", "Section", "React", "props", "forwardedRef", "asChild", "className", "childClassName", "spaceY", "spaceTop", "spaceBottom", "containerProps", "Comp", "spaceY_map", "spaceTop_map", "spaceBottom_map", "mode", "Component"]
|
|
7
7
|
}
|
|
@@ -11,6 +11,11 @@ interface GridItemProps {
|
|
|
11
11
|
start?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
|
|
12
12
|
end?: 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13;
|
|
13
13
|
}
|
|
14
|
+
/**
|
|
15
|
+
* Grid - 网格布局
|
|
16
|
+
*
|
|
17
|
+
* @description 基于CSS Grid的12列网格布局容器组件,提供灵活的响应式布局方案
|
|
18
|
+
*/
|
|
14
19
|
declare const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLDivElement>>;
|
|
15
20
|
declare const GridItem: React.ForwardRefExoticComponent<GridItemProps & React.RefAttributes<HTMLDivElement>>;
|
|
16
21
|
export { Grid, GridItem };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use strict";var f=Object.create;var a=Object.defineProperty;var G=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var P=(o,s)=>{for(var c in s)a(o,c,{get:s[c],enumerable:!0})},i=(o,s,c,e)=>{if(s&&typeof s=="object"||typeof s=="function")for(let t of N(s))!g.call(o,t)&&t!==c&&a(o,t,{get:()=>s[t],enumerable:!(e=G(s,t))||e.enumerable});return o};var v=(o,s,c)=>(c=o!=null?f(R(o)):{},i(s||!o||!o.__esModule?a(c,"default",{value:o,enumerable:!0}):c,o)),y=o=>i(a({},"__esModule",{value:!0}),o);var h={};P(h,{Grid:()=>n,GridItem:()=>d});module.exports=y(h);var p=require("react/jsx-runtime"),l=v(require("react")),r=require("../helpers/utils.js");const E={1:"col-span-1",2:"col-span-2",3:"col-span-3",4:"col-span-4",5:"col-span-5",6:"col-span-6",7:"col-span-7",8:"col-span-8",9:"col-span-9",10:"col-span-10",11:"col-span-11",12:"col-span-12"},I={1:"col-start-1",2:"col-start-2",3:"col-start-3",4:"col-start-4",5:"col-start-5",6:"col-start-6",7:"col-start-7",8:"col-start-8",9:"col-start-9",10:"col-start-10",11:"col-start-11",12:"col-start-12"},C={2:"col-end-2",3:"col-end-3",4:"col-end-4",5:"col-end-5",6:"col-end-6",7:"col-end-7",8:"col-end-8",9:"col-end-9",10:"col-end-10",11:"col-end-11",12:"col-end-12",13:"col-end-13"},n=l.default.forwardRef(({className:o,children:s},c)=>(0,p.jsx)("div",{ref:c,className:(0,r.cn)("laptop:gap-4 grid grid-cols-12 gap-3",o),children:s}));n.displayName="Grid";const d=l.default.forwardRef(({className:o,children:s,span:c=12,start:e,end:t},m)=>(0,p.jsx)("div",{ref:m,className:(0,r.cn)(E[c],e&&I[e],t&&C[t],o),children:s}));d.displayName="GridItem";
|
|
2
|
-
//# sourceMappingURL=
|
|
2
|
+
//# sourceMappingURL=grid.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/
|
|
4
|
-
"sourcesContent": ["import React from 'react'\nimport type { ReactNode } from 'react'\nimport { cn } from '../helpers/utils.js'\n\ntype Element = React.ElementRef<'div'>\n\ninterface GridProps {\n children?: ReactNode\n className?: string\n}\n\ninterface GridItemProps {\n children?: ReactNode\n className?: string\n span?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 // \u9650\u5236\u4E3A\u5177\u4F53\u7684\u6570\u5B57\u7C7B\u578B\n start?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 // \u8D77\u59CB\u5217\u4F4D\u7F6E\n end?: 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 // \u7ED3\u675F\u5217\u4F4D\u7F6E\n}\n\nconst colSpanClasses = {\n 1: 'col-span-1',\n 2: 'col-span-2',\n 3: 'col-span-3',\n 4: 'col-span-4',\n 5: 'col-span-5',\n 6: 'col-span-6',\n 7: 'col-span-7',\n 8: 'col-span-8',\n 9: 'col-span-9',\n 10: 'col-span-10',\n 11: 'col-span-11',\n 12: 'col-span-12',\n} as const\n\nconst colStartClasses = {\n 1: 'col-start-1',\n 2: 'col-start-2',\n 3: 'col-start-3',\n 4: 'col-start-4',\n 5: 'col-start-5',\n 6: 'col-start-6',\n 7: 'col-start-7',\n 8: 'col-start-8',\n 9: 'col-start-9',\n 10: 'col-start-10',\n 11: 'col-start-11',\n 12: 'col-start-12',\n} as const\n\nconst colEndClasses = {\n 2: 'col-end-2',\n 3: 'col-end-3',\n 4: 'col-end-4',\n 5: 'col-end-5',\n 6: 'col-end-6',\n 7: 'col-end-7',\n 8: 'col-end-8',\n 9: 'col-end-9',\n 10: 'col-end-10',\n 11: 'col-end-11',\n 12: 'col-end-12',\n 13: 'col-end-13',\n} as const\n\nconst Grid = React.forwardRef<Element, GridProps>(({ className, children }, forwardedRef) => {\n return (\n <div ref={forwardedRef} className={cn('laptop:gap-4 grid grid-cols-12 gap-3', className)}>\n {children}\n </div>\n )\n})\nGrid.displayName = 'Grid'\n\nconst GridItem = React.forwardRef<Element, GridItemProps>(\n ({ className, children, span = 12, start, end }, forwardedRef) => {\n return (\n <div\n ref={forwardedRef}\n className={cn(colSpanClasses[span], start && colStartClasses[start], end && colEndClasses[end], className)}\n >\n {children}\n </div>\n )\n }\n)\nGridItem.displayName = 'GridItem'\n\nexport { Grid, GridItem }\nexport type { GridProps, GridItemProps }\n"],
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,UAAAE,EAAA,aAAAC,IAAA,eAAAC,EAAAJ,
|
|
6
|
-
"names": ["
|
|
3
|
+
"sources": ["../../../src/components/grid.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport type { ReactNode } from 'react'\nimport { cn } from '../helpers/utils.js'\n\ntype Element = React.ElementRef<'div'>\n\ninterface GridProps {\n children?: ReactNode\n className?: string\n}\n\ninterface GridItemProps {\n children?: ReactNode\n className?: string\n span?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 // \u9650\u5236\u4E3A\u5177\u4F53\u7684\u6570\u5B57\u7C7B\u578B\n start?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 // \u8D77\u59CB\u5217\u4F4D\u7F6E\n end?: 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 // \u7ED3\u675F\u5217\u4F4D\u7F6E\n}\n\nconst colSpanClasses = {\n 1: 'col-span-1',\n 2: 'col-span-2',\n 3: 'col-span-3',\n 4: 'col-span-4',\n 5: 'col-span-5',\n 6: 'col-span-6',\n 7: 'col-span-7',\n 8: 'col-span-8',\n 9: 'col-span-9',\n 10: 'col-span-10',\n 11: 'col-span-11',\n 12: 'col-span-12',\n} as const\n\nconst colStartClasses = {\n 1: 'col-start-1',\n 2: 'col-start-2',\n 3: 'col-start-3',\n 4: 'col-start-4',\n 5: 'col-start-5',\n 6: 'col-start-6',\n 7: 'col-start-7',\n 8: 'col-start-8',\n 9: 'col-start-9',\n 10: 'col-start-10',\n 11: 'col-start-11',\n 12: 'col-start-12',\n} as const\n\nconst colEndClasses = {\n 2: 'col-end-2',\n 3: 'col-end-3',\n 4: 'col-end-4',\n 5: 'col-end-5',\n 6: 'col-end-6',\n 7: 'col-end-7',\n 8: 'col-end-8',\n 9: 'col-end-9',\n 10: 'col-end-10',\n 11: 'col-end-11',\n 12: 'col-end-12',\n 13: 'col-end-13',\n} as const\n\n/**\n * Grid - \u7F51\u683C\u5E03\u5C40\n *\n * @description \u57FA\u4E8ECSS Grid\u768412\u5217\u7F51\u683C\u5E03\u5C40\u5BB9\u5668\u7EC4\u4EF6\uFF0C\u63D0\u4F9B\u7075\u6D3B\u7684\u54CD\u5E94\u5F0F\u5E03\u5C40\u65B9\u6848\n */\nconst Grid = React.forwardRef<Element, GridProps>(({ className, children }, forwardedRef) => {\n return (\n <div ref={forwardedRef} className={cn('laptop:gap-4 grid grid-cols-12 gap-3', className)}>\n {children}\n </div>\n )\n})\nGrid.displayName = 'Grid'\n\nconst GridItem = React.forwardRef<Element, GridItemProps>(\n ({ className, children, span = 12, start, end }, forwardedRef) => {\n return (\n <div\n ref={forwardedRef}\n className={cn(colSpanClasses[span], start && colStartClasses[start], end && colEndClasses[end], className)}\n >\n {children}\n </div>\n )\n }\n)\nGridItem.displayName = 'GridItem'\n\nexport { Grid, GridItem }\nexport type { GridProps, GridItemProps }\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,UAAAE,EAAA,aAAAC,IAAA,eAAAC,EAAAJ,GAuEI,IAAAK,EAAA,6BAvEJC,EAAkB,oBAElBC,EAAmB,+BAiBnB,MAAMC,EAAiB,CACrB,EAAG,aACH,EAAG,aACH,EAAG,aACH,EAAG,aACH,EAAG,aACH,EAAG,aACH,EAAG,aACH,EAAG,aACH,EAAG,aACH,GAAI,cACJ,GAAI,cACJ,GAAI,aACN,EAEMC,EAAkB,CACtB,EAAG,cACH,EAAG,cACH,EAAG,cACH,EAAG,cACH,EAAG,cACH,EAAG,cACH,EAAG,cACH,EAAG,cACH,EAAG,cACH,GAAI,eACJ,GAAI,eACJ,GAAI,cACN,EAEMC,EAAgB,CACpB,EAAG,YACH,EAAG,YACH,EAAG,YACH,EAAG,YACH,EAAG,YACH,EAAG,YACH,EAAG,YACH,EAAG,YACH,GAAI,aACJ,GAAI,aACJ,GAAI,aACJ,GAAI,YACN,EAOMR,EAAO,EAAAS,QAAM,WAA+B,CAAC,CAAE,UAAAC,EAAW,SAAAC,CAAS,EAAGC,OAExE,OAAC,OAAI,IAAKA,EAAc,aAAW,MAAG,uCAAwCF,CAAS,EACpF,SAAAC,EACH,CAEH,EACDX,EAAK,YAAc,OAEnB,MAAMC,EAAW,EAAAQ,QAAM,WACrB,CAAC,CAAE,UAAAC,EAAW,SAAAC,EAAU,KAAAE,EAAO,GAAI,MAAAC,EAAO,IAAAC,CAAI,EAAGH,OAE7C,OAAC,OACC,IAAKA,EACL,aAAW,MAAGN,EAAeO,CAAI,EAAGC,GAASP,EAAgBO,CAAK,EAAGC,GAAOP,EAAcO,CAAG,EAAGL,CAAS,EAExG,SAAAC,EACH,CAGN,EACAV,EAAS,YAAc",
|
|
6
|
+
"names": ["grid_exports", "__export", "Grid", "GridItem", "__toCommonJS", "import_jsx_runtime", "import_react", "import_utils", "colSpanClasses", "colStartClasses", "colEndClasses", "React", "className", "children", "forwardedRef", "span", "start", "end"]
|
|
7
7
|
}
|
|
@@ -13,6 +13,11 @@ interface HeadingProps extends React.ComponentPropsWithoutRef<'h1'>, VariantProp
|
|
|
13
13
|
color?: string;
|
|
14
14
|
html?: string | SerializedEditorState<SerializedLexicalNode>;
|
|
15
15
|
}
|
|
16
|
+
/**
|
|
17
|
+
* Heading - 标题
|
|
18
|
+
*
|
|
19
|
+
* @description 用于显示各级标题的组件,支持响应式尺寸、字重、对齐方式和自定义颜色
|
|
20
|
+
*/
|
|
16
21
|
declare const Heading: React.ForwardRefExoticComponent<HeadingProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
17
22
|
export { Heading };
|
|
18
23
|
export type { HeadingProps };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/heading.tsx"],
|
|
4
|
-
"sourcesContent": ["import { cn } from '../helpers/index.js'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport React from 'react'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { SerializedEditorState, SerializedLexicalNode } from 'lexical'\n\nconst headingVariants = cva('text-balance leading-tight tracking-[-0.04em]', {\n variants: {\n size: {\n none: 'tracking-[-0.04em]',\n 1: 'lg-desktop:text-[16px] text-[14px] leading-[120%]',\n 2: 'lg-desktop:text-[24px] text-[20px] leading-[120%]',\n 3: 'desktop:text-[32px] text-[24px] leading-[120%]',\n 4: 'desktop:text-[40px] lg-desktop:text-[48px] text-[32px] leading-[100%]',\n 5: 'desktop:text-[56px] lg-desktop:text-[64px] text-[40px] leading-[100%]',\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 colorVariant: {\n primary: 'text-info-primary',\n secondary: 'text-info-secondary',\n tertiary: 'text-info-tertiary',\n white: 'text-info-white',\n },\n },\n defaultVariants: {\n size: 'none',\n weight: 'bold',\n colorVariant: 'primary',\n },\n})\n\ntype HeadingElement = React.ElementRef<'h1'>\n\ninterface HeadingProps extends React.ComponentPropsWithoutRef<'h1'>, VariantProps<typeof headingVariants> {\n as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n asChild?: boolean\n color?: string\n html?: string | SerializedEditorState<SerializedLexicalNode>\n}\n\nconst Heading = React.forwardRef<HeadingElement, HeadingProps>((props, forwardedRef) => {\n const {\n children,\n className,\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 align,\n weight,\n colorVariant,\n asChild,\n as: Tag = 'h2',\n color,\n html,\n ...headingProps\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 return (\n <Slot\n {...headingProps}\n ref={forwardedRef}\n className={cn(\n headingVariants({\n size,\n weight,\n align,\n colorVariant,\n }),\n className\n )}\n {...htmlContentProps}\n {...styleProps}\n >\n {asChild ? children : <Tag>{htmlContentProps ? null : children}</Tag>}\n </Slot>\n )\n})\n\nHeading.displayName = 'Heading'\n\nexport { Heading }\nexport type { HeadingProps }\n"],
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
4
|
+
"sourcesContent": ["import { cn } from '../helpers/index.js'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport React from 'react'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { SerializedEditorState, SerializedLexicalNode } from 'lexical'\n\nconst headingVariants = cva('text-balance leading-tight tracking-[-0.04em]', {\n variants: {\n size: {\n none: 'tracking-[-0.04em]',\n 1: 'lg-desktop:text-[16px] text-[14px] leading-[120%]',\n 2: 'lg-desktop:text-[24px] text-[20px] leading-[120%]',\n 3: 'desktop:text-[32px] text-[24px] leading-[120%]',\n 4: 'desktop:text-[40px] lg-desktop:text-[48px] text-[32px] leading-[100%]',\n 5: 'desktop:text-[56px] lg-desktop:text-[64px] text-[40px] leading-[100%]',\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 colorVariant: {\n primary: 'text-info-primary',\n secondary: 'text-info-secondary',\n tertiary: 'text-info-tertiary',\n white: 'text-info-white',\n },\n },\n defaultVariants: {\n size: 'none',\n weight: 'bold',\n colorVariant: 'primary',\n },\n})\n\ntype HeadingElement = React.ElementRef<'h1'>\n\ninterface HeadingProps extends React.ComponentPropsWithoutRef<'h1'>, VariantProps<typeof headingVariants> {\n as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n asChild?: boolean\n color?: string\n html?: string | SerializedEditorState<SerializedLexicalNode>\n}\n\n/**\n * Heading - \u6807\u9898\n *\n * @description \u7528\u4E8E\u663E\u793A\u5404\u7EA7\u6807\u9898\u7684\u7EC4\u4EF6\uFF0C\u652F\u6301\u54CD\u5E94\u5F0F\u5C3A\u5BF8\u3001\u5B57\u91CD\u3001\u5BF9\u9F50\u65B9\u5F0F\u548C\u81EA\u5B9A\u4E49\u989C\u8272\n */\nconst Heading = React.forwardRef<HeadingElement, HeadingProps>((props, forwardedRef) => {\n const {\n children,\n className,\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 align,\n weight,\n colorVariant,\n asChild,\n as: Tag = 'h2',\n color,\n html,\n ...headingProps\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 return (\n <Slot\n {...headingProps}\n ref={forwardedRef}\n className={cn(\n headingVariants({\n size,\n weight,\n align,\n colorVariant,\n }),\n className\n )}\n {...htmlContentProps}\n {...styleProps}\n >\n {asChild ? children : <Tag>{htmlContentProps ? null : children}</Tag>}\n </Slot>\n )\n})\n\nHeading.displayName = 'Heading'\n\nexport { Heading }\nexport type { HeadingProps }\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAqG4B,IAAAI,EAAA,6BArG5BC,EAAmB,+BACnBC,EAAqB,gCACrBC,EAAuC,oCACvCC,EAAkB,oBAClBC,EAAqC,6CAGrC,MAAMC,KAAkB,OAAI,gDAAiD,CAC3E,SAAU,CACR,KAAM,CACJ,KAAM,qBACN,EAAG,oDACH,EAAG,oDACH,EAAG,iDACH,EAAG,wEACH,EAAG,uEACL,EACA,OAAQ,CACN,OAAQ,cACR,SAAU,gBACV,KAAM,YACN,UAAW,iBACX,MAAO,YACT,EACA,MAAO,CACL,KAAM,YACN,OAAQ,cACR,MAAO,YACT,EACA,aAAc,CACZ,QAAS,oBACT,UAAW,sBACX,SAAU,qBACV,MAAO,iBACT,CACF,EACA,gBAAiB,CACf,KAAM,OACN,OAAQ,OACR,aAAc,SAChB,CACF,CAAC,EAgBKR,EAAU,EAAAS,QAAM,WAAyC,CAACC,EAAOC,IAAiB,CACtF,KAAM,CACJ,SAAAC,EACA,UAAAC,EACA,KAAAC,EAAO,OACP,MAAAC,EACA,OAAAC,EACA,aAAAC,EACA,QAAAC,EACA,GAAIC,EAAM,KACV,MAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAIZ,EAEEa,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,KACJ,SACE,OAAC,QACE,GAAGE,EACJ,IAAKX,EACL,aAAW,MACTH,EAAgB,CACd,KAAAM,EACA,OAAAE,EACA,MAAAD,EACA,aAAAE,CACF,CAAC,EACDJ,CACF,EACC,GAAGU,EACH,GAAGC,EAEH,SAAAN,EAAUN,KAAW,OAACO,EAAA,CAAK,SAAAI,EAAmB,KAAOX,EAAS,EACjE,CAEJ,CAAC,EAEDZ,EAAQ,YAAc",
|
|
6
6
|
"names": ["heading_exports", "__export", "Heading", "__toCommonJS", "import_jsx_runtime", "import_helpers", "import_react_slot", "import_class_variance_authority", "import_react", "import_html", "headingVariants", "React", "props", "forwardedRef", "children", "className", "size", "align", "weight", "colorVariant", "asChild", "Tag", "color", "html", "headingProps", "htmlContentProps", "styleProps"]
|
|
7
7
|
}
|
|
@@ -7,7 +7,7 @@ export { Dialog, DialogPortal, DialogOverlay, DialogClose, DialogTrigger, Dialog
|
|
|
7
7
|
export { Popover, PopoverTrigger, PopoverContent } from './popover.js';
|
|
8
8
|
export { RadioGroup, RadioGroupItem, type RadioGroupProps, type RadioGroupItemProps } from './radio.js';
|
|
9
9
|
export { Text, type TextProps } from './text.js';
|
|
10
|
-
export { Grid, GridItem, type GridProps, type GridItemProps } from './
|
|
10
|
+
export { Grid, GridItem, type GridProps, type GridItemProps } from './grid.js';
|
|
11
11
|
export { Heading, type HeadingProps } from './heading.js';
|
|
12
12
|
export { Container, type ContainerProps } from './container.js';
|
|
13
13
|
export { Color, type ColorProps } from './color.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var F=Object.create;var f=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var E=Object.getPrototypeOf,O=Object.prototype.hasOwnProperty;var j=(t,p)=>{for(var d in p)f(t,d,{get:p[d],enumerable:!0})},P=(t,p,d,w)=>{if(p&&typeof p=="object"||typeof p=="function")for(let m of N(p))!O.call(t,m)&&m!==d&&f(t,m,{get:()=>p[m],enumerable:!(w=B(p,m))||w.enumerable});return t};var n=(t,p,d)=>(d=t!=null?F(E(t)):{},P(p||!t||!t.__esModule?f(d,"default",{value:t,enumerable:!0}):d,t)),q=t=>P(f({},"__esModule",{value:!0}),t);var z={};j(z,{Alert:()=>D.Alert,AlertDescription:()=>D.AlertDescription,AlertTitle:()=>D.AlertTitle,Avatar:()=>s.Avatar,AvatarFallback:()=>s.AvatarFallback,AvatarImage:()=>s.AvatarImage,Badge:()=>M.default,Board:()=>H.default,Button:()=>T.default,Card:()=>a.Card,CardContent:()=>a.CardContent,CardDescription:()=>a.CardDescription,CardFooter:()=>a.CardFooter,CardHeader:()=>a.CardHeader,CardTitle:()=>a.CardTitle,Carousel:()=>u.Carousel,CarouselContent:()=>u.CarouselContent,CarouselItem:()=>u.CarouselItem,CarouselNext:()=>u.CarouselNext,CarouselPrevious:()=>u.CarouselPrevious,Checkbox:()=>y.default,Color:()=>v.Color,Container:()=>G.Container,Dialog:()=>o.Dialog,DialogClose:()=>o.DialogClose,DialogContent:()=>o.DialogContent,DialogDescription:()=>o.DialogDescription,DialogFooter:()=>o.DialogFooter,DialogHeader:()=>o.DialogHeader,DialogOverlay:()=>o.DialogOverlay,DialogPortal:()=>o.DialogPortal,DialogTitle:()=>o.DialogTitle,DialogTrigger:()=>o.DialogTrigger,Drawer:()=>e.Drawer,DrawerClose:()=>e.DrawerClose,DrawerContent:()=>e.DrawerContent,DrawerDescription:()=>e.DrawerDescription,DrawerFooter:()=>e.DrawerFooter,DrawerHeader:()=>e.DrawerHeader,DrawerOverlay:()=>e.DrawerOverlay,DrawerPortal:()=>e.DrawerPortal,DrawerTitle:()=>e.DrawerTitle,DrawerTrigger:()=>e.DrawerTrigger,DropdownMenu:()=>r.DropdownMenu,DropdownMenuCheckboxItem:()=>r.DropdownMenuCheckboxItem,DropdownMenuContent:()=>r.DropdownMenuContent,DropdownMenuGroup:()=>r.DropdownMenuGroup,DropdownMenuItem:()=>r.DropdownMenuItem,DropdownMenuLabel:()=>r.DropdownMenuLabel,DropdownMenuPortal:()=>r.DropdownMenuPortal,DropdownMenuRadioGroup:()=>r.DropdownMenuRadioGroup,DropdownMenuRadioItem:()=>r.DropdownMenuRadioItem,DropdownMenuSeparator:()=>r.DropdownMenuSeparator,DropdownMenuShortcut:()=>r.DropdownMenuShortcut,DropdownMenuSub:()=>r.DropdownMenuSub,DropdownMenuSubContent:()=>r.DropdownMenuSubContent,DropdownMenuSubTrigger:()=>r.DropdownMenuSubTrigger,DropdownMenuTrigger:()=>r.DropdownMenuTrigger,ExposureDetector:()=>h.ExposureDetector,Grid:()=>g.Grid,GridItem:()=>g.GridItem,Heading:()=>c.Heading,Input:()=>x.Input,InputNumber:()=>S.default,InputSlot:()=>x.InputSlot,Link:()=>A.default,LoadingDots:()=>L.default,Picture:()=>k.default,Popover:()=>l.Popover,PopoverContent:()=>l.PopoverContent,PopoverTrigger:()=>l.PopoverTrigger,RadioGroup:()=>C.RadioGroup,RadioGroupItem:()=>C.RadioGroupItem,Skeleton:()=>b.default,Tabs:()=>i.Tabs,TabsContent:()=>i.TabsContent,TabsList:()=>i.TabsList,TabsTrigger:()=>i.TabsTrigger,Text:()=>I.Text,Theme:()=>R.default});module.exports=q(z);var T=n(require("./button.js")),M=n(require("./badge.js")),x=require("./input.js"),y=n(require("./checkbox.js")),b=n(require("./skeleton.js")),o=require("./dialog.js"),l=require("./popover.js"),C=require("./radio.js"),I=require("./text.js"),g=require("./
|
|
1
|
+
"use strict";var F=Object.create;var f=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var E=Object.getPrototypeOf,O=Object.prototype.hasOwnProperty;var j=(t,p)=>{for(var d in p)f(t,d,{get:p[d],enumerable:!0})},P=(t,p,d,w)=>{if(p&&typeof p=="object"||typeof p=="function")for(let m of N(p))!O.call(t,m)&&m!==d&&f(t,m,{get:()=>p[m],enumerable:!(w=B(p,m))||w.enumerable});return t};var n=(t,p,d)=>(d=t!=null?F(E(t)):{},P(p||!t||!t.__esModule?f(d,"default",{value:t,enumerable:!0}):d,t)),q=t=>P(f({},"__esModule",{value:!0}),t);var z={};j(z,{Alert:()=>D.Alert,AlertDescription:()=>D.AlertDescription,AlertTitle:()=>D.AlertTitle,Avatar:()=>s.Avatar,AvatarFallback:()=>s.AvatarFallback,AvatarImage:()=>s.AvatarImage,Badge:()=>M.default,Board:()=>H.default,Button:()=>T.default,Card:()=>a.Card,CardContent:()=>a.CardContent,CardDescription:()=>a.CardDescription,CardFooter:()=>a.CardFooter,CardHeader:()=>a.CardHeader,CardTitle:()=>a.CardTitle,Carousel:()=>u.Carousel,CarouselContent:()=>u.CarouselContent,CarouselItem:()=>u.CarouselItem,CarouselNext:()=>u.CarouselNext,CarouselPrevious:()=>u.CarouselPrevious,Checkbox:()=>y.default,Color:()=>v.Color,Container:()=>G.Container,Dialog:()=>o.Dialog,DialogClose:()=>o.DialogClose,DialogContent:()=>o.DialogContent,DialogDescription:()=>o.DialogDescription,DialogFooter:()=>o.DialogFooter,DialogHeader:()=>o.DialogHeader,DialogOverlay:()=>o.DialogOverlay,DialogPortal:()=>o.DialogPortal,DialogTitle:()=>o.DialogTitle,DialogTrigger:()=>o.DialogTrigger,Drawer:()=>e.Drawer,DrawerClose:()=>e.DrawerClose,DrawerContent:()=>e.DrawerContent,DrawerDescription:()=>e.DrawerDescription,DrawerFooter:()=>e.DrawerFooter,DrawerHeader:()=>e.DrawerHeader,DrawerOverlay:()=>e.DrawerOverlay,DrawerPortal:()=>e.DrawerPortal,DrawerTitle:()=>e.DrawerTitle,DrawerTrigger:()=>e.DrawerTrigger,DropdownMenu:()=>r.DropdownMenu,DropdownMenuCheckboxItem:()=>r.DropdownMenuCheckboxItem,DropdownMenuContent:()=>r.DropdownMenuContent,DropdownMenuGroup:()=>r.DropdownMenuGroup,DropdownMenuItem:()=>r.DropdownMenuItem,DropdownMenuLabel:()=>r.DropdownMenuLabel,DropdownMenuPortal:()=>r.DropdownMenuPortal,DropdownMenuRadioGroup:()=>r.DropdownMenuRadioGroup,DropdownMenuRadioItem:()=>r.DropdownMenuRadioItem,DropdownMenuSeparator:()=>r.DropdownMenuSeparator,DropdownMenuShortcut:()=>r.DropdownMenuShortcut,DropdownMenuSub:()=>r.DropdownMenuSub,DropdownMenuSubContent:()=>r.DropdownMenuSubContent,DropdownMenuSubTrigger:()=>r.DropdownMenuSubTrigger,DropdownMenuTrigger:()=>r.DropdownMenuTrigger,ExposureDetector:()=>h.ExposureDetector,Grid:()=>g.Grid,GridItem:()=>g.GridItem,Heading:()=>c.Heading,Input:()=>x.Input,InputNumber:()=>S.default,InputSlot:()=>x.InputSlot,Link:()=>A.default,LoadingDots:()=>L.default,Picture:()=>k.default,Popover:()=>l.Popover,PopoverContent:()=>l.PopoverContent,PopoverTrigger:()=>l.PopoverTrigger,RadioGroup:()=>C.RadioGroup,RadioGroupItem:()=>C.RadioGroupItem,Skeleton:()=>b.default,Tabs:()=>i.Tabs,TabsContent:()=>i.TabsContent,TabsList:()=>i.TabsList,TabsTrigger:()=>i.TabsTrigger,Text:()=>I.Text,Theme:()=>R.default});module.exports=q(z);var T=n(require("./button.js")),M=n(require("./badge.js")),x=require("./input.js"),y=n(require("./checkbox.js")),b=n(require("./skeleton.js")),o=require("./dialog.js"),l=require("./popover.js"),C=require("./radio.js"),I=require("./text.js"),g=require("./grid.js"),c=require("./heading.js"),G=require("./container.js"),v=require("./color.js"),e=require("./drawer.js"),A=n(require("./link.js")),s=require("./avatar.js"),S=n(require("./input-number.js")),r=require("./drop-down.js"),a=require("./card.js"),u=require("./carousel.js"),i=require("./tabs.js"),D=require("./alert.js"),k=n(require("./picture.js")),R=n(require("./theme.js")),H=n(require("./board.js")),L=n(require("./loadingDots.js")),h=require("./ExposureDetector.js");
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/index.ts"],
|
|
4
|
-
"sourcesContent": ["export { default as Button } from './button.js'\nexport { default as Badge } from './badge.js'\nexport { Input, InputSlot } from './input.js'\n\nexport { default as Checkbox } from './checkbox.js'\n\nexport { default as Skeleton } from './skeleton.js'\nexport {\n Dialog,\n DialogPortal,\n DialogOverlay,\n DialogClose,\n DialogTrigger,\n DialogContent,\n DialogHeader,\n DialogFooter,\n DialogTitle,\n DialogDescription,\n} from './dialog.js'\nexport { Popover, PopoverTrigger, PopoverContent } from './popover.js'\nexport { RadioGroup, RadioGroupItem, type RadioGroupProps, type RadioGroupItemProps } from './radio.js'\nexport { Text, type TextProps } from './text.js'\nexport { Grid, GridItem, type GridProps, type GridItemProps } from './
|
|
4
|
+
"sourcesContent": ["export { default as Button } from './button.js'\nexport { default as Badge } from './badge.js'\nexport { Input, InputSlot } from './input.js'\n\nexport { default as Checkbox } from './checkbox.js'\n\nexport { default as Skeleton } from './skeleton.js'\nexport {\n Dialog,\n DialogPortal,\n DialogOverlay,\n DialogClose,\n DialogTrigger,\n DialogContent,\n DialogHeader,\n DialogFooter,\n DialogTitle,\n DialogDescription,\n} from './dialog.js'\nexport { Popover, PopoverTrigger, PopoverContent } from './popover.js'\nexport { RadioGroup, RadioGroupItem, type RadioGroupProps, type RadioGroupItemProps } from './radio.js'\nexport { Text, type TextProps } from './text.js'\nexport { Grid, GridItem, type GridProps, type GridItemProps } from './grid.js'\nexport { Heading, type HeadingProps } from './heading.js'\nexport { Container, type ContainerProps } from './container.js'\nexport { Color, type ColorProps } from './color.js'\nexport {\n Drawer,\n DrawerPortal,\n DrawerOverlay,\n DrawerTrigger,\n DrawerClose,\n DrawerContent,\n DrawerHeader,\n DrawerFooter,\n DrawerTitle,\n DrawerDescription,\n} from './drawer.js'\nexport { default as Link, type LinkProps } from './link.js'\nexport { Avatar, AvatarImage, AvatarFallback } from './avatar.js'\nexport { default as InputNumber, type InputNumberProps } from './input-number.js'\nexport {\n DropdownMenu,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuItem,\n DropdownMenuCheckboxItem,\n DropdownMenuRadioItem,\n DropdownMenuLabel,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuGroup,\n DropdownMenuPortal,\n DropdownMenuSub,\n DropdownMenuSubContent,\n DropdownMenuSubTrigger,\n DropdownMenuRadioGroup,\n} from './drop-down.js'\nexport { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent } from './card.js'\nexport {\n type CarouselApi,\n Carousel,\n CarouselContent,\n CarouselItem,\n CarouselPrevious,\n CarouselNext,\n} from './carousel.js'\nexport { Tabs, TabsList, TabsTrigger, TabsContent } from './tabs.js'\nexport { Alert, AlertTitle, AlertDescription } from './alert.js'\nexport { default as Picture } from './picture.js'\nexport { default as Theme } from './theme.js'\nexport { default as Board } from './board.js'\nexport { default as LoadingDots } from './loadingDots.js'\nexport { ExposureDetector, type ExposureDetectorProps } from './ExposureDetector.js'\n"],
|
|
5
5
|
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,w+EAAAE,EAAAF,GAAA,IAAAG,EAAkC,0BAClCC,EAAiC,yBACjCC,EAAiC,sBAEjCC,EAAoC,4BAEpCC,EAAoC,4BACpCC,EAWO,uBACPC,EAAwD,wBACxDC,EAA2F,sBAC3FC,EAAqC,qBACrCC,EAAmE,qBACnEC,EAA2C,wBAC3CC,EAA+C,0BAC/CC,EAAuC,sBACvCC,EAWO,uBACPC,EAAgD,wBAChDC,EAAoD,uBACpDC,EAA8D,gCAC9DC,EAgBO,0BACPC,EAAsF,qBACtFC,EAOO,yBACPC,EAAyD,qBACzDC,EAAoD,sBACpDC,EAAmC,2BACnCC,EAAiC,yBACjCC,EAAiC,yBACjCC,EAAuC,+BACvCC,EAA6D",
|
|
6
|
-
"names": ["components_exports", "__export", "__toCommonJS", "import_button", "import_badge", "import_input", "import_checkbox", "import_skeleton", "import_dialog", "import_popover", "import_radio", "import_text", "
|
|
6
|
+
"names": ["components_exports", "__export", "__toCommonJS", "import_button", "import_badge", "import_input", "import_checkbox", "import_skeleton", "import_dialog", "import_popover", "import_radio", "import_text", "import_grid", "import_heading", "import_container", "import_color", "import_drawer", "import_link", "import_avatar", "import_input_number", "import_drop_down", "import_card", "import_carousel", "import_tabs", "import_alert", "import_picture", "import_theme", "import_board", "import_loadingDots", "import_ExposureDetector"]
|
|
7
7
|
}
|
|
@@ -39,6 +39,11 @@ type InputNumberProps = {
|
|
|
39
39
|
/** 按下回车键时触发*/
|
|
40
40
|
onEnter?: (value: number, e: KeyboardEvent) => void;
|
|
41
41
|
} & VariantProps<typeof InputNumberVariants> & ComponentPropsWithout<'div', RemovedProps>;
|
|
42
|
+
/**
|
|
43
|
+
* InputNumber - 数字输入框
|
|
44
|
+
*
|
|
45
|
+
* @description 专用于数字输入的组件,支持步进调节、最值限制、状态提示和键盘操作
|
|
46
|
+
*/
|
|
42
47
|
declare const InputNumber: React.ForwardRefExoticComponent<{
|
|
43
48
|
/** 定义子组件作为父组件的类型,详细使用方式请参考radix-ui */
|
|
44
49
|
asChild?: boolean | undefined;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/input-number.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport { cn } from '../helpers/index.js'\nimport { Slot } from '@radix-ui/react-slot'\nimport { PlusIcon, MinusIcon } from '@radix-ui/react-icons'\nimport React, { useState, useEffect, forwardRef } from 'react'\nimport type { ChangeEvent, KeyboardEvent, FocusEvent } from 'react'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\n\n// \u5B9A\u4E49 InputNumber \u7684\u6837\u5F0F\u53D8\u4F53\nconst InputNumberVariants = cva('size-full border bg-transparent text-center text-base outline-none', {\n variants: {\n status: {\n default: 'border-lines-1 group-hover:border-lines-2',\n success: 'border-lines-3 group-hover:border-lines-3',\n warning: 'border-lines-4 group-hover:border-lines-4',\n error: 'border-lines-5 group-hover:border-lines-5',\n },\n disabled: {\n true: 'border-lines-1 group-hover:border-lines-1 text-info-quaternary cursor-not-allowed',\n },\n },\n})\n\ntype ColorType = 'default' | 'success' | 'warning' | 'error' | null\n\n// \u5B9A\u4E49\u7EC4\u4EF6\u7C7B\u578B\uFF0C\u7EE7\u627F div \u6807\u7B7E\u6807\u51C6\u5C5E\u6027\ntype InputNumberElement = React.ElementRef<'div'>\n\ntype InputNumberProps = {\n /** \u5B9A\u4E49\u5B50\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B,\u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui */\n asChild?: boolean\n /** \u7C7B\u540D*/\n className?: string\n /** \u8F93\u5165\u6846\u4E0B\u65B9\u63D0\u793A\u6587\u672C\uFF0C\u4F1A\u6839\u636E\u4E0D\u540C\u7684 status \u5448\u73B0\u4E0D\u540C\u7684\u6837\u5F0F*/\n tips?: string\n /** \u6587\u672C\u6846\u72B6\u6001*/\n status?: ColorType\n /** \u6570\u5B57\u8F93\u5165\u6846\u7684\u503C */\n value?: number\n /** \u6570\u5B57\u8F93\u5165\u6846\u7684\u521D\u59CB\u503C */\n defaultValue?: number\n /** \u6570\u503C\u6539\u53D8\u6B65\u6570 */\n step?: number\n /** \u6700\u5C0F\u503C */\n min?: number\n /** \u6700\u5927\u503C */\n max?: number\n /** \u662F\u5426\u7981\u7528*/\n disabled?: boolean\n /** \u662F\u5426\u53EA\u8BFB*/\n readonly?: boolean\n /** \u6837\u5F0F*/\n style?: React.CSSProperties\n /** \u503C\u53D8\u5316\u65F6\u89E6\u53D1*/\n onChange?: (value: number) => void\n /** \u5931\u53BB\u7126\u70B9\u65F6\u89E6\u53D1*/\n onBlur?: (value: number, e: FocusEvent) => void\n /** \u6309\u4E0B\u56DE\u8F66\u952E\u65F6\u89E6\u53D1*/\n onEnter?: (value: number, e: KeyboardEvent) => void\n} & VariantProps<typeof InputNumberVariants> &\n ComponentPropsWithout<'div', RemovedProps>\n\nconst InputNumber = forwardRef<InputNumberElement, InputNumberProps>(\n (\n {\n value,\n defaultValue = 0,\n step = 1,\n min = 0,\n max,\n tips,\n style,\n children,\n asChild = false,\n disabled = false,\n readonly = false,\n status = 'default',\n className,\n onChange,\n onBlur,\n onEnter,\n },\n ref\n ) => {\n const [inputValue, setInputValue] = useState<number | string>(defaultValue)\n\n const Comp = asChild ? Slot : 'div'\n\n const baseClassName = cn('border-lines-1 flex size-12 items-center justify-center border text-base', {\n 'group-hover:border-lines-2': !disabled,\n 'text-info-quaternary cursor-not-allowed': disabled,\n })\n\n const textColor = (type: ColorType, flag: boolean) => {\n if (flag) return 'text-lines-1'\n return {\n default: 'text-lines-1',\n success: 'text-lines-3',\n warning: 'text-lines-4',\n error: 'text-lines-5',\n }[type || 'default']\n }\n\n const isValue = (params: string) => {\n return params === '' || /^[0-9]+$/.test(params)\n }\n\n const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n if (disabled || readonly) return\n const value = e.target.value\n // \u5141\u8BB8\u7A7A\u5B57\u7B26\u4E32\uFF0C\u6216\u4EC5\u5305\u542B\u6574\u6570\u7684\u5B57\u7B26\u4E32\n if (isValue(value)) {\n setInputValue(value)\n if (value !== '') {\n let newValue = Number(value)\n if (max !== undefined && newValue > max) {\n newValue = max\n }\n if (min !== undefined && newValue < min) {\n newValue = min\n }\n onChange?.(newValue)\n }\n }\n }\n\n const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n if (disabled || readonly) return\n if (inputValue === '' || isNaN(Number(inputValue))) {\n const newValue = min !== undefined ? min : 0\n setInputValue(newValue)\n onBlur?.(newValue, e)\n } else {\n const newValue = Number(inputValue)\n setInputValue(newValue)\n onBlur?.(newValue, e)\n }\n }\n\n const increment = () => {\n if (disabled || readonly) return\n let newValue = Number(inputValue) + (step ? Math.ceil(Number(step)) : 1)\n if (max !== undefined && newValue > max) {\n newValue = max\n }\n setInputValue(newValue)\n onChange?.(newValue)\n }\n\n const decrement = () => {\n if (disabled || readonly) return\n let newValue = Number(inputValue) - (step ? Math.ceil(Number(step)) : 1)\n if (min !== undefined && newValue < min) {\n newValue = min\n }\n setInputValue(newValue)\n onChange?.(newValue)\n }\n\n const handleKeyDown = (e: any) => {\n if (disabled || readonly) return\n if (e.key === 'Enter') {\n const initalValue = e.target?.value\n onEnter?.(initalValue, e)\n }\n }\n\n useEffect(() => {\n setInputValue(value || 0)\n }, [value])\n\n return (\n <Comp\n ref={ref}\n {...(style ? { style: style } : null)}\n className={cn({ 'group flex items-center': !asChild }, className)}\n >\n {asChild ? (\n children\n ) : (\n <>\n <button onClick={increment} className={baseClassName}>\n <PlusIcon />\n </button>\n <div className=\"relative mx-1.5 h-[52px] w-[105px]\">\n <input\n type=\"text\"\n value={inputValue}\n disabled={disabled}\n readOnly={readonly}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n onChange={handleInputChange}\n className={cn(InputNumberVariants({ status, disabled }))}\n />\n {tips ? (\n <span className={cn(textColor(status, disabled), 'absolute -bottom-4 left-0 w-full truncate text-xs')}>\n {tips}\n </span>\n ) : null}\n </div>\n <button onClick={decrement} className={baseClassName}>\n <MinusIcon />\n </button>\n </>\n )}\n </Comp>\n )\n }\n)\n\nInputNumber.displayName = 'InputNumber'\n\nexport default InputNumber\nexport type { InputNumberProps }\n"],
|
|
5
|
-
"mappings": "sbAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
4
|
+
"sourcesContent": ["'use client'\nimport { cn } from '../helpers/index.js'\nimport { Slot } from '@radix-ui/react-slot'\nimport { PlusIcon, MinusIcon } from '@radix-ui/react-icons'\nimport React, { useState, useEffect, forwardRef } from 'react'\nimport type { ChangeEvent, KeyboardEvent, FocusEvent } from 'react'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\n\n// \u5B9A\u4E49 InputNumber \u7684\u6837\u5F0F\u53D8\u4F53\nconst InputNumberVariants = cva('size-full border bg-transparent text-center text-base outline-none', {\n variants: {\n status: {\n default: 'border-lines-1 group-hover:border-lines-2',\n success: 'border-lines-3 group-hover:border-lines-3',\n warning: 'border-lines-4 group-hover:border-lines-4',\n error: 'border-lines-5 group-hover:border-lines-5',\n },\n disabled: {\n true: 'border-lines-1 group-hover:border-lines-1 text-info-quaternary cursor-not-allowed',\n },\n },\n})\n\ntype ColorType = 'default' | 'success' | 'warning' | 'error' | null\n\n// \u5B9A\u4E49\u7EC4\u4EF6\u7C7B\u578B\uFF0C\u7EE7\u627F div \u6807\u7B7E\u6807\u51C6\u5C5E\u6027\ntype InputNumberElement = React.ElementRef<'div'>\n\ntype InputNumberProps = {\n /** \u5B9A\u4E49\u5B50\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B,\u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui */\n asChild?: boolean\n /** \u7C7B\u540D*/\n className?: string\n /** \u8F93\u5165\u6846\u4E0B\u65B9\u63D0\u793A\u6587\u672C\uFF0C\u4F1A\u6839\u636E\u4E0D\u540C\u7684 status \u5448\u73B0\u4E0D\u540C\u7684\u6837\u5F0F*/\n tips?: string\n /** \u6587\u672C\u6846\u72B6\u6001*/\n status?: ColorType\n /** \u6570\u5B57\u8F93\u5165\u6846\u7684\u503C */\n value?: number\n /** \u6570\u5B57\u8F93\u5165\u6846\u7684\u521D\u59CB\u503C */\n defaultValue?: number\n /** \u6570\u503C\u6539\u53D8\u6B65\u6570 */\n step?: number\n /** \u6700\u5C0F\u503C */\n min?: number\n /** \u6700\u5927\u503C */\n max?: number\n /** \u662F\u5426\u7981\u7528*/\n disabled?: boolean\n /** \u662F\u5426\u53EA\u8BFB*/\n readonly?: boolean\n /** \u6837\u5F0F*/\n style?: React.CSSProperties\n /** \u503C\u53D8\u5316\u65F6\u89E6\u53D1*/\n onChange?: (value: number) => void\n /** \u5931\u53BB\u7126\u70B9\u65F6\u89E6\u53D1*/\n onBlur?: (value: number, e: FocusEvent) => void\n /** \u6309\u4E0B\u56DE\u8F66\u952E\u65F6\u89E6\u53D1*/\n onEnter?: (value: number, e: KeyboardEvent) => void\n} & VariantProps<typeof InputNumberVariants> &\n ComponentPropsWithout<'div', RemovedProps>\n\n/**\n * InputNumber - \u6570\u5B57\u8F93\u5165\u6846\n *\n * @description \u4E13\u7528\u4E8E\u6570\u5B57\u8F93\u5165\u7684\u7EC4\u4EF6\uFF0C\u652F\u6301\u6B65\u8FDB\u8C03\u8282\u3001\u6700\u503C\u9650\u5236\u3001\u72B6\u6001\u63D0\u793A\u548C\u952E\u76D8\u64CD\u4F5C\n */\nconst InputNumber = forwardRef<InputNumberElement, InputNumberProps>(\n (\n {\n value,\n defaultValue = 0,\n step = 1,\n min = 0,\n max,\n tips,\n style,\n children,\n asChild = false,\n disabled = false,\n readonly = false,\n status = 'default',\n className,\n onChange,\n onBlur,\n onEnter,\n },\n ref\n ) => {\n const [inputValue, setInputValue] = useState<number | string>(defaultValue)\n\n const Comp = asChild ? Slot : 'div'\n\n const baseClassName = cn('border-lines-1 flex size-12 items-center justify-center border text-base', {\n 'group-hover:border-lines-2': !disabled,\n 'text-info-quaternary cursor-not-allowed': disabled,\n })\n\n const textColor = (type: ColorType, flag: boolean) => {\n if (flag) return 'text-lines-1'\n return {\n default: 'text-lines-1',\n success: 'text-lines-3',\n warning: 'text-lines-4',\n error: 'text-lines-5',\n }[type || 'default']\n }\n\n const isValue = (params: string) => {\n return params === '' || /^[0-9]+$/.test(params)\n }\n\n const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n if (disabled || readonly) return\n const value = e.target.value\n // \u5141\u8BB8\u7A7A\u5B57\u7B26\u4E32\uFF0C\u6216\u4EC5\u5305\u542B\u6574\u6570\u7684\u5B57\u7B26\u4E32\n if (isValue(value)) {\n setInputValue(value)\n if (value !== '') {\n let newValue = Number(value)\n if (max !== undefined && newValue > max) {\n newValue = max\n }\n if (min !== undefined && newValue < min) {\n newValue = min\n }\n onChange?.(newValue)\n }\n }\n }\n\n const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n if (disabled || readonly) return\n if (inputValue === '' || isNaN(Number(inputValue))) {\n const newValue = min !== undefined ? min : 0\n setInputValue(newValue)\n onBlur?.(newValue, e)\n } else {\n const newValue = Number(inputValue)\n setInputValue(newValue)\n onBlur?.(newValue, e)\n }\n }\n\n const increment = () => {\n if (disabled || readonly) return\n let newValue = Number(inputValue) + (step ? Math.ceil(Number(step)) : 1)\n if (max !== undefined && newValue > max) {\n newValue = max\n }\n setInputValue(newValue)\n onChange?.(newValue)\n }\n\n const decrement = () => {\n if (disabled || readonly) return\n let newValue = Number(inputValue) - (step ? Math.ceil(Number(step)) : 1)\n if (min !== undefined && newValue < min) {\n newValue = min\n }\n setInputValue(newValue)\n onChange?.(newValue)\n }\n\n const handleKeyDown = (e: any) => {\n if (disabled || readonly) return\n if (e.key === 'Enter') {\n const initalValue = e.target?.value\n onEnter?.(initalValue, e)\n }\n }\n\n useEffect(() => {\n setInputValue(value || 0)\n }, [value])\n\n return (\n <Comp\n ref={ref}\n {...(style ? { style: style } : null)}\n className={cn({ 'group flex items-center': !asChild }, className)}\n >\n {asChild ? (\n children\n ) : (\n <>\n <button onClick={increment} className={baseClassName}>\n <PlusIcon />\n </button>\n <div className=\"relative mx-1.5 h-[52px] w-[105px]\">\n <input\n type=\"text\"\n value={inputValue}\n disabled={disabled}\n readOnly={readonly}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n onChange={handleInputChange}\n className={cn(InputNumberVariants({ status, disabled }))}\n />\n {tips ? (\n <span className={cn(textColor(status, disabled), 'absolute -bottom-4 left-0 w-full truncate text-xs')}>\n {tips}\n </span>\n ) : null}\n </div>\n <button onClick={decrement} className={baseClassName}>\n <MinusIcon />\n </button>\n </>\n )}\n </Comp>\n )\n }\n)\n\nInputNumber.displayName = 'InputNumber'\n\nexport default InputNumber\nexport type { InputNumberProps }\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["input_number_exports", "__export", "input_number_default", "__toCommonJS", "import_jsx_runtime", "import_helpers", "import_react_slot", "import_react_icons", "import_react", "import_class_variance_authority", "InputNumberVariants", "InputNumber", "value", "defaultValue", "step", "min", "max", "tips", "style", "children", "asChild", "disabled", "readonly", "status", "className", "onChange", "onBlur", "onEnter", "ref", "inputValue", "setInputValue", "Comp", "baseClassName", "textColor", "type", "flag", "isValue", "params", "handleInputChange", "newValue", "handleBlur", "increment", "decrement", "handleKeyDown", "initalValue"]
|
|
7
7
|
}
|
|
@@ -18,5 +18,10 @@ interface InputSlotProps extends ComponentPropsWithout<'div', RemovedProps> {
|
|
|
18
18
|
* 用来在 Input 组件中插入额外的内容,比如icon ,按钮
|
|
19
19
|
*/
|
|
20
20
|
declare const InputSlot: React.ForwardRefExoticComponent<InputSlotProps & React.RefAttributes<HTMLDivElement>>;
|
|
21
|
+
/**
|
|
22
|
+
* Input - 输入框
|
|
23
|
+
*
|
|
24
|
+
* @description 文本输入组件,支持各种输入类型、不同尺寸和插槽功能
|
|
25
|
+
*/
|
|
21
26
|
declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
|
|
22
27
|
export { Input, InputSlot };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/input.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../helpers/index.js'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nconst inputVariants = cva(\n 'border-input text-info-primary bg-background flex w-full flex-row items-center overflow-hidden rounded-md border focus-visible:outline-none',\n {\n variants: {\n size: {\n sm: 'h-8 text-sm',\n base: 'h-10',\n lg: 'h-12 text-lg',\n },\n },\n defaultVariants: {\n size: 'base',\n },\n }\n)\n\nexport interface InputProps extends ComponentPropsWithout<'input', 'size'>, VariantProps<typeof inputVariants> {}\n\ntype InputSlotElement = React.ElementRef<'div'>\ninterface InputSlotProps extends ComponentPropsWithout<'div', RemovedProps> {\n /**\n * \u63D2\u69FD\u7684\u4F4D\u7F6E\n * default: right\n */\n side?: 'left' | 'right'\n}\n\n/**\n * InputSlot\n * \u7528\u6765\u5728 Input \u7EC4\u4EF6\u4E2D\u63D2\u5165\u989D\u5916\u7684\u5185\u5BB9\uFF0C\u6BD4\u5982icon \uFF0C\u6309\u94AE\n */\nconst InputSlot = React.forwardRef<InputSlotElement, InputSlotProps>((props, forwardedRef) => {\n const { className, side = 'right', children, ...slotProps } = props\n\n return (\n <div\n ref={forwardedRef}\n {...slotProps}\n className={cn('flex h-full items-center', className, {\n '-order-1': side === 'left',\n 'order-2': side === 'right',\n })}\n >\n {children}\n </div>\n )\n})\n\nconst Input = React.forwardRef<React.ElementRef<'input'>, InputProps>(\n ({ className, type, size, children, ...props }, ref) => {\n if (!React.isValidElement(children)) {\n return <input type={type} className={cn(inputVariants({ size }), 'px-3', className)} ref={ref} {...props} />\n }\n return (\n <div className={cn(inputVariants({ size }), className)}>\n <input\n type={type}\n className={cn(\n 'placeholder:text-muted-foreground flex size-full px-3 file:border-0 file:bg-transparent file:font-medium focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50'\n )}\n ref={ref}\n {...props}\n />\n {children}\n </div>\n )\n }\n)\nInput.displayName = 'Input'\nInputSlot.displayName = 'InputSlot'\n\nexport { Input, InputSlot }\n"],
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,WAAAE,EAAA,cAAAC,IAAA,eAAAC,EAAAJ,GA0CI,IAAAK,EAAA,6BAxCJC,EAAuB,oBACvBC,EAAmB,+BAEnBC,EAAuC,oCAEvC,MAAMC,KAAgB,OACpB,8IACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,cACJ,KAAM,OACN,GAAI,cACN,CACF,EACA,gBAAiB,CACf,KAAM,MACR,CACF,CACF,EAiBMN,EAAYG,EAAM,WAA6C,CAACI,EAAOC,IAAiB,CAC5F,KAAM,CAAE,UAAAC,EAAW,KAAAC,EAAO,QAAS,SAAAC,EAAU,GAAGC,CAAU,EAAIL,EAE9D,SACE,OAAC,OACC,IAAKC,EACJ,GAAGI,EACJ,aAAW,MAAG,2BAA4BH,EAAW,CACnD,WAAYC,IAAS,OACrB,UAAWA,IAAS,OACtB,CAAC,EAEA,SAAAC,EACH,CAEJ,CAAC,
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../helpers/index.js'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nconst inputVariants = cva(\n 'border-input text-info-primary bg-background flex w-full flex-row items-center overflow-hidden rounded-md border focus-visible:outline-none',\n {\n variants: {\n size: {\n sm: 'h-8 text-sm',\n base: 'h-10',\n lg: 'h-12 text-lg',\n },\n },\n defaultVariants: {\n size: 'base',\n },\n }\n)\n\nexport interface InputProps extends ComponentPropsWithout<'input', 'size'>, VariantProps<typeof inputVariants> {}\n\ntype InputSlotElement = React.ElementRef<'div'>\ninterface InputSlotProps extends ComponentPropsWithout<'div', RemovedProps> {\n /**\n * \u63D2\u69FD\u7684\u4F4D\u7F6E\n * default: right\n */\n side?: 'left' | 'right'\n}\n\n/**\n * InputSlot\n * \u7528\u6765\u5728 Input \u7EC4\u4EF6\u4E2D\u63D2\u5165\u989D\u5916\u7684\u5185\u5BB9\uFF0C\u6BD4\u5982icon \uFF0C\u6309\u94AE\n */\nconst InputSlot = React.forwardRef<InputSlotElement, InputSlotProps>((props, forwardedRef) => {\n const { className, side = 'right', children, ...slotProps } = props\n\n return (\n <div\n ref={forwardedRef}\n {...slotProps}\n className={cn('flex h-full items-center', className, {\n '-order-1': side === 'left',\n 'order-2': side === 'right',\n })}\n >\n {children}\n </div>\n )\n})\n\n/**\n * Input - \u8F93\u5165\u6846\n *\n * @description \u6587\u672C\u8F93\u5165\u7EC4\u4EF6\uFF0C\u652F\u6301\u5404\u79CD\u8F93\u5165\u7C7B\u578B\u3001\u4E0D\u540C\u5C3A\u5BF8\u548C\u63D2\u69FD\u529F\u80FD\n */\nconst Input = React.forwardRef<React.ElementRef<'input'>, InputProps>(\n ({ className, type, size, children, ...props }, ref) => {\n if (!React.isValidElement(children)) {\n return <input type={type} className={cn(inputVariants({ size }), 'px-3', className)} ref={ref} {...props} />\n }\n return (\n <div className={cn(inputVariants({ size }), className)}>\n <input\n type={type}\n className={cn(\n 'placeholder:text-muted-foreground flex size-full px-3 file:border-0 file:bg-transparent file:font-medium focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50'\n )}\n ref={ref}\n {...props}\n />\n {children}\n </div>\n )\n }\n)\nInput.displayName = 'Input'\nInputSlot.displayName = 'InputSlot'\n\nexport { Input, InputSlot }\n"],
|
|
5
|
+
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,WAAAE,EAAA,cAAAC,IAAA,eAAAC,EAAAJ,GA0CI,IAAAK,EAAA,6BAxCJC,EAAuB,oBACvBC,EAAmB,+BAEnBC,EAAuC,oCAEvC,MAAMC,KAAgB,OACpB,8IACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,cACJ,KAAM,OACN,GAAI,cACN,CACF,EACA,gBAAiB,CACf,KAAM,MACR,CACF,CACF,EAiBMN,EAAYG,EAAM,WAA6C,CAACI,EAAOC,IAAiB,CAC5F,KAAM,CAAE,UAAAC,EAAW,KAAAC,EAAO,QAAS,SAAAC,EAAU,GAAGC,CAAU,EAAIL,EAE9D,SACE,OAAC,OACC,IAAKC,EACJ,GAAGI,EACJ,aAAW,MAAG,2BAA4BH,EAAW,CACnD,WAAYC,IAAS,OACrB,UAAWA,IAAS,OACtB,CAAC,EAEA,SAAAC,EACH,CAEJ,CAAC,EAOKZ,EAAQI,EAAM,WAClB,CAAC,CAAE,UAAAM,EAAW,KAAAI,EAAM,KAAAC,EAAM,SAAAH,EAAU,GAAGJ,CAAM,EAAGQ,IACzCZ,EAAM,eAAeQ,CAAQ,KAIhC,QAAC,OAAI,aAAW,MAAGL,EAAc,CAAE,KAAAQ,CAAK,CAAC,EAAGL,CAAS,EACnD,oBAAC,SACC,KAAMI,EACN,aAAW,MACT,qLACF,EACA,IAAKE,EACJ,GAAGR,EACN,EACCI,GACH,KAbO,OAAC,SAAM,KAAME,EAAM,aAAW,MAAGP,EAAc,CAAE,KAAAQ,CAAK,CAAC,EAAG,OAAQL,CAAS,EAAG,IAAKM,EAAM,GAAGR,EAAO,CAgBhH,EACAR,EAAM,YAAc,QACpBC,EAAU,YAAc",
|
|
6
6
|
"names": ["input_exports", "__export", "Input", "InputSlot", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "import_class_variance_authority", "inputVariants", "props", "forwardedRef", "className", "side", "children", "slotProps", "type", "size", "ref"]
|
|
7
7
|
}
|
|
@@ -4,7 +4,7 @@ import { type VariantProps } from 'class-variance-authority';
|
|
|
4
4
|
import type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';
|
|
5
5
|
declare const linkVariants: (props?: ({
|
|
6
6
|
size?: "base" | "lg" | null | undefined;
|
|
7
|
-
variant?: "primary" | "
|
|
7
|
+
variant?: "primary" | "secondary" | null | undefined;
|
|
8
8
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
9
|
type LinkProps = {
|
|
10
10
|
/** 定义子组件作为父组件的类型,详细使用方式请参考radix-ui */
|
|
@@ -22,6 +22,11 @@ type LinkProps = {
|
|
|
22
22
|
/** 点击事件,禁用状态无法触发*/
|
|
23
23
|
onClick?: Function;
|
|
24
24
|
} & VariantProps<typeof linkVariants> & ComponentPropsWithout<'a', RemovedProps>;
|
|
25
|
+
/**
|
|
26
|
+
* Link - 链接
|
|
27
|
+
*
|
|
28
|
+
* @description 可点击的链接组件,支持不同尺寸、样式变体、禁用状态和后置图标
|
|
29
|
+
*/
|
|
25
30
|
declare const Link: React.ForwardRefExoticComponent<{
|
|
26
31
|
/** 定义子组件作为父组件的类型,详细使用方式请参考radix-ui */
|
|
27
32
|
asChild?: boolean | undefined;
|
|
@@ -39,7 +44,7 @@ declare const Link: React.ForwardRefExoticComponent<{
|
|
|
39
44
|
onClick?: Function | undefined;
|
|
40
45
|
} & VariantProps<(props?: ({
|
|
41
46
|
size?: "base" | "lg" | null | undefined;
|
|
42
|
-
variant?: "primary" | "
|
|
47
|
+
variant?: "primary" | "secondary" | null | undefined;
|
|
43
48
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string> & ComponentPropsWithout<"a", RemovedProps> & React.RefAttributes<HTMLAnchorElement>>;
|
|
44
49
|
export default Link;
|
|
45
50
|
export type { LinkProps };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var P=Object.create;var p=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var E=(e,t)=>{for(var o in t)p(e,o,{get:t[o],enumerable:!0})},f=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of L(t))!g.call(e,r)&&r!==o&&p(e,r,{get:()=>t[r],enumerable:!(i=R(t,r))||i.enumerable});return e};var b=(e,t,o)=>(o=e!=null?P(N(e)):{},f(t||!e||!e.__esModule?p(o,"default",{value:e,enumerable:!0}):o,e)),V=e=>f(p({},"__esModule",{value:!0}),e);var w={};E(w,{default:()=>q});module.exports=V(w);var n=require("react/jsx-runtime"),k=b(require("react")),u=require("@radix-ui/react-slot"),d=require("../helpers/index.js"),h=require("class-variance-authority");const S=(0,h.cva)("tracking hover:text-brand-0 font-bold underline transition-colors",{variants:{size:{base:"text-text-2",lg:"text-text-3"},variant:{
|
|
1
|
+
"use strict";"use client";var P=Object.create;var p=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var N=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var E=(e,t)=>{for(var o in t)p(e,o,{get:t[o],enumerable:!0})},f=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of L(t))!g.call(e,r)&&r!==o&&p(e,r,{get:()=>t[r],enumerable:!(i=R(t,r))||i.enumerable});return e};var b=(e,t,o)=>(o=e!=null?P(N(e)):{},f(t||!e||!e.__esModule?p(o,"default",{value:e,enumerable:!0}):o,e)),V=e=>f(p({},"__esModule",{value:!0}),e);var w={};E(w,{default:()=>q});module.exports=V(w);var n=require("react/jsx-runtime"),k=b(require("react")),u=require("@radix-ui/react-slot"),d=require("../helpers/index.js"),h=require("class-variance-authority");const S=(0,h.cva)("tracking hover:text-brand-0 font-bold underline transition-colors",{variants:{size:{base:"text-text-2",lg:"text-text-3"},variant:{secondary:"text-info-secondary hover:text-info-primary",primary:"text-info-primary hover:text-brand-0"}}}),y=k.default.forwardRef(({children:e,size:t="base",variant:o="primary",className:i,asChild:r=!1,href:l,style:m,disabled:a=!1,suffixIcon:s,onClick:x,...v},C)=>(0,n.jsx)(r?u.Slot:"a",{ref:C,onClick:c=>{if(!a&&x?.(c),a||!l){c.preventDefault();return}},href:a?void 0:l,className:(0,d.cn)(S({size:t,variant:o}),i,{"flex items-center":s,"cursor-pointer":!a,"text-info-quaternary cursor-not-allowed hover:text-info-quaternary":a}),...m?{style:m}:null,...v,children:(0,n.jsxs)(n.Fragment,{children:[e,s&&(0,n.jsx)("span",{className:"svg",children:s})]})}));y.displayName="Link";var q=y;
|
|
2
2
|
//# sourceMappingURL=link.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/link.tsx"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React from 'react'\nimport type { ReactNode } from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cn } from '../helpers/index.js'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\n\n// \u5B9A\u4E49 link \u7684\u6837\u5F0F\u53D8\u4F53\nconst linkVariants = cva('tracking hover:text-brand-0 font-bold underline transition-colors', {\n variants: {\n size: {\n base: 'text-text-2', // \u4E2D\n lg: 'text-text-3', // \u5927\n },\n variant: {\n secondary: 'text-info-secondary hover:text-info-primary',\n primary: 'text-info-primary hover:text-brand-0',\n },\n },\n})\n// \u5B9A\u4E49\u7EC4\u4EF6\u7C7B\u578B\uFF0C\u7EE7\u627F a \u6807\u7B7E\u6807\u51C6\u5C5E\u6027\ntype LinkElement = React.ElementRef<'a'>\ntype LinkProps = {\n /** \u5B9A\u4E49\u5B50\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B,\u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui */\n asChild?: boolean\n /** \u7C7B\u540D*/\n className?: string\n /** \u7981\u7528\u94FE\u63A5 */\n disabled?: boolean\n /** \u540E\u7F6E\u56FE\u6807*/\n suffixIcon?: ReactNode\n /** \u8DF3\u8F6C\u94FE\u63A5*/\n href?: string\n /** \u6837\u5F0F*/\n style?: React.CSSProperties\n /** \u70B9\u51FB\u4E8B\u4EF6\uFF0C\u7981\u7528\u72B6\u6001\u65E0\u6CD5\u89E6\u53D1*/\n onClick?: Function\n} & VariantProps<typeof linkVariants> &\n ComponentPropsWithout<'a', RemovedProps>\n\n/**\n * Link - \u94FE\u63A5\n *\n * @description \u53EF\u70B9\u51FB\u7684\u94FE\u63A5\u7EC4\u4EF6\uFF0C\u652F\u6301\u4E0D\u540C\u5C3A\u5BF8\u3001\u6837\u5F0F\u53D8\u4F53\u3001\u7981\u7528\u72B6\u6001\u548C\u540E\u7F6E\u56FE\u6807\n */\nconst Link = React.forwardRef<LinkElement, LinkProps>(\n (\n {\n children,\n size = 'base',\n variant = 'primary',\n className,\n asChild = false,\n href,\n style,\n disabled = false,\n suffixIcon,\n onClick,\n ...props // \u8FD9\u91CC\u4F1A\u5305\u542B href\u3001target\u3001rel \u7B49\u6807\u51C6 anchor \u5C5E\u6027\n }: LinkProps,\n forwardedRef\n ) => {\n const Comp = asChild ? Slot : 'a'\n\n const handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n !disabled && onClick?.(event)\n if (disabled || !href) {\n event.preventDefault()\n return\n }\n }\n\n return (\n <Comp\n ref={forwardedRef}\n onClick={handleClick}\n href={disabled ? undefined : href}\n className={cn(linkVariants({ size, variant }), className, {\n 'flex items-center': suffixIcon,\n 'cursor-pointer': !disabled,\n 'text-info-quaternary cursor-not-allowed hover:text-info-quaternary': disabled,\n })}\n {...(style ? { style: style } : null)}\n {...props}\n >\n <>\n {children}\n {suffixIcon && <span className=\"svg\">{suffixIcon}</span>}\n </>\n </Comp>\n )\n }\n)\nLink.displayName = 'Link'\n\nexport default Link\nexport type { LinkProps }\n"],
|
|
5
|
+
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAsFQ,IAAAI,EAAA,6BArFRC,EAAkB,oBAElBC,EAAqB,gCACrBC,EAAmB,+BACnBC,EAAuC,oCAIvC,MAAMC,KAAe,OAAI,qEAAsE,CAC7F,SAAU,CACR,KAAM,CACJ,KAAM,cACN,GAAI,aACN,EACA,QAAS,CACP,UAAW,8CACX,QAAS,sCACX,CACF,CACF,CAAC,EA0BKC,EAAO,EAAAC,QAAM,WACjB,CACE,CACE,SAAAC,EACA,KAAAC,EAAO,OACP,QAAAC,EAAU,UACV,UAAAC,EACA,QAAAC,EAAU,GACV,KAAAC,EACA,MAAAC,EACA,SAAAC,EAAW,GACX,WAAAC,EACA,QAAAC,EACA,GAAGC,CACL,EACAC,OAaE,OAXWP,EAAU,OAAO,IAW3B,CACC,IAAKO,EACL,QAXiBC,GAA+C,CAElE,GADA,CAACL,GAAYE,IAAUG,CAAK,EACxBL,GAAY,CAACF,EAAM,CACrBO,EAAM,eAAe,EACrB,MACF,CACF,EAMI,KAAML,EAAW,OAAYF,EAC7B,aAAW,MAAGR,EAAa,CAAE,KAAAI,EAAM,QAAAC,CAAQ,CAAC,EAAGC,EAAW,CACxD,oBAAqBK,EACrB,iBAAkB,CAACD,EACnB,qEAAsEA,CACxE,CAAC,EACA,GAAID,EAAQ,CAAE,MAAOA,CAAM,EAAI,KAC/B,GAAGI,EAEJ,gCACG,UAAAV,EACAQ,MAAc,OAAC,QAAK,UAAU,MAAO,SAAAA,EAAW,GACnD,EACF,CAGN,EACAV,EAAK,YAAc,OAEnB,IAAOR,EAAQQ",
|
|
6
6
|
"names": ["link_exports", "__export", "link_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_react_slot", "import_helpers", "import_class_variance_authority", "linkVariants", "Link", "React", "children", "size", "variant", "className", "asChild", "href", "style", "disabled", "suffixIcon", "onClick", "props", "forwardedRef", "event"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/loadingDots.tsx"],
|
|
4
|
-
"sourcesContent": ["import { cn } from '../helpers/utils.js'\nimport type { FC } from 'react'\n\ninterface LoadingProps {\n className?: string\n}\n\nconst LoadingDots: FC<LoadingProps> = props => {\n const { className } = props\n return (\n <>\n <style>{`span.root {\n min-height: 19px;\n align-items: center;\n text-align: center;\n line-height: 7;\n display: inline-flex !important;\n}\n\nspan.root .dot {\n height: 8px;\n width: 8px;\n border-radius: 100%;\n background-color: currentColor;\n animation-name: blink;\n animation-duration: 1.6s;\n animation-iteration-count: infinite;\n animation-fill-mode: both;\n margin: 0 2px;\n}\n\n.root .dot:nth-of-type(2) {\n animation-delay: 0.2s;\n}\n\n.root .dot::nth-of-type(3) {\n animation-delay: 0.4s;\n}\n\n@keyframes blink {\n 0% {\n opacity: 0.2;\n }\n 20% {\n opacity: 1;\n }\n 100% {\n opacity: 0.2;\n }\n}\n\n `}</style>\n <span className={cn('root', className)}>\n <span className=\"dot\" key={`dot_1`} />\n <span className=\"dot\" key={`dot_2`} />\n <span className=\"dot\" key={`dot_3`} />\n </span>\n </>\n )\n}\n\nexport default LoadingDots\n"],
|
|
5
|
-
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
4
|
+
"sourcesContent": ["import { cn } from '../helpers/utils.js'\nimport type { FC } from 'react'\n\ninterface LoadingProps {\n className?: string\n}\n\n/**\n * LoadingDots - \u52A0\u8F7D\u52A8\u753B\u70B9\n *\n * @description \u4E09\u4E2A\u70B9\u7684\u52A0\u8F7D\u52A8\u753B\u7EC4\u4EF6\uFF0C\u63D0\u4F9B\u4F18\u96C5\u7684\u7B49\u5F85\u72B6\u6001\u89C6\u89C9\u53CD\u9988\n */\nconst LoadingDots: FC<LoadingProps> = props => {\n const { className } = props\n return (\n <>\n <style>{`span.root {\n min-height: 19px;\n align-items: center;\n text-align: center;\n line-height: 7;\n display: inline-flex !important;\n}\n\nspan.root .dot {\n height: 8px;\n width: 8px;\n border-radius: 100%;\n background-color: currentColor;\n animation-name: blink;\n animation-duration: 1.6s;\n animation-iteration-count: infinite;\n animation-fill-mode: both;\n margin: 0 2px;\n}\n\n.root .dot:nth-of-type(2) {\n animation-delay: 0.2s;\n}\n\n.root .dot::nth-of-type(3) {\n animation-delay: 0.4s;\n}\n\n@keyframes blink {\n 0% {\n opacity: 0.2;\n }\n 20% {\n opacity: 1;\n }\n 100% {\n opacity: 0.2;\n }\n}\n\n `}</style>\n <span className={cn('root', className)}>\n <span className=\"dot\" key={`dot_1`} />\n <span className=\"dot\" key={`dot_2`} />\n <span className=\"dot\" key={`dot_3`} />\n </span>\n </>\n )\n}\n\nexport default LoadingDots\n"],
|
|
5
|
+
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAeI,IAAAI,EAAA,6BAfJC,EAAmB,+BAYnB,MAAMC,EAAgCC,GAAS,CAC7C,KAAM,CAAE,UAAAC,CAAU,EAAID,EACtB,SACE,oBACE,oBAAC,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAwCR,KACA,QAAC,QAAK,aAAW,MAAG,OAAQC,CAAS,EACnC,oBAAC,QAAK,UAAU,OAAW,OAAS,KACpC,OAAC,QAAK,UAAU,OAAW,OAAS,KACpC,OAAC,QAAK,UAAU,OAAW,OAAS,GACtC,GACF,CAEJ,EAEA,IAAON,EAAQI",
|
|
6
6
|
"names": ["loadingDots_exports", "__export", "loadingDots_default", "__toCommonJS", "import_jsx_runtime", "import_utils", "LoadingDots", "props", "className"]
|
|
7
7
|
}
|
|
@@ -10,5 +10,10 @@ export interface PictureProps extends React.ImgHTMLAttributes<HTMLImageElement>
|
|
|
10
10
|
deviceSizes?: number[];
|
|
11
11
|
alt?: string;
|
|
12
12
|
}
|
|
13
|
+
/**
|
|
14
|
+
* Picture - 图片
|
|
15
|
+
*
|
|
16
|
+
* @description 响应式图片组件,支持多种分辨率、质量控制和自动alt文本解析功能
|
|
17
|
+
*/
|
|
13
18
|
declare const Picture: React.ForwardRefExoticComponent<PictureProps & React.RefAttributes<HTMLPictureElement>>;
|
|
14
19
|
export default Picture;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/picture.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React, { useCallback, useMemo } from 'react'\n\nconst APPEND_FILE_SUFFIX_MATCH_DOMAIN = ['cdn.shopify.com', 'cdn.shopifycdn.net', 'www.facebook.com']\n\nconst MAX_SIZE = 3960\nconst FIXED_MAX_SIZE = 3980\n\nexport interface PictureProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n /** picture \u5185\u90E8img \u6807\u7B7E\u7684\u7C7B\u540D */\n imgClassName?: string\n /** \u56FE\u7247url , \u652F\u6301\u4F20\u5165\u4E0D\u540C\u5206\u8FA8\u7387\u4E0B\u7684\u56FE\u7247\uFF0C\u6BD4\u5982\uFF0C\u683C\u5F0F \"url1 1920\uFF0C url2 1080, url3 767\" */\n source?: string\n /** \u56FE\u7247\u8D28\u91CF */\n quality?: number\n /** \u54CD\u5E94\u5F0F\u56FE\u7247\uFF0C\u5BF9\u5E94picture \u4E0Bsource \u7684max-width */\n deviceSizes?: number[]\n alt?: string\n}\nconst images = {\n domains: ['cdn.shopify.com', 'cdn.shopifycdn.net', 'www.facebook.com'],\n deviceSizes: [375, 390, 768, 1024, 1280, 1440, 1540, 1920],\n}\n\nconst isMatchDomain = (srcDomain: string) => {\n return APPEND_FILE_SUFFIX_MATCH_DOMAIN.some(domain => srcDomain == domain)\n}\nconst idMatchFileExtensions = (fileName: string = '') => /\\.(png|apng|jpg|jpeg|gif|svg|webp|tif)/.test(fileName)\n\n/**\n * \u4ECE URL \u4E2D\u89E3\u6790 alt \u53C2\u6570\n * @param url \u56FE\u7247 URL\n * @returns \u89E3\u6790\u51FA\u7684 alt \u503C\uFF0C\u5982\u679C\u6CA1\u6709\u5219\u8FD4\u56DE\u7A7A\u5B57\u7B26\u4E32\n */\nconst parseAltFromUrl = (url: string): string => {\n try {\n return new URL(url).searchParams.get('alt') || ''\n } catch {\n return ''\n }\n}\n\n/**\n * \u79FB\u9664 URL \u4E2D\u7684 alt \u53C2\u6570\n * @param url \u56FE\u7247 URL\n * @returns \u79FB\u9664 alt \u53C2\u6570\u540E\u7684 URL\n */\nconst removeAltFromUrl = (url: string): string => {\n try {\n const urlObj = new URL(url)\n urlObj.searchParams.delete('alt')\n return urlObj.toString()\n } catch {\n return url\n }\n}\n\nconst Picture = React.forwardRef<HTMLPictureElement, PictureProps>(\n (\n {\n imgClassName = '',\n source = '',\n quality = 2,\n deviceSizes = [375, 390, 767, 1023, 1024, 1279, 1440, 1439, 1539, 1919, 1920],\n className,\n loading = 'lazy',\n alt = '',\n ...rest\n }: PictureProps,\n ref\n ) => {\n const isShopifycdn = (src: string | string[]) => {\n const domains = images?.domains || []\n return domains.some(domain => src.includes(domain))\n }\n\n const imgSrcSetsize = useCallback(({ src, width }: { src: string; width: number }) => {\n const size = width\n const cleanSrc = removeAltFromUrl(src)\n try {\n const parsedUrl = new URL(cleanSrc)\n if (!isMatchDomain(parsedUrl.hostname)) {\n return cleanSrc\n }\n const fileName = parsedUrl.pathname.split('/').pop() || ''\n if (idMatchFileExtensions(fileName)) {\n return cleanSrc\n ?.split('/')\n ?.map(item => {\n if (\n isShopifycdn(cleanSrc) &&\n /\\.(png|apng|jpg|jpeg|gif|svg|webp|tif)(\\?.*)?/.test(item) &&\n /_[0-9]{2,4}x/.test(cleanSrc) === false\n ) {\n const name = item.split('.')\n return name\n .map((v, i) => {\n if (i === name.length - 2) {\n return `${v}_${size < 3960 ? size : 3980}x`\n }\n return v\n })\n .join('.')\n }\n return item\n })\n .join('/')\n }\n } catch (error) {\n return cleanSrc\n }\n }, [])\n\n const sourceSrcSet = useCallback(\n ({ srcArr, width }: { srcArr: string[][]; width: number }) => {\n const computedWidth = width * quality\n const defaultSrc = imgSrcSetsize({ src: srcArr[0][0], width: computedWidth })\n\n const matchingSrc = srcArr\n .filter(([, breakpoint]) => breakpoint && parseInt(breakpoint, 10) >= width)\n .map(([src]) => imgSrcSetsize({ src, width: computedWidth }))\n .pop()\n\n return <source key={width} srcSet={matchingSrc || defaultSrc} media={`(max-width: ${width}px)`} />\n },\n [imgSrcSetsize, quality]\n )\n\n const sourceList = useMemo(() => {\n if (typeof source !== 'string' || !source) return []\n\n const srcArr = source\n .replace(/[\\r\\n]/g, '')\n .replace(/\\s\\s+/g, ' ')\n .split(',')\n .map(item => item.split(' ').filter(Boolean))\n\n // \u4ECE URL \u4E2D\u89E3\u6790 alt \u53C2\u6570\uFF0C\u4F18\u5148\u4F7F\u7528\u7B2C\u4E00\u4E2A\u6709 alt \u53C2\u6570\u7684 URL\n const parsedAlt =\n alt ||\n srcArr\n .map(item => item[0])\n .filter(Boolean)\n .map(parseAltFromUrl)\n .find(Boolean) ||\n ''\n\n const sources = deviceSizes.map(width => sourceSrcSet({ srcArr, width }))\n const defaultImg = imgSrcSetsize({ src: srcArr[0][0], width: 1920 * quality })\n\n return [\n ...sources,\n <img\n key=\"default\"\n src={defaultImg}\n className={`w-full ${imgClassName}`}\n loading={loading}\n alt={parsedAlt}\n {...rest}\n />,\n ]\n }, [deviceSizes, imgClassName, imgSrcSetsize, quality, source, sourceSrcSet, alt, loading])\n\n return (\n <picture ref={ref} className={`block overflow-hidden ${className}`}>\n {sourceList}\n {rest.children}\n </picture>\n )\n }\n)\nexport default Picture\n"],
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useCallback, useMemo } from 'react'\n\nconst APPEND_FILE_SUFFIX_MATCH_DOMAIN = ['cdn.shopify.com', 'cdn.shopifycdn.net', 'www.facebook.com']\n\nconst MAX_SIZE = 3960\nconst FIXED_MAX_SIZE = 3980\n\nexport interface PictureProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n /** picture \u5185\u90E8img \u6807\u7B7E\u7684\u7C7B\u540D */\n imgClassName?: string\n /** \u56FE\u7247url , \u652F\u6301\u4F20\u5165\u4E0D\u540C\u5206\u8FA8\u7387\u4E0B\u7684\u56FE\u7247\uFF0C\u6BD4\u5982\uFF0C\u683C\u5F0F \"url1 1920\uFF0C url2 1080, url3 767\" */\n source?: string\n /** \u56FE\u7247\u8D28\u91CF */\n quality?: number\n /** \u54CD\u5E94\u5F0F\u56FE\u7247\uFF0C\u5BF9\u5E94picture \u4E0Bsource \u7684max-width */\n deviceSizes?: number[]\n alt?: string\n}\nconst images = {\n domains: ['cdn.shopify.com', 'cdn.shopifycdn.net', 'www.facebook.com'],\n deviceSizes: [375, 390, 768, 1024, 1280, 1440, 1540, 1920],\n}\n\nconst isMatchDomain = (srcDomain: string) => {\n return APPEND_FILE_SUFFIX_MATCH_DOMAIN.some(domain => srcDomain == domain)\n}\nconst idMatchFileExtensions = (fileName: string = '') => /\\.(png|apng|jpg|jpeg|gif|svg|webp|tif)/.test(fileName)\n\n/**\n * \u4ECE URL \u4E2D\u89E3\u6790 alt \u53C2\u6570\n * @param url \u56FE\u7247 URL\n * @returns \u89E3\u6790\u51FA\u7684 alt \u503C\uFF0C\u5982\u679C\u6CA1\u6709\u5219\u8FD4\u56DE\u7A7A\u5B57\u7B26\u4E32\n */\nconst parseAltFromUrl = (url: string): string => {\n try {\n return new URL(url).searchParams.get('alt') || ''\n } catch {\n return ''\n }\n}\n\n/**\n * \u79FB\u9664 URL \u4E2D\u7684 alt \u53C2\u6570\n * @param url \u56FE\u7247 URL\n * @returns \u79FB\u9664 alt \u53C2\u6570\u540E\u7684 URL\n */\nconst removeAltFromUrl = (url: string): string => {\n try {\n const urlObj = new URL(url)\n urlObj.searchParams.delete('alt')\n return urlObj.toString()\n } catch {\n return url\n }\n}\n\n/**\n * Picture - \u56FE\u7247\n *\n * @description \u54CD\u5E94\u5F0F\u56FE\u7247\u7EC4\u4EF6\uFF0C\u652F\u6301\u591A\u79CD\u5206\u8FA8\u7387\u3001\u8D28\u91CF\u63A7\u5236\u548C\u81EA\u52A8alt\u6587\u672C\u89E3\u6790\u529F\u80FD\n */\nconst Picture = React.forwardRef<HTMLPictureElement, PictureProps>(\n (\n {\n imgClassName = '',\n source = '',\n quality = 2,\n deviceSizes = [375, 390, 767, 1023, 1024, 1279, 1440, 1439, 1539, 1919, 1920],\n className,\n loading = 'lazy',\n alt = '',\n ...rest\n }: PictureProps,\n ref\n ) => {\n const isShopifycdn = (src: string | string[]) => {\n const domains = images?.domains || []\n return domains.some(domain => src.includes(domain))\n }\n\n const imgSrcSetsize = useCallback(({ src, width }: { src: string; width: number }) => {\n const size = width\n const cleanSrc = removeAltFromUrl(src)\n try {\n const parsedUrl = new URL(cleanSrc)\n if (!isMatchDomain(parsedUrl.hostname)) {\n return cleanSrc\n }\n const fileName = parsedUrl.pathname.split('/').pop() || ''\n if (idMatchFileExtensions(fileName)) {\n return cleanSrc\n ?.split('/')\n ?.map(item => {\n if (\n isShopifycdn(cleanSrc) &&\n /\\.(png|apng|jpg|jpeg|gif|svg|webp|tif)(\\?.*)?/.test(item) &&\n /_[0-9]{2,4}x/.test(cleanSrc) === false\n ) {\n const name = item.split('.')\n return name\n .map((v, i) => {\n if (i === name.length - 2) {\n return `${v}_${size < 3960 ? size : 3980}x`\n }\n return v\n })\n .join('.')\n }\n return item\n })\n .join('/')\n }\n } catch (error) {\n return cleanSrc\n }\n }, [])\n\n const sourceSrcSet = useCallback(\n ({ srcArr, width }: { srcArr: string[][]; width: number }) => {\n const computedWidth = width * quality\n const defaultSrc = imgSrcSetsize({ src: srcArr[0][0], width: computedWidth })\n\n const matchingSrc = srcArr\n .filter(([, breakpoint]) => breakpoint && parseInt(breakpoint, 10) >= width)\n .map(([src]) => imgSrcSetsize({ src, width: computedWidth }))\n .pop()\n\n return <source key={width} srcSet={matchingSrc || defaultSrc} media={`(max-width: ${width}px)`} />\n },\n [imgSrcSetsize, quality]\n )\n\n const sourceList = useMemo(() => {\n if (typeof source !== 'string' || !source) return []\n\n const srcArr = source\n .replace(/[\\r\\n]/g, '')\n .replace(/\\s\\s+/g, ' ')\n .split(',')\n .map(item => item.split(' ').filter(Boolean))\n\n // \u4ECE URL \u4E2D\u89E3\u6790 alt \u53C2\u6570\uFF0C\u4F18\u5148\u4F7F\u7528\u7B2C\u4E00\u4E2A\u6709 alt \u53C2\u6570\u7684 URL\n const parsedAlt =\n alt ||\n srcArr\n .map(item => item[0])\n .filter(Boolean)\n .map(parseAltFromUrl)\n .find(Boolean) ||\n ''\n\n const sources = deviceSizes.map(width => sourceSrcSet({ srcArr, width }))\n const defaultImg = imgSrcSetsize({ src: srcArr[0][0], width: 1920 * quality })\n\n return [\n ...sources,\n <img\n key=\"default\"\n src={defaultImg}\n className={`w-full ${imgClassName}`}\n loading={loading}\n alt={parsedAlt}\n {...rest}\n />,\n ]\n }, [deviceSizes, imgClassName, imgSrcSetsize, quality, source, sourceSrcSet, alt, loading])\n\n return (\n <picture ref={ref} className={`block overflow-hidden ${className}`}>\n {sourceList}\n {rest.children}\n </picture>\n )\n }\n)\nexport default Picture\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["picture_exports", "__export", "picture_default", "__toCommonJS", "import_jsx_runtime", "import_react", "APPEND_FILE_SUFFIX_MATCH_DOMAIN", "MAX_SIZE", "FIXED_MAX_SIZE", "images", "isMatchDomain", "srcDomain", "domain", "idMatchFileExtensions", "fileName", "parseAltFromUrl", "url", "removeAltFromUrl", "urlObj", "Picture", "React", "imgClassName", "source", "quality", "deviceSizes", "className", "loading", "alt", "rest", "ref", "isShopifycdn", "src", "imgSrcSetsize", "width", "size", "cleanSrc", "parsedUrl", "item", "name", "v", "i", "sourceSrcSet", "srcArr", "computedWidth", "defaultSrc", "matchingSrc", "breakpoint", "sourceList", "parsedAlt", "sources", "defaultImg"]
|
|
7
7
|
}
|
|
@@ -8,6 +8,11 @@ interface RadioGroupProps extends React.ComponentPropsWithoutRef<typeof RadioGro
|
|
|
8
8
|
/** 尺寸 */
|
|
9
9
|
size?: 'sm' | 'base' | 'lg';
|
|
10
10
|
}
|
|
11
|
+
/**
|
|
12
|
+
* RadioGroup - 单选组
|
|
13
|
+
*
|
|
14
|
+
* @description 用于单项选择的单选按钮组组件,支持不同尺寸和键盘导航
|
|
15
|
+
*/
|
|
11
16
|
declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLDivElement>>;
|
|
12
17
|
interface RadioGroupItemProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>, VariantProps<typeof radioGroupVariants> {
|
|
13
18
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/radio.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group'\nimport { Text } from './text.js'\nimport { CheckIcon } from '@radix-ui/react-icons'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../helpers/index.js'\n\nconst RadioContext = React.createContext<{ size?: 'sm' | 'base' | 'lg' }>({\n size: 'base',\n})\n\nconst radioGroupVariants = cva(\n 'border-primary text-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground aspect-square rounded-full border focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',\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 RadioGroupProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root> {\n /** \u5C3A\u5BF8 */\n size?: 'sm' | 'base' | 'lg'\n}\n\nconst RadioGroup = React.forwardRef<React.ElementRef<typeof RadioGroupPrimitive.Root>, RadioGroupProps>(\n ({ className, children, size, ...props }, ref) => {\n return (\n <RadioGroupPrimitive.Root className={cn('text-info-primary grid gap-2', className)} {...props} ref={ref}>\n <RadioContext.Provider value={{ size }}>{children}</RadioContext.Provider>\n </RadioGroupPrimitive.Root>\n )\n }\n)\nRadioGroup.displayName = 'RadioGroup'\n\ninterface RadioGroupItemProps\n extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,EAAA,mBAAAC,IAAA,eAAAC,EAAAJ,
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group'\nimport { Text } from './text.js'\nimport { CheckIcon } from '@radix-ui/react-icons'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../helpers/index.js'\n\nconst RadioContext = React.createContext<{ size?: 'sm' | 'base' | 'lg' }>({\n size: 'base',\n})\n\nconst radioGroupVariants = cva(\n 'border-primary text-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground aspect-square rounded-full border focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',\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 RadioGroupProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root> {\n /** \u5C3A\u5BF8 */\n size?: 'sm' | 'base' | 'lg'\n}\n\n/**\n * RadioGroup - \u5355\u9009\u7EC4\n *\n * @description \u7528\u4E8E\u5355\u9879\u9009\u62E9\u7684\u5355\u9009\u6309\u94AE\u7EC4\u7EC4\u4EF6\uFF0C\u652F\u6301\u4E0D\u540C\u5C3A\u5BF8\u548C\u952E\u76D8\u5BFC\u822A\n */\nconst RadioGroup = React.forwardRef<React.ElementRef<typeof RadioGroupPrimitive.Root>, RadioGroupProps>(\n ({ className, children, size, ...props }, ref) => {\n return (\n <RadioGroupPrimitive.Root className={cn('text-info-primary grid gap-2', className)} {...props} ref={ref}>\n <RadioContext.Provider value={{ size }}>{children}</RadioContext.Provider>\n </RadioGroupPrimitive.Root>\n )\n }\n)\nRadioGroup.displayName = 'RadioGroup'\n\ninterface RadioGroupItemProps\n extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>, VariantProps<typeof radioGroupVariants> {}\n\nconst RadioGroupItem = React.forwardRef<React.ElementRef<typeof RadioGroupPrimitive.Item>, RadioGroupItemProps>(\n ({ className, size, children, ...props }, ref) => {\n const { size: sizeFromParent } = React.useContext(RadioContext)\n\n const ItemRadio = (\n <RadioGroupPrimitive.Item\n ref={ref}\n className={cn(\n radioGroupVariants({\n size: size ?? sizeFromParent,\n }),\n className\n )}\n {...props}\n >\n <RadioGroupPrimitive.Indicator className=\"flex size-full items-center justify-center text-current\">\n <CheckIcon />\n </RadioGroupPrimitive.Indicator>\n </RadioGroupPrimitive.Item>\n )\n\n if (children) {\n return (\n <Text as=\"label\" className={cn('flex items-center gap-1', className)}>\n {ItemRadio}\n {children}\n </Text>\n )\n }\n return ItemRadio\n }\n)\nRadioGroupItem.displayName = 'RadioGroupItem'\n\nexport { RadioGroup, RadioGroupItem }\nexport type { RadioGroupProps, RadioGroupItemProps }\n"],
|
|
5
|
+
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,EAAA,mBAAAC,IAAA,eAAAC,EAAAJ,GA2CQ,IAAAK,EAAA,6BAzCRC,EAAuB,oBACvBC,EAAqC,0CACrCC,EAAqB,qBACrBC,EAA0B,iCAC1BC,EAAuC,oCACvCC,EAAmB,+BAEnB,MAAMC,EAAeN,EAAM,cAA+C,CACxE,KAAM,MACR,CAAC,EAEKO,KAAqB,OACzB,gTACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,cACJ,KAAM,SACN,GAAI,QACN,CACF,EACA,gBAAiB,CACf,KAAM,MACR,CACF,CACF,EAYMX,EAAaI,EAAM,WACvB,CAAC,CAAE,UAAAQ,EAAW,SAAAC,EAAU,KAAAC,EAAM,GAAGC,CAAM,EAAGC,OAEtC,OAACX,EAAoB,KAApB,CAAyB,aAAW,MAAG,+BAAgCO,CAAS,EAAI,GAAGG,EAAO,IAAKC,EAClG,mBAACN,EAAa,SAAb,CAAsB,MAAO,CAAE,KAAAI,CAAK,EAAI,SAAAD,EAAS,EACpD,CAGN,EACAb,EAAW,YAAc,aAKzB,MAAMC,EAAiBG,EAAM,WAC3B,CAAC,CAAE,UAAAQ,EAAW,KAAAE,EAAM,SAAAD,EAAU,GAAGE,CAAM,EAAGC,IAAQ,CAChD,KAAM,CAAE,KAAMC,CAAe,EAAIb,EAAM,WAAWM,CAAY,EAExDQ,KACJ,OAACb,EAAoB,KAApB,CACC,IAAKW,EACL,aAAW,MACTL,EAAmB,CACjB,KAAMG,GAAQG,CAChB,CAAC,EACDL,CACF,EACC,GAAGG,EAEJ,mBAACV,EAAoB,UAApB,CAA8B,UAAU,0DACvC,mBAAC,cAAU,EACb,EACF,EAGF,OAAIQ,KAEA,QAAC,QAAK,GAAG,QAAQ,aAAW,MAAG,0BAA2BD,CAAS,EAChE,UAAAM,EACAL,GACH,EAGGK,CACT,CACF,EACAjB,EAAe,YAAc",
|
|
6
6
|
"names": ["radio_exports", "__export", "RadioGroup", "RadioGroupItem", "__toCommonJS", "import_jsx_runtime", "React", "RadioGroupPrimitive", "import_text", "import_react_icons", "import_class_variance_authority", "import_helpers", "RadioContext", "radioGroupVariants", "className", "children", "size", "props", "ref", "sizeFromParent", "ItemRadio"]
|
|
7
7
|
}
|
|
@@ -4,6 +4,11 @@ interface SkeletonProps extends ComponentPropsWithout<'span', RemovedProps> {
|
|
|
4
4
|
/** 是否正在加载 , 默认是true*/
|
|
5
5
|
loading?: boolean;
|
|
6
6
|
}
|
|
7
|
+
/**
|
|
8
|
+
* Skeleton - 骨架屏
|
|
9
|
+
*
|
|
10
|
+
* @description 用于内容加载时显示占位符的骨架屏组件,提供流畅的加载体验
|
|
11
|
+
*/
|
|
7
12
|
declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLSpanElement>>;
|
|
8
13
|
export default Skeleton;
|
|
9
14
|
export type { SkeletonProps };
|