@ssa-ui-kit/core 2.33.0 → 3.1.0

package/dist/components/IconButton/IconButton.d.ts

@@ -0,0 +1,39 @@
+import type { IconButtonProps } from './types';
+/**
+ * IconButton - Square icon-only button for icon actions
+ *
+ * A compact button that displays a single icon from the kit (e.g. edit, bin, search).
+ * Uses the kit's Icon and theme. Good for row actions, toolbars, and secondary actions
+ * where a text label is not needed. Optional tooltip on hover and full style overrides
+ * via a single styles prop.
+ *
+ * Features:
+ * - Any icon from the kit via icon name
+ * - Optional tooltip (title) on hover via kit Tooltip
+ * - Optional aria-label; defaults to raw icon name for screen readers
+ * - Single styles prop: button, iconColor, icon (all overridable)
+ * - Transparent or grey background variant; disabled state
+ *
+ * @category Form Controls
+ * @subcategory Action
+ *
+ * @example
+ * ```tsx
+ * <IconButton icon="edit" onClick={onEdit} aria-label="Edit" />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * <IconButton icon="bin" onClick={onDelete} title="Delete" transparent />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * <IconButton
+ *   icon="search"
+ *   onClick={onSearch}
+ *   styles={{ button: { marginLeft: 8 }, iconColor: theme.colors.blue }}
+ * />
+ * ```
+ */
+export declare const IconButton: ({ icon, onClick, "aria-label": ariaLabel, title, disabled, transparent, styles, }: IconButtonProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/IconButton/index.d.ts

@@ -0,0 +1,2 @@
+export { IconButton } from './IconButton';
+export type { IconButtonProps } from './types';

package/dist/components/IconButton/styles.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '@emotion/react';
+export declare const iconButton: (theme: Theme, transparent: boolean) => import("@emotion/react").SerializedStyles;

package/dist/components/IconButton/types.d.ts

@@ -0,0 +1,41 @@
+import type { Interpolation, Theme } from '@emotion/react';
+import type { MapIconsType } from '../Icon/types';
+export type IconButtonProps = {
+    /**
+     * Icon name from the UI kit Icon component (e.g. "edit", "bin", "search")
+     */
+    icon: keyof MapIconsType;
+    /**
+     * Click handler
+     */
+    onClick: () => void;
+    /**
+     * Accessible label for screen readers. When omitted, the raw icon name is used.
+     */
+    'aria-label'?: string;
+    /**
+     * Tooltip text; when provided, uses the kit's Tooltip on hover.
+     */
+    title?: string;
+    /**
+     * Disables the button and applies disabled styles
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Use transparent background instead of theme grey
+     * @default false
+     */
+    transparent?: boolean;
+    /**
+     * Custom styles in one prop. Each key is applied where it belongs:
+     * - `button`: Emotion styles merged with default button styles
+     * - `iconColor`: icon color (defaults to theme.colors.greyDarker)
+     * - `icon`: Emotion styles passed to the Icon
+     */
+    styles?: {
+        button?: Interpolation<Theme>;
+        iconColor?: string;
+        icon?: Interpolation<Theme>;
+    };
+};

package/dist/components/Indicator/types.d.ts

@@ -1,8 +1,10 @@
 export interface IndicatorProps {
     isVisible: boolean;
-    children: React.ReactElement;
+    children: React.ReactElement<{
+        ref: React.Ref<HTMLDivElement | null>;
+    }>;
     position?: 'right' | 'left';
     background?: string;
-    text?: string | number | JSX.Element;
+    text?: string | number | React.JSX.Element;
 }
 export type ChildrenDataProps = Record<string, number>;

package/dist/components/Input/types.d.ts

@@ -4,33 +4,190 @@ import type { Interpolation, Theme } from '@emotion/react';
 interface ExtendedInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
     'data-testid'?: string;
 }
