@pingux/astro 2.79.0 → 2.80.0-alpha.1

package/lib/cjs/components/CollapsiblePanel/CollapsiblePanel.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { CollapsiblePanelProps } from '../../types';
+declare const CollapsiblePanel: React.ForwardRefExoticComponent<CollapsiblePanelProps<object> & React.RefAttributes<HTMLDivElement>>;
+export default CollapsiblePanel;

package/lib/cjs/components/CollapsiblePanel/CollapsiblePanel.js

@@ -14,10 +14,8 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-c
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _kebabCase = _interopRequireDefault(require("lodash/kebabCase"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _ = require("../..");
 var _hooks = require("../../hooks");
-var _isIterable = require("../../utils/devUtils/props/isIterable");
 var _CollapsiblePanelBadge = _interopRequireDefault(require("../CollapsiblePanelContainer/CollapsiblePanelBadge"));
 var _react2 = require("@emotion/react");
 var _excluded = ["selectedFilterCount", "className", "closeAriaLabel", "children", "isDefaultOpen", "isOpen", "items", "listTitle", "onOpenChange", "onSelectionChange", "openAriaLabel"];
@@ -64,7 +62,9 @@ var CollapsiblePanel = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     ref: ref,
     tabIndex: -1,
     variant: "collapsiblePanel.content"
-  }, mergedProps, others), (0, _react2.jsx)(_.Box, {
+  }, mergedProps, others, {
+    role: "region"
+  }), (0, _react2.jsx)(_.Box, {
     isRow: true,
     variant: "collapsiblePanel.containerTitle"
   }, (0, _react2.jsx)(_.Text, {
@@ -81,37 +81,12 @@ var CollapsiblePanel = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     onSelectionChange: onSelectionChange,
     selectionMode: "none",
     selectionStyle: "highlight",
-    style: {
-      width: '100%'
-    },
-    pl: "md"
+    sx: {
+      width: '100%',
+      pl: 'md'
+    }
   }, children))));
 });
-CollapsiblePanel.propTypes = {
-  /** Amount of selected items indicator. */
-  selectedFilterCount: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-  /** Title of list content. */
-  listTitle: _propTypes["default"].string,
-  /** Defines a string value that labels the trigger icon when menu is open. */
-  closeAriaLabel: _propTypes["default"].string,
-  /** Sets the default open state of the overlay. */
-  isDefaultOpen: _propTypes["default"].bool,
-  /** Whether the overlay is currently open. */
-  isOpen: _propTypes["default"].bool,
-  /** The list of ListView items (controlled). */
-  items: _isIterable.isIterableProp,
-  /**
-   * Method that is called when the open state of the menu changes.
-   * Returns the new open state and the action that caused the opening of the menu.
-   *
-   * `(isOpen: boolean, overlayTrigger: OverlayTriggerAction) => void`
-   */
-  onOpenChange: _propTypes["default"].func,
-  /** Callback function that fires when the selected key changes. */
-  onSelectionChange: _propTypes["default"].func,
-  /** Defines a string value that labels the trigger icon when menu is closed. */
-  openAriaLabel: _propTypes["default"].string
-};
 CollapsiblePanel.defaultProps = {
   isDefaultOpen: true
 };

package/lib/cjs/components/CollapsiblePanel/CollapsiblePanel.stories.d.ts

@@ -0,0 +1,5 @@
+import { StoryFn } from '@storybook/react';
+import { CollapsiblePanelProps } from '../../types';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: StoryFn<CollapsiblePanelProps<object>>;

package/lib/cjs/components/CollapsiblePanel/CollapsiblePanel.stories.js

@@ -10,7 +10,7 @@ var _react = _interopRequireDefault(require("react"));
 var _storybookAddonDesigns = require("storybook-addon-designs");
 var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
 var _index = require("../../index");
