wip better fade

packages/bbui/src/Tooltip/Context.svelte

@@ -50,15 +50,22 @@
       const fadeIn = [{ opacity: "0" }, { opacity: "1" }];
       const fadeOut = [{ opacity: "1" }, { opacity: "0" }];
 
-      const fadeTiming = {
+      const fadeInTiming = {
-        duration: 200,
+        duration: 150,
+        delay: 150,
+        iterations: 1,
+        easing: "ease-in",
+        fill: "both"
+      };
+      const fadeOutTiming = {
+        duration: 150,
         iterations: 1,
         easing: "ease-in",
         fill: "forwards"
       };
 
-      currentTooltip.animate(fadeIn, fadeTiming);
+      currentTooltip.animate(fadeIn, fadeInTiming);
-      previousTooltip.animate(fadeOut, fadeTiming);
+      previousTooltip.animate(fadeOut, fadeOutTiming);
 
       // Bypass animations if the tooltip has only just been opened
       if (initialShow) {

packages/builder/src/components/design/settings/controls/MultiFieldSelect.svelte

@@ -76,18 +76,6 @@
     dispatch("change", boundValue)
   }
 
-  const foo = () => {
-    /*
-    const support = fieldSupport[option]?.support;
-
-    if (support == null) return null;
-    if (support === supported) return null
-
-    if (support === partialSupport) return "AlertCircleFilled"
-    if (support === unsupported) return "AlertCircleFilled"
-    */
-  }
-
   const getOptionIcon = optionKey => {
     const option = schema[optionKey]
     if (option.autocolumn) {
@@ -204,7 +192,6 @@
   .contextTooltipHeader {
     display: flex;
     align-items: center;
-    justify-content: center;
     height: var(--spectrum-alias-item-height-m);
     padding: 0px var(--spectrum-alias-item-padding-m);
     border-width: var(--spectrum-actionbutton-border-size);