@ntbjs/react-components 0.0.1-beta.9 → 1.1.0-beta.1

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 (48) hide show
  1. package/ActionButton-90485300.js +43 -0
  2. package/AssetGallery-9bf4cd82.js +1403 -0
  3. package/AssetPreviewTopBar-a172fc5c.js +105 -0
  4. package/Badge-86593df4.js +146 -0
  5. package/Button-0d728b52.js +156 -0
  6. package/Checkbox-50f1f3c7.js +136 -0
  7. package/CompactTextInput-24126cf9.js +280 -0
  8. package/Popover-d3e2f6c0.js +97 -0
  9. package/README.md +1 -2
  10. package/Radio-0b46b2a8.js +83 -0
  11. package/SectionSeparator-12aff748.js +37 -0
  12. package/Switch-aa384260.js +104 -0
  13. package/TextArea-52cf4c0a.js +173 -0
  14. package/TextInput-a7c32f5f.js +250 -0
  15. package/Tooltip-f95a39f4.js +57 -0
  16. package/data/Badge/index.js +10 -0
  17. package/data/Popover/index.js +13 -5
  18. package/data/index.js +19 -6
  19. package/{defaultTheme-f1063879.js → defaultTheme-870f7df1.js} +15 -3
  20. package/icons/arrow-back.svg +4 -0
  21. package/icons/audio.svg +3 -0
  22. package/icons/check.svg +3 -0
  23. package/icons/close.svg +4 -0
  24. package/icons/edit-note.svg +4 -0
  25. package/icons/headset.svg +1 -0
  26. package/icons/library-add.svg +3 -0
  27. package/icons/link.svg +4 -0
  28. package/icons/search.svg +3 -0
  29. package/inputs/ActionButton/index.js +10 -4
  30. package/inputs/Button/index.js +10 -0
  31. package/inputs/Checkbox/index.js +12 -0
  32. package/inputs/CompactTextInput/index.js +17 -0
  33. package/inputs/Radio/index.js +12 -0
  34. package/inputs/Switch/index.js +12 -0
  35. package/inputs/TextArea/index.js +12 -0
  36. package/inputs/TextInput/index.js +12 -0
  37. package/inputs/index.js +33 -4
  38. package/layout/SectionSeparator/index.js +10 -0
  39. package/layout/index.js +12 -0
  40. package/package.json +13 -8
  41. package/ssr/index.js +14 -0
  42. package/widgets/AssetGallery/index.js +27 -10
  43. package/widgets/AssetPreview/AssetPreviewTopBar/index.js +10 -0
  44. package/widgets/index.js +31 -10
  45. package/ActionButton-dfa33fb3.js +0 -36
  46. package/AssetGallery-92320d63.js +0 -970
  47. package/Popover-01b3e392.js +0 -80
  48. package/Tooltip-830b629b.js +0 -49
