@ntbjs/react-components 1.3.0-rc.41 → 1.3.0-rc.43

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 (60) hide show
  1. package/{ActionButton-581e717e.js → ActionButton-b2345555.js} +4 -6
  2. package/{Alert-b79a8fcc.js → Alert-d69a3f95.js} +8 -13
  3. package/{AssetAction-06d40708.js → AssetAction-304faafa.js} +106 -286
  4. package/{AssetPreviewTopBar-1b5dfde2.js → AssetPreviewTopBar-b1fe3188.js} +9 -23
  5. package/{Badge-a35c7018.js → Badge-e984e6f5.js} +10 -21
  6. package/Button-6c06d4e4.js +255 -0
  7. package/{Checkbox-92d07052.js → Checkbox-ad9c9e54.js} +12 -29
  8. package/{CompactAutocompleteSelect-c7a11d3d.js → CompactAutocompleteSelect-5676b507.js} +49 -108
  9. package/{CompactStarRating-86673c4f.js → CompactStarRating-d4cfae17.js} +30 -50
  10. package/{CompactTextInput-f1824946.js → CompactTextInput-f89988be.js} +43 -72
  11. package/{ContextMenu-999756c8.js → ContextMenu-4eb8fdc5.js} +3 -5
  12. package/{ContextMenuItem-ae4357ba.js → ContextMenuItem-c536b460.js} +8 -16
  13. package/{InputGroup-0423e24c.js → InputGroup-a89a0ea3.js} +3 -5
  14. package/{Instructions-9910f44d.js → Instructions-d1545bd4.js} +8 -19
  15. package/{MultiLevelCheckboxSelect-7a036b16.js → MultiLevelCheckboxSelect-6be69491.js} +34 -86
  16. package/{MultiSelect-9d8c24e5.js → MultiSelect-f87624b5.js} +30 -89
  17. package/{Popover-0d9a689b.js → Popover-c5e425a7.js} +6 -8
  18. package/{Radio-a0610a91.js → Radio-55db4781.js} +6 -11
  19. package/{SectionSeparator-5025c8f4.js → SectionSeparator-af8dc1ce.js} +3 -5
  20. package/{Switch-b7193858.js → Switch-04ecd8d0.js} +10 -27
  21. package/{Tab-7c817d4d.js → Tab-e43241f0.js} +3 -5
  22. package/{Tabs-318feff9.js → Tabs-cfc08c6b.js} +14 -28
  23. package/{TextArea-ecfd3418.js → TextArea-6e15b44f.js} +55 -87
  24. package/{TextInput-91d6341d.js → TextInput-9a995449.js} +26 -49
  25. package/{Tooltip-478ec993.js → Tooltip-a68a7e49.js} +4 -6
  26. package/{VerificationStatusIcon-ecec5f07.js → VerificationStatusIcon-7b0e23fe.js} +6 -14
  27. package/data/Alert/index.js +2 -2
  28. package/data/Badge/index.js +2 -2
  29. package/data/Popover/index.js +3 -3
  30. package/data/Tab/index.js +2 -2
  31. package/data/Tabs/index.js +3 -3
  32. package/data/Tooltip/index.js +3 -3
  33. package/data/index.js +9 -9
  34. package/{defaultTheme-573a9150.js → defaultTheme-cd01e6c2.js} +11 -1
  35. package/inputs/ActionButton/index.js +2 -2
  36. package/inputs/Button/index.js +5 -5
  37. package/inputs/Checkbox/index.js +2 -2
  38. package/inputs/CompactAutocompleteSelect/index.js +11 -11
  39. package/inputs/CompactStarRating/index.js +10 -10
  40. package/inputs/CompactTextInput/index.js +10 -10
  41. package/inputs/MultiSelect/index.js +3 -3
  42. package/inputs/Radio/index.js +2 -2
  43. package/inputs/Switch/index.js +2 -2
  44. package/inputs/TextArea/index.js +10 -10
  45. package/inputs/TextInput/index.js +2 -2
  46. package/inputs/index.js +25 -25
  47. package/layout/InputGroup/index.js +2 -2
  48. package/layout/SectionSeparator/index.js +2 -2
  49. package/layout/index.js +3 -3
  50. package/package.json +5 -5
  51. package/{react-select-creatable.esm-8bf8566a.js → react-select-creatable.esm-806f4386.js} +3 -208
  52. package/{shift-away-subtle-a9da38b8.js → shift-away-subtle-631cd794.js} +1 -1
  53. package/widgets/AssetGallery/index.js +29 -29
  54. package/widgets/AssetPreview/AssetPreviewTopBar/index.js +2 -2
  55. package/widgets/ContextMenu/ContextMenuItem/index.js +2 -2
  56. package/widgets/ContextMenu/ContextMenuItemsGroup/index.js +3 -5
  57. package/widgets/ContextMenu/index.js +2 -2
  58. package/widgets/Instructions/index.js +13 -13
  59. package/widgets/index.js +29 -29
  60. package/Button-70230131.js +0 -284
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-573a9150.js');
3
+ var defaultTheme = require('./defaultTheme-cd01e6c2.js');
4
4
  var React = require('react');
