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

package/dist/components/AnchorTag/AnchorTag.js

@@ -1,45 +1,44 @@
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import "react";
-import '../../assets/AnchorTag.css';const o = {
-  "anchor-tag--image": "_anchor-tag--image_1nb7n_1"
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import '../../assets/AnchorTag.css';const s = {
+  "anchor-tag--image": "_anchor-tag--image_1vh6d_1"
 };
-function g({
+function c({
   href: l = "",
-  classname: t = "",
-  label: i = "",
+  classname: e = "",
+  label: a = "",
   type: n = "internal-link",
   image: r = null,
-  clickHandler: a = null
+  clickHandler: i = null
 }) {
-  return r !== null ? /* @__PURE__ */ s(
+  return r !== null ? /* @__PURE__ */ o(
     "a",
     {
+      className: [e, s["anchor-tag--image"], "anchor-tag--image"].join(" "),
       href: l,
-      className: [t, o["anchor-tag--image"], "anchor-tag--image"].join(" "),
-      rel: n === "external-link" ? "noreferrer" : null,
-      target: n === "internal-link" ? "_self" : "_blank",
+      rel: n === "external-link" ? "noreferrer" : void 0,
       style: {
-        "--anchor-tag-image-ratio": r.width / r.height
+        "--anchor-tag-image-ratio": r.width && r.height ? r.width / r.height : 1
       },
-      onClick: a && n === "internal-link" && l.includes("#") ? a : null,
+      target: n === "internal-link" ? "_self" : "_blank",
+      onClick: i && n === "internal-link" && l.includes("#") ? i : void 0,
       children: [
-        /* @__PURE__ */ e("img", { src: r.url, alt: i }),
-        /* @__PURE__ */ e("span", { className: "sr-only", children: i })
+        /* @__PURE__ */ t("img", { alt: a, src: r.url }),
+        /* @__PURE__ */ t("span", { className: "sr-only", children: a })
       ]
     }
-  ) : /* @__PURE__ */ e(
+  ) : /* @__PURE__ */ t(
     "a",
     {
+      className: e,
       href: l,
-      className: t,
-      rel: n === "external-link" ? "noreferrer" : null,
+      rel: n === "external-link" ? "noreferrer" : void 0,
       target: n === "internal-link" ? "_self" : "_blank",
-      onClick: a && n === "internal-link" && l.includes("#") ? a : null,
-      children: i
+      onClick: i && n === "internal-link" && l.includes("#") ? i : void 0,
+      children: a
     }
   );
 }
 export {
-  g as AnchorTag,
-  g as default
+  c as AnchorTag,
+  c as default
 };

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

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

package/dist/components/BCVideoPlayer/BCVideoPlayer.d.ts

@@ -1,13 +1,20 @@
-export function BCVideoPlayer({ bcId, playerElId, containerClosing, autoplay, mute, handleClosing, pauseVideo, BC_AID, BC_PLAYERID, BC_EMBEDID }: {
-    bcId: any;
-    playerElId?: string | undefined;
-    containerClosing?: boolean | undefined;
-    autoplay?: boolean | undefined;
-    mute?: boolean | undefined;
-    handleClosing?: (() => boolean) | undefined;
-    pauseVideo?: boolean | undefined;
-    BC_AID?: string | undefined;
-    BC_PLAYERID?: string | undefined;
-    BC_EMBEDID?: string | undefined;
-}): import("react/jsx-runtime").JSX.Element | null;
+import { VideoJsPlayer } from 'video.js';
+declare global {
+    interface Window {
+        bc: (playerId: string) => VideoJsPlayer;
+    }
+}
+type BCVideoPlayerProps = {
+    bcId: string;
+    playerElId?: string;
+    containerClosing?: boolean;
+    autoplay?: boolean;
+    mute?: boolean;
+    handleClosing?: (e: React.KeyboardEvent<HTMLDivElement>) => void;
+    pauseVideo?: boolean;
+    BC_AID?: string;
+    BC_PLAYERID?: string;
+    BC_EMBEDID?: string;
+};
+export declare function BCVideoPlayer({ bcId, playerElId, containerClosing, autoplay, mute, handleClosing, pauseVideo, BC_AID, BC_PLAYERID, BC_EMBEDID, }: BCVideoPlayerProps): JSX.Element | null;
 export default BCVideoPlayer;

package/dist/components/BCVideoPlayer/BCVideoPlayer.js

@@ -1,57 +1,59 @@
-import { jsx as g } from "react/jsx-runtime";
-import { useRef as l, useCallback as H, useEffect as a } from "react";
-import '../../assets/BCVideoPlayer.css';function z({
-  bcId: t,
+import { jsx as H } from "react/jsx-runtime";
+import { useRef as s, useCallback as S, useEffect as l } from "react";
+import '../../assets/BCVideoPlayer.css';function E({
+  bcId: r,
   playerElId: n = "bc-player",
-  containerClosing: i = !1,
-  autoplay: c = !1,
+  containerClosing: c = !1,
+  autoplay: i = !1,
   mute: u = !1,
-  handleClosing: h = () => !0,
+  handleClosing: P = () => !0,
   pauseVideo: d = !1,
-  BC_AID: p = "",
-  BC_PLAYERID: f = "",
+  BC_AID: f = "",
+  BC_PLAYERID: p = "",
   BC_EMBEDID: y = ""
 }) {
-  const r = l(null), s = l(null), m = l(t), P = (e) => {
-    e.key === "Escape" && (e.preventDefault(), h(e));
-  }, K = (e) => {
+  const t = s(null), o = s(null), m = s(r), K = (e) => {
+    e.key === "Escape" && (e.preventDefault(), P(e));
+  }, k = (e) => {
     e.key === "Escape" && (e.stopPropagation(), e.preventDefault());
-  }, v = H(() => {
-    c && r.current.play(), u && r.current.muted(!0);
-  }, [c, u]);
-  return a(() => {
+  }, v = S(() => {
+    i && t.current && t.current.play(), u && t.current && t.current.muted(!0);
+  }, [i, u]);
+  return l(() => {
     const e = () => {
-      const w = p, $ = f, x = `<video-js id="${n}" data-video-id="${t}" data-account="${w}" data-player="${$}" data-embed="${y}" controls></video-js>`;
-      s.current.innerHTML = x, r.current !== null && r.current.dispose();
+      const w = f, $ = p, g = `<video-js id="${n}" data-video-id="${r}" data-account="${w}" data-player="${$}" data-embed="${y}" controls></video-js>`;
+      o.current !== null && (o.current.innerHTML = g), t.current !== null && t.current.dispose();
       const j = document.getElementById("video-js-script");
       j && j.remove();
-      const o = document.createElement("script");
-      o.src = `https://players.brightcove.net/${w}/${$}_default/index.min.js`, o.id = "video-js-script", document.body.appendChild(o), o.onload = () => {
-        r.current = window.bc(n), r.current.on("loadedmetadata", v), document.querySelector(`#${n}`).focus();
+      const a = document.createElement("script");
+      a.src = `https://players.brightcove.net/${w}/${$}_default/index.min.js`, a.id = "video-js-script", document.body.appendChild(a), a.onload = () => {
+        t.current = typeof window.bc == "function" ? window.bc(n) : null, t.current.on("loadedmetadata", v);
+        const h = document.querySelector(`#${n}`);
+        h && h.focus();
       };
-    }, k = setInterval(() => {
-      s.current !== null && (clearInterval(k), e());
+    }, x = setInterval(() => {
+      o.current !== null && (clearInterval(x), e());
     }, 100);
-  }, [t, n, v, p, f, y]), a(() => {
-    i && r.current !== null && r.current.pause();
-  }, [i]), a(() => {
-    m.current !== t && (m.current = t);
-  }, [t]), a(() => {
+  }, [r, n, v, f, p, y]), l(() => {
+    c && t.current !== null && t.current.pause();
+  }, [c]), l(() => {
+    m.current !== r && (m.current = r);
+  }, [r]), l(() => {
     var e;
-    d && ((e = r.current) == null || e.pause());
-  }, [d]), t != null && t !== "" ? /* @__PURE__ */ g(
+    d && ((e = t.current) == null || e.pause());
+  }, [d]), r != null && r !== "" ? /* @__PURE__ */ H(
     "div",
     {
-      id: "video-player-wrapper",
       className: "video-player__wrapper",
-      onKeyDown: K,
-      onKeyUp: P,
-      ref: s
+      id: "video-player-wrapper",
+      ref: o,
+      onKeyDown: k,
+      onKeyUp: K
     },
-    t
+    r
   ) : null;
 }
 export {
-  z as BCVideoPlayer,
-  z as default
+  E as BCVideoPlayer,
+  E as default
 };

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

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

package/dist/components/BasicGridModule/BasicGridModule.d.ts

@@ -1,24 +1,26 @@
-export function BasicGridModule({ children, gap, itemsPerRow, classname, title, infoPanel, itemComponent, infoPanelComponent, items, customClicksHandler, noAnimation, }: {
-    children: any;
-    gap?: string | undefined;
-    itemsPerRow?: number | undefined;
-    classname?: string | undefined;
-    title?: string | undefined;
-    infoPanel: any;
+type BasicGridModuleProps = {
+    children?: React.ReactNode;
+    gap?: string;
+    itemsPerRow?: number;
+    classname?: string;
+    title?: string;
+    infoPanel?: boolean;
     itemComponent?: {
         layout: string;
-        props: {
-            fullCardClickable: boolean;
-        };
-    } | undefined;
+        props: Record<string, unknown>;
+    };
     infoPanelComponent?: {
         layout: string;
         backButtonLabel: string;
-        resourceList: never[];
+        resourceList: Array<Record<string, unknown>> | [];
         classname: string;
-    } | undefined;
-    items?: never[] | undefined;
-    customClicksHandler?: null | undefined;
-    noAnimation?: boolean | undefined;
-}): import("react/jsx-runtime").JSX.Element;
+    };
+    items?: Array<Record<string, unknown>>;
+    customClicksHandler?: ((eventDetails: {
+        type: string;
+        resourceId: string;
+    }) => void) | null;
+    noAnimation?: boolean;
+};
+export declare function BasicGridModule({ gap, itemsPerRow, classname, title, itemComponent, infoPanelComponent, items, customClicksHandler, noAnimation, }: BasicGridModuleProps): JSX.Element;
 export default BasicGridModule;

package/dist/components/BasicGridModule/BasicGridModule.js

@@ -1,23 +1,21 @@
-import { jsxs as g, Fragment as j, jsx as u } from "react/jsx-runtime";
-import { useState as r, useRef as p, useCallback as F, useEffect as y, createElement as G } from "react";
+import { jsxs as p, Fragment as j, jsx as u } from "react/jsx-runtime";
+import { useState as n, useRef as g, useCallback as F, useEffect as y, createElement as G } from "react";
 import { classes as O } from "../../utils/helpers.js";
-import { blockLayoutsMap as P } from "../../settings.js";
-import { EqualSizeGrid as _ } from "../EqualSizeGrid/EqualSizeGrid.js";
-import { InfoPanel as q } from "../InfoPanel/InfoPanel.js";
-import '../../assets/BasicGridModule.css';function T({
-  children: z,
+import { blockLayoutsMap as _ } from "../../settings.js";
+import { EqualSizeGrid as q } from "../EqualSizeGrid/EqualSizeGrid.js";
+import { InfoPanel as z } from "../InfoPanel/InfoPanel.js";
+import '../../assets/BasicGridModule.css';function K({
   gap: b = "1.5rem",
   itemsPerRow: k = 4,
   classname: L = "",
   title: d = "",
-  infoPanel: A,
   itemComponent: s = {
     layout: "ImageCard",
     props: {
       fullCardClickable: !1
     }
   },
-  infoPanelComponent: n = {
+  infoPanelComponent: r = {
     layout: "",
     backButtonLabel: "Return to List",
     resourceList: [],
@@ -25,64 +23,72 @@ import '../../assets/BasicGridModule.css';function T({
   },
   items: E = [],
   customClicksHandler: I = null,
-  noAnimation: x = !1
+  noAnimation: v = !1
 }) {
-  const [a, f] = r(!1), [C, B] = r({}), [m, R] = r(null), [v, c] = r("entering"), [M, N] = r(x ? null : !0), o = p("entering"), e = p(null), l = F(() => {
-    e.current.children[0].addEventListener("animationstart", () => {
-      console.log("animation started"), e.current.children[0].addEventListener("animationend", l, { once: !0 });
+  const [a, f] = n(!1), [x, C] = n({}), [m, B] = n(void 0), [R, c] = n("entering"), [M, N] = n(v ? null : !0), o = g("entering"), e = g(null), i = F(() => {
+    e.current !== null && e.current.children[0].addEventListener("animationstart", () => {
+      e.current !== null && e.current.children[0].addEventListener("animationend", i, { once: !0 });
     }), o.current === "exiting" ? (c("entering"), o.current = "entering", f(!0)) : c("idle");
   }, []), S = (t) => {
-    t.type === "info-panel" && (B(n.resourceList.find((i) => Number.parseInt(i.id, 10) === Number.parseInt(t.resourceId, 10))), N(!1), o.current = "exiting", c("exiting"));
+    t.type === "info-panel" && (C(r.resourceList.find((l) => Number.parseInt(l.id, 10) === Number.parseInt(t.resourceId, 10)) ?? {}), N(!1), o.current = "exiting", c("exiting"));
   };
   return y(() => {
-    R(P.get(s.layout));
+    B(_.get(s.layout));
   }, [s.layout]), y(() => {
-    var t, i, h;
-    !a && e.current !== null && ((t = e.current) != null && t.children, e.current.children.length && ((i = e.current.children[0]) == null || i.removeEventListener("animationend", l, { once: !0 }), (h = e.current.children[0]) == null || h.addEventListener("animationend", l, { once: !0 })));
-  }, [a, l]), /* @__PURE__ */ g(j, { children: [
-    !a && /* @__PURE__ */ g("basic-grid-module", { "data-state": v, "first-entry": M, ref: e, children: [
-      d !== "" && /* @__PURE__ */ u("h2", { className: O(["basic-grid-module__header", "h4"]), children: d }),
-      m !== null && /* @__PURE__ */ u(
-        _,
-        {
-          gap: b,
-          itemsPerRow: k,
-          classname: L,
-          children: E.map(
-            (t) => /* @__PURE__ */ G(
-              m,
-              {
-                ...t,
-                ...s.props,
-                relatedResourceId: t.id,
-                handleClicks: I ?? S,
-                key: `grid-item-${Math.round(Math.random() * 1e7)}`
-              }
-            )
+    var t, l, h;
+    !a && e.current !== null && ((t = e.current) != null && t.children, e.current.children.length && ((l = e.current.children[0]) == null || l.removeEventListener("animationend", i), (h = e.current.children[0]) == null || h.addEventListener("animationend", i, { once: !0 })));
+  }, [a, i]), /* @__PURE__ */ p(j, { children: [
+    !a && /* @__PURE__ */ p(
+      "basic-grid-module",
+      {
+        "data-state": R,
+        "first-entry": M,
+        ref: e,
+        children: [
+          d !== "" && /* @__PURE__ */ u("h2", { className: O(["basic-grid-module__header", "h4"]), children: d }),
+          m !== void 0 && /* @__PURE__ */ u(
+            q,
+            {
+              classname: L,
+              gap: b,
+              itemsPerRow: k,
+              children: E.map(
+                (t) => /* @__PURE__ */ G(
+                  m,
+                  {
+                    ...t,
+                    ...s.props,
+                    handleClicks: I ?? S,
+                    key: `grid-item-${Math.round(Math.random() * 1e7)}`,
+                    relatedResourceId: t.id
+                  }
+                )
+              )
+            }
           )
-        }
-      )
-    ] }),
-    a && n.layout && /* @__PURE__ */ u(
-      q,
+        ]
+      }
+    ),
+    a && r.layout && /* @__PURE__ */ u(
+      z,
       {
+        backButtonLabel: r.backButtonLabel,
         className: "grid-info-panel",
-        onBackClicked: () => {
-          f(!1);
-        },
-        backButtonLabel: n.backButtonLabel,
+        classname: r.classname,
         layoutComponent: {
-          layout: n.layout,
+          layout: r.layout,
           props: {
-            ...C
+            ...x
           }
         },
-        classname: n.classname
+        onBackClicked: () => {
+          f(!1);
+        }
       }
     )
   ] });
 }
 export {
-  T as BasicGridModule,
-  T as default
+  K as BasicGridModule,
+  K as default
 };

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

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

package/dist/components/Button/Button.d.ts

@@ -1,19 +1,20 @@
-export function Button({ type, label, href, varient, size, classname, customColors, onClick, ...attributes }: {
-    [x: string]: any;
-    type?: string | undefined;
-    label?: string | undefined;
-    href?: string | undefined;
-    varient?: string | undefined;
-    size?: string | undefined;
-    classname?: string | undefined;
+type ButtonProps = {
+    type?: 'button' | 'submit' | 'reset';
+    label?: string;
+    href?: string;
+    varient?: 'primary' | 'secondary' | 'tertiary' | 'outline' | 'text' | '';
+    size?: 'small' | 'medium' | 'large' | '';
+    classname?: string;
     customColors?: {
-        bgColor: string;
-        bgHoverColor: string;
-        color: string;
-        hoverColor: string;
-        borderColor: string;
-        borderHoverColor: string;
-    } | undefined;
-    onClick?: (() => void) | undefined;
-}): import("react/jsx-runtime").JSX.Element;
+        bgColor?: string;
+        bgHoverColor?: string;
+        color?: string;
+        hoverColor?: string;
+        borderColor?: string;
+        borderHoverColor?: string;
+    };
+    onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    [x: string]: unknown;
+};
+export declare function Button({ type, label, href, varient, size, classname, customColors, onClick, ...attributes }: ButtonProps): JSX.Element;
 export default Button;

package/dist/components/Button/Button.js

@@ -1,22 +1,21 @@
-import { jsx as t, Fragment as p } from "react/jsx-runtime";
-import "react";
-import { classes as i } from "../../utils/helpers.js";
-import '../../assets/Button.css';const H = "_btn_14dnz_1", o = {
-  btn: H,
-  "btn--small": "_btn--small_14dnz_26",
-  "btn--large": "_btn--large_14dnz_33",
-  "btn--primary": "_btn--primary_14dnz_40",
-  "btn--action": "_btn--action_14dnz_49",
-  "btn--info": "_btn--info_14dnz_58",
-  "btn--danger": "_btn--danger_14dnz_67"
+import { jsx as t, Fragment as H } from "react/jsx-runtime";
+import { classes as v } from "../../utils/helpers.js";
+import '../../assets/Button.css';const p = "_btn_1mi8a_1", o = {
+  btn: p,
+  "btn--small": "_btn--small_1mi8a_26",
+  "btn--large": "_btn--large_1mi8a_33",
+  "btn--primary": "_btn--primary_1mi8a_40",
+  "btn--action": "_btn--action_1mi8a_49",
+  "btn--info": "_btn--info_1mi8a_58",
+  "btn--danger": "_btn--danger_1mi8a_67"
 };
-function z({
+function f({
   type: h = "button",
   label: e = "",
   href: l = "",
-  varient: n = "primary",
-  size: b = "",
-  classname: d = "",
+  varient: b = "primary",
+  size: n = "",
+  classname: a = "",
   customColors: r = {
     bgColor: "",
     bgHoverColor: "",
@@ -29,7 +28,7 @@ function z({
   },
   ..._
 }) {
-  const a = n === "" ? "" : `btn--${n}`, g = b === "" ? "" : `btn--${b}`, v = r.bgColor !== "" ? {
+  const d = b === "" ? "" : `btn--${b}`, g = n === "" ? "" : `btn--${n}`, i = r.bgColor !== "" ? {
     "--button-bg-color": r.bgColor,
     "--button-hover-bg-color": r.bgHoverColor === "" ? r.bgColor : r.bgHoverColor,
     "--button-color": r.color,
@@ -37,40 +36,40 @@ function z({
     "--button-border-color": r.borderColor === "" ? r.bgColor : r.borderColor,
     "--button-hover-border-color": r.borderHoverColor === "" && r.borderColor === "" ? r.bgColor : r.borderHoverColor
   } : null;
-  return /* @__PURE__ */ t(p, { children: l === "" ? /* @__PURE__ */ t(
+  return /* @__PURE__ */ t(H, { children: l === "" ? /* @__PURE__ */ t(
     "button",
     {
-      type: h,
-      onClick: c,
-      className: i([
-        d,
+      className: v([
+        a,
         o.btn,
         "btn",
-        n === "" ? "" : o[a],
-        b === "" ? "" : o[g]
+        b === "" ? "" : o[d],
+        n === "" ? "" : o[g]
       ]),
-      style: v,
+      style: i,
+      type: h,
+      onClick: c,
       ..._,
       children: e
     }
   ) : /* @__PURE__ */ t(
     "a",
     {
-      href: l,
-      className: i([
-        d,
+      className: v([
+        a,
         o.btn,
         "btn",
-        n === "" ? "" : o[a],
-        b === "" ? "" : o[g]
+        b === "" ? "" : o[d],
+        n === "" ? "" : o[g]
       ]),
-      style: v,
+      href: l,
+      style: i,
       ..._,
       children: e
     }
   ) });
 }
 export {
-  z as Button,
-  z as default
+  f as Button,
+  f as default
 };

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

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

package/dist/components/ButtonAnchor/ButtonAnchor.d.ts

@@ -1,6 +1,6 @@
-export function ButtonAnchor({ label, onClick, classname }: {
-    label?: string | undefined;
-    onClick?: (() => void) | undefined;
-    classname?: string | undefined;
-}): import("react/jsx-runtime").JSX.Element;
+export declare function ButtonAnchor({ label, onClick, classname, }: {
+    label: string;
+    onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    classname?: string;
+}): JSX.Element;
 export default ButtonAnchor;

package/dist/components/ButtonAnchor/ButtonAnchor.js

@@ -1,7 +1,9 @@
 import { jsx as r } from "react/jsx-runtime";
-import "react";
-function a({ label: t = "", onClick: o = () => {
-}, classname: n = "" }) {
+function u({
+  label: t = "",
+  onClick: o = void 0,
+  classname: n = ""
+}) {
   return /* @__PURE__ */ r(
     "button",
     {
@@ -13,6 +15,6 @@ function a({ label: t = "", onClick: o = () => {
   );
 }
 export {
-  a as ButtonAnchor,
-  a as default
+  u as ButtonAnchor,
+  u as default
 };

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

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

package/dist/components/Carousel/Carousel.d.ts

@@ -1,25 +1,8 @@
-export function Carousel({ id, slides, options }: {
-    id: any;
-    slides: any;
-    options?: {
-        paginationType: string;
-        showControls: boolean;
-        controlArrowSize: number;
-        controlButtonsOffset: number;
-        showScrollbar: boolean;
-        startIndex: number;
-        variableHeight: boolean;
-        title: string;
-        autoplay: boolean;
-        autoplayDelay: number;
-        showPagination: boolean;
-        gutterSize: number;
-        slideAspectRatio: string;
-        slideGap: number;
-        cellsPerSlide: number;
-        cellAspectRatio: string;
-        cellsPosition: string;
-        wrapAround: boolean;
-    } | undefined;
-}): import("react/jsx-runtime").JSX.Element;
+import { CarouselCell, CarouselOptions } from '../../types';
+type CarouselProps = {
+    id: string | number;
+    cells: CarouselCell[];
+    options?: CarouselOptions;
+};
+export declare function Carousel({ id, cells, options, }: CarouselProps): JSX.Element;
 export default Carousel;