@helpwave/hightide 0.6.3 → 0.6.4

package/dist/style/globals.css

@@ -820,22 +820,6 @@
   .transform {
     transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
   }
-  .animate-wave-big-left-up {
-    animation: bigLeftUp 1.7s ease-in infinite normal;
-    -webkit-animation: bigLeftUp 1.7s ease-in infinite normal;
-  }
-  .animate-wave-big-right-down {
-    animation: bigRightDown 1.7s ease-in infinite reverse;
-    -webkit-animation: bigRightDown 1.7s ease-in infinite reverse;
-  }
-  .animate-wave-small-left-up {
-    animation: smallLeftUp 1.7s ease-in infinite normal;
-    -webkit-animation: smallLeftUp 1.7s ease-in infinite normal;
-  }
-  .animate-wave-small-right-down {
-    animation: smallRightDown 1.7s ease-in infinite reverse;
-    -webkit-animation: smallRightDown 1.7s ease-in infinite reverse;
-  }
   .animate-bounce {
     animation: var(--animate-bounce);
   }
@@ -848,6 +832,18 @@
   .animate-pulse {
     animation: var(--animate-pulse);
   }
+  .animate-wave-big-left-up {
+    animation: bigLeftUp 1.7s ease-in infinite normal;
+  }
+  .animate-wave-big-right-down {
+    animation: bigRightDown 1.7s ease-in infinite reverse;
+  }
+  .animate-wave-small-left-up {
+    animation: smallLeftUp 1.7s ease-in infinite normal;
+  }
+  .animate-wave-small-right-down {
+    animation: smallRightDown 1.7s ease-in infinite reverse;
+  }
   .input-element {
     &:focus-visible {
       border-style: var(--tw-border-style);
@@ -1653,6 +1649,10 @@
       outline-color: color-mix(in oklab, var(--color-white) 20%, transparent);
     }
   }
+  .blur {
+    --tw-blur: blur(8px);
+    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
+  }
   .invert {
     --tw-invert: invert(100%);
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
@@ -2083,14 +2083,6 @@
     opacity: 1;
   }
 }
-@-webkit-keyframes bigLeftUp {
-  0%, 25% {
-    stroke-dashoffset: 1000;
-  }
-  50%, 75%, 100% {
-    stroke-dashoffset: 0;
-  }
-}
 @keyframes bigLeftUp {
   0%, 25% {
     stroke-dashoffset: 1000;
@@ -2099,14 +2091,6 @@
     stroke-dashoffset: 0;
   }
 }
-@-webkit-keyframes bigRightDown {
-  0%, 25%, 50% {
-    stroke-dashoffset: 0;
-  }
-  75%, 100% {
-    stroke-dashoffset: -1000;
-  }
-}
 @keyframes bigRightDown {
   0%, 25%, 50% {
     stroke-dashoffset: 0;
@@ -2115,14 +2099,6 @@
     stroke-dashoffset: -1000;
   }
 }
-@-webkit-keyframes smallLeftUp {
-  0%, 25%, 50% {
-    stroke-dashoffset: 1000;
-  }
-  75%, 100% {
-    stroke-dashoffset: 0;
-  }
-}
 @keyframes smallLeftUp {
   0%, 25%, 50% {
     stroke-dashoffset: 1000;
@@ -2131,14 +2107,6 @@
     stroke-dashoffset: 0;
   }
 }
