{"version":3,"sources":["../../src/Label/Label.tsx","../../src/Typography/Typography.tsx"],"names":["vars","forwardRef","classNames","jsx","_Typography","as","semanticToken","variant","className","colorToken","children","whiteSpace","numOfLine","sx","textAlign","native","ref","__spreadProps","__spreadValues","Typography","jsxs","_Label","type","text","bold","Label"],"mappings":";6aAEA,OAAS,QAAAA,MAAY,sBAErB,OAAS,cAAAC,MAAkB,QCF3B,OAAS,cAAAC,EAAY,QAAAF,MAAY,sBAEjC,OAAS,cAAAC,MAAkB,QA0BvB,cAAAE,MAAA,6BAnBJ,IAAMC,EAAc,CAClB,CACE,GAAAC,EACA,cAAAC,EACA,QAAAC,EAAU,cACV,UAAAC,EAAY,GACZ,WAAAC,EAAa,OACb,SAAAC,EACA,WAAAC,EACA,UAAAC,EACA,GAAAC,EACA,UAAAC,EACA,OAAAC,CACF,EACAC,IAKEb,EAHcE,GAAM,IAGnBY,EAAAC,EAAA,CACC,UAAW,GAAGhB,EAAW,WAAWI,GAAiBC,CAAO,CAAC,IAAIC,CAAS,GAC1E,IAAKQ,EACL,IAAKE,EAAAD,EAAAC,EAAA,CACH,MAAOlB,EAAK,SAAS,MAAMS,CAAU,GACjCG,GAAa,CACf,QAAS,cACT,SAAU,SACV,aAAc,WACd,gBAAiB,WACjB,gBAAiBA,CACnB,GARG,CASH,WAAAD,EACA,UAAAG,IACGD,IAEDE,GAhBL,CAkBE,SAAAL,GACH,EAISS,EAAalB,EAAWG,CAAW,EAEhDe,EAAW,YAAc,aDxCrB,OAUE,OAAAhB,EAVF,QAAAiB,MAAA,6BAPJ,IAAMC,EAAS,CACb,CAAE,KAAAC,EAAO,UAAW,UAAAd,EAAW,KAAAe,EAAM,KAAAC,EAAO,GAAM,GAAAX,EAAI,GAAAR,EAAI,SAAAK,CAAS,EACnEM,IAKEI,EAHcf,GAAM,QAGnB,CACC,IAAKW,EACL,UAAWR,EACX,IAAK,CACH,QAAS,OACT,IAAKR,EAAK,QAAQ,CAAC,EACnB,WAAY,SACZ,GAAAa,CACF,EAEA,UAAAV,EAACgB,EAAA,CACC,QAASK,EAAO,oBAAsB,eACtC,WAAYF,IAAS,UAAY,OAAS,UAEzC,SAAAC,EACH,EAECb,GACH,EAISe,EAAQxB,EAAWoB,CAAM,EAEtCI,EAAM,YAAc","sourcesContent":["/** @jsxImportSource @emotion/react */\n\nimport { vars } from \"@imwebme/clay-token\";\nimport type { ElementType, Ref } from \"react\";\nimport { forwardRef } from \"react\";\nimport { Typography } from \"..\";\nimport type { LabelProps } from \"./Label.types\";\n\nconst _Label = <Element extends ElementType>(\n  { type = \"primary\", className, text, bold = true, sx, as, children }: LabelProps<Element>,\n  ref: Ref<HTMLElement>,\n) => {\n  const Element = as || \"label\";\n\n  return (\n    <Element\n      ref={ref as any}\n      className={className}\n      css={{\n        display: \"flex\",\n        gap: vars.spacing[1],\n        alignItems: \"center\",\n        sx,\n      }}\n    >\n      <Typography\n        variant={bold ? \"label-medium-bold\" : \"label-medium\"}\n        colorToken={type === \"primary\" ? \"text\" : \"textSub\"}\n      >\n        {text}\n      </Typography>\n\n      {children}\n    </Element>\n  );\n};\n\nexport const Label = forwardRef(_Label);\n\nLabel.displayName = \"Label\";\n","/** @jsxImportSource @emotion/react */\n\nimport { classNames, vars } from \"@imwebme/clay-token\";\nimport type { ElementType, Ref } from \"react\";\nimport { forwardRef } from \"react\";\nimport type { TypographyProps } from \"./Typography.types\";\n\n/**\n * token은 두 가지 방법으로 넣어줄 수 있습니다. semanticToken, variant\n * 값은 body-medium이 default 입니다.\n */\nconst _Typography = <Element extends ElementType>(\n  {\n    as,\n    semanticToken,\n    variant = \"body-medium\",\n    className = \"\",\n    colorToken = \"text\",\n    children,\n    whiteSpace,\n    numOfLine,\n    sx,\n    textAlign,\n    native,\n  }: TypographyProps<Element>,\n  ref: Ref<HTMLElement>,\n) => {\n  const Element = as || \"p\";\n\n  return (\n    <Element\n      className={`${classNames.typography[semanticToken || variant]} ${className}`}\n      ref={ref as any}\n      css={{\n        color: vars.semantic.color[colorToken],\n        ...(numOfLine && {\n          display: \"-webkit-box\",\n          overflow: \"hidden\",\n          textOverflow: \"ellipsis\",\n          WebkitBoxOrient: \"vertical\",\n          WebkitLineClamp: numOfLine,\n        }),\n        whiteSpace,\n        textAlign,\n        ...sx,\n      }}\n      {...native}\n    >\n      {children}\n    </Element>\n  );\n};\n\nexport const Typography = forwardRef(_Typography);\n\nTypography.displayName = \"Typography\";\n"]}