fix(components): export compound component props (DS-5287)

packages/components/src/components/Accordion/index.ts

@@ -2,3 +2,5 @@ export * from './Accordion';
 export * from './components/AccordionGroup';
 export * from './AccordionStateContext';
 export * from './types';
+export type { AccordionSummaryProps } from './components/AccordionSummary';
+export type { AccordionDetailsProps } from './components/AccordionDetails';

packages/components/src/components/Autocomplete/types.ts

@@ -9,6 +9,7 @@ import type {
 import type { DataAttributeProps } from '@koobiq/react-core';
 import type { AriaComboBoxProps } from '@koobiq/react-primitives';
 
+import type { ItemProps, SectionProps } from '../Collections';
 import type { DropdownFooterProps } from '../DropdownFooter';
 import {
   formFieldControlGroupPropVariant,
@@ -27,7 +28,8 @@ import type {
   FormFieldProps,
 } from '../FormField';
 import type { IconButtonProps } from '../IconButton';
-import type { ListInnerProps } from '../List';
+import type { ListInnerProps, ListItemTextProps } from '../List';
+import type { ListItemAddonProps } from '../List/components';
 import type { PopoverProps } from '../Popover';
 
 export const autocompletePropLabelPlacement = formFieldPropLabelPlacement;
@@ -39,6 +41,12 @@ export type AutocompletePropLabelAlign = FormFieldPropLabelAlign;
 export const autocompletePropVariant = formFieldControlGroupPropVariant;
 export type AutocompleteInputPropVariant = FormFieldControlGroupPropVariant;
 
+export type AutocompleteItemProps<T extends object = object> = ItemProps<T>;
+export type AutocompleteSectionProps<T extends object = object> =
+  SectionProps<T>;
+export type AutocompleteItemTextProps = ListItemTextProps;
+export type AutocompleteItemAddonProps = ListItemAddonProps;
+
 export type AutocompleteProps<T extends object = object> = {
   /** Additional CSS-classes. */
   className?: string;

packages/components/src/components/ContentPanel/types.ts

@@ -8,7 +8,16 @@ import type {
 import type { DataAttributeProps } from '@koobiq/react-core';
 import type { TransitionProps } from 'react-transition-group/Transition';
 
-import type { DialogProps } from '../Dialog';
+import type {
+  DialogBodyProps,
+  DialogFooterProps,
+  DialogHeaderProps,
+  DialogProps,
+} from '../Dialog';
+
+export type ContentPanelHeaderProps = DialogHeaderProps;
+export type ContentPanelBodyProps = DialogBodyProps;
+export type ContentPanelFooterProps = DialogFooterProps;
 
 export type ContentPanelSize = number | `${number}` | `${number}%`;
 

packages/components/src/components/Form/components/FormCaption/FormCaption.tsx

@@ -31,5 +31,5 @@ export const FormCaption = polymorphicForwardRef<'div', FormCaptionBaseProps>(
   )
 );
 
-export type FormCationProps<As extends ElementType = 'div'> =
+export type FormCaptionProps<As extends ElementType = 'div'> =
   ComponentPropsWithRef<typeof FormCaption<As>>;

packages/components/src/components/Form/index.ts

@@ -1,3 +1,8 @@
 export * from './Form';
 export * from './FormContext';
 export * from './types';
+export type {
+  FormGroupProps,
+  FormCaptionProps,
+  FormActionsProps,
+} from './components';

packages/components/src/components/List/types.ts

@@ -10,8 +10,16 @@ import type {
 import type { ExtendableProps } from '@koobiq/react-core';
 import type { AriaListBoxProps } from '@koobiq/react-primitives';
 
+import type { DividerProps, ItemProps, SectionProps } from '../Collections';
 import type { TypographyProps } from '../Typography';
 
+import type { ListItemAddonProps as ListItemAddonBaseProps } from './components';
+
+export type ListItemProps<T> = ItemProps<T>;
+export type ListSectionProps<T> = SectionProps<T>;
+export type ListDividerProps = DividerProps;
+export type ListItemAddonProps = ListItemAddonBaseProps;
+
 export type ListProps<T> = ExtendableProps<
   {
     /** Additional CSS-classes. */

packages/components/src/components/Menu/types.ts

@@ -1,4 +1,5 @@
 import type {
+  ComponentProps,
   ComponentPropsWithRef,
   ComponentRef,
   ElementType,
@@ -9,12 +10,28 @@ import type {
   ReactNode,
 } from 'react';
 
-import type { ExtendableProps } from '@koobiq/react-core';
+import type { ExtendableProps, Pressable } from '@koobiq/react-core';
 import type { ButtonOptions, AriaMenuProps } from '@koobiq/react-primitives';
 
+import type {
+  DividerProps,
+  HeaderProps,
+  ItemProps,
+  SectionProps,
+} from '../Collections';
 import type { DropdownFooterProps } from '../DropdownFooter';
+import type { ListItemTextProps } from '../List';
+import type { ListItemAddonProps } from '../List/components';
 import type { PopoverProps, PopoverPropPlacement } from '../Popover';
 
+export type MenuItemProps<T> = ItemProps<T>;
+export type MenuSectionProps<T> = SectionProps<T>;
+export type MenuHeaderProps = HeaderProps;
+export type MenuDividerProps = DividerProps;
+export type MenuItemTextProps = ListItemTextProps;
+export type MenuItemAddonProps = ListItemAddonProps;
+export type MenuControlProps = ComponentProps<typeof Pressable>;
+
 export type MenuPropControl = (
   props: Omit<ButtonOptions, 'elementType'> & {
     ref?: Ref<HTMLButtonElement>;

packages/components/src/components/Modal/types.ts

@@ -9,7 +9,16 @@ import type {
 import type { ButtonOptions } from '@koobiq/react-primitives';
 
 import type { BackdropProps } from '../Backdrop';
-import type { DialogProps } from '../Dialog';
+import type {
+  DialogBodyProps,
+  DialogFooterProps,
+  DialogHeaderProps,
+  DialogProps,
+} from '../Dialog';
+
+export type ModalHeaderProps = DialogHeaderProps;
+export type ModalBodyProps = DialogBodyProps;
+export type ModalFooterProps = DialogFooterProps;
 
 export const modalPropSize = ['small', 'medium', 'large'] as const;
 

packages/components/src/components/Navbar/index.ts

@@ -1,2 +1,9 @@
 export * from './Navbar';
 export * from './types';
+export type {
+  NavbarHeaderProps,
+  NavbarBodyProps,
+  NavbarFooterProps,
+  NavbarItemProps,
+  NavbarAppItemProps,
+} from './components';

packages/components/src/components/Popover/types.ts

@@ -14,7 +14,16 @@ import type {
 } from '@koobiq/react-primitives';
 import type { TransitionProps } from 'react-transition-group/Transition';
 
-import type { DialogProps } from '../Dialog';
+import type {
+  DialogBodyProps,
+  DialogFooterProps,
+  DialogHeaderProps,
+  DialogProps,
+} from '../Dialog';
+
+export type PopoverHeaderProps = DialogHeaderProps;
+export type PopoverBodyProps = DialogBodyProps;
+export type PopoverFooterProps = DialogFooterProps;
 
 export type PopoverPropContent =
   | ReactNode

packages/components/src/components/Select/types.ts

@@ -13,6 +13,7 @@ import type {
   useMultiSelectState,
 } from '@koobiq/react-primitives';
 
+import type { DividerProps, ItemProps, SectionProps } from '../Collections';
 import type {
   FormFieldLabelProps,
   FormFieldErrorProps,
@@ -27,6 +28,7 @@ import {
   formFieldPropLabelPlacement,
 } from '../FormField';
 import type { IconButtonProps } from '../IconButton';
+import type { ListItemTextProps } from '../List';
 import type { PopoverProps } from '../Popover';
 
 import type { SelectListProps } from './components';
@@ -45,6 +47,11 @@ export type SelectPropLabelPlacement = FormFieldPropLabelPlacement;
 export const selectPropLabelAlign = formFieldPropLabelAlign;
 export type SelectPropLabelAlign = FormFieldPropLabelAlign;
 
+export type SelectItemProps<T> = ItemProps<T>;
+export type SelectSectionProps<T> = SectionProps<T>;
+export type SelectDividerProps = DividerProps;
+export type SelectItemTextProps = ListItemTextProps;
+
 export type SelectProps<T> = ExtendableProps<
   {
     /**

packages/components/src/components/SelectNext/types.ts

@@ -10,6 +10,7 @@ import type { ExtendableProps, Node } from '@koobiq/react-core';
 import type { AriaSelectProps, SelectState } from '@koobiq/react-primitives';
 import type { SelectionMode } from '@react-types/select';
 
+import type { DividerProps } from '../Divider';
 import type { DropdownFooterProps } from '../DropdownFooter';
 import type {
   FormFieldLabelProps,
@@ -25,11 +26,17 @@ import {
   formFieldPropLabelPlacement,
 } from '../FormField';
 import type { IconButtonProps } from '../IconButton';
+import type { ListItemTextProps } from '../List';
+import type { ListItemAddonProps } from '../List/components';
 import type { PopoverProps } from '../Popover';
 import type { SearchInputProps } from '../SearchInput';
 import type { TagProps } from '../Tag';
 
-import type { SelectListProps } from './components';
+import type {
+  SelectListProps,
+  SelectOptionProps,
+  SelectSectionProps,
+} from './components';
 
 export const selectNextPropSelectedTagsOverflow = [
   'multiline',
@@ -47,6 +54,14 @@ export type SelectNextPropLabelAlign = FormFieldPropLabelAlign;
 
 export type SelectNextTagProps = TagProps;
 
+export type SelectNextItemProps<T extends object = object> =
+  SelectOptionProps<T>;
+export type SelectNextSectionProps<T extends object = object> =
+  SelectSectionProps<T>;
+export type SelectNextDividerProps = DividerProps;
+export type SelectNextItemTextProps = ListItemTextProps;
+export type SelectNextItemAddonProps = ListItemAddonProps;
+
 export type SelectNextProps<
   T extends object,
   M extends SelectionMode = 'single',

packages/components/src/components/SidePanel/types.ts

@@ -8,7 +8,16 @@ import type {
 import type { ButtonOptions } from '@koobiq/react-primitives';
 
 import type { BackdropProps } from '../Backdrop';
-import type { DialogProps } from '../Dialog';
+import type {
+  DialogBodyProps,
+  DialogFooterProps,
+  DialogHeaderProps,
+  DialogProps,
+} from '../Dialog';
+
+export type SidePanelHeaderProps = DialogHeaderProps;
+export type SidePanelBodyProps = DialogBodyProps;
+export type SidePanelFooterProps = DialogFooterProps;
 
 export const sidePanelPropSize = ['small', 'medium', 'large'] as const;
 

packages/components/src/components/Table/index.ts

@@ -1,2 +1,9 @@
 export * from './Table';
 export * from './types';
+export type {
+  CellProps as TableCellProps,
+  ColumnProps as TableColumnProps,
+  RowProps as TableRowProps,
+  TableBodyProps,
+  TableHeaderProps,
+} from '../Collections';

packages/components/src/components/TagAutocomplete/index.ts

@@ -1,2 +1,3 @@
 export * from './TagAutocomplete';
 export * from './types';
+export type { TagAutocompleteListItemProps } from './TagAutocompleteItem';

packages/components/src/components/TagAutocomplete/types.ts

@@ -5,6 +5,9 @@ import type { AriaTagAutocompleteProps } from '@koobiq/react-primitives';
 import type { ListInnerProps } from '../List';
 import type { PopoverProps } from '../Popover';
 import type { TagInputProps, TagInputRef } from '../TagInput';
+import type { TagProps } from '../TagList/Tag';
+
+export type TagAutocompleteTagProps<T extends object = object> = TagProps<T>;
 
 type TagAutocompleteBaseProps<T extends object> = Omit<
   AriaTagAutocompleteProps<T>,

packages/components/src/components/TagInput/types.ts

@@ -30,6 +30,9 @@ import {
 } from '../FormField';
 import type { IconButtonProps } from '../IconButton';
 import type { TagListInnerProps } from '../TagList';
+import type { TagProps } from '../TagList/Tag';
+
+export type TagInputTagProps<T extends object = object> = TagProps<T>;
 
 export const tagInputPropVariant = formFieldControlGroupPropVariant;
 export type TagInputPropVariant = FormFieldControlGroupPropVariant;

packages/components/src/components/TagList/types.ts

@@ -15,6 +15,10 @@ import type {
 } from '@koobiq/react-core';
 import type { ListState } from '@koobiq/react-primitives';
 
+import type { TagProps } from './Tag';
+
+export type TagListTagProps<T extends object = object> = TagProps<T>;
+
 export const tagListPropVariant = [
   'theme-fade',
   'contrast-fade',

packages/components/src/components/Tree/types.ts

@@ -4,6 +4,8 @@ import type { ListItemAddonProps, ListItemTextProps } from '../List/components';
 
 export type TreeItemContentText = ListItemTextProps;
 export type TreeItemContentAddon = ListItemAddonProps;
+export type TreeItemContentTextProps = ListItemTextProps;
+export type TreeItemContentAddonProps = ListItemAddonProps;
 
 export type TreeProps<T extends object> = AriaTreeProps<T> & {
   /** Whether the tree has outer padding. */

packages/components/src/components/TreeSelect/types.ts

@@ -32,9 +32,18 @@ import type { IconButtonProps } from '../IconButton';
 import type { PopoverProps } from '../Popover';
 import type { SearchInputProps } from '../SearchInput';
 import { selectedTagsPropOverflow } from '../SelectedTags';
+import type {
+  TreeItemContentProps,
+  TreeItemProps,
+  TreeLoadMoreItemProps,
+} from '../Tree';
 
 import type { TreeCollection } from './TreeInner';
 
+export type TreeSelectItemProps = TreeItemProps;
+export type TreeSelectItemContentProps = TreeItemContentProps;
+export type TreeSelectLoadMoreItemProps = TreeLoadMoreItemProps;
+
 export const treeSelectPropLabelPlacement = formFieldPropLabelPlacement;
 export type TreeSelectPropLabelPlacement = FormFieldPropLabelPlacement;
 

tools/public_api_guard/components/Accordion.api.md

@@ -29,6 +29,15 @@ export const Accordion: CompoundedComponent;
 // @public (undocumented)
 export const AccordionComponent: ForwardRefExoticComponent<Omit<AccordionProps, "ref"> & RefAttributes<HTMLDivElement>>;
 
+// @public (undocumented)
+export type AccordionDetailsProps = ExtendableComponentPropsWithRef<{
+    children?: ReactNode;
+    unmountOnExit?: boolean;
+    slotProps?: {
+        transition?: Partial<TransitionProps<HTMLElement>>;
+    };
+}, 'div'>;
+
 // @public (undocumented)
 export const AccordionGroup: ForwardRefExoticComponent<Omit<AccordionGroupProps, "ref"> & RefAttributes<HTMLDivElement>>;
 
@@ -54,6 +63,23 @@ export type AccordionRef = ComponentRef<'div'>;
 // @public (undocumented)
 export const AccordionStateContext: Context<DisclosureState>;
 
+// @public (undocumented)
+export type AccordionSummaryProps = {
+    children?: ReactNode;
+    className?: string;
+    expandIcon?: (isExpanded: boolean) => ReactElement;
+    expandIconPlacement?: AccordionSummaryPropExpandIconPlacement;
+    hideExpandIcon?: boolean;
+    slotProps?: {
+        trigger?: Omit<ButtonProps, 'children'>;
+        expandIcon?: ComponentPropsWithRef<'span'>;
+    };
+};
+
+// Warnings were encountered during analysis:
+//
+// packages/components/dist/components/Accordion/components/AccordionSummary/types.d.ts:17:5 - (ae-forgotten-export) The symbol "AccordionSummaryPropExpandIconPlacement" needs to be exported by the entry point index.d.ts
+
 // (No @packageDocumentation comment for this package)
 
 ```