@spaced-out/ui-design-system 0.4.13-beta.1 → 0.4.14

package/lib/components/Textarea/Textarea.stories.js

@@ -1,329 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports._WithHelperText = exports._TextCounter = exports._Required = exports._Error = exports._Default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _Textarea = require("./Textarea");
-var _TextareaStoriesModule = _interopRequireDefault(require("./Textarea.stories.module.css"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-var _default = exports.default = {
-  tags: ['autodocs'],
-  title: 'Form Components/Textarea',
-  component: _Textarea.Textarea,
-  argTypes: {
-    size: {
-      description: 'Textarea supports only two size variants namely small and medium. `small` < `medium`',
-      options: ['medium', 'small'],
-      control: {
-        type: 'select'
-      },
-      table: {
-        type: {
-          summary: 'enum'
-        },
-        defaultValue: {
-          summary: 'medium'
-        }
-      }
-    },
-    value: {
-      description: 'Value of the textarea',
-      control: {
-        type: 'text'
-      },
-      table: {
-        type: {
-          summary: 'string'
-        }
-      }
-    },
-    name: {
-      description: 'Name of the textarea',
-      control: {
-        type: 'text'
-      },
-      table: {
-        type: {
-          summary: 'string'
-        }
-      }
-    },
-    disabled: {
-      description: 'if **true**, the component is disabled',
-      control: {
-        type: 'boolean'
-      },
-      table: {
-        type: {
-          summary: 'boolean'
-        },
-        defaultValue: {
-          summary: 'false'
-        }
-      }
-    },
-    required: {
-      description: 'if **true**, a red star would be added to the label',
-      control: {
-        type: 'boolean'
-      },
-      table: {
-        type: {
-          summary: 'boolean'
-        },
-        defaultValue: {
-          summary: 'false'
-        }
-      }
-    },
-    placeholder: {
-      description: 'Placeholder of textarea. This appears inside the textarea box',
-      control: {
-        type: 'text'
-      },
-      table: {
-        type: {
-          summary: 'string'
-        }
-      }
-    },
-    locked: {
-      description: 'if **true**, the component is locked, Locked state is the readonly state of the input',
-      control: {
-        type: 'boolean'
-      },
-      table: {
-        type: {
-          summary: 'boolean'
-        },
-        defaultValue: {
-          summary: 'false'
-        }
-      }
-    },
-    error: {
-      description: 'if **true**, the component is moved to error state, Error state displays a red border surrounding textarea',
-      control: {
-        type: 'boolean'
-      },
-      table: {
-        type: {
-          summary: 'boolean'
-        },
-        defaultValue: {
-          summary: 'false'
-        }
-      }
-    },
-    errorText: {
-      description: 'Error text to be displayed on the bottom of the textarea. This uses `colorTextDanger`',
-      control: {
-        type: 'text'
-      },
-      table: {
-        type: {
-          summary: 'string'
-        }
-      }
-    },
-    label: {
-      description: 'Primary label of the textarea. This appears on top of textarea',
-      control: {
-        type: 'text'
-      },
-      table: {
-        type: {
-          summary: 'string'
-        }
-      }
-    },
-    helperText: {
-      description: 'Secondary label of the textarea. This appears on bottom of textarea, if the textarea is in `error` state the priority is given to `errorText`, in such cases secondary label wont be displayed',
-      control: {
-        type: 'text'
-      },
-      table: {
-        type: {
-          summary: 'string'
-        }
-      }
-    },
-    classNames: {
-      description: 'External classnames to be applied',
-      control: {
-        type: 'object'
-      },
-      table: {
-        type: {
-          summary: '{box?: string, textarea?: string}'
-        }
-      }
-    },
-    textCountLimit: {
-      description: 'A limit counter is appended to the top right of textarea. Text area would automatically move to error state if the text count exceeds limit. The counter keeps updating on keydown',
-      control: {
-        type: 'number'
-      },
-      table: {
-        type: {
-          summary: 'number'
-        }
-      }
-    },
-    onChange: {
-      description: '**onChange** handler is triggered when there is a change in input value',
-      action: 'changed',
-      table: {
-        type: {
-          summary: 'onChange?: ( evt: SyntheticInputEvent<HTMLInputElement>) => mixed'
-        }
-      }
-    },
-    onFocus: {
-      description: '**onFocus** handler is triggered when input is focussed',
-      action: 'focussed',
-      table: {
-        type: {
-          summary: '(e: SyntheticInputEvent<HTMLInputElement>) => mixed'
-        }
-      }
-    },
-    onBlur: {
-      description: '**onBlur** handler is triggered when input is blurred',
-      action: 'blurred',
-      table: {
-        type: {
-          summary: '(e: SyntheticInputEvent<HTMLInputElement>) => mixed'
-        }
-      }
-    },
-    onKeyDown: {
-      description: '**onKeyDown** handler is triggered on keypress',
-      action: 'onKeyDowned',
-      table: {
-        type: {
-          summary: '(e: SyntheticInputEvent<HTMLInputElement>) => mixed'
-        }
-      }
-    }
-  },
-  parameters: {
-    docs: {
-      subtitle: 'Generates a Textarea component',
-      description: {
-        component: `
-\`\`\`js
-import { Textarea } from "@spaced-out/ui-design-system/lib/components/Textarea";
-\`\`\`
-Basic textarea component which supports error, disabled and locked states.
-Textarea alo supports a bunch of callbacks listed below.
-Textarea supports helperText prop to pass in the secondary label.
-        `
-      }
-    },
-    storySource: {
-      componentPath: '/src/components/Textarea/Textarea.jsx'
-    }
-  }
-};
-const _Default = args => {
-  const [value, setValue] = React.useState(args.value);
-  React.useEffect(() => {
-    setValue(args.value);
-  }, [args.value]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: _TextareaStoriesModule.default.inputContainer
-  }, /*#__PURE__*/React.createElement(_Textarea.Textarea, _extends({}, args, {
-    onChange: e => setValue(e.target.value),
-    value: value
-  })));
-};
-exports._Default = _Default;
-_Default.args = {
-  label: 'Form Label',
-  placeholder: 'Input Some text here',
-  size: 'medium'
-};
-const _WithHelperText = args => {
-  const [value, setValue] = React.useState(args.value);
-  React.useEffect(() => {
-    setValue(args.value);
-  }, [args.value]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: _TextareaStoriesModule.default.inputContainer
-  }, /*#__PURE__*/React.createElement(_Textarea.Textarea, _extends({}, args, {
-    onChange: e => setValue(e.target.value),
-    value: value
-  })));
-};
-exports._WithHelperText = _WithHelperText;
-_WithHelperText.args = {
-  label: 'Form Label',
-  placeholder: 'Input Some text here',
-  helperText: 'Gain some help from here',
-  size: 'medium'
-};
-const _Required = args => {
-  const [value, setValue] = React.useState(args.value);
-  React.useEffect(() => {
-    setValue(args.value);
-  }, [args.value]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: _TextareaStoriesModule.default.inputContainer
-  }, /*#__PURE__*/React.createElement(_Textarea.Textarea, _extends({}, args, {
-    onChange: e => setValue(e.target.value),
-    value: value
-  })));
-};
-exports._Required = _Required;
-_Required.args = {
-  label: 'Form Label',
-  placeholder: 'Input Some text here',
-  required: true,
-  size: 'medium'
-};
-const _TextCounter = args => {
-  const [value, setValue] = React.useState(args.value);
-  React.useEffect(() => {
-    setValue(args.value);
-  }, [args.value]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: _TextareaStoriesModule.default.inputContainer
-  }, /*#__PURE__*/React.createElement(_Textarea.Textarea, _extends({}, args, {
-    onChange: e => setValue(e.target.value),
-    value: value
-  })));
-};
-exports._TextCounter = _TextCounter;
-_TextCounter.args = {
-  label: 'Form Label',
-  placeholder: 'Input Some text here',
-  helperText: 'Text area would automatically move to error state when the text count exceeds limit',
-  size: 'medium',
-  textCountLimit: 500
-};
-const _Error = args => {
-  const [value, setValue] = React.useState(args.value);
-  React.useEffect(() => {
-    setValue(args.value);
-  }, [args.value]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: _TextareaStoriesModule.default.inputContainer
-  }, /*#__PURE__*/React.createElement(_Textarea.Textarea, _extends({}, args, {
-    onChange: e => setValue(e.target.value),
-    value: value
-  })));
-};
-exports._Error = _Error;
-_Error.args = {
-  label: 'Form Label',
-  placeholder: 'Input Some text here',
-  required: true,
-  size: 'medium',
-  error: true,
-  errorText: 'This is an error text.'
-};

