sag_components 1.0.102 → 1.0.104

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/stories/components/OneColumnContainer.js +17 -10
  2. package/dist/stories/components/OneColumnContainer.style.js +8 -6
  3. package/dist/stories/components/icons/InfoIcon.js +28 -0
  4. package/package.json +1 -1
package/dist/stories/components/OneColumnContainer.js CHANGED
@@ -10,10 +10,10 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm
10
10
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
11
11
  var _react = _interopRequireWildcard(require("react"));
12
12
  var _OneColumnContainer = require("./OneColumnContainer.style");
13
- var _InfoIcon = require("./InfoIcon");
13
+ var _InfoIcon = require("./icons/InfoIcon");
14
14
  var _core = require("@dnd-kit/core");
15
15
  var _classnames = _interopRequireDefault(require("classnames"));
16
- var _excluded = ["children", "display", "isLoading", "gridTemplateColumns", "nodeRef", "itemClass", "divStyle", "overStyle", "draggingStyle", "droppedStyle", "refId", "width", "height", "infoText"];
16
+ var _excluded = ["children", "display", "isLoading", "gridTemplateColumns", "nodeRef", "itemClass", "divStyle", "overStyle", "draggingStyle", "droppedStyle", "refId", "width", "height", "infoTitle", "infoText"];
17
17
  //import Skeleton, { SkeletonTheme } from "react-loading-skeleton";
18
18
  //import "react-loading-skeleton/dist/skeleton.css";
19
19
 
@@ -35,15 +35,13 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
35
35
  refId = _ref.refId,
36
36
  width = _ref.width,
37
37
  height = _ref.height,
38
+ infoTitle = _ref.infoTitle,
38
39
  infoText = _ref.infoText,
39
40
  props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
40
41
  var _useState = (0, _react.useState)(false),
41
42
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
42
43
  clicked = _useState2[0],
43
44
  setClicked = _useState2[1];
44
- var onInfoClick = function onInfoClick() {
45
- setClicked(!clicked);
46
- };
47
45
  return /*#__PURE__*/_react.default.createElement(_OneColumnContainer.StyledContainer, {
48
46
  className: (0, _classnames.default)(itemClass, overStyle, draggingStyle, children && droppedStyle, divStyle),
49
47
  width: width,
@@ -72,14 +70,23 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
72
70
  height: "65%"
73
71
  }
74
72
  }), !isLoading && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_OneColumnContainer.InfoTextContainer, {
73
+ id: "InfoTextContainer",
75
74
  clicked: clicked,
76
75
  width: width,
77
76
  height: height
78
- }, /*#__PURE__*/_react.default.createElement(_OneColumnContainer.InfoTextLabel, null, infoText)), /*#__PURE__*/_react.default.createElement(_OneColumnContainer.IconContainer, {
79
- onClick: onInfoClick
80
- }, /*#__PURE__*/_react.default.createElement(_InfoIcon.InfoIcon, {
81
- clicked: clicked
82
- })))));
77
+ }, /*#__PURE__*/_react.default.createElement(_OneColumnContainer.InfoTitleLabel, {
78
+ id: "infoTitleLabel"
79
+ }, infoTitle), /*#__PURE__*/_react.default.createElement(_OneColumnContainer.InfoTextLabel, {
80
+ id: "InfoTextLabel"
81
+ }, infoText)), /*#__PURE__*/_react.default.createElement(_OneColumnContainer.IconContainer, {
82
+ id: "IconContainer",
83
+ onMouseEnter: function onMouseEnter() {
84
+ return setClicked(true);
85
+ },
86
+ onMouseLeave: function onMouseLeave() {
87
+ return setClicked(false);
88
+ }
89
+ }, /*#__PURE__*/_react.default.createElement(_InfoIcon.InfoIcon, null)))));
83
90
  };
84
91
  exports.OneColumnContainer = OneColumnContainer;
85
92
  OneColumnContainer.defaultProps = {};
package/dist/stories/components/OneColumnContainer.style.js CHANGED
@@ -4,25 +4,27 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.StyledContainer = exports.InfoTextLabel = exports.InfoTextContainer = exports.IconContainer = void 0;
7
+ exports.StyledContainer = exports.InfoTitleLabel = exports.InfoTextLabel = exports.InfoTextContainer = exports.IconContainer = void 0;
8
8
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
9
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
10
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
11
11
  var StyledContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: ", ";\n height: ", ";\n box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);\n display: flex;\n position: relative;\n border-radius: 10px;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n"])), function (props) {
