{"version":3,"file":"tWmG19X5.js","sources":["../../../../node_modules/@smenaspace/ui-layer/components/radio/constants.ts","../../../../node_modules/@smenaspace/ui-layer/components/radio/Radio.vue","../../../../node_modules/@smenaspace/ui-layer/components/radio/RadioGroup.vue","../../../../node_modules/@smenaspace/ui-layer/components/textarea/Textarea.vue"],"sourcesContent":["export const APP_RADIO_KEY = 'APP_RADIO_KEY'\n","<script setup lang=\"ts\">\nimport type { PrimitivesValue } from '../../types/shared'\nimport type { RadioInjection } from './types'\nimport { APP_RADIO_KEY } from './constants'\n\ntype Props = {\n  value: PrimitivesValue\n  label?: string\n  disabled?: boolean\n}\n\nconst props = defineProps<Props>()\n\nconst componentClasses = computed(() => {\n  const classes = ['app-radio']\n\n  if (props.disabled) classes.push('app-radio--disabled')\n\n  return classes\n})\n\nconst isChecked = computed(() => injection?.selectedValue.value === props.value)\n\nconst onChange = () => injection?.updateValue(props.value)\n\nconst injection = inject<RadioInjection>(APP_RADIO_KEY)\n</script>\n\n<template>\n  <label :class=\"componentClasses\">\n    <input\n      class=\"app-radio__input ui-visually-hidden\"\n      type=\"radio\"\n      :name=\"injection?.name\"\n      :aria-label=\"label\"\n      :aria-disabled=\"disabled\"\n      :checked=\"isChecked\"\n      :disabled=\"disabled\"\n      @change=\"onChange\"\n    />\n\n    <span class=\"app-radio__checkmark\" />\n\n    <span v-if=\"label\" class=\"app-radio__label\">{{ label }}</span>\n\n    <slot />\n  </label>\n</template>\n\n<style lang=\"scss\" scoped>\n.app-radio {\n  display: flex;\n  gap: 10px;\n  align-items: flex-start;\n  padding: 2px;\n  cursor: pointer;\n  user-select: none;\n\n  &--disabled {\n    pointer-events: none;\n    opacity: 0.5;\n  }\n\n  &__label {\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 20px;\n    color: var(--ui-text-primary);\n  }\n\n  &__checkmark {\n    position: relative;\n    width: 20px;\n    height: 20px;\n    border: 2px solid var(--ui-secondary);\n    border-radius: 50%;\n\n    &::before,\n    &::after {\n      position: absolute;\n      content: '';\n      background-color: var(--ui-secondary);\n      border-radius: inherit;\n      opacity: 0;\n      transition: opacity 0.1s linear;\n    }\n\n    &::before {\n      top: -6px;\n      right: -6px;\n      bottom: -6px;\n      left: -6px;\n    }\n\n    &::after {\n      top: 50%;\n      left: 50%;\n      width: 10px;\n      height: 10px;\n      transform: translate(-50%, -50%);\n    }\n\n    &:hover {\n      &::before {\n        opacity: 0.05;\n      }\n    }\n\n    &:active {\n      &::before {\n        opacity: 0.2;\n      }\n    }\n  }\n\n  &__input {\n    &:focus-visible ~ .app-radio__checkmark {\n      &::before {\n        opacity: 0.1;\n      }\n    }\n\n    &:checked ~ .app-radio__checkmark {\n      &::after {\n        opacity: 1;\n      }\n    }\n  }\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { PrimitivesValue } from '../../types/shared'\nimport { APP_RADIO_KEY } from './constants'\n\ntype Props = {\n  modelValue: PrimitivesValue\n  name: string\n}\n\nconst props = defineProps<Props>()\n\nconst emit = defineEmits(['update:model-value'])\n\nconst selectedValue = ref<PrimitivesValue>(props.modelValue)\n\nconst updateValue = (newValue: PrimitivesValue) => {\n  selectedValue.value = newValue\n\n  emit('update:model-value', newValue)\n}\n\nwatch(\n  () => props.modelValue,\n  (newValue) => {\n    selectedValue.value = newValue\n  },\n)\n\nprovide(APP_RADIO_KEY, { selectedValue, updateValue, name: props.name })\n</script>\n\n<template>\n  <div class=\"app-radio-group\" role=\"radiogroup\">\n    <slot />\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.app-radio-group {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n</style>\n","<script setup lang=\"ts\">\ntype Props = {\n  label?: string\n  rows?: string | number\n  placeholder?: string\n  counter?: string | number\n  disabled?: boolean\n  loading?: boolean\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  rows: 2,\n  label: '',\n  placeholder: '',\n  counter: '',\n})\n\nconst attrs = useAttrs()\n\nconst model = defineModel<string>({ default: '' })\n\nconst counterContent = computed(() => {\n  return `${model.value.length}/${props.counter}`\n})\n\nconst fieldStyles = computed(() => {\n  if (attrs.width) {\n    return { width: `${attrs.width}px` }\n  }\n\n  return {}\n})\n</script>\n\n<template>\n  <div class=\"app-textarea\">\n    <div v-if=\"label\" data-test-id=\"textarea-label\" class=\"app-textarea__label\">\n      {{ label }}\n    </div>\n\n    <textarea\n      v-model=\"model\"\n      data-test-id=\"textarea-field\"\n      class=\"app-textarea__field\"\n      :style=\"fieldStyles\"\n      v-bind=\"$attrs\"\n      :placeholder=\"placeholder\"\n      :aria-disabled=\"disabled\"\n      :disabled=\"disabled\"\n      :maxlength=\"counter\"\n      :rows=\"rows\"\n    />\n\n    <div\n      v-if=\"counter\"\n      data-test-id=\"textarea-counter\"\n      class=\"app-textarea__counter\"\n    >\n      {{ counterContent }}\n    </div>\n\n    <div\n      v-if=\"loading\"\n      data-test-id=\"textarea-loader\"\n      class=\"app-textarea__loader\"\n      role=\"progressbar\"\n    >\n      <the-loader variant=\"linear\" />\n    </div>\n  </div>\n</template>\n\n<style scoped lang=\"scss\">\n@import '../../assets/ui-layer/styles/mixins';\n\n.app-textarea {\n  position: relative;\n\n  &__label {\n    margin-bottom: 2px;\n    font-size: 12px;\n    font-weight: 600;\n    line-height: 16px;\n    color: var(--ui-text-primary);\n  }\n\n  &__counter {\n    position: absolute;\n    right: 4px;\n    bottom: -2px;\n    z-index: 1;\n    font-size: 12px;\n    font-weight: 600;\n    line-height: 16px;\n    color: var(--ui-text-secondary);\n    text-align: right;\n    visibility: hidden;\n    user-select: none;\n    opacity: 0;\n    transition: all 0.2s ease-in-out;\n  }\n\n  &__field {\n    position: relative;\n    z-index: 2;\n    display: block;\n    width: 100%;\n    min-height: 58px;\n    padding: 12px 12px 10px;\n    font-family: inherit;\n    font-size: 14px;\n    font-weight: 600;\n    line-height: 18px;\n    color: var(--ui-text-primary);\n    resize: none;\n    background-color: var(--ui-grey);\n    border: none;\n    border-radius: 10px;\n    outline: none;\n    transition: background-color 0.3s ease;\n\n    &:disabled {\n      opacity: 0.5;\n    }\n\n    &:hover {\n      background-color: var(--ui-grey--hover);\n    }\n\n    &:focus,\n    &:focus-visible {\n      & ~ .app-textarea__counter {\n        visibility: visible;\n        opacity: 1;\n        transform: translateY(100%);\n      }\n    }\n\n    &::placeholder {\n      font-size: inherit;\n      font-weight: inherit;\n      line-height: inherit;\n      color: var(--ui-text-secondary);\n    }\n  }\n\n  &__loader {\n    position: absolute;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    height: 2px;\n  }\n}\n</style>\n"],"names":["APP_RADIO_KEY","props","__props","componentClasses","computed","classes","isChecked","injection","onChange","inject","emit","__emit","selectedValue","ref","updateValue","newValue","watch","provide","attrs","useAttrs","model","_useModel","counterContent","fieldStyles"],"mappings":";;4fAAO,MAAMA,EAAgB,2NCW7B,MAAMC,EAAQC,EAERC,EAAmBC,EAAS,IAAM,CAChC,MAAAC,EAAU,CAAC,WAAW,EAE5B,OAAIJ,EAAM,UAAkBI,EAAA,KAAK,qBAAqB,EAE/CA,CAAA,CACR,EAEKC,EAAYF,EAAS,KAAMG,GAAA,YAAAA,EAAW,cAAc,SAAUN,EAAM,KAAK,EAEzEO,EAAW,IAAMD,GAAA,YAAAA,EAAW,YAAYN,EAAM,OAE9CM,EAAYE,EAAuBT,CAAa,4nBChBtD,MAAMC,EAAQC,EAERQ,EAAOC,EAEPC,EAAgBC,EAAqBZ,EAAM,UAAU,EAErDa,EAAeC,GAA8B,CACjDH,EAAc,MAAQG,EAEtBL,EAAK,qBAAsBK,CAAQ,CACrC,EAEA,OAAAC,EACE,IAAMf,EAAM,WACXc,GAAa,CACZH,EAAc,MAAQG,CAAA,CAE1B,EAEAE,EAAQjB,EAAe,CAAE,cAAAY,EAAe,YAAAE,EAAa,KAAMb,EAAM,KAAM,mqBClBvE,MAAMA,EAAQC,EAORgB,EAAQC,EAAS,EAEjBC,EAAQC,EAAmCnB,EAAA,YAAA,EAE3CoB,EAAiBlB,EAAS,IACvB,GAAGgB,EAAM,MAAM,MAAM,IAAInB,EAAM,OAAO,EAC9C,EAEKsB,EAAcnB,EAAS,IACvBc,EAAM,MACD,CAAE,MAAO,GAAGA,EAAM,KAAK,IAAK,EAG9B,CAAC,CACT","debug_id":"0216a4f3-58d0-5434-9cf1-b37a7f05816e"}