@ntbjs/react-components 0.0.1-beta.5 → 0.0.1-beta.50

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ntbjs/react-components",
-  "version": "0.0.1-beta.5",
+  "version": "0.0.1-beta.50",
   "description": "NTBs common front-end design utilities and React components.",
   "scripts": {
     "build": "cross-env NODE_ENV=production rollup -c",
@@ -33,13 +33,13 @@
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@babel/preset-react": "^7.13.13",
     "@rollup/plugin-babel": "^5.3.0",
-    "@rollup/plugin-commonjs": "^18.0.0",
-    "@rollup/plugin-node-resolve": "^11.2.1",
-    "@storybook/addon-actions": "^6.2.9",
-    "@storybook/addon-docs": "^6.2.9",
-    "@storybook/addon-essentials": "^6.2.9",
-    "@storybook/addon-links": "^6.2.9",
-    "@storybook/react": "^6.2.9",
+    "@rollup/plugin-commonjs": "^19.0.0",
+    "@rollup/plugin-node-resolve": "^13.0.0",
+    "@storybook/addon-actions": "^6.5.14",
+    "@storybook/addon-docs": "^6.5.14",
+    "@storybook/addon-essentials": "^6.5.14",
+    "@storybook/addon-links": "^6.5.14",
+    "@storybook/react": "^6.5.14",
     "@svgr/rollup": "^5.5.0",
     "@svgr/webpack": "^5.5.0",
     "@testing-library/jest-dom": "^5.12.0",
@@ -50,31 +50,36 @@
     "colors": "^1.4.0",
     "cross-env": "^7.0.3",
     "eslint": "^7.24.0",
-    "eslint-plugin-react": "^7.23.2",
+    "eslint-plugin-react": "^7.24.0",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^26.6.3",
-    "postcss": "^8.2.12",
+    "jest": "^27.0.4",
+    "postcss": "^8.3.0",
     "prop-types": "^15.7.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "rollup": "^2.45.2",
+    "rollup": "^2.50.6",
     "rollup-plugin-copy": "^3.3.0",
     "rollup-plugin-delete": "^2.0.0",
-    "rollup-plugin-multi-input": "^1.2.0",
+    "rollup-plugin-multi-input": "^1.3.1",
     "rollup-plugin-peer-deps-external": "^2.2.0",
     "rollup-plugin-postcss": "^4.0.0",
     "rollup-plugin-scss": "^2.6.1",
     "rollup-plugin-url": "^3.0.1",
-    "sass": "^1.32.11",
+    "sass": "^1.34.1",
     "sass-loader": "^10.1.1",
-    "storybook-dark-mode": "^1.0.7",
+    "storybook-dark-mode": "^2.0.4",
     "url-loader": "^4.1.1"
   },
   "dependencies": {
     "@restart/hooks": "^0.3.26",
+    "@storybook/addons": "^6.5.14",
+    "@storybook/theming": "^6.5.14",
     "@tippyjs/react": "^4.2.5",
     "lodash": "^4.17.21",
+    "nanoid": "^3.1.25",
+    "polished": "^4.1.3",
     "react-lazy-load-image-component": "^1.5.1",
-    "styled-components": "^5.2.3"
+    "resize-observer-polyfill": "^1.5.1",
+    "styled-components": "^5.3.5"
   }
 }

package/ssr/index.js

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styled = require('styled-components');
+
+
+
+Object.defineProperty(exports, 'ServerStyleSheet', {
+	enumerable: true,
+	get: function () {
+		return styled.ServerStyleSheet;
+	}
+});

package/styles/config.scss

