WIP Улучшен textarea

src/pages/clients/components/ClientDetailInput.vue

@@ -2,14 +2,14 @@
   .input-wrapper.flex.gap-x-2.px-3.box-border.w-max-fit(class="py-2.5")
     textarea.place-input.w-full.outline-0.text-sm.not-italic.resize-none.font-medium(
       v-if="!sharp"
-      :rows="Math.ceil(value.length/heightInput)",
+      :rows="textareaRows",
       :value="value",
+      :cols="24",
       @input="$emit('update:value', $event.target.value)",
       :placeholder="placeholder",
     )
     input.place-input.w-full.outline-0.text-sm.not-italic.resize-none.font-medium(
       v-else,
-      :rows="Math.ceil(value.length/heightInput)",
       :value="value",
       @input="$emit('update:value', $event.target.value)",
       :placeholder="placeholder",
@@ -29,12 +29,17 @@ export default {
     placeholder: {
       default: "Поиск",
     },
+    rows: Number,
   },
   directives: { mask },
   computed: {
     heightInput() {
       return ((this.width / 100) * 70) / 11;
     },
+    textareaRows() {
+      if (this.value.length <= 22) return this.rows;
+      return Math.ceil(this.value.length / 22);
+    },
   },
 };
 </script>
@@ -44,4 +49,6 @@ export default {
   border: 2px solid var(--border-light-grey-color)
   border-radius: 4px
   background-color: var(--default-white)
+textarea
+  overflow: hidden
 </style>