@salesforce-ux/design-system 2.17.2 → 2.17.3

package/__internal/chunked/docs/ui/components/feeds/docs.mdx.js

@@ -1 +1 @@
-var SLDS="object"==typeof SLDS?SLDS:{};SLDS["__internal/chunked/docs/./ui/components/feeds/docs.mdx.js"]=function(e){function t(t){for(var l,r,i=t[0],c=t[1],m=t[2],o=0,u=[];o<i.length;o++)r=i[o],Object.prototype.hasOwnProperty.call(s,r)&&s[r]&&u.push(s[r][0]),s[r]=0;for(l in c)Object.prototype.hasOwnProperty.call(c,l)&&(e[l]=c[l]);for(d&&d(t);u.length;)u.shift()();return n.push.apply(n,m||[]),a()}function a(){for(var e,t=0;t<n.length;t++){for(var a=n[t],l=!0,i=1;i<a.length;i++){var c=a[i];0!==s[c]&&(l=!1)}l&&(n.splice(t--,1),e=r(r.s=a[0]))}return e}var l={},s={36:0},n=[];function r(t){if(l[t])return l[t].exports;var a=l[t]={i:t,l:!1,exports:{}};return e[t].call(a.exports,a,a.exports,r),a.l=!0,a.exports}r.m=e,r.c=l,r.d=function(e,t,a){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(r.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var l in e)r.d(a,l,function(t){return e[t]}.bind(null,l));return a},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="/assets/scripts/bundle/";var i=this.webpackJsonpSLDS___internal_chunked_docs=this.webpackJsonpSLDS___internal_chunked_docs||[],c=i.push.bind(i);i.push=t,i=i.slice();for(var m=0;m<i.length;m++)t(i[m]);var d=c;return n.push([669,0]),a()}({0:function(e,t){e.exports=React},19:function(e,t){e.exports=ReactDOM},20:function(e,t){e.exports=JSBeautify},669:function(e,t,a){"use strict";a.r(t),a.d(t,"getElement",(function(){return z})),a.d(t,"getContents",(function(){return I}));var l=a(0),s=a.n(l),n=a(4),r=a(2),i=(a(27),a(41),a(14),a(1)),c=a(7),m=a(48),d=a(99),o=a(5),u=a.n(o),E=function(e){return s.a.createElement("article",{className:u()("slds-comment slds-media slds-hint-parent",e.className)},s.a.createElement("div",{className:"slds-media__figure"},s.a.createElement("a",{href:"#",className:"slds-avatar slds-avatar_circle slds-avatar_medium",onClick:function(e){return e.preventDefault()}},s.a.createElement("img",{alt:"Jenna Davis",src:"/assets/images/avatar2.jpg",title:"Jenna Davis avatar"}))),s.a.createElement("div",{className:"slds-media__body"},e.children))},f=function(e){return s.a.createElement("header",{className:"slds-media slds-media_center"},s.a.createElement("div",{className:"slds-grid slds-grid_align-spread slds-has-flexi-truncate"},s.a.createElement("p",{className:"slds-truncate",title:"Jenna Davis"},s.a.createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"Jenna Davis")),s.a.createElement(c.b,{className:"slds-button_icon-border slds-button_icon-x-small","aria-haspopup":"true",symbol:"down",assistiveText:"More Options",title:"More Options"})))},p=function(e){return s.a.createElement("div",{className:u()("slds-comment__content slds-text-longform",e.className)},e.children)},h=function(e){return s.a.createElement("footer",null,s.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},s.a.createElement("li",{className:"slds-item"},s.a.createElement("button",{className:"slds-button_reset slds-text-color_weak",title:"Like this item","aria-pressed":!!e.liked},e.liked?"Liked":"Like")),e.liked?s.a.createElement("li",{className:"slds-item"},"1 Like"):null,s.a.createElement("li",{className:"slds-item"},"16hr Ago")))},_=a(10),v=function(e){return s.a.createElement("ul",{className:"slds-post__footer-actions-list slds-list_horizontal"},s.a.createElement("li",{className:"slds-col slds-item slds-m-right_medium"},s.a.createElement("button",{title:"Like this item",className:u()("slds-button_reset slds-post__footer-action",e.liked?"slds-is-active":null),"aria-pressed":!!e.liked},s.a.createElement(_.a,{className:"slds-icon slds-icon-text-default slds-icon_x-small slds-align-middle",sprite:"utility",symbol:"like"}),e.liked?"Liked":"Like")),s.a.createElement("li",{className:"slds-col slds-item slds-m-right_medium"},s.a.createElement("button",{title:"Comment on this item",className:"slds-button_reset slds-post__footer-action"},s.a.createElement(_.a,{className:"slds-icon slds-icon-text-default slds-icon_x-small slds-align-middle",sprite:"utility",symbol:"share_post"})," ","Comment")),s.a.createElement("li",{className:"slds-col slds-item slds-m-right_medium"},s.a.createElement("button",{title:"Share this item",className:"slds-button_reset slds-post__footer-action"},s.a.createElement(_.a,{className:"slds-icon slds-icon-text-default slds-icon_x-small slds-align-middle",sprite:"utility",symbol:"share"})," ","Share")))},b=function(e){return s.a.createElement("ul",{className:"slds-post__footer-meta-list slds-list_horizontal slds-has-dividers_right slds-text-title"},e.comments?s.a.createElement("li",{className:"slds-item"},e.comments||"0"," comments"):null,s.a.createElement("li",{className:"slds-item"},"20 shares"),s.a.createElement("li",{className:"slds-item"},"259 views"))},N=function(e){return s.a.createElement("header",{className:"slds-post__header slds-media"},s.a.createElement("div",{className:"slds-media__figure"},s.a.createElement("a",{href:"#",className:"slds-avatar slds-avatar_circle slds-avatar_large",onClick:function(e){return e.preventDefault()}},s.a.createElement("img",{alt:"Jason Rodgers",src:"/assets/images/avatar1.jpg",title:"Jason Rodgers avatar"}))),s.a.createElement("div",{className:"slds-media__body"},s.a.createElement("div",{className:"slds-grid slds-grid_align-spread slds-has-flexi-truncate"},s.a.createElement("p",null,s.a.createElement("a",{href:"#",title:"Jason Rodgers",onClick:function(e){return e.preventDefault()}},"Jason Rogers")," ","—"," ",s.a.createElement("a",{href:"#",title:"Design Systems",onClick:function(e){return e.preventDefault()}},"Design Systems")),s.a.createElement(c.b,{className:"slds-button_icon-border slds-button_icon-x-small","aria-haspopup":"true",symbol:"down",assistiveText:"More Options",title:"More Options"})),s.a.createElement("p",{className:"slds-text-body_small"},s.a.createElement("a",{href:"#",title:"Click for single-item view of this post",className:"slds-text-link_reset",onClick:function(e){return e.preventDefault()}},"5 days Ago"))))},g=function(e){return s.a.createElement("div",{className:u()("slds-post__content slds-text-longform",e.className)},e.children)},y=function(e){return s.a.createElement("footer",{className:u()("slds-post__footer",e.className)},e.children)},k=function(e){return s.a.createElement("article",{className:u()("slds-post",e.className)},e.children)},w=function(e){return s.a.createElement("div",{className:"slds-feed__item-comments"},e.children)},x=function(e){return s.a.createElement("ul",null,i.d.times(e.comments||1,(function(e){return s.a.createElement("li",{key:"comment-".concat(e)},s.a.createElement(E,null,s.a.createElement(f,null),s.a.createElement(p,null,"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."),s.a.createElement(h,null)))})))},D=s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null)))))),O=[{id:"post-with-liker-bar",label:"Like",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,{liked:!0}),s.a.createElement(b,{liked:!0}))),s.a.createElement(w,null,s.a.createElement("div",{className:"slds-p-horizontal_medium slds-p-vertical_x-small"},s.a.createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"You")," ","liked this post")))))}],j=[{id:"post-attachment-link",label:"Link attachment",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement("div",{className:"slds-post__payload"},s.a.createElement(m.a,{articleTitle:"Maui By Air The Best Way Around The Island",articleDescription:"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt."})),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null))))))},{id:"post-attachment-files",label:"Files(s) attachment",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement("div",{className:"slds-post__payload"},s.a.createElement("ul",{className:"slds-grid slds-grid_pull-padded"},s.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},s.a.createElement(m.b,{isCard:!0,has16x9Crop:!0,hasTitleCard:!0,symbol:"image",hasImage:!0})),s.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3 slds-medium-show"},s.a.createElement(m.b,{isCard:!0,has16x9Crop:!0,hasTitleCard:!0,symbol:"pdf"})),s.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},s.a.createElement(m.b,{isCard:!0,has16x9Crop:!0,title:"22+",hasImage:!0,hasOverlay:!0})))),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null))))))},{id:"post-with-comments",label:"With replies",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,{comments:"2"}))),s.a.createElement(w,null,s.a.createElement(x,{comments:"2"}),s.a.createElement(d.a,null)))))},{id:"post-with-overflow",label:"Replies - Overflow Bar",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,{comments:"8"}))),s.a.createElement(w,null,s.a.createElement("div",{className:"slds-p-horizontal_medium slds-p-vertical_x-small slds-grid"},s.a.createElement("button",{className:"slds-button_reset slds-text-link"},"More comments"),s.a.createElement("span",{className:"slds-text-body_small slds-col_bump-left"},"1 of 8")),s.a.createElement(x,null),s.a.createElement(d.a,null)))))},{id:"post-with-publisher-active",label:"Replies - Publisher active",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,{comments:"8"}))),s.a.createElement(w,null,s.a.createElement("div",{className:"slds-p-horizontal_medium slds-p-vertical_x-small slds-grid"},s.a.createElement("button",{className:"slds-button_reset slds-text-link"},"More comments"),s.a.createElement("span",{className:"slds-text-body_small slds-col_bump-left"},"1 of 8")),s.a.createElement(x,null),s.a.createElement(d.a,{className:"slds-is-active slds-has-focus"})))))},{id:"questions",label:"Question",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("h3",{className:"slds-text-heading_small"},"Barbecue Party Tips For A Truly Amazing Event?"),s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null))))))}],J=s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",onClick:function(e){return e.preventDefault()},title:"Jenna Davis"},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null))),s.a.createElement(w,null,s.a.createElement("div",{className:"slds-p-horizontal_medium slds-p-vertical_x-small slds-grid"},s.a.createElement("button",{className:"slds-button_reset slds-text-link"},"More comments"),s.a.createElement("span",{className:"slds-text-body_small slds-col_bump-left"},"1 of 8")),s.a.createElement("ul",null,s.a.createElement("li",null,s.a.createElement(E,null,s.a.createElement(f,null),s.a.createElement(p,null,"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."),s.a.createElement(h,null)))))),s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",onClick:function(e){return e.preventDefault()},title:"Jenna Davis"},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null)))))),C=n.c.code,S=n.c.h2,L=n.c.h3,H=n.c.p,z=function(){return Object(l.createElement)(n.b,{},Object(l.createElement)("div",{className:"doc lead"},"A feed consists of a list of recurring elements of similar types. Examples of a feed would be a discussion feed."),Object(l.createElement)(r.a,{exampleOnly:!0},Object(i.f)(O,"post-with-liker-bar")),S({id:"About-Feeds"},"About Feeds"),L({id:"Accessibility"},"Accessibility"),H({},"Most feeds have a media object containing the user's name and avatar image. If both the image and the name link to the same location, add ",C({},'tab-index="-1"')," to the ",C({},"<a>")," element so that assistive technology does not read out duplicate links."),S({id:"Base"},"Base"),Object(l.createElement)(r.a,null,Object(i.f)(J)),S({id:"Post"},"Post"),Object(l.createElement)(r.a,null,Object(i.f)(D)),S({id:"Examples"},"Examples"),L({id:"Link-attachment"},"Link attachment"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-attachment-link")),L({id:"Files(s)-attachment"},"Files(s) attachment"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-attachment-files")),L({id:"With-replies"},"With replies"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-with-comments")),L({id:"Replies-Overflow-Bar"},"Replies - Overflow Bar"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-with-overflow")),L({id:"Replies-Publisher-active"},"Replies - Publisher active"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-with-publisher-active")),L({id:"Question"},"Question"),Object(l.createElement)(r.a,null,Object(i.f)(j,"questions")),S({id:"States"},"States"),L({id:"Like"},"Like"),Object(l.createElement)(r.a,null,Object(i.f)(O,"post-with-liker-bar")))},I=function(){return Object(n.a)(z())}}});
+var SLDS="object"==typeof SLDS?SLDS:{};SLDS["__internal/chunked/docs/./ui/components/feeds/docs.mdx.js"]=function(e){function t(t){for(var l,r,i=t[0],c=t[1],m=t[2],o=0,u=[];o<i.length;o++)r=i[o],Object.prototype.hasOwnProperty.call(s,r)&&s[r]&&u.push(s[r][0]),s[r]=0;for(l in c)Object.prototype.hasOwnProperty.call(c,l)&&(e[l]=c[l]);for(d&&d(t);u.length;)u.shift()();return n.push.apply(n,m||[]),a()}function a(){for(var e,t=0;t<n.length;t++){for(var a=n[t],l=!0,i=1;i<a.length;i++){var c=a[i];0!==s[c]&&(l=!1)}l&&(n.splice(t--,1),e=r(r.s=a[0]))}return e}var l={},s={36:0},n=[];function r(t){if(l[t])return l[t].exports;var a=l[t]={i:t,l:!1,exports:{}};return e[t].call(a.exports,a,a.exports,r),a.l=!0,a.exports}r.m=e,r.c=l,r.d=function(e,t,a){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(r.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var l in e)r.d(a,l,function(t){return e[t]}.bind(null,l));return a},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="/assets/scripts/bundle/";var i=this.webpackJsonpSLDS___internal_chunked_docs=this.webpackJsonpSLDS___internal_chunked_docs||[],c=i.push.bind(i);i.push=t,i=i.slice();for(var m=0;m<i.length;m++)t(i[m]);var d=c;return n.push([670,0]),a()}({0:function(e,t){e.exports=React},20:function(e,t){e.exports=ReactDOM},21:function(e,t){e.exports=JSBeautify},670:function(e,t,a){"use strict";a.r(t),a.d(t,"getElement",(function(){return z})),a.d(t,"getContents",(function(){return I}));var l=a(0),s=a.n(l),n=a(4),r=a(2),i=(a(28),a(42),a(14),a(1)),c=a(7),m=a(49),d=a(100),o=a(5),u=a.n(o),E=function(e){return s.a.createElement("article",{className:u()("slds-comment slds-media slds-hint-parent",e.className)},s.a.createElement("div",{className:"slds-media__figure"},s.a.createElement("a",{href:"#",className:"slds-avatar slds-avatar_circle slds-avatar_medium",onClick:function(e){return e.preventDefault()}},s.a.createElement("img",{alt:"Jenna Davis",src:"/assets/images/avatar2.jpg",title:"Jenna Davis avatar"}))),s.a.createElement("div",{className:"slds-media__body"},e.children))},f=function(e){return s.a.createElement("header",{className:"slds-media slds-media_center"},s.a.createElement("div",{className:"slds-grid slds-grid_align-spread slds-has-flexi-truncate"},s.a.createElement("p",{className:"slds-truncate",title:"Jenna Davis"},s.a.createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"Jenna Davis")),s.a.createElement(c.b,{className:"slds-button_icon-border slds-button_icon-x-small","aria-haspopup":"true",symbol:"down",assistiveText:"More Options",title:"More Options"})))},p=function(e){return s.a.createElement("div",{className:u()("slds-comment__content slds-text-longform",e.className)},e.children)},h=function(e){return s.a.createElement("footer",null,s.a.createElement("ul",{className:"slds-list_horizontal slds-has-dividers_right slds-text-body_small"},s.a.createElement("li",{className:"slds-item"},s.a.createElement("button",{className:"slds-button_reset slds-text-color_weak",title:"Like this item","aria-pressed":!!e.liked},e.liked?"Liked":"Like")),e.liked?s.a.createElement("li",{className:"slds-item"},"1 Like"):null,s.a.createElement("li",{className:"slds-item"},"16hr Ago")))},_=a(10),v=function(e){return s.a.createElement("ul",{className:"slds-post__footer-actions-list slds-list_horizontal"},s.a.createElement("li",{className:"slds-col slds-item slds-m-right_medium"},s.a.createElement("button",{title:"Like this item",className:u()("slds-button_reset slds-post__footer-action",e.liked?"slds-is-active":null),"aria-pressed":!!e.liked},s.a.createElement(_.a,{className:"slds-icon slds-icon-text-default slds-icon_x-small slds-align-middle",sprite:"utility",symbol:"like"}),e.liked?"Liked":"Like")),s.a.createElement("li",{className:"slds-col slds-item slds-m-right_medium"},s.a.createElement("button",{title:"Comment on this item",className:"slds-button_reset slds-post__footer-action"},s.a.createElement(_.a,{className:"slds-icon slds-icon-text-default slds-icon_x-small slds-align-middle",sprite:"utility",symbol:"share_post"})," ","Comment")),s.a.createElement("li",{className:"slds-col slds-item slds-m-right_medium"},s.a.createElement("button",{title:"Share this item",className:"slds-button_reset slds-post__footer-action"},s.a.createElement(_.a,{className:"slds-icon slds-icon-text-default slds-icon_x-small slds-align-middle",sprite:"utility",symbol:"share"})," ","Share")))},b=function(e){return s.a.createElement("ul",{className:"slds-post__footer-meta-list slds-list_horizontal slds-has-dividers_right slds-text-title"},e.comments?s.a.createElement("li",{className:"slds-item"},e.comments||"0"," comments"):null,s.a.createElement("li",{className:"slds-item"},"20 shares"),s.a.createElement("li",{className:"slds-item"},"259 views"))},N=function(e){return s.a.createElement("header",{className:"slds-post__header slds-media"},s.a.createElement("div",{className:"slds-media__figure"},s.a.createElement("a",{href:"#",className:"slds-avatar slds-avatar_circle slds-avatar_large",onClick:function(e){return e.preventDefault()}},s.a.createElement("img",{alt:"Jason Rodgers",src:"/assets/images/avatar1.jpg",title:"Jason Rodgers avatar"}))),s.a.createElement("div",{className:"slds-media__body"},s.a.createElement("div",{className:"slds-grid slds-grid_align-spread slds-has-flexi-truncate"},s.a.createElement("p",null,s.a.createElement("a",{href:"#",title:"Jason Rodgers",onClick:function(e){return e.preventDefault()}},"Jason Rogers")," ","—"," ",s.a.createElement("a",{href:"#",title:"Design Systems",onClick:function(e){return e.preventDefault()}},"Design Systems")),s.a.createElement(c.b,{className:"slds-button_icon-border slds-button_icon-x-small","aria-haspopup":"true",symbol:"down",assistiveText:"More Options",title:"More Options"})),s.a.createElement("p",{className:"slds-text-body_small"},s.a.createElement("a",{href:"#",title:"Click for single-item view of this post",className:"slds-text-link_reset",onClick:function(e){return e.preventDefault()}},"5 days Ago"))))},g=function(e){return s.a.createElement("div",{className:u()("slds-post__content slds-text-longform",e.className)},e.children)},y=function(e){return s.a.createElement("footer",{className:u()("slds-post__footer",e.className)},e.children)},k=function(e){return s.a.createElement("article",{className:u()("slds-post",e.className)},e.children)},w=function(e){return s.a.createElement("div",{className:"slds-feed__item-comments"},e.children)},x=function(e){return s.a.createElement("ul",null,i.d.times(e.comments||1,(function(e){return s.a.createElement("li",{key:"comment-".concat(e)},s.a.createElement(E,null,s.a.createElement(f,null),s.a.createElement(p,null,"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."),s.a.createElement(h,null)))})))},D=s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null)))))),O=[{id:"post-with-liker-bar",label:"Like",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,{liked:!0}),s.a.createElement(b,{liked:!0}))),s.a.createElement(w,null,s.a.createElement("div",{className:"slds-p-horizontal_medium slds-p-vertical_x-small"},s.a.createElement("a",{href:"#",onClick:function(e){return e.preventDefault()}},"You")," ","liked this post")))))}],j=[{id:"post-attachment-link",label:"Link attachment",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement("div",{className:"slds-post__payload"},s.a.createElement(m.a,{articleTitle:"Maui By Air The Best Way Around The Island",articleDescription:"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt."})),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null))))))},{id:"post-attachment-files",label:"Files(s) attachment",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement("div",{className:"slds-post__payload"},s.a.createElement("ul",{className:"slds-grid slds-grid_pull-padded"},s.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},s.a.createElement(m.b,{isCard:!0,has16x9Crop:!0,hasTitleCard:!0,symbol:"image",hasImage:!0})),s.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3 slds-medium-show"},s.a.createElement(m.b,{isCard:!0,has16x9Crop:!0,hasTitleCard:!0,symbol:"pdf"})),s.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},s.a.createElement(m.b,{isCard:!0,has16x9Crop:!0,title:"22+",hasImage:!0,hasOverlay:!0})))),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null))))))},{id:"post-with-comments",label:"With replies",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,{comments:"2"}))),s.a.createElement(w,null,s.a.createElement(x,{comments:"2"}),s.a.createElement(d.a,null)))))},{id:"post-with-overflow",label:"Replies - Overflow Bar",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,{comments:"8"}))),s.a.createElement(w,null,s.a.createElement("div",{className:"slds-p-horizontal_medium slds-p-vertical_x-small slds-grid"},s.a.createElement("button",{className:"slds-button_reset slds-text-link"},"More comments"),s.a.createElement("span",{className:"slds-text-body_small slds-col_bump-left"},"1 of 8")),s.a.createElement(x,null),s.a.createElement(d.a,null)))))},{id:"post-with-publisher-active",label:"Replies - Publisher active",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,{comments:"8"}))),s.a.createElement(w,null,s.a.createElement("div",{className:"slds-p-horizontal_medium slds-p-vertical_x-small slds-grid"},s.a.createElement("button",{className:"slds-button_reset slds-text-link"},"More comments"),s.a.createElement("span",{className:"slds-text-body_small slds-col_bump-left"},"1 of 8")),s.a.createElement(x,null),s.a.createElement(d.a,{className:"slds-is-active slds-has-focus"})))))},{id:"questions",label:"Question",element:s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("h3",{className:"slds-text-heading_small"},"Barbecue Party Tips For A Truly Amazing Event?"),s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",title:"Jenna Davis",onClick:function(e){return e.preventDefault()}},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null))))))}],J=s.a.createElement("div",{className:"slds-feed"},s.a.createElement("ul",{className:"slds-feed__list"},s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",onClick:function(e){return e.preventDefault()},title:"Jenna Davis"},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null))),s.a.createElement(w,null,s.a.createElement("div",{className:"slds-p-horizontal_medium slds-p-vertical_x-small slds-grid"},s.a.createElement("button",{className:"slds-button_reset slds-text-link"},"More comments"),s.a.createElement("span",{className:"slds-text-body_small slds-col_bump-left"},"1 of 8")),s.a.createElement("ul",null,s.a.createElement("li",null,s.a.createElement(E,null,s.a.createElement(f,null),s.a.createElement(p,null,"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."),s.a.createElement(h,null)))))),s.a.createElement("li",{className:"slds-feed__item"},s.a.createElement(k,null,s.a.createElement(N,null),s.a.createElement(g,null,s.a.createElement("p",null,"Hey there! Here's the latest demo presentation"," ",s.a.createElement("a",{href:"#",onClick:function(e){return e.preventDefault()},title:"Jenna Davis"},"@Jenna Davis"),", let me know if there are any changes. I've updated slides 3-8 and slides 16-18 slides with new product shots.")),s.a.createElement(y,null,s.a.createElement(v,null),s.a.createElement(b,null)))))),C=n.c.code,S=n.c.h2,L=n.c.h3,H=n.c.p,z=function(){return Object(l.createElement)(n.b,{},Object(l.createElement)("div",{className:"doc lead"},"A feed consists of a list of recurring elements of similar types. Examples of a feed would be a discussion feed."),Object(l.createElement)(r.a,{exampleOnly:!0},Object(i.f)(O,"post-with-liker-bar")),S({id:"About-Feeds"},"About Feeds"),L({id:"Accessibility"},"Accessibility"),H({},"Most feeds have a media object containing the user's name and avatar image. If both the image and the name link to the same location, add ",C({},'tab-index="-1"')," to the ",C({},"<a>")," element so that assistive technology does not read out duplicate links."),S({id:"Base"},"Base"),Object(l.createElement)(r.a,null,Object(i.f)(J)),S({id:"Post"},"Post"),Object(l.createElement)(r.a,null,Object(i.f)(D)),S({id:"Examples"},"Examples"),L({id:"Link-attachment"},"Link attachment"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-attachment-link")),L({id:"Files(s)-attachment"},"Files(s) attachment"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-attachment-files")),L({id:"With-replies"},"With replies"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-with-comments")),L({id:"Replies-Overflow-Bar"},"Replies - Overflow Bar"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-with-overflow")),L({id:"Replies-Publisher-active"},"Replies - Publisher active"),Object(l.createElement)(r.a,null,Object(i.f)(j,"post-with-publisher-active")),L({id:"Question"},"Question"),Object(l.createElement)(r.a,null,Object(i.f)(j,"questions")),S({id:"States"},"States"),L({id:"Like"},"Like"),Object(l.createElement)(r.a,null,Object(i.f)(O,"post-with-liker-bar")))},I=function(){return Object(n.a)(z())}}});

package/__internal/chunked/docs/ui/components/file-selector/docs.mdx.js

@@ -1 +1 @@
-var SLDS="object"==typeof SLDS?SLDS:{};SLDS["__internal/chunked/docs/./ui/components/file-selector/docs.mdx.js"]=function(e){function t(t){for(var l,o,s=t[0],n=t[1],c=t[2],u=0,m=[];u<s.length;u++)o=s[u],Object.prototype.hasOwnProperty.call(a,o)&&a[o]&&m.push(a[o][0]),a[o]=0;for(l in n)Object.prototype.hasOwnProperty.call(n,l)&&(e[l]=n[l]);for(d&&d(t);m.length;)m.shift()();return i.push.apply(i,c||[]),r()}function r(){for(var e,t=0;t<i.length;t++){for(var r=i[t],l=!0,s=1;s<r.length;s++){var n=r[s];0!==a[n]&&(l=!1)}l&&(i.splice(t--,1),e=o(o.s=r[0]))}return e}var l={},a={37:0},i=[];function o(t){if(l[t])return l[t].exports;var r=l[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,o),r.l=!0,r.exports}o.m=e,o.c=l,o.d=function(e,t,r){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},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,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(o.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var l in e)o.d(r,l,function(t){return e[t]}.bind(null,l));return r},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="/assets/scripts/bundle/";var s=this.webpackJsonpSLDS___internal_chunked_docs=this.webpackJsonpSLDS___internal_chunked_docs||[],n=s.push.bind(s);s.push=t,s=s.slice();for(var c=0;c<s.length;c++)t(s[c]);var d=n;return i.push([660,0]),r()}({0:function(e,t){e.exports=React},19:function(e,t){e.exports=ReactDOM},20:function(e,t){e.exports=JSBeautify},660:function(e,t,r){"use strict";r.r(t),r.d(t,"getElement",(function(){return N})),r.d(t,"getContents",(function(){return q}));var l=r(0),a=r.n(l),i=r(4),o=r(2),s=(r(27),r(41),r(14),r(1)),n=r(5),c=r.n(n),d=r(26),u=r.n(d),m=r(10),f=function(e){var t=u()("file-selector-primary-label-"),r=u()("file-selector-secondary-label"),l=u()("file-upload-input-"),i=u()("error-");return a.a.createElement("div",{className:c()("slds-form-element",{"slds-has-error":e.error})},a.a.createElement("span",{className:"slds-form-element__label",id:t},"Attachment"),a.a.createElement("div",{className:"slds-form-element__control"},a.a.createElement("div",{className:c()("slds-file-selector",{"slds-file-selector_files":e.files,"slds-file-selector_images":e.images})},a.a.createElement("div",{className:c()("slds-file-selector__dropzone",{"slds-has-drag-over":e.dragover})},a.a.createElement("input",{className:"slds-file-selector__input slds-assistive-text",accept:"image/png",type:"file",id:l,disabled:e.dragoverError,"aria-describedby":e.error?i:null,"aria-labelledby":c()(t,r)}),a.a.createElement("label",{className:"slds-file-selector__body",htmlFor:l,id:r},a.a.createElement("span",{className:"slds-file-selector__button slds-button slds-button_neutral"},a.a.createElement(m.a,{className:"slds-button__icon slds-button__icon_left",sprite:"utility",symbol:"upload"}),"Upload ",e.files?"Files":"Image"),a.a.createElement("span",{className:"slds-file-selector__text slds-medium-show"},"or Drop ",e.files?"Files":"Image"))))),e.error&&a.a.createElement("div",{className:"slds-form-element__help",id:i},"File type not supported"))},p=a.a.createElement(f,{files:!0}),g=[{id:"file-selector-files-error",label:"Error",element:a.a.createElement(f,{files:!0,error:!0})},{id:"file-selector-files-dragover",label:"Dragover",element:a.a.createElement(f,{files:!0,dragover:!0})},{id:"file-selector-files-dragover-error",label:"Dragover with error",element:a.a.createElement(f,{files:!0,dragoverError:!0,error:!0})}],b=[{id:"default",label:"Files - Default",demoStyles:"max-width: 320px",storybookStyles:!0,element:a.a.createElement(f,{images:!0})}],v=[{id:"file-selector-images-error",label:"Error",demoStyles:"max-width: 320px",storybookStyles:!0,element:a.a.createElement(f,{images:!0,error:!0})},{id:"file-selector-images-dragover",label:"Dragover",demoStyles:"max-width: 320px",storybookStyles:!0,element:a.a.createElement(f,{images:!0,dragover:!0})},{id:"file-selector-images-dragover-error",label:"Dragover with error",demoStyles:"max-width: 320px",storybookStyles:!0,element:a.a.createElement(f,{images:!0,dragoverError:!0,error:!0})}],h=function(e){return a.a.createElement("div",{className:c()("slds-file-selector slds-file-selector_integrated",e.className)},a.a.createElement("div",{className:c()("slds-file-selector__dropzone slds-file-selector__dropzone_integrated",e.drag?"slds-has-drag":null,e.dragover?"slds-has-drag-over":null),"aria-hidden":"true"},a.a.createElement("input",{className:"slds-file-selector__input slds-assistive-text",accept:"image/png",type:"file",id:"file-upload-input-01",disabled:e.dragoverError,tabIndex:"-1"}),a.a.createElement("label",{className:"slds-file-selector__body slds-file-selector__body_integrated",htmlFor:"file-upload-input-01"},e.dragoverError?a.a.createElement(m.a,{className:"slds-file-selector__body-icon slds-icon slds-icon-text-default",sprite:"utility",symbol:"error"}):a.a.createElement(m.a,{className:"slds-file-selector__body-icon slds-icon slds-icon-text-default",sprite:"utility",symbol:"upload"}),a.a.createElement("span",{className:"slds-file-selector__text slds-file-selector__text_integrated slds-text-heading_medium slds-text-align_center"},e.dragoverError?"Too many files selected. Attach up to 1 file.":"Drop Files"))),e.children)},y=[{id:"default",label:"Integrated File Selector - Default",demoStyles:"width: 320px; height: 320px",storybookStyles:!0,element:a.a.createElement(h,{className:"slds-file-selector_integrated"},"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")}],_=[{id:"integrated-file-selector-drag",label:"Drag",demoStyles:"width: 320px; height: 320px",storybookStyles:!0,element:a.a.createElement(h,{className:"slds-file-selector_integrated",drag:!0},"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")},{id:"integrated-file-selector-dragover",label:"Dragover",demoStyles:"width: 320px; height: 320px",storybookStyles:!0,element:a.a.createElement(h,{className:"slds-file-selector_integrated",drag:!0,dragover:!0},"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")},{id:"integrated-file-selector-dragover-error",label:"Dragover with error",demoStyles:"width: 320px; height: 320px",storybookStyles:!0,element:a.a.createElement(h,{className:"slds-file-selector_integrated",drag:!0,dragoverError:!0,error:!0},"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")}],E=i.c.code,x=i.c.h2,S=i.c.h3,O=i.c.h4,j=i.c.li,D=i.c.p,w=i.c.ul,N=function(){return Object(l.createElement)(i.b,{},Object(l.createElement)("div",{className:"doc lead"},"The File selector component allows the user to select file(s) from a user’s file system. Either natively using an file input or drag and drop."),Object(l.createElement)(o.a,{exampleOnly:!0},Object(s.f)(p)),x({id:"About-File-Selector"},"About File Selector"),S({id:"Accessibility"},"Accessibility"),D({},"When implementing this component, pay special attention to the following:"),O({id:"Markup"},"Markup"),w({},j({},E({},"aria-labelledby")," is placed on the HTML ",E({},"input"),' to form an "Accessible Label" from 2 separate visible text labels, by referencing their ',E({},"id")," attributes")),x({id:"Base"},"Base"),Object(l.createElement)(o.a,null,Object(s.f)(p)),x({id:"States"},"States"),S({id:"Error"},"Error"),Object(l.createElement)(o.a,null,Object(s.f)(g,"file-selector-files-error")),S({id:"Dragover"},"Dragover"),Object(l.createElement)(o.a,null,Object(s.f)(g,"file-selector-files-dragover")),S({id:"Dragover-with-error"},"Dragover with error"),Object(l.createElement)(o.a,null,Object(s.f)(g,"file-selector-files-dragover-error")),x({id:"Image"},"Image"),D({},"Multi Line / Image"),D({},"Use as a dedicated dropzone for image files only. May require a cropping control."),Object(l.createElement)(o.a,null,Object(s.f)(b)),x({id:"States-2"},"States"),S({id:"Error-2"},"Error"),Object(l.createElement)(o.a,null,Object(s.f)(v,"file-selector-images-error")),S({id:"Dragover-2"},"Dragover"),Object(l.createElement)(o.a,null,Object(s.f)(v,"file-selector-images-dragover")),S({id:"Dragover-with-error-2"},"Dragover with error"),Object(l.createElement)(o.a,null,Object(s.f)(v,"file-selector-images-dragover-error")),x({id:"Integrated"},"Integrated"),D({},"Invisible Dropzone (Container)"),D({},"Use when an entire container should be droppable. The container should have a visible boundary, like a modal, composer, or page."),Object(l.createElement)(o.a,null,Object(s.f)(y)),x({id:"States-3"},"States"),S({id:"Drag"},"Drag"),Object(l.createElement)(o.a,null,Object(s.f)(_,"integrated-file-selector-drag")),S({id:"Dragover-3"},"Dragover"),Object(l.createElement)(o.a,null,Object(s.f)(_,"integrated-file-selector-dragover")),S({id:"Dragover-with-error-3"},"Dragover with error"),Object(l.createElement)(o.a,null,Object(s.f)(_,"integrated-file-selector-dragover-error")))},q=function(){return Object(i.a)(N())}}});
+var SLDS="object"==typeof SLDS?SLDS:{};SLDS["__internal/chunked/docs/./ui/components/file-selector/docs.mdx.js"]=function(e){function t(t){for(var l,o,s=t[0],n=t[1],c=t[2],u=0,m=[];u<s.length;u++)o=s[u],Object.prototype.hasOwnProperty.call(a,o)&&a[o]&&m.push(a[o][0]),a[o]=0;for(l in n)Object.prototype.hasOwnProperty.call(n,l)&&(e[l]=n[l]);for(d&&d(t);m.length;)m.shift()();return i.push.apply(i,c||[]),r()}function r(){for(var e,t=0;t<i.length;t++){for(var r=i[t],l=!0,s=1;s<r.length;s++){var n=r[s];0!==a[n]&&(l=!1)}l&&(i.splice(t--,1),e=o(o.s=r[0]))}return e}var l={},a={37:0},i=[];function o(t){if(l[t])return l[t].exports;var r=l[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,o),r.l=!0,r.exports}o.m=e,o.c=l,o.d=function(e,t,r){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},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,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(o.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var l in e)o.d(r,l,function(t){return e[t]}.bind(null,l));return r},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="/assets/scripts/bundle/";var s=this.webpackJsonpSLDS___internal_chunked_docs=this.webpackJsonpSLDS___internal_chunked_docs||[],n=s.push.bind(s);s.push=t,s=s.slice();for(var c=0;c<s.length;c++)t(s[c]);var d=n;return i.push([661,0]),r()}({0:function(e,t){e.exports=React},20:function(e,t){e.exports=ReactDOM},21:function(e,t){e.exports=JSBeautify},661:function(e,t,r){"use strict";r.r(t),r.d(t,"getElement",(function(){return N})),r.d(t,"getContents",(function(){return q}));var l=r(0),a=r.n(l),i=r(4),o=r(2),s=(r(28),r(42),r(14),r(1)),n=r(5),c=r.n(n),d=r(27),u=r.n(d),m=r(10),f=function(e){var t=u()("file-selector-primary-label-"),r=u()("file-selector-secondary-label"),l=u()("file-upload-input-"),i=u()("error-");return a.a.createElement("div",{className:c()("slds-form-element",{"slds-has-error":e.error})},a.a.createElement("span",{className:"slds-form-element__label",id:t},"Attachment"),a.a.createElement("div",{className:"slds-form-element__control"},a.a.createElement("div",{className:c()("slds-file-selector",{"slds-file-selector_files":e.files,"slds-file-selector_images":e.images})},a.a.createElement("div",{className:c()("slds-file-selector__dropzone",{"slds-has-drag-over":e.dragover})},a.a.createElement("input",{className:"slds-file-selector__input slds-assistive-text",accept:"image/png",type:"file",id:l,disabled:e.dragoverError,"aria-describedby":e.error?i:null,"aria-labelledby":c()(t,r)}),a.a.createElement("label",{className:"slds-file-selector__body",htmlFor:l,id:r},a.a.createElement("span",{className:"slds-file-selector__button slds-button slds-button_neutral"},a.a.createElement(m.a,{className:"slds-button__icon slds-button__icon_left",sprite:"utility",symbol:"upload"}),"Upload ",e.files?"Files":"Image"),a.a.createElement("span",{className:"slds-file-selector__text slds-medium-show"},"or Drop ",e.files?"Files":"Image"))))),e.error&&a.a.createElement("div",{className:"slds-form-element__help",id:i},"File type not supported"))},p=a.a.createElement(f,{files:!0}),g=[{id:"file-selector-files-error",label:"Error",element:a.a.createElement(f,{files:!0,error:!0})},{id:"file-selector-files-dragover",label:"Dragover",element:a.a.createElement(f,{files:!0,dragover:!0})},{id:"file-selector-files-dragover-error",label:"Dragover with error",element:a.a.createElement(f,{files:!0,dragoverError:!0,error:!0})}],b=[{id:"default",label:"Files - Default",demoStyles:"max-width: 320px",storybookStyles:!0,element:a.a.createElement(f,{images:!0})}],v=[{id:"file-selector-images-error",label:"Error",demoStyles:"max-width: 320px",storybookStyles:!0,element:a.a.createElement(f,{images:!0,error:!0})},{id:"file-selector-images-dragover",label:"Dragover",demoStyles:"max-width: 320px",storybookStyles:!0,element:a.a.createElement(f,{images:!0,dragover:!0})},{id:"file-selector-images-dragover-error",label:"Dragover with error",demoStyles:"max-width: 320px",storybookStyles:!0,element:a.a.createElement(f,{images:!0,dragoverError:!0,error:!0})}],h=function(e){return a.a.createElement("div",{className:c()("slds-file-selector slds-file-selector_integrated",e.className)},a.a.createElement("div",{className:c()("slds-file-selector__dropzone slds-file-selector__dropzone_integrated",e.drag?"slds-has-drag":null,e.dragover?"slds-has-drag-over":null),"aria-hidden":"true"},a.a.createElement("input",{className:"slds-file-selector__input slds-assistive-text",accept:"image/png",type:"file",id:"file-upload-input-01",disabled:e.dragoverError,tabIndex:"-1"}),a.a.createElement("label",{className:"slds-file-selector__body slds-file-selector__body_integrated",htmlFor:"file-upload-input-01"},e.dragoverError?a.a.createElement(m.a,{className:"slds-file-selector__body-icon slds-icon slds-icon-text-default",sprite:"utility",symbol:"error"}):a.a.createElement(m.a,{className:"slds-file-selector__body-icon slds-icon slds-icon-text-default",sprite:"utility",symbol:"upload"}),a.a.createElement("span",{className:"slds-file-selector__text slds-file-selector__text_integrated slds-text-heading_medium slds-text-align_center"},e.dragoverError?"Too many files selected. Attach up to 1 file.":"Drop Files"))),e.children)},y=[{id:"default",label:"Integrated File Selector - Default",demoStyles:"width: 320px; height: 320px",storybookStyles:!0,element:a.a.createElement(h,{className:"slds-file-selector_integrated"},"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")}],_=[{id:"integrated-file-selector-drag",label:"Drag",demoStyles:"width: 320px; height: 320px",storybookStyles:!0,element:a.a.createElement(h,{className:"slds-file-selector_integrated",drag:!0},"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")},{id:"integrated-file-selector-dragover",label:"Dragover",demoStyles:"width: 320px; height: 320px",storybookStyles:!0,element:a.a.createElement(h,{className:"slds-file-selector_integrated",drag:!0,dragover:!0},"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")},{id:"integrated-file-selector-dragover-error",label:"Dragover with error",demoStyles:"width: 320px; height: 320px",storybookStyles:!0,element:a.a.createElement(h,{className:"slds-file-selector_integrated",drag:!0,dragoverError:!0,error:!0},"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")}],E=i.c.code,x=i.c.h2,S=i.c.h3,O=i.c.h4,j=i.c.li,D=i.c.p,w=i.c.ul,N=function(){return Object(l.createElement)(i.b,{},Object(l.createElement)("div",{className:"doc lead"},"The File selector component allows the user to select file(s) from a user’s file system. Either natively using an file input or drag and drop."),Object(l.createElement)(o.a,{exampleOnly:!0},Object(s.f)(p)),x({id:"About-File-Selector"},"About File Selector"),S({id:"Accessibility"},"Accessibility"),D({},"When implementing this component, pay special attention to the following:"),O({id:"Markup"},"Markup"),w({},j({},E({},"aria-labelledby")," is placed on the HTML ",E({},"input"),' to form an "Accessible Label" from 2 separate visible text labels, by referencing their ',E({},"id")," attributes")),x({id:"Base"},"Base"),Object(l.createElement)(o.a,null,Object(s.f)(p)),x({id:"States"},"States"),S({id:"Error"},"Error"),Object(l.createElement)(o.a,null,Object(s.f)(g,"file-selector-files-error")),S({id:"Dragover"},"Dragover"),Object(l.createElement)(o.a,null,Object(s.f)(g,"file-selector-files-dragover")),S({id:"Dragover-with-error"},"Dragover with error"),Object(l.createElement)(o.a,null,Object(s.f)(g,"file-selector-files-dragover-error")),x({id:"Image"},"Image"),D({},"Multi Line / Image"),D({},"Use as a dedicated dropzone for image files only. May require a cropping control."),Object(l.createElement)(o.a,null,Object(s.f)(b)),x({id:"States-2"},"States"),S({id:"Error-2"},"Error"),Object(l.createElement)(o.a,null,Object(s.f)(v,"file-selector-images-error")),S({id:"Dragover-2"},"Dragover"),Object(l.createElement)(o.a,null,Object(s.f)(v,"file-selector-images-dragover")),S({id:"Dragover-with-error-2"},"Dragover with error"),Object(l.createElement)(o.a,null,Object(s.f)(v,"file-selector-images-dragover-error")),x({id:"Integrated"},"Integrated"),D({},"Invisible Dropzone (Container)"),D({},"Use when an entire container should be droppable. The container should have a visible boundary, like a modal, composer, or page."),Object(l.createElement)(o.a,null,Object(s.f)(y)),x({id:"States-3"},"States"),S({id:"Drag"},"Drag"),Object(l.createElement)(o.a,null,Object(s.f)(_,"integrated-file-selector-drag")),S({id:"Dragover-3"},"Dragover"),Object(l.createElement)(o.a,null,Object(s.f)(_,"integrated-file-selector-dragover")),S({id:"Dragover-with-error-3"},"Dragover with error"),Object(l.createElement)(o.a,null,Object(s.f)(_,"integrated-file-selector-dragover-error")))},q=function(){return Object(i.a)(N())}}});

package/__internal/chunked/docs/ui/components/files/docs.mdx.js

@@ -1 +1 @@
-var SLDS="object"==typeof SLDS?SLDS:{};SLDS["__internal/chunked/docs/./ui/components/files/docs.mdx.js"]=function(e){function t(t){for(var i,s,r=t[0],o=t[1],c=t[2],m=0,h=[];m<r.length;m++)s=r[m],Object.prototype.hasOwnProperty.call(l,s)&&l[s]&&h.push(l[s][0]),l[s]=0;for(i in o)Object.prototype.hasOwnProperty.call(o,i)&&(e[i]=o[i]);for(d&&d(t);h.length;)h.shift()();return n.push.apply(n,c||[]),a()}function a(){for(var e,t=0;t<n.length;t++){for(var a=n[t],i=!0,r=1;r<a.length;r++){var o=a[r];0!==l[o]&&(i=!1)}i&&(n.splice(t--,1),e=s(s.s=a[0]))}return e}var i={},l={38:0},n=[];function s(t){if(i[t])return i[t].exports;var a=i[t]={i:t,l:!1,exports:{}};return e[t].call(a.exports,a,a.exports,s),a.l=!0,a.exports}s.m=e,s.c=i,s.d=function(e,t,a){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(s.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)s.d(a,i,function(t){return e[t]}.bind(null,i));return a},s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="/assets/scripts/bundle/";var r=this.webpackJsonpSLDS___internal_chunked_docs=this.webpackJsonpSLDS___internal_chunked_docs||[],o=r.push.bind(r);r.push=t,r=r.slice();for(var c=0;c<r.length;c++)t(r[c]);var d=o;return n.push([723,0]),a()}({0:function(e,t){e.exports=React},19:function(e,t){e.exports=ReactDOM},20:function(e,t){e.exports=JSBeautify},723:function(e,t,a){"use strict";a.r(t),a.d(t,"getElement",(function(){return y})),a.d(t,"getContents",(function(){return g}));var i=a(0),l=a.n(i),n=a(4),s=a(2),r=(a(27),a(41),a(14),a(1)),o=a(48),c=l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0})),d=[{id:"attachment-file-no-image",label:"File with no image",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"image",title:"Image Title"}))},{id:"attachment-file-no-title",label:"File with no title",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,noCaption:!0,symbol:"pdf",hasImage:!0}))},{id:"attachment-file-truncate-title",label:"File with truncating title",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{title:"super-super-long-file-name-that-will-truncate.pdf",symbol:"pdf",isCard:!0,hasCrop:!0,hasTitleCard:!0,hasActions:!0}))},{id:"attachment-file-with-actions",label:"File with actions",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasActions:!0,hasImage:!0}))},{id:"attachment-file-with-no-title-actions",label:"File with no title + actions",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,symbol:"pdf",title:"Proposal.pdf",hasActions:!0,iconColor:"white",hasScrim:!0,noCaption:!0,hasImage:!0}))},{id:"attachment-file-external-icon",label:"File with external icon",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",isExternalSource:!0}))},{id:"attachment-file-loading-with-title",label:"File in loading state with title",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,sprite:"utility",symbol:"image",isLoading:!0}))},{id:"attachment-file-loading-no-title",label:"File in loading state without title",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,isLoading:!0,noCaption:!0}))},{id:"multi-attachments",label:"Less than 3 file attachments",element:l.a.createElement("ul",{className:"slds-grid slds-grid_pull-padded"},l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0})),l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf"})))},{id:"multi-attachments-overflow",label:"Greater than 3 file attachments",element:l.a.createElement("ul",{className:"slds-grid slds-grid_pull-padded"},l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0})),l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3  slds-medium-show"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf"})),l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,title:"+22",hasImage:!0,hasOverlay:!0})))},{id:"link-attachment",label:"Link attachment",element:l.a.createElement(o.a,{articleTitle:"Maui By Air The Best Way Around The Island",articleDescription:"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt."})},{id:"crop-4-by-3",label:"Crop 4 x 3",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,has4x3Crop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0}))},{id:"crop-16-by-9",label:"Crop 16 x 9",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,has16x9Crop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0}))},{id:"crop-1-by-1",label:"Crop 1 by 1",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,has1x1Crop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0}))}],m=n.c.code,h=n.c.h2,p=n.c.h3,f=n.c.h4,u=n.c.p,b=n.c.strong,y=function(){return Object(i.createElement)(n.b,{},Object(i.createElement)("div",{className:"doc lead"},"Files are a representation of content uploaded as an attachment."),Object(i.createElement)(s.a,{exampleOnly:!0},Object(r.f)(d,"attachment-file-with-actions")),h({id:"About-Files"},"About Files"),u({},"A figure component is a self-contained unit of content, such as an image with an optional caption. The figure component should NOT be used with icons or logos. A figure can optionally be cropped to a specific ratio such as 16x9, 4x3 and 1x1 with the use of ",m({},".slds-image__crop")," and passing in a ratio class such as ",m({},".slds-image__crop_16-by-9"),"."),p({id:"Accessibility"},"Accessibility"),u({},"Every ",m({},"<img>")," you add to your site needs to have an ",m({},"alt")," attribute. If the image is informational, set the ",m({},"alt")," equal to a descriptive alternative for that image. If the image is decorative or redundant to adjacent text, set ",m({},'alt=""'),", which conveys to assistive technology users that the image isn’t necessary for understanding the page. Avoid using generic strings like ",b({},"photo"),", ",b({},"image"),", or ",b({},"icon")," as alt values, as they don’t communicate valuable content to the user."),h({id:"Base"},"Base"),Object(i.createElement)(s.a,null,Object(r.f)(c)),h({id:"States"},"States"),p({id:"File-with-no-image"},"File with no image"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-no-image")),p({id:"File-with-no-title"},"File with no title"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-no-title")),p({id:"File-with-actions"},"File with actions"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-with-actions")),p({id:"File-with-no-title-+-actions"},"File with no title + actions"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-with-no-title-actions")),p({id:"File-with-external-icon"},"File with external icon"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-external-icon")),p({id:"File-in-loading-state-with-title"},"File in loading state with title"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-loading-with-title")),p({id:"File-in-loading-state-without-title"},"File in loading state without title"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-loading-no-title")),p({id:"3-file-attachments"},"< 3 file attachments"),Object(i.createElement)(s.a,null,Object(r.f)(d,"multi-attachments")),p({id:"3-file-attachments-2"},"> 3 file attachments"),Object(i.createElement)(s.a,null,Object(r.f)(d,"multi-attachments-overflow")),h({id:"Modifiers"},"Modifiers"),p({id:"Ratio"},"Ratio"),f({id:".slds-file__crop_4-by-3"},".slds-file__crop_4-by-3"),Object(i.createElement)(s.a,null,Object(r.f)(d,"crop-4-by-3")),f({id:".slds-file__crop_16-by-9"},".slds-file__crop_16-by-9"),Object(i.createElement)(s.a,null,Object(r.f)(d,"crop-16-by-9")),f({id:".slds-file__crop_1-by-1"},".slds-file__crop_1-by-1"),Object(i.createElement)(s.a,null,Object(r.f)(d,"crop-1-by-1")))},g=function(){return Object(n.a)(y())}}});
+var SLDS="object"==typeof SLDS?SLDS:{};SLDS["__internal/chunked/docs/./ui/components/files/docs.mdx.js"]=function(e){function t(t){for(var i,s,r=t[0],o=t[1],c=t[2],m=0,h=[];m<r.length;m++)s=r[m],Object.prototype.hasOwnProperty.call(l,s)&&l[s]&&h.push(l[s][0]),l[s]=0;for(i in o)Object.prototype.hasOwnProperty.call(o,i)&&(e[i]=o[i]);for(d&&d(t);h.length;)h.shift()();return n.push.apply(n,c||[]),a()}function a(){for(var e,t=0;t<n.length;t++){for(var a=n[t],i=!0,r=1;r<a.length;r++){var o=a[r];0!==l[o]&&(i=!1)}i&&(n.splice(t--,1),e=s(s.s=a[0]))}return e}var i={},l={38:0},n=[];function s(t){if(i[t])return i[t].exports;var a=i[t]={i:t,l:!1,exports:{}};return e[t].call(a.exports,a,a.exports,s),a.l=!0,a.exports}s.m=e,s.c=i,s.d=function(e,t,a){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(s.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)s.d(a,i,function(t){return e[t]}.bind(null,i));return a},s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="/assets/scripts/bundle/";var r=this.webpackJsonpSLDS___internal_chunked_docs=this.webpackJsonpSLDS___internal_chunked_docs||[],o=r.push.bind(r);r.push=t,r=r.slice();for(var c=0;c<r.length;c++)t(r[c]);var d=o;return n.push([724,0]),a()}({0:function(e,t){e.exports=React},20:function(e,t){e.exports=ReactDOM},21:function(e,t){e.exports=JSBeautify},724:function(e,t,a){"use strict";a.r(t),a.d(t,"getElement",(function(){return y})),a.d(t,"getContents",(function(){return g}));var i=a(0),l=a.n(i),n=a(4),s=a(2),r=(a(28),a(42),a(14),a(1)),o=a(49),c=l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0})),d=[{id:"attachment-file-no-image",label:"File with no image",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"image",title:"Image Title"}))},{id:"attachment-file-no-title",label:"File with no title",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,noCaption:!0,symbol:"pdf",hasImage:!0}))},{id:"attachment-file-truncate-title",label:"File with truncating title",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{title:"super-super-long-file-name-that-will-truncate.pdf",symbol:"pdf",isCard:!0,hasCrop:!0,hasTitleCard:!0,hasActions:!0}))},{id:"attachment-file-with-actions",label:"File with actions",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasActions:!0,hasImage:!0}))},{id:"attachment-file-with-no-title-actions",label:"File with no title + actions",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,symbol:"pdf",title:"Proposal.pdf",hasActions:!0,iconColor:"white",hasScrim:!0,noCaption:!0,hasImage:!0}))},{id:"attachment-file-external-icon",label:"File with external icon",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",isExternalSource:!0}))},{id:"attachment-file-loading-with-title",label:"File in loading state with title",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,sprite:"utility",symbol:"image",isLoading:!0}))},{id:"attachment-file-loading-no-title",label:"File in loading state without title",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,isLoading:!0,noCaption:!0}))},{id:"multi-attachments",label:"Less than 3 file attachments",element:l.a.createElement("ul",{className:"slds-grid slds-grid_pull-padded"},l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0})),l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf"})))},{id:"multi-attachments-overflow",label:"Greater than 3 file attachments",element:l.a.createElement("ul",{className:"slds-grid slds-grid_pull-padded"},l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0})),l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3  slds-medium-show"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf"})),l.a.createElement("li",{className:"slds-p-horizontal_xx-small slds-size_1-of-2 slds-medium-size_1-of-3"},l.a.createElement(o.b,{isCard:!0,hasCrop:!0,title:"+22",hasImage:!0,hasOverlay:!0})))},{id:"link-attachment",label:"Link attachment",element:l.a.createElement(o.a,{articleTitle:"Maui By Air The Best Way Around The Island",articleDescription:"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt."})},{id:"crop-4-by-3",label:"Crop 4 x 3",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,has4x3Crop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0}))},{id:"crop-16-by-9",label:"Crop 16 x 9",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,has16x9Crop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0}))},{id:"crop-1-by-1",label:"Crop 1 by 1",element:l.a.createElement("div",{style:{width:"20rem"}},l.a.createElement(o.b,{isCard:!0,has1x1Crop:!0,hasTitleCard:!0,symbol:"pdf",title:"Proposal.pdf",hasImage:!0}))}],m=n.c.code,h=n.c.h2,p=n.c.h3,f=n.c.h4,u=n.c.p,b=n.c.strong,y=function(){return Object(i.createElement)(n.b,{},Object(i.createElement)("div",{className:"doc lead"},"Files are a representation of content uploaded as an attachment."),Object(i.createElement)(s.a,{exampleOnly:!0},Object(r.f)(d,"attachment-file-with-actions")),h({id:"About-Files"},"About Files"),u({},"A figure component is a self-contained unit of content, such as an image with an optional caption. The figure component should NOT be used with icons or logos. A figure can optionally be cropped to a specific ratio such as 16x9, 4x3 and 1x1 with the use of ",m({},".slds-image__crop")," and passing in a ratio class such as ",m({},".slds-image__crop_16-by-9"),"."),p({id:"Accessibility"},"Accessibility"),u({},"Every ",m({},"<img>")," you add to your site needs to have an ",m({},"alt")," attribute. If the image is informational, set the ",m({},"alt")," equal to a descriptive alternative for that image. If the image is decorative or redundant to adjacent text, set ",m({},'alt=""'),", which conveys to assistive technology users that the image isn’t necessary for understanding the page. Avoid using generic strings like ",b({},"photo"),", ",b({},"image"),", or ",b({},"icon")," as alt values, as they don’t communicate valuable content to the user."),h({id:"Base"},"Base"),Object(i.createElement)(s.a,null,Object(r.f)(c)),h({id:"States"},"States"),p({id:"File-with-no-image"},"File with no image"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-no-image")),p({id:"File-with-no-title"},"File with no title"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-no-title")),p({id:"File-with-actions"},"File with actions"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-with-actions")),p({id:"File-with-no-title-+-actions"},"File with no title + actions"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-with-no-title-actions")),p({id:"File-with-external-icon"},"File with external icon"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-external-icon")),p({id:"File-in-loading-state-with-title"},"File in loading state with title"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-loading-with-title")),p({id:"File-in-loading-state-without-title"},"File in loading state without title"),Object(i.createElement)(s.a,null,Object(r.f)(d,"attachment-file-loading-no-title")),p({id:"3-file-attachments"},"< 3 file attachments"),Object(i.createElement)(s.a,null,Object(r.f)(d,"multi-attachments")),p({id:"3-file-attachments-2"},"> 3 file attachments"),Object(i.createElement)(s.a,null,Object(r.f)(d,"multi-attachments-overflow")),h({id:"Modifiers"},"Modifiers"),p({id:"Ratio"},"Ratio"),f({id:".slds-file__crop_4-by-3"},".slds-file__crop_4-by-3"),Object(i.createElement)(s.a,null,Object(r.f)(d,"crop-4-by-3")),f({id:".slds-file__crop_16-by-9"},".slds-file__crop_16-by-9"),Object(i.createElement)(s.a,null,Object(r.f)(d,"crop-16-by-9")),f({id:".slds-file__crop_1-by-1"},".slds-file__crop_1-by-1"),Object(i.createElement)(s.a,null,Object(r.f)(d,"crop-1-by-1")))},g=function(){return Object(n.a)(y())}}});