@commercelayer/app-elements 1.9.7 → 1.10.0

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

@@ -1,6 +1,15 @@
 /// <reference types="react" />
 /// <reference types="react" />
-export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
+export type CardProps = React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * Footer will render in a dedicated section below the main content.
+     */
+    footer?: React.ReactNode;
+    /**
+     * Set a gray background color
+     */
+    backgroundColor?: 'light';
+} & ({
     /**
      * Possible values are:
      * - `"1"`: 0.25rem, 4px
@@ -10,26 +19,295 @@ export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
      * @default 6
      */
     gap?: '1' | '4' | '6';
-    /**
-     * Footer will render in a dedicated section below the main content.
-     */
-    footer?: React.ReactNode;
     /**
      * Set the overflow behavior. In most of the cases you might want to keep overflow visible,
      * but when you have inner content with hover effects you might want to set overflow to hidden.
      */
     overflow: 'visible' | 'hidden';
+} | {
     /**
-     * Set a gray background color
+     * When card is rendered with no gap, overflow is always intended as hidden and cannot be controlled via props,
+     * otherwise inner content will overlap the rounded corners of the card.
      */
-    backgroundColor?: 'light';
-}
+    gap: 'none';
+});
 /** Card is a flexible component used to group and display content in a clear and concise format. */
 export declare const Card: import("./SkeletonTemplate").SkeletonTemplateComponent<{
-    gap?: "1" | "4" | "6" | undefined;
+    defaultChecked?: boolean | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined;
+    suppressHydrationWarning?: boolean | undefined;
+    accessKey?: string | undefined;
+    autoFocus?: boolean | undefined;
+    className?: string | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
+    contextMenu?: string | undefined;
+    dir?: string | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    hidden?: boolean | undefined;
+    id?: string | undefined;
+    lang?: string | undefined;
+    nonce?: string | undefined;
+    placeholder?: string | undefined;
+    slot?: string | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    style?: import("react").CSSProperties | undefined;
+    tabIndex?: number | undefined;
+    title?: string | undefined;
+    translate?: "yes" | "no" | undefined;
+    radioGroup?: string | undefined;
+    role?: import("react").AriaRole | undefined;
+    about?: string | undefined;
+    content?: string | undefined;
+    datatype?: string | undefined;
+    inlist?: any;
+    prefix?: string | undefined;
+    property?: string | undefined;
+    rel?: string | undefined;
+    resource?: string | undefined;
+    rev?: string | undefined;
+    typeof?: string | undefined;
+    vocab?: string | undefined;
+    autoCapitalize?: string | undefined;
+    autoCorrect?: string | undefined;
+    autoSave?: string | undefined;
+    color?: string | undefined;
+    itemProp?: string | undefined;
+    itemScope?: boolean | undefined;
+    itemType?: string | undefined;
+    itemID?: string | undefined;
+    itemRef?: string | undefined;
+    results?: number | undefined;
+    security?: string | undefined;
+    unselectable?: "on" | "off" | undefined;
+    inputMode?: "url" | "search" | "none" | "text" | "tel" | "email" | "numeric" | "decimal" | undefined;
+    is?: string | undefined;
+    "aria-activedescendant"?: string | undefined;
+    "aria-atomic"?: (boolean | "true" | "false") | undefined;
+    "aria-autocomplete"?: "none" | "list" | "inline" | "both" | undefined;
+    "aria-braillelabel"?: string | undefined;
+    "aria-brailleroledescription"?: string | undefined;
+    "aria-busy"?: (boolean | "true" | "false") | undefined;
+    "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-colcount"?: number | undefined;
+    "aria-colindex"?: number | undefined;
+    "aria-colindextext"?: string | undefined;
+    "aria-colspan"?: number | undefined;
+    "aria-controls"?: string | undefined;
+    "aria-current"?: boolean | "date" | "time" | "true" | "false" | "page" | "step" | "location" | undefined;
+    "aria-describedby"?: string | undefined;
+    "aria-description"?: string | undefined;
+    "aria-details"?: string | undefined;
+    "aria-disabled"?: (boolean | "true" | "false") | undefined;
+    "aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
+    "aria-errormessage"?: string | undefined;
+    "aria-expanded"?: (boolean | "true" | "false") | undefined;
+    "aria-flowto"?: string | undefined;
+    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+    "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
+    "aria-hidden"?: (boolean | "true" | "false") | undefined;
+    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
+    "aria-keyshortcuts"?: string | undefined;
+    "aria-label"?: string | undefined;
+    "aria-labelledby"?: string | undefined;
+    "aria-level"?: number | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined;
+    "aria-modal"?: (boolean | "true" | "false") | undefined;
+    "aria-multiline"?: (boolean | "true" | "false") | undefined;
+    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined;
+    "aria-owns"?: string | undefined;
+    "aria-placeholder"?: string | undefined;
+    "aria-posinset"?: number | undefined;
+    "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-readonly"?: (boolean | "true" | "false") | undefined;
+    "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-required"?: (boolean | "true" | "false") | undefined;
+    "aria-roledescription"?: string | undefined;
+    "aria-rowcount"?: number | undefined;
+    "aria-rowindex"?: number | undefined;
+    "aria-rowindextext"?: string | undefined;
+    "aria-rowspan"?: number | undefined;
+    "aria-selected"?: (boolean | "true" | "false") | undefined;
+    "aria-setsize"?: number | undefined;
+    "aria-sort"?: "other" | "none" | "ascending" | "descending" | undefined;
+    "aria-valuemax"?: number | undefined;
+    "aria-valuemin"?: number | undefined;
+    "aria-valuenow"?: number | undefined;
+    "aria-valuetext"?: string | undefined;
+    children?: import("react").ReactNode;
+    dangerouslySetInnerHTML?: {
+        __html: string | TrustedHTML;
+    } | undefined;
+    onCopy?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCopyCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCut?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCutCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPaste?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPasteCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCompositionEnd?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStart?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdate?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onFocus?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onFocusCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onBlur?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onBlurCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onChange?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onChangeCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onReset?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onResetCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onSubmit?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onSubmitCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onInvalid?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onInvalidCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onLoad?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onError?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onErrorCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPress?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUp?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onAbort?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onAbortCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThrough?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptied?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptiedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEncrypted?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEncryptedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEnded?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEndedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedData?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedDataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadata?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStart?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStartCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPause?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPauseCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlaying?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onProgress?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onProgressCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onResize?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onResizeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeked?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeking?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onStalled?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onStalledCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspend?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspendCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdate?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onWaiting?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onWaitingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onAuxClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onAuxClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenu?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenuCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onDrag?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnd?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEndCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnter?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnterCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragExit?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragExitCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeave?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeaveCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragOver?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragOverCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragStart?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragStartCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDrop?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDropCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onMouseDown?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseDownCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseEnter?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseLeave?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMove?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMoveCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOut?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOutCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOver?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOverCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUp?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUpCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onSelect?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSelectCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onTouchCancel?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchCancelCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEnd?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEndCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMove?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMoveCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStart?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStartCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onPointerDown?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerDownCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMove?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMoveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUp?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUpCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerEnterCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOutCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onScroll?: import("react").UIEventHandler<HTMLDivElement> | undefined;
+    onScrollCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
+    onWheel?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
+    onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
+    onAnimationStart?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEnd?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
     footer?: React.ReactNode;
-    overflow: 'visible' | 'hidden';
     backgroundColor?: "light" | undefined;
+    gap?: "1" | "4" | "6" | undefined;
+    overflow: 'visible' | 'hidden';
+    delayMs?: number | undefined;
+    isLoading?: boolean | undefined;
+} | {
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
@@ -298,6 +576,9 @@ export declare const Card: import("./SkeletonTemplate").SkeletonTemplateComponen
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    footer?: React.ReactNode;
+    backgroundColor?: "light" | undefined;
+    gap: 'none';
     delayMs?: number | undefined;
     isLoading?: boolean | undefined;
 }>;

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

@@ -1,6 +1,5 @@
 import * as phosphor from '@phosphor-icons/react';
 export declare const iconMapping: {
-    readonly apps: phosphor.Icon;
     readonly appWindow: phosphor.Icon;
     readonly arrowBendDownRight: phosphor.Icon;
     readonly arrowCircleDown: phosphor.Icon;
@@ -11,50 +10,58 @@ export declare const iconMapping: {
     readonly arrowRight: phosphor.Icon;
     readonly arrowsLeftRight: phosphor.Icon;
     readonly arrowUpRight: phosphor.Icon;
-    readonly asterisk: phosphor.Icon;
+    readonly asteriskSimple: phosphor.Icon;
     readonly bookOpenText: phosphor.Icon;
     readonly buildings: phosphor.Icon;
-    readonly bulb: phosphor.Icon;
+    readonly calendarBlank: phosphor.Icon;
     readonly caretDown: phosphor.Icon;
     readonly caretRight: phosphor.Icon;
     readonly chat: phosphor.Icon;
     readonly chatCircle: phosphor.Icon;
     readonly check: phosphor.Icon;
-    readonly cloud: phosphor.Icon;
-    readonly credentials: phosphor.Icon;
+    readonly cloudArrowUp: phosphor.Icon;
     readonly creditCard: phosphor.Icon;
+    readonly currencyEur: phosphor.Icon;
     readonly download: phosphor.Icon;
     readonly eye: phosphor.Icon;
     readonly flag: phosphor.Icon;
     readonly folderOpen: phosphor.Icon;
-    readonly funnel: phosphor.Icon;
-    readonly github: phosphor.Icon;
-    readonly globe: phosphor.Icon;
-    readonly google: phosphor.Icon;
-    readonly home: phosphor.Icon;
+    readonly funnelSimple: phosphor.Icon;
+    readonly gearFine: phosphor.Icon;
+    readonly gift: phosphor.Icon;
+    readonly githubLogo: phosphor.Icon;
+    readonly globeSimple: phosphor.Icon;
+    readonly googleLogo: phosphor.Icon;
     readonly hourglass: phosphor.Icon;
+    readonly houseSimple: phosphor.Icon;
     readonly info: phosphor.Icon;
     readonly lifebuoy: phosphor.Icon;
+    readonly lightbulbFilament: phosphor.Icon;
+    readonly linkSimple: phosphor.Icon;
     readonly list: phosphor.Icon;
+    readonly lockSimpleOpen: phosphor.Icon;
     readonly magnifyingGlass: phosphor.Icon;
-    readonly megaphone: phosphor.Icon;
+    readonly megaphoneSimple: phosphor.Icon;
     readonly minus: phosphor.Icon;
     readonly minusCircle: phosphor.Icon;
     readonly package: phosphor.Icon;
     readonly pencilSimple: phosphor.Icon;
+    readonly percent: phosphor.Icon;
     readonly plus: phosphor.Icon;
     readonly printer: phosphor.Icon;
     readonly pulse: phosphor.Icon;
-    readonly puzzle: phosphor.Icon;
+    readonly pushPin: phosphor.Icon;
+    readonly puzzlePiece: phosphor.Icon;
     readonly question: phosphor.Icon;
-    readonly resources: phosphor.Icon;
     readonly rocketLaunch: phosphor.Icon;
-    readonly settings: phosphor.Icon;
     readonly shield: phosphor.Icon;
     readonly shoppingBag: phosphor.Icon;
     readonly signOut: phosphor.Icon;
-    readonly slack: phosphor.Icon;
-    readonly team: phosphor.Icon;
+    readonly slackLogo: phosphor.Icon;
+    readonly sliders: phosphor.Icon;
+    readonly squaresFour: phosphor.Icon;
+    readonly stack: phosphor.Icon;
+    readonly ticket: phosphor.Icon;
     readonly treeStructure: phosphor.Icon;
     readonly truck: phosphor.Icon;
     readonly tShirt: phosphor.Icon;

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

@@ -288,7 +288,7 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLElement> | undefined;
     label: string;
-    icon?: "download" | "package" | "list" | "settings" | "x" | "apps" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asterisk" | "bookOpenText" | "buildings" | "bulb" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloud" | "credentials" | "creditCard" | "eye" | "flag" | "folderOpen" | "funnel" | "github" | "globe" | "google" | "home" | "hourglass" | "info" | "lifebuoy" | "magnifyingGlass" | "megaphone" | "minus" | "minusCircle" | "pencilSimple" | "plus" | "printer" | "pulse" | "puzzle" | "question" | "resources" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slack" | "team" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle" | "keep-space" | undefined;
+    icon?: "download" | "package" | "list" | "x" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asteriskSimple" | "bookOpenText" | "buildings" | "calendarBlank" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloudArrowUp" | "creditCard" | "currencyEur" | "eye" | "flag" | "folderOpen" | "funnelSimple" | "gearFine" | "gift" | "githubLogo" | "globeSimple" | "googleLogo" | "hourglass" | "houseSimple" | "info" | "lifebuoy" | "lightbulbFilament" | "linkSimple" | "lockSimpleOpen" | "magnifyingGlass" | "megaphoneSimple" | "minus" | "minusCircle" | "pencilSimple" | "percent" | "plus" | "printer" | "pulse" | "pushPin" | "puzzlePiece" | "question" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slackLogo" | "sliders" | "squaresFour" | "stack" | "ticket" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle" | "keep-space" | undefined;
     href: string;
     target?: string | undefined;
     delayMs?: number | undefined;
@@ -563,7 +563,7 @@ export declare const DropdownItem: import('../../atoms/SkeletonTemplate').Skelet
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLElement> | undefined;
     label: string;
-    icon?: "download" | "package" | "list" | "settings" | "x" | "apps" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asterisk" | "bookOpenText" | "buildings" | "bulb" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloud" | "credentials" | "creditCard" | "eye" | "flag" | "folderOpen" | "funnel" | "github" | "globe" | "google" | "home" | "hourglass" | "info" | "lifebuoy" | "magnifyingGlass" | "megaphone" | "minus" | "minusCircle" | "pencilSimple" | "plus" | "printer" | "pulse" | "puzzle" | "question" | "resources" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slack" | "team" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle" | "keep-space" | undefined;
+    icon?: "download" | "package" | "list" | "x" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asteriskSimple" | "bookOpenText" | "buildings" | "calendarBlank" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloudArrowUp" | "creditCard" | "currencyEur" | "eye" | "flag" | "folderOpen" | "funnelSimple" | "gearFine" | "gift" | "githubLogo" | "globeSimple" | "googleLogo" | "hourglass" | "houseSimple" | "info" | "lifebuoy" | "lightbulbFilament" | "linkSimple" | "lockSimpleOpen" | "magnifyingGlass" | "megaphoneSimple" | "minus" | "minusCircle" | "pencilSimple" | "percent" | "plus" | "printer" | "pulse" | "pushPin" | "puzzlePiece" | "question" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slackLogo" | "sliders" | "squaresFour" | "stack" | "ticket" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle" | "keep-space" | undefined;
     href?: undefined;
     delayMs?: number | undefined;
     isLoading?: boolean | undefined;

package/dist/ui/forms/InputRadioGroup/InputRadioGroup.d.ts

@@ -18,7 +18,7 @@ export declare const InputRadioGroup: import('../../atoms/SkeletonTemplate').Ske
     showInput?: boolean | undefined;
     viewMode?: "grid" | "list" | "inline" | undefined;
     hint?: {
-        icon?: "download" | "package" | "list" | "settings" | "x" | "apps" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asterisk" | "bookOpenText" | "buildings" | "bulb" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloud" | "credentials" | "creditCard" | "eye" | "flag" | "folderOpen" | "funnel" | "github" | "globe" | "google" | "home" | "hourglass" | "info" | "lifebuoy" | "magnifyingGlass" | "megaphone" | "minus" | "minusCircle" | "pencilSimple" | "plus" | "printer" | "pulse" | "puzzle" | "question" | "resources" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slack" | "team" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle" | undefined;
+        icon?: "download" | "package" | "list" | "x" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asteriskSimple" | "bookOpenText" | "buildings" | "calendarBlank" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloudArrowUp" | "creditCard" | "currencyEur" | "eye" | "flag" | "folderOpen" | "funnelSimple" | "gearFine" | "gift" | "githubLogo" | "globeSimple" | "googleLogo" | "hourglass" | "houseSimple" | "info" | "lifebuoy" | "lightbulbFilament" | "linkSimple" | "lockSimpleOpen" | "magnifyingGlass" | "megaphoneSimple" | "minus" | "minusCircle" | "pencilSimple" | "percent" | "plus" | "printer" | "pulse" | "pushPin" | "puzzlePiece" | "question" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slackLogo" | "sliders" | "squaresFour" | "stack" | "ticket" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle" | undefined;
         text: ReactNode;
     } | undefined;
     feedback?: Omit<import("../InputFeedback").InputFeedbackProps, "className"> | undefined;

package/dist/ui/forms/InputReadonly.d.ts

@@ -25,7 +25,7 @@ export declare const InputReadonly: import('../atoms/SkeletonTemplate').Skeleton
     showCopyAction?: boolean | undefined;
     label?: string | undefined;
     hint?: {
-        icon?: "download" | "package" | "list" | "settings" | "x" | "apps" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asterisk" | "bookOpenText" | "buildings" | "bulb" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloud" | "credentials" | "creditCard" | "eye" | "flag" | "folderOpen" | "funnel" | "github" | "globe" | "google" | "home" | "hourglass" | "info" | "lifebuoy" | "magnifyingGlass" | "megaphone" | "minus" | "minusCircle" | "pencilSimple" | "plus" | "printer" | "pulse" | "puzzle" | "question" | "resources" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slack" | "team" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle" | undefined;
+        icon?: "download" | "package" | "list" | "x" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asteriskSimple" | "bookOpenText" | "buildings" | "calendarBlank" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloudArrowUp" | "creditCard" | "currencyEur" | "eye" | "flag" | "folderOpen" | "funnelSimple" | "gearFine" | "gift" | "githubLogo" | "globeSimple" | "googleLogo" | "hourglass" | "houseSimple" | "info" | "lifebuoy" | "lightbulbFilament" | "linkSimple" | "lockSimpleOpen" | "magnifyingGlass" | "megaphoneSimple" | "minus" | "minusCircle" | "pencilSimple" | "percent" | "plus" | "printer" | "pulse" | "pushPin" | "puzzlePiece" | "question" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slackLogo" | "sliders" | "squaresFour" | "stack" | "ticket" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle" | undefined;
         text: import("react").ReactNode;
     } | undefined;
     feedback?: Omit<import("./InputFeedback").InputFeedbackProps, "className"> | undefined;

package/dist/ui/resources/ResourceListItem/ResourceListItem.mocks.d.ts

@@ -581,4 +581,69 @@ export declare const presetResourceListItem: {
             readonly updated_at: "";
         }[];
     };
+    promotionActive: {
+        type: "percentage_discount_promotions";
+        id: string;
+        created_at: string;
+        updated_at: string;
+        starts_at: string;
+        expires_at: string;
+        name: string;
+        percentage: number;
+        total_usage_limit: number;
+        active: true;
+    };
+    promotionDisabled: {
+        type: "percentage_discount_promotions";
+        id: string;
+        created_at: string;
+        updated_at: string;
+        starts_at: string;
+        expires_at: string;
+        name: string;
+        percentage: number;
+        total_usage_limit: number;
+        active: false;
+    };
+    promotionUpcoming: {
+        type: "free_shipping_promotions";
+        id: string;
+        created_at: string;
+        updated_at: string;
+        starts_at: string;
+        expires_at: string;
+        name: string;
+        total_usage_limit: number;
+        active: true;
+    };
+    promotionExpired: {
+        type: "free_gift_promotions";
+        id: string;
+        created_at: string;
+        updated_at: string;
+        starts_at: string;
+        expires_at: string;
+        name: string;
+        total_usage_limit: number;
+        active: true;
+    };
+    promotionWithCoupons: {
+        type: "percentage_discount_promotions";
+        id: string;
+        created_at: string;
+        updated_at: string;
+        starts_at: string;
+        expires_at: string;
+        name: string;
+        percentage: number;
+        total_usage_limit: number;
+        active: true;
+        coupons: {
+            code: string;
+            created_at: string;
+            id: string;
+            type: "coupons";
+            updated_at: string;
+        }[];
+    };
 };

