Merge pull request #417 from dcos-labs/mp/toggleinputlist-onchange-la…

…stselected feat(toggleinputlist): passes last selected item as 2nd onChange param
d2iq · Oct 15, 2019 · 91d7cb5 · 91d7cb5
2 parents 4a9c7d0 + f756d58
commit 91d7cb5
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 6 deletions.
diff --git a/packages/toggleInputList/components/ToggleInputList.tsx b/packages/toggleInputList/components/ToggleInputList.tsx
@@ -43,9 +43,9 @@ export interface ToggleInputListProps {
    */
   listLabel: React.ReactNode | string;
   /**
-   * Callback for when a user makes a selection. Passes a list of selected items as parameter
+   * Callback for when a user makes a selection
    */
-  onChange?: (selectedItems: string[]) => void;
+  onChange?: (selectedItems: string[], affectedItem?: string) => void;
   /**
    * Defaults to `true`, but can be set to `false` to visibly hide the content passed to `listLabel`. The `listLabel` should still be set even when hidden for accessibility support.
    */
@@ -134,7 +134,7 @@ class ToggleInputList extends React.PureComponent<ToggleInputListProps, {}> {
 
       const handleChange = e => {
         if (onChange) {
-          onChange(this.getSelectedItems(value, e.target.checked));
+          onChange(this.getSelectedItems(value, e.target.checked), value);
         }
       };
 

diff --git a/packages/toggleInputList/tests/ToggleInputList.test.tsx b/packages/toggleInputList/tests/ToggleInputList.test.tsx
@@ -87,7 +87,7 @@ describe("ToggleInputList", () => {
     expect(toJson(component)).toMatchSnapshot();
   });
 
-  it("calls onChange prop with the selected values", () => {
+  it("calls onChange prop with all selected values and the last selected value", () => {
     const onChangeFn = jest.fn();
     const component = mount(
       <ToggleInputList
@@ -101,8 +101,11 @@ describe("ToggleInputList", () => {
 
     expect(onChangeFn).not.toHaveBeenCalled();
     checkbox.simulate("change", { target: { checked: true } });
-    expect(onChangeFn).toHaveBeenCalledWith([checkbox.prop("value")]);
+    expect(onChangeFn).toHaveBeenCalledWith(
+      [checkbox.prop("value")],
+      checkbox.prop("value")
+    );
     checkbox.simulate("change", { target: { checked: false } });
-    expect(onChangeFn).toHaveBeenCalledWith([]);
+    expect(onChangeFn).toHaveBeenCalledWith([], checkbox.prop("value"));
   });
 });