@eccenca/gui-elements 23.1.0 → 23.2.0-rc.1

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

@@ -15,4 +15,8 @@ export interface IframeProps extends TestableComponent {
     backgroundColor?: string;
     htmlIframeProps?: Omit<React.IframeHTMLAttributes<HTMLIFrameElement>, "title" | "className" | "src">;
 }
+/**
+ * Display iframe but shows a spinner as long as it is not loaded.
+ */
 export declare const Iframe: React.ForwardRefExoticComponent<IframeProps & React.RefAttributes<HTMLIFrameElement>>;
+export default Iframe;

package/dist/types/components/Iframe/IframeModal.d.ts

@@ -9,4 +9,5 @@ export interface IframeModalProps extends Omit<SimpleDialogProps, "children"> {
     htmlIframeProps?: Omit<React.IframeHTMLAttributes<HTMLIFrameElement>, "title" | "className" | "src">;
 }
 /** Modal that contains an iframe and supports full screen mode. */
-export declare function IframeModal({ title, src, className, startFullscreen, compIframeProps, htmlIframeProps, headerOptions, size, ...otherSimpleDialogProps }: IframeModalProps): JSX.Element;
+export declare const IframeModal: ({ title, src, className, startFullscreen, compIframeProps, htmlIframeProps, headerOptions, size, ...otherSimpleDialogProps }: IframeModalProps) => React.JSX.Element;
+export default IframeModal;

package/dist/types/components/Iframe/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Iframe";
+export * from "./IframeModal";

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

@@ -24,5 +24,5 @@ export interface InteractionGateProps extends Omit<React.HTMLAttributes<HTMLDivE
  * Wrap content that need to be blocked from user interactions
  * It also has options to display a spinner as overlay.
  */
-declare function InteractionGate({ children, className, inert, showSpinner, spinnerProps, useParentPositioning, ...otherProps }: InteractionGateProps): JSX.Element;
+export declare const InteractionGate: ({ children, className, inert, showSpinner, spinnerProps, useParentPositioning, ...otherProps }: InteractionGateProps) => React.JSX.Element;
 export default InteractionGate;

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

@@ -27,5 +27,5 @@ export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement>
      */
     disabled?: boolean;
 }
-declare function Label({ children, className, disabled, text, info, tooltip, tooltipProps, isLayoutForElement, ...otherLabelProps }: LabelProps): JSX.Element;
+export declare const Label: ({ children, className, disabled, text, info, tooltip, tooltipProps, isLayoutForElement, ...otherLabelProps }: LabelProps) => React.JSX.Element;
 export default Label;

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

@@ -1,3 +1,6 @@
-/// <reference types="react" />
-declare function Link({ className, children, href, onClick, ...otherProps }: any): JSX.Element;
+import React from "react";
+import { LinkProps as CarbonLinkProps } from "carbon-components-react";
+export interface LinkProps extends CarbonLinkProps {
+}
+export declare const Link: ({ className, children, href, onClick, ...otherProps }: CarbonLinkProps) => React.JSX.Element;
 export default Link;

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

@@ -1,5 +1,5 @@
 import React from "react";
