oolib 2.3.1 → 2.4.0

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.
@@ -27,7 +27,7 @@ var icons_1 = require("../../icons");
27
27
  var themes_1 = require("../../themes");
28
28
  var mixins_1 = require("../../themes/mixins");
29
29
  var ArrowLeft = icons_1.phosphorIcons.ArrowLeft;
30
- var white = themes_1.colors.white, greyColor50 = themes_1.colors.greyColor50;
30
+ var white = themes_1.colors.white, greyColor100 = themes_1.colors.greyColor100, greyColor50 = themes_1.colors.greyColor50;
31
31
  // links array will be taken from params in the future (react router)
32
32
  var Breadcrumbs = function (_a) {
33
33
  var links = _a.links, invert = _a.invert;
@@ -50,6 +50,7 @@ var Breadcrumbs = function (_a) {
50
50
  return (react_1.default.createElement(index_styled_1.StyledBreadcrumbs, { ref: measuredContainer }, linksDisplayed_1.map(function (link, ind) {
51
51
  return (react_1.default.createElement(index_styled_1.StyledLinkCrumb, { to: link.to, invert: invert, key: ind, style: ind == linksDisplayed_1.length - 1 ? {
52
52
  pointerEvents: 'none',
53
+ color: greyColor50,
53
54
  width: !beConcise ? 'auto' : (function () {
54
55
  var children = measuredContainer.current.children;
55
56
  var childrenCount = children.length;
@@ -63,7 +64,7 @@ var Breadcrumbs = function (_a) {
63
64
  }
64
65
  return (react_1.default.createElement(index_styled_1.StyledBreadcrumbs, { ref: measuredContainer },
65
66
  react_1.default.createElement(index_styled_1.StyledLinkCrumb, { to: links[links.length - 2].to, invert: invert },
66
- react_1.default.createElement(ArrowLeft, { size: 14, weight: "bold", color: invert ? white : greyColor50 }),
67
+ react_1.default.createElement(ArrowLeft, { size: 14, weight: "bold", color: invert ? white : greyColor100 }),
67
68
  react_1.default.createElement(Typo_1.SANS_2, { invert: invert }, "Back"))));
68
69
  };
69
70
  exports.Breadcrumbs = Breadcrumbs;
@@ -14,12 +14,12 @@ var themes_1 = require("../../themes");
14
14
  var white = themes_1.colors.white, greyColor50 = themes_1.colors.greyColor50, greyColor100 = themes_1.colors.greyColor100;
15
15
  var StyledBreadcrumbs = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n padding: 0.5rem 0;\n gap: 15px;\n overflow: hidden;\n"], ["\n display: flex;\n align-items: center;\n padding: 0.5rem 0;\n gap: 15px;\n overflow: hidden;\n"])));
16
16
  exports.StyledBreadcrumbs = StyledBreadcrumbs;
17
- var StyledLinkCrumb = (0, styled_components_1.default)(react_router_dom_1.Link)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: 5px;\n position: relative;\n text-decoration: none;\n color: ", ";\n &::after {\n content: \"\";\n width: 1px;\n height: 60%;\n border-right: 1px solid ", ";\n cursor: default;\n position: absolute;\n left: calc(100% + 7px);\n top: 25%;\n }\n &:last-child {color: ", "}\n &:last-child::after {content: none;}\n"], ["\n display: flex;\n align-items: center;\n gap: 5px;\n position: relative;\n text-decoration: none;\n color: ", ";\n &::after {\n content: \"\";\n width: 1px;\n height: 60%;\n border-right: 1px solid ", ";\n cursor: default;\n position: absolute;\n left: calc(100% + 7px);\n top: 25%;\n }\n &:last-child {color: ", "}\n &:last-child::after {content: none;}\n"])), function (_a) {
17
+ var StyledLinkCrumb = (0, styled_components_1.default)(react_router_dom_1.Link)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: 5px;\n position: relative;\n text-decoration: none;\n color: ", ";\n &::after {\n content: \"\";\n width: 1px;\n height: 60%;\n border-right: 1px solid ", ";\n cursor: default;\n position: absolute;\n left: calc(100% + 7px);\n top: 25%;\n }\n &:last-child::after {content: none;}\n"], ["\n display: flex;\n align-items: center;\n gap: 5px;\n position: relative;\n text-decoration: none;\n color: ", ";\n &::after {\n content: \"\";\n width: 1px;\n height: 60%;\n border-right: 1px solid ", ";\n cursor: default;\n position: absolute;\n left: calc(100% + 7px);\n top: 25%;\n }\n &:last-child::after {content: none;}\n"])), function (_a) {
18
18
  var invert = _a.invert;
19
19
  return invert ? white : greyColor100;
20
20
  }, function (_a) {
21
21
  var invert = _a.invert;
22
22
  return invert ? white : greyColor100;
23
- }, greyColor50);
23
+ });
24
24
  exports.StyledLinkCrumb = StyledLinkCrumb;
25
25
  var templateObject_1, templateObject_2;
@@ -0,0 +1,5 @@
1
+ export default LanguageIcon;
2
+ declare function LanguageIcon({ color, size }: {
3
+ color?: string;
4
+ size?: number;
5
+ }): JSX.Element;
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ var react_1 = __importDefault(require("react"));
7
+ var themes_1 = require("../themes");
8
+ var LanguageIcon = function (_a) {
9
+ var _b = _a.color, color = _b === void 0 ? themes_1.colors.greyColor100 : _b, _c = _a.size, size = _c === void 0 ? 20 : _c;
10
+ return (react_1.default.createElement("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
11
+ react_1.default.createElement("path", { d: "M7.96924 10.0556C9.06013 10.0556 9.94447 9.25962 9.94447 8.27778C9.94447 7.29594 9.06013 6.5 7.96924 6.5C7.32302 6.5 6.74928 6.77931 6.38892 7.21111", stroke: color, "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }),
12
+ react_1.default.createElement("path", { d: "M7.82804 10.0557C8.9969 10.0557 9.94444 10.8516 9.94444 11.8334C9.94444 12.8153 8.9969 13.6112 7.82804 13.6112C6.64286 13.6112 5.78219 12.426 5.5 11.8334", stroke: color, "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }),
13
+ react_1.default.createElement("path", { d: "M8.16666 9.05566C7.61438 9.05566 7.16666 9.50338 7.16666 10.0557C7.16666 10.6079 7.61438 11.0557 8.16666 11.0557V9.05566ZM11.7222 11.0557C12.2745 11.0557 12.7222 10.6079 12.7222 10.0557C12.7222 9.50338 12.2745 9.05566 11.7222 9.05566V11.0557ZM8.16666 11.0557H11.7222V9.05566H8.16666V11.0557Z", fill: color }),
14
+ react_1.default.createElement("path", { d: "M11.5 5.5C10.9477 5.5 10.5 5.94772 10.5 6.5C10.5 7.05228 10.9477 7.5 11.5 7.5V5.5ZM14.1667 7.5C14.719 7.5 15.1667 7.05228 15.1667 6.5C15.1667 5.94772 14.719 5.5 14.1667 5.5V7.5ZM11.5 7.5H14.1667V5.5H11.5V7.5Z", fill: color }),
15
+ react_1.default.createElement("path", { d: "M14 6.5C14 5.94772 13.5523 5.5 13 5.5C12.4477 5.5 12 5.94772 12 6.5L14 6.5ZM12 13.6111C12 14.1634 12.4477 14.6111 13 14.6111C13.5523 14.6111 14 14.1634 14 13.6111L12 13.6111ZM12 6.5L12 13.6111L14 13.6111L14 6.5L12 6.5Z", fill: color }),
16
+ react_1.default.createElement("circle", { cx: "10", cy: "10", r: "9", stroke: color, "stroke-width": "2" })));
17
+ };
18
+ exports.default = LanguageIcon;
@@ -67,6 +67,7 @@ export namespace phosphorIcons {
67
67
  export { LetterH };
68
68
  export { LetterP };
69
69
  export { IndexIcon };
70
+ export { LanguageIcon };
70
71
  export { ArrowRight };
71
72
  export { Sliders };
72
73
  }
@@ -138,5 +139,6 @@ import OkeGoogleIcon from "./OkeGoogleIcon";
138
139
  import LetterH from "./LetterH";
139
140
  import LetterP from "./LetterP";
140
141
  import IndexIcon from "./IndexIcon";
142
+ import LanguageIcon from "./LangIcon";
141
143
  import { ArrowRight } from "phosphor-react";
142
144
  import { Sliders } from "phosphor-react";
@@ -9,6 +9,7 @@ var OkeGoogleIcon_1 = __importDefault(require("./OkeGoogleIcon"));
9
9
  var LetterH_1 = __importDefault(require("./LetterH"));
10
10
  var LetterP_1 = __importDefault(require("./LetterP"));
11
11
  var IndexIcon_1 = __importDefault(require("./IndexIcon"));
12
+ var LangIcon_1 = __importDefault(require("./LangIcon"));
12
13
  exports.phosphorIcons = {
13
14
  PencilSimple: phosphor_react_1.PencilSimple,
14
15
  PencilLine: phosphor_react_1.PencilLine,
@@ -78,6 +79,7 @@ exports.phosphorIcons = {
78
79
  LetterH: LetterH_1.default,
79
80
  LetterP: LetterP_1.default,
80
81
  IndexIcon: IndexIcon_1.default,
82
+ LanguageIcon: LangIcon_1.default,
81
83
  ArrowRight: phosphor_react_1.ArrowRight,
82
84
  Sliders: phosphor_react_1.Sliders
83
85
  };
package/dist/index.d.ts CHANGED
@@ -7,3 +7,4 @@ export * from "./components/Breadcrumbs";
7
7
  export * from "./components/BlockLabel";
8
8
  export { colors } from "./themes";
9
9
  export { phosphorIcons } from "./icons";
10
+ export { mediaQuery, getBreakPoint, transition, transitionWithDuration, transitionWithDelay, multiTransition } from "./themes/mixins";
package/dist/index.js CHANGED
@@ -10,7 +10,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
10
  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
11
11
  };
12
12
  Object.defineProperty(exports, "__esModule", { value: true });
13
- exports.phosphorIcons = exports.colors = exports.GlobalStyles = void 0;
13
+ exports.multiTransition = exports.transitionWithDelay = exports.transitionWithDuration = exports.transition = exports.getBreakPoint = exports.mediaQuery = exports.phosphorIcons = exports.colors = exports.GlobalStyles = void 0;
14
14
  var globalStyles_1 = require("./globalStyles");
15
15
  Object.defineProperty(exports, "GlobalStyles", { enumerable: true, get: function () { return globalStyles_1.GlobalStyles; } });
16
16
  __exportStar(require("./components/Typo"), exports);
@@ -23,3 +23,10 @@ __exportStar(require("./components/Buttons"), exports);
23
23
  __exportStar(require("./components/Tags"), exports);
24
24
  __exportStar(require("./components/Breadcrumbs"), exports);
25
25
  __exportStar(require("./components/BlockLabel"), exports);
26
+ var mixins_1 = require("./themes/mixins");
27
+ Object.defineProperty(exports, "mediaQuery", { enumerable: true, get: function () { return mixins_1.mediaQuery; } });
28
+ Object.defineProperty(exports, "getBreakPoint", { enumerable: true, get: function () { return mixins_1.getBreakPoint; } });
29
+ Object.defineProperty(exports, "transition", { enumerable: true, get: function () { return mixins_1.transition; } });
30
+ Object.defineProperty(exports, "transitionWithDuration", { enumerable: true, get: function () { return mixins_1.transitionWithDuration; } });
31
+ Object.defineProperty(exports, "transitionWithDelay", { enumerable: true, get: function () { return mixins_1.transitionWithDelay; } });
32
+ Object.defineProperty(exports, "multiTransition", { enumerable: true, get: function () { return mixins_1.multiTransition; } });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oolib",
3
- "version": "2.3.1",
3
+ "version": "2.4.0",
4
4
  "description": " OKE Component Library",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",