@extclp/vexip-ui/es/components/tag/tag.mjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

{"version":3,"file":"tag.mjs","sources":["../../../components/tag/tag.tsx"],"sourcesContent":["import { Icon } from '@/components/icon'\nimport { Renderer } from '@/components/renderer'\n\nimport { computed, defineComponent, renderSlot } from 'vue'\n\nimport { createSizeProp, emitEvent, useIcons, useNameHelper, useProps } from '@vexip-ui/config'\nimport { adjustAlpha, isClient, mixColor, parseColorToRgba } from '@vexip-ui/utils'\nimport { tagProps } from './props'\n\nimport type { TagType } from './symbol'\n\nconst tagTypes = Object.freeze<TagType[]>([\n  'default',\n  'primary',\n  'info',\n  'success',\n  'error',\n  'warning',\n  'lime',\n  'pink',\n  'magenta',\n  'tomato',\n  'orange',\n  'cyan',\n  'navy',\n  'gold',\n  'purple'\n])\n\nexport default defineComponent({\n  name: 'Tag',\n  components: {\n    Icon\n  },\n  props: tagProps,\n  emits: [],\n  setup(_props, { slots }) {\n    const props = useProps('tag', _props, {\n      size: createSizeProp(),\n      type: {\n        default: 'default',\n        validator: (value: TagType) => tagTypes.includes(value)\n      },\n      border: false,\n      closable: false,\n      color: null,\n      simple: false,\n      circle: false,\n      prefix: '',\n      prefixBg: '',\n      prefixColor: '',\n      suffix: '',\n      suffixBg: '',\n      suffixColor: '',\n      disabled: false,\n      slots: () => ({})\n    })\n\n    const nh = useNameHelper('tag')\n    const icons = useIcons()\n\n    const className = computed(() => {\n      return {\n        [nh.b()]: true,\n        [nh.bs('vars')]: true,\n        [nh.bm('inherit')]: props.inherit,\n        [nh.bm(props.size)]: props.size !== 'default',\n        [nh.bm(props.type)]: props.type !== 'default',\n        [nh.bm('border')]: props.border,\n        [nh.bm('simple')]: props.simple,\n        [nh.bm('circle')]: props.circle,\n        [nh.bm('closable')]: props.closable,\n        [nh.bm('disabled')]: props.disabled\n      }\n    })\n    const style = computed(() => {\n      if (!props.color) return undefined\n\n      const rootStyle = isClient ? getComputedStyle(document.documentElement) : null\n      const white = parseColorToRgba(rootStyle?.getPropertyValue(nh.nv('color-white')) || '#fff')\n      const baseColor = parseColorToRgba(props.color)\n      const base = baseColor.toString()\n\n      return nh.cvm({\n        color: 'var(--vxp-color-white)',\n        'bg-color': base,\n        'b-color': base,\n        'close-color': 'var(--vxp-color-white)',\n        'd-color': mixColor(white, baseColor, 0.3).toString(),\n        ...(props.simple || props.border\n          ? {\n              color: base,\n              'close-color': base\n            }\n          : {}),\n        ...(props.simple\n          ? {\n              'bg-color': adjustAlpha(baseColor, 0.2).toString()\n            }\n          : {})\n      })\n    })\n\n    function handleClose(event: MouseEvent) {\n      if (!props.closable || props.disabled || event.button > 0) {\n        return false\n      }\n\n      event.stopPropagation()\n      emitEvent(props.onClose)\n    }\n\n    function renderClose() {\n      if (!props.closable) return null\n\n      return (\n        <button type={'button'} class={nh.be('close')} onClick={handleClose}>\n          <Icon {...icons.value.close} label={'close'}></Icon>\n        </button>\n      )\n    }\n\n    return () => {\n      const hasPrefix = !!(props.prefix === 0 || props.prefix || slots.prefix || props.slots.prefix)\n      const hasSuffix = !!(props.suffix === 0 || props.suffix || slots.suffix || props.slots.suffix)\n\n      return (\n        <div class={className.value} style={style.value}>\n          {hasPrefix ? (\n            <span\n              class={[nh.be('unit'), nh.be('prefix')]}\n              style={{\n                color: props.prefixColor,\n                backgroundColor: props.prefixBg,\n                borderColor: props.prefixBg\n              }}\n            >\n              {renderSlot(slots, 'prefix', undefined, () => [\n                <Renderer renderer={props.slots.prefix}>{props.prefix}</Renderer>\n              ])}\n            </span>\n          ) : null}\n          <span class={[nh.be('unit'), nh.be('content')]}>\n            {renderSlot(slots, 'default', undefined, () => [\n              <Renderer renderer={props.slots.default}></Renderer>\n            ])}\n            {!hasSuffix && renderClose()}\n          </span>\n          {hasSuffix ? (\n            <span\n              class={[nh.be('unit'), nh.be('suffix')]}\n              style={{\n                color: props.suffixColor,\n                backgroundColor: props.suffixBg,\n                borderColor: props.suffixBg\n              }}\n            >\n              {renderSlot(slots, 'suffix', undefined, () => [\n                <Renderer renderer={props.slots.suffix}>{props.suffix}</Renderer>\n              ])}\n              {renderClose()}\n            </span>\n          ) : null}\n        </div>\n      )\n    }\n  }\n})\n"],"names":["tagTypes","Object","freeze","defineComponent","name","components","Icon","props","tagProps","emits","setup","_props","slots","useProps","size","createSizeProp","type","default","validator","value","includes","border","closable","color","simple","circle","prefix","prefixBg","prefixColor","suffix","suffixBg","suffixColor","disabled","nh","useNameHelper","icons","useIcons","className","computed","b","bs","bm","inherit","style","rootStyle","isClient","getComputedStyle","document","documentElement","white","parseColorToRgba","getPropertyValue","nv","baseColor","base","toString","cvm","mixColor","adjustAlpha","handleClose","event","button","stopPropagation","emitEvent","onClose","renderClose","_createVNode","be","_mergeProps","close","hasPrefix","hasSuffix","backgroundColor","borderColor","renderSlot","undefined","Renderer"],"mappings":";;;;;;;;AAWA,MAAMA,IAAWC,OAAOC,OAAkB,CACxC,WACA,WACA,QACA,WACA,SACA,WACA,QACA,QACA,WACA,UACA,UACA,QACA,QACA,QACA,QAAQ,CACT,GAEcC,sBAAgB;AAAA,EAC7BC,MAAM;AAAA,EACNC,YAAY;AAAA,IACVC,MAAAA;AAAAA,EACD;AAAA,EACDC,OAAOC;AAAAA,EACPC,OAAO,CAAE;AAAA,EACTC,MAAMC,GAAQ;AAAA,IAAEC,OAAAA;AAAAA,EAAM,GAAG;AACvB,UAAML,IAAQM,EAAS,OAAOF,GAAQ;AAAA,MACpCG,MAAMC,EAAgB;AAAA,MACtBC,MAAM;AAAA,QACJC,SAAS;AAAA,QACTC,WAAYC,CAAAA,MAAmBnB,EAASoB,SAASD,CAAK;AAAA,MACvD;AAAA,MACDE,QAAQ;AAAA,MACRC,UAAU;AAAA,MACVC,OAAO;AAAA,MACPC,QAAQ;AAAA,MACRC,QAAQ;AAAA,MACRC,QAAQ;AAAA,MACRC,UAAU;AAAA,MACVC,aAAa;AAAA,MACbC,QAAQ;AAAA,MACRC,UAAU;AAAA,MACVC,aAAa;AAAA,MACbC,UAAU;AAAA,MACVpB,OAAOA,OAAO,CAAE;AAAA,IAClB,CAAC,GAEKqB,IAAKC,EAAc,KAAK,GACxBC,IAAQC,EAAU,GAElBC,IAAYC,EAAS,OAClB;AAAA,MACL,CAACL,EAAGM,EAAC,CAAE,GAAG;AAAA,MACV,CAACN,EAAGO,GAAG,MAAM,CAAC,GAAG;AAAA,MACjB,CAACP,EAAGQ,GAAG,SAAS,CAAC,GAAGlC,EAAMmC;AAAAA,MAC1B,CAACT,EAAGQ,GAAGlC,EAAMO,IAAI,CAAC,GAAGP,EAAMO,SAAS;AAAA,MACpC,CAACmB,EAAGQ,GAAGlC,EAAMS,IAAI,CAAC,GAAGT,EAAMS,SAAS;AAAA,MACpC,CAACiB,EAAGQ,GAAG,QAAQ,CAAC,GAAGlC,EAAMc;AAAAA,MACzB,CAACY,EAAGQ,GAAG,QAAQ,CAAC,GAAGlC,EAAMiB;AAAAA,MACzB,CAACS,EAAGQ,GAAG,QAAQ,CAAC,GAAGlC,EAAMkB;AAAAA,MACzB,CAACQ,EAAGQ,GAAG,UAAU,CAAC,GAAGlC,EAAMe;AAAAA,MAC3B,CAACW,EAAGQ,GAAG,UAAU,CAAC,GAAGlC,EAAMyB;AAAAA,IAC5B,EACF,GACKW,IAAQL,EAAS,MAAM;AAC3B,UAAI,CAAC/B,EAAMgB,MAAO;AAElB,YAAMqB,IAAYC,IAAWC,iBAAiBC,SAASC,eAAe,IAAI,MACpEC,IAAQC,GAAiBN,KAAAA,gBAAAA,EAAWO,iBAAiBlB,EAAGmB,GAAG,aAAa,OAAM,MAAM,GACpFC,IAAYH,EAAiB3C,EAAMgB,KAAK,GACxC+B,IAAOD,EAAUE,SAAU;AAEjC,aAAOtB,EAAGuB,IAAI;AAAA,QACZjC,OAAO;AAAA,QACP,YAAY+B;AAAAA,QACZ,WAAWA;AAAAA,QACX,eAAe;AAAA,QACf,WAAWG,EAASR,GAAOI,GAAW,GAAG,EAAEE,SAAU;AAAA,QACrD,GAAIhD,EAAMiB,UAAUjB,EAAMc,SACtB;AAAA,UACEE,OAAO+B;AAAAA,UACP,eAAeA;AAAAA,QAChB,IACD;QACJ,GAAI/C,EAAMiB,SACN;AAAA,UACE,YAAYkC,EAAYL,GAAW,GAAG,EAAEE,SAAQ;AAAA,YAElD,CAAE;AAAA,MACR,CAAC;AAAA,IACH,CAAC;AAED,aAASI,EAAYC,GAAmB;AACtC,UAAI,CAACrD,EAAMe,YAAYf,EAAMyB,YAAY4B,EAAMC,SAAS;AACtD,eAAO;AAGTD,MAAAA,EAAME,gBAAiB,GACvBC,EAAUxD,EAAMyD,OAAO;AAAA,IACzB;AAEA,aAASC,IAAc;AACrB,aAAK1D,EAAMe,WAEX4C,EAAA,UAAA;AAAA,QAAA,MACgB;AAAA,QAAQ,OAASjC,EAAGkC,GAAG,OAAO;AAAA,QAAC,SAAWR;AAAAA,SAAWO,CAAAA,EAAA5D,GAAA8D,EACvDjC,EAAMhB,MAAMkD,OAAK;AAAA,QAAA,OAAS;AAAA,MAAO,CAAA,GAAA,IAAA,CAAA,CAAA,IAJnB;AAAA,IAO9B;AAEA,WAAO,MAAM;AACX,YAAMC,IAAY,CAAC,EAAE/D,EAAMmB,WAAW,KAAKnB,EAAMmB,UAAUd,EAAMc,UAAUnB,EAAMK,MAAMc,SACjF6C,IAAY,CAAC,EAAEhE,EAAMsB,WAAW,KAAKtB,EAAMsB,UAAUjB,EAAMiB,UAAUtB,EAAMK,MAAMiB;AAEvF,aAAAqC,EAAA,OAAA;AAAA,QAAA,OACc7B,EAAUlB;AAAAA,QAAK,OAASwB,EAAMxB;AAAAA,SACvCmD,CAAAA,IAASJ,EAAA,QAAA;AAAA,QAAA,OAEC,CAACjC,EAAGkC,GAAG,MAAM,GAAGlC,EAAGkC,GAAG,QAAQ,CAAC;AAAA,QAAC,OAChC;AAAA,UACL5C,OAAOhB,EAAMqB;AAAAA,UACb4C,iBAAiBjE,EAAMoB;AAAAA,UACvB8C,aAAalE,EAAMoB;AAAAA,QACrB;AAAA,MAAC,GAAA,CAEA+C,EAAW9D,GAAO,UAAU+D,QAAW,MAAM,CAAAT,EAAAU,GAAA;AAAA,QAAA,UACxBrE,EAAMK,MAAMc;AAAAA,MAAM,GAAA;AAAA,QAAAT,SAAAA,MAAGV,CAAAA,EAAMmB,MAAM;AAAA,MAAA,CAAA,CAAA,CACtD,CAAC,CAAA,IAEF,MAAIwC,EAAA,QAAA;AAAA,QAAA,OACK,CAACjC,EAAGkC,GAAG,MAAM,GAAGlC,EAAGkC,GAAG,SAAS,CAAC;AAAA,MAAC,GAAA,CAC3CO,EAAW9D,GAAO,WAAW+D,QAAW,MAAM,CAAAT,EAAAU,GAAA;AAAA,QAAA,UACzBrE,EAAMK,MAAMK;AAAAA,SACjC,IAAA,CAAA,CAAA,GACA,CAACsD,KAAaN,EAAa,CAAA,CAAA,GAE7BM,IAASL,EAAA,QAAA;AAAA,QAAA,OAEC,CAACjC,EAAGkC,GAAG,MAAM,GAAGlC,EAAGkC,GAAG,QAAQ,CAAC;AAAA,QAAC,OAChC;AAAA,UACL5C,OAAOhB,EAAMwB;AAAAA,UACbyC,iBAAiBjE,EAAMuB;AAAAA,UACvB2C,aAAalE,EAAMuB;AAAAA,QACrB;AAAA,MAAC,GAAA,CAEA4C,EAAW9D,GAAO,UAAU+D,QAAW,MAAM,CAAAT,EAAAU,GAAA;AAAA,QAAA,UACxBrE,EAAMK,MAAMiB;AAAAA,MAAM,GAAA;AAAA,QAAAZ,SAAAA,MAAGV,CAAAA,EAAMsB,MAAM;AAAA,MAAA,CAAA,CAAA,CACtD,GACAoC,EAAa,CAAA,KAEd,IAAI,CAAA;AAAA,IAGb;AAAA,EACH;AACF,CAAC;"}