{"version":3,"file":"index.mjs","sources":["../../../../../hooks/use-typography/index.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/indent */\nimport type { TypographyProps } from '@fusion-ui-vue/components'\nimport { computed } from 'vue'\nimport type { TypographyMap, TypographyProp } from '@fusion-ui-vue/theme'\nimport { css, typographyMapping, useTheme } from '@fusion-ui-vue/theme'\nimport type { ComponentStylingHook } from '../types'\n\nexport const useTypography: ComponentStylingHook<TypographyProps> = props => {\n  const { variant, component } = props\n  const [_, $variant, size] = variant.match(/([\\w\\d]+)\\.?(\\w+)?/)!\n\n  const renderTag =\n    component ?? typographyMapping[$variant as keyof TypographyMap] ?? 'span'\n\n  const theme = useTheme()\n  const style: TypographyProp = size\n    ? // @ts-expect-error: complicate types\n      theme.value.typography[$variant][size]\n    : // @ts-expect-error: complicate types\n      theme.value.typography[$variant]\n\n  return computed(() => {\n    return css({\n      [`&:is(${renderTag})`]: {\n        margin: 0,\n        border: 'none',\n        ...style,\n      },\n    } as any)\n  })\n}\n"],"names":[],"mappings":";;;;;;AAOO,MAAM,gBAAuD,CAAS,KAAA,KAAA;AAP7E,EAAA,IAAA,EAAA,CAAA;AAQE,EAAM,MAAA,EAAE,OAAS,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAC/B,EAAA,MAAM,CAAC,CAAG,EAAA,QAAA,EAAU,IAAI,CAAI,GAAA,OAAA,CAAQ,MAAM,oBAAoB,CAAA,CAAA;AAE9D,EAAA,MAAM,SACJ,GAAA,CAAA,EAAA,GAAA,SAAA,IAAA,IAAA,GAAA,SAAA,GAAa,iBAAkB,CAAA,QAA+B,MAA9D,IAAmE,GAAA,EAAA,GAAA,MAAA,CAAA;AAErE,EAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AACvB,EAAA,MAAM,KAAwB,GAAA,IAAA;AAAA;AAAA,IAE1B,KAAM,CAAA,KAAA,CAAM,UAAW,CAAA,QAAQ,EAAE,IAAI,CAAA;AAAA;AAAA;AAAA,IAErC,KAAA,CAAM,KAAM,CAAA,UAAA,CAAW,QAAQ,CAAA;AAAA,GAAA,CAAA;AAEnC,EAAA,OAAO,SAAS,MAAM;AACpB,IAAA,OAAO,GAAI,CAAA;AAAA,MACT,CAAC,CAAA,KAAA,EAAQ,SAAS,CAAA,CAAA,CAAG,GAAG;AAAA,QACtB,MAAQ,EAAA,CAAA;AAAA,QACR,MAAQ,EAAA,MAAA;AAAA,QACR,GAAG,KAAA;AAAA,OACL;AAAA,KACM,CAAA,CAAA;AAAA,GACT,CAAA,CAAA;AACH;;;;"}