@bagelink/vue 0.0.140 → 0.0.145

package/src/styles/transitions.css

@@ -0,0 +1,47 @@
+:root {
+    --transition-ease-in: cubic-bezier(0.1, 0.5, 0.33, 1);
+    --transition-ease-out: cubic-bezier(1, 0.33, 0.5, 0.1);
+}
+
+.fade-enter-active {
+    transition: all 0.2s ease-out;
+}
+
+.fade-leave-active {
+    transition: all 0.2s ease-in;
+}
+
+.fade-enter-from,
+.fade-leave-to {
+    opacity: 0;
+}
+
+.scale-enter-active {
+    transition: all 0.2s var(--transition-ease-in);
+}
+
+.scale-leave-active {
+    transition: all 0.2s var(--transition-ease-out);
+}
+
+.scale-enter-from,
+.scale-leave-to {
+    transform: scale(0);
+}
+
+.list-enter-active,
+.list-leave-active {
+    /*transition: all 0.5s ease;*/
+}
+
+.list-enter-from,
+.list-leave-to {
+    opacity: 0;
+    transform: scaleY(0) translateX(30px);
+}
+
+/* ensure leaving items are taken out of layout flow so that moving
+   animations can be calculated correctly. */
+.list-leave-active {
+    position: absolute;
+}

package/src/utils/index.ts

@@ -50,4 +50,10 @@ export const useFormkit = () => {
 
 export const initials = (...strArr: string[]) => strArr.map((str) => str?.charAt(0)).join('');
 
+export function useEscape(event: KeyboardEvent, closeModel: () => void) {
+	if (event.key === 'Escape') {
+		closeModel();
+	}
+}
+
 export { formatString } from './strings';