@yamada-ui/react
Version:
React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion
1 lines • 4.94 kB
Source Map (JSON)
{"version":3,"file":"checkbox.cjs","names":["createSlotComponent","checkboxStyle","useCheckbox","useInputBorder","MinusIcon","CheckIcon","styled"],"sources":["../../../../src/components/checkbox/checkbox.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactElement, ReactNode } from \"react\"\nimport type { GenericsComponent, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { Merge } from \"../../utils\"\nimport type { UseInputBorderProps } from \"../input\"\nimport type { CheckboxStyle } from \"./checkbox.style\"\nimport type { UseCheckboxProps } from \"./use-checkbox\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { CheckIcon, MinusIcon } from \"../icon\"\nimport { useInputBorder } from \"../input\"\nimport { checkboxStyle } from \"./checkbox.style\"\nimport { useCheckbox } from \"./use-checkbox\"\n\nexport interface CheckboxProps<Y extends string = string>\n extends Merge<HTMLStyledProps<\"label\">, UseCheckboxProps<Y>>,\n ThemeProps<CheckboxStyle>,\n UseInputBorderProps {\n /**\n * The icon to display in the checkbox when it is checked.\n */\n checkedIcon?: ReactNode\n /**\n * The icon to display in the checkbox when it is indeterminate.\n */\n indeterminateIcon?: ReactNode\n /**\n * Props for the indicator component.\n */\n indicatorProps?: CheckboxIndicatorProps\n /**\n * Props for the input element.\n */\n inputProps?: HTMLStyledProps<\"input\">\n /**\n * Props for the label component.\n */\n labelProps?: CheckboxLabelProps\n /**\n * Props for the label element.\n */\n rootProps?: HTMLStyledProps<\"label\">\n}\n\nconst {\n component,\n PropsContext: CheckboxPropsContext,\n usePropsContext: useCheckboxPropsContext,\n withContext,\n withProvider,\n useRootComponentProps,\n} = createSlotComponent<CheckboxProps, CheckboxStyle>(\"checkbox\", checkboxStyle)\n\nexport {\n CheckboxPropsContext,\n component,\n useCheckboxPropsContext,\n useRootComponentProps,\n}\n\n/**\n * `Checkbox` is a component used for allowing users to select multiple values from multiple options.\n *\n * @see https://yamada-ui.com/docs/components/checkbox\n */\nexport const Checkbox = withProvider<\"label\", CheckboxProps>(\n ({\n checkedIcon,\n children,\n errorBorderColor,\n focusBorderColor,\n indeterminateIcon,\n indicatorProps,\n inputProps,\n labelProps,\n rootProps,\n ...rest\n }) => {\n const {\n checked,\n indeterminate,\n getIndicatorProps,\n getInputProps,\n getRootProps,\n } = useCheckbox(rest)\n const varProps = useInputBorder({ errorBorderColor, focusBorderColor })\n const icon = useMemo(() => {\n if (indeterminate) {\n return indeterminateIcon || <MinusIcon />\n } else if (checked) {\n return checkedIcon || <CheckIcon />\n } else {\n return null\n }\n }, [indeterminate, indeterminateIcon, checked, checkedIcon])\n const input = useMemo(() => {\n return <styled.input {...getInputProps(inputProps)} />\n }, [getInputProps, inputProps])\n const indicator = useMemo(() => {\n return (\n <CheckboxIndicator {...getIndicatorProps(indicatorProps)}>\n {icon}\n </CheckboxIndicator>\n )\n }, [getIndicatorProps, indicatorProps, icon])\n\n return (\n <styled.label {...getRootProps({ ...varProps, ...rootProps })}>\n {input}\n {indicator}\n {children ? (\n <CheckboxLabel {...labelProps}>{children}</CheckboxLabel>\n ) : null}\n </styled.label>\n )\n },\n \"root\",\n)() as GenericsComponent<{\n <Y extends string = string>(props: CheckboxProps<Y>): ReactElement\n}>\n\ninterface CheckboxIndicatorProps extends HTMLStyledProps {}\n\nconst CheckboxIndicator = withContext<\"div\", CheckboxIndicatorProps>(\n \"div\",\n \"indicator\",\n)()\n\ninterface CheckboxLabelProps extends HTMLStyledProps<\"span\"> {}\n\nconst CheckboxLabel = withContext<\"span\", CheckboxLabelProps>(\"span\", \"label\")()\n"],"mappings":";;;;;;;;;;;;;;;;;AA6CA,MAAM,EACJ,WACA,cAAc,sBACd,iBAAiB,yBACjB,aACA,cACA,0BACEA,6CAAkD,YAAYC,qCAAc;;;;;;AAchF,MAAa,WAAW,cACrB,EACC,aACA,UACA,kBACA,kBACA,mBACA,gBACA,YACA,YACA,UACA,GAAG,WACC;CACJ,MAAM,EACJ,SACA,eACA,mBACA,eACA,iBACEC,iCAAY,KAAK;CACrB,MAAM,WAAWC,wCAAe;EAAE;EAAkB;EAAkB,CAAC;CACvE,MAAM,gCAAqB;AACzB,MAAI,cACF,QAAO,qBAAqB,2CAACC,iCAAY;WAChC,QACT,QAAO,eAAe,2CAACC,iCAAY;MAEnC,QAAO;IAER;EAAC;EAAe;EAAmB;EAAS;EAAY,CAAC;CAC5D,MAAM,iCAAsB;AAC1B,SAAO,2CAACC,uBAAO,SAAM,GAAI,cAAc,WAAW,GAAI;IACrD,CAAC,eAAe,WAAW,CAAC;CAC/B,MAAM,qCAA0B;AAC9B,SACE,2CAAC;GAAkB,GAAI,kBAAkB,eAAe;aACrD;IACiB;IAErB;EAAC;EAAmB;EAAgB;EAAK,CAAC;AAE7C,QACE,4CAACA,uBAAO;EAAM,GAAI,aAAa;GAAE,GAAG;GAAU,GAAG;GAAW,CAAC;;GAC1D;GACA;GACA,WACC,2CAAC;IAAc,GAAI;IAAa;KAAyB,GACvD;;GACS;GAGnB,OACD,EAAE;AAMH,MAAM,oBAAoB,YACxB,OACA,YACD,EAAE;AAIH,MAAM,gBAAgB,YAAwC,QAAQ,QAAQ,EAAE"}