package/dist/ui/resources/ResourceListItem/common.d.ts

@@ -8,7 +8,7 @@ export declare const ListItemDescription: import('../../atoms/SkeletonTemplate')
 }>;
 export declare const ListItemIcon: import('../../atoms/SkeletonTemplate').SkeletonTemplateComponent<{
     color: "none" | "green" | "orange" | "red" | "gray" | "teal" | "white" | "black" | undefined;
-    icon: "download" | "package" | "list" | "settings" | "x" | "apps" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asterisk" | "bookOpenText" | "buildings" | "bulb" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloud" | "credentials" | "creditCard" | "eye" | "flag" | "folderOpen" | "funnel" | "github" | "globe" | "google" | "home" | "hourglass" | "info" | "lifebuoy" | "magnifyingGlass" | "megaphone" | "minus" | "minusCircle" | "pencilSimple" | "plus" | "printer" | "pulse" | "puzzle" | "question" | "resources" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slack" | "team" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle";
+    icon: "download" | "package" | "list" | "x" | "appWindow" | "arrowBendDownRight" | "arrowCircleDown" | "arrowCircleUp" | "arrowClockwise" | "arrowDown" | "arrowLeft" | "arrowRight" | "arrowsLeftRight" | "arrowUpRight" | "asteriskSimple" | "bookOpenText" | "buildings" | "calendarBlank" | "caretDown" | "caretRight" | "chat" | "chatCircle" | "check" | "cloudArrowUp" | "creditCard" | "currencyEur" | "eye" | "flag" | "folderOpen" | "funnelSimple" | "gearFine" | "gift" | "githubLogo" | "globeSimple" | "googleLogo" | "hourglass" | "houseSimple" | "info" | "lifebuoy" | "lightbulbFilament" | "linkSimple" | "lockSimpleOpen" | "magnifyingGlass" | "megaphoneSimple" | "minus" | "minusCircle" | "pencilSimple" | "percent" | "plus" | "printer" | "pulse" | "pushPin" | "puzzlePiece" | "question" | "rocketLaunch" | "shield" | "shoppingBag" | "signOut" | "slackLogo" | "sliders" | "squaresFour" | "stack" | "ticket" | "treeStructure" | "truck" | "tShirt" | "upload" | "user" | "userCircle" | "users" | "warning" | "warningCircle" | "xCircle";
     delayMs?: number | undefined;
     isLoading?: boolean | undefined;
 }>;