12
12
  return props.width;
13
13
  }, function (props) {
14
14
  return props.height;
15
15
  });
16
16
  exports.StyledContainer = StyledContainer;
17
- var InfoTextContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n width: ", ";\n height: ", ";\n align-items: center;\n display: flex;\n visibility: ", ";\n text-align: center;\n justify-content: center;\n background: rgba(16, 16, 16, .6);\n"])), function (props) {
17
+ var InfoTextContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n font-family: \"Lato\", sans-serif;\n width: ", ";\n height: ", ";\n visibility: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n background: white;\n margin: 0px 40px 0px 40px;\n"])), function (props) {
18
18
  return props.width;
19
19
  }, function (props) {
20
20
  return props.height;
21
21
  }, function (props) {
22
- return props.clicked ? 'visible' : 'hidden';
22
+ return props.clicked ? "visible" : "hidden";
23
23
  });
24
24
  exports.InfoTextContainer = InfoTextContainer;
25
- var InfoTextLabel = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n align-items: center;\n text-align: center;\n color: white;\n margin: 10px;\n justify-content: center;\n"])));
25
+ var InfoTitleLabel = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 700;\n color: black;\n margin: 0px 0px 10px 0px;\n font-size: 1.1em; \n"])));
26
+ exports.InfoTitleLabel = InfoTitleLabel;
27
+ var InfoTextLabel = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n color: black;\n font-size: 0.9em;\n line-height: 1.4em;\n font-weight: 500;\n"])));
26
28
  exports.InfoTextLabel = InfoTextLabel;
27
- var IconContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n width: 15px;\n height: 15px;\n position: absolute;\n margin-top:10px;\n margin-right:10px;\n top: 0;\n right: 0;\n"])));
29
+ var IconContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 15px;\n height: 15px;\n position: absolute;\n margin-top: 10px;\n margin-right: 10px;\n top: 0;\n right: 0;\n"])));
28
30
  exports.IconContainer = IconContainer;
package/dist/stories/components/icons/InfoIcon.js ADDED
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = exports.InfoIcon = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var InfoIcon = function InfoIcon(_ref) {
10
+ var clicked = _ref.clicked,
11
+ _ref$width = _ref.width,
12
+ width = _ref$width === void 0 ? "16" : _ref$width,
13
+ _ref$height = _ref.height,
14
+ height = _ref$height === void 0 ? "16" : _ref$height;
15
+ return /*#__PURE__*/_react.default.createElement("svg", {
16
+ width: width,
17
+ height: height,
18
+ viewBox: "0 0 16 16",
19
+ fill: "none",
20
+ xmlns: "http://www.w3.org/2000/svg"
21
+ }, /*#__PURE__*/_react.default.createElement("path", {
22
+ d: "M8 0C12.4062 0 16 3.59375 16 8C16 12.4375 12.4062 16 8 16C3.5625 16 0 12.4375 0 8C0 3.59375 3.5625 0 8 0ZM8 15C11.8438 15 15 11.875 15 8C15 4.15625 11.8438 1 8 1C4.125 1 1 4.15625 1 8C1 11.875 4.125 15 8 15ZM8 5.75C7.5625 5.75 7.25 5.4375 7.25 5C7.25 4.59375 7.5625 4.25 8 4.25C8.40625 4.25 8.75 4.59375 8.75 5C8.75 5.4375 8.40625 5.75 8 5.75ZM9.5 11C9.75 11 10 11.25 10 11.5C10 11.7812 9.75 12 9.5 12H6.5C6.21875 12 6 11.7812 6 11.5C6 11.25 6.21875 11 6.5 11H7.5V8H7C6.71875 8 6.5 7.78125 6.5 7.5C6.5 7.25 6.71875 7 7 7H8C8.25 7 8.5 7.25 8.5 7.5V11H9.5Z",
23
+ fill: "#1B30AA"
24
+ }));
25
+ };
26
+ exports.InfoIcon = InfoIcon;
27
+ var _default = InfoIcon;
28
+ exports.default = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.102",
3
+ "version": "1.0.104",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {