plugin-ui-for-kzt 0.0.30 → 0.0.32

package/src/components/BaseInputPhone/BaseInputPhone.vue

@@ -137,7 +137,7 @@ const handleInput = (value: string) => {
     &.--small-size {
         #{$input} {
             :deep(.base-select) {
-                width: 71px;
+                width: auto;
             }
         }
     }
@@ -145,7 +145,7 @@ const handleInput = (value: string) => {
     &.--medium-size {
         #{$input} {
             &__select {
-                width: 75px;
+                width: auto;
             }
         }
     }
@@ -153,7 +153,7 @@ const handleInput = (value: string) => {
     &.--large-size {
         #{$input} {
             &__select {
-                width: 87px;
+                width: auto;
             }
         }
     }

package/src/components/BaseModal/BaseModal.vue

@@ -67,7 +67,6 @@ const handleOverlayClick = (id: string) => {
 .base-modal {
   background: var(--primary-black-white);
   border-radius: var(--corner-radius-m);
-  overflow: hidden;
   min-width: 335px;
   transform: scale(0.7);
   animation: slideIn 0.3s ease forwards;
@@ -130,8 +129,7 @@ const handleOverlayClick = (id: string) => {
   }
 
   &__content {
-    max-height: 70vh;
-    overflow-y: auto;
+    max-height: 80vh;
     color: var(--primary-text-tertiary);
     font: var(--typography-text-s-regular);
 

package/src/components/BaseSelect/BaseSelect.vue

@@ -8,7 +8,6 @@
         :disabled="actualDisabled"
       >
         <template #top>
-          <!-- Старый header для дефолтного поведения -->
           <div
             v-if="!searchable"
             :data-error="Boolean(error)"
@@ -19,7 +18,16 @@
               name="header"
               :value="actualOption ? [actualOption] : undefined"
             >
-              <div v-if="$slots.headerIcon" class="base-select__header_prefix_icon">
+              <div 
+                v-if="actualOption?.icon && $slots.iconItem" 
+                class="base-select__header_prefix_icon"
+              >
+                <slot name="iconItem" :item="actualOption" />
+              </div>
+              <div 
+                v-else-if="$slots.headerIcon" 
+                class="base-select__header_prefix_icon"
+              >
                 <slot name="headerIcon" />
               </div>
 
@@ -100,7 +108,7 @@
                   <div class="base-select__item-wrapper">
                     <base-opened-list-item
                       v-bind="listItemAttrs(item)"
-                      :key="item.id"
+                      :key="String(item.id ?? '')"
                       :size="size"
                     >
                       <template #icon>
@@ -168,10 +176,17 @@ const displayValue = computed(() => {
 });
 
 watch(() => props.modelValue, (val) => {
-  actualValue.value = val ?? '';
+  if (val && typeof val === 'object' && 'id' in val) {
+    actualValue.value = (val as ICoreSelectOption).id as TSelectValue;
+  } else {
+    actualValue.value = val ?? '';
+  }
 }, { immediate: true });
 
 function handleInput(value: TSelectValue) {
+  if (props.readonly || props.disabled) {
+    return;
+  }
   actualValue.value = value;
   emit('update:modelValue', value);
   emit('change', value);
@@ -180,6 +195,9 @@ function handleInput(value: TSelectValue) {
 }
 
 function handleInputChange(event: Event) {
+  if (props.readonly || props.disabled) {
+    return;
+  }
   const target = event.target as HTMLInputElement;
   const inputValue = target.value;
   searchQuery.value = inputValue;
@@ -203,6 +221,9 @@ function handleInputChange(event: Event) {
 }
 
 function handleIconClick(event: Event) {
+  if (props.readonly || props.disabled) {
+    return;
+  }
   event.stopPropagation();
   if (actualOption.value) {
     handleInput('');
@@ -245,7 +266,7 @@ const { sizeClassList } = useKitSize(props);
 const { stateClassList } = useKitState(props);
 const { styleClassList } = useKitStyle(props);
 
-const listItemAttrs = computed(() => (item: ICoreSelectBaseProps) => ({
+const listItemAttrs = computed(() => (item: ICoreSelectOption) => ({
   icon: item.icon,
   active: actualValue.value === item.id,
   title: item.name || '',
@@ -267,7 +288,7 @@ const classList = computed(() => [
 
 defineSlots<{
   default(props: ISelectSlotProps): any;
-  iconItem(props: { item: ICoreSelectBaseProps }): any;
+  iconItem(props: { item: ICoreSelectOption }): any;
   header(props: { value: ICoreSelectProps['options'] }): any;
   headerIcon(): any;
   empty(): any;
@@ -485,10 +506,16 @@ defineSlots<{
     #{$select} {
       &__header {
         pointer-events: none;
+        cursor: default;
       }
 
       &__input {
         pointer-events: none;
+        cursor: default;
+      }
+
+      &__arrow-wrapper {
+        display: none;
       }
     }
   }

package/src/components/BaseSwiper/BaseSwiper.vue

@@ -100,15 +100,20 @@ const nextSlide = () => {
     }
 };
 
+const nextSlideCyclic = () => {
+    if (currentSlide.value >= props.images.length - 1) {
+        currentSlide.value = 0;
+    } else {
+        currentSlide.value += 1;
+    }
+};
+
 let autoplayIntervalId: ReturnType<typeof setInterval> | null = null;
 
 const startAutoplay = () => {
     if (props.autoplay && !autoplayIntervalId) {
         autoplayIntervalId = setInterval(() => {
-        nextSlide();
-        if (currentSlide.value >= props.images.length - 1) {
-            currentSlide.value = 0; // Возвращаемся к первому слайду
-        }
+            nextSlideCyclic();
         }, props.autoplayInterval);
     }
 };

package/src/components/BaseTextarea/BaseTextarea.vue

@@ -8,6 +8,7 @@
           v-bind="stateAttrs"
           :placeholder="placeholder || ''"
           :maxlength="maxLength"
+          :readonly="readonly"
           class="base-textarea__field"
           @input="handleInput"
         />

package/src/types/calendar.d.ts

@@ -9,11 +9,14 @@ export interface IBaseCalendarProps {
   modelValue?: DateRange
   range?: boolean | RangeConfig | undefined
   minDate?: Date | null
+  maxDate?: Date | null
   readonly?: boolean
   error?: string | boolean
   inline?: boolean;
 }
 
-export type TCoreCalendarProps = IBaseCalendarProps & ICoreSize;
+export type TCoreCalendarProps = IBaseCalendarProps & ICoreSize & ICoreState;
 
-export type TCoreInputCalendarProps = InputProps & ICoreSize & ICoreState & IBaseCalendarProps;
+export type TCoreInputCalendarProps = Omit<InputProps, 'modelValue'> & ICoreSize & ICoreState & IBaseCalendarProps & {
+  modelValue?: string | DateRange;
+};

package/src/types/default-pages.d.ts

@@ -3,4 +3,5 @@ export interface IDefaultPagesProps {
     description: string;
     buttonText: string;
     type: 'tech-work' | '404'
+    imagePath: string;
 }

package/src/types/input.d.ts

@@ -26,7 +26,7 @@ export type ICoreTextareaProps = ICoreState & TTextareaProps & ICoreSize;
 export type TSelectValue = Nullable<string | number | boolean>;
 
 type TOptionPhoneCountry = 'KZ' | 'RU' | 'KG' | 'UZ';
-type TOptionCurrency = 'KZT' | 'RUB' | 'KGS' | 'UZS';
+type TOptionCurrency = 'KZT' | 'RUB' | 'KGS' | 'UZS' | string;
 export interface IOptionsSelect<T extends string> {
   id: string;
   name: string;
@@ -67,7 +67,7 @@ export interface ICoreSelectBaseProps {
 }
 
 export interface ISelectSlotProps {
-  item: ICoreSelectBaseProps;
+  item: ICoreSelectOption;
   index: number;
   active: boolean;
 }

package/webpack.config.js

@@ -61,6 +61,10 @@ module.exports = (env, argv) => {
                 extract: true,
                 spriteFilename: "sprite.svg",
                 publicPath: isProduction ? "./" : "/",
+                symbolId: (filePath) => {
+                  const fileName = path.basename(filePath, ".svg");
+                  return fileName;
+                },
               },
             },
             {