{"version":3,"sources":["../../../src/Badge/DotBadge/DotBadge.tsx","../../../src/Badge/DotBadge/DotBadge.css.ts"],"names":["forwardRef","css","vars","variantMap","dotBadgeCSS","jsx","DotBadge","variant","as","className","native","size","sx","type","ref","__spreadProps","__spreadValues"],"mappings":";6aAGA,OAAS,cAAAA,MAAkB,QCH3B,OAAS,OAAAC,MAAW,iBACpB,OAAS,QAAAC,MAAY,sBAEd,IAAMC,EAAa,CACxB,QAAS,CACP,OAAQ,CACN,qBAAsBD,EAAK,SAAS,MAAM,WAC5C,EACA,SAAU,CACR,qBAAsBA,EAAK,SAAS,MAAM,YAC5C,CACF,EACA,KAAM,CACJ,OAAQ,CACN,YAAa,6BAA6BA,EAAK,SAAS,MAAM,OAAO,EACvE,EACA,QAAS,CACP,YAAa,MACf,CACF,EACA,KAAM,CACJ,MAAO,CACL,iBAAkB,MAClB,UAAW,MACX,WAAY,KACd,EACA,OAAQ,CACN,iBAAkB,MAClB,UAAW,MACX,WAAY,KACd,EACA,MAAO,CACL,iBAAkB,MAClB,UAAW,OACX,WAAY,MACd,EACA,UAAW,CACT,iBAAkB,MAClB,UAAW,OACX,WAAY,MACd,CACF,CACF,EAEaE,EAAcH,EAAI,CAC7B,QAAS,eACT,cAAe,SAEf,MAAO,eACP,OAAQ,gBAER,gBAAiB,0BAEjB,aAAcC,EAAK,QAAQ,KAE3B,QAAS,gBACX,CAAC,ED1CG,cAAAG,MAAA,6BAPG,IAAMC,EAA8BN,EAAW,SACpD,CAAE,QAAAO,EAAS,GAAAC,EAAI,UAAAC,EAAW,OAAAC,EAAQ,KAAAC,EAAO,QAAS,GAAAC,EAAI,KAAAC,EAAO,SAAU,EACvEC,EACA,CAGA,OACET,EAHcG,GAAM,OAGnBO,EAAAC,EAAA,CACC,IAAKF,EACL,UAAWL,GACPC,GAHL,CAIC,MAAOM,QAAA,GACFb,EAAW,QAAQI,CAAO,GAC1BJ,EAAW,KAAKQ,CAAI,GACpBR,EAAW,KAAKU,CAAI,GACpBH,GAAA,YAAAA,EAAQ,OAEb,IAAK,CAACN,EAAaQ,CAAE,GACvB,CAEJ,CAAC","sourcesContent":["/** @jsxImportSource @emotion/react */\n\nimport type { ComponentPropsWithRef, ElementType } from \"react\";\nimport { forwardRef } from \"react\";\nimport { dotBadgeCSS, variantMap } from \"./DotBadge.css\";\nimport type { DotBadgeComponent, DotBadgeProps } from \"./DotBadge.types\";\n\nexport const DotBadge: DotBadgeComponent = forwardRef(function ClayDotBadge<E extends ElementType>(\n  { variant, as, className, native, size = \"small\", sx, type = \"default\" }: DotBadgeProps<E>,\n  ref: ComponentPropsWithRef<E>[\"ref\"],\n) {\n  const Element = as || \"span\";\n\n  return (\n    <Element\n      ref={ref}\n      className={className}\n      {...native}\n      style={{\n        ...variantMap.variant[variant],\n        ...variantMap.size[size],\n        ...variantMap.type[type],\n        ...native?.style,\n      }}\n      css={[dotBadgeCSS, sx]}\n    />\n  );\n});\n","import { css } from \"@emotion/react\";\nimport { vars } from \"@imwebme/clay-token\";\n\nexport const variantMap = {\n  variant: {\n    accent: {\n      \"--background-color\": vars.semantic.color.focusAccent,\n    },\n    critical: {\n      \"--background-color\": vars.semantic.color.iconCritical,\n    },\n  },\n  type: {\n    border: {\n      \"--outline\": `var(--border-width) solid ${vars.semantic.color.surface}`,\n    },\n    default: {\n      \"--outline\": \"none\",\n    },\n  },\n  size: {\n    small: {\n      \"--border-width\": \"2px\",\n      \"--width\": \"6px\",\n      \"--height\": \"6px\",\n    },\n    medium: {\n      \"--border-width\": \"2px\",\n      \"--width\": \"8px\",\n      \"--height\": \"8px\",\n    },\n    large: {\n      \"--border-width\": \"2px\",\n      \"--width\": \"10px\",\n      \"--height\": \"10px\",\n    },\n    largeBold: {\n      \"--border-width\": \"3px\",\n      \"--width\": \"10px\",\n      \"--height\": \"10px\",\n    },\n  },\n} as Record<string, Record<string, Record<string, string>>>;\n\nexport const dotBadgeCSS = css({\n  display: \"inline-block\",\n  verticalAlign: \"middle\",\n\n  width: \"var(--width)\",\n  height: \"var(--height)\",\n\n  backgroundColor: \"var(--background-color)\",\n\n  borderRadius: vars.rounded.full,\n\n  outline: \"var(--outline)\",\n});\n"]}