mirror of
				https://github.com/lingble/chatwoot.git
				synced 2025-10-31 19:17:48 +00:00 
			
		
		
		
	 d21c1c773b
			
		
	
	d21c1c773b
	
	
	
		
			
			* feat: Ability to add label for contact page Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com> Co-authored-by: Pranav Raj S <pranav@chatwoot.com> Co-authored-by: Nithin David Thomas <webofnithin@gmail.com>
		
			
				
	
	
		
			68 lines
		
	
	
		
			1.2 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			68 lines
		
	
	
		
			1.2 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| import { action } from '@storybook/addon-actions';
 | |
| import LabelSelector from './LabelSelector';
 | |
| 
 | |
| export default {
 | |
|   title: 'Components/Label/Contact Label',
 | |
|   component: LabelSelector,
 | |
|   argTypes: {
 | |
|     contactId: {
 | |
|       control: {
 | |
|         type: 'text ,number',
 | |
|       },
 | |
|     },
 | |
|   },
 | |
| };
 | |
| 
 | |
| const Template = (args, { argTypes }) => ({
 | |
|   props: Object.keys(argTypes),
 | |
|   components: { LabelSelector },
 | |
|   template:
 | |
|     '<label-selector v-bind="$props" @add="onAdd" @remove="onRemove"></label-selector>',
 | |
| });
 | |
| 
 | |
| export const ContactLabel = Template.bind({});
 | |
| ContactLabel.args = {
 | |
|   onAdd: action('Added'),
 | |
|   onRemove: action('Removed'),
 | |
|   allLabels: [
 | |
|     {
 | |
|       id: '1',
 | |
|       title: 'sales',
 | |
|       description: '',
 | |
|       color: '#0a5dd1',
 | |
|     },
 | |
|     {
 | |
|       id: '2',
 | |
|       title: 'refund',
 | |
|       description: '',
 | |
|       color: '#8442f5',
 | |
|     },
 | |
|     {
 | |
|       id: '3',
 | |
|       title: 'testing',
 | |
|       description: '',
 | |
|       color: '#f542f5',
 | |
|     },
 | |
|     {
 | |
|       id: '4',
 | |
|       title: 'scheduled',
 | |
|       description: '',
 | |
|       color: '#42d1f5',
 | |
|     },
 | |
|   ],
 | |
|   savedLabels: [
 | |
|     {
 | |
|       id: '2',
 | |
|       title: 'refund',
 | |
|       description: '',
 | |
|       color: '#8442f5',
 | |
|     },
 | |
|     {
 | |
|       id: '4',
 | |
|       title: 'scheduled',
 | |
|       description: '',
 | |
|       color: '#42d1f5',
 | |
|     },
 | |
|   ],
 | |
| };
 |