package/lib/components/Textarea/index.d.ts

@@ -1,3 +0,0 @@
-export type { TextareaProps } from './Textarea';
-export { Textarea } from './Textarea';
-//# sourceMappingURL=index.d.ts.map

package/lib/components/Textarea/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAC,aAAa,EAAC,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAC,QAAQ,EAAC,MAAM,YAAY,CAAC"}

package/lib/components/Timeline/Timeline.d.ts

@@ -1,18 +0,0 @@
-import { Flow } from 'flow-to-typescript-codemod';
-import * as React from 'react';
-export declare const ORIENTATION: Readonly<{
-    left: "left";
-    right: "right";
-}>;
-type ClassNames = Readonly<{
-    wrapper?: string;
-}>;
-export type Orientation = typeof ORIENTATION[keyof typeof ORIENTATION];
-export type TimelineProps = {
-    children: React.ReactNode;
-    classNames?: ClassNames;
-    orientation?: Orientation;
-};
-export declare const Timeline: Flow.AbstractComponent<TimelineProps, HTMLDivElement>;
-export {};
-//# sourceMappingURL=Timeline.d.ts.map

package/lib/components/Timeline/Timeline.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Timeline.d.ts","sourceRoot":"","sources":["../../../src/components/Timeline/Timeline.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAChD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,eAAO,MAAM,WAAW;;;EAGtB,CAAC;AAEH,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;AACH,MAAM,MAAM,WAAW,GAAG,OAAO,WAAW,CAAC,MAAM,OAAO,WAAW,CAAC,CAAC;AAEvE,MAAM,MAAM,aAAa,GAAG;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B,CAAC;AAkCF,eAAO,MAAM,QAAQ,EAAkE,IAAI,CAAC,iBAAiB,CAAC,aAAa,EAAE,cAAc,CAAE,CAAC"}

