@scrippsproduct/networks-ui-library 1.1.0-alpha.0 → 1.1.0-alpha.10

package/dist/components/SocialShareBlock/SocialShareBlock.js

@@ -1,37 +1,35 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
-import "react";
+import { jsxs as r, jsx as s } from "react/jsx-runtime";
 import { classes as f } from "../../utils/helpers.js";
 import p from "../../icons/Facebook.js";
-import d from "../../icons/Twitter.js";
-import { s as a, S } from "../../SocialShareButton-BXGVUD-z.mjs";
-function b({
-  url: i,
+import S from "../../icons/Twitter.js";
+import { s as a, S as d } from "../../SocialShareButton-BMhRS9Qr.mjs";
+function $({
+  url: e,
   text: c,
-  longtext: t,
-  showHeader: l = !1,
-  headerText: n = "Share",
-  iconSize: s = "1.5rem"
+  longtext: i,
+  showHeader: t = !1,
+  headerText: l = "Share",
+  iconSize: n = "1.5rem"
 }) {
   const h = [
     { network: "Facebook", icon: p },
-    { network: "Twitter", icon: d }
+    { network: "Twitter", icon: S }
   ];
-  return /* @__PURE__ */ e("social-share", { class: a["social-share"], children: [
-    l && /* @__PURE__ */ e("h5", { className: "social-share__header", children: [
-      n,
+  return /* @__PURE__ */ r("social-share", { class: a["social-share"], children: [
+    t && /* @__PURE__ */ r("h5", { className: "social-share__header", children: [
+      l,
       ":"
     ] }),
     h.map((m) => {
       const { network: o, icon: _ } = m;
-      return /* @__PURE__ */ r(
-        S,
+      return /* @__PURE__ */ s(
+        d,
         {
+          longtext: i,
           network: o,
-          url: i,
           text: c,
-          longtext: t,
-          title: `Share on ${o}`,
-          children: /* @__PURE__ */ r("i", { className: f(["social-share__icon", a["social-share__icon"], `social-share__icon--${o}`, a[`social-share__icon--${o}`]]), children: /* @__PURE__ */ r(_, { width: s, height: s }) })
+          url: e,
+          children: /* @__PURE__ */ s("i", { className: f(["social-share__icon", a["social-share__icon"], `social-share__icon--${o}`, a[`social-share__icon--${o}`]]), children: /* @__PURE__ */ s(_, { size: n }) })
         },
         `social-share-${o}`
       );
@@ -39,6 +37,6 @@ function b({
   ] });
 }
 export {
-  b as SocialShareBlock,
-  b as default
+  $ as SocialShareBlock,
+  $ as default
 };

package/dist/components/SocialShareBlock/index.d.ts

@@ -1 +1,2 @@
-export { SocialShareBlock, SocialShareBlock as default } from './SocialShareBlock';
+export { SocialShareBlock } from './SocialShareBlock';
+export { SocialShareBlock as default } from './SocialShareBlock';

package/dist/components/SocialShareButton/SocialShareButton.d.ts

@@ -1,8 +1,9 @@
-export function SocialShareButton({ children, network, url, text, longtext }: {
-    children: any;
-    network: any;
-    url: any;
-    text: any;
-    longtext: any;
-}): import("react/jsx-runtime").JSX.Element;
+type SocialShareButtonProps = {
+    children: React.ReactNode;
+    network: 'Facebook' | 'Twitter' | string;
+    url: string;
+    text: string;
+    longtext: string;
+};
+export declare function SocialShareButton({ children, network, url, text, longtext, }: SocialShareButtonProps): JSX.Element;
 export default SocialShareButton;

package/dist/components/SocialShareButton/SocialShareButton.js

@@ -1,9 +1,8 @@
 import "react/jsx-runtime";
-import "react";
 import "../../utils/createSocialShareLinks.js";
 import "../../utils/helpers.js";
-import { S as p, S } from "../../SocialShareButton-BXGVUD-z.mjs";
+import { S as m, S as p } from "../../SocialShareButton-BMhRS9Qr.mjs";
 export {
-  p as SocialShareButton,
-  S as default
+  m as SocialShareButton,
+  p as default
 };

package/dist/components/SocialShareButton/index.d.ts

@@ -1 +1,2 @@
-export { SocialShareButton, SocialShareButton as default } from './SocialShareButton';
+export { SocialShareButton } from './SocialShareButton';
+export { SocialShareButton as default } from './SocialShareButton';

package/dist/components/SocialShareButton/index.js

@@ -1,4 +1,4 @@
-import { S as t, S } from "../../SocialShareButton-BXGVUD-z.mjs";
+import { S as t, S } from "../../SocialShareButton-BMhRS9Qr.mjs";
 export {
   t as SocialShareButton,
   S as default

package/dist/components/StringList/StringList.d.ts

@@ -1,6 +1,7 @@
-export function StringList({ list, separatorType, makeBlock }: {
-    list: any;
-    separatorType?: string | undefined;
-    makeBlock?: boolean | undefined;
-}): import("react/jsx-runtime").JSX.Element;
+type StringListProps = {
+    list: Array<string | JSX.Element | number | null | undefined>;
+    separatorType?: 'comma' | 'pipe';
+    makeBlock?: boolean;
+};
+export declare function StringList({ list, separatorType, makeBlock, }: StringListProps): JSX.Element;
 export default StringList;

package/dist/components/StringList/StringList.js

@@ -1,27 +1,31 @@
-import { jsx as t, Fragment as c, jsxs as p } from "react/jsx-runtime";
-import s from "react";
+import { jsx as s, Fragment as c, jsxs as p } from "react/jsx-runtime";
+import { Fragment as t } from "react";
 import { p as n } from "../../index-VjANCDXC.mjs";
-import { classes as e } from "../../utils/helpers.js";
-import '../../assets/StringList.css';const l = {
+import { classes as l } from "../../utils/helpers.js";
+import '../../assets/StringList.css';const e = {
   "string-list__pipe": "_string-list__pipe_6c2cm_1",
   "string-list--block": "_string-list--block_6c2cm_8"
 };
-function m({ list: g, separatorType: d = "comma", makeBlock: o = !1 }) {
-  const a = g.filter((r) => !(r === "" || r === void 0 || r === null));
-  if (a.length === 0) return /* @__PURE__ */ t(c, {});
-  switch (d) {
+function m({
+  list: d,
+  separatorType: g = "comma",
+  makeBlock: o = !1
+}) {
+  const i = d.filter((r) => !(r === "" || r === void 0 || r === null));
+  if (i.length === 0) return /* @__PURE__ */ s(c, {});
+  switch (g) {
     case "comma":
-      return /* @__PURE__ */ t("span", { className: e(["string-list", o ? l["string-list--block"] : ""]), children: a.map((r, i) => i === 0 ? /* @__PURE__ */ t(s.Fragment, { children: typeof r == "string" ? n(r) : r }, `sl-${Math.round(Math.random() * 1e7)}`) : /* @__PURE__ */ p(s.Fragment, { children: [
+      return /* @__PURE__ */ s("span", { className: l(["string-list", o ? e["string-list--block"] : ""]), children: i.map((r, a) => a === 0 ? /* @__PURE__ */ s(t, { children: typeof r == "string" ? n(r) : r }, `sl-${Math.round(Math.random() * 1e7)}`) : /* @__PURE__ */ p(t, { children: [
         ", ",
         typeof r == "string" ? n(r) : r
       ] }, `sl-${Math.round(Math.random() * 1e7)}`)) });
     case "pipe":
-      return /* @__PURE__ */ t("span", { className: e(["string-list", o ? l["string-list--block"] : ""]), children: a.map((r, i) => i === 0 ? /* @__PURE__ */ t(s.Fragment, { children: typeof r == "string" ? n(r) : r }, `sl-${Math.round(Math.random() * 1e7)}`) : /* @__PURE__ */ p(s.Fragment, { children: [
-        /* @__PURE__ */ t("span", { className: e([l["string-list__pipe"], "string-list__pipe"]), children: " | " }),
+      return /* @__PURE__ */ s("span", { className: l(["string-list", o ? e["string-list--block"] : ""]), children: i.map((r, a) => a === 0 ? /* @__PURE__ */ s(t, { children: typeof r == "string" ? n(r) : r }, `sl-${Math.round(Math.random() * 1e7)}`) : /* @__PURE__ */ p(t, { children: [
+        /* @__PURE__ */ s("span", { className: l([e["string-list__pipe"], "string-list__pipe"]), children: " | " }),
         typeof r == "string" ? n(r) : r
       ] }, `sl-${Math.round(Math.random() * 1e7)}`)) });
     default:
-      return /* @__PURE__ */ t(c, {});
+      return /* @__PURE__ */ s(c, {});
   }
 }
 export {

package/dist/components/StringList/index.d.ts

@@ -1 +1,2 @@
-export { StringList, StringList as default } from './StringList';
+export { StringList } from './StringList';
+export { StringList as default } from './StringList';

package/dist/components/TabContent/TabContent.d.ts

@@ -1,5 +1,6 @@
-export function TabContent({ content, classname }: {
-    content: any;
-    classname: any;
-}): import("react/jsx-runtime").JSX.Element;
+type TabContentProps = {
+    content: React.ReactNode;
+    classname?: string | '';
+};
+export declare function TabContent({ content, classname, }: TabContentProps): JSX.Element;
 export default TabContent;

package/dist/components/TabContent/TabContent.js

@@ -1,10 +1,12 @@
-import { jsx as o } from "react/jsx-runtime";
-import { p as a } from "../../index-VjANCDXC.mjs";
-import "react";
-function i({ content: r, classname: t }) {
-  return /* @__PURE__ */ o("tab-content", { class: t, children: typeof r == "string" ? a(r) : r });
+import { jsx as a } from "react/jsx-runtime";
+import { p as o } from "../../index-VjANCDXC.mjs";
+function p({
+  content: r,
+  classname: t
+}) {
+  return /* @__PURE__ */ a("tab-content", { class: t, children: typeof r == "string" ? o(r) : r });
 }
 export {
-  i as TabContent,
-  i as default
+  p as TabContent,
+  p as default
 };

package/dist/components/TabContent/index.d.ts

@@ -1 +1,2 @@
-export { TabContent, TabContent as default } from './TabContent';
+export { TabContent } from './TabContent';
+export { TabContent as default } from './TabContent';

package/dist/components/TabNavigation/TabNavigation.d.ts

@@ -1,6 +1,8 @@
-export function TabNavigation({ tabs, onTabChanged, rightSideContent }: {
-    tabs?: never[] | undefined;
-    onTabChanged?: (() => boolean) | undefined;
-    rightSideContent: any;
-}): import("react/jsx-runtime").JSX.Element;
+import { Tab } from '../TabbedContent/TabbedContent';
+type TabNavigationProps = {
+    tabs: Tab[];
+    onTabChanged?: (tab: Tab) => void;
+    rightSideContent?: React.ReactNode;
+};
+export declare function TabNavigation({ tabs, onTabChanged, rightSideContent, }: TabNavigationProps): JSX.Element;
 export default TabNavigation;

package/dist/components/TabNavigation/TabNavigation.js

@@ -1,69 +1,74 @@
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import { useState as _, useEffect as g } from "react";
-import { GradientButton as c } from "../GradientButton/GradientButton.js";
-import { Button as d } from "../Button/Button.js";
+import { jsxs as B, jsx as n } from "react/jsx-runtime";
+import { useState as N, useEffect as T } from "react";
+import { GradientButton as y } from "../GradientButton/GradientButton.js";
+import { Button as k } from "../Button/Button.js";
 import '../../assets/TabNavigation.css';const r = {
   "tab-navigation__list": "_tab-navigation__list_146qs_6",
   "tab-navigation__right-side": "_tab-navigation__right-side_146qs_16"
 };
-function h({
+function w({
   tabs: i = [],
   onTabChanged: l = () => !0,
   rightSideContent: a
 }) {
-  const [n, b] = _(i[0]), u = (t) => {
+  const [e, j] = N(i[0]), u = (t) => {
     const o = document.querySelector("basic-grid-module");
-    o == null || o.setAttribute("first-entry", !0), o == null || o.setAttribute("data-state", "entering"), t.button.label !== n.button.label && b(t);
+    o == null || o.setAttribute("first-entry", "true"), o == null || o.setAttribute("data-state", "entering"), !(!t.button || !e.button) && t.button.label !== e.button.label && j(t);
   };
-  return g(() => l(n), [n, l]), /* @__PURE__ */ s("tab-navigation", { children: [
-    /* @__PURE__ */ e("ul", { className: [r["tab-navigation__list"], "tab-navigation__list"].join(" "), children: i.length > 0 && i.map((t) => n.button.label === t.button.label ? /* @__PURE__ */ e(
-      "li",
-      {
-        className: [r["tab-navigation__item"], "tab-navigation__item"].join(" "),
-        style: {
-          "--gradient-start-color": t.button.gradientStartColor,
-          "--gradient-end-color": t.button.gradientEndColor
+  return T(() => {
+    l(e);
+  }, [e, l]), /* @__PURE__ */ B("tab-navigation", { children: [
+    /* @__PURE__ */ n("ul", { className: [r["tab-navigation__list"], "tab-navigation__list"].join(" "), children: i.length > 0 && i.map((t) => {
+      var o, b, s, _, g, c, d, m, v, C, f, h, p, x, H;
+      return ((o = e.button) == null ? void 0 : o.label) === ((b = t.button) == null ? void 0 : b.label) ? /* @__PURE__ */ n(
+        "li",
+        {
+          className: [r["tab-navigation__item"], "tab-navigation__item"].join(" "),
+          style: {
+            "--gradient-start-color": (s = t.button) == null ? void 0 : s.gradientStartColor,
+            "--gradient-end-color": (_ = t.button) == null ? void 0 : _.gradientEndColor
+          },
+          children: /* @__PURE__ */ n(
+            y,
+            {
+              disabled: !0,
+              label: (g = t.button) == null ? void 0 : g.label,
+              onClick: () => {
+                u(t);
+              }
+            }
+          )
         },
-        children: /* @__PURE__ */ e(
-          c,
-          {
-            onClick: () => {
-              u(t);
-            },
-            label: t.button.label,
-            disabled: !0
-          }
-        )
-      },
-      `tab-item-${t.button.label}`
-    ) : /* @__PURE__ */ e(
-      "li",
-      {
-        className: [r["tab-navigation__item"], "tab-navigation__item"].join(" "),
-        children: /* @__PURE__ */ e(
-          d,
-          {
-            onClick: () => {
-              u(t);
-            },
-            label: t.button.label,
-            customColors: {
-              bgColor: t.button.buttonBgColor,
-              bgHoverColor: t.button.buttonHoverBgColor,
-              color: t.button.buttonTextColor,
-              hoverColor: t.buttonHoverTextColor,
-              borderColor: t.button.buttonTextColor,
-              borderHoverColor: t.button.borderHoverColor ?? t.button.buttonHoverBgColor
+        `tab-item-${(c = t.button) == null ? void 0 : c.label}`
+      ) : /* @__PURE__ */ n(
+        "li",
+        {
+          className: [r["tab-navigation__item"], "tab-navigation__item"].join(" "),
+          children: /* @__PURE__ */ n(
+            k,
+            {
+              customColors: {
+                bgColor: (d = t.button) == null ? void 0 : d.buttonBgColor,
+                bgHoverColor: (m = t.button) == null ? void 0 : m.buttonHoverBgColor,
+                color: (v = t.button) == null ? void 0 : v.buttonTextColor,
+                hoverColor: (C = t.button) == null ? void 0 : C.buttonHoverTextColor,
+                borderColor: (f = t.button) == null ? void 0 : f.buttonTextColor,
+                borderHoverColor: ((h = t.button) == null ? void 0 : h.borderHoverColor) ?? ((p = t.button) == null ? void 0 : p.buttonHoverBgColor)
+              },
+              label: (x = t.button) == null ? void 0 : x.label,
+              onClick: () => {
+                u(t);
+              }
             }
-          }
-        )
-      },
-      `tab-item-${t.button.label}`
-    )) }),
-    /* @__PURE__ */ e("div", { className: r["tab-navigation__right-side"], children: a !== void 0 && a })
+          )
+        },
+        `tab-item-${(H = t.button) == null ? void 0 : H.label}`
+      );
+    }) }),
+    /* @__PURE__ */ n("div", { className: r["tab-navigation__right-side"], children: a !== void 0 && a })
   ] });
 }
 export {
-  h as TabNavigation,
-  h as default
+  w as TabNavigation,
+  w as default
 };

package/dist/components/TabNavigation/index.d.ts

@@ -1 +1,2 @@
-export { TabNavigation, TabNavigation as default } from './TabNavigation';
+export { TabNavigation } from './TabNavigation';
+export { TabNavigation as default } from './TabNavigation';

package/dist/components/TabbedContent/TabbedContent.d.ts

@@ -1,5 +1,21 @@
-export function TabbedContent({ tabs, navRightSideContent }: {
-    tabs?: never[] | undefined;
-    navRightSideContent: any;
-}): import("react/jsx-runtime").JSX.Element;
+export type Tab = {
+    title: string;
+    content: React.ReactNode;
+    classname?: string;
+    button?: {
+        label: string;
+        gradientStartColor: string;
+        gradientEndColor: string;
+        buttonBgColor: string;
+        buttonHoverBgColor: string;
+        buttonTextColor: string;
+        buttonHoverTextColor: string;
+        borderHoverColor?: string;
+    };
+};
+type TabbedContentProps = {
+    tabs: Tab[];
+    navRightSideContent?: React.ReactNode;
+};
+export declare function TabbedContent({ tabs, navRightSideContent, }: TabbedContentProps): JSX.Element;
 export default TabbedContent;

package/dist/components/TabbedContent/TabbedContent.js

@@ -1,15 +1,31 @@
-import { jsxs as s, jsx as a } from "react/jsx-runtime";
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
 import { useState as c } from "react";
 import { TabNavigation as m } from "../TabNavigation/TabNavigation.js";
-import { TabContent as b } from "../TabContent/TabContent.js";
-function f({ tabs: t = [], navRightSideContent: e }) {
-  const [n, o] = c(t[0]);
+import { TabContent as i } from "../TabContent/TabContent.js";
+function C({
+  tabs: n = [],
+  navRightSideContent: o
+}) {
+  const [t, a] = c(n[0]);
   return /* @__PURE__ */ s("tabbed-content", { children: [
-    /* @__PURE__ */ a(m, { tabs: t, onTabChanged: (r) => o(r), children: e && e }),
-    /* @__PURE__ */ a(b, { content: n.content, classname: n.classname ? n.classname : null })
+    /* @__PURE__ */ e(
+      m,
+      {
+        rightSideContent: o,
+        tabs: n,
+        onTabChanged: (r) => a(r)
+      }
+    ),
+    /* @__PURE__ */ e(
+      i,
+      {
+        classname: t.classname ? t.classname : "",
+        content: t.content
+      }
+    )
   ] });
 }
 export {
-  f as TabbedContent,
-  f as default
+  C as TabbedContent,
+  C as default
 };

package/dist/components/TabbedContent/index.d.ts

@@ -1 +1,2 @@
-export { TabbedContent, TabbedContent as default } from './TabbedContent';
+export { TabbedContent } from './TabbedContent';
+export { TabbedContent as default } from './TabbedContent';

package/dist/components/TextArea/TextArea.d.ts

@@ -1,2 +1,10 @@
-export function TextArea(props: any): import("react/jsx-runtime").JSX.Element;
+type TextAreaProps = {
+    name: string;
+    label: string;
+    rows: number;
+    width: 'small' | 'medium' | 'large' | 'full';
+    helpText?: string;
+    [key: string]: unknown;
+};
+export declare function TextArea(props: TextAreaProps): JSX.Element;
 export default TextArea;

package/dist/components/TextArea/TextArea.js

@@ -1,27 +1,27 @@
-import { jsxs as i, jsx as a } from "react/jsx-runtime";
+import { jsxs as s, jsx as a } from "react/jsx-runtime";
 import { useState as l, useRef as V } from "react";
-import { classes as u } from "../../utils/helpers.js";
+import { classes as f } from "../../utils/helpers.js";
 import { s as e, C as k, A as w } from "../../Form.module-Cd8qH2rj.mjs";
 function T(m) {
-  var o, d, f;
-  const { name: s, label: h, rows: p, width: _, helpText: v, ...x } = m, [C, N] = l(`${e["form-field__input"]}`), t = V(), [r, n] = l(""), [c, b] = l("clean"), g = `input-width--${_}`, y = () => {
-    b("touched"), N(`${e["form-field__input"]} ${e["input--touched"]}`), t.current.checkValidity() ? n("") : n(t.current.validationMessage);
+  var o, d, u;
+  const { name: i, label: h, rows: p, width: _, helpText: v, ...x } = m, [C, N] = l(`${e["form-field__input"]}`), t = V(null), [r, n] = l(""), [c, b] = l("clean"), g = `input-width--${_}`, y = () => {
+    b("touched"), N(`${e["form-field__input"]} ${e["input--touched"]}`), t.current && (t.current.checkValidity() ? n("") : n(t.current.validationMessage));
   };
-  return /* @__PURE__ */ i("label", { htmlFor: s, className: u([e["form-field"], e[g]]), children: [
-    /* @__PURE__ */ i(
+  return /* @__PURE__ */ s("label", { className: f([e["form-field"], e[g]]), htmlFor: i, children: [
+    /* @__PURE__ */ s(
       "i",
       {
-        className: u([
+        className: f([
           e["form-field__icon"],
           (o = t.current) != null && o.validity.valid ? "" : e["form-field__icon--invalid"]
         ]),
         children: [
           ((d = t.current) == null ? void 0 : d.checkValidity()) && c === "touched" && /* @__PURE__ */ a(k, {}),
-          !((f = t.current) != null && f.checkValidity()) && c === "touched" && /* @__PURE__ */ a(w, {})
+          !((u = t.current) != null && u.checkValidity()) && c === "touched" && /* @__PURE__ */ a(w, {})
         ]
       }
     ),
-    /* @__PURE__ */ i("span", { className: e["form-field__label"], children: [
+    /* @__PURE__ */ s("span", { className: e["form-field__label"], children: [
       h,
       " ",
       /* @__PURE__ */ a("span", { className: e["form-field__label-help"], children: v })
@@ -30,13 +30,13 @@ function T(m) {
       "textarea",
       {
         className: C,
-        name: s,
-        id: s,
+        id: i,
+        name: i,
+        ref: t,
         rows: p,
         onBlur: () => {
           y();
         },
-        ref: t,
         ...x
       }
     ),

package/dist/components/TextArea/index.d.ts

@@ -1 +1,2 @@
-export { TextArea, TextArea as default } from './TextArea';
+export { TextArea } from './TextArea';
+export { TextArea as default } from './TextArea';

package/dist/components/UpcomingList/UpcomingList.d.ts

@@ -1,5 +1,6 @@
-export function UpcomingList({ list, handleClicks }: {
-    list: any;
-    handleClicks?: (() => boolean) | undefined;
-}): import("react/jsx-runtime").JSX.Element;
+import { UpcomingItem, HandleClicksDetails } from '../../types';
+export declare function UpcomingList({ list, handleClicks, }: {
+    list: UpcomingItem[];
+    handleClicks: (details: HandleClicksDetails) => boolean | void;
+}): JSX.Element;
 export default UpcomingList;