oolib 2.2.4 → 2.3.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.
Files changed (15) hide show
  1. package/dist/components/Buttons/index.styled.js +1 -1
  2. package/dist/components/Tags/index.d.ts +3 -3
  3. package/dist/components/Tags/index.js +5 -5
  4. package/dist/components/Tags/index.styled.js +16 -26
  5. package/dist/icons/IndexIcon.d.ts +1 -0
  6. package/dist/icons/IndexIcon.js +13 -0
  7. package/dist/icons/index.d.ts +2 -0
  8. package/dist/icons/index.js +3 -1
  9. package/dist/themes/mixins/index.d.ts +5 -2
  10. package/dist/themes/mixins/index.js +6 -3
  11. package/dist/themes/mixins/transitions.d.ts +4 -0
  12. package/dist/themes/mixins/transitions.js +23 -0
  13. package/package.json +1 -1
  14. package/dist/themes/mixins/kp-transitions.d.ts +0 -1
  15. package/dist/themes/mixins/kp-transitions.js +0 -11
package/dist/components/Buttons/index.styled.js CHANGED
@@ -169,7 +169,7 @@ exports.ButtonStyled = styled_components_1.default.button(templateObject_18 || (
169
169
  }, function (_a) {
170
170
  var width = _a.width;
171
171
  return width && (0, styled_components_2.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n width: ", ";\n "], ["\n width: ", ";\n "])), width);
172
- }, (0, mixins_1.kpTransition)('background-color'), function (_a) {
172
+ }, (0, mixins_1.transition)('background-color'), function (_a) {
173
173
  var variant = _a.variant;
174
174
  return buttonVariantSetting[variant];
175
175
  });
package/dist/components/Tags/index.d.ts CHANGED
@@ -3,7 +3,7 @@ export function TagDisplay({ display, invert, M, theme, variant }: {
3
3
  invert: any;
4
4
  M: any;
5
5
  theme: any;
6
- variant: any;
6
+ variant?: string;
7
7
  }): JSX.Element;
8
8
  export function TagClear({ id, display, value, M, invert, onClick, theme, variant, grey, }: {
9
9
  id: any;
@@ -13,7 +13,7 @@ export function TagClear({ id, display, value, M, invert, onClick, theme, varian
13
13
  invert: any;
14
14
  onClick?: () => void;
15
15
  theme: any;
16
- variant: any;
16
+ variant?: string;
17
17
  grey: any;
18
18
  }): JSX.Element;
19
19
  export function TagSelect({ onClick, isSelected, display, value, M, theme, }: {
@@ -30,5 +30,5 @@ export function TagLink({ display, to, invert, M, theme, variant }: {
30
30
  invert: any;
31
31
  M: any;
32
32
  theme: any;
33
- variant: any;
33
+ variant?: string;
34
34
  }): JSX.Element;
package/dist/components/Tags/index.js CHANGED
@@ -25,19 +25,19 @@ var index_styled_1 = require("./index.styled");
25
25
  var Typo_1 = require("../Typo");
26
26
  var icons_1 = require("../../icons");
27
27
  function TagDisplay(_a) {
28
- var display = _a.display, invert = _a.invert, M = _a.M, theme = _a.theme, variant = _a.variant;
28
+ var display = _a.display, invert = _a.invert, M = _a.M, theme = _a.theme, _b = _a.variant, variant = _b === void 0 ? 'primary' : _b;
29
29
  var size = M ? 'M' : 'S';
30
30
  return (react_1.default.createElement(index_styled_1.StyledTagDisplay, { variant: variant, invert: invert, theme: theme, size: size },
31
31
  react_1.default.createElement(Typo_1.SANS_3, { semibold: true }, display)));
32
32
  }
33
33
  exports.TagDisplay = TagDisplay;
34
34
  function TagClear(_a) {
35
- var id = _a.id, display = _a.display, value = _a.value, M = _a.M, invert = _a.invert, _b = _a.onClick, onClick = _b === void 0 ? function () { } : _b, theme = _a.theme, variant = _a.variant, grey = _a.grey;
35
+ var id = _a.id, display = _a.display, value = _a.value, M = _a.M, invert = _a.invert, _b = _a.onClick, onClick = _b === void 0 ? function () { } : _b, theme = _a.theme, _c = _a.variant, variant = _c === void 0 ? 'primary' : _c, grey = _a.grey;
36
36
  var XIconCom = icons_1.phosphorIcons['X'];
37
37
  var size = M ? 'M' : 'S';
38
- return (react_1.default.createElement(index_styled_1.StyledTagClear, { invert: invert, theme: theme, size: size, grey: grey, variant: variant, onClick: function () { return !variant && onClick(id, { display: display, value: value }); } },
38
+ return (react_1.default.createElement(index_styled_1.StyledTagClear, { invert: invert, theme: theme, size: size, grey: grey, variant: variant },
39
39
  react_1.default.createElement(Typo_1.SANS_3, { semibold: true }, display),
40
- react_1.default.createElement(index_styled_1.StyledIconWrapper, { theme: theme, invert: invert, grey: grey, variant: variant, onClick: function () { return variant && onClick(id, { display: display, value: value }); } },
40
+ react_1.default.createElement(index_styled_1.StyledIconWrapper, { theme: theme, invert: invert, grey: grey, variant: variant, onClick: function () { return onClick(id, { display: display, value: value }); } },
41
41
  react_1.default.createElement(XIconCom, { size: '15', weight: 'bold' }))));
42
42
  }
43
43
  exports.TagClear = TagClear;
@@ -59,7 +59,7 @@ function TagSelect(_a) {
59
59
  }
60
60
  exports.TagSelect = TagSelect;
61
61
  function TagLink(_a) {
62
- var display = _a.display, to = _a.to, invert = _a.invert, M = _a.M, theme = _a.theme, variant = _a.variant;
62
+ var display = _a.display, to = _a.to, invert = _a.invert, M = _a.M, theme = _a.theme, _b = _a.variant, variant = _b === void 0 ? 'primary' : _b;
63
63
  var size = M ? 'M' : 'S';
64
64
  return (react_1.default.createElement(index_styled_1.StyledLink, { to: to },
65
65
  react_1.default.createElement(index_styled_1.StyledTagLink, { theme: theme, variant: variant, invert: invert, size: size },
package/dist/components/Tags/index.styled.js CHANGED
@@ -27,7 +27,7 @@ exports.StyledTagLink = exports.StyledTagSelect = exports.StyledTagClear = expor
27
27
  var styled_components_1 = __importStar(require("styled-components"));
28
28
  var colors_1 = require("../../themes/colors");
29
29
  var react_router_dom_1 = require("react-router-dom");
30
- var greyColor100 = colors_1.colors.greyColor100, greyColor80 = colors_1.colors.greyColor80, greyColor70 = colors_1.colors.greyColor70, greyColor15 = colors_1.colors.greyColor15, greyColor40 = colors_1.colors.greyColor40, white = colors_1.colors.white, greyColor10 = colors_1.colors.greyColor10;
30
+ var greyColor100 = colors_1.colors.greyColor100, greyColor80 = colors_1.colors.greyColor80, greyColor15 = colors_1.colors.greyColor15, greyColor40 = colors_1.colors.greyColor40, white = colors_1.colors.white;
31
31
  var SIZES = {
32
32
  S: "3rem",
33
33
  M: "4rem",
@@ -36,35 +36,29 @@ var commonStyle = function (_a) {
36
36
  var size = _a.size;
37
37
  return "\n padding: 0 1rem;\n position: relative;\n display: inline-flex;\n column-gap: 1rem;\n align-items: center;\n border-radius:0.2rem;\n white-space: nowrap;\n\theight: ".concat(SIZES[size], ";\n");
38
38
  };
39
- var StyledTagDisplay = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n \n\t", "\n\t", "\n\n"], ["\n ", "\n \n\t", "\n\t", "\n\n"])), function (_a) {
39
+ var StyledTagDisplay = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), function (_a) {
40
40
  var size = _a.size;
41
41
  return commonStyle({ size: size });
42
- }, function (_a) {
43
- var invert = _a.invert;
44
- return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t"], ["\n\t\tbackground-color: ", ";\n\t\tcolor: ", ";\n\t"])), !invert ? greyColor15 : greyColor80, !invert ? greyColor80 : greyColor40);
45
42
  }, function (_a) {
46
43
  var variant = _a.variant, invert = _a.invert;
47
- return variant === "secondry" && (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n\t\t\tbackground: none;\n\t\t\tborder: 2px solid ", ";\n\t\t\tcolor: ", ";\n\t\t"], ["\n\t\t\tbackground: none;\n\t\t\tborder: 2px solid ", ";\n\t\t\tcolor: ", ";\n\t\t"])), !invert ? greyColor15 : greyColor80, !invert ? greyColor80 : greyColor15);
44
+ return variant === 'primary' ? (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: ", ";\n\t\t"], ["\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: ", ";\n\t\t"])), !invert ? greyColor15 : greyColor80, !invert ? greyColor80 : greyColor40) : //secondary
45
+ (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n\t\t\tbackground: none;\n\t\t\tborder: 2px solid ", ";\n\t\t\tcolor: ", ";\n\t\t"], ["\n\t\t\tbackground: none;\n\t\t\tborder: 2px solid ", ";\n\t\t\tcolor: ", ";\n\t\t"])), !invert ? greyColor15 : greyColor80, !invert ? greyColor80 : greyColor15);
48
46
  });
49
47
  exports.StyledTagDisplay = StyledTagDisplay;
50
- var StyledTagClear = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n ", "\n \n\t", "\n\n\t", "\n\t", "\n"], ["\n ", "\n \n\t", "\n\n\t", "\n\t", "\n"])), function (_a) {
48
+ var StyledTagClear = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n\n ", "\n\n\t", "\n \n\t\n\t", "\n"], ["\n\n ", "\n\n\t", "\n \n\t\n\t", "\n"])), function (_a) {
51
49
  var size = _a.size;
52
50
  return commonStyle({ size: size });
53
51
  }, function (_a) {
54
52
  var variant = _a.variant, invert = _a.invert, grey = _a.grey, colors = _a.theme.colors;
55
- return !variant && // no variant passed, then primary (default)
56
- (!grey
57
- ? (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n\t\t\t\t\tcursor: pointer;\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "], ["\n\t\t\t\t\tcursor: pointer;\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "])), !invert
58
- ? colors === null || colors === void 0 ? void 0 : colors.primaryColor100
59
- : colors === null || colors === void 0 ? void 0 : colors.primaryColor40, !invert ? white : greyColor100) : (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n\t\t\t\t\tcursor: pointer;\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "], ["\n\t\t\t\t\tcursor: pointer;\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "])), !invert ? greyColor15 : greyColor80, !invert ? greyColor80 : greyColor40));
60
- }, function (_a) {
61
- var variant = _a.variant, invert = _a.invert, grey = _a.grey, colors = _a.theme.colors;
62
- return variant === "secondry" &&
63
- (!grey
64
- ? (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n\t\t\t\t\tbackground: none;\n\t\t\t\t\tborder: 2px solid\n\t\t\t\t\t\t", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "], ["\n\t\t\t\t\tbackground: none;\n\t\t\t\t\tborder: 2px solid\n\t\t\t\t\t\t", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "])), !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColor100 : colors === null || colors === void 0 ? void 0 : colors.primaryColor40, !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColorText : colors === null || colors === void 0 ? void 0 : colors.primaryColor40) : (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n\t\t\t\t\tbackground: none;\n\t\t\t\t\tborder: 2px solid ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "], ["\n\t\t\t\t\tbackground: none;\n\t\t\t\t\tborder: 2px solid ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "])), !invert ? greyColor15 : greyColor80, !invert ? greyColor80 : greyColor15));
53
+ if (variant === 'primary') {
54
+ return grey ? (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "], ["\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "])), !invert ? greyColor15 : greyColor80, !invert ? greyColor80 : greyColor40) : (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "], ["\n\t\t\t\t\tbackground-color: ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t "])), !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColor100 : colors === null || colors === void 0 ? void 0 : colors.primaryColor40, !invert ? white : greyColor100);
55
+ }
56
+ else { // secondry
57
+ return grey ? (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n\t\t\t\t\tbackground: none;\n\t\t\t\t\tborder: 2px solid ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t\t"], ["\n\t\t\t\t\tbackground: none;\n\t\t\t\t\tborder: 2px solid ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t\t"])), !invert ? greyColor15 : greyColor80, !invert ? greyColor80 : greyColor15) : (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n\t\t\t\t\tbackground: none;\n\t\t\t\t\tborder: 2px solid ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t\t"], ["\n\t\t\t\t\tbackground: none;\n\t\t\t\t\tborder: 2px solid ", ";\n\t\t\t\t\tcolor: ", ";\n\t\t\t\t"])), !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColor100 : colors === null || colors === void 0 ? void 0 : colors.primaryColor40, !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColorText : colors === null || colors === void 0 ? void 0 : colors.primaryColor40);
58
+ }
65
59
  }, function (_a) {
66
60
  var variant = _a.variant;
67
- return variant === "ghost" && (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n\t\t\tbackground: none;\n\t\t"], ["\n\t\t\tbackground: none;\n\t\t"])));
61
+ return variant === "ghost" && (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["background: none;"], ["background: none;"])));
68
62
  });
69
63
  exports.StyledTagClear = StyledTagClear;
70
64
  var StyledTagSelect = styled_components_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n ", "\n\t", "\n"], ["\n ", "\n\t", "\n"])), function (_a) {
@@ -75,22 +69,18 @@ var StyledTagSelect = styled_components_1.default.div(templateObject_10 || (temp
75
69
  return "\n border: 2px solid ".concat(colors === null || colors === void 0 ? void 0 : colors.primaryColor100, ";\n cursor: pointer;\n background-color: ").concat(selected ? colors === null || colors === void 0 ? void 0 : colors.primaryColor100 : null, ";\n\t\tcolor: ").concat(!selected ? colors === null || colors === void 0 ? void 0 : colors.primaryColorText : white, "\n ");
76
70
  });
77
71
  exports.StyledTagSelect = StyledTagSelect;
78
- var StyledTagLink = styled_components_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n\t", "\n\t\n"], ["\n ", "\n\t", "\n\t\n"])), function (_a) {
72
+ var StyledTagLink = styled_components_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n\t", "\t\n"], ["\n ", "\n\t", "\t\n"])), function (_a) {
79
73
  var size = _a.size;
80
74
  return commonStyle({ size: size });
81
75
  }, function (_a) {
82
76
  var variant = _a.variant, invert = _a.invert, colors = _a.theme.colors;
83
- if (variant !== "secondry") {
84
- return (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: ", ";\n\t\t"], ["\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: ", ";\n\t\t"])), !invert
85
- ? colors === null || colors === void 0 ? void 0 : colors.primaryColor100
86
- : colors === null || colors === void 0 ? void 0 : colors.primaryColor40, !invert ? white : greyColor100);
87
- }
88
- return (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n\t\t\tbackground: none;\n\t\t\tborder: 2px solid\n\t\t\t\t", ";\n\t\t\tcolor: ", ";\n\t\t"], ["\n\t\t\tbackground: none;\n\t\t\tborder: 2px solid\n\t\t\t\t", ";\n\t\t\tcolor: ", ";\n\t\t"])), !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColor100 : colors === null || colors === void 0 ? void 0 : colors.primaryColor40, !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColorText : colors === null || colors === void 0 ? void 0 : colors.primaryColor40);
77
+ return variant === 'primary' ? (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: ", ";\n\t\t"], ["\n\t\t\tbackground-color: ", ";\n\t\t\tcolor: ", ";\n\t\t"])), !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColor100 : colors === null || colors === void 0 ? void 0 : colors.primaryColor40, !invert ? white : greyColor100) : // secondary
78
+ (0, styled_components_1.css)(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n\t\t\tbackground: none;\n\t\t\tborder: 2px solid ", ";\n\t\t\tcolor: ", ";\n\t\t"], ["\n\t\t\tbackground: none;\n\t\t\tborder: 2px solid ", ";\n\t\t\tcolor: ", ";\n\t\t"])), !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColor100 : colors === null || colors === void 0 ? void 0 : colors.primaryColor40, !invert ? colors === null || colors === void 0 ? void 0 : colors.primaryColorText : colors === null || colors === void 0 ? void 0 : colors.primaryColor40);
89
79
  });
90
80
  exports.StyledTagLink = StyledTagLink;
91
81
  var StyledIconWrapper = styled_components_1.default.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n display: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tcursor: pointer;\n\n\t", "\n"], ["\n display: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tcursor: pointer;\n\n\t", "\n"])), function (_a) {
92
82
  var invert = _a.invert, grey = _a.grey;
93
- return grey && (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n\t\t\tcolor: ", ";\n\t\t"], ["\n\t\t\tcolor: ", ";\n\t\t"])), !invert ? greyColor100 : white);
83
+ return grey && (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["color: ", ";"], ["color: ", ";"])), !invert ? greyColor100 : white);
94
84
  });
95
85
  exports.StyledIconWrapper = StyledIconWrapper;
96
86
  var StyledLink = (0, styled_components_1.default)(react_router_dom_1.NavLink)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n text-decoration: none;\n"], ["\n text-decoration: none;\n"])));
package/dist/icons/IndexIcon.d.ts ADDED
@@ -0,0 +1 @@
1
+ export default function index(): JSX.Element;
package/dist/icons/IndexIcon.js ADDED
@@ -0,0 +1,13 @@
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
+ function index() {
8
+ return (react_1.default.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
9
+ react_1.default.createElement("path", { d: "M6 7H18", stroke: "black", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }),
10
+ react_1.default.createElement("path", { d: "M6 12H18", stroke: "black", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }),
11
+ react_1.default.createElement("path", { d: "M6 17L12 17", stroke: "black", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })));
12
+ }
13
+ exports.default = index;
package/dist/icons/index.d.ts CHANGED
@@ -66,6 +66,7 @@ export namespace phosphorIcons {
66
66
  export { OkeGoogleIcon };
67
67
  export { LetterH };
68
68
  export { LetterP };
69
+ export { IndexIcon };
69
70
  }
70
71
  import { PencilSimple } from "phosphor-react";
71
72
  import { PencilLine } from "phosphor-react";
@@ -134,3 +135,4 @@ import { TextUnderline } from "phosphor-react";
134
135
  import OkeGoogleIcon from "./OkeGoogleIcon";
135
136
  import LetterH from "./LetterH";
136
137
  import LetterP from "./LetterP";
138
+ import IndexIcon from "./IndexIcon";
package/dist/icons/index.js CHANGED
@@ -8,6 +8,7 @@ var phosphor_react_1 = require("phosphor-react");
8
8
  var OkeGoogleIcon_1 = __importDefault(require("./OkeGoogleIcon"));
9
9
  var LetterH_1 = __importDefault(require("./LetterH"));
10
10
  var LetterP_1 = __importDefault(require("./LetterP"));
11
+ var IndexIcon_1 = __importDefault(require("./IndexIcon"));
11
12
  exports.phosphorIcons = {
12
13
  PencilSimple: phosphor_react_1.PencilSimple,
13
14
  PencilLine: phosphor_react_1.PencilLine,
@@ -75,5 +76,6 @@ exports.phosphorIcons = {
75
76
  TextUnderline: phosphor_react_1.TextUnderline,
76
77
  OkeGoogleIcon: OkeGoogleIcon_1.default,
77
78
  LetterH: LetterH_1.default,
78
- LetterP: LetterP_1.default
79
+ LetterP: LetterP_1.default,
80
+ IndexIcon: IndexIcon_1.default
79
81
  };
package/dist/themes/mixins/index.d.ts CHANGED
@@ -1,4 +1,7 @@
1
1
  export function mediaQuery(point: any): any;
2
2
  export function getBreakPoint(point: any): 0 | 600 | 800 | 1000 | 1300 | 1600 | "pass a valid breakpoint";
3
- import { kpTransition } from "./kp-transitions";
4
- export { kpTransition };
3
+ import { transition } from "./transitions";
4
+ import { transitionWithDuration } from "./transitions";
5
+ import { transitionWithDelay } from "./transitions";
6
+ import { multiTransition } from "./transitions";
7
+ export { transition, transitionWithDuration, transitionWithDelay, multiTransition };
package/dist/themes/mixins/index.js CHANGED
@@ -4,10 +4,13 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
4
4
  return cooked;
5
5
  };
6
6
  Object.defineProperty(exports, "__esModule", { value: true });
7
- exports.kpTransition = exports.getBreakPoint = exports.mediaQuery = void 0;
7
+ exports.multiTransition = exports.transitionWithDelay = exports.transitionWithDuration = exports.transition = exports.getBreakPoint = exports.mediaQuery = void 0;
8
8
  var styled_components_1 = require("styled-components");
9
- var kp_transitions_1 = require("./kp-transitions");
10
- Object.defineProperty(exports, "kpTransition", { enumerable: true, get: function () { return kp_transitions_1.kpTransition; } });
9
+ var transitions_1 = require("./transitions");
10
+ Object.defineProperty(exports, "transition", { enumerable: true, get: function () { return transitions_1.transition; } });
11
+ Object.defineProperty(exports, "transitionWithDuration", { enumerable: true, get: function () { return transitions_1.transitionWithDuration; } });
12
+ Object.defineProperty(exports, "transitionWithDelay", { enumerable: true, get: function () { return transitions_1.transitionWithDelay; } });
13
+ Object.defineProperty(exports, "multiTransition", { enumerable: true, get: function () { return transitions_1.multiTransition; } });
11
14
  var getBreakPoint = function (point) {
12
15
  switch (point) {
13
16
  case "xs":
package/dist/themes/mixins/transitions.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ export function transition(property: any): any;
2
+ export function transitionWithDuration(property: any, duration: any): any;
3
+ export function transitionWithDelay(property: any, delay: any): any;
4
+ export function multiTransition(...properties: any[]): any;
package/dist/themes/mixins/transitions.js ADDED
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
+ return cooked;
5
+ };
6
+ Object.defineProperty(exports, "__esModule", { value: true });
7
+ exports.multiTransition = exports.transitionWithDelay = exports.transitionWithDuration = exports.transition = void 0;
8
+ var styled_components_1 = require("styled-components");
9
+ var transition = function (property) { return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n transition: ", " 0.3s ease-out;\n"], ["\n transition: ", " 0.3s ease-out;\n"])), property); };
10
+ exports.transition = transition;
11
+ var transitionWithDuration = function (property, duration) { return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n transition: ", " ", " ease-out;\n"], ["\n transition: ", " ", " ease-out;\n"])), property, duration); };
12
+ exports.transitionWithDuration = transitionWithDuration;
13
+ var transitionWithDelay = function (property, delay) { return (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n transition: ", " 0.3s ease-out;\n transition-delay: ", ";\n"], ["\n transition: ", " 0.3s ease-out;\n transition-delay: ", ";\n"])), property, delay); };
14
+ exports.transitionWithDelay = transitionWithDelay;
15
+ var multiTransition = function () {
16
+ var properties = [];
17
+ for (var _i = 0; _i < arguments.length; _i++) {
18
+ properties[_i] = arguments[_i];
19
+ }
20
+ return (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n transition: ", " 0.3s ease-out;\n"], ["\n transition: ", " 0.3s ease-out;\n"])), properties.join(' 0.3s ease-out, '));
21
+ };
22
+ exports.multiTransition = multiTransition;
23
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oolib",
3
- "version": "2.2.4",
3
+ "version": "2.3.0",
4
4
  "description": " OKE Component Library",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
package/dist/themes/mixins/kp-transitions.d.ts DELETED
@@ -1 +0,0 @@
1
- export function kpTransition(property: any): any;
package/dist/themes/mixins/kp-transitions.js DELETED
@@ -1,11 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- Object.defineProperty(exports, "__esModule", { value: true });
7
- exports.kpTransition = void 0;
8
- var styled_components_1 = require("styled-components");
9
- var kpTransition = function (property) { return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n transition: ", " 0.3s ease-out;\n "], ["\n transition: ", " 0.3s ease-out;\n "])), property); };
10
- exports.kpTransition = kpTransition;
11
- var templateObject_1;