@noction/vue-bezier 2.0.0-beta.1 → 2.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019-PRESENT Noction<sales@noction.com>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -9,33 +9,31 @@
 ## Install :coffee:
 
 ```bash
-npm i -S @noction/vue-bezier
+pnpm add @noction/vue-bezier
 ```
 
 ## Local usage :rocket:
 
 ```vue
-<script>
-import { FadeTransition } from '@noction/vue-bezier'
+<script setup>
+import { DissolveTransition } from '@noction/vue-bezier'
+import { ref } from 'vue'
 import '@noction/vue-bezier/styles'
 
-export default {
-  components: {
-    FadeTransition
-  }
-}
+const show = ref(true)
 </script>
 
 <template>
-  <FadeTransition>
-    <div v-show="show" class="box">
-      <p>Fade transition</p>
+  <DissolveTransition :duration="400">
+    <div v-if="show" class="box">
+      <p>Dissolve transition</p>
     </div>
-  </FadeTransition>
+  </DissolveTransition>
 </template>
 ```
 
 ## Global usage
+
 ```js
 import Transitions from '@noction/vue-bezier'
 import { createApp } from 'vue'
@@ -46,58 +44,137 @@ app.use(Transitions)
 ```
 
 ## List of available transitions
-- FadeTransition
-- ZoomCenterTransition
-- ZoomXTransition
-- ZoomYTransition
-- SlideXLeftTransition
-- SlideXRightTransition
-- SlideYUpTransition
-- SlideYDownTransition
-- ScaleTransition
-- CollapseTransition
+
+### Single Element Transitions
+
+- `BlurTransition` - Blur effect with opacity
+- `ClipPathTransition` - Clip path reveal animation
+- `DissolveTransition` - Fade in/out effect
+- `FadeSlideTransition` - Combined fade and slide animation
+- `PushTransition` - Push content in a direction
+- `RotateTransition` - 3D rotation effect
+- `ScaleTransition` - Scale up/down animation
+- `WipeTransition` - Wipe reveal effect
+- `ZoomTransition` - Zoom in/out animation
+
+### List Transitions (TransitionGroup)
+
+- `DissolveListTransition` - Fade effect for lists
+- `ScaleListTransition` - Scale effect for lists
 
 ## Props
 
