@splunk/react-ui 4.12.1 → 4.14.0

package/TransitionOpen.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 173);
+/******/ 	return __webpack_require__(__webpack_require__.s = 180);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -101,7 +101,7 @@ module.exports = require("prop-types");
 
 /***/ }),
 
-/***/ 173:
+/***/ 180:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -123,16 +123,16 @@ var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_pr
 var external_lodash_ = __webpack_require__(4);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/Animation"
-var Animation_ = __webpack_require__(31);
+var Animation_ = __webpack_require__(34);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/focus"
-var focus_ = __webpack_require__(26);
+var focus_ = __webpack_require__(28);
 
 // EXTERNAL MODULE: external "@splunk/ui-utils/style"
 var style_ = __webpack_require__(32);
 
 // EXTERNAL MODULE: external "react-spring"
-var external_react_spring_ = __webpack_require__(18);
+var external_react_spring_ = __webpack_require__(21);
 
 // EXTERNAL MODULE: external "styled-components"
 var external_styled_components_ = __webpack_require__(3);
@@ -208,6 +208,7 @@ var propTypes = {
   outerClassName: external_prop_types_default.a.string,
   outerId: external_prop_types_default.a.string,
   outerStyle: external_prop_types_default.a.object,
+  renderChildrenWhenCollapsed: external_prop_types_default.a.bool,
   retainFocus: external_prop_types_default.a.bool,
   takeFocus: external_prop_types_default.a.bool
 };
@@ -217,6 +218,7 @@ var defaultProps = {
   innerStyle: {},
   open: false,
   outerStyle: {},
+  renderChildrenWhenCollapsed: false,
   retainFocus: false,
   takeFocus: false
 };
@@ -307,7 +309,8 @@ var TransitionOpen_TransitionOpen = /*#__PURE__*/function (_Component) {
           open = _this$props2.open,
           outerClassName = _this$props2.outerClassName,
           outerId = _this$props2.outerId,
-          outerStyle = _this$props2.outerStyle;
+          outerStyle = _this$props2.outerStyle,
+          renderChildrenWhenCollapsed = _this$props2.renderChildrenWhenCollapsed;
       var animating = _this.state.animating;
       var dimension;
 
@@ -330,6 +333,27 @@ var TransitionOpen_TransitionOpen = /*#__PURE__*/function (_Component) {
 
         }
       }
+
+      if (!open && !animating && renderChildrenWhenCollapsed) {
+        return /*#__PURE__*/external_react_default.a.createElement(Styled, {
+          $hideOverflow: false,
+          className: Object(style_["toClassName"])(className, outerClassName),
+          style: _objectSpread(_objectSpread({}, outerStyle), dimension && _defineProperty({}, dimension, value)),
+          id: outerId
+        }, /*#__PURE__*/external_react_default.a.createElement(StyledInner, _extends({
+          "data-test": "transition-open"
+        }, Object(external_lodash_["omit"])(_this.props, Object(external_lodash_["keys"])(TransitionOpen.propTypes)), {
+          ref: _this.handleMount,
+          tabIndex: -1,
+          className: innerClassName,
+          id: id,
+          onKeyDown: _this.props.retainFocus ? _this.handleTab : undefined,
+          style: _objectSpread(_objectSpread({}, innerStyle), {}, {
+            transform: transform,
+            display: 'none'
+          })
+        }), children));
+      }
       /* eslint-disable jsx-a11y/no-static-element-interactions */
 
 
@@ -466,21 +490,21 @@ _defineProperty(TransitionOpen_TransitionOpen, "getDerivedStateFromProps", funct
 
 /***/ }),
 
-/***/ 18:
+/***/ 2:
 /***/ (function(module, exports) {
 
-module.exports = require("react-spring");
+module.exports = require("react");
 
 /***/ }),
 
-/***/ 2:
+/***/ 21:
 /***/ (function(module, exports) {
 
-module.exports = require("react");
+module.exports = require("react-spring");
 
 /***/ }),
 
-/***/ 26:
+/***/ 28:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/ui-utils/focus");
@@ -494,17 +518,17 @@ module.exports = require("styled-components");
 
 /***/ }),
 
-/***/ 31:
+/***/ 32:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/react-ui/Animation");
+module.exports = require("@splunk/ui-utils/style");
 
 /***/ }),
 
-/***/ 32:
+/***/ 34:
 /***/ (function(module, exports) {
 
-module.exports = require("@splunk/ui-utils/style");
+module.exports = require("@splunk/react-ui/Animation");
 
 /***/ }),
 

package/Typography.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 179);
+/******/ 	return __webpack_require__(__webpack_require__.s = 186);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -94,7 +94,7 @@ module.exports = require("prop-types");
 
 /***/ }),
 
-/***/ 179:
+/***/ 186:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -117,7 +117,7 @@ var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_pr
 var external_lodash_ = __webpack_require__(4);
 
 // EXTERNAL MODULE: external "@splunk/themes/mixins"
-var mixins_ = __webpack_require__(56);
+var mixins_ = __webpack_require__(59);
 var mixins_default = /*#__PURE__*/__webpack_require__.n(mixins_);
 
 // EXTERNAL MODULE: external "styled-components"
@@ -215,7 +215,7 @@ module.exports = require("lodash");
 
 /***/ }),
 
-/***/ 56:
+/***/ 59:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/themes/mixins");

package/WaitSpinner.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 174);
+/******/ 	return __webpack_require__(__webpack_require__.s = 181);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -101,7 +101,7 @@ module.exports = require("prop-types");
 
 /***/ }),
 
-/***/ 174:
+/***/ 181:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -120,7 +120,7 @@ var external_prop_types_ = __webpack_require__(1);
 var external_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_prop_types_);
 
 // EXTERNAL MODULE: external "@splunk/react-ui/AnimationToggle"
-var AnimationToggle_ = __webpack_require__(36);
+var AnimationToggle_ = __webpack_require__(38);
 
 // EXTERNAL MODULE: external "@splunk/themes"
 var themes_ = __webpack_require__(0);
@@ -281,7 +281,7 @@ module.exports = require("styled-components");
 
 /***/ }),
 
