square / maker

Maker Design System by Square
https://square.github.io/maker/styleguide/latest-stable/
Other
63 stars 14 forks source link

Add an afterCloseHook to Dialogs #379

Closed tatems closed 2 years ago

tatems commented 2 years ago

Feature request

Similar to the current beforeCloseHook option, this would fire when the dialog/modal has been fully dismissed.

As an extension of #378, it would also accept the same closeData.

// in the dialog/modal
export default {
  ...
  methods: {
    handleClose() {
      this.dialogApi.close(this.someInternalState);
    },
  },
};

// in the opening parent component
export default {
  methods: {
        openDialog() {
            this.dialogApi.open(SomeDialogComponent, {
                beforeCloseHook(closeData) {
                    return closeData !== SOME_FLAG_TO_BLOCK_CLOSING;
                },

                afterCloseHook(closeData) {
                    if (closeData === SOME_FLAG_A) {
                        this.performActionA();
                    } else if (closeData === SOME_FLAG_B) {
                        this.performActionB();
                    }
                },
            });
        }
    }
};

Why?

It would be handy to have a callback function that does not block the actual closing of a dialog/modal. This would allow consumers to kick off async functions without causing the dialog to stay open.

Alternatives

No response

Additional context

I am willing to open a PR with this (I have a POC ready with the one for #378)

pretzelhammer commented 2 years ago

this sounds reasonable to me, and your draft POC PR looks pretty good, if you wanna iterate on it a little more and mark it ready for review I can review/approve it

github-actions[bot] commented 2 years ago

:tada: This issue has been resolved in version 12.3.0 :tada:

The release is available on:

Your semantic-release bot :package::rocket: