@salesforce-ux/design-system/__internal/chunked/docs/ui/components/list-builder/docs.mdx.js

Salesforce Lightning Design System

var SLDS;!function(){"use strict";var e,t,l,a={1594:function(e){e.exports=React},1981:function(e){e.exports=JSBeautify},3804:function(e,t,l){l.r(t),l.d(t,{getContents:function(){return Ee},getElement:function(){return ye}});var a=l(1594),n=l.n(a),s=l(5671),r=l(6547),o=l(806),i=(l(5619),l(7412)),c=l.n(i),d=l(1766),u=l(942),m=l.n(u),b=l(538);function p(e){return p="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},p(e)}function h(e,t){for(var l=0;l<t.length;l++){var a=t[l];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,f(a.key),a)}}function f(e){var t=function(e){if("object"!=p(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var l=t.call(e,"string");if("object"!=p(l))return l;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==p(t)?t:t+""}function y(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(y=function(){return!!e})()}function E(e){return E=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},E(e)}function v(e,t){return v=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},v(e,t)}var x=function(e){var t=e.isFocused,l=e.isDisabled,a=e.isChecked,s=e.tabIndex,r=e.iconAssistiveText,i=e.iconSize,c=e.iconSymbol,d=e.iconCurrentColor,u=e.onChange,p=e.onFocus,h=e.onBlur,f=o.Ay.uniqueId("example-unique-id-"),y={"slds-checkbox-button_is-focused":t,"slds-checkbox-button_is-checked":a,"slds-checkbox-button_is-disabled":l};return n().createElement("label",{className:m()("slds-checkbox-button",y),htmlFor:f},n().createElement("input",{className:"slds-assistive-text",type:"checkbox",id:f,value:f,disabled:l,defaultChecked:a,tabIndex:s,onChange:u,onFocus:p,onBlur:h}),n().createElement(b.eX,{symbol:c,size:i,useCurrentColor:d,assistiveText:r}))};x.defaultProps={iconAssistiveText:"Add product",iconSize:"x-small",iconSymbol:"add",iconCurrentColor:!0},x.propTypes={isDisabled:c().bool,isChecked:c().bool,tabIndex:c().number,iconAssistiveText:c().string,iconSize:c().string,iconSymbol:c().string,iconCurrentColor:c().bool};var g=function(e){function t(e){var l;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),(l=function(e,t,l){return t=E(t),function(e,t){if(t&&("object"==p(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e)}(e,y()?Reflect.construct(t,l||[],E(e).constructor):t.apply(e,l))}(this,t,[e])).state={checked:!!l.props.isChecked,focused:!1},l.handleCheckboxChange=l.handleCheckboxChange.bind(l),l.handleFocus=l.handleFocus.bind(l),l.handleBlur=l.handleBlur.bind(l),l}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&v(e,t)}(t,e),l=t,(a=[{key:"handleCheckboxChange",value:function(){this.setState({checked:!this.state.checked})}},{key:"handleFocus",value:function(){this.state.focused||this.setState({focused:!0})}},{key:"handleBlur",value:function(){this.state.focused&&this.setState({focused:!1})}},{key:"render",value:function(){var e=this.props,t=e.iconChecked,l=e.iconUnchecked,a=e.isDisabled,s=e.tabIndex;return n().createElement(x,{onChange:this.handleCheckboxChange,iconSymbol:this.state.checked?t:l,isChecked:this.state.checked,isDisabled:a,isFocused:this.state.focused,onFocus:this.handleFocus,onBlur:this.handleBlur,tabIndex:s})}}])&&h(l.prototype,a),Object.defineProperty(l,"prototype",{writable:!1}),l;var l,a}(a.Component);g.defaultProps={iconChecked:"check",iconUnchecked:"add"},g.propTypes={iconChecked:c().string,iconUnchecked:c().string};var _=l(5159),N=l(6185),S=l(3964),C=l(6955),w=l(5006),T=l(3589),k=l(885);function A(e){return A="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},A(e)}function I(){return I=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var l=arguments[t];for(var a in l)({}).hasOwnProperty.call(l,a)&&(e[a]=l[a])}return e},I.apply(null,arguments)}function P(e,t,l){return(t=function(e){var t=function(e){if("object"!=A(e)||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var l=t.call(e,"string");if("object"!=A(l))return l;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==A(t)?t:t+""}(t))in e?Object.defineProperty(e,t,{value:l,enumerable:!0,configurable:!0,writable:!0}):e[t]=l,e}var R=n().createContext({isActionableMode:!1});c().string,c().node;var O=function(e){var t=m()("slds-table",{"slds-table_cell-buffer":e.hasCellBuffer,"slds-table_header-hidden":e.hasHiddenHeader,"slds-no-row-hover":e.hasNoRowHover,"slds-no-cell-focus":e.hasNoCellFocus,"slds-table_bordered":e.isBordered,"slds-table_col-bordered":e.isColBordered,"slds-table_edit":e.isEditable,"slds-table_fixed-layout":e.isFixedLayout,"slds-max-medium-table_stacked-horizontal":e.isResponsive,"slds-max-medium-table_stacked":e.isResponsiveStacked,"slds-table_resizable-cols":e.isResizable,"slds-table_striped":e.isStriped,"slds-tree slds-table_tree":"treegrid"===e.type,"slds-table_header-fixed":e.hasFixedHeader});return n().createElement("table",I({"aria-multiselectable":"multiple"===e.selectionType?"true":null,className:t,role:function(){var t=null;switch(e.type){case"advanced":t="grid";break;case"treegrid":t="treegrid"}return t}(),style:e.style},e.ariaLabelledBy&&P({},"aria-labelledby",e.ariaLabelledBy),e.ariaLabel&&P({},"aria-label",e.ariaLabel)),e.children)};O.displayName="Table",O.propTypes={ariaLabel:c().string,ariaLabelledBy:c().string,children:c().node,hasCellBuffer:c().bool,hasHiddenHeader:c().bool,hasNoCellFocus:c().bool,hasNoRowHover:c().bool,isBordered:c().bool,isColBordered:c().bool,isEditable:c().bool,isFixedLayout:c().bool,isResizable:c().bool,isResponsive:c().bool,isResponsiveStacked:c().bool,isStriped:c().bool,selectionType:c().oneOf(["multiple","single"]),style:c().object,type:c().oneOf(["advanced","base","treegrid"]).isRequired,hasFixedHeader:c().bool};var F=function(e){return n().createElement("thead",{className:e.isHidden?"slds-assistive-text":null},e.children)};F.displayName="THead",F.propTypes={children:c().node,isHidden:c().bool};var L=function(e){return n().createElement("tr",{className:"slds-line-height_reset"},e.children)};L.displayName="THeadTr",L.propTypes={children:c().node};var H=function(e){var t,l=(0,a.useContext)(R).isActionableMode,s=m()({"slds-has-button-menu":e.hasMenu,"slds-has-focus":e.hasFocus,"slds-is-resizable":e.isResizable,"slds-text-align_right":e.isRightAligned,"slds-is-sortable":e.isSortable,"slds-is-sorted":"ascending"===e.sortDirection||"descending"===e.sortDirection,"slds-is-sorted_asc":"ascending"===e.sortDirection,"slds-is-sorted_desc":"descending"===e.sortDirection,"slds-cell-wrap":e.hasWrap,"slds-cell_action-mode":l});return n().createElement("th",{"aria-sort":(t=null,e.isSortable&&(t=e.sortDirection||"none"),t),className:s,scope:!e.isDataTable&&"col",role:e.isDataTable&&"cell",style:e.style},e.isDataTable,e.children)};H.displayName="ColumnTh",H.propTypes={"aria-label":c().string,children:c().node,hasFocus:c().bool,hasMenu:c().bool,isResizable:c().bool,isRightAligned:c().bool,isSortable:c().bool,sortDirection:c().oneOf(["ascending","descending","none"]),style:c().object,hasWrap:c().bool,isDataTable:c().bool};var j=function(e){return n().createElement("div",{className:m()("slds-truncate",{"slds-assistive-text":e.isAssistiveText,"slds-cell-fixed":e.isFixedCell}),id:e.id,title:e.columnName},e.columnName)};j.displayName="ColumnHeader",j.propTypes={columnName:c().string.isRequired,id:c().string,isAssistiveText:c().bool,isFixedCell:c().bool},j.defaultProps={columnName:"Column Name",isDataTable:c().bool};var D=function(e){var t=o.Ay.uniqueId("cell-resize-handle-");return n().createElement("div",{className:"slds-resizable"},n().createElement("input",{"aria-label":e.label,className:"slds-resizable__input slds-assistive-text",id:t,max:"1000",min:"20",tabIndex:e.tabIndex,type:"range"}),n().createElement("span",{className:"slds-resizable__handle"},n().createElement("span",{className:"slds-resizable__divider"})))};D.displayName="ResizeControl",D.propTypes={label:c().string.isRequired,tabIndex:c().oneOf(["0","-1"])};var z=function(e){var t=(0,a.useContext)(R).isActionableMode,l=t?"0":"-1",s=function(){return n().createElement("div",{className:"slds-grid slds-grid_vertical-align-center slds-has-flexi-truncate"},e.columnHeaderIcons?function(){var t=e.columnHeaderIcons.filter(function(t){return t.column===e.columnName.toLowerCase()});if(t.length)return t[0].icon}():null,n().createElement("span",{className:"slds-truncate",title:e.columnName},e.columnName),e.isSortable&&n().createElement(b.eX,{assistiveText:!1,className:"slds-icon-text-default slds-is-sortable__icon ",symbol:"arrowdown",title:!1}))};return n().createElement(n().Fragment,null,e.isSortable?n().createElement("a",{className:"slds-th__action slds-text-link_reset",href:"#",role:"button",tabIndex:l,onClick:function(e){return e.preventDefault()}},n().createElement("span",{className:"slds-assistive-text"},"Sort by: "),s()):n().createElement("div",{className:"slds-th__action"},s()),e.sortDirection&&n().createElement("span",{className:"slds-assistive-text","aria-live":"polite","aria-atomic":"true"},"Sorted ",e.sortDirection),e.hasMenu&&n().createElement(C.A,{"aria-haspopup":"true",assistiveText:"Show ".concat(e.columnName," column actions"),className:"slds-th__action-button slds-button_icon-x-small",iconClassName:"slds-button__icon_hint slds-button__icon_small",symbol:"chevrondown",tabIndex:t?"0":"-1",title:"Show ".concat(e.columnName," column actions")}),e.isResizable&&n().createElement(D,{label:e.columnName+" column width"||0,tabIndex:l}))};z.displayName="InteractiveColumnHeader",z.propTypes={columnName:c().string.isRequired,columnHeaderIcons:c().array,hasMenu:c().bool,isResizable:c().bool,isSortable:c().bool,sortDirection:c().oneOf(["ascending","descending"])},z.defaultProps={isResizable:!0,isSortable:!0};var B=function(e){var t=(0,a.useContext)(R).isActionableMode;return n().createElement(n().Fragment,null,n().createElement("div",{className:"slds-th__action slds-th__action_form"},n().createElement(T.Sc,{tabIndex:t?"0":"-1",labelId:"check-select-all-label",label:"Select All",hideLabel:!0,checked:!!e.checked||null,groupId:"column-group-header",isDataTable:!0})))};B.displayName="SelectAllColumnHeader",B.propTypes={checked:c().bool};var q=function(e){var t=e.hasErrorColumn?"2rem":"3.25rem",l=e.mainColumnWidth||null;return n().createElement(F,{isHidden:e.isHidden},n().createElement(L,null,e.hasErrorColumn?n().createElement(H,{style:{width:"3.75rem"}},n().createElement(j,{columnName:"Errors",isAssistiveText:!0})):null,!e.hasNoRowSelection&&n().createElement(H,{isDataTable:!e.hasSingleRowSelect||!e.isHidden,isRightAligned:!e.hasErrorColumn||null,style:{width:t}},e.hasSingleRowSelect||e.isHidden?n().createElement(j,{columnName:"Choose a row to select",id:"column-group-header",isAssistiveText:!0}):n().createElement(B,{checked:e.selectAll})),e.columns.map(function(t,a){return n().createElement(H,{key:a,"aria-label":t,hasFocus:0===a?e.hasFocus:null,hasMenu:e.hasMenus,isResizable:e.isResizable&&!e.isHidden,isSortable:e.isSortable&&!e.isHidden,sortDirection:0===a?e.sortDirection:null,style:{width:0===a&&e.singleColumnWidth?e.singleColumnWidth:l}},n().createElement(z,{columnName:t,columnHeaderIcons:e.columnHeaderIcons,hasMenu:e.hasMenus,isResizable:e.isResizable&&!e.isHidden,isSortable:e.isSortable&&!e.isHidden,sortDirection:0===a?e.sortDirection:null}))}),e.hasRowLevelActions&&n().createElement(H,{style:{width:"3.25rem"}},n().createElement(j,{columnName:"Actions",isAssistiveText:!0}))))};q.displayName="AdvancedDataTableHead",q.propTypes={columnHeaderIcons:c().array,columns:c().array.isRequired,hasErrorColumn:c().bool,hasFocus:c().bool,hasMenus:c().bool,hasNoRowSelection:c().bool,hasRowLevelActions:c().bool,hasSingleRowSelect:c().bool,isHidden:c().bool,isResizable:c().bool,isSortable:c().bool,mainColumnWidth:c().string,selectAll:c().bool,singleColumnWidth:c().string,sortDirection:c().oneOf(["ascending","descending","none"])},q.defaultProps={hasRowLevelActions:!0,isResizable:!0,isSortable:!0};var M=function(e){return n().createElement("tbody",null,e.children)};M.displayName="TBody",M.propTypes={children:c().node};var W=function(e){return n().createElement("tr",{"aria-expanded":e.isExpanded,"aria-level":e.level,"aria-posinset":e.positionWithinLevel,"aria-selected":e.isSelected,"aria-setsize":e.numberOfItemsAtLevel,className:m()("slds-hint-parent",{"slds-align-top":e.isTopAligned,"slds-is-selected":e.isSelected}),tabIndex:e.tabIndex},e.children)};W.displayName="TBodyTr",W.propTypes={children:c().node,isExpanded:c().bool,isSelected:c().bool,isTopAligned:c().bool,level:c().string,positionWithinLevel:c().string,numberOfItemsAtLevel:c().string,tabIndex:c().oneOf(["0","-1"])};var Y=function(e){var t=(0,a.useContext)(R).isActionableMode,l=m()({"slds-has-focus":e.hasFocus,"slds-cell-edit":e.isEditable,"slds-is-edited":e.isEdited,"slds-cell-error":e.isErrorCell,"slds-text-align_right":e.isRightAligned,"slds-cell-shrink":e.isShrunken,"slds-has-error":e.hasError,"slds-cell-wrap":e.hasWrap,"slds-cell_action-mode":t});return n().createElement("td",{"aria-readonly":e.isLocked,"aria-selected":e.isEditing,"aria-describedby":function(){if(e.isEdited)return"unsaved-cell-notification"}()||null,className:l||null,"data-label":e["data-label"],role:function(){var t=null;switch(e.type){case"advanced":case"treegrid":t="gridcell"}return t}(),style:e.style,tabIndex:e.tabIndex},e.children)};Y.displayName="Td",Y.propTypes={children:c().node,"data-label":c().string,hasError:c().bool,hasFocus:c().bool,isEditable:c().bool,isEdited:c().bool,isEditing:c().bool,isErrorCell:c().bool,isLocked:c().bool,isRightAligned:c().bool,isShrunken:c().bool,style:c().object,tabIndex:c().oneOf(["0","-1"]),type:c().oneOf(["advanced","base","treegrid"]).isRequired,hasWrap:c().bool};var $=function(e){var t=(0,a.useContext)(R).isActionableMode,l=m()({"slds-cell-edit":e.isEditable,"slds-has-focus":e.hasFocus,"slds-tree__item":"treegrid"===e.type,"slds-is-hovered":e.isItemHovered,"slds-cell-wrap":e.hasWrap,"slds-cell_action-mode":t});return n().createElement("th",{className:l||null,"data-label":e["data-label"],scope:"row",tabIndex:e.tabIndex},e.children)};$.displayName="RowTh",$.propTypes={children:c().node,"data-label":c().string,hasFocus:c().bool,isEditable:c().bool,tabIndex:c().oneOf(["0","-1"]),type:c().oneOf(["base","advanced","treegrid"]),isItemHovered:c().bool,hasWrap:c().bool};var Q=function(e){return n().createElement(n().Fragment,null,e.hasSingleRowSelect?n().createElement(k.sx,{checked:e.checked,groupId:"column-group-header",hideLabel:!0,id:"radio-0".concat(e.index),label:"Select item ".concat(e.index),labelId:"radio-button-label-0".concat(e.index),tabIndex:e.inputTabIndex,isDataTable:!0}):n().createElement(T.Sc,{checked:e.checked,groupId:"column-group-header",hideLabel:!0,id:"checkbox-0".concat(e.index),label:"Select item ".concat(e.index),labelId:"check-button-label-0".concat(e.index),tabIndex:e.inputTabIndex,isDataTable:!0}))};Q.displayName="SelectRowCell",Q.propTypes={checked:c().bool,hasSingleRowSelect:c().bool,index:c().number.isRequired,inputTabIndex:c().oneOf(["0","-1"])};var X=function(e){var t=e.rowName,l=(0,a.useContext)(R).isActionableMode;return n().createElement(C.A,{assistiveText:"More actions for ".concat(t),"aria-haspopup":"true",className:"slds-button_icon-border-filled slds-button_icon-x-small",iconClassName:"slds-button__icon_hint slds-button__icon_small",symbol:"down",tabIndex:l?"0":"-1",title:"More actions for ".concat(t)})};X.displayName="RowActionsCell",X.propTypes={rowName:c().string.isRequired};var U=function(e){var t=(0,a.useContext)(R).isActionableMode;return n().createElement(n().Fragment,null,n().createElement(C.A,{"aria-hidden":e.hasError?null:"true",assistiveText:"Item ".concat(e.index," has errors"),className:m()("slds-button_icon-error slds-m-horizontal_xxx-small",{"slds-hidden":!e.hasError}),id:"error-0"+e.index,symbol:"error",tabIndex:t?"0":"-1",title:"Item ".concat(e.index," has errors")}),n().createElement("span",{className:"slds-row-number slds-text-body_small slds-text-color_weak"}))};U.displayName="ErrorCell",U.propTypes={hasError:c().bool,index:c().number.isRequired};var J=function(e){var t=e.hasWrap,l=e.cellText,s=e.cellLink,r=(0,a.useContext)(R).isActionableMode;return n().createElement("div",{className:m()(t?"slds-line-clamp":"slds-truncate"),title:l},s?n().createElement("a",{href:"#",tabIndex:r?"0":"-1",onClick:function(e){e.preventDefault()}},l):l)};J.displayName="ReadOnlyCell",J.propTypes={cellLink:c().bool,cellText:c().string.isRequired,hasWrap:c().bool};var V=function(e){var t=(0,a.useContext)(R).isActionableMode;return n().createElement(n().Fragment,null,n().createElement("span",{className:"slds-grid slds-grid_align-spread"},e.cellLink?n().createElement("a",{className:"slds-truncate",href:"#",id:"link-0".concat(e.index),tabIndex:t?"0":"-1",title:e.cellText,onClick:function(e){return e.preventDefault()}},e.cellText):n().createElement("span",{className:"slds-truncate",title:e.cellText},e.cellText),n().createElement(C.A,{assistiveText:e.buttonText,className:"slds-cell-edit__button slds-m-left_x-small",disabled:e.isLocked,iconClassName:m()("slds-button__icon_hint",{"slds-button__icon_edit":!e.isLocked,"slds-button__icon_lock slds-button__icon_small":e.isLocked}),symbol:e.isLocked?"lock":"edit",tabIndex:t?"0":"-1",title:e.buttonText})),e.showEdit&&n().createElement(K,{isRequired:e.isRequired,hasError:e.hasError}),e.isEdited&&n().createElement("span",{id:"unsaved-cell-notification",class:"slds-hide"},"Unsaved"))};V.displayName="EditableCell",V.propTypes={buttonText:c().string.isRequired,cellLink:c().bool,cellText:c().string.isRequired,hasError:(0,o.VY)("showEdit",c().bool),index:c().number,isLocked:c().bool,isRequired:(0,o.VY)("showEdit",c().bool),showEdit:c().bool};var K=function(e){return n().createElement(w.AM,{className:"slds-popover slds-popover_edit",style:{position:"absolute",top:"0",left:"0.0625rem"}},n().createElement("div",{className:m()("slds-form-element slds-grid slds-wrap",{"slds-has-error":e.hasError})},n().createElement("label",{className:"slds-form-element__label slds-form-element__label_edit slds-no-flex",htmlFor:"company-01"},e.isRequired?n().createElement("abbr",{className:"slds-required",title:"required","aria-hidden":"true"},"*"):null,n().createElement("span",{className:"slds-assistive-text"},"Company")),n().createElement("div",{className:"slds-form-element__control slds-grow"},n().createElement("input",{"aria-describedby":e.hasError?"error-message-01":null,className:"slds-input",defaultValue:"Acme Enterprises",id:"company-01",required:e.isRequired,type:"text"})),e.hasError?n().createElement("div",{id:"error-message-01",className:"slds-form-element__help"},"This field is required"):null))};K.displayName="EditPopover",K.propTypes={hasError:c().bool,isRequired:c().bool};var G=l(3106);function Z(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var l=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=l){var a,n,s,r,o=[],i=!0,c=!1;try{if(s=(l=l.call(e)).next,0===t){if(Object(l)!==l)return;i=!1}else for(;!(i=(a=s.call(l)).done)&&(o.push(a.value),o.length!==t);i=!0);}catch(e){c=!0,n=e}finally{try{if(!i&&null!=l.return&&(r=l.return(),Object(r)!==r))return}finally{if(c)throw n}}return o}}(e,t)||function(e,t){if(e){if("string"==typeof e)return ee(e,t);var l={}.toString.call(e).slice(8,-1);return"Object"===l&&e.constructor&&(l=e.constructor.name),"Map"===l||"Set"===l?Array.from(e):"Arguments"===l||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(l)?ee(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function ee(e,t){(null==t||t>e.length)&&(t=e.length);for(var l=0,a=Array(t);l<t;l++)a[l]=e[l];return a}var te=["Name","Product Code","List Price","Product Family"],le=["Product Name"],ae=[{name:"Analytics",productCode:"ANTLY",listPrice:"5000.00",productFamily:"Analytics Product"},{name:"Analytics",productCode:"ANTLY",listPrice:"5000.00",productFamily:"Analytics Product"},{name:"Analytics",productCode:"ANTLY",listPrice:"5000.00",productFamily:"Analytics Product"},{name:"Analytics",productCode:"ANTLY",listPrice:"5000.00",productFamily:"Analytics Product"},{name:"Analytics",productCode:"ANTLY",listPrice:"5000.00",productFamily:"Analytics Product"},{name:"Analytics",productCode:"ANTLY",listPrice:"5000.00",productFamily:"Analytics Product"},{name:"Analytics",productCode:"ANTLY",listPrice:"5000.00",productFamily:"Analytics Product"},{name:"Analytics",productCode:"ANTLY",listPrice:"5000.00",productFamily:"Analytics Product"}],ne=function(e){var t=e.selectedFilters,l=e.itemsSelected,s=Z((0,a.useState)(o.Ay.uniqueId("example-unique-id-")),1)[0],r=Z((0,a.useState)(o.Ay.uniqueId("example-unique-id-")),1)[0];return n().createElement("div",{className:"slds-p-vertical_x-small slds-p-horizontal_large slds-shrink-none slds-theme_shade"},n().createElement(_.Ay,{id:s,"aria-controls":r,autocomplete:!0,label:"Search",hideLabel:!0,placeholder:"Search Salesforce",inputIconPosition:"right",rightInputIcon:n().createElement(b.eX,{symbol:"search",className:"slds-icon slds-icon_x-small slds-icon-text-default",containerClassName:"slds-input__icon slds-input__icon_right",assistiveText:!1,title:!1}),results:n().createElement(N.Ay,{id:r,snapshot:S.u1,type:"plain",count:8,hideIcons:!0}),resultsType:"listbox",hasInteractions:!0}),t||null,n().createElement("div",{className:"slds-text-title slds-m-top_x-small","aria-live":"polite"},l||"0"," Item(s) Selected"))};ne.propTypes={selectedFilters:c().node,itemsSelected:c().string};var se=function(e){return n().createElement("div",{className:"slds-scrollable slds-grow"},n().createElement("div",{className:"slds-scrollable_none"},n().createElement(O,{hasNoRowHover:!0,isBordered:!0,isFixedLayout:!0,isResizable:!0,selectionType:"multiple",type:"advanced",ariaLabel:"Example product list"},n().createElement(F,null,n().createElement(L,null,n().createElement(H,{style:{width:"3.75rem"}}),te.map(function(e,t){return n().createElement(H,{"aria-label":e,isSortable:!0,isResizable:!0,key:t},n().createElement(z,{columnName:e}))}))),n().createElement(M,null,e.children))))},re=function(e){return n().createElement("div",{className:"slds-scrollable slds-grow"},n().createElement("div",{className:"slds-scrollable_none"},n().createElement(O,{hasHiddenHeader:!0,hasNoRowHover:!0,isBordered:!0,selectionType:"multiple",type:"advanced",ariaLabel:"Example single column product list"},n().createElement(F,{isHidden:e.hasHiddenHeader},n().createElement(L,null,n().createElement(H,{style:{width:"3.75rem"}}),e.hasHiddenHeader?n().createElement(H,{"aria-label":le[0]},n().createElement(j,{columnName:le[0]})):n().createElement(H,{"aria-label":le[0]},n().createElement(z,{columnName:le[0]})))),n().createElement(M,null,e.children))))};re.propTypes={hasHiddenHeader:c().bool,children:c().node};var oe=function(e){var t="Select item "+e.index;return n().createElement(W,{isSelected:e.checked},n().createElement(Y,{isRightAligned:!0,tabIndex:1===e.index?"0":null,type:"advanced"},n().createElement(g,{label:t,isChecked:e.checked,isDisabled:e.disabled,tabIndex:-1})),n().createElement($,null,n().createElement(J,{cellText:e.name})),n().createElement(Y,{type:"advanced"},n().createElement(J,{cellText:e.productCode})),n().createElement(Y,{type:"advanced"},n().createElement(J,{cellText:e.listPrice})),n().createElement(Y,{type:"advanced"},n().createElement(J,{cellText:e.productFamily})))},ie=function(e){var t="Select item "+e.index;return n().createElement(W,{isSelected:e.checked},n().createElement(Y,{isRightAligned:!0,tabIndex:1===e.index?"0":"-1",type:"advanced",style:{width:"3.75rem"}},n().createElement(g,{label:t,isChecked:e.checked,isDisabled:e.disabled,tabIndex:-1})),n().createElement(Y,{type:"advanced"},n().createElement(J,{cellText:e.name})))};ie.propTypes={className:c().string,index:c().number,checked:c().bool,disabled:c().bool,name:c().string};var ce=function(e){return n().createElement(G.Bm,{variant:"container-bare"},n().createElement(G.IK,null,n().createElement(G.j9,null,n().createElement(G.$P,{label:"Analytics",tabIndex:"0"}))))},de=function(e){return n().createElement(G.Bm,{variant:"container-bare"},n().createElement(G.IK,null,n().createElement(G.j9,null,n().createElement(G.$P,{label:"Option A",tabIndex:"0"})),n().createElement(G.j9,null,n().createElement(G.$P,{label:"Option B"}))))},ue=[{id:"default",label:"Default",element:n().createElement("div",{className:"demo-only demo-only_viewport",style:{height:"640px"}},n().createElement(d.zs,null,n().createElement(d.aF,{className:"slds-modal_large slds-list-builder","aria-labelledby":"id-of-modalheader-h1"},n().createElement(d.rQ,null,n().createElement("h1",{id:"id-of-modalheader-h1",className:"slds-text-heading_medium"},"Add products"),n().createElement("p",{className:"slds-m-top_x-small"},"Pricebook: Salesforce Products")),n().createElement(d.$m,{className:"slds-grid slds-grow"},n().createElement("div",{className:"slds-grid slds-grid_vertical"},n().createElement(ne,null),n().createElement(se,null,ae.map(function(e,t){return n().createElement(oe,{checked:!1,key:t,index:t+1,name:e.name,productCode:e.productCode,listPrice:e.listPrice,productFamily:e.productFamily})})))),n().createElement(d.jl,null,n().createElement("button",{className:"slds-button slds-button_neutral","aria-label":"Cancel and close"},"Cancel"),n().createElement("button",{className:"slds-button slds-button_brand"},"Next")))))}],me=[{id:"items-selected",label:"Items Selected",element:n().createElement("div",{className:"demo-only demo-only_viewport",style:{height:"640px"}},n().createElement(d.zs,null,n().createElement(d.aF,{className:"slds-modal_large","aria-labelledby":"id-of-modalheader-h1"},n().createElement(d.rQ,null,n().createElement("h1",{id:"id-of-modalheader-h1",className:"slds-text-heading_medium"},"Add products"),n().createElement("p",{className:"slds-m-top_x-small"},"Pricebook: Salesforce Products")),n().createElement(d.$m,{className:"slds-grid slds-nowrap"},n().createElement("div",{className:"slds-col slds-grid slds-grid_vertical slds-nowrap"},n().createElement(ne,{selectedFilters:n().createElement(ce,null),itemsSelected:"1"}),n().createElement(se,null,ae.map(function(e,t){return n().createElement(oe,{key:t,index:t+1,checked:0===t,name:e.name,productCode:e.productCode,listPrice:e.listPrice,productFamily:e.productFamily})})))),n().createElement(d.jl,null,n().createElement("button",{className:"slds-button slds-button_neutral","aria-label":"Cancel and close"},"Cancel"),n().createElement("button",{className:"slds-button slds-button_brand"},"Next")))))},{id:"items-disabled",label:"Items Disabled",element:n().createElement("div",{className:"demo-only demo-only_viewport",style:{height:"640px"}},n().createElement(d.zs,null,n().createElement(d.aF,{className:"slds-modal_large","aria-labelledby":"id-of-modalheader-h1"},n().createElement(d.rQ,null,n().createElement("h1",{id:"id-of-modalheader-h1",className:"slds-text-heading_medium"},"Add products"),n().createElement("p",{className:"slds-m-top_x-small"},"Pricebook: Salesforce Products")),n().createElement(d.$m,{className:"slds-grid slds-nowrap"},n().createElement("div",{className:"slds-col slds-grid slds-grid_vertical slds-nowrap"},n().createElement(ne,{itemsSelected:"0"}),n().createElement(se,null,ae.map(function(e,t){return n().createElement(oe,{checked:!1,key:t,index:t+1,disabled:t%2==0||null,name:e.name,productCode:e.productCode,listPrice:e.listPrice,productFamily:e.productFamily})})))),n().createElement(d.jl,null,n().createElement("button",{className:"slds-button slds-button_neutral","aria-label":"Cancel and close"},"Cancel"),n().createElement("button",{className:"slds-button slds-button_brand"},"Next")))))},{id:"items-default-selected",label:"Items Default Selected",element:n().createElement("div",{className:"demo-only demo-only_viewport",style:{height:"640px"}},n().createElement(d.zs,null,n().createElement(d.aF,{className:"slds-modal_large","aria-labelledby":"id-of-modalheader-h1"},n().createElement(d.rQ,null,n().createElement("h1",{id:"id-of-modalheader-h1",className:"slds-text-heading_medium"},"Add products"),n().createElement("p",{className:"slds-m-top_x-small"},"Pricebook: Salesforce Products")),n().createElement(d.$m,{className:"slds-grid slds-nowrap"},n().createElement("div",{className:"slds-col slds-grid slds-grid_vertical slds-nowrap"},n().createElement(ne,{itemsSelected:"0"}),n().createElement(se,null,ae.map(function(e,t){return n().createElement(oe,{key:t,index:t+1,checked:t%2==1,disabled:t%2==1||null,name:e.name,productCode:e.productCode,listPrice:e.listPrice,productFamily:e.productFamily})})))),n().createElement(d.jl,null,n().createElement("button",{className:"slds-button slds-button_neutral","aria-label":"Cancel and close"},"Cancel"),n().createElement("button",{className:"slds-button slds-button_brand"},"Next")))))}],be=[{id:"two-column-with-hidden-header",label:"Two Column with Hidden Header",element:n().createElement("div",{className:"demo-only demo-only_viewport",style:{height:"640px"}},n().createElement(d.zs,null,n().createElement(d.aF,{className:"slds-modal_large","aria-labelledby":"id-of-modalheader-h1"},n().createElement(d.rQ,null,n().createElement("h1",{id:"id-of-modalheader-h1",className:"slds-text-heading_medium"},"Add products"),n().createElement("p",{className:"slds-m-top_x-small"},"Pricebook: Salesforce Products")),n().createElement(d.$m,{className:"slds-grid slds-nowrap"},n().createElement("div",{className:"slds-col slds-grid slds-grid_vertical slds-nowrap"},n().createElement(ne,{itemsSelected:"0"}),n().createElement(re,{hasHiddenHeader:!0},ae.map(function(e,t){return n().createElement(ie,{checked:!1,key:t,index:t+1,name:e.name})})))),n().createElement(d.jl,null,n().createElement("button",{className:"slds-button slds-button_neutral","aria-label":"Cancel and close"},"Cancel"),n().createElement("button",{className:"slds-button slds-button_brand"},"Next")))))},{id:"filtered",label:"Filtered Results",element:n().createElement("div",{className:"demo-only demo-only_viewport",style:{height:"640px"}},n().createElement(d.zs,null,n().createElement(d.aF,{className:"slds-modal_large","aria-labelledby":"id-of-modalheader-h1"},n().createElement(d.rQ,null,n().createElement("h1",{id:"id-of-modalheader-h1",className:"slds-text-heading_medium"},"Add products"),n().createElement("p",{className:"slds-m-top_x-small"},"Pricebook: Salesforce Products")),n().createElement(d.$m,{className:"slds-grid slds-grow"},n().createElement("div",{className:"slds-grid slds-grid_vertical"},n().createElement(ne,{selectedFilters:n().createElement(de,null),itemsSelected:"2"}),n().createElement(se,null,n().createElement(oe,{checked:!1,index:1,name:ae[0].name,productCode:ae[0].productCode,listPrice:ae[0].listPrice,productFamily:ae[0].productFamily})))),n().createElement(d.jl,null,n().createElement("button",{className:"slds-button slds-button_neutral","aria-label":"Cancel and close"},"Cancel"),n().createElement("button",{className:"slds-button slds-button_brand"},"Next")))))}],pe=s.XB.h2,he=s.XB.h3,fe=s.XB.p,ye=function(){return(0,a.createElement)(s.Ay,{},(0,a.createElement)("div",{className:"doc lead"},"The List Builder is a quick, visual and efficient ‘shopping cart’ approach to adding multiple items to a parent object."),(0,a.createElement)(r.A,{exampleOnly:!0},(0,o.NO)(ue)),pe({id:"About-List-Builder"},"About List Builder"),fe({},"The List builder relies heavily on utility classes to piece together the layout so please pay close attention to the markup and classes."),pe({id:"Base"},"Base"),(0,a.createElement)(r.A,null,(0,o.NO)(ue)),pe({id:"States"},"States"),he({id:"Items-Selected"},"Items Selected"),(0,a.createElement)(r.A,null,(0,o.NO)(me,"items-selected")),he({id:"Items-Disabled"},"Items Disabled"),(0,a.createElement)(r.A,null,(0,o.NO)(me,"items-disabled")),he({id:"Items-Default-Selected"},"Items Default Selected"),(0,a.createElement)(r.A,null,(0,o.NO)(me,"items-default-selected")),pe({id:"Examples"},"Examples"),he({id:"Two-Column-with-Hidden-Header"},"Two Column with Hidden Header"),(0,a.createElement)(r.A,null,(0,o.NO)(be,"filtered")),he({id:"Filtered-Results"},"Filtered Results"),(0,a.createElement)(r.A,null,(0,o.NO)(be,"two-column-with-hidden-header")))},Ee=function(){return(0,s.Qr)(ye())}},5206:function(e){e.exports=ReactDOM}},n={};function s(e){var t=n[e];if(void 0!==t)return t.exports;var l=n[e]={id:e,exports:{}};return a[e](l,l.exports,s),l.exports}s.m=a,s.amdO={},e=[],s.O=function(t,l,a,n){if(!l){var r=1/0;for(d=0;d<e.length;d++){l=e[d][0],a=e[d][1],n=e[d][2];for(var o=!0,i=0;i<l.length;i++)(!1&n||r>=n)&&Object.keys(s.O).every(function(e){return s.O[e](l[i])})?l.splice(i--,1):(o=!1,n<r&&(r=n));if(o){e.splice(d--,1);var c=a();void 0!==c&&(t=c)}}return t}n=n||0;for(var d=e.length;d>0&&e[d-1][2]>n;d--)e[d]=e[d-1];e[d]=[l,a,n]},s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,{a:t}),t},l=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},s.t=function(e,a){if(1&a&&(e=this(e)),8&a)return e;if("object"==typeof e&&e){if(4&a&&e.__esModule)return e;if(16&a&&"function"==typeof e.then)return e}var n=Object.create(null);s.r(n);var r={};t=t||[null,l({}),l([]),l(l)];for(var o=2&a&&e;("object"==typeof o||"function"==typeof o)&&!~t.indexOf(o);o=l(o))Object.getOwnPropertyNames(o).forEach(function(t){r[t]=function(){return e[t]}});return r.default=function(){return e},s.d(n,r),n},s.d=function(e,t){for(var l in t)s.o(t,l)&&!s.o(e,l)&&Object.defineProperty(e,l,{enumerable:!0,get:t[l]})},s.e=function(){return Promise.resolve()},s.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.j=7077,function(){var e={7077:0};s.O.j=function(t){return 0===e[t]};var t=function(t,l){var a,n,r=l[0],o=l[1],i=l[2],c=0;if(r.some(function(t){return 0!==e[t]})){for(a in o)s.o(o,a)&&(s.m[a]=o[a]);if(i)var d=i(s)}for(t&&t(l);c<r.length;c++)n=r[c],s.o(e,n)&&e[n]&&e[n][0](),e[n]=0;return s.O(d)},l=self.webpackJsonpSLDS___internal_chunked_docs=self.webpackJsonpSLDS___internal_chunked_docs||[];l.forEach(t.bind(null,0)),l.push=t.bind(null,l.push.bind(l))}(),s.nc=void 0;var r=s.O(void 0,[3540],function(){return s(3804)});r=s.O(r),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/docs/./ui/components/list-builder/docs.mdx.js"]=r}();