LSK – Tag

React component Tag and TagGroup

about

Installation and usage

The easiest way to use is to install it from npm and build it into your app with Webpack.

npm install @lskjs/tag

Then use it in your app:

import Tag from '@lskjs/tag';

const App = (
  <Tag variant="primary">Primary button</Tag>
);

For more examples and usage, please refer

• Tutorial

• Storybook

Examples

import Tag from '@lskjs/Tag/Tag';
import TagGroup from '@lskjs/Tag/TagGroup';
   <Tag />
      </Story>
    ))
    .add('<TagGroup />', () => (
      <Story>
        

export default () => (
  <>
    <Tag />
    <TagGroup>
      <Tag variant="primary">Primary Tag</Tag>
      <Tag variant="outline-secondary">Secondary Tag</Tag>
      <Tag as="input" type="submit" value="Submit Tag" />
      <Tag size="lg">Large Tag</Tag>
      <Tag block>Block Tag</Tag>
      <Tag active>Active Tag</Tag>
      <Tag disabled>Disabled Tag</Tag>
      <Tag type="primary" shape="circle" icon={<SearchOutlined />} />
    </TagGroup>
    <TagGroup
      options={[1, 2, 3, 4].map(value => ({ value, title: value }))}
      values={[1, 2]}
      nullValue="Не выбраны теги"
      closable
      onClose={item => console.log('onClose', item)}
      onClick={item => console.log('onClick', item)}
    />
  </>
)

See the more examples in Storybook.

More info

Links

• Docs
• Storybook
• Changelog
• Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.

Contact

• Email
• Telegram chat

Contributors ✨

Thanks goes to these wonderful people (emoji key):

License

This project is licensed under the MIT License - see the LICENSE file for details

Inspired by

• https://ant.design/components/tag/

Contributing

1. Fork it (https://github.com/yourname/yourproject/fork)
2. Create your feature branch (git checkout -b feature/fooBar)
3. Commit your changes (git commit -am 'Add some fooBar')
4. Push to the branch (git push origin feature/fooBar)
5. Create a new Pull Request