mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-22 05:03:44 +00:00
Allow modals to have button icons
This commit is contained in:
parent
f53b5472e5
commit
a46cd55d15
8 changed files with 67 additions and 0 deletions
|
@ -6073,6 +6073,17 @@
|
|||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "primaryButtonProps",
|
||||
"kind": "let",
|
||||
"description": "Specify the primary button props",
|
||||
"type": "ButtonProps",
|
||||
"value": "{}",
|
||||
"isFunction": false,
|
||||
"isFunctionDeclaration": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "shouldSubmitOnEnter",
|
||||
"kind": "let",
|
||||
|
@ -6237,6 +6248,17 @@
|
|||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "primaryButtonProps",
|
||||
"kind": "let",
|
||||
"description": "Specify the primary button props",
|
||||
"type": "ButtonProps",
|
||||
"value": "{}",
|
||||
"isFunction": false,
|
||||
"isFunctionDeclaration": false,
|
||||
"constant": false,
|
||||
"reactive": false
|
||||
},
|
||||
{
|
||||
"name": "primaryButtonDisabled",
|
||||
"kind": "let",
|
||||
|
|
|
@ -42,3 +42,6 @@ Use the `secondaryButtons` prop to render two secondary buttons for a "3-button
|
|||
|
||||
<FileSource src="/framed/Modal/ModalPreventOutsideClick" />
|
||||
|
||||
### Button with icon
|
||||
|
||||
<FileSource src="/framed/Modal/ModalButtonWithProps" />
|
||||
|
|
14
docs/src/pages/framed/Modal/ModalButtonWithProps.svelte
Normal file
14
docs/src/pages/framed/Modal/ModalButtonWithProps.svelte
Normal file
|
@ -0,0 +1,14 @@
|
|||
<script>
|
||||
import { Modal } from "carbon-components-svelte";
|
||||
import Send16 from "carbon-icons-svelte/lib/Send16";
|
||||
</script>
|
||||
|
||||
<Modal
|
||||
open
|
||||
modalHeading="Invite someone"
|
||||
primaryButtonText="Send invitation"
|
||||
primaryButtonProps="{{ icon: Send16 }}"
|
||||
secondaryButtonText="Cancel"
|
||||
>
|
||||
<p>Do you really want to invite someone?</p>
|
||||
</Modal>
|
Loading…
Add table
Add a link
Reference in a new issue