sag_components 2.0.0-beta → 2.0.0-beta2

package/dist/components/EventDetailsCard/EventDetailsCard.style.js

@@ -1,62 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TitleWrapper = exports.MainContainer = exports.MainCard = exports.List = exports.LinkButtonContainer = exports.CardTitle = void 0;
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const MainContainer = exports.MainContainer = _styledComponents.default.div`
-  position: relative;
-  font-family: "Poppins", sans-serif;
-  background-color: white;
-  display: flex;
-  flex-direction: column;
-  width: ${props => props.width};
-  height: ${props => props.height};
-  border-radius: 8px;
-  border: 1px solid #f2f2f2;
-`;
-const TitleWrapper = exports.TitleWrapper = _styledComponents.default.div`
-  padding: 22px 20px;
-  border-radius: 8px 8px 0 0;
-  background-color: #f7f8fa;
-  display: flex;
-  gap: 10px;
-  align-items: baseline;
-`;
-const CardTitle = exports.CardTitle = _styledComponents.default.span`
-  font-size: 18px;
-  font-weight: 400;
-`;
-const MainCard = exports.MainCard = _styledComponents.default.div`
-  padding: 20px;
-  flex-grow: 1;
-  display: flex;
-  flex-direction: column;
-
-  > #ButtonWrapper {
-    margin: 0 auto;
-    a {
-      padding: 6px 12px;
-    }
-  }
-`;
-const List = exports.List = _styledComponents.default.ul`
-  list-style-type: none;
-  padding: 0;
-  margin: 0 0 auto;
-  font-size: 16px;
-  li {
-    line-height: 1.2;
-    &:not(:last-child) {
-      margin-bottom: 16px;
-    }
-  }
-  span {
-    font-weight: 500;
-  }
-`;
-const LinkButtonContainer = exports.LinkButtonContainer = _styledComponents.default.div`
-  margin-left: auto;
-`;

package/dist/components/EventList/EventList.js

@@ -1,64 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.EventList = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _EventListItem = require("../EventListItem/EventListItem");
-var _EventList = require("./EventList.style");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/* EventList */
-const EventList = props => {
-  const {
-    eventsData,
-    selectTextColor,
-    width = '100%',
-    height = '100%',
-    itemHeight = '160px',
-    onSelectClick
-  } = props;
-  const displayEventsItems = () => {
-    if (eventsData && eventsData.length > 0) {
-      return <_EventList.EventItemsContainer id="EventItemsContainer">
-          {eventsData?.map(item => <_EventList.OneEventItemContainer id="OneEventItemContainer">
-              <_EventListItem.EventListItem height={itemHeight} width={width / 3} eventName={item.eventName} period={item.period} selectTextColor={selectTextColor} onClick={event => {
-            onSelectClick({
-              eventName: event?.eventName
-            });
-          }} />
-            </_EventList.OneEventItemContainer>)}
-        </_EventList.EventItemsContainer>;
-    }
-  };
-
-  //= ======================================== MAIN RETURN ====================================
-  return <_EventList.MainContainer id="MainContainer" height={height} width={width}>
-      <_EventList.PanelContainer id="PanelContainer">
-        {displayEventsItems()}
-      </_EventList.PanelContainer>
-    </_EventList.MainContainer>;
-  //= ======================================== MAIN RETURN END====================================
-};
-exports.EventList = EventList;
-var _default = exports.default = EventList;
-EventList.propTypes = {
-  eventsData: _propTypes.default.arrayOf(_propTypes.default.shape({
-    eventName: _propTypes.default.string,
-    period: _propTypes.default.string
-  })),
-  selectTextColor: _propTypes.default.string,
-  height: _propTypes.default.string,
-  width: _propTypes.default.string,
-  itemHeight: _propTypes.default.string,
-  onSelectClick: _propTypes.default.func
-};
-EventList.defaultProps = {
-  eventsData: [],
-  selectTextColor: '#229E38',
-  width: '100%',
-  height: '100%',
-  itemHeight: '160px',
-  onSelectClick: () => {}
-};

package/dist/components/EventList/EventList.stories.js

