sag_components 2.0.0-beta → 2.0.0-beta2

package/dist/components/CollapseData/CollapseData.js

@@ -1,100 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.CollapseData = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _CollapseData = require("./CollapseData.style");
-var _NoDataFoundMessage = require("../NoDataFoundMessage/NoDataFoundMessage");
-var _ShoppingCartIcon = require("../../icons/ShoppingCartIcon");
-var _ClockIcon = require("../../icons/ClockIcon");
-var _ArrowUpIcon = require("../../icons/ArrowUpIcon");
-var _ArrowDownIcon = require("../../icons/ArrowDownIcon");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const CollapseData = props => {
-  const {
-    title,
-    tableData,
-    noDataText,
-    width,
-    height
-  } = props;
-  const [activeIndex, setActiveIndex] = (0, _react.useState)(null);
-  const handleClick = index => {
-    setActiveIndex(activeIndex === index ? null : index);
-  };
-  return <_CollapseData.AccordionWrapper width={width} height={height}>
-      {tableData.length === 0 ? <_NoDataFoundMessage.NoDataFoundMessage noDataText={noDataText} /> : <>
-          <_CollapseData.ComponentHeader>{title}</_CollapseData.ComponentHeader>
-          {tableData.map(section => <div key={section.key} className="accordion-section" id={section.key}>
-              <_CollapseData.TitleAccordion isopen={activeIndex === section.key} onClick={() => handleClick(section.key)}>
-                <_CollapseData.IconAndTitle>
-                  {section.icon === 'Basket' ? <_ShoppingCartIcon.ShoppingCartIcon /> : <_ClockIcon.ClockIcon />}
-                  <u>{section.title}</u>
-                </_CollapseData.IconAndTitle>
-                <_CollapseData.ArrowAndNumber>
-                  <_CollapseData.IconDiv>
-                    {section.value >= 0 ? <_ArrowUpIcon.ArrowUpIcon width="11px" height="12px" /> : <_ArrowDownIcon.ArrowDownIcon width="11px" height="12px" />}
-                  </_CollapseData.IconDiv>
-                  <_CollapseData.TitleDiv>
-                    {`${parseFloat(section.value.toFixed(1))}${section.valueType}`}
-                  </_CollapseData.TitleDiv>
-                </_CollapseData.ArrowAndNumber>
-              </_CollapseData.TitleAccordion>
-              {activeIndex === section.key && <_CollapseData.TableWrapper>
-                <_CollapseData.Table>
-                  <thead>
-                    <tr>
-                      {section.table.map((headline, i) => <_CollapseData.Th key={`${i + headline}`}>
-                          {headline.title}
-                        </_CollapseData.Th>)}
-                    </tr>
-                  </thead>
-                  <tbody>
-                    <tr>
-                      {section.table.map((data, i) => {
-                  if (data.value !== null) {
-                    return <_CollapseData.Td key={`${i + data}`}>
-                              {`${data.value >= 0 ? '+' : ''}${data.value.toFixed(1)}${section.valueType}`}
-                            </_CollapseData.Td>;
-                  }
-                  return <_CollapseData.Td key={`${i + data}`}>No Data</_CollapseData.Td>;
-                })}
-                    </tr>
-                  </tbody>
-                </_CollapseData.Table>
-              </_CollapseData.TableWrapper>}
-            </div>)}
-        </>}
-    </_CollapseData.AccordionWrapper>;
-};
-exports.CollapseData = CollapseData;
-var _default = exports.default = CollapseData;
-CollapseData.propTypes = {
-  title: _propTypes.default.string,
-  noDataText: _propTypes.default.string,
-  width: _propTypes.default.string,
-  height: _propTypes.default.string,
-  tableData: _propTypes.default.arrayOf(_propTypes.default.shape({
-    key: _propTypes.default.number,
-    icon: _propTypes.default.string,
-    title: _propTypes.default.string,
-    value: _propTypes.default.number,
-    valueType: _propTypes.default.string,
-    table: _propTypes.default.arrayOf(_propTypes.default.shape({
-      title: _propTypes.default.string,
-      value: _propTypes.default.number
-    }))
-  }))
-};
-CollapseData.defaultProps = {
-  title: '',
-  noDataText: '',
-  width: '455px',
-  height: '379px',
-  tableData: []
-};

