{"version":3,"file":"Legend.cjs","sources":["../../../../src/components/layout/legend/Legend.tsx"],"sourcesContent":["import { Typography } from '@components/foundation/typography'\r\nimport { LEGEND_STYLES } from '@components/layout/legend/styles/Legend.css.ts'\r\nimport type { LegendProps } from '@components/layout/legend/types/Legend.props.ts'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { forwardRef, memo } from 'react'\r\n\r\n/**\r\n * A thin wrapper around the native `<legend>` element.\r\n *\r\n * `Legend` provides the accessible name for a `Fieldset`. Screen readers\r\n * announce the legend text when the user enters or focuses controls inside\r\n * the fieldset, so the group purpose is always clear.\r\n *\r\n * @example\r\n * ```tsx\r\n * <Fieldset>\r\n *   <Legend>Notification preferences</Legend>\r\n *   <Checkbox label=\"Email\" />\r\n *   <Checkbox label=\"Push\" />\r\n * </Fieldset>\r\n * ```\r\n */\r\nconst Legend = memo(forwardRef<HTMLLegendElement, LegendProps>(\r\n    ({ className, children, ...props }, ref) => (\r\n        <Typography\r\n            ref={ref}\r\n            as={'legend'}\r\n            variant={'label'}\r\n            className={cn(LEGEND_STYLES.root, className)}\r\n            {...props}\r\n        >\r\n            {children}\r\n        </Typography>\r\n    ),\r\n))\r\n\r\nLegend.displayName = 'Legend'\r\n\r\nexport default Legend\r\n"],"names":["Legend","memo","forwardRef","className","children","props","ref","jsx","Typography","cn","LEGEND_STYLES"],"mappings":"4QAsBMA,EAASC,EAAAA,KAAKC,EAAAA,WAChB,CAAC,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAA,EAASC,IAChCC,EAAAA,IAACC,EAAA,CACG,IAAAF,EACA,GAAI,SACJ,QAAS,QACT,UAAWG,EAAAA,GAAGC,gBAAc,KAAMP,CAAS,EAC1C,GAAGE,EAEH,SAAAD,CAAA,CAAA,CAGb,CAAC,EAEDJ,EAAO,YAAc"}