@axos-web-dev/shared-components 1.0.99-feature-toasts.2 → 1.0.99-feature-toasts.4

package/dist/ImageToast/index.js

@@ -171,7 +171,7 @@ const ToastWrapper = ({
       "aria-atomic": "true",
       initial: { opacity: 0, transform: "translate3d(10px,0,0) scale(0.6)" },
       whileInView: { opacity: 1, transform: "translate3d(0,0,0) scale(1)" },
-      viewport: { once: true },
+      viewport: { once: true, amount: 0.8 },
       children
     }
   );

package/dist/Modal/Modal.js

@@ -73,6 +73,7 @@ import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";
+import { AnimatePresence, motion } from "framer-motion";
 /* empty css                                          */
 import "../SetContainer/SetContainer.css.js";
 import "../Tab/Tab.css.js";
@@ -132,47 +133,56 @@ const Modal = ({
 }) => {
   return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { id: "speedbump", tabIndex: -1, role: "dialog", className: modal, children: [
     /* @__PURE__ */ jsx("div", { className: speedbump_background, onClick: onCancel }),
-    /* @__PURE__ */ jsx("div", { className: `${modal_dialog} rounded`, children: /* @__PURE__ */ jsxs("div", { className: `${modal_content} rounded`, children: [
-      /* @__PURE__ */ jsxs("div", { className: `${modal_header} text_center`, children: [
-        /* @__PURE__ */ jsx("h2", { className: `${modal_title} header_3`, children: headline }),
-        /* @__PURE__ */ jsx("p", { className: `${modal_subtitle} p_16 mb_0 push_up`, children: bodyCopy })
-      ] }),
-      /* @__PURE__ */ jsx("hr", { className: solid }),
-      /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: `${modal_body} text-center flex flex_col center middle mx_auto`,
-          children: [
-            /* @__PURE__ */ jsx("p", { className: "p_16", children: "You will now be redirected to:" }),
-            /* @__PURE__ */ jsx("p", { id: "insert-url", className: site_link, children: body })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx("hr", { className: solid }),
-      /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: `${modal_footer} flex center middle push_up_24`,
-          style: { marginInline: "auto", width: "max-content" },
-          children: [
-            /* @__PURE__ */ jsx(Button, { color: "primary", action: onAccept, children: "Continue" }),
-            /* @__PURE__ */ jsx(
-              "a",
-              {
-                style: { textDecoration: "none", padding: "8px 48px" },
-                role: "button",
-                className: `sc__btn ${chevron({ variant: "primary" })}`,
-                "aria-label": "Close",
-                title: "Go Back",
-                id: "close",
-                onClick: onCancel,
-                children: "Close"
-              }
-            )
-          ]
-        }
-      )
-    ] }) })
+    /* @__PURE__ */ jsx(AnimatePresence, { children: /* @__PURE__ */ jsx(
+      motion.div,
+      {
+        className: `${modal_dialog} rounded`,
+        initial: { opacity: 0, transform: "translate3d(10px,0,0) scale(0.6)" },
+        animate: { opacity: 1, transform: "translate3d(0,0,0) scale(1)" },
+        exit: { opacity: 0, transform: "translate3d(10px,0,0) scale(0.6)" },
+        children: /* @__PURE__ */ jsxs("div", { className: `${modal_content} rounded`, children: [
+          /* @__PURE__ */ jsxs("div", { className: `${modal_header} text_center`, children: [
+            /* @__PURE__ */ jsx("h2", { className: `${modal_title} header_3`, children: headline }),
+            /* @__PURE__ */ jsx("p", { className: `${modal_subtitle} p_16 mb_0 push_up`, children: bodyCopy })
+          ] }),
+          /* @__PURE__ */ jsx("hr", { className: solid }),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `${modal_body} text-center flex flex_col center middle mx_auto`,
+              children: [
+                /* @__PURE__ */ jsx("p", { className: "p_16", children: "You will now be redirected to:" }),
+                /* @__PURE__ */ jsx("p", { id: "insert-url", className: site_link, children: body })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("hr", { className: solid }),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `${modal_footer} flex center middle push_up_24`,
+              style: { marginInline: "auto", width: "max-content" },
+              children: [
+                /* @__PURE__ */ jsx(Button, { color: "primary", action: onAccept, children: "Continue" }),
+                /* @__PURE__ */ jsx(
+                  "a",
+                  {
+                    style: { textDecoration: "none", padding: "8px 48px" },
+                    role: "button",
+                    className: `sc__btn ${chevron({ variant: "primary" })}`,
+                    "aria-label": "Close",
+                    title: "Go Back",
+                    id: "close",
+                    onClick: onCancel,
+                    children: "Close"
+                  }
+                )
+              ]
+            }
+          )
+        ] })
+      }
+    ) })
   ] }) });
 };
 export {

package/dist/assets/IconBillboard/IconBillboard.css

@@ -50,6 +50,9 @@
   font-family: var(--main-font-family);
   width: 100%;
 }
+.xtgeqb0 ._1r4ovbu8 {
+  align-self: center;
+}
 ._1r4ovbu9 {
   display: flex;
   flex-direction: column;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@axos-web-dev/shared-components",
   "description": "Axos shared components library for web.",
-  "version": "1.0.99-feature-toasts.2",
+  "version": "1.0.99-feature-toasts.4",
   "type": "module",
   "module": "dist/main.js",
   "types": "dist/main.d.ts",