@salesforce-ux/design-system
Version:
Salesforce Lightning Design System
1 lines • 28.6 kB
JavaScript
var SLDS="object"==typeof SLDS?SLDS:{};SLDS["__internal/chunked/showcase/./ui/components/docked-composer/base/example.jsx.js"]=function(e){function a(a){for(var l,o,d=a[0],c=a[1],i=a[2],r=0,u=[];r<d.length;r++)o=d[r],Object.prototype.hasOwnProperty.call(t,o)&&t[o]&&u.push(t[o][0]),t[o]=0;for(l in c)Object.prototype.hasOwnProperty.call(c,l)&&(e[l]=c[l]);for(m&&m(a);u.length;)u.shift()();return n.push.apply(n,i||[]),s()}function s(){for(var e,a=0;a<n.length;a++){for(var s=n[a],l=!0,d=1;d<s.length;d++){var c=s[d];0!==t[c]&&(l=!1)}l&&(n.splice(a--,1),e=o(o.s=s[0]))}return e}var l={},t={59:0,6:0,13:0,14:0,22:0,24:0,26:0,36:0,37:0,56:0,72:0,73:0,79:0,93:0,94:0,96:0,97:0,98:0,103:0,104:0,112:0,117:0,119:0,123:0,125:0,128:0,132:0,134:0,136:0,137:0,138:0,141:0,143:0,146:0,147:0,148:0,151:0,155:0,158:0},n=[];function o(a){if(l[a])return l[a].exports;var s=l[a]={i:a,l:!1,exports:{}};return e[a].call(s.exports,s,s.exports,o),s.l=!0,s.exports}o.m=e,o.c=l,o.d=function(e,a,s){o.o(e,a)||Object.defineProperty(e,a,{enumerable:!0,get:s})},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,a){if(1&a&&(e=o(e)),8&a)return e;if(4&a&&"object"==typeof e&&e&&e.__esModule)return e;var s=Object.create(null);if(o.r(s),Object.defineProperty(s,"default",{enumerable:!0,value:e}),2&a&&"string"!=typeof e)for(var l in e)o.d(s,l,function(a){return e[a]}.bind(null,l));return s},o.n=function(e){var a=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(a,"a",a),a},o.o=function(e,a){return Object.prototype.hasOwnProperty.call(e,a)},o.p="/assets/scripts/bundle/";var d=this.webpackJsonpSLDS___internal_chunked_showcase=this.webpackJsonpSLDS___internal_chunked_showcase||[],c=d.push.bind(d);d.push=a,d=d.slice();for(var i=0;i<d.length;i++)a(d[i]);var m=c;return n.push([623,0]),s()}({0:function(e,a){e.exports=React},16:function(e,a){e.exports=ReactDOM},623:function(e,a,s){"use strict";s.r(a),s.d(a,"Footer",(function(){return g})),s.d(a,"DockedComposerPanel",(function(){return v})),s.d(a,"ComposerOverflowMenu",(function(){return x})),s.d(a,"Context",(function(){return C})),s.d(a,"states",(function(){return k})),s.d(a,"examples",(function(){return w}));var l=s(0),t=s.n(l),n=s(56),o=s(4),d=s(14),c=s(23),i=s(15),m=s(5),r=s(13),u=s(29),p=s(17),b=s(9),_=s(2),E=s.n(_),N=s(6),h=[{entity:"email",title:"Agenda for next week"},{entity:"call",title:"Lei Chan"},{entity:"task",title:"August 14 Meeting Notes"}],g=function(e){return t.a.createElement("div",{className:"slds-col_bump-left slds-text-align_right"},t.a.createElement("button",{className:"slds-button slds-button_brand"},"Action"))},f=function(e){return t.a.createElement("div",{className:"slds-col_bump-left slds-grid slds-grid_vertical-align-center"},t.a.createElement("div",{className:"slds-grid slds-m-right_small",role:"toolbar"},t.a.createElement("ul",{className:"slds-grid","aria-label":"Insert content"},t.a.createElement("li",null,t.a.createElement(o.b,{className:"slds-button_icon-small",symbol:"link",assistiveText:"Attach File",title:"Attach File"})),t.a.createElement("li",null,t.a.createElement(o.b,{className:"slds-button_icon-small",symbol:"insert_template",assistiveText:"Insert Template",title:"Insert Template",tabIndex:"-1"})),t.a.createElement("li",null,t.a.createElement(o.b,{className:"slds-button_icon-small",symbol:"insert_tag_field",assistiveText:"Insert HTML",title:"Insert HTML",tabIndex:"-1"}))),t.a.createElement(o.b,{className:"slds-button_icon-small",symbol:"preview",assistiveText:"Preview",title:"Preview",tabIndex:"-1"})),t.a.createElement("button",{className:"slds-button slds-button_brand"},"Send"))},v=function(e){return t.a.createElement("section",{className:E()("slds-docked-composer slds-grid slds-grid_vertical",e.className,e.dialogClosed?"slds-is-closed":null),role:e.nestedDialog?null:"dialog","aria-labelledby":e.nestedDialog?null:"dialog-heading-id-1","aria-describedby":e.nestedDialog?null:"dialog-content-id-1"},t.a.createElement("header",{className:"slds-docked-composer__header slds-grid slds-shrink-none","aria-live":"assertive"},t.a.createElement("div",{className:"slds-media slds-media_center slds-no-space"},t.a.createElement("div",{className:"slds-media__figure slds-m-right_x-small"},t.a.createElement("span",{className:"slds-icon_container"},t.a.createElement(b.a,{className:"slds-icon slds-icon_small slds-icon-text-default",sprite:"standard",symbol:e.headerSymbol||"call"}))),t.a.createElement("div",{className:"slds-media__body"},e.dialogClosed?t.a.createElement("span",{className:"slds-assistive-text"},"Minimized"):null,t.a.createElement("h2",{className:"slds-truncate",id:"dialog-heading-id-1",title:e.header||"Header"},e.header||"Header"))),t.a.createElement("div",{className:"slds-col_bump-left slds-shrink-none"},t.a.createElement(o.b,{className:"slds-button_icon",symbol:"minimize_window",assistiveText:"Minimize Composer Panel",title:"Minimize window"}),t.a.createElement(o.b,{className:"slds-button_icon",symbol:"expand_alt",assistiveText:"Expand Composer Panel",title:"Expand Composer"}),t.a.createElement(o.b,{className:"slds-button_icon",symbol:"close",assistiveText:"Close Composer Panel",title:"Close"}))),t.a.createElement("div",{className:E()("slds-docked-composer__body",e.bodyClassName),id:"dialog-content-id-1"},e.children),e.footer?t.a.createElement("footer",{className:E()("slds-docked-composer__footer slds-shrink-none",e.footerClassName)},e.footer):null)},x=function(e){return t.a.createElement("div",{className:"slds-docked-composer slds-docked-composer_overflow"},t.a.createElement("button",{className:"slds-button slds-button_icon slds-docked-composer_overflow__button","aria-haspopup":"true"},t.a.createElement(b.a,{className:"slds-button__icon",sprite:"utility",symbol:"standard_objects"}),t.a.createElement("span",{className:"slds-text-body_small slds-m-left_xx-small"},"3"," ",t.a.createElement("span",{className:"slds-assistive-text"},"other docked composer panels"))),t.a.createElement(d.Menu,{className:"slds-dropdown_left slds-dropdown_bottom slds-dropdown_medium slds-nubbin_bottom-left"},t.a.createElement(d.MenuList,{className:"slds-dropdown_length-with-icon-7"},N.d.times(h.length,(function(e){return t.a.createElement(d.MenuItem,{key:e,title:h[e].title},t.a.createElement("span",{className:"slds-icon_container slds-icon-standard-"+h[e].entity+" slds-m-right_x-small"},t.a.createElement(b.a,{className:"slds-icon slds-icon_small",sprite:"standard",symbol:h[e].entity}),t.a.createElement("span",{className:"slds-assistive-text"},h[e].entity)),h[e].title)})))))},y=function(e){return t.a.createElement(u.c,{listboxClassName:"slds-dropdown slds-dropdown_fluid",vertical:!0,id:e.id},t.a.createElement(u.d,null,t.a.createElement(u.b,{id:e.listboxOptionId,entityTitle:"Acme",entityMeta:!0})))},C=function(e){return t.a.createElement("div",{className:"demo-only demo-only_viewport",style:{height:"500px",minWidth:"615px",overflowX:"auto"}},e.children)};a.default=[{id:"default",label:"Default",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",footer:t.a.createElement(g,null)},t.a.createElement("div",{className:"slds-align_absolute-center"},"Docked Composer Panel Body ",t.a.createElement("br",null)," This area consumes the feature")))}];var k=[{id:"single-composer-open",label:"Open",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",footer:t.a.createElement(g,null)},t.a.createElement("div",{className:"slds-align_absolute-center"},"Docked Composer Panel Body ",t.a.createElement("br",null)," This area consumes the feature")))},{id:"single-composer-focused",label:"Focused",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open slds-has-focus",footer:t.a.createElement(g,null)},t.a.createElement("div",{className:"slds-align_absolute-center"},"Docked Composer Panel Body ",t.a.createElement("br",null)," This area consumes the feature")))},{id:"single-composer-closed",label:"Closed",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{dialogClosed:!0,footer:t.a.createElement(g,null)},t.a.createElement("div",{className:"slds-align_absolute-center"},"Docked Composer Panel Body ",t.a.createElement("br",null)," This area consumes the feature")))},{id:"single-composer-closed-focused",label:"Closed Focused",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-has-focus",dialogClosed:!0,footer:t.a.createElement(g,null)},t.a.createElement("div",{className:"slds-align_absolute-center"},"Docked Composer Panel Body ",t.a.createElement("br",null)," This area consumes the feature")))},{id:"single-composer-popout",label:"Popout",element:t.a.createElement(c.Backdrop,null,t.a.createElement(c.Modal,{className:"slds-docked-composer-modal","aria-labelledby":"dialog-heading-id-1","aria-describedby":"dialog-content-id-1",closeButton:!1},t.a.createElement(c.ModalContent,{id:"modal-content-id"},t.a.createElement(v,{footer:t.a.createElement(g,null),nestedDialog:!0},t.a.createElement("div",{className:"slds-align_absolute-center"},"Docked Composer Panel Body ",t.a.createElement("br",null)," This area consumes the feature")))))},{id:"multiple-composer-overflow",label:"With Overflow Menu",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(x,null),t.a.createElement(v,{className:"slds-is-open",footer:t.a.createElement(g,null)},t.a.createElement("div",{className:"slds-align_absolute-center"},"Docked Composer Panel Body ",t.a.createElement("br",null)," This area consumes the feature")))}],w=[{id:"task",label:"Log a Task",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",bodyClassName:"slds-docked-composer__body_form",header:"New Task",headerSymbol:"task",footer:t.a.createElement("button",{className:"slds-button slds-button_brand slds-col_bump-left"},"Save")},t.a.createElement("fieldset",{className:"slds-form-element slds-form_compound"},t.a.createElement("legend",{className:"slds-assistive-text"},"Log new task"),t.a.createElement("div",{className:"slds-form-element__control"},t.a.createElement("div",{className:"slds-form-element__group"},t.a.createElement("div",{className:"slds-form-element__row"},t.a.createElement("div",{className:"slds-form-element slds-size_1-of-1"},t.a.createElement("label",{className:"slds-form-element__label",htmlFor:"text-input-01"},"Subject"),t.a.createElement("div",{className:"slds-form-element__control"},t.a.createElement("input",{className:"slds-input",type:"text",id:"text-input-01"})))),t.a.createElement("div",{className:"slds-form-element__row"},t.a.createElement("div",{className:"slds-form-element slds-size_1-of-2"},t.a.createElement("label",{className:"slds-form-element__label",htmlFor:"text-input-02"},"Assigned To"),t.a.createElement("div",{className:"slds-form-element__control"},t.a.createElement("input",{className:"slds-input",type:"text",id:"text-input-02"}))),t.a.createElement("div",{className:"slds-form-element slds-size_1-of-2"},t.a.createElement("label",{className:"slds-form-element__label",htmlFor:"text-input-03"},"Due Dates"),t.a.createElement("div",{className:"slds-form-element__control"},t.a.createElement("input",{className:"slds-input",type:"text",id:"text-input-03"})))),t.a.createElement("div",{className:"slds-form-element__row"},t.a.createElement(u.a,{formClassName:"slds-size_1-of-2",autocomplete:!0,label:"Name",placeholder:"Search Leads",inputIcon:"right",inputIconRightSymbol:"search",objectSwitcher:!0,objectSwitcherInline:!0,"aria-controls":"listbox-id-01",listbox:t.a.createElement(y,{id:"listbox-id-01",listboxOptionId:"listbox-option-id-1"})}),t.a.createElement(u.a,{formClassName:"slds-size_1-of-2",autocomplete:!0,label:"Name",placeholder:"Search Accounts",inputIcon:"right",inputIconRightSymbol:"search",objectSwitcher:!0,objectSwitcherInline:!0,"aria-controls":"listbox-id-02",listbox:t.a.createElement(y,{id:"listbox-id-02",listboxOptionId:"listbox-option-id-2"})})))))))},{id:"voice-composer-queued",label:"Voice - Queued",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",bodyClassName:"slds-align_absolute-center",header:"Lei Chan - Connecting...",footer:t.a.createElement("button",{className:"slds-button slds-button_destructive slds-size_1-of-1"},"End Call")},t.a.createElement("div",{className:"slds-text-align_center slds-align-middle"},t.a.createElement("span",{className:"slds-avatar slds-avatar_large"},t.a.createElement("img",{alt:"",src:"/assets/images/avatar2.jpg",title:"Lei Chan avatar"})),t.a.createElement("h3",{className:"slds-text-heading_large"},"Lei Chan"),t.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},t.a.createElement("li",{className:"slds-item"},"VP of Sales"),t.a.createElement("li",{className:"slds-item "},"Acme Corporation")),t.a.createElement("p",{className:"slds-text-heading_medium slds-m-top_medium"},"Connecting..."))))},{id:"voice-composer-ringing",label:"Voice - Ringing",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",bodyClassName:"slds-align_absolute-center",header:"Lei Chan - Dialing...",footer:t.a.createElement("button",{className:"slds-button slds-button_destructive slds-size_1-of-1"},"End Call")},t.a.createElement("div",{className:"slds-text-align_center slds-align-middle"},t.a.createElement("span",{className:"slds-avatar slds-avatar_large"},t.a.createElement("img",{alt:"",src:"/assets/images/avatar2.jpg",title:"Lei Chan avatar"})),t.a.createElement("h3",{className:"slds-text-heading_large"},"Lei Chan"),t.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},t.a.createElement("li",{className:"slds-item"},"VP of Sales"),t.a.createElement("li",{className:"slds-item "},"Acme Corporation")),t.a.createElement("p",{className:"slds-text-heading_medium slds-m-top_medium"},"Dialing..."))))},{id:"voice-composer-connected",label:"Voice - Connected",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",header:"Lei Chan - Call in Progress",footer:t.a.createElement("button",{className:"slds-button slds-button_destructive slds-col_bump-left"},"End Call")},t.a.createElement("div",{className:"slds-docked-composer__lead"},t.a.createElement("div",{className:"slds-media"},t.a.createElement("div",{className:"slds-media__figure"},t.a.createElement("span",{className:"slds-avatar slds-avatar_medium"},t.a.createElement("img",{alt:"",src:"/assets/images/avatar2.jpg",title:"Lei Chan avatar"}))),t.a.createElement("div",{className:"slds-media__body"},t.a.createElement("p",{className:"slds-text-heading_medium"},"Lei Chan"),t.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},t.a.createElement("li",{className:"slds-item"},"VP of Sales"),t.a.createElement("li",{className:"slds-item "},"Acme Corporation")))),t.a.createElement("p",{className:"slds-col_bump-left slds-text-heading_large"},"5:37")),t.a.createElement("div",{className:"slds-docked-composer__toolbar"},t.a.createElement(o.b,{className:"slds-button_icon-border-filled slds-button_icon-small",symbol:"unmuted",assistiveText:"Mute Yourself",title:"Mute Yourself","aria-pressed":"false"})),t.a.createElement("label",{className:"slds-assistive-text",htmlFor:"composer-text-input-1"},"Take notes"),t.a.createElement("textarea",{id:"composer-text-input-1",className:"slds-docked-composer__input slds-input_bare slds-text-longform slds-grow",placeholder:"Jot down notes here..."})))},{id:"voice-composer-cancelled",label:"Voice - Cancelled",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",bodyClassName:"slds-align_absolute-center",header:"Lei Chan - Cancelling..."},t.a.createElement("div",{className:"slds-text-align_center slds-align-middle"},t.a.createElement("span",{className:"slds-avatar slds-avatar_large"},t.a.createElement("img",{alt:"",src:"/assets/images/avatar2.jpg",title:"Lei Chan avatar"})),t.a.createElement("h3",{className:"slds-text-heading_large"},"Lei Chan"),t.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},t.a.createElement("li",{className:"slds-item"},"VP of Sales"),t.a.createElement("li",{className:"slds-item "},"Acme Corporation")),t.a.createElement("p",{className:"slds-text-heading_medium slds-m-top_medium"},"Cancelling..."))))},{id:"voice-composer-busy",label:"Voice - Busy",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",bodyClassName:"slds-align_absolute-center",header:"Lei Chan - Busy",footer:[t.a.createElement("button",{className:"slds-button slds-button_neutral slds-size_1-of-2",key:N.d.uniqueId("follow-up-")},"Follow-Up Later"),t.a.createElement("button",{className:"slds-button slds-button_brand slds-size_1-of-2",key:N.d.uniqueId("call-again-")},"Call Again")]},t.a.createElement("div",{className:"slds-text-align_center slds-align-middle"},t.a.createElement("span",{className:"slds-avatar slds-avatar_large"},t.a.createElement("img",{alt:"",src:"/assets/images/avatar2.jpg",title:"Lei Chan avatar"})),t.a.createElement("h3",{className:"slds-text-heading_large"},"Lei Chan"),t.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},t.a.createElement("li",{className:"slds-item"},"VP of Sales"),t.a.createElement("li",{className:"slds-item "},"Acme Corporation")),t.a.createElement("p",{className:"slds-text-heading_medium slds-m-top_medium"},"Busy"))))},{id:"voice-composer-failed",label:"Voice - Call Failed",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",bodyClassName:"slds-align_absolute-center",header:"Lei Chan - Call Failed",footer:[t.a.createElement("button",{className:"slds-button slds-button_neutral slds-size_1-of-2",key:N.d.uniqueId("follow-up-")},"Edit Phone Number"),t.a.createElement("button",{className:"slds-button slds-button_brand slds-size_1-of-2",key:N.d.uniqueId("call-again-")},"Call Again")]},t.a.createElement("div",{className:"slds-text-align_center slds-align-middle"},t.a.createElement("span",{className:"slds-avatar slds-avatar_large"},t.a.createElement("img",{alt:"",src:"/assets/images/avatar2.jpg",title:"Lei Chan avatar"})),t.a.createElement("h3",{className:"slds-text-heading_large"},"Lei Chan"),t.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},t.a.createElement("li",{className:"slds-item"},"VP of Sales"),t.a.createElement("li",{className:"slds-item "},"Acme Corporation")),t.a.createElement("p",{className:"slds-text-heading_medium slds-m-top_medium"},"Call Failed"))))},{id:"voice-composer-no-answer",label:"Voice - No Answer",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",bodyClassName:"slds-align_absolute-center",header:"Lei Chan - No Answer",footer:[t.a.createElement("button",{className:"slds-button slds-button_neutral slds-size_1-of-2",key:N.d.uniqueId("follow-up-")},"Follow-Up Later"),t.a.createElement("button",{className:"slds-button slds-button_brand slds-size_1-of-2",key:N.d.uniqueId("call-again-")},"Call Again")]},t.a.createElement("div",{className:"slds-text-align_center slds-align-middle"},t.a.createElement("span",{className:"slds-avatar slds-avatar_large"},t.a.createElement("img",{alt:"",src:"/assets/images/avatar2.jpg",title:"Lei Chan avatar"})),t.a.createElement("h3",{className:"slds-text-heading_large"},"Lei Chan"),t.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},t.a.createElement("li",{className:"slds-item"},"VP of Sales"),t.a.createElement("li",{className:"slds-item "},"Acme Corporation")),t.a.createElement("p",{className:"slds-text-heading_medium slds-m-top_medium"},"No Answer"))))},{id:"voice-composer-call-finished",label:"Voice - Call Finished",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",header:"Lei Chan - Call Finished",footer:t.a.createElement("button",{className:"slds-button slds-button_brand slds-col_bump-left"},"Finish Notes")},t.a.createElement("div",{className:"slds-docked-composer__lead"},t.a.createElement("div",{className:"slds-media"},t.a.createElement("div",{className:"slds-media__figure"},t.a.createElement("span",{className:"slds-avatar slds-avatar_medium"},t.a.createElement("img",{alt:"",src:"/assets/images/avatar2.jpg",title:"Lei Chan avatar"}))),t.a.createElement("div",{className:"slds-media__body"},t.a.createElement("p",{className:"slds-text-heading_medium"},"Lei Chan"),t.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},t.a.createElement("li",{className:"slds-item"},"VP of Sales"),t.a.createElement("li",{className:"slds-item "},"Acme Corporation"))))),t.a.createElement("div",{className:"slds-docked-composer__toolbar"},t.a.createElement(o.b,{className:"slds-button_icon-border-filled slds-button_icon-small",symbol:"unmuted",assistiveText:"Mute Yourself",title:"Mute Yourself","aria-pressed":"false"})),t.a.createElement("label",{className:"slds-assistive-text",htmlFor:"composer-text-input-1"},"Take notes"),t.a.createElement("textarea",{id:"composer-text-input-1",className:"slds-docked-composer__input slds-input_bare slds-text-longform slds-grow",placeholder:"Jot down notes here..."})))},{id:"voice-composer-call-incoming",label:"Voice - Call Incoming",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",bodyClassName:"slds-align_absolute-center slds-size_1-of-1",header:"Lei Chan - Incoming Call...",footer:t.a.createElement("button",{className:"slds-button slds-button_brand slds-col_bump-left"},"Finish Notes")},t.a.createElement("div",{className:"slds-text-align_center slds-align-middle"},t.a.createElement("span",{className:"slds-avatar slds-avatar_large"},t.a.createElement("img",{alt:"",src:"/assets/images/avatar2.jpg",title:"Lei Chan avatar"})),t.a.createElement("h3",{className:"slds-text-heading_large"},"Lei Chan"),t.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},t.a.createElement("li",{className:"slds-item"},"VP of Sales"),t.a.createElement("li",{className:"slds-item "},"Acme Corporation")),t.a.createElement("p",{className:"slds-text-heading_medium slds-m-top_medium"},"(416) 555-1234")),t.a.createElement("div",{className:"slds-p-horizontal_x-small slds-text-align_left slds-size_1-of-1"},t.a.createElement("h3",{className:"slds-m-bottom_x-small"},"Recent Activity"),t.a.createElement("ul",{className:"slds-has-dividers_around-space"},t.a.createElement("li",{className:"slds-item slds-theme_shade slds-grid"},t.a.createElement("span",{className:"slds-icon_container slds-icon-standard-task slds-m-right_x-small"},t.a.createElement(b.a,{className:"slds-icon slds-icon_small",sprite:"standard",symbol:"task"}),t.a.createElement("span",{className:"slds-assistive-text"},"Task")),"Discussed New Pricing Models",t.a.createElement("span",{className:"slds-col_bump-left"},"Yesterday")),t.a.createElement("li",{className:"slds-item slds-theme_shade slds-grid"},t.a.createElement("span",{className:"slds-icon_container slds-icon-standard-email slds-m-right_x-small"},t.a.createElement(b.a,{className:"slds-icon slds-icon_small",sprite:"standard",symbol:"email"}),t.a.createElement("span",{className:"slds-assistive-text"},"Email")),"Re: Updated Proposals",t.a.createElement("span",{className:"slds-col_bump-left"},"4 Hours Ago")),t.a.createElement("li",{className:"slds-item slds-theme_shade slds-grid"},t.a.createElement("span",{className:"slds-icon_container slds-icon-standard-note slds-m-right_x-small"},t.a.createElement(b.a,{className:"slds-icon slds-icon_small",sprite:"standard",symbol:"note"}),t.a.createElement("span",{className:"slds-assistive-text"},"Note")),"Discuss Slides for Nov EBC",t.a.createElement("span",{className:"slds-col_bump-left"},"2 Days Ago"))))))},{id:"voice-composer-call-logged",label:"Voice - Log a Call",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",bodyClassName:"slds-docked-composer__body_form",header:"Lei Chan",footer:t.a.createElement("button",{className:"slds-button slds-button_brand slds-col_bump-left"},"Save")},t.a.createElement("fieldset",{className:"slds-form-element slds-form_compound"},t.a.createElement("legend",{className:"slds-assistive-text"},"Log a call"),t.a.createElement("div",{className:"slds-form-element__control"},t.a.createElement("div",{className:"slds-form-element__group"},t.a.createElement("div",{className:"slds-form-element__row"},t.a.createElement("div",{className:"slds-form-element slds-size_1-of-1"},t.a.createElement("label",{className:"slds-form-element__label",htmlFor:"text-input-01"},"Subject"),t.a.createElement("div",{className:"slds-form-element__control"},t.a.createElement("input",{className:"slds-input",type:"text",id:"text-input-01"})))),t.a.createElement("div",{className:"slds-form-element__row"},t.a.createElement("div",{className:"slds-form-element slds-size_1-of-1"},t.a.createElement("label",{className:"slds-form-element__label",htmlFor:"textarea-input-01"},"Comments"),t.a.createElement("div",{className:"slds-form-element__control"},t.a.createElement("textarea",{className:"slds-textarea",id:"textarea-input-01"})))),t.a.createElement("div",{className:"slds-form-element__row"},t.a.createElement(u.a,{formClassName:"slds-size_1-of-2",autocomplete:!0,label:"Name",placeholder:"Search Leads",inputIcon:"right",inputIconRightSymbol:"search",objectSwitcher:!0,objectSwitcherInline:!0,"aria-controls":"listbox-id-01",listbox:t.a.createElement(y,{id:"listbox-id-01",listboxOptionId:"listbox-option-id-1"})}),t.a.createElement(u.a,{formClassName:"slds-size_1-of-2",autocomplete:!0,label:"Name",placeholder:"Search Accounts",inputIcon:"right",inputIconRightSymbol:"search",objectSwitcher:!0,objectSwitcherInline:!0,"aria-controls":"listbox-id-02",listbox:t.a.createElement(y,{id:"listbox-id-02",listboxOptionId:"listbox-option-id-2"})})))))))},{id:"email",label:"Email Composer",element:t.a.createElement("div",{className:"slds-docked_container"},t.a.createElement(v,{className:"slds-is-open",header:"New Email",headerSymbol:"email",footer:t.a.createElement(f,null)},t.a.createElement("div",{className:"slds-email-composer"},t.a.createElement(u.a,{id:"recipients-to",formClassName:"slds-email-composer__combobox",selectedOptionsInline:!0,label:"To",placeholder:" ",autocomplete:!0,"aria-controls":"listbox-id-01",listbox:t.a.createElement(y,{id:"listbox-id-01",listboxOptionId:"listbox-option-id-1"})},t.a.createElement(p.c,null,t.a.createElement(p.d,null,t.a.createElement(p.b,{label:"jrogers@cloudhub.com",tabIndex:"0"},t.a.createElement(n.Avatar,{className:"slds-avatar_x-small slds-pill__icon_container"},t.a.createElement("img",{alt:"Person name",src:"/assets/images/avatar2.jpg",title:"User avatar"})))))),t.a.createElement(u.a,{id:"recipients-bcc",formClassName:"slds-email-composer__combobox",selectedOptionsInline:!0,label:"Bcc",placeholder:" ",autocomplete:!0,"aria-controls":"listbox-id-02",listbox:t.a.createElement(y,{id:"listbox-id-02",listboxOptionId:"listbox-option-id-2"})}),t.a.createElement(u.a,{id:"recipients-cc",formClassName:"slds-email-composer__combobox",selectedOptionsInline:!0,label:"Cc",placeholder:" ",autocomplete:!0,"aria-controls":"listbox-id-03",listbox:t.a.createElement(y,{id:"listbox-id-03",listboxOptionId:"listbox-option-id-3"})}),t.a.createElement(m.b,{labelContent:"Enter subject",hasHiddenLabel:!0,inputId:"input-subject-01"},t.a.createElement(r.a,{id:"input-subject-01",className:"slds-input_bare",placeholder:"Enter Subject"})),t.a.createElement(i.a,null,t.a.createElement(i.l,null,t.a.createElement(i.f,null),t.a.createElement(i.g,{tabIndexSetting:"-1"}),t.a.createElement(i.e,null),t.a.createElement(i.d,null),t.a.createElement(i.b,null),t.a.createElement(i.i,null),t.a.createElement(i.c,null)),t.a.createElement(i.k,{placeholder:"Compose Email..."})))))}]}});