@carbon/react 1.5.0 → 1.6.0-rc.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.
Files changed (33) hide show
  1. package/es/components/ComposedModal/ComposedModal.js +2 -1
  2. package/es/components/ComposedModal/next/ComposedModal.js +2 -1
  3. package/es/components/DatePicker/DatePicker.js +14 -5
  4. package/es/components/FileUploader/FileUploader.js +1 -1
  5. package/es/components/FileUploader/FileUploaderButton.js +1 -1
  6. package/es/components/FileUploader/Filename.js +1 -1
  7. package/es/components/Link/Link.js +6 -3
  8. package/es/components/ListBox/ListBoxPropTypes.js +1 -2
  9. package/es/components/ListBox/ListBoxSelection.js +3 -4
  10. package/es/components/RadioButton/next/RadioButton.js +2 -1
  11. package/es/components/Tabs/next/Tabs.js +42 -4
  12. package/es/components/Toggle/Toggle.js +147 -109
  13. package/es/components/UIShell/SideNav.js +3 -3
  14. package/es/index.js +3 -2
  15. package/lib/components/ComposedModal/ComposedModal.js +2 -1
  16. package/lib/components/ComposedModal/next/ComposedModal.js +2 -1
  17. package/lib/components/DatePicker/DatePicker.js +14 -5
  18. package/lib/components/FileUploader/FileUploader.js +1 -1
  19. package/lib/components/FileUploader/FileUploaderButton.js +1 -1
  20. package/lib/components/FileUploader/Filename.js +1 -1
  21. package/lib/components/Link/Link.js +6 -3
  22. package/lib/components/ListBox/ListBoxPropTypes.js +1 -21
  23. package/lib/components/ListBox/ListBoxSelection.js +3 -4
  24. package/lib/components/RadioButton/next/RadioButton.js +2 -1
  25. package/lib/components/Tabs/next/Tabs.js +42 -4
  26. package/lib/components/Toggle/Toggle.js +146 -107
  27. package/lib/components/UIShell/SideNav.js +3 -3
  28. package/lib/index.js +70 -68
  29. package/package.json +3 -3
  30. package/es/components/Toggle/index.js +0 -19
  31. package/es/components/Toggle/next/Toggle.js +0 -158
  32. package/lib/components/Toggle/index.js +0 -23
  33. package/lib/components/Toggle/next/Toggle.js +0 -169
package/lib/index.js CHANGED
@@ -18,16 +18,16 @@ var Button = require('./components/Button/Button.js');
18
18
  var ButtonSet = require('./components/ButtonSet/ButtonSet.js');
19
19
  var Checkbox_Skeleton = require('./components/Checkbox/Checkbox.Skeleton.js');
20
20
  var Checkbox = require('./components/Checkbox/Checkbox.js');
21
- var index$g = require('./components/ClassPrefix/index.js');
21
+ var index$f = require('./components/ClassPrefix/index.js');
22
22
  var CodeSnippet_Skeleton = require('./components/CodeSnippet/CodeSnippet.Skeleton.js');
23
23
  var CodeSnippet = require('./components/CodeSnippet/CodeSnippet.js');
24
24
  var ComboBox = require('./components/ComboBox/ComboBox.js');
25
- var index$h = require('./components/ComposedModal/index.js');
25
+ var index$g = require('./components/ComposedModal/index.js');
26
26
  var index = require('./components/ContentSwitcher/index.js');
27
27
  var Copy = require('./components/Copy/Copy.js');
28
28
  var CopyButton = require('./components/CopyButton/CopyButton.js');
29
29
  var DangerButton = require('./components/DangerButton/DangerButton.js');
30
- var index$i = require('./components/DataTable/index.js');
30
+ var index$h = require('./components/DataTable/index.js');
31
31
  var DatePicker_Skeleton = require('./components/DatePicker/DatePicker.Skeleton.js');
32
32
  var DatePicker = require('./components/DatePicker/DatePicker.js');
33
33
  var DatePickerInput = require('./components/DatePickerInput/DatePickerInput.js');
@@ -45,8 +45,8 @@ var ListItem = require('./components/ListItem/ListItem.js');
45
45
  var Loading = require('./components/Loading/Loading.js');
46
46
  var index$2 = require('./components/Modal/index.js');
47
47
  var ModalWrapper = require('./components/ModalWrapper/ModalWrapper.js');
48
- var index$j = require('./components/MultiSelect/index.js');
49
- var index$k = require('./components/Notification/index.js');
48
+ var index$i = require('./components/MultiSelect/index.js');
49
+ var index$j = require('./components/Notification/index.js');
50
50
  var NumberInput_Skeleton = require('./components/NumberInput/NumberInput.Skeleton.js');
51
51
  var NumberInput = require('./components/NumberInput/NumberInput.js');
52
52
  var OrderedList = require('./components/OrderedList/OrderedList.js');
@@ -55,7 +55,7 @@ var index$4 = require('./components/OverflowMenuItem/index.js');
55
55
  var index$5 = require('./components/Pagination/index.js');
56
56
  var PaginationNav = require('./components/PaginationNav/PaginationNav.js');
57
57
  var PrimaryButton = require('./components/PrimaryButton/PrimaryButton.js');
58
- var index$l = require('./components/ProgressIndicator/index.js');
58
+ var index$k = require('./components/ProgressIndicator/index.js');
59
59
  var index$6 = require('./components/RadioButton/index.js');
60
60
  var index$7 = require('./components/RadioButtonGroup/index.js');
61
61
  var index$8 = require('./components/Search/index.js');
@@ -69,7 +69,7 @@ var SelectItem = require('./components/SelectItem/SelectItem.js');
69
69
  var SelectItemGroup = require('./components/SelectItemGroup/SelectItemGroup.js');
70
70
  var Switch = require('./components/Switch/Switch.js');
71
71
  var index$9 = require('./components/Slider/index.js');
72
- var index$m = require('./components/StructuredList/index.js');
72
+ var index$l = require('./components/StructuredList/index.js');
73
73
  var index$a = require('./components/Tab/index.js');
74
74
  var TabContent = require('./components/TabContent/TabContent.js');
75
75
  var index$b = require('./components/Tabs/index.js');
@@ -78,13 +78,14 @@ var Tag = require('./components/Tag/Tag.js');
78
78
  var TextArea_Skeleton = require('./components/TextArea/TextArea.Skeleton.js');
79
79
  var TextArea = require('./components/TextArea/TextArea.js');
80
80
  require('./components/TextInput/index.js');
81
- var index$n = require('./components/Tile/index.js');
81
+ var index$m = require('./components/Tile/index.js');
82
82
  var RadioTile = require('./components/RadioTile/RadioTile.js');
83
83
  var index$c = require('./components/TileGroup/index.js');
84
84
  var index$d = require('./components/TimePicker/index.js');
85
85
  var index$e = require('./components/TimePickerSelect/index.js');
86
- var index$f = require('./components/Toggle/index.js');
87
- var index$o = require('./components/Toggletip/index.js');
86
+ var Toggle_Skeleton = require('./components/Toggle/Toggle.Skeleton.js');
87
+ var Toggle = require('./components/Toggle/Toggle.js');
88
+ var index$n = require('./components/Toggletip/index.js');
88
89
  var UnorderedList = require('./components/UnorderedList/UnorderedList.js');
89
90
  var SkeletonText = require('./components/SkeletonText/SkeletonText.js');
90
91
  var SkeletonPlaceholder = require('./components/SkeletonPlaceholder/SkeletonPlaceholder.js');
@@ -99,21 +100,21 @@ var Search_Skeleton = require('./components/Search/Search.Skeleton.js');
99
100
  var Slider_Skeleton = require('./components/Slider/Slider.Skeleton.js');
100
101
  var Tabs_Skeleton = require('./components/Tabs/Tabs.Skeleton.js');
101
102
  var TextInput_Skeleton = require('./components/TextInput/TextInput.Skeleton.js');
102
- var Toggle_Skeleton = require('./components/Toggle/Toggle.Skeleton.js');
103
103
  var ToggleSmall_Skeleton = require('./components/ToggleSmall/ToggleSmall.Skeleton.js');
104
104
  var Icon_Skeleton = require('./components/Icon/Icon.Skeleton.js');
105
- var index$p = require('./components/UIShell/index.js');
106
- var index$q = require('./components/FeatureFlags/index.js');
107
- var index$r = require('./components/Heading/index.js');
108
- var index$s = require('./components/IconButton/index.js');
109
- var index$t = require('./components/Layer/index.js');
105
+ var index$o = require('./components/UIShell/index.js');
106
+ var index$p = require('./components/FeatureFlags/index.js');
107
+ var index$q = require('./components/Heading/index.js');
108
+ var index$r = require('./components/IconButton/index.js');
109
+ var index$s = require('./components/Layer/index.js');
110
110
  require('./components/Menu/index.js');
