UNPKG

@lobehub/ui

Version:

Lobe UI is an open-source UI component library for building AIGC web apps

1 lines 3.6 kB
{"version":3,"file":"Checkbox.mjs","names":["Checkbox","BaseCheckbox"],"sources":["../../../src/base-ui/Checkbox/Checkbox.tsx"],"sourcesContent":["'use client';\n\nimport { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox';\nimport { cx } from 'antd-style';\nimport { CheckIcon, Minus } from 'lucide-react';\nimport { type CSSProperties, memo } from 'react';\n\nimport Text from '@/Text';\n\nimport { styles } from './style';\nimport type { CheckboxProps } from './type';\n\nconst Checkbox = memo<CheckboxProps>(\n ({\n size = 16,\n shape = 'square',\n backgroundColor,\n children,\n className,\n classNames,\n styles: customStyles,\n style,\n textProps,\n onChange,\n disabled,\n indeterminate,\n ...rest\n }) => {\n const boxStyle: CSSProperties = {\n borderRadius: shape === 'square' ? `max(4px, ${Math.round(size / 4)}px)` : '50%',\n height: size,\n width: size,\n ...(backgroundColor ? { '--lobe-checkbox-bg': backgroundColor } : {}),\n ...(children ? {} : style),\n ...customStyles?.checkbox,\n };\n\n const box = (\n <BaseCheckbox.Root\n disabled={disabled}\n indeterminate={indeterminate}\n style={boxStyle}\n className={cx(\n styles.root,\n children ? classNames?.checkbox : className,\n classNames?.checkbox,\n )}\n onCheckedChange={onChange}\n {...rest}\n >\n <BaseCheckbox.Indicator className={styles.indicator}>\n {indeterminate ? (\n <Minus\n size={size}\n strokeWidth={3}\n style={{ transform: `scale(${shape === 'square' ? 0.75 : 0.66})` }}\n />\n ) : (\n <CheckIcon\n size={size}\n strokeWidth={3}\n style={{ transform: `scale(${shape === 'square' ? 0.75 : 0.66})` }}\n />\n )}\n </BaseCheckbox.Indicator>\n </BaseCheckbox.Root>\n );\n\n if (!children) return box;\n\n return (\n <label\n className={cx(styles.label, className, classNames?.wrapper)}\n style={{ gap: Math.floor(size / 2), ...style, ...customStyles?.wrapper }}\n >\n {box}\n <Text\n as={'span'}\n className={classNames?.text}\n style={customStyles?.text}\n {...textProps}\n type={disabled ? 'secondary' : textProps?.type}\n >\n {children}\n </Text>\n </label>\n );\n },\n);\n\nCheckbox.displayName = 'Checkbox';\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;AAYA,MAAMA,aAAW,MACd,EACC,OAAO,IACP,QAAQ,UACR,iBACA,UACA,WACA,YACA,QAAQ,cACR,OACA,WACA,UACA,UACA,eACA,GAAG,WACC;CACJ,MAAM,WAA0B;EAC9B,cAAc,UAAU,WAAW,YAAY,KAAK,MAAM,OAAO,EAAE,CAAC,OAAO;EAC3E,QAAQ;EACR,OAAO;EACP,GAAI,kBAAkB,EAAE,sBAAsB,iBAAiB,GAAG,EAAE;EACpE,GAAI,WAAW,EAAE,GAAG;EACpB,GAAG,cAAc;EAClB;CAED,MAAM,MACJ,oBAACC,SAAa,MAAd;EACY;EACK;EACf,OAAO;EACP,WAAW,GACT,OAAO,MACP,WAAW,YAAY,WAAW,WAClC,YAAY,SACb;EACD,iBAAiB;EACjB,GAAI;YAEJ,oBAACA,SAAa,WAAd;GAAwB,WAAW,OAAO;aACvC,gBACC,oBAAC,OAAD;IACQ;IACN,aAAa;IACb,OAAO,EAAE,WAAW,SAAS,UAAU,WAAW,MAAO,IAAK,IAAI;IAClE,CAAA,GAEF,oBAAC,WAAD;IACQ;IACN,aAAa;IACb,OAAO,EAAE,WAAW,SAAS,UAAU,WAAW,MAAO,IAAK,IAAI;IAClE,CAAA;GAEmB,CAAA;EACP,CAAA;AAGtB,KAAI,CAAC,SAAU,QAAO;AAEtB,QACE,qBAAC,SAAD;EACE,WAAW,GAAG,OAAO,OAAO,WAAW,YAAY,QAAQ;EAC3D,OAAO;GAAE,KAAK,KAAK,MAAM,OAAO,EAAE;GAAE,GAAG;GAAO,GAAG,cAAc;GAAS;YAF1E,CAIG,KACD,oBAAC,MAAD;GACE,IAAI;GACJ,WAAW,YAAY;GACvB,OAAO,cAAc;GACrB,GAAI;GACJ,MAAM,WAAW,cAAc,WAAW;GAEzC;GACI,CAAA,CACD;;EAGb;AAED,WAAS,cAAc"}