package/dist/components/CollapseData/CollapseData.stories.js

@@ -1,125 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.SmallContainedStyle = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _CollapseData = require("./CollapseData");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'SAG BI/CollapseData',
-  component: _CollapseData.CollapseData,
-  tags: ['autodocs'],
-  argTypes: {
-    title: {
-      name: 'title',
-      control: {
-        type: 'text'
-      },
-      description: 'value of the main title',
-      defaultValue: ''
-    },
-    tableData: {
-      name: 'tableData',
-      control: {
-        type: 'object'
-      }
-    },
-    width: {
-      name: 'width',
-      control: {
-        type: 'text'
-      },
-      description: 'width of the component, minimum 400px'
-    },
-    height: {
-      name: 'height',
-      control: {
-        type: 'text'
-      },
-      description: 'height of the component'
-    },
-    noDataText: {
-      name: 'noDataText',
-      control: {
-        type: 'text'
-      },
-      description: 'message that will appears if there is no information to display'
-    }
-  }
-};
-const Template = args => <_CollapseData.CollapseData {...args} />;
-const SmallContainedStyle = exports.SmallContainedStyle = Template.bind({});
-SmallContainedStyle.args = {
-  title: 'Existing Repeaters (post event)',
-  height: '379px',
-  width: '455px',
-  tableData: [{
-    key: 0,
-    icon: 'Basket',
-    title: 'Basket (Units) Change',
-    value: 19.97,
-    valueType: '%',
-    table: [{
-      title: 'Food Lion',
-      value: -1.9
-    }, {
-      title: 'Hannaford',
-      value: null
-    }, {
-      title: 'Giant Food',
-      value: -2.03
-    }, {
-      title: 'The Giant Company',
-      value: 19.2
-    }, {
-      title: 'Stop&Shop',
-      value: 4.7
-    }]
-  }, {
-    key: 1,
-    icon: 'Basket',
-    title: 'Basket ($) Change',
-    value: 31.65,
-    valueType: '%',
-    table: [{
-      title: 'Food Lion',
-      value: 3.75
-    }, {
-      title: 'Hannaford',
-      value: null
-    }, {
-      title: 'Giant Food',
-      value: 7.643
-    }, {
-      title: 'The Giant Company',
-      value: 2.939
-    }, {
-      title: 'Stop&Shop',
-      value: 17.322
-    }]
-  }, {
-    key: 2,
-    icon: 'Visits',
-    title: 'Visits Change',
-    value: -58.57,
-    valueType: '%',
-    table: [{
-      title: 'Food Lion',
-      value: -6.05
-    }, {
-      title: 'Hannaford',
-      value: null
-    }, {
-      title: 'Giant Food',
-      value: -37.68
-    }, {
-      title: 'The Giant Company',
-      value: -10.369
-    }, {
-      title: 'Stop&Shop',
-      value: -4.48
-    }]
-  }]
-};

package/dist/components/CollapseData/CollapseData.style.js