5
5
  var styled = require('styled-components');
6
6
  var polished = require('polished');
@@ -10,10 +10,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
10
10
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
11
11
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
12
12
 
13
- var ActionButton$1 = styled__default["default"].button.attrs(defaultTheme.applyDefaultTheme).withConfig({
14
- displayName: "ActionButtonstyled__ActionButton",
15
- componentId: "sc-14sb7cm-0"
16
- })(["display:inline-flex;justify-content:center;align-items:center;border-radius:50%;width:", ";height:", ";border:0;color:inherit;background-color:transparent;", " background-position:center;background-repeat:no-repeat;background-size:0 0;transition:background-size 250ms ease;cursor:pointer;", " ", " &:disabled{opacity:0.5;color:inherit;cursor:not-allowed;}svg{width:100%;max-width:", ";max-height:", ";pointer-events:none;transition:color 250ms;}"], function (props) {
13
+ var _templateObject, _templateObject2;
14
+ var ActionButton$1 = styled__default["default"].button.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n display: inline-flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n width: ", ";\n height: ", ";\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 ", "\n\n &:disabled {\n opacity: 0.5;\n color: inherit;\n cursor: not-allowed;\n }\n\n svg {\n width: 100%;\n max-width: ", ";\n max-height: ", ";\n\n pointer-events: none;\n transition: color 250ms;\n }\n"])), function (props) {
17
15
  return "".concat(props.actionWidthHeight[0], "px");
18
16
  }, function (props) {
19
17
  return "".concat(props.actionWidthHeight[1], "px");
@@ -23,7 +21,7 @@ var ActionButton$1 = styled__default["default"].button.attrs(defaultTheme.applyD
23
21
  var lightThemeBgColor = (_props$backgroundColo3 = props === null || props === void 0 ? void 0 : (_props$backgroundColo4 = props.backgroundColors) === null || _props$backgroundColo4 === void 0 ? void 0 : _props$backgroundColo4[1]) !== null && _props$backgroundColo3 !== void 0 ? _props$backgroundColo3 : props.theme.getColor('gray-200');
24
22
  return props.theme.themeProp('background-image', "radial-gradient(circle at center, ".concat(darkThemeBgColor, " 50%, transparent 50%)"), "radial-gradient(circle at center, ".concat(lightThemeBgColor, " 50%, transparent 50%)"));
25
23
  }, function (props) {
26
- return styled.css(["", ":not(:disabled){background-size:200% 200%;svg{", ";}}"], props.active ? '' : ':hover', function (props) {
24
+ return styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n ", ":not(:disabled) {\n background-size: 200% 200%;\n\n svg {\n ", ";\n }\n }\n "])), props.active ? '' : ':hover', function (props) {
27
25
  return props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-700'));
28
26
  });
29
27
  }, function (props) {
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var defaultTheme = require('./defaultTheme-573a9150.js');
3
+ var defaultTheme = require('./defaultTheme-cd01e6c2.js');
4
4
  var React = require('react');
5
5
  var styled = require('styled-components');
6
6
  var lodash = require('lodash');
@@ -10,10 +10,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
10
10
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
11
11
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
12
12
 
13
- var Alert$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme).withConfig({
14
- displayName: "Alertstyled__Alert",
15
- componentId: "sc-1pjcgpa-0"
16
- })(["display:flex;flex-direction:column;padding:", ";width:", ";box-sizing:border-box;", " ", " ", " text-align:", ";"], function (props) {
13
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
14
+ var Alert$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n padding: ", ";\n width: ", ";\n box-sizing: border-box;\n\n ", "\n\n ", "\n \n ", "\n \n text-align: ", ";\n"])), function (props) {
17
15
  var _props$verticalPaddin, _props$horizontalPadd;
18
16
  var verticalPadding = (_props$verticalPaddin = props.verticalPadding) !== null && _props$verticalPaddin !== void 0 ? _props$verticalPaddin : 17;
19
17
  var horizontalPadding = (_props$horizontalPadd = props.horizontalPadding) !== null && _props$horizontalPadd !== void 0 ? _props$horizontalPadd : 30;
@@ -21,25 +19,22 @@ var Alert$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultThem
21
19
  }, function (props) {
22
20
  return props.width ? "".concat(props.width, "px") : '100%';
23
21
  }, function (props) {
24
- return props.warning && styled.css(["", ""], props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400')));
22
+ return props.warning && styled.css(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('background', '#634E01', props.theme.getColor('signal-yellow-400')));
25
23
  }, function (props) {
26
- return props.error && styled.css(["", ""], props.theme.themeProp('background', '#7F1B1B', props.theme.getColor('red-200')));
24
+ return props.error && styled.css(_templateObject3 || (_templateObject3 = defaultTheme._taggedTemplateLiteral(["\n ", "\n "])), props.theme.themeProp('background', '#7F1B1B', props.theme.getColor('red-200')));
27
25
  }, function (props) {
28
- return props.info && styled.css(["background:transparent;"]);
26
+ return props.info && styled.css(_templateObject4 || (_templateObject4 = defaultTheme._taggedTemplateLiteral(["\n background: transparent;\n "])));
29
27
  }, function (props) {
30
28
  return props.align === 'center' ? 'center' : 'left';
31
29
  });
32
- var AlertRender = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme).withConfig({
33
- displayName: "Alertstyled__AlertRender",
34
- componentId: "sc-1pjcgpa-1"
35
- })(["display:flex;align-items:center;word-break:break-word;", " ", " ", ";svg{width:12px;height:12px;}span{flex:1;padding-left:5px;", ";}"], function (props) {
30
+ var AlertRender = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject5 || (_templateObject5 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n word-break: break-word;\n ", "\n ", "\n ", ";\n\n svg {\n width: 12px;\n height: 12px;\n }\n\n span {\n flex: 1;\n padding-left: 5px;\n ", ";\n }\n"])), function (props) {
36
31
  return props.lineHeight ? "line-height: ".concat(props.lineHeight, "px;") : null;
37
32
  }, function (props) {
38
33
  return props.fontSize ? "font-size: ".concat(props.fontSize, "px;") : null;
39
34
  }, function (props) {
40
35
  return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
41
36
  }, function (props) {
42
- return props.lineClamp ? styled.css(["display:-webkit-box;-webkit-line-clamp:", ";-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;"], props.lineClamp) : null;
37
+ return props.lineClamp ? styled.css(_templateObject6 || (_templateObject6 = defaultTheme._taggedTemplateLiteral(["\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n "])), props.lineClamp) : null;
43
38
  });
44
39
 
45
40
  var _excluded = ["warning", "error", "type", "alertMessage", "align", "icon", "fontSize", "lineHeight", "lineClamp", "verticalPadding", "horizontalPadding", "width"];