111
- var index$u = require('./components/OverflowMenuV2/index.js');
112
- var index$v = require('./components/Popover/index.js');
113
- var index$w = require('./components/Stack/index.js');
111
+ var index$t = require('./components/OverflowMenuV2/index.js');
112
+ var index$u = require('./components/Popover/index.js');
113
+ var index$v = require('./components/Stack/index.js');
114
114
  var DefinitionTooltip = require('./components/Tooltip/next/DefinitionTooltip.js');
115
115
  require('./components/TreeView/index.js');
116
- var index$x = require('./components/Theme/index.js');
116
+ var index$w = require('./components/Theme/index.js');
117
+ var usePrefix = require('./internal/usePrefix.js');
117
118
  var AspectRatio = require('./components/AspectRatio/AspectRatio.js');
118
119
  var Filename = require('./components/FileUploader/Filename.js');
119
120
  var FileUploaderButton = require('./components/FileUploader/FileUploaderButton.js');
@@ -208,17 +209,17 @@ exports.Button = Button["default"];
208
209
  exports.ButtonSet = ButtonSet["default"];
209
210
  exports.CheckboxSkeleton = Checkbox_Skeleton["default"];
210
211
  exports.Checkbox = Checkbox["default"];
211
- exports.ClassPrefix = index$g.ClassPrefix;
212
+ exports.ClassPrefix = index$f.ClassPrefix;
212
213
  exports.CodeSnippetSkeleton = CodeSnippet_Skeleton["default"];
213
214
  exports.CodeSnippet = CodeSnippet["default"];
214
215
  exports.ComboBox = ComboBox["default"];
215
- exports.ModalFooter = index$h.ModalFooter;
216
- exports.ModalHeader = index$h.ModalHeader;
216
+ exports.ModalFooter = index$g.ModalFooter;
217
+ exports.ModalHeader = index$g.ModalHeader;
217
218
  exports.ContentSwitcher = index["default"];
218
219
  exports.Copy = Copy["default"];
219
220
  exports.CopyButton = CopyButton["default"];
220
221
  exports.DangerButton = DangerButton["default"];
221
- exports.DataTable = index$i["default"];
222
+ exports.DataTable = index$h["default"];
222
223
  exports.DatePickerSkeleton = DatePicker_Skeleton["default"];
223
224
  exports.DatePicker = DatePicker["default"];
224
225
  exports.DatePickerInput = DatePickerInput["default"];
@@ -236,13 +237,13 @@ exports.ListItem = ListItem["default"];
236
237
  exports.Loading = Loading["default"];
237
238
  exports.Modal = index$2["default"];
238
239
  exports.ModalWrapper = ModalWrapper["default"];
239
- exports.FilterableMultiSelect = index$j.FilterableMultiSelect;
240
- exports.ActionableNotification = index$k.ActionableNotification;
241
- exports.InlineNotification = index$k.InlineNotification;
242
- exports.NotificationActionButton = index$k.NotificationActionButton;
243
- exports.NotificationButton = index$k.NotificationButton;
244
- exports.NotificationTextDetails = index$k.NotificationTextDetails;
245
- exports.ToastNotification = index$k.ToastNotification;
240
+ exports.FilterableMultiSelect = index$i.FilterableMultiSelect;
241
+ exports.ActionableNotification = index$j.ActionableNotification;
242
+ exports.InlineNotification = index$j.InlineNotification;
243
+ exports.NotificationActionButton = index$j.NotificationActionButton;
244
+ exports.NotificationButton = index$j.NotificationButton;
245
+ exports.NotificationTextDetails = index$j.NotificationTextDetails;
246
+ exports.ToastNotification = index$j.ToastNotification;
246
247
  exports.NumberInputSkeleton = NumberInput_Skeleton["default"];
247
248
  exports.NumberInput = NumberInput["default"];
248
249
  exports.OrderedList = OrderedList["default"];
@@ -251,7 +252,7 @@ exports.OverflowMenuItem = index$4["default"];
251
252
  exports.Pagination = index$5["default"];
252
253
  exports.PaginationNav = PaginationNav["default"];
253
254
  exports.PrimaryButton = PrimaryButton["default"];
254
- exports.ProgressIndicator = index$l.ProgressIndicator;
255
+ exports.ProgressIndicator = index$k.ProgressIndicator;
255
256
  exports.RadioButton = index$6["default"];
256
257
  exports.RadioButtonGroup = index$7["default"];
257
258
  exports.Search = index$8["default"];
