@capillarytech/blaze-ui 6.3.0 → 6.4.0

package/CapTimeline/CapTimelinePanesWrapper.d.ts

@@ -1,28 +1,7 @@
-import PropTypes from 'prop-types';
 import React from 'react';
-import './styles.scss';
-export declare const CapTimelinePanesWrapper: {
-    ({ className, isReviewScreen, activeTab, timelineLeftPaneContents, timelineRightCards, }: {
-        className: any;
-        isReviewScreen: any;
-        activeTab: any;
-        timelineLeftPaneContents: any;
-        timelineRightCards: any;
-    }): import("react/jsx-runtime").JSX.Element;
-    propTypes: {
-        className: PropTypes.Requireable<string>;
-        isReviewScreen: PropTypes.Requireable<boolean>;
-        activeTab: PropTypes.Requireable<string>;
-        timelineLeftPaneContents: PropTypes.Requireable<object>;
-        timelineRightCards: PropTypes.Requireable<any[]>;
-    };
-};
-declare const _default: React.ComponentType<Omit<{
-    className: any;
-    isReviewScreen: any;
-    activeTab: any;
-    timelineLeftPaneContents: any;
-    timelineRightCards: any;
-} & import("react-intl").WrappedComponentProps, "intl">>;
+import type { WrappedComponentProps } from 'react-intl';
+import type { CapTimelinePanesWrapperProps } from './types';
+export declare const CapTimelinePanesWrapper: ({ className, isReviewScreen, activeTab, timelineLeftPaneContents, timelineRightCards, timelineClassName, }: CapTimelinePanesWrapperProps & WrappedComponentProps) => import("react/jsx-runtime").JSX.Element;
+declare const _default: React.ComponentType<Omit<CapTimelinePanesWrapperProps & WrappedComponentProps, "intl">>;
 export default _default;
 //# sourceMappingURL=CapTimelinePanesWrapper.d.ts.map

