This component requires JavaScript to function. Please refer to the
Installation section to set it up.
A client-side mechanism to crop images.
Arguments
| Name | Type | Default | Description |
|---|
src | String | N/A | The path of the image to crop. |
rounded | Boolean | true | If the crop mask should be a circle. Defaults to true. |
system_arguments | Hash | N/A | System arguments |
Slots
Loading
A loading indicator that is shown while the image is loading.
Examples
Simple cropper
<%= render(Primer::ImageCrop.new(src: "https://github.com/koddsson.png")) %>
Square cropper
<%= render(Primer::ImageCrop.new(src: "https://github.com/koddsson.png", rounded: false)) %>
Cropper with a custom loader
<%= render(Primer::ImageCrop.new(src: "https://github.com/koddsson.png", rounded: false)) do |cropper| %>
<% cropper.loading(style: "width: 120px").with_content("Loading...") %>
<% end %>