@splunk/react-ui 4.20.0 → 4.21.0
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/Accordion.js +114 -230
- package/Anchor.js +74 -150
- package/Animation.js +52 -124
- package/AnimationToggle.js +86 -146
- package/Box.js +77 -153
- package/Breadcrumbs.js +105 -197
- package/Button.js +168 -316
- package/ButtonGroup.js +84 -168
- package/ButtonSimple.js +224 -324
- package/CHANGELOG.md +21 -0
- package/Calendar.js +264 -462
- package/Card.js +223 -371
- package/CardLayout.js +87 -163
- package/Chip.js +199 -323
- package/Clickable.js +128 -246
- package/CloseButton.js +92 -200
- package/Code.js +162 -250
- package/CollapsiblePanel.js +214 -370
- package/Color.js +267 -495
- package/ColumnLayout.js +152 -254
- package/ComboBox.js +197 -371
- package/Concertina.js +214 -374
- package/ControlGroup.js +164 -288
- package/Date.js +154 -304
- package/DefinitionList.js +104 -180
- package/Divider.js +80 -156
- package/Dropdown.js +121 -263
- package/DualListbox.js +408 -601
- package/EventListener.js +70 -138
- package/File.js +343 -547
- package/FormRows.js +232 -414
- package/Heading.js +94 -164
- package/Image.js +167 -323
- package/JSONTree.js +166 -314
- package/Layer.js +221 -388
- package/Link.js +133 -239
- package/List.js +85 -161
- package/Markdown.js +230 -354
- package/Menu.js +489 -760
- package/Message.js +248 -437
- package/MessageBar.js +220 -408
- package/Modal.js +201 -365
- package/ModalLayer.js +96 -196
- package/Monogram.js +112 -204
- package/Multiselect.js +1135 -1761
- package/Number.js +178 -334
- package/Paginator.js +170 -336
- package/Paragraph.js +77 -153
- package/Popover.js +370 -620
- package/Progress.js +139 -255
- package/RadioBar.js +156 -280
- package/RadioList.js +182 -282
- package/Resize.js +173 -307
- package/ResultsMenu.js +161 -303
- package/ScreenReaderContent.js +75 -151
- package/Scroll.js +125 -267
- package/ScrollContainerContext.js +129 -201
- package/Search.js +188 -354
- package/Select.js +1028 -1430
- package/SidePanel.js +106 -214
- package/Slider.js +198 -348
- package/SlidingPanels.js +138 -280
- package/SplitButton.js +141 -273
- package/StaticContent.js +84 -168
- package/StepBar.js +138 -246
- package/Switch.js +261 -385
- package/TabBar.js +261 -398
- package/TabLayout.js +122 -238
- package/Table.js +943 -1448
- package/Text.js +335 -549
- package/TextArea.js +315 -537
- package/Tooltip.js +152 -292
- package/TransitionOpen.js +118 -242
- package/Typography.js +81 -157
- package/WaitSpinner.js +117 -209
- package/package.json +14 -15
- package/stubs-splunkui.d.ts +4 -1
- package/types/src/ComboBox/Option.d.ts +1 -1
- package/types/src/Concertina/Concertina.d.ts +4 -0
- package/types/src/Link/Link.d.ts +7 -3
- package/types/src/Link/docs/examples/NewWindow.d.ts +2 -0
- package/types/src/Markdown/Markdown.d.ts +1 -1
- package/types/src/Markdown/renderers/MarkdownHeading.d.ts +1 -1
- package/types/src/Menu/Item.d.ts +1 -1
- package/types/src/Menu/Menu.d.ts +1 -0
- package/types/src/MessageBar/docs/examples/WithActions.d.ts +2 -0
- package/types/src/Multiselect/Option.d.ts +1 -1
- package/types/src/Search/Option.d.ts +1 -1
- package/types/src/Select/Option.d.ts +1 -1
- package/types/src/Select/OptionBase.d.ts +1 -1
- package/types/src/fixtures/FetchOptions.d.ts +2 -8
- package/useForceUpdate.js +46 -110
- package/useKeyPress.js +50 -107
- package/usePrevious.js +47 -111
- package/useRovingFocus.js +53 -133
- package/types/src/Link/docs/examples/NewTab.d.ts +0 -2
- /package/types/src/Table/docs/examples/{DockedHeader.d.ts → DockedHeaderScrollbar.d.ts} +0 -0
- /package/types/src/Table/docs/examples/prisma/{DockedHeader.d.ts → DockedHeaderScrollbar.d.ts} +0 -0
package/Image.js
CHANGED
|
@@ -1,212 +1,109 @@
|
|
|
1
|
-
|
|
2
|
-
/******/
|
|
3
|
-
/******/ // The
|
|
4
|
-
/******/ var
|
|
5
|
-
/******/
|
|
6
|
-
|
|
7
|
-
/******/
|
|
8
|
-
/******/
|
|
9
|
-
/******/ //
|
|
10
|
-
/******/
|
|
11
|
-
/******/
|
|
12
|
-
/******/
|
|
13
|
-
/******/
|
|
14
|
-
/******/
|
|
15
|
-
/******/
|
|
16
|
-
/******/
|
|
17
|
-
/******/
|
|
1
|
+
/******/ (() => { // webpackBootstrap
|
|
2
|
+
/******/ "use strict";
|
|
3
|
+
/******/ // The require scope
|
|
4
|
+
/******/ var __webpack_require__ = {};
|
|
5
|
+
/******/
|
|
6
|
+
/************************************************************************/
|
|
7
|
+
/******/ /* webpack/runtime/compat get default export */
|
|
8
|
+
/******/ (() => {
|
|
9
|
+
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|
10
|
+
/******/ __webpack_require__.n = (module) => {
|
|
11
|
+
/******/ var getter = module && module.__esModule ?
|
|
12
|
+
/******/ () => (module['default']) :
|
|
13
|
+
/******/ () => (module);
|
|
14
|
+
/******/ __webpack_require__.d(getter, { a: getter });
|
|
15
|
+
/******/ return getter;
|
|
16
|
+
/******/ };
|
|
17
|
+
/******/ })();
|
|
18
|
+
/******/
|
|
19
|
+
/******/ /* webpack/runtime/define property getters */
|
|
20
|
+
/******/ (() => {
|
|
21
|
+
/******/ // define getter functions for harmony exports
|
|
22
|
+
/******/ __webpack_require__.d = (exports, definition) => {
|
|
23
|
+
/******/ for(var key in definition) {
|
|
24
|
+
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
|
25
|
+
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
|
26
|
+
/******/ }
|
|
27
|
+
/******/ }
|
|
28
|
+
/******/ };
|
|
29
|
+
/******/ })();
|
|
30
|
+
/******/
|
|
31
|
+
/******/ /* webpack/runtime/hasOwnProperty shorthand */
|
|
32
|
+
/******/ (() => {
|
|
33
|
+
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
|
|
34
|
+
/******/ })();
|
|
35
|
+
/******/
|
|
36
|
+
/******/ /* webpack/runtime/make namespace object */
|
|
37
|
+
/******/ (() => {
|
|
38
|
+
/******/ // define __esModule on exports
|
|
39
|
+
/******/ __webpack_require__.r = (exports) => {
|
|
40
|
+
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
|
41
|
+
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
42
|
+
/******/ }
|
|
43
|
+
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
|
18
44
|
/******/ };
|
|
19
|
-
/******/
|
|
20
|
-
/******/
|
|
21
|
-
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
|
|
22
|
-
/******/
|
|
23
|
-
/******/ // Flag the module as loaded
|
|
24
|
-
/******/ module.l = true;
|
|
25
|
-
/******/
|
|
26
|
-
/******/ // Return the exports of the module
|
|
27
|
-
/******/ return module.exports;
|
|
28
|
-
/******/ }
|
|
29
|
-
/******/
|
|
30
|
-
/******/
|
|
31
|
-
/******/ // expose the modules object (__webpack_modules__)
|
|
32
|
-
/******/ __webpack_require__.m = modules;
|
|
33
|
-
/******/
|
|
34
|
-
/******/ // expose the module cache
|
|
35
|
-
/******/ __webpack_require__.c = installedModules;
|
|
36
|
-
/******/
|
|
37
|
-
/******/ // define getter function for harmony exports
|
|
38
|
-
/******/ __webpack_require__.d = function(exports, name, getter) {
|
|
39
|
-
/******/ if(!__webpack_require__.o(exports, name)) {
|
|
40
|
-
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
|
|
41
|
-
/******/ }
|
|
42
|
-
/******/ };
|
|
43
|
-
/******/
|
|
44
|
-
/******/ // define __esModule on exports
|
|
45
|
-
/******/ __webpack_require__.r = function(exports) {
|
|
46
|
-
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
|
47
|
-
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
48
|
-
/******/ }
|
|
49
|
-
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
|
50
|
-
/******/ };
|
|
51
|
-
/******/
|
|
52
|
-
/******/ // create a fake namespace object
|
|
53
|
-
/******/ // mode & 1: value is a module id, require it
|
|
54
|
-
/******/ // mode & 2: merge all properties of value into the ns
|
|
55
|
-
/******/ // mode & 4: return value when already ns object
|
|
56
|
-
/******/ // mode & 8|1: behave like require
|
|
57
|
-
/******/ __webpack_require__.t = function(value, mode) {
|
|
58
|
-
/******/ if(mode & 1) value = __webpack_require__(value);
|
|
59
|
-
/******/ if(mode & 8) return value;
|
|
60
|
-
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
|
|
61
|
-
/******/ var ns = Object.create(null);
|
|
62
|
-
/******/ __webpack_require__.r(ns);
|
|
63
|
-
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
|
|
64
|
-
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
|
|
65
|
-
/******/ return ns;
|
|
66
|
-
/******/ };
|
|
67
|
-
/******/
|
|
68
|
-
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|
69
|
-
/******/ __webpack_require__.n = function(module) {
|
|
70
|
-
/******/ var getter = module && module.__esModule ?
|
|
71
|
-
/******/ function getDefault() { return module['default']; } :
|
|
72
|
-
/******/ function getModuleExports() { return module; };
|
|
73
|
-
/******/ __webpack_require__.d(getter, 'a', getter);
|
|
74
|
-
/******/ return getter;
|
|
75
|
-
/******/ };
|
|
76
|
-
/******/
|
|
77
|
-
/******/ // Object.prototype.hasOwnProperty.call
|
|
78
|
-
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
|
|
79
|
-
/******/
|
|
80
|
-
/******/ // __webpack_public_path__
|
|
81
|
-
/******/ __webpack_require__.p = "";
|
|
82
|
-
/******/
|
|
83
|
-
/******/
|
|
84
|
-
/******/ // Load entry module and return exports
|
|
85
|
-
/******/ return __webpack_require__(__webpack_require__.s = 202);
|
|
86
|
-
/******/ })
|
|
45
|
+
/******/ })();
|
|
46
|
+
/******/
|
|
87
47
|
/************************************************************************/
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
/***/ 0:
|
|
91
|
-
/***/ (function(module, exports) {
|
|
92
|
-
|
|
93
|
-
module.exports = require("@splunk/themes");
|
|
94
|
-
|
|
95
|
-
/***/ }),
|
|
96
|
-
|
|
97
|
-
/***/ 1:
|
|
98
|
-
/***/ (function(module, exports) {
|
|
99
|
-
|
|
100
|
-
module.exports = require("prop-types");
|
|
101
|
-
|
|
102
|
-
/***/ }),
|
|
103
|
-
|
|
104
|
-
/***/ 12:
|
|
105
|
-
/***/ (function(module, exports) {
|
|
106
|
-
|
|
107
|
-
module.exports = require("@splunk/react-ui/Clickable");
|
|
108
|
-
|
|
109
|
-
/***/ }),
|
|
110
|
-
|
|
111
|
-
/***/ 138:
|
|
112
|
-
/***/ (function(module, exports) {
|
|
113
|
-
|
|
114
|
-
module.exports = require("lodash/endsWith");
|
|
115
|
-
|
|
116
|
-
/***/ }),
|
|
117
|
-
|
|
118
|
-
/***/ 139:
|
|
119
|
-
/***/ (function(module, exports) {
|
|
120
|
-
|
|
121
|
-
module.exports = require("@splunk/react-ui/File");
|
|
122
|
-
|
|
123
|
-
/***/ }),
|
|
124
|
-
|
|
125
|
-
/***/ 140:
|
|
126
|
-
/***/ (function(module, exports) {
|
|
127
|
-
|
|
128
|
-
module.exports = require("@splunk/react-ui/Message");
|
|
129
|
-
|
|
130
|
-
/***/ }),
|
|
131
|
-
|
|
132
|
-
/***/ 2:
|
|
133
|
-
/***/ (function(module, exports) {
|
|
134
|
-
|
|
135
|
-
module.exports = require("react");
|
|
136
|
-
|
|
137
|
-
/***/ }),
|
|
138
|
-
|
|
139
|
-
/***/ 202:
|
|
140
|
-
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
141
|
-
|
|
142
|
-
"use strict";
|
|
48
|
+
var __webpack_exports__ = {};
|
|
143
49
|
// ESM COMPAT FLAG
|
|
144
50
|
__webpack_require__.r(__webpack_exports__);
|
|
145
51
|
|
|
146
52
|
// EXPORTS
|
|
147
|
-
__webpack_require__.d(__webpack_exports__,
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
var external_react_ = __webpack_require__(2);
|
|
151
|
-
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
|
|
152
|
-
|
|
153
|
-
// EXTERNAL MODULE: external "prop-types"
|
|
154
|
-
var external_prop_types_ = __webpack_require__(1);
|
|
155
|
-
var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
|
|
156
|
-
|
|
157
|
-
// EXTERNAL MODULE: external "lodash/endsWith"
|
|
158
|
-
var endsWith_ = __webpack_require__(138);
|
|
159
|
-
var endsWith_default = /*#__PURE__*/__webpack_require__.n(endsWith_);
|
|
160
|
-
|
|
161
|
-
// EXTERNAL MODULE: external "lodash/omit"
|
|
162
|
-
var omit_ = __webpack_require__(5);
|
|
163
|
-
var omit_default = /*#__PURE__*/__webpack_require__.n(omit_);
|
|
164
|
-
|
|
165
|
-
// EXTERNAL MODULE: external "lodash/toLower"
|
|
166
|
-
var toLower_ = __webpack_require__(36);
|
|
167
|
-
var toLower_default = /*#__PURE__*/__webpack_require__.n(toLower_);
|
|
168
|
-
|
|
169
|
-
// EXTERNAL MODULE: external "@splunk/react-ui/File"
|
|
170
|
-
var File_ = __webpack_require__(139);
|
|
171
|
-
var File_default = /*#__PURE__*/__webpack_require__.n(File_);
|
|
172
|
-
|
|
173
|
-
// EXTERNAL MODULE: external "@splunk/ui-utils/format"
|
|
174
|
-
var format_ = __webpack_require__(29);
|
|
175
|
-
|
|
176
|
-
// EXTERNAL MODULE: external "@splunk/ui-utils/i18n"
|
|
177
|
-
var i18n_ = __webpack_require__(4);
|
|
178
|
-
|
|
179
|
-
// EXTERNAL MODULE: external "@splunk/themes"
|
|
180
|
-
var themes_ = __webpack_require__(0);
|
|
181
|
-
|
|
182
|
-
// EXTERNAL MODULE: external "@splunk/react-icons/Cross"
|
|
183
|
-
var Cross_ = __webpack_require__(26);
|
|
184
|
-
var Cross_default = /*#__PURE__*/__webpack_require__.n(Cross_);
|
|
185
|
-
|
|
186
|
-
// EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Close"
|
|
187
|
-
var Close_ = __webpack_require__(27);
|
|
188
|
-
var Close_default = /*#__PURE__*/__webpack_require__.n(Close_);
|
|
189
|
-
|
|
190
|
-
// CONCATENATED MODULE: ./src/Image/icons/Cross.tsx
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
53
|
+
__webpack_require__.d(__webpack_exports__, {
|
|
54
|
+
"default": () => (/* reexport */ Image_Image)
|
|
55
|
+
});
|
|
196
56
|
|
|
197
|
-
|
|
198
|
-
|
|
57
|
+
;// CONCATENATED MODULE: external "react"
|
|
58
|
+
const external_react_namespaceObject = require("react");
|
|
59
|
+
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
|
|
60
|
+
;// CONCATENATED MODULE: external "prop-types"
|
|
61
|
+
const external_prop_types_namespaceObject = require("prop-types");
|
|
62
|
+
var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_namespaceObject);
|
|
63
|
+
;// CONCATENATED MODULE: external "lodash/endsWith"
|
|
64
|
+
const endsWith_namespaceObject = require("lodash/endsWith");
|
|
65
|
+
var endsWith_default = /*#__PURE__*/__webpack_require__.n(endsWith_namespaceObject);
|
|
66
|
+
;// CONCATENATED MODULE: external "lodash/omit"
|
|
67
|
+
const omit_namespaceObject = require("lodash/omit");
|
|
68
|
+
var omit_default = /*#__PURE__*/__webpack_require__.n(omit_namespaceObject);
|
|
69
|
+
;// CONCATENATED MODULE: external "lodash/toLower"
|
|
70
|
+
const toLower_namespaceObject = require("lodash/toLower");
|
|
71
|
+
var toLower_default = /*#__PURE__*/__webpack_require__.n(toLower_namespaceObject);
|
|
72
|
+
;// CONCATENATED MODULE: external "@splunk/react-ui/File"
|
|
73
|
+
const File_namespaceObject = require("@splunk/react-ui/File");
|
|
74
|
+
var File_default = /*#__PURE__*/__webpack_require__.n(File_namespaceObject);
|
|
75
|
+
;// CONCATENATED MODULE: external "@splunk/ui-utils/format"
|
|
76
|
+
const format_namespaceObject = require("@splunk/ui-utils/format");
|
|
77
|
+
;// CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
|
|
78
|
+
const i18n_namespaceObject = require("@splunk/ui-utils/i18n");
|
|
79
|
+
;// CONCATENATED MODULE: external "@splunk/themes"
|
|
80
|
+
const themes_namespaceObject = require("@splunk/themes");
|
|
81
|
+
;// CONCATENATED MODULE: external "@splunk/react-icons/Cross"
|
|
82
|
+
const Cross_namespaceObject = require("@splunk/react-icons/Cross");
|
|
83
|
+
var Cross_default = /*#__PURE__*/__webpack_require__.n(Cross_namespaceObject);
|
|
84
|
+
;// CONCATENATED MODULE: external "@splunk/react-icons/enterprise/Close"
|
|
85
|
+
const Close_namespaceObject = require("@splunk/react-icons/enterprise/Close");
|
|
86
|
+
var Close_default = /*#__PURE__*/__webpack_require__.n(Close_namespaceObject);
|
|
87
|
+
;// CONCATENATED MODULE: ./src/Image/icons/Cross.tsx
|
|
88
|
+
|
|
89
|
+
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
var CrossIcon = function CrossIcon() {
|
|
95
|
+
var _useSplunkTheme = (0,themes_namespaceObject.useSplunkTheme)(),
|
|
199
96
|
isEnterprise = _useSplunkTheme.isEnterprise,
|
|
200
97
|
isCompact = _useSplunkTheme.isCompact;
|
|
201
98
|
|
|
202
99
|
var prismaSize = isCompact ? '20px' : '24px';
|
|
203
100
|
|
|
204
|
-
var removeScreenReaderText =
|
|
101
|
+
var removeScreenReaderText = (0,i18n_namespaceObject._)('Remove');
|
|
205
102
|
|
|
206
|
-
var crossIconFamily = isEnterprise ? /*#__PURE__*/external_react_default.
|
|
103
|
+
var crossIconFamily = isEnterprise ? /*#__PURE__*/external_react_default().createElement((Close_default()), {
|
|
207
104
|
hideDefaultTooltip: true,
|
|
208
105
|
screenReaderText: removeScreenReaderText
|
|
209
|
-
}) : /*#__PURE__*/external_react_default.
|
|
106
|
+
}) : /*#__PURE__*/external_react_default().createElement((Cross_default()), {
|
|
210
107
|
"aria-label": removeScreenReaderText,
|
|
211
108
|
height: prismaSize,
|
|
212
109
|
width: prismaSize
|
|
@@ -214,73 +111,70 @@ var Cross_CrossIcon = function CrossIcon() {
|
|
|
214
111
|
return crossIconFamily;
|
|
215
112
|
};
|
|
216
113
|
|
|
217
|
-
/* harmony default export */
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(
|
|
114
|
+
/* harmony default export */ const Cross = (CrossIcon);
|
|
115
|
+
;// CONCATENATED MODULE: external "styled-components"
|
|
116
|
+
const external_styled_components_namespaceObject = require("styled-components");
|
|
117
|
+
var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_namespaceObject);
|
|
118
|
+
;// CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
|
|
119
|
+
const Clickable_namespaceObject = require("@splunk/react-ui/Clickable");
|
|
120
|
+
var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_namespaceObject);
|
|
121
|
+
;// CONCATENATED MODULE: external "@splunk/react-ui/Message"
|
|
122
|
+
const Message_namespaceObject = require("@splunk/react-ui/Message");
|
|
123
|
+
var Message_default = /*#__PURE__*/__webpack_require__.n(Message_namespaceObject);
|
|
124
|
+
;// CONCATENATED MODULE: ./src/Image/ImageStyles.ts
|
|
221
125
|
|
|
222
|
-
// EXTERNAL MODULE: external "@splunk/react-ui/Clickable"
|
|
223
|
-
var Clickable_ = __webpack_require__(12);
|
|
224
|
-
var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_);
|
|
225
126
|
|
|
226
|
-
// EXTERNAL MODULE: external "@splunk/react-ui/Message"
|
|
227
|
-
var Message_ = __webpack_require__(140);
|
|
228
|
-
var Message_default = /*#__PURE__*/__webpack_require__.n(Message_);
|
|
229
127
|
|
|
230
|
-
// CONCATENATED MODULE: ./src/Image/ImageStyles.ts
|
|
231
128
|
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
var StyledImagePreview = external_styled_components_default.a.div.withConfig({
|
|
129
|
+
var StyledImagePreview = external_styled_components_default().div.withConfig({
|
|
236
130
|
displayName: "ImageStyles__StyledImagePreview",
|
|
237
131
|
componentId: "sc-16ooypp-0"
|
|
238
|
-
})(["position:relative;min-height:", ";", ""],
|
|
132
|
+
})(["position:relative;min-height:", ";", ""], (0,themes_namespaceObject.pick)({
|
|
239
133
|
enterprise: '30px',
|
|
240
|
-
prisma:
|
|
241
|
-
}),
|
|
242
|
-
enterprise:
|
|
243
|
-
prisma:
|
|
134
|
+
prisma: themes_namespaceObject.variables.inputHeight
|
|
135
|
+
}), (0,themes_namespaceObject.pick)({
|
|
136
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["border:", ";"], themes_namespaceObject.variables.border),
|
|
137
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["border-radius:", ";overflow:hidden;margin-top:12px;background-color:", ";"], themes_namespaceObject.variables.borderRadius, themes_namespaceObject.variables.interactiveColorBackground)
|
|
244
138
|
}));
|
|
245
|
-
var StyledLabelContainer = external_styled_components_default.
|
|
139
|
+
var StyledLabelContainer = external_styled_components_default().div.withConfig({
|
|
246
140
|
displayName: "ImageStyles__StyledLabelContainer",
|
|
247
141
|
componentId: "sc-16ooypp-1"
|
|
248
|
-
})(["", ";flex-direction:row;justify-content:space-between;background-color:", ";color:", ";opacity:0.9;position:absolute;width:100%;"],
|
|
142
|
+
})(["", ";flex-direction:row;justify-content:space-between;background-color:", ";color:", ";opacity:0.9;position:absolute;width:100%;"], themes_namespaceObject.mixins.reset('flex'), (0,themes_namespaceObject.pick)({
|
|
249
143
|
enterprise: {
|
|
250
|
-
light:
|
|
251
|
-
dark:
|
|
144
|
+
light: themes_namespaceObject.variables.gray92,
|
|
145
|
+
dark: themes_namespaceObject.variables.gray30
|
|
252
146
|
},
|
|
253
|
-
prisma:
|
|
254
|
-
}),
|
|
255
|
-
var StyledRemoveClickable = external_styled_components_default()(Clickable_default
|
|
147
|
+
prisma: themes_namespaceObject.mixins.overlayColors(themes_namespaceObject.variables.interactiveColorBackground, themes_namespaceObject.variables.interactiveColorOverlaySelected)
|
|
148
|
+
}), themes_namespaceObject.variables.contentColorMuted);
|
|
149
|
+
var StyledRemoveClickable = external_styled_components_default()((Clickable_default())).withConfig({
|
|
256
150
|
displayName: "ImageStyles__StyledRemoveClickable",
|
|
257
151
|
componentId: "sc-16ooypp-2"
|
|
258
|
-
})(["cursor:pointer;", " padding:", ";text-align:center;height:inherit;&:focus{", "}&:hover{background-color:", ";color:", ";}"],
|
|
259
|
-
enterprise:
|
|
260
|
-
prisma:
|
|
261
|
-
}),
|
|
152
|
+
})(["cursor:pointer;", " padding:", ";text-align:center;height:inherit;&:focus{", "}&:hover{background-color:", ";color:", ";}"], (0,themes_namespaceObject.pick)({
|
|
153
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["flex:0 0 26px;"]),
|
|
154
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["color:", ";border-radius:50%;"], themes_namespaceObject.variables.contentColorMuted)
|
|
155
|
+
}), (0,themes_namespaceObject.pick)({
|
|
262
156
|
enterprise: '3px 0',
|
|
263
157
|
prisma: {
|
|
264
158
|
comfortable: '0 8px',
|
|
265
159
|
compact: '0 6px'
|
|
266
160
|
}
|
|
267
|
-
}),
|
|
268
|
-
enterprise:
|
|
269
|
-
prisma:
|
|
270
|
-
}),
|
|
161
|
+
}), (0,themes_namespaceObject.pick)({
|
|
162
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["box-shadow:", ";color:", ";"], themes_namespaceObject.variables.focusShadow, themes_namespaceObject.variables.linkColor),
|
|
163
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["color:", ";background-color:", ";box-shadow:0 0 0 3px ", ";"], themes_namespaceObject.variables.contentColorActive, themes_namespaceObject.variables.interactiveColorOverlayHover, themes_namespaceObject.variables.focusColor)
|
|
164
|
+
}), (0,themes_namespaceObject.pick)({
|
|
271
165
|
enterprise: {
|
|
272
|
-
light:
|
|
273
|
-
dark:
|
|
166
|
+
light: themes_namespaceObject.variables.gray96,
|
|
167
|
+
dark: themes_namespaceObject.variables.gray30
|
|
274
168
|
},
|
|
275
|
-
prisma:
|
|
276
|
-
}),
|
|
277
|
-
enterprise:
|
|
278
|
-
prisma:
|
|
169
|
+
prisma: themes_namespaceObject.variables.interactiveColorOverlayHover
|
|
170
|
+
}), (0,themes_namespaceObject.pick)({
|
|
171
|
+
enterprise: themes_namespaceObject.variables.linkColor,
|
|
172
|
+
prisma: themes_namespaceObject.variables.contentColorActive
|
|
279
173
|
}));
|
|
280
|
-
var StyledLabel = external_styled_components_default.
|
|
174
|
+
var StyledLabel = external_styled_components_default().div.withConfig({
|
|
281
175
|
displayName: "ImageStyles__StyledLabel",
|
|
282
176
|
componentId: "sc-16ooypp-3"
|
|
283
|
-
})(["color:", ";overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1 0 0px;padding:", ";", ""],
|
|
177
|
+
})(["color:", ";overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1 0 0px;padding:", ";", ""], themes_namespaceObject.variables.contentColorActive, (0,themes_namespaceObject.pick)({
|
|
284
178
|
enterprise: '3px 0 3px 10px',
|
|
285
179
|
prisma: {
|
|
286
180
|
comfortable: '10px 10px',
|
|
@@ -288,26 +182,26 @@ var StyledLabel = external_styled_components_default.a.div.withConfig({
|
|
|
288
182
|
}
|
|
289
183
|
}), function (_ref) {
|
|
290
184
|
var $disabled = _ref.$disabled;
|
|
291
|
-
return $disabled &&
|
|
292
|
-
enterprise:
|
|
293
|
-
prisma:
|
|
294
|
-
}),
|
|
185
|
+
return $disabled && (0,external_styled_components_namespaceObject.css)(["background-color:", ";color:", ";cursor:not-allowed;"], (0,themes_namespaceObject.pick)({
|
|
186
|
+
enterprise: themes_namespaceObject.variables.gray96,
|
|
187
|
+
prisma: themes_namespaceObject.variables.interactiveColorBackgroundDisabled
|
|
188
|
+
}), themes_namespaceObject.variables.contentColorDisabled);
|
|
295
189
|
});
|
|
296
|
-
var StyledImageThumbnail = external_styled_components_default.
|
|
190
|
+
var StyledImageThumbnail = external_styled_components_default().img.withConfig({
|
|
297
191
|
displayName: "ImageStyles__StyledImageThumbnail",
|
|
298
192
|
componentId: "sc-16ooypp-4"
|
|
299
|
-
})(["", ";margin:0 auto;max-height:", "px;max-width:100%;"],
|
|
193
|
+
})(["", ";margin:0 auto;max-height:", "px;max-width:100%;"], themes_namespaceObject.mixins.reset('block'), function (props) {
|
|
300
194
|
return props.maxHeight;
|
|
301
195
|
});
|
|
302
|
-
var StyledErrorMessage = external_styled_components_default()(Message_default
|
|
196
|
+
var StyledErrorMessage = external_styled_components_default()((Message_default())).withConfig({
|
|
303
197
|
displayName: "ImageStyles__StyledErrorMessage",
|
|
304
198
|
componentId: "sc-16ooypp-5"
|
|
305
|
-
})(["margin-top:", ";"],
|
|
306
|
-
enterprise:
|
|
199
|
+
})(["margin-top:", ";"], (0,themes_namespaceObject.pick)({
|
|
200
|
+
enterprise: themes_namespaceObject.variables.spacingQuarter,
|
|
307
201
|
prisma: '12px'
|
|
308
202
|
}));
|
|
309
203
|
|
|
310
|
-
|
|
204
|
+
;// CONCATENATED MODULE: ./src/Image/Image.tsx
|
|
311
205
|
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
|
312
206
|
|
|
313
207
|
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); }
|
|
@@ -345,15 +239,15 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
345
239
|
|
|
346
240
|
|
|
347
241
|
var propTypes = {
|
|
348
|
-
allowExtensions: external_prop_types_default.
|
|
349
|
-
defaultFilename: external_prop_types_default.
|
|
350
|
-
defaultImageDataURI: external_prop_types_default.
|
|
351
|
-
disabled: external_prop_types_default.
|
|
352
|
-
dropAnywhere: external_prop_types_default.
|
|
353
|
-
elementRef: external_prop_types_default.
|
|
354
|
-
error: external_prop_types_default.
|
|
355
|
-
maxHeight: external_prop_types_default.
|
|
356
|
-
onImageChange: external_prop_types_default.
|
|
242
|
+
allowExtensions: external_prop_types_default().arrayOf((external_prop_types_default()).string),
|
|
243
|
+
defaultFilename: (external_prop_types_default()).string,
|
|
244
|
+
defaultImageDataURI: (external_prop_types_default()).string,
|
|
245
|
+
disabled: (external_prop_types_default()).bool,
|
|
246
|
+
dropAnywhere: (external_prop_types_default()).bool,
|
|
247
|
+
elementRef: external_prop_types_default().oneOfType([(external_prop_types_default()).func, (external_prop_types_default()).object]),
|
|
248
|
+
error: (external_prop_types_default()).bool,
|
|
249
|
+
maxHeight: (external_prop_types_default()).number,
|
|
250
|
+
onImageChange: (external_prop_types_default()).func
|
|
357
251
|
};
|
|
358
252
|
var defaultProps = {
|
|
359
253
|
allowExtensions: ['gif', 'jpeg', 'jpg', 'png'],
|
|
@@ -366,7 +260,7 @@ var defaultProps = {
|
|
|
366
260
|
/**
|
|
367
261
|
* Image provides the ability to accept image files and present a preview of the image.
|
|
368
262
|
*/
|
|
369
|
-
var
|
|
263
|
+
var Image = /*#__PURE__*/function (_Component) {
|
|
370
264
|
_inherits(Image, _Component);
|
|
371
265
|
|
|
372
266
|
var _super = _createSuper(Image);
|
|
@@ -465,32 +359,32 @@ var Image_Image = /*#__PURE__*/function (_Component) {
|
|
|
465
359
|
|
|
466
360
|
var hasError = filename && !Image.isAllowedFilename(filename, allowExtensions) || error;
|
|
467
361
|
|
|
468
|
-
var errorText =
|
|
362
|
+
var errorText = (0,i18n_namespaceObject._)('This file extension is unsupported.');
|
|
469
363
|
|
|
470
|
-
var removeLabel =
|
|
364
|
+
var removeLabel = (0,format_namespaceObject.sprintf)((0,i18n_namespaceObject._)('Remove "%(filename)s"'), {
|
|
471
365
|
filename: filename
|
|
472
366
|
});
|
|
473
|
-
return /*#__PURE__*/external_react_default.
|
|
367
|
+
return /*#__PURE__*/external_react_default().createElement("div", {
|
|
474
368
|
"data-test": "image"
|
|
475
|
-
}, /*#__PURE__*/external_react_default.
|
|
369
|
+
}, /*#__PURE__*/external_react_default().createElement((File_default()), _extends({}, omit_default()(this.props, ['allowExtensions', 'defaultFilename', 'defaultImageDataURI', 'maxHeight', 'onImageChange']), {
|
|
476
370
|
accept: accept,
|
|
477
371
|
allowMultiple: false,
|
|
478
372
|
error: hasError,
|
|
479
373
|
onRequestAdd: this.handleAddFiles,
|
|
480
374
|
"data-test": "file"
|
|
481
|
-
}), filename && imageDataURI && !hasError && /*#__PURE__*/external_react_default.
|
|
375
|
+
}), filename && imageDataURI && !hasError && /*#__PURE__*/external_react_default().createElement(StyledImagePreview, null, /*#__PURE__*/external_react_default().createElement(StyledLabelContainer, null, /*#__PURE__*/external_react_default().createElement(StyledLabel, {
|
|
482
376
|
"data-test": "label",
|
|
483
377
|
$disabled: disabled
|
|
484
|
-
}, filename), !disabled && /*#__PURE__*/external_react_default.
|
|
378
|
+
}, filename), !disabled && /*#__PURE__*/external_react_default().createElement(StyledRemoveClickable, {
|
|
485
379
|
onClick: this.handleRemoveFile,
|
|
486
380
|
"data-test": "remove",
|
|
487
381
|
"aria-label": removeLabel
|
|
488
|
-
}, /*#__PURE__*/external_react_default.
|
|
382
|
+
}, /*#__PURE__*/external_react_default().createElement(Cross, null))), /*#__PURE__*/external_react_default().createElement(StyledImageThumbnail, {
|
|
489
383
|
alt: filename,
|
|
490
384
|
"data-test": "preview",
|
|
491
385
|
maxHeight: maxHeight,
|
|
492
386
|
src: imageDataURI
|
|
493
|
-
}))), hasError && /*#__PURE__*/external_react_default.
|
|
387
|
+
}))), hasError && /*#__PURE__*/external_react_default().createElement(StyledErrorMessage, {
|
|
494
388
|
appearance: "fill",
|
|
495
389
|
type: "error"
|
|
496
390
|
}, errorText));
|
|
@@ -498,66 +392,16 @@ var Image_Image = /*#__PURE__*/function (_Component) {
|
|
|
498
392
|
}]);
|
|
499
393
|
|
|
500
394
|
return Image;
|
|
501
|
-
}(
|
|
502
|
-
|
|
503
|
-
_defineProperty(Image_Image, "propTypes", propTypes);
|
|
504
|
-
|
|
505
|
-
_defineProperty(Image_Image, "defaultProps", defaultProps);
|
|
506
|
-
|
|
507
|
-
/* harmony default export */ var src_Image_Image = (Image_Image);
|
|
508
|
-
// CONCATENATED MODULE: ./src/Image/index.ts
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
/***/ }),
|
|
513
|
-
|
|
514
|
-
/***/ 26:
|
|
515
|
-
/***/ (function(module, exports) {
|
|
516
|
-
|
|
517
|
-
module.exports = require("@splunk/react-icons/Cross");
|
|
518
|
-
|
|
519
|
-
/***/ }),
|
|
520
|
-
|
|
521
|
-
/***/ 27:
|
|
522
|
-
/***/ (function(module, exports) {
|
|
523
|
-
|
|
524
|
-
module.exports = require("@splunk/react-icons/enterprise/Close");
|
|
525
|
-
|
|
526
|
-
/***/ }),
|
|
527
|
-
|
|
528
|
-
/***/ 29:
|
|
529
|
-
/***/ (function(module, exports) {
|
|
530
|
-
|
|
531
|
-
module.exports = require("@splunk/ui-utils/format");
|
|
532
|
-
|
|
533
|
-
/***/ }),
|
|
534
|
-
|
|
535
|
-
/***/ 3:
|
|
536
|
-
/***/ (function(module, exports) {
|
|
537
|
-
|
|
538
|
-
module.exports = require("styled-components");
|
|
539
|
-
|
|
540
|
-
/***/ }),
|
|
541
|
-
|
|
542
|
-
/***/ 36:
|
|
543
|
-
/***/ (function(module, exports) {
|
|
544
|
-
|
|
545
|
-
module.exports = require("lodash/toLower");
|
|
546
|
-
|
|
547
|
-
/***/ }),
|
|
548
|
-
|
|
549
|
-
/***/ 4:
|
|
550
|
-
/***/ (function(module, exports) {
|
|
551
|
-
|
|
552
|
-
module.exports = require("@splunk/ui-utils/i18n");
|
|
395
|
+
}(external_react_namespaceObject.Component);
|
|
553
396
|
|
|
554
|
-
|
|
397
|
+
_defineProperty(Image, "propTypes", propTypes);
|
|
555
398
|
|
|
556
|
-
|
|
557
|
-
/***/ (function(module, exports) {
|
|
399
|
+
_defineProperty(Image, "defaultProps", defaultProps);
|
|
558
400
|
|
|
559
|
-
|
|
401
|
+
/* harmony default export */ const Image_Image = (Image);
|
|
402
|
+
;// CONCATENATED MODULE: ./src/Image/index.ts
|
|
560
403
|
|
|
561
|
-
/***/ })
|
|
562
404
|
|
|
563
|
-
|
|
405
|
+
module.exports = __webpack_exports__;
|
|
406
|
+
/******/ })()
|
|
407
|
+
;
|