oolib 2.173.3 → 2.174.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 (5) hide show
  1. package/dist/icons/index.d.ts +4 -0
  2. package/dist/icons/index.js +2 -0
  3. package/dist/v2/components/Buttons/index.js +2 -2
  4. package/dist/v2/components/Buttons/styled.js +13 -12
  5. package/package.json +1 -1
package/dist/icons/index.d.ts CHANGED
@@ -119,6 +119,8 @@ export namespace icons {
119
119
  export { Star };
120
120
  export { ArrowsVertical };
121
121
  export { CirclesFour };
122
+ export { ArrowLineDown };
123
+ export { PaperPlaneTilt };
122
124
  export { OkeGoogleIcon };
123
125
  export { LetterH };
124
126
  export { IndexIcon };
@@ -303,6 +305,8 @@ import { Warning } from 'phosphor-react';
303
305
  import { Star } from 'phosphor-react';
304
306
  import { ArrowsVertical } from 'phosphor-react';
305
307
  import { CirclesFour } from 'phosphor-react';
308
+ import { ArrowLineDown } from 'phosphor-react';
309
+ import { PaperPlaneTilt } from 'phosphor-react';
306
310
  import { OkeGoogleIcon } from "./custom";
307
311
  import { LetterH } from "./custom";
308
312
  import { IndexIcon } from "./custom";
package/dist/icons/index.js CHANGED
@@ -124,6 +124,8 @@ exports.icons = {
124
124
  Star: phosphor_react_1.Star,
125
125
  ArrowsVertical: phosphor_react_1.ArrowsVertical,
126
126
  CirclesFour: phosphor_react_1.CirclesFour,
127
+ ArrowLineDown: phosphor_react_1.ArrowLineDown,
128
+ PaperPlaneTilt: phosphor_react_1.PaperPlaneTilt,
127
129
  //custom icons
128
130
  OkeGoogleIcon: custom_1.OkeGoogleIcon,
129
131
  LetterH: custom_1.LetterH,
package/dist/v2/components/Buttons/index.js CHANGED
@@ -20,7 +20,7 @@ var styled_1 = require("./styled");
20
20
  var react_router_dom_1 = require("react-router-dom");
21
21
  var lodash_1 = require("lodash");
22
22
  var icons_1 = require("../../../icons");
23
- var themes_1 = require("../../../themes");
23
+ var colors_1 = require("../../themes/colors");
24
24
  var Typo2_1 = require("../Typo2");
25
25
  var mixins_1 = require("../../../themes/mixins");
26
26
  var DisplayIcon = function (_a) {
@@ -51,7 +51,7 @@ var ButtonStyledWrapper = function (_a) {
51
51
  var thisSize = iconSize || size;
52
52
  return typeof thisSize === 'number' ? thisSize : (thisSize === 'S' && responsive_) ? 18 : (thisSize === 'S' && !responsive_) ? 16 : 20;
53
53
  };
54
- var iconColor = !disabled ? _iconColor : themes_1.colors.greyColor40;
54
+ var iconColor = !disabled ? _iconColor : colors_1.colors.grey40;
55
55
  var DisplayTextTypo = Typos[typo] || Typo2_1.UI_BODY_SEMIBOLD_SM_DF;
56
56
  return (react_1.default.createElement(styled_1.ButtonStyled, { id: id, style: style, className: className, variant: variant, size: size, active: active, disabled: disabled, theme: theme, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, type: submit ? "submit" : "button", onClick: function (e) {
57
57
  stopPropagation && e.stopPropagation();
package/dist/v2/components/Buttons/styled.js CHANGED
@@ -43,6 +43,7 @@ var mixins_1 = require("../../../themes/mixins");
43
43
  var utils_1 = require("../../themes/utils");
44
44
  var styled_components_1 = __importStar(require("styled-components"));
45
45
  var Typo2_1 = require("../Typo2");
46
+ var grey40 = colors_1.colors.grey40, grey10 = colors_1.colors.grey10, grey80 = colors_1.colors.grey80, primaryContainer = colors_1.colors.primaryContainer, onPrimary = colors_1.colors.onPrimary, secondaryContainer = colors_1.colors.secondaryContainer, onSecondary = colors_1.colors.onSecondary;
46
47
  // Constants
47
48
  var BUTTON_SIZES = {
48
49
  S: '3rem',
@@ -61,28 +62,28 @@ var BUTTON_PADDING_DF = {
61
62
  // Hover Effects
62
63
  var createHoverEffect = function () { return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n &::before {\n content: '';\n background-color: transparent;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n ", "\n }\n\n &:hover::before {\n background-color: rgba(0, 0, 0, 0.1);\n }\n"], ["\n &::before {\n content: '';\n background-color: transparent;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n ", "\n }\n\n &:hover::before {\n background-color: rgba(0, 0, 0, 0.1);\n }\n"])), (0, mixins_1.transition)("background-color")); };
63
64
  // Disabled States
64
- var disabledStyles = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n"], ["\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n"])), colors_1.colors.grey10, colors_1.colors.grey40);
65
+ var disabledStyles = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n"], ["\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n"])), grey10, grey40);
65
66
  // Variant Styles
66
67
  var variants = {
67
68
  primary: (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n \n ", "\n ", "\n \n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "], ["\n background-color: ", ";\n color: ", ";\n \n ", "\n ", "\n \n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "])), function (_a) {
68
69
  var colors = _a.theme.colors;
69
- return colors ? (0, utils_1.getPrimaryContainer)(colors) : colors_1.colors.primaryContainer;
70
+ return colors ? (0, utils_1.getPrimaryContainer)(colors) : primaryContainer;
70
71
  }, function (_a) {
71
72
  var colors = _a.theme.colors;
72
- return colors ? (0, utils_1.getOnPrimary)(colors) : colors_1.colors.onPrimary;
73
- }, function (_a) {
74
- var disabled = _a.disabled;
75
- return disabled && disabledStyles;
73
+ return colors ? (0, utils_1.getOnPrimary)(colors) : onPrimary;
76
74
  }, function (_a) {
77
75
  var forceHover = _a.forceHover;
78
76
  return forceHover && createHoverEffect();
77
+ }, function (_a) {
78
+ var disabled = _a.disabled;
79
+ return disabled && disabledStyles;
79
80
  }, createHoverEffect()),
80
81
  secondary: (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n \n ", "\n ", "\n \n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "], ["\n background-color: ", ";\n color: ", ";\n \n ", "\n ", "\n \n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "])), function (_a) {
81
82
  var colors = _a.theme.colors;
82
- return colors ? (0, utils_1.getSecondaryContainer)(colors) : colors_1.colors.secondaryContainer;
83
+ return colors ? (0, utils_1.getSecondaryContainer)(colors) : secondaryContainer;
83
84
  }, function (_a) {
84
85
  var colors = _a.theme.colors;
85
- return colors ? (0, utils_1.getOnSecondary)(colors) : colors_1.colors.onSecondary;
86
+ return colors ? (0, utils_1.getOnSecondary)(colors) : onSecondary;
86
87
  }, function (_a) {
87
88
  var disabled = _a.disabled;
88
89
  return disabled && disabledStyles;
@@ -90,16 +91,16 @@ var variants = {
90
91
  var forceHover = _a.forceHover;
91
92
  return forceHover && createHoverEffect();
92
93
  }, createHoverEffect()),
93
- tertiary: (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background-color: transparent;\n color: ", ";\n /* border: 1px solid ", "; */\n box-sizing: border-box;\n outline: 1px solid ", ";\n ", "\n\n ", "\n\n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "], ["\n background-color: transparent;\n color: ", ";\n /* border: 1px solid ", "; */\n box-sizing: border-box;\n outline: 1px solid ", ";\n ", "\n\n ", "\n\n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "])), colors_1.colors.grey80, colors_1.colors.grey10, colors_1.colors.grey10, function (_a) {
94
+ tertiary: (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background-color: transparent;\n color: ", ";\n /* border: 1px solid ", "; */\n box-sizing: border-box;\n outline: 1px solid ", ";\n ", "\n\n ", "\n\n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "], ["\n background-color: transparent;\n color: ", ";\n /* border: 1px solid ", "; */\n box-sizing: border-box;\n outline: 1px solid ", ";\n ", "\n\n ", "\n\n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "])), grey80, colors_1.colors.grey10, grey10, function (_a) {
94
95
  var disabled = _a.disabled;
95
- return disabled && (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n color: ", ";\n pointer-events: none;\n "], ["\n color: ", ";\n pointer-events: none;\n "])), colors_1.colors.grey80);
96
+ return disabled && (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n color: ", ";\n pointer-events: none;\n "], ["\n color: ", ";\n pointer-events: none;\n "])), grey40);
96
97
  }, function (_a) {
97
98
  var forceHover = _a.forceHover;
98
99
  return forceHover && createHoverEffect();
99
100
  }, createHoverEffect()),
100
- ghost: (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n background-color: transparent;\n color: ", ";\n \n ", "\n \n ", "\n \n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "], ["\n background-color: transparent;\n color: ", ";\n \n ", "\n \n ", "\n \n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "])), colors_1.colors.grey80, function (_a) {
101
+ ghost: (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n background-color: transparent;\n color: ", ";\n\n ", "\n \n ", "\n \n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "], ["\n background-color: transparent;\n color: ", ";\n\n ", "\n \n ", "\n \n @media (hover: hover) {\n &:hover {\n ", "\n }\n }\n "])), grey80, function (_a) {
101
102
  var disabled = _a.disabled;
102
- return disabled && (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n color: ", ";\n pointer-events: none;\n "], ["\n color: ", ";\n pointer-events: none;\n "])), colors_1.colors.grey80);
103
+ return disabled && (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n color: ", ";\n pointer-events: none;\n "], ["\n color: ", ";\n pointer-events: none;\n "])), grey40);
103
104
  }, function (_a) {
104
105
  var forceHover = _a.forceHover;
105
106
  return forceHover && createHoverEffect();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oolib",
3
- "version": "2.173.3",
3
+ "version": "2.174.0",
4
4
  "description": " OKE Component Library",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",