@laerdal/life-react-components 3.5.1-dev.11 → 3.5.1-dev.13

package/dist/InputFields/TextField.d.ts

@@ -2,41 +2,153 @@ import * as React from 'react';
 import { Size, States, Testable } from '../types';
 import { TextFieldNote } from './types';
 export type TextFieldProps = Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'onChange' | 'value' | 'disabled' | 'id' | 'type' | 'readOnly' | 'autoComplete' | 'pattern' | 'maxLength'> & {
+    /**
+       * Optional. The ID of the text field.
+       */
     id?: string;
+    /**
+      * Optional. A boolean indicating whether the text field is disabled.
+      */
     disabled?: boolean;
+    /**
+      * Optional. A boolean indicating whether the text field is read-only.
+      */
     readOnly?: boolean;
+    /**
+      * Optional. A function to be called when the text in the text field changes.
+      * It should take a string representing the new text.
+      */
     onChange?: (text: string) => void;
+    /**
+      * Optional. The current value of the text field.
+      */
     value?: string;
+    /**
+      * Optional. The validation message to be displayed when the text field is in an error state.
+      */
     validationMessage?: string;
+    /**
+      * Optional. The type of the text field. Can be any valid HTML input type.
+      */
     type?: string;
+    /**
+      * Optional. The state of the text field. Can be 'Invalid' or 'Valid'.
+      */
     state?: States.Invalid | States.Valid;
+    /**
+      * Optional. The autocomplete attribute of the text field. Can be any valid HTML autocomplete value.
+      */
     autoComplete?: string;
+    /**
+      * Optional. The placeholder text to be displayed in the text field when it is empty.
+      */
     placeholder?: string;
+    /**
+      * Optional. A boolean indicating whether the text field is required.
+      */
     required?: boolean;
+    /**
+      * Optional. The pattern attribute of the text field. Can be any valid HTML pattern value.
+      */
     pattern?: string;
+    /**
+      * Optional. The maximum length of the text that can be entered in the text field.
+      */
     maxLength?: number;
+    /**
+      * Optional. A boolean indicating whether the text field should be displayed without a border.
+      */
     withoutBorder?: boolean;
+    /**
+      * Optional. The position of the overflow tooltip. Can be 'top' or 'bottom'.
+      */
+    overflowTooltipPosition?: 'top' | 'bottom';
+    /**
+      * Optional. The size of the text field. Can be 'Small' or 'Medium'.
+      */
     size?: Size.Small | Size.Medium;
+    /**
+      * Optional. The margin of the text field. Can be any valid CSS margin value.
+      */
     margin?: string;
+    /**
+      * Optional. A note to be displayed below the text field.
+      */
     note?: TextFieldNote;
 };
