diff --git a/.vscode/settings.json b/.vscode/settings.json index b207576..a272db4 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,6 +1,5 @@ { "editor.formatOnSave": true, - "prettier.eslintIntegration": true, "eslint.validate": [ { "language": "javascript", @@ -31,5 +30,8 @@ "directory": "node", "changeProcessCWD": true } - ] + ], + "editor.codeActionsOnSave": { + "source.fixAll.eslint": true + } } diff --git a/CHANGELOG.md b/CHANGELOG.md index bb72f29..fa56814 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,8 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/) and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html). ## [Unreleased] +### Added +- `title` prop to the `Image` component. ## [0.3.1] - 2019-11-22 ### Removed diff --git a/messages/en.json b/messages/en.json index ece1356..d4f8bdf 100644 --- a/messages/en.json +++ b/messages/en.json @@ -5,6 +5,8 @@ "admin/editor.store-image.alt.title": "Alternative text", "admin/editor.store-image.blockClass.title": "CSS Block Class", "admin/editor.store-image.blockClass.description": "Adds an extra class name to ease styling", + "admin/editor.store-image.title.title": "Image title", + "admin/editor.store-image.title.description": "Title to be shown on hover", "admin/editor.image-list.title": "Image List", "admin/editor.image-list.description": "Show a list of images", "admin/editor.image-list.images.image.title": "Image", diff --git a/messages/es.json b/messages/es.json index 59f6f4b..dd08b26 100644 --- a/messages/es.json +++ b/messages/es.json @@ -5,6 +5,8 @@ "admin/editor.store-image.alt.title": "Texto alternativo", "admin/editor.store-image.blockClass.title": "CSS Block Class", "admin/editor.store-image.blockClass.description": "Agrega un nombre de clase extra para facilitar la estilización", + "admin/editor.store-image.title.title": "Título de la imagen", + "admin/editor.store-image.title.description": "Título que se mostrará al pasar el mouse sobre la imagen", "admin/editor.image-list.title": "Lista de imagenes", "admin/editor.image-list.description": "Mostrar una lista de imágenes", "admin/editor.image-list.images.image.title": "Imagen", diff --git a/messages/pt.json b/messages/pt.json index 6fd3605..d05f21e 100644 --- a/messages/pt.json +++ b/messages/pt.json @@ -5,6 +5,8 @@ "admin/editor.store-image.alt.title": "Texto alternativo", "admin/editor.store-image.blockClass.title": "CSS Block Class", "admin/editor.store-image.blockClass.description": "Adiciona um nome de classe extra para facilitar a estilização", + "admin/editor.store-image.title.title": "Título da imagem", + "admin/editor.store-image.title.description": "Título a ser mostrado quando você passa o mouse pela imagem", "admin/editor.image-list.title": "Lista de imagens", "admin/editor.image-list.description": "Exiba uma lista de imagens", "admin/editor.image-list.images.image.title": "Imagem", diff --git a/react/Image.tsx b/react/Image.tsx index 7d4a5f6..c79d0a3 100644 --- a/react/Image.tsx +++ b/react/Image.tsx @@ -33,6 +33,7 @@ const Image: StorefrontFunctionComponent = ({ sizes = '', link, intl, + title, }) => { const handles = useCssHandles(CSS_HANDLES, { migrationFrom: 'vtex.store-components@3.x', @@ -51,9 +52,10 @@ const Image: StorefrontFunctionComponent = ({ const imgElement = (