@eightshift/frontend-libs
Version:
A collection of useful frontend utility modules. powered by Eightshift
87 lines (86 loc) • 1.71 kB
JSON
{
"$schema": "https://raw.githubusercontent.com/infinum/eightshift-frontend-libs/develop/schemas/component.json",
"componentName": "image",
"title": "Image",
"componentClass": "image",
"example": {
"attributes": {
"imageUrl": "https://loremflickr.com/1000/800",
"imageUrlDesktop": "https://loremflickr.com/800/600",
"imageUrlTablet": "https://loremflickr.com/600/400",
"imageUrlMobile": "https://loremflickr.com/300/200",
"imageAccept": "image/*",
"imageAllowedTypes": ["image"],
"imageAlt": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
"imageFull": false,
"imageUse": true
}
},
"attributes": {
"imageUrl": {
"type": "string"
},
"imageUrlDesktop": {
"type": "string"
},
"imageUrlTablet": {
"type": "string"
},
"imageUrlMobile": {
"type": "string"
},
"imageAccept": {
"type": "string",
"default": "image/*"
},
"imageAllowedTypes": {
"type": "array",
"default": ["image"]
},
"imageAlt": {
"type": "string"
},
"imageFull": {
"type": "boolean",
"default": false
},
"imageUse": {
"type": "boolean",
"default": true
},
"imageRoundedCorners": {
"type": "boolean",
"default": false
}
},
"responsiveAttributes": {
"imageUrl": {
"large": "imageUrl",
"desktop": "imageUrlDesktop",
"tablet": "imageUrlTablet",
"mobile": "imageUrlMobile"
}
},
"variables": {
"imageFull": {
"true": [
{
"variable": {
"image-width": "100%",
"image-img-width": "100%",
"image-img-max-width": "none"
}
}
]
},
"imageRoundedCorners": {
"true": [
{
"variable": {
"image-border-radius": "1rem"
}
}
]
}
}
}