{"version":3,"file":"ChipElem-DyKGDRU8.js","sources":["../../../app/frontend/vue/src/components-tw/ui/tw-ui-chips/ChipElem.vue"],"sourcesContent":["<template>\n  <div\n    class=\"_chip\"\n    :class=\"classChip\"\n  >\n    <tw-ui-icon\n      v-if=\"icon\"\n      :icon=\"icon\"\n      :size=\"iconSize\"\n      :color=\"iconColor\"\n    />\n    <slot\n      name=\"text\"\n      :text=\"text\"\n    >\n      <span\n        class=\"_chip-text\"\n        v-html=\"text\"\n      />\n    </slot>\n    <tw-ui-icon\n      v-if=\"close\"\n      :class=\"{'_rotate-180': open }\"\n      :icon=\"rightIcon\"\n      :size=\"iconSize\"\n      :color=\"close ? iconColor : '_border-black-500'\"\n      @click=\"click\"\n    />\n    <tw-ui-icon\n      v-else-if=\"dropdown\"\n      :class=\"{'_rotate-180': open }\"\n      :icon=\"rightIcon\"\n      :size=\"iconSize\"\n      :color=\"close ? iconColor : '_border-black-500'\"\n    />\n    <tw-ui-icon\n      v-else-if=\"plus\"\n      :icon=\"rightIcon\"\n      :size=\"iconSize\"\n      :color=\"plus ? iconColor : '_fill-black-500'\"\n    />\n  </div>\n</template>\n<script setup>\nimport { computed } from 'vue';\nimport { TwUiIcon } from '@yasno-live/yasno-components';\n\nconst props = defineProps({\n  text: {\n    type: String,\n    default: 'test',\n  },\n  close: {\n    type: Boolean,\n    default: false,\n  },\n  icon: {\n    type: String,\n    default: '',\n  },\n  checked: {\n    type: Boolean,\n    default: false,\n  },\n  disabled: {\n    type: Boolean,\n    default: false,\n  },\n  size: {\n    type: String,\n    default: '',\n    validator: (v) => ['', 'sm'].includes(v),\n  },\n  open: {\n    type: Boolean,\n    default: false,\n  },\n  dropdown: {\n    type: Boolean,\n    default: false,\n  },\n  plus: {\n    type: Boolean,\n    default: false,\n  },\n});\nconst emits = defineEmits(['closeevent']);\nconst iconColor = computed(() => {\n  const color = props.checked ? '_fill-white-100' : '_fill-black-500';\n\n  return color;\n});\n\nconst iconSize = computed(() => {\n  const size = props.size ? '_w-5 _h-5' : '_w-6 _h-6';\n\n  return size;\n});\n\n// иконка справа, условие появления.\n// Крестик будет если иконка checked\n// стрелка вниз - если ! checked\nconst rightIcon = computed(() => {\n  if (props.close && props.checked) {\n    return 'cross-fill.svg';\n  }\n\n  if (props.dropdown && !props.checked) {\n    return 'dropdown.svg';\n  }\n\n  if (props.plus) {\n    return 'plus.svg';\n  }\n\n  return '';\n});\n\nconst click = () => {\n  emits('closeevent');\n};\n\nconst classChip = computed(() => {\n  const checked = props.checked ? '_chip--checked' : '';\n  const disabled = props.disabled ? '_chip--disabled' : '';\n  const size = props.size ? `_chip--${props.size}` : '';\n  const icon = props.icon ? '_chip--icon' : '';\n  const rIcon = rightIcon.value ? '_chip--ricon' : '';\n\n  return [checked, disabled, size, icon, rIcon];\n});\n</script>\n"],"names":["props","__props","emits","__emit","iconColor","computed","checked","iconSize","size","rightIcon","close","dropdown","plus","click","classChip","disabled","icon","value"],"mappings":"wjBA+CA,MAAMA,EAAQC,EAuCRC,EAAQC,EACRC,EAAYC,GAAS,IACXL,EAAMM,QAAU,kBAAoB,oBAK9CC,EAAWF,GAAS,IACXL,EAAMQ,KAAO,YAAc,cAQpCC,EAAYJ,GAAS,IACrBL,EAAMU,OAASV,EAAMM,QAChB,iBAGLN,EAAMW,WAAaX,EAAMM,QACpB,eAGLN,EAAMY,KACD,WAGF,KAGHC,EAAQ,KACZX,EAAM,aAAY,EAGdY,EAAYT,GAAS,IAOlB,CANSL,EAAMM,QAAU,iBAAmB,GAClCN,EAAMe,SAAW,kBAAoB,GACzCf,EAAMQ,KAAO,UAAUR,EAAMQ,OAAS,GACtCR,EAAMgB,KAAO,cAAgB,GAC5BP,EAAUQ,MAAQ,eAAiB"}