@micromag/core 0.4.100 → 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

@@ -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"};

package/es/contexts.d.ts

@@ -1,4 +1,3 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import React__default, { ReactNode, ElementType, ComponentType } from 'react';
 import EventEmitter from 'wolfy87-eventemitter';
@@ -293,7 +292,7 @@ interface ComponentsProviderProps {
     manager?: ComponentsManager | null;
     components?: Record<string, Record<string, ElementType>> | Record<string, ElementType>;
 }
-declare function ComponentsProvider({ components, manager, namespace, children, }: ComponentsProviderProps): react_jsx_runtime.JSX.Element;
+declare function ComponentsProvider({ components, manager, namespace, children, }: ComponentsProviderProps): React__default.JSX.Element;
 
 declare const ConsentContext: React__default.Context<{
     consent: null;
@@ -310,7 +309,7 @@ interface ConsentProviderProps {
     expiration?: number;
     children?: React__default.ReactNode | null;
 }
-declare function ConsentProvider({ consent: providedConsent, consented: initialConsented, expiration, children, }: ConsentProviderProps): react_jsx_runtime.JSX.Element;
+declare function ConsentProvider({ consent: providedConsent, consented: initialConsented, expiration, children, }: ConsentProviderProps): React__default.JSX.Element;
 
 declare const EditorContext: React__default.Context<null>;
 declare const useEditor: () => null;
@@ -318,7 +317,7 @@ declare const useGetColors: () => () => never[];
 interface EditorProviderProps {
     children: React__default.ReactNode;
 }
-declare function EditorProvider({ children }: EditorProviderProps): react_jsx_runtime.JSX.Element;
+declare function EditorProvider({ children }: EditorProviderProps): React__default.JSX.Element;
 
 declare const FieldsContext: React.Context<FieldsManager | null>;
 declare const useFieldsManager: () => FieldsManager | null;
@@ -328,7 +327,7 @@ interface FieldsProviderProps {
     manager?: FieldsManager | null;
     children: ReactNode;
 }
-declare function FieldsProvider({ fields, manager, children }: FieldsProviderProps): react_jsx_runtime.JSX.Element;
+declare function FieldsProvider({ fields, manager, children }: FieldsProviderProps): React.JSX.Element;
 
 declare const FieldsValueContext: React__default.Context<null>;
 declare const useFieldsValue: () => null;
@@ -336,7 +335,7 @@ interface FieldsValueContextProviderProps {
     value?: unknown;
     children: React__default.ReactNode;
 }
-declare function FieldsValueContextProvider({ value, children }: FieldsValueContextProviderProps): react_jsx_runtime.JSX.Element;
+declare function FieldsValueContextProvider({ value, children }: FieldsValueContextProviderProps): React__default.JSX.Element;
 
 declare const FieldContext: React__default.Context<null>;
 declare const useFieldContext: () => null;
@@ -344,36 +343,37 @@ interface FieldContextProviderProps {
     context?: unknown;
     children: React__default.ReactNode;
 }
-declare function FieldContextProvider({ context, children }: FieldContextProviderProps): react_jsx_runtime.JSX.Element;
+declare function FieldContextProvider({ context, children }: FieldContextProviderProps): React__default.JSX.Element;
 
-declare const FontsContext: React__default.Context<{
+declare const FontsContext: React.Context<{
     systemFonts: null;
     googleFonts: null;
     customFonts: null;
+    loadGoogleFonts: null;
 }>;
 declare const useGoogleFonts: (options?: null) => null;
-declare const useFonts: (options?: null) => {
+declare const useFonts: () => {
     systemFonts: null;
     googleFonts: null;
     customFonts: null;
 };
 interface FontsProviderProps {
-    children: React__default.ReactNode;
+    children: ReactNode;
     systemFonts?: Font[];
     customFonts?: Font[];
 }
-declare function FontsProvider({ systemFonts, customFonts, children, }: FontsProviderProps): react_jsx_runtime.JSX.Element;
+declare function FontsProvider({ systemFonts, customFonts, children, }: FontsProviderProps): React.JSX.Element;
 
 declare const GoogleApiClientContext: React__default.Context<null>;
 declare const useGoogleApiClient: () => null;
 declare const withGoogleApiClient: (WrappedComponent: any) => {
-    (props: any): react_jsx_runtime.JSX.Element;
+    (props: any): React__default.JSX.Element;
     displayName: string;
 };
 interface GoogleApiClientProviderProps {
     children: React__default.ReactNode;
 }
-declare function GoogleApiClientProvider({ children }: GoogleApiClientProviderProps): react_jsx_runtime.JSX.Element;
+declare function GoogleApiClientProvider({ children }: GoogleApiClientProviderProps): React__default.JSX.Element;
 
 declare const GoogleKeysContext: React.Context<{
     apiKey: null;
@@ -385,12 +385,12 @@ interface GoogleKeysProviderProps {
     children: ReactNode;
     apiKey?: string | null;
 }
-declare function GoogleKeysProvider({ children, apiKey }: GoogleKeysProviderProps): react_jsx_runtime.JSX.Element;
+declare function GoogleKeysProvider({ children, apiKey }: GoogleKeysProviderProps): React.JSX.Element;
 
 declare const GoogleMapsClientContext: React__default.Context<null>;
 declare const useGoogleMapsClient: () => null;
 declare const withGoogleMapsClient: (WrappedComponent: any) => {
-    (props: any): react_jsx_runtime.JSX.Element;
+    (props: any): React__default.JSX.Element;
     displayName: string;
 };
 interface GoogleMapsClientProviderProps {
@@ -398,7 +398,7 @@ interface GoogleMapsClientProviderProps {
     locale?: string;
     libraries?: string[];
 }
-declare function GoogleMapsClientProvider({ children, locale, libraries }: GoogleMapsClientProviderProps): react_jsx_runtime.JSX.Element;
+declare function GoogleMapsClientProvider({ children, locale, libraries }: GoogleMapsClientProviderProps): React__default.JSX.Element;
 
 declare const PanelsContext: React__default.Context<{
     container: null;
@@ -407,14 +407,14 @@ declare const usePanels: () => {
     container: null;
 };
 declare const withPanels: (WrappedComponent: any) => {
-    (props: any): react_jsx_runtime.JSX.Element;
+    (props: any): React__default.JSX.Element;
     displayName: string;
 };
 interface PanelsProviderProps {
     children: React__default.ReactNode;
     container?: Record<string, unknown>;
 }
-declare function PanelsProvider({ children, container: initialContainer }: PanelsProviderProps): react_jsx_runtime.JSX.Element;
+declare function PanelsProvider({ children, container: initialContainer }: PanelsProviderProps): React__default.JSX.Element;
 
 interface PlaybackControlsTheme {
     seekBarOnly?: boolean;
@@ -468,7 +468,7 @@ interface PlaybackProviderProps {
     paused?: boolean;
     currentQualityLevel?: number | null;
 }
-declare function PlaybackProvider({ muted: initialMuted, playing: initialPlaying, paused, controls: initialControls, controlsSuggestPlay: initialControlsSuggestPlay, controlsVisible: initialControlsVisible, controlsTheme: initialControlsTheme, currentQualityLevel: initialCurrentQualityLevel, children, }: PlaybackProviderProps): react_jsx_runtime.JSX.Element;
+declare function PlaybackProvider({ muted: initialMuted, playing: initialPlaying, paused, controls: initialControls, controlsSuggestPlay: initialControlsSuggestPlay, controlsVisible: initialControlsVisible, controlsTheme: initialControlsTheme, currentQualityLevel: initialCurrentQualityLevel, children, }: PlaybackProviderProps): React.JSX.Element;
 
 declare const useRoutePush: () => (route: any, data: any, ...args: any[]) => void;
 declare const useRouteBack: () => () => void;
@@ -480,7 +480,7 @@ interface SettingsProviderProps {
     children: React__default.ReactNode;
     settings?: Record<string, unknown>;
 }
-declare function SettingsProvider({ children, settings }: SettingsProviderProps): react_jsx_runtime.JSX.Element;
+declare function SettingsProvider({ children, settings }: SettingsProviderProps): React__default.JSX.Element;
 
 declare const ScreenContext: React__default.Context<{
     data: null;
@@ -511,7 +511,7 @@ interface ScreenProviderProps {
     renderContext?: RenderContext;
     screenState?: string;
 }
-declare function ScreenProvider({ data, definition, renderContext, screenState, children, }: ScreenProviderProps): react_jsx_runtime.JSX.Element;
+declare function ScreenProvider({ data, definition, renderContext, screenState, children, }: ScreenProviderProps): React__default.JSX.Element;
 
 declare const ScreensContext: React.Context<null>;
 declare const useScreensManager: () => null;
@@ -522,7 +522,7 @@ interface ScreensProviderProps {
     manager?: ScreensManager | null;
     children: ReactNode;
 }
-declare function ScreensProvider({ screens, namespaces, filterNamespaces, manager, children, }: ScreensProviderProps): react_jsx_runtime.JSX.Element;
+declare function ScreensProvider({ screens, namespaces, filterNamespaces, manager, children, }: ScreensProviderProps): React.JSX.Element;
 
 declare const ScreenSizeContext: React__default.Context<{
     screen: null;
@@ -544,7 +544,7 @@ interface ScreenSizeProviderProps {
     children: React__default.ReactNode;
     size?: ScreenSize;
 }
-declare function ScreenSizeProvider({ size, children }: ScreenSizeProviderProps): react_jsx_runtime.JSX.Element;
+declare function ScreenSizeProvider({ size, children }: ScreenSizeProviderProps): React__default.JSX.Element;
 
 declare const StoryContext: React__default.Context<Story | null>;
 declare const useStoryContext: () => Story | null;
@@ -553,10 +553,10 @@ interface StoryProviderProps {
     story?: Story | null;
     children: ReactNode;
 }
-declare function StoryProvider({ story, children }: StoryProviderProps): react_jsx_runtime.JSX.Element;
+declare function StoryProvider({ story, children }: StoryProviderProps): React__default.JSX.Element;
 
 declare const useTracking: () => _folklore_tracking.Tracking;
-declare function TrackingProvider(options?: null): react_jsx_runtime.JSX.Element;
+declare function TrackingProvider(options?: null): React__default.JSX.Element;
 
 interface ViewerContextType {
     events: EventEmitter;
@@ -620,7 +620,7 @@ interface ViewerProviderProps {
     disableInteraction?: (...args: unknown[]) => void;
     enableInteraction?: (...args: unknown[]) => void;
 }
-declare function ViewerProvider({ children, events, menuVisible, menuOverScreen, activityDetected, width, height, topHeight, bottomHeight, bottomSidesWidth, gotoNextScreen, gotoPreviousScreen, disableInteraction, enableInteraction, }: ViewerProviderProps): react_jsx_runtime.JSX.Element;
+declare function ViewerProvider({ children, events, menuVisible, menuOverScreen, activityDetected, width, height, topHeight, bottomHeight, bottomSidesWidth, gotoNextScreen, gotoPreviousScreen, disableInteraction, enableInteraction, }: ViewerProviderProps): React.JSX.Element;
 
 type VisitorContextType = {
     visitor: Visitor | null;
@@ -637,7 +637,7 @@ interface VisitorProviderProps {
     children: React__default.ReactNode;
     visitor?: Visitor | string | null;
 }
-declare function VisitorProvider({ visitor: providedVisitor, children, }: VisitorProviderProps): react_jsx_runtime.JSX.Element;
+declare function VisitorProvider({ visitor: providedVisitor, children, }: VisitorProviderProps): React__default.JSX.Element;
 
 export { ComponentsContext, ComponentsProvider, ConsentContext, ConsentProvider, ELEMENTS_NAMESPACE, EditorContext, EditorProvider, FIELDS_NAMESPACE, FORMS_NAMESPACE, FieldContext, FieldContextProvider, FieldsContext, FieldsProvider, FieldsValueContext, FieldsValueContextProvider, FontsContext, FontsProvider, GoogleApiClientContext, GoogleApiClientProvider, GoogleKeysContext, GoogleKeysProvider, GoogleMapsClientContext, GoogleMapsClientProvider, MODALS_NAMESPACE, PanelsContext, PanelsProvider, PlaybackContext, PlaybackProvider, SCREENS_NAMESPACE, ScreenContext, ScreenProvider, ScreenSizeContext, ScreenSizeProvider, ScreensContext, ScreensProvider, SettingsContext, SettingsProvider, StoryContext, StoryProvider, TrackingProvider, ViewerContext, ViewerProvider, VisitorContext, VisitorProvider, useComponent, useComponents, useComponentsManager, useConsent, useEditor, useElementComponent, useElementsComponents, useElementsComponentsManager, useFieldComponent, useFieldContext, useFieldDefinition, useFieldsComponents, useFieldsComponentsManager, useFieldsManager, useFieldsValue, useFonts, useFormComponent, useFormsComponents, useFormsComponentsManager, useGetColors, useGoogleApiClient, useGoogleFonts, useGoogleKeys, useGoogleMapsClient, useModalComponent, useModalsComponents, useModalsComponentsManager, usePanels, usePlaybackContext, usePlaybackMediaRef, useRouteBack, useRoutePush, useScreen, useScreenComponent, useScreenData, useScreenDefinition, useScreenRenderContext, useScreenSize, useScreenState, useScreensComponents, useScreensComponentsManager, useScreensManager, useSetVisitor, useSetting, useSettings, useStory, useStoryContext, useTracking, useViewerActivityDetected, useViewerContext, useViewerEvents, useViewerInteraction, useViewerNavigation, useViewerSize, useViewerWebView, useVisitor, useVisitorContext, withGoogleApiClient, withGoogleMapsClient, withPanels };
 export type { ScreensProviderProps };

package/es/contexts.js

@@ -7,7 +7,6 @@ import JSCookie from 'js-cookie';
 import { defineMessages, useIntl } from 'react-intl';
 import uniqBy from 'lodash-es/uniqBy';
 import { getJSON } from '@folklore/fetch';
-import isObject from 'lodash-es/isObject';
 import { loadGoogleApi, loadGoogleMaps } from '@folklore/services';
 export { ModalContext, ModalProvider as ModalsProvider } from '@panneau/core/contexts';
 import { getDisplayName, getMediaSrc, getMediaHasAudio, getMediaFilename, getMediaDuration, getScreenExtraField } from '@micromag/core/utils';
@@ -890,10 +889,11 @@ function GoogleKeysProvider(t0) {
   return t4;
 }
 
-const FontsContext = /*#__PURE__*/React.createContext({
+const FontsContext = /*#__PURE__*/createContext({
   systemFonts: null,
   googleFonts: null,
-  customFonts: null
+  customFonts: null,
+  loadGoogleFonts: null
 });
 const useGoogleFonts = t0 => {
   const $ = c(7);
@@ -908,25 +908,28 @@ const useGoogleFonts = t0 => {
   }
   const {
     disabled: t2,
-    setFonts: t3
+    setFonts: t3,
+    apiKey: t4
   } = t1;
   const disabled = t2 === undefined ? false : t2;
   const setFonts = t3 === undefined ? null : t3;
+  const optionsApiKey = t4 === undefined ? null : t4;
   const {
-    apiKey
+    apiKey: contextApiKey
   } = useGoogleKeys();
+  const apiKey = optionsApiKey || contextApiKey;
   const [googleFonts, setGoogleFonts] = useState(null);
-  let t4;
   let t5;
+  let t6;
   if ($[2] !== apiKey || $[3] !== disabled || $[4] !== setFonts) {
-    t4 = () => {
+    t5 = () => {
       let canceled = false;
       if (apiKey !== null && !disabled) {
-        getJSON(`https://www.googleapis.com/webfonts/v1/webfonts?key=${apiKey}&sort=popularity`).then(t6 => {
+        getJSON(`https://www.googleapis.com/webfonts/v1/webfonts?key=${apiKey}&sort=popularity`).then(t7 => {
           const {
-            items: t7
-          } = t6;
-          const items = t7 === undefined ? [] : t7;
+            items: t8
+          } = t7;
+          const items = t8 === undefined ? [] : t8;
           if (!canceled) {
             const newFonts = items.map(_temp$1);
             if (setFonts !== null) {
@@ -941,74 +944,63 @@ const useGoogleFonts = t0 => {
         canceled = true;
       };
     };
-    t5 = [apiKey, disabled, setFonts, setGoogleFonts];
+    t6 = [apiKey, disabled, setFonts, setGoogleFonts];
     $[2] = apiKey;
     $[3] = disabled;
     $[4] = setFonts;
-    $[5] = t4;
-    $[6] = t5;
+    $[5] = t5;
+    $[6] = t6;
   } else {
-    t4 = $[5];
-    t5 = $[6];
+    t5 = $[5];
+    t6 = $[6];
   }
-  useEffect(t4, t5);
+  useEffect(t5, t6);
   return googleFonts;
 };
-const useFonts = t0 => {
-  const $ = c(9);
-  const options = t0 === undefined ? null : t0;
-  let t1;
-  if ($[0] !== options) {
-    t1 = options || {};
-    $[0] = options;
-    $[1] = t1;
-  } else {
-    t1 = $[1];
-  }
-  const {
-    withoutGoogleFonts: t2
-  } = t1;
-  const withoutGoogleFonts = t2 === undefined ? false : t2;
+const useFonts = () => {
+  const $ = c(7);
   const {
-    setGoogleFonts: t3,
-    systemFonts: t4,
-    googleFonts: t5,
-    customFonts: t6
-  } = useContext(FontsContext);
-  const setGoogleFonts = t3 === undefined ? null : t3;
-  const systemFonts = t4 === undefined ? null : t4;
-  const googleFonts = t5 === undefined ? null : t5;
-  const customFonts = t6 === undefined ? null : t6;
-  const t7 = withoutGoogleFonts || googleFonts !== null && googleFonts.length > 0;
-  let t8;
-  if ($[2] !== setGoogleFonts || $[3] !== t7) {
-    t8 = {
-      disabled: t7,
-      setFonts: setGoogleFonts
+    systemFonts: t0,
+    googleFonts: t1,
+    customFonts: t2,
+    loadGoogleFonts: t3
+  } = use(FontsContext);
+  const systemFonts = t0 === undefined ? null : t0;
+  const googleFonts = t1 === undefined ? null : t1;
+  const customFonts = t2 === undefined ? null : t2;
+  const loadGoogleFonts = t3 === undefined ? null : t3;
+  let t4;
+  let t5;
+  if ($[0] !== loadGoogleFonts) {
+    t4 = () => {
+      if (loadGoogleFonts !== null) {
+        loadGoogleFonts();
+      }
     };
-    $[2] = setGoogleFonts;
-    $[3] = t7;
-    $[4] = t8;
+    t5 = [loadGoogleFonts];
+    $[0] = loadGoogleFonts;
+    $[1] = t4;
+    $[2] = t5;
   } else {
-    t8 = $[4];
+    t4 = $[1];
+    t5 = $[2];
   }
-  useGoogleFonts(t8);
-  let t9;
-  if ($[5] !== customFonts || $[6] !== googleFonts || $[7] !== systemFonts) {
-    t9 = {
+  useEffect(t4, t5);
+  let t6;
+  if ($[3] !== customFonts || $[4] !== googleFonts || $[5] !== systemFonts) {
+    t6 = {
       systemFonts,
       googleFonts,
       customFonts
     };
-    $[5] = customFonts;
-    $[6] = googleFonts;
-    $[7] = systemFonts;
-    $[8] = t9;
+    $[3] = customFonts;
+    $[4] = googleFonts;
+    $[5] = systemFonts;
+    $[6] = t6;
   } else {
-    t9 = $[8];
+    t6 = $[6];
   }
-  const fonts = t9;
-  return fonts;
+  return t6;
 };
 function FontsProvider(t0) {
   const $ = c(18);
@@ -1017,89 +1009,100 @@ function FontsProvider(t0) {
     customFonts: t2,
     children
   } = t0;
-  let t3;
-  if ($[0] !== t1) {
-    t3 = t1 === undefined ? ["Arial", "Courier New", "Georgia", "Times New Roman", "Verdana"] : t1;
-    $[0] = t1;
-    $[1] = t3;
-  } else {
-    t3 = $[1];
-  }
-  const systemFonts = t3;
+  const systemFonts = t1 === undefined ? ["Arial", "Courier New", "Georgia", "Times New Roman", "Verdana"] : t1;
   const customFonts = t2 === undefined ? null : t2;
   const {
-    systemFonts: t4,
-    googleFonts: t5,
-    customFonts: previousCustomFonts
-  } = useFonts();
-  const previousSystemFonts = t4 === undefined ? null : t4;
-  const previousGoogleFonts = t5 === undefined ? null : t5;
-  const [googleFonts, setGoogleFonts] = useState(null);
-  let t6;
-  if ($[2] !== previousSystemFonts || $[3] !== systemFonts) {
-    t6 = uniqBy([...(previousSystemFonts || []), ...(systemFonts || [])], _temp2$1);
-    $[2] = previousSystemFonts;
-    $[3] = systemFonts;
-    $[4] = t6;
-  } else {
-    t6 = $[4];
-  }
+    systemFonts: t3,
+    googleFonts: t4,
+    customFonts: previousCustomFonts,
+    loadGoogleFonts: t5
+  } = use(FontsContext);
+  const previousSystemFonts = t3 === undefined ? null : t3;
+  const previousGoogleFonts = t4 === undefined ? null : t4;
+  const previousLoadGoogleFonts = t5 === undefined ? null : t5;
+  const [shouldLoadGoogleFonts, setShouldLoadGoogleFonts] = useState(false);
+  const t6 = previousGoogleFonts !== null && previousGoogleFonts.length > 0 || !shouldLoadGoogleFonts;
   let t7;
-  if ($[5] !== googleFonts || $[6] !== previousGoogleFonts) {
-    t7 = uniqBy([...(previousGoogleFonts || []), ...(googleFonts || [])], _temp3$1);
-    $[5] = googleFonts;
-    $[6] = previousGoogleFonts;
-    $[7] = t7;
+  if ($[0] !== t6) {
+    t7 = {
+      disabled: t6
+    };
+    $[0] = t6;
+    $[1] = t7;
   } else {
-    t7 = $[7];
+    t7 = $[1];
   }
+  const googleFonts = useGoogleFonts(t7);
   let t8;
-  if ($[8] !== customFonts || $[9] !== previousCustomFonts) {
-    t8 = uniqBy([...(previousCustomFonts || []), ...(customFonts || [])], _temp4$1);
-    $[8] = customFonts;
-    $[9] = previousCustomFonts;
-    $[10] = t8;
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+    t8 = () => {
+      setShouldLoadGoogleFonts(true);
+    };
+    $[2] = t8;
   } else {
-    t8 = $[10];
+    t8 = $[2];
   }
-  let t9;
-  if ($[11] !== t6 || $[12] !== t7 || $[13] !== t8) {
-    t9 = {
-      systemFonts: t6,
-      googleFonts: t7,
-      customFonts: t8,
-      setGoogleFonts
+  const loadGoogleFonts = t8;
+  const T0 = FontsContext;
+  const t9 = uniqBy([...(previousSystemFonts || []), ...(systemFonts || [])], _temp2$1);
+  let t10;
+  if ($[3] !== googleFonts || $[4] !== previousGoogleFonts) {
+    t10 = uniqBy([...(previousGoogleFonts || []), ...(googleFonts || [])], _temp3$1);
+    $[3] = googleFonts;
+    $[4] = previousGoogleFonts;
+    $[5] = t10;
+  } else {
+    t10 = $[5];
+  }
+  let t11;
+  if ($[6] !== customFonts || $[7] !== previousCustomFonts) {
+    t11 = uniqBy([...(previousCustomFonts || []), ...(customFonts || [])], _temp4$1);
+    $[6] = customFonts;
+    $[7] = previousCustomFonts;
+    $[8] = t11;
+  } else {
+    t11 = $[8];
+  }
+  const t12 = previousLoadGoogleFonts || loadGoogleFonts;
+  let t13;
+  if ($[9] !== t10 || $[10] !== t11 || $[11] !== t12 || $[12] !== t9) {
+    t13 = {
+      systemFonts: t9,
+      googleFonts: t10,
+      customFonts: t11,
+      loadGoogleFonts: t12
     };
-    $[11] = t6;
-    $[12] = t7;
-    $[13] = t8;
-    $[14] = t9;
+    $[9] = t10;
+    $[10] = t11;
+    $[11] = t12;
+    $[12] = t9;
+    $[13] = t13;
   } else {
-    t9 = $[14];
+    t13 = $[13];
   }
-  const fonts = t9;
-  let t10;
-  if ($[15] !== children || $[16] !== fonts) {
-    t10 = /*#__PURE__*/jsx(FontsContext.Provider, {
-      value: fonts,
+  let t14;
+  if ($[14] !== T0 || $[15] !== children || $[16] !== t13) {
+    t14 = /*#__PURE__*/jsx(T0, {
+      value: t13,
       children: children
     });
+    $[14] = T0;
     $[15] = children;
-    $[16] = fonts;
-    $[17] = t10;
+    $[16] = t13;
+    $[17] = t14;
   } else {
-    t10 = $[17];
+    t14 = $[17];
   }
-  return t10;
+  return t14;
 }
 function _temp4$1(font_1) {
-  return isObject(font_1) ? font_1.name : font_1;
+  return isString(font_1) ? font_1 : font_1.name;
 }
 function _temp3$1(font_0) {
-  return isObject(font_0) ? font_0.name : font_0;
+  return isString(font_0) ? font_0 : font_0.name;
 }
 function _temp2$1(font) {
-  return isObject(font) ? font.name : font;
+  return isString(font) ? font : font.name;
 }
 function _temp$1(it) {
   return {

package/es/hooks.d.ts

@@ -186,7 +186,7 @@ declare class MediasParser {
     static replaceMediasWithPaths(data: any, patterns: any, medias?: null, keyPrefix?: null): any;
     static getMediaPatternsFromData(obj: any): RegExp[];
     static dot(obj: any): any;
-    static keys(obj: any): any[];
+    static keys(obj: any): string[] | number[];
 }
 
 declare const useMediasParser: () => {

package/es/index.d.ts

@@ -557,7 +557,7 @@ declare class MediasParser {
     static replaceMediasWithPaths(data: any, patterns: any, medias?: null, keyPrefix?: null): any;
     static getMediaPatternsFromData(obj: any): RegExp[];
     static dot(obj: any): any;
-    static keys(obj: any): any[];
+    static keys(obj: any): string[] | number[];
 }
 
 type ScreensFieldsPattern = {

package/es/index.js

@@ -5,7 +5,6 @@ import sortBy from 'lodash-es/sortBy';
 import EventEmitter from 'wolfy87-eventemitter';
 import { pascalCase } from 'change-case';
 import uniqBy from 'lodash-es/uniqBy';
-import uniq from 'lodash-es/uniq';
 import isString from 'lodash-es/isString';
 import isEmpty from 'lodash-es/isEmpty';
 import { Tracking as Tracking$1 } from '@folklore/tracking';
@@ -663,7 +662,7 @@ class FontsParser {
       theme = null,
       components = []
     } = story || {};
-    const fonts = uniq(components.reduce((currentFonts, screen) => {
+    const fonts = uniqBy(components.reduce((currentFonts, screen) => {
       const {
         type
       } = screen;
@@ -681,7 +680,7 @@ class FontsParser {
       return fonts.length > 0 || themeFonts.length > 0 ? {
         ...story,
         theme: newTheme,
-        fonts: uniq([...themeFonts, ...fonts], 'name')
+        fonts: uniqBy([...themeFonts, ...fonts], 'name')
       } : story;
     }
     return fonts.length > 0 ? {

package/es/utils.d.ts

@@ -220,7 +220,7 @@ declare const largestRemainderRound: (numbers: any, desiredTotal: any) => any;
 
 declare const getLayersFromBackground: (background?: null) => never[];
 
-declare const getMediaFilesAsArray: (files: any) => any;
+declare const getMediaFilesAsArray: (files: any) => string | any[];
 
 declare function getMediaThumbnail(media: any, thumbnail?: MediaFile | ImageMedia | string): {
     metadata?: {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/core",
-    "version": "0.4.100",
+    "version": "0.4.109",
     "private": false,
     "description": "",
     "keywords": [
@@ -161,5 +161,5 @@
         "access": "public",
         "registry": "https://registry.npmjs.org/"
     },
-    "gitHead": "724328f428f29f4950850cf34adb68ef5f46669a"
+    "gitHead": "0eb452de33304b91642b48c12088758a8f0573a5"
 }