isomtrik-quickchat
Version:
isomtrik-quickchat is a lightweight, real-time chat component built with Stencil JS. It is designed to be seamlessly integrated into web applications, offering customizable and responsive chat functionalities. The module supports both CommonJS and ES modu
82 lines (73 loc) • 2.12 kB
JavaScript
import { Text } from './Text';
export default {
title: 'Atoms/Text',
tags: ['autodocs'],
render: (args) => Text(args),
argTypes: {
content: { control: 'text' },
color: { control: 'color' },
fontSize: { control: 'text' },
textAlign: { control: 'select', options: ['left', 'center', 'right', 'justify'] },
fontWeight: { control: 'select', options: ['normal', 'bold', 'bolder', 'lighter'] },
fontStyle: { control: 'select', options: ['normal', 'italic', 'oblique'] },
backgroundColor: { control: 'color' },
borderColor: { control: 'color' },
borderWidth: { control: 'text' },
borderStyle: { control: 'select', options: ['solid', 'dashed', 'dotted', 'double', 'groove'] },
borderRadius: { control: 'text' },
fontFamily: { control: 'text' },
width: {control: 'text'},
height: { control: 'text' },
},
args: {
content: 'Sample Text',
color: 'black',
fontSize: '16px',
textAlign: 'center',
fontWeight: 'normal',
fontStyle: 'normal',
backgroundColor: 'transparent',
borderColor: 'black',
borderWidth: '1px',
borderStyle: 'solid',
borderRadius: '4px',
fontFamily: '',
width:'80%',
height: 'auto',
},
};
export const Default = {
args:{
content:"Will get you them in a bit.",
color:'#000000',
fontSize:"14px",
textAlign:"right",
fontWeight:'normal',
fontStyle:'normal',
backgroundColor:'transparent',
borderColor:'black',
borderWidth:'1px',
borderStyle:"solid",
borderRadius:'4px',
fontFamily:'',
width:'110%',
height:"50px",
},
};
export const Custom = {
args:{
content:"Need some photos. It will be helpful to assess the workload",
color:'black',
fontSize:'14px',
textAlign:"left",
fontWeight:"normal",
fontStyle:"normal",
backgroundColor:'#EFF1FA',
borderColor:'#EFF1FA',
borderWidth:"5px",
borderStyle:'solid',
borderRadius:'8px',
fontFamily:'Arial, sans-serif',
width:'90%',
},
};