@carbon/react 1.31.3 → 1.32.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.
- package/README.md +1 -1
- package/es/components/Accordion/Accordion.Skeleton.d.ts +64 -0
- package/es/components/Accordion/Accordion.Skeleton.js +3 -3
- package/es/components/Accordion/Accordion.d.ts +65 -0
- package/es/components/Accordion/Accordion.js +5 -6
- package/es/components/Accordion/AccordionItem.d.ts +105 -0
- package/es/components/Accordion/AccordionItem.js +12 -9
- package/es/components/Accordion/AccordionProvider.d.ts +20 -0
- package/es/components/Accordion/AccordionProvider.js +25 -0
- package/es/components/Accordion/index.d.ts +11 -0
- package/es/components/Button/Button.Skeleton.d.ts +28 -0
- package/es/components/Button/Button.Skeleton.js +5 -3
- package/es/components/Button/Button.d.ts +72 -0
- package/es/components/Button/Button.js +13 -10
- package/es/components/Button/index.d.ts +11 -0
- package/es/components/Button/index.js +2 -1
- package/es/components/ButtonSet/ButtonSet.d.ts +17 -0
- package/es/components/ButtonSet/ButtonSet.js +1 -2
- package/es/components/ButtonSet/index.d.ts +9 -0
- package/es/components/CodeSnippet/CodeSnippet.js +1 -0
- package/es/components/ComboButton/index.js +1 -0
- package/es/components/ComposedModal/ComposedModal.d.ts +70 -0
- package/es/components/ComposedModal/ComposedModal.js +58 -67
- package/es/components/ComposedModal/ModalFooter.d.ts +71 -0
- package/es/components/ComposedModal/ModalFooter.js +22 -19
- package/es/components/ComposedModal/ModalHeader.d.ts +58 -0
- package/es/components/ComposedModal/ModalHeader.js +8 -25
- package/es/components/ComposedModal/index.d.ts +9 -0
- package/es/components/ContainedList/ContainedList.js +12 -1
- package/es/components/ContentSwitcher/ContentSwitcher.d.ts +109 -0
- package/es/components/ContentSwitcher/ContentSwitcher.js +14 -6
- package/es/components/DangerButton/DangerButton.d.ts +9 -0
- package/es/components/DangerButton/DangerButton.js +2 -2
- package/es/components/DangerButton/index.d.ts +9 -0
- package/es/components/DataTable/TableBatchAction.js +1 -0
- package/es/components/DataTable/TableBatchActions.js +1 -0
- package/es/components/DataTable/TableBody.d.ts +29 -0
- package/es/components/DataTable/TableBody.js +2 -3
- package/es/components/DataTable/TableContainer.d.ts +51 -0
- package/es/components/DataTable/TableContainer.js +3 -4
- package/es/components/DataTable/TableExpandHeader.d.ts +86 -0
- package/es/components/DataTable/TableExpandHeader.js +4 -5
- package/es/components/DatePicker/plugins/fixEventsPlugin.js +12 -16
- package/es/components/Dropdown/Dropdown.js +1 -0
- package/es/components/FluidTextInput/FluidTextInput.js +1 -0
- package/es/components/FormGroup/FormGroup.d.ts +80 -0
- package/es/components/IconButton/index.js +3 -2
- package/es/components/Layout/index.d.ts +74 -0
- package/es/components/Layout/index.js +14 -5
- package/es/components/Link/Link.d.ts +2 -2
- package/es/components/Link/Link.js +2 -1
- package/es/components/MenuButton/index.js +1 -0
- package/es/components/Modal/Modal.js +1 -0
- package/es/components/ModalWrapper/ModalWrapper.js +1 -0
- package/es/components/Notification/Notification.d.ts +531 -0
- package/es/components/Notification/Notification.js +40 -6
- package/es/components/Notification/index.d.ts +7 -0
- package/es/components/PrimaryButton/PrimaryButton.js +1 -0
- package/es/components/SecondaryButton/SecondaryButton.js +1 -0
- package/es/components/Select/Select.d.ts +1 -1
- package/es/components/SkeletonText/SkeletonText.d.ts +61 -0
- package/es/components/SkeletonText/SkeletonText.js +15 -17
- package/es/components/SkeletonText/index.d.ts +9 -0
- package/es/components/Switch/Switch.d.ts +56 -0
- package/es/components/Switch/Switch.js +4 -4
- package/es/components/Tab/index.d.ts +9 -0
- package/es/components/TabContent/TabContent.d.ts +40 -0
- package/es/components/TabContent/TabContent.js +6 -12
- package/es/components/TabContent/index.d.ts +10 -0
- package/es/components/Tabs/Tabs.Skeleton.d.ts +33 -0
- package/es/components/Tabs/Tabs.Skeleton.js +2 -2
- package/es/components/Tabs/Tabs.d.ts +303 -0
- package/es/components/Tabs/Tabs.js +136 -95
- package/es/components/Tabs/index.d.ts +10 -0
- package/es/components/Tabs/usePressable.js +11 -0
- package/es/components/TextInput/ControlledPasswordInput.d.ts +90 -0
- package/es/components/TextInput/ControlledPasswordInput.js +5 -6
- package/es/components/Tile/Tile.d.ts +153 -0
- package/es/components/Tile/Tile.js +62 -74
- package/es/components/Tile/index.d.ts +7 -0
- package/es/components/Toggle/Toggle.Skeleton.d.ts +3 -47
- package/es/components/Toggle/Toggle.Skeleton.js +24 -64
- package/es/components/Toggle/Toggle.js +1 -1
- package/es/components/UIShell/HeaderGlobalAction.js +1 -0
- package/es/components/UIShell/SideNav.d.ts +1 -1
- package/es/index.js +16 -16
- package/es/internal/keyboard/match.js +2 -2
- package/es/internal/useControllableState.js +2 -2
- package/es/internal/wrapFocus.js +6 -6
- package/es/prop-types/requiredIfGivenPropIsTruthy.js +1 -1
- package/es/prop-types/types.js +3 -0
- package/lib/components/Accordion/Accordion.Skeleton.d.ts +64 -0
- package/lib/components/Accordion/Accordion.Skeleton.js +3 -3
- package/lib/components/Accordion/Accordion.d.ts +65 -0
- package/lib/components/Accordion/Accordion.js +5 -6
- package/lib/components/Accordion/AccordionItem.d.ts +105 -0
- package/lib/components/Accordion/AccordionItem.js +11 -8
- package/lib/components/Accordion/AccordionProvider.d.ts +20 -0
- package/lib/components/Accordion/AccordionProvider.js +34 -0
- package/lib/components/Accordion/index.d.ts +11 -0
- package/lib/components/Button/Button.Skeleton.d.ts +28 -0
- package/lib/components/Button/Button.Skeleton.js +5 -3
- package/lib/components/Button/Button.d.ts +72 -0
- package/lib/components/Button/Button.js +18 -11
- package/lib/components/Button/index.d.ts +11 -0
- package/lib/components/Button/index.js +6 -0
- package/lib/components/ButtonSet/ButtonSet.d.ts +17 -0
- package/lib/components/ButtonSet/ButtonSet.js +1 -2
- package/lib/components/ButtonSet/index.d.ts +9 -0
- package/lib/components/CodeSnippet/CodeSnippet.js +1 -0
- package/lib/components/ComboButton/index.js +1 -0
- package/lib/components/ComposedModal/ComposedModal.d.ts +70 -0
- package/lib/components/ComposedModal/ComposedModal.js +58 -67
- package/lib/components/ComposedModal/ModalFooter.d.ts +71 -0
- package/lib/components/ComposedModal/ModalFooter.js +22 -19
- package/lib/components/ComposedModal/ModalHeader.d.ts +58 -0
- package/lib/components/ComposedModal/ModalHeader.js +8 -25
- package/lib/components/ComposedModal/index.d.ts +9 -0
- package/lib/components/ContainedList/ContainedList.js +12 -1
- package/lib/components/ContentSwitcher/ContentSwitcher.d.ts +109 -0
- package/lib/components/ContentSwitcher/ContentSwitcher.js +14 -6
- package/lib/components/DangerButton/DangerButton.d.ts +9 -0
- package/lib/components/DangerButton/DangerButton.js +2 -2
- package/lib/components/DangerButton/index.d.ts +9 -0
- package/lib/components/DataTable/TableBatchAction.js +1 -0
- package/lib/components/DataTable/TableBatchActions.js +1 -0
- package/lib/components/DataTable/TableBody.d.ts +29 -0
- package/lib/components/DataTable/TableBody.js +3 -4
- package/lib/components/DataTable/TableContainer.d.ts +51 -0
- package/lib/components/DataTable/TableContainer.js +3 -4
- package/lib/components/DataTable/TableExpandHeader.d.ts +86 -0
- package/lib/components/DataTable/TableExpandHeader.js +4 -5
- package/lib/components/DatePicker/plugins/fixEventsPlugin.js +12 -16
- package/lib/components/Dropdown/Dropdown.js +1 -0
- package/lib/components/FluidTextInput/FluidTextInput.js +1 -0
- package/lib/components/FormGroup/FormGroup.d.ts +80 -0
- package/lib/components/IconButton/index.js +3 -2
- package/lib/components/Layout/index.d.ts +74 -0
- package/lib/components/Layout/index.js +14 -5
- package/lib/components/Link/Link.d.ts +2 -2
- package/lib/components/Link/Link.js +2 -1
- package/lib/components/MenuButton/index.js +1 -0
- package/lib/components/Modal/Modal.js +1 -0
- package/lib/components/ModalWrapper/ModalWrapper.js +1 -0
- package/lib/components/Notification/Notification.d.ts +531 -0
- package/lib/components/Notification/Notification.js +40 -6
- package/lib/components/Notification/index.d.ts +7 -0
- package/lib/components/PrimaryButton/PrimaryButton.js +1 -0
- package/lib/components/SecondaryButton/SecondaryButton.js +1 -0
- package/lib/components/Select/Select.d.ts +1 -1
- package/lib/components/SkeletonText/SkeletonText.d.ts +61 -0
- package/lib/components/SkeletonText/SkeletonText.js +15 -17
- package/lib/components/SkeletonText/index.d.ts +9 -0
- package/lib/components/Switch/Switch.d.ts +56 -0
- package/lib/components/Switch/Switch.js +4 -4
- package/lib/components/Tab/index.d.ts +9 -0
- package/lib/components/TabContent/TabContent.d.ts +40 -0
- package/lib/components/TabContent/TabContent.js +6 -12
- package/lib/components/TabContent/index.d.ts +10 -0
- package/lib/components/Tabs/Tabs.Skeleton.d.ts +33 -0
- package/lib/components/Tabs/Tabs.Skeleton.js +2 -2
- package/lib/components/Tabs/Tabs.d.ts +303 -0
- package/lib/components/Tabs/Tabs.js +135 -94
- package/lib/components/Tabs/index.d.ts +10 -0
- package/lib/components/Tabs/usePressable.js +11 -0
- package/lib/components/TextInput/ControlledPasswordInput.d.ts +90 -0
- package/lib/components/TextInput/ControlledPasswordInput.js +5 -6
- package/lib/components/Tile/Tile.d.ts +153 -0
- package/lib/components/Tile/Tile.js +62 -74
- package/lib/components/Tile/index.d.ts +7 -0
- package/lib/components/Toggle/Toggle.Skeleton.d.ts +3 -47
- package/lib/components/Toggle/Toggle.Skeleton.js +22 -62
- package/lib/components/Toggle/Toggle.js +1 -1
- package/lib/components/UIShell/HeaderGlobalAction.js +1 -0
- package/lib/components/UIShell/SideNav.d.ts +1 -1
- package/lib/index.js +51 -47
- package/lib/internal/keyboard/match.js +2 -2
- package/lib/internal/useControllableState.js +2 -2
- package/lib/internal/wrapFocus.js +6 -6
- package/lib/prop-types/requiredIfGivenPropIsTruthy.js +1 -1
- package/lib/prop-types/types.js +3 -0
- package/package.json +4 -3
|
@@ -85,5 +85,5 @@ interface SelectProps extends Omit<ComponentPropsWithRef<'select'>, ExcludedAttr
|
|
|
85
85
|
*/
|
|
86
86
|
warnText?: ReactNode;
|
|
87
87
|
}
|
|
88
|
-
declare const Select: React.ForwardRefExoticComponent<Pick<SelectProps, "value" | "children" | "
|
|
88
|
+
declare const Select: React.ForwardRefExoticComponent<Pick<SelectProps, "value" | "children" | "disabled" | "form" | "slot" | "style" | "title" | "className" | "size" | "dir" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "autoComplete" | "multiple" | "key" | "id" | "aria-controls" | "aria-expanded" | "onClick" | "onAnimationEnd" | "onKeyDown" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "inline" | "name" | "readOnly" | "required" | "light" | "invalid" | "labelText" | "helperText" | "invalidText" | "hideLabel" | "warn" | "warnText" | "noLabel"> & React.RefAttributes<HTMLSelectElement>>;
|
|
89
89
|
export default Select;
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2023
|
|
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
|
+
import PropTypes from 'prop-types';
|
|
8
|
+
interface SkeletonTextProps {
|
|
9
|
+
/**
|
|
10
|
+
* Specify an optional className to be applied to the container node.
|
|
11
|
+
*/
|
|
12
|
+
className?: string;
|
|
13
|
+
/**
|
|
14
|
+
* Generates skeleton text at a larger size.
|
|
15
|
+
*/
|
|
16
|
+
heading?: boolean;
|
|
17
|
+
/**
|
|
18
|
+
* The number of lines shown if paragraph is true.
|
|
19
|
+
*/
|
|
20
|
+
lineCount?: number;
|
|
21
|
+
/**
|
|
22
|
+
* Set this to true to generate multiple lines of text.
|
|
23
|
+
*/
|
|
24
|
+
paragraph?: boolean;
|
|
25
|
+
/**
|
|
26
|
+
* Width (in px or %) of single line of text or max-width of paragraph lines.
|
|
27
|
+
*/
|
|
28
|
+
width?: string;
|
|
29
|
+
}
|
|
30
|
+
declare const SkeletonText: {
|
|
31
|
+
({ paragraph, lineCount, width, heading, className, ...rest }: SkeletonTextProps): JSX.Element;
|
|
32
|
+
propTypes: {
|
|
33
|
+
/**
|
|
34
|
+
* Specify an optional className to be applied to the container node
|
|
35
|
+
*/
|
|
36
|
+
className: PropTypes.Requireable<string>;
|
|
37
|
+
/**
|
|
38
|
+
* generates skeleton text at a larger size
|
|
39
|
+
*/
|
|
40
|
+
heading: PropTypes.Requireable<boolean>;
|
|
41
|
+
/**
|
|
42
|
+
* the number of lines shown if paragraph is true
|
|
43
|
+
*/
|
|
44
|
+
lineCount: PropTypes.Requireable<number>;
|
|
45
|
+
/**
|
|
46
|
+
* will generate multiple lines of text
|
|
47
|
+
*/
|
|
48
|
+
paragraph: PropTypes.Requireable<boolean>;
|
|
49
|
+
/**
|
|
50
|
+
* width (in px or %) of single line of text or max-width of paragraph lines
|
|
51
|
+
*/
|
|
52
|
+
width: PropTypes.Requireable<string>;
|
|
53
|
+
};
|
|
54
|
+
defaultProps: {
|
|
55
|
+
paragraph: boolean;
|
|
56
|
+
width: string;
|
|
57
|
+
heading: boolean;
|
|
58
|
+
lineCount: number;
|
|
59
|
+
};
|
|
60
|
+
};
|
|
61
|
+
export default SkeletonText;
|
|
@@ -28,12 +28,12 @@ function getRandomInt(min, max, n) {
|
|
|
28
28
|
}
|
|
29
29
|
const SkeletonText = _ref => {
|
|
30
30
|
let {
|
|
31
|
-
paragraph,
|
|
32
|
-
lineCount,
|
|
33
|
-
width,
|
|
34
|
-
heading,
|
|
35
|
-
className,
|
|
36
|
-
...
|
|
31
|
+
paragraph = false,
|
|
32
|
+
lineCount = 3,
|
|
33
|
+
width = '100%',
|
|
34
|
+
heading = false,
|
|
35
|
+
className = '',
|
|
36
|
+
...rest
|
|
37
37
|
} = _ref;
|
|
38
38
|
const prefix = usePrefix.usePrefix();
|
|
39
39
|
const skeletonTextClasses = cx__default["default"]({
|
|
@@ -44,10 +44,8 @@ const SkeletonText = _ref => {
|
|
|
44
44
|
const widthNum = parseInt(width, 10);
|
|
45
45
|
const widthPx = width.includes('px');
|
|
46
46
|
const widthPercent = width.includes('%');
|
|
47
|
-
let lineCountNumber;
|
|
48
|
-
if (
|
|
49
|
-
lineCountNumber = '1';
|
|
50
|
-
} else {
|
|
47
|
+
let lineCountNumber = 1;
|
|
48
|
+
if (paragraph) {
|
|
51
49
|
lineCountNumber = lineCount;
|
|
52
50
|
}
|
|
53
51
|
const refs = React.useRef([]);
|
|
@@ -67,18 +65,19 @@ const SkeletonText = _ref => {
|
|
|
67
65
|
});
|
|
68
66
|
}, [lineCountNumber, paragraph, refs, width, widthNum, widthPercent, widthPx]);
|
|
69
67
|
const lines = [];
|
|
70
|
-
for (
|
|
68
|
+
for (let i = 0; i < lineCountNumber; i++) {
|
|
71
69
|
lines.push( /*#__PURE__*/React__default["default"].createElement("p", _rollupPluginBabelHelpers["extends"]({
|
|
72
70
|
className: skeletonTextClasses,
|
|
73
71
|
key: i,
|
|
74
72
|
ref: el => refs.current = [...refs.current, el]
|
|
75
|
-
},
|
|
73
|
+
}, rest)));
|
|
76
74
|
}
|
|
77
|
-
if (lineCountNumber !==
|
|
75
|
+
if (lineCountNumber !== 1) {
|
|
78
76
|
return /*#__PURE__*/React__default["default"].createElement("div", null, lines);
|
|
79
|
-
} else {
|
|
80
|
-
return lines;
|
|
81
77
|
}
|
|
78
|
+
|
|
79
|
+
// eslint-disable-next-line react/jsx-no-useless-fragment
|
|
80
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, lines);
|
|
82
81
|
};
|
|
83
82
|
SkeletonText.propTypes = {
|
|
84
83
|
/**
|
|
@@ -108,6 +107,5 @@ SkeletonText.defaultProps = {
|
|
|
108
107
|
heading: false,
|
|
109
108
|
lineCount: 3
|
|
110
109
|
};
|
|
111
|
-
var SkeletonText$1 = SkeletonText;
|
|
112
110
|
|
|
113
|
-
exports["default"] = SkeletonText
|
|
111
|
+
exports["default"] = SkeletonText;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2023
|
|
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
|
+
import SkeletonText from './SkeletonText';
|
|
8
|
+
export default SkeletonText;
|
|
9
|
+
export { SkeletonText };
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2023
|
|
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
|
+
import React, { ButtonHTMLAttributes, ReactNode } from 'react';
|
|
8
|
+
interface SwitchEventHandlersParams {
|
|
9
|
+
index?: number;
|
|
10
|
+
name?: string | number;
|
|
11
|
+
text?: string;
|
|
12
|
+
key?: string | number;
|
|
13
|
+
}
|
|
14
|
+
export interface SwitchProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'name' | 'onClick' | 'onKeyDown'> {
|
|
15
|
+
/**
|
|
16
|
+
* Provide child elements to be rendered inside of the Switch
|
|
17
|
+
*/
|
|
18
|
+
children?: ReactNode;
|
|
19
|
+
/**
|
|
20
|
+
* Specify an optional className to be added to your Switch
|
|
21
|
+
*/
|
|
22
|
+
className?: string;
|
|
23
|
+
/**
|
|
24
|
+
* Specify whether or not the Switch should be disabled
|
|
25
|
+
*/
|
|
26
|
+
disabled?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* The index of your Switch in your ContentSwitcher that is used for event handlers.
|
|
29
|
+
* Reserved for usage in ContentSwitcher
|
|
30
|
+
*/
|
|
31
|
+
index?: number;
|
|
32
|
+
/**
|
|
33
|
+
* Provide the name of your Switch that is used for event handlers
|
|
34
|
+
*/
|
|
35
|
+
name?: string | number;
|
|
36
|
+
/**
|
|
37
|
+
* A handler that is invoked when a user clicks on the control.
|
|
38
|
+
* Reserved for usage in ContentSwitcher
|
|
39
|
+
*/
|
|
40
|
+
onClick?: (params: SwitchEventHandlersParams) => void;
|
|
41
|
+
/**
|
|
42
|
+
* A handler that is invoked on the key down event for the control.
|
|
43
|
+
* Reserved for usage in ContentSwitcher
|
|
44
|
+
*/
|
|
45
|
+
onKeyDown?: (params: SwitchEventHandlersParams) => void;
|
|
46
|
+
/**
|
|
47
|
+
* Whether your Switch is selected. Reserved for usage in ContentSwitcher
|
|
48
|
+
*/
|
|
49
|
+
selected?: boolean;
|
|
50
|
+
/**
|
|
51
|
+
* Provide the contents of your Switch
|
|
52
|
+
*/
|
|
53
|
+
text?: string;
|
|
54
|
+
}
|
|
55
|
+
declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;
|
|
56
|
+
export default Switch;
|
|
@@ -30,14 +30,14 @@ const Switch = /*#__PURE__*/React__default["default"].forwardRef(function Switch
|
|
|
30
30
|
name,
|
|
31
31
|
onClick,
|
|
32
32
|
onKeyDown,
|
|
33
|
-
selected,
|
|
33
|
+
selected = false,
|
|
34
34
|
text,
|
|
35
35
|
...other
|
|
36
36
|
} = props;
|
|
37
37
|
const prefix = usePrefix.usePrefix();
|
|
38
38
|
const handleClick = e => {
|
|
39
39
|
e.preventDefault();
|
|
40
|
-
onClick({
|
|
40
|
+
onClick?.({
|
|
41
41
|
index,
|
|
42
42
|
name,
|
|
43
43
|
text
|
|
@@ -45,7 +45,7 @@ const Switch = /*#__PURE__*/React__default["default"].forwardRef(function Switch
|
|
|
45
45
|
};
|
|
46
46
|
const handleKeyDown = event => {
|
|
47
47
|
const key = event.key || event.which;
|
|
48
|
-
onKeyDown({
|
|
48
|
+
onKeyDown?.({
|
|
49
49
|
index,
|
|
50
50
|
name,
|
|
51
51
|
text,
|
|
@@ -65,7 +65,7 @@ const Switch = /*#__PURE__*/React__default["default"].forwardRef(function Switch
|
|
|
65
65
|
type: "button",
|
|
66
66
|
ref: tabRef,
|
|
67
67
|
role: "tab",
|
|
68
|
-
tabIndex: selected ?
|
|
68
|
+
tabIndex: selected ? 0 : -1,
|
|
69
69
|
"aria-selected": selected
|
|
70
70
|
}, other, commonProps), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
71
71
|
className: `${prefix}--content-switcher__label`,
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2023
|
|
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
|
+
import PropTypes from 'prop-types';
|
|
8
|
+
import { type HTMLAttributes, type ReactNode } from 'react';
|
|
9
|
+
export interface TabContentProps extends HTMLAttributes<HTMLDivElement> {
|
|
10
|
+
/**
|
|
11
|
+
* Pass in content to render inside the TabContent
|
|
12
|
+
*/
|
|
13
|
+
children?: ReactNode;
|
|
14
|
+
/**
|
|
15
|
+
* Provide a className for the tab content container
|
|
16
|
+
*/
|
|
17
|
+
className?: string;
|
|
18
|
+
/**
|
|
19
|
+
* Specify whether the TabContent is selected
|
|
20
|
+
*/
|
|
21
|
+
selected?: boolean;
|
|
22
|
+
}
|
|
23
|
+
declare function TabContent(props: any): JSX.Element;
|
|
24
|
+
declare namespace TabContent {
|
|
25
|
+
var propTypes: {
|
|
26
|
+
/**
|
|
27
|
+
* Pass in content to render inside the TabContent
|
|
28
|
+
*/
|
|
29
|
+
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
30
|
+
/**
|
|
31
|
+
* Provide a className for the tab content container
|
|
32
|
+
*/
|
|
33
|
+
className: PropTypes.Requireable<string>;
|
|
34
|
+
/**
|
|
35
|
+
* Specify whether the TabContent is selected
|
|
36
|
+
*/
|
|
37
|
+
selected: PropTypes.Requireable<boolean>;
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
export default TabContent;
|
|
@@ -32,12 +32,12 @@ function useTabbableContent(ref) {
|
|
|
32
32
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
33
33
|
useIsomorphicEffect["default"](() => {
|
|
34
34
|
if (ref.current) {
|
|
35
|
-
setHasTabbableContent(ref.current.querySelector(navigation.selectorTabbable));
|
|
35
|
+
setHasTabbableContent(!!ref.current.querySelector(navigation.selectorTabbable));
|
|
36
36
|
}
|
|
37
37
|
});
|
|
38
38
|
return hasTabbableContent;
|
|
39
39
|
}
|
|
40
|
-
|
|
40
|
+
function TabContent(props) {
|
|
41
41
|
const {
|
|
42
42
|
className,
|
|
43
43
|
selected,
|
|
@@ -45,9 +45,7 @@ const TabContent = props => {
|
|
|
45
45
|
...other
|
|
46
46
|
} = props;
|
|
47
47
|
const prefix = usePrefix.usePrefix();
|
|
48
|
-
const tabContentClasses = cx__default["default"](`${prefix}--tab-content`,
|
|
49
|
-
[className]: className
|
|
50
|
-
});
|
|
48
|
+
const tabContentClasses = cx__default["default"](`${prefix}--tab-content`, className);
|
|
51
49
|
const ref = React.useRef(null);
|
|
52
50
|
const hasTabbableContent = useTabbableContent(ref);
|
|
53
51
|
return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
|
|
@@ -59,10 +57,10 @@ const TabContent = props => {
|
|
|
59
57
|
ref: ref,
|
|
60
58
|
tabIndex: hasTabbableContent ? undefined : 0
|
|
61
59
|
}), children);
|
|
62
|
-
}
|
|
60
|
+
}
|
|
63
61
|
TabContent.propTypes = {
|
|
64
62
|
/**
|
|
65
|
-
* Pass in content to render inside
|
|
63
|
+
* Pass in content to render inside the TabContent
|
|
66
64
|
*/
|
|
67
65
|
children: PropTypes__default["default"].node,
|
|
68
66
|
/**
|
|
@@ -74,9 +72,5 @@ TabContent.propTypes = {
|
|
|
74
72
|
*/
|
|
75
73
|
selected: PropTypes__default["default"].bool
|
|
76
74
|
};
|
|
77
|
-
TabContent.defaultProps = {
|
|
78
|
-
selected: false
|
|
79
|
-
};
|
|
80
|
-
var TabContent$1 = TabContent;
|
|
81
75
|
|
|
82
|
-
exports["default"] = TabContent
|
|
76
|
+
exports["default"] = TabContent;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2023
|
|
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
|
+
export { type TabContentProps } from './TabContent';
|
|
8
|
+
import TabContent from './TabContent';
|
|
9
|
+
export default TabContent;
|
|
10
|
+
export { TabContent };
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright IBM Corp. 2016, 2023
|
|
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
|
+
import PropTypes from 'prop-types';
|
|
8
|
+
import { type HTMLAttributes } from 'react';
|
|
9
|
+
export interface TabsSkeletonProps extends HTMLAttributes<HTMLDivElement> {
|
|
10
|
+
/**
|
|
11
|
+
* Specify an optional className to add.
|
|
12
|
+
*/
|
|
13
|
+
className?: string;
|
|
14
|
+
/**
|
|
15
|
+
* Provide the type of Tab
|
|
16
|
+
*/
|
|
17
|
+
contained?: boolean;
|
|
18
|
+
}
|
|
19
|
+
declare function TabsSkeleton({ className, contained, ...rest }: TabsSkeletonProps): JSX.Element;
|
|
20
|
+
declare namespace TabsSkeleton {
|
|
21
|
+
var propTypes: {
|
|
22
|
+
/**
|
|
23
|
+
* Specify an optional className to add.
|
|
24
|
+
*/
|
|
25
|
+
className: PropTypes.Requireable<string>;
|
|
26
|
+
/**
|
|
27
|
+
* Provide the type of Tab
|
|
28
|
+
*/
|
|
29
|
+
contained: PropTypes.Requireable<boolean>;
|
|
30
|
+
};
|
|
31
|
+
}
|
|
32
|
+
export default TabsSkeleton;
|
|
33
|
+
export { TabsSkeleton };
|
|
@@ -21,7 +21,7 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
|
21
21
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
22
22
|
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
|
|
23
23
|
|
|
24
|
-
var _span;
|
|
24
|
+
var _span, _Tab, _Tab2, _Tab3, _Tab4, _Tab5;
|
|
25
25
|
function Tab() {
|
|
26
26
|
const prefix = usePrefix.usePrefix();
|
|
27
27
|
return /*#__PURE__*/React__default["default"].createElement("li", {
|
|
@@ -44,7 +44,7 @@ function TabsSkeleton(_ref) {
|
|
|
44
44
|
className: tabClasses
|
|
45
45
|
}, rest), /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
46
46
|
className: `${prefix}--tabs__nav`
|
|
47
|
-
}, Tab
|
|
47
|
+
}, _Tab || (_Tab = /*#__PURE__*/React__default["default"].createElement(Tab, null)), _Tab2 || (_Tab2 = /*#__PURE__*/React__default["default"].createElement(Tab, null)), _Tab3 || (_Tab3 = /*#__PURE__*/React__default["default"].createElement(Tab, null)), _Tab4 || (_Tab4 = /*#__PURE__*/React__default["default"].createElement(Tab, null)), _Tab5 || (_Tab5 = /*#__PURE__*/React__default["default"].createElement(Tab, null))));
|
|
48
48
|
}
|
|
49
49
|
TabsSkeleton.propTypes = {
|
|
50
50
|
/**
|