mirror of
https://github.com/hanzoai/cd-ui.git
synced 2026-10-30 20:42:45 +00:00
Jiwon LeeandGitHub
69ffdf6687
* feat: add wildcard search support to autocomplete component Signed-off-by: jiwlee <[email protected]> * feat: add wildcard filter option to AutoComplete in Storybook Signed-off-by: jiwlee <[email protected]> * chore: add [email protected] Signed-off-by: jiwlee <[email protected]> * refactor: replace manual regex with minimatch for pattern matching Signed-off-by: jiwlee <[email protected]> * feat: apply minimatch when props.wildcard is true Signed-off-by: jiwlee <[email protected]> * feat: update autocomplete to use glob options instead of wildcard Signed-off-by: jiwlee <[email protected]> * chore: update autocomplete story to use a predefined list of items Signed-off-by: jiwlee <[email protected]> --------- Signed-off-by: jiwlee <[email protected]>
51 lines
1.2 KiB
TypeScript
51 lines
1.2 KiB
TypeScript
import * as React from 'react';
|
|
import {Autocomplete} from './autocomplete';
|
|
|
|
export default {
|
|
title: 'Components/Autocomplete',
|
|
component: Autocomplete,
|
|
argTypes: {
|
|
onItemClick: {action: 'itemClicked'},
|
|
items: {control: {type: 'object'}},
|
|
inputStyle: {control: {disable: true}},
|
|
placeholder: {control: {type: 'text'}},
|
|
glob: {control: {type: 'boolean'}},
|
|
},
|
|
};
|
|
|
|
export const Primary = (args: any) => {
|
|
const [input, setInput] = React.useState('');
|
|
|
|
const items = [
|
|
'User',
|
|
'AppServer',
|
|
'AuthService',
|
|
'Backend',
|
|
'Cache',
|
|
'Config',
|
|
'Database',
|
|
'Frontend',
|
|
'Logger',
|
|
'utils.js',
|
|
'data-01.csv',
|
|
'data-02.csv',
|
|
'data-final.csv',
|
|
'src/index.js',
|
|
'src/components/Button.js',
|
|
'src/components/Input.ts',
|
|
'test/app.test.js',
|
|
'.env',
|
|
'README.md',
|
|
];
|
|
|
|
return (
|
|
<div style={{width: '50%', paddingBottom: '6em'}}>
|
|
<Autocomplete {...args} items={items} value={input} onChange={(e) => setInput(e.target.value)} />
|
|
</div>
|
|
);
|
|
};
|
|
|
|
Primary.args = {
|
|
placeholder: 'Type something here',
|
|
};
|