package/lib/components/Timeline/Timeline.stories.d.ts

@@ -1,62 +0,0 @@
-import * as React from 'react';
-import type { TimelineProps } from './';
-declare const _default: {
-    tags: string[];
-    title: string;
-    component: import("flow-to-typescript-codemod").Flow.AbstractComponent<TimelineProps, HTMLDivElement>;
-    argTypes: {
-        classNames: {
-            description: string;
-            control: {
-                type: string;
-            };
-            table: {
-                type: {
-                    summary: string;
-                };
-            };
-        };
-        orientation: {
-            control: {
-                type: string;
-            };
-            options: unknown[];
-            description: string;
-            table: {
-                type: {
-                    summary: string;
-                };
-                defaultValue: {
-                    summary: "left";
-                };
-                disable: boolean;
-            };
-        };
-        children: {
-            description: string;
-            type: {
-                required: boolean;
-            };
-            table: {
-                type: {
-                    summary: string;
-                };
-            };
-        };
-    };
-    parameters: {
-        docs: {
-            subtitle: string;
-            description: {
-                component: string;
-            };
-        };
-        storySource: {
-            componentPath: string;
-        };
-    };
-};
-export default _default;
-export declare const _Timeline: (args: TimelineProps) => React.JSX.Element;
-export declare const _DynamicTimeline: (args: TimelineProps) => React.JSX.Element;
-//# sourceMappingURL=Timeline.stories.d.ts.map

package/lib/components/Timeline/Timeline.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Timeline.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Timeline/Timeline.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,IAAI,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAStC,wBAwFE;AAEF,eAAO,MAAM,SAAS,GAAI,MAAM,aAAa,sBA6CjC,CAAC;AA8Db,eAAO,MAAM,gBAAgB,GAAI,MAAM,aAAa,sBA2DxC,CAAC"}

package/lib/components/Timeline/Timeline.stories.js

