{"version":3,"file":"index.mjs","sources":["../../../../../../src/services/colors-classes/plugin/index.ts"],"sourcesContent":["import { watch } from 'vue'\n\nimport { isServer } from '../../../utils/ssr'\nimport { useGlobalConfig } from '../../../composables/useGlobalConfig'\nimport { defineGlobalProperty, defineVuesticPlugin } from '../../vue-plugin/utils'\nimport { addOrUpdateStyleElement } from '../../../utils/dom'\n\nimport type { ColorVariables } from '../../color'\nimport type { ColorsClassesConfig, ColorsClassesConfigItem } from '../types'\n\nconst getColorsClassesHelpers = (helpers: ColorsClassesConfig, colors: ColorVariables) => {\n  const colorsEntries = Object.entries(colors)\n\n  return helpers.reduce((acc, helper: ColorsClassesConfigItem) => acc.concat(\n    colorsEntries.map(([colorName, colorValue]) => ({\n      ...helper,\n      postfix: helper.postfix ?? colorName,\n      value: helper.value ?? colorValue,\n    })),\n  ), [] as ColorsClassesConfig)\n}\n\nconst getColorsClassesStyles = (helpers: ColorsClassesConfig) => {\n  return helpers.reduce((styles, helper) => {\n    const style = [helper.property].flat().map(prop => `${prop}: ${helper.value};`).join('')\n\n    styles += `.va-${helper.prefix}--${helper.postfix} { ${style} }`\n\n    return styles\n  }, '')\n}\n\nconst handleConfigUpdate = (helpers: ColorsClassesConfig, colors: ColorVariables) => {\n  const coloredHelpers = getColorsClassesHelpers(helpers, colors)\n\n  addOrUpdateStyleElement(\n    'va-color-helpers',\n    () => getColorsClassesStyles(coloredHelpers),\n  )\n}\n\nconst createColorHelpersPlugin = () => {\n  if (isServer()) { return }\n\n  const { globalConfig } = useGlobalConfig()\n\n  watch(() => globalConfig.value.colorsClasses, (newHelpers: ColorsClassesConfig) => {\n    if (newHelpers.length) {\n      handleConfigUpdate(newHelpers, globalConfig.value.colors.variables)\n    }\n  }, { immediate: true, deep: true })\n\n  watch(() => globalConfig.value.colors.variables, (newColors: ColorVariables) => {\n    if (!newColors) { return }\n\n    handleConfigUpdate(globalConfig.value.colorsClasses, newColors)\n  }, { immediate: true, deep: true })\n\n  return {\n    renderColorHelpers: () => {\n      const coloredHelpers = getColorsClassesHelpers(globalConfig.value.colorsClasses, globalConfig.value.colors.variables)\n\n      return getColorsClassesStyles(coloredHelpers)\n    },\n  }\n}\n\nexport const ColorsClassesPlugin = defineVuesticPlugin(() => ({\n  install (app) {\n    defineGlobalProperty(app, '$vaColorsClasses', createColorHelpersPlugin())\n  },\n}))\n\ndeclare module 'vue' {\n  export interface ComponentCustomProperties {\n    $vaColorsClasses: ReturnType<typeof createColorHelpersPlugin>\n  }\n}\n"],"names":[],"mappings":";;;;;;AAUA,MAAM,0BAA0B,CAAC,SAA8B,WAA2B;AAClF,QAAA,gBAAgB,OAAO,QAAQ,MAAM;AAE3C,SAAO,QAAQ,OAAO,CAAC,KAAK,WAAoC,IAAI;AAAA,IAClE,cAAc,IAAI,CAAC,CAAC,WAAW,UAAU,OAAO;AAAA,MAC9C,GAAG;AAAA,MACH,SAAS,OAAO,WAAW;AAAA,MAC3B,OAAO,OAAO,SAAS;AAAA,IAAA,EACvB;AAAA,EACJ,GAAG,CAAyB,CAAA;AAC9B;AAEA,MAAM,yBAAyB,CAAC,YAAiC;AAC/D,SAAO,QAAQ,OAAO,CAAC,QAAQ,WAAW;AACxC,UAAM,QAAQ,CAAC,OAAO,QAAQ,EAAE,KAAO,EAAA,IAAI,CAAQ,SAAA,GAAG,IAAI,KAAK,OAAO,KAAK,GAAG,EAAE,KAAK,EAAE;AAEvF,cAAU,OAAO,OAAO,MAAM,KAAK,OAAO,OAAO,MAAM,KAAK;AAErD,WAAA;AAAA,KACN,EAAE;AACP;AAEA,MAAM,qBAAqB,CAAC,SAA8B,WAA2B;AAC7E,QAAA,iBAAiB,wBAAwB,SAAS,MAAM;AAE9D;AAAA,IACE;AAAA,IACA,MAAM,uBAAuB,cAAc;AAAA,EAAA;AAE/C;AAEA,MAAM,2BAA2B,MAAM;AACrC,MAAI,YAAY;AAAE;AAAA,EAAO;AAEnB,QAAA,EAAE,iBAAiB;AAEzB,QAAM,MAAM,aAAa,MAAM,eAAe,CAAC,eAAoC;AACjF,QAAI,WAAW,QAAQ;AACrB,yBAAmB,YAAY,aAAa,MAAM,OAAO,SAAS;AAAA,IACpE;AAAA,KACC,EAAE,WAAW,MAAM,MAAM,KAAM,CAAA;AAElC,QAAM,MAAM,aAAa,MAAM,OAAO,WAAW,CAAC,cAA8B;AAC9E,QAAI,CAAC,WAAW;AAAE;AAAA,IAAO;AAEN,uBAAA,aAAa,MAAM,eAAe,SAAS;AAAA,KAC7D,EAAE,WAAW,MAAM,MAAM,KAAM,CAAA;AAE3B,SAAA;AAAA,IACL,oBAAoB,MAAM;AAClB,YAAA,iBAAiB,wBAAwB,aAAa,MAAM,eAAe,aAAa,MAAM,OAAO,SAAS;AAEpH,aAAO,uBAAuB,cAAc;AAAA,IAC9C;AAAA,EAAA;AAEJ;AAEa,MAAA,sBAAsB,oBAAoB,OAAO;AAAA,EAC5D,QAAS,KAAK;AACS,yBAAA,KAAK,oBAAoB,yBAA0B,CAAA;AAAA,EAC1E;AACF,EAAE;"}