2.5.5 • Published 1 month ago
@megafon/ui-helpers v2.5.5
@megafon/ui-helpers
Helpers library
Installation
with npm
npm install --save @megafon/ui-helpers
or yarn
yarn add @megafon/ui-helpers
Usage
cnCreate
BEM generator
import { cnCreate } from '@megafon/ui-helpers';
const cn = cnCreate('block');
cn();
// block
cn('element');
// block__element
cn({ mod: true });
// block block_mod
cn({ mod: 'value' });
// block block_mod_value
cn(['custom-class', 'custom-class-2']);
// block custom-class custom-class-2
cn('element', ['custom-class', 'custom-class-2']);
// block__element custom-class custom-class-2
cn('element', { mod: true }, ['custom-class', 'custom-class-2']);
// block__element block__element_mod custom-class custom-class-2
convert
htmr library extension for replacing html tags with your own components, recognizing components props and html attributes
requires React as dependency
import React from 'react';
import { convert, ConvertTransformConfig } from '@megafon/ui-helpers';
const Link = ({ href, target, className, children }) => (
<a className={className} href={href} target={target}>{children}</a>
);
const config: ConvertTransformConfig = {
a: {
component: Link,
props: ['href', 'target'],
customProps: { className: 'class-name' },
},
};
convert('<a href="/test" target="_blank">link</a>', config);
// <Link className="class-name" href="/test" target="_blank">link</Link>'
filterDataAttrs
Filters properties using regular expression /^data-/
import { filterDataAttrs } from '@megafon/ui-helpers';
filterDataAttrs({
'data-attr': 'value',
'data-custom-attr': 'value',
'DataAttr': 'value',
'attr-data': 'value'
});
// { 'data-attr': 'value', 'data-custom-attr': 'value' }
detectTouch
Detects touch devices
import { detectTouch } from '@megafon/ui-helpers';
detectTouch()
// returns `true` or `false` depending on device
2.5.5
1 month ago
2.5.4
5 months ago
2.5.2
9 months ago
2.5.1
10 months ago
2.5.3
8 months ago
2.5.0
12 months ago
2.4.0
1 year ago
2.3.1
1 year ago
2.3.0
2 years ago
2.2.0
2 years ago
2.1.2
2 years ago
2.1.1
2 years ago
2.1.0
2 years ago
2.0.0-beta.2
2 years ago
2.0.0-beta.1
2 years ago
2.0.0-beta.0
2 years ago
2.0.1
2 years ago
2.0.0-beta.4
2 years ago
2.0.0
2 years ago
2.0.0-beta.3
2 years ago
1.0.0
2 years ago
1.0.0-beta.2
3 years ago
1.0.0-beta.1
3 years ago
1.0.0-beta.0
3 years ago