-|     Prop     | Type               |                               Default                                | Description                                                                                                                                                                               |
-|:------------:|--------------------|:--------------------------------------------------------------------:|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| **duration** | _Number_, _Object_ |                                `300`                                 | Transition duration. Number for specifying the same duration for enter/leave transitions. <br> Object style `{enter: 300, leave: 300}` for specifying explicit durations for enter/leave. |
-|  **group**   | _Boolean_          |                               `false`                                | Whether the component should be a `transition-group` component.                                                                                                                           |
-|   **tag**    | _String_           |                               `'span'`                               | Transition tag, in case the component is a `transition-group.`                                                                                                                            |
-|  **origin**  | _String_           |                                 `''`                                 | [Transform origin property](https://tympanus.net/codrops/css_reference/transform-origin/), can be specified with styles as well but it's shorter with this prop.                          |
-|  **styles**  | _Object_           | `{ animationFillMode: 'both', animationTimingFunction: 'ease-out' }` | Element styles that are applied during transition. These styles are applied on `@beforeEnter` and `@beforeLeave` hooks.                                                                   |
-
-## Group transitions
-Each transition can be used as a `transition-group` by adding the `group` prop to one of the desired transitions.
-```html
-<fade-transition group>
-   <!--keyed children here-->
-</fade-transition>
+|     Prop     | Type               | Default  | Description                                                                                                                                                                                               |
+| :----------: | ------------------ | :------: | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| **duration** | _Number_, _Object_ |  `300`   | Transition duration in milliseconds. Number for specifying the same duration for enter/leave transitions. <br> Object style `{enter: 300, leave: 300}` for specifying explicit durations for enter/leave. |
+|  **delay**   | _Number_, _Object_ |   `0`    | Transition delay in milliseconds. Number for specifying the same delay for enter/leave transitions. <br> Object style `{enter: 0, leave: 100}` for specifying explicit delays for enter/leave.            |
+|   **tag**    | _String_           | `'span'` | Transition tag for List transitions (TransitionGroup components).                                                                                                                                         |
+|  **origin**  | _String_           |   `''`   | [Transform origin property](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-origin), can be specified with styles as well but it's shorter with this prop.                                     |
+|  **styles**  | _Object_           |   `{}`   | Custom CSS styles that are applied during transition. These styles are applied via CSS variables.                                                                                                         |
+
+## Component-Specific Props
+
+Some transitions have additional props for customization:
+
+### ClipPathTransition
+
+|     Prop     |           Type           |  Default   | Description                 |
+| :----------: | :----------------------: | :--------: | --------------------------- |
+| **clipType** | `'circle'` \| `'square'` | `'circle'` | Type of clip path animation |
+
+```vue
+<ClipPathTransition clip-type="square" :duration="1000">
+  <div v-if="show">Content</div>
+</ClipPathTransition>
+```
+
+### PushTransition
+
+|     Prop      |                    Type                     |  Default  | Description                  |
+| :-----------: | :-----------------------------------------: | :-------: | ---------------------------- |
+| **direction** | `'left'` \| `'right'` \| `'up'` \| `'down'` | `'right'` | Direction of the push effect |
+
+```vue
+<PushTransition direction="down" :duration="400">
+  <div v-if="show">Content</div>
+</PushTransition>
+```
+
+### ScaleTransition
+
+|    Prop    |   Type   |   Default    | Description                              |
+| :--------: | :------: | :----------: | ---------------------------------------- |
+| **origin** | _String_ | `'top left'` | Transform origin for the scale animation |
+
+```vue
+<ScaleTransition origin="center" :duration="300">
+  <div v-if="show">Content</div>
+</ScaleTransition>
+```
+
+## List Transitions
+
+For animating lists of elements, use the dedicated List transition components:
+
+```vue
+<script setup>
+import { DissolveListTransition } from '@noction/vue-bezier'
+import { ref } from 'vue'
+import '@noction/vue-bezier/styles'
+
+const items = ref([1, 2, 3, 4, 5])
+</script>
+
+<template>
+  <DissolveListTransition :duration="400" tag="div">
+    <div v-for="item in items" :key="item" class="item">
+      {{ item }}
+    </div>
+  </DissolveListTransition>
+</template>
 ```
-Gotchas/things to watch:
-1. Elements inside `group` transitions should have `display: inline-block` or must be placed in a flex context:
-   [Vue.js docs reference](https://vuejs.org/v2/guide/transitions.html#List-Move-Transitions)
-2. Each transition has a `move` class [move class docs](https://vuejs.org/v2/guide/transitions.html#List-Move-Transitions).
-   Unfortunately the duration for the move transition cannot be configured through props. By default each transition has a `move` class associated
-   with `.3s` transition duration:
-
-- Zoom
-  ```css
-    .zoom-move { transition: transform .3s ease-out; }
-  ```
-- Slide
-  ```css
-    .slide-move { transition: transform .3s ease-out; }
-  ```
-- Scale
-  ```css
-    .scale-move { transition: transform .3s cubic-bezier(.25, .8, .50, 1); }
-  ```
-- Fade
-  ```css
-    .fade-move { transition: transform .3s ease-out; }
-   ```
-If you want to configure the duration, just redefine the class for the transition you use with the desired duration.
+
+**Important notes:**
+
+1. Elements inside list transitions should have `display: inline-block` or must be placed in a flex context: [Vue.js docs reference](https://vuejs.org/guide/built-ins/transition-group.html#move-transitions)
+2. Each list transition has a `move` class for animating position changes. The move duration defaults to `.3s` or `.35s` and cannot be configured via props. To customize, override the CSS class:
+
+```css
+/* Example: Custom move duration for DissolveListTransition */
+.noc-dissolve-move {
+  transition: transform 0.5s ease-out;
+}
+```
+
+## Customizing Transitions
+
+All CSS classes and custom properties are prefixed with `noc-` to prevent naming conflicts with other libraries. You can override any transition styles by targeting the specific classes:
+
+```css
+/* Override dissolve transition timing */
+.noc-dissolve-enter-active {
+  transition: opacity 1s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+/* Override blur transition effect */
+.noc-blur-enter-from {
+  opacity: 0;
+  filter: blur(20px); /* Increase blur intensity */
+}
+
+/* Override scale list move animation */
+.noc-scale-list-move {
+  transition: transform 0.8s cubic-bezier(0.25, 0.8, 0.5, 1);
+}
+```
+
+Available CSS custom properties:
+
+- `--noc-transition-enter-duration`
+- `--noc-transition-leave-duration`
+- `--noc-transition-enter-delay`
+- `--noc-transition-leave-delay`
+- `--noc-transform-origin` (ScaleTransition)
 
 ## License
 

package/dist/types/components/Blur/BlurTransition.vue.d.ts

@@ -0,0 +1,23 @@
+type __VLS_Props = {
+    duration?: number | {
+        enter: number;
+        leave: number;
+    };
+    delay?: number | {
+        enter: number;
+        leave: number;
+    };
+};
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/ClipPath/ClipPathTransition.vue.d.ts

@@ -0,0 +1,17 @@
+import type { ComponentProps } from '../../types';
+type __VLS_Props = ComponentProps & {
+    clipType?: 'circle' | 'square';
+};
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/Dissolve/DissolveListTransition.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps } from '../../types';
+declare var __VLS_12: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_12) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/Dissolve/DissolveTransition.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps } from '../../types';
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/FadeSlide/FadeSlideTransition.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps } from '../../types';
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/Push/PushTransition.vue.d.ts

@@ -0,0 +1,17 @@
+import type { ComponentProps } from '../../types';
+type __VLS_Props = ComponentProps & {
+    direction?: 'left' | 'right' | 'up' | 'down';
+};
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/Rotate/RotateTransition.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps } from '../../types';
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/Scale/ScaleListTransition.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps } from '../../types';
+declare var __VLS_12: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_12) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/Scale/ScaleTransition.vue.d.ts

@@ -1,35 +1,13 @@
-import type { ComponentProps } from '@/types';
-declare function __VLS_template(): {
-    slots: {
-        default?(_: {}): any;
-    };
-    refs: {};
-    attrs: Partial<{}>;
+import type { ComponentProps } from '../../types';
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
 };
-type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<ComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    leave: (el: import("vue").RendererElement, done: () => void) => any;
-    afterEnter: (el: import("vue").RendererElement) => any;
-    afterLeave: (el: import("vue").RendererElement) => any;
-    beforeEnter: (el: import("vue").RendererElement) => any;
-    beforeLeave: (el: import("vue").RendererElement) => any;
-}, string, import("vue").PublicProps, Readonly<ComponentProps> & Readonly<{
-    onLeave?: ((el: import("vue").RendererElement, done: () => void) => any) | undefined;
-    onAfterEnter?: ((el: import("vue").RendererElement) => any) | undefined;
-    onAfterLeave?: ((el: import("vue").RendererElement) => any) | undefined;
-    onBeforeEnter?: ((el: import("vue").RendererElement) => any) | undefined;
-    onBeforeLeave?: ((el: import("vue").RendererElement) => any) | undefined;
-}>, {
-    delay: import("@/types").NumberOrTimings;
-    duration: import("@/types").NumberOrTimings;
-    group: boolean;
-    origin: string;
-    styles: Partial<CSSStyleDeclaration>;
-    tag: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+declare const __VLS_base: import("vue").DefineComponent<ComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
 export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
+type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;
     };

package/dist/types/components/Wipe/WipeTransition.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps } from '../../types';
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/Zoom/ZoomTransition.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps } from '../../types';
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<ComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ComponentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/components/index.d.ts

@@ -1,21 +1,11 @@
-export { default as CollapseTransition } from './Collapse/CollapseTransition.vue';
-export { default as FadeTransition } from './Fade/FadeTransition.vue';
+export { default as BlurTransition } from './Blur/BlurTransition.vue';
+export { default as ClipPathTransition } from './ClipPath/ClipPathTransition.vue';
+export { default as DissolveListTransition } from './Dissolve/DissolveListTransition.vue';
+export { default as DissolveTransition } from './Dissolve/DissolveTransition.vue';
+export { default as FadeSlideTransition } from './FadeSlide/FadeSlideTransition.vue';
+export { default as PushTransition } from './Push/PushTransition.vue';
+export { default as RotateTransition } from './Rotate/RotateTransition.vue';
+export { default as ScaleListTransition } from './Scale/ScaleListTransition.vue';
 export { default as ScaleTransition } from './Scale/ScaleTransition.vue';
-export { default as SlideXLeftTransition } from './Slide/SlideXLeftTransition.vue';
-export { default as SlideXRightTransition } from './Slide/SlideXRightTransition.vue';
-export { default as SlideYDownTransition } from './Slide/SlideYDownTransition.vue';
-export { default as SlideYUpTransition } from './Slide/SlideYUpTransition.vue';
-export { default as BlurTransition } from './v2/Blur/BlurTransition.vue';
-export { default as ClipPathTransition } from './v2/ClipPath/ClipPathTransition.vue';
-export { default as DissolveListTransition } from './v2/Dissolve/DissolveListTransition.vue';
-export { default as DissolveTransition } from './v2/Dissolve/DissolveTransition.vue';
-export { default as FadeSlideTransition } from './v2/FadeSlide/FadeSlideTransition.vue';
-export { default as PushTransition } from './v2/Push/PushTransition.vue';
-export { default as RotateTransition } from './v2/Rotate/RotateTransition.vue';
-export { default as ScaleListTransition } from './v2/Scale/ScaleListTransition.vue';
-export { default as WipeTransition } from './v2/Wipe/WipeTransition.vue';
-export { default as ZoomTransition } from './v2/Zoom/ZoomTransition.vue';
-export { default as ZoomCenterTransition } from './Zoom/ZoomCenterTransition.vue';
-export { default as ZoomUpTransition } from './Zoom/ZoomUpTransition.vue';
-export { default as ZoomXTransition } from './Zoom/ZoomXTransition.vue';
-export { default as ZoomYTransition } from './Zoom/ZoomYTransition.vue';
+export { default as WipeTransition } from './Wipe/WipeTransition.vue';
+export { default as ZoomTransition } from './Zoom/ZoomTransition.vue';

package/dist/vue-bezier.css

@@ -0,0 +1,2 @@
+@property --noc-transition-enter-duration{syntax:"<time>";inherits:false;initial-value:.5s}@property --noc-transition-leave-duration{syntax:"<time>";inherits:false;initial-value:.5s}@property --noc-transition-enter-delay{syntax:"<time>";inherits:false;initial-value:0s}@property --noc-transition-leave-delay{syntax:"<time>";inherits:false;initial-value:0s}.noc-blur-enter-active[data-v-fec99d84],.noc-blur-leave-active[data-v-fec99d84]{transition:all var(--noc-transition-enter-duration)ease var(--noc-transition-enter-delay);will-change:opacity,filter;position:absolute;inset-block-start:0;inset-inline-start:0}.noc-blur-leave-active[data-v-fec99d84]{transition:all var(--noc-transition-leave-duration)ease var(--noc-transition-leave-delay)}.noc-blur-enter-from[data-v-fec99d84]{opacity:0;filter:blur(8px)}.noc-blur-enter-to[data-v-fec99d84],.noc-blur-leave-from[data-v-fec99d84]{opacity:1;filter:blur()}.noc-blur-leave-to[data-v-fec99d84]{opacity:0;filter:blur(8px)}.noc-clip-enter-active[data-v-65f5f5ac]{transition:all var(--noc-transition-enter-duration)ease-in var(--noc-transition-enter-delay);position:relative}.noc-clip-leave-active[data-v-65f5f5ac]{transition:all calc(var(--noc-transition-leave-duration) - 10ms)linear calc(var(--noc-transition-leave-delay));position:absolute}.noc-clip-circle.noc-clip-enter-from[data-v-65f5f5ac]{clip-path:circle(0%)}.noc-clip-circle.noc-clip-enter-to[data-v-65f5f5ac]{clip-path:circle(100%)}.noc-clip-square.noc-clip-enter-from[data-v-65f5f5ac]{clip-path:polygon(50% 50%,50% 50%,50% 50%,50% 50%)}.noc-clip-square.noc-clip-enter-to[data-v-65f5f5ac]{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.noc-dissolve-list>*{--noc-transition-enter-duration:inherit;--noc-transition-leave-duration:inherit;--noc-transition-enter-delay:inherit;--noc-transition-leave-delay:inherit}.noc-dissolve-enter-active{transition:opacity var(--noc-transition-enter-duration)ease var(--noc-transition-enter-delay);will-change:opacity}.noc-dissolve-leave-active{backface-visibility:hidden;transition:opacity var(--noc-transition-leave-duration)ease var(--noc-transition-leave-delay);will-change:opacity;position:absolute}.noc-dissolve-enter-from,.noc-dissolve-leave-to{opacity:0}.noc-dissolve-enter-to,.noc-dissolve-leave-from{opacity:1}.noc-dissolve-move{transition:transform var(--noc-transition-enter-duration)ease-out var(--noc-transition-enter-delay)}.noc-dissolve-enter-active[data-v-a98e0a99]{backface-visibility:hidden;transition:opacity var(--noc-transition-enter-duration)ease var(--noc-transition-enter-delay);will-change:opacity;position:absolute;inset-block-start:0;inset-inline-start:0}.noc-dissolve-leave-active[data-v-a98e0a99]{backface-visibility:hidden;transition:opacity var(--noc-transition-leave-duration)ease var(--noc-transition-leave-delay);will-change:opacity;position:absolute;inset-block-start:0;inset-inline-start:0}.noc-dissolve-enter-from[data-v-a98e0a99],.noc-dissolve-leave-to[data-v-a98e0a99]{opacity:0}.noc-dissolve-enter-to[data-v-a98e0a99],.noc-dissolve-leave-from[data-v-a98e0a99]{opacity:1}.noc-fade-slide-enter-active[data-v-475efc48],.noc-fade-slide-leave-active[data-v-475efc48]{backface-visibility:hidden;transition:all var(--noc-transition-enter-duration)ease var(--noc-transition-enter-delay);position:absolute;inset-block-start:0;inset-inline-start:0}.noc-fade-slide-leave-active[data-v-475efc48]{backface-visibility:hidden;transition:all var(--noc-transition-leave-duration)ease var(--noc-transition-leave-delay)}.noc-fade-slide-enter-from[data-v-475efc48]{opacity:0;transform:translateY(.5rem)}.noc-fade-slide-enter-to[data-v-475efc48],.noc-fade-slide-leave-from[data-v-475efc48]{opacity:1;transform:translateY(0)}.noc-fade-slide-leave-to[data-v-475efc48]{opacity:0;transform:translateY(.5rem)}.noc-push-enter-active[data-v-2822b81a],.noc-push-leave-active[data-v-2822b81a]{backface-visibility:hidden;transition:opacity var(--noc-transition-enter-duration)ease var(--noc-transition-enter-delay),transform var(--noc-transition-enter-duration)ease var(--noc-transition-enter-delay);will-change:opacity,transform;position:absolute;inset-block-start:0;inset-inline-start:0}.noc-push-leave-active[data-v-2822b81a]{backface-visibility:hidden;transition:opacity var(--noc-transition-leave-duration)ease var(--noc-transition-leave-delay),transform var(--noc-transition-leave-duration)ease var(--noc-transition-leave-delay)}.noc-push-enter-to[data-v-2822b81a],.noc-push-leave-from[data-v-2822b81a]{opacity:1;transform:translate(0)}.noc-push-left.noc-push-enter-from[data-v-2822b81a]{opacity:0;transform:translate(100%)}.noc-push-left.noc-push-leave-to[data-v-2822b81a],.noc-push-right.noc-push-enter-from[data-v-2822b81a]{opacity:0;transform:translate(-100%)}.noc-push-right.noc-push-leave-to[data-v-2822b81a]{opacity:0;transform:translate(100%)}.noc-push-up.noc-push-enter-from[data-v-2822b81a]{opacity:0;transform:translateY(100%)}.noc-push-up.noc-push-leave-to[data-v-2822b81a],.noc-push-down.noc-push-enter-from[data-v-2822b81a]{opacity:0;transform:translateY(-100%)}.noc-push-down.noc-push-leave-to[data-v-2822b81a]{opacity:0;transform:translateY(100%)}.noc-rotate-enter-active[data-v-c4785237],.noc-rotate-leave-active[data-v-c4785237]{transition:all var(--noc-transition-enter-duration)linear var(--noc-transition-enter-delay)}.noc-rotate-leave-active[data-v-c4785237]{transition:all var(--noc-transition-leave-duration)linear var(--noc-transition-leave-delay)}.noc-rotate-enter-from[data-v-c4785237]{opacity:1;filter:blur(4px);transform:rotate(12deg)}.noc-rotate-enter-to[data-v-c4785237],.noc-rotate-leave-from[data-v-c4785237]{opacity:1;filter:blur();transform:rotate(0)}.noc-rotate-leave-to[data-v-c4785237]{opacity:1;filter:blur(4px);transform:rotate(12deg)}.noc-scale-list>*{--noc-transition-enter-duration:inherit;--noc-transition-leave-duration:inherit;--noc-transition-enter-delay:inherit;--noc-transition-leave-delay:inherit}.noc-scale-list-enter-active{transition:opacity var(--noc-transition-enter-duration)ease var(--noc-transition-enter-delay),transform var(--noc-transition-enter-duration)ease var(--noc-transition-enter-delay);will-change:opacity,transform}.noc-scale-list-leave-active{backface-visibility:hidden;transition:opacity var(--noc-transition-leave-duration)ease var(--noc-transition-leave-delay),transform var(--noc-transition-leave-duration)ease var(--noc-transition-leave-delay);will-change:opacity,transform;position:absolute}.noc-scale-list-enter-from,.noc-scale-list-leave-to{opacity:0;transform:scale(0)}.noc-scale-list-enter-to,.noc-scale-list-leave-from{opacity:1;transform:scale(1)}.noc-scale-list-move{transition:transform var(--noc-transition-enter-duration)ease-out var(--noc-transition-enter-delay)}.noc-scale-enter-active[data-v-f5da5408],.noc-scale-leave-active[data-v-f5da5408]{transform-origin:var(--noc-transform-origin,top left);transition:all var(--noc-transition-enter-duration)ease-out var(--noc-transition-enter-delay);will-change:opacity,transform}.noc-scale-leave-active[data-v-f5da5408]{transition:all var(--noc-transition-leave-duration)ease-out var(--noc-transition-leave-delay)}.noc-scale-enter-from[data-v-f5da5408]{opacity:0;transform:scale(0)}.noc-scale-enter-to[data-v-f5da5408],.noc-scale-leave-from[data-v-f5da5408]{opacity:1;transform:scale(1)}.noc-scale-leave-to[data-v-f5da5408]{opacity:0;transform:scale(0)}.noc-scale-move[data-v-f5da5408]{transition:transform .3s cubic-bezier(.25,.8,.5,1)}.noc-wipe-enter-active[data-v-41990a90]{z-index:10;transition:transform var(--noc-transition-enter-duration)ease-out var(--noc-transition-enter-delay)}.noc-wipe-leave-active[data-v-41990a90]{transition:transform calc(var(--noc-transition-leave-duration) - 10ms)ease var(--noc-transition-leave-delay);position:absolute}.noc-wipe-enter-from[data-v-41990a90]{transform:translate(-100%)}.noc-wipe-enter-to[data-v-41990a90]{transform:translate(0)}.noc-zoom-enter-active[data-v-6112c8a6],.noc-zoom-leave-active[data-v-6112c8a6]{transition:transform var(--noc-transition-enter-duration)ease var(--noc-transition-enter-delay);will-change:transform;position:absolute;inset-block-start:0;inset-inline-start:0}.noc-zoom-leave-active[data-v-6112c8a6]{transition:transform var(--noc-transition-leave-duration)ease var(--noc-transition-leave-delay)}.noc-zoom-enter-from[data-v-6112c8a6],.noc-zoom-leave-to[data-v-6112c8a6]{transform:scale(1.05)}.noc-zoom-enter-to[data-v-6112c8a6],.noc-zoom-leave-from[data-v-6112c8a6]{transform:scale(1)}
+/*$vite$:1*/