-declare const TextField: React.ForwardRefExoticComponent<Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, "pattern" | "type" | "id" | "onChange" | "size" | "disabled" | "value" | "autoComplete" | "maxLength" | "readOnly"> & {
+declare const TextField: React.ForwardRefExoticComponent<Testable & Omit<React.InputHTMLAttributes<HTMLInputElement>, "value" | "pattern" | "type" | "id" | "onChange" | "size" | "disabled" | "autoComplete" | "maxLength" | "readOnly"> & {
+    /**
+       * Optional. The ID of the text field.
+       */
     id?: string | undefined;
+    /**
+      * Optional. A boolean indicating whether the text field is disabled.
+      */
     disabled?: boolean | undefined;
+    /**
+      * Optional. A boolean indicating whether the text field is read-only.
+      */
     readOnly?: boolean | undefined;
+    /**
+      * Optional. A function to be called when the text in the text field changes.
+      * It should take a string representing the new text.
+      */
     onChange?: ((text: string) => void) | undefined;
+    /**
+      * Optional. The current value of the text field.
+      */
     value?: string | undefined;
+    /**
+      * Optional. The validation message to be displayed when the text field is in an error state.
+      */
     validationMessage?: string | undefined;
+    /**
+      * Optional. The type of the text field. Can be any valid HTML input type.
+      */
     type?: string | undefined;
+    /**
+      * Optional. The state of the text field. Can be 'Invalid' or 'Valid'.
+      */
     state?: States.Valid | States.Invalid | undefined;
+    /**
+      * Optional. The autocomplete attribute of the text field. Can be any valid HTML autocomplete value.
+      */
     autoComplete?: string | undefined;
+    /**
+      * Optional. The placeholder text to be displayed in the text field when it is empty.
+      */
     placeholder?: string | undefined;
+    /**
+      * Optional. A boolean indicating whether the text field is required.
+      */
     required?: boolean | undefined;
+    /**
+      * Optional. The pattern attribute of the text field. Can be any valid HTML pattern value.
+      */
     pattern?: string | undefined;
+    /**
+      * Optional. The maximum length of the text that can be entered in the text field.
+      */
     maxLength?: number | undefined;
+    /**
+      * Optional. A boolean indicating whether the text field should be displayed without a border.
+      */
     withoutBorder?: boolean | undefined;
+    /**
+      * Optional. The position of the overflow tooltip. Can be 'top' or 'bottom'.
+      */
+    overflowTooltipPosition?: "top" | "bottom" | undefined;
+    /**
+      * Optional. The size of the text field. Can be 'Small' or 'Medium'.
+      */
     size?: Size.Small | Size.Medium | undefined;
+    /**
+      * Optional. The margin of the text field. Can be any valid CSS margin value.
+      */
     margin?: string | undefined;
+    /**
+      * Optional. A note to be displayed below the text field.
+      */
     note?: TextFieldNote | undefined;
 } & React.RefAttributes<HTMLInputElement>>;
 export default TextField;

package/dist/InputFields/types.d.ts

@@ -1,13 +1,38 @@
 import { Size, States, Testable } from '../types';
 import React from 'react';
 export type TextareaProps = Testable & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange'> & {
+    /**
+     * Required. The ID of the textarea.
+     */
     id: string;
+    /**
+     * Optional. The state of the textarea. Can be 'Invalid' or 'Valid'.
+     */
     state?: States.Invalid | States.Valid;
+    /**
+     * Optional. A function to be called when the text in the textarea changes.
+     * It should take a string representing the new text.
+     */
     onChange?: (text: string) => void;
+    /**
+     * Optional. The validation message to be displayed when the textarea is in an error state.
+     */
     validationMessage?: string;
+    /**
+     * Required. The size of the textarea. Can be 'Small' or 'Medium'.
+     */
     size: Size.Small | Size.Medium;
+    /**
+     * Optional. A boolean indicating whether the height of the textarea should automatically adjust to fit the text.
+     */
     autoHeight?: boolean;
+    /**
+     * Optional. The margin of the textarea. Can be any valid CSS margin value.
+     */
     margin?: string;
+    /**
+     * Optional. A note to be displayed below the textarea.
+     */
     note?: TextFieldNote;
 };
 export type TextFieldNote = {
@@ -15,17 +40,30 @@ export type TextFieldNote = {
     icon: React.ReactNode;
 };
 export interface CheckboxProps extends Testable, Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick' | 'onKeyDown' | 'onMouseDown' | 'tabIndex'> {
+    /** Optional. Id of the checkbox. */
     id?: string;
+    /** Required. Current state of the checkbox. */
     selected: boolean;
+    /** Optional. Handler to be called when checkbox is selected/unselected */
     select?: (selected: boolean) => void;
+    /** Optional. Label to be shown on the right side of the checkbox. */
     label?: string;
+    /** Optional. If checkbox is selected and invalid flag is set, then checkbox will be shown in 'invalid' state. */
     invalid?: boolean;
+    /** Optional. If set, then user can not interact with it. */
     disabled?: boolean;
+    /** Optional. Margin property. */
     margin?: string;
-    size?: Size;
+    /** Optional. Size of the Checkbox. Defaults to 'medium'. */
+    size?: Size.Small | Size.Medium | Size.Large;
+    /** Optional. pointer-events: none style will be set to the checkbox if this flag is set. */
     iconPointerEventsTransparent?: boolean;
+    /** Optional. If set then checkbox will be shown in 'semi-selected' state. */
     semiSelected?: boolean;
+    /** Optional. If set, then user can not select/unselect the checkbox */
     readOnly?: boolean;
+    /** Optional. Tab index attribute of the checkbox. */
     tabIndexVal?: number;
+    /** Optional. Custom classname to be set to the checkbox. */
     className?: string;
 }

