🎯 Add with-target-checked

Author: himynameisdave

docs/with-target-checked.md

@@ -0,0 +1,34 @@
+### withTargetChecked
+
+Calls your provided event handler function with `event.target.checked` as the first value (if it exists). Passes the `event` along as the second argument in case you need it. 
+
+**Vanilla**
+
+```js
+import { withTargetChecked } from "browser-event-utils";
+
+myInputNode.addEventListener(
+  "change",
+  withTargetChecked((checked, event) => {
+    // 👈 Note that you still get the event object if you need it
+    //  ...handle input change event...
+  })
+);
+```
+
+**React**
+
+```jsx
+import React, { Component } from "react";
+import { withTargetChecked } from "browser-event-utils";
+
+const handleCheck = withTargetChecked((checked, event) => {
+  console.log(`Checked! ${checked}`);
+});
+
+function MyInput() {
+  return <input type="checkbox" onChange={handleCheck} />;
+}
+```
+
+[![Edit with-target-value (React)](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/with-stop-immediate-propagation-react-st3fz?fontsize=14)

src/__tests__/with-target-checked.ts

@@ -0,0 +1,22 @@
+/* eslint-disable @typescript-eslint/explicit-function-return-type */
+import withTargetChecked from '../with-target-checked';
+
+
+describe('withTargetChecked', () => {
+    it('will not fall over if bad values are passed', () => {
+        expect(() => withTargetChecked()()).not.toThrow();
+    });
+    it('calls consumer function with undefined if event.target.checked does not exist', () => {
+        const mockConsumer = jest.fn();
+        const mockEvent = {};
+        withTargetChecked(mockConsumer)(mockEvent);
+        expect(mockConsumer).toHaveBeenCalledWith(undefined, mockEvent);
+    });
+    it('calls the consumer function with event.target.checked if it exists', () => {
+        const mockConsumer = jest.fn();
+        const mockIsChecked = true;
+        const mockEvent = { target: { checked: mockIsChecked } };
+        withTargetChecked(mockConsumer)(mockEvent);
+        expect(mockConsumer).toHaveBeenCalledWith(mockIsChecked, mockEvent);
+    });
+});

src/index.ts

@@ -1,5 +1,6 @@
 export { default as withPreventDefault } from './with-prevent-default';
 export { default as withStopPropagation } from './with-stop-propagation';
 export { default as withStopImmediatePropagation } from './with-stop-immediate-propagation';
+export { default as withTargetChecked } from './with-target-checked';
 export { default as withTargetValue } from './with-target-value';
 export { default as withKeyPress } from './with-keypress';

src/with-target-checked.ts

@@ -0,0 +1,16 @@
+import withTarget from './helpers/with-target';
+import noop from './helpers/noop';
+import { EventType, EventHandler } from './index.d';
+
+export type TWithTargetCheckedHandler = (value: string | null, event: EventType) => void;
+
+/**
+ *  Accepts a function, who's first argument is event.target.checked (if exists),
+ *  followed by the full event object.
+ *
+ *  @param {Function} fn - Consumer's handler function
+ *  @return {Function} - event handler function
+ */
+const withTargetChecked = (fn: TWithTargetCheckedHandler = noop): EventHandler => withTarget((target, event): void => fn(target?.checked, event));
+
+export default withTargetChecked;