-/***/ 36:
+/***/ 38:
 /***/ (function(module, exports) {
 
 module.exports = require("@splunk/react-ui/AnimationToggle");

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@splunk/react-ui",
-  "version": "4.12.1",
+  "version": "4.14.0",
   "description": "Library of React components that implement the Splunk design language",
   "license": "Apache-2.0",
   "author": "Splunk Inc.",
   "scripts": {
-    "build": "cross-env NODE_ENV=production webpack && yarn types:build && yarn build-storybook",
+    "build": "cross-env NODE_ENV=production webpack && yarn types:build",
     "docs": "NODE_ENV=production webpack --config docs.gen.webpack.config.js",
     "docs:publish": "cicd-publish-docs docs --force",
-    "docs:publish:external": "cicd-publish-docs docs --force --suffix=public",
+    "docs:publish:external": "cicd-publish-docs docs-external --force --suffix=public",
     "docs:start": "webpack serve --config docs.gen.webpack.config.js",
     "eslint": "eslint src .storybook --ext \".ts,.tsx,.js,.jsx\"",
     "eslint:fix": "yarn run eslint --fix",
@@ -17,20 +17,17 @@
     "lint:ci": "yarn run eslint:ci && yarn run stylelint",
     "start": "cross-env NODE_ENV=development webpack --watch",
     "storybook": "start-storybook -p 6006",
-    "storybook:test": "./.storybook/scripts/test.sh",
-    "storybook:test:all": "./.storybook/scripts/test.sh --all",
-    "storybook:build": "./.storybook/scripts/build.sh",
+    "storybook:test": "./.storybook-visual/scripts/test.sh",
+    "storybook:test:all": "./.storybook-visual/scripts/test.sh --all",
+    "storybook:a11y": "./.storybook-visual/scripts/test.sh --a11y",
+    "storybook:a11y:all": "./.storybook-visual/scripts/test.sh --a11y --all",
+    "storybook:build": "yarn build-storybook",
     "stylelint": "stylelint \"src/**/*.{ts,tsx,js,jsx}\" --config stylelint.config.js",
     "test": "jest",
     "test:ci": "JEST_JUNIT_OUTPUT_DIR=./test-reports JEST_JUNIT_OUTPUT_NAME=unit-results.xml JEST_JUNIT_CLASSNAME=unit yarn run test --ci --reporters=default jest-junit --coverage --coverageDirectory=coverage_report/coverage_maps_unit --coverageReporters=cobertura",
     "test:watch": "jest --watch",
-    "test:functional": "splunk-wdio-functional-test-runner functional.local.conf.js",
-    "test:functional:coverage": "cross-env NODE_ENV=test-coverage splunk-wdio-functional-test-runner functional.local.conf.js --coverage",
-    "test:functional:ci": "cross-env NODE_ENV=test-coverage splunk-wdio-functional-test-runner functional.ci.conf.js --coverage-maps",
-    "test:functional:cloud": "splunk-wdio-functional-test-runner functional.cloud.conf.js",
     "test:cypress": "yarn cypress open-ct",
     "test:cypress:ci": "yarn cypress run-ct",
-    "test:visual:cloud": "splunk-wdio-functional-test-runner functional.visual.conf.js",
     "types:build": "tsc --emitDeclarationOnly --declaration --declarationDir ./types && node ./scripts/pruneTypes.js",
     "types:start": "yarn types:build --watch"
   },
@@ -40,9 +37,9 @@
     "styled-components": "5.1.1"
   },
   "dependencies": {
-    "@splunk/react-icons": "^3.2.0",
+    "@splunk/react-icons": "^3.3.0",
     "@splunk/themes": "^0.13.0",
-    "@splunk/ui-utils": "^1.5.0",
+    "@splunk/ui-utils": "^1.5.1",
     "@types/commonmark": "^0.27.0",
     "@types/lodash": "^4.14.156",
     "@types/react": "^16.9.38",
@@ -82,7 +79,7 @@
     "@storybook/addon-interactions": "^6.5.9",
     "@storybook/csf": "^0.0.1",
     "@storybook/react": "^6.5.9",
-    "@storybook/test-runner": "^0.4.0",
+    "@storybook/test-runner": "^0.9.0",
     "@storybook/testing-react": "^1.3.0",
     "@testing-library/cypress": "^8.0.2",
     "@testing-library/jest-dom": "^5.16.1",
@@ -125,6 +122,7 @@
     "fs-readdir-recursive": "^1.0.0",
     "glob": "^7.1.6",
     "html-webpack-plugin": "^3.2.0",
+    "http-server": "^14.1.1",
     "jest": "^25.1.0",
     "jest-image-snapshot": "^5.1.0",
     "jest-junit": "^10.0.0",

package/test-runner-jest.config.js

@@ -18,17 +18,30 @@ module.exports = {
         '^.+\\.examples\\.[jt]sx?$': '@storybook/test-runner/playwright/transform',
         '^.+\\.tsx?$': 'babel-jest',
     },
-    snapshotResolver: '<rootDir>/.storybook/config/snapshotResolver.js',
+    snapshotResolver: '<rootDir>/.storybook-visual/config/snapshotResolver.js',
     reporters: [
         'default',
         [
             'jest-stare',
             {
-                resultDir: `./test-reports/${process.env.STORYBOOK_TEST_BROWSER}-${process.env.STORYBOOK_THEME_FAMILY}`,
-                reportTitle: `Visual A11y Test Report - ${process.env.STORYBOOK_TEST_BROWSER} ${process.env.STORYBOOK_THEME_FAMILY}`,
-                reportHeadline: `Visual A11y Test Report - ${process.env.STORYBOOK_TEST_BROWSER} ${process.env.STORYBOOK_THEME_FAMILY}`,
+                resultDir: `./test-reports/${
+                    process.env.STORYBOOK_TEST_A11Y === 'false' ? 'visual' : 'a11y'
+                }/${process.env.STORYBOOK_TEST_BROWSER}-${process.env.STORYBOOK_THEME_FAMILY}`,
+                reportTitle: `${
+                    process.env.STORYBOOK_TEST_A11Y === 'false' ? 'Visual' : 'A11y'
+                } Test Report - ${process.env.STORYBOOK_TEST_BROWSER} ${
+                    process.env.STORYBOOK_THEME_FAMILY
+                }`,
+                reportHeadline: `${
+                    process.env.STORYBOOK_TEST_A11Y === 'false' ? 'Visual' : 'A11y'
+                } Test Report - ${process.env.STORYBOOK_TEST_BROWSER} ${
+                    process.env.STORYBOOK_THEME_FAMILY
+                }`,
                 hidePending: true,
-                resultHtml: `visual-report.html`,
+                resultHtml:
+                    process.env.STORYBOOK_TEST_A11Y === 'false'
+                        ? 'visual-report.html'
+                        : 'a11y-report.html',
             },
         ],
     ],

package/types/src/Button/Button.d.ts

@@ -12,7 +12,7 @@ interface ButtonPropsBase {
     /** Returns a value on click. Use when composing or testing. */
     action?: string;
     /** Changes the style of the button.
-     * @themeNotes 'pill': supported by `enterprise`, `enterpriseDark` and `lite`. 'destructive', 'toggle' and 'flat': supported by `prisma`.
+     * @themeNotes Enterprise themes support the following appearances:`default`, `primary`, `secondary`, and `pill`. Prisma themes support the `default`, `primary`, `secondary`, `destructive`, `toggle` and `flat` appearances.
      */
     appearance?: 'default' | 'secondary' | 'primary' | 'destructive' | 'pill' | 'toggle' | 'flat';
     /** Removes the right border and border-radius of the button so you can

package/types/src/Calendar/Calendar.d.ts

@@ -2,12 +2,17 @@ import React, { Component } from 'react';
 import { DateTableChangeHandler } from './DateTable';
 import { ClassComponentProps } from '../utils/types';
 declare type CalendarChangeHandler = DateTableChangeHandler;
+declare const calendarActiveSelector = "[data-active-day=\"true\"]";
 interface CalendarPropsBase {
     /**
      * The id of the description. When placed in a ControlGroup, this automatically set to the
      * ControlGroup's help component.
      */
     describedBy?: string;
+    /**
+     * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
+     */
+    elementRef?: React.Ref<HTMLDivElement>;
     /** Highlight today's day. */
     highlightToday?: boolean;
     /**
@@ -31,20 +36,28 @@ declare type CalendarProps = ClassComponentProps<CalendarPropsBase, typeof defau
 interface CalendarState {
     internalValue: string;
     todayValue: string;
+    source: 'day' | 'month' | null;
 }
 declare class Calendar extends Component<CalendarProps, CalendarState> {
     private monthHeaderId;
     private todayTimerId?;
+    private calendarRef;
     static propTypes: React.WeakValidationMap<ClassComponentProps<CalendarPropsBase, Required<Pick<CalendarPropsBase, "value" | "locale">>, "div", never>>;
     static defaultProps: Required<Pick<CalendarPropsBase, "value" | "locale">>;
     constructor(props: Readonly<CalendarProps>);
     componentDidMount(): void;
     componentWillUnmount(): void;
-    componentDidUpdate(prevProps: Readonly<CalendarProps>): void;
+    componentDidUpdate(prevProps: Readonly<CalendarProps>, prevState: Readonly<CalendarState>): void;
+    /**
+     * Place focus on the active day.
+     */
+    focusActiveDay(): void;
     private getToday;
     private handleMonthChange;
+    private handleDayChange;
     private static validateValue;
+    private handleCalendarMount;
     render(): JSX.Element;
 }
 export default Calendar;
-export { CalendarChangeHandler };
+export { CalendarChangeHandler, calendarActiveSelector };

package/types/src/Calendar/DateTable.d.ts

@@ -1,18 +1,21 @@
+import React from 'react';
 import PropTypes from 'prop-types';
-import { DayClickHandler } from './Day';
 import { ComponentProps } from '../utils/types';
-declare type DateTableChangeHandler = DayClickHandler;
+declare type DateTableChangeHandler = (event: React.MouseEvent<HTMLTableCellElement> | React.KeyboardEvent<HTMLTableCellElement>, data: {
+    value: string;
+}) => void;
 interface DateTablePropsBase {
     displayValue: string;
     highlightToday?: boolean;
     labelledBy?: string;
     locale?: string;
     onChange?: DateTableChangeHandler;
+    onInternalChange?: DateTableChangeHandler;
     selectedValue: string;
     todayValue?: string;
 }
 declare type DateTableProps = ComponentProps<DateTablePropsBase, 'table'>;
-declare function DateTable({ displayValue, highlightToday, labelledBy, locale, onChange, selectedValue, todayValue, ...otherProps }: DateTableProps): JSX.Element;
+declare function DateTable({ displayValue, highlightToday, labelledBy, locale, onChange, onInternalChange, selectedValue, todayValue, ...otherProps }: DateTableProps): JSX.Element;
 declare namespace DateTable {
     var propTypes: {
         displayValue: PropTypes.Validator<string>;
@@ -20,6 +23,7 @@ declare namespace DateTable {
         labelledBy: PropTypes.Requireable<string>;
         locale: PropTypes.Requireable<string>;
         onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        onInternalChange: PropTypes.Requireable<(...args: any[]) => any>;
         selectedValue: PropTypes.Validator<string>;
         todayValue: PropTypes.Requireable<string>;
     };

package/types/src/Calendar/Day.d.ts

@@ -1,31 +1,40 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { ComponentProps } from '../utils/types';
-declare type DayClickHandler = (event: React.MouseEvent<HTMLButtonElement>, data: {
+declare type DayClickHandler = (event: React.MouseEvent<HTMLTableCellElement>, data: {
     value: string;
 }) => void;
-interface DayPropsBase {
-    /** Day number to be displayed */
+declare type DayKeyDownHandler = (event: React.KeyboardEvent<HTMLTableCellElement>, data: {
     value: string;
+}) => void;
+interface DayPropsBase {
+    /** Whether or not this day has the active cursor. */
+    active?: boolean;
     /** Locale set by language and localization specifiers. */
     locale?: string;
     /** Callback for click */
     onClick?: DayClickHandler;
+    /** Callback for keyDown */
+    onKeyDown?: DayKeyDownHandler;
     /** Whether or not this day is selected. */
     selected?: boolean;
     /** Indicate the day is today. */
     today?: boolean;
+    /** Day number to be displayed */
+    value: string;
 }
 declare type DayProps = ComponentProps<DayPropsBase, 'td'>;
-declare function Day({ locale, onClick, selected, today, value, ...otherProps }: DayProps): JSX.Element;
+declare function Day({ active, locale, onClick, onKeyDown, selected, today, value, ...otherProps }: DayProps): JSX.Element;
 declare namespace Day {
     var propTypes: {
+        active: PropTypes.Requireable<boolean>;
         locale: PropTypes.Requireable<string>;
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
+        onKeydown: PropTypes.Requireable<(...args: any[]) => any>;
         selected: PropTypes.Requireable<boolean>;
         today: PropTypes.Requireable<boolean>;
         value: PropTypes.Requireable<string>;
     };
 }
 export default Day;
-export { DayClickHandler };
+export { DayClickHandler, DayKeyDownHandler };

package/types/src/CollapsiblePanel/CollapsiblePanel.d.ts

@@ -65,6 +65,10 @@ interface CollapsiblePanelPropsBase {
      * is permitted, as is `null` (which will use the CSS default of "visible")
      */
     overflow?: string;
+    /**
+     * When true, children are always rendered whether collapsed or not.
+     */
+    renderChildrenWhenCollapsed?: boolean;
     /**
      * Displays the name of the panel in its title bar.
      */
@@ -83,7 +87,7 @@ interface CollapsiblePanelUncontrolledProps extends CollapsiblePanelPropsBase {
     defaultOpen?: boolean;
     open?: never;
 }
-declare const defaultProps: Required<Pick<CollapsiblePanelPropsBase, 'disabled' | 'overflow' | 'titleWithActions'>>;
+declare const defaultProps: Required<Pick<CollapsiblePanelPropsBase, 'disabled' | 'overflow' | 'renderChildrenWhenCollapsed' | 'titleWithActions'>>;
 declare type CollapsiblePanelProps = ClassComponentProps<CollapsiblePanelControlledProps | CollapsiblePanelUncontrolledProps, typeof defaultProps, 'div'>;
 interface CollapsiblePanelState {
     animating: boolean;
@@ -93,8 +97,8 @@ declare class CollapsiblePanel extends Component<CollapsiblePanelProps, Collapsi
     private controlledExternally;
     private containerId;
     private toggleId;
-    static propTypes: React.WeakValidationMap<CollapsiblePanelControlledProps & Required<Pick<CollapsiblePanelPropsBase, "overflow" | "disabled" | "titleWithActions">> & Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "slot" | "style" | "onChange" | "onPause" | "className" | "color" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "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" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "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" | "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" | "onClick" | "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" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is">> | React.WeakValidationMap<CollapsiblePanelUncontrolledProps & Required<Pick<CollapsiblePanelPropsBase, "overflow" | "disabled" | "titleWithActions">> & Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "slot" | "style" | "onChange" | "onPause" | "className" | "color" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "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" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "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" | "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" | "onClick" | "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" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is">>;
-    static defaultProps: Required<Pick<CollapsiblePanelPropsBase, "overflow" | "disabled" | "titleWithActions">>;
+    static propTypes: React.WeakValidationMap<CollapsiblePanelControlledProps & Required<Pick<CollapsiblePanelPropsBase, "overflow" | "disabled" | "renderChildrenWhenCollapsed" | "titleWithActions">> & Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "slot" | "style" | "onChange" | "onPause" | "className" | "color" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "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" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "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" | "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" | "onClick" | "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" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is">> | React.WeakValidationMap<CollapsiblePanelUncontrolledProps & Required<Pick<CollapsiblePanelPropsBase, "overflow" | "disabled" | "renderChildrenWhenCollapsed" | "titleWithActions">> & Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "slot" | "style" | "onChange" | "onPause" | "className" | "color" | "id" | "lang" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "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" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "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" | "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" | "onClick" | "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" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is">>;
+    static defaultProps: Required<Pick<CollapsiblePanelPropsBase, "overflow" | "disabled" | "renderChildrenWhenCollapsed" | "titleWithActions">>;
     constructor(props: Readonly<CollapsiblePanelProps>);
     componentDidUpdate(prevProps: Readonly<CollapsiblePanelProps>): void;
     private handleRequestClose;