sag_components 1.0.141 → 1.0.143

package/dist/stories/components/OneColumnContainer.js

@@ -43,6 +43,15 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     hover = _useState2[0],
     setHover = _useState2[1];
+  var _useState3 = (0, _react.useState)(null),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    offsetWidth = _useState4[0],
+    setOffsetWidth = _useState4[1];
+  var anotherRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(function () {
+    setOffsetWidth(anotherRef.current.offsetWidth);
+    console.log(anotherRef.current.offsetWidth);
+  }, [anotherRef]);
   return /*#__PURE__*/_react.default.createElement(_OneColumnContainer.StyledContainer, {
     className: (0, _classnames.default)(itemClass, overStyle, draggingStyle, children && droppedStyle, divStyle),
     width: width,
@@ -58,20 +67,20 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
       display: display,
       gridTemplateColumns: gridTemplateColumns
     },
-    ref: nodeRef
-  }, isLoading && /*#__PURE__*/_react.default.createElement(_OneColumnContainer.LoadingDiv, {
+    ref: anotherRef
+  }, console.log(anotherRef), isLoading && /*#__PURE__*/_react.default.createElement(_OneColumnContainer.LoadingDiv, {
     id: "loadingDiv"
   }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.SkeletonTheme, {
     baseColor: "#EAEAEA"
   }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
     enableAnimation: true,
-    width: width.replace("px", "") * 0.76,
+    width: (offsetWidth !== null && offsetWidth !== void 0 ? offsetWidth : 200) * 0.76,
     height: 45,
     containerClassName: "avatar-skeleton"
   }), /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
     enableAnimation: true,
     count: 4,
-    width: width.replace("px", "") * 0.76,
+    width: (offsetWidth !== null && offsetWidth !== void 0 ? offsetWidth : 200) * 0.76,
     height: 10,
     containerClassName: "avatar-skeleton"
   }))), !isLoading && !hover && children, !disableInfo && !isLoading && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, hover && /*#__PURE__*/_react.default.createElement(_OneColumnContainer.InfoTextContainer, {

package/dist/stories/components/TextField.js

@@ -88,6 +88,7 @@ var TextField = function TextField(_ref) {
       // round
       return {
         "& .MuiOutlinedInput-root": {
+          //m: 1,
           width: {
             width: width
           },
@@ -150,7 +151,7 @@ var TextField = function TextField(_ref) {
     key: resetDefaultValue,
     label: label,
     defaultValue: defaultValue,
-    placeholder: placeHolder,
+    placeHolder: placeHolder,
     id: "outlined-start-adornment",
     sx: getTextFieldStyle(),
     required: required,

package/dist/stories/components/TitleDescription.js

@@ -147,7 +147,7 @@ var TitleDescription = function TitleDescription(_ref) {
         event: event
       });
     }
-  }, " ", " show more ..."))), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodsContainer, {
+  }, "show more ..."))), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodsContainer, {
     id: "PeriodsContainer"
   }, /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.SubLineContainer, {
     id: "SubLineContainer"
@@ -157,7 +157,23 @@ var TitleDescription = function TitleDescription(_ref) {
     id: "PeriodLabel"
   }, "Event Dates:  "), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodValue, {
     id: "PeriodValue"
-  }, data.eventDatesValue))))));
+  }, data.eventDatesValue)), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.SubLineContainer, {
+    id: "SubLineContainer"
+  }, /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodLabel, {
+    id: "PeriodLabel"
+  }, "In Ad:  "), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodValue, {
+    id: "PeriodValue"
+  }, data.inAdValue)), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.SubLineContainer, {
+    id: "SubLineContainer"
+  }, /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodLabel, {
+    id: "PeriodLabel"
+  }, "On Display:  "), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodValue, {
+    id: "PeriodValue"
+  }, data.onDisplayValue1), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.FieldsDelimiter, {
+    id: "FieldsDelimiter"
+  }, " | "), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodValue, {
+    id: "PeriodValue"
+  }, data.onDisplayValue2))))));
 };
 exports.TitleDescription = TitleDescription;
 var _default = TitleDescription;

package/dist/stories/components/TitleDescription.style.js

@@ -16,7 +16,7 @@ var MainContainer = _styledComponents.default.div(_templateObject || (_templateO
   return props.height;
 });
 exports.MainContainer = MainContainer;