package/dist/ui/resources/ResourceListItem/transformers/promotions.d.ts

@@ -0,0 +1,3 @@
+import type { Promotion } from '@commercelayer/sdk';
+import { type ResourceToProps } from '../types';
+export declare const promotionToProps: ResourceToProps<Omit<Promotion, 'type'>>;

package/dist/ui/resources/ResourceListItem/types.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import type { TokenProviderAuthUser } from '../../../providers/TokenProvider/types';
-import type { Customer, Order, Return, Shipment, StockTransfer } from '@commercelayer/sdk';
-export type ResourceListItemType = Order | Return | Customer | StockTransfer | Shipment;
+import type { BuyXPayYPromotion, Customer, ExternalPromotion, FixedAmountPromotion, FixedPricePromotion, FreeGiftPromotion, FreeShippingPromotion, Order, PercentageDiscountPromotion, Return, Shipment, StockTransfer } from '@commercelayer/sdk';
+export type ResourceListItemType = Order | Return | Customer | StockTransfer | Shipment | BuyXPayYPromotion | ExternalPromotion | FixedAmountPromotion | FixedPricePromotion | FreeGiftPromotion | FreeShippingPromotion | PercentageDiscountPromotion;
 export interface ResourceListItemComponentProps {
-    name: string;
+    name: React.ReactNode;
     description: JSX.Element | string;
     icon: JSX.Element;
     rightContent?: JSX.Element;

package/dist/ui/resources/useResourceFilters/timeUtils.d.ts

@@ -8,7 +8,7 @@ interface MakerSdkFilterTimeParams {
     sdkFilterName?: string;
 }
 export declare const makeSdkFilterTime: ({ timePreset, timeFrom, timeTo, timezone, sdkFilterName }: MakerSdkFilterTimeParams) => Record<string, string | undefined>;
-export declare function getTimeRangeCustomLabel(timeFrom: Date, timeTo: Date, timezone?: string | undefined): string;
+export declare function getDefaultBrowserTimezone(): string | undefined;
 export declare function getTimeRangePresetName(timeRangePreset: TimeRangePreset): string;
 export declare const timeRangeValidationSchema: z.ZodEffects<z.ZodObject<{
     timeFrom: z.ZodNullable<z.ZodOptional<z.ZodDate>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercelayer/app-elements",
-  "version": "1.9.7",
+  "version": "1.10.0",
   "type": "module",
   "license": "MIT",
   "files": [