@capillarytech/blaze-ui 6.5.0 → 6.6.0

package/CapTimeline/index.js

@@ -1,13 +1,22 @@
 import { jsx } from "react/jsx-runtime";
-import { Timeline } from "antd";
 import classNames from "classnames";
-import PropTypes from "prop-types";
+import CapIcon from "../CapIcon/index.js";
 import CapRow from "../CapRow/index.js";
+import CapTooltip from "../CapTooltip/index.js";
+import * as styles__variables from "../styles/_variables.js";
 import CapTimelineCard from "./CapTimelineCard.js";
 import CapTimelinePanesWrapper from "./CapTimelinePanesWrapper.js";
-import './styles.css';/* empty css            */
+import styles from "./styles.module.scss.js";
+const { FONT_SIZE_M, CAP_G04, CAP_RED } = styles__variables;
+const clsCardPrefix = "cap-timeline-card-v1";
 const clsPrefix = "cap-timeline-v1";
-const CapTimeline = ({ className, timelinePanes, activeTab, isReviewScreen, width }) => {
+const CapTimeline = ({
+  className,
+  timelinePanes,
+  activeTab,
+  isReviewScreen,
+  width = 380
+}) => {
   const { timelineLeftPaneContents, timelineRightCards } = timelinePanes.reduce(
     (accumulator, {
       milestoneHeader,
@@ -22,10 +31,37 @@ const CapTimeline = ({ className, timelinePanes, activeTab, isReviewScreen, widt
       content,
       configError,
       edited,
-      handleClick
+      handleClick = () => {
+      }
     }, index) => {
-      accumulator.timelineRightCards.push(
-        /* @__PURE__ */ jsx(
+      const isSelected = activeTab === key;
+      const isLastPane = index === (timelinePanes == null ? void 0 : timelinePanes.length) - 1;
+      let icon;
+      if (disabled) {
+        icon = configError ? /* @__PURE__ */ jsx(CapIcon, { style: { color: CAP_RED, fontSize: FONT_SIZE_M }, type: "warning" }) : /* @__PURE__ */ jsx(
+          CapIcon,
+          {
+            style: { color: CAP_G04, fontSize: FONT_SIZE_M, marginTop: "1px" },
+            type: "exclamation-circle"
+          }
+        );
+      } else if (configError) {
+        icon = /* @__PURE__ */ jsx(CapTooltip, { title: "Warning", children: /* @__PURE__ */ jsx(CapIcon, { style: { color: CAP_RED, fontSize: FONT_SIZE_M }, type: "warning", size: "l" }) });
+      } else if (!complete || edited) {
+        icon = /* @__PURE__ */ jsx(CapTooltip, { title: "Pending", children: /* @__PURE__ */ jsx(
+          CapIcon,
+          {
+            style: { color: CAP_G04, fontSize: FONT_SIZE_M, marginTop: "1px" },
+            type: "exclamation-circle"
+          }
+        ) });
+      } else {
+        icon = /* @__PURE__ */ jsx(CapTooltip, { title: "Completed", children: /* @__PURE__ */ jsx("span", { className: styles[`${clsCardPrefix}-icon-parent`], children: /* @__PURE__ */ jsx(CapIcon, { type: "check", style: { fontSize: FONT_SIZE_M } }) }) });
+      }
+      const item = {
+        key,
+        icon,
+        content: /* @__PURE__ */ jsx(
           CapTimelineCard,
           {
             milestoneHeader,
@@ -37,15 +73,23 @@ const CapTimeline = ({ className, timelinePanes, activeTab, isReviewScreen, widt
             alwaysShowDescription,
             complete,
             configError,
-            isLastPane: index === (timelinePanes == null ? void 0 : timelinePanes.length) - 1 ? true : false,
-            width,
-            edited,
             handleClick,
-            isSelected: activeTab === key
-          },
-          key
+            isSelected,
+            isLastPane,
+            width
+          }
+        ),
+        className: classNames(
+          disabled ? styles[`${clsCardPrefix}-disabled-timeline-item`] : styles[`${clsCardPrefix}-enabled-timeline-item`],
+          isLastPane && styles[`${clsCardPrefix}-last-pane`],
+          !disabled && complete && styles[`${clsCardPrefix}-completed-tail`],
+          !disabled && configError && styles[`${clsCardPrefix}-warning-tail`],
+          !disabled && configError && styles[`${clsCardPrefix}-warning-card`],
+          !disabled && complete && !isSelected && styles[`${clsCardPrefix}-complete-head`],
+          !configError ? styles[`${clsCardPrefix}-division`] : styles[`${clsCardPrefix}-warning-division`]
         )
-      );
+      };
+      accumulator.timelineRightCards.push(item);
       accumulator.timelineLeftPaneContents[key] = content;
       return accumulator;
     },
@@ -54,21 +98,16 @@ const CapTimeline = ({ className, timelinePanes, activeTab, isReviewScreen, widt
       timelineRightCards: []
     }
   );
-  return /* @__PURE__ */ jsx(CapRow, { className, children: /* @__PURE__ */ jsx(Timeline, { className: classNames(`${clsPrefix}-body`), children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(CapRow, { className, children: /* @__PURE__ */ jsx(
     CapTimelinePanesWrapper,
     {
       activeTab,
       timelineLeftPaneContents,
       timelineRightCards,
-      isReviewScreen
+      isReviewScreen,
+      timelineClassName: styles[`${clsPrefix}-body`]
     }
-  ) }) });
-};
-CapTimeline.propTypes = {
-  timelinePanes: PropTypes.array,
-  currentStep: PropTypes.string,
-  setCurrentStep: PropTypes.func,
-  width: PropTypes.number
+  ) });
 };
 export {
   CapTimeline as default

package/CapTimeline/messages.d.ts

@@ -0,0 +1,21 @@
+export declare const scope = "app.commonUtils.capUiLibrary.CapTimelineCard";
+declare const _default: {
+    defaultConfiguringMessage: {
+        id: string;
+        defaultMessage: string;
+    };
+    defaultNotConfiguredMessage: {
+        id: string;
+        defaultMessage: string;
+    };
+    toConfigure: {
+        id: string;
+        defaultMessage: string;
+    };
+    completePrevSteps: {
+        id: string;
+        defaultMessage: string;
+    };
+};
+export default _default;
+//# sourceMappingURL=messages.d.ts.map

package/CapTimeline/messages.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"messages.d.ts","sourceRoot":"","sources":["../../components/CapTimeline/messages.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,KAAK,iDAAiD,CAAC;;;;;;;;;;;;;;;;;;;AAEpE,wBAiBG"}

package/CapTimeline/messages.js

@@ -0,0 +1,24 @@
+import { defineMessages } from "react-intl";
+const scope = "app.commonUtils.capUiLibrary.CapTimelineCard";
+const messages = defineMessages({
+  defaultConfiguringMessage: {
+    id: `${scope}.defaultConfiguringMessage`,
+    defaultMessage: "Configuring..."
+  },
+  defaultNotConfiguredMessage: {
+    id: `${scope}.defaultNotConfiguredMessage`,
+    defaultMessage: "Not configured yet..."
+  },
+  toConfigure: {
+    id: `${scope}.toConfigure`,
+    defaultMessage: "To configure "
+  },
+  completePrevSteps: {
+    id: `${scope}.completePrevSteps`,
+    defaultMessage: " complete the previous steps."
+  }
+});
+export {
+  messages as default,
+  scope
+};

package/CapTimeline/styles.css

@@ -6,11 +6,8 @@
 /* Border Width */
 /* Transition */
 /* Timezones Footer */
-.cap-timeline-v1-body .ant-timeline-item-head-custom {
-  top: 1.428rem;
-}
-.cap-timeline-v1-body .ant-timeline-item-tail {
-  top: 1.857rem;
+.cap-timeline-v1-body .ant-timeline-item-rail {
+  top: 2.1rem !important;
 }
 .cap-timeline-card-v1-pane-selected {
   background-color: #e9f0fe;
@@ -34,6 +31,7 @@
 .cap-timeline-panes-wrapper-v1-right-pane-col {
   height: 74vh;
   overflow: auto;
+  color: rgba(0, 0, 0, 0.65);
 }
 .cap-timeline-panes-wrapper-v1-left-pane-col {
   width: 39%;
@@ -46,17 +44,19 @@
   margin-left: 1.428rem;
   margin-right: 1.714rem;
 }
-.cap-timeline-panes-wrapper-v1-divider-col .cap-timeline-panes-wrapper-v1-timelinePane-divider,
-.cap-timeline-panes-wrapper-v1-divider-col .ant-divider ant-divider-vertical {
+.cap-timeline-panes-wrapper-v1-divider-col .cap-timeline-panes-wrapper-v1-timelinePane-divider {
   margin: 0;
 }
-.cap-timeline-card-v1-division {
-  margin-bottom: 0.857rem;
+.ant-timeline-item.cap-timeline-card-v1-division .ant-timeline-item-icon {
+  border: 0.071rem solid #dfe2e7 !important;
+  border-radius: 50% !important;
+  padding: 0.214rem 0.214rem !important;
+  width: 1.714rem !important;
+  height: 1.714rem !important;
 }
-.cap-timeline-card-v1-division .ant-timeline-item-head {
-  border: 0.143rem solid #dfe2e7;
-  border-width: 0.071rem;
-  border-radius: 50%;
+.ant-timeline-item.cap-timeline-card-v1-warning-division .ant-timeline-item-icon {
+  border: 0.071rem solid #ea213a !important;
+  border-radius: 50% !important;
   padding: 0.214rem 0.214rem !important;
   width: 1.714rem !important;
   height: 1.714rem !important;
@@ -73,6 +73,7 @@
 }
 .cap-timeline-panes-wrapper-v1-pane-wrapper {
   display: flex;
+  flex-wrap: nowrap;
 }
 .cap-timeline-card-v1-disabled-timeline-item {
   cursor: not-allowed;
@@ -83,56 +84,55 @@
 .cap-timeline-card-v1-enabled-card:hover {
   background-color: #faf9f4;
 }
-.cap-timeline-card-v1-warning-card {
-  border-color: #ea213a;
-}
 .cap-timeline-card-v1-icon-parent {
   border-radius: 2.857rem;
   border-color: beige;
 }
-.cap-timeline-card-v1-card-body .ant-card-body {
-  padding: 0.571rem 1.142rem;
+.cap-timeline-card-v1-card-body .ant-card-body,
+.cap-timeline-card-v1-card-body .cap-card-wrapper .ant-card .ant-card-body {
+  padding: 0.571rem 1.142rem !important;
+  color: rgba(0, 0, 0, 0.65);
 }
-.cap-timeline-card-v1-last-pane .ant-timeline-item-tail {
+.cap-timeline-card-v1-last-pane .ant-timeline-item-rail {
   display: none;
 }
-.cap-timeline-card-v1-completed-tail .ant-timeline-item-tail {
+.cap-timeline-card-v1-completed-tail .ant-timeline-item-rail {
+  border-inline-start: 0.143rem solid #42b040;
   border-left: 0.143rem solid #42b040;
 }
-.cap-timeline-card-v1-warning-tail .ant-timeline-item-tail {
+.cap-timeline-card-v1-warning-tail .ant-timeline-item-rail {
+  border-inline-start: 0.143rem solid #e8e8e8;
   border-left: 0.143rem solid #e8e8e8;
 }
-.cap-timeline-card-v1-complete-head .ant-timeline-item-head {
-  border: 0.143rem solid #42b040;
-  border-width: 0.143rem;
+.ant-timeline-item.cap-timeline-card-v1-complete-head .ant-timeline-item-icon {
+  border: 0.143rem solid #42b040 !important;
+  border-radius: 50% !important;
+  width: 1.714rem !important;
+  height: 1.714rem !important;
+  overflow: hidden;
 }
 .cap-timeline-panes-wrapper-v1-timelinePane-divider.cap-divider-v2 {
   height: 32.857rem;
 }
-.cap-timeline-card-v1-warning-division {
-  margin-bottom: 0.857rem;
-}
-.cap-timeline-card-v1-warning-division .ant-timeline-item-head {
-  border: 0.143rem solid #ea213a;
-  border-width: 0.071rem;
-  border-radius: 50%;
-  padding: 0.214rem 0.214rem !important;
-  width: 1.714rem !important;
-  height: 1.714rem !important;
-}
 .ant-timeline-item {
   padding: 0;
 }
 .ant-timeline-item .ant-timeline-item-content {
   top: 0;
-  margin-left: 2.286rem;
 }
-.ant-timeline-item .ant-timeline-item-tail {
-  left: 0.857rem;
+.ant-timeline-item .ant-timeline-item-rail {
+  inset-inline-start: 0.857rem !important;
 }
-.ant-timeline-item .ant-timeline-item-head {
-  left: 0.857rem;
+.ant-timeline-item .ant-timeline-item-icon {
   display: flex;
   justify-content: center;
   align-items: center;
+  background-color: #ffffff;
+  z-index: 1;
+}
+.ant-timeline-item .ant-timeline-item-icon.ant-wave-target {
+  pointer-events: none;
+}
+.ant-timeline-item .ant-timeline-item-icon.ant-wave-target > * {
+  pointer-events: auto;
 }

package/CapTimeline/styles.module.scss.js

@@ -0,0 +1,30 @@
+import './styles.css';const styles = {
+  "cap-timeline-v1-body": "cap-timeline-v1-body",
+  "cap-timeline-card-v1-pane-selected": "cap-timeline-card-v1-pane-selected",
+  "cap-timeline-card-v1-card-description": "cap-timeline-card-v1-card-description",
+  "cap-timeline-panes-wrapper-v1-active-pane": "cap-timeline-panes-wrapper-v1-active-pane",
+  "cap-timeline-panes-wrapper-v1-inactive-pane": "cap-timeline-panes-wrapper-v1-inactive-pane",
+  "cap-timeline-panes-wrapper-v1-right-pane-content": "cap-timeline-panes-wrapper-v1-right-pane-content",
+  "cap-timeline-panes-wrapper-v1-left-pane-col": "cap-timeline-panes-wrapper-v1-left-pane-col",
+  "cap-timeline-panes-wrapper-v1-right-pane-col": "cap-timeline-panes-wrapper-v1-right-pane-col",
+  "cap-timeline-panes-wrapper-v1-divider-col": "cap-timeline-panes-wrapper-v1-divider-col",
+  "cap-timeline-panes-wrapper-v1-timelinePane-divider": "cap-timeline-panes-wrapper-v1-timelinePane-divider",
+  "cap-timeline-card-v1-division": "cap-timeline-card-v1-division",
+  "cap-timeline-card-v1-warning-division": "cap-timeline-card-v1-warning-division",
+  "cap-timeline-card-v1-disabled-card": "cap-timeline-card-v1-disabled-card",
+  "cap-timeline-card-v1-incomplete-card": "cap-timeline-card-v1-incomplete-card",
+  "cap-timeline-card-v1-warning-card": "cap-timeline-card-v1-warning-card",
+  "cap-timeline-panes-wrapper-v1-pane-wrapper": "cap-timeline-panes-wrapper-v1-pane-wrapper",
+  "cap-timeline-card-v1-disabled-timeline-item": "cap-timeline-card-v1-disabled-timeline-item",
+  "cap-timeline-card-v1-enabled-timeline-item": "cap-timeline-card-v1-enabled-timeline-item",
+  "cap-timeline-card-v1-enabled-card": "cap-timeline-card-v1-enabled-card",
+  "cap-timeline-card-v1-icon-parent": "cap-timeline-card-v1-icon-parent",
+  "cap-timeline-card-v1-card-body": "cap-timeline-card-v1-card-body",
+  "cap-timeline-card-v1-last-pane": "cap-timeline-card-v1-last-pane",
+  "cap-timeline-card-v1-completed-tail": "cap-timeline-card-v1-completed-tail",
+  "cap-timeline-card-v1-warning-tail": "cap-timeline-card-v1-warning-tail",
+  "cap-timeline-card-v1-complete-head": "cap-timeline-card-v1-complete-head"
+};
+export {
+  styles as default
+};

package/CapTimeline/styles.scss

@@ -1,13 +1,11 @@
-@import "../styles/_variables.scss";
+@import '../styles/_variables.scss';
 
 .cap-timeline-v1-body {
-  .ant-timeline-item-head-custom {
-    top: $CAP_SPACE_20;
-  }
-  .ant-timeline-item-tail {
-    top: 1.857rem;
+  :global(.ant-timeline-item-rail) {
+    top: 2.1rem !important;
   }
 }
+
 .cap-timeline-card-v1-pane-selected {
   background-color: $CAP_PALE_GREY;
   border-left: solid $CAP_SPACE_04 map-get($CAP_SECONDARY, base);
@@ -35,6 +33,7 @@
 .cap-timeline-panes-wrapper-v1-right-pane-col {
   height: 74vh;
   overflow: auto;
+  color: rgba(0, 0, 0, 0.65);
 }
 
 .cap-timeline-panes-wrapper-v1-left-pane-col {
@@ -50,19 +49,27 @@
   margin-left: $CAP_SPACE_20;
   margin-right: $CAP_SPACE_24;
 
-  .cap-timeline-panes-wrapper-v1-timelinePane-divider,
-  .ant-divider ant-divider-vertical {
+  .cap-timeline-panes-wrapper-v1-timelinePane-divider {
     margin: 0;
   }
 }
 
-.cap-timeline-card-v1-division {
-  margin-bottom: $CAP_SPACE_12;
+// Need specificity >= (0,0,3,0) to override antd v5's
+// `.ant-steps .ant-steps-item-custom .ant-steps-item-icon { border: 0px }` rule (0,0,3,0)
+:global(.ant-timeline-item).cap-timeline-card-v1-division {
+  :global(.ant-timeline-item-icon) {
+    border: 0.071rem solid $CAP_G07 !important;
+    border-radius: 50% !important;
+    padding: 0.214rem 0.214rem !important;
+    width: $CAP_SPACE_24 !important;
+    height: $CAP_SPACE_24 !important;
+  }
+}
 
-  .ant-timeline-item-head {
-    border: 0.143rem solid $CAP_G07;
-    border-width: 0.071rem;
-    border-radius: 50%;
+:global(.ant-timeline-item).cap-timeline-card-v1-warning-division {
+  :global(.ant-timeline-item-icon) {
+    border: 0.071rem solid $CAP_RED !important;
+    border-radius: 50% !important;
     padding: 0.214rem 0.214rem !important;
     width: $CAP_SPACE_24 !important;
     height: $CAP_SPACE_24 !important;
@@ -84,90 +91,102 @@
 
 .cap-timeline-panes-wrapper-v1-pane-wrapper {
   display: flex;
+  flex-wrap: nowrap;
 }
 
 .cap-timeline-card-v1-disabled-timeline-item {
   cursor: not-allowed;
 }
+
 .cap-timeline-card-v1-enabled-timeline-item {
   cursor: pointer;
 }
+
 .cap-timeline-card-v1-enabled-card:hover {
   background-color: $CAP_COLOR_08;
 }
 
-.cap-timeline-card-v1-warning-card {
-  border-color: $CAP_RED;
-}
-
 .cap-timeline-card-v1-icon-parent {
   border-radius: 2.857rem;
   border-color: beige;
 }
 
+// Override the default antd v5 card body padding (1.714rem) to match cap-ui-library
+// Also override colorText token (#091e42) back to cap-ui-library's default rgba(0,0,0,0.65)
 .cap-timeline-card-v1-card-body {
-  .ant-card-body {
-    padding: $CAP_SPACE_08 $CAP_SPACE_16;
+  :global {
+    .ant-card-body,
+    .cap-card-wrapper .ant-card .ant-card-body {
+      padding: $CAP_SPACE_08 $CAP_SPACE_16 !important;
+      color: rgba(0, 0, 0, 0.65);
+    }
   }
 }
 
 .cap-timeline-card-v1-last-pane {
-  .ant-timeline-item-tail {
+  :global(.ant-timeline-item-rail) {
     display: none;
   }
 }
 
 .cap-timeline-card-v1-completed-tail {
-  .ant-timeline-item-tail {
+  :global(.ant-timeline-item-rail) {
+    border-inline-start: 0.143rem solid $CAP_COLOR_06;
     border-left: 0.143rem solid $CAP_COLOR_06;
   }
 }
 
 .cap-timeline-card-v1-warning-tail {
-  .ant-timeline-item-tail {
+  :global(.ant-timeline-item-rail) {
+    border-inline-start: 0.143rem solid $CAP_G12;
     border-left: 0.143rem solid $CAP_G12;
   }
 }
-.cap-timeline-card-v1-complete-head {
-  .ant-timeline-item-head {
-    border: 0.143rem solid $CAP_COLOR_06;
-    border-width: 0.143rem;
-  }
-}
 
-.cap-timeline-panes-wrapper-v1-timelinePane-divider.cap-divider-v2 {
-  height: 32.857rem;
-}
-
-.cap-timeline-card-v1-warning-division {
-  margin-bottom: $CAP_SPACE_12;
-
-  .ant-timeline-item-head {
-    border: 0.143rem solid $CAP_RED;
-    border-width: 0.071rem;
-    border-radius: 50%;
-    padding: 0.214rem 0.214rem !important;
+:global(.ant-timeline-item).cap-timeline-card-v1-complete-head {
+  :global(.ant-timeline-item-icon) {
+    border: 0.143rem solid $CAP_COLOR_06 !important;
+    border-radius: 50% !important;
     width: $CAP_SPACE_24 !important;
     height: $CAP_SPACE_24 !important;
+    overflow: hidden;
   }
 }
 
-.ant-timeline-item {
-  padding: 0;
-
-  .ant-timeline-item-content {
-    top: 0;
-    margin-left: 2.286rem;
-  }
-
-  .ant-timeline-item-tail {
-    left: $CAP_SPACE_12;
-  }
+.cap-timeline-panes-wrapper-v1-timelinePane-divider:global(.cap-divider-v2) {
+  height: 32.857rem;
+}
 
-  .ant-timeline-item-head {
-    left: $CAP_SPACE_12;
-    display: flex;
-    justify-content: center;
-    align-items: center;
+// antd v5 Timeline item positioning
+// antd v5 uses inset-inline-start (logical property) for absolute-positioned elements
+:global {
+  .ant-timeline-item {
+    padding: 0;
+
+    .ant-timeline-item-content {
+      top: 0;
+    }
+
+    // antd v5 .ant-steps-vertical rule has specificity (0,0,3,0) — need !important
+    .ant-timeline-item-rail {
+      inset-inline-start: $CAP_SPACE_12 !important;
+    }
+
+    .ant-timeline-item-icon {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      background-color: $CAP_WHITE;
+      z-index: 1;
+      // ant-wave-target intercepts pointer events, blocking inner tooltip hover.
+      // Pass pointer events through to children so tooltips trigger on hover.
+      &.ant-wave-target {
+        pointer-events: none;
+
+        > * {
+          pointer-events: auto;
+        }
+      }
+    }
   }
 }

package/CapTimeline/tests/CapTimeline.mockData.d.ts

@@ -0,0 +1,14 @@
+import type { TimelineItemData, TimelinePaneItem } from '../types';
+export declare const createPane: (overrides?: Partial<TimelinePaneItem>) => TimelinePaneItem;
+export declare const createPanes: () => TimelinePaneItem[];
+export declare const panesWrapperBaseProps: {
+    isReviewScreen: boolean;
+    activeTab: string;
+    timelineLeftPaneContents: {
+        tab1: string;
+        tab2: string;
+        tab3: string;
+    };
+    timelineRightCards: TimelineItemData[];
+};
+//# sourceMappingURL=CapTimeline.mockData.d.ts.map

package/CapTimeline/tests/CapTimeline.mockData.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CapTimeline.mockData.d.ts","sourceRoot":"","sources":["../../../components/CapTimeline/tests/CapTimeline.mockData.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEnE,eAAO,MAAM,UAAU,GAAI,YAAW,OAAO,CAAC,gBAAgB,CAAM,KAAG,gBAerE,CAAC;AAEH,eAAO,MAAM,WAAW,QAAO,gBAAgB,EAgB9C,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;;;;;;wBAe3B,gBAAgB,EAAE;CACxB,CAAC"}

package/CapTimeline/types.d.ts

@@ -0,0 +1,60 @@
+import type React from 'react';
+export interface TimelinePaneItem {
+    milestoneHeader?: React.ReactNode;
+    milestoneDescription?: React.ReactNode;
+    disabled?: boolean;
+    configuringMessage?: string;
+    notConfiguredMessage?: string;
+    key: string;
+    paneKey?: string | number;
+    alwaysShowDescription?: boolean;
+    complete?: boolean;
+    content?: React.ReactNode;
+    configError?: boolean;
+    edited?: boolean;
+    handleClick?: () => void;
+}
+export interface CapTimelineProps {
+    className?: string;
+    timelinePanes: TimelinePaneItem[];
+    activeTab?: string;
+    isReviewScreen?: boolean;
+    width?: number;
+}
+export interface CapTimelineCardProps {
+    className?: string;
+    isSelected?: boolean;
+    handleClick?: () => void;
+    milestoneHeader?: React.ReactNode;
+    milestoneDescription?: React.ReactNode;
+    disabled?: boolean;
+    configuringMessage?: string;
+    notConfiguredMessage?: string;
+    alwaysShowDescription?: boolean;
+    complete?: boolean;
+    configError?: boolean;
+    defaultConfiguringMessage?: string;
+    paneKey?: string | number;
+    isLastPane?: boolean;
+    width?: number;
+    defaultNotConfiguredMessage?: string;
+    toConfigure?: string;
+    completePrevSteps?: string;
+    edited?: boolean;
+}
+/** Represents a single antd v5 Timeline item data object */
+export interface TimelineItemData {
+    key?: string;
+    icon?: React.ReactNode;
+    content?: React.ReactNode;
+    className?: string;
+}
+export interface CapTimelinePanesWrapperProps {
+    className?: string;
+    isReviewScreen?: boolean;
+    activeTab?: string;
+    timelineLeftPaneContents: Record<string, React.ReactNode>;
+    timelineRightCards: TimelineItemData[];
+    timelineClassName?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/CapTimeline/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../components/CapTimeline/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,WAAW,gBAAgB;IAC/B,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,oBAAoB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC1B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,gBAAgB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,gBAAgB,EAAE,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,oBAAoB;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,oBAAoB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,4DAA4D;AAC5D,MAAM,WAAW,gBAAgB;IAC/B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,4BAA4B;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wBAAwB,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC1D,kBAAkB,EAAE,gBAAgB,EAAE,CAAC;IACvC,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B"}

package/CapTimeline/types.js

@@ -0,0 +1 @@
+

package/index.d.ts

@@ -61,6 +61,10 @@ export { default as CapCalendarDatePicker } from './CapCalendarDatePicker';
 export type { CapCalendarDatePickerProps } from './CapCalendarDatePicker/types';
 export { default as CapDivider } from './CapDivider';
 export type { CapDividerProps } from './CapDivider/types';
+export { default as CapDndGraphSidebar } from './CapDndGraphSidebar';
+export type { CapDndGraphSidebarProps, Node, ChildNode, SideBarIconProps, SidebarNodesRenderedProps, } from './CapDndGraphSidebar/types';
+export { default as CapDragAndDrop } from './CapDragAndDrop';
+export type { CapDragAndDropProps } from './CapDragAndDrop/types';
 export { default as CapDragReorder } from './CapDragReorder';
 export type { CapDragReorderProps, CardData, DragItem as CapDragReorderDragItem, } from './CapDragReorder/types';
 export { default as CapDrawer } from './CapDrawer';
@@ -119,6 +123,8 @@ export { default as CapMenu } from './CapMenu';
 export type { CapMenuProps } from './CapMenu';
 export { default as CapModal } from './CapModal';
 export type { CapModalProps, CapModalStaticMethods } from './CapModal/types';
+export { default as CapMediaPreview } from './CapMediaPreview';
+export type { CapMediaPreviewProps, MediaItem, MediaRendererProps, ImageRendererProps, VideoPlayerProps, } from './CapMediaPreview/types';
 export { default as CapMobileDatePicker } from './CapMobileDatePicker';
 export type { CapMobileDatePickerProps } from './CapMobileDatePicker/types';
 export { default as CapMobileDateRangePicker } from './CapMobileDateRangePicker';
@@ -196,6 +202,8 @@ export type { CapTabProps, TabPaneData, DeprecatedTabPosition } from './CapTab/t
 export { default as CapTable } from './CapTable';
 export type { CapTableProps, OffsetLimit } from './CapTable';
 export { default as CapTabV3 } from './CapTabV3';
+export { default as CapTimeline } from './CapTimeline';
+export type { CapTimelineCardProps, CapTimelinePanesWrapperProps, CapTimelineProps, TimelinePaneItem, } from './CapTimeline/types';
 export { default as CapTimePicker } from './CapTimePicker';
 export type { CapTimePickerProps } from './CapTimePicker';
 export type { CapTabV3Props } from './CapTabV3/types';