@skyservice-developers/vue-dev-kit 1.5.5 → 1.5.7

package/src/vue3/components/DialogNext.vue

@@ -1,15 +1,13 @@
 <template>
   <Teleport to="body">
-    <transition :name="enableAnimation ? 'dialog-slide' : ''">
+    <div
+      v-if="modelValue"
+      class="sky-dialogbox sky-dialogbox-next"
+      :style="[zIndex ? { 'z-index': zIndex } : null]"
+    >
       <div
-        v-if="modelValue"
-        class="sky-dialogbox sky-dialogbox-next"
-        :style="[zIndex ? { 'z-index': zIndex } : null]"
+        class="sky-dialog-overlay"
       >
-        <div
-          class="sky-dialog-overlay"
-          :class="{ 'sky-dialog-animate': enableAnimation }"
-        >
           <div ref="dialogContent" class="sky-dialog-content">
             <!-- Header -->
             <div class="sky-dialog-header">
@@ -54,15 +52,13 @@
             <div
               v-if="showFooter"
               class="sky-dialog-footer"
-              :class="{ 'sky-dialog-footer-animate': enableAnimation }"
             >
               <!-- Порожні блоки ремонтують відображення на windows в додатку, не видаляти! -->
               <slot name="buttons"></slot>
             </div>
           </div>
-        </div>
       </div>
-    </transition>
+    </div>
   </Teleport>
 </template>
 
@@ -104,10 +100,6 @@ const props = defineProps({
     type: String,
     default: "Назад",
   },
-  enableAnimation: {
-    type: Boolean,
-    default: false,
-  },
   closeOnEsc: {
     type: Boolean,
     default: true,
@@ -423,46 +415,6 @@ onUnmounted(() => {
   }
 }
 
-/* Animations */
-.sky-dialog-animate {
-  animation: sky-dialog-slide-in 0.4s ease-in-out;
-}
-
-.sky-dialog-footer-animate {
-  animation: sky-dialog-footer-in 0.4s ease-in-out;
-}
-
-@keyframes sky-dialog-slide-in {
-  0% {
-    opacity: 0;
-    margin-top: -1600px;
-  }
-  100% {
-    opacity: 1;
-    margin-top: 0;
-  }
-}
-
-@keyframes sky-dialog-footer-in {
-  0% {
-    opacity: 0;
-    bottom: -100px;
-  }
-  50% {
-    opacity: 0.25;
-    bottom: -50px;
-  }
-  100% {
-    opacity: 1;
-    bottom: 15px;
-  }
-}
-
-/* Transition */
-.dialog-slide-leave-active {
-  animation: sky-dialog-slide-in 0.4s reverse;
-}
-
 /* iOS safe area */
 @supports (padding-top: env(safe-area-inset-top)) {
   .sky-dialog-header {

package/src/vue3/components/Modal.vue

@@ -1,11 +1,10 @@
 <template>
   <BaseTeleport to="body">
-    <transition>
-      <div
-        v-if="modelValue"
-        class="sky-modal-overlay"
-        @click.self="handleOverlayClick"
-      >
+    <div
+      v-if="modelValue"
+      class="sky-modal-overlay"
+      @click.self="handleOverlayClick"
+    >
         <div class="sky-modal" :style="modalStyle">
           <div class="sky-modal-header">
             <button class="sky-modal-back" @click="close" :title="closeTitle">
@@ -41,7 +40,6 @@
           </div>
         </div>
       </div>
-    </transition>
   </BaseTeleport>
 </template>
 
@@ -233,30 +231,6 @@ onUnmounted(() => {
   margin-left: 10px;
 }
 
-/* Animations */
-.modal-fade-enter-active,
-.modal-fade-leave-active {
-  transition: opacity 0.3s ease;
-}
-
-.modal-fade-enter-active .sky-modal,
-.modal-fade-leave-active .sky-modal {
-  transition: transform 0.3s ease;
-}
-
-.modal-fade-enter-from,
-.modal-fade-leave-to {
-  opacity: 0;
-}
-
-.modal-fade-enter-from .sky-modal {
-  transform: translateY(-20px);
-}
-
-.modal-fade-leave-to .sky-modal {
-  transform: translateY(20px);
-}
-
 /* Responsive */
 @media (min-width: 768px) {
   .sky-modal {

package/src/vue3/components/index.js

@@ -1,8 +1,7 @@
 export { default as Header } from './Header.vue'
 export { default as Dialog } from './Dialog.vue'
-
 export { default as Modal } from './Modal.vue'
-
-export {default as BaseTeleport} from './BaseTeleport.vue'
+export { default as Button } from './Button.vue'
+export { default as BaseTeleport } from './BaseTeleport.vue'