linear-react-components-ui 1.0.10-beta.11 → 1.0.10-beta.12

package/lib/badge/badge.spec.js

@@ -0,0 +1,127 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+require("@testing-library/jest-dom/extend-expect");
+
+var _ = _interopRequireDefault(require("."));
+
+var _icons = _interopRequireDefault(require("../icons"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var mockBadge = function mockBadge(props) {
+  return /*#__PURE__*/_react.default.createElement(_.default, _extends({
+    customClass: "mockBadge",
+    customClassForBadge: "classforbadge",
+    content: "10"
+  }, props), /*#__PURE__*/_react.default.createElement(_icons.default, {
+    name: "bell_alert"
+  }));
+};
+
+describe('Badges', function () {
+  it('should render correctly', function () {
+    var _render = (0, _react2.render)(mockBadge()),
+        container = _render.container;
+
+    expect(container.firstChild).toBeTruthy();
+  });
+  it('should render children', function () {
+    var _render2 = (0, _react2.render)(mockBadge()),
+        container = _render2.container,
+        getByTestId = _render2.getByTestId;
+
+    expect(container.firstChild).toContainElement(getByTestId('icon'));
+  });
+  it('should render content', function () {
+    var _render3 = (0, _react2.render)(mockBadge()),
+        container = _render3.container;
+
+    expect(container.firstChild).toHaveTextContent('10');
+  });
+  it('should apply custom class', function () {
+    var _render4 = (0, _react2.render)(mockBadge()),
+        container = _render4.container;
+
+    expect(container.firstChild).toHaveClass('mockBadge');
+  });
+  it('should apply custom class', function () {
+    var _render5 = (0, _react2.render)(mockBadge()),
+        container = _render5.container;
+
+    expect(container.firstChild).toHaveClass('mockBadge');
+  });
+  it('should apply custom class for badge', function () {
+    var _render6 = (0, _react2.render)(mockBadge()),
+        container = _render6.container;
+
+    expect(container.querySelector('.badge')).toHaveClass('classforbadge');
+  });
+  it('should apply custom top', function () {
+    var _render7 = (0, _react2.render)(mockBadge({
+      top: '10px'
+    })),
+        container = _render7.container;
+
+    expect(container.querySelector('.badge')).toHaveStyle('top: 10px;');
+  });
+  it('should apply custom right', function () {
+    var _render8 = (0, _react2.render)(mockBadge({
+      right: '10px'
+    })),
+        container = _render8.container;
+
+    expect(container.querySelector('.badge')).toHaveStyle('right: 10px;');
+  });
+  it('should apply default color', function () {
+    var _render9 = (0, _react2.render)(mockBadge()),
+        container = _render9.container;
+
+    expect(container.querySelector('.badge')).toHaveClass('-default');
+  });
+  it('should apply primary color', function () {
+    var _render10 = (0, _react2.render)(mockBadge({
+      color: 'primary'
+    })),
+        container = _render10.container;
+
+    expect(container.querySelector('.badge')).toHaveClass('-primary');
+  });
+  it('should apply danger color', function () {
+    var _render11 = (0, _react2.render)(mockBadge({
+      color: 'danger'
+    })),
+        container = _render11.container;
+
+    expect(container.querySelector('.badge')).toHaveClass('-danger');
+  });
+  it('should apply warning color', function () {
+    var _render12 = (0, _react2.render)(mockBadge({
+      color: 'warning'
+    })),
+        container = _render12.container;
+
+    expect(container.querySelector('.badge')).toHaveClass('-warning');
+  });
+  it('should apply success color', function () {
+    var _render13 = (0, _react2.render)(mockBadge({
+      color: 'success'
+    })),
+        container = _render13.container;
+
+    expect(container.querySelector('.badge')).toHaveClass('-success');
+  });
+  it('should apply info color', function () {
+    var _render14 = (0, _react2.render)(mockBadge({
+      color: 'info'
+    })),
+        container = _render14.container;
+
+    expect(container.querySelector('.badge')).toHaveClass('-info');
+  });
+});

package/lib/buttons/ActivateButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const ActivateButton: (props: IButtonProps) => JSX.Element;
 

package/lib/buttons/AddButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const AddButton: (props: IButtonProps) => JSX.Element;
 

package/lib/buttons/Button.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 interface ButtonProps extends IButtonProps {
     split?: boolean;

package/lib/buttons/CancelButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const CancelButton: ({ customClass, ...rest }: IButtonProps) => JSX.Element;
 

package/lib/buttons/DangerButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const DangerButton: ({ customClass, ...rest }: IButtonProps) => JSX.Element;
 

package/lib/buttons/DefaultButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const _default: {
     (props: Omit<IButtonProps, "split">): JSX.Element;

package/lib/buttons/DefaultButton.js

@@ -9,8 +9,6 @@ exports.default = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _lodash = _interopRequireDefault(require("lodash"));
-
 var _icons = _interopRequireDefault(require("../../lib/icons"));
 
 var _withTooltip = _interopRequireDefault(require("../internals/withTooltip"));
@@ -21,7 +19,7 @@ var _withDropdown = _interopRequireDefault(require("../dropdown/withDropdown"));
 
 var _permissionValidations = require("../permissionValidations");
 
-var _excluded = ["dropdown", "onClick", "disabled", "iconName", "icon", "targetRef", "tabIndex", "isLoading", "label", "showDropdown", "getDropdownPopup", "isDropdownOpened", "showIconDropdown", "content", "style", "toggleable", "activeIconColor", "iconStyle", "visible", "customClass", "className", "size", "iconAlign", "boxShadow", "transparent", "round", "permissionAttr", "skeletonize", "tooltipPosition", "errorMessage", "tooltipWidth", "isFloatMenu", "dropdownAlign", "customClassForDropdown", "buttonRef"];
+var _excluded = ["dropdown", "onClick", "disabled", "iconName", "icon", "targetRef", "tabIndex", "isLoading", "label", "showDropdown", "getDropdownPopup", "isDropdownOpened", "showIconDropdown", "content", "style", "toggleable", "activeIconColor", "iconStyle", "visible", "customClass", "className", "size", "iconAlign", "boxShadow", "transparent", "round", "permissionAttr", "skeletonize", "tooltipPosition", "tooltipWidth", "isFloatMenu", "dropdownAlign", "customClassForDropdown"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -82,12 +80,10 @@ var DefaultButton = function DefaultButton(_ref) {
       permissionAttr = _ref.permissionAttr,
       skeletonize = _ref.skeletonize,
       tooltipPosition = _ref.tooltipPosition,
-      errorMessage = _ref.errorMessage,
       tooltipWidth = _ref.tooltipWidth,
       isFloatMenu = _ref.isFloatMenu,
       dropdownAlign = _ref.dropdownAlign,
       customClassForDropdown = _ref.customClassForDropdown,
-      buttonRef = _ref.buttonRef,
       rest = _objectWithoutProperties(_ref, _excluded);
 
   var options = [_permissionValidations.OPTIONS_ON_DENIED.disabled, _permissionValidations.OPTIONS_ON_DENIED.unvisible];
@@ -101,7 +97,7 @@ var DefaultButton = function DefaultButton(_ref) {
       _useState4 = _slicedToArray(_useState3, 1),
       onDenied = _useState4[0];
 
-  var refButton = (0, _react.useRef)(null);
+  var buttonRef = (0, _react.useRef)(null);
   var disabledIconColor = 'rgb(193, 193, 193)';
 
   var shouldDisable = function shouldDisable() {
@@ -164,16 +160,8 @@ var DefaultButton = function DefaultButton(_ref) {
     disabled: shouldDisable(),
     className: "".concat(getClass(), " ").concat(activeButton ? '-toggleable' : '', " ").concat(skeletonize ? '-skeletonized' : ''),
     ref: function ref(r) {
-      if (buttonRef) {
-        if (!_lodash.default.isFunction(buttonRef)) {
-          refButton.current = r;
-        } else {
-          buttonRef(r);
-        }
-      }
-
       if (targetRef) targetRef(r);
-      refButton.current = r;
+      buttonRef.current = r;
     },
     tabIndex: tabIndex
   }), content, getIcon(), label || '', isLoading && /*#__PURE__*/_react.default.createElement("div", {
@@ -181,7 +169,7 @@ var DefaultButton = function DefaultButton(_ref) {
   }, /*#__PURE__*/_react.default.createElement(_spinner.default, {
     align: "none",
     delayTime: 0
-  }))), dropdown && refButton.current && getDropdownPopup && getDropdownPopup(refButton.current));
+  }))), dropdown && buttonRef.current && getDropdownPopup && getDropdownPopup(buttonRef.current));
 };
 
 var _default = (0, _withDropdown.default)((0, _withTooltip.default)(DefaultButton));

