@lobehub/ui/es/Form/components/FormGroup.mjs.map

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

{"version":3,"file":"FormGroup.mjs","names":["Flexbox","Icon","Collapse"],"sources":["../../../src/Form/components/FormGroup.tsx"],"sourcesContent":["'use client';\n\nimport { cx, useResponsive } from 'antd-style';\nimport { isUndefined } from 'es-toolkit/compat';\nimport { memo } from 'react';\n\nimport Collapse from '@/Collapse';\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { groupStyles, titleVariants } from '../style';\nimport type { FormGroupProps } from '../type';\n\nconst FormGroup = memo<FormGroupProps>(\n  ({\n    className,\n    icon,\n    title,\n    children,\n    extra,\n    variant = 'borderless',\n    defaultActive = true,\n    collapsible,\n    active,\n    keyValue = 'group',\n    onCollapse,\n    desc,\n    ...rest\n  }) => {\n    const { mobile } = useResponsive();\n    const styles = groupStyles;\n    const isBorderless = variant === 'borderless';\n\n    const defaultCollapsible = isUndefined(collapsible) ? !isBorderless : collapsible;\n\n    const titleContent = (\n      <Flexbox className={cx(titleVariants({ variant }), styles.titleMobile)} gap={8} horizontal>\n        {icon && <Icon icon={icon} />}\n        {title}\n      </Flexbox>\n    );\n\n    if (mobile)\n      return (\n        <Flexbox className={className}>\n          <Flexbox className={styles.mobileGroupHeader} horizontal justify={'space-between'}>\n            {titleContent}\n            {extra}\n          </Flexbox>\n          <div className={styles.mobileGroupBody}>{children}</div>\n        </Flexbox>\n      );\n\n    return (\n      <Collapse\n        activeKey={isUndefined(active) ? undefined : active ? [keyValue] : []}\n        className={className}\n        classNames={{\n          header: isBorderless ? styles.titleBorderless : undefined,\n          title: isBorderless ? styles.titleBorderless : undefined,\n        }}\n        collapsible={defaultCollapsible}\n        defaultActiveKey={defaultActive ? [keyValue] : undefined}\n        items={[\n          {\n            children,\n            desc,\n            extra,\n            icon,\n            key: keyValue,\n            label: title,\n          },\n        ]}\n        onChange={(v) => onCollapse?.(v.length > 0)}\n        variant={variant}\n        {...rest}\n      />\n    );\n  },\n);\n\nFormGroup.displayName = 'FormGroup';\n\nexport default FormGroup;\n"],"mappings":";;;;;;;;;;;;AAaA,MAAM,YAAY,MACf,EACC,WACA,MACA,OACA,UACA,OACA,UAAU,cACV,gBAAgB,MAChB,aACA,QACA,WAAW,SACX,YACA,MACA,GAAG,WACC;CACJ,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,SAAS;CACf,MAAM,eAAe,YAAY;CAEjC,MAAM,qBAAqB,YAAY,YAAY,GAAG,CAAC,eAAe;CAEtE,MAAM,eACJ,qBAACA;EAAQ,WAAW,GAAG,cAAc,EAAE,SAAS,CAAC,EAAE,OAAO,YAAY;EAAE,KAAK;EAAG;aAC7E,QAAQ,oBAACC,gBAAW,OAAQ,EAC5B;GACO;AAGZ,KAAI,OACF,QACE,qBAACD;EAAmB;aAClB,qBAACA;GAAQ,WAAW,OAAO;GAAmB;GAAW,SAAS;cAC/D,cACA;IACO,EACV,oBAAC;GAAI,WAAW,OAAO;GAAkB;IAAe;GAChD;AAGd,QACE,oBAACE;EACC,WAAW,YAAY,OAAO,GAAG,SAAY,SAAS,CAAC,SAAS,GAAG,EAAE;EAC1D;EACX,YAAY;GACV,QAAQ,eAAe,OAAO,kBAAkB;GAChD,OAAO,eAAe,OAAO,kBAAkB;GAChD;EACD,aAAa;EACb,kBAAkB,gBAAgB,CAAC,SAAS,GAAG;EAC/C,OAAO,CACL;GACE;GACA;GACA;GACA;GACA,KAAK;GACL,OAAO;GACR,CACF;EACD,WAAW,MAAM,aAAa,EAAE,SAAS,EAAE;EAClC;EACT,GAAI;GACJ;EAGP;AAED,UAAU,cAAc;AAExB,wBAAe"}