package/dist/LinearProgress/LinearProgress.d.ts

@@ -14,11 +14,17 @@ export declare enum LinearProgressVariant {
     Inverted = "inverted"
 }
 export interface LinearProgressProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Size of the component. Defaults to 'medium' */
     size?: Size.Small | Size.Medium | Size.Large;
+    /** Progress type. Defaults to 'line' */
     type?: LinearProgressType;
+    /** Progress variant. Defaults to 'normal' */
     variant?: LinearProgressVariant;
+    /** Label of the component */
     label?: string;
+    /** Current value on the progress. */
     value: number;
+    /** Maximum value of the progress bar. */
     max: number;
 }
 declare const LinearProgress: React.FunctionComponent<LinearProgressProps>;

package/dist/List/ListRow.d.ts

@@ -1,20 +1,33 @@
 import * as React from 'react';
 import { DropdownButtonProps } from '../Dropdown/DropdownButtonTypes';
 import { Size } from '../types';
-type Props = Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' | 'onMouseDown' | 'onKeyDown'> & {
-    size?: Size;
+export interface ListRowProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' | 'onMouseDown' | 'onKeyDown'> {
+    /** Size of the ListRow. Defaults to 'medium'. */
+    size?: Size.Small | Size.Medium | Size.Large;
+    /** Variant of the ListRow. Defaults to 'normal'. */
     variant?: 'normal' | 'overlay';
+    /** Optional. Icon to be shown on the left side of the ListRow. */
     icon?: React.ReactNode;
+    /** Required. Main text of the ListRow */
     mainText: string;
+    /** Optional. Secondary row shown under MainText  */
     secondaryText?: string;
+    /** Optional. Details of the DropdownButton shown on the right side of the ListRow.  */
     dropdown?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width'>;
+    /** Optional. Note to be shown on the right side of the component.  */
     note?: string;
+    /** Optional. Tooltip of the Note shown on the right side of the component.  */
     noteTooltip?: string;
+    /** Optional. If disabled then styles are greyed out and user can not interact with dropdown or click on the ListRow. */
     disabled?: boolean;
+    /** Optional. Action to be executed when user clicks the row. */
     action?: () => void;
+    /** Optional. Icon of the IconButton to show on the right side of the component */
     rightSideIcon?: React.ReactNode;
+    /** Optional. Action to be executed when user clicks on the IconButton on the right */
     rightSideAction?: () => void;
+    /** Optional. If disabled user will not be able to interact with IconButton shown on the right side */
     rightSideIconDisabled?: boolean;
-};
-declare const ListRow: React.FunctionComponent<Props>;
+}
+declare const ListRow: React.FunctionComponent<ListRowProps>;
 export default ListRow;

package/dist/List/__tests__/ListRow.tests.js

@@ -0,0 +1,51 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import React from 'react';
+import { render } from '@testing-library/react';
+import { ListRow } from '../index';
+import { Size } from '../../types';
+import { SystemIcons } from '../../icons';
+describe('<ListRow />', function () {
+    it('Renders', function () { return __awaiter(void 0, void 0, void 0, function () {
+        var getByText;
+        return __generator(this, function (_a) {
+            getByText = render(React.createElement(ListRow, { icon: React.createElement(SystemIcons.Institute, null), mainText: 'Laerdal Medical AS', size: Size.Small, disabled: false })).getByText;
+            expect(getByText('Laerdal Medical AS')).toBeDefined();
+            return [2 /*return*/];
+        });
+    }); });
+});

