You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

39 lines
998 B

import React, { Component } from 'react';
import Carousel from 'react-elastic-carousel';
import './index.scss';
export default function Keyboard({ options, action }) {
options = options.length ? options : [[{ text: 'اشتباه' }]];
return (
<div className="chat-suggest portrait-slider d-flex flex-column">
<Carousel itemsToShow={1} isRTL={true} enableTilt={true} showArrows={false}>
{options.map((row, i) => (
<Row row={row} key={i} action={action} />
))}
</Carousel>
</div>
);
}
const Row = ({ row, action }) => {
return (
<div className="chat-suggest__row d-flex">
{row.map((item, i) => (
<KeyboardItem item={item} key={i} action={action} />
))}
</div>
);
};
const KeyboardItem = ({ item, action }) => {
return (
<div
className="chat-suggest__row--item d-flex"
style={{ cursor: 'pointer' }}
onClick={() => {
action(item);
}}
>
{item.text}
</div>
);
};