@@ -1,267 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports._Timeline = exports._DynamicTimeline = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _Card = require("../Card");
-var _InlineDropdown = require("../InlineDropdown");
-var _Text = require("../Text");
-var _Timeline2 = require("./Timeline");
-var _TimelineItem = require("./TimelineItem");
-var _TimelineStoriesModule = _interopRequireDefault(require("./Timeline.stories.module.css"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-const orientationOptions = [...Object.values(_Timeline2.ORIENTATION)];
-var _default = exports.default = {
-  tags: ['autodocs'],
-  title: 'Components/Timeline/Timeline',
-  component: _Timeline2.Timeline,
-  argTypes: {
-    classNames: {
-      description: 'Provide an optional className to be applied to the wrapper',
-      control: {
-        type: 'object'
-      },
-      table: {
-        type: {
-          summary: '{wrapper?: string}'
-        }
-      }
-    },
-    orientation: {
-      control: {
-        type: 'select'
-      },
-      options: orientationOptions,
-      description: 'The main content\'s placement with respect to the timeline.',
-      table: {
-        type: {
-          summary: 'string'
-        },
-        defaultValue: {
-          summary: _Timeline2.ORIENTATION.left
-        },
-        disable: true // to hide argType's row from the table
-      }
-    },
-    children: {
-      description: 'A list of `TimelineItem` components to be displayed as timeline.',
-      type: {
-        required: true
-      },
-      table: {
-        type: {
-          summary: 'React.ReactNode'
-        }
-      }
-    }
-  },
-  parameters: {
-    docs: {
-      subtitle: 'Generates a Timeline component.',
-      description: {
-        component: `
-\`\`\`js
-import type {TimelineProps} from '@spaced-out/ui-design-system/lib/components/Timeline';
-import {Timeline, TimelineItem} from '@spaced-out/ui-design-system/lib/components/Timeline';
-\`\`\`
-
-The timeline component displays events in chronological order, showing dates and descriptions to track progress over time.
-
-### Usage
-
-The Timeline component takes in the following props:
-
-\`\`\`jsx
-<Timeline
-  orientation="left"
-  classNames={{}}
->
-  {/* TimelineItem components go here */}
-</Timeline>
-\`\`\`
-
-The Timeline component should be used with one or more TimelineItem components as children. Each TimelineItem component represents an individual event in the Timeline. The TimelineItem component is responsible for rendering the TimelineItem title and content. Make sure to import the TimelineItem component as well.
-
-### TimelineItem Component
-
-The TimelineItem component represents a single Event within the Timeline. It should be used as a child component of the Timeline. Each TimelineItem component can have its own unique icon, title and content.
-
-\`\`\`jsx
-import { TimelineItem } from "@spaced-out/ui-design-system/lib/components/Timeline";
-
-<Timeline orientation="left / right">
-  <TimelineItem id="convocation" iconName="calendar" title="Convocation 2024" classNames={{wrapper: css.timelineItemWrapper}}>
-    {/* TimelineItem content go here */}
-  </TimelineItem>
-  {/* Add more TimelineItem components for additional events */}
-</Timeline>
-\`\`\`
-
-Please note that the TimelineItem component should be imported separately in order to use it within the Timeline component.
-
-Remember to customize the props, title, and content according to your specific use case.`
-      }
-    },
-    storySource: {
-      componentPath: '/src/components/Timeline/Timeline.jsx'
-    }
-  }
-};
-const _Timeline = args => /*#__PURE__*/React.createElement(_Timeline2.Timeline, args, /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  iconName: "calendar",
-  title: "Yesterday",
-  description: "Wed, June 28"
-}, /*#__PURE__*/React.createElement(_Card.CardContent, {
-  className: _TimelineStoriesModule.default.content
-}, /*#__PURE__*/React.createElement(_Text.BodyMediumBold, null, "Aristotle"), /*#__PURE__*/React.createElement(_Text.BodyMedium, {
-  color: "secondary"
-}, "Happiness depends upon ourselves."))), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  iconName: "calendar",
-  title: "Today",
-  description: "Wed, June 29"
-}, /*#__PURE__*/React.createElement(_Card.CardContent, {
-  className: _TimelineStoriesModule.default.content
-}, /*#__PURE__*/React.createElement(_Text.BodyMediumBold, null, "Nelson Mandela"), /*#__PURE__*/React.createElement(_Text.BodyMedium, {
-  color: "secondary"
-}, "It always seems impossible until it's done."))), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  iconName: "calendar",
-  title: "Tomorrow",
-  description: "Wed, June 30"
-}, /*#__PURE__*/React.createElement(_Card.CardContent, {
-  className: _TimelineStoriesModule.default.content
-}, /*#__PURE__*/React.createElement(_Text.BodyMediumBold, null, "Mahatma Gandhi"), /*#__PURE__*/React.createElement(_Text.BodyMedium, {
-  color: "secondary"
-}, "Live as if you were to die tomorrow."))), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  iconName: "calendar",
-  title: "Next month",
-  description: "Wed, July 1"
-}, /*#__PURE__*/React.createElement(_Card.CardContent, {
-  className: _TimelineStoriesModule.default.content
-}, /*#__PURE__*/React.createElement(_Text.BodyMediumBold, null, "Martin Luther King Jr. "), /*#__PURE__*/React.createElement(_Text.BodyMedium, {
-  color: "secondary"
-}, "The time is always right to do what is right."))));
-exports._Timeline = _Timeline;
-const DATE_OPTIONS = [{
-  key: 'today',
-  label: 'Today'
-}, {
-  key: 'yesterday',
-  label: 'Yesterday'
-}, {
-  key: 'last-week',
-  label: 'Last week'
-}, {
-  key: 'last-month',
-  label: 'Last month'
-}, {
-  key: 'beginning',
-  label: 'The very beginning'
-}];
-const DropdownComponent = _ref => {
-  let {
-    id
-  } = _ref;
-  return /*#__PURE__*/React.createElement(_InlineDropdown.SimpleInlineDropdown, {
-    size: "small",
-    children: id,
-    options: DATE_OPTIONS.filter(_ref2 => {
-      let {
-        label
-      } = _ref2;
-      return label !== id;
-    }),
-    onOptionSelect: option => {
-      const elementId = option.key;
-      const element = document.getElementById(elementId);
-      if (element) {
-        element.scrollIntoView({
-          behavior: 'smooth',
-          block: 'start'
-        });
-      }
-    }
-  });
-};
-const DummyContent = _ref3 => {
-  let {
-    count
-  } = _ref3;
-  return /*#__PURE__*/React.createElement(_Card.CardContent, {
-    className: _TimelineStoriesModule.default.content
-  }, /*#__PURE__*/React.createElement(_Text.BodyMediumBold, null, "Timeline Item ", count), /*#__PURE__*/React.createElement(_Text.BodyMedium, {
-    color: "secondary"
-  }, "Cupcake ipsum dolor. Sit amet candy canes powder cotton candy. Gummy bears cotton candy halvah candy canes. Sweet roll lollipop tootsie roll cheesecake marshmallow macaroon chocolate bar biscuit candy."));
-};
-const _DynamicTimeline = args => /*#__PURE__*/React.createElement(_Timeline2.Timeline, args, /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  id: "today",
-  title: "Today",
-  iconName: "calendar",
-  description: "7:12 AM",
-  parentComponent: /*#__PURE__*/React.createElement(DropdownComponent, {
-    id: "Today"
-  })
-}, /*#__PURE__*/React.createElement(DummyContent, {
-  count: 1
-})), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  title: "Today",
-  description: "1:12 PM",
-  iconName: "calendar"
-}, /*#__PURE__*/React.createElement(DummyContent, {
-  count: 2
-})), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  title: "Today",
-  description: "5:24 PM",
-  iconName: "calendar"
-}, /*#__PURE__*/React.createElement(DummyContent, {
-  count: 3
-})), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  id: "yesterday",
-  title: "Yesterday",
-  iconName: "calendar",
-  description: "May 8, 2024, 8:00 AM",
-  parentComponent: /*#__PURE__*/React.createElement(DropdownComponent, {
-    id: "Yesterday"
-  })
-}, /*#__PURE__*/React.createElement(DummyContent, {
-  count: 4
-})), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  title: "Yesterday",
-  description: "May 8, 2024, 12:01 PM",
-  iconName: "calendar"
-}, /*#__PURE__*/React.createElement(DummyContent, {
-  count: 5
-})), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  id: "last-week",
-  title: "Last week",
-  iconName: "calendar",
-  description: "May 2, 2024",
-  parentComponent: /*#__PURE__*/React.createElement(DropdownComponent, {
-    id: "Last week"
-  })
-}, /*#__PURE__*/React.createElement(DummyContent, {
-  count: 6
-})), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  id: "last-month",
-  title: "Last month",
-  iconName: "calendar",
-  description: "Apr 12, 2024",
-  parentComponent: /*#__PURE__*/React.createElement(DropdownComponent, {
-    id: "Last month"
-  })
-}, /*#__PURE__*/React.createElement(DummyContent, {
-  count: 7
-})), /*#__PURE__*/React.createElement(_TimelineItem.TimelineItem, {
-  id: "beginning",
-  title: "Beginning",
-  iconName: "calendar",
-  description: "Jan 1, 2024",
-  parentComponent: /*#__PURE__*/React.createElement(DropdownComponent, {
-    id: "The very beginning"
-  })
-}, /*#__PURE__*/React.createElement(DummyContent, {
-  count: 8
-})));
-exports._DynamicTimeline = _DynamicTimeline;