@axos-web-dev/shared-components 2.0.0-dev.31.insights → 2.0.0-dev.31.insights.2

package/dist/Auth/ErrorAlert.js

@@ -74,8 +74,8 @@ import "../Carousel/index.js";
 /* empty css                                   */
 import "../Chatbot/store/chat.js";
 import "../Chatbot/Chatbot.js";
-import "../LoadingIndicator/LoadingIndicator.css.js";
 import "../Chatbot/Chatbot.css.ts.vanilla.css.js";
+import "../LoadingIndicator/LoadingIndicator.css.js";
 /* empty css                                       */
 import "../Chatbot/store/messages.js";
 import { Hyperlink } from "../Hyperlink/index.js";

package/dist/Calculators/Calculator.js

@@ -54,9 +54,9 @@ import "../Carousel/index.js";
 /* empty css                                   */
 import "../Chatbot/store/chat.js";
 import "../Chatbot/Chatbot.js";
+import "../Chatbot/Chatbot.css.ts.vanilla.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
 import "react-use";
-import "../Chatbot/Chatbot.css.ts.vanilla.css.js";
 /* empty css                                       */
 import "../Chatbot/store/messages.js";
 /* empty css                                                                    */

package/dist/Chatbot/ChatWindow.css.js

@@ -3,7 +3,6 @@ import '../assets/Chatbot/ChatWindow.css';import '../assets/Typography/Typograph
 /* empty css                               */
 /* empty css                                    */
 /* empty css                                          */
-import "./Chatbot.css.ts.vanilla.css.js";
 /* empty css                              */
 var windowStyle = "_13n1jqk1";
 var windowExpandedStyle = "_13n1jqk2";

package/dist/Chatbot/Chatbot.css.js

@@ -1,3 +1,4 @@
+import "./Chatbot.css.ts.vanilla.css.js";
 var chatbotAXB = "_1hpv6vm0";
 var chatbotUFB = "_1hpv6vm1";
 export {

package/dist/Forms/SuccesForm.js

@@ -69,9 +69,9 @@ import "../Carousel/index.js";
 /* empty css                                   */
 import "../Chatbot/store/chat.js";
 import "../Chatbot/Chatbot.js";
+import "../Chatbot/Chatbot.css.ts.vanilla.css.js";
 import "../LoadingIndicator/LoadingIndicator.css.js";
 import "react-use";
-import "../Chatbot/Chatbot.css.ts.vanilla.css.js";
 /* empty css                                       */
 import "../Chatbot/store/messages.js";
 /* empty css                                                                    */

package/dist/Insight/Featured/Featured.js

@@ -103,7 +103,7 @@ import "next/script.js";
 /* empty css                                           */
 /* empty css                            */
 /* empty css                                    */
-import { featured_section, featured_title, featured_grid, featured_maingrid, featured_maingrid_img, ratio, featured_main_wrapper, featured_maingrid_title, featured_maingrid_text, info_details, featured_subgrid, featured_subgrid_item, featured_subgrid_title } from "./Featured.css.js";
+import { featured_section, featured_grid, featured_title, featured_maingrid, featured_maingrid_img, ratio, featured_main_wrapper, featured_maingrid_title, featured_maingrid_text, info_details, featured_subgrid, featured_subgrid_item, featured_subgrid_title } from "./Featured.css.js";
 import { insight_wrap } from "./Header.css.js";
 import "../../LandingPageHeader/LandingPageHeader.css.js";
 import "next/link.js";
@@ -143,23 +143,31 @@ const FeaturedItem = (props) => {
     image
   } = props;
   const variant = getVariant(fullVariant);
+  const imageUrl = image?.url ? `https:${image.url}` : void 0;
   return /* @__PURE__ */ jsx("a", { href: url ?? "/", className: featured_subgrid_item, children: /* @__PURE__ */ jsxs("div", { className: "flex", style: { gap: "16px" }, children: [
-    /* @__PURE__ */ jsxs("picture", { className: ratio, children: [
-      /* @__PURE__ */ jsx("source", { srcSet: `https:${image?.url}?fm=avif`, type: "image/avif" }),
-      /* @__PURE__ */ jsx("source", { srcSet: `https:${image?.url}?fm=webp`, type: "image/webp" }),
-      /* @__PURE__ */ jsx(
-        Image,
-        {
-          src: `https:${image?.url}`,
-          className: clsx(featured_maingrid_img, ratio),
-          height: 159,
-          width: 269,
-          priority: true,
-          alt: ""
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "flex gap_24", children: [
+    imageUrl ? /* @__PURE__ */ jsxs(
+      "picture",
+      {
+        className: clsx(ratio, "rounded"),
+        style: { borderRadius: "12px" },
+        children: [
+          /* @__PURE__ */ jsx("source", { srcSet: `${imageUrl}?fm=avif`, type: "image/avif" }),
+          /* @__PURE__ */ jsx("source", { srcSet: `${imageUrl}?fm=webp`, type: "image/webp" }),
+          /* @__PURE__ */ jsx(
+            Image,
+            {
+              src: imageUrl,
+              className: clsx(featured_maingrid_img, ratio),
+              height: 159,
+              width: 269,
+              priority: true,
+              alt: image?.alt ?? ""
+            }
+          )
+        ]
+      }
+    ) : null,
+    /* @__PURE__ */ jsxs("div", { className: "flex_col gap_24", children: [
       /* @__PURE__ */ jsx("h3", { className: clsx(featured_subgrid_title, title({ variant })), children: featureItemTitle ?? "" }),
       /* @__PURE__ */ jsxs("div", { className: "flex middle", style: { gap: "4px" }, children: [
         /* @__PURE__ */ jsx(ClockIcon, {}),
@@ -184,37 +192,38 @@ const Featured = (props) => {
   const { id, variant: fullVariant, featured, headline } = props;
   const variant = getVariant(fullVariant);
   const [main, ...restFeatured] = featured;
-  return /* @__PURE__ */ jsx("section", { id, className: featured_section, children: /* @__PURE__ */ jsxs("div", { className: insight_wrap, children: [
-    headline && /* @__PURE__ */ jsx("h2", { className: featured_title, children: headline }),
-    /* @__PURE__ */ jsxs("div", { className: featured_grid, children: [
+  const mainImageUrl = main?.image?.url ? `https:${main.image.url}` : void 0;
+  return /* @__PURE__ */ jsx("section", { id, className: featured_section, children: /* @__PURE__ */ jsx("div", { className: insight_wrap, children: /* @__PURE__ */ jsxs("div", { className: featured_grid, children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      headline && /* @__PURE__ */ jsx("h2", { className: featured_title, children: headline }),
       /* @__PURE__ */ jsxs("a", { href: main?.url, className: featured_maingrid, children: [
-        /* @__PURE__ */ jsxs("picture", { className: clsx(ratio, "rounded"), children: [
+        mainImageUrl ? /* @__PURE__ */ jsxs("picture", { className: clsx(ratio, "rounded"), children: [
           /* @__PURE__ */ jsx(
             "source",
             {
-              srcSet: `https:${main?.image?.url}?fm=avif`,
+              srcSet: `${mainImageUrl}?fm=avif`,
               type: "image/avif"
             }
           ),
           /* @__PURE__ */ jsx(
             "source",
             {
-              srcSet: `https:${main?.image?.url}?fm=webp`,
+              srcSet: `${mainImageUrl}?fm=webp`,
               type: "image/webp"
             }
           ),
           /* @__PURE__ */ jsx(
             Image,
             {
-              src: `https:${main?.image?.url}`,
+              src: mainImageUrl,
               className: clsx(featured_maingrid_img, ratio),
               height: 346,
               width: 586,
               priority: true,
-              alt: ""
+              alt: main?.image?.alt ?? ""
             }
           )
-        ] }),
+        ] }) : null,
         /* @__PURE__ */ jsxs("div", { className: featured_main_wrapper, children: [
           /* @__PURE__ */ jsx("h3", { className: featured_maingrid_title, children: main?.title ?? "" }),
           /* @__PURE__ */ jsx("p", { className: featured_maingrid_text, children: main?.text ?? "" }),
@@ -235,23 +244,24 @@ const Featured = (props) => {
             /* @__PURE__ */ jsx("span", { className: info_details, style: { fontWeight: "600" }, children: (typeof main?.supertag == "string" && main?.supertag.replaceAll("-", " ")) ?? "" })
           ] })
         ] })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("h2", { className: featured_title, children: "Popular topics" }),
-        /* @__PURE__ */ jsx("div", { className: featured_subgrid, children: restFeatured.map((item) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
-          FeaturedItem,
-          {
-            variant: variant ?? "secondary",
-            readingTime: item.readingTime,
-            supertag: item.supertag,
-            title: item.title,
-            url: item.url
-          },
-          item.id
-        ) }, item.id)) })
       ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h2", { className: featured_title, children: "Popular topics" }),
+      /* @__PURE__ */ jsx("div", { className: featured_subgrid, children: restFeatured.map((item) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+        FeaturedItem,
+        {
+          variant: variant ?? "secondary",
+          image: item.image,
+          readingTime: item.readingTime,
+          supertag: item.supertag,
+          title: item.title,
+          url: item.url
+        },
+        item.id
+      ) }, item.id)) })
     ] })
-  ] }) });
+  ] }) }) });
 };
 export {
   Featured,

package/dist/Insight/Featured/Header.js

@@ -101,7 +101,7 @@ import "next/script.js";
 /* empty css                                           */
 /* empty css                            */
 /* empty css                                    */
-import { header_title_featured, header_in_insight, insight_wrap, header_featured } from "./Header.css.js";
+import { insight_wrap, header_title_featured, header_in_insight, header_featured } from "./Header.css.js";
 import "../../LandingPageHeader/LandingPageHeader.css.js";
 import "next/link.js";
 /* empty css                                                      */
@@ -132,26 +132,19 @@ import "../../StepItemSet/StepItemSet.css.js";
 /* empty css                                                 */
 const BreadcumbHeader = (props) => {
   const { section, showTitle = true } = props;
-  return /* @__PURE__ */ jsx(
-    "div",
+  return /* @__PURE__ */ jsx("div", { className: clsx(!showTitle ? header_in_insight : "", header_featured), children: /* @__PURE__ */ jsx("div", { className: insight_wrap, children: showTitle && /* @__PURE__ */ jsxs(
+    "h1",
     {
       className: clsx(
-        !showTitle ? header_in_insight : "",
-        insight_wrap,
-        header_featured
+        title({ variant: "primary" }),
+        header_title_featured
       ),
-      children: showTitle && /* @__PURE__ */ jsxs(
-        "h1",
-        {
-          className: clsx(title({ variant: "primary" }), header_title_featured),
-          children: [
-            section?.replaceAll("-", " "),
-            " Insights"
-          ]
-        }
-      )
+      children: [
+        section?.replaceAll("-", " "),
+        " Insights"
+      ]
     }
-  );
+  ) }) });
 };
 export {
   BreadcumbHeader

package/dist/assets/Insight/Featured/Featured.css

@@ -48,6 +48,12 @@
   font-size: 16px;
   line-height: 1.5;
   margin-bottom: 0;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  line-clamp: 2;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 ._1sr2o6v9 {
   color: var(--_1073cm8f);
@@ -65,8 +71,6 @@
   text-decoration: none;
 }
 ._1sr2o6vc {
-  margin-bottom: 8px;
-  max-height: min(76px, 108px);
   display: -webkit-box;
   -webkit-box-orient: vertical;
   line-clamp: 2;
@@ -74,6 +78,7 @@
   overflow: hidden;
   text-overflow: ellipsis;
   width: 100%;
+  font-size: 20px !important;
 }
 ._1sr2o6vd {
   display: inline-block;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@axos-web-dev/shared-components",
   "description": "Axos shared components library for web.",
-  "version": "2.0.0-dev.31.insights",
+  "version": "2.0.0-dev.31.insights.2",
   "type": "module",
   "main": "index.js",
   "module": "dist/main.js",