@prom-ui/core 0.0.19 → 0.0.22

package/Spinner/package.json

@@ -1,8 +1,11 @@
 {
   "name": "@prom-ui/core/Spinner",
-  "version": "0.0.19",
+  "version": "0.0.22",
   "main": "index.js",
   "types": "index.d.ts",
+  "sideEffects": [
+    "*.css"
+  ],
   "dependencies": {
     "evokit": "^3.2.3"
   }

package/Text/index.js

@@ -1,7 +1,5 @@
 'use strict';
 
-require('./style.css');
-
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var evokitText = require('evokit-text');
@@ -18,3 +16,5 @@ Object.defineProperty(exports, 'Text', {
     enumerable: true,
     get: function () { return evokitText.Text; }
 });
+
+require('./style.css');

package/Text/package.json

@@ -1,8 +1,11 @@
 {
   "name": "@prom-ui/core/Text",
-  "version": "0.0.19",
+  "version": "0.0.22",
   "main": "index.js",
   "types": "index.d.ts",
+  "sideEffects": [
+    "*.css"
+  ],
   "dependencies": {
     "evokit-text": "^3.2.0"
   }

package/TextEmoji/package.json

@@ -1,8 +1,11 @@
 {
   "name": "@prom-ui/core/TextEmoji",
-  "version": "0.0.19",
+  "version": "0.0.22",
   "main": "index.js",
   "types": "index.d.ts",
+  "sideEffects": [
+    "*.css"
+  ],
   "dependencies": {
     "@evo/emoji-text": "^0.1.1"
   }

package/Tooltip/Popper/index.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export declare type tPlacement = 'auto' | 'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'right-start' | 'bottom-start' | 'left-start' | 'top-end' | 'right-end' | 'bottom-end' | 'left-end';
+export declare type tPopperProps = {
+    hideArrow?: boolean;
+    withPadding?: boolean;
+    theme: 'white' | 'black';
+    placement: tPlacement;
+    children?: React.ReactNode;
+    arrowProps?: any;
+    tooltipProps?: any;
+};
+export declare const Popper: React.FC<tPopperProps>;

package/Tooltip/Popper/index.js

@@ -0,0 +1,88 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var PropTypes = require('prop-types');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+var __assign = function() {
+    __assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+
+var themeWhite = {"popper":"Tooltip-Popper__popper___QfuZ2","body":"Tooltip-Popper__body___ccixN","withPadding":"Tooltip-Popper__withPadding___NcotR Tooltip-Popper__body___ccixN","arrow":"Tooltip-Popper__arrow___EH4RM"};
+
+var themeBlack = {"popper":"Tooltip-Popper__popper___jz7P8","body":"Tooltip-Popper__body___ac26T","withPadding":"Tooltip-Popper__withPadding___mBCQj Tooltip-Popper__body___ac26T","arrow":"Tooltip-Popper__arrow___6fLZr"};
+
+var THEMES = {
+  white: themeWhite,
+  black: themeBlack
+};
+
+var getTheme = function (name) {
+  if (THEMES.hasOwnProperty(name)) {
+    return THEMES[name];
+  }
+
+  return THEMES.white;
+};
+
+var Popper = function (_a) {
+  var tooltipProps = _a.tooltipProps,
+      arrowProps = _a.arrowProps,
+      children = _a.children,
+      _b = _a.hideArrow,
+      hideArrow = _b === void 0 ? false : _b,
+      placement = _a.placement,
+      theme = _a.theme,
+      withPadding = _a.withPadding;
+  var css = getTheme(theme);
+  return React__default["default"].createElement("div", __assign({}, tooltipProps, {
+    className: css.popper,
+    "data-placement": placement
+  }), !hideArrow && React__default["default"].createElement("div", __assign({}, arrowProps, {
+    className: css.arrow
+  })), React__default["default"].createElement("div", {
+    className: withPadding ? css.withPadding : css.body
+  }, children));
+}; // Popper.defaultProps = {
+//     children: null,
+//     hideArrow: false,
+// };
+
+Popper.propTypes = {
+  // children: PropTypes.node,
+  hideArrow: PropTypes__default["default"].bool // onShow: PropTypes.func,
+  // theme: PropTypes.string.isRequired,
+
+};
+
+exports.Popper = Popper;
+
+require('./style.css');

package/Tooltip/Popper/package.json

@@ -0,0 +1,9 @@
+{
+  "name": "@prom-ui/core/Tooltip/Popper",
+  "version": "0.0.22",
+  "main": "index.js",
+  "types": "index.d.ts",
+  "sideEffects": [
+    "*.css"
+  ]
+}

package/Tooltip/Popper/style.css

@@ -0,0 +1,133 @@
+.Tooltip-Popper__popper___QfuZ2 {
+    box-shadow: 0 0 10px 0 rgba(51, 51, 51, 0.2);
+    box-sizing: border-box;
+    border-radius: var(--pds-round-m);
+    cursor: default;
+    transition: opacity 250ms;
+    margin: 12px;
+}
+
+.Tooltip-Popper__body___ccixN {
+    position: relative;
+    background-color: var(--white);
+    color: var(--black-900);
+    border-radius: var(--pds-round-m);
+    word-wrap: break-word;
+    word-break: break-word;
+}
+
+.Tooltip-Popper__withPadding___NcotR {
+    padding: var(--pds-spacing-l);
+}
+
+.Tooltip-Popper__arrow___EH4RM {
+    position: absolute;
+    width: 12px;
+    height: 12px;
+    background: var(--white);
+    box-shadow: 0 0 10px 0 rgba(51, 51, 51, 0.2);
+    transform: rotate(45deg);
+}
+
+.Tooltip-Popper__popper___QfuZ2[data-placement="top"] .Tooltip-Popper__arrow___EH4RM, .Tooltip-Popper__popper___QfuZ2[data-placement="top-start"] .Tooltip-Popper__arrow___EH4RM, .Tooltip-Popper__popper___QfuZ2[data-placement="top-end"] .Tooltip-Popper__arrow___EH4RM {
+        bottom: calc(calc(12px * -1) / 2);
+    }
+
+.Tooltip-Popper__popper___QfuZ2[data-placement="right"] .Tooltip-Popper__arrow___EH4RM, .Tooltip-Popper__popper___QfuZ2[data-placement="right-start"] .Tooltip-Popper__arrow___EH4RM, .Tooltip-Popper__popper___QfuZ2[data-placement="right-end"] .Tooltip-Popper__arrow___EH4RM {
+        left: calc(calc(12px * -1) / 2);
+    }
+
+.Tooltip-Popper__popper___QfuZ2[data-placement="bottom"] .Tooltip-Popper__arrow___EH4RM, .Tooltip-Popper__popper___QfuZ2[data-placement="bottom-start"] .Tooltip-Popper__arrow___EH4RM, .Tooltip-Popper__popper___QfuZ2[data-placement="bottom-end"] .Tooltip-Popper__arrow___EH4RM {
+        top: calc(calc(12px * -1) / 2);
+    }
+
+.Tooltip-Popper__popper___QfuZ2[data-placement="left"] .Tooltip-Popper__arrow___EH4RM, .Tooltip-Popper__popper___QfuZ2[data-placement="left-start"] .Tooltip-Popper__arrow___EH4RM, .Tooltip-Popper__popper___QfuZ2[data-placement="left-end"] .Tooltip-Popper__arrow___EH4RM {
+        right: calc(calc(12px * -1) / 2);
+    }
+
+.Tooltip-Popper__popper___QfuZ2[data-placement="top-start"],
+.Tooltip-Popper__popper___QfuZ2[data-placement="bottom-start"] {
+    margin-left: calc(12px * -1);
+}
+
+.Tooltip-Popper__popper___QfuZ2[data-placement="right-start"],
+.Tooltip-Popper__popper___QfuZ2[data-placement="left-start"] {
+    margin-top: calc(12px * -1);
+}
+
+.Tooltip-Popper__popper___QfuZ2[data-placement="top-end"],
+.Tooltip-Popper__popper___QfuZ2[data-placement="bottom-end"] {
+    margin-right: calc(12px * -1);
+}
+
+.Tooltip-Popper__popper___QfuZ2[data-placement="right-end"],
+.Tooltip-Popper__popper___QfuZ2[data-placement="left-end"] {
+    margin-bottom: calc(12px * -1);
+}
+
+.Tooltip-Popper__popper___jz7P8 {
+    box-shadow: 0 0 10px 0 rgba(51, 51, 51, 0.2);
+    box-sizing: border-box;
+    border-radius: var(--pds-round-m);
+    cursor: default;
+    transition: opacity 250ms;
+    margin: 12px;
+}
+
+.Tooltip-Popper__body___ac26T {
+    position: relative;
+    background-color: var(--black-800);
+    color: var(--white);
+    border-radius: var(--pds-round-m);
+    word-wrap: break-word;
+    word-break: break-word;
+}
+
+.Tooltip-Popper__withPadding___mBCQj {
+    padding: var(--pds-spacing-l);
+}
+
+.Tooltip-Popper__arrow___6fLZr {
+    position: absolute;
+    width: 12px;
+    height: 12px;
+    background: var(--black-800);
+    box-shadow: 0 0 10px 0 rgba(51, 51, 51, 0.2);
+    transform: rotate(45deg);
+}
+
+.Tooltip-Popper__popper___jz7P8[data-placement="top"] .Tooltip-Popper__arrow___6fLZr, .Tooltip-Popper__popper___jz7P8[data-placement="top-start"] .Tooltip-Popper__arrow___6fLZr, .Tooltip-Popper__popper___jz7P8[data-placement="top-end"] .Tooltip-Popper__arrow___6fLZr {
+        bottom: calc(calc(12px * -1) / 2);
+    }
+
+.Tooltip-Popper__popper___jz7P8[data-placement="right"] .Tooltip-Popper__arrow___6fLZr, .Tooltip-Popper__popper___jz7P8[data-placement="right-start"] .Tooltip-Popper__arrow___6fLZr, .Tooltip-Popper__popper___jz7P8[data-placement="right-end"] .Tooltip-Popper__arrow___6fLZr {
+        left: calc(calc(12px * -1) / 2);
+    }
+
+.Tooltip-Popper__popper___jz7P8[data-placement="bottom"] .Tooltip-Popper__arrow___6fLZr, .Tooltip-Popper__popper___jz7P8[data-placement="bottom-start"] .Tooltip-Popper__arrow___6fLZr, .Tooltip-Popper__popper___jz7P8[data-placement="bottom-end"] .Tooltip-Popper__arrow___6fLZr {
+        top: calc(calc(12px * -1) / 2);
+    }
+
+.Tooltip-Popper__popper___jz7P8[data-placement="left"] .Tooltip-Popper__arrow___6fLZr, .Tooltip-Popper__popper___jz7P8[data-placement="left-start"] .Tooltip-Popper__arrow___6fLZr, .Tooltip-Popper__popper___jz7P8[data-placement="left-end"] .Tooltip-Popper__arrow___6fLZr {
+        right: calc(calc(12px * -1) / 2);
+    }
+
+.Tooltip-Popper__popper___jz7P8[data-placement="top-start"],
+.Tooltip-Popper__popper___jz7P8[data-placement="bottom-start"] {
+    margin-left: calc(12px * -1);
+}
+
+.Tooltip-Popper__popper___jz7P8[data-placement="right-start"],
+.Tooltip-Popper__popper___jz7P8[data-placement="left-start"] {
+    margin-top: calc(12px * -1);
+}
+
+.Tooltip-Popper__popper___jz7P8[data-placement="top-end"],
+.Tooltip-Popper__popper___jz7P8[data-placement="bottom-end"] {
+    margin-right: calc(12px * -1);
+}
+
+.Tooltip-Popper__popper___jz7P8[data-placement="right-end"],
+.Tooltip-Popper__popper___jz7P8[data-placement="left-end"] {
+    margin-bottom: calc(12px * -1);
+}

package/Tooltip/Trigger/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare type tTriggerProps = {
+    withHolder?: boolean;
+};
+export declare const Trigger: React.FC<tTriggerProps>;

package/Tooltip/Trigger/index.js

@@ -0,0 +1,76 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var PropTypes = require('prop-types');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+var __assign = function() {
+    __assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+var css = {"trigger":"Tooltip-Trigger__trigger___IGmeZ","triggerHolder":"Tooltip-Trigger__triggerHolder___bZIXx"};
+
+var Trigger = function (_a) {
+  var _b = _a.withHolder,
+      withHolder = _b === void 0 ? false : _b,
+      props = __rest(_a, ["withHolder"]);
+
+  if (withHolder) {
+    return React__default["default"].createElement("span", {
+      className: css.triggerHolder
+    }, React__default["default"].createElement("span", __assign({}, props, {
+      className: css.trigger
+    })));
+  }
+
+  return React__default["default"].createElement("span", __assign({}, props, {
+    className: css.trigger
+  }));
+};
+Trigger.propTypes = {
+  withHolder: PropTypes__default["default"].bool
+};
+
+exports.Trigger = Trigger;
+
+require('./style.css');

package/Tooltip/Trigger/package.json

@@ -0,0 +1,9 @@
+{
+  "name": "@prom-ui/core/Tooltip/Trigger",
+  "version": "0.0.22",
+  "main": "index.js",
+  "types": "index.d.ts",
+  "sideEffects": [
+    "*.css"
+  ]
+}

package/Tooltip/Trigger/style.css

@@ -0,0 +1,36 @@
+.Tooltip-Trigger__trigger___IGmeZ {
+    display: inline-block;
+    vertical-align: middle;
+    border-radius: 50%;
+    box-sizing: border-box;
+    background: var(--black-400);
+    color: var(--black-800);
+    width: 16px;
+    height: 16px;
+    position: relative;
+    -webkit-user-select: none;
+       -moz-user-select: none;
+        -ms-user-select: none;
+            user-select: none
+}
+
+.Tooltip-Trigger__trigger___IGmeZ::after {
+        content: "?";
+        position: absolute;
+        left: 0;
+        top: 0;
+        font-weight: 700;
+        font-size: 10px;
+        width: 100%;
+        text-align: center;
+        line-height: 16px;
+    }
+
+.Tooltip-Trigger__triggerHolder___bZIXx {
+    display: inline;
+    white-space: nowrap
+}
+
+.Tooltip-Trigger__triggerHolder___bZIXx::before {
+        content: "\00a0\00a0";
+    }

package/Tooltip/index.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { tPlacement } from './Popper';
+export declare type tTooltipProps = {
+    zIndex?: number | string;
+    width?: number | string;
+    hideArrow?: boolean;
+    withHolder?: boolean;
+    withPadding?: boolean;
+    qaidTrigger?: string;
+    qaidPopper?: string;
+    trigger?: any;
+    defaultTooltipShown?: boolean;
+    tooltipShown?: boolean;
+    usePortal?: boolean;
+    theme?: 'white' | 'black';
+    placement?: tPlacement;
+    delayShow?: number;
+    delayHide?: number;
+    tooltip: React.ReactNode;
+    children: (arg: any) => JSX.Element;
+    onVisibilityChange?: () => void;
+    modifiers?: {};
+};
+export declare const Tooltip: React.FC<tTooltipProps>;