diff --git a/src/pickAttrs.ts b/src/pickAttrs.ts index 07b70f78..70dea0b9 100644 --- a/src/pickAttrs.ts +++ b/src/pickAttrs.ts @@ -29,14 +29,47 @@ function match(key: string, prefix: string) { return key.indexOf(prefix) === 0; } -export default function pickAttrs(props: object, ariaOnly = false) { +export interface PickConfig { + aria?: boolean; + data?: boolean; + attr?: boolean; +} + +/** + * Picker props from exist props with filter + * @param props Passed props + * @param ariaOnly boolean | { aria?: boolean; data?: boolean; attr?: boolean; } filter config + */ +export default function pickAttrs( + props: object, + ariaOnly: boolean | PickConfig = false, +) { + let mergedConfig: PickConfig; + if (ariaOnly === false) { + mergedConfig = { + aria: true, + data: true, + attr: true, + }; + } else if (ariaOnly === true) { + mergedConfig = { + aria: true, + }; + } else { + mergedConfig = { + ...ariaOnly, + }; + } + const attrs = {}; Object.keys(props).forEach(key => { - if (match(key, ariaPrefix)) { - attrs[key] = props[key]; - } else if ( - !ariaOnly && - (propList.includes(key) || match(key, dataPrefix)) + if ( + // Aria + (mergedConfig.aria && (key === 'role' || match(key, ariaPrefix))) || + // Data + (mergedConfig.data && match(key, dataPrefix)) || + // Attr + (mergedConfig.attr && propList.includes(key)) ) { attrs[key] = props[key]; } diff --git a/tests/utils.test.js b/tests/utils.test.js index 06db08a5..47841428 100644 --- a/tests/utils.test.js +++ b/tests/utils.test.js @@ -51,28 +51,47 @@ describe('utils', () => { ]); }); - it('pickAttrs', () => { - expect( - pickAttrs({ + describe('pickAttrs', () => { + const originProps = { + onClick: null, + checked: true, + 'data-my': 1, + 'aria-this': 2, + skip: true, + role: 'button', + }; + + it('default', () => { + expect(pickAttrs(originProps)).toEqual({ onClick: null, checked: true, 'data-my': 1, 'aria-this': 2, - skip: true, - }), - ).toEqual({ onClick: null, checked: true, 'data-my': 1, 'aria-this': 2 }); + role: 'button', + }); + }); - expect( - pickAttrs( - { - onClick: null, - checked: true, - 'data-my': 1, - 'aria-this': 2, - skip: true, - }, - true, - ), - ).toEqual({ 'aria-this': 2 }); + it('aria only', () => { + expect(pickAttrs(originProps, true)).toEqual({ + 'aria-this': 2, + role: 'button', + }); + }); + + it('attr only', () => { + expect(pickAttrs(originProps, { attr: true })).toEqual({ + onClick: null, + checked: true, + role: 'button', + }); + }); + + it('aria & data', () => { + expect(pickAttrs(originProps, { aria: true, data: true })).toEqual({ + 'data-my': 1, + 'aria-this': 2, + role: 'button', + }); + }); }); });