@micromag/core 0.4.98 → 0.4.109

package/es/components.d.ts

@@ -1,4 +1,3 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
 import React__default, { ReactNode, ElementType, CSSProperties, MouseEventHandler, ForwardedRef, JSX, MouseEvent, HTMLAttributes, Component as Component$2 } from 'react';
 import { MessageDescriptor } from 'react-intl';
@@ -89,7 +88,7 @@ interface ButtonProps {
     onClick?: MouseEventHandler<ButtonElement> | null;
     refButton?: ForwardedRef<ButtonElement> | null;
 }
-declare function Button$1({ type, theme, size, href, external, direct, target, label, children, focusable, active, icon, iconPosition, disabled, loading, disableOnLoading, withoutStyle, withoutBootstrapStyles, withoutTheme, outline, onClick, className, iconClassName, labelClassName, refButton, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
+declare function Button$1({ type, theme, size, href, external, direct, target, label, children, focusable, active, icon, iconPosition, disabled, loading, disableOnLoading, withoutStyle, withoutBootstrapStyles, withoutTheme, outline, onClick, className, iconClassName, labelClassName, refButton, ...props }: ButtonProps): React$1.JSX.Element;
 
 interface ButtonsProps {
     buttons?: Button$2[];
@@ -100,12 +99,12 @@ interface ButtonsProps {
     className?: string | null;
     buttonClassName?: string | null;
 }
-declare function Buttons({ buttons, size, theme, renderButton, onClickButton, buttonClassName, className, }: ButtonsProps): react_jsx_runtime.JSX.Element;
+declare function Buttons({ buttons, size, theme, renderButton, onClickButton, buttonClassName, className, }: ButtonsProps): JSX.Element;
 
 interface BackButtonProps extends ButtonProps {
     className?: string | null;
 }
-declare function BackButton({ ...props }: BackButtonProps): react_jsx_runtime.JSX.Element;
+declare function BackButton({ ...props }: BackButtonProps): React$1.JSX.Element;
 
 interface ClearButtonProps extends HTMLAttributes<HTMLButtonElement> {
     onClick?: MouseEventHandler<HTMLButtonElement> | null;
@@ -113,7 +112,7 @@ interface ClearButtonProps extends HTMLAttributes<HTMLButtonElement> {
     className?: string | null;
     disabled?: boolean;
 }
-declare function ClearButton({ onClick, className, iconOnly, disabled, ...props }: ClearButtonProps): react_jsx_runtime.JSX.Element;
+declare function ClearButton({ onClick, className, iconOnly, disabled, ...props }: ClearButtonProps): React$1.JSX.Element;
 
 interface FormProps {
     action: string;
@@ -143,7 +142,7 @@ interface FormProps {
     actionsClassName?: string | null;
     cancelClassName?: string | null;
 }
-declare function Form({ action, method, fields: initialFields, initialValue, postForm, submitButtonLabel, submitButtonLoadingLabel, submitButtonTheme, cancelButtonTheme, buttons, children, actionsAlign, withoutActions, withoutComplete, withoutBackButton, onComplete, onResponse, onMessage, onCancel, onCancelHref, onOpenFieldForm, onCloseFieldForm, className, fieldsClassName, actionsClassName, cancelClassName, }: FormProps): react_jsx_runtime.JSX.Element;
+declare function Form({ action, method, fields: initialFields, initialValue, postForm, submitButtonLabel, submitButtonLoadingLabel, submitButtonTheme, cancelButtonTheme, buttons, children, actionsAlign, withoutActions, withoutComplete, withoutBackButton, onComplete, onResponse, onMessage, onCancel, onCancelHref, onOpenFieldForm, onCloseFieldForm, className, fieldsClassName, actionsClassName, cancelClassName, }: FormProps): React__default.JSX.Element;
 
 interface FormPanelProps {
     description?: React__default.ReactNode | null;
@@ -151,7 +150,7 @@ interface FormPanelProps {
     children?: React__default.ReactNode | null;
     className?: string | null;
 }
-declare function FormPanel({ description, loading, children, className, ...props }: FormPanelProps): react_jsx_runtime.JSX.Element;
+declare function FormPanel({ description, loading, children, className, ...props }: FormPanelProps): React__default.JSX.Element;
 
 interface FieldFormProps {
     name?: string | null;
@@ -165,55 +164,55 @@ interface FieldFormProps {
     closeFieldForm: (...args: unknown[]) => void;
     fieldContext?: unknown | null;
 }
-declare function FieldForm({ name, value, form, formComponents, fields, className, onChange, gotoFieldForm, closeFieldForm, fieldContext, }: FieldFormProps): react_jsx_runtime.JSX.Element | null;
+declare function FieldForm({ name, value, form, formComponents, fields, className, onChange, gotoFieldForm, closeFieldForm, fieldContext, }: FieldFormProps): React$1.JSX.Element | null;
 
 interface ArrowIconProps {
     className?: string | null;
     color?: string;
 }
-declare function ArrowIcon({ color, className }: ArrowIconProps): react_jsx_runtime.JSX.Element;
+declare function ArrowIcon({ color, className }: ArrowIconProps): React__default.JSX.Element;
 
 interface CloseIconProps {
     className?: string | null;
     color?: string;
 }
-declare function CloseIcon({ color, className }: CloseIconProps): react_jsx_runtime.JSX.Element;
+declare function CloseIcon({ color, className }: CloseIconProps): React__default.JSX.Element;
 
 interface FullscreenIconProps {
     className?: string | null;
     color?: string;
 }
-declare function FullscreenIcon({ color, className }: FullscreenIconProps): react_jsx_runtime.JSX.Element;
+declare function FullscreenIcon({ color, className }: FullscreenIconProps): React__default.JSX.Element;
 
 interface LinkIconProps {
     className?: string | null;
     color?: string;
 }
-declare function LinkIcon({ color, className }: LinkIconProps): react_jsx_runtime.JSX.Element;
+declare function LinkIcon({ color, className }: LinkIconProps): React__default.JSX.Element;
 
 interface MuteIconProps {
     className?: string | null;
     color?: string;
 }
-declare function MuteIcon({ color, className }: MuteIconProps): react_jsx_runtime.JSX.Element;
+declare function MuteIcon({ color, className }: MuteIconProps): React__default.JSX.Element;
 
 interface PauseIconProps {
     className?: string | null;
     color?: string;
 }
-declare function PauseIcon({ color, className }: PauseIconProps): react_jsx_runtime.JSX.Element;
+declare function PauseIcon({ color, className }: PauseIconProps): React__default.JSX.Element;
 
 interface PlayIconProps {
     className?: string | null;
     color?: string | null;
 }
-declare function PlayIcon({ color, className }: PlayIconProps): react_jsx_runtime.JSX.Element;
+declare function PlayIcon({ color, className }: PlayIconProps): React__default.JSX.Element;
 
 interface UnmuteIconProps {
     className?: string | null;
     color?: string;
 }
-declare function UnmuteIcon({ color, className }: UnmuteIconProps): react_jsx_runtime.JSX.Element;
+declare function UnmuteIcon({ color, className }: UnmuteIconProps): React__default.JSX.Element;
 
 interface BreadcrumbProps {
     items?: MenuItem$1[];
@@ -223,7 +222,7 @@ interface BreadcrumbProps {
     noWrap?: boolean;
     className?: string | null;
 }
-declare function Breadcrumb({ items, theme, separator, withoutBar, noWrap, className, }: BreadcrumbProps): react_jsx_runtime.JSX.Element;
+declare function Breadcrumb({ items, theme, separator, withoutBar, noWrap, className, }: BreadcrumbProps): React$1.JSX.Element;
 
 interface DropdownProps {
     items?: MenuItem$1[];
@@ -235,7 +234,7 @@ interface DropdownProps {
     onClickItem?: ((...args: unknown[]) => void) | null;
     onClickOutside?: ((...args: unknown[]) => void) | null;
 }
-declare function Dropdown({ items, children, visible, align, className, itemClassName, onClickItem, onClickOutside, }: DropdownProps): react_jsx_runtime.JSX.Element;
+declare function Dropdown({ items, children, visible, align, className, itemClassName, onClickItem, onClickOutside, }: DropdownProps): React$1.JSX.Element;
 
 interface MenuProps {
     items?: MenuItem[];
@@ -256,7 +255,7 @@ interface MenuProps {
     dropdownLinkClassName?: string | null;
     dropdownAlign?: DropdownAlign | null;
 }
-declare function Menu({ items, tagName, itemTagName, children, linkAsItem, className, itemClassName, linkClassName, hasSubMenuClassName, subMenuClassName, subMenuItemClassName, subMenuLinkClassName, hasDropdownClassName, dropdownClassName, dropdownItemClassName, dropdownLinkClassName, dropdownAlign, }: MenuProps): react_jsx_runtime.JSX.Element;
+declare function Menu({ items, tagName, itemTagName, children, linkAsItem, className, itemClassName, linkClassName, hasSubMenuClassName, subMenuClassName, subMenuItemClassName, subMenuLinkClassName, hasDropdownClassName, dropdownClassName, dropdownItemClassName, dropdownLinkClassName, dropdownAlign, }: MenuProps): React__default.JSX.Element;
 
 interface NavbarProps {
     brand?: React__default.ReactNode | null;
@@ -274,7 +273,7 @@ interface NavbarProps {
     breadCrumbsClassName?: string | null;
     collapseClassName?: string | null;
 }
-declare function Navbar({ brand, brandLink, breadcrumbs, theme, size, compact, noWrap, withoutCollapse, withoutCollapseToggle, children, className, brandClassName, breadCrumbsClassName, collapseClassName, }: NavbarProps): react_jsx_runtime.JSX.Element;
+declare function Navbar({ brand, brandLink, breadcrumbs, theme, size, compact, noWrap, withoutCollapse, withoutCollapseToggle, children, className, brandClassName, breadCrumbsClassName, collapseClassName, }: NavbarProps): React__default.JSX.Element;
 
 interface PaginationMenuProps {
     page?: number;
@@ -290,7 +289,7 @@ interface PaginationMenuProps {
     linkClassName?: string | null;
     onClickPage?: ((...args: unknown[]) => void) | null;
 }
-declare function PaginationMenu({ page: parentPage, lastPage: parentLastPage, maxPages: parentMaxPages, total: parentTotal, url, query, withPreviousNext, className, paginationClassName, itemClassName, linkClassName, onClickPage, }: PaginationMenuProps): react_jsx_runtime.JSX.Element;
+declare function PaginationMenu({ page: parentPage, lastPage: parentLastPage, maxPages: parentMaxPages, total: parentTotal, url, query, withPreviousNext, className, paginationClassName, itemClassName, linkClassName, onClickPage, }: PaginationMenuProps): React$1.JSX.Element;
 
 interface TabsMenuProps {
     items?: MenuItem$1[];
@@ -301,7 +300,7 @@ interface TabsMenuProps {
     className?: string | null;
     onClickItem?: ((...args: unknown[]) => void) | null;
 }
-declare function TabsMenu({ items, size, theme, renderItemButton, buttonClassName, className, onClickItem, }: TabsMenuProps): react_jsx_runtime.JSX.Element;
+declare function TabsMenu({ items, size, theme, renderItemButton, buttonClassName, className, onClickItem, }: TabsMenuProps): React$1.JSX.Element;
 
 interface UploadModalProps {
     type?: MediaType | unknown[] | null;
@@ -310,10 +309,10 @@ interface UploadModalProps {
     onUploaded?: ((...args: unknown[]) => void) | null;
     onRequestClose?: ((...args: unknown[]) => void) | null;
 }
-declare function UploadModal({ type, opened, sources, onUploaded, onRequestClose, }: UploadModalProps): react_jsx_runtime.JSX.Element | null;
+declare function UploadModal({ type, opened, sources, onUploaded, onRequestClose, }: UploadModalProps): React__default.JSX.Element | null;
 
 declare const _default: {
-    (props: any): react_jsx_runtime.JSX.Element;
+    (props: any): React__default.JSX.Element;
     displayName: string;
 };
 
@@ -322,14 +321,14 @@ interface PanelProps {
     title?: string | null;
     children?: React__default.ReactNode | null;
 }
-declare function Panel({ id, children, title }: PanelProps): react_jsx_runtime.JSX.Element;
+declare function Panel({ id, children, title }: PanelProps): React__default.JSX.Element;
 
 interface PanelPortalProps {
     id?: string | null;
     data?: Record<string, unknown> | null;
     children?: React__default.ReactNode | null;
 }
-declare function PanelPortal({ id, data, children }: PanelPortalProps): string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null;
+declare function PanelPortal({ id, data, children }: PanelPortalProps): string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | React__default.JSX.Element | null;
 
 interface CardProps {
     href?: string | null;
@@ -360,7 +359,7 @@ interface CardProps {
     onClickBody?: ((...args: unknown[]) => void) | null;
     onClickFooter?: ((...args: unknown[]) => void) | null;
 }
-declare function Card({ href, header, image, imageAlt, imageOverlay, beforeBody, title, subtitle, children, afterBody, links, linksInSameBody, footer, theme, className, imageClassName, headerClassName, titleClassName, subtitleClassName, bodyClassName, footerClassName, onClick, onClickBody, onClickFooter, }: CardProps): react_jsx_runtime.JSX.Element;
+declare function Card({ href, header, image, imageAlt, imageOverlay, beforeBody, title, subtitle, children, afterBody, links, linksInSameBody, footer, theme, className, imageClassName, headerClassName, titleClassName, subtitleClassName, bodyClassName, footerClassName, onClick, onClickBody, onClickFooter, }: CardProps): React__default.JSX.Element;
 
 interface CollapsablePanelProps {
     title?: React__default.ReactNode | null;
@@ -371,7 +370,7 @@ interface CollapsablePanelProps {
     openedClassName?: string | null;
     buttonClassName?: string | null;
 }
-declare function CollapsablePanel({ title, children, className, topClassName, contentClassName, openedClassName, buttonClassName, }: CollapsablePanelProps): react_jsx_runtime.JSX.Element;
+declare function CollapsablePanel({ title, children, className, topClassName, contentClassName, openedClassName, buttonClassName, }: CollapsablePanelProps): React__default.JSX.Element;
 
 interface CloseProps {
     stroke?: string;
@@ -379,14 +378,14 @@ interface CloseProps {
     fill?: string;
     className?: string | null;
 }
-declare function Close({ stroke, border, fill, className, }: CloseProps): react_jsx_runtime.JSX.Element;
+declare function Close({ stroke, border, fill, className, }: CloseProps): React__default.JSX.Element;
 
 interface DateProps {
     date?: string | null;
     withTime?: boolean;
     timeSeparator?: ReactNode;
 }
-declare function Date({ date, withTime, timeSeparator }: DateProps): react_jsx_runtime.JSX.Element;
+declare function Date({ date, withTime, timeSeparator }: DateProps): React$1.JSX.Element;
 
 interface DetectorProps {
     throttleDelay?: number | null;
@@ -398,7 +397,7 @@ interface DetectorProps {
     children?: React__default.ReactNode | null;
     className?: string | null;
 }
-declare function Detector({ throttleDelay, threshold, onEnter, onLeave, onChange, disabled, children, className, }: DetectorProps): react_jsx_runtime.JSX.Element;
+declare function Detector({ throttleDelay, threshold, onEnter, onLeave, onChange, disabled, children, className, }: DetectorProps): React__default.JSX.Element;
 
 interface ElementComponentProps {
     name: string;
@@ -408,14 +407,14 @@ interface ElementComponentProps {
     className?: string | null;
     placeholderProps?: Record<string, unknown> | null;
 }
-declare function ElementComponent({ name, components, props, isPlaceholder, className, placeholderProps, }: ElementComponentProps): react_jsx_runtime.JSX.Element | "Bad component name" | "Bad component";
+declare function ElementComponent({ name, components, props, isPlaceholder, className, placeholderProps, }: ElementComponentProps): React__default.JSX.Element | "Bad component name" | "Bad component";
 
 interface EmptyProps {
     children?: React__default.ReactNode | null;
     withoutBorder?: boolean;
     className?: string | null;
 }
-declare function Empty({ children, withoutBorder, className }: EmptyProps): react_jsx_runtime.JSX.Element;
+declare function Empty({ children, withoutBorder, className }: EmptyProps): React__default.JSX.Element;
 
 interface FontFacesProps {
     fonts?: Font[];
@@ -424,14 +423,14 @@ interface FontFacesProps {
         format?: string;
     })[];
 }
-declare function FontFaces({ fonts, formats, }: FontFacesProps): react_jsx_runtime.JSX.Element | null;
+declare function FontFaces({ fonts, formats, }: FontFacesProps): React__default.JSX.Element | null;
 
 interface LabelProps {
     children: Label$2;
     isHtml?: boolean;
     values?: Record<string, unknown>;
 }
-declare function Label$1({ children, isHtml, values }: LabelProps): string | number | bigint | boolean | Iterable<React$1.ReactNode> | Promise<string | number | bigint | boolean | React$1.ReactPortal | React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>> | Iterable<React$1.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
+declare function Label$1({ children, isHtml, values }: LabelProps): string | number | bigint | boolean | Iterable<React$1.ReactNode> | Promise<string | number | bigint | boolean | React$1.ReactPortal | React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>> | Iterable<React$1.ReactNode> | null | undefined> | React$1.JSX.Element | null | undefined;
 
 interface LinkProps {
     href?: string;
@@ -442,7 +441,7 @@ interface LinkProps {
     withoutStyle?: boolean;
     className?: string | null;
 }
-declare function Link({ href, external, children, target, rel, className, withoutStyle, ...props }: LinkProps): react_jsx_runtime.JSX.Element;
+declare function Link({ href, external, children, target, rel, className, withoutStyle, ...props }: LinkProps): React__default.JSX.Element;
 
 interface MediaProps {
     thumbnail?: React__default.ReactNode | null;
@@ -454,7 +453,7 @@ interface MediaProps {
     bodyClassName?: string | null;
     titleClassName?: string | null;
 }
-declare function Media({ thumbnail, thumbnailAlign, children, title, className, thumbnailClassName, bodyClassName, titleClassName, }: MediaProps): react_jsx_runtime.JSX.Element;
+declare function Media({ thumbnail, thumbnailAlign, children, title, className, thumbnailClassName, bodyClassName, titleClassName, }: MediaProps): React__default.JSX.Element;
 
 interface MetaProps {
     title?: string | null;
@@ -464,7 +463,7 @@ interface MetaProps {
     suffix?: string;
     children?: React__default.ReactNode | null;
 }
-declare function Meta({ title, url, metadata, fullTitle, suffix, children, }: MetaProps): react_jsx_runtime.JSX.Element;
+declare function Meta({ title, url, metadata, fullTitle, suffix, children, }: MetaProps): React__default.JSX.Element;
 
 interface SlideshowProps {
     items?: React__default.ReactNode[];
@@ -475,7 +474,7 @@ interface SlideshowProps {
     className?: string | null;
     children?: React__default.ReactNode | null;
 }
-declare function Slideshow({ items, auto, delay, width, height, className, children, }: SlideshowProps): react_jsx_runtime.JSX.Element;
+declare function Slideshow({ items, auto, delay, width, height, className, children, }: SlideshowProps): React__default.JSX.Element;
 
 interface SpinnerProps {
     animated?: boolean;
@@ -483,7 +482,7 @@ interface SpinnerProps {
     strokeWidth?: number;
     className?: string | null;
 }
-declare function Spinner({ animated, color, strokeWidth, className, }: SpinnerProps): react_jsx_runtime.JSX.Element;
+declare function Spinner({ animated, color, strokeWidth, className, }: SpinnerProps): React__default.JSX.Element;
 
 interface PlaceholderBlockProps {
     width?: number | string;
@@ -495,29 +494,29 @@ interface PlaceholderBlockProps {
     withInvertedColors?: boolean;
 }
 
-declare function AdFrame({ width, height, ...props }: PlaceholderBlockProps): react_jsx_runtime.JSX.Element;
+declare function AdFrame({ width, height, ...props }: PlaceholderBlockProps): React$1.JSX.Element;
 
-declare function AdImage({ width, height, ...props }: PlaceholderBlockProps): react_jsx_runtime.JSX.Element;
+declare function AdImage({ width, height, ...props }: PlaceholderBlockProps): React$1.JSX.Element;
 
-declare function Audio({ width, height, ...props }: PlaceholderBlockProps): react_jsx_runtime.JSX.Element;
+declare function Audio({ width, height, ...props }: PlaceholderBlockProps): React$1.JSX.Element;
 
-declare function Button({ className, ...props }: PlaceholderBlockProps): react_jsx_runtime.JSX.Element;
+declare function Button({ className, ...props }: PlaceholderBlockProps): React$1.JSX.Element;
 
 interface PlaceholderImageProps extends PlaceholderBlockProps {
     width?: number | string;
     height?: number | string;
     className?: string | null;
 }
-declare function PlaceholderImage({ width, height, className, ...props }: PlaceholderImageProps): react_jsx_runtime.JSX.Element;
+declare function PlaceholderImage({ width, height, className, ...props }: PlaceholderImageProps): React$1.JSX.Element;
 
-declare function Line(props: any): react_jsx_runtime.JSX.Element;
+declare function Line(props: any): React__default.JSX.Element;
 
 interface MapPlaceholderProps extends PlaceholderBlockProps {
     withImages?: boolean;
 }
-declare function Map({ withImages, className, ...props }: MapPlaceholderProps): react_jsx_runtime.JSX.Element;
+declare function Map({ withImages, className, ...props }: MapPlaceholderProps): React$1.JSX.Element;
 
-declare function MapPath({ width, height, ...props }: PlaceholderBlockProps): react_jsx_runtime.JSX.Element;
+declare function MapPath({ width, height, ...props }: PlaceholderBlockProps): React$1.JSX.Element;
 
 interface PlaceholderTextProps {
     lines?: number;
@@ -528,23 +527,23 @@ interface PlaceholderTextProps {
     className?: string | null;
 }
 
-declare function Quote({ height, lines, ...props }: PlaceholderTextProps): react_jsx_runtime.JSX.Element;
+declare function Quote({ height, lines, ...props }: PlaceholderTextProps): React$1.JSX.Element;
 
-declare function ShortText({ height, lines, ...props }: PlaceholderTextProps): react_jsx_runtime.JSX.Element;
+declare function ShortText({ height, lines, ...props }: PlaceholderTextProps): React$1.JSX.Element;
 
-declare function Subtitle({ height, lines, ...props }: PlaceholderTextProps): react_jsx_runtime.JSX.Element;
+declare function Subtitle({ height, lines, ...props }: PlaceholderTextProps): React$1.JSX.Element;
 
-declare function TextPlaceholder({ height, lines, ...props }: PlaceholderTextProps): react_jsx_runtime.JSX.Element;
+declare function TextPlaceholder({ height, lines, ...props }: PlaceholderTextProps): React$1.JSX.Element;
 
-declare function Timeline(props: any): react_jsx_runtime.JSX.Element;
+declare function Timeline(props: any): React$1.JSX.Element;
 
-declare function Title({ height, lines, ...props }: PlaceholderTextProps): react_jsx_runtime.JSX.Element;
+declare function Title({ height, lines, ...props }: PlaceholderTextProps): React$1.JSX.Element;
 
-declare function Video({ width, height, ...props }: PlaceholderBlockProps): react_jsx_runtime.JSX.Element;
+declare function Video({ width, height, ...props }: PlaceholderBlockProps): React$1.JSX.Element;
 
-declare function Video360({ width, height, className, ...props }: PlaceholderBlockProps): react_jsx_runtime.JSX.Element;
+declare function Video360({ width, height, className, ...props }: PlaceholderBlockProps): React$1.JSX.Element;
 
-declare function VideoLoop({ width, height, ...props }: PlaceholderBlockProps): react_jsx_runtime.JSX.Element;
+declare function VideoLoop({ width, height, ...props }: PlaceholderBlockProps): React$1.JSX.Element;
 
 interface ScreenSizerProps {
     width?: number | null;
@@ -555,7 +554,7 @@ interface ScreenSizerProps {
     className?: string | null;
     children: ReactNode;
 }
-declare function ScreenSizer({ width, height, fit, screenWidth, screenHeight, className, children, }: ScreenSizerProps): react_jsx_runtime.JSX.Element;
+declare function ScreenSizer({ width, height, fit, screenWidth, screenHeight, className, children, }: ScreenSizerProps): React$1.JSX.Element;
 
 interface ScreenProps {
     screen: StoryComponent$1;
@@ -564,13 +563,14 @@ interface ScreenProps {
     index?: number | null;
     active?: boolean;
     preload?: boolean;
+    focusable?: boolean;
     current?: boolean;
     component?: React__default.ReactNode | null;
     components?: Record<string, ElementType> | null;
     className?: string | null;
     mediaRef?: ForwardedRef<MediaElement> | null;
 }
-declare function Screen({ screen, renderContext, screenState, index, active, current, preload, components, component, className, mediaRef, }: ScreenProps): react_jsx_runtime.JSX.Element;
+declare function Screen({ screen, renderContext, screenState, index, active, current, preload, focusable, components, component, className, mediaRef, }: ScreenProps): React__default.JSX.Element;
 
 interface ScreenPlaceholderProps {
     screen: Component;
@@ -581,7 +581,7 @@ interface ScreenPlaceholderProps {
     withSize?: boolean;
     className?: string | null;
 }
-declare function ScreenPlaceholder({ screen, layout, screenWidth, screenHeight, screenState, withSize, className, ...props }: ScreenPlaceholderProps): react_jsx_runtime.JSX.Element;
+declare function ScreenPlaceholder({ screen, layout, screenWidth, screenHeight, screenState, withSize, className, ...props }: ScreenPlaceholderProps): React__default.JSX.Element;
 
 interface ScreenPreviewProps {
     screen: Component;
@@ -594,7 +594,7 @@ interface ScreenPreviewProps {
     withSize?: boolean;
     hidden?: boolean;
 }
-declare function ScreenPreview({ screen, screenState, width, height, screenWidth, screenHeight, className, withSize, fit, hidden, ...props }: ScreenPreviewProps): react_jsx_runtime.JSX.Element;
+declare function ScreenPreview({ screen, screenState, width, height, screenWidth, screenHeight, className, withSize, fit, hidden, ...props }: ScreenPreviewProps): React__default.JSX.Element;
 
 interface ScreenElementProps {
     children?: React__default.ReactNode | null;
@@ -607,14 +607,14 @@ interface ScreenElementProps {
     emptyClassName?: string | null;
     placeholderClassName?: string | null;
 }
-declare function ScreenElement({ children, placeholder, empty, emptyLabel, preview, isEmpty, placeholderProps, emptyClassName, placeholderClassName, }: ScreenElementProps): string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null;
+declare function ScreenElement({ children, placeholder, empty, emptyLabel, preview, isEmpty, placeholderProps, emptyClassName, placeholderClassName, }: ScreenElementProps): string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | React__default.JSX.Element | null;
 
 interface ScreensProps {
     screens: StoryComponent[];
     screen?: string | null;
     className?: string | null;
 }
-declare function Screens({ screens, screen: screenId, className }: ScreensProps): react_jsx_runtime.JSX.Element;
+declare function Screens({ screens, screen: screenId, className }: ScreensProps): React__default.JSX.Element;
 
 interface TransitionsProps {
     fullscreen?: boolean;
@@ -625,7 +625,7 @@ interface TransitionsProps {
     disabled?: boolean;
     children?: React__default.ReactNode | null;
 }
-declare function Transitions$1({ fullscreen, playing, delay, transitions, onComplete, disabled, children, }: TransitionsProps): string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null;
+declare function Transitions$1({ fullscreen, playing, delay, transitions, onComplete, disabled, children, }: TransitionsProps): string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | React__default.JSX.Element | null;
 
 interface TransitionsStaggerProps {
     transitions?: Transitions | null;
@@ -636,21 +636,21 @@ interface TransitionsStaggerProps {
     fullscreen?: boolean;
     children?: React__default.ReactNode | null;
 }
-declare function TransitionsStagger({ transitions, stagger, playing, disabled, delay, fullscreen, children, }: TransitionsStaggerProps): (string | number | bigint | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element)[] | null | undefined;
+declare function TransitionsStagger({ transitions, stagger, playing, disabled, delay, fullscreen, children, }: TransitionsStaggerProps): (string | number | bigint | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | React__default.JSX.Element)[] | null | undefined;
 
 interface HighlightStyleProps {
     selector?: string | null;
     highlightSelector?: string;
     style?: Record<string, string | number> | null;
 }
-declare function HighlightStyle({ selector, highlightSelector, style, }: HighlightStyleProps): react_jsx_runtime.JSX.Element | null;
+declare function HighlightStyle({ selector, highlightSelector, style, }: HighlightStyleProps): React__default.JSX.Element | null;
 
 interface LinkStyleProps {
     selector?: string | null;
     linkSelector?: string;
     style?: Record<string, string | number> | null;
 }
-declare function LinkStyle({ selector, linkSelector, style }: LinkStyleProps): react_jsx_runtime.JSX.Element | null;
+declare function LinkStyle({ selector, linkSelector, style }: LinkStyleProps): React__default.JSX.Element | null;
 
 export { ArrowIcon, BackButton, Breadcrumb, Button$1 as Button, Buttons, Card, ClearButton, Close, CloseIcon, CollapsablePanel, Date, Detector, Dropdown as DropdownMenu, ElementComponent as Element, Empty, FieldForm, FontFaces, Form, FormPanel, FullscreenIcon, HighlightStyle, Label$1 as Label, Link, LinkIcon, LinkStyle, Media, Menu, Meta, MuteIcon, Navbar, PaginationMenu as Pagination, Panel, PanelPortal, _default as Panels, PauseIcon, AdFrame as PlaceholderAdFrame, AdImage as PlaceholderAdImage, Audio as PlaceholderAudio, Button as PlaceholderButton, PlaceholderImage, Line as PlaceholderLine, Map as PlaceholderMap, MapPath as PlaceholderMapPath, Quote as PlaceholderQuote, ShortText as PlaceholderShortText, Subtitle as PlaceholderSubtitle, TextPlaceholder as PlaceholderText, Timeline as PlaceholderTimeline, Title as PlaceholderTitle, Video as PlaceholderVideo, Video360 as PlaceholderVideo360, VideoLoop as PlaceholderVideoLoop, PlayIcon, Screen, ScreenElement, ScreenPlaceholder, ScreenPreview, ScreenSizer, Screens, Slideshow, Spinner, TabsMenu as Tabs, Transitions$1 as Transitions, TransitionsStagger, UnmuteIcon, UploadModal };
 export type { ButtonProps };

package/es/components.js

@@ -11,19 +11,19 @@ import { faAngleDown } from '@fortawesome/free-solid-svg-icons/faAngleDown';
 import { faAngleUp } from '@fortawesome/free-solid-svg-icons/faAngleUp';
 import React, { useState, useEffect, useCallback, useRef, createElement, Suspense, useMemo, cloneElement } from 'react';
 import dayjs from 'dayjs';
-import throttle from 'lodash/throttle';
+import throttle from 'lodash-es/throttle';
 import { useForm, useDocumentEvent, useIntersectionObserver, useDimensionObserver, useDevicePixelRatio } from '@micromag/core/hooks';
-import get from 'lodash/get';
+import get from 'lodash-es/get';
 import { useFieldsManager, useFieldComponent, FieldContextProvider, useFieldContext, withPanels, usePanels, ScreenSizeProvider, useScreenComponent, ScreenProvider, useScreenRenderContext, useScreenSize } from '@micromag/core/contexts';
-import isObject from 'lodash/isObject';
-import isArray from 'lodash/isArray';
-import isString from 'lodash/isString';
+import isObject from 'lodash-es/isObject';
+import isArray from 'lodash-es/isArray';
+import isString from 'lodash-es/isString';
 import queryString from 'query-string';
 import { createPortal } from 'react-dom';
 import { faAd } from '@fortawesome/free-solid-svg-icons/faAd';
 import { faImage } from '@fortawesome/free-solid-svg-icons/faImage';
 import { faMusic } from '@fortawesome/free-solid-svg-icons/faMusic';
-import isNumber from 'lodash/isNumber';
+import isNumber from 'lodash-es/isNumber';
 import { faMapMarkerAlt } from '@fortawesome/free-solid-svg-icons/faMapMarkerAlt';
 import { faMapMarkedAlt } from '@fortawesome/free-solid-svg-icons/faMapMarkedAlt';
 import { faVideo } from '@fortawesome/free-solid-svg-icons/faVideo';
@@ -5086,7 +5086,7 @@ function ScreenSizer(t0) {
 var styles$4 = {"container":"micromag-core-screens-screen-container"};
 
 function Screen(t0) {
-  const $ = c(20);
+  const $ = c(21);
   const {
     screen,
     renderContext: t1,
@@ -5095,10 +5095,11 @@ function Screen(t0) {
     active: t4,
     current: t5,
     preload: t6,
-    components: t7,
-    component: t8,
-    className: t9,
-    mediaRef: t10
+    focusable: t7,
+    components: t8,
+    component: t9,
+    className: t10,
+    mediaRef: t11
   } = t0;
   const renderContext = t1 === undefined ? null : t1;
   const screenState = t2 === undefined ? null : t2;
@@ -5106,38 +5107,41 @@ function Screen(t0) {
   const active = t4 === undefined ? true : t4;
   const current = t5 === undefined ? false : t5;
   const preload = t6 === undefined ? true : t6;
-  const components = t7 === undefined ? null : t7;
-  const component = t8 === undefined ? null : t8;
-  const className = t9 === undefined ? null : t9;
-  const mediaRef = t10 === undefined ? null : t10;
-  let t11;
+  const focusable = t7 === undefined ? true : t7;
+  const components = t8 === undefined ? null : t8;
+  const component = t9 === undefined ? null : t9;
+  const className = t10 === undefined ? null : t10;
+  const mediaRef = t11 === undefined ? null : t11;
+  let t12;
   if ($[0] !== screen) {
-    t11 = screen || {};
+    t12 = screen || {};
     $[0] = screen;
-    $[1] = t11;
+    $[1] = t12;
   } else {
-    t11 = $[1];
+    t12 = $[1];
   }
   const {
-    type: t12
-  } = t11;
-  const type = t12 === undefined ? null : t12;
-  let t13;
+    type: t13
+  } = t12;
+  const type = t13 === undefined ? null : t13;
+  let t14;
   if ($[2] !== components || $[3] !== type) {
-    t13 = components !== null ? getComponentFromName(type, components) || null : null;
+    t14 = components !== null ? getComponentFromName(type, components) || null : null;
     $[2] = components;
     $[3] = type;
-    $[4] = t13;
+    $[4] = t14;
   } else {
-    t13 = $[4];
+    t14 = $[4];
   }
-  const CustomScreenComponent = t13;
+  const CustomScreenComponent = t14;
   const ContextScreenComponent = useScreenComponent(type);
   const ScreenComponent = CustomScreenComponent || ContextScreenComponent;
-  let t14;
-  if ($[5] !== ScreenComponent || $[6] !== active || $[7] !== className || $[8] !== component || $[9] !== current || $[10] !== index || $[11] !== mediaRef || $[12] !== preload || $[13] !== screen) {
-    t14 = ScreenComponent !== null ? /*#__PURE__*/jsx("div", {
+  let t15;
+  if ($[5] !== ScreenComponent || $[6] !== active || $[7] !== className || $[8] !== component || $[9] !== current || $[10] !== focusable || $[11] !== index || $[12] !== mediaRef || $[13] !== preload || $[14] !== screen) {
+    t15 = ScreenComponent !== null ? /*#__PURE__*/jsx("div", {
       className: classNames([styles$4.container, className]),
+      tabIndex: focusable ? 0 : -1,
+      "aria-hidden": current || active ? "false" : "true",
       children: /*#__PURE__*/jsx(ScreenComponent, {
         ...screen,
         index: index,
@@ -5148,6 +5152,7 @@ function Screen(t0) {
       })
     }) : /*#__PURE__*/jsx("div", {
       className: className,
+      tabIndex: focusable ? 0 : -1,
       children: component
     });
     $[5] = ScreenComponent;
@@ -5155,31 +5160,32 @@ function Screen(t0) {
     $[7] = className;
     $[8] = component;
     $[9] = current;
-    $[10] = index;
-    $[11] = mediaRef;
-    $[12] = preload;
-    $[13] = screen;
-    $[14] = t14;
+    $[10] = focusable;
+    $[11] = index;
+    $[12] = mediaRef;
+    $[13] = preload;
+    $[14] = screen;
+    $[15] = t15;
   } else {
-    t14 = $[14];
+    t15 = $[15];
   }
-  let t15;
-  if ($[15] !== renderContext || $[16] !== screen || $[17] !== screenState || $[18] !== t14) {
-    t15 = /*#__PURE__*/jsx(ScreenProvider, {
+  let t16;
+  if ($[16] !== renderContext || $[17] !== screen || $[18] !== screenState || $[19] !== t15) {
+    t16 = /*#__PURE__*/jsx(ScreenProvider, {
       data: screen,
       renderContext: renderContext,
       screenState: screenState,
-      children: t14
+      children: t15
     });
-    $[15] = renderContext;
-    $[16] = screen;
-    $[17] = screenState;
-    $[18] = t14;
+    $[16] = renderContext;
+    $[17] = screen;
+    $[18] = screenState;
     $[19] = t15;
+    $[20] = t16;
   } else {
-    t15 = $[19];
+    t16 = $[20];
   }
-  return t15;
+  return t16;
 }
 
 var styles$3 = {"screen":"micromag-core-screens-screen-placeholder-screen"};