{"version":3,"file":"akEah8wZ.js","sources":["../../../../node_modules/@smenaspace/ui-layer/components/card-button/types.ts","../../../../node_modules/@smenaspace/ui-layer/components/card-button/CardButton.vue"],"sourcesContent":["export const enum CardButtonTypes {\n  selection = 'selection',\n  simple = 'simple',\n  extras = 'extras',\n  gift = 'gift',\n}\n","<script setup lang=\"ts\">\nimport { CardButtonTypes } from './types'\n\ntype Type = keyof typeof CardButtonTypes\n\ntype Props = {\n  type: Type\n  price?: number | string\n  oldPrice?: number | string\n  currency?: string\n  isActive?: boolean\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  currency: '₽',\n  price: 0,\n  oldPrice: 0,\n})\n\nconst emit = defineEmits(['onAdd', 'onIncrease', 'onDecrease'])\n\nconst componentClasses = computed(() => {\n  const classes = ['app-card-button', `app-card-button--type-${props.type}`]\n\n  if (props.isActive) classes.push('app-card-button--active')\n\n  return classes\n})\n\nconst pricePrefix = computed(() => {\n  if (props.type === CardButtonTypes.selection) return 'от '\n\n  return ''\n})\n\nconst priceValue = computed(() => {\n  return `${pricePrefix.value}${props.price} ${props.currency}`\n})\n\nconst oldPriceValue = computed(() => {\n  return `${props.oldPrice} ${props.currency}`\n})\n\nconst appendIconName = computed(() => {\n  if (props.type === CardButtonTypes.gift && props.isActive) return 'tick'\n\n  if (props.type === CardButtonTypes.selection && props.isActive) return 'plus'\n\n  const typesList: Type[] = [\n    CardButtonTypes.extras,\n    CardButtonTypes.simple,\n    CardButtonTypes.gift,\n  ]\n\n  if (typesList.includes(props.type)) return 'plus'\n\n  return 'arrow-right'\n})\n\nconst isGiftType = computed(() => props.type === CardButtonTypes.gift)\n\nconst showRemoveButton = computed(() => {\n  return props.isActive && !isGiftType.value\n})\n\nconst showAddButton = computed(() => {\n  return props.isActive || isGiftType.value\n})\n\nconst onClickRoot = () => {\n  if (!props.isActive) emit('onAdd')\n}\n</script>\n\n<template>\n  <div :class=\"componentClasses\" @click.self=\"onClickRoot\">\n    <the-button\n      v-if=\"showRemoveButton\"\n      data-test-id=\"card-button-decrease\"\n      class=\"app-card-button__button\"\n      :class=\"{ 'app-card-button__button--disabled': !isActive }\"\n      variant=\"transparent\"\n      size=\"xs\"\n      radius=\"lg\"\n      type=\"button\"\n      icon=\"minus\"\n      @click=\"emit('onDecrease')\"\n    />\n\n    <div v-if=\"!isGiftType\" class=\"app-card-button__wrapper\">\n      <div\n        v-if=\"oldPrice && !isActive\"\n        data-test-id=\"card-button-old-price\"\n        class=\"app-card-button__old-price\"\n      >\n        {{ oldPriceValue }}\n      </div>\n\n      <div data-test-id=\"card-button-price\" class=\"app-card-button__price\">\n        {{ priceValue }}\n      </div>\n\n      <the-icon\n        v-show=\"!isActive\"\n        class=\"app-card-button__icon\"\n        :name=\"appendIconName\"\n      />\n    </div>\n\n    <the-button\n      v-if=\"showAddButton\"\n      data-test-id=\"card-button-increase\"\n      class=\"app-card-button__button\"\n      :class=\"{ 'app-card-button__button--disabled': !isActive }\"\n      variant=\"transparent\"\n      size=\"xs\"\n      radius=\"lg\"\n      type=\"button\"\n      :icon=\"appendIconName\"\n      @click=\"emit('onIncrease')\"\n    />\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n@use '../../assets/ui-layer/styles/mixins' as *;\n\n.app-card-button {\n  --card-button-gap: 8px;\n  --card-button-width: 40px;\n  --card-button-height: 40px;\n\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  color: var(--ui-primary);\n  letter-spacing: -0.02em;\n  cursor: pointer;\n  background-color: var(--ui-white);\n  border-radius: 100px;\n  box-shadow: var(--ui-card-shadow);\n  transition: background-color 0.3s ease-in-out, box-shadow 0.2s ease-in-out;\n\n  @include media('>=desktop-mini') {\n    --card-button-width: 72px;\n  }\n\n  &:active {\n    color: var(--ui-white);\n    background-color: var(--ui-primary);\n  }\n\n  :deep(svg) {\n    fill: currentColor !important;\n    stroke: currentColor !important;\n  }\n\n  &__wrapper {\n    position: relative;\n    z-index: 1;\n    display: flex;\n    gap: var(--card-button-gap);\n    align-items: center;\n    pointer-events: none;\n    user-select: none;\n  }\n\n  &__button {\n    position: relative;\n    z-index: 1;\n    width: var(--card-button-width) !important;\n    height: var(--card-button-height) !important;\n    color: inherit;\n    transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;\n\n    &--disabled {\n      pointer-events: none;\n    }\n  }\n\n  &__price {\n    font-size: 12px;\n    font-weight: 800;\n    line-height: 16px;\n    white-space: nowrap;\n    transition: color 0.2s ease-in-out;\n\n    @include media('>=desktop-mini') {\n      font-size: 16px;\n      line-height: 20px;\n    }\n  }\n\n  &__old-price {\n    font-size: 12px;\n    font-weight: 600;\n    line-height: 16px;\n    color: var(--ui-dark-grey);\n    text-decoration: line-through;\n    white-space: nowrap;\n\n    @include media('>=desktop-mini') {\n      font-size: 14px;\n      line-height: 18px;\n    }\n  }\n\n  /* Modifiers */\n  &--active {\n    color: var(--ui-white);\n    cursor: auto;\n    background-color: var(--ui-primary);\n    box-shadow: none;\n\n    .app-card-button__wrapper {\n      margin: 0 auto;\n    }\n  }\n\n  &--type-selection {\n    height: 40px;\n  }\n\n  &--type-simple {\n    height: 40px;\n  }\n\n  &--type-gift {\n    --card-button-width: 100%;\n    --card-button-height: 40px;\n\n    height: 40px;\n  }\n\n  &--type-extras {\n    --card-button-gap: 4px;\n    --card-button-width: 32px;\n    --card-button-height: 32px;\n\n    height: 32px;\n\n    @include media('>=desktop-mini') {\n      --card-button-gap: 8px;\n      --card-button-width: 40px;\n      --card-button-height: 40px;\n\n      height: 40px;\n    }\n  }\n}\n</style>\n"],"names":["CardButtonTypes","props","__props","emit","__emit","componentClasses","computed","classes","pricePrefix","priceValue","oldPriceValue","appendIconName","isGiftType","showRemoveButton","showAddButton","onClickRoot"],"mappings":";;gdAAkB,IAAAA,GAAAA,IAChBA,EAAA,UAAY,YACZA,EAAA,OAAS,SACTA,EAAA,OAAS,SACTA,EAAA,KAAO,OAJSA,IAAAA,GAAA,CAAA,CAAA,wYCalB,MAAMC,EAAQC,EAMRC,EAAOC,EAEPC,EAAmBC,EAAS,IAAM,CACtC,MAAMC,EAAU,CAAC,kBAAmB,yBAAyBN,EAAM,IAAI,EAAE,EAEzE,OAAIA,EAAM,UAAkBM,EAAA,KAAK,yBAAyB,EAEnDA,CAAA,CACR,EAEKC,EAAcF,EAAS,IACvBL,EAAM,OAASD,EAAgB,UAAkB,MAE9C,EACR,EAEKS,EAAaH,EAAS,IACnB,GAAGE,EAAY,KAAK,GAAGP,EAAM,KAAK,IAAIA,EAAM,QAAQ,EAC5D,EAEKS,EAAgBJ,EAAS,IACtB,GAAGL,EAAM,QAAQ,IAAIA,EAAM,QAAQ,EAC3C,EAEKU,EAAiBL,EAAS,IAC1BL,EAAM,OAASD,EAAgB,MAAQC,EAAM,SAAiB,OAE9DA,EAAM,OAASD,EAAgB,WAAaC,EAAM,UAE5B,CACxBD,EAAgB,OAChBA,EAAgB,OAChBA,EAAgB,IAClB,EAEc,SAASC,EAAM,IAAI,EAAU,OAEpC,aACR,EAEKW,EAAaN,EAAS,IAAML,EAAM,OAASD,EAAgB,IAAI,EAE/Da,EAAmBP,EAAS,IACzBL,EAAM,UAAY,CAACW,EAAW,KACtC,EAEKE,EAAgBR,EAAS,IACtBL,EAAM,UAAYW,EAAW,KACrC,EAEKG,EAAc,IAAM,CACnBd,EAAM,UAAUE,EAAK,OAAO,CACnC","debug_id":"efb9e4a3-46c1-58ac-9771-dccebbdbbebb"}