@spaced-out/ui-design-system 0.0.1-alpha.0 → 0.0.1-alpha.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.
- package/CHANGELOG.md +7 -0
- package/babel.config.js +1 -6
- package/lib/components/Button/Button.js +31 -40
- package/lib/components/ButtonDropdown/ButtonDropdown.js +39 -46
- package/lib/components/Checkbox/Checkbox.js +36 -41
- package/lib/components/Checkbox/CheckboxGroup.js +12 -16
- package/lib/components/CircularLoader/CircularLoader.js +16 -19
- package/lib/components/CodeBlock.js +4 -8
- package/lib/components/Dialog/Dialog.js +38 -51
- package/lib/components/Dropdown/Dropdown.js +46 -51
- package/lib/components/Grid/Grid.js +6 -9
- package/lib/components/Icon/ClickableIcon.js +6 -10
- package/lib/components/Icon/Icon.js +6 -10
- package/lib/components/InContextAlert/InContextAlert.js +29 -35
- package/lib/components/Input/Input.js +65 -78
- package/lib/components/LinearLoader/LinearLoader.js +8 -10
- package/lib/components/Menu/Menu.js +37 -40
- package/lib/components/Modal/Modal.js +18 -22
- package/lib/components/Notification/Notification.js +26 -32
- package/lib/components/Panel/Panel.js +23 -36
- package/lib/components/RadioButton/RadioButton.js +23 -27
- package/lib/components/RadioButton/RadioGroup.js +12 -16
- package/lib/components/SearchInput/SearchInput.js +3 -5
- package/lib/components/Text/Text.js +45 -61
- package/lib/components/Textarea/Textarea.js +34 -45
- package/lib/components/Toast/Toast.js +26 -38
- package/lib/components/Toast/ToastContainer.js +4 -5
- package/lib/components/Toggle/Toggle.js +21 -26
- package/lib/components/Tooltip/Tooltip.js +21 -30
- package/lib/components/Truncate/Truncate.js +3 -5
- package/lib/components/Typeahead/Typeahead.js +50 -55
- package/lib/utils/makeClassNameComponent.js +5 -8
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
|
|
4
4
|
|
|
5
|
+
### [0.0.1-alpha.1](https://github.com/Spaced-Out/ui-design-system/compare/v0.0.1-alpha.0...v0.0.1-alpha.1) (2022-11-16)
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
* revert babel change ([7ef81e9](https://github.com/Spaced-Out/ui-design-system/commit/7ef81e92a65a296f7eedebed0f3234038d63118c))
|
|
11
|
+
|
|
5
12
|
### [0.0.1-alpha.0](https://github.com/Spaced-Out/ui-design-system/compare/v0.0.0...v0.0.1-alpha.0) (2022-11-16)
|
|
6
13
|
|
|
7
14
|
|
package/babel.config.js
CHANGED
|
@@ -8,11 +8,10 @@ var React = _interopRequireWildcard(require("react"));
|
|
|
8
8
|
var _classify = require("../../utils/classify");
|
|
9
9
|
var _Icon = require("../Icon");
|
|
10
10
|
var _ButtonModule = _interopRequireDefault(require("./Button.module.css"));
|
|
11
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
12
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
14
13
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
15
|
-
|
|
14
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
16
15
|
const BUTTON_TYPES = Object.freeze({
|
|
17
16
|
primary: 'primary',
|
|
18
17
|
secondary: 'secondary',
|
|
@@ -35,8 +34,7 @@ const UnstyledButton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
|
|
35
34
|
className,
|
|
36
35
|
...props
|
|
37
36
|
} = _ref;
|
|
38
|
-
return /*#__PURE__*/
|
|
39
|
-
...props,
|
|
37
|
+
return /*#__PURE__*/React.createElement("button", _extends({}, props, {
|
|
40
38
|
className: className,
|
|
41
39
|
ref: ref,
|
|
42
40
|
role: "button",
|
|
@@ -48,7 +46,7 @@ const UnstyledButton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
|
|
|
48
46
|
onClick(event);
|
|
49
47
|
}
|
|
50
48
|
}
|
|
51
|
-
});
|
|
49
|
+
}));
|
|
52
50
|
});
|
|
53
51
|
exports.UnstyledButton = UnstyledButton;
|
|
54
52
|
const Button = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
|
|
@@ -65,8 +63,7 @@ const Button = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
|
|
|
65
63
|
size = 'medium',
|
|
66
64
|
...props
|
|
67
65
|
} = _ref2;
|
|
68
|
-
return /*#__PURE__*/(
|
|
69
|
-
...props,
|
|
66
|
+
return /*#__PURE__*/React.createElement(UnstyledButton, _extends({}, props, {
|
|
70
67
|
className: (0, _classify.classify)(_ButtonModule.default.button, {
|
|
71
68
|
[_ButtonModule.default.primary]: type === 'primary',
|
|
72
69
|
[_ButtonModule.default.secondary]: type === 'secondary',
|
|
@@ -82,39 +79,33 @@ const Button = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
|
|
|
82
79
|
[_ButtonModule.default.withBothIcon]: !!(iconLeftName && iconRightName),
|
|
83
80
|
[_ButtonModule.default.onlyIcon]: (iconLeftName || iconRightName) && !children
|
|
84
81
|
}, classNames?.wrapper),
|
|
85
|
-
ref: ref
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
size: size === 'medium' ? 'medium' : 'small',
|
|
113
|
-
type: iconRightType
|
|
114
|
-
})]
|
|
115
|
-
})
|
|
116
|
-
})
|
|
117
|
-
});
|
|
82
|
+
ref: ref
|
|
83
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
84
|
+
className: _ButtonModule.default.buttonRow
|
|
85
|
+
}, !(iconLeftName || iconRightName) ? /*#__PURE__*/React.createElement("div", {
|
|
86
|
+
className: _ButtonModule.default.textContainerCenter
|
|
87
|
+
}, children) :
|
|
88
|
+
// has icon, but no child
|
|
89
|
+
children == null ? /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
90
|
+
name: iconLeftName || iconRightName,
|
|
91
|
+
color: disabled ? 'disabled' : ButtonTypeToIconColorMap[type],
|
|
92
|
+
size: size === 'medium' ? 'medium' : 'small',
|
|
93
|
+
type: iconLeftType || iconRightType
|
|
94
|
+
}) :
|
|
95
|
+
// has icon _and_ child
|
|
96
|
+
(iconLeftName || iconRightName) && /*#__PURE__*/React.createElement(React.Fragment, null, iconLeftName && /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
97
|
+
name: iconLeftName,
|
|
98
|
+
color: disabled ? 'disabled' : ButtonTypeToIconColorMap[type],
|
|
99
|
+
size: size === 'medium' ? 'medium' : 'small',
|
|
100
|
+
type: iconLeftType
|
|
101
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
102
|
+
className: _ButtonModule.default.textContainerLeft
|
|
103
|
+
}, children), iconRightName && /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
104
|
+
name: iconRightName,
|
|
105
|
+
color: disabled ? 'disabled' : ButtonTypeToIconColorMap[type],
|
|
106
|
+
size: size === 'medium' ? 'medium' : 'small',
|
|
107
|
+
type: iconRightType
|
|
108
|
+
}))));
|
|
118
109
|
});
|
|
119
110
|
exports.Button = Button;
|
|
120
111
|
Button.name = Button.displayName = 'Button';
|
|
@@ -13,11 +13,10 @@ var _clickAway = require("../../utils/click-away");
|
|
|
13
13
|
var _Button = require("../Button");
|
|
14
14
|
var _Menu = require("../Menu");
|
|
15
15
|
var _ButtonDropdownModule = _interopRequireDefault(require("./ButtonDropdown.module.css"));
|
|
16
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
17
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
18
17
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
19
18
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
20
|
-
|
|
19
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
21
20
|
const ButtonDropdown = _ref => {
|
|
22
21
|
let {
|
|
23
22
|
anchorPosition = 'bottom-start',
|
|
@@ -40,50 +39,44 @@ const ButtonDropdown = _ref => {
|
|
|
40
39
|
whileElementsMounted: _reactDom.autoUpdate,
|
|
41
40
|
middleware: [(0, _reactDom.shift)(), (0, _reactDom.flip)(), (0, _reactDom.offset)(parseInt(_space.spaceXXSmall))]
|
|
42
41
|
});
|
|
43
|
-
return /*#__PURE__*/
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
},
|
|
82
|
-
size: size
|
|
83
|
-
})
|
|
84
|
-
})]
|
|
85
|
-
});
|
|
86
|
-
}
|
|
42
|
+
return /*#__PURE__*/React.createElement(_clickAway.ClickAway, null, _ref2 => {
|
|
43
|
+
let {
|
|
44
|
+
isOpen,
|
|
45
|
+
onOpen,
|
|
46
|
+
cancelNext,
|
|
47
|
+
clickAway
|
|
48
|
+
} = _ref2;
|
|
49
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
50
|
+
"data-testid": "ButtonDropdown",
|
|
51
|
+
className: (0, _classify.classify)(_ButtonDropdownModule.default.buttonDropdownContainer, classNames?.wrapper),
|
|
52
|
+
ref: menuBtnRef
|
|
53
|
+
}, /*#__PURE__*/React.createElement(_Button.Button, _extends({}, props?.button, {
|
|
54
|
+
iconRightName: props?.button.children ? isOpen ? 'caret-up' : 'caret-down' : props?.button.iconRightName,
|
|
55
|
+
iconRightType: props?.button.children ? 'solid' : props?.button.iconRightType,
|
|
56
|
+
disabled: disabled,
|
|
57
|
+
size: size,
|
|
58
|
+
ref: reference,
|
|
59
|
+
onClick: e => {
|
|
60
|
+
e.stopPropagation();
|
|
61
|
+
onOpen();
|
|
62
|
+
}
|
|
63
|
+
})), isOpen && props?.menu && /*#__PURE__*/React.createElement("div", {
|
|
64
|
+
onClickCapture: cancelNext,
|
|
65
|
+
ref: floating,
|
|
66
|
+
style: {
|
|
67
|
+
display: 'flex',
|
|
68
|
+
position: strategy,
|
|
69
|
+
top: y ?? _space.spaceNone,
|
|
70
|
+
left: x ?? _space.spaceNone,
|
|
71
|
+
width: _size.sizeFluid
|
|
72
|
+
}
|
|
73
|
+
}, /*#__PURE__*/React.createElement(_Menu.Menu, _extends({}, props.menu, {
|
|
74
|
+
onSelect: option => {
|
|
75
|
+
onOptionSelect && onOptionSelect(option);
|
|
76
|
+
clickAway();
|
|
77
|
+
},
|
|
78
|
+
size: size
|
|
79
|
+
}))));
|
|
87
80
|
});
|
|
88
81
|
};
|
|
89
82
|
exports.ButtonDropdown = ButtonDropdown;
|
|
@@ -9,7 +9,6 @@ var _classify = _interopRequireDefault(require("../../utils/classify"));
|
|
|
9
9
|
var _Icon = require("../Icon");
|
|
10
10
|
var _Text = require("../Text/Text");
|
|
11
11
|
var _CheckboxModule = _interopRequireDefault(require("./Checkbox.module.css"));
|
|
12
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
13
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
14
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -50,50 +49,46 @@ const Checkbox = _ref => {
|
|
|
50
49
|
checkboxInput.current.indeterminate = false;
|
|
51
50
|
}
|
|
52
51
|
}, [indeterminate]);
|
|
53
|
-
return /*#__PURE__*/
|
|
52
|
+
return /*#__PURE__*/React.createElement("label", {
|
|
54
53
|
"data-testid": "checkbox",
|
|
55
54
|
className: (0, _classify.default)(_CheckboxModule.default.checkboxContainer, {
|
|
56
55
|
[_CheckboxModule.default.disabled]: disabled,
|
|
57
56
|
[_CheckboxModule.default.horizontalCheckbox]: align === 'horizontal-fixed',
|
|
58
57
|
[_CheckboxModule.default.fluidCheckbox]: align === 'horizontal-fluid'
|
|
59
|
-
}, classNames?.wrapper)
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
className: (0, _classify.default)(_CheckboxModule.default.checkboxLabel, classNames?.label),
|
|
95
|
-
children: children
|
|
96
|
-
})]
|
|
97
|
-
});
|
|
58
|
+
}, classNames?.wrapper)
|
|
59
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
60
|
+
className: (0, _classify.default)(_CheckboxModule.default.checkboxSquare, {
|
|
61
|
+
[_CheckboxModule.default.disabled]: disabled
|
|
62
|
+
})
|
|
63
|
+
}, /*#__PURE__*/React.createElement("input", {
|
|
64
|
+
type: "checkbox",
|
|
65
|
+
value: value,
|
|
66
|
+
checked: checked,
|
|
67
|
+
ref: checkboxInput,
|
|
68
|
+
onChange: handleOnChange,
|
|
69
|
+
tabIndex: disabled ? '-1' : 0,
|
|
70
|
+
className: (0, _classify.default)(_CheckboxModule.default.inputCheckbox),
|
|
71
|
+
disabled: disabled,
|
|
72
|
+
name: name
|
|
73
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
74
|
+
className: (0, _classify.default)(_CheckboxModule.default.checkboxSquareInner, {
|
|
75
|
+
[_CheckboxModule.default.enabled]: !disabled && !error,
|
|
76
|
+
[_CheckboxModule.default.disabled]: disabled,
|
|
77
|
+
[_CheckboxModule.default.error]: error && !disabled
|
|
78
|
+
})
|
|
79
|
+
}, indeterminate && /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
80
|
+
color: disabled ? 'disabled' : 'inversePrimary',
|
|
81
|
+
name: "hyphen",
|
|
82
|
+
size: "small",
|
|
83
|
+
type: "regular"
|
|
84
|
+
}), checked && !indeterminate && /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
85
|
+
color: disabled ? 'disabled' : 'inversePrimary',
|
|
86
|
+
name: "check",
|
|
87
|
+
size: "small",
|
|
88
|
+
type: "regular"
|
|
89
|
+
}))), React.Children.count(children) > 0 && /*#__PURE__*/React.createElement(_Text.FormLabelMedium, {
|
|
90
|
+
color: "secondary",
|
|
91
|
+
className: (0, _classify.default)(_CheckboxModule.default.checkboxLabel, classNames?.label)
|
|
92
|
+
}, children));
|
|
98
93
|
};
|
|
99
94
|
exports.Checkbox = Checkbox;
|
|
@@ -8,7 +8,6 @@ var React = _interopRequireWildcard(require("react"));
|
|
|
8
8
|
var _classify = _interopRequireDefault(require("../../utils/classify"));
|
|
9
9
|
var _Text = require("../Text/Text.js");
|
|
10
10
|
var _CheckboxGroupModule = _interopRequireDefault(require("./CheckboxGroup.module.css"));
|
|
11
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
12
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
14
13
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -66,20 +65,17 @@ const CheckboxGroup = _ref => {
|
|
|
66
65
|
}
|
|
67
66
|
return child;
|
|
68
67
|
});
|
|
69
|
-
return /*#__PURE__*/
|
|
70
|
-
className: (0, _classify.default)(_CheckboxGroupModule.default.checkboxGroupContainer, classNames?.wrapper)
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
children: errorText
|
|
82
|
-
})]
|
|
83
|
-
});
|
|
68
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
69
|
+
className: (0, _classify.default)(_CheckboxGroupModule.default.checkboxGroupContainer, classNames?.wrapper)
|
|
70
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
71
|
+
className: (0, _classify.default)({
|
|
72
|
+
[_CheckboxGroupModule.default.vertical]: align === 'vertical',
|
|
73
|
+
[_CheckboxGroupModule.default.horizontal]: align === 'horizontal-fixed',
|
|
74
|
+
[_CheckboxGroupModule.default.horizontalFluid]: align === 'horizontal-fluid'
|
|
75
|
+
}, classNames?.checkboxGroup)
|
|
76
|
+
}, childrenWithProps), error && /*#__PURE__*/React.createElement(_Text.BodySmall, {
|
|
77
|
+
className: (0, _classify.default)(classNames?.errorText),
|
|
78
|
+
color: "danger"
|
|
79
|
+
}, errorText));
|
|
84
80
|
};
|
|
85
81
|
exports.CheckboxGroup = CheckboxGroup;
|
|
@@ -8,7 +8,6 @@ var React = _interopRequireWildcard(require("react"));
|
|
|
8
8
|
var COLORS = _interopRequireWildcard(require("../../styles/variables/_color.js"));
|
|
9
9
|
var _classify = _interopRequireDefault(require("../../utils/classify"));
|
|
10
10
|
var _CircularLoaderModule = _interopRequireDefault(require("./CircularLoader.module.css"));
|
|
11
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
12
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
14
13
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
@@ -19,26 +18,24 @@ const CircularLoader = _ref => {
|
|
|
19
18
|
className,
|
|
20
19
|
colorToken = 'colorFillPrimary'
|
|
21
20
|
} = _ref;
|
|
22
|
-
return /*#__PURE__*/
|
|
21
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
23
22
|
className: (0, _classify.default)(_CircularLoaderModule.default.container, {
|
|
24
23
|
[_CircularLoaderModule.default.mediumContainer]: size === 'medium',
|
|
25
24
|
[_CircularLoaderModule.default.smallContainer]: size === 'small'
|
|
26
|
-
}, className)
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
})
|
|
42
|
-
});
|
|
25
|
+
}, className)
|
|
26
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
27
|
+
className: _CircularLoaderModule.default.spinLoader,
|
|
28
|
+
"aria-hidden": "true"
|
|
29
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
30
|
+
className: _CircularLoaderModule.default.outerCircle,
|
|
31
|
+
style: {
|
|
32
|
+
'--color': COLORS[colorToken]
|
|
33
|
+
}
|
|
34
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
35
|
+
className: _CircularLoaderModule.default.ellipse,
|
|
36
|
+
style: {
|
|
37
|
+
'--color': COLORS[colorToken]
|
|
38
|
+
}
|
|
39
|
+
})));
|
|
43
40
|
};
|
|
44
41
|
exports.CircularLoader = CircularLoader;
|
|
@@ -6,21 +6,17 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.CodeBlock = void 0;
|
|
7
7
|
var React = _interopRequireWildcard(require("react"));
|
|
8
8
|
var _reactCodeBlocks = require("react-code-blocks");
|
|
9
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
10
9
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
11
10
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
12
|
-
|
|
13
|
-
// $FlowFixMe[untyped-import]
|
|
14
|
-
|
|
11
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
15
12
|
const CodeBlock = _ref => {
|
|
16
13
|
let {
|
|
17
14
|
children,
|
|
18
15
|
...props
|
|
19
16
|
} = _ref;
|
|
20
|
-
return /*#__PURE__*/
|
|
17
|
+
return /*#__PURE__*/React.createElement(_reactCodeBlocks.CodeBlock, _extends({
|
|
21
18
|
text: children,
|
|
22
|
-
showLineNumbers: false
|
|
23
|
-
|
|
24
|
-
});
|
|
19
|
+
showLineNumbers: false
|
|
20
|
+
}, props));
|
|
25
21
|
};
|
|
26
22
|
exports.CodeBlock = CodeBlock;
|
|
@@ -10,11 +10,10 @@ var _classify = _interopRequireDefault(require("../../utils/classify"));
|
|
|
10
10
|
var _Icon = require("../Icon");
|
|
11
11
|
var _Modal = require("../Modal");
|
|
12
12
|
var _DialogModule = _interopRequireDefault(require("./Dialog.module.css"));
|
|
13
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
14
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
16
15
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
17
|
-
|
|
16
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
18
17
|
const DIALOG_SEMANTIC = Object.freeze({
|
|
19
18
|
neutral: 'neutral',
|
|
20
19
|
success: 'success',
|
|
@@ -30,37 +29,37 @@ const DialogIcon = _ref => {
|
|
|
30
29
|
} = _ref;
|
|
31
30
|
switch (semantic) {
|
|
32
31
|
case DIALOG_SEMANTIC.neutral:
|
|
33
|
-
return /*#__PURE__*/
|
|
32
|
+
return /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
34
33
|
color: _typography.TEXT_COLORS.neutral,
|
|
35
34
|
name: iconName ? iconName : 'face-smile',
|
|
36
35
|
type: "solid"
|
|
37
36
|
});
|
|
38
37
|
case DIALOG_SEMANTIC.success:
|
|
39
|
-
return /*#__PURE__*/
|
|
38
|
+
return /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
40
39
|
name: "circle-check",
|
|
41
40
|
color: _typography.TEXT_COLORS.success,
|
|
42
41
|
type: "solid"
|
|
43
42
|
});
|
|
44
43
|
case DIALOG_SEMANTIC.information:
|
|
45
|
-
return /*#__PURE__*/
|
|
44
|
+
return /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
46
45
|
name: "circle-info",
|
|
47
46
|
color: _typography.TEXT_COLORS.information,
|
|
48
47
|
type: "solid"
|
|
49
48
|
});
|
|
50
49
|
case DIALOG_SEMANTIC.warning:
|
|
51
|
-
return /*#__PURE__*/
|
|
50
|
+
return /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
52
51
|
name: "circle-exclamation",
|
|
53
52
|
color: _typography.TEXT_COLORS.warning,
|
|
54
53
|
type: "solid"
|
|
55
54
|
});
|
|
56
55
|
case DIALOG_SEMANTIC.danger:
|
|
57
|
-
return /*#__PURE__*/
|
|
56
|
+
return /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
58
57
|
name: "shield-exclamation",
|
|
59
58
|
color: _typography.TEXT_COLORS.danger,
|
|
60
59
|
type: "solid"
|
|
61
60
|
});
|
|
62
61
|
default:
|
|
63
|
-
return /*#__PURE__*/
|
|
62
|
+
return /*#__PURE__*/React.createElement(_Icon.Icon, {
|
|
64
63
|
color: _typography.TEXT_COLORS.neutral,
|
|
65
64
|
name: "face-smile",
|
|
66
65
|
type: "solid"
|
|
@@ -71,40 +70,31 @@ const DialogHeader = _ref2 => {
|
|
|
71
70
|
let {
|
|
72
71
|
children
|
|
73
72
|
} = _ref2;
|
|
74
|
-
return /*#__PURE__*/(
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
children: children
|
|
80
|
-
})
|
|
81
|
-
})
|
|
82
|
-
});
|
|
73
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, React.Children.count(children) > 0 && /*#__PURE__*/React.createElement("div", {
|
|
74
|
+
className: _DialogModule.default.dialogHeader
|
|
75
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
76
|
+
className: _DialogModule.default.headerContent
|
|
77
|
+
}, children)));
|
|
83
78
|
};
|
|
84
79
|
exports.DialogHeader = DialogHeader;
|
|
85
80
|
const DialogBody = _ref3 => {
|
|
86
81
|
let {
|
|
87
82
|
children
|
|
88
83
|
} = _ref3;
|
|
89
|
-
return /*#__PURE__*/
|
|
90
|
-
className: _DialogModule.default.dialogBody
|
|
91
|
-
|
|
92
|
-
});
|
|
84
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
85
|
+
className: _DialogModule.default.dialogBody
|
|
86
|
+
}, children);
|
|
93
87
|
};
|
|
94
88
|
exports.DialogBody = DialogBody;
|
|
95
89
|
const DialogFooter = _ref4 => {
|
|
96
90
|
let {
|
|
97
91
|
children
|
|
98
92
|
} = _ref4;
|
|
99
|
-
return /*#__PURE__*/(
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
children: children
|
|
105
|
-
})
|
|
106
|
-
})
|
|
107
|
-
});
|
|
93
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, React.Children.count(children) > 0 && /*#__PURE__*/React.createElement("div", {
|
|
94
|
+
className: _DialogModule.default.dialogFooter
|
|
95
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
96
|
+
className: _DialogModule.default.dialogFooterActions
|
|
97
|
+
}, children)));
|
|
108
98
|
};
|
|
109
99
|
exports.DialogFooter = DialogFooter;
|
|
110
100
|
const Dialog = _ref5 => {
|
|
@@ -118,31 +108,28 @@ const Dialog = _ref5 => {
|
|
|
118
108
|
semantic = 'neutral',
|
|
119
109
|
...restDialogProps
|
|
120
110
|
} = _ref5;
|
|
121
|
-
return /*#__PURE__*/
|
|
111
|
+
return /*#__PURE__*/React.createElement(_Modal.Modal, _extends({
|
|
122
112
|
isOpen: isOpen,
|
|
123
113
|
onClose: onClose,
|
|
124
114
|
showBackdrop: showBackdrop,
|
|
125
|
-
tapOutsideToClose: tapOutsideToClose
|
|
126
|
-
|
|
115
|
+
tapOutsideToClose: tapOutsideToClose
|
|
116
|
+
}, restDialogProps, {
|
|
127
117
|
classNames: {
|
|
128
118
|
content: (0, _classify.default)(_DialogModule.default.dialog)
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
})
|
|
145
|
-
}), children]
|
|
146
|
-
});
|
|
119
|
+
}
|
|
120
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
121
|
+
className: _DialogModule.default.topBlock
|
|
122
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
123
|
+
className: (0, _classify.default)(_DialogModule.default.iconContainer, {
|
|
124
|
+
[_DialogModule.default.neutral]: semantic === DIALOG_SEMANTIC.neutral,
|
|
125
|
+
[_DialogModule.default.success]: semantic === DIALOG_SEMANTIC.success,
|
|
126
|
+
[_DialogModule.default.information]: semantic === DIALOG_SEMANTIC.information,
|
|
127
|
+
[_DialogModule.default.warning]: semantic === DIALOG_SEMANTIC.warning,
|
|
128
|
+
[_DialogModule.default.danger]: semantic === DIALOG_SEMANTIC.danger
|
|
129
|
+
})
|
|
130
|
+
}, /*#__PURE__*/React.createElement(DialogIcon, {
|
|
131
|
+
semantic: semantic,
|
|
132
|
+
iconName: iconName
|
|
133
|
+
}))), children);
|
|
147
134
|
};
|
|
148
135
|
exports.Dialog = Dialog;
|