@@ -265,12 +266,12 @@ exports.SelectItem = SelectItem["default"];
265
266
  exports.SelectItemGroup = SelectItemGroup["default"];
266
267
  exports.Switch = Switch["default"];
267
268
  exports.Slider = index$9["default"];
268
- exports.StructuredListBody = index$m.StructuredListBody;
269
- exports.StructuredListCell = index$m.StructuredListCell;
270
- exports.StructuredListHead = index$m.StructuredListHead;
271
- exports.StructuredListInput = index$m.StructuredListInput;
272
- exports.StructuredListRow = index$m.StructuredListRow;
273
- exports.StructuredListWrapper = index$m.StructuredListWrapper;
269
+ exports.StructuredListBody = index$l.StructuredListBody;
270
+ exports.StructuredListCell = index$l.StructuredListCell;
271
+ exports.StructuredListHead = index$l.StructuredListHead;
272
+ exports.StructuredListInput = index$l.StructuredListInput;
273
+ exports.StructuredListRow = index$l.StructuredListRow;
274
+ exports.StructuredListWrapper = index$l.StructuredListWrapper;
274
275
  exports.Tab = index$a["default"];
275
276
  exports.TabContent = TabContent["default"];
276
277
  exports.Tabs = index$b["default"];
@@ -278,22 +279,23 @@ exports.TagSkeleton = Tag_Skeleton["default"];
278
279
  exports.Tag = Tag["default"];
279
280
  exports.TextAreaSkeleton = TextArea_Skeleton["default"];
280
281
  exports.TextArea = TextArea["default"];
281
- exports.ClickableTile = index$n.ClickableTile;
282
- exports.ExpandableTile = index$n.ExpandableTile;
283
- exports.SelectableTile = index$n.SelectableTile;
284
- exports.Tile = index$n.Tile;
285
- exports.TileAboveTheFoldContent = index$n.TileAboveTheFoldContent;
286
- exports.TileBelowTheFoldContent = index$n.TileBelowTheFoldContent;
282
+ exports.ClickableTile = index$m.ClickableTile;
283
+ exports.ExpandableTile = index$m.ExpandableTile;
284
+ exports.SelectableTile = index$m.SelectableTile;
285
+ exports.Tile = index$m.Tile;
286
+ exports.TileAboveTheFoldContent = index$m.TileAboveTheFoldContent;
287
+ exports.TileBelowTheFoldContent = index$m.TileBelowTheFoldContent;
287
288
  exports.RadioTile = RadioTile["default"];
288
289
  exports.TileGroup = index$c["default"];
289
290
  exports.TimePicker = index$d["default"];
290
291
  exports.TimePickerSelect = index$e["default"];
291
- exports.Toggle = index$f["default"];
292
- exports.Toggletip = index$o.Toggletip;
293
- exports.ToggletipActions = index$o.ToggletipActions;
294
- exports.ToggletipButton = index$o.ToggletipButton;
295
- exports.ToggletipContent = index$o.ToggletipContent;
296
- exports.ToggletipLabel = index$o.ToggletipLabel;
292
+ exports.ToggleSkeleton = Toggle_Skeleton["default"];
293
+ exports.Toggle = Toggle.Toggle;
294
+ exports.Toggletip = index$n.Toggletip;
295
+ exports.ToggletipActions = index$n.ToggletipActions;
296
+ exports.ToggletipButton = index$n.ToggletipButton;
297
+ exports.ToggletipContent = index$n.ToggletipContent;
298
+ exports.ToggletipLabel = index$n.ToggletipLabel;
297
299
  exports.UnorderedList = UnorderedList["default"];
298
300
  exports.SkeletonText = SkeletonText["default"];
299
301
  exports.SkeletonPlaceholder = SkeletonPlaceholder["default"];
@@ -308,27 +310,27 @@ exports.SearchSkeleton = Search_Skeleton["default"];
308
310
  exports.SliderSkeleton = Slider_Skeleton["default"];
309
311
  exports.TabsSkeleton = Tabs_Skeleton["default"];
310
312
  exports.TextInputSkeleton = TextInput_Skeleton["default"];
311
- exports.ToggleSkeleton = Toggle_Skeleton["default"];
312
313
  exports.ToggleSmallSkeleton = ToggleSmall_Skeleton["default"];
313
314
  exports.IconSkeleton = Icon_Skeleton["default"];