@@ -0,0 +1,10 @@
1
+ 'use strict';
2
+
3
+ var Button = require('../../Button-0d728b52.js');
4
+ require('../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+
8
+
9
+
10
+ module.exports = Button.Button;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var Checkbox = require('../../Checkbox-50f1f3c7.js');
4
+ require('../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+ require('nanoid');
8
+ require('lodash');
9
+
10
+
11
+
12
+ module.exports = Checkbox.Checkbox;
@@ -0,0 +1,17 @@
1
+ 'use strict';
2
+
3
+ var CompactTextInput = require('../../CompactTextInput-24126cf9.js');
4
+ require('../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+ require('nanoid');
8
+ require('lodash');
9
+ require('../../Popover-d3e2f6c0.js');
10
+ require('polished');
11
+ require('@tippyjs/react');
12
+ require('../../Tooltip-f95a39f4.js');
13
+ require('../../Badge-86593df4.js');
14
+
15
+
16
+
17
+ module.exports = CompactTextInput.CompactTextInput;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var Radio = require('../../Radio-0b46b2a8.js');
4
+ require('../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+ require('nanoid');
8
+ require('polished');
9
+
10
+
11
+
12
+ module.exports = Radio.Radio;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var Switch = require('../../Switch-aa384260.js');
4
+ require('../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+ require('nanoid');
8
+ require('polished');
9
+
10
+
11
+
12
+ module.exports = Switch.Switch;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var TextArea = require('../../TextArea-52cf4c0a.js');
4
+ require('../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+ require('nanoid');
8
+ require('lodash');
9
+
10
+
11
+
12
+ module.exports = TextArea.TextArea;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var TextInput = require('../../TextInput-a7c32f5f.js');
4
+ require('../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+ require('nanoid');
8
+ require('lodash');
9
+
10
+
11
+
12
+ module.exports = TextInput.TextInput;
package/inputs/index.js CHANGED
@@ -1,4 +1,33 @@
1
- export { A as ActionButton } from '../ActionButton-dfa33fb3.js';
2
- import '../defaultTheme-f1063879.js';
3
- import 'styled-components';
4
- import 'react';
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var ActionButton = require('../ActionButton-90485300.js');
6
+ var Button = require('../Button-0d728b52.js');
7
+ var Checkbox = require('../Checkbox-50f1f3c7.js');
8
+ var CompactTextInput = require('../CompactTextInput-24126cf9.js');
9
+ var Radio = require('../Radio-0b46b2a8.js');
10
+ var TextArea = require('../TextArea-52cf4c0a.js');
11
+ var TextInput = require('../TextInput-a7c32f5f.js');
12
+ var Switch = require('../Switch-aa384260.js');
13
+ require('../defaultTheme-870f7df1.js');
14
+ require('styled-components');
15
+ require('react');
16
+ require('nanoid');
17
+ require('lodash');
18
+ require('../Popover-d3e2f6c0.js');
19
+ require('polished');
20
+ require('@tippyjs/react');
21
+ require('../Tooltip-f95a39f4.js');
22
+ require('../Badge-86593df4.js');
23
+
24
+
25
+
26
+ exports.ActionButton = ActionButton.ActionButton;
27
+ exports.Button = Button.Button;
28
+ exports.Checkbox = Checkbox.Checkbox;
29
+ exports.CompactTextInput = CompactTextInput.CompactTextInput;
30
+ exports.Radio = Radio.Radio;
31
+ exports.TextArea = TextArea.TextArea;
32
+ exports.TextInput = TextInput.TextInput;
33
+ exports.Switch = Switch.Switch;
@@ -0,0 +1,10 @@
1
+ 'use strict';
2
+
3
+ var SectionSeparator = require('../../SectionSeparator-12aff748.js');
4
+ require('../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+
8
+
9
+
10
+ module.exports = SectionSeparator.SectionSeparator;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var SectionSeparator = require('../SectionSeparator-12aff748.js');
6
+ require('../defaultTheme-870f7df1.js');
7
+ require('styled-components');
8
+ require('react');
9
+
10
+
11
+
12
+ exports.SectionSeparator = SectionSeparator.SectionSeparator;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ntbjs/react-components",
3
- "version": "0.0.1-beta.9",
3
+ "version": "1.1.0-beta.1",
4
4
  "description": "NTBs common front-end design utilities and React components.",
5
5
  "scripts": {
6
6
  "build": "cross-env NODE_ENV=production rollup -c",
@@ -35,11 +35,11 @@
35
35
  "@rollup/plugin-babel": "^5.3.0",
36
36
  "@rollup/plugin-commonjs": "^19.0.0",
37
37
  "@rollup/plugin-node-resolve": "^13.0.0",
38
- "@storybook/addon-actions": "^6.2.9",
39
- "@storybook/addon-docs": "^6.2.9",
40
- "@storybook/addon-essentials": "^6.2.9",
41
- "@storybook/addon-links": "^6.2.9",
42
- "@storybook/react": "^6.2.9",
38
+ "@storybook/addon-actions": "^6.5.14",
39
+ "@storybook/addon-docs": "^6.5.14",
40
+ "@storybook/addon-essentials": "^6.5.14",
41
+ "@storybook/addon-links": "^6.5.14",
42
+ "@storybook/react": "^6.5.14",
43
43
  "@svgr/rollup": "^5.5.0",
44
44
  "@svgr/webpack": "^5.5.0",
45
45
  "@testing-library/jest-dom": "^5.12.0",
@@ -67,14 +67,19 @@
67
67
  "rollup-plugin-url": "^3.0.1",
68
68
  "sass": "^1.34.1",
69
69
  "sass-loader": "^10.1.1",
70
- "storybook-dark-mode": "^1.0.8",
70
+ "storybook-dark-mode": "^2.0.4",
71
71
  "url-loader": "^4.1.1"
72
72
  },
73
73
  "dependencies": {
74
74
  "@restart/hooks": "^0.3.26",
75
+ "@storybook/addons": "^6.5.14",
76
+ "@storybook/theming": "^6.5.14",
75
77
  "@tippyjs/react": "^4.2.5",
76
78
  "lodash": "^4.17.21",
79
+ "nanoid": "^3.1.25",
80
+ "polished": "^4.1.3",
77
81
  "react-lazy-load-image-component": "^1.5.1",
78
- "styled-components": "^5.3.0"
82
+ "resize-observer-polyfill": "^1.5.1",
83
+ "styled-components": "^5.3.5"
79
84
  }
80
85
  }
package/ssr/index.js ADDED
@@ -0,0 +1,14 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var styled = require('styled-components');
6
+
7
+
8
+
9
+ Object.defineProperty(exports, 'ServerStyleSheet', {
10
+ enumerable: true,
11
+ get: function () {
12
+ return styled.ServerStyleSheet;
13
+ }
14
+ });
@@ -1,10 +1,27 @@
1
- export { A as default } from '../../AssetGallery-92320d63.js';
2
- import '../../defaultTheme-f1063879.js';
3
- import 'styled-components';
4
- import 'react';
5
- import 'lodash';
6
- import 'react-lazy-load-image-component';
7
- import '../../ActionButton-dfa33fb3.js';
8
- import '../../Popover-01b3e392.js';
9
- import '@tippyjs/react';
10
- import '../../Tooltip-830b629b.js';
1
+ 'use strict';
2
+
3
+ var AssetGallery = require('../../AssetGallery-9bf4cd82.js');
4
+ require('../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+ require('lodash');
8
+ require('../../TextInput-a7c32f5f.js');
9
+ require('nanoid');
10
+ require('resize-observer-polyfill');
11
+ require('react-lazy-load-image-component');
12
+ require('../../ActionButton-90485300.js');
13
+ require('../../Button-0d728b52.js');
14
+ require('../../Checkbox-50f1f3c7.js');
15
+ require('../../CompactTextInput-24126cf9.js');
16
+ require('../../Popover-d3e2f6c0.js');
17
+ require('polished');
18
+ require('@tippyjs/react');
19
+ require('../../Tooltip-f95a39f4.js');
20
+ require('../../Badge-86593df4.js');
21
+ require('../../Radio-0b46b2a8.js');
22
+ require('../../TextArea-52cf4c0a.js');
23
+ require('../../Switch-aa384260.js');
24
+
25
+
26
+
27
+ module.exports = AssetGallery.AssetGallery;
@@ -0,0 +1,10 @@
1
+ 'use strict';
2
+
3
+ var AssetPreviewTopBar = require('../../../AssetPreviewTopBar-a172fc5c.js');
4
+ require('../../../defaultTheme-870f7df1.js');
5
+ require('styled-components');
6
+ require('react');
7
+
8
+
9
+
10
+ module.exports = AssetPreviewTopBar.AssetPreviewTopBar;
package/widgets/index.js CHANGED
@@ -1,10 +1,31 @@
1
- export { A as AssetGallery } from '../AssetGallery-92320d63.js';
2
- import '../defaultTheme-f1063879.js';
3
- import 'styled-components';
4
- import 'react';
5
- import 'lodash';
6
- import 'react-lazy-load-image-component';
7
- import '../ActionButton-dfa33fb3.js';
8
- import '../Popover-01b3e392.js';
9
- import '@tippyjs/react';
10
- import '../Tooltip-830b629b.js';
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var AssetGallery = require('../AssetGallery-9bf4cd82.js');
6
+ var AssetPreviewTopBar = require('../AssetPreviewTopBar-a172fc5c.js');
7
+ require('../defaultTheme-870f7df1.js');
8
+ require('styled-components');
9
+ require('react');
10
+ require('lodash');
11
+ require('../TextInput-a7c32f5f.js');
12
+ require('nanoid');
13
+ require('resize-observer-polyfill');
14
+ require('react-lazy-load-image-component');
15
+ require('../ActionButton-90485300.js');
16
+ require('../Button-0d728b52.js');
17
+ require('../Checkbox-50f1f3c7.js');
18
+ require('../CompactTextInput-24126cf9.js');
19
+ require('../Popover-d3e2f6c0.js');
20
+ require('polished');
21
+ require('@tippyjs/react');
22
+ require('../Tooltip-f95a39f4.js');
23
+ require('../Badge-86593df4.js');
24
+ require('../Radio-0b46b2a8.js');
25
+ require('../TextArea-52cf4c0a.js');
26
+ require('../Switch-aa384260.js');
27
+
28
+
29
+
30
+ exports.AssetGallery = AssetGallery.AssetGallery;
31
+ exports.AssetPreviewTopBar = AssetPreviewTopBar.AssetPreviewTopBar;
@@ -1,36 +0,0 @@
1
- import { a as applyDefaultTheme, _ as _taggedTemplateLiteral, b as _objectWithoutProperties, c as _extends, P as PropTypes } from './defaultTheme-f1063879.js';
2
- import React__default from 'react';
3
- import styled, { css } from 'styled-components';
4
-
5
- var _templateObject, _templateObject2;
6
- 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 ", "\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) {
7
- 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%)"));
8
- }, function (props) {
9
- return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", ":not(:disabled) {\n background-size: 200% 200%;\n\n svg {\n ", ";\n }\n }\n "])), props.active ? '' : ':hover', function (props) {
10
- return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700'));
11
- });
12
- });
13
-
14
- var ActionButton = React__default.forwardRef(function ActionButton(_ref, forwardedRef) {
15
- var icon = _ref.icon,
16
- disabled = _ref.disabled,
17
- active = _ref.active,
18
- onClick = _ref.onClick,
19
- props = _objectWithoutProperties(_ref, ["icon", "disabled", "active", "onClick"]);
20
-
21
- return React__default.createElement(ActionButton$1, _extends({
22
- ref: forwardedRef,
23
- disabled: disabled,
24
- active: active,
25
- onClick: onClick
26
- }, props), icon);
27
- });
28
- ActionButton.propTypes = process.env.NODE_ENV !== "production" ? {
29
- icon: PropTypes.element.isRequired,
30
- disabled: PropTypes.bool,
31
- active: PropTypes.bool,
32
- onClick: PropTypes.func
33
- } : {};
34
- ActionButton.defaultProps = {};
35
-
36
- export { ActionButton as A };