UNPKG

@salesforce-ux/design-system

Version:
1 lines 16.6 kB
var SLDS=SLDS||{};SLDS["__internal/chunked/showcase/ui/components/data-tables/inline-edit/example.jsx.js"]=function(e){function t(t){for(var a,o,i=t[0],r=t[1],c=t[2],s=0,m=[];s<i.length;s++)o=i[s],n[o]&&m.push(n[o][0]),n[o]=0;for(a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a]);for(u&&u(t);m.length;)m.shift()();return d.push.apply(d,c||[]),l()}function l(){for(var e,t=0;t<d.length;t++){for(var l=d[t],a=!0,i=1;i<l.length;i++){var r=l[i];0!==n[r]&&(a=!1)}a&&(d.splice(t--,1),e=o(o.s=l[0]))}return e}var a={},n={97: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},d=[];function o(t){if(a[t])return a[t].exports;var l=a[t]={i:t,l:!1,exports:{}};return e[t].call(l.exports,l,l.exports,o),l.l=!0,l.exports}o.m=e,o.c=a,o.d=function(e,t,l){o.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:l})},o.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},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 i=this.webpackJsonpSLDS___internal_chunked_showcase=this.webpackJsonpSLDS___internal_chunked_showcase||[],r=i.push.bind(i);i.push=t,i=i.slice();for(var c=0;c<i.length;c++)t(i[c]);var u=r;return d.push([165,0]),l()}({0:function(e,t){e.exports=React},164:function(e,t,l){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.InlineEditTr=t.Demo=void 0;var a=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var l=arguments[t];for(var a in l)Object.prototype.hasOwnProperty.call(l,a)&&(e[a]=l[a])}return e},n=r(l(0)),d=r(l(3)),o=l(13),i=l(5);function r(e){return e&&e.__esModule?e:{default:e}}(t.Demo=function(e){return n.default.createElement("div",a({className:"demo-only"},e),e.children)}).propTypes={children:d.default.node};var c=t.InlineEditTr=function(e){return n.default.createElement(o.TBodyTr,{isSelected:e.isSelected},n.default.createElement(o.Td,{hasFocus:"error"===e.focusedCell,isEditable:!0,isErrorCell:!0,type:"advanced"},n.default.createElement(o.ErrorCell,{actionableMode:e.actionableMode,hasError:e.showRowError,index:e.index})),n.default.createElement(o.Td,{hasFocus:"selectRow"===e.focusedCell,isEditable:!0,tabIndex:e.actionableMode||"selectRow"!==e.focusableCell?null:"0",type:"advanced"},n.default.createElement(o.SelectRowCell,{checked:e.isSelected,index:e.index,inputTabIndex:e.actionableMode?"0":"-1"})),n.default.createElement(o.RowTh,{hasFocus:"recordName"===e.focusedCell,isEditable:!0,tabIndex:e.actionableMode||"recordName"!==e.focusableCell?null:"0"},n.default.createElement(o.EditableCell,{actionableMode:e.actionableMode,buttonText:"Edit Name of "+e.recordName,cellLink:"javascript:void(0);",cellText:e.recordName,index:e.index})),n.default.createElement(o.Td,{hasError:e.showCellError,hasFocus:"accountName"===e.focusedCell,isEditable:!0,isEdited:e.showEditedCell,isEditing:e.showEdit,isLocked:e.isLocked,tabIndex:e.actionableMode||"accountName"!==e.focusableCell?null:"0",type:"advanced"},n.default.createElement(o.EditableCell,{actionableMode:e.actionableMode,buttonText:"Edit Account Name of "+e.recordName,cellText:e.accountName,hasError:e.showEditError,index:e.index,isLocked:e.isLocked,isRequired:e.showEditRequired,showEdit:e.showEdit})),n.default.createElement(o.Td,{isEditable:!0,type:"advanced"},n.default.createElement(o.EditableCell,{actionableMode:e.actionableMode,buttonText:"Edit Close Date of "+e.recordName,cellText:e.closeDate,index:e.index})),n.default.createElement(o.Td,{isEditable:!0,type:"advanced"},n.default.createElement(o.EditableCell,{actionableMode:e.actionableMode,buttonText:"Edit Stage of "+e.recordName,cellText:e.stage,index:e.index})),n.default.createElement(o.Td,{isEditable:!0,isLocked:!0,type:"advanced"},n.default.createElement(o.EditableCell,{actionableMode:e.actionableMode,buttonText:"Edit Confidence of "+e.recordName,cellText:e.confidence,index:e.index,isLocked:!0})),n.default.createElement(o.Td,{isEditable:!0,type:"advanced"},n.default.createElement(o.EditableCell,{actionableMode:e.actionableMode,buttonText:"Edit Amount of "+e.recordName,cellText:e.amount,index:e.index})),n.default.createElement(o.Td,{isEditable:!0,type:"advanced"},n.default.createElement(o.EditableCell,{actionableMode:e.actionableMode,buttonText:"Edit Contact of "+e.recordName,cellText:e.contact,index:e.index})),n.default.createElement(o.Td,{isEditable:!0,type:"advanced"},n.default.createElement(o.RowActionsCell,{actionableMode:e.actionableMode,isEditable:!0,rowName:e.recordName})))};c.displayName="InlineEditTr",c.propTypes={accountName:d.default.string.isRequired,actionableMode:d.default.bool,amount:d.default.string.isRequired,closeDate:d.default.string.isRequired,confidence:d.default.string.isRequired,contact:d.default.string.isRequired,focusableCell:(0,i.CannotBeSetWith)("actionableMode",d.default.string),focusedCell:d.default.string,index:d.default.number.isRequired,isLocked:d.default.bool,recordName:d.default.string.isRequired,isSelected:d.default.bool,showCellError:(0,i.IsDependentOn)("showRowError",d.default.bool),showEdit:d.default.bool,showEditError:d.default.bool,showEditRequired:d.default.bool,showEditedCell:d.default.bool,showRowError:d.default.bool,stage:d.default.string.isRequired}},165:function(e,t,l){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.states=t.InlineEditTableFocusedCell=void 0;var a=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var l=arguments[t];for(var a in l)Object.prototype.hasOwnProperty.call(l,a)&&(e[a]=l[a])}return e},n=u(l(0)),d=u(l(5)),o=l(13),i=l(164),r=l(12),c=l(43);function u(e){return e&&e.__esModule?e:{default:e}}var s=d.default.uniqueId("dialog-heading-id-"),m=["Name","Account Name","Close Date","Stage","Confidence","Amount","Contact"],E=[{recordName:"Acme - 1,200 Widgets",accountName:"Acme",closeDate:"4/10/15",stage:"Value Proposition",confidence:"30%",amount:"$25,000,000",contact:"jrogers@acme.com"},{recordName:"Acme - 200 Widgets",accountName:"Acme",closeDate:"1/31/15",stage:"Prospecting",confidence:"60%",amount:"$5,000,000",contact:"bob@acme.com"},{recordName:"salesforce.com - 1,000 Widgets",accountName:"salesforce.com",closeDate:"1/31/15 3:45PM",stage:"Id. Decision Makers",confidence:"70%",amount:"$25,000",contact:"nathan@salesforce.com"}],f=t.InlineEditTableFocusedCell=function(){return n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,focusedCell:0===t?"recordName":null,index:t+1,isSelected:!1,key:t},e))}))))};t.default=n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{hasNoCellFocus:!0,isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({focusableCell:"recordName",index:t+1,isSelected:!1,key:t},e))}))));t.states=[{id:"with-link",label:"Cell focused - Link (Actionable mode)",element:n.default.createElement(f,null),script:"\n document.getElementById('link-01').focus()\n "},{id:"checkbox",label:"Cell focused - Checkbox (Actionable mode)",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,focusedCell:0===t?"selectRow":null,index:t+1,isSelected:!1,key:t},e))})))),script:"\n document.getElementById('checkbox-01').focus()\n "},{id:"focused",label:"Cell focused (Navigation mode)",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({focusableCell:0===t?"accountName":null,focusedCell:0===t?"accountName":null,index:t+1,isSelected:!1,key:t},e))}))))},{id:"edit",label:"Cell edit (Actionable mode)",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,index:t+1,isSelected:!1,key:t,showEdit:0===t},e))})))),script:"\n document.getElementById('company-01').focus()\n document.getElementById('company-01').select()\n "},{id:"required",label:"Cell edit — Required (Actionable mode)",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,index:t+1,isSelected:!1,key:t,showEdit:0===t,showEditRequired:!0},e))})))),script:"\n document.getElementById('company-01').focus()\n document.getElementById('company-01').select()\n "},{id:"error",label:"Cell edit — Error (Actionable mode)",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,index:t+1,isSelected:!1,key:t,showEdit:0===t,showEditError:!0,showEditRequired:!0},e))})))),script:"\n document.getElementById('company-01').focus()\n document.getElementById('company-01').select()\n "},{id:"edited",label:"Cell edited (Actionable mode)",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,index:t+1,isSelected:!1,key:t,showEditedCell:0===t},e))}))))},{id:"row-selected-with-edited-cell",label:"Row Selected with an Edited Cell",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,className:0===t?"slds-is-selected":null,index:t+1,isSelected:0===t,key:t,showEditedCell:0===t},e))}))))},{id:"row-error",label:"Error - Row level on save (Actionable mode)",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,focusedCell:0===t?"accountName":null,index:t+1,isSelected:!1,key:t,showCellError:0===t,showRowError:0===t},e))})))),script:"\n document.getElementById('button-01').focus()\n "},{id:"row-error-and-selected",label:"Error - Row level on save (Actionable mode) with entire row selected",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,className:0===t?"slds-is-selected":null,index:t+1,isSelected:0===t,key:t,showCellError:0===t,showRowError:0===t},e))}))))},{id:"row-error-focused",label:"Error indicator - Focused (Actionable mode)",element:n.default.createElement(i.Demo,{style:{marginTop:"100px",marginLeft:"10px"}},n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{actionableMode:!0,columns:m,hasErrorColumn:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,a({actionableMode:!0,focusedCell:0===t?"error":null,index:t+1,isSelected:!1,key:t,showCellError:0===t,showRowError:0===t},e))}))),n.default.createElement(r.Popover,{className:"slds-popover_error slds-nubbin_bottom-left",closeButton:!0,header:n.default.createElement(c.FeedbackHeader,{headingId:s,symbol:"error",title:"Resolve error"}),headingId:s,inverse:!0,style:{position:"absolute",top:"-56px"}},n.default.createElement("p",null,"Company encountered an error")))),script:"\n document.getElementById('error-01').focus()\n "},{id:"header-cell-focused",label:"Header cell focused (Navigation mode)",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{columns:m,hasErrorColumn:!0,hasFocus:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,{accountName:E[t].accountName,amount:E[t].amount,closeDate:E[t].closeDate,confidence:E[t].confidence,contact:E[t].contact,index:t+1,isSelected:!1,key:t,recordName:E[t].recordName,stage:E[t].stage})}))))},{id:"header-cell-marked",label:"Header cell marked (Navigation mode)",element:n.default.createElement(o.InlineEditTableContainer,null,n.default.createElement(o.Table,{hasNoCellFocus:!0,isBordered:!0,isEditable:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",style:{width:"66.75rem"},type:"advanced"},n.default.createElement(o.AdvancedDataTableHead,{columns:m,hasErrorColumn:!0,hasFocus:!0,mainColumnWidth:"8.75rem"}),n.default.createElement(o.TBody,null,E.map(function(e,t){return n.default.createElement(i.InlineEditTr,{accountName:E[t].accountName,amount:E[t].amount,closeDate:E[t].closeDate,confidence:E[t].confidence,contact:E[t].contact,index:t+1,isSelected:!1,key:t,recordName:E[t].recordName,stage:E[t].stage})}))))}]}});