+/**
+ * Props for the Input component
+ *
+ * A flexible text input component with built-in validation, status indicators,
+ * icon support, and React Hook Form integration. Supports all standard HTML input
+ * types and provides visual feedback for validation states.
+ *
+ * @example
+ * ```tsx
+ * // Basic input with React Hook Form
+ * const { register } = useForm();
+ * <Input
+ *   name="email"
+ *   type="email"
+ *   placeholder="Enter your email"
+ *   register={register}
+ * />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Input with validation
+ * <Input
+ *   name="password"
+ *   type="password"
+ *   register={register}
+ *   validationSchema={{
+ *     required: 'Password is required',
+ *     minLength: { value: 8, message: 'Must be at least 8 characters' }
+ *   }}
+ *   status={errors.password ? 'error' : 'basic'}
+ *   errors={errors.password}
+ *   showHelperText
+ * />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Input with icons and helper text
+ * <Input
+ *   name="search"
+ *   placeholder="Search products..."
+ *   startElement={<Icon name="search" />}
+ *   endElement={<Icon name="clear" onClick={handleClear} />}
+ *   helperText="Type to search"
+ *   showHelperText
+ * />
+ * ```
+ *
+ * @note React Hook Form integration is optional. If `register` is not provided,
+ * the component will still work but validation features will be unavailable.
+ */
 export interface InputProps extends Partial<Pick<UseFormReturn, 'register' | 'control' | 'setValue'>> {
+    /**
+     * Name attribute for the input, required for React Hook Form integration
+     */
     name: string;
+    /**
+     * Visual validation status of the input
+     * - `basic`: Default state, no validation feedback
+     * - `error`: Error state with red border and error icon
+     * - `success`: Success state with green border and success icon
+     * - `custom`: Custom styling (no default status styling)
+     * @default 'basic'
+     */
     status?: keyof InputStatusColors;
+    /**
+     * HTML input type attribute
+     * Supports all standard HTML input types (text, email, password, number, etc.)
+     * @default 'text'
+     */
     type?: string;
+    /**
+     * Placeholder text displayed when input is empty
+     */
     placeholder?: string;
+    /**
+     * React Hook Form validation schema
+     * Object containing validation rules (required, minLength, pattern, etc.)
+     */
     validationSchema?: Record<string, unknown>;
+    /**
+     * Whether the input is disabled
+     * Disabled inputs cannot be edited and appear visually muted
+     * @default false
+     */
     disabled?: boolean;
+    /**
+     * Custom CSS class name for the input element
+     */
     className?: string;
+    /**
+     * Custom CSS class name for the wrapper container
+     */
     wrapperClassName?: string;
+    /**
+     * Custom CSS class name for the helper text container
+     */
     helperClassName?: string;
+    /**
+     * Custom element type to render as (for composition)
+     */
     as?: React.ElementType;
+    /**
+     * React element to display before the input (e.g., icon)
+     * Commonly an Icon component
+     */
     startElement?: React.ReactElement;
+    /**
+     * React element to display after the input (e.g., icon or action button)
+     * Commonly an Icon component or clear button
+     */
     endElement?: React.ReactElement;
+    /**
+     * Custom Emotion CSS styles
+     */
     css?: Interpolation<Theme>;
+    /**
+     * Additional props to pass directly to the underlying input element
+     * Includes all standard HTML input attributes
+     */
     inputProps?: ExtendedInputProps;
+    /**
+     * Tooltip text to display when hovering over error icon
+     * Only visible when status is 'error' and showStatusIcon is true
+     */
     errorTooltip?: string;
+    /**
+     * Tooltip text to display when hovering over success icon
+     * Only visible when status is 'success' and showStatusIcon is true
+     */
     successTooltip?: string;
+    /**
+     * Whether to show helper text below the input
+     * Displays validation errors, helper text, or character count
+     * @default false
+     */
     showHelperText?: boolean;
+    /**
+     * Whether to show status icon (error/success) inside the input
+     * Hidden when endElement is provided or input is disabled
+     * @default true
+     */
     showStatusIcon?: boolean;
+    /**
+     * Whether to show borders around the input
+     * @default true
+     */
     showBorders?: boolean;
+    /**
+     * Helper text to display below the input
+     * Only shown when showHelperText is true and no errors are present
+     */
     helperText?: string;
+    /**
+     * Maximum character length for the input
+     * When provided with showHelperText, displays character count (e.g., "45 / 100")
+     */
     maxLength?: number;
+    /**
+     * React Hook Form field error object
+     * Used to display validation error messages
+     */
     errors?: FieldError;
+    /**
+     * Keyboard event handler for keyup events
+     * Also used internally for character counting when maxLength is provided
+     */
     onKeyUp?: KeyboardEventHandler<HTMLInputElement>;
+    /**
+     * Click handler for the start element
+     * Useful for making start icons interactive (e.g., toggle password visibility)
+     */
     onStartElementClick?: (event: BaseSyntheticEvent) => void;
+    /**
+     * Click handler for the end element
+     * Useful for making end icons interactive (e.g., clear button)
+     */
     onEndElementClick?: (event: BaseSyntheticEvent) => void;
 }
