@yamada-ui/checkbox/dist/chunk-EYKGMSLM.mjs.map

Yamada UI checkbox component

{"version":3,"sources":["../src/checkbox-card.tsx"],"sourcesContent":["import type { ComponentArgs, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type {\n  ForwardedRef,\n  InputHTMLAttributes,\n  ReactElement,\n  ReactNode,\n  RefAttributes,\n} from \"react\"\nimport type { CheckboxCardAddonProps } from \"./checkbox-card-addon\"\nimport type { CheckboxCardDescriptionProps } from \"./checkbox-card-description\"\nimport type { CheckboxCardLabelProps } from \"./checkbox-card-label\"\nimport type { UseCheckboxProps } from \"./use-checkbox\"\nimport { omitThemeProps, ui, useComponentMultiStyle } from \"@yamada-ui/core\"\nimport { useFormControl } from \"@yamada-ui/form-control\"\nimport {\n  cx,\n  findChild,\n  funcAll,\n  getValidChildren,\n  isEmpty,\n  omitChildren,\n} from \"@yamada-ui/utils\"\nimport { cloneElement, forwardRef } from \"react\"\nimport { CheckboxIcon } from \"./checkbox\"\nimport { CheckboxCardAddon } from \"./checkbox-card-addon\"\nimport { CheckboxCardDescription } from \"./checkbox-card-description\"\nimport { CheckboxCardLabel } from \"./checkbox-card-label\"\nimport { CheckboxCardProvider } from \"./checkbox-context\"\nimport { useCheckboxCardGroupContext } from \"./checkbox-context\"\nimport { useCheckbox } from \"./use-checkbox\"\n\ninterface CheckboxCardOptions {\n  /**\n   * The addon of the checkbox card.\n   */\n  addon?: ReactNode\n  /**\n   * The body of the checkbox card.\n   */\n  description?: ReactNode\n  /**\n   * The label of the checkbox card.\n   */\n  label?: ReactNode\n  /**\n   * If `true`, the icon will be displayed.\n   *\n   * @default true\n   */\n  withIcon?: boolean\n  /**\n   * Props for the footer of the checkbox card.\n   */\n  addonProps?: CheckboxCardAddonProps\n  /**\n   * Props for the description of the checkbox card.\n   */\n  descriptionProps?: CheckboxCardDescriptionProps\n  /**\n   * Props for the icon of the checkbox card.\n   */\n  iconProps?: { children: ReactElement } & Omit<HTMLUIProps, \"children\">\n  /**\n   * Props for input element.\n   */\n  inputProps?: InputHTMLAttributes<HTMLInputElement>\n  /**\n   * Props for the label of the checkbox card.\n   */\n  labelProps?: CheckboxCardLabelProps\n}\n\nexport interface CheckboxCardProps<Y extends number | string = string>\n  extends Merge<HTMLUIProps<\"label\">, UseCheckboxProps<Y>>,\n    ThemeProps<\"CheckboxCard\">,\n    CheckboxCardOptions {}\n\n/**\n * `CheckboxCard` is a component used for allowing users to select multiple values from multiple options.\n *\n * @see Docs https://yamada-ui.com/components/forms/checkbox-card\n */\nexport const CheckboxCard = forwardRef(\n  <Y extends number | string = string>(\n    props: CheckboxCardProps<Y>,\n    ref: ForwardedRef<HTMLInputElement>,\n  ) => {\n    const group = useCheckboxCardGroupContext()\n    const { value: groupValue, ...groupProps } = { ...group }\n    const control = useFormControl(props)\n    const [styles, mergedProps] = useComponentMultiStyle(\"CheckboxCard\", {\n      ...groupProps,\n      ...props,\n    })\n    const {\n      className,\n      addon,\n      children,\n      description,\n      disabled = groupProps.disabled ?? control.disabled,\n      invalid = groupProps.invalid ?? control.invalid,\n      label,\n      readOnly = groupProps.readOnly ?? control.readOnly,\n      required = groupProps.required ?? control.required,\n      withIcon = true,\n      addonProps,\n      descriptionProps,\n      iconProps,\n      inputProps,\n      labelProps,\n      ...computedProps\n    } = omitThemeProps(mergedProps)\n\n    computedProps.checked ??= computedProps.isChecked\n\n    const isCheckedProp =\n      groupValue && computedProps.value\n        ? groupValue.includes(computedProps.value)\n        : computedProps.checked\n    const onChange =\n      groupProps.onChange && computedProps.value\n        ? funcAll(groupProps.onChange, computedProps.onChange)\n        : computedProps.onChange\n\n    const {\n      checked,\n      props: rest,\n      getContainerProps,\n      getIconProps,\n      getInputProps,\n    } = useCheckbox({\n      ...computedProps,\n      disabled,\n      invalid,\n      isChecked: isCheckedProp,\n      readOnly,\n      required,\n      onChange,\n    })\n\n    const { children: customIcon, ...resolvedIconProps } = { ...iconProps }\n    const icon = cloneElement(customIcon ?? <CheckboxIcon />, {\n      checked,\n      disabled,\n      invalid,\n      isChecked: checked,\n      isDisabled: disabled,\n      isInvalid: invalid,\n      isReadOnly: readOnly,\n      isRequired: required,\n      readOnly,\n      required,\n      __css: {\n        opacity: checked ? 1 : 0,\n        transform: checked ? \"scale(1)\" : \"scale(0.95)\",\n        transitionDuration: \"normal\",\n        transitionProperty: \"transform\",\n      },\n    })\n\n    const validChildren = getValidChildren(children)\n    const customLabel = findChild(validChildren, CheckboxCardLabel)\n    const customDescription = findChild(validChildren, CheckboxCardDescription)\n    const customAddon = findChild(validChildren, CheckboxCardAddon)\n\n    const computedChildren = !isEmpty(validChildren)\n      ? omitChildren(\n          validChildren,\n          CheckboxCardLabel,\n          CheckboxCardDescription,\n          CheckboxCardAddon,\n        )\n      : children\n\n    return (\n      <CheckboxCardProvider\n        value={{\n          icon,\n          styles,\n          withIcon,\n          getIconProps,\n          iconProps: resolvedIconProps,\n        }}\n      >\n        <ui.label\n          className={cx(\"ui-checkbox-card\", className)}\n          {...getContainerProps(rest)}\n          __css={{ ...styles.container }}\n        >\n          <ui.input\n            className=\"ui-checkbox-card__input\"\n            {...getInputProps(inputProps, ref)}\n          />\n\n          {customLabel ??\n            (label ? (\n              <CheckboxCardLabel {...labelProps}>{label}</CheckboxCardLabel>\n            ) : null)}\n\n          {customDescription ??\n            (description ? (\n              <CheckboxCardDescription {...descriptionProps}>\n                {description}\n              </CheckboxCardDescription>\n            ) : null)}\n\n          {customAddon ??\n            (addon ? (\n              <CheckboxCardAddon {...addonProps}>{addon}</CheckboxCardAddon>\n            ) : null)}\n\n          {computedChildren}\n        </ui.label>\n      </CheckboxCardProvider>\n    )\n  },\n) as {\n  <Y extends number | string = string>(\n    props: CheckboxCardProps<Y> & RefAttributes<HTMLInputElement>,\n  ): ReactElement\n} & ComponentArgs\n\nCheckboxCard.displayName = \"CheckboxCard\"\nCheckboxCard.__ui__ = \"CheckboxCard\"\n"],"mappings":"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","names":[]}