-var PanelContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-content: center;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-around;\n  border-radius: 12px;\n  background: #ffffff;\n  padding: 1rem;\n  font-weight: 400;\n  font-size: 0.875rem;\n  line-height: 1.4;\n  white-space: pre-wrap;\n  overflow: hidden;\n  width: 100%;\n"])));
+var PanelContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-content: center;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-around;\n  border-radius: 12px;\n  background: #ffffff;\n  padding: 1rem;\n  font-weight: 400;\n  font-size: 0.875rem;\n  line-height: 1.4;\n  white-space: pre-wrap;\n  overflow: hidden;\n"])));
 exports.PanelContainer = PanelContainer;
 var EventNameAndViewCreativeContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-content: center;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n"])));
 exports.EventNameAndViewCreativeContainer = EventNameAndViewCreativeContainer;
@@ -34,19 +34,19 @@ var FilterValue = _styledComponents.default.p(_templateObject9 || (_templateObje
 exports.FilterValue = FilterValue;
 var FieldsDelimiter = _styledComponents.default.p(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["  \n  color: #ccc;\n  margin: 0;\n"])));
 exports.FieldsDelimiter = FieldsDelimiter;
-var Retailer = _styledComponents.default.p(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  color: #1b30aa;\n  margin: 0;\n  margin-inline-end: 5px;\n"])));
+var Retailer = _styledComponents.default.p(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  color: #1b30aa;\n  margin: 0;\n"])));
 exports.Retailer = Retailer;
 var Space = _styledComponents.default.p(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0;\n"])));
 exports.Space = Space;
 var RetailerIconContainer = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n"])));
 exports.RetailerIconContainer = RetailerIconContainer;
-var ObjectiesContainer = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-content: center;\n  align-items: center;\n  justify-content: space-between;\n  width: 75%;\n"])));
+var ObjectiesContainer = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-content: center;\n  align-items: center;\n  justify-content: space-between;\n"])));
 exports.ObjectiesContainer = ObjectiesContainer;
-var ObjectiesAndPeriodsContainer = _styledComponents.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  width: 100%;\n"])));
+var ObjectiesAndPeriodsContainer = _styledComponents.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n"])));
 exports.ObjectiesAndPeriodsContainer = ObjectiesAndPeriodsContainer;
 var ObjectivesTitle = _styledComponents.default.strong(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)([""])));
 exports.ObjectivesTitle = ObjectivesTitle;
-var ObjectivesDescription = _styledComponents.default.p(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0;  \n  \n"])));
+var ObjectivesDescription = _styledComponents.default.p(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0;\n"])));
 exports.ObjectivesDescription = ObjectivesDescription;
 var ObjectivesShowMore = _styledComponents.default.a(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n  color: #1b30aa;\n  &:hover {\n    cursor: pointer;\n  }\n"])));
 exports.ObjectivesShowMore = ObjectivesShowMore;
@@ -54,7 +54,7 @@ var BottonsContainer = _styledComponents.default.div(_templateObject19 || (_temp
 exports.BottonsContainer = BottonsContainer;
 var DownloadButtonContainer = _styledComponents.default.div(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2.default)([""])));
 exports.DownloadButtonContainer = DownloadButtonContainer;
-var PeriodsContainer = _styledComponents.default.div(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-wrap: wrap;\n  align-content: flex-start;\n  justify-content: flex-start;\n  margin-left: 40px;\n  width: 25%;\n"])));
+var PeriodsContainer = _styledComponents.default.div(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-wrap: wrap;\n  align-content: flex-start;\n  justify-content: flex-start;\n  margin-left: 20px;\n  width: 100%;\n"])));
 exports.PeriodsContainer = PeriodsContainer;
 var SubLineContainer = _styledComponents.default.div(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  width: 100%;\n"])));
 exports.SubLineContainer = SubLineContainer;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sag_components",
-  "version": "1.0.141",
+  "version": "1.0.143",
   "description": "",
   "main": "dist/index.js",
   "scripts": {

package/dist/stories/components/InfoIcon.js

@@ -1,38 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.InfoIcon = void 0;
-var _react = _interopRequireDefault(require("react"));
-var InfoIcon = function InfoIcon(_ref) {
-  var clicked = _ref.clicked;
-  return /*#__PURE__*/_react.default.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: clicked ? "white" : "black",
-    strokeWidth: "2",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    className: "feather feather-info"
-  }, /*#__PURE__*/_react.default.createElement("circle", {
-    cx: "12",
-    cy: "12",
-    r: "10"
-  }), /*#__PURE__*/_react.default.createElement("line", {
-    x1: "12",
-    y1: "16",
-    x2: "12",
-    y2: "12"
-  }), /*#__PURE__*/_react.default.createElement("line", {
-    x1: "12",
-    y1: "8",
-    x2: "12",
-    y2: "8"
-  }));
-};
-exports.InfoIcon = InfoIcon;
-var _default = InfoIcon;
-exports.default = _default;