@@ -1,84 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.ExampleEventList = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _EventList = _interopRequireDefault(require("./EventList"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const eventsData1 = [{
-  eventName: 'Large Selling Event #10 POD3 Weeks 37 and 38 and #10 POD3 Weeks 39 and 40',
-  period: '12/06/2023 - 09/07/2023'
-}, {
-  eventName: 'Small Selling Event #12 POD4 Weeks 37 and 38 and #10 POD3 Weeks 39 and 40',
-  period: '18/07/2023 - 09/07/2023'
-}, {
-  eventName: 'NIC 11_23 Cycle 11',
-  period: '10/08/2023 - 09/08/2023'
-}, {
-  eventName: 'Large Selling Event #10 POD3 Weeks 37 and 38 ',
-  period: '10/09/2023 - 29/09/2023'
-}, {
-  eventName: 'Large Selling Event #37 and 38 ',
-  period: '13/09/2023 - 29/09/2023'
-}, {
-  eventName: 'Large Selling Event 38 ',
-  period: '16/09/2023 - 29/09/2023'
-}];
-var _default = exports.default = {
-  title: 'SAG BI/EventList',
-  component: _EventList.default,
-  tags: ['autodocs'],
-  argTypes: {
-    eventsData: {
-      name: 'eventsData',
-      control: {
-        type: 'object'
-      },
-      description: ' object: to fill data '
-    },
-    width: {
-      name: 'width',
-      control: {
-        type: 'text'
-      },
-      description: 'width of the control (in px / %)'
-    },
-    height: {
-      name: 'height',
-      control: {
-        type: 'text'
-      },
-      description: 'height of the control (in px / % )'
-    },
-    itemHeight: {
-      name: 'itemHeight',
-      control: {
-        type: 'text'
-      },
-      description: 'height of the event item (in px / % )'
-    },
-    onClick: {
-      action: 'onClick',
-      description: 'onClick event - returns an object of check box {true/false} '
-    },
-    selectTextColor: {
-      name: 'selectTextColor',
-      description: 'Sets the select buttons color',
-      control: {
-        type: 'color',
-        presetColors: ['#ffffff', '#ff0000', '#00ff00', '#0000ff']
-      }
-    }
-  }
-};
-const Template = args => <_EventList.default {...args} />;
-const ExampleEventList = exports.ExampleEventList = Template.bind({});
-ExampleEventList.args = {
-  eventsData: eventsData1,
-  width: '100%',
-  height: '100%',
-  itemHeight: '160px',
-  selectTextColor: '#229E38'
-};

package/dist/components/EventList/EventList.style.js

@@ -1,38 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.PanelContainer = exports.OneEventItemContainer = exports.MainContainer = exports.EventItemsContainer = void 0;
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const MainContainer = exports.MainContainer = _styledComponents.default.div`
-  /* display: flex; */
-  position: relative;
-  font-family: "Poppins", sans-serif;
-  font-size: 1rem;
-  border-radius: 12px;
-  width: ${props => props.width};
-  height: ${props => props.height};
-`;
-const PanelContainer = exports.PanelContainer = _styledComponents.default.div`
-  display: flex;
-  border-radius: 12px;
-  padding: 0 10px;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 19px;
-  white-space: pre-wrap;
-  overflow: hidden;
-  width: 100%;
-`;
-const EventItemsContainer = exports.EventItemsContainer = _styledComponents.default.div`
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  padding: 15px 10px 30px;
-  gap: 30px;
-  width: 100%;
-`;
-const OneEventItemContainer = exports.OneEventItemContainer = _styledComponents.default.div`
-  margin: 0;
-`;

package/dist/components/EventListItem/EventListItem.js

@@ -1,68 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.EventListItem = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _LinkButton = _interopRequireDefault(require("../LinkButton/LinkButton"));
-var _EventListItem = require("./EventListItem.style");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const EventListItem = props => {
-  const {
-    eventName,
-    period,
-    width,
-    height,
-    selectTextColor,
-    onClick
-  } = props;
-  const handleOnClick = event => {
-    onClick({
-      eventName,
-      event
-    });
-  };
-  return <_EventListItem.EventListItemControlsContainer height={height} width={width}>
-      <_EventListItem.Period className="Period">
-        {period}
-      </_EventListItem.Period>
-
-      <_EventListItem.EventName className="EventName">
-        {eventName}
-      </_EventListItem.EventName>
-
-      <_EventListItem.SelectButtonContainer>
-        <_LinkButton.default size="medium" text="Select" rightIcon="Select" textColor={selectTextColor} onClick={handleOnClick} />
-      </_EventListItem.SelectButtonContainer>
-
-      {/* <SelectButtonContainer
-        className="SelectButtonSubContainer"
-        selectTextColor={selectTextColor}
-        onClick={handleOnClick}
-       >
-        Select
-        {' '}
-        <ArrowSelectIcon />
-       </SelectButtonContainer> */}
-    </_EventListItem.EventListItemControlsContainer>;
-};
-exports.EventListItem = EventListItem;
-var _default = exports.default = EventListItem;
-EventListItem.propTypes = {
-  eventName: _propTypes.default.string,
-  period: _propTypes.default.string,
-  width: _propTypes.default.string,
-  height: _propTypes.default.string,
-  selectTextColor: _propTypes.default.string,
-  onClick: _propTypes.default.func
-};
-EventListItem.defaultProps = {
-  eventName: '',
-  period: 'DD.MM.YYYY - DD.MM.YYYY',
-  width: 'auto',
-  height: 'auto',
-  selectTextColor: '#212121',
-  onClick: () => {}
-};

package/dist/components/EventListItem/EventListItem.stories.js

@@ -1,65 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.ExampleEventListItem = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _EventListItem = require("./EventListItem");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'SAG BI/EventListItem',
-  component: _EventListItem.EventListItem,
-  tags: ['autodocs'],
-  argTypes: {
-    eventName: {
-      name: 'eventName',
-      control: {
-        type: 'text'
-      },
-      description: ''
-    },
-    period: {
-      name: 'period',
-      control: {
-        type: 'text'
-      },
-      description: 'With this format DD.MM.YYYY'
-    },
-    width: {
-      name: 'width',
-      control: {
-        type: 'text'
-      },
-      description: 'width of the control (in px or %)'
-    },
-    height: {
-      name: 'height',
-      control: {
-        type: 'text'
-      },
-      description: 'height of the control (in px or %)'
-    },
-    selectTextColor: {
-      name: 'selectTextColor',
-      description: 'Sets the select TextColor ',
-      control: {
-        type: 'color',
-        presetColors: ['#ffffff', '#ff0000', '#00ff00', '#0000ff']
-      }
-    },
-    onClick: {
-      action: 'onClick',
-      description: 'returns an event click object when user clicks on a button'
-    }
-  }
-};
-const Template = args => <_EventListItem.EventListItem {...args} />;
-const ExampleEventListItem = exports.ExampleEventListItem = Template.bind({});
-ExampleEventListItem.args = {
-  eventName: 'Large Selling Event #10 POD3 Weeks 37 and 38 and #10 POD3 Weeks 39 and 40',
-  period: '10.08.2023 - 09.09.2023',
-  selectTextColor: '#229E38',
-  width: '400px',
-  height: '160px'
-};

package/dist/components/EventListItem/EventListItem.style.js

@@ -1,47 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SelectButtonContainer = exports.Period = exports.EventName = exports.EventListItemControlsContainer = void 0;
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const EventListItemControlsContainer = exports.EventListItemControlsContainer = _styledComponents.default.div`
-  position: relative;
-  font-family: "Poppins", sans-serif;
-  width: ${props => props.width};
-  height: ${props => props.height};
-  display: flex;
-  flex-direction: column;
-  align-content: center;
-  background-color: #ffffff;
-  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
-  padding: 20px;
-  border-radius: 12px;
-`;
-const EventName = exports.EventName = _styledComponents.default.span`
-  font-size: 16px;
-  @media (max-width: 1536px) {
-    font-size: 14px;
-  }
-`;
-const Period = exports.Period = _styledComponents.default.span`
-  color: #b1b1b1;
-  font-size: 16px;
-  margin-bottom: 8px;
-  @media (max-width: 1536px) {
-    font-size: 14px;
-  }
-`;
-const SelectButtonContainer = exports.SelectButtonContainer = _styledComponents.default.span`
-  font-size: 16px;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  margin-top: auto;
-  gap: 8px;
-  color: ${props => props.selectTextColor};
-  @media (max-width: 1536px) {
-    font-size: 14px;
-  }
-`;

package/dist/components/FilterContainer/FilterContainer.js

@@ -1,26 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.FilterContainer = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _FilterContainer = require("./FilterContainer.style");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const FilterContainer = exports.FilterContainer = _react.default.forwardRef(({
-  itemClass,
-  nodeRef,
-  ...props
-}, ref) => <_FilterContainer.FilterDivContainer className={itemClass} style={{
-  width: '100%',
-  height: '100%'
-}}>
-      <div className={props.className} ref={nodeRef}>
-        {props.children}
-      </div>
-      {/* <FilterFooterContent>
-            </FilterFooterContent> */}
-    </_FilterContainer.FilterDivContainer>);
-FilterContainer.propTypes = {};
-FilterContainer.defaultProps = {};
-var _default = exports.default = FilterContainer;

package/dist/components/FilterContainer/FilterContainer.stories.js

@@ -1,22 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.SmallContainedStyle = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _FilterContainer = require("./FilterContainer");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction
-var _default = exports.default = {
-  title: 'Sag BI/FilterContainer',
-  component: _FilterContainer.FilterContainer,
-  tags: ['autodocs'],
-  argTypes: {}
-};
-const Template = args => <_FilterContainer.FilterContainer {...args} />;
-const SmallContainedStyle = exports.SmallContainedStyle = Template.bind({});
-SmallContainedStyle.args = {
-  width: 350,
-  height: 950
-};

package/dist/components/FilterContainer/FilterContainer.style.js

@@ -1,30 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FilterFooterContent = exports.FilterDivContent = exports.FilterDivContainer = void 0;
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const FilterDivContainer = exports.FilterDivContainer = _styledComponents.default.div`
-    width: 100%;
-    height:100%;
-    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
-    border-radius: 12px;
-    display: grid;
-    background-color: white;
-`;
-const FilterDivContent = exports.FilterDivContent = _styledComponents.default.div`
-    width: 100%;
-    padding-top: 40px;
-    height: 90%;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    > div {
-        margin: 25px;
-    }
-`;
-const FilterFooterContent = exports.FilterFooterContent = _styledComponents.default.div`
-    height: 10%;
-`;