@wix/design-system
Version:
@wix/design-system
101 lines (98 loc) • 3.87 kB
Markdown
### imageUrl
- type: string
- description: Links to image asset source (URL). Leave it blank when image is not uploaded yet.
### fit
- type: "contain" | "cover"
- description: Specifies image fit mode inside a box.
Check [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) CSS property values for more info.
- default: `cover`
### error
- type: boolean
- description: No description
### errorMessage
- type: string
- description: No description
### tooltipProps
- type: TooltipCommonProps
- description: Allows to pass all common tooltip props.
### showUpdateButton
- type: boolean
- description: Specifies whether the update button is visible.
- default: true
### showDownloadButton
- type: boolean
- description: Specifies whether the download button is visible.
- default: false
### showRemoveButton
- type: boolean
- description: Specifies whether the remove button is visible.
- default: true
### onAddImage
- type: MouseEventHandler
- description: Defines a click handler, which is called every time a user clicks on an empty viewer (when no `imageUrl` is provided).
### onUpdateImage
- type: MouseEventHandler
- description: Defines a handler function, which is called every time user clicks on the ‘Update image’ button.
### onDownloadImage
- type: MouseEventHandler
- description: Defines a handler function, which is called every time user clicks on the download button.
### onRemoveImage
- type: MouseEventHandler
- description: Defines a handler function, which is called every time user clicks on the ‘Remove image’ button.
### onImageLoad
- type: ReactEventHandler<HTMLImageElement>
- description: Defines a handler function which is called right after image loads.
### addImageInfo
- type: string
- description: Specifies a message to display in a tooltip when no image is uploaded yet.
- default: 'Add Image'
### updateImageInfo
- type: string
- description: Defines a message to display in a tooltip when ‘Update’ action button is hovered.
- default: 'Update'
### downloadImageInfo
- type: string
- description: Defines a message to display in a tooltip when ‘Download’ action button is hovered.
- default: 'Download'
### removeImageInfo
- type: string
- description: Defines a message to display in a tooltip, when ‘remove’ action button is hovered.
- default: 'Remove'
### moreImageInfo
- type: string
- description: Defines a message to display in a tooltip when the ‘More’ action button is hovered. Relevant only when all buttons are visible.
- default: 'More actions'
### removeRoundedBorders
- type: boolean
- description: Removes default border radius.
### width
- type: string | number
- description: Sets the width of the viewer box.
### height
- type: string | number
- description: Sets the height of the viewer box.
### disabled
- type: boolean
- description: Specifies whether the component is disabled.
### status
- type: "loading" | "error" | "warning"
- description: Specifies the status of a viewer.
### statusMessage
- type: ReactNode
- description: Defines the message to display on status icon hover. If not given or empty there will be no tooltip.
### dataHook
- type: string
- description: Applies a data-hook HTML attribute that can be used in the tests.
### className
- type: string
- description: Specifies a CSS class name to be appended to the component’s root element.
- internal
### imageProps
- type: Pick<ImageProps, "borderRadius" | "style" | "transparent" | "height" | "position" | "width" | "alt" | "showBorder">
- description: Additional props to pass to the Image component (borderRadius, position, showBorder, transparent, etc.).
### updateButtonAriaLabel
- type: string
- description: Defines a string value that labels the update button element
### removeButtonAriaLabel
- type: string
- description: Defines a string value that labels the remove button element