diff --git a/docs/api/index.md b/docs/api/index.md index 0130357..dcb14d2 100644 --- a/docs/api/index.md +++ b/docs/api/index.md @@ -31,6 +31,7 @@ interface HandlerBaseProps { onOpen?: DropdownOnOpenHandler | undefined; onClose?: DropdownOnOpenHandler | undefined; onToggle?: DropdownOnToggleHandler | undefined; + disabled?: boolean | undefined; toggleOnHeaderClick?: boolean | undefined; closeOnOutsideClick?: boolean | undefined; closeOnSectionClick?: boolean | undefined; @@ -47,6 +48,7 @@ interface HandlerBaseProps { | onOpen | DropdownOnOpenHandler | undefined | true | | onClose | DropdownOnOpenHandler | undefined | true | | onToggle | DropdownOnToggleHandler | undefined | true | +| disabled | boolean | undefined | true | | toggleOnHeaderClick | boolean | undefined | true | | closeOnOutsideClick | boolean | undefined | true | | closeOnSectionClick | boolean | undefined | true | diff --git a/docs/api/index/handlerbase.md b/docs/api/index/handlerbase.md index 8cc9d17..d27b694 100644 --- a/docs/api/index/handlerbase.md +++ b/docs/api/index/handlerbase.md @@ -123,7 +123,7 @@ void ### onOutsideClick(event) -Handles window click event. +Handles outside click. ```typescript protected onOutsideClick(event: MouseEvent): void; diff --git a/src/__tests__/index.test.tsx b/src/__tests__/index.test.tsx index 2f00c13..97a3e9e 100644 --- a/src/__tests__/index.test.tsx +++ b/src/__tests__/index.test.tsx @@ -52,3 +52,30 @@ it("does not open when clicked on header if handler is controlled.", () => { const handlerState: HandlerBaseState = dropdown.state(); expect(handlerState.isOpen).toBe(false); }); + +it("does not open when clicked on header if dropdown is disabled.", () => { + const dropdown = mount( + + Header + Section + + ); + dropdown.find("div#header").simulate("click"); + + const handlerState: HandlerBaseState = dropdown.state(); + expect(handlerState.isOpen).toBe(false); +}); + +it("does not trigger callback when clicked on header if dropdown is disabled.", () => { + const stub = jest.fn(); + const dropdown = mount( + + Header + Section + + ); + dropdown.find("div#header").simulate("click"); + + const handlerState: HandlerBaseState = dropdown.state(); + expect(stub).not.toBeCalled(); +}); diff --git a/src/abstractions/handler-base.ts b/src/abstractions/handler-base.ts index 755e463..b6e38cb 100644 --- a/src/abstractions/handler-base.ts +++ b/src/abstractions/handler-base.ts @@ -10,6 +10,7 @@ export interface HandlerBaseProps { onOpen?: DropdownOnOpenHandler; onClose?: DropdownOnOpenHandler; onToggle?: DropdownOnToggleHandler; + disabled?: boolean; toggleOnHeaderClick?: boolean; closeOnOutsideClick?: boolean; closeOnSectionClick?: boolean; @@ -166,6 +167,10 @@ export abstract class HandlerBase< * Triggers all callbacks: onOpen, onClose and onToggle. */ protected triggerCallbacks(isOpen: boolean, source: EventSource): void { + if (this.props.disabled) { + return; + } + if (isOpen && this.props.onOpen != null) { this.props.onOpen(source); } @@ -181,7 +186,7 @@ export abstract class HandlerBase< * Updates state if dropdown is not controlled. */ protected updateOpenState(isOpen: boolean): void { - if (this.state.isOpen !== isOpen && !this.isControlled()) { + if (this.state.isOpen !== isOpen && !this.isControlled() && !this.props.disabled) { this.setState((state: HandlerBaseState) => ({ ...state, isOpen: isOpen @@ -229,11 +234,8 @@ export abstract class HandlerBase< return; } - this.setState((state: HandlerBaseState) => ({ - ...state, - isOpen: true - })); this.triggerCallbacks(true, EventSource.ManualTrigger); + this.updateOpenState(true); } /** @@ -244,11 +246,8 @@ export abstract class HandlerBase< return; } - this.setState((state: HandlerBaseState) => ({ - ...state, - isOpen: false - })); this.triggerCallbacks(false, EventSource.ManualTrigger); + this.updateOpenState(false); } //#endregion }