@salesforce-ux/design-system
Version:
Salesforce Lightning Design System
1 lines • 8.99 kB
JavaScript
var SLDS;!function(){"use strict";var e,t,s,n={1594:function(e){e.exports=React},1981:function(e){e.exports=JSBeautify},5206:function(e){e.exports=ReactDOM},5475:function(e,t,s){s.r(t),s.d(t,{getContents:function(){return x},getElement:function(){return O}});var n=s(1594),a=s.n(n),l=s(5671),r=s(6547),o=s(5619),i=s(8342),c=s(4187),m=s.n(c),d=s(942),u=s.n(d),f=s(6955),h=function(e){var t=e.containerClassName,s=e.className,n=e.type,l=e.children;return a().createElement("div",{className:u()("slds-notify_container",t)},a().createElement("div",{className:u()("slds-notify slds-notify_toast",s,n&&"slds-theme_"+n),role:"status"},a().createElement("span",{className:"slds-assistive-text"},n),l,a().createElement("div",{className:"slds-notify__close"},a().createElement(f.A,{className:"slds-button_icon-inverse",symbol:"close",assistiveText:"Close",title:"Close"}))))};h.propTypes={containerClassName:m().string,className:m().string,type:m().oneOf(["info","success","warning","error"]),children:m().node},h.defaultProps={type:"info"};var p=h,v=s(538),y=[{id:"default",label:"Base - default",element:a().createElement(p,{type:"info",containerClassName:"slds-is-relative"},a().createElement(v.eX,{containerClassName:"slds-m-right_small slds-no-flex slds-align-top",className:"slds-icon_small",assistiveText:!1,symbol:"info"}),a().createElement("div",{className:"slds-notify__content"},a().createElement("h2",{className:"slds-text-heading_small"},"26 potential duplicate leads were found."," ",a().createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"Select Leads to Merge"))))}],g=[{id:"success",label:"Success (Theme Class)",element:a().createElement(p,{type:"success",containerClassName:"slds-is-relative"},a().createElement(v.eX,{containerClassName:"slds-m-right_small slds-no-flex slds-align-top",className:"slds-icon_small",assistiveText:!1,symbol:"success"}),a().createElement("div",{className:"slds-notify__content"},a().createElement("h2",{className:"slds-text-heading_small "},"Account"," ",a().createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"ACME - 100")," ","widgets was created.")))},{id:"warning",label:"Warning (Theme Class)",element:a().createElement(p,{type:"warning",containerClassName:"slds-is-relative"},a().createElement(v.eX,{containerClassName:"slds-m-right_small slds-no-flex slds-align-top",className:"slds-icon_small",assistiveText:!1,symbol:"warning"}),a().createElement("div",{className:"slds-notify__content"},a().createElement("h2",{className:"slds-text-heading_small "},"Can’t share file “report-q3.pdf” with the"," ",a().createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"selected users"),".")))},{id:"error",label:"Error (Theme Class)",element:a().createElement(p,{type:"error",containerClassName:"slds-is-relative"},a().createElement(v.eX,{containerClassName:"slds-m-right_small slds-no-flex slds-align-top",className:"slds-icon_small",assistiveText:!1,symbol:"error"}),a().createElement("div",{className:"slds-notify__content"},a().createElement("h2",{className:"slds-text-heading_small "},"Can’t save lead “Sally Wong” because"," ",a().createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"another lead")," ","has the same name.")))},{id:"error-with-details",label:"Error With Details (Theme Class)",element:a().createElement(p,{type:"error",containerClassName:"slds-is-relative"},a().createElement(v.eX,{containerClassName:"slds-m-right_small slds-no-flex slds-align-top",className:"slds-icon_small",assistiveText:!1,symbol:"error"}),a().createElement("div",{className:"slds-notify__content"},a().createElement("h2",{className:"slds-text-heading_small"},"You've encountered some errors when trying to save edits to Samuel Smith."),a().createElement("p",null,"Here's some detail of"," ",a().createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"what happened"),", being very descriptive and transparent.")))}],E=[{id:"small",label:"Small Column",demoStyles:"width: 25rem",storybookStyles:!0,element:a().createElement("div",{className:"slds-region_narrow"},a().createElement(p,{type:"info",containerClassName:"slds-is-relative"},a().createElement("div",{className:"slds-notify__content"},a().createElement("h2",{className:"slds-text-heading_small"},"26 potential"," ",a().createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"duplicate leads")," ","were found."))))}],_=s(806),b=l.XB.code,N=l.XB.h2,S=l.XB.h3,w=l.XB.p,O=function(){return(0,n.createElement)(l.Ay,{},(0,n.createElement)("div",{className:"doc lead"},"Toast serves as a feedback & confirmation mechanism after the user takes an action."),(0,n.createElement)(r.A,{exampleOnly:!0,demoStyles:"height: 4rem;"},(0,_.NO)(y)),N({id:"About-Toast"},"About Toast"),(0,n.createElement)(o.A,{type:"note",header:"SLDS 2"},"To be compatible with the SLDS 2 default theme, Salesforce Cosmos, the toast ",(0,n.createElement)("code",null,"X")," close button is set with ",(0,n.createElement)("code",null,"slds-button__icon_xx-small"),"."),S({id:"Accessibility"},"Accessibility"),w({},"Toast should contain ",b({},'role="alert"')," on the container to signal to assistive technology that they require the user’s attention."),w({},"When the design uses multiple toasts simultaneously, set the role to ",b({},'role="status"'),". Historically, toasts would use the role of ",b({},"alert"),", but because you can invoke multiple toasts, assertive alerts would override previous toasts in the screen reader's speech queue. The role of ",b({},"status")," is a polite live region, which does not clear the queue, reducing the risk of a missed toast message."),w({},"Use a span with ",b({},"slds-assistive-text")," to let the user know what type of notification it is."),N({id:"Base"},"Base"),(0,n.createElement)(r.A,{demoStyles:"height: 4rem;"},(0,_.NO)(y)),N({id:"States"},"States"),S({id:"Success"},"Success"),(0,n.createElement)(r.A,{demoStyles:"height: 4rem;"},(0,_.NO)(g,"success")),S({id:"Warning"},"Warning"),(0,n.createElement)(r.A,{demoStyles:"height: 4rem;"},(0,_.NO)(g,"warning")),S({id:"Error"},"Error"),(0,n.createElement)(r.A,{demoStyles:"height: 4rem;"},(0,_.NO)(g,"error")),S({id:"Error-With-Details"},"Error With Details"),(0,n.createElement)(r.A,{demoStyles:"height: 4rem;"},(0,_.NO)(g,"error-with-details")),N({id:"Examples"},"Examples"),S({id:"Small-Column"},"Small Column"),(0,n.createElement)(r.A,{demoStyles:"height: 4rem;"},(0,_.NO)(E,"small")),N({id:"Styling-Hooks-Overview"},"Styling Hooks Overview"),(0,n.createElement)(i.A,{name:"toast",type:"component"}))},x=function(){return(0,l.Qr)(O())}}},a={};function l(e){var t=a[e];if(void 0!==t)return t.exports;var s=a[e]={id:e,exports:{}};return n[e](s,s.exports,l),s.exports}l.m=n,l.amdO={},e=[],l.O=function(t,s,n,a){if(!s){var r=1/0;for(m=0;m<e.length;m++){s=e[m][0],n=e[m][1],a=e[m][2];for(var o=!0,i=0;i<s.length;i++)(!1&a||r>=a)&&Object.keys(l.O).every(function(e){return l.O[e](s[i])})?s.splice(i--,1):(o=!1,a<r&&(r=a));if(o){e.splice(m--,1);var c=n();void 0!==c&&(t=c)}}return t}a=a||0;for(var m=e.length;m>0&&e[m-1][2]>a;m--)e[m]=e[m-1];e[m]=[s,n,a]},l.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(t,{a:t}),t},s=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},l.t=function(e,n){if(1&n&&(e=this(e)),8&n)return e;if("object"==typeof e&&e){if(4&n&&e.__esModule)return e;if(16&n&&"function"==typeof e.then)return e}var a=Object.create(null);l.r(a);var r={};t=t||[null,s({}),s([]),s(s)];for(var o=2&n&&e;("object"==typeof o||"function"==typeof o)&&!~t.indexOf(o);o=s(o))Object.getOwnPropertyNames(o).forEach(function(t){r[t]=function(){return e[t]}});return r.default=function(){return e},l.d(a,r),a},l.d=function(e,t){for(var s in t)l.o(t,s)&&!l.o(e,s)&&Object.defineProperty(e,s,{enumerable:!0,get:t[s]})},l.e=function(){return Promise.resolve()},l.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),l.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.j=8644,function(){var e={8644:0};l.O.j=function(t){return 0===e[t]};var t=function(t,s){var n,a,r=s[0],o=s[1],i=s[2],c=0;if(r.some(function(t){return 0!==e[t]})){for(n in o)l.o(o,n)&&(l.m[n]=o[n]);if(i)var m=i(l)}for(t&&t(s);c<r.length;c++)a=r[c],l.o(e,a)&&e[a]&&e[a][0](),e[a]=0;return l.O(m)},s=self.webpackJsonpSLDS___internal_chunked_docs=self.webpackJsonpSLDS___internal_chunked_docs||[];s.forEach(t.bind(null,0)),s.push=t.bind(null,s.push.bind(s))}(),l.nc=void 0;var r=l.O(void 0,[3540],function(){return l(5475)});r=l.O(r),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/docs/./ui/components/toast/docs.mdx.js"]=r}();