@@ -9,6 +9,7 @@ $colors: (
   'emerald-300': #bfe0d5,
   'emerald-200': #f3f9f7,
   'gray-900': #141313,
+  'gray-800': #272727,
   'gray-700': #323232,
   'gray-600': #505050,
   'gray-500': #767676,

package/styles/utils/colors.scss

@@ -1,4 +1,4 @@
-@import 'src/styles/config';
+@import '../config';
 
 @function color($name) {
   @if map-has-key($colors, $name) {

package/widgets/AssetGallery/index.js

@@ -1,9 +1,25 @@
-export { A as default } from '../../AssetGallery-9d1879a9.js';
-import '../../defaultTheme-789305db.js';
-import 'styled-components';
-import 'react';
-import 'lodash';
-import 'react-lazy-load-image-component';
-import '../../ActionButton-a63b155c.js';
-import '../../Tooltip-609bad98.js';
-import '@tippyjs/react';
+'use strict';
+
+var AssetGallery = require('../../AssetGallery-0141d8f4.js');
+require('../../defaultTheme-870f7df1.js');
+require('styled-components');
+require('react');
+require('lodash');
+require('../../TextInput-a7c32f5f.js');
+require('nanoid');
+require('resize-observer-polyfill');
+require('react-lazy-load-image-component');
+require('../../ActionButton-90485300.js');
+require('../../Button-0d728b52.js');
+require('../../Checkbox-bab7f4d1.js');
+require('../../Radio-0b46b2a8.js');
+require('polished');
+require('../../TextArea-52cf4c0a.js');
+require('../../Switch-aa384260.js');
+require('../../Popover-d3e2f6c0.js');
+require('@tippyjs/react');
+require('../../Tooltip-f95a39f4.js');
+
+
+
+module.exports = AssetGallery.AssetGallery;

package/widgets/index.js

@@ -1,9 +1,27 @@
-export { A as AssetGallery } from '../AssetGallery-9d1879a9.js';
-import '../defaultTheme-789305db.js';
-import 'styled-components';
-import 'react';
-import 'lodash';
-import 'react-lazy-load-image-component';
-import '../ActionButton-a63b155c.js';
-import '../Tooltip-609bad98.js';
-import '@tippyjs/react';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var AssetGallery = require('../AssetGallery-0141d8f4.js');
+require('../defaultTheme-870f7df1.js');
+require('styled-components');
+require('react');
+require('lodash');
+require('../TextInput-a7c32f5f.js');
+require('nanoid');
+require('resize-observer-polyfill');
+require('react-lazy-load-image-component');
+require('../ActionButton-90485300.js');
+require('../Button-0d728b52.js');
+require('../Checkbox-bab7f4d1.js');
+require('../Radio-0b46b2a8.js');
+require('polished');
+require('../TextArea-52cf4c0a.js');
+require('../Switch-aa384260.js');
+require('../Popover-d3e2f6c0.js');
+require('@tippyjs/react');
+require('../Tooltip-f95a39f4.js');
+
+
+
+exports.AssetGallery = AssetGallery.AssetGallery;

package/ActionButton-a63b155c.js

@@ -1,31 +0,0 @@
-import { a as applyDefaultTheme, _ as _taggedTemplateLiteral, b as _objectWithoutProperties, c as _extends, p as propTypes } from './defaultTheme-789305db.js';
-import React__default from 'react';
-import styled from 'styled-components';
-
-var _templateObject;
-var ActionButton$1 = styled.button.attrs(applyDefaultTheme)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  height: 40px;\n  width: 40px;\n  border: 0;\n  color: inherit;\n  background-color: transparent;\n  ", "\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: 0 0;\n  transition: background-size 250ms ease;\n  cursor: pointer;\n\n  :hover:not(:disabled) {\n    background-size: 200% 200%;\n\n    svg {\n      ", ";\n    }\n  }\n\n  &:disabled {\n    opacity: 0.5;\n    color: inherit;\n    cursor: not-allowed;\n  }\n\n  svg {\n    width: 100%;\n    max-height: 20px;\n    max-width: 20px;\n    pointer-events: none;\n    transition: color 250ms;\n  }\n"])), function (props) {
-  return props.theme.themeProp('background-image', "radial-gradient(circle at center, ".concat(props.theme.getColor('gray-600'), " 50%, transparent 50%)"), "radial-gradient(circle at center, ".concat(props.theme.getColor('gray-200'), " 50%, transparent 50%)"));
-}, function (props) {
-  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700'));
-});
-
-var ActionButton = React__default.forwardRef(function ActionButton(_ref, forwardedRef) {
-  var icon = _ref.icon,
-      disabled = _ref.disabled,
-      onClick = _ref.onClick,
-      props = _objectWithoutProperties(_ref, ["icon", "disabled", "onClick"]);
-
-  return React__default.createElement(ActionButton$1, _extends({
-    ref: forwardedRef,
-    disabled: disabled,
-    onClick: onClick
-  }, props), icon);
-});
-ActionButton.propTypes = process.env.NODE_ENV !== "production" ? {
-  icon: propTypes.element.isRequired,
-  disabled: propTypes.bool,
-  onClick: propTypes.func.isRequired
-} : {};
-ActionButton.defaultProps = {};
-
-export { ActionButton as A };