package/dist/LoadingIndicator/LoadingIndicator.d.ts

@@ -1,9 +1,12 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { Size } from '../types';
-type LoadingIndicatorProps = {
+export type LoadingIndicatorProps = {
+    /** Optional. Id of the loading indicator. */
     id?: string;
+    /** Optional. Size of the loading indicator. Defaults to 'Medium'. */
     size?: Size.Small | Size.Medium;
+    /** Optional. Color of the loading indicator, defaults to 'COLORS.primary'. */
     color?: string;
 };
-declare const LoadingIndicator: ({ size, color, id }: LoadingIndicatorProps) => JSX.Element;
+declare const LoadingIndicator: ({ size, color, id }: LoadingIndicatorProps) => React.JSX.Element;
 export default LoadingIndicator;

package/dist/LoadingPage/GlobalLoadingPage.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-interface LoaderProps {
+export interface LoaderProps {
     optionalMessage?: string;
     includeHeader?: boolean;
 }

package/dist/MenuItem/MenuItem.d.ts

@@ -2,11 +2,17 @@ import * as React from 'react';
 import { Size } from '../types';
 import { DropdownItem } from '../Dropdown';
 export interface MenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'disabled' | 'onMouseDown' | 'onClick'> {
+    /** Required. Details of the item. */
     item: DropdownItem;
+    /** Required. Handler to be called when user clicks on the menu item */
     onClickHandler: (e: React.MouseEvent) => void;
+    /** Required. Styles are different for MenuItems in 'active' state.  */
     active: boolean;
+    /** Required. Id of the MenuItem.  */
     id: string;
-    size?: Size;
+    /** Optional. Size of the component. Defaults to 'medium'.  */
+    size?: Size.Small | Size.Medium | Size.Large;
+    /** Optional. Icon to be shown on the right side of the menu item. Icon will be shown only if 'locked' flag of 'item' is not set. */
     iconRight?: React.ReactElement;
 }
 export declare const DropdownButton: import("styled-components").StyledComponent<"button", any, {

package/dist/MiniProductCard/MiniProductCard.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { Product } from '../types';
 type CardProps = {
     product: Product;
     url?: string;
 };
-declare const MiniProductCard: ({ url, product }: CardProps) => JSX.Element;
+declare const MiniProductCard: ({ url, product }: CardProps) => React.JSX.Element;
 export default MiniProductCard;

package/dist/Modals/Modal.d.ts

@@ -6,9 +6,9 @@ type ModalProps = {
     children: any;
 };
 declare const Modal: {
-    ({ children }: ModalProps): JSX.Element;
-    Header({ children }: ModalProps): JSX.Element;
-    Body({ children }: ModalProps): JSX.Element;
-    Footer({ children }: ModalProps): JSX.Element;
+    ({ children }: ModalProps): React.JSX.Element;
+    Header({ children }: ModalProps): React.JSX.Element;
+    Body({ children }: ModalProps): React.JSX.Element;
+    Footer({ children }: ModalProps): React.JSX.Element;
 };
 export default Modal;

package/dist/Modals/ModalContainer.d.ts

@@ -25,7 +25,7 @@ declare class ModalContainer extends React.Component<ModalContainerProps, ModalC
         scroll: number;
     }): void;
     componentWillUnmount(): void;
-    render(): JSX.Element;
+    render(): React.JSX.Element;
     private preventScroll;
     private resetScroll;
 }

package/dist/Modals/ModalContent.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { Size } from '../types';
 import { ButtonAction, LeftFooterAction, ModalHeaderButtons } from './ModalTypes';
 import { ImageWithFallbacksProps } from "../Image/ImageWithFallbacks";
