Skip to content

Commit 14047de

Browse files
committed
modal link click fix
1 parent 88c26a2 commit 14047de

File tree

2 files changed

+20
-10
lines changed

2 files changed

+20
-10
lines changed

components/SLDSModal/index.jsx

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -94,13 +94,23 @@ module.exports = React.createClass( {
9494
}
9595
},
9696

97+
handleModalClick(event) {
98+
if(event && event.stopPropagation){
99+
event.stopPropagation();
100+
}
101+
},
102+
97103
getModal() {
98-
return <div className={'slds-modal' +(this.state.revealed?' slds-fade-in-open':'')}
99-
onClick={this.closeModal}>
104+
return <div
105+
className={'slds-modal' +(this.state.revealed?' slds-fade-in-open':'')}
106+
style={{pointerEvents:'inherit'}}
107+
onClick={this.closeModal}
108+
>
100109
<div
101110
role='dialog'
102111
className='slds-modal__container'
103-
onClick={(e)=>{EventUtil.trap(e);}}>
112+
onClick={this.handleModalClick}
113+
>
104114
<div className='slds-modal__header'>
105115
<h2 className='slds-text-heading--medium'>{this.props.title}</h2>
106116
<SLDSButton className='slds-button slds-modal__close' onClick={this.closeModal}>

demo/pages/HomePage/ModalSection.jsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -42,12 +42,7 @@ module.exports = React.createClass( {
4242

4343
getModalContent () {
4444
return <div>
45-
<p>With the Lightning Design System you can build custom applications with a look and feel that is consistent with Salesforce core features — without reverse engineering our styles! Simply download our platform-agnostic CSS framework and get started today.</p>
4645

47-
<p>
48-
Utilize our detailed guidelines to confidently design excellent apps that fit right into the Salesforce ecosystem. With the Design System, you get access to all of the Salesforce core visual and interaction design patterns so that you can follow established best practices and build apps that have a consistent look and feel with the Salesforce user experience.
49-
</p>
50-
{/*
5146
<SLDSPicklistBase
5247
options={[
5348
{label:'A Option Option Super Super Long',value:'A0'},
@@ -64,11 +59,16 @@ Utilize our detailed guidelines to confidently design excellent apps that fit ri
6459
]}
6560
value='C0'
6661
label="Contacts"
67-
modal={true}
62+
modal={false}
6863
placeholder = "Select a contact"
6964
onSelect={(value)=>{console.log('selected: ',value);}} />
65+
<p>With the Lightning Design System you can build custom applications with a look and feel that is consistent with Salesforce core features — without reverse engineering our styles! Simply download our platform-agnostic CSS framework and get started today.</p>
66+
<a href='http://www.google.com'>CLICK!</a>
67+
<p>
68+
Utilize our detailed guidelines to confidently design excellent apps that fit right into the Salesforce ecosystem. With the Design System, you get access to all of the Salesforce core visual and interaction design patterns so that you can follow established best practices and build apps that have a consistent look and feel with the Salesforce user experience.
69+
</p>
70+
7071

71-
*/}
7272

7373
</div>;
7474
},

0 commit comments

Comments
 (0)