-@-webkit-keyframes smallRightDown {
-  0%, 25% {
-    stroke-dashoffset: 0;
-  }
-  50%, 75%, 100% {
-    stroke-dashoffset: -1000;
-  }
-}
 @keyframes smallRightDown {
   0%, 25% {
     stroke-dashoffset: 0;
@@ -4062,14 +4030,10 @@
     font-weight: var(--font-weight-semibold);
     color: var(--color-tooltip-text);
     &[data-state="opening"] {
-      animation: fade-in var(--animation-duration-in, 250ms) ease-in-out 1 forwards;
-      -webkit-animation: fade-in var(--animation-duration-in, 250ms) ease-in-out 1 forwards;
-      opacity: 0%;
+      animation: fade-in calc(var(--animation-duration-in, 250ms) * 2) ease-in-out 1 forwards;
     }
     &[data-state="closing"] {
-      animation: fade-in var(--animation-duration-in, 170ms) ease-in-out 1 reverse forwards;
-      -webkit-animation: fade-in var(--animation-duration-in, 170ms) ease-in-out 1 reverse forwards;
-      opacity: 0%;
+      animation: fade-in var(--animation-duration-out, 170ms) ease-in-out 1 reverse forwards;
     }
     &[data-state="closed"] {
       opacity: 0%;
@@ -4081,14 +4045,10 @@
     width: calc(var(--spacing) * 0);
     --triangle-size: calc(1.5 * var(--spacing));
     &[data-state="opening"] {
-      animation: fade-in var(--animation-duration-in, 250ms) ease-in-out 1 forwards;
-      -webkit-animation: fade-in var(--animation-duration-in, 250ms) ease-in-out 1 forwards;
-      opacity: 0%;
+      animation: fade-in calc(var(--animation-duration-in, 250ms) * 2) ease-in-out 1 forwards;
     }
     &[data-state="closing"] {
-      animation: fade-in var(--animation-duration-in, 170ms) ease-in-out 1 reverse forwards;
-      -webkit-animation: fade-in var(--animation-duration-in, 170ms) ease-in-out 1 reverse forwards;
-      opacity: 0%;
+      animation: fade-in var(--animation-duration-out, 170ms) ease-in-out 1 reverse forwards;
     }
     &[data-state="closed"] {
       opacity: 0%;

package/dist/style/uncompiled/theme/components/tooltip.css

@@ -1,13 +1,22 @@
+@utility animate-tooltip-fade-in {
+  animation: fade-in calc(var(--animation-duration-in, 250ms) * 2) ease-in-out 1 forwards;
+}
+
+@utility animate-tooltip-fade-out {
+  animation: fade-in var(--animation-duration-out, 170ms) ease-in-out 1 reverse
+  forwards;
+}
+
 @layer components {
   [data-name="tooltip"] {
     @apply absolute px-2 py-1 rounded shadow-around-md;
     @apply text-xs font-semibold text-tooltip-text bg-tooltip-background;
 
     &[data-state="opening"] {
-      @apply opacity-0 animate-tooltip-fade-in;
+      @apply animate-tooltip-fade-in;
     }
     &[data-state="closing"] {
-      @apply opacity-0 animate-tooltip-fade-out;
+      @apply animate-tooltip-fade-out;
     }
     &[data-state="closed"] {
       @apply opacity-0;
@@ -19,10 +28,10 @@
     --triangle-size: calc(1.5 * var(--spacing));
 
     &[data-state="opening"] {
-      @apply opacity-0 animate-tooltip-fade-in;
+      @apply animate-tooltip-fade-in;
     }
     &[data-state="closing"] {
-      @apply opacity-0 animate-tooltip-fade-out;
+      @apply animate-tooltip-fade-out;
     }
     &[data-state="closed"] {
       @apply opacity-0;

package/dist/style/uncompiled/utitlity/animation.css

@@ -7,17 +7,6 @@
   }
 }
 
-@-webkit-keyframes bigLeftUp {
-  0%,
-  25% {
-    stroke-dashoffset: 1000;
-  }
-  50%,
-  75%,
-  100% {
-    stroke-dashoffset: 0;
-  }
-}
 @keyframes bigLeftUp {
   0%,
   25% {
@@ -30,17 +19,6 @@
   }
 }
 
-@-webkit-keyframes bigRightDown {
-  0%,
-  25%,
-  50% {
-    stroke-dashoffset: 0;
-  }
-  75%,
-  100% {
-    stroke-dashoffset: -1000;
-  }
-}
 @keyframes bigRightDown {
   0%,
   25%,
@@ -53,17 +31,6 @@
   }
 }
 
-@-webkit-keyframes smallLeftUp {
-  0%,
-  25%,
-  50% {
-    stroke-dashoffset: 1000;
-  }
-  75%,
-  100% {
-    stroke-dashoffset: 0;
-  }
-}
 @keyframes smallLeftUp {
   0%,
   25%,
@@ -76,17 +43,6 @@
   }
 }
 
-@-webkit-keyframes smallRightDown {
-  0%,
-  25% {
-    stroke-dashoffset: 0;
-  }
-  50%,
-  75%,
-  100% {
-    stroke-dashoffset: -1000;
-  }
-}
 @keyframes smallRightDown {
   0%,
   25% {
@@ -161,35 +117,18 @@
 
 @utility animate-wave-big-left-up {
   animation: bigLeftUp 1.7s ease-in infinite normal;
-  -webkit-animation: bigLeftUp 1.7s ease-in infinite normal;
 }
 
 @utility animate-wave-big-right-down {
   animation: bigRightDown 1.7s ease-in infinite reverse;
-  -webkit-animation: bigRightDown 1.7s ease-in infinite reverse;
 }
 
 @utility animate-wave-small-left-up {
   animation: smallLeftUp 1.7s ease-in infinite normal;
-  -webkit-animation: smallLeftUp 1.7s ease-in infinite normal;
 }
 
 @utility animate-wave-small-right-down {
   animation: smallRightDown 1.7s ease-in infinite reverse;
-  -webkit-animation: smallRightDown 1.7s ease-in infinite reverse;
-}
-
-@utility animate-tooltip-fade-in {
-  animation: fade-in var(--animation-duration-in, 250ms) ease-in-out 1 forwards;
-  -webkit-animation: fade-in var(--animation-duration-in, 250ms) ease-in-out 1
-    forwards;
-}
-
-@utility animate-tooltip-fade-out {
-  animation: fade-in var(--animation-duration-in, 170ms) ease-in-out 1 reverse
-    forwards;
-  -webkit-animation: fade-in var(--animation-duration-in, 170ms) ease-in-out 1
-    reverse forwards;
 }
 
 @layer utilities {

package/package.json

@@ -7,7 +7,7 @@
     "url": "git+https://github.com/helpwave/hightide.git"
   },
   "license": "MPL-2.0",
-  "version": "0.6.3",
+  "version": "0.6.4",
   "files": [
     "dist"
   ],