-interface ModalContentProps {
+export interface ModalContentProps {
     size?: Size.Small | Size.Medium | Size.Large;
     isModalOpen: boolean;
     closeAction: () => void;

package/dist/Modals/ModalDialog.d.ts

@@ -2,18 +2,28 @@ import React from 'react';
 import { Size } from '../types';
 import { ButtonAction, LeftFooterAction } from './ModalTypes';
 import { ImageWithFallbacksProps } from '../Image/ImageWithFallbacks';
-interface NewModalProps {
-    size?: Size;
+export interface ModalDialogProps {
+    /** Optional. Size of the modal. Defaults to 'medium'  */
+    size?: Size.Small | Size.Medium | Size.Large;
+    /** Required. Current state of the modal. */
     isModalOpen: boolean;
+    /** Optional. Content of the ModalDialog. */
     children?: React.ReactNode;
-    closeModalAndClearInput: any;
+    /** Optional. Title of the ModalDialog. */
     title?: string | React.ReactNode;
+    /** Optional. Content of the image to be shown in the header of the modal. */
     topImage?: any;
+    /** Optional. Serves same purpose as 'topImage' except adds support for fallback options. Has higher priority than 'topImage'. */
     topImageWithFallbacksProps?: ImageWithFallbacksProps;
+    /** Optional. If flag is set then overlay is added that converts image to grey color. */
     topImageGrayscale?: boolean;
+    /** Optional. Collection of Buttons that will be shown in the footer on the right side of the ModalDialog. */
     buttons?: ButtonAction[];
+    /** Optional. Left footer action that will be shown on the left side of the footer of ModalDialog. Can be a hyperlink, button or a note. */
     leftFooterAction?: LeftFooterAction;
+    /** Optional. Tooltip that will be shown */
     tooltip?: string;
+    /**  */
     backButton?: () => void;
     closeAction: () => void;
     submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;
@@ -25,5 +35,5 @@ interface NewModalProps {
     width?: string;
     hasContentBorders?: boolean;
 }
-export declare const ModalDialog: React.FunctionComponent<NewModalProps>;
+export declare const ModalDialog: React.FunctionComponent<ModalDialogProps>;
 export default ModalDialog;

package/dist/NavItem/NavItem.d.ts

@@ -5,5 +5,5 @@ export type StyledComponentPropsWithAs<C extends string | React.ComponentType<an
     forwardedAs?: FAsC | undefined;
 };
 export declare const NavItemDiv: import("styled-components").StyledComponent<"div", any, {}, never>;
-declare const NavItem: (props: StyledComponentPropsWithAs<string | React.ComponentType<any>, any, {}, never, string | React.ComponentType<any>, "div">) => JSX.Element;
+declare const NavItem: (props: StyledComponentPropsWithAs<string | React.ComponentType<any>, any, {}, never, string | React.ComponentType<any>, "div">) => React.JSX.Element;
 export default NavItem;

package/dist/NavItem/NestedNavItem.d.ts

@@ -1,13 +1,31 @@
 import * as React from 'react';
 import { Size } from '../types';
 import { DropdownItem } from '../Dropdown/DropdownContent';
-export interface MenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'disabled' | 'onMouseDown' | 'onClick'> {
+export interface NestedNavItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'disabled' | 'onMouseDown' | 'onClick'> {
+    /**
+     * Required. The item to be displayed in the dropdown.
+     */
     item: DropdownItem;
+    /**
+     * Required. The handler function to be called when the item is clicked.
+     */
     onClickHandler: (e: React.MouseEvent) => void;
+    /**
+     * Required. A boolean indicating whether the item is currently active.
+     */
     active: boolean;
+    /**
+     * Required. The unique identifier for the item.
+     */
     id: string;
+    /**
+     * Optional. The size of the item. Defaults to 'Medium'.
+     */
     size?: Size;
+    /**
+     * Optional. An icon to be displayed on the right side of the item.
+     */
     iconRight?: React.ReactElement;
 }
-declare const NestedNavItem: React.ForwardRefExoticComponent<MenuItemProps & React.RefAttributes<HTMLButtonElement>>;
+declare const NestedNavItem: React.ForwardRefExoticComponent<NestedNavItemProps & React.RefAttributes<HTMLButtonElement>>;
 export default NestedNavItem;

package/dist/NotificationDot/NotificationDot.d.ts

@@ -1,8 +1,18 @@
 import * as React from 'react';
 import { Size } from '../types';
 export interface NotificationProps {
+    /**
+   * Optional. The size of the notification dot. It can be 'Small', 'Medium', or 'Large'.
+   * Defaults to 'Medium' if not specified.
+   */
     size?: Size.Small | Size.Medium | Size.Large;
+    /**
+   * Required. The variant of the notification dot. It can be 'critical' or 'positive'.
+   */
     variant: 'critical' | 'positive';
+    /**
+   * Optional. The testId for the notification dot. Useful for testing purposes.
+   */
     testId?: string;
 }
 declare const NotificationDot: React.FunctionComponent<NotificationProps>;

package/dist/Paginator/Paginator.d.ts

@@ -1,9 +1,23 @@
-/// <reference types="react" />
-type PaginatorProps = {
+import * as React from 'react';
+export interface PaginatorProps {
+    /**
+     * Required. The total number of pages.
+     */
     pageCount: number;
+    /**
+     * Required. The current active page.
+     */
     currentPage: number;
+    /**
+     * Required. The base URL to which the page number will be appended.
+     */
     baseUrl: string;
+    /**
+     * Optional. A callback function that will be called when the page changes.
+     * It receives the new page number as its argument.
+     * If the function returns false, the page change will be prevented.
+     */
     onPageChange?: (page: number) => boolean | void;
-};
-declare const Paginator: ({ pageCount, currentPage, baseUrl, onPageChange }: PaginatorProps) => JSX.Element | null;
+}
+declare const Paginator: ({ pageCount, currentPage, baseUrl, onPageChange }: PaginatorProps) => React.JSX.Element | null;
 export default Paginator;

package/dist/Panel/Panel.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-interface BasePanelProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
+export interface BasePanelProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title' | 'content'> {
     type?: 'default' | 'carousel';
 }
-interface PanelContent {
+export interface PanelContent {
     media?: {
         type: 'image';
         src: string;
@@ -15,15 +15,33 @@ interface PanelContent {
     title?: string;
     content?: React.ReactNode;
 }
-interface DefaultPanelProps extends BasePanelProps, PanelContent {
+export interface DefaultPanelProps extends BasePanelProps, PanelContent {
+    /**
+     * Optional. Specifies the type of the panel as 'default'.
+     * If not specified, the type defaults to 'default'.
+     */
     type?: 'default';
+    /**
+     * Optional. Specifies the order of the content in the panel.
+     * It can be 'default' or 'reverse'. Defaults to 'default' if not specified.
+     */
     order?: 'default' | 'reverse';
 }
-interface CarouselPanelProps extends BasePanelProps {
+export interface CarouselPanelProps extends BasePanelProps {
+    /**
+     * Required. Specifies the type of the panel as 'carousel'.
+     */
     type: 'carousel';
+    /**
+     * Optional. Specifies the order of the content in the panel.
+     * It can be 'default' or 'reverse'. Defaults to 'default' if not specified.
+     */
     order?: 'default' | 'reverse';
+    /**
+     * Optional. An array of PanelContent objects.
+     * Each object represents a slide in the carousel.
+     */
     items?: PanelContent[];
 }
 export type PanelProps = DefaultPanelProps | CarouselPanelProps;
-export declare const Panel: (props: PanelProps) => JSX.Element;
-export {};
+export declare const Panel: (props: PanelProps) => React.JSX.Element;