mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 02:11:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(modal): shouldSubmitOnEnter should also dispatch "click:button--primary" (#1007)

Browse source 
* fix(modal): shouldSubmitOnEnter should also dispatch "click:button--primary"

Fixes #1005

* yarn build:lib
This commit is contained in:
Eric Liu 2022-01-14 08:51:48 -10:00 • committed by GitHub
commit 49a94b0ee4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 30 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

4
COMPONENT_INDEX.md
View file

@ -2277,7 +2277,7 @@ None.
### Props ### Props
| Prop name | Kind | Reactive | Type | Default value | Description | | Prop name | Kind | Reactive | Type | Default value | Description |
| :------------------------- | :--------------- | :------- | :-------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------- | | :------------------------- | :--------------- | :------- | :-------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------- |
| ref | <code>let</code> | Yes | <code>null &#124; HTMLDivElement</code> | <code>null</code> | Obtain a reference to the top-level HTML element | | ref | <code>let</code> | Yes | <code>null &#124; HTMLDivElement</code> | <code>null</code> | Obtain a reference to the top-level HTML element |
| open | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the modal | | open | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the modal |
| size | <code>let</code> | No | <code>"xs" &#124; "sm" &#124; "lg"</code> | -- | Set the size of the modal | | size | <code>let</code> | No | <code>"xs" &#124; "sm" &#124; "lg"</code> | -- | Set the size of the modal |
@ -2292,7 +2292,7 @@ None.
| hasScrollingContent | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` if the modal contains scrolling content | | hasScrollingContent | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` if the modal contains scrolling content |
| primaryButtonText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the primary button text | | primaryButtonText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the primary button text |
| primaryButtonDisabled | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the primary button | | primaryButtonDisabled | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the primary button |
| shouldSubmitOnEnter | <code>let</code> | No | <code>boolean</code> | <code>true</code> | Set to `true` for the primary button to be triggered when pressing "Enter" | | shouldSubmitOnEnter | <code>let</code> | No | <code>boolean</code> | <code>true</code> | Set to `true` for the "submit" and "click:button--primary" events<br />to be dispatched when pressing "Enter" |
| secondaryButtonText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the secondary button text | | secondaryButtonText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the secondary button text |
| secondaryButtons | <code>let</code> | No | <code>[{ text: string; }, { text: string; }]</code> | <code>[]</code> | 2-tuple prop to render two secondary buttons for a 3 button modal<br />supersedes `secondaryButtonText` | | secondaryButtons | <code>let</code> | No | <code>[{ text: string; }, { text: string; }]</code> | <code>[]</code> | 2-tuple prop to render two secondary buttons for a 3 button modal<br />supersedes `secondaryButtonText` |
| selectorPrimaryFocus | <code>let</code> | No | <code>string</code> | <code>"[data-modal-primary-focus]"</code> | Specify a selector to be focused when opening the modal | | selectorPrimaryFocus | <code>let</code> | No | <code>string</code> | <code>"[data-modal-primary-focus]"</code> | Specify a selector to be focused when opening the modal |

2
docs/src/COMPONENT_API.json
View file

@ -6041,7 +6041,7 @@
{ {
"name": "shouldSubmitOnEnter", "name": "shouldSubmitOnEnter",
"kind": "let", "kind": "let",
"description": "Set to `true` for the primary button to be triggered when pressing \"Enter\"", "description": "Set to `true` for the \"submit\" and \"click:button--primary\" events\nto be dispatched when pressing \"Enter\"",
"type": "boolean", "type": "boolean",
"value": "true", "value": "true",
"isFunction": false, "isFunction": false,

6
src/Modal/Modal.svelte
View file

@ -55,7 +55,10 @@
/** Set to `true` to disable the primary button */ /** Set to `true` to disable the primary button */
export let primaryButtonDisabled = false; export let primaryButtonDisabled = false;
/** Set to `true` for the primary button to be triggered when pressing "Enter" */ /**
* Set to `true` for the "submit" and "click:button--primary" events
* to be dispatched when pressing "Enter"
*/
export let shouldSubmitOnEnter = true; export let shouldSubmitOnEnter = true;
/** Specify the secondary button text */ /** Specify the secondary button text */
@ -174,6 +177,7 @@
e.preventDefault(); e.preventDefault();
} else if (shouldSubmitOnEnter && e.key === 'Enter') { } else if (shouldSubmitOnEnter && e.key === 'Enter') {
dispatch('submit'); dispatch('submit');
dispatch('click:button--primary');
} }
} }
}}" }}"

3
types/Modal/Modal.svelte.d.ts vendored
View file

@ -78,7 +78,8 @@ export interface ModalProps
primaryButtonDisabled?: boolean; primaryButtonDisabled?: boolean;
/** /**
* Set to `true` for the primary button to be triggered when pressing "Enter" * Set to `true` for the "submit" and "click:button--primary" events
* to be dispatched when pressing "Enter"
* @default true * @default true
*/ */
shouldSubmitOnEnter?: boolean; shouldSubmitOnEnter?: boolean;