oolib 2.57.1 → 2.57.2

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.
@@ -1,7 +1,8 @@
1
- export function ModalHeaderStyle1({ title, linkTo, onClose, setAnimPos, initAnimPos, }: {
1
+ export function ModalHeaderStyle1({ title, linkTo, onClose, setAnimPos, initAnimPos, invert }: {
2
2
  title: any;
3
3
  linkTo: any;
4
4
  onClose: any;
5
5
  setAnimPos: any;
6
6
  initAnimPos: any;
7
+ invert: any;
7
8
  }): any;
@@ -10,7 +10,7 @@ var OKELink_1 = require("../../../../OKELink");
10
10
  var Typo_1 = require("../../../../Typo");
11
11
  var styled_1 = require("../../styled");
12
12
  var ModalHeaderStyle1 = function (_a) {
13
- var title = _a.title, linkTo = _a.linkTo, onClose = _a.onClose, setAnimPos = _a.setAnimPos, initAnimPos = _a.initAnimPos;
13
+ var title = _a.title, linkTo = _a.linkTo, onClose = _a.onClose, setAnimPos = _a.setAnimPos, initAnimPos = _a.initAnimPos, invert = _a.invert;
14
14
  return (react_1.default.createElement(styled_1.StyledModalLargeHeader, null,
15
15
  react_1.default.createElement("div", { style: {
16
16
  display: "flex",
@@ -18,9 +18,9 @@ var ModalHeaderStyle1 = function (_a) {
18
18
  alignItems: "center",
19
19
  } },
20
20
  !linkTo && title && (react_1.default.createElement("div", null,
21
- react_1.default.createElement(Typo_1.SANS_3_4, { semibold: true }, title))),
21
+ react_1.default.createElement(Typo_1.SANS_3_4, { invert: invert, semibold: true }, title))),
22
22
  linkTo && (react_1.default.createElement(Typo_1.SANS_4, { semibold: true },
23
- react_1.default.createElement(OKELink_1.OKELink, { iconAfter: "ArrowLineUpRight", linkType: "action", onClick: function () { return window.open(linkTo); }, iconSize: 15, color: "black" }, title)))),
24
- onClose && (react_1.default.createElement(Buttons_1.ButtonGhost, { icon: "X", onClick: function () { return setAnimPos(initAnimPos); } }))));
23
+ react_1.default.createElement(OKELink_1.OKELink, { iconAfter: "ArrowLineUpRight", linkType: "action", onClick: function () { return window.open(linkTo); }, iconSize: 15, color: "black", invert: invert }, title)))),
24
+ onClose && (react_1.default.createElement(Buttons_1.ButtonGhost, { invert: invert, icon: "X", onClick: function () { return setAnimPos(initAnimPos); } }))));
25
25
  };
26
26
  exports.ModalHeaderStyle1 = ModalHeaderStyle1;
@@ -1,4 +1,4 @@
1
- export function ModalLarge({ title, onClose, children, linkTo, desktopWidth, headerStyle, subtitle, fitToContentHeight }: {
1
+ export function ModalLarge({ title, onClose, children, linkTo, desktopWidth, headerStyle, subtitle, fitToContentHeight, invert }: {
2
2
  title: any;
3
3
  onClose: any;
4
4
  children: any;
@@ -7,4 +7,5 @@ export function ModalLarge({ title, onClose, children, linkTo, desktopWidth, hea
7
7
  headerStyle?: string;
8
8
  subtitle: any;
9
9
  fitToContentHeight?: boolean;
10
+ invert: any;
10
11
  }): any;
@@ -43,7 +43,7 @@ var ModalHeaderStyle1_1 = require("./comps/ModalHeaderStyle1");
43
43
  var ModalHeaderStyle2_1 = require("./comps/ModalHeaderStyle2");
44
44
  var styled_1 = require("./styled");
45
45
  var ModalLarge = function (_a) {
46
- var title = _a.title, onClose = _a.onClose, children = _a.children, linkTo = _a.linkTo, _b = _a.desktopWidth, desktopWidth = _b === void 0 ? "80%" : _b, _c = _a.headerStyle, headerStyle = _c === void 0 ? "style1" : _c, subtitle = _a.subtitle, _d = _a.fitToContentHeight, fitToContentHeight = _d === void 0 ? false : _d;
46
+ var title = _a.title, onClose = _a.onClose, children = _a.children, linkTo = _a.linkTo, _b = _a.desktopWidth, desktopWidth = _b === void 0 ? "80%" : _b, _c = _a.headerStyle, headerStyle = _c === void 0 ? "style1" : _c, subtitle = _a.subtitle, _d = _a.fitToContentHeight, fitToContentHeight = _d === void 0 ? false : _d, invert = _a.invert;
47
47
  var screenWidth = (0, useScreenWidth_1.useScreenWidth)();
48
48
  var handleClose = function () { return onClose(); };
49
49
  var initAnimPos = { marginTop: "100vh", opacity: 0 };
@@ -59,7 +59,7 @@ var ModalLarge = function (_a) {
59
59
  style2: ModalHeaderStyle2_1.ModalHeaderStyle2,
60
60
  };
61
61
  var Comp = headerStyles[headerStyle];
62
- return (react_1.default.createElement(Comp, { title: title, subtitle: subtitle, setAnimPos: setAnimPos, linkTo: linkTo, onClose: onClose, initAnimPos: initAnimPos }));
62
+ return (react_1.default.createElement(Comp, { title: title, subtitle: subtitle, setAnimPos: setAnimPos, linkTo: linkTo, onClose: onClose, initAnimPos: initAnimPos, invert: invert }));
63
63
  };
64
64
  /**
65
65
  * 'takeFullScreenOnScroll' messy as it is, it is needed,
@@ -46,7 +46,10 @@ exports.StyledModalLargeContentWrapper = styled_components_1.default.div(templat
46
46
  var takeFullScreenOnScroll = _a.takeFullScreenOnScroll;
47
47
  return takeFullScreenOnScroll ? "auto" : "unset";
48
48
  });
49
- exports.StyledModalLargeHeader = styled_components_1.default.header(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background-color: ", ";\n /* width: 100%; */\n height: 4rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 2rem;\n position: sticky;\n top: 0;\n z-index: 100;\n"], ["\n background-color: ", ";\n /* width: 100%; */\n height: 4rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 2rem;\n position: sticky;\n top: 0;\n z-index: 100;\n"])), greyColor5);
49
+ exports.StyledModalLargeHeader = styled_components_1.default.header(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background-color: ", ";\n /* width: 100%; */\n height: 4rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 2rem;\n position: sticky;\n top: 0;\n z-index: 100;\n"], ["\n background-color: ", ";\n /* width: 100%; */\n height: 4rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 2rem;\n position: sticky;\n top: 0;\n z-index: 100;\n"])), function (_a) {
50
+ var invert = _a.invert;
51
+ return invert ? greyColor5 : themes_1.colors.greyColor90;
52
+ });
50
53
  exports.StyledModalLargeBody = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n position: relative;\n ", "\n"], ["\n position: relative;\n ", "\n"])), function (_a) {
51
54
  var takeFullScreenOnScroll = _a.takeFullScreenOnScroll;
52
55
  return !takeFullScreenOnScroll && (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n flex: 1;\n overflow: auto;\n "], ["\n flex: 1;\n overflow: auto;\n "])));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oolib",
3
- "version": "2.57.1",
3
+ "version": "2.57.2",
4
4
  "description": " OKE Component Library",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",