package/CapTimeline/CapTimelinePanesWrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CapTimelinePanesWrapper.d.ts","sourceRoot":"","sources":["../../components/CapTimeline/CapTimelinePanesWrapper.tsx"],"names":[],"mappings":"AAIA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,eAAe,CAAC;AAIvB,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;CAuCnC,CAAC;;;;;;;;AAUF,wBAEG"}
+{"version":3,"file":"CapTimelinePanesWrapper.d.ts","sourceRoot":"","sources":["../../components/CapTimeline/CapTimelinePanesWrapper.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAOxD,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAC;AAI5D,eAAO,MAAM,uBAAuB,GAAI,4GAOrC,4BAA4B,GAAG,qBAAqB,4CA+CtD,CAAC;;AAEF,wBAAmD"}

package/CapTimeline/CapTimelinePanesWrapper.js

@@ -1,47 +1,51 @@
 import { jsxs, jsx } from "react/jsx-runtime";
+import { Timeline } from "antd-v5";
 import classNames from "classnames";
-import PropTypes from "prop-types";
+import { injectIntl } from "react-intl";
 import CapColumn from "../CapColumn/index.js";
 import CapDivider from "../CapDivider/index.js";
 import CapRow from "../CapRow/index.js";
-import LocaleHoc from "../LocaleHoc/index.js";
-import './styles.css';/* empty css            */
+import styles from "./styles.module.scss.js";
 const clsPrefix = "cap-timeline-panes-wrapper-v1";
 const CapTimelinePanesWrapper = ({
   className,
   isReviewScreen,
   activeTab,
   timelineLeftPaneContents,
-  timelineRightCards
+  timelineRightCards,
+  timelineClassName
 }) => {
   const renderActiveTabContent = () => {
     return Object.keys(timelineLeftPaneContents).map((key, index) => {
-      const className2 = activeTab === key || isReviewScreen ? `${clsPrefix}-active-pane` : `${clsPrefix}-inactive-pane`;
-      return /* @__PURE__ */ jsx(CapRow, { className: classNames(className2), id: key, children: timelineLeftPaneContents[key] }, index);
+      const paneClassName = activeTab === key || isReviewScreen ? styles[`${clsPrefix}-active-pane`] : styles[`${clsPrefix}-inactive-pane`];
+      return /* @__PURE__ */ jsx(CapRow, { className: classNames(paneClassName), id: key, children: timelineLeftPaneContents[key] }, index);
     });
   };
-  return /* @__PURE__ */ jsxs(CapRow, { className: classNames(className, `${clsPrefix}-pane-wrapper`), children: [
-    /* @__PURE__ */ jsx(CapColumn, { className: classNames(`${clsPrefix}-left-pane-col`, `${clsPrefix}-custom-scroll`), children: timelineRightCards }),
-    /* @__PURE__ */ jsx(CapColumn, { className: classNames(`${clsPrefix}-divider-col`), children: /* @__PURE__ */ jsx(CapDivider, { className: `${clsPrefix}-timelinePane-divider`, type: "vertical" }) }),
+  return /* @__PURE__ */ jsxs(CapRow, { className: classNames(className, styles[`${clsPrefix}-pane-wrapper`]), children: [
     /* @__PURE__ */ jsx(
       CapColumn,
       {
-        className: classNames(`${clsPrefix}-right-pane-col`, `${clsPrefix}-custom-scroll`),
+        className: classNames(
+          styles[`${clsPrefix}-left-pane-col`],
+          styles[`${clsPrefix}-custom-scroll`]
+        ),
+        children: /* @__PURE__ */ jsx(Timeline, { className: timelineClassName, children: timelineRightCards.map((item) => /* @__PURE__ */ jsx(Timeline.Item, { dot: item.icon, className: item.className, children: item.content }, item.key)) })
+      }
+    ),
+    /* @__PURE__ */ jsx(CapColumn, { className: classNames(styles[`${clsPrefix}-divider-col`]), children: /* @__PURE__ */ jsx(CapDivider, { className: styles[`${clsPrefix}-timelinePane-divider`], type: "vertical" }) }),
+    /* @__PURE__ */ jsx(
+      CapColumn,
+      {
+        className: classNames(
+          styles[`${clsPrefix}-right-pane-col`],
+          styles[`${clsPrefix}-custom-scroll`]
+        ),
         children: renderActiveTabContent()
       }
     )
   ] });
 };
-CapTimelinePanesWrapper.propTypes = {
-  className: PropTypes.string,
-  isReviewScreen: PropTypes.bool,
-  activeTab: PropTypes.string,
-  timelineLeftPaneContents: PropTypes.object,
-  timelineRightCards: PropTypes.array
-};
-const CapTimelinePanesWrapper$1 = LocaleHoc(CapTimelinePanesWrapper, {
-  key: "CapTimelinePanesWrapper"
-});
+const CapTimelinePanesWrapper$1 = injectIntl(CapTimelinePanesWrapper);
 export {
   CapTimelinePanesWrapper,
   CapTimelinePanesWrapper$1 as default

package/CapTimeline/index.d.ts

@@ -3,22 +3,7 @@
  * CapTimeline
  *
  */
-import PropTypes from 'prop-types';
-import './styles.scss';
-declare const CapTimeline: {
-    ({ className, timelinePanes, activeTab, isReviewScreen, width }: {
-        className: any;
-        timelinePanes: any;
-        activeTab: any;
-        isReviewScreen: any;
-        width: any;
-    }): import("react/jsx-runtime").JSX.Element;
-    propTypes: {
-        timelinePanes: PropTypes.Requireable<any[]>;
-        currentStep: PropTypes.Requireable<string>;
-        setCurrentStep: PropTypes.Requireable<(...args: any[]) => any>;
-        width: PropTypes.Requireable<number>;
-    };
-};
+import type { CapTimelineProps } from './types';
+declare const CapTimeline: ({ className, timelinePanes, activeTab, isReviewScreen, width, }: CapTimelineProps) => import("react/jsx-runtime").JSX.Element;
 export default CapTimeline;
 //# sourceMappingURL=index.d.ts.map

package/CapTimeline/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../components/CapTimeline/index.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH,OAAO,SAAS,MAAM,YAAY,CAAC;AAOnC,OAAO,eAAe,CAAC;AAIvB,QAAA,MAAM,WAAW;;;;;;;;;;;;;;CA6DhB,CAAC;AASF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../components/CapTimeline/index.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAaH,OAAO,KAAK,EAAE,gBAAgB,EAAoB,MAAM,SAAS,CAAC;AAMlE,QAAA,MAAM,WAAW,GAAI,iEAMlB,gBAAgB,4CAoHlB,CAAC;AAEF,eAAe,WAAW,CAAC"}

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
+};