mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-14 18:01:06 +00:00
feat(modal): support 3-button Modal, ComposedModal (#724)
* feat(modal): support 3-button modal #528, #472 * fix(modal): "supercede" --> "supersede" * test(modal): test secondaryButtons prop, updated click:button--secondary custom event * docs(modal): add multiple secondary button example for ComposedModal * docs(modal): rename example * fix(modal): do not render secondary button if secondaryButtonText is falsy * docs(composed-modal): add button to re-open modal
This commit is contained in:
parent
a62e9c0c3c
commit
f4a3646cb4
12 changed files with 230 additions and 50 deletions
9
types/ComposedModal/ModalFooter.d.ts
vendored
9
types/ComposedModal/ModalFooter.d.ts
vendored
|
@ -26,6 +26,13 @@ export interface ModalFooterProps
|
|||
*/
|
||||
secondaryButtonText?: string;
|
||||
|
||||
/**
|
||||
* 2-tuple prop to render two secondary buttons for a 3 button modal
|
||||
* supersedes `secondaryButtonText`
|
||||
* @default []
|
||||
*/
|
||||
secondaryButtons?: [{ text: string }, { text: string }];
|
||||
|
||||
/**
|
||||
* Specify a class for the secondary button
|
||||
*/
|
||||
|
@ -40,6 +47,6 @@ export interface ModalFooterProps
|
|||
|
||||
export default class ModalFooter extends SvelteComponentTyped<
|
||||
ModalFooterProps,
|
||||
{},
|
||||
{ ["click:button--secondary"]: CustomEvent<{ text: string }> },
|
||||
{ default: {} }
|
||||
> {}
|
||||
|
|
9
types/Modal/Modal.d.ts
vendored
9
types/Modal/Modal.d.ts
vendored
|
@ -89,6 +89,13 @@ export interface ModalProps
|
|||
*/
|
||||
secondaryButtonText?: string;
|
||||
|
||||
/**
|
||||
* 2-tuple prop to render two secondary buttons for a 3 button modal
|
||||
* supersedes `secondaryButtonText`
|
||||
* @default []
|
||||
*/
|
||||
secondaryButtons?: [{ text: string }, { text: string }];
|
||||
|
||||
/**
|
||||
* Specify a selector to be focused when opening the modal
|
||||
* @default "[data-modal-primary-focus]"
|
||||
|
@ -118,13 +125,13 @@ export default class Modal extends SvelteComponentTyped<
|
|||
ModalProps,
|
||||
{
|
||||
transitionend: CustomEvent<{ open: boolean }>;
|
||||
["click:button--secondary"]: CustomEvent<{ text: string }>;
|
||||
keydown: WindowEventMap["keydown"];
|
||||
click: WindowEventMap["click"];
|
||||
mouseover: WindowEventMap["mouseover"];
|
||||
mouseenter: WindowEventMap["mouseenter"];
|
||||
mouseleave: WindowEventMap["mouseleave"];
|
||||
submit: CustomEvent<any>;
|
||||
["click:button--secondary"]: CustomEvent<any>;
|
||||
close: CustomEvent<any>;
|
||||
open: CustomEvent<any>;
|
||||
},
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue