@windstream/react-shared-components 0.1.53 → 0.1.55

package/dist/index.d.ts

@@ -63,7 +63,7 @@ declare const Input: React$1.ForwardRefExoticComponent<Omit<React$1.InputHTMLAtt
     size?: "slim" | "medium" | "large" | undefined;
     label?: string | undefined;
     errorText?: string | undefined;
-    prefixIconName?: "location_on" | "search" | undefined;
+    prefixIconName?: "search" | "location_on" | undefined;
     prefixIconSize?: 20 | 24 | 40 | 48 | undefined;
     prefixIconFill?: boolean | undefined;
     suffixIconFill?: boolean | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@windstream/react-shared-components",
-  "version": "0.1.53",
+  "version": "0.1.55",
   "type": "module",
   "description": "Shared React components for Kinetic applications",
   "main": "dist/index.js",

package/src/contentful/blocks/breadcrumbs/index.tsx

@@ -1,71 +1,76 @@
-import React from "react";
-import Button from "../button";
-import { BreadcrumbNavigationProps } from "./types";
-
-import { MaterialIcon } from "@shared/components/material-icon";
-import { NextImage } from "@shared/components/next-image";
-import { Text } from "@shared/components/text";
-
-export const BreadcrumbNavigation: React.FC<
-  BreadcrumbNavigationProps
-> = props => {
-  const { links = [], textColor = "dark", maxWidth = true } = props;
-  const color =
-    textColor === "dark"
-      ? "text-white xl:text-text"
-      : "text-text xl:text-white";
-  if (!links.length) return null;
-  return (
-    <nav
-      aria-label="Breadcrumb"
-      className={`${maxWidth ? "mx-5 max-w-120 xl:mx-auto" : "mx-auto"} relative`}
-    >
-      <ol
-        className={
-          "relative right-0 z-10 mx-0 flex w-full flex-nowrap items-center gap-2 px-7 pb-0 pt-8 md:px-14 xl:absolute xl:mx-auto xl:flex-wrap xl:px-3"
-        }
-      >
-        {links.map((link, index) => {
-          const { image, ...linkProps } = link;
-          const isLast = index === links.length - 1;
-          return !isLast ? (
-            <li key={index} className="flex flex-none items-center">
-              {image?.url && (
-                <NextImage
-                  src={image.url}
-                  alt={image.alt || ""}
-                  width={20}
-                  height={20}
-                  className="mr-2"
-                />
-              )}
-              <Button
-                {...linkProps}
-                linkClassName={`label3 mr-2 whitespace-nowrap ${color}`}
-                linkVariant="unstyled"
-              />
-              <MaterialIcon name="chevron_right" className={`${color} `} />
-            </li>
-          ) : (
-            <li key={index} className="flex min-w-0 items-center">
-              {image?.url && (
-                <NextImage
-                  src={image.url}
-                  alt={image.alt || ""}
-                  width={20}
-                  height={20}
-                  className="mr-2"
-                />
-              )}
-              <Text as="span" className={`body3 mr-2 break-words ${color}`}>
-                {link.buttonLabel}
-              </Text>
-            </li>
-          );
-        })}
-      </ol>
-    </nav>
-  );
-};
-
-export default BreadcrumbNavigation;
+import React from "react";
+import Button from "../button";
+import { BreadcrumbNavigationProps } from "./types";
+
+import { MaterialIcon } from "@shared/components/material-icon";
+import { NextImage } from "@shared/components/next-image";
+import { Text } from "@shared/components/text";
+
+export const BreadcrumbNavigation: React.FC<
+  BreadcrumbNavigationProps
+> = props => {
+  const { links = [], textColor = "dark", maxWidth = true } = props;
+  const color =
+    textColor === "dark"
+      ? "text-white xl:text-text"
+      : "text-text xl:text-white";
+  if (!links.length) return null;
+  return (
+    <nav
+      aria-label="Breadcrumb"
+      className={`${maxWidth ? "mx-5 max-w-120 xl:mx-auto" : "mx-auto"} relative`}
+    >
+      <ol
+        className={
+          "relative right-0 z-10 mx-0 flex w-full flex-nowrap items-center gap-2 px-7 pb-0 pt-8 md:px-14 xl:absolute xl:mx-auto xl:flex-wrap xl:px-3"
+        }
+      >
+        {links.map((link, index) => {
+          const { image, ...linkProps } = link;
+          const imageSrc = image?.url
+            ? image.url.startsWith("//")
+              ? `https:${image.url}`
+              : image.url
+            : "";
+          const isLast = index === links.length - 1;
+          return !isLast ? (
+            <li key={index} className="flex flex-none items-center">
+              {imageSrc && (
+                <NextImage
+                  src={imageSrc}
+                  alt={image?.alt || ""}
+                  width={20}
+                  height={20}
+                  className="mr-2"
+                />
+              )}
+              <Button
+                {...linkProps}
+                linkClassName={`label3 mr-2 whitespace-nowrap ${color}`}
+                linkVariant="unstyled"
+              />
+              <MaterialIcon name="chevron_right" className={`${color} `} />
+            </li>
+          ) : (
+            <li key={index} className="flex min-w-0 items-center">
+              {imageSrc && (
+                <NextImage
+                  src={imageSrc}
+                  alt={image?.alt || ""}
+                  width={20}
+                  height={20}
+                  className="mr-2"
+                />
+              )}
+              <Text as="span" className={`body3 mr-2 break-words ${color}`}>
+                {link.buttonLabel}
+              </Text>
+            </li>
+          );
+        })}
+      </ol>
+    </nav>
+  );
+};
+
+export default BreadcrumbNavigation;