{"version":3,"file":"index-CDCHlO2d.js","sources":["../../../app/frontend/vue/src/components-tw/ui/tw-ui-slot-chip/index.vue"],"sourcesContent":["<template>\n  <label\n    :class=\"[bgClass, paddingClass, {\n      '_pointer-events-none': disabled,\n    }]\"\n    class=\"\n      _relative _inline-flex _flex-col _items-center _transition-all _mb-0\n      _justify-center _px-1 _rounded-[32px] _min-w-[64px] _max-w-[256px]\"\n    for=\"input\"\n    tabindex=\"-1\"\n    data-testid=\"slot-chip\"\n  >\n    <div\n      :class=\"[titleClass, titleClassProp]\"\n      class=\"_t-body-regular-short _min-w-[72px] _text-center\"\n    >\n      {{ title }}\n    </div>\n    <div\n      v-if=\"subtitle\"\n      :class=\"[subTitleClass, subTitleClassProp]\"\n      class=\"_t-mini-accent\"\n    >\n      {{ subtitle }}\n    </div>\n    <input\n      :checked=\"checked\"\n      :type=\"inputType\"\n      class=\"_w-full _h-full _absolute _cursor-pointer _left-0 _top-0 _opacity-0\"\n      v-bind=\"inputAttrs\"\n      @input=\"$emit('update:checked', $event.target.checked)\"\n    >\n  </label>\n</template>\n\n<script setup>\nimport { computed } from 'vue';\n\ndefineEmits(['update:checked']);\n\nconst props = defineProps({\n  checked: {\n    type: Boolean,\n    required: true,\n  },\n  title: {\n    type: String,\n    default: '',\n  },\n  subtitle: {\n    type: String,\n    default: '',\n  },\n  booked: {\n    type: Boolean,\n    default: false,\n  },\n  disabled: {\n    type: Boolean,\n    default: false,\n  },\n  titleClassProp: {\n    type: String,\n    default: '',\n  },\n  subTitleClassProp: {\n    type: String,\n    default: '',\n  },\n  inputType: {\n    type: String,\n    default: 'checkbox',\n  },\n  inputAttrs: {\n    type: Object,\n    default: () => ({}),\n  },\n});\n\nconst bgClass = computed(() => {\n  let classes = '_bg-blue-transparent hover:_bg-blue-200 active:_bg-blue-300';\n\n  if (props.booked) {\n    classes = '_bg-grey-transparent hover:_bg-grey-300 active:_bg-grey-400';\n  }\n\n  if (props.checked) {\n    classes = '_bg-blue-500 hover:_bg-blue-600 active:_bg-blue-700';\n\n    if (props.disabled) {\n      classes = '_bg-blue-400';\n    }\n  }\n\n  return classes;\n});\n\nconst paddingClass = computed(() => {\n  let classes = '_py-2';\n\n  if (!props.subtitle) {\n    classes = '_py-[14px]';\n  }\n\n  return classes;\n});\n\nconst titleClass = computed(() => {\n  let classes = '';\n\n  if (props.disabled && !props.checked) {\n    classes = '_text-grey-700';\n  }\n\n  if (props.checked) {\n    classes = '_text-white-100';\n  }\n\n  return classes;\n});\n\nconst subTitleClass = computed(() => {\n  let classes = '_text-grey-800';\n\n  if (props.disabled && !props.checked) {\n    classes = '_text-grey-700';\n\n    if (!props.booked) {\n      classes = '_text-grey-600';\n    }\n  }\n\n  if (props.checked) {\n    classes = '_text-white-80';\n  }\n\n  return classes;\n});\n\n</script>\n"],"names":["props","__props","bgClass","computed","classes","booked","checked","disabled","paddingClass","subtitle","titleClass","subTitleClass"],"mappings":"ggBAwCA,MAAMA,EAAQC,EAuCRC,EAAUC,GAAS,KACvB,IAAIC,EAAU,8DAcP,OAZHJ,EAAMK,SACED,EAAA,+DAGRJ,EAAMM,UACEF,EAAA,sDAENJ,EAAMO,WACEH,EAAA,iBAIPA,CAAA,IAGHI,EAAeL,GAAS,KAC5B,IAAIC,EAAU,QAMP,OAJFJ,EAAMS,WACCL,EAAA,cAGLA,CAAA,IAGHM,EAAaP,GAAS,KAC1B,IAAIC,EAAU,GAUP,OARHJ,EAAMO,WAAaP,EAAMM,UACjBF,EAAA,kBAGRJ,EAAMM,UACEF,EAAA,mBAGLA,CAAA,IAGHO,EAAgBR,GAAS,KAC7B,IAAIC,EAAU,iBAcP,OAZHJ,EAAMO,WAAaP,EAAMM,UACjBF,EAAA,iBAELJ,EAAMK,SACCD,EAAA,mBAIVJ,EAAMM,UACEF,EAAA,kBAGLA,CAAA"}