@@ -1,127 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TitleDiv = exports.TitleAccordion = exports.Th = exports.Td = exports.TableWrapper = exports.Table = exports.IconDiv = exports.IconAndTitle = exports.ComponentHeader = exports.ArrowAndNumber = exports.AccordionWrapper = void 0;
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const AccordionWrapper = exports.AccordionWrapper = _styledComponents.default.div`
-  width: ${props => props.width};
-  height: ${props => props.height};
-  padding: 0 20px;
-  background-color: white;
-`;
-const TitleAccordion = exports.TitleAccordion = _styledComponents.default.div`
-  width: 100%;
-  display: inline-block;
-  align-items: center;
-  background-color: ${props => props.isopen ? '#D0D0D0' : '#FFFFFF'};
-  margin-bottom: 16px;
-`;
-const IconAndTitle = exports.IconAndTitle = _styledComponents.default.div`
-  width: auto;
-  font-family: "poppins";
-  font-weight: 400;
-  font-size: 16px;
-  line-height: 24px;
-  display: flex;
-  float: left;
-  align-items: center;
-  @media (max-width: 1536px) {
-    font-size: 12px;
-  }
-  & > svg {
-    margin-right: 15px;
-  }
-`;
-const ArrowAndNumber = exports.ArrowAndNumber = _styledComponents.default.div`
-  float: right;
-  font-family: "poppins";
-  font-weight: 600;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  width: 23%;
-  margin-right: 20px;
-`;
-const IconDiv = exports.IconDiv = _styledComponents.default.div`
-  display: flex;
-  justify-content: flex-end;
-  width: 25%;
-`;
-const TitleDiv = exports.TitleDiv = _styledComponents.default.div`
-  width: 70%;
-  text-align: left;
-  padding-left: 3px;
-  @media (max-width: 1536px) {
-    font-size: 11px;
-  }
-  @media (max-width: 1366px) {
-    font-size: 10px;
-  }
-`;
-const TableWrapper = exports.TableWrapper = _styledComponents.default.div`
-  overflow-x: auto;
-  margin-bottom: 22px;
-  &::-webkit-scrollbar {
-    height: 8px;
-  }
-
-  &::-webkit-scrollbar-track {
-    background: #E8E8E8;
-    border-radius: 5px;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: #D0D0D0;
-    border-radius: 5px;
-  }
-`;
-const Table = exports.Table = _styledComponents.default.table`
-  width: 100%;
-  border-collapse: collapse;
-  overflow: auto;
-  table-layout: fixed;
-`;
-const Th = exports.Th = _styledComponents.default.th`
-  background-color: white;
-  font-family: "poppins";
-  font-weight: 600;
-  font-size: 12px;
-  border: 1px solid #ccc;
-  padding: 10px;
-  text-align: center;
-  line-height: 18px;
-  border-top: none;
-  border-left: none;
-  &:last-of-type {
-    border-right: none;
-  }
-`;
-const Td = exports.Td = _styledComponents.default.td`
-  border: 1px solid #ccc;
-  padding: 10px;
-  text-align: center;
-  line-height: 21px;
-  font-size: 14px;
-  font-family: "poppins";
-  font-weight: 400;
-  border-bottom: none;
-  border-left: none;
-  &:last-of-type {
-    border-right: none;
-  }
-`;
-const ComponentHeader = exports.ComponentHeader = _styledComponents.default.h3`
-  font-family: "poppins";
-  font-weight: 500;
-  font-size: 18px;
-  line-height: 27px;
-  @media (max-width: 1536px) {
-    font-size: 14px;
-  }
-  @media (max-width: 1366px) {
-    font-size: 12px;
-  }
-`;

package/dist/components/CollapseHeader/CollapseHeader.js

