UNPKG

@salesforce-ux/design-system

Version:
1 lines 9.25 kB
var SLDS=SLDS||{};SLDS["__internal/chunked/showcase/ui/components/cards/base/example.jsx.js"]=function(e){function t(t){for(var l,n,r=t[0],c=t[1],o=t[2],i=0,m=[];i<r.length;i++)n=r[i],d[n]&&m.push(d[n][0]),d[n]=0;for(l in c)Object.prototype.hasOwnProperty.call(c,l)&&(e[l]=c[l]);for(u&&u(t);m.length;)m.shift()();return s.push.apply(s,o||[]),a()}function a(){for(var e,t=0;t<s.length;t++){for(var a=s[t],l=!0,r=1;r<a.length;r++){var c=a[r];0!==d[c]&&(l=!1)}l&&(s.splice(t--,1),e=n(n.s=a[0]))}return e}var l={},d={78:0,7:0,8:0,15:0,16:0,22:0,32:0,38:0,42:0,45:0,54:0,58:0,59:0,63:0,64:0,67:0,71:0,75:0,77:0,80:0,84:0,87:0,88:0,93:0,99:0,100:0,104:0,106:0,114:0,117:0,118:0,122:0,124:0,125:0,126:0,127:0,128:0,129:0,133:0,138:0,144:0,152:0,163:0,167:0,170:0,171:0,178:0,181:0,182:0},s=[];function n(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,n),a.l=!0,a.exports}n.m=e,n.c=l,n.d=function(e,t,a){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:a})},n.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/assets/scripts/bundle/";var r=this.webpackJsonpSLDS___internal_chunked_showcase=this.webpackJsonpSLDS___internal_chunked_showcase||[],c=r.push.bind(r);r.push=t,r=r.slice();for(var o=0;o<r.length;o++)t(r[o]);var u=c;return s.push([146,0]),a()}({0:function(e,t){e.exports=React},146:function(e,t,a){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.examples=t.states=t.WrappedCards=t.NestedCards=t.CardWithTiles=t.CardWithDataTable=void 0;var l=o(a(0)),d=a(145),s=a(11),n=a(22),r=o(n),c=a(13);function o(e){return e&&e.__esModule?e:{default:e}}var u=l.default.createElement("button",{className:"slds-button slds-button_neutral"},"New"),i=l.default.createElement(c.Table,{isFixedLayout:!0,isBordered:!0,hasNoRowHover:!0,hasCellBuffer:!0,type:"advanced"},l.default.createElement(c.THead,null,l.default.createElement(c.THeadTr,null,l.default.createElement(c.ColumnTh,null,l.default.createElement(c.ColumnHeader,{columnName:"Name"})),l.default.createElement(c.ColumnTh,null,l.default.createElement(c.ColumnHeader,{columnName:"Company"})),l.default.createElement(c.ColumnTh,null,l.default.createElement(c.ColumnHeader,{columnName:"Title"})),l.default.createElement(c.ColumnTh,null,l.default.createElement(c.ColumnHeader,{columnName:"Email"})))),l.default.createElement(c.TBody,null,l.default.createElement(c.TBodyTr,null,l.default.createElement(c.RowTh,null,l.default.createElement(c.ReadOnlyCell,{cellLink:"javascript:void(0);",cellText:"Amy Choi"})),l.default.createElement(c.Td,{type:"advanced"},l.default.createElement(c.ReadOnlyCell,{cellText:"Company One"})),l.default.createElement(c.Td,{type:"advanced"},l.default.createElement(c.ReadOnlyCell,{cellText:"Director of Operations"})),l.default.createElement(c.Td,{type:"advanced"},l.default.createElement(c.ReadOnlyCell,{cellText:"adam@company.com"}))))),m=l.default.createElement("ul",{className:"slds-grid slds-wrap slds-grid_pull-padded"},l.default.createElement("li",{className:"slds-p-horizontal_small slds-size_1-of-1 slds-medium-size_1-of-3"},l.default.createElement(d.TileMedia,{actions:!0,className:"slds-card__tile",media:l.default.createElement(s.StandardIcon,{className:"slds-icon_small",symbol:"contact",assistiveText:"Contact"}),title:"Related Record Title 1"})),l.default.createElement("li",{className:"slds-p-horizontal_small slds-size_1-of-1 slds-medium-size_1-of-3"},l.default.createElement(d.TileMedia,{actions:!0,className:"slds-card__tile",media:l.default.createElement(s.StandardIcon,{className:"slds-icon_small",symbol:"contact",assistiveText:"Contact"}),title:"Related Record Title 1"})),l.default.createElement("li",{className:"slds-p-horizontal_small slds-size_1-of-1 slds-medium-size_1-of-3"},l.default.createElement(d.TileMedia,{actions:!0,className:"slds-card__tile",media:l.default.createElement(s.StandardIcon,{className:"slds-icon_small",symbol:"contact",assistiveText:"Contact"}),title:"Related Record Title 1"}))),f=t.CardWithDataTable=function(e){return l.default.createElement(r.default,null,l.default.createElement(n.CardHeader,{title:"Contacts (1)",href:"javascript:void(0);",symbol:"contact",action:u}),l.default.createElement(n.CardBody,null,i),l.default.createElement(n.CardFooter,null,"View All ",l.default.createElement("span",{className:"slds-assistive-text"},"Contacts")))},E=t.CardWithTiles=function(e){return l.default.createElement(r.default,null,l.default.createElement(n.CardHeader,{title:"Contacts (3)",href:"javascript:void(0);",symbol:"contact",action:u}),l.default.createElement(n.CardBody,{hasPadding:!0},m),l.default.createElement(n.CardFooter,null,"View All ",l.default.createElement("span",{className:"slds-assistive-text"},"Contacts")))},h=t.NestedCards=function(e){return l.default.createElement(r.default,null,l.default.createElement(n.CardHeader,{title:"Outer Card Header",href:"javascript:void(0);",symbol:"contact",action:u}),l.default.createElement(n.CardBody,{hasPadding:!0},l.default.createElement(r.default,null,l.default.createElement(n.CardHeader,{title:"Contacts",href:"javascript:void(0);",symbol:"contact",action:u}),l.default.createElement(n.CardBody,{hasPadding:!0},"This is a card inside an `slds-card` to show how styling is removed when cards are nested inside each other."),l.default.createElement(n.CardFooter,null,"View All ",l.default.createElement("span",{className:"slds-assistive-text"},"Contacts"))),l.default.createElement(r.default,null,l.default.createElement(n.CardHeader,{title:"Contacts",href:"javascript:void(0);",symbol:"contact",action:u}),l.default.createElement(n.CardBody,{hasPadding:!0},"This is a card inside an `slds-card` to show how styling is removed when cards are nested inside each other."),l.default.createElement(n.CardFooter,null,"View All ",l.default.createElement("span",{className:"slds-assistive-text"},"Contacts"))),l.default.createElement(r.default,{hasCardBoundary:!0},l.default.createElement(n.CardHeader,{title:"Contacts",href:"javascript:void(0);",symbol:"contact",action:u}),l.default.createElement(n.CardBody,{hasPadding:!0},"This is a card inside an `slds-card` to illustrate how `slds-card_boundary` adds a rounded border when desired."),l.default.createElement(n.CardFooter,null,"View All ",l.default.createElement("span",{className:"slds-assistive-text"},"Contacts"))),l.default.createElement(r.default,{hasCardBoundary:!0},l.default.createElement(n.CardHeader,{title:"Contacts",href:"javascript:void(0);",symbol:"contact",action:u}),l.default.createElement(n.CardBody,{hasPadding:!0},"This is a card inside an `slds-card` to illustrate how `slds-card_boundary` adds a rounded border when desired."),l.default.createElement(n.CardFooter,null,"View All ",l.default.createElement("span",{className:"slds-assistive-text"},"Contacts")))))};t.WrappedCards=function(e){return l.default.createElement("div",{className:"slds-card-wrapper"},l.default.createElement("header",null,l.default.createElement("h2",{className:"slds-text-heading_medium"},"Outer card wrapper header")),l.default.createElement(r.default,null,l.default.createElement(n.CardHeader,{title:"Contacts",href:"javascript:void(0);",symbol:"contact",action:u}),l.default.createElement(n.CardBody,null,"This is a card inside an `slds-card-wrapper` to show how styling is removed when cards are nested inside."),l.default.createElement(n.CardFooter,null,"View All ",l.default.createElement("span",{className:"slds-assistive-text"},"Contacts"))),l.default.createElement(r.default,{hasCardBoundary:!0},l.default.createElement(n.CardHeader,{title:"Contacts",href:"javascript:void(0);",symbol:"contact",action:u}),l.default.createElement(n.CardBody,{hasPadding:!0},"This is a card inside an `slds-card-wrapper` to illustrate how `slds-card_boundary` adds a rounded border when desired."),l.default.createElement(n.CardFooter,null,"View All ",l.default.createElement("span",{className:"slds-assistive-text"},"Contacts"))))};t.default=l.default.createElement(r.default,null,l.default.createElement(n.CardHeader,{title:"Card Header",href:"javascript:void(0);",symbol:"account",action:l.default.createElement("button",{className:"slds-button slds-button_neutral"},"New")}),l.default.createElement(n.CardBody,{hasPadding:!0},"Anything can go into the card body"),l.default.createElement(n.CardFooter,null,"View All ",l.default.createElement("span",{className:"slds-assistive-text"},"Accounts")));t.states=[{id:"empty",label:"Empty",element:l.default.createElement(r.default,null,l.default.createElement(n.CardHeader,{title:"Card Header",href:"javascript:void(0);",symbol:"contact",action:l.default.createElement("button",{className:"slds-button slds-button_neutral"},"New")}),l.default.createElement(n.CardBody,null),l.default.createElement(n.CardFooter,null))}],t.examples=[{id:"related-list-table",label:"With data-table",element:l.default.createElement(f,null)},{id:"related-list-tiles",label:"With tiles",element:l.default.createElement(E,null)},{id:"nested-cards",label:"Nested cards",element:l.default.createElement(h,null)}]}});