@commercelayer/app-elements 5.6.0 → 5.7.0

package/dist/ui/atoms/Hr.d.ts

@@ -1,9 +1,9 @@
-export type HrProps = Omit<React.HTMLProps<HTMLHRElement>, 'children'> & {
+export type HrProps = Omit<React.HTMLProps<HTMLHRElement>, "children"> & {
     /**
      * The variant of the horizontal rule.
      * @default solid
      */
-    variant?: 'solid' | 'dashed';
+    variant?: "solid" | "dashed";
 };
 /**
  * This component wraps an [`<hr>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/hr) HTML element.

package/dist/ui/atoms/Icon/Icon.d.ts

@@ -1,7 +1,7 @@
 import { ComponentPropsWithRef } from 'react';
 import { iconMapping } from './icons';
-type IconWeight = 'regular' | 'bold' | 'light' | 'fill';
-export interface IconProps extends ComponentPropsWithRef<'svg'> {
+type IconWeight = "regular" | "bold" | "light" | "fill";
+export interface IconProps extends ComponentPropsWithRef<"svg"> {
     /**
      * Name of the icon to display
      */

package/dist/ui/atoms/Icon/icons.d.ts

@@ -1,4 +1,4 @@
-import * as phosphor from '@phosphor-icons/react';
+import * as phosphor from "@phosphor-icons/react";
 export declare const iconMapping: {
     readonly airplaneTakeoff: phosphor.Icon;
     readonly appWindow: phosphor.Icon;

package/dist/ui/atoms/PageHeading/PageHeading.d.ts

@@ -13,14 +13,14 @@ export interface PageHeadingProps {
     /**
      * If `true` removes element vertical paddings
      */
-    gap?: 'none' | 'only-top' | 'only-bottom' | 'both';
+    gap?: "none" | "only-top" | "only-bottom" | "both";
     /**
      * When set, it will render a badge (default as warning variant)
      */
     badge?: {
         label: string;
         /**  @default warning-solid  */
-        variant?: BadgeProps['variant'];
+        variant?: BadgeProps["variant"];
     };
     /**
      * When set, it will render a navigation (eg: go back) button on the left side of the first row
@@ -32,7 +32,7 @@ export interface PageHeadingProps {
          * Button icon
          * @default arrowLeft
          */
-        icon?: 'x' | 'arrowLeft';
+        icon?: "x" | "arrowLeft";
     };
     /**
      * When set, it will render a proper toolbar on the right side of the first row

package/dist/ui/atoms/PageHeading/PageHeadingToolbar.d.ts

@@ -1,6 +1,6 @@
-import { ToolbarItem } from '../../composite/Toolbar';
 import { DropdownItemProps } from '../../composite/Dropdown/DropdownItem';
-type ToolbarButton = Omit<ToolbarItem, 'dropdownItems'>;
+import { ToolbarItem } from '../../composite/Toolbar';
+type ToolbarButton = Omit<ToolbarItem, "dropdownItems">;
 export interface PageHeadingToolbarProps {
     /**
      * Toolbar first level `Button`s.

package/dist/ui/atoms/Progress.d.ts

@@ -18,7 +18,7 @@ export interface ProgressProps extends React.ProgressHTMLAttributes<HTMLProgress
      * - `percentage` - Display the completion status as a percentage
      * - `none` - Do not display the completion
      */
-    displayMode?: 'fraction' | 'percentage' | 'none';
+    displayMode?: "fraction" | "percentage" | "none";
     children: React.ReactNode;
 }
 /**

package/dist/ui/atoms/RadialProgress.d.ts

@@ -11,11 +11,11 @@ export interface RadialProgressProps extends SVGAttributes<SVGElement> {
      * When missing, default size is 42px, small is 24px
      * @default 'large'
      */
-    size?: 'small' | 'large';
+    size?: "small" | "large";
     /**
      * Optional icon to be rendered in the center of the circle
      */
-    icon?: StatusIconProps['name'];
+    icon?: StatusIconProps["name"];
 }
 /**
  * Used to render a radial progress with a pending and a progress state. It also accepts an optional icon to be rendered in the center of the circle.

package/dist/ui/atoms/Section.d.ts

@@ -8,9 +8,9 @@ export interface SectionProps {
      */
     title?: ReactNode;
     /** Size for the title prop. */
-    titleSize?: 'normal' | 'small';
+    titleSize?: "normal" | "small";
     /** Specify `none` to remove border. */
-    border?: 'none';
+    border?: "none";
     /** This will render a button on the right side of the row. */
     actionButton?: ReactNode;
     /** CSS classes. */

package/dist/ui/atoms/Skeleton.d.ts

@@ -23,7 +23,7 @@ export interface SkeletonItemProps {
     /**
      * Can be `box` (default) to render a rectangular shape or `circle`
      */
-    type?: 'box' | 'circle';
+    type?: "box" | "circle";
     /**
      * CSS dimension for width. It can be number if expressed in pixels or string.
      * Example: `16`, `1rem` or '100%'.

package/dist/ui/atoms/Spacer.d.ts

@@ -1,4 +1,4 @@
-import { JSX, ReactNode } from 'react';
+import { ReactNode } from 'react';
 export interface SpacerProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Value to be applied as `margin-top`
@@ -27,8 +27,8 @@ export interface SpacerProps extends React.HTMLAttributes<HTMLDivElement> {
  * 12: 3rem, 48px
  * 14: 3.5rem, 56px
  */
-type SpacerValues = '1' | '2' | '4' | '6' | '8' | '10' | '12' | '14';
-declare function Spacer({ top, bottom, left, right, children, ...rest }: SpacerProps): JSX.Element;
+type SpacerValues = "1" | "2" | "4" | "6" | "8" | "10" | "12" | "14";
+declare function Spacer({ top, bottom, left, right, children, ...rest }: SpacerProps): React.ReactNode;
 declare namespace Spacer {
     var displayName: string;
 }

package/dist/ui/atoms/StatusDot.d.ts

@@ -1,5 +1,5 @@
 import { JSX } from 'react';
-type DotVariant = 'success' | 'danger' | 'warning';
+type DotVariant = "success" | "danger" | "warning";
 export interface StatusDotProps {
     variant: DotVariant;
 }

package/dist/ui/atoms/StatusIcon.d.ts

@@ -7,10 +7,10 @@ export interface StatusIconProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Background color, `none` for no background
      */
-    background?: 'green' | 'orange' | 'red' | 'gray' | 'lightGray' | 'teal' | 'white' | 'black' | 'none';
+    background?: "green" | "orange" | "red" | "gray" | "lightGray" | "teal" | "white" | "black" | "none";
     /**
      * padding around the icon can bne: 'none' | 'small' | 'large'
      */
-    gap?: 'none' | 'small' | 'medium' | 'large';
+    gap?: "none" | "small" | "medium" | "large";
 }
 export declare const StatusIcon: React.FC<StatusIconProps>;

package/dist/ui/atoms/Table/Table.d.ts

@@ -2,7 +2,7 @@ import { default as React } from 'react';
 export interface TableProps {
     thead?: React.ReactNode;
     className?: string;
-    variant?: 'boxed';
+    variant?: "boxed";
     tbody?: React.ReactNode;
     tfoot?: React.ReactNode;
 }

package/dist/ui/atoms/Tag.d.ts

@@ -1,12 +1,12 @@
-import { FlexRowProps } from '../internals/FlexRow';
 import { FC, JSX } from 'react';
-type Props = Pick<FlexRowProps, 'children'> & {
+import { FlexRowProps } from '../internals/FlexRow';
+type Props = Pick<FlexRowProps, "children"> & {
     /**
      * Icon component
      * Example: `<StatusIcon>` or `<RadialProgress>` or `<Avatar>`
      */
     icon?: JSX.Element;
 };
-export type TagProps = React.HTMLAttributes<HTMLElement> & Pick<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'onClick' | 'href'> & Props;
+export type TagProps = React.HTMLAttributes<HTMLElement> & Pick<React.AnchorHTMLAttributes<HTMLAnchorElement>, "onClick" | "href"> & Props;
 export declare const Tag: FC<TagProps>;
 export {};

package/dist/ui/atoms/Text.d.ts

@@ -1,9 +1,9 @@
 import { JSX, ReactNode } from 'react';
-type TextVariant = 'danger' | 'success' | 'primary' | 'warning' | 'info' | 'plain' | 'disabled';
-type TextSize = 'small' | 'regular' | 'large' | 'inherit';
-type TextWeight = 'regular' | 'medium' | 'semibold' | 'bold' | 'inherit';
-type TextAlignment = 'center' | 'left' | 'right' | 'inherit';
-type TextWrap = 'normal' | 'nowrap' | 'inherit';
+type TextVariant = "danger" | "success" | "primary" | "warning" | "info" | "plain" | "disabled";
+type TextSize = "small" | "regular" | "large" | "inherit";
+type TextWeight = "regular" | "medium" | "semibold" | "bold" | "inherit";
+type TextAlignment = "center" | "left" | "right" | "inherit";
+type TextWrap = "normal" | "nowrap" | "inherit";
 export interface TextProps extends React.HTMLAttributes<HTMLElement> {
     children?: ReactNode;
     variant?: TextVariant;
@@ -11,7 +11,7 @@ export interface TextProps extends React.HTMLAttributes<HTMLElement> {
     weight?: TextWeight;
     align?: TextAlignment;
     wrap?: TextWrap;
-    tag?: 'div' | 'span';
+    tag?: "div" | "span";
 }
 declare function Text({ children, className, variant, weight, size, align, wrap, tag, ...rest }: TextProps): JSX.Element;
 declare namespace Text {

package/dist/ui/atoms/Tooltip.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { PlacesType, TooltipRefProps } from 'react-tooltip';
-export { type TooltipRefProps } from 'react-tooltip';
+export type { TooltipRefProps } from 'react-tooltip';
 export interface TooltipProps {
     /** Tooltip unique identifier  */
     id?: string;
@@ -13,7 +13,7 @@ export interface TooltipProps {
      * If the tooltip is too close to the edge of the screen, it will be repositioned automatically.
      * @default 'top'
      */
-    direction?: Extract<PlacesType, 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end'>;
+    direction?: Extract<PlacesType, "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end">;
     /**
      * If true, the tooltip will have a fixed width of 280px.
      * If false or undefined, the tooltip will have a max-width of 280px and no minimum width.

package/dist/ui/composite/ActionButtons/ActionButtons.d.ts

@@ -1,10 +1,10 @@
-import { ButtonProps } from '../../atoms/Button';
 import { MouseEventHandler } from 'react';
+import { ButtonProps } from '../../atoms/Button';
 export interface ActionButtonsProps {
     actions: Array<{
         label: string;
         onClick: MouseEventHandler<HTMLButtonElement>;
-        variant?: ButtonProps['variant'];
+        variant?: ButtonProps["variant"];
         disabled?: boolean;
     }>;
 }

package/dist/ui/composite/Address.d.ts

@@ -3,7 +3,7 @@ export interface AddressProps {
     /**
      * The address to be visualized
      */
-    address?: Pick<AddressType, 'first_name' | 'last_name' | 'company' | 'line_1' | 'line_2' | 'city' | 'state_code' | 'zip_code' | 'country_code' | 'billing_info' | 'phone' | 'notes'> | null;
+    address?: Pick<AddressType, "first_name" | "last_name" | "company" | "line_1" | "line_2" | "city" | "state_code" | "zip_code" | "country_code" | "billing_info" | "phone" | "notes"> | null;
     /**
      * Optional address title (if added it will be shown in bold on top of address infos)
      */

package/dist/ui/composite/Dropdown/Dropdown.d.ts

@@ -1,5 +1,5 @@
 import { DropdownMenuProps } from './DropdownMenu';
-export interface DropdownProps extends Pick<DropdownMenuProps, 'menuHeader' | 'menuPosition' | 'menuWidth'> {
+export interface DropdownProps extends Pick<DropdownMenuProps, "menuHeader" | "menuPosition" | "menuWidth"> {
     /** The trigger for the dropdown menu. Can be a JSX Element or simply a `string`. */
     dropdownLabel?: React.ReactNode;
     /** List of links and actions. You can use a combination of `DropdownItem` and `DropdownDivider` components. */

package/dist/ui/composite/Dropdown/DropdownItem.d.ts

@@ -2,7 +2,7 @@ import { IconProps } from '../../atoms/Icon/Icon';
 export type DropdownItemProps = React.HTMLAttributes<HTMLElement> & {
     label: string;
     info?: string;
-    icon?: IconProps['name'] | 'keep-space';
+    icon?: IconProps["name"] | "keep-space";
 } & ({
     /**
      * render the component as anchor tag
@@ -72,6 +72,8 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     inert?: boolean | undefined | undefined;
     inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
     is?: string | undefined | undefined;
+    exportparts?: string | undefined | undefined;
+    part?: string | undefined | undefined;
     children?: import('react').ReactNode | Iterable<import('react').ReactNode>;
     'data-tooltip-id'?: string | undefined;
     'data-tooltip-place'?: import('react-tooltip').PlacesType | undefined;
@@ -161,7 +163,7 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     onBlurCapture?: import('react').FocusEventHandler<HTMLElement> | undefined;
     onChange?: import('react').FormEventHandler<HTMLElement> | undefined;
     onChangeCapture?: import('react').FormEventHandler<HTMLElement> | undefined;
-    onBeforeInput?: import('react').FormEventHandler<HTMLElement> | undefined;
+    onBeforeInput?: import('react').InputEventHandler<HTMLElement> | undefined;
     onBeforeInputCapture?: import('react').FormEventHandler<HTMLElement> | undefined;
     onInput?: import('react').FormEventHandler<HTMLElement> | undefined;
     onInputCapture?: import('react').FormEventHandler<HTMLElement> | undefined;
@@ -211,8 +213,6 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     onProgressCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onRateChange?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onRateChangeCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
-    onResize?: import('react').ReactEventHandler<HTMLElement> | undefined;
-    onResizeCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onSeeked?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onSeekedCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onSeeking?: import('react').ReactEventHandler<HTMLElement> | undefined;
@@ -293,6 +293,8 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     onLostPointerCaptureCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
     onScroll?: import('react').UIEventHandler<HTMLElement> | undefined;
     onScrollCapture?: import('react').UIEventHandler<HTMLElement> | undefined;
+    onScrollEnd?: import('react').UIEventHandler<HTMLElement> | undefined;
+    onScrollEndCapture?: import('react').UIEventHandler<HTMLElement> | undefined;
     onWheel?: import('react').WheelEventHandler<HTMLElement> | undefined;
     onWheelCapture?: import('react').WheelEventHandler<HTMLElement> | undefined;
     onAnimationStart?: import('react').AnimationEventHandler<HTMLElement> | undefined;
@@ -372,6 +374,8 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     inert?: boolean | undefined | undefined;
     inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
     is?: string | undefined | undefined;
+    exportparts?: string | undefined | undefined;
+    part?: string | undefined | undefined;
     children?: import('react').ReactNode | Iterable<import('react').ReactNode>;
     'data-tooltip-id'?: string | undefined;
     'data-tooltip-place'?: import('react-tooltip').PlacesType | undefined;
@@ -461,7 +465,7 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     onBlurCapture?: import('react').FocusEventHandler<HTMLElement> | undefined;
     onChange?: import('react').FormEventHandler<HTMLElement> | undefined;
     onChangeCapture?: import('react').FormEventHandler<HTMLElement> | undefined;
-    onBeforeInput?: import('react').FormEventHandler<HTMLElement> | undefined;
+    onBeforeInput?: import('react').InputEventHandler<HTMLElement> | undefined;
     onBeforeInputCapture?: import('react').FormEventHandler<HTMLElement> | undefined;
     onInput?: import('react').FormEventHandler<HTMLElement> | undefined;
     onInputCapture?: import('react').FormEventHandler<HTMLElement> | undefined;
@@ -511,8 +515,6 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     onProgressCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onRateChange?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onRateChangeCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
-    onResize?: import('react').ReactEventHandler<HTMLElement> | undefined;
-    onResizeCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onSeeked?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onSeekedCapture?: import('react').ReactEventHandler<HTMLElement> | undefined;
     onSeeking?: import('react').ReactEventHandler<HTMLElement> | undefined;
@@ -593,6 +595,8 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     onLostPointerCaptureCapture?: import('react').PointerEventHandler<HTMLElement> | undefined;
     onScroll?: import('react').UIEventHandler<HTMLElement> | undefined;
     onScrollCapture?: import('react').UIEventHandler<HTMLElement> | undefined;
+    onScrollEnd?: import('react').UIEventHandler<HTMLElement> | undefined;
+    onScrollEndCapture?: import('react').UIEventHandler<HTMLElement> | undefined;
     onWheel?: import('react').WheelEventHandler<HTMLElement> | undefined;
     onWheelCapture?: import('react').WheelEventHandler<HTMLElement> | undefined;
     onAnimationStart?: import('react').AnimationEventHandler<HTMLElement> | undefined;

package/dist/ui/composite/Dropdown/DropdownMenu.d.ts

@@ -3,14 +3,14 @@ export interface DropdownMenuProps extends React.HTMLAttributes<HTMLElement> {
     /** Menu content */
     children?: React.ReactNode;
     /** Set to `none` to hide the top arrow */
-    arrow?: 'none';
+    arrow?: "none";
     /** Optional header for the dropdown menu */
     menuHeader?: string;
     /**
      * Opening position of the dropdown menu
      * @default bottom-right
      */
-    menuPosition?: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';
+    menuPosition?: "bottom-left" | "bottom-right" | "top-left" | "top-right";
     /**
      * If set, the arrow will be centered when trigger button is smaller than 50px
      * Otherwise it will fallback to a default centering based on 32px trigger button
@@ -20,6 +20,6 @@ export interface DropdownMenuProps extends React.HTMLAttributes<HTMLElement> {
      * Set a wider menu, fixed to 280px.
      * By default, when no width is set, the menu adjusts its width dynamically to accommodate content, within a range of 150px to 250px.
      **/
-    menuWidth?: 'wide';
+    menuWidth?: "wide";
 }
 export declare const DropdownMenu: FC<DropdownMenuProps>;

package/dist/ui/composite/HomePageLayout.d.ts

@@ -1,7 +1,7 @@
+import { JSX, ReactNode } from 'react';
 import { PageHeadingProps } from '../atoms/PageHeading';
 import { PageHeadingToolbarProps } from '../atoms/PageHeading/PageHeadingToolbar';
-import { JSX, ReactNode } from 'react';
-export interface HomePageLayoutProps extends Pick<PageHeadingProps, 'title'> {
+export interface HomePageLayoutProps extends Pick<PageHeadingProps, "title"> {
     /**
      * Page content
      */
@@ -15,7 +15,7 @@ export interface HomePageLayoutProps extends Pick<PageHeadingProps, 'title'> {
  * This component renders a standard `PageLayout` but holds some logic
  * to define some default behavior for the home page, such as the navigation button label and action.
  */
-export declare function HomePageLayout({ title, children, toolbar }: HomePageLayoutProps): JSX.Element;
+export declare function HomePageLayout({ title, children, toolbar, }: HomePageLayoutProps): JSX.Element;
 export declare namespace HomePageLayout {
     var displayName: string;
 }

package/dist/ui/composite/List.d.ts

@@ -1,9 +1,9 @@
-import { PaginationProps } from '../atoms/Pagination';
 import { JSX, ReactNode } from 'react';
+import { PaginationProps } from '../atoms/Pagination';
 type ListPagination = {
     recordsPerPage: number;
     recordCount: number;
-} & Omit<PaginationProps, 'className' | 'isDisabled'>;
+} & Omit<PaginationProps, "className" | "isDisabled">;
 export interface ListProps {
     /**
      * List name displayed in the heading

package/dist/ui/composite/ListDetails.d.ts

@@ -15,7 +15,7 @@ export interface ListDetailsProps {
     /**
      * Font size
      */
-    fontSize?: 'normal' | 'small';
+    fontSize?: "normal" | "small";
     /**
      * Show skeleton when this is `true`
      */
@@ -25,7 +25,7 @@ export interface ListDetailsProps {
      */
     loadingLines?: number;
 }
-declare function ListDetails({ title, children, fontSize, isLoading, loadingLines, className }: ListDetailsProps): JSX.Element;
+declare function ListDetails({ title, children, fontSize, isLoading, loadingLines, className, }: ListDetailsProps): JSX.Element;
 declare namespace ListDetails {
     var displayName: string;
 }

package/dist/ui/composite/ListDetailsItem.d.ts

@@ -17,15 +17,15 @@ export interface ListDetailsItemProps {
     /**
      * Specify `none` to remove border
      */
-    border?: 'none';
+    border?: "none";
     /**
      * Text alignment for children on the right side.
      */
-    childrenAlign?: 'left' | 'right';
+    childrenAlign?: "left" | "right";
     /**
      * Specify `none` to remove side gutter
      */
-    gutter?: 'none';
+    gutter?: "none";
 }
 export declare function ListDetailsItem({ label, children, isLoading, border, gutter, childrenAlign, ...rest }: ListDetailsItemProps): JSX.Element;
 export declare namespace ListDetailsItem {

package/dist/ui/composite/ListItem.d.ts

@@ -1,7 +1,7 @@
-import { FlexRowProps } from '../internals/FlexRow';
 import { FC, JSX } from 'react';
-type ListItemVariant = 'list' | 'boxed';
-export type ListItemProps = React.HTMLAttributes<HTMLElement> & Pick<FlexRowProps, 'alignItems' | 'children'> & Pick<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'onClick' | 'href'> & {
+import { FlexRowProps } from '../internals/FlexRow';
+type ListItemVariant = "list" | "boxed";
+export type ListItemProps = React.HTMLAttributes<HTMLElement> & Pick<FlexRowProps, "alignItems" | "children"> & Pick<React.AnchorHTMLAttributes<HTMLAnchorElement>, "onClick" | "href"> & {
     /**
      * Icon component
      * Example: `<StatusIcon>` or `<RadialProgress>` or `<Avatar>`
@@ -11,7 +11,7 @@ export type ListItemProps = React.HTMLAttributes<HTMLElement> & Pick<FlexRowProp
      * Icon alignment
      * @default 'top'
      */
-    alignIcon?: 'top' | 'center' | 'bottom';
+    alignIcon?: "top" | "center" | "bottom";
     /**
      * Control the horizontal padding (`x`) or vertical padding (`y`).
      * You can specify `none` to remove the padding.
@@ -19,17 +19,17 @@ export type ListItemProps = React.HTMLAttributes<HTMLElement> & Pick<FlexRowProp
      * By default, the padding is set to `y` when the ListItem is a **not** clickable list, `xy` otherwise.
      * @default 'xy'
      */
-    padding?: 'xy' | 'x' | 'y' | 'none';
+    padding?: "xy" | "x" | "y" | "none";
     /**
      * Control the padding size.
      * @default '4'
      */
-    paddingSize?: '6' | '4' | '2';
+    paddingSize?: "6" | "4" | "2";
     /**
      * Border style to render
      * @default 'solid'
      */
-    borderStyle?: 'solid' | 'dashed' | 'none';
+    borderStyle?: "solid" | "dashed" | "none";
     /**
      * ListItem variant: 'list' or 'boxed' with rounded borders
      * @default 'list'

package/dist/ui/composite/PageError.d.ts

@@ -1,6 +1,6 @@
-import { PageHeadingProps } from '../atoms/PageHeading';
 import { JSX } from 'react';
-export interface PageErrorProps extends Pick<PageHeadingProps, 'navigationButton'> {
+import { PageHeadingProps } from '../atoms/PageHeading';
+export interface PageErrorProps extends Pick<PageHeadingProps, "navigationButton"> {
     /**
      * Main page title wrapped in a h1 element
      */

package/dist/ui/composite/PageLayout.d.ts

@@ -1,8 +1,8 @@
+import { ReactNode } from 'react';
 import { ContainerProps } from '../atoms/Container';
 import { PageHeadingProps } from '../atoms/PageHeading';
 import { OverlayProps } from '../internals/Overlay';
-import { ReactNode } from 'react';
-export type PageLayoutProps = Pick<PageHeadingProps, 'title' | 'description' | 'navigationButton' | 'toolbar' | 'gap'> & Pick<ContainerProps, 'minHeight'> & {
+export type PageLayoutProps = Pick<PageHeadingProps, "title" | "description" | "navigationButton" | "toolbar" | "gap"> & Pick<ContainerProps, "minHeight"> & {
     /**
      * Page content
      */
@@ -11,7 +11,7 @@ export type PageLayoutProps = Pick<PageHeadingProps, 'title' | 'description' | '
      * When mode is `test`, it will render a `TEST DATA` Badge to inform user api is working in test mode.
      * Only if app is standalone mode.
      */
-    mode?: 'test' | 'live';
+    mode?: "test" | "live";
     /**
      * Optional prop to enable scroll to top behavior on location change
      */
@@ -26,13 +26,13 @@ export type PageLayoutProps = Pick<PageHeadingProps, 'title' | 'description' | '
     /**
      * Footer element to be rendered at the bottom of the overlay.
      **/
-    overlayFooter?: OverlayProps['footer'];
+    overlayFooter?: OverlayProps["footer"];
 });
 export declare const PageLayout: import('../atoms/SkeletonTemplate').SkeletonTemplateComponent<{
-    description?: ReactNode;
     title: ReactNode;
     toolbar?: import('../atoms/PageHeading/PageHeadingToolbar').PageHeadingToolbarProps | undefined;
     gap?: "none" | "only-top" | "only-bottom" | "both" | undefined;
+    description?: ReactNode;
     navigationButton?: {
         label: string;
         onClick: () => void;
@@ -50,10 +50,10 @@ export declare const PageLayout: import('../atoms/SkeletonTemplate').SkeletonTem
     delayMs?: number | undefined;
     isLoading?: boolean | undefined;
 } | {
-    description?: ReactNode;
     title: ReactNode;
     toolbar?: import('../atoms/PageHeading/PageHeadingToolbar').PageHeadingToolbarProps | undefined;
     gap?: "none" | "only-top" | "only-bottom" | "both" | undefined;
+    description?: ReactNode;
     navigationButton?: {
         label: string;
         onClick: () => void;

package/dist/ui/composite/Routes/Routes.d.ts

@@ -31,7 +31,7 @@ import { GetParams } from './utils';
  */
 export declare function Routes<T extends Record<string, {
     path: string;
-}>>({ routes, list }: {
+}>>({ routes, list, }: {
     /** Object of available app routes build using the `createRoute` helper method */
     routes: T;
     /**
@@ -47,14 +47,14 @@ export declare function Routes<T extends Record<string, {
         };
     };
 }): JSX.Element;
-export declare function LoadingPage({ overlay }: {
+export declare function LoadingPage({ overlay, }: {
     overlay?: boolean;
 }): JSX.Element;
 /**
  * This component can be used as error component when the resource is not found by passing the resource type.
  * When empty it will render a generic page not found message.
  */
-export declare function GenericPageNotFound({ resource }: {
+export declare function GenericPageNotFound({ resource, }: {
     resource?: ListableResourceType;
 }): JSX.Element;
 /**

package/dist/ui/composite/Routes/index.d.ts

@@ -1,2 +1,2 @@
-export { GenericPageNotFound, LoadingPage, Routes, type PageProps } from './Routes';
-export { createRoute, createTypedRoute, type GetParams, type Route } from './utils';
+export { GenericPageNotFound, LoadingPage, type PageProps, Routes, } from './Routes';
+export { createRoute, createTypedRoute, type GetParams, type Route, } from './utils';

package/dist/ui/composite/Routes/utils.d.ts

@@ -53,7 +53,7 @@ export declare const createTypedRoute: <Parameters extends Record<string, any>>(
 export type GetParams<R extends {
     makePath: (...arg: any[]) => string;
 }> = {
-    [K in keyof Parameters<R['makePath']>[0]]: Exclude<ToLiteral<Parameters<R['makePath']>[0][K]>, 'undefined' | 'null'>;
+    [K in keyof Parameters<R["makePath"]>[0]]: Exclude<ToLiteral<Parameters<R["makePath"]>[0][K]>, "undefined" | "null">;
 };
 /**
  * Cast a valid `string | number | bigint | boolean | null | undefined` to literal.
@@ -66,7 +66,7 @@ export type GetParams<R extends {
  */
 type ToLiteral<V extends string | number | bigint | boolean | null | undefined> = `${V}`;
 export interface Route<Path extends `/${string}/` | `/`, Parameters extends Record<string, unknown> = ExtractParameters<Path>> {
-    path: Path extends `/${infer P}/` ? `/${P}` : '/';
+    path: Path extends `/${infer P}/` ? `/${P}` : "/";
     makePath: (parameters: Parameters, searchParams?: string | URLSearchParams) => string;
 }
 type ExtractParameters<Path extends string> = Path extends `${string}:${infer Var}/${infer Rest}` ? Simplify<FixOptional<{
@@ -76,9 +76,9 @@ type FixOptional<T extends Record<string, any>> = Omit<T, `${string}?`> & {
     [K in keyof T as K extends `${infer VariableName}?` ? VariableName : never]?: T[K];
 };
 type ErrorParameters<Parameters extends Record<string, any>, Path extends string> = keyof ({
-    [key in keyof ExtractParameters<Path> as key extends keyof Parameters ? never : undefined extends ExtractParameters<Path>[key] ? key extends string ? `${key}?` : key : key]-?: 'Is not properly set.';
+    [key in keyof ExtractParameters<Path> as key extends keyof Parameters ? never : undefined extends ExtractParameters<Path>[key] ? key extends string ? `${key}?` : key : key]-?: "Is not properly set.";
 } & {
-    [key in keyof Parameters as key extends string ? Path extends `${string}/:${key}${undefined extends Parameters[key] ? '?' : ''}/${string}` ? never : undefined extends Parameters[key] ? `${key}?` : key : never]-?: 'Is not properly set.';
+    [key in keyof Parameters as key extends string ? Path extends `${string}/:${key}${undefined extends Parameters[key] ? "?" : ""}/${string}` ? never : undefined extends Parameters[key] ? `${key}?` : key : never]-?: "Is not properly set.";
 });
-type ValidPath<Parameters extends Record<string, any>, Path extends string> = ErrorParameters<Parameters, Path> extends never ? Path : `Missing variable '${ErrorParameters<Parameters, Path> extends string ? ErrorParameters<Parameters, Path> : 'unknown'}'`;
+type ValidPath<Parameters extends Record<string, any>, Path extends string> = ErrorParameters<Parameters, Path> extends never ? Path : `Missing variable '${ErrorParameters<Parameters, Path> extends string ? ErrorParameters<Parameters, Path> : "unknown"}'`;
 export {};

package/dist/ui/composite/SearchBar.d.ts

@@ -1,5 +1,5 @@
 import { SkeletonTemplateProps } from '../atoms/SkeletonTemplate';
-export interface SearchBarProps extends Pick<SkeletonTemplateProps, 'isLoading' | 'delayMs'> {
+export interface SearchBarProps extends Pick<SkeletonTemplateProps, "isLoading" | "delayMs"> {
     /**
      * Initial value of the search bar. When changed, the search bar will be updated.
      */