@@ -1,284 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.CollapseHeader = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _Button = require("../Button/Button");
-var _FoodLionIcon = require("../../icons/FoodLionIcon");
-var _GiantFoodIcon = require("../../icons/GiantFoodIcon");
-var _HannafordIcon = require("../../icons/HannafordIcon");
-var _StopAndShopIcon = require("../../icons/StopAndShopIcon");
-var _TheGiantCompanyIcon = require("../../icons/TheGiantCompanyIcon");
-var _CollapseHeader = require("./CollapseHeader.style");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const CollapseHeader = props => {
-  const {
-    className,
-    showRetailerIcon,
-    showPeriodIcon,
-    viewCreativeRetailersData,
-    data,
-    showViewCreativeButton,
-    viewCreativeOnClick,
-    descriptionTitle,
-    datesTitle,
-    width,
-    height,
-    textcolor,
-    showDraft,
-    buttonText,
-    disabled
-  } = props;
-  const [retailersDataState, setRetailersDataState] = (0, _react.useState)(null);
-  const [viewCreativeListBoxOpenedState, setViewCreativeListBoxOpenedState] = (0, _react.useState)(false);
-  const viewCreativeContainerRef = (0, _react.useRef)(null);
-  (0, _react.useEffect)(() => {
-    let newData = [];
-    if (viewCreativeRetailersData && viewCreativeRetailersData.length > 0) {
-      newData = viewCreativeRetailersData?.map(item => ({
-        ...item,
-        checked: false,
-        disabled: false
-      }));
-      setRetailersDataState(newData);
-    } else {
-      setRetailersDataState(null);
-    }
-  }, [viewCreativeRetailersData]);
-  const getRetailerIcon = retailerName => {
-    switch (retailerName) {
-      case "Food Lion":
-        return <_CollapseHeader.RetailerIconContainer id="RetailerIconContainer">
-            <_FoodLionIcon.FoodLionIcon width="90" height="20" />
-            &nbsp;
-          </_CollapseHeader.RetailerIconContainer>;
-      case "Hannaford":
-        return <_CollapseHeader.RetailerIconContainer id="RetailerIconContainer">
-            <_HannafordIcon.HannafordIcon width="90" height="20" />
-            &nbsp;
-          </_CollapseHeader.RetailerIconContainer>;
-      case "Giant Food":
-        return <_CollapseHeader.RetailerIconContainer id="RetailerIconContainer">
-            <_GiantFoodIcon.GiantFoodIcon width="60" height="20" />
-            &nbsp;
-          </_CollapseHeader.RetailerIconContainer>;
-      case "The Giant Company":
-        return <_CollapseHeader.RetailerIconContainer id="RetailerIconContainer">
-            <_TheGiantCompanyIcon.TheGiantCompanyIcon width="60" height="20" />
-            &nbsp;
-          </_CollapseHeader.RetailerIconContainer>;
-      case "Stop&Shop":
-        return <_CollapseHeader.RetailerIconContainer id="RetailerIconContainer">
-            <_StopAndShopIcon.StopAndShopIcon width="90" height="20" />
-            &nbsp;
-          </_CollapseHeader.RetailerIconContainer>;
-      default:
-        return <_CollapseHeader.RetailerIconContainer id="RetailerIconContainer">
-            {retailerName}
-            {retailerName && <_CollapseHeader.FieldsDelimiter className="FieldsDelimiter"> | </_CollapseHeader.FieldsDelimiter>}
-          </_CollapseHeader.RetailerIconContainer>;
-    }
-  };
-  const viewCreativeOnClickHandler = () => {
-    if (retailersDataState && retailersDataState.length > 0) {
-      setViewCreativeListBoxOpenedState(!viewCreativeListBoxOpenedState);
-    } else {
-      viewCreativeOnClick({
-        name: viewCreativeOnClick
-      });
-    }
-  };
-  const listBoxViewCreativeOnClickHandler = props => {
-    const selectedRetailer = props.selectedData?.length > 0 ? props.selectedData[0].label : null;
-    if (selectedRetailer) {
-      viewCreativeOnClick({
-        selectedRetailer
-      });
-    }
-    if (props.selectedData?.length > 0) {
-      setViewCreativeListBoxOpenedState(false);
-    }
-  };
-  const getViewCreativeContainerLeft = () => {
-    const {
-      offsetLeft
-    } = viewCreativeContainerRef.current;
-    return offsetLeft.toString().concat("", "px");
-  };
-  const getViewCreativeContainerTop = () => {
-    const {
-      offsetTop
-    } = viewCreativeContainerRef.current;
-    return (offsetTop + 33).toString().concat("", "px");
-  };
-  return <_CollapseHeader.MainContainer id="CollapseHeader" className={className} height={height} width={width} textcolor={textcolor}>
-      <_CollapseHeader.PanelContainer id="PanelContainer">
-        <_CollapseHeader.EventNameAndViewCreativeContainer id="EventNameAndViewCreativeContainer">
-          <_CollapseHeader.EventNameViewCreativeSubContainer id="EventNameViewCreativeSubContainer">
-            <_CollapseHeader.ViewCreativeButtonAndListBoxContainer id="ViewCreativeButtonAndListBoxContainer">
-              {showViewCreativeButton && <_Button.Button leftIcon="Eye" onClick={viewCreativeOnClickHandler} text={buttonText} type="secondary" disabled={disabled} size={"small"} />}
-              {viewCreativeListBoxOpenedState && <_CollapseHeader.ViewCreativeListBoxContainer id="ViewCreativeListBoxContainer" top={getViewCreativeContainerTop()} left={getViewCreativeContainerLeft()} width="100%" height="100%" onMouseLeave={() => {
-              setViewCreativeListBoxOpenedState(false);
-            }}></_CollapseHeader.ViewCreativeListBoxContainer>}
-            </_CollapseHeader.ViewCreativeButtonAndListBoxContainer>
-          </_CollapseHeader.EventNameViewCreativeSubContainer>
-
-          {showDraft && <_CollapseHeader.DraftTag>DRAFT</_CollapseHeader.DraftTag>}
-        </_CollapseHeader.EventNameAndViewCreativeContainer>
-
-        <_CollapseHeader.FilterValuesContainer id="FilterValuesContainer">
-          {showRetailerIcon && <_CollapseHeader.Retailer id="Retailer">{getRetailerIcon(data.retailer)}</_CollapseHeader.Retailer>}
-
-          <_CollapseHeader.FilterValue className="FilterValue">{data.eventType}</_CollapseHeader.FilterValue>
-
-          {data.externalEventDescription && data.externalEventDescription !== "" && <>
-                <_CollapseHeader.FieldsDelimiter className="FieldsDelimiter">
-                  {" "}
-                  |{" "}
-                </_CollapseHeader.FieldsDelimiter>
-                <_CollapseHeader.FilterValue className="FilterValue">
-                  {data.externalEventDescription}
-                </_CollapseHeader.FilterValue>
-              </>}
-
-          {data.externalEventID && data.externalEventID !== "" && <>
-              <_CollapseHeader.FieldsDelimiter className="FieldsDelimiter"> | </_CollapseHeader.FieldsDelimiter>
-              <_CollapseHeader.FilterValue className="FilterValue">
-                {data.externalEventID}
-              </_CollapseHeader.FilterValue>
-            </>}
-
-          {data.storeType && data.storeType !== "" && <>
-              <_CollapseHeader.FieldsDelimiter className="FieldsDelimiter"> | </_CollapseHeader.FieldsDelimiter>
-              <_CollapseHeader.FilterValue className="FilterValue">
-                {data.storeType}
-              </_CollapseHeader.FilterValue>
-            </>}
-
-          {data.category && data.category !== "" && <>
-              <_CollapseHeader.FieldsDelimiter className="FieldsDelimiter"> | </_CollapseHeader.FieldsDelimiter>
-              <_CollapseHeader.FilterValue className="FilterValue">{data.category}</_CollapseHeader.FilterValue>
-            </>}
-
-          {data.supplier && data.supplier !== "" && <>
-              <_CollapseHeader.FieldsDelimiter className="FieldsDelimiter"> | </_CollapseHeader.FieldsDelimiter>
-              <_CollapseHeader.FilterValue className="FilterValue">{data.supplier}</_CollapseHeader.FilterValue>
-            </>}
-
-          {data.brand && data.brand !== "" && <>
-              <_CollapseHeader.FieldsDelimiter className="FieldsDelimiter"> | </_CollapseHeader.FieldsDelimiter>
-              <_CollapseHeader.FilterValue className="FilterValue">{data.brand}</_CollapseHeader.FilterValue>
-            </>}
-        </_CollapseHeader.FilterValuesContainer>
-
-        <_CollapseHeader.FilterValuesContainer>
-          <_CollapseHeader.ObjectiesContainer id="ObjectiesContainer" showPeriodIcon={showPeriodIcon}>
-            <_CollapseHeader.ObjectivesDescription id="ObjectivesDescription">
-              <_CollapseHeader.ObjectivesTitle id="ObjectivesTitle">
-                {data?.eventDescription?.length > 0 ? descriptionTitle : ""}
-              </_CollapseHeader.ObjectivesTitle>
-              {data.eventDescription}
-            </_CollapseHeader.ObjectivesDescription>
-          </_CollapseHeader.ObjectiesContainer>
-        </_CollapseHeader.FilterValuesContainer>
-
-        <_CollapseHeader.ObjectiesAndPeriodsContainer id="ObjectiesAndPeriodsContainer">
-          <_CollapseHeader.ObjectiesContainer id="ObjectiesContainer" showPeriodIcon={showPeriodIcon}>
-            <_CollapseHeader.ObjectivesDescription id="ObjectivesDescription">
-              <_CollapseHeader.ObjectivesTitle id="ObjectivesTitle">
-                {data?.objectivesDescription?.length > 0 ? "Objectives:  " : ""}
-              </_CollapseHeader.ObjectivesTitle>
-
-              {data.objectivesDescription}
-            </_CollapseHeader.ObjectivesDescription>
-          </_CollapseHeader.ObjectiesContainer>
-
-          {showPeriodIcon && <_CollapseHeader.PeriodsContainer id="PeriodsContainer">
-              <_CollapseHeader.SubLineContainer id="SubLineContainer">
-                {data?.eventDatesValue?.length > 0 ? <_CollapseHeader.PeriodLabel id="PeriodLabel">{datesTitle} </_CollapseHeader.PeriodLabel> : ""}
-                {data?.eventDatesValue?.length > 0 ? <_CollapseHeader.PeriodValue id="PeriodValue">
-                    {data.eventDatesValue}
-                  </_CollapseHeader.PeriodValue> : ""}
-              </_CollapseHeader.SubLineContainer>
-            </_CollapseHeader.PeriodsContainer>}
-        </_CollapseHeader.ObjectiesAndPeriodsContainer>
-      </_CollapseHeader.PanelContainer>
-    </_CollapseHeader.MainContainer>;
-};
-exports.CollapseHeader = CollapseHeader;
-var _default = exports.default = CollapseHeader;
-CollapseHeader.propTypes = {
-  className: _propTypes.default.string,
-  showRetailerIcon: _propTypes.default.bool,
-  showPeriodIcon: _propTypes.default.bool,
-  viewCreativeRetailersData: _propTypes.default.arrayOf(_propTypes.default.shape({
-    label: _propTypes.default.string
-  })),
-  data: _propTypes.default.shape({
-    eventType: _propTypes.default.string,
-    retailer: _propTypes.default.string,
-    eventDescription: "Large Selling Event Description",
-    objectivesDescription: _propTypes.default.string,
-    eventDatesValue: _propTypes.default.string,
-    externalEventDescription: _propTypes.default.string,
-    externalEventID: _propTypes.default.string,
-    storeType: _propTypes.default.string,
-    category: _propTypes.default.string,
-    supplier: _propTypes.default.string,
-    brand: _propTypes.default.string
-  }),
-  showViewCreativeButton: _propTypes.default.bool,
-  viewCreativeOnClick: _propTypes.default.func,
-  descriptionTitle: _propTypes.default.string,
-  datesTitle: _propTypes.default.string,
-  width: _propTypes.default.string,
-  height: _propTypes.default.string,
-  textcolor: _propTypes.default.string,
-  showDraft: _propTypes.default.bool,
-  buttonText: _propTypes.default.string,
-  disabled: _propTypes.default.bool
-};
-CollapseHeader.defaultProps = {
-  className: "",
-  showRetailerIcon: true,
-  showPeriodIcon: true,
-  viewCreativeRetailersData: [{
-    label: "Food Lion"
-  }, {
-    label: "Stop&Shop"
-  }, {
-    label: "Giant Food"
-  }, {
-    label: "The Giant Company"
-  }, {
-    label: "Hannaford"
-  }],
-  data: {
-    eventType: "Large Selling Event",
-    retailer: "The Giant Company",
-    eventDescription: "Large Selling Event Description",
-    objectivesDescription: "Lorem ipsum dolor sit amet consectetur. Viverra urna condimentum donec ipsum vitae volutpat phasellus. Adipiscing quam sodales vestibulum pretium sit adipiscing ultricies viverra. Sollicitudin penatibus fermentum fermentum faucibus viverra augue viverra. Lorem ipsum dolor sit amet consectetur. Viverra urna condimentum donec ipsum vitae volutpat phasellus. ",
-    eventDatesValue: "Feb 1, 2023 - Feb 28, 2023",
-    externalEventDescription: "Large Selling Event P2 Description",
-    externalEventID: "LSE2_23",
-    storeType: "Total",
-    category: "",
-    supplier: "",
-    brand: ""
-  },
-  showViewCreativeButton: true,
-  viewCreativeOnClick: () => {},
-  width: "100%",
-  height: "100%",
-  textcolor: "#212121",
-  showDraft: false,
-  disabled: false,
-  buttonText: "View creative",
-  descriptionTitle: "Event Description:  ",
-  datesTitle: "Event Dates: "
-};