package/lib/buttons/DestroyButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const DestroyButton: ({ icon, ...rest }: IButtonProps) => JSX.Element;
 

package/lib/buttons/EditButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const EditButton: (props: IButtonProps) => JSX.Element;
 

package/lib/buttons/InactivateButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const InactivateButton: (props: IButtonProps) => JSX.Element;
 

package/lib/buttons/InfoButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const InfoButton: ({ customClass, ...rest }: IButtonProps) => JSX.Element;
 

package/lib/buttons/PrimaryButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const PrimaryButton: ({ customClass, ...rest }: IButtonProps) => JSX.Element;
 

package/lib/buttons/RestoreButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const RestoreButton: (props: IButtonProps) => JSX.Element;
 

package/lib/buttons/SaveButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const SaveButton: ({ customClass, ...rest }: IButtonProps) => JSX.Element;
 

package/lib/buttons/SpinnerLoading.js

@@ -0,0 +1,230 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var SpinnerLoading = function SpinnerLoading() {
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    className: "lds-spinner spinnerloading",
+    width: "50px",
+    viewBox: "0 0 100 100",
+    preserveAspectRatio: "xMidYMid",
+    style: {
+      background: 'none',
+      float: 'right'
+    }
+  }, /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(0 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.9166666666666666s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(30 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.8333333333333334s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(60 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.75s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(90 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.6666666666666666s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(120 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.5833333333333334s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(150 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.5s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(180 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.4166666666666667s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(210 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.3333333333333333s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(240 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.25s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(270 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.16666666666666666s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(300 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "-0.08333333333333333s",
+    repeatCount: "indefinite"
+  }))), /*#__PURE__*/_react.default.createElement("g", {
+    transform: "rotate(330 50 50)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    x: "47",
+    y: "24",
+    rx: "9.4",
+    ry: "4.8",
+    width: "6",
+    height: "12",
+    fill: "#3B3B3B"
+  }, /*#__PURE__*/_react.default.createElement("animate", {
+    attributeName: "opacity",
+    values: "1;0",
+    keyTimes: "0;1",
+    dur: "1s",
+    begin: "0s",
+    repeatCount: "indefinite"
+  }))));
+};
+
+var _default = SpinnerLoading;
+exports.default = _default;

package/lib/buttons/SuccessButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const SuccessButton: ({ customClass, ...rest }: IButtonProps) => JSX.Element;
 

package/lib/buttons/WarningButton.d.ts

@@ -3,8 +3,6 @@ import 'react';
 import '../@types/PermissionAttr.js';
 import '../@types/Position.js';
 import '../@types/Size.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
 
 declare const WarningButton: ({ customClass, ...rest }: IButtonProps) => JSX.Element;