-var _figmaLinks = require("../../utils/designUtils/figmaLinks.ts");
+var _figmaLinks = require("../../utils/designUtils/figmaLinks");
 var _CollapsiblePanel = _interopRequireDefault(require("./CollapsiblePanel.mdx"));
 var _react2 = require("@emotion/react");
 var _default = {

package/lib/cjs/components/CollapsiblePanel/CollapsiblePanel.styles.d.ts

@@ -0,0 +1,220 @@
+export declare const toggle: {
+    bg: string;
+    borderRadius: string;
+    height: string;
+    minWidth: string;
+    pl: string;
+    ml: string;
+    path: {
+        fill: string;
+    };
+    '&.is-hovered': {
+        backgroundColor: string;
+    };
+    '&.is-pressed': {
+        backgroundColor: string;
+    };
+    ':focus': {
+        outline: string;
+    };
+    '&.is-focused': {
+        outlineOffset: string;
+        zIndex: number;
+        outline: string;
+        outlineColor: string;
+    };
+    justifyContent: string;
+    appearance: string;
+    alignItems: string;
+    alignSelf: string;
+    display: string;
+    flexGrow: number;
+    flexShrink: number;
+    cursor: string;
+    p: string;
+    width: string;
+    outline: string;
+};
+declare const _default: {
+    container: {
+        pr: string;
+        minHeight: string;
+        '>div': {
+            visibility: string;
+            width: number;
+            transition: string;
+        };
+        '&.is-open>div': {
+            visibility: string;
+            width: string;
+        };
+    };
+    content: {
+        bg: string;
+        fontSize: string;
+        height: string;
+        width: string;
+        '&.is-focused': {
+            boxShadow: string;
+            outline: string;
+            outlineColor: string;
+            outlineOffset: string;
+            borderColor: string;
+        };
+        '& div': {
+            alignItems: string;
+            display: string;
+            minHeight: string;
+            padding: string;
+            width: string;
+            justifyContent: string;
+        };
+    };
+    containerTitle: {
+        alignContent: string;
+        fontWeight: string;
+        minHeight: string;
+        alignItems: string;
+        padding: string;
+        flexWrap: string;
+        maxWidth: string;
+        margin: string;
+        width: string;
+        '.is-open &': {
+            width: string;
+        };
+    };
+    badge: {
+        borderRadius: string;
+        display: string;
+        height: string;
+        justifyContent: string;
+        minWidth: string;
+        position: string;
+        pb: string;
+        pr: string;
+        pl: string;
+        alignItems: string;
+        fontWeight: number;
+        '.is-open &.title-badge': {
+            minWidth: string;
+            display: string;
+            transition: string;
+            width: string;
+        };
+        '&.title-badge': {
+            display: string;
+            width: string;
+        };
+    };
+    item: {
+        minHeight: string;
+        margin: string;
+    };
+    toggle: {
+        bg: string;
+        borderRadius: string;
+        height: string;
+        minWidth: string;
+        pl: string;
+        ml: string;
+        path: {
+            fill: string;
+        };
+        '&.is-hovered': {
+            backgroundColor: string;
+        };
+        '&.is-pressed': {
+            backgroundColor: string;
+        };
+        ':focus': {
+            outline: string;
+        };
+        '&.is-focused': {
+            outlineOffset: string;
+            zIndex: number;
+            outline: string;
+            outlineColor: string;
+        };
+        justifyContent: string;
+        appearance: string;
+        alignItems: string;
+        alignSelf: string;
+        display: string;
+        flexGrow: number;
+        flexShrink: number;
+        cursor: string;
+        p: string;
+        width: string;
+        outline: string;
+    };
+    neutralText: {
+        color: string;
+        lineHeight: string;
+        textDecoration: string;
+        display: string;
+        justifyContent: string;
+        width: string;
+        '&.is-current': {
+            cursor: string;
+            color: string;
+        };
+        '&.is-focused': {
+            boxShadow: string;
+            outline: string;
+            outlineColor: string;
+            outlineOffset: string;
+        };
+        bg: string;
+        border: string;
+        borderColor: string;
+        height: string;
+        padding: string;
+        '&.is-hovered': {
+            textDecoration: string;
+        };
+        fontSize: string;
+        fontWeight: number;
+        fontFamily: string;
+        overflowWrap: import("../..").overflowWrap;
+        maxWidth: string;
+        wordWrap: import("../..").wordWrap;
+        wordBreak: import("../..").wordBreak;
+        cursor: string;
+        minWidth: string;
+        outline: string;
+        alignItems: string;
+        borderRadius: string;
+        flexShrink: number;
+        whiteSpace: string;
+    };
+    itemText: {
+        color: string;
+        fontSize: string;
+        fontWeight: number;
+        overflow: string;
+        marginRight: string;
+        textOverflow: string;
+        whiteSpace: string;
+        display: string;
+        overflowWrap: import("../..").overflowWrap;
+        maxWidth: string;
+        wordWrap: import("../..").wordWrap;
+        wordBreak: import("../..").wordBreak;
+    };
+    title: {
+        fontSize: string;
+        fontWeight: number;
+        color: string;
+        whiteSpace: string;
+        overflow: string;
+        textOverflow: string;
+        mr: string;
+        display: string;
+        overflowWrap: import("../..").overflowWrap;
+        maxWidth: string;
+        wordWrap: import("../..").wordWrap;
+        wordBreak: import("../..").wordBreak;
+    };
+};
+export default _default;

package/lib/cjs/components/CollapsiblePanel/CollapsiblePanel.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/cjs/components/CollapsiblePanel/CollapsiblePanel.test.js

@@ -35,7 +35,8 @@ beforeAll(function () {
     return 1024;
   });
   jest.spyOn(window, 'requestAnimationFrame').mockImplementation(function (cb) {
-    return cb();
+    cb(0);
+    return 0;
   });
 });
 afterEach(function () {

package/lib/cjs/components/CollapsiblePanel/index.d.ts

@@ -0,0 +1 @@
+export { default } from './CollapsiblePanel';

package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelBadge.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { CollapsiblePanelBadgeProps } from '../../types';
+/**
+ * The CollapsiblePanelBadge serves as a badge to display selected count.
+ */
+declare const CollapsiblePanelBadge: React.ForwardRefExoticComponent<CollapsiblePanelBadgeProps & React.RefAttributes<HTMLDivElement>>;
+export default CollapsiblePanelBadge;

package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelBadge.js

@@ -12,7 +12,6 @@ exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Badge = _interopRequireDefault(require("../Badge"));
 var _react2 = require("@emotion/react");
 var _excluded = ["selectedFilterCount"];
@@ -22,22 +21,19 @@ var _excluded = ["selectedFilterCount"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var CollapsiblePanelBadge = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+  var _ref;
   var selectedFilterCount = props.selectedFilterCount,
     others = (0, _objectWithoutProperties2["default"])(props, _excluded);
   return (0, _react2.jsx)(_Badge["default"], (0, _extends2["default"])({
     ref: ref,
     as: "span",
     bg: "neutral.90",
-    label: selectedFilterCount.toString(),
+    label: (_ref = selectedFilterCount && selectedFilterCount.toString()) !== null && _ref !== void 0 ? _ref : '',
     textColor: "neutral.30",
     variant: "variants.collapsiblePanel.badge",
     isUppercase: true
   }, others));
 });
-CollapsiblePanelBadge.propTypes = {
-  selectedFilterCount: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-  margin: _propTypes["default"].string
-};
 CollapsiblePanelBadge.displayName = 'CollapsiblePanelBadge';
 var _default = CollapsiblePanelBadge;
 exports["default"] = _default;

package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelBadge.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelBadge.test.js

@@ -37,4 +37,11 @@ test('custom classname can be passed', function () {
   });
   var collapsiblePanelBadge = _testWrapper.screen.getByTestId(testId);
   expect(collapsiblePanelBadge).toHaveClass('testing-class');
+});
+test('Filter count is passed', function () {
+  getComponent({
+    selectedFilterCount: 5
+  });
+  var collapsiblePanelBadge = _testWrapper.screen.getByTestId(testId);
+  expect(collapsiblePanelBadge).toHaveTextContent('5');
 });

