@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/Switch.js
CHANGED
|
@@ -1,173 +1,88 @@
|
|
|
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 = 209);
|
|
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
|
-
/***/ 14:
|
|
112
|
-
/***/ (function(module, exports) {
|
|
113
|
-
|
|
114
|
-
module.exports = require("@splunk/react-ui/ScreenReaderContent");
|
|
115
|
-
|
|
116
|
-
/***/ }),
|
|
117
|
-
|
|
118
|
-
/***/ 2:
|
|
119
|
-
/***/ (function(module, exports) {
|
|
120
|
-
|
|
121
|
-
module.exports = require("react");
|
|
122
|
-
|
|
123
|
-
/***/ }),
|
|
124
|
-
|
|
125
|
-
/***/ 209:
|
|
126
|
-
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
127
|
-
|
|
128
|
-
"use strict";
|
|
48
|
+
var __webpack_exports__ = {};
|
|
129
49
|
// ESM COMPAT FLAG
|
|
130
50
|
__webpack_require__.r(__webpack_exports__);
|
|
131
51
|
|
|
132
52
|
// EXPORTS
|
|
133
|
-
__webpack_require__.d(__webpack_exports__,
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
var external_react_ = __webpack_require__(2);
|
|
137
|
-
var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
|
|
138
|
-
|
|
139
|
-
// EXTERNAL MODULE: external "prop-types"
|
|
140
|
-
var external_prop_types_ = __webpack_require__(1);
|
|
141
|
-
var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
|
|
142
|
-
|
|
143
|
-
// EXTERNAL MODULE: external "@splunk/react-ui/AnimationToggle"
|
|
144
|
-
var AnimationToggle_ = __webpack_require__(51);
|
|
145
|
-
var AnimationToggle_default = /*#__PURE__*/__webpack_require__.n(AnimationToggle_);
|
|
146
|
-
|
|
147
|
-
// EXTERNAL MODULE: external "@splunk/react-ui/ScreenReaderContent"
|
|
148
|
-
var ScreenReaderContent_ = __webpack_require__(14);
|
|
149
|
-
var ScreenReaderContent_default = /*#__PURE__*/__webpack_require__.n(ScreenReaderContent_);
|
|
150
|
-
|
|
151
|
-
// EXTERNAL MODULE: external "@splunk/ui-utils/id"
|
|
152
|
-
var id_ = __webpack_require__(8);
|
|
153
|
-
|
|
154
|
-
// EXTERNAL MODULE: external "@splunk/react-icons/enterprise/Check"
|
|
155
|
-
var Check_ = __webpack_require__(97);
|
|
156
|
-
var Check_default = /*#__PURE__*/__webpack_require__.n(Check_);
|
|
157
|
-
|
|
158
|
-
// EXTERNAL MODULE: external "@splunk/themes"
|
|
159
|
-
var themes_ = __webpack_require__(0);
|
|
53
|
+
__webpack_require__.d(__webpack_exports__, {
|
|
54
|
+
"default": () => (/* reexport */ Switch_Switch)
|
|
55
|
+
});
|
|
160
56
|
|
|
161
|
-
|
|
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 "@splunk/react-ui/AnimationToggle"
|
|
64
|
+
const AnimationToggle_namespaceObject = require("@splunk/react-ui/AnimationToggle");
|
|
65
|
+
var AnimationToggle_default = /*#__PURE__*/__webpack_require__.n(AnimationToggle_namespaceObject);
|
|
66
|
+
;// CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
|
|
67
|
+
const ScreenReaderContent_namespaceObject = require("@splunk/react-ui/ScreenReaderContent");
|
|
68
|
+
var ScreenReaderContent_default = /*#__PURE__*/__webpack_require__.n(ScreenReaderContent_namespaceObject);
|
|
69
|
+
;// CONCATENATED MODULE: external "@splunk/ui-utils/id"
|
|
70
|
+
const id_namespaceObject = require("@splunk/ui-utils/id");
|
|
71
|
+
;// CONCATENATED MODULE: external "@splunk/react-icons/enterprise/Check"
|
|
72
|
+
const Check_namespaceObject = require("@splunk/react-icons/enterprise/Check");
|
|
73
|
+
var Check_default = /*#__PURE__*/__webpack_require__.n(Check_namespaceObject);
|
|
74
|
+
;// CONCATENATED MODULE: external "@splunk/themes"
|
|
75
|
+
const themes_namespaceObject = require("@splunk/themes");
|
|
76
|
+
;// CONCATENATED MODULE: ./src/Switch/CheckIcon.tsx
|
|
162
77
|
|
|
163
78
|
|
|
164
79
|
|
|
165
80
|
function CheckIcon() {
|
|
166
|
-
var _useSplunkTheme =
|
|
81
|
+
var _useSplunkTheme = (0,themes_namespaceObject.useSplunkTheme)(),
|
|
167
82
|
family = _useSplunkTheme.family;
|
|
168
83
|
|
|
169
84
|
if (family === 'enterprise') {
|
|
170
|
-
return /*#__PURE__*/external_react_default.
|
|
85
|
+
return /*#__PURE__*/external_react_default().createElement((Check_default()), {
|
|
171
86
|
inline: false,
|
|
172
87
|
size: "12px",
|
|
173
88
|
screenReaderText: null,
|
|
@@ -178,7 +93,7 @@ function CheckIcon() {
|
|
|
178
93
|
});
|
|
179
94
|
}
|
|
180
95
|
|
|
181
|
-
return /*#__PURE__*/external_react_default.
|
|
96
|
+
return /*#__PURE__*/external_react_default().createElement("svg", {
|
|
182
97
|
width: "12",
|
|
183
98
|
height: "12",
|
|
184
99
|
viewBox: "-1 -2 11 10",
|
|
@@ -186,282 +101,279 @@ function CheckIcon() {
|
|
|
186
101
|
display: 'block'
|
|
187
102
|
},
|
|
188
103
|
xmlns: "http://www.w3.org/2000/svg"
|
|
189
|
-
}, /*#__PURE__*/external_react_default.
|
|
104
|
+
}, /*#__PURE__*/external_react_default().createElement("path", {
|
|
190
105
|
d: "M8.70711 0.292893C9.09763 0.683417 9.09763 1.31658 8.70711 1.70711L4.32132 6.0929C3.73559 6.67862 2.78596 6.67869 2.20015 6.09305L0.292997 4.18646C-0.0975845 3.79599 -0.0976776 3.16282 0.292789 2.77224C0.683256 2.38166 1.31642 2.38157 1.707 2.77203L3.26061 4.32518L7.29289 0.292893C7.68342 -0.0976311 8.31658 -0.0976311 8.70711 0.292893Z",
|
|
191
106
|
fill: "currentColor"
|
|
192
107
|
}));
|
|
193
108
|
}
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
var
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_);
|
|
205
|
-
|
|
206
|
-
// CONCATENATED MODULE: ./src/Switch/SwitchStyles.ts
|
|
109
|
+
;// CONCATENATED MODULE: external "styled-components"
|
|
110
|
+
const external_styled_components_namespaceObject = require("styled-components");
|
|
111
|
+
var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_namespaceObject);
|
|
112
|
+
;// CONCATENATED MODULE: external "@splunk/react-ui/Box"
|
|
113
|
+
const Box_namespaceObject = require("@splunk/react-ui/Box");
|
|
114
|
+
var Box_default = /*#__PURE__*/__webpack_require__.n(Box_namespaceObject);
|
|
115
|
+
;// CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
|
|
116
|
+
const Clickable_namespaceObject = require("@splunk/react-ui/Clickable");
|
|
117
|
+
var Clickable_default = /*#__PURE__*/__webpack_require__.n(Clickable_namespaceObject);
|
|
118
|
+
;// CONCATENATED MODULE: ./src/Switch/SwitchStyles.ts
|
|
207
119
|
|
|
208
120
|
|
|
209
121
|
|
|
210
122
|
|
|
211
123
|
var diameter = '18px';
|
|
212
124
|
var toggleDiameter = '20px';
|
|
213
|
-
var StyledBox = external_styled_components_default()(Box_default
|
|
125
|
+
var StyledBox = external_styled_components_default()((Box_default())).withConfig({
|
|
214
126
|
displayName: "SwitchStyles__StyledBox",
|
|
215
127
|
componentId: "sc-844ieu-0"
|
|
216
|
-
})(["display:inline;position:relative;color:", ";flex-shrink:0;padding:", ";[data-inline] + &{margin-left:", ";}"],
|
|
128
|
+
})(["display:inline;position:relative;color:", ";flex-shrink:0;padding:", ";[data-inline] + &{margin-left:", ";}"], (0,themes_namespaceObject.pickVariant)('$switchState', {
|
|
217
129
|
error: {
|
|
218
|
-
enterprise:
|
|
219
|
-
prisma:
|
|
130
|
+
enterprise: themes_namespaceObject.variables.errorColor,
|
|
131
|
+
prisma: themes_namespaceObject.variables.accentColorNegative
|
|
220
132
|
},
|
|
221
133
|
disabled: {
|
|
222
|
-
enterprise:
|
|
223
|
-
prisma:
|
|
134
|
+
enterprise: themes_namespaceObject.variables.textDisabledColor,
|
|
135
|
+
prisma: themes_namespaceObject.variables.contentColorDisabled
|
|
224
136
|
}
|
|
225
|
-
}),
|
|
226
|
-
enterprise:
|
|
137
|
+
}), (0,themes_namespaceObject.pick)({
|
|
138
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["calc((", " - ", ") / 2) 0"], themes_namespaceObject.variables.inputHeight, diameter),
|
|
227
139
|
prisma: {
|
|
228
140
|
compact: '6px 0',
|
|
229
141
|
comfortable: '10px 0'
|
|
230
142
|
}
|
|
231
|
-
}),
|
|
232
|
-
enterprise:
|
|
233
|
-
prisma:
|
|
143
|
+
}), (0,themes_namespaceObject.pick)({
|
|
144
|
+
enterprise: themes_namespaceObject.variables.spacingHalf,
|
|
145
|
+
prisma: themes_namespaceObject.variables.spacingSmall
|
|
234
146
|
}));
|
|
235
|
-
var StyledCheckboxClickable = external_styled_components_default()(Clickable_default
|
|
147
|
+
var StyledCheckboxClickable = external_styled_components_default()((Clickable_default())).withConfig({
|
|
236
148
|
displayName: "SwitchStyles__StyledCheckboxClickable",
|
|
237
149
|
componentId: "sc-844ieu-1"
|
|
238
|
-
})(["", " position:relative;width:", ";height:", ";line-height:", ";padding:2px;border-radius:2px;cursor:pointer;flex:0 0 auto;border:", ";color:", ";", " &:focus{box-shadow:", ";}", " ", " &[disabled]{cursor:not-allowed;border-color:", ";", "}"],
|
|
239
|
-
enterprise:
|
|
240
|
-
light:
|
|
241
|
-
dark:
|
|
150
|
+
})(["", " position:relative;width:", ";height:", ";line-height:", ";padding:2px;border-radius:2px;cursor:pointer;flex:0 0 auto;border:", ";color:", ";", " &:focus{box-shadow:", ";}", " ", " &[disabled]{cursor:not-allowed;border-color:", ";", "}"], themes_namespaceObject.mixins.reset('inline'), diameter, diameter, diameter, (0,themes_namespaceObject.pick)({
|
|
151
|
+
enterprise: (0,themes_namespaceObject.pick)({
|
|
152
|
+
light: (0,external_styled_components_namespaceObject.css)(["1px solid ", ""], themes_namespaceObject.variables.gray45),
|
|
153
|
+
dark: (0,external_styled_components_namespaceObject.css)(["1px solid ", ""], themes_namespaceObject.variables.gray80)
|
|
242
154
|
}),
|
|
243
|
-
prisma:
|
|
244
|
-
}),
|
|
245
|
-
enterprise:
|
|
246
|
-
light:
|
|
247
|
-
dark:
|
|
155
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["2px solid ", ""], themes_namespaceObject.variables.contentColorMuted)
|
|
156
|
+
}), (0,themes_namespaceObject.pick)({
|
|
157
|
+
enterprise: (0,themes_namespaceObject.pick)({
|
|
158
|
+
light: themes_namespaceObject.variables.gray45,
|
|
159
|
+
dark: themes_namespaceObject.variables.gray80
|
|
248
160
|
}),
|
|
249
|
-
prisma:
|
|
250
|
-
}),
|
|
251
|
-
prisma:
|
|
161
|
+
prisma: themes_namespaceObject.variables.white
|
|
162
|
+
}), (0,themes_namespaceObject.pick)({
|
|
163
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["top:1px;padding:1px;border-radius:3px;", " ", ""], function (_ref) {
|
|
252
164
|
var $interactive = _ref.$interactive;
|
|
253
|
-
return $interactive &&
|
|
165
|
+
return $interactive && (0,external_styled_components_namespaceObject.css)(["&:not([disabled]):not(:focus):hover{box-shadow:0 0 0 2px ", ",0 0 0 5px ", ";}"], themes_namespaceObject.variables.backgroundColorPage, themes_namespaceObject.variables.interactiveColorOverlayHover);
|
|
254
166
|
}, function (_ref2) {
|
|
255
167
|
var $selected = _ref2.$selected;
|
|
256
|
-
return !$selected &&
|
|
168
|
+
return !$selected && (0,external_styled_components_namespaceObject.css)(["&:not([disabled]):not(:focus):hover{border-color:", ";}"], themes_namespaceObject.variables.contentColorDefault);
|
|
257
169
|
})
|
|
258
|
-
}),
|
|
170
|
+
}), themes_namespaceObject.variables.focusShadow, function (_ref3) {
|
|
259
171
|
var $selected = _ref3.$selected;
|
|
260
|
-
return $selected &&
|
|
172
|
+
return $selected && (0,external_styled_components_namespaceObject.css)(["&:not([disabled]){border-color:", ";background-color:", ";}"], (0,themes_namespaceObject.pick)({
|
|
261
173
|
enterprise: {
|
|
262
|
-
light:
|
|
263
|
-
dark:
|
|
174
|
+
light: themes_namespaceObject.variables.gray45,
|
|
175
|
+
dark: themes_namespaceObject.variables.gray80
|
|
264
176
|
},
|
|
265
|
-
prisma:
|
|
266
|
-
}),
|
|
177
|
+
prisma: themes_namespaceObject.variables.interactiveColorPrimary
|
|
178
|
+
}), (0,themes_namespaceObject.pick)({
|
|
267
179
|
enterprise: '#none',
|
|
268
|
-
prisma:
|
|
180
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["", ";"], themes_namespaceObject.variables.interactiveColorPrimary)
|
|
269
181
|
}));
|
|
270
182
|
}, function (_ref4) {
|
|
271
183
|
var $error = _ref4.$error;
|
|
272
|
-
return $error &&
|
|
273
|
-
enterprise:
|
|
274
|
-
light:
|
|
184
|
+
return $error && (0,themes_namespaceObject.pick)({
|
|
185
|
+
enterprise: (0,themes_namespaceObject.pick)({
|
|
186
|
+
light: (0,external_styled_components_namespaceObject.css)(["&:not([disabled]){border-color:", ";color:", ";", "}"], themes_namespaceObject.variables.errorColorL30, themes_namespaceObject.variables.errorColor, function (_ref5) {
|
|
275
187
|
var $selected = _ref5.$selected;
|
|
276
|
-
return $selected &&
|
|
188
|
+
return $selected && (0,external_styled_components_namespaceObject.css)(["border-color:", ";"], themes_namespaceObject.variables.errorColor);
|
|
277
189
|
}),
|
|
278
|
-
dark:
|
|
190
|
+
dark: (0,external_styled_components_namespaceObject.css)(["border-color:", ";}"], themes_namespaceObject.variables.errorColor)
|
|
279
191
|
}),
|
|
280
|
-
prisma:
|
|
192
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["&:not([disabled]){border-color:", ";", "}"], themes_namespaceObject.variables.accentColorNegative, function (_ref6) {
|
|
281
193
|
var $selected = _ref6.$selected;
|
|
282
|
-
return $selected &&
|
|
194
|
+
return $selected && (0,external_styled_components_namespaceObject.css)(["background-color:", ";"], themes_namespaceObject.variables.accentColorNegative);
|
|
283
195
|
})
|
|
284
196
|
});
|
|
285
|
-
},
|
|
197
|
+
}, (0,themes_namespaceObject.pick)({
|
|
286
198
|
enterprise: {
|
|
287
|
-
light:
|
|
288
|
-
dark:
|
|
199
|
+
light: themes_namespaceObject.variables.borderColor,
|
|
200
|
+
dark: themes_namespaceObject.variables.gray45
|
|
289
201
|
},
|
|
290
|
-
prisma:
|
|
202
|
+
prisma: themes_namespaceObject.variables.contentColorDisabled
|
|
291
203
|
}), function (_ref7) {
|
|
292
204
|
var $selected = _ref7.$selected;
|
|
293
|
-
return $selected &&
|
|
294
|
-
prisma:
|
|
205
|
+
return $selected && (0,themes_namespaceObject.pick)({
|
|
206
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["border-color:transparent;background-color:", ";"], themes_namespaceObject.variables.interactiveColorBackgroundDisabled)
|
|
295
207
|
});
|
|
296
208
|
});
|
|
297
209
|
var StyledCheckboxSpan = StyledCheckboxClickable.withComponent('span');
|
|
298
|
-
var StyledSome = external_styled_components_default.
|
|
210
|
+
var StyledSome = external_styled_components_default().div.withConfig({
|
|
299
211
|
displayName: "SwitchStyles__StyledSome",
|
|
300
212
|
componentId: "sc-844ieu-2"
|
|
301
|
-
})(["display:block;margin:", ";height:", ";width:", ";background:currentColor;border-radius:1px;"],
|
|
213
|
+
})(["display:block;margin:", ";height:", ";width:", ";background:currentColor;border-radius:1px;"], (0,themes_namespaceObject.pick)({
|
|
302
214
|
enterprise: '2px',
|
|
303
215
|
prisma: '5px 2px'
|
|
304
|
-
}),
|
|
305
|
-
enterprise:
|
|
216
|
+
}), (0,themes_namespaceObject.pick)({
|
|
217
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["calc(", " - 10px);"], diameter),
|
|
306
218
|
prisma: '2px'
|
|
307
|
-
}),
|
|
308
|
-
enterprise:
|
|
219
|
+
}), (0,themes_namespaceObject.pick)({
|
|
220
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["calc(", " - 10px);"], diameter),
|
|
309
221
|
prisma: '8px'
|
|
310
222
|
}));
|
|
311
|
-
var StyledIndicator = external_styled_components_default.
|
|
223
|
+
var StyledIndicator = external_styled_components_default().div.withConfig({
|
|
312
224
|
displayName: "SwitchStyles__StyledIndicator",
|
|
313
225
|
componentId: "sc-844ieu-3"
|
|
314
|
-
})(["background-color:", ";border-color:", ";box-sizing:border-box;border-radius:50%;border-width:1px;position:absolute;left:-1px;top:-1px;", ";", " ", " ", ""],
|
|
226
|
+
})(["background-color:", ";border-color:", ";box-sizing:border-box;border-radius:50%;border-width:1px;position:absolute;left:-1px;top:-1px;", ";", " ", " ", ""], (0,themes_namespaceObject.pick)({
|
|
315
227
|
enterprise: {
|
|
316
|
-
light:
|
|
317
|
-
dark:
|
|
228
|
+
light: themes_namespaceObject.variables.gray98,
|
|
229
|
+
dark: themes_namespaceObject.variables.gray80
|
|
318
230
|
},
|
|
319
|
-
prisma:
|
|
320
|
-
}),
|
|
231
|
+
prisma: themes_namespaceObject.variables.white
|
|
232
|
+
}), (0,themes_namespaceObject.pick)({
|
|
321
233
|
enterprise: {
|
|
322
|
-
light:
|
|
323
|
-
dark:
|
|
234
|
+
light: themes_namespaceObject.variables.gray60,
|
|
235
|
+
dark: themes_namespaceObject.variables.borderColor
|
|
324
236
|
},
|
|
325
|
-
prisma:
|
|
237
|
+
prisma: themes_namespaceObject.variables.transparent
|
|
326
238
|
}), function (_ref8) {
|
|
327
239
|
var $delay = _ref8.$delay;
|
|
328
|
-
return $delay &&
|
|
329
|
-
},
|
|
330
|
-
enterprise:
|
|
331
|
-
prisma:
|
|
240
|
+
return $delay && (0,external_styled_components_namespaceObject.css)(["transition:left ", ";"], $delay);
|
|
241
|
+
}, (0,themes_namespaceObject.pick)({
|
|
242
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["width:", ";height:", ";border-style:solid;"], diameter, diameter),
|
|
243
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["height:16px;width:16px;margin:2px;border-style:none;box-shadow:", ";"], themes_namespaceObject.variables.embossShadow)
|
|
332
244
|
}), function (_ref9) {
|
|
333
245
|
var $disabled = _ref9.$disabled;
|
|
334
|
-
return $disabled &&
|
|
246
|
+
return $disabled && (0,external_styled_components_namespaceObject.css)(["border-color:", ";border-style:solid;background-color:", ";"], (0,themes_namespaceObject.pick)({
|
|
335
247
|
enterprise: {
|
|
336
|
-
light:
|
|
337
|
-
dark:
|
|
248
|
+
light: themes_namespaceObject.mixins.colorWithAlpha(themes_namespaceObject.variables.borderLightColor, 0.8),
|
|
249
|
+
dark: themes_namespaceObject.variables.gray22
|
|
338
250
|
},
|
|
339
|
-
prisma:
|
|
340
|
-
}),
|
|
251
|
+
prisma: themes_namespaceObject.variables.transparent
|
|
252
|
+
}), (0,themes_namespaceObject.pick)({
|
|
341
253
|
enterprise: {
|
|
342
|
-
dark:
|
|
254
|
+
dark: themes_namespaceObject.variables.gray45
|
|
343
255
|
},
|
|
344
|
-
prisma:
|
|
256
|
+
prisma: themes_namespaceObject.mixins.colorWithAlpha(themes_namespaceObject.variables.white, 0.3)
|
|
345
257
|
}));
|
|
346
258
|
}, function (_ref10) {
|
|
347
259
|
var $selected = _ref10.$selected;
|
|
348
|
-
return $selected &&
|
|
349
|
-
enterprise:
|
|
350
|
-
prisma:
|
|
260
|
+
return $selected && (0,external_styled_components_namespaceObject.css)(["left:", ";"], (0,themes_namespaceObject.pick)({
|
|
261
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["calc(100% - ", " + 1px)"], diameter),
|
|
262
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["calc(100% - ", " + 1px)"], toggleDiameter)
|
|
351
263
|
}));
|
|
352
264
|
});
|
|
353
|
-
var StyledToggleOutline = external_styled_components_default.
|
|
265
|
+
var StyledToggleOutline = external_styled_components_default().div.withConfig({
|
|
354
266
|
displayName: "SwitchStyles__StyledToggleOutline",
|
|
355
267
|
componentId: "sc-844ieu-4"
|
|
356
268
|
})(["position:absolute;border:1px solid transparent;", ";border-radius:", ";top:-1px;right:-1px;bottom:-1px;left:-1px;z-index:1;", " ", ""], function (_ref11) {
|
|
357
269
|
var $delay = _ref11.$delay;
|
|
358
|
-
return $delay &&
|
|
359
|
-
},
|
|
360
|
-
enterprise:
|
|
270
|
+
return $delay && (0,external_styled_components_namespaceObject.css)(["transition:border-color ", ";"], $delay);
|
|
271
|
+
}, (0,themes_namespaceObject.pick)({
|
|
272
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["calc(", " * 0.5)"], diameter),
|
|
361
273
|
prisma: '15px'
|
|
362
|
-
}),
|
|
363
|
-
prisma:
|
|
274
|
+
}), (0,themes_namespaceObject.pick)({
|
|
275
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["margin:-6px;"])
|
|
364
276
|
}), function (_ref12) {
|
|
365
277
|
var $error = _ref12.$error;
|
|
366
|
-
return $error &&
|
|
367
|
-
enterprise:
|
|
368
|
-
prisma:
|
|
278
|
+
return $error && (0,external_styled_components_namespaceObject.css)(["border-color:", ";"], (0,themes_namespaceObject.pick)({
|
|
279
|
+
enterprise: themes_namespaceObject.variables.errorColor,
|
|
280
|
+
prisma: themes_namespaceObject.variables.transparent
|
|
369
281
|
}));
|
|
370
282
|
});
|
|
371
|
-
var StyledToggleClickable = external_styled_components_default()(Clickable_default
|
|
283
|
+
var StyledToggleClickable = external_styled_components_default()((Clickable_default())).withConfig({
|
|
372
284
|
displayName: "SwitchStyles__StyledToggleClickable",
|
|
373
285
|
componentId: "sc-844ieu-5"
|
|
374
|
-
})(["position:relative;", " border-radius:", ";transition:background-color ", ";flex:0 0 auto;border:1px solid ", ";", " &:not([disabled]){&:focus{outline:0;box-shadow:", ";", "}&:hover ", "{background-color:", ";}&:hover ", "{background-color:", ";}};&[disabled]{border:1px solid ", ";background-color:", ";", " ", "}", ";", ""],
|
|
375
|
-
enterprise:
|
|
376
|
-
light:
|
|
377
|
-
dark:
|
|
286
|
+
})(["position:relative;", " border-radius:", ";transition:background-color ", ";flex:0 0 auto;border:1px solid ", ";", " &:not([disabled]){&:focus{outline:0;box-shadow:", ";", "}&:hover ", "{background-color:", ";}&:hover ", "{background-color:", ";}};&[disabled]{border:1px solid ", ";background-color:", ";", " ", "}", ";", ""], (0,themes_namespaceObject.pick)({
|
|
287
|
+
enterprise: (0,themes_namespaceObject.pick)({
|
|
288
|
+
light: (0,external_styled_components_namespaceObject.css)(["width:calc(", " * 2);background-color:", ";height:", ";"], diameter, themes_namespaceObject.variables.gray98, diameter),
|
|
289
|
+
dark: (0,external_styled_components_namespaceObject.css)(["width:calc(", " * 2);background-color:", ";height:", ";"], diameter, themes_namespaceObject.variables.gray45, diameter)
|
|
378
290
|
}),
|
|
379
|
-
prisma:
|
|
291
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["width:32px;background-color:", ";height:", ";top:1px;"], themes_namespaceObject.variables.contentColorMuted, toggleDiameter)
|
|
380
292
|
}), diameter, function (props) {
|
|
381
293
|
return props.$delay;
|
|
382
|
-
},
|
|
294
|
+
}, (0,themes_namespaceObject.pick)({
|
|
383
295
|
enterprise: {
|
|
384
|
-
light:
|
|
385
|
-
dark:
|
|
296
|
+
light: themes_namespaceObject.variables.gray60,
|
|
297
|
+
dark: themes_namespaceObject.variables.borderColor
|
|
386
298
|
},
|
|
387
|
-
prisma:
|
|
388
|
-
}),
|
|
389
|
-
enterprise:
|
|
390
|
-
}),
|
|
391
|
-
enterprise:
|
|
392
|
-
prisma:
|
|
393
|
-
}),
|
|
394
|
-
enterprise:
|
|
299
|
+
prisma: themes_namespaceObject.variables.transparent
|
|
300
|
+
}), (0,themes_namespaceObject.pick)({
|
|
301
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["box-shadow:inset 0 2px 0 rgba(0,0,0,0.1);"])
|
|
302
|
+
}), (0,themes_namespaceObject.pick)({
|
|
303
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["", ",inset 0 2px 0 rgba(0,0,0,0.1);"], themes_namespaceObject.variables.focusShadow),
|
|
304
|
+
prisma: themes_namespaceObject.variables.focusShadow
|
|
305
|
+
}), (0,themes_namespaceObject.pick)({
|
|
306
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["> ", "{border-color:", ";}"],
|
|
395
307
|
/* sc-sel */
|
|
396
|
-
StyledToggleOutline,
|
|
308
|
+
StyledToggleOutline, themes_namespaceObject.mixins.colorWithAlpha(themes_namespaceObject.variables.focusColor, 0.8))
|
|
397
309
|
}),
|
|
398
310
|
/* sc-sel */
|
|
399
|
-
StyledIndicator,
|
|
400
|
-
enterprise:
|
|
401
|
-
light:
|
|
311
|
+
StyledIndicator, (0,themes_namespaceObject.pick)({
|
|
312
|
+
enterprise: (0,themes_namespaceObject.pick)({
|
|
313
|
+
light: themes_namespaceObject.variables.gray96,
|
|
402
314
|
dark: '#b1bcc7'
|
|
403
315
|
}),
|
|
404
|
-
prisma:
|
|
316
|
+
prisma: themes_namespaceObject.variables.white
|
|
405
317
|
}),
|
|
406
318
|
/* sc-sel */
|
|
407
|
-
StyledToggleOutline,
|
|
408
|
-
prisma:
|
|
409
|
-
}),
|
|
319
|
+
StyledToggleOutline, (0,themes_namespaceObject.pick)({
|
|
320
|
+
prisma: themes_namespaceObject.variables.interactiveColorOverlayHover
|
|
321
|
+
}), (0,themes_namespaceObject.pick)({
|
|
410
322
|
enterprise: {
|
|
411
|
-
light:
|
|
412
|
-
dark:
|
|
323
|
+
light: themes_namespaceObject.variables.borderLightColor,
|
|
324
|
+
dark: themes_namespaceObject.variables.borderColor
|
|
413
325
|
},
|
|
414
|
-
prisma:
|
|
415
|
-
}),
|
|
326
|
+
prisma: themes_namespaceObject.variables.transparent
|
|
327
|
+
}), (0,themes_namespaceObject.pick)({
|
|
416
328
|
enterprise: {
|
|
417
|
-
light:
|
|
418
|
-
dark:
|
|
329
|
+
light: themes_namespaceObject.variables.gray96,
|
|
330
|
+
dark: themes_namespaceObject.variables.gray30
|
|
419
331
|
},
|
|
420
|
-
prisma:
|
|
421
|
-
}),
|
|
422
|
-
enterprise:
|
|
332
|
+
prisma: themes_namespaceObject.variables.interactiveColorBackgroundDisabled
|
|
333
|
+
}), (0,themes_namespaceObject.pick)({
|
|
334
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["box-shadow:inset 0 2px 0 rgba(0,0,0,0.06);"])
|
|
423
335
|
}), function (_ref13) {
|
|
424
336
|
var $selected = _ref13.$selected;
|
|
425
|
-
return $selected &&
|
|
426
|
-
enterprise:
|
|
427
|
-
light:
|
|
428
|
-
dark:
|
|
337
|
+
return $selected && (0,external_styled_components_namespaceObject.css)(["border-color:transparent;background-color:", ";"], (0,themes_namespaceObject.pick)({
|
|
338
|
+
enterprise: (0,themes_namespaceObject.pick)({
|
|
339
|
+
light: themes_namespaceObject.variables.accentColorL40,
|
|
340
|
+
dark: themes_namespaceObject.variables.accentColorD20
|
|
429
341
|
}),
|
|
430
|
-
prisma:
|
|
342
|
+
prisma: themes_namespaceObject.mixins.colorWithAlpha(themes_namespaceObject.variables.interactiveColorPrimary, 0.7)
|
|
431
343
|
}));
|
|
432
344
|
}, function (_ref14) {
|
|
433
345
|
var $selected = _ref14.$selected;
|
|
434
|
-
return $selected &&
|
|
435
|
-
enterprise:
|
|
436
|
-
prisma:
|
|
437
|
-
}),
|
|
438
|
-
enterprise:
|
|
439
|
-
prisma:
|
|
440
|
-
}),
|
|
441
|
-
prisma:
|
|
346
|
+
return $selected && (0,external_styled_components_namespaceObject.css)(["border-color:", ";background-color:", ";", ""], (0,themes_namespaceObject.pick)({
|
|
347
|
+
enterprise: themes_namespaceObject.variables.accentColorL10,
|
|
348
|
+
prisma: themes_namespaceObject.variables.transparent
|
|
349
|
+
}), (0,themes_namespaceObject.pick)({
|
|
350
|
+
enterprise: themes_namespaceObject.variables.accentColorL10,
|
|
351
|
+
prisma: themes_namespaceObject.variables.interactiveColorPrimary
|
|
352
|
+
}), (0,themes_namespaceObject.pick)({
|
|
353
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["box-shadow:", ";"], themes_namespaceObject.variables.embossShadow)
|
|
442
354
|
}));
|
|
443
355
|
}, function (_ref15) {
|
|
444
356
|
var $error = _ref15.$error;
|
|
445
|
-
return $error &&
|
|
446
|
-
enterprise:
|
|
447
|
-
prisma:
|
|
448
|
-
}),
|
|
449
|
-
prisma:
|
|
357
|
+
return $error && (0,external_styled_components_namespaceObject.css)(["border-color:", ";", ";"], (0,themes_namespaceObject.pick)({
|
|
358
|
+
enterprise: themes_namespaceObject.variables.errorColor,
|
|
359
|
+
prisma: themes_namespaceObject.variables.transparent
|
|
360
|
+
}), (0,themes_namespaceObject.pick)({
|
|
361
|
+
prisma: (0,external_styled_components_namespaceObject.css)(["background-color:", ";"], themes_namespaceObject.variables.accentColorNegative)
|
|
450
362
|
}));
|
|
451
363
|
});
|
|
452
364
|
var StyledToggleSpan = StyledToggleClickable.withComponent('span');
|
|
453
|
-
var StyledLabel = external_styled_components_default.
|
|
365
|
+
var StyledLabel = external_styled_components_default().label.withConfig({
|
|
454
366
|
displayName: "SwitchStyles__StyledLabel",
|
|
455
367
|
componentId: "sc-844ieu-6"
|
|
456
|
-
})(["", " flex:1 1 auto;padding-left:", ";color:inherit;", ";"],
|
|
457
|
-
enterprise:
|
|
368
|
+
})(["", " flex:1 1 auto;padding-left:", ";color:inherit;", ";"], themes_namespaceObject.mixins.reset('inline-block'), (0,themes_namespaceObject.pick)({
|
|
369
|
+
enterprise: (0,external_styled_components_namespaceObject.css)(["", ";"], themes_namespaceObject.variables.spacingQuarter),
|
|
458
370
|
prisma: '8px'
|
|
459
371
|
}), function (_ref16) {
|
|
460
372
|
var $disabled = _ref16.$disabled;
|
|
461
|
-
return !$disabled &&
|
|
373
|
+
return !$disabled && (0,external_styled_components_namespaceObject.css)(["cursor:pointer;"]);
|
|
462
374
|
});
|
|
463
375
|
|
|
464
|
-
|
|
376
|
+
;// CONCATENATED MODULE: ./src/Switch/Switch.tsx
|
|
465
377
|
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); }
|
|
466
378
|
|
|
467
379
|
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); }
|
|
@@ -500,26 +412,26 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
500
412
|
|
|
501
413
|
|
|
502
414
|
var propTypes = {
|
|
503
|
-
appearance: external_prop_types_default.
|
|
504
|
-
children: external_prop_types_default.
|
|
505
|
-
disabled: external_prop_types_default.
|
|
506
|
-
elementRef: external_prop_types_default.
|
|
507
|
-
error: external_prop_types_default.
|
|
508
|
-
id: external_prop_types_default.
|
|
509
|
-
inline: external_prop_types_default.
|
|
415
|
+
appearance: external_prop_types_default().oneOf(['checkbox', 'toggle']),
|
|
416
|
+
children: (external_prop_types_default()).node,
|
|
417
|
+
disabled: (external_prop_types_default()).bool,
|
|
418
|
+
elementRef: external_prop_types_default().oneOfType([(external_prop_types_default()).func, (external_prop_types_default()).object]),
|
|
419
|
+
error: (external_prop_types_default()).bool,
|
|
420
|
+
id: (external_prop_types_default()).string,
|
|
421
|
+
inline: (external_prop_types_default()).bool,
|
|
510
422
|
|
|
511
423
|
/** @private */
|
|
512
|
-
interactive: external_prop_types_default.
|
|
513
|
-
labelledBy: external_prop_types_default.
|
|
514
|
-
onClick: external_prop_types_default.
|
|
424
|
+
interactive: (external_prop_types_default()).bool,
|
|
425
|
+
labelledBy: (external_prop_types_default()).string,
|
|
426
|
+
onClick: (external_prop_types_default()).func,
|
|
515
427
|
|
|
516
428
|
/** @private. */
|
|
517
|
-
required: external_prop_types_default.
|
|
518
|
-
selected: external_prop_types_default.
|
|
519
|
-
selectedLabel: external_prop_types_default.
|
|
520
|
-
someSelectedLabel: external_prop_types_default.
|
|
521
|
-
unselectedLabel: external_prop_types_default.
|
|
522
|
-
value: external_prop_types_default.
|
|
429
|
+
required: (external_prop_types_default()).bool,
|
|
430
|
+
selected: external_prop_types_default().oneOf([true, false, 'some']),
|
|
431
|
+
selectedLabel: (external_prop_types_default()).string,
|
|
432
|
+
someSelectedLabel: (external_prop_types_default()).string,
|
|
433
|
+
unselectedLabel: (external_prop_types_default()).string,
|
|
434
|
+
value: (external_prop_types_default()).any
|
|
523
435
|
};
|
|
524
436
|
var defaultProps = {
|
|
525
437
|
appearance: 'checkbox',
|
|
@@ -542,7 +454,7 @@ var StyledSpans = {
|
|
|
542
454
|
* `Switch` is a basic form control with an on/off state.
|
|
543
455
|
*/
|
|
544
456
|
|
|
545
|
-
var
|
|
457
|
+
var Switch = /*#__PURE__*/function (_Component) {
|
|
546
458
|
_inherits(Switch, _Component);
|
|
547
459
|
|
|
548
460
|
var _super = _createSuper(Switch);
|
|
@@ -586,8 +498,8 @@ var Switch_Switch = /*#__PURE__*/function (_Component) {
|
|
|
586
498
|
});
|
|
587
499
|
});
|
|
588
500
|
|
|
589
|
-
_this.labelId =
|
|
590
|
-
_this.clickableId =
|
|
501
|
+
_this.labelId = (0,id_namespaceObject.createDOMID)('label');
|
|
502
|
+
_this.clickableId = (0,id_namespaceObject.createDOMID)('clickable');
|
|
591
503
|
Switch.validateProps(props);
|
|
592
504
|
return _this;
|
|
593
505
|
}
|
|
@@ -665,36 +577,36 @@ var Switch_Switch = /*#__PURE__*/function (_Component) {
|
|
|
665
577
|
|
|
666
578
|
var renderToggle = function renderToggle(delay) {
|
|
667
579
|
return function () {
|
|
668
|
-
var toggleChildren = /*#__PURE__*/external_react_default.
|
|
580
|
+
var toggleChildren = /*#__PURE__*/external_react_default().createElement((external_react_default()).Fragment, null, /*#__PURE__*/external_react_default().createElement(StyledIndicator, {
|
|
669
581
|
$delay: delay,
|
|
670
582
|
$disabled: disabled,
|
|
671
583
|
$error: !disabled && error,
|
|
672
584
|
$selected: selected
|
|
673
|
-
}), /*#__PURE__*/external_react_default.
|
|
585
|
+
}), /*#__PURE__*/external_react_default().createElement(StyledToggleOutline, {
|
|
674
586
|
$delay: delay,
|
|
675
587
|
$error: !disabled && error
|
|
676
588
|
}));
|
|
677
|
-
return interactive ? /*#__PURE__*/external_react_default.
|
|
589
|
+
return interactive ? /*#__PURE__*/external_react_default().createElement(StyledClickable, _extends({
|
|
678
590
|
role: "switch"
|
|
679
591
|
}, switchProps, {
|
|
680
592
|
$delay: delay
|
|
681
|
-
}), toggleChildren) : /*#__PURE__*/external_react_default.
|
|
593
|
+
}), toggleChildren) : /*#__PURE__*/external_react_default().createElement(StyledSpan, _extends({}, switchProps, {
|
|
682
594
|
$delay: delay
|
|
683
595
|
}), toggleChildren);
|
|
684
596
|
};
|
|
685
597
|
};
|
|
686
598
|
|
|
687
599
|
var renderNonToggle = function renderNonToggle() {
|
|
688
|
-
var nonToggleChildren = /*#__PURE__*/external_react_default.
|
|
689
|
-
return interactive ? /*#__PURE__*/external_react_default.
|
|
600
|
+
var nonToggleChildren = /*#__PURE__*/external_react_default().createElement((external_react_default()).Fragment, null, selected === true && appearance === 'checkbox' && /*#__PURE__*/external_react_default().createElement(CheckIcon, null), selected === 'some' && appearance === 'checkbox' && /*#__PURE__*/external_react_default().createElement(StyledSome, null));
|
|
601
|
+
return interactive ? /*#__PURE__*/external_react_default().createElement(StyledClickable, _extends({
|
|
690
602
|
"data-clickable": true,
|
|
691
603
|
role: appearance
|
|
692
|
-
}, switchProps), nonToggleChildren) : /*#__PURE__*/external_react_default.
|
|
604
|
+
}, switchProps), nonToggleChildren) : /*#__PURE__*/external_react_default().createElement(StyledSpan, switchProps, nonToggleChildren);
|
|
693
605
|
};
|
|
694
606
|
|
|
695
607
|
var switchState = disabled && 'disabled' || error && 'error' || null;
|
|
696
608
|
var hasCustomizedScreenReaderContent = !!selectedLabel || !!someSelectedLabel || !!unselectedLabel;
|
|
697
|
-
return /*#__PURE__*/external_react_default.
|
|
609
|
+
return /*#__PURE__*/external_react_default().createElement(StyledBox, _extends({
|
|
698
610
|
flex: true,
|
|
699
611
|
inline: inline,
|
|
700
612
|
"data-test": "switch",
|
|
@@ -704,10 +616,10 @@ var Switch_Switch = /*#__PURE__*/function (_Component) {
|
|
|
704
616
|
"data-error": error ? true : undefined,
|
|
705
617
|
"data-disabled": disabled ? true : undefined,
|
|
706
618
|
$switchState: switchState
|
|
707
|
-
}, otherProps), appearance === 'toggle' && /*#__PURE__*/external_react_default.
|
|
619
|
+
}, otherProps), appearance === 'toggle' && /*#__PURE__*/external_react_default().createElement((AnimationToggle_default()), {
|
|
708
620
|
on: renderToggle('200ms'),
|
|
709
621
|
off: renderToggle()
|
|
710
|
-
}), appearance !== 'toggle' && renderNonToggle(), interactive && hasCustomizedScreenReaderContent && /*#__PURE__*/external_react_default.
|
|
622
|
+
}), appearance !== 'toggle' && renderNonToggle(), interactive && hasCustomizedScreenReaderContent && /*#__PURE__*/external_react_default().createElement((ScreenReaderContent_default()), null, stateLabels["".concat(selected)]), children && /*#__PURE__*/external_react_default().createElement(StyledLabel, {
|
|
711
623
|
$disabled: disabled,
|
|
712
624
|
"data-test": "label",
|
|
713
625
|
id: labelId,
|
|
@@ -718,52 +630,16 @@ var Switch_Switch = /*#__PURE__*/function (_Component) {
|
|
|
718
630
|
}]);
|
|
719
631
|
|
|
720
632
|
return Switch;
|
|
721
|
-
}(
|
|
722
|
-
|
|
723
|
-
_defineProperty(Switch_Switch, "propTypes", propTypes);
|
|
724
|
-
|
|
725
|
-
_defineProperty(Switch_Switch, "defaultProps", defaultProps);
|
|
726
|
-
|
|
727
|
-
/* harmony default export */ var src_Switch_Switch = (Switch_Switch);
|
|
728
|
-
// CONCATENATED MODULE: ./src/Switch/index.ts
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
/***/ }),
|
|
733
|
-
|
|
734
|
-
/***/ 3:
|
|
735
|
-
/***/ (function(module, exports) {
|
|
736
|
-
|
|
737
|
-
module.exports = require("styled-components");
|
|
738
|
-
|
|
739
|
-
/***/ }),
|
|
740
|
-
|
|
741
|
-
/***/ 51:
|
|
742
|
-
/***/ (function(module, exports) {
|
|
743
|
-
|
|
744
|
-
module.exports = require("@splunk/react-ui/AnimationToggle");
|
|
745
|
-
|
|
746
|
-
/***/ }),
|
|
747
|
-
|
|
748
|
-
/***/ 6:
|
|
749
|
-
/***/ (function(module, exports) {
|
|
750
|
-
|
|
751
|
-
module.exports = require("@splunk/react-ui/Box");
|
|
752
|
-
|
|
753
|
-
/***/ }),
|
|
754
|
-
|
|
755
|
-
/***/ 8:
|
|
756
|
-
/***/ (function(module, exports) {
|
|
757
|
-
|
|
758
|
-
module.exports = require("@splunk/ui-utils/id");
|
|
633
|
+
}(external_react_namespaceObject.Component);
|
|
759
634
|
|
|
760
|
-
|
|
635
|
+
_defineProperty(Switch, "propTypes", propTypes);
|
|
761
636
|
|
|
762
|
-
|
|
763
|
-
/***/ (function(module, exports) {
|
|
637
|
+
_defineProperty(Switch, "defaultProps", defaultProps);
|
|
764
638
|
|
|
765
|
-
|
|
639
|
+
/* harmony default export */ const Switch_Switch = (Switch);
|
|
640
|
+
;// CONCATENATED MODULE: ./src/Switch/index.ts
|
|
766
641
|
|
|
767
|
-
/***/ })
|
|
768
642
|
|
|
769
|
-
|
|
643
|
+
module.exports = __webpack_exports__;
|
|
644
|
+
/******/ })()
|
|
645
|
+
;
|