+/**
+ * Status color mappings for Input component
+ * Defines the visual styling for different validation states
+ */
 export interface InputStatusColors {
     basic: Interpolation<Theme>;
     error: Interpolation<Theme>;

package/dist/components/JsonSchemaForm/fields/DateRangeField.d.ts

@@ -1,2 +1,16 @@
 import { FieldProps, FormContextType, RJSFSchema, StrictRJSFSchema } from '@rjsf/utils';
-export declare const DateRangeField: <T = unknown, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = Record<string, unknown>>(props: FieldProps<T, S, F>) => import("@emotion/react/jsx-runtime").JSX.Element;
+/**
+ * DateRangeField - RJSF adapter for DateRangePicker
+ *
+ * Uses DateRangePickerFormBridge so that:
+ * - Format conversion: formData (outputFormat) → DateRangePicker (inputFormat) happens in the bridge
+ * - "Present" handling: form stores PRESENT_VALUE string; picker only sees null (see bridge)
+ *
+ * SCHEMA REQUIREMENT: type must be "object" with properties start and end (each typically type: "string").
+ *
+ * USAGE (example schemas):
+ * - Both optional: { type: "object", properties: { start: { type: "string" }, end: { type: "string" } } }
+ * - Only start required: same + required: ["start"]
+ * - Both required (or "present" for end): same + required: ["start", "end"]  // "present" satisfies string
+ */
+export declare const DateRangeField: <T = unknown, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = Record<string, unknown>>(props: FieldProps<T, S, F>) => import("@emotion/react/jsx-runtime").JSX.Element | null;

package/dist/components/JsonSchemaForm/utils/dateFormats.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Common date format type used by both DatePicker and DateRangePicker
+ * Valid formats: 'mm/dd/yyyy', 'dd/mm/yyyy', 'mm/yyyy', 'yyyy'
+ *
+ * This type is shared between:
+ * - DatePicker (DatePickerFormat)
+ * - DateRangePicker (Format)
+ * Both are identical, so we use this common type for validation
+ */
+export type DateFormat = 'mm/dd/yyyy' | 'dd/mm/yyyy' | 'mm/yyyy' | 'yyyy';
+/**
+ * Common picker/calendar type used by both DatePicker and DateRangePicker
+ * Valid types: 'days', 'months', 'years'
+ *
+ * This type is shared between:
+ * - DateRangePicker (RangePickerType, CalendarType)
+ * - DatePicker (CalendarType)
+ * All are identical, so we use this common type
+ */
+export type PickerCalendarType = 'days' | 'months' | 'years';
+/**
+ * Validates if a value is a valid date format
+ * Used by both DatePicker (DateWidget) and DateRangePicker (DateRangeField)
+ *
+ * This replaces:
+ * - isValidFormat (DateRangeField)
+ * - isValidDatePickerFormat (DateWidget)
+ */
+export declare const isValidDateFormat: (value: unknown) => value is DateFormat;
+/**
+ * Valid output formats include:
+ * - Input formats: 'mm/dd/yyyy', 'dd/mm/yyyy', 'mm/yyyy', 'yyyy'
+ * - ISO formats: 'yyyy-MM-dd', 'yyyy-MM', 'yyyy'
+ *
+ * Used for outputFormat validation in DateRangeField and DateWidget
+ */
+export declare const isValidOutputFormat: (value: unknown) => value is string;

package/dist/components/JsonSchemaForm/utils/dateRangeField.d.ts

@@ -0,0 +1,24 @@
+import type { DateRangePickerProps } from '../../DateRangePicker/types';
+/**
+ * Props that need special handling (validation/transformation) or are RJSF-controlled
+ * These are extracted explicitly and NOT spread
+ */
+export type NonSpreadableProps = 'format' | 'rangePickerType' | 'outputFormat' | 'name' | 'onChange' | 'value' | 'defaultValue';
+/**
+ * Props that can be automatically spread from uiOptions
+ * New props added to DateRangePickerProps will automatically be included here
+ */
+export type SpreadableFromUiOptions = Omit<DateRangePickerProps, NonSpreadableProps>;
+/**
+ * Extract props that need transformation/validation from uiOptions
+ */
+export declare const extractTransformedProps: (uiOptions: Record<string, unknown>) => {
+    rangePickerType: import("./dateFormats").PickerCalendarType;
+    outputFormat: string;
+    format: import("./dateFormats").DateFormat | undefined;
+};
+/**
+ * Extract props that can be spread automatically from uiOptions
+ * Filters out props that need special handling
+ */
+export declare const extractSpreadableProps: (uiOptions: Record<string, unknown>) => Partial<SpreadableFromUiOptions>;

package/dist/components/JsonSchemaForm/utils/index.d.ts

@@ -1 +1,2 @@
 export * from './schema';
+export * from './dateFormats';

package/dist/components/JsonSchemaForm/utils/selectWidget.d.ts

@@ -0,0 +1,16 @@
+import type { TypeaheadProps } from '../../Typeahead/types';
+/**
+ * Props that need special handling (computed from RJSF state) or are RJSF-controlled
+ * These are extracted explicitly and NOT spread
+ */
+export type SelectWidgetNonSpreadableProps = 'name' | 'onChange' | 'onClearAll' | 'onRemoveSelectedClick' | 'onEmptyChange' | 'selectedItems' | 'isMultiple' | 'isDisabled' | 'placeholder' | 'renderOption' | 'children';
+/**
+ * Props that can be automatically spread from uiOptions
+ * New props added to TypeaheadProps will automatically be included here
+ */
+export type SelectWidgetSpreadableFromUiOptions = Omit<TypeaheadProps, SelectWidgetNonSpreadableProps>;
+/**
+ * Extract props that can be spread automatically from uiOptions
+ * Filters out props that need special handling or are computed from RJSF state
+ */
+export declare const extractSelectWidgetSpreadableProps: (uiOptions: Record<string, unknown>) => Partial<SelectWidgetSpreadableFromUiOptions>;

package/dist/components/Modal/Modal.d.ts

@@ -1,3 +1,63 @@
 import { ModalProps } from './types';
+/**
+ * Modal - Dialog overlay for focused user interaction
+ *
+ * A compound component that provides a modal dialog with built-in state management,
+ * trigger and dismiss buttons, and optional portal rendering. Use Modal (root),
+ * ModalOpenButton (activator), ModalContent (dialog body), and ModalDismissButton
+ * (close) together. ModalContent can render in a portal to document.body (usePortal)
+ * or in place for use inside other overlays (e.g. Drawer).
+ *
+ * @category Components
+ * @subcategory Overlay
+ *
+ * @example
+ * ```tsx
+ * // Basic modal
+ * <Modal>
+ *   <ModalOpenButton>
+ *     <Button>Open modal</Button>
+ *   </ModalOpenButton>
+ *   <ModalContent aria-label="Example modal">
+ *     <div>
+ *       <h3>Title</h3>
+ *       <p>Content</p>
+ *       <ModalDismissButton>
+ *         <Button variant="secondary">Close</Button>
+ *       </ModalDismissButton>
+ *     </div>
+ *   </ModalContent>
+ * </Modal>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Controlled from parent
+ * const [isOpen, setIsOpen] = useState(false);
+ * <Modal isOpen={isOpen}>
+ *   <ModalContent aria-label="Controlled modal">
+ *     <ModalDismissButton><Button onClick={() => setIsOpen(false)}>Close</Button></ModalDismissButton>
+ *   </ModalContent>
+ * </Modal>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Modal with portal (e.g. inside Drawer) - centers on full screen
+ * <ModalContent aria-label="Modal in drawer" usePortal>
+ *   ...
+ * </ModalContent>
+ * ```
+ *
+ * @see {@link ModalContent} - Dialog content and container
+ * @see {@link ModalOpenButton} - Trigger to open
+ * @see {@link ModalDismissButton} - Trigger to close
+ *
+ * @accessibility
+ * - Focus trapped within modal when open
+ * - aria-label on ModalContent for screen readers
+ * - ESC to close (when implemented in ModalDialog)
+ * - Focus management on open/close
+ */
 declare const Modal: ({ isOpen, ...rest }: ModalProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default Modal;

package/dist/components/Modal/types.d.ts

@@ -1,3 +1,23 @@
 import type { ModalDialogProps } from '../ModalDialog';
+/**
+ * Context value for Modal: [isOpen, setIsOpen].
+ * Provided by Modal (root) and consumed by ModalContent, ModalOpenButton, ModalDismissButton.
+ */
 export type ModalContextProps = [boolean, (isOpen: boolean) => void];
-export type ModalProps = Partial<ModalDialogProps>;
+/**
+ * Props for the Modal root and ModalContent components.
+ *
+ * Modal root accepts isOpen for controlled usage; ModalContent accepts
+ * ModalDialog props (aria-label, noBackground, className, children) plus usePortal.
+ *
+ * @example
+ * ```tsx
+ * <Modal isOpen={isOpen}>
+ *   <ModalContent aria-label="Dialog" usePortal>...</ModalContent>
+ * </Modal>
+ * ```
+ */
+export type ModalProps = Partial<ModalDialogProps> & {
+    /** When true, render modal in a portal to document.body. When false (default), render in place (e.g. inside a Drawer). */
+    usePortal?: boolean;
+};

package/dist/components/ModalContent/ModalContent.d.ts

@@ -1,3 +1,44 @@
 import { ModalProps } from '../Modal/types';
-declare function ModalContent({ children, 'aria-label': ariaLabel, ...props }: ModalProps): import("@emotion/react/jsx-runtime").JSX.Element;
+/**
+ * ModalContent - Dialog content and overlay container
+ *
+ * Renders the modal dialog content when the modal is open. Uses ModalContext
+ * to read open state. Can render in place (default) or in a portal to
+ * document.body when usePortal is true (e.g. for modals inside a Drawer that
+ * should center on the full screen).
+ *
+ * Only renders when modal is open. Accepts ModalDialog props (aria-label,
+ * noBackground, className) and usePortal. Must be used within Modal.
+ *
+ * @category Components
+ * @subcategory Overlay
+ *
+ * @example
+ * ```tsx
+ * <Modal>
+ *   <ModalOpenButton><Button>Open</Button></ModalOpenButton>
+ *   <ModalContent aria-label="Example dialog">
+ *     <p>Content</p>
+ *     <ModalDismissButton><Button>Close</Button></ModalDismissButton>
+ *   </ModalContent>
+ * </Modal>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // With portal (e.g. inside Drawer) - centers on full screen
+ * <ModalContent aria-label="Dialog" usePortal>
+ *   ...
+ * </ModalContent>
+ * ```
+ *
+ * @see {@link Modal} - Parent component that provides context
+ * @see {@link ModalOpenButton} - Trigger to open
+ * @see {@link ModalDismissButton} - Trigger to close
+ *
+ * @accessibility
+ * - aria-label should be set for screen readers
+ * - Renders in portal when usePortal for proper stacking
+ */
+declare function ModalContent({ children, 'aria-label': ariaLabel, usePortal, ...props }: ModalProps): import("@emotion/react/jsx-runtime").JSX.Element | null;
 export default ModalContent;

package/dist/components/ModalDialog/ModalDialog.d.ts

@@ -1,3 +1,30 @@
 import { ModalDialogProps } from './types';
+/**
+ * ModalDialog - Presentational dialog container and overlay
+ *
+ * Renders the fixed full-screen overlay and centered dialog box. Used internally
+ * by ModalContent; typically not used directly. Handles visibility (display
+ * based on isOpen), optional background overlay (noBackground), and dialog
+ * ARIA attributes (role="dialog", aria-modal).
+ *
+ * @category Components
+ * @subcategory Overlay
+ *
+ * @example
+ * ```tsx
+ * // Usually used via ModalContent
+ * <ModalContent aria-label="My dialog">
+ *   <div>Dialog body</div>
+ * </ModalContent>
+ * ```
+ *
+ * @see {@link Modal} - Root component that provides state
+ * @see {@link ModalContent} - Wraps ModalDialog and handles portal
+ *
+ * @accessibility
+ * - role="dialog", aria-modal="true"
+ * - aria-label for screen reader label
+ * - Fixed overlay for focus containment
+ */
 declare const ModalDialog: ({ isOpen, noBackground, children, "aria-label": ariaLabel, ...props }: ModalDialogProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default ModalDialog;

package/dist/components/ModalDialog/types.d.ts

@@ -1,7 +1,25 @@
+/**
+ * Props for the ModalDialog presentational component.
+ *
+ * Used by ModalContent when rendering the dialog. isOpen controls visibility;
+ * noBackground removes the overlay; aria-label is required for accessibility.
+ *
+ * @example
+ * ```tsx
+ * <ModalDialog isOpen={true} aria-label="Confirm action">
+ *   <p>Are you sure?</p>
+ * </ModalDialog>
+ * ```
+ */
 export interface ModalDialogProps {
+    /** Whether the dialog is visible. When false, content is hidden (display: none). */
     isOpen: boolean;
+    /** When true, the overlay is transparent (no dimmed background). */
     noBackground?: boolean;
+    /** Accessible name for the dialog (required for screen readers). */
     'aria-label'?: string;
+    /** Dialog body content. */
     children?: React.ReactNode;
+    /** Optional CSS class for the inner dialog element. */
     className?: string;
 }

package/dist/components/ModalDismissButton/ModalDismissButton.d.ts

@@ -1,4 +1,31 @@
-declare function ModalDismissButton({ children: child }: {
-    children: JSX.Element;
+/**
+ * ModalDismissButton - Trigger element that closes the modal
+ *
+ * Wraps a single React element (typically a Button) and injects an onClick
+ * handler that closes the modal via ModalContext. Preserves the child's
+ * existing onClick by calling both. Must be used within Modal.
+ *
+ * @category Components
+ * @subcategory Overlay
+ *
+ * @example
+ * ```tsx
+ * <Modal>
+ *   <ModalOpenButton><Button>Open</Button></ModalOpenButton>
+ *   <ModalContent aria-label="Dialog">
+ *     <p>Content</p>
+ *     <ModalDismissButton>
+ *       <Button variant="secondary">Close</Button>
+ *     </ModalDismissButton>
+ *   </ModalContent>
+ * </Modal>
+ * ```
+ *
+ * @see {@link Modal} - Parent component that provides context
+ * @see {@link ModalContent} - Content container
+ * @see {@link ModalOpenButton} - Trigger to open
+ */
+declare function ModalDismissButton({ children: child, }: {
+    children: React.JSX.Element;
 }): import("react").FunctionComponentElement<any>;
 export default ModalDismissButton;

package/dist/components/ModalOpenButton/ModalOpenButton.d.ts

@@ -1,4 +1,28 @@
+/**
+ * ModalOpenButton - Trigger element that opens the modal
+ *
+ * Wraps a single React element (typically a Button) and injects an onClick
+ * handler that opens the modal via ModalContext. Preserves the child's
+ * existing onClick by calling both. Must be used within Modal.
+ *
+ * @category Components
+ * @subcategory Overlay
+ *
+ * @example
+ * ```tsx
+ * <Modal>
+ *   <ModalOpenButton>
+ *     <Button>Open modal</Button>
+ *   </ModalOpenButton>
+ *   <ModalContent aria-label="Dialog">...</ModalContent>
+ * </Modal>
+ * ```
+ *
+ * @see {@link Modal} - Parent component that provides context
+ * @see {@link ModalContent} - Content displayed when open
+ * @see {@link ModalDismissButton} - Trigger to close
+ */
 declare function ModalOpenButton({ children: child }: {
-    children: JSX.Element;
+    children: React.JSX.Element;
 }): import("react").FunctionComponentElement<any>;
 export default ModalOpenButton;

package/dist/components/MultipleDropdown/index.d.ts

@@ -1 +1,2 @@
 export { default } from './MultipleDropdown';
+export type { DropdownProps, DropdownContextType } from './types';