-interface ListProps<T> {
+export interface ListProps<T> {
     items: T[];
     /** Renders the item. */
     itemRenderer: (item: T) => React.ReactNode;
@@ -13,5 +13,5 @@ interface ListProps<T> {
     moreLabel?: string;
 }
 /** A generic list component with support of various performance/scalability improvements. */
-declare function List<T>({ items, itemRenderer, itemId, limitOptions, moreLabel }: ListProps<T>): JSX.Element;
+export declare function List<T>({ items, itemRenderer, itemId, limitOptions, moreLabel }: ListProps<T>): React.JSX.Element;
 export default List;

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

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import React from 'react';
 import { MenuProps as BlueprintMenuProps } from "@blueprintjs/core";
 export interface MenuProps extends BlueprintMenuProps {
 }
-declare function Menu({ children, className, ...restProps }: MenuProps): JSX.Element;
+export declare const Menu: ({ children, className, ...restProps }: MenuProps) => React.JSX.Element;
 export default Menu;

package/dist/types/components/Menu/MenuDivider.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import React from 'react';
 import { MenuDividerProps as BlueprintMenuDividerProps } from "@blueprintjs/core";
 export interface MenuDividerProps extends BlueprintMenuDividerProps {
 }
-declare function MenuDivider({ children, className, ...restProps }: MenuDividerProps): JSX.Element;
+export declare const MenuDivider: ({ children, className, ...restProps }: MenuDividerProps) => React.JSX.Element;
 export default MenuDivider;

package/dist/types/components/Menu/MenuItem.d.ts

@@ -2,12 +2,12 @@ import React from 'react';
 import { MenuItemProps as BlueprintMenuItemProps } from "@blueprintjs/core";
 import { TestIconProps } from "./../Icon/TestIcon";
 import { ValidIconName } from "../Icon/canonicalIconNames";
-export interface MenuItemProps extends Omit<BlueprintMenuItemProps, "icon" | "children">, Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "onClick" | "target" | "children"> {
+export interface MenuItemProps extends Omit<BlueprintMenuItemProps, "icon" | "children">, Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "onClick" | "onFocus" | "target" | "children"> {
     icon?: ValidIconName | string[] | React.ReactElement<TestIconProps>;
     children?: React.ReactNode;
 }
 /**
  * Single item, used as child inside `Menu`.
  */
-declare function MenuItem({ children, className, icon, onClick, href, ...restProps }: MenuItemProps): JSX.Element;
+export declare const MenuItem: ({ children, className, icon, onClick, href, ...restProps }: MenuItemProps) => React.JSX.Element;
 export default MenuItem;

package/dist/types/components/Menu/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./Menu";
+export * from "./MenuDivider";
+export * from "./MenuItem";

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

@@ -1,13 +1,18 @@
-/// <reference types="react" />
+import React from "react";
 import { HTMLInputProps as BlueprintHTMLInputProps } from "@blueprintjs/core";
 import { MultiSelect2 as BlueprintMultiSelect, MultiSelect2Props as BlueprintMultiSelectProps } from "@blueprintjs/select";
 import { ContextOverlayProps } from "./../../index";
-export interface SelectedParamsType<T> {
+export interface MultiSelectSelectionProps<T> {
     newlySelected: T;
     selectedItems: T[];
     createdItems: Partial<T>[];
 }
-interface IProps<T> extends Pick<BlueprintMultiSelectProps<T>, "items" | "placeholder" | "openOnKeyDown"> {
+export declare type SelectedParamsType<T> = MultiSelectSelectionProps<T>;
+export interface MultiSelectProps<T> extends Pick<BlueprintMultiSelectProps<T>, "items" | "placeholder" | "openOnKeyDown"> {
+    /**
+     * Additional class name, space separated.
+     */
+    className?: string;
     /**
      * Returns the unique ID of an item. This will be used for equality of items.
      */
@@ -24,7 +29,7 @@ interface IProps<T> extends Pick<BlueprintMultiSelectProps<T>, "items" | "placeh
     /**
      *  function handler that would be called anytime an item is selected/deselected or an item is created/removed
      */
-    onSelection?: (params: SelectedParamsType<T>) => void;
+    onSelection?: (params: MultiSelectSelectionProps<T>) => void;
     /**
      * Props to spread to `ContextOverlay`. Note that `content` cannot be changed.
      */
@@ -82,11 +87,25 @@ interface IProps<T> extends Pick<BlueprintMultiSelectProps<T>, "items" | "placeh
      * Disables the input element
      */
     disabled?: boolean;
-    /** Delay in ms how long the request for the given query should be delayed. */
+    /**
+     * Delay in ms how long the request for the given query should be delayed.
+     */
     requestDelay?: number;
+    /**
+     * Clear query when an option is selected or unselected.
+     * The query is empty then and the user need to enter a new query.
+     */
+    clearQueryOnSelection?: boolean;
 }
-declare function MultiSelect<T>({ items, prePopulateWithItems, itemId, itemLabel, onSelection, contextOverlayProps, tagInputProps, inputProps, runOnQueryChange, fullWidth, noResultText, newItemCreationText, newItemPostfix, hasStatePrimary, hasStateDanger, hasStateSuccess, hasStateWarning, disabled, createNewItemFromQuery, requestDelay, ...otherProps }: IProps<T>): JSX.Element;
-declare namespace MultiSelect {
+/**
+ * **Element is deprecated for the current type of usage.**
+ * Use `MultiSuggestField` as replacement.
+ *
+ * This component will be re-implemented later as a `Select` allowing multiple selections.
+ * @deprecated
+ */
+export declare function MultiSelect<T>({ items, prePopulateWithItems, itemId, itemLabel, onSelection, contextOverlayProps, tagInputProps, inputProps, runOnQueryChange, fullWidth, noResultText, newItemCreationText, newItemPostfix, hasStatePrimary, hasStateDanger, hasStateSuccess, hasStateWarning, disabled, createNewItemFromQuery, requestDelay, clearQueryOnSelection, className, ...otherProps }: MultiSelectProps<T>): React.JSX.Element;
+export declare namespace MultiSelect {
     var ofType: typeof BlueprintMultiSelect.ofType;
 }
 export default MultiSelect;

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

@@ -0,0 +1,10 @@
+import React from "react";
+import { MultiSelectProps } from "../MultiSelect/MultiSelect";
+export declare type MultiSuggestFieldProps<T> = MultiSelectProps<T>;
+/**
+ * Element behaves very similar to `SuggestField` but allows multiple selections.
+ * Its value does not represent a string but a stack of objects.
+ *
+ * Example usage: input field for user created tags.
+ */
+export declare function MultiSuggestField<T>({ className, ...otherProps }: MultiSuggestFieldProps<T>): React.JSX.Element;

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

@@ -59,7 +59,5 @@ export interface NotificationProps extends Omit<BlueprintToastProps, "message" |
  * Displays a notification message, optionally combined with depiction and further action buttons.
  * By default it uses colorization of an blueish info alert.
  */
-declare function Notification({ actions, children, className, message, success, warning, danger, neutral, fullWidth, // deprecated
-flexWidth, iconName, // deprecated
-icon, timeout, ...otherProps }: NotificationProps): JSX.Element;
+export declare const Notification: ({ actions, children, className, message, success, warning, danger, neutral, fullWidth, flexWidth, iconName, icon, timeout, ...otherProps }: NotificationProps) => React.JSX.Element;
 export default Notification;

package/dist/types/components/Notification/Toast.d.ts

@@ -1,3 +1,9 @@
-/// <reference types="react" />
-declare function Toast({ children, className, timeout, ...otherProps }: any): JSX.Element;
+import React from "react";
+import { NotificationProps } from "./Notification";
+export interface ToastProps extends NotificationProps {
+}
+/**
+ * Displays a `Notification` with a pre-set `timeout` setting.
+ */
+declare function Toast({ children, className, timeout, ...otherProps }: NotificationProps): React.JSX.Element;
 export default Toast;

package/dist/types/components/Notification/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Notification";
+export * from "./Toast";

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

@@ -1,4 +1,4 @@
 /// <reference types="react" />
-import { NumericInput } from "@blueprintjs/core";
-declare const _default: import("react").MemoExoticComponent<typeof NumericInput>;
-export default _default;
+import { NumericInput as BlueprintNumericInput } from "@blueprintjs/core";
+export declare const NumericInput: import("react").MemoExoticComponent<typeof BlueprintNumericInput>;
+export default NumericInput;

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

@@ -13,5 +13,5 @@ export interface OverviewItemProps extends React.HTMLAttributes<HTMLDivElement>
  * This element can include all basic information and actions to give an overview about the item.
  * Mainly used in items list or to create basic widgets.
  */
-declare function OverviewItem({ children, className, densityHigh, hasSpacing, ...otherProps }: OverviewItemProps): React.FunctionComponentElement<any>;
+export declare const OverviewItem: ({ children, className, densityHigh, hasSpacing, ...otherProps }: OverviewItemProps) => React.FunctionComponentElement<any>;
 export default OverviewItem;

package/dist/types/components/OverviewItem/OverviewItemActions.d.ts

@@ -9,5 +9,5 @@ export interface OverviewItemActionsProps extends React.HTMLAttributes<HTMLDivEl
  * Contains an arbitrary number of elements for user-interactions.
  * It does not make sense to include more than 1 or 2 of these elements within `OverviewItem`.
  */
-declare function OverviewItemActions({ children, className, hiddenInteractions, ...restProps }: OverviewItemActionsProps): JSX.Element;
+export declare const OverviewItemActions: ({ children, className, hiddenInteractions, ...restProps }: OverviewItemActionsProps) => React.JSX.Element;
 export default OverviewItemActions;

package/dist/types/components/OverviewItem/OverviewItemDepiction.d.ts

@@ -2,5 +2,5 @@ import React from "react";
 export interface OverviewItemDepictionProps extends React.HTMLAttributes<HTMLDivElement> {
     keepColors?: boolean;
 }
-declare function OverviewItemDepiction({ children, className, keepColors, ...restProps }: OverviewItemDepictionProps): JSX.Element;
+export declare const OverviewItemDepiction: ({ children, className, keepColors, ...restProps }: OverviewItemDepictionProps) => React.JSX.Element;
 export default OverviewItemDepiction;

package/dist/types/components/OverviewItem/OverviewItemDescription.d.ts

@@ -1,3 +1,5 @@
 import React from "react";
-declare function OverviewItemDescription({ children, className, ...restProps }: React.HTMLAttributes<HTMLDivElement>): JSX.Element;
+export interface OverviewItemDescriptionProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+export declare const OverviewItemDescription: ({ children, className, ...otherDivProps }: OverviewItemDescriptionProps) => React.JSX.Element;
 export default OverviewItemDescription;

package/dist/types/components/OverviewItem/OverviewItemLine.d.ts

@@ -15,5 +15,5 @@ export interface OverviewItemLineProps extends React.HTMLAttributes<HTMLDivEleme
  * If the content overflows the container then this part of the content is hidden.
  * It does not make sense to include more that 2 or 3 of those lines within one `OverviewItemDescription`.
  */
-declare function OverviewItemLine({ children, className, small, large, ...restProps }: OverviewItemLineProps): JSX.Element;
+export declare const OverviewItemLine: ({ children, className, small, large, ...restProps }: OverviewItemLineProps) => React.JSX.Element;
 export default OverviewItemLine;

package/dist/types/components/OverviewItem/OverviewItemList.d.ts

@@ -22,5 +22,5 @@ export interface OverviewItemListProps extends React.HTMLAttributes<HTMLOListEle
  * This element can include all basic information and actions to give an overview about the item.
  * Mainly used in items list or to create basic widgets.
  */
-declare function OverviewItemList({ children, className, densityHigh, hasDivider, hasSpacing, columns, ...restProps }: OverviewItemListProps): JSX.Element;
+export declare const OverviewItemList: ({ children, className, densityHigh, hasDivider, hasSpacing, columns, ...restProps }: OverviewItemListProps) => React.JSX.Element;
 export default OverviewItemList;

package/dist/types/components/OverviewItem/index.d.ts

@@ -1,7 +1,6 @@
-import OverviewItem from './OverviewItem';
-import OverviewItemDepiction from './OverviewItemDepiction';
-import OverviewItemDescription from './OverviewItemDescription';
-import OverviewItemLine from './OverviewItemLine';
-import OverviewItemActions from './OverviewItemActions';
-import OverviewItemList from './OverviewItemList';
-export { OverviewItem, OverviewItemDepiction, OverviewItemDescription, OverviewItemLine, OverviewItemActions, OverviewItemList, };
+export * from "./OverviewItem";
+export * from "./OverviewItemDepiction";
+export * from "./OverviewItemDescription";
+export * from "./OverviewItemLine";
+export * from "./OverviewItemActions";
+export * from "./OverviewItemList";

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import { PaginationProps as CarbonPaginationProps } from "carbon-components-react";
 export interface PaginationProps extends CarbonPaginationProps {
     /**
@@ -26,7 +26,7 @@ export interface PaginationProps extends CarbonPaginationProps {
      */
     hideBorders?: boolean;
 }
-declare function Pagination({ className, hidePageSizeConfiguration, hideInfoText, hidePageSelect, hideNavigationArrows, hideBorders, ...otherProps }: PaginationProps): JSX.Element;
+export declare const Pagination: ({ className, hidePageSizeConfiguration, hideInfoText, hidePageSelect, hideNavigationArrows, hideBorders, ...otherProps }: PaginationProps) => React.JSX.Element;
 interface IPaginationDetails {
     total: number;
     current: number;
@@ -38,5 +38,5 @@ interface IPaginationOptions {
     pageSizes?: number[];
     presentation?: Omit<PaginationProps, "onChange" | "totalItems" | "pageSizes" | "page" | "pageSize">;
 }
-export declare const usePagination: ({ pageSizes, presentation, initialPageSize, }: IPaginationOptions) => readonly [IPaginationDetails, JSX.Element, (total: number) => void];
+export declare const usePagination: ({ pageSizes, presentation, initialPageSize, }: IPaginationOptions) => readonly [IPaginationDetails, React.JSX.Element, (total: number) => void];
 export default Pagination;

package/dist/types/components/PropertyValuePair/PropertyName.d.ts

@@ -1,3 +1,9 @@
-/// <reference types="react" />
-declare function PropertyName({ className, children, ...otherProps }: any): JSX.Element;
+import React from "react";
+export interface PropertyNameProps extends React.HTMLAttributes<HTMLElement> {
+    /**
+     * Increase or decrease the width used for the property name.
+     */
+    size?: "small" | "medium" | "large";
+}
+export declare const PropertyName: ({ className, size, children, ...otherProps }: PropertyNameProps) => React.JSX.Element;
 export default PropertyName;

package/dist/types/components/PropertyValuePair/PropertyValue.d.ts

@@ -1,3 +1,5 @@
-/// <reference types="react" />
-declare function PropertyValue({ className, children, ...otherProps }: any): JSX.Element;
+import React from "react";
+export interface PropertyValueProps extends React.HTMLAttributes<HTMLElement> {
+}
+export declare const PropertyValue: ({ className, children, ...otherProps }: PropertyValueProps) => React.JSX.Element;
 export default PropertyValue;

package/dist/types/components/PropertyValuePair/PropertyValueList.d.ts

@@ -1,3 +1,5 @@
-/// <reference types="react" />
-declare function PropertyValueList({ className, children, ...otherProps }: any): JSX.Element;
+import React from "react";
+export interface PropertyValueListProps extends React.HTMLAttributes<HTMLDListElement> {
+}
+export declare const PropertyValueList: ({ className, children, ...otherProps }: PropertyValueListProps) => React.JSX.Element;
 export default PropertyValueList;

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

@@ -1,3 +1,13 @@
-/// <reference types="react" />
-declare function PropertyValuePair({ className, children, hasSpacing, hasDivider, ...otherProps }: any): JSX.Element;
+import React from "react";
+export interface PropertyValuePairProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Add a bit white space to the bottom of the element.
+     */
+    hasSpacing?: boolean;
+    /**
+     * Add a horizontal rule to the bottom of the element.
+     */
+    hasDivider?: boolean;
+}
+export declare const PropertyValuePair: ({ className, children, hasSpacing, hasDivider, ...otherProps }: PropertyValuePairProps) => React.JSX.Element;
 export default PropertyValuePair;

package/dist/types/components/PropertyValuePair/index.d.ts

@@ -1,5 +1,4 @@
-import PropertyName from "./PropertyName";
-import PropertyValue from "./PropertyValue";
-import PropertyValuePair from "./PropertyValuePair";
-import PropertyValueList from "./PropertyValueList";
-export { PropertyName, PropertyValue, PropertyValuePair, PropertyValueList };
+export * from "./PropertyName";
+export * from "./PropertyValue";
+export * from "./PropertyValuePair";
+export * from "./PropertyValueList";

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

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import React from 'react';
 import { RadioProps as BlueprintRadioProps } from "@blueprintjs/core";
-interface RadioButtonProps extends BlueprintRadioProps {
+export interface RadioButtonProps extends BlueprintRadioProps {
 }
-declare function RadioButton({ children, className, ...restProps }: RadioButtonProps): JSX.Element;
+export declare const RadioButton: ({ children, className, ...restProps }: RadioButtonProps) => React.JSX.Element;
 export default RadioButton;

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

@@ -1,22 +1,41 @@
-/// <reference types="react" />
-import { Select2 as BlueprintSelect, Select2Props as BlueprintSelectProps } from "@blueprintjs/select";
-import { ContextOverlayProps } from "./../../index";
-/**
- * FIXME: Currently we only route the original element through.
- * We should add here basic elemeents and processes for target and selections, etc.
- */
-export interface SelectProps<T> extends Omit<BlueprintSelectProps<T>, "popoverTargetProps" | "popoverContentProps" | "popoverProps" | "popoverRef"> {
+import React from "react";
+import { Select2Props as BlueprintSelectProps } from "@blueprintjs/select";
+import { ButtonProps, ContextOverlayProps } from "./../../index";
+export interface SelectProps<T> extends Omit<BlueprintSelectProps<T>, "popoverTargetProps" | "popoverContentProps" | "popoverProps" | "popoverRef">, Pick<ButtonProps, "icon" | "rightIcon"> {
+    /**
+     * Textual representation of the the selected value.
+     * This is displayed if the select target is not controlled directly via `children` elements.
+     */
+    text?: string;
+    /**
+     * Placeholder text displayed for selects without defined `text`.
+     * This is displayed if the select target is not controlled directly via `children` elements.
+     */
+    placeholder?: string;
     /**
      * Props to spread to `ContextOverlay` that is used to display the dropdown.
      */
     contextOverlayProps?: Partial<Omit<ContextOverlayProps, "content" | "defaultIsOpen" | "disabled" | "fill" | "renderTarget" | "targetTagName">>;
+    /**
+     * Event handler to reset search input.
+     * Only works with the uncontrolled default select target.
+     * If set then `rightElement` is automatically set with an action button to trigger the handler.
+     */
+    onClearanceHandler?: () => void;
+    /**
+     * Tooltip to show for the clear button.
+     * Only works with the uncontrolled default select target.
+     */
+    onClearanceText?: string;
 }
 /**
  * Create a Select box without the HTML select element.
  * It is possible to filter options, as well as to add new options if necessary.
+ *
+ * **Use this input element when the value is primarily selected from a defined set of elements.**
  */
-declare function Select<T>({ contextOverlayProps, ...otherSelectProps }: SelectProps<T>): JSX.Element;
-declare namespace Select {
-    var ofType: typeof BlueprintSelect.ofType;
+export declare function Select<T>({ contextOverlayProps, className, children, text, placeholder, icon, rightIcon, onClearanceHandler, inputProps, onClearanceText, ...otherSelectProps }: SelectProps<T>): React.JSX.Element;
+export declare namespace Select {
+    var ofType: <U>() => (props: SelectProps<U>) => React.JSX.Element;
 }
 export default Select;

package/dist/types/components/Separation/Divider.d.ts

@@ -15,5 +15,5 @@ export interface DividerProps extends React.HTMLAttributes<HTMLHRElement> {
      */
     alignment?: "left" | "center" | "right";
 }
-export declare function Divider({ className, addSpacing, width, alignment, ...otherHrProps }: DividerProps): JSX.Element;
+export declare function Divider({ className, addSpacing, width, alignment, ...otherHrProps }: DividerProps): React.JSX.Element;
 export default Divider;

package/dist/types/components/Separation/Spacing.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 export interface SpacingProps {
     /**
      * Set the amount of white space that separates two elements.
@@ -19,5 +19,5 @@ export interface SpacingProps {
  * Adds horizontal or vertical space between neighbouring elements.
  * It also can add a visual ruler inside.
  */
-declare function Spacing({ size, hasDivider, vertical }: SpacingProps): JSX.Element;
+export declare const Spacing: ({ size, hasDivider, vertical }: SpacingProps) => React.JSX.Element;
 export default Spacing;

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from "react";
 import { OverlayProps as BlueprintOverlayProps, SpinnerProps as BlueprintSpinnerProps } from "@blueprintjs/core";
 export declare type SpinnerPosition = "local" | "inline" | "global";
 export declare type SpinnerSize = "tiny" | "small" | "medium" | "large" | "xlarge" | "inherit";
@@ -53,6 +53,5 @@ export interface SpinnerProps extends Omit<BlueprintSpinnerProps, "size"> {
      */
     description?: string;
 }
-declare function Spinner({ className, color, position, size, stroke, showLocalBackdrop, delay, overlayProps, description, // currently unsupported (FIXME):
-...otherProps }: SpinnerProps): JSX.Element | null;
+export declare const Spinner: ({ className, color, position, size, stroke, showLocalBackdrop, delay, overlayProps, description, ...otherProps }: SpinnerProps) => React.JSX.Element | null;
 export default Spinner;

package/dist/types/components/Structure/Section.d.ts

@@ -1,3 +1,5 @@
-/// <reference types="react" />
-declare function Section({ children, className, ...restProps }: any): JSX.Element;
+import React from "react";
+export interface SectionProps extends React.HTMLAttributes<HTMLElement> {
+}
+export declare const Section: ({ children, className, ...restProps }: SectionProps) => React.JSX.Element;
 export default Section;

package/dist/types/components/Structure/SectionHeader.d.ts

@@ -1,3 +1,5 @@
-/// <reference types="react" />
-declare function SectionHeader({ children, className, ...restProps }: any): JSX.Element;
+import React from "react";
+export interface SectionHeaderProps extends React.HTMLAttributes<HTMLElement> {
+}
+export declare const SectionHeader: ({ children, className, ...restProps }: SectionHeaderProps) => React.JSX.Element;
 export default SectionHeader;

package/dist/types/components/Structure/TitleMainsection.d.ts

@@ -1,3 +1,5 @@
-/// <reference types="react" />
-declare function TitleMainsection({ children, className, ...restProps }: any): JSX.Element;
+import React from "react";
+export interface TitleMainsectionProps extends React.HTMLAttributes<HTMLElement> {
+}
+export declare const TitleMainsection: ({ children, className, ...restProps }: TitleMainsectionProps) => React.JSX.Element;
 export default TitleMainsection;

package/dist/types/components/Structure/TitlePage.d.ts

@@ -1,3 +1,5 @@
-/// <reference types="react" />
-declare function TitlePage({ children, className, ...restProps }: any): JSX.Element;
+import React from "react";
+export interface TitlePageProps extends React.HTMLAttributes<HTMLElement> {
+}
+export declare const TitlePage: ({ children, className, ...restProps }: TitlePageProps) => React.JSX.Element;
 export default TitlePage;