diff --git a/packages/carousel/package.json b/packages/carousel/package.json index 9bc03ce6..adcebc9d 100644 --- a/packages/carousel/package.json +++ b/packages/carousel/package.json @@ -1,7 +1,7 @@ { "name": "@tecsinapse/carousel", "description": "TecSinapse Carousel", - "version": "2.7.5", + "version": "2.7.7-alpha.0", "main": "build/index.js", "module": "build/index.js", "author": { @@ -23,7 +23,7 @@ "ui-kit" ], "dependencies": { - "@tecsinapse/ui-kit": "^5.7.5", + "@tecsinapse/ui-kit": "^5.7.7-alpha.0", "material-ui-dots": "^2.0.2", "react-swipeable-views": "^0.13.9", "react-swipeable-views-utils": "^0.13.9" diff --git a/packages/pickers/package.json b/packages/pickers/package.json index b0d55fa9..470d9bdd 100644 --- a/packages/pickers/package.json +++ b/packages/pickers/package.json @@ -1,7 +1,7 @@ { "name": "@tecsinapse/pickers", "description": "TecSinapse Pickers", - "version": "2.9.5", + "version": "2.9.7-alpha.0", "main": "build/index.js", "typings": "build/index.d.ts", "author": { @@ -28,7 +28,7 @@ "@date-io/date-fns": "^1.3.13", "@material-ui/pickers": "^3.2.10", "@tecsinapse/material-ui-color-picker": "^4.4.0", - "@tecsinapse/ui-kit": "^5.7.5", + "@tecsinapse/ui-kit": "^5.7.7-alpha.0", "date-fns": "^2.28.0" }, "files": [ diff --git a/packages/table/package.json b/packages/table/package.json index f27930b5..b5b230ec 100644 --- a/packages/table/package.json +++ b/packages/table/package.json @@ -1,7 +1,7 @@ { "name": "@tecsinapse/table", "description": "TecSinapse Table", - "version": "4.1.5", + "version": "4.1.7-alpha.0", "main": "build/index.js", "typings": "build/index.d.ts", "author": { @@ -23,7 +23,7 @@ "ui-kit" ], "dependencies": { - "@tecsinapse/ui-kit": "^5.7.5", + "@tecsinapse/ui-kit": "^5.7.7-alpha.0", "react-virtualized": "^9.22.3" }, "files": [ diff --git a/packages/ui-kit/package.json b/packages/ui-kit/package.json index c9100713..80d52d14 100644 --- a/packages/ui-kit/package.json +++ b/packages/ui-kit/package.json @@ -1,7 +1,7 @@ { "name": "@tecsinapse/ui-kit", "description": "TecSinapse UI-KIT", - "version": "5.7.5", + "version": "5.7.7-alpha.0", "main": "build/index.js", "module": "build/index.js", "repository": { diff --git a/packages/ui-kit/src/components/MessagePreview/MessagePreview.d.ts b/packages/ui-kit/src/components/MessagePreview/MessagePreview.d.ts index 04035b88..495f4087 100644 --- a/packages/ui-kit/src/components/MessagePreview/MessagePreview.d.ts +++ b/packages/ui-kit/src/components/MessagePreview/MessagePreview.d.ts @@ -1,8 +1,9 @@ import { FC } from 'react'; export interface MessagePreviewProps { - unformattedText: string - buttons?: [object]; + unformattedText: string, + buttons?: [object], + sections?: [object], media?: string | undefined | null, header?: string | undefined | null, footer?: string | undefined | null, diff --git a/packages/ui-kit/src/components/MessagePreview/MessagePreview.js b/packages/ui-kit/src/components/MessagePreview/MessagePreview.js index d7863f0a..8f50b90c 100644 --- a/packages/ui-kit/src/components/MessagePreview/MessagePreview.js +++ b/packages/ui-kit/src/components/MessagePreview/MessagePreview.js @@ -7,12 +7,15 @@ import { cardStyle } from './styles'; import { MessagePreviewUtils } from './utils'; import { MessageButtons } from './components/MessageButtons'; import { PreviewHeader } from './components/PreviewHeader'; +import { ListItens } from './components/ListItens'; +import Divider from '../Divider'; const useStyles = makeStyles(cardStyle); export const MessagePreview = ({ unformattedText, buttons, + sections, media, header, footer, @@ -53,6 +56,12 @@ export const MessagePreview = ({
{footer &&
{footer}
}
{currentTime()}
+ {sections?.length > 0 && buttons?.length === 0 && ( + + + + + )}
@@ -71,6 +80,8 @@ MessagePreview.propTypes = { unformattedText: PropTypes.string.isRequired, /** array of buttons that should be displayed */ buttons: PropTypes.array, + /** array of list items that should be displayed */ + sections: PropTypes.array, /** media link */ media: PropTypes.string, /** message header */ @@ -81,6 +92,7 @@ MessagePreview.propTypes = { MessagePreview.defaultProps = { buttons: [], + sections: [], media: undefined, header: undefined, footer: undefined, diff --git a/packages/ui-kit/src/components/MessagePreview/components/ListItens.js b/packages/ui-kit/src/components/MessagePreview/components/ListItens.js new file mode 100644 index 00000000..6eed1a78 --- /dev/null +++ b/packages/ui-kit/src/components/MessagePreview/components/ListItens.js @@ -0,0 +1,13 @@ +import React from 'react'; +import { Grid, Typography } from '@material-ui/core'; +import { mdiFormatListBulletedSquare } from '@mdi/js'; +import Icon from '@mdi/react'; + +export const ListItens = ({ sections, classes }) => ( + +
+ + Ver Opções +
+
+); diff --git a/packages/ui-kit/src/components/MessagePreview/styles.js b/packages/ui-kit/src/components/MessagePreview/styles.js index 9cb1e850..706452d2 100644 --- a/packages/ui-kit/src/components/MessagePreview/styles.js +++ b/packages/ui-kit/src/components/MessagePreview/styles.js @@ -43,7 +43,7 @@ export const cardStyle = () => ({ display: 'flex', flexDirection: 'column', alignItems: 'flex-start', - padding: '10px', + padding: '10px 10px 0px 10px', gap: '10px', background: '#ffffff', borderRadius: '0px 6px 6px 6px', @@ -84,8 +84,10 @@ export const cardStyle = () => ({ order: 1, alignSelf: 'stretch', }, + listButton: { + width: '100%', + }, textTime: { - marginBottom: '-5px', fontSize: '9px', lineHeight: '11px', alignItems: 'center', diff --git a/packages/ui-kit/stories/MessagePreview/MessagePreview.story.tsx b/packages/ui-kit/stories/MessagePreview/MessagePreview.story.tsx index 44b0202e..508c7315 100644 --- a/packages/ui-kit/stories/MessagePreview/MessagePreview.story.tsx +++ b/packages/ui-kit/stories/MessagePreview/MessagePreview.story.tsx @@ -31,7 +31,7 @@ export default { }; export const Base = args => { - const { unformattedText, buttons, media, header, footer } = args; + const { unformattedText, buttons, sections, media, header, footer } = args; return ( @@ -47,6 +47,7 @@ export const Base = args => { unformattedText={unformattedText} buttons={buttons} media={media} + sections={sections} header={header} footer={footer} /> @@ -75,6 +76,13 @@ Base.args = { description: 'Encerrar', }, ], + sections: [ + { + position: 1, + title: 'Título do item na lista', + description: 'Descrição do item da lista', + } + ], media: 'https://cdn.portaltecsinapse.com.br/src/chat-component/template-image-example.jpg', header: undefined, diff --git a/packages/uploader/package.json b/packages/uploader/package.json index c716db81..8c3e2e9c 100644 --- a/packages/uploader/package.json +++ b/packages/uploader/package.json @@ -1,7 +1,7 @@ { "name": "@tecsinapse/uploader", "description": "TecSinapse Uploader", - "version": "2.7.5", + "version": "2.7.7-alpha.0", "main": "build/index.js", "typings": "build/index.d.js", "author": { @@ -23,7 +23,7 @@ "uploader" ], "dependencies": { - "@tecsinapse/ui-kit": "^5.7.5", + "@tecsinapse/ui-kit": "^5.7.7-alpha.0", "react-dropzone": "^11.3.1", "uniqid": "^5.3.0" }, diff --git a/packages/wizard/package.json b/packages/wizard/package.json index 0e2fdb34..806f1257 100644 --- a/packages/wizard/package.json +++ b/packages/wizard/package.json @@ -1,7 +1,7 @@ { "name": "@tecsinapse/wizard", "description": "TecSinapse Wizard", - "version": "3.7.5", + "version": "3.7.7-alpha.0", "main": "build/index.js", "typings": "build/index.d.ts", "author": { @@ -23,7 +23,7 @@ "wizard" ], "dependencies": { - "@tecsinapse/ui-kit": "^5.7.5" + "@tecsinapse/ui-kit": "^5.7.7-alpha.0" }, "files": [ "build",