package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelContainer.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { CollapsiblePanelContainerProps } from '../../types';
+/**
+ * The CollapsiblePanelContainer serves as a wrapper around a list and its associated trigger,
+ * linking the list's open state with the trigger's press state and providing necessary context.
+ */
+declare const CollapsiblePanelContainer: React.ForwardRefExoticComponent<CollapsiblePanelContainerProps & React.RefAttributes<HTMLElement>>;
+export default CollapsiblePanelContainer;

package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelContainer.js

@@ -15,7 +15,6 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactStately = require("react-stately");
 var _ChevronLeftIcon = _interopRequireDefault(require("@pingux/mdi-react/ChevronLeftIcon"));
 var _ChevronRightIcon = _interopRequireDefault(require("@pingux/mdi-react/ChevronRightIcon"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../../hooks");
 var _index = require("../../index");
 var _CollapsiblePanelBadge = _interopRequireDefault(require("./CollapsiblePanelBadge"));
@@ -38,7 +37,7 @@ var CollapsiblePanelContainer = /*#__PURE__*/(0, _react.forwardRef)(function (pr
     openAriaLabel = props.openAriaLabel,
     collapsiblePanelId = props.collapsiblePanelId,
     others = (0, _objectWithoutProperties2["default"])(props, _excluded);
-  var triggerRef = _react["default"].useRef();
+  var triggerRef = _react["default"].useRef(null);
   var state = (0, _reactStately.useOverlayTriggerState)({
     defaultOpen: isDefaultOpen,
     isOpen: isOpen,
@@ -51,14 +50,16 @@ var CollapsiblePanelContainer = /*#__PURE__*/(0, _react.forwardRef)(function (pr
     classNames = _useStatusClasses.classNames;
   var handleButtonPress = function handleButtonPress() {
     if (state.isOpen) {
-      close(state, triggerRef, close);
+      // close(state, triggerRef, close);
+      close();
     } else {
       state.open();
     }
   };
   var handleClose = function handleClose(e) {
     if (e.key === 'Escape') {
-      close(state, triggerRef, close);
+      // close(state, triggerRef, close);
+      close();
     }
   };
   return (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
@@ -76,7 +77,7 @@ var CollapsiblePanelContainer = /*#__PURE__*/(0, _react.forwardRef)(function (pr
     ref: triggerRef,
     variant: "toggle",
     pr: "sm",
-    "aria-controls": state.isOpen ? collapsiblePanelId : null
+    "aria-controls": state.isOpen ? collapsiblePanelId : ''
   }, (0, _react2.jsx)(_index.Icon, {
     color: "active",
     icon: state.isOpen ? _ChevronRightIcon["default"] : _ChevronLeftIcon["default"],
@@ -91,27 +92,6 @@ var CollapsiblePanelContainer = /*#__PURE__*/(0, _react.forwardRef)(function (pr
     selectedFilterCount: selectedFilterCount
   })), children);
 });
-CollapsiblePanelContainer.propTypes = {
-  /** Amount of selected items indicator. */
-  selectedFilterCount: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-  /** Defines a string value that labels the trigger icon when menu is open. */
-  closeAriaLabel: _propTypes["default"].string,
-  /** Sets the default open state of the overlay. */
-  isDefaultOpen: _propTypes["default"].bool,
-  /** Whether the overlay is currently open. */
-  isOpen: _propTypes["default"].bool,
-  /**
-   * Method that is called when the open state of the menu changes.
-   * Returns the new open state and the action that caused the opening of the menu.
-   *
-   * `(isOpen: boolean, overlayTrigger: OverlayTriggerAction) => void`
-   */
-  onOpenChange: _propTypes["default"].func,
-  /** Defines a string value that labels the trigger icon when menu is closed. */
-  openAriaLabel: _propTypes["default"].string,
-  /** Used in button aria-controls attribute. */
-  collapsiblePanelId: _propTypes["default"].string
-};
 CollapsiblePanelContainer.defaultProps = {
   openAriaLabel: 'Open filter menu?',
   closeAriaLabel: 'Close filter menu?'

package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelContainer.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/cjs/components/CollapsiblePanelContainer/CollapsiblePanelContainer.test.js

@@ -46,20 +46,13 @@ test('custom classname can be passed', function () {
 test('shows badge when container is closed', function () {
   getComponent({
     selectedFilterCount: 9,
-    state: {
-      isOpen: false
-    }
+    isOpen: false
   });
   var badge = _testWrapper.screen.getByTestId(collapsiblePanelBadgeId);
   expect(badge).toBeInTheDocument();
 });
 test('updates aria label when button is clicked', function () {
-  var state = {
-    isOpen: true
-  };
-  getComponent({
-    state: state
-  });
+  getComponent();
   var button = _testWrapper.screen.getByTestId(collapsiblePanelButtonId);
   var container = _testWrapper.screen.getByTestId(testId);
   _userEvent["default"].click(button);

package/lib/cjs/components/CollapsiblePanelContainer/index.d.ts

@@ -0,0 +1 @@
+export { default } from './CollapsiblePanelContainer';

package/lib/cjs/components/CollapsiblePanelItem/CollapsiblePanelItem.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { CollapsiblePanelItemProps } from '../../types';
+declare const CollapsiblePanelItem: React.ForwardRefExoticComponent<CollapsiblePanelItemProps & React.RefAttributes<HTMLDivElement>>;
+export default CollapsiblePanelItem;

package/lib/cjs/components/CollapsiblePanelItem/CollapsiblePanelItem.js

@@ -9,8 +9,8 @@ _Object$defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _index = require("../../index");
 var _react2 = require("@emotion/react");
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -19,13 +19,14 @@ var CollapsiblePanelItem = /*#__PURE__*/(0, _react.forwardRef)(function (props,
   var text = props.text,
     icon = props.icon,
     isDefaultSelected = props.isDefaultSelected,
-    onPress = props.onPress;
-  var iconElement = icon && (0, _react2.jsx)(_index.Icon, {
+    onPress = props.onPress,
+    iconProps = props.iconProps;
+  var iconElement = icon && (0, _react2.jsx)(_index.Icon, (0, _extends2["default"])({
     "data-testid": "collapsible-panel-data-icon",
     icon: icon,
     color: isDefaultSelected ? 'neutral.10' : 'active',
     size: 13
-  });
+  }, iconProps));
   return (0, _react2.jsx)(_index.Box, {
     "data-testid": "collapsible-panel-item",
     isRow: true,
@@ -45,25 +46,6 @@ var CollapsiblePanelItem = /*#__PURE__*/(0, _react.forwardRef)(function (props,
     "aria-label": "icon"
   }, iconElement)));
 });
-CollapsiblePanelItem.propTypes = {
-  /**
-     * Display text.
-     */
-  text: _propTypes["default"].string,
-  /**
-     * List icon.
-     */
-  icon: _propTypes["default"].shape({}),
-  /**
-   * Whether the element is default selected
-   * and has to use Icon element instead of IconButton
-   */
-  isDefaultSelected: _propTypes["default"].bool,
-  /**
-   * Handler that is called at the press on icon button
-   */
-  onPress: _propTypes["default"].func
-};
 CollapsiblePanelItem.displayName = 'CollapsiblePanelItem';
 var _default = CollapsiblePanelItem;
 exports["default"] = _default;

package/lib/cjs/components/CollapsiblePanelItem/CollapsiblePanelItem.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/cjs/components/CollapsiblePanelItem/index.d.ts

@@ -0,0 +1 @@
+export { default } from './CollapsiblePanelItem';

package/lib/cjs/components/IconButton/IconButton.styles.d.ts

@@ -514,7 +514,43 @@ declare const _default: {
             bg: string;
         };
     };
-    toggle: any;
+    toggle: {
+        bg: string;
+        borderRadius: string;
+        height: string;
+        minWidth: string;
+        pl: string;
+        ml: string;
+        path: {
+            fill: string;
+        };
+        '&.is-hovered': {
+            backgroundColor: string;
+        };
+        '&.is-pressed': {
+            backgroundColor: string;
+        };
+        ':focus': {
+            outline: string;
+        };
+        '&.is-focused': {
+            outlineOffset: string;
+            zIndex: number;
+            outline: string;
+            outlineColor: string;
+        };
+        justifyContent: string;
+        appearance: string;
+        alignItems: string;
+        alignSelf: string;
+        display: string;
+        flexGrow: number;
+        flexShrink: number;
+        cursor: string;
+        p: string;
+        width: string;
+        outline: string;
+    };
     tooltip: {
         button: any;
     };

package/lib/cjs/types/collapsiblePanel.d.ts

@@ -0,0 +1,66 @@
+/// <reference types="react" />
+import type { CollectionChildren } from '@react-types/shared';
+import { IconProps, IconTypeExtended } from './icon';
+export interface CollapsiblePanelProps<T> {
+    children?: React.ReactNode | CollectionChildren<T>;
+    className?: string;
+    /** Amount of selected items indicator. */
+    selectedFilterCount?: string | number;
+    /** Title of list content. */
+    listTitle?: string;
+    /** Defines a string value that labels the trigger icon when menu is open. */
+    closeAriaLabel?: string;
+    /** Sets the default open state of the overlay. */
+    isDefaultOpen?: boolean;
+    /** Whether the overlay is currently open. */
+    isOpen?: boolean;
+    /** The list of ListView items (controlled). */
+    items?: Iterable<object>;
+    /**
+     * Method that is called when the open state of the menu changes.
+     * Returns the new open state and the action that caused the opening of the menu.
+     *
+     * `(isOpen: boolean; overlayTrigger: OverlayTriggerAction) => void`
+     */
+    onOpenChange?: () => void;
+    /** Callback function that fires when the selected key changes. */
+    onSelectionChange?: () => void;
+    /** Defines a string value that labels the trigger icon when menu is closed. */
+    openAriaLabel?: string;
+}
+export interface CollapsiblePanelItemProps {
+    text: string;
+    icon?: IconTypeExtended;
+    isDefaultSelected?: boolean;
+    onPress?: () => void;
+    iconProps?: IconProps;
+}
+export interface CollapsiblePanelContainerProps {
+    children?: React.ReactNode;
+    className?: string;
+    /** Amount of selected items indicator. */
+    selectedFilterCount?: string | number;
+    /** Defines a string value that labels the trigger icon when menu is open. */
+    closeAriaLabel?: string;
+    /** Sets the default open state of the overlay. */
+    isDefaultOpen?: boolean;
+    /** Whether the overlay is currently open. */
+    isOpen?: boolean;
+    /**
+     * Method that is called when the open state of the menu changes.
+     * Returns the new open state and the action that caused the opening of the menu.
+     *
+     * `(isOpen: boolean, overlayTrigger: OverlayTriggerAction) => void`
+     */
+    onOpenChange?: () => void;
+    /** Defines a string value that labels the trigger icon when menu is closed. */
+    openAriaLabel?: string;
+    /** Used in button aria-controls attribute. */
+    collapsiblePanelId?: string;
+}
+export interface CollapsiblePanelBadgeProps {
+    className?: string;
+    selectedFilterCount?: string | number;
+    margin?: string;
+    as?: string | React.ReactNode | React.ElementType;
+}