314
- exports.HeaderNavigation = index$p.HeaderNavigation;
315
- exports.SideNavMenu = index$p.SideNavMenu;
316
- exports.unstable_FeatureFlags = index$q.FeatureFlags;
317
- exports.unstable_useFeatureFlag = index$q.useFeatureFlag;
318
- exports.unstable_useFeatureFlags = index$q.useFeatureFlags;
319
- exports.Heading = index$r.Heading;
320
- exports.Section = index$r.Section;
321
- exports.IconButton = index$s.IconButton;
322
- exports.Layer = index$t.Layer;
323
- exports.unstable_OverflowMenuV2 = index$u.OverflowMenuV2;
324
- exports.Popover = index$v.Popover;
325
- exports.PopoverContent = index$v.PopoverContent;
326
- exports.HStack = index$w.HStack;
327
- exports.VStack = index$w.VStack;
315
+ exports.HeaderNavigation = index$o.HeaderNavigation;
316
+ exports.SideNavMenu = index$o.SideNavMenu;
317
+ exports.unstable_FeatureFlags = index$p.FeatureFlags;
318
+ exports.unstable_useFeatureFlag = index$p.useFeatureFlag;
319
+ exports.unstable_useFeatureFlags = index$p.useFeatureFlags;
320
+ exports.Heading = index$q.Heading;
321
+ exports.Section = index$q.Section;
322
+ exports.IconButton = index$r.IconButton;
323
+ exports.Layer = index$s.Layer;
324
+ exports.unstable_OverflowMenuV2 = index$t.OverflowMenuV2;
325
+ exports.Popover = index$u.Popover;
326
+ exports.PopoverContent = index$u.PopoverContent;
327
+ exports.HStack = index$v.HStack;
328
+ exports.VStack = index$v.VStack;
328
329
  exports.DefinitionTooltip = DefinitionTooltip.DefinitionTooltip;
329
- exports.GlobalTheme = index$x.GlobalTheme;
330
- exports.Theme = index$x.Theme;
331
- exports.useTheme = index$x.useTheme;
330
+ exports.GlobalTheme = index$w.GlobalTheme;
331
+ exports.Theme = index$w.Theme;
332
+ exports.useTheme = index$w.useTheme;
333
+ exports.usePrefix = usePrefix.usePrefix;
332
334
  exports.AspectRatio = AspectRatio["default"];
333
335
  exports.Filename = Filename["default"];
334
336
  exports.FileUploaderButton = FileUploaderButton["default"];
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@carbon/react",
3
3
  "description": "React components for the Carbon Design System",
4
- "version": "1.5.0",
4
+ "version": "1.6.0-rc.0",
5
5
  "license": "Apache-2.0",
6
6
  "main": "lib/index.js",
7
7
  "module": "es/index.js",
@@ -46,7 +46,7 @@
46
46
  "@carbon/feature-flags": "^0.8.0",
47
47
  "@carbon/icons-react": "^11.5.0",
48
48
  "@carbon/layout": "^11.3.0",
49
- "@carbon/styles": "^1.5.0",
49
+ "@carbon/styles": "^1.6.0-rc.0",
50
50
  "@carbon/telemetry": "0.1.0",
51
51
  "classnames": "2.3.1",
52
52
  "copy-to-clipboard": "^3.3.1",
@@ -129,5 +129,5 @@
129
129
  "**/*.scss",
130
130
  "**/*.css"
131
131
  ],
132
- "gitHead": "b9bfd3eceeda13379b974831fb860ff6bd8064c5"
132
+ "gitHead": "82f5f0dcc24dc63a8feebbfb653333ae08425984"
133
133
  }
@@ -1,19 +0,0 @@
1
- /**
2
- * Copyright IBM Corp. 2016, 2022
3
- *
4
- * This source code is licensed under the Apache-2.0 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- import { Toggle as Toggle$2 } from './next/Toggle.js';
9
- import ToggleClassic from './Toggle.js';
10
- import { createComponentToggle } from '../../internal/ComponentToggle.js';
11
-
12
- var Toggle = createComponentToggle({
13
- name: 'Toggle',
14
- next: Toggle$2,
15
- classic: ToggleClassic
16
- });
17
- var Toggle$1 = Toggle;
18
-
19
- export { Toggle$1 as default };
@@ -1,158 +0,0 @@
1
- /**
2
- * Copyright IBM Corp. 2016, 2022
3
- *
4
- * This source code is licensed under the Apache-2.0 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
9
- import React__default from 'react';
10
- import PropTypes from 'prop-types';
11
- import cx from 'classnames';
12
- import { useControllableState } from '../../../internal/useControllableState.js';
13
- import { usePrefix } from '../../../internal/usePrefix.js';
14
-
15
- var _path;
16
-
17
- var _excluded = ["className", "defaultToggled", "disabled", "hideLabel", "id", "labelA", "labelB", "labelText", "onClick", "onToggle", "size", "toggled"];
18
- function Toggle(_ref) {
19
- var className = _ref.className,
20
- _ref$defaultToggled = _ref.defaultToggled,
21
- defaultToggled = _ref$defaultToggled === void 0 ? false : _ref$defaultToggled,
22
- _ref$disabled = _ref.disabled,
23
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
24
- _ref$hideLabel = _ref.hideLabel,
25
- hideLabel = _ref$hideLabel === void 0 ? false : _ref$hideLabel,
26
- id = _ref.id,
27
- _ref$labelA = _ref.labelA,
28
- labelA = _ref$labelA === void 0 ? 'Off' : _ref$labelA,
29
- _ref$labelB = _ref.labelB,
30
- labelB = _ref$labelB === void 0 ? 'On' : _ref$labelB,
31
- labelText = _ref.labelText,
32
- onClick = _ref.onClick,
33
- onToggle = _ref.onToggle,
34
- _ref$size = _ref.size,
35
- size = _ref$size === void 0 ? 'md' : _ref$size,
36
- toggled = _ref.toggled,
37
- other = _objectWithoutProperties(_ref, _excluded);
38
-
39
- var prefix = usePrefix();
40
-
41
- var _useControllableState = useControllableState({
42
- value: toggled,
43
- onChange: onToggle,
44
- defaultValue: defaultToggled
45
- }),
46
- _useControllableState2 = _slicedToArray(_useControllableState, 2),
47
- checked = _useControllableState2[0],
48
- setChecked = _useControllableState2[1];
49
-
50
- function handleClick(e) {
51
- setChecked(!checked);
52
-
53
- if (onClick) {
54
- onClick(e);
55
- }
56
- }
57
-
58
- var isSm = size === 'sm';
59
- var sideLabel = hideLabel ? labelText : checked ? labelB : labelA;
60
- var wrapperClasses = cx("".concat(prefix, "--toggle"), _defineProperty({}, "".concat(prefix, "--toggle--disabled"), disabled), className);
61
- var labelTextClasses = cx("".concat(prefix, "--toggle__label-text"), _defineProperty({}, "".concat(prefix, "--visually-hidden"), hideLabel));
62
- var appearanceClasses = cx("".concat(prefix, "--toggle__appearance"), _defineProperty({}, "".concat(prefix, "--toggle__appearance--sm"), isSm));
63
- var switchClasses = cx("".concat(prefix, "--toggle__switch"), _defineProperty({}, "".concat(prefix, "--toggle__switch--checked"), checked));
64
- return /*#__PURE__*/React__default.createElement("div", {
65
- className: wrapperClasses
66
- }, /*#__PURE__*/React__default.createElement("button", _extends({}, other, {
67
- id: id,
68
- className: "".concat(prefix, "--toggle__button"),
69
- role: "switch",
70
- type: "button",
71
- "aria-checked": checked,
72
- disabled: disabled,
73
- onClick: handleClick
74
- })), /*#__PURE__*/React__default.createElement("label", {
75
- htmlFor: id,
76
- className: "".concat(prefix, "--toggle__label")
77
- }, /*#__PURE__*/React__default.createElement("span", {
78
- className: labelTextClasses
79
- }, labelText), /*#__PURE__*/React__default.createElement("div", {
80
- className: appearanceClasses
81
- }, /*#__PURE__*/React__default.createElement("div", {
82
- className: switchClasses
83
- }, isSm && /*#__PURE__*/React__default.createElement("svg", {
84
- className: "".concat(prefix, "--toggle__check"),
85
- width: "6px",
86
- height: "5px",
87
- viewBox: "0 0 6 5"
88
- }, _path || (_path = /*#__PURE__*/React__default.createElement("path", {
89
- d: "M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z"
90
- })))), /*#__PURE__*/React__default.createElement("span", {
91
- className: "".concat(prefix, "--toggle__text"),
92
- "aria-hidden": "true"
93
- }, sideLabel))));
94
- }
95
- Toggle.propTypes = {
96
- /**
97
- * Specify a custom className to apply to the form-item node
98
- */
99
- className: PropTypes.string,
100
-
101
- /**
102
- * Specify whether the toggle should be on by default
103
- */
104
- defaultToggled: PropTypes.bool,
105
-
106
- /**
107
- * Whether this control should be disabled
108
- */
109
- disabled: PropTypes.bool,
110
-
111
- /**
112
- * Specify whether the label should be hidden, or not
113
- */
114
- hideLabel: PropTypes.bool,
115
-
116
- /**
117
- * Provide an id that unique represents the underlying `<button>`
118
- */
119
- id: PropTypes.string.isRequired,
120
-
121
- /**
122
- * Specify the label for the "off" position
123
- */
124
- labelA: PropTypes.node,
125
-
126
- /**
127
- * Specify the label for the "on" position
128
- */
129
- labelB: PropTypes.node,
130
-
131
- /**
132
- * Provide the text that will be read by a screen reader when visiting this
133
- * control
134
- */
135
- labelText: PropTypes.node.isRequired,
136
-
137
- /**
138
- * Provide an event listener that is called when the control is clicked
139
- */
140
- onClick: PropTypes.func,
141
-
142
- /**
143
- * Provide an event listener that is called when the control is toggled
144
- */
145
- onToggle: PropTypes.func,
146
-
147
- /**
148
- * Specify the size of the Toggle. Currently only supports 'sm' or 'md' (default)
149
- */
150
- size: PropTypes.oneOf(['sm', 'md']),
151
-
152
- /**
153
- * Specify whether the control is toggled
154
- */
155
- toggled: PropTypes.bool
156
- };
157
-
158
- export { Toggle, Toggle as default };
@@ -1,23 +0,0 @@
1
- /**
2
- * Copyright IBM Corp. 2016, 2022
3
- *
4
- * This source code is licensed under the Apache-2.0 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- 'use strict';
9
-
10
- Object.defineProperty(exports, '__esModule', { value: true });
11
-
12
- var Toggle$2 = require('./next/Toggle.js');
13
- var Toggle$3 = require('./Toggle.js');
14
- var ComponentToggle = require('../../internal/ComponentToggle.js');
15
-
16
- var Toggle = ComponentToggle.createComponentToggle({
17
- name: 'Toggle',
18
- next: Toggle$2.Toggle,
19
- classic: Toggle$3["default"]
20
- });
21
- var Toggle$1 = Toggle;
22
-
23
- exports["default"] = Toggle$1;
@@ -1,169 +0,0 @@
1
- /**
2
- * Copyright IBM Corp. 2016, 2022
3
- *
4
- * This source code is licensed under the Apache-2.0 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- 'use strict';
9
-
10
- Object.defineProperty(exports, '__esModule', { value: true });
11
-
12
- var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
13
- var React = require('react');
14
- var PropTypes = require('prop-types');
15
- var cx = require('classnames');
16
- var useControllableState = require('../../../internal/useControllableState.js');
17
- var usePrefix = require('../../../internal/usePrefix.js');
18
-
19
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
20
-
21
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
22
- var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
23
- var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
24
-
25
- var _path;
26
-
27
- var _excluded = ["className", "defaultToggled", "disabled", "hideLabel", "id", "labelA", "labelB", "labelText", "onClick", "onToggle", "size", "toggled"];
28
- function Toggle(_ref) {
29
- var className = _ref.className,
30
- _ref$defaultToggled = _ref.defaultToggled,
31
- defaultToggled = _ref$defaultToggled === void 0 ? false : _ref$defaultToggled,
32
- _ref$disabled = _ref.disabled,
33
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
34
- _ref$hideLabel = _ref.hideLabel,
35
- hideLabel = _ref$hideLabel === void 0 ? false : _ref$hideLabel,
36
- id = _ref.id,
37
- _ref$labelA = _ref.labelA,
38
- labelA = _ref$labelA === void 0 ? 'Off' : _ref$labelA,
39
- _ref$labelB = _ref.labelB,
40
- labelB = _ref$labelB === void 0 ? 'On' : _ref$labelB,
41
- labelText = _ref.labelText,
42
- onClick = _ref.onClick,
43
- onToggle = _ref.onToggle,
44
- _ref$size = _ref.size,
45
- size = _ref$size === void 0 ? 'md' : _ref$size,
46
- toggled = _ref.toggled,
47
- other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
48
-
49
- var prefix = usePrefix.usePrefix();
50
-
51
- var _useControllableState = useControllableState.useControllableState({
52
- value: toggled,
53
- onChange: onToggle,
54
- defaultValue: defaultToggled
55
- }),
56
- _useControllableState2 = _rollupPluginBabelHelpers.slicedToArray(_useControllableState, 2),
57
- checked = _useControllableState2[0],
58
- setChecked = _useControllableState2[1];
59
-
60
- function handleClick(e) {
61
- setChecked(!checked);
62
-
63
- if (onClick) {
64
- onClick(e);
65
- }
66
- }
67
-
68
- var isSm = size === 'sm';
69
- var sideLabel = hideLabel ? labelText : checked ? labelB : labelA;
70
- var wrapperClasses = cx__default["default"]("".concat(prefix, "--toggle"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--toggle--disabled"), disabled), className);
71
- var labelTextClasses = cx__default["default"]("".concat(prefix, "--toggle__label-text"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--visually-hidden"), hideLabel));
72
- var appearanceClasses = cx__default["default"]("".concat(prefix, "--toggle__appearance"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--toggle__appearance--sm"), isSm));
73
- var switchClasses = cx__default["default"]("".concat(prefix, "--toggle__switch"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--toggle__switch--checked"), checked));
74
- return /*#__PURE__*/React__default["default"].createElement("div", {
75
- className: wrapperClasses
76
- }, /*#__PURE__*/React__default["default"].createElement("button", _rollupPluginBabelHelpers["extends"]({}, other, {
77
- id: id,
78
- className: "".concat(prefix, "--toggle__button"),
79
- role: "switch",
80
- type: "button",
81
- "aria-checked": checked,
82
- disabled: disabled,
83
- onClick: handleClick
84
- })), /*#__PURE__*/React__default["default"].createElement("label", {
85
- htmlFor: id,
86
- className: "".concat(prefix, "--toggle__label")
87
- }, /*#__PURE__*/React__default["default"].createElement("span", {
88
- className: labelTextClasses
89
- }, labelText), /*#__PURE__*/React__default["default"].createElement("div", {
90
- className: appearanceClasses
91
- }, /*#__PURE__*/React__default["default"].createElement("div", {
92
- className: switchClasses
93
- }, isSm && /*#__PURE__*/React__default["default"].createElement("svg", {
94
- className: "".concat(prefix, "--toggle__check"),
95
- width: "6px",
96
- height: "5px",
97
- viewBox: "0 0 6 5"
98
- }, _path || (_path = /*#__PURE__*/React__default["default"].createElement("path", {
99
- d: "M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z"
100
- })))), /*#__PURE__*/React__default["default"].createElement("span", {
101
- className: "".concat(prefix, "--toggle__text"),
102
- "aria-hidden": "true"
103
- }, sideLabel))));
104
- }
105
- Toggle.propTypes = {
106
- /**
107
- * Specify a custom className to apply to the form-item node
108
- */
109
- className: PropTypes__default["default"].string,
110
-
111
- /**
112
- * Specify whether the toggle should be on by default
113
- */
114
- defaultToggled: PropTypes__default["default"].bool,
115
-
116
- /**
117
- * Whether this control should be disabled
118
- */
119
- disabled: PropTypes__default["default"].bool,
120
-
121
- /**
122
- * Specify whether the label should be hidden, or not
123
- */
124
- hideLabel: PropTypes__default["default"].bool,
125
-
126
- /**
127
- * Provide an id that unique represents the underlying `<button>`
128
- */
129
- id: PropTypes__default["default"].string.isRequired,
130
-
131
- /**
132
- * Specify the label for the "off" position
133
- */
134
- labelA: PropTypes__default["default"].node,
135
-
136
- /**
137
- * Specify the label for the "on" position
138
- */
139
- labelB: PropTypes__default["default"].node,
140
-
141
- /**
142
- * Provide the text that will be read by a screen reader when visiting this
143
- * control
144
- */
145
- labelText: PropTypes__default["default"].node.isRequired,
146
-
147
- /**
148
- * Provide an event listener that is called when the control is clicked
149
- */
150
- onClick: PropTypes__default["default"].func,
151
-
152
- /**
153
- * Provide an event listener that is called when the control is toggled
154
- */
155
- onToggle: PropTypes__default["default"].func,
156
-
157
- /**
158
- * Specify the size of the Toggle. Currently only supports 'sm' or 'md' (default)
159
- */
160
- size: PropTypes__default["default"].oneOf(['sm', 'md']),
161
-
162
- /**
163
- * Specify whether the control is toggled
164
- */
165
- toggled: PropTypes__default["default"].bool
166
- };
167
-
168
- exports.Toggle = Toggle;
169
- exports["default"] = Toggle;