{"version":3,"file":"Skeleton.cjs","sources":["../../../../src/components/feedback/skeleton/Skeleton.tsx"],"sourcesContent":["import { SKELETON_STYLES } from '@components/feedback/skeleton/styles/Skeleton.css.ts'\r\nimport type { SkeletonProps } from '@components/feedback/skeleton/types/Skeleton.props.ts'\r\nimport Box from '@components/layout/box/Box.tsx'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { memo, type FC } from 'react'\r\n\r\n/**\r\n * Animated loading placeholder with `variant` (circular|rectangular|rounded),\r\n * explicit `width`/`height`, and `aria-hidden` so assistive technology ignores\r\n * it while content loads.\r\n */\r\nconst Skeleton: FC<SkeletonProps> = memo(({\r\n    variant,\r\n    width,\r\n    height,\r\n    className,\r\n    style,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    return (\r\n        <Box\r\n            ref={ref}\r\n            className={cn(SKELETON_STYLES.recipe({ variant }), className)}\r\n            aria-hidden={'true'}\r\n            style={{ width, height, ...style }}\r\n            {...props}\r\n        />\r\n    )\r\n})\r\n\r\nSkeleton.displayName = 'Skeleton'\r\n\r\nexport default Skeleton\r\n"],"names":["Skeleton","memo","variant","width","height","className","style","ref","props","jsx","Box","cn","SKELETON_STYLES"],"mappings":"qLAWMA,EAA8BC,EAAAA,KAAK,CAAC,CACtC,QAAAC,EACA,MAAAC,EACA,OAAAC,EACA,UAAAC,EACA,MAAAC,EACA,IAAAC,EACA,GAAGC,CACP,IAEQC,EAAAA,IAACC,EAAA,CACG,IAAAH,EACA,UAAWI,EAAAA,GAAGC,kBAAgB,OAAO,CAAE,QAAAV,CAAA,CAAS,EAAGG,CAAS,EAC5D,cAAa,OACb,MAAO,CAAE,MAAAF,EAAO,OAAAC,EAAQ,GAAGE,CAAA,EAC1B,GAAGE,CAAA,CAAA,CAGf,EAEDR,EAAS,YAAc"}