npm - @salesforce-ux/design-system - Versions diffs - 2.29.0 → 2.29.1 - Mend

@salesforce-ux/design-system 2.29.0 → 2.29.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (754) hide show

package/__internal/chunked/docs/ui/components/global-navigation/docs.mdx.js CHANGED Viewed

	@@ -1 +1 @@
1	- var SLDS;!function(){"use strict";var e,t,a,n={1594:function(e){e.exports=React},1981:function(e){e.exports=JSBeautify},5206:function(e){e.exports=ReactDOM},5629:function(e,t,a){a.r(t),a.d(t,{getContents:function(){return be},getElement:function(){return me}});var n=a(1594),l=a.n(n),i=a(5671),s=a(6547),r=a(3212),o=(a(5619),a(7412)),d=a.n(o),c=a(942),m=a.n(c),b=a(8347),u=a(4760),v=a(6955),E=a(5898),h=a(806);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 I(e,t){for(var a=0;a<t.length;a++){var n=t[a];n.enumerable=n.enumerable\|\|!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,g(n.key),n)}}function g(e){var t=function(e){if("object"!=p(e)\|\|!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var a=t.call(e,"string");if("object"!=p(a))return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==p(t)?t:t+""}function C(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(C=function(){return!!e})()}function T(e){return T=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},T(e)}function w(e,t){return w=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},w(e,t)}function f(){return f=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)({}).hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},f.apply(null,arguments)}var y=function(){var e=h.Ay.uniqueId("menu-group-id-");return l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,{title:"Main action"},l().createElement(b.A,{className:"slds-icon slds-icon_x-small slds-icon-text-default slds-m-right_x-small",sprite:"utility",symbol:"add"}),"Main action"),l().createElement("li",{role:"presentation"},l().createElement("ul",{role:"group","aria-labelledby":e},l().createElement("li",{className:"slds-dropdown__header slds-has-divider_top-space",role:"presentation",id:e},l().createElement("span",null,"Menu header")),l().createElement(u.Dr,null,"Menu Item One"),l().createElement(u.Dr,null,"Menu Item Two"),l().createElement(u.Dr,null,"Menu Item Three")))))},N=function(e){var t=e.label,a=e.isActive,n=e.hasNavMenu,i=e.hasNavMenuOpen,s=e.hasMenuDropdown,r=m()("slds-context-bar__item",{"slds-is-active":a,"slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click":n,"slds-is-open":i});return l().createElement("li",{className:r},l().createElement("a",{href:"#",className:"slds-context-bar__label-action",title:t,onClick:function(e){return e.preventDefault()}},a&&l().createElement("span",{className:"slds-assistive-text"},"Current Page:"),l().createElement("span",{className:"slds-truncate",title:t},t)),n&&l().createElement(l().Fragment,null,l().createElement(_,{onClick:e.onClick}),s&&l().createElement(y,null)))};N.defaultProps={label:"Menu Item",hasMenuDropdown:!0},N.propTypes={label:d().string.isRequired,isActive:d().bool,hasNavMenu:d().bool,hasNavMenuOpen:d().bool,hasMenuDropdown:d().bool};var _=function(e){return l().createElement("div",{className:"slds-context-bar__icon-action slds-p-left_none"},l().createElement(v.A,f({className:"slds-button_icon slds-context-bar__button",symbol:"chevrondown","aria-haspopup":"true",assistiveText:"Open menu item submenu",title:"Open menu item submenu"},e)))},A=function(e){var t=e.appName,a=e.homeItemIsActive,n=e.hasNavMenuOpen,i=e.children;return l().createElement("div",{className:"slds-context-bar"},l().createElement("div",{className:"slds-context-bar__primary"},l().createElement("div",{className:"slds-context-bar__item slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click slds-no-hover"},l().createElement("div",{className:"slds-context-bar__icon-action"},l().createElement(E.A,{className:"slds-context-bar__button"})),l().createElement("span",{className:"slds-context-bar__label-action slds-context-bar__app-name"},l().createElement("span",{className:"slds-truncate",title:t\|\|"App Name"},t\|\|"App Name")))),l().createElement("nav",{className:"slds-context-bar__secondary",role:"navigation"},l().createElement("ul",{className:"slds-grid"},l().createElement(N,{label:"Home",isActive:a}),i\|\|l().createElement(l().Fragment,null,l().createElement(N,{label:"Menu Item",hasNavMenu:!0,hasNavMenuOpen:n,onClick:function(){return e.toggleNavMenu()}}),l().createElement(N,{label:"Menu Item"}),l().createElement(N,{label:"Menu Item"}),l().createElement(N,{label:"Menu Item"})))))};A.propTypes={appName:d().string,homeItemIsActive:d().bool,hasNavMenuOpen:d().bool,children:d().node};var P=function(e){function t(){var e;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),(e=function(e,t,a){return t=T(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,C()?Reflect.construct(t,a\|\|[],T(e).constructor):t.apply(e,a))}(this,t)).toggleNavMenu=e.toggleNavMenu.bind(e),e.state={hasNavMenuOpen:!1},e}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&&w(e,t)}(t,e),a=t,(n=[{key:"toggleNavMenu",value:function(){this.setState({hasNavMenuOpen:!this.state.hasNavMenuOpen})}},{key:"render",value:function(){return l().createElement(A,{homeItemIsActive:!0,toggleNavMenu:this.toggleNavMenu,hasNavMenuOpen:this.props.hasNavMenuOpen\|\|this.state.hasNavMenuOpen})}}])&&I(a.prototype,n),Object.defineProperty(a,"prototype",{writable:!1}),a;var a,n}(n.Component),O=P,x="Navigation Bar - ",U=[{id:"default",label:x+"Default",demoStyles:"height: 16rem;",storybookStyles:!1,element:l().createElement(O,null)}],S=[{id:"item-active",label:x+"Item Active",element:l().createElement(A,null,l().createElement(N,{label:"Menu Item",hasNavMenu:!0}),l().createElement(N,{label:"Menu Item"}),l().createElement(N,{label:"Menu Item",isActive:!0}),l().createElement(N,{label:"Menu Item"}))},{id:"item-menu-open",label:x+"Item Menu Open",demoStyles:"height: 16rem;",storybookStyles:!0,element:l().createElement(O,{hasNavMenuOpen:!0})}],L=a(9825),H=a(5794),F=function(e){return l().createElement("li",{className:m()("slds-tabs_default__item slds-sub-tabs__item slds-grid slds-grid_vertical-align-center",{"slds-active":e.active,"slds-has-error":"error"===e.statusLevel,"slds-has-focus":e.hasFocus,"slds-has-notification":e.hasNotification,"slds-has-success":"success"===e.statusLevel,"slds-has-warning":"warning"===e.statusLevel,"slds-is-unsaved":e.itemUnsaved},e.className),role:"presentation"},l().createElement("a",{"aria-controls":e.tabPanelId,"aria-selected":e.active?"true":"false",className:"slds-tabs_default__link slds-p-horizontal_xx-small",href:"#",id:e.tabItemId,role:"tab",tabIndex:e.active?"0":"-1",title:e.title,onClick:function(e){return e.preventDefault()}},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,null),e.hasNotification&&l().createElement(H.VK,null)),e.hasIcon&&l().createElement(H.Px,{statusLevel:e.statusLevel,symbol:e.symbol}),l().createElement("span",{className:m()("slds-truncate",e.pinned?"slds-assistive-text":null),title:e.title},e.title)),e.menuIcon?l().createElement("div",{className:m()("slds-dropdown-trigger slds-dropdown-trigger_click slds-p-left_none slds-p-right_none","true"===e.actionOverflow?"slds-is-open":null)},l().createElement(v.A,{"aria-haspopup":"true",assistiveText:"Actions for "+e.title,className:"slds-button_icon-container slds-button_icon-x-small",symbol:"chevrondown",tabIndex:e.active?"0":"-1",theme:"error"===e.statusLevel\|\|"success"===e.statusLevel?"inverse":null,title:"Actions for "+e.title})):null,l().createElement("div",{className:m()("slds-col_bump-left slds-p-left_none slds-p-right_none",e.pinned?"slds-assistive-text":null)},l().createElement(v.A,{assistiveText:"Close "+e.title,className:"slds-button_icon-container slds-button_icon-x-small",symbol:"close",tabIndex:e.active?"0":"-1",theme:"error"===e.statusLevel\|\|"success"===e.statusLevel?"inverse":null,title:"Close "+e.title})))};F.displayName="Subtab",F.propTypes={actionOverflow:d().string,active:d().bool,statusLevel:d().oneOf(["error","success","warning"]),className:d().string,hasFocus:d().bool,hasIcon:d().bool,hasNotification:d().bool,itemUnsaved:d().bool,menuIcon:d().bool,pinned:d().bool,symbol:d().string,tabItemId:d().string.isRequired,tabPanelId:d().string.isRequired,title:d().string},F.defaultProps={hasIcon:!0,title:"Subtab Name"};var k=function(e){return l().createElement("div",{className:"slds-tabs_default slds-sub-tabs"},e.children)};k.displayName="Subtabs",k.propTypes={children:d().node};var M=function(e){return l().createElement("ul",{className:"slds-tabs_default__nav",role:"tablist"},e.children)};M.displayName="SubtabList",M.propTypes={children:d().node};var j=function(e){return l().createElement("div",{"aria-labelledby":e.tabId,className:m()("slds-tabs_default__content",{"slds-show":e.isVisible,"slds-hide":!e.isVisible}),id:e.id,role:"tabpanel"},e.children)};j.displayName="SubtabPanel",j.propTypes={children:d().node,isVisible:d().bool,id:d().string,tabId:d().string};var W=function(e){return l().createElement("li",{className:m()("slds-tabs_default__item","slds-sub-tabs__item","slds-tabs_default__overflow-button",{"slds-has-error":"error"===e.statusLevel,"slds-has-notification":e.itemUnread,"slds-has-success":"success"===e.statusLevel,"slds-has-warning":"warning"===e.statusLevel,"slds-is-unsaved":e.itemUnsaved}),role:"presentation"},l().createElement("div",{className:m()("slds-dropdown-trigger slds-dropdown-trigger_click",e.isOpen&&"slds-is-open")},l().createElement(L.$n,{"aria-haspopup":"true",title:"More Tab Items",role:"tab"},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,{title:"Tab(s) within menu not saved"}),e.itemUnread&&l().createElement(H.VK,null)),l().createElement("span",{className:"slds-truncate",title:"More Tabs"},"More ",l().createElement("span",{className:"slds-assistive-text"},"Tabs")),l().createElement(b.A,{className:"slds-button__icon slds-button__icon_small slds-button__icon_right",sprite:"utility",symbol:"chevrondown"})),l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,{className:"slds-has-notification",statusLevel:e.statusLevel,title:"Chat - Customer"},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,null),e.itemUnread&&l().createElement(H.VK,null)),e.itemHasIcon&&l().createElement(H.Px,{statusLevel:e.statusLevel,symbol:"live_chat"}),l().createElement("span",null,"error"===e.statusLevel?"SLA Violation":"warning"===e.statusLevel?"SLA 0.30":"Chat - Customer")),l().createElement(u.Dr,{title:"Overflow Tab Item"},l().createElement(H.$7,null),l().createElement(H.Px,null),l().createElement("span",null,"Overflow Tab Item"))))))};W.displayName="SubtabOverflow",W.propTypes={statusLevel:d().oneOf(["error","success","warning"]),isOpen:d().bool,itemHasIcon:d().bool,itemUnread:d().bool,itemUnsaved:d().bool},W.defaultProps={itemHasIcon:!0};var D="context-tab-panel-1",V="context-tab-panel-2",B="context-tab-panel-3",R="context-tab-id-1",q="context-tab-id-2",X="context-tab-id-3",$="Navigation Tab Bar - ",G=function(e){return l().createElement("span",{className:"slds-text-body_small slds-text-color_weak slds-p-left_large"},l().createElement("span",{className:"slds-assistive-text"},":"),e.children)},K=function(e){return l().createElement("li",{className:m()("slds-context-bar__item slds-context-bar__item_tab",e.className,{"slds-is-active":e.itemActive,"slds-is-unsaved":e.itemUnsaved,"slds-is-pinned":e.pinned,"slds-has-focus":e.hasFocus,"slds-has-notification":e.itemUnread,"slds-has-sub-tabs":e.hasSubtabs,"slds-has-success":"success"===e.statusLevel,"slds-has-warning":"warning"===e.statusLevel,"slds-has-error":"error"===e.statusLevel}),role:"presentation"},l().createElement("a",{href:"#",className:"slds-context-bar__label-action",role:"tab",title:e.title,"aria-selected":e.itemActive?"true":"false",tabIndex:e.itemActive?"0":"-1","aria-controls":e.tabPanelId,id:e.id,onClick:function(e){return e.preventDefault()}},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,{title:"Tab Not Saved"}),e.itemUnread&&l().createElement(H.VK,null)),e.hasIcon&&l().createElement(H.Px,{statusLevel:e.statusLevel,symbol:e.symbol}),l().createElement("span",{className:m()("slds-truncate",e.pinned?"slds-assistive-text":null),title:e.title},e.title)),l().createElement("div",{className:m()("slds-context-bar__icon-action slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click slds-p-left_none slds-p-right_none","true"===e.actionOverflow?"slds-is-open":null)},l().createElement(v.A,{className:"slds-button_icon-container slds-button_icon-x-small",tabIndex:e.itemActive?"0":"-1",symbol:"chevrondown","aria-haspopup":"true",assistiveText:"Actions for "+e.title,title:"Actions for "+e.title,theme:"error"===e.statusLevel\|\|"success"===e.statusLevel?"inverse":null,useCurrentColor:"error"!==e.statusLevel&&"success"!==e.statusLevel}),l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,{iconRight:l().createElement(G,null,"r")},"Refresh Tab"),l().createElement(u.Dr,{iconRight:l().createElement(G,null,"⇧ + n")},"Open in a new window"),l().createElement(u.Dr,{iconRight:l().createElement(G,null,"p")},"Pin Tab"),l().createElement(u.Dr,{iconRight:l().createElement(G,null,"w")},"Close Tab")))),e.pinned?null:l().createElement("div",{className:"slds-context-bar__icon-action slds-col_bump-left slds-p-left_none"},l().createElement(v.A,{className:"slds-button_icon-container slds-button_icon-x-small",tabIndex:e.itemActive?"0":"-1",symbol:"close",assistiveText:"Close "+e.title,title:"Close "+e.title,theme:"error"===e.statusLevel\|\|"success"===e.statusLevel?"inverse":null,useCurrentColor:"error"!==e.statusLevel&&"success"!==e.statusLevel})))};K.propTypes={className:d().string,hasFocus:d().bool,hasSubtabs:d().bool,id:d().string.isRequired,itemActive:d().bool,itemUnread:d().bool,itemUnsaved:d().bool,pinned:d().bool,statusLevel:d().oneOf(["error","success","warning"]),tabPanelId:d().string.isRequired,title:d().string},K.defaultProps={hasIcon:!0,title:"Tab Name"};var z=function(e){return l().createElement("div",{id:e.id,className:m()(e.show?"slds-show":"slds-hide"),role:"tabpanel","aria-labelledby":e.tabId},e.children)},J=function(e){return l().createElement("div",{className:m()("slds-context-bar slds-context-bar_tabs",e.className)},l().createElement("div",{className:"slds-context-bar__primary"},l().createElement("div",{className:"slds-context-bar__item slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click slds-no-hover"},l().createElement("div",{className:"slds-context-bar__icon-action"},l().createElement(E.A,{className:"slds-context-bar__button"})),l().createElement("span",{className:"slds-context-bar__label-action slds-context-bar__app-name"},l().createElement("span",{className:"slds-truncate",title:e.appName\|\|"App Name"},e.appName\|\|"App Name"))),l().createElement("div",{className:m()("slds-context-bar__item slds-context-bar__object-switcher slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click",e.objectSwitchClassName)},l().createElement("a",{href:"#",className:"slds-context-bar__label-action",onClick:function(e){return e.preventDefault()}},l().createElement("span",{className:"slds-truncate",title:"Object"},"Object")),l().createElement("div",{className:"slds-context-bar__icon-action"},l().createElement(v.A,{className:"slds-button_icon-container slds-button_icon-x-small",symbol:"chevrondown","aria-haspopup":"true",assistiveText:"Open object switcher menu",title:"Open object switcher menu"})),l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,null,l().createElement(b.A,{className:"slds-icon slds-icon_small slds-icon-standard-account slds-m-right_small",sprite:"standard",symbol:"account"}),"Accounts"),l().createElement(u.Dr,null,l().createElement(b.A,{className:"slds-icon slds-icon_small slds-icon-standard-case slds-m-right_small",sprite:"standard",symbol:"case"}),"Cases"),l().createElement(u.Dr,null,l().createElement(b.A,{className:"slds-icon slds-icon_small slds-icon-standard-work-order slds-m-right_small",sprite:"standard",symbol:"work_order"}),"Insights")))),l().createElement("div",{className:m()("slds-context-bar__item slds-dropdown-trigger slds-dropdown-trigger_click",e.addTabActive?"slds-is-open":null,e.addTabClassName)},l().createElement("div",{className:"slds-context-bar__icon-action"},l().createElement(v.A,{className:"slds-button_icon-container slds-button_icon-small",symbol:"add",assistiveText:"Open a New Tab",title:"Open a New Tab"})),e.addTabActive?l().createElement("section",{className:"slds-popover slds-nubbin_top",role:"dialog","aria-label":"Add tab by URL or ID",style:{position:"absolute",left:"1.125rem",top:"2.75rem",marginLeft:"-10rem"}},l().createElement("div",{className:"slds-popover__body"},l().createElement("div",{className:"slds-form-element"},l().createElement("label",{className:"slds-form-element__label",htmlFor:"text-input-01"},"Add Page by URL or ID"),l().createElement("div",{className:"slds-form-element__control slds-grid"},l().createElement("input",{id:"text-input-01",className:"slds-input",type:"text",placeholder:"Placeholder Text"}),l().createElement("button",{className:"slds-button slds-button_brand slds-shrink-none slds-m-left_small",type:"submit"},"Add Tab"))))):null)),l().createElement("div",{className:"slds-context-bar__secondary"},l().createElement("div",{className:"slds-context-bar__vertical-divider"}),l().createElement("ul",{className:"slds-grid",role:"tablist"},e.children)))},Y=function(e){return l().createElement("li",{className:m()("slds-context-bar__item","slds-context-bar__dropdown-trigger","slds-dropdown-trigger","slds-dropdown-trigger_click",{"slds-is-open":e.isOpen,"slds-has-notification":e.itemUnread,"slds-is-unsaved":e.itemUnsaved,"slds-has-success":"success"===e.statusLevel,"slds-has-warning":"warning"===e.statusLevel,"slds-has-error":"error"===e.statusLevel}),role:"presentation"},l().createElement("button",{className:"slds-button slds-context-bar__label-action",title:"More Tab Items","aria-haspopup":"true",role:"tab"},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,null),e.itemUnread&&l().createElement(H.VK,null)),l().createElement("span",{className:"slds-truncate",title:"More Tabs"},"More ",l().createElement("span",{className:"slds-assistive-text"},"Tabs")),l().createElement(b.A,{className:"slds-button__icon slds-button__icon_small slds-button__icon_right",sprite:"utility",symbol:"chevrondown"})),l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,{className:m()({"slds-has-notification":e.itemUnread,"slds-is-unsaved":e.itemUnsaved}),statusLevel:e.statusLevel,title:"Chat - Customer"},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,{title:"Tab(s) within menu not saved"}),e.itemUnread&&l().createElement(H.VK,null)),e.itemHasIcon&&l().createElement(H.Px,{statusLevel:e.statusLevel,symbol:"live_chat"}),l().createElement("span",null,"Chat - Customer")),l().createElement(u.Dr,{title:"Overflow Tab Item"},l().createElement(H.$7,null),e.itemHasIcon&&l().createElement(H.Px,null),l().createElement("span",null,"Overflow Tab Item")))))};Y.propTypes={statusLevel:d().oneOf(["error","success","warning"])},Y.defaultProps={itemHasIcon:!0};var Q=[{id:"default",label:$+"Default",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))}],Z=[{id:"tab-active",label:$+"Active",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"tab-active-focus",label:$+"Active Focus",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0,hasFocus:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"tab-item-action-menu-open",label:$+"Action Overflow",element:l().createElement("div",{className:"demo-only",style:{height:"12rem"}},l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0,actionOverflow:"true"}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unsaved-tab",label:$+"Unsaved Tab",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X,itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-tab",label:$+"Unread Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Chat - Customer",tabPanelId:B,id:X,symbol:"live_chat",itemUnread:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"unread-unsaved-tab",label:$+"Unread/Unsaved Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Chat - Customer",tabPanelId:B,id:X,symbol:"live_chat",itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-success",label:$+"Success",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-success-active",label:$+"Success Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-success-focus",label:$+"Success Focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",hasFocus:!0,id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-success-unread",label:$+"Success Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,itemUnread:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-success-unsaved",label:$+"Success Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-success-unread-unsaved",label:$+"Success Unread and Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,itemUnread:!0,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning",label:$+"Warning",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-active",label:$+"Warning Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-focus",label:$+"Warning focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",hasFocus:!0,id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-unread",label:$+"Warning Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,itemUnread:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-unsaved",label:$+"Warning Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-unread-unsaved",label:$+"Warning Unread and Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,itemUnread:!0,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-error",label:$+"Error",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-error-active",label:$+"Error Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-error-focused",label:$+"Error focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",hasFocus:!0,id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-error-unread",label:$+"Error Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,itemUnread:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-error-unsaved",label:$+"Error Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-error-unread-unsaved",label:$+"Error Unread and Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,itemUnread:!0,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"pinned-tab",label:$+"Pinned Tab",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,pinned:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-active",label:$+"Pinned Tab - Active",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0,pinned:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-active-focus",label:$+"Pinned Tab - Active Focus",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0,pinned:!0,hasFocus:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unsaved-pinned-tab",label:$+"Unsaved Pinned Tab",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,pinned:!0,itemUnsaved:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-pinned-tab",label:$+"Unread Pinned Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Chat - Customer",symbol:"live_chat",tabPanelId:D,id:R,pinned:!0,itemUnread:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success",label:$+"Pinned Success Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",id:R,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success-active",label:$+"Pinned Success Tab Active",element:l().createElement("div",{className:"demo-only"},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success-focused",label:$+"Pinned Success Tab Focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",hasFocus:!0,id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success-unread",label:$+"Pinned Success Tab Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",id:R,itemUnread:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success-unsaved",label:$+"Pinned Success Tab Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",id:R,itemUnsaved:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning",label:$+"Pinned Warning Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",id:R,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning-active",label:$+"Pinned Warning Tab Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning-focused",label:$+"Pinned Warning Tab Focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",hasFocus:!0,id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning-unread",label:$+"Pinned Warning Tab Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",id:R,itemUnread:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning-unsaved",label:$+"Pinned Warning Tab Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",id:R,itemUnsaved:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error",label:$+"Pinned Error Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error-active",label:$+"Pinned Error Tab Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error-focused",label:$+"Pinned Error Tab Focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error-unread",label:$+"Pinned Error Tab Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,itemUnread:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error-unsaved",label:$+"Pinned Error Tab Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,itemUnsaved:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"overflow-tabs",label:$+"Overflow Tabs",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,null)),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"overflow-tabs-open",label:$+"Overflow Tabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{isOpen:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unsaved-overflow-tabs",label:$+"Unsaved Overflow Tabs",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unsaved-overflow-tabs-open",label:$+"Unsaved Overflow Tabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{isOpen:!0,itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-overflow-tabs",label:$+"Unread Overflow Tabs",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{itemUnread:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-overflow-tabs-open",label:$+"Unread Overflow Tabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{isOpen:!0,itemUnread:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-unsaved-overflow-tabs-open",label:$+"Unread Unsaved Overflow Tabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{isOpen:!0,itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-unsaved-overflow-tabs-without-icon-open",label:$+"Unread Unsaved Overflow Tabs without Icon - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X,itemUnread:!0,itemUnsaved:!0,hasIcon:!1}),l().createElement(Y,{isOpen:!0,itemUnread:!0,itemUnsaved:!0,itemHasIcon:!1})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"success-overflow",label:$+"Success Overflow Tabs",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"success",isOpen:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"success-overflow-unread-unsaved",label:$+"Success Overflow Tabs Unread and Unsaved",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"success",isOpen:!0,itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"warning-overflow",label:$+"Warning Overflow Tabs",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"warning",isOpen:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"warning-overflow-unread-unsaved",label:$+"Warning Overflow Tabs Unread and Unsaved",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"warning",isOpen:!0,itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"error-overflow",label:$+"Error Overflow Tabs",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"error",isOpen:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"error-overflow-unread-unsaved",label:$+"Error Overflow Tabs Unread and Unsaved",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"error",isOpen:!0,itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"object-switcher-active",label:$+"Object Switcher - Active",element:l().createElement(l().Fragment,null,l().createElement(J,{objectSwitchClassName:"slds-is-active"},l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"object-switcher-menu-open",label:$+"Object Switcher - Open",element:l().createElement("div",{className:"demo-only",style:{height:"11rem"}},l().createElement(J,{objectSwitchClassName:"slds-is-open"},l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"add-tab-dialog-open",label:$+"Add Tab Dialog - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement(J,{addTabActive:!0},l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"sub-tabs-open",label:$+"Subtabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0,hasSubtabs:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{show:!0,id:D,tabId:R},l().createElement(k,null,l().createElement(M,null,l().createElement(F,{active:!0,title:"00071938",tabItemId:"subtab-tabitem-01",tabPanelId:"subtab-tabpanel-01"}),l().createElement(F,{title:"Chat - Customer",tabItemId:"subtab-tabitem-02",tabPanelId:"subtab-tabpanel-02",symbol:"live_chat"})),l().createElement(j,{id:"subtab-tabpanel-01",tabId:"subtab-tabitem-01",isVisible:!0},"Item One Content"),l().createElement(j,{id:"subtab-tabpanel-02",tabId:"subtab-tabitem-02"},"Item Two Content"))),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))}],ee=i.XB.a,te=i.XB.code,ae=i.XB.h2,ne=i.XB.h3,le=i.XB.h4,ie=i.XB.h5,se=i.XB.li,re=i.XB.ol,oe=i.XB.p,de=i.XB.strong,ce=i.XB.ul,me=function(){return(0,n.createElement)(i.Ay,{},(0,n.createElement)("div",{className:"doc lead"},"Global Navigation is the list of navigation links your users find in the Header on every page in Salesforce. Your Global Navigation includes a Navigation Bar where your users find the App Launcher, App Name, and Pages that each App includes."),(0,n.createElement)(s.A,{exampleOnly:!0,demoStyles:(0,h.GP)(U,"default")},(0,h.NO)(U)),ae({id:"About-Navigation-Bar"},"About Navigation Bar"),oe({},"The navigation bar is composed of a wrapper and 2 required regions:"),ce({},se({},de({},"Primary,")," which contains the App Launcher and App Name"),se({},de({},"Secondary,")," which contains the App Items, for navigating within the current app")),oe({},"The markup should follow the order listed above for proper keyboard interaction set by the 508 compliance standards. Each included region inside the wrapper of ",te({},".slds-context-bar")," needs the appropriate ordering class name, e.g. ",te({},".slds-context-bar__primary"),"."),(0,n.createElement)(s.A,{demoStyles:(0,h.GP)(U,"default")},(0,h.NO)(U)),ne({id:"Items-on-the-Navigation-Bar"},"Items on the Navigation Bar"),oe({},"Every item that sits on the horizontal axis of the navigation bar should receive the class ",te({},".slds-context-bar__item"),"."),(0,n.createElement)(r.A,null,(0,n.createElement)(N,{label:"Menu Item"})),oe({},"This class is used to notify the navigation bar that it has a new item. The styles applied allow the children of the navigation bar to vertically aligned, without knowing the height of the navigation bar. The styles will also allow for the actionable items ",te({},".slds-context-bar__label-action")," and ",te({},".slds-context-bar__icon-action")," to stretch 100% of the height of the navigation bar, optimizing the hit area of those actions."),oe({},"Since the items are leveraging flexbox, the elements inside can easily be re-ordered easily by using an order class helper on the element, such as ",te({},".slds-order--[#]"),"."),ne({id:"Building-the-Navigation-Bar-Item"},"Building the Navigation Bar Item"),oe({},"The navigation bar item is built to accommodate 2 specific layout needs."),re({},se({},"Individual text hyperlink to invokes link destination"),se({},"Individual text hyperlink to invokes link destination + button icon to indicate menu dropdown is available")),oe({},"These layouts are built upon 2 reusable classes. The text hyperlink action area would get the class ",te({},".slds-context-bar__label-action")," and the icon based action area would get the class ",te({},".slds-context-bar__icon-action"),"."),oe({},"The ",te({},".slds-context-bar__icon-action")," class handles the alignment and coloring of the icons based on interactions such as ",te({},":hover"),", ",te({},":focus")," and ",te({},":active"),". This is a required if you have an actionable icon area adjacent to an actionable text area."),oe({},"The markup structure should have the button icon(s) preceding the text label. The icons can be visually reordered by using the ordering utility classes such as ",te({},".slds-order--[#]"),"."),le({id:"Icons"},"Icons"),oe({},"The icons in the navigation bar either serve as a visual affordance that indicates an item has a menu with additional actions or the icon itself is actionable."),(0,n.createElement)(r.A,null,(0,n.createElement)(N,{label:"Menu Item",hasNavMenu:!0,hasMenuDropdown:!1})),oe({},"The class used to indicate a button icon will sit adjacent to another actionable item is ",te({},".slds-context-bar__icon-action"),". If you two icons in an item, each icon should be contained in it’s own ",te({},".slds-context-bar__icon-action")," element."),oe({},"The look and feel of the button icon is dependant on the modifiers used from ",ee({href:"/components/buttons/#icon"},"Button Icon Variant Component")," page."),oe({},"The ",te({},".slds-context-bar__icon-action")," styles apply a default left and right padding of 0.75rem. That padding can be removed or modified by using our spacing utilities. In example #1, the left padding has been removed by using the class ",te({},".slds-p-left--none"),"."),oe({},"If a navigation bar item has an icon then we want to provide visual indication that its active when a user hovers into its region. To make this happen, apply the class ",te({},".slds-hint-parent")," to the hover region, most cases would be ",te({},".slds-context-bar__icon-action")," element."),le({id:"Menu-trigger-area"},"Menu trigger area"),oe({},"When a navigation bar items requires a menu with additional sub options or actions, the classes that need to be added to the target hit area are the following:"),(0,n.createElement)(r.A,null,(0,n.createElement)(N,{label:"Menu Item",hasNavMenu:!0})),re({},se({},te({},".slds-context-bar__dropdown-trigger")," — Add a hoverable zone below the action so that the dropdown doesn’t disappear when the mouse is between the action and the dropdown — this is specific to the navigation bar"),se({},te({},".slds-dropdown-trigger")," — Globally used utility that notifies the element there is a dropdown menu"),se({},te({},".slds-dropdown-trigger_click")," — Specifies that an item requires a click to open interaction.")),oe({},"If the navigation item has one hyperlink with a menu containing additional sub actions, then the hover area that invokes the dropdown menu is both the ",te({},".slds-context-bar__label-action")," and ",te({},".slds-context-bar__icon-action"),". If the navigation item is demonstrated as a tab format, one hyperlink plus two additional actions, then the hover area that invokes the dropdown menu is only on the ",te({},".slds-context-bar__icon-action"),"."),ne({id:"Specifics-of-the-Navigation-Bar"},"Specifics of the Navigation Bar"),le({id:"App-Launcher"},"App Launcher"),oe({},"The app launcher is the one element on the navigation bar that requires a mouse click or keyboard enter to invoke the app launcher dropdown. Please use JavaScript to accommodate this requirement."),le({id:"App-Name"},"App Name"),oe({},"The application name needs to receive the ",te({},".slds-context-bar__app-name")," class. This class will handle such things as its unique font sizing and truncation widths."),le({id:"Dividers"},"Dividers"),oe({},"Due to the platform-esc nature of the navigation bar, there is an available element utility to apply a divider between sections where needed. The ",te({},".slds-context-bar__vertical-divider")," class should be applied to an empty ",te({},"<div>")," and placed within the markup of your navigation bar for a visual divider."),oe({},"Alternatively, two classes are available to add border using css. Adding the class ",te({},".slds-context-bar__item--divider-left")," will add a left border to a navigation bar item while ",te({},".slds-context-bar__item--divider-right")," will add a right border."),ne({id:"States"},"States"),le({id:"Active-item"},"Active item"),(0,n.createElement)(s.A,null,(0,h.NO)(S,"item-active")),le({id:"Menu-Open"},"Menu Open"),(0,n.createElement)(s.A,{demoStyles:(0,h.GP)(S,"item-menu-open")},(0,h.NO)(S,"item-menu-open")),ae({id:"About-Navigation-Tab-Bar"},"About Navigation Tab Bar"),(0,n.createElement)(s.A,null,(0,h.NO)(Q)),ne({id:"Accessibility"},"Accessibility"),oe({},de({},"Communicating Status to Screen Readers:")),oe({},"When communicating tab status updates to the user, unread, warning, error and success notifications should all employ the same technique to communicate that update to users of assistive technology, who would be otherwise unaware of that status change."),oe({},"You should use a single hidden ARIA live region for the entire subtabs block, the contents of which gets updated each time a subtab changes its status. The contents should contain a description of the status level and the name of the tab the status change event occurred in. The markup would look something like:"),oe({},te({},'<div className="slds-assistive-text" aria-live="polite">...</div>')),oe({},"Upon clearing the status on a given tab, you should clear the message from the live region."),oe({},de({},"Unread status:")),oe({},"In order to inform screen readers of new activity in a tab, 2 things should occur."),re({},se({},oe({},"The ",te({},"title")," attribute and ",te({},"aria-label")," on the element that displays the red dot should read ",de({},'"New Activity"'),'. This will update the text content of the tab to include the "New Activity" text: "New Activity Chat - Customer".')),se({},oe({},"The hidden live region as described above, should have its content updated to ",de({},'"New Activity in Tab: [Tab Name Here]"')," to alert the user of new activity in that particular subtab."))),oe({},te({},'<span aria-label="New Activity" className="slds-indicator_unread" title="New Activity"></span>')),oe({},te({},'<div className="slds-assistive-text" aria-live="polite">New activity in Tab: Chat - Customer</div>')),oe({},de({},"Warning, Error and Success Tabs:")),oe({},"When you wish to draw attention to a particular tab because something has occurred in that tab that corresponds to an alert level, you can use the ",te({},"slds-has-warning"),", ",te({},"slds-has-error")," or ",te({},"slds-has-success")," class to change the background color and introduce a short pulsing animation to draw attention from the user."),oe({},"The icon is updated to match the corresponding alert level, to give an extra way to communicate the level of the status without relying on the use of color alone."),oe({},"In this example we show that something inside the tab is about to break a service level agreement in 30 seconds, and we wish to draw the users attention to it to take action."),oe({},"Update the hidden live region with a message that informs the user of the status level, the message and the offending subtab ",de({},"[level]: [message] in tab: [tab_name]"),"."),oe({},te({},'<div className="slds-assistive-text" aria-live="polite">Warning: SLA agreement in 30 seconds in tab: Chat - Customer</div>')),ne({id:"States-2"},"States"),le({id:"Active"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-active")),ie({id:"Focus"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-active-focus")),le({id:"Unsaved"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unsaved-tab")),le({id:"Unread"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-tab")),le({id:"Overflow"},"Overflow"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-item-action-menu-open")),le({id:"UnreadUnsaved"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-unsaved-tab")),ne({id:"Tab-Feedback-States"},"Tab Feedback States"),le({id:"Success"},"Success"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success")),ie({id:"Active-2"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-active")),ie({id:"Focus-2"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-focus")),ie({id:"Unsaved-2"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-unsaved")),ie({id:"Unread-2"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-unread")),ie({id:"UnreadUnsaved-2"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-unread-unsaved")),le({id:"Warning"},"Warning"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning")),ie({id:"Active-3"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-active")),ie({id:"Focus-3"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-focus")),ie({id:"Unsaved-3"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-unsaved")),ie({id:"Unread-3"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-unread")),ie({id:"UnreadUnsaved-3"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-unread-unsaved")),le({id:"Error"},"Error"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error")),ie({id:"Active-4"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-active")),ie({id:"Focus-4"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-focused")),ie({id:"Unsaved-4"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-unsaved")),ie({id:"Unread-4"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-unread")),ie({id:"UnreadUnsaved-4"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-unread-unsaved")),ne({id:"Pinned"},"Pinned"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"pinned-tab")),le({id:"Pinned-States"},"Pinned States"),ie({id:"Active-5"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"pinned-tab-active")),ie({id:"Focus-5"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"pinned-tab-active-focus")),ie({id:"Unsaved-5"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unsaved-pinned-tab")),ie({id:"Unread-5"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-pinned-tab")),ne({id:"Overflowed-Tabs"},"Overflowed Tabs"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"overflow-tabs")),le({id:"Opened"},"Opened"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"overflow-tabs-open")),le({id:"Unsaved-6"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unsaved-overflow-tabs")),ie({id:"Opened-2"},"Opened"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unsaved-overflow-tabs-open")),le({id:"Unread-6"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-overflow-tabs")),ie({id:"Opened-3"},"Opened"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-overflow-tabs-open")),le({id:"UnreadUnsaved-5"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-unsaved-overflow-tabs-open")),ie({id:"No-Icon"},"No Icon"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-unsaved-overflow-tabs-without-icon-open")),ne({id:"Feedback-states-for-overflow-menu"},"Feedback states for overflow menu"),le({id:"Success-2"},"Success"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"success-overflow")),ie({id:"UnsavedUnread"},"Unsaved/Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"success-overflow-unread-unsaved")),le({id:"Warning-2"},"Warning"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"warning-overflow")),ie({id:"UnsavedUnread-2"},"Unsaved/Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"warning-overflow-unread-unsaved")),le({id:"Error-2"},"Error"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"error-overflow")),ie({id:"UnsavedUnread-3"},"Unsaved/Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"error-overflow-unread-unsaved")),ne({id:"Object-Switcher"},"Object Switcher"),le({id:"Active-6"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"object-switcher-active")),le({id:"Menu-open"},"Menu open"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"object-switcher-menu-open")),ne({id:"Add-a-tab-dialog"},"Add a tab dialog"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"add-tab-dialog-open")),ne({id:"Active-tab-with-Subtabs"},"Active tab with Subtabs"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"sub-tabs-open")))},be=function(){return(0,i.Qr)(me())}}},l={};function i(e){var t=l[e];if(void 0!==t)return t.exports;var a=l[e]={id:e,exports:{}};return n[e](a,a.exports,i),a.exports}i.m=n,i.amdO={},e=[],i.O=function(t,a,n,l){if(!a){var s=1/0;for(c=0;c<e.length;c++){a=e[c][0],n=e[c][1],l=e[c][2];for(var r=!0,o=0;o<a.length;o++)(!1&l\|\|s>=l)&&Object.keys(i.O).every(function(e){return i.O[e](a[o])})?a.splice(o--,1):(r=!1,l<s&&(s=l));if(r){e.splice(c--,1);var d=n();void 0!==d&&(t=d)}}return t}l=l\|\|0;for(var c=e.length;c>0&&e[c-1][2]>l;c--)e[c]=e[c-1];e[c]=[a,n,l]},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,{a:t}),t},a=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},i.t=function(e,n){if(1&n&&(e=this(e)),8&n)return e;if("object"==typeof e&&e){if(4&n&&e.__esModule)return e;if(16&n&&"function"==typeof e.then)return e}var l=Object.create(null);i.r(l);var s={};t=t\|\|[null,a({}),a([]),a(a)];for(var r=2&n&&e;("object"==typeof r\|\|"function"==typeof r)&&!~t.indexOf(r);r=a(r))Object.getOwnPropertyNames(r).forEach(function(t){s[t]=function(){return e[t]}});return s.default=function(){return e},i.d(l,s),l},i.d=function(e,t){for(var a in t)i.o(t,a)&&!i.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},i.e=function(){return Promise.resolve()},i.g=function(){if("object"==typeof globalThis)return globalThis;try{return this\|\|new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.j=9441,function(){var e={9441:0};i.O.j=function(t){return 0===e[t]};var t=function(t,a){var n,l,s=a[0],r=a[1],o=a[2],d=0;if(s.some(function(t){return 0!==e[t]})){for(n in r)i.o(r,n)&&(i.m[n]=r[n]);if(o)var c=o(i)}for(t&&t(a);d<s.length;d++)l=s[d],i.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return i.O(c)},a=self.webpackJsonpSLDS___internal_chunked_docs=self.webpackJsonpSLDS___internal_chunked_docs\|\|[];a.forEach(t.bind(null,0)),a.push=t.bind(null,a.push.bind(a))}(),i.nc=void 0;var s=i.O(void 0,[3540],function(){return i(5629)});s=i.O(s),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/docs/./ui/components/global-navigation/docs.mdx.js"]=s}();
1	+ var SLDS;!function(){"use strict";var e,t,a,n={1594:function(e){e.exports=React},1981:function(e){e.exports=JSBeautify},5206:function(e){e.exports=ReactDOM},5629:function(e,t,a){a.r(t),a.d(t,{getContents:function(){return be},getElement:function(){return me}});var n=a(1594),l=a.n(n),i=a(5671),s=a(6547),r=a(3212),o=(a(5619),a(4187)),d=a.n(o),c=a(942),m=a.n(c),b=a(8347),u=a(4760),v=a(6955),E=a(5898),h=a(806);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 I(e,t){for(var a=0;a<t.length;a++){var n=t[a];n.enumerable=n.enumerable\|\|!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,g(n.key),n)}}function g(e){var t=function(e){if("object"!=p(e)\|\|!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var a=t.call(e,"string");if("object"!=p(a))return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==p(t)?t:t+""}function C(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(C=function(){return!!e})()}function T(e){return T=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},T(e)}function w(e,t){return w=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},w(e,t)}function f(){return f=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)({}).hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},f.apply(null,arguments)}var y=function(){var e=h.Ay.uniqueId("menu-group-id-");return l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,{title:"Main action"},l().createElement(b.A,{className:"slds-icon slds-icon_x-small slds-icon-text-default slds-m-right_x-small",sprite:"utility",symbol:"add"}),"Main action"),l().createElement("li",{role:"presentation"},l().createElement("ul",{role:"group","aria-labelledby":e},l().createElement("li",{className:"slds-dropdown__header slds-has-divider_top-space",role:"presentation",id:e},l().createElement("span",null,"Menu header")),l().createElement(u.Dr,null,"Menu Item One"),l().createElement(u.Dr,null,"Menu Item Two"),l().createElement(u.Dr,null,"Menu Item Three")))))},N=function(e){var t=e.label,a=e.isActive,n=e.hasNavMenu,i=e.hasNavMenuOpen,s=e.hasMenuDropdown,r=m()("slds-context-bar__item",{"slds-is-active":a,"slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click":n,"slds-is-open":i});return l().createElement("li",{className:r},l().createElement("a",{href:"#",className:"slds-context-bar__label-action",title:t,onClick:function(e){return e.preventDefault()}},a&&l().createElement("span",{className:"slds-assistive-text"},"Current Page:"),l().createElement("span",{className:"slds-truncate",title:t},t)),n&&l().createElement(l().Fragment,null,l().createElement(_,{onClick:e.onClick}),s&&l().createElement(y,null)))};N.defaultProps={label:"Menu Item",hasMenuDropdown:!0},N.propTypes={label:d().string.isRequired,isActive:d().bool,hasNavMenu:d().bool,hasNavMenuOpen:d().bool,hasMenuDropdown:d().bool};var _=function(e){return l().createElement("div",{className:"slds-context-bar__icon-action slds-p-left_none"},l().createElement(v.A,f({className:"slds-button_icon slds-context-bar__button",symbol:"chevrondown","aria-haspopup":"true",assistiveText:"Open menu item submenu",title:"Open menu item submenu"},e)))},A=function(e){var t=e.appName,a=e.homeItemIsActive,n=e.hasNavMenuOpen,i=e.children;return l().createElement("div",{className:"slds-context-bar"},l().createElement("div",{className:"slds-context-bar__primary"},l().createElement("div",{className:"slds-context-bar__item slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click slds-no-hover"},l().createElement("div",{className:"slds-context-bar__icon-action"},l().createElement(E.A,{className:"slds-context-bar__button"})),l().createElement("span",{className:"slds-context-bar__label-action slds-context-bar__app-name"},l().createElement("span",{className:"slds-truncate",title:t\|\|"App Name"},t\|\|"App Name")))),l().createElement("nav",{className:"slds-context-bar__secondary",role:"navigation"},l().createElement("ul",{className:"slds-grid"},l().createElement(N,{label:"Home",isActive:a}),i\|\|l().createElement(l().Fragment,null,l().createElement(N,{label:"Menu Item",hasNavMenu:!0,hasNavMenuOpen:n,onClick:function(){return e.toggleNavMenu()}}),l().createElement(N,{label:"Menu Item"}),l().createElement(N,{label:"Menu Item"}),l().createElement(N,{label:"Menu Item"})))))};A.propTypes={appName:d().string,homeItemIsActive:d().bool,hasNavMenuOpen:d().bool,children:d().node};var P=function(e){function t(){var e;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),(e=function(e,t,a){return t=T(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,C()?Reflect.construct(t,a\|\|[],T(e).constructor):t.apply(e,a))}(this,t)).toggleNavMenu=e.toggleNavMenu.bind(e),e.state={hasNavMenuOpen:!1},e}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&&w(e,t)}(t,e),a=t,(n=[{key:"toggleNavMenu",value:function(){this.setState({hasNavMenuOpen:!this.state.hasNavMenuOpen})}},{key:"render",value:function(){return l().createElement(A,{homeItemIsActive:!0,toggleNavMenu:this.toggleNavMenu,hasNavMenuOpen:this.props.hasNavMenuOpen\|\|this.state.hasNavMenuOpen})}}])&&I(a.prototype,n),Object.defineProperty(a,"prototype",{writable:!1}),a;var a,n}(n.Component),O=P,x="Navigation Bar - ",U=[{id:"default",label:x+"Default",demoStyles:"height: 16rem;",storybookStyles:!1,element:l().createElement(O,null)}],S=[{id:"item-active",label:x+"Item Active",element:l().createElement(A,null,l().createElement(N,{label:"Menu Item",hasNavMenu:!0}),l().createElement(N,{label:"Menu Item"}),l().createElement(N,{label:"Menu Item",isActive:!0}),l().createElement(N,{label:"Menu Item"}))},{id:"item-menu-open",label:x+"Item Menu Open",demoStyles:"height: 16rem;",storybookStyles:!0,element:l().createElement(O,{hasNavMenuOpen:!0})}],L=a(9825),H=a(5794),F=function(e){return l().createElement("li",{className:m()("slds-tabs_default__item slds-sub-tabs__item slds-grid slds-grid_vertical-align-center",{"slds-active":e.active,"slds-has-error":"error"===e.statusLevel,"slds-has-focus":e.hasFocus,"slds-has-notification":e.hasNotification,"slds-has-success":"success"===e.statusLevel,"slds-has-warning":"warning"===e.statusLevel,"slds-is-unsaved":e.itemUnsaved},e.className),role:"presentation"},l().createElement("a",{"aria-controls":e.tabPanelId,"aria-selected":e.active?"true":"false",className:"slds-tabs_default__link slds-p-horizontal_xx-small",href:"#",id:e.tabItemId,role:"tab",tabIndex:e.active?"0":"-1",title:e.title,onClick:function(e){return e.preventDefault()}},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,null),e.hasNotification&&l().createElement(H.VK,null)),e.hasIcon&&l().createElement(H.Px,{statusLevel:e.statusLevel,symbol:e.symbol}),l().createElement("span",{className:m()("slds-truncate",e.pinned?"slds-assistive-text":null),title:e.title},e.title)),e.menuIcon?l().createElement("div",{className:m()("slds-dropdown-trigger slds-dropdown-trigger_click slds-p-left_none slds-p-right_none","true"===e.actionOverflow?"slds-is-open":null)},l().createElement(v.A,{"aria-haspopup":"true",assistiveText:"Actions for "+e.title,className:"slds-button_icon-container slds-button_icon-x-small",symbol:"chevrondown",tabIndex:e.active?"0":"-1",theme:"error"===e.statusLevel\|\|"success"===e.statusLevel?"inverse":null,title:"Actions for "+e.title})):null,l().createElement("div",{className:m()("slds-col_bump-left slds-p-left_none slds-p-right_none",e.pinned?"slds-assistive-text":null)},l().createElement(v.A,{assistiveText:"Close "+e.title,className:"slds-button_icon-container slds-button_icon-x-small",symbol:"close",tabIndex:e.active?"0":"-1",theme:"error"===e.statusLevel\|\|"success"===e.statusLevel?"inverse":null,title:"Close "+e.title})))};F.displayName="Subtab",F.propTypes={actionOverflow:d().string,active:d().bool,statusLevel:d().oneOf(["error","success","warning"]),className:d().string,hasFocus:d().bool,hasIcon:d().bool,hasNotification:d().bool,itemUnsaved:d().bool,menuIcon:d().bool,pinned:d().bool,symbol:d().string,tabItemId:d().string.isRequired,tabPanelId:d().string.isRequired,title:d().string},F.defaultProps={hasIcon:!0,title:"Subtab Name"};var k=function(e){return l().createElement("div",{className:"slds-tabs_default slds-sub-tabs"},e.children)};k.displayName="Subtabs",k.propTypes={children:d().node};var M=function(e){return l().createElement("ul",{className:"slds-tabs_default__nav",role:"tablist"},e.children)};M.displayName="SubtabList",M.propTypes={children:d().node};var j=function(e){return l().createElement("div",{"aria-labelledby":e.tabId,className:m()("slds-tabs_default__content",{"slds-show":e.isVisible,"slds-hide":!e.isVisible}),id:e.id,role:"tabpanel"},e.children)};j.displayName="SubtabPanel",j.propTypes={children:d().node,isVisible:d().bool,id:d().string,tabId:d().string};var W=function(e){return l().createElement("li",{className:m()("slds-tabs_default__item","slds-sub-tabs__item","slds-tabs_default__overflow-button",{"slds-has-error":"error"===e.statusLevel,"slds-has-notification":e.itemUnread,"slds-has-success":"success"===e.statusLevel,"slds-has-warning":"warning"===e.statusLevel,"slds-is-unsaved":e.itemUnsaved}),role:"presentation"},l().createElement("div",{className:m()("slds-dropdown-trigger slds-dropdown-trigger_click",e.isOpen&&"slds-is-open")},l().createElement(L.$n,{"aria-haspopup":"true",title:"More Tab Items",role:"tab"},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,{title:"Tab(s) within menu not saved"}),e.itemUnread&&l().createElement(H.VK,null)),l().createElement("span",{className:"slds-truncate",title:"More Tabs"},"More ",l().createElement("span",{className:"slds-assistive-text"},"Tabs")),l().createElement(b.A,{className:"slds-button__icon slds-button__icon_small slds-button__icon_right",sprite:"utility",symbol:"chevrondown"})),l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,{className:"slds-has-notification",statusLevel:e.statusLevel,title:"Chat - Customer"},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,null),e.itemUnread&&l().createElement(H.VK,null)),e.itemHasIcon&&l().createElement(H.Px,{statusLevel:e.statusLevel,symbol:"live_chat"}),l().createElement("span",null,"error"===e.statusLevel?"SLA Violation":"warning"===e.statusLevel?"SLA 0.30":"Chat - Customer")),l().createElement(u.Dr,{title:"Overflow Tab Item"},l().createElement(H.$7,null),l().createElement(H.Px,null),l().createElement("span",null,"Overflow Tab Item"))))))};W.displayName="SubtabOverflow",W.propTypes={statusLevel:d().oneOf(["error","success","warning"]),isOpen:d().bool,itemHasIcon:d().bool,itemUnread:d().bool,itemUnsaved:d().bool},W.defaultProps={itemHasIcon:!0};var D="context-tab-panel-1",V="context-tab-panel-2",B="context-tab-panel-3",R="context-tab-id-1",q="context-tab-id-2",X="context-tab-id-3",$="Navigation Tab Bar - ",G=function(e){return l().createElement("span",{className:"slds-text-body_small slds-text-color_weak slds-p-left_large"},l().createElement("span",{className:"slds-assistive-text"},":"),e.children)},K=function(e){return l().createElement("li",{className:m()("slds-context-bar__item slds-context-bar__item_tab",e.className,{"slds-is-active":e.itemActive,"slds-is-unsaved":e.itemUnsaved,"slds-is-pinned":e.pinned,"slds-has-focus":e.hasFocus,"slds-has-notification":e.itemUnread,"slds-has-sub-tabs":e.hasSubtabs,"slds-has-success":"success"===e.statusLevel,"slds-has-warning":"warning"===e.statusLevel,"slds-has-error":"error"===e.statusLevel}),role:"presentation"},l().createElement("a",{href:"#",className:"slds-context-bar__label-action",role:"tab",title:e.title,"aria-selected":e.itemActive?"true":"false",tabIndex:e.itemActive?"0":"-1","aria-controls":e.tabPanelId,id:e.id,onClick:function(e){return e.preventDefault()}},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,{title:"Tab Not Saved"}),e.itemUnread&&l().createElement(H.VK,null)),e.hasIcon&&l().createElement(H.Px,{statusLevel:e.statusLevel,symbol:e.symbol}),l().createElement("span",{className:m()("slds-truncate",e.pinned?"slds-assistive-text":null),title:e.title},e.title)),l().createElement("div",{className:m()("slds-context-bar__icon-action slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click slds-p-left_none slds-p-right_none","true"===e.actionOverflow?"slds-is-open":null)},l().createElement(v.A,{className:"slds-button_icon-container slds-button_icon-x-small",tabIndex:e.itemActive?"0":"-1",symbol:"chevrondown","aria-haspopup":"true",assistiveText:"Actions for "+e.title,title:"Actions for "+e.title,theme:"error"===e.statusLevel\|\|"success"===e.statusLevel?"inverse":null,useCurrentColor:"error"!==e.statusLevel&&"success"!==e.statusLevel}),l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,{iconRight:l().createElement(G,null,"r")},"Refresh Tab"),l().createElement(u.Dr,{iconRight:l().createElement(G,null,"⇧ + n")},"Open in a new window"),l().createElement(u.Dr,{iconRight:l().createElement(G,null,"p")},"Pin Tab"),l().createElement(u.Dr,{iconRight:l().createElement(G,null,"w")},"Close Tab")))),e.pinned?null:l().createElement("div",{className:"slds-context-bar__icon-action slds-col_bump-left slds-p-left_none"},l().createElement(v.A,{className:"slds-button_icon-container slds-button_icon-x-small",tabIndex:e.itemActive?"0":"-1",symbol:"close",assistiveText:"Close "+e.title,title:"Close "+e.title,theme:"error"===e.statusLevel\|\|"success"===e.statusLevel?"inverse":null,useCurrentColor:"error"!==e.statusLevel&&"success"!==e.statusLevel})))};K.propTypes={className:d().string,hasFocus:d().bool,hasSubtabs:d().bool,id:d().string.isRequired,itemActive:d().bool,itemUnread:d().bool,itemUnsaved:d().bool,pinned:d().bool,statusLevel:d().oneOf(["error","success","warning"]),tabPanelId:d().string.isRequired,title:d().string},K.defaultProps={hasIcon:!0,title:"Tab Name"};var z=function(e){return l().createElement("div",{id:e.id,className:m()(e.show?"slds-show":"slds-hide"),role:"tabpanel","aria-labelledby":e.tabId},e.children)},J=function(e){return l().createElement("div",{className:m()("slds-context-bar slds-context-bar_tabs",e.className)},l().createElement("div",{className:"slds-context-bar__primary"},l().createElement("div",{className:"slds-context-bar__item slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click slds-no-hover"},l().createElement("div",{className:"slds-context-bar__icon-action"},l().createElement(E.A,{className:"slds-context-bar__button"})),l().createElement("span",{className:"slds-context-bar__label-action slds-context-bar__app-name"},l().createElement("span",{className:"slds-truncate",title:e.appName\|\|"App Name"},e.appName\|\|"App Name"))),l().createElement("div",{className:m()("slds-context-bar__item slds-context-bar__object-switcher slds-context-bar__dropdown-trigger slds-dropdown-trigger slds-dropdown-trigger_click",e.objectSwitchClassName)},l().createElement("a",{href:"#",className:"slds-context-bar__label-action",onClick:function(e){return e.preventDefault()}},l().createElement("span",{className:"slds-truncate",title:"Object"},"Object")),l().createElement("div",{className:"slds-context-bar__icon-action"},l().createElement(v.A,{className:"slds-button_icon-container slds-button_icon-x-small",symbol:"chevrondown","aria-haspopup":"true",assistiveText:"Open object switcher menu",title:"Open object switcher menu"})),l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,null,l().createElement(b.A,{className:"slds-icon slds-icon_small slds-icon-standard-account slds-m-right_small",sprite:"standard",symbol:"account"}),"Accounts"),l().createElement(u.Dr,null,l().createElement(b.A,{className:"slds-icon slds-icon_small slds-icon-standard-case slds-m-right_small",sprite:"standard",symbol:"case"}),"Cases"),l().createElement(u.Dr,null,l().createElement(b.A,{className:"slds-icon slds-icon_small slds-icon-standard-work-order slds-m-right_small",sprite:"standard",symbol:"work_order"}),"Insights")))),l().createElement("div",{className:m()("slds-context-bar__item slds-dropdown-trigger slds-dropdown-trigger_click",e.addTabActive?"slds-is-open":null,e.addTabClassName)},l().createElement("div",{className:"slds-context-bar__icon-action"},l().createElement(v.A,{className:"slds-button_icon-container slds-button_icon-small",symbol:"add",assistiveText:"Open a New Tab",title:"Open a New Tab"})),e.addTabActive?l().createElement("section",{className:"slds-popover slds-nubbin_top",role:"dialog","aria-label":"Add tab by URL or ID",style:{position:"absolute",left:"1.125rem",top:"2.75rem",marginLeft:"-10rem"}},l().createElement("div",{className:"slds-popover__body"},l().createElement("div",{className:"slds-form-element"},l().createElement("label",{className:"slds-form-element__label",htmlFor:"text-input-01"},"Add Page by URL or ID"),l().createElement("div",{className:"slds-form-element__control slds-grid"},l().createElement("input",{id:"text-input-01",className:"slds-input",type:"text",placeholder:"Placeholder Text"}),l().createElement("button",{className:"slds-button slds-button_brand slds-shrink-none slds-m-left_small",type:"submit"},"Add Tab"))))):null)),l().createElement("div",{className:"slds-context-bar__secondary"},l().createElement("div",{className:"slds-context-bar__vertical-divider"}),l().createElement("ul",{className:"slds-grid",role:"tablist"},e.children)))},Y=function(e){return l().createElement("li",{className:m()("slds-context-bar__item","slds-context-bar__dropdown-trigger","slds-dropdown-trigger","slds-dropdown-trigger_click",{"slds-is-open":e.isOpen,"slds-has-notification":e.itemUnread,"slds-is-unsaved":e.itemUnsaved,"slds-has-success":"success"===e.statusLevel,"slds-has-warning":"warning"===e.statusLevel,"slds-has-error":"error"===e.statusLevel}),role:"presentation"},l().createElement("button",{className:"slds-button slds-context-bar__label-action",title:"More Tab Items","aria-haspopup":"true",role:"tab"},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,null),e.itemUnread&&l().createElement(H.VK,null)),l().createElement("span",{className:"slds-truncate",title:"More Tabs"},"More ",l().createElement("span",{className:"slds-assistive-text"},"Tabs")),l().createElement(b.A,{className:"slds-button__icon slds-button__icon_small slds-button__icon_right",sprite:"utility",symbol:"chevrondown"})),l().createElement(u.W1,{className:"slds-dropdown_right"},l().createElement(u.cO,null,l().createElement(u.Dr,{className:m()({"slds-has-notification":e.itemUnread,"slds-is-unsaved":e.itemUnsaved}),statusLevel:e.statusLevel,title:"Chat - Customer"},l().createElement(H.$7,null,e.itemUnsaved&&l().createElement(H.AF,{title:"Tab(s) within menu not saved"}),e.itemUnread&&l().createElement(H.VK,null)),e.itemHasIcon&&l().createElement(H.Px,{statusLevel:e.statusLevel,symbol:"live_chat"}),l().createElement("span",null,"Chat - Customer")),l().createElement(u.Dr,{title:"Overflow Tab Item"},l().createElement(H.$7,null),e.itemHasIcon&&l().createElement(H.Px,null),l().createElement("span",null,"Overflow Tab Item")))))};Y.propTypes={statusLevel:d().oneOf(["error","success","warning"])},Y.defaultProps={itemHasIcon:!0};var Q=[{id:"default",label:$+"Default",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))}],Z=[{id:"tab-active",label:$+"Active",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"tab-active-focus",label:$+"Active Focus",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0,hasFocus:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"tab-item-action-menu-open",label:$+"Action Overflow",element:l().createElement("div",{className:"demo-only",style:{height:"12rem"}},l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0,actionOverflow:"true"}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unsaved-tab",label:$+"Unsaved Tab",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X,itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-tab",label:$+"Unread Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Chat - Customer",tabPanelId:B,id:X,symbol:"live_chat",itemUnread:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"unread-unsaved-tab",label:$+"Unread/Unsaved Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Chat - Customer",tabPanelId:B,id:X,symbol:"live_chat",itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-success",label:$+"Success",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-success-active",label:$+"Success Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-success-focus",label:$+"Success Focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",hasFocus:!0,id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-success-unread",label:$+"Success Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,itemUnread:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-success-unsaved",label:$+"Success Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-success-unread-unsaved",label:$+"Success Unread and Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"success",id:X,itemUnread:!0,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"Chat - Customer"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning",label:$+"Warning",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-active",label:$+"Warning Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-focus",label:$+"Warning focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",hasFocus:!0,id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-unread",label:$+"Warning Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,itemUnread:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-unsaved",label:$+"Warning Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-warning-unread-unsaved",label:$+"Warning Unread and Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"warning",id:X,itemUnread:!0,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"SLA in 0.30"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-error",label:$+"Error",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-error-active",label:$+"Error Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-error-focused",label:$+"Error focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",hasFocus:!0,id:X,itemActive:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,show:!0,tabId:X},"Chat - Customer Content"))},{id:"tab-error-unread",label:$+"Error Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,itemUnread:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-error-unsaved",label:$+"Error Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"tab-error-unread-unsaved",label:$+"Error Unread and Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{statusLevel:"error",id:X,itemUnread:!0,itemUnsaved:!0,symbol:"live_chat",tabPanelId:B,title:"SLA Violation"})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Chat - Customer Content"))},{id:"pinned-tab",label:$+"Pinned Tab",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,pinned:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-active",label:$+"Pinned Tab - Active",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0,pinned:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-active-focus",label:$+"Pinned Tab - Active Focus",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0,pinned:!0,hasFocus:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unsaved-pinned-tab",label:$+"Unsaved Pinned Tab",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,pinned:!0,itemUnsaved:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-pinned-tab",label:$+"Unread Pinned Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Chat - Customer",symbol:"live_chat",tabPanelId:D,id:R,pinned:!0,itemUnread:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q,itemActive:!0}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{show:!0,id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success",label:$+"Pinned Success Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",id:R,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success-active",label:$+"Pinned Success Tab Active",element:l().createElement("div",{className:"demo-only"},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success-focused",label:$+"Pinned Success Tab Focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",hasFocus:!0,id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success-unread",label:$+"Pinned Success Tab Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",id:R,itemUnread:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-success-unsaved",label:$+"Pinned Success Tab Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"success",id:R,itemUnsaved:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning",label:$+"Pinned Warning Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",id:R,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning-active",label:$+"Pinned Warning Tab Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning-focused",label:$+"Pinned Warning Tab Focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",hasFocus:!0,id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning-unread",label:$+"Pinned Warning Tab Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",id:R,itemUnread:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-warning-unsaved",label:$+"Pinned Warning Tab Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"warning",id:R,itemUnsaved:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error",label:$+"Pinned Error Tab",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error-active",label:$+"Pinned Error Tab Active",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error-focused",label:$+"Pinned Error Tab Focused",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,itemActive:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,show:!0,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error-unread",label:$+"Pinned Error Tab Unread",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,itemUnread:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"pinned-tab-error-unsaved",label:$+"Pinned Error Tab Unsaved",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{statusLevel:"error",id:R,itemUnsaved:!0,pinned:!0,symbol:"live_chat",tabPanelId:D,title:"Chat - Customer"}),l().createElement(K,{id:q,itemActive:!0,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"})),l().createElement(z,{id:D,tabId:R},"Chat - Customer Content"),l().createElement(z,{id:V,show:!0,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"overflow-tabs",label:$+"Overflow Tabs",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,null)),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"overflow-tabs-open",label:$+"Overflow Tabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{isOpen:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unsaved-overflow-tabs",label:$+"Unsaved Overflow Tabs",element:l().createElement(l().Fragment,null,l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unsaved-overflow-tabs-open",label:$+"Unsaved Overflow Tabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{isOpen:!0,itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-overflow-tabs",label:$+"Unread Overflow Tabs",element:l().createElement(l().Fragment,null,l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{itemUnread:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-overflow-tabs-open",label:$+"Unread Overflow Tabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{isOpen:!0,itemUnread:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-unsaved-overflow-tabs-open",label:$+"Unread Unsaved Overflow Tabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X}),l().createElement(Y,{isOpen:!0,itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"unread-unsaved-overflow-tabs-without-icon-open",label:$+"Unread Unsaved Overflow Tabs without Icon - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"New activity in Tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X,itemUnread:!0,itemUnsaved:!0,hasIcon:!1}),l().createElement(Y,{isOpen:!0,itemUnread:!0,itemUnsaved:!0,itemHasIcon:!1})),l().createElement(z,{show:!0,id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"success-overflow",label:$+"Success Overflow Tabs",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"success",isOpen:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"success-overflow-unread-unsaved",label:$+"Success Overflow Tabs Unread and Unsaved",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Success: SLA agreement warning cleared in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"success",isOpen:!0,itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"warning-overflow",label:$+"Warning Overflow Tabs",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"warning",isOpen:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"warning-overflow-unread-unsaved",label:$+"Warning Overflow Tabs Unread and Unsaved",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Warning: SLA agreement in 30 seconds in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"warning",isOpen:!0,itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"error-overflow",label:$+"Error Overflow Tabs",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"error",isOpen:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"error-overflow-unread-unsaved",label:$+"Error Overflow Tabs Unread and Unsaved",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement("span",{"aria-live":"polite",className:"slds-assistive-text"},"Violation: SLA agreement in tab: Chat - Customer"),l().createElement(J,null,l().createElement(K,{id:R,itemActive:!0,symbol:"home",tabPanelId:D,title:"Home"}),l().createElement(K,{id:q,tabPanelId:V,title:"Tab Item 1"}),l().createElement(K,{id:X,tabPanelId:B,title:"Tab Item 2"}),l().createElement(Y,{statusLevel:"error",isOpen:!0,itemUnread:!0,itemUnsaved:!0})),l().createElement(z,{id:D,show:!0,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"object-switcher-active",label:$+"Object Switcher - Active",element:l().createElement(l().Fragment,null,l().createElement(J,{objectSwitchClassName:"slds-is-active"},l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"object-switcher-menu-open",label:$+"Object Switcher - Open",element:l().createElement("div",{className:"demo-only",style:{height:"11rem"}},l().createElement(J,{objectSwitchClassName:"slds-is-open"},l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"add-tab-dialog-open",label:$+"Add Tab Dialog - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement(J,{addTabActive:!0},l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{id:D,tabId:R},"Tab Home Content"),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))},{id:"sub-tabs-open",label:$+"Subtabs - Open",element:l().createElement("div",{className:"demo-only",style:{height:"8rem"}},l().createElement(J,null,l().createElement(K,{title:"Home",symbol:"home",tabPanelId:D,id:R,itemActive:!0,hasSubtabs:!0}),l().createElement(K,{title:"Tab Item 1",tabPanelId:V,id:q}),l().createElement(K,{title:"Tab Item 2",tabPanelId:B,id:X})),l().createElement(z,{show:!0,id:D,tabId:R},l().createElement(k,null,l().createElement(M,null,l().createElement(F,{active:!0,title:"00071938",tabItemId:"subtab-tabitem-01",tabPanelId:"subtab-tabpanel-01"}),l().createElement(F,{title:"Chat - Customer",tabItemId:"subtab-tabitem-02",tabPanelId:"subtab-tabpanel-02",symbol:"live_chat"})),l().createElement(j,{id:"subtab-tabpanel-01",tabId:"subtab-tabitem-01",isVisible:!0},"Item One Content"),l().createElement(j,{id:"subtab-tabpanel-02",tabId:"subtab-tabitem-02"},"Item Two Content"))),l().createElement(z,{id:V,tabId:q},"Tab One Content"),l().createElement(z,{id:B,tabId:X},"Tab Two Content"))}],ee=i.XB.a,te=i.XB.code,ae=i.XB.h2,ne=i.XB.h3,le=i.XB.h4,ie=i.XB.h5,se=i.XB.li,re=i.XB.ol,oe=i.XB.p,de=i.XB.strong,ce=i.XB.ul,me=function(){return(0,n.createElement)(i.Ay,{},(0,n.createElement)("div",{className:"doc lead"},"Global Navigation is the list of navigation links your users find in the Header on every page in Salesforce. Your Global Navigation includes a Navigation Bar where your users find the App Launcher, App Name, and Pages that each App includes."),(0,n.createElement)(s.A,{exampleOnly:!0,demoStyles:(0,h.GP)(U,"default")},(0,h.NO)(U)),ae({id:"About-Navigation-Bar"},"About Navigation Bar"),oe({},"The navigation bar is composed of a wrapper and 2 required regions:"),ce({},se({},de({},"Primary,")," which contains the App Launcher and App Name"),se({},de({},"Secondary,")," which contains the App Items, for navigating within the current app")),oe({},"The markup should follow the order listed above for proper keyboard interaction set by the 508 compliance standards. Each included region inside the wrapper of ",te({},".slds-context-bar")," needs the appropriate ordering class name, e.g. ",te({},".slds-context-bar__primary"),"."),(0,n.createElement)(s.A,{demoStyles:(0,h.GP)(U,"default")},(0,h.NO)(U)),ne({id:"Items-on-the-Navigation-Bar"},"Items on the Navigation Bar"),oe({},"Every item that sits on the horizontal axis of the navigation bar should receive the class ",te({},".slds-context-bar__item"),"."),(0,n.createElement)(r.A,null,(0,n.createElement)(N,{label:"Menu Item"})),oe({},"This class is used to notify the navigation bar that it has a new item. The styles applied allow the children of the navigation bar to vertically aligned, without knowing the height of the navigation bar. The styles will also allow for the actionable items ",te({},".slds-context-bar__label-action")," and ",te({},".slds-context-bar__icon-action")," to stretch 100% of the height of the navigation bar, optimizing the hit area of those actions."),oe({},"Since the items are leveraging flexbox, the elements inside can easily be re-ordered easily by using an order class helper on the element, such as ",te({},".slds-order--[#]"),"."),ne({id:"Building-the-Navigation-Bar-Item"},"Building the Navigation Bar Item"),oe({},"The navigation bar item is built to accommodate 2 specific layout needs."),re({},se({},"Individual text hyperlink to invokes link destination"),se({},"Individual text hyperlink to invokes link destination + button icon to indicate menu dropdown is available")),oe({},"These layouts are built upon 2 reusable classes. The text hyperlink action area would get the class ",te({},".slds-context-bar__label-action")," and the icon based action area would get the class ",te({},".slds-context-bar__icon-action"),"."),oe({},"The ",te({},".slds-context-bar__icon-action")," class handles the alignment and coloring of the icons based on interactions such as ",te({},":hover"),", ",te({},":focus")," and ",te({},":active"),". This is a required if you have an actionable icon area adjacent to an actionable text area."),oe({},"The markup structure should have the button icon(s) preceding the text label. The icons can be visually reordered by using the ordering utility classes such as ",te({},".slds-order--[#]"),"."),le({id:"Icons"},"Icons"),oe({},"The icons in the navigation bar either serve as a visual affordance that indicates an item has a menu with additional actions or the icon itself is actionable."),(0,n.createElement)(r.A,null,(0,n.createElement)(N,{label:"Menu Item",hasNavMenu:!0,hasMenuDropdown:!1})),oe({},"The class used to indicate a button icon will sit adjacent to another actionable item is ",te({},".slds-context-bar__icon-action"),". If you two icons in an item, each icon should be contained in it’s own ",te({},".slds-context-bar__icon-action")," element."),oe({},"The look and feel of the button icon is dependant on the modifiers used from ",ee({href:"/components/buttons/#icon"},"Button Icon Variant Component")," page."),oe({},"The ",te({},".slds-context-bar__icon-action")," styles apply a default left and right padding of 0.75rem. That padding can be removed or modified by using our spacing utilities. In example #1, the left padding has been removed by using the class ",te({},".slds-p-left--none"),"."),oe({},"If a navigation bar item has an icon then we want to provide visual indication that its active when a user hovers into its region. To make this happen, apply the class ",te({},".slds-hint-parent")," to the hover region, most cases would be ",te({},".slds-context-bar__icon-action")," element."),le({id:"Menu-trigger-area"},"Menu trigger area"),oe({},"When a navigation bar items requires a menu with additional sub options or actions, the classes that need to be added to the target hit area are the following:"),(0,n.createElement)(r.A,null,(0,n.createElement)(N,{label:"Menu Item",hasNavMenu:!0})),re({},se({},te({},".slds-context-bar__dropdown-trigger")," — Add a hoverable zone below the action so that the dropdown doesn’t disappear when the mouse is between the action and the dropdown — this is specific to the navigation bar"),se({},te({},".slds-dropdown-trigger")," — Globally used utility that notifies the element there is a dropdown menu"),se({},te({},".slds-dropdown-trigger_click")," — Specifies that an item requires a click to open interaction.")),oe({},"If the navigation item has one hyperlink with a menu containing additional sub actions, then the hover area that invokes the dropdown menu is both the ",te({},".slds-context-bar__label-action")," and ",te({},".slds-context-bar__icon-action"),". If the navigation item is demonstrated as a tab format, one hyperlink plus two additional actions, then the hover area that invokes the dropdown menu is only on the ",te({},".slds-context-bar__icon-action"),"."),ne({id:"Specifics-of-the-Navigation-Bar"},"Specifics of the Navigation Bar"),le({id:"App-Launcher"},"App Launcher"),oe({},"The app launcher is the one element on the navigation bar that requires a mouse click or keyboard enter to invoke the app launcher dropdown. Please use JavaScript to accommodate this requirement."),le({id:"App-Name"},"App Name"),oe({},"The application name needs to receive the ",te({},".slds-context-bar__app-name")," class. This class will handle such things as its unique font sizing and truncation widths."),le({id:"Dividers"},"Dividers"),oe({},"Due to the platform-esc nature of the navigation bar, there is an available element utility to apply a divider between sections where needed. The ",te({},".slds-context-bar__vertical-divider")," class should be applied to an empty ",te({},"<div>")," and placed within the markup of your navigation bar for a visual divider."),oe({},"Alternatively, two classes are available to add border using css. Adding the class ",te({},".slds-context-bar__item--divider-left")," will add a left border to a navigation bar item while ",te({},".slds-context-bar__item--divider-right")," will add a right border."),ne({id:"States"},"States"),le({id:"Active-item"},"Active item"),(0,n.createElement)(s.A,null,(0,h.NO)(S,"item-active")),le({id:"Menu-Open"},"Menu Open"),(0,n.createElement)(s.A,{demoStyles:(0,h.GP)(S,"item-menu-open")},(0,h.NO)(S,"item-menu-open")),ae({id:"About-Navigation-Tab-Bar"},"About Navigation Tab Bar"),(0,n.createElement)(s.A,null,(0,h.NO)(Q)),ne({id:"Accessibility"},"Accessibility"),oe({},de({},"Communicating Status to Screen Readers:")),oe({},"When communicating tab status updates to the user, unread, warning, error and success notifications should all employ the same technique to communicate that update to users of assistive technology, who would be otherwise unaware of that status change."),oe({},"You should use a single hidden ARIA live region for the entire subtabs block, the contents of which gets updated each time a subtab changes its status. The contents should contain a description of the status level and the name of the tab the status change event occurred in. The markup would look something like:"),oe({},te({},'<div className="slds-assistive-text" aria-live="polite">...</div>')),oe({},"Upon clearing the status on a given tab, you should clear the message from the live region."),oe({},de({},"Unread status:")),oe({},"In order to inform screen readers of new activity in a tab, 2 things should occur."),re({},se({},oe({},"The ",te({},"title")," attribute and ",te({},"aria-label")," on the element that displays the red dot should read ",de({},'"New Activity"'),'. This will update the text content of the tab to include the "New Activity" text: "New Activity Chat - Customer".')),se({},oe({},"The hidden live region as described above, should have its content updated to ",de({},'"New Activity in Tab: [Tab Name Here]"')," to alert the user of new activity in that particular subtab."))),oe({},te({},'<span aria-label="New Activity" className="slds-indicator_unread" title="New Activity"></span>')),oe({},te({},'<div className="slds-assistive-text" aria-live="polite">New activity in Tab: Chat - Customer</div>')),oe({},de({},"Warning, Error and Success Tabs:")),oe({},"When you wish to draw attention to a particular tab because something has occurred in that tab that corresponds to an alert level, you can use the ",te({},"slds-has-warning"),", ",te({},"slds-has-error")," or ",te({},"slds-has-success")," class to change the background color and introduce a short pulsing animation to draw attention from the user."),oe({},"The icon is updated to match the corresponding alert level, to give an extra way to communicate the level of the status without relying on the use of color alone."),oe({},"In this example we show that something inside the tab is about to break a service level agreement in 30 seconds, and we wish to draw the users attention to it to take action."),oe({},"Update the hidden live region with a message that informs the user of the status level, the message and the offending subtab ",de({},"[level]: [message] in tab: [tab_name]"),"."),oe({},te({},'<div className="slds-assistive-text" aria-live="polite">Warning: SLA agreement in 30 seconds in tab: Chat - Customer</div>')),ne({id:"States-2"},"States"),le({id:"Active"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-active")),ie({id:"Focus"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-active-focus")),le({id:"Unsaved"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unsaved-tab")),le({id:"Unread"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-tab")),le({id:"Overflow"},"Overflow"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-item-action-menu-open")),le({id:"UnreadUnsaved"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-unsaved-tab")),ne({id:"Tab-Feedback-States"},"Tab Feedback States"),le({id:"Success"},"Success"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success")),ie({id:"Active-2"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-active")),ie({id:"Focus-2"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-focus")),ie({id:"Unsaved-2"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-unsaved")),ie({id:"Unread-2"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-unread")),ie({id:"UnreadUnsaved-2"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-success-unread-unsaved")),le({id:"Warning"},"Warning"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning")),ie({id:"Active-3"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-active")),ie({id:"Focus-3"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-focus")),ie({id:"Unsaved-3"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-unsaved")),ie({id:"Unread-3"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-unread")),ie({id:"UnreadUnsaved-3"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-warning-unread-unsaved")),le({id:"Error"},"Error"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error")),ie({id:"Active-4"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-active")),ie({id:"Focus-4"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-focused")),ie({id:"Unsaved-4"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-unsaved")),ie({id:"Unread-4"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-unread")),ie({id:"UnreadUnsaved-4"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"tab-error-unread-unsaved")),ne({id:"Pinned"},"Pinned"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"pinned-tab")),le({id:"Pinned-States"},"Pinned States"),ie({id:"Active-5"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"pinned-tab-active")),ie({id:"Focus-5"},"Focus"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"pinned-tab-active-focus")),ie({id:"Unsaved-5"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unsaved-pinned-tab")),ie({id:"Unread-5"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-pinned-tab")),ne({id:"Overflowed-Tabs"},"Overflowed Tabs"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"overflow-tabs")),le({id:"Opened"},"Opened"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"overflow-tabs-open")),le({id:"Unsaved-6"},"Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unsaved-overflow-tabs")),ie({id:"Opened-2"},"Opened"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unsaved-overflow-tabs-open")),le({id:"Unread-6"},"Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-overflow-tabs")),ie({id:"Opened-3"},"Opened"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-overflow-tabs-open")),le({id:"UnreadUnsaved-5"},"Unread/Unsaved"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-unsaved-overflow-tabs-open")),ie({id:"No-Icon"},"No Icon"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"unread-unsaved-overflow-tabs-without-icon-open")),ne({id:"Feedback-states-for-overflow-menu"},"Feedback states for overflow menu"),le({id:"Success-2"},"Success"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"success-overflow")),ie({id:"UnsavedUnread"},"Unsaved/Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"success-overflow-unread-unsaved")),le({id:"Warning-2"},"Warning"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"warning-overflow")),ie({id:"UnsavedUnread-2"},"Unsaved/Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"warning-overflow-unread-unsaved")),le({id:"Error-2"},"Error"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"error-overflow")),ie({id:"UnsavedUnread-3"},"Unsaved/Unread"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"error-overflow-unread-unsaved")),ne({id:"Object-Switcher"},"Object Switcher"),le({id:"Active-6"},"Active"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"object-switcher-active")),le({id:"Menu-open"},"Menu open"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"object-switcher-menu-open")),ne({id:"Add-a-tab-dialog"},"Add a tab dialog"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"add-tab-dialog-open")),ne({id:"Active-tab-with-Subtabs"},"Active tab with Subtabs"),(0,n.createElement)(s.A,null,(0,h.NO)(Z,"sub-tabs-open")))},be=function(){return(0,i.Qr)(me())}}},l={};function i(e){var t=l[e];if(void 0!==t)return t.exports;var a=l[e]={id:e,exports:{}};return n[e](a,a.exports,i),a.exports}i.m=n,i.amdO={},e=[],i.O=function(t,a,n,l){if(!a){var s=1/0;for(c=0;c<e.length;c++){a=e[c][0],n=e[c][1],l=e[c][2];for(var r=!0,o=0;o<a.length;o++)(!1&l\|\|s>=l)&&Object.keys(i.O).every(function(e){return i.O[e](a[o])})?a.splice(o--,1):(r=!1,l<s&&(s=l));if(r){e.splice(c--,1);var d=n();void 0!==d&&(t=d)}}return t}l=l\|\|0;for(var c=e.length;c>0&&e[c-1][2]>l;c--)e[c]=e[c-1];e[c]=[a,n,l]},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,{a:t}),t},a=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},i.t=function(e,n){if(1&n&&(e=this(e)),8&n)return e;if("object"==typeof e&&e){if(4&n&&e.__esModule)return e;if(16&n&&"function"==typeof e.then)return e}var l=Object.create(null);i.r(l);var s={};t=t\|\|[null,a({}),a([]),a(a)];for(var r=2&n&&e;("object"==typeof r\|\|"function"==typeof r)&&!~t.indexOf(r);r=a(r))Object.getOwnPropertyNames(r).forEach(function(t){s[t]=function(){return e[t]}});return s.default=function(){return e},i.d(l,s),l},i.d=function(e,t){for(var a in t)i.o(t,a)&&!i.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},i.e=function(){return Promise.resolve()},i.g=function(){if("object"==typeof globalThis)return globalThis;try{return this\|\|new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.j=9441,function(){var e={9441:0};i.O.j=function(t){return 0===e[t]};var t=function(t,a){var n,l,s=a[0],r=a[1],o=a[2],d=0;if(s.some(function(t){return 0!==e[t]})){for(n in r)i.o(r,n)&&(i.m[n]=r[n]);if(o)var c=o(i)}for(t&&t(a);d<s.length;d++)l=s[d],i.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return i.O(c)},a=self.webpackJsonpSLDS___internal_chunked_docs=self.webpackJsonpSLDS___internal_chunked_docs\|\|[];a.forEach(t.bind(null,0)),a.push=t.bind(null,a.push.bind(a))}(),i.nc=void 0;var s=i.O(void 0,[3540],function(){return i(5629)});s=i.O(s),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/docs/./ui/components/global-navigation/docs.mdx.js"]=s}();

package/__internal/chunked/docs/ui/components/input/docs.mdx.js CHANGED Viewed

	@@ -1 +1 @@
1	- var SLDS;!function(){"use strict";var e,t,n,l={1594:function(e){e.exports=React},1981:function(e){e.exports=JSBeautify},5206:function(e){e.exports=ReactDOM},6793:function(e,t,n){n.r(t),n.d(t,{getContents:function(){return $},getElement:function(){return Y}});var l=n(1594),i=n.n(l),r=n(5671),a=n(6547),o=(n(3212),n(5619)),s=n(9741),d=n(7412),c=n.n(d),u=n(5526),p=n(8347),m=n(6955),h=n(8542),f=n(2711),b=n(6333),E=n.n(b),y="Input Label",v="Placeholder text…",x=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,isRequired:!0},i().createElement(u.A,{id:e,placeholder:v,required:!0}))},g=function(){var e=E()("text-input-id-"),t=E()("error-message-id-");return i().createElement(f.ZS,{hasError:!0,labelContent:y,inputId:e,errorId:t,isRequired:!0,inlineMessage:"Enter a value."},i().createElement(u.A,{id:e,placeholder:v,required:!0,"aria-describedby":t}))},_=function(){var e=E()("text-input-id-"),t=E()("error-message-id-");return i().createElement(f.ZS,{hasError:!0,labelContent:y,inputId:e,hasLeftIcon:!0,errorId:t,isRequired:!0,inlineMessage:"Enter a value."},i().createElement(p.A,{className:"slds-input__icon",sprite:"utility",symbol:"error"}),i().createElement(u.A,{id:e,required:!0,placeholder:v,"aria-describedby":t}))},I=function(){var e=E()("text-input-id-"),t=E()("error-message-id-");return i().createElement(f.ZS,{isHorizontal:!0,hasError:!0,labelContent:y,inputId:e,hasLeftIcon:!0,errorId:t,isRequired:!0,inlineMessage:"Enter a value.",column:1},i().createElement(p.A,{className:"slds-input__icon",sprite:"utility",symbol:"error"}),i().createElement(u.A,{id:e,required:!0,placeholder:v,"aria-describedby":t}))},A=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e},i().createElement(u.A,{id:e,placeholder:v,disabled:!0}))},w=function(e){var t=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:t},i().createElement(u.A,{id:t,readOnly:!0,hasBorders:e.hasBorders,defaultValue:"Read Only",placeholder:""}))},S=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasLeftIcon:!0},i().createElement(p.A,{className:"slds-icon slds-input__icon slds-input__icon_left slds-icon-text-default",sprite:"utility",symbol:"search"}),i().createElement(u.A,{id:e,placeholder:v}))},O=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasRightIcon:!0},i().createElement(p.A,{className:"slds-icon slds-input__icon slds-input__icon_right slds-icon-text-default",sprite:"utility",symbol:"search"}),i().createElement(u.A,{id:e,placeholder:v}))},N=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasLeftIcon:!0,hasRightIcon:!0},i().createElement(p.A,{className:"slds-icon slds-input__icon slds-input__icon_left slds-icon-text-default",sprite:"utility",symbol:"search"}),i().createElement(u.A,{id:e,placeholder:v}),i().createElement(m.A,{symbol:"clear",className:"slds-input__icon slds-input__icon_right",iconClassName:"slds-icon-text-light",assistiveText:"Clear",title:"Clear"}))},C=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasLeftIcon:!0,hasRightIcon:!0,hasRightIconGroup:!0},i().createElement(p.A,{className:"slds-icon slds-input__icon slds-input__icon_left slds-icon-text-default",sprite:"utility",symbol:"search"}),i().createElement(u.A,{id:e,placeholder:v}),i().createElement("div",{className:"slds-input__icon-group slds-input__icon-group_right"},i().createElement(h.y$,{className:"slds-spinner_brand slds-spinner_x-small slds-input__spinner"}),i().createElement(m.A,{symbol:"clear",className:"slds-input__icon slds-input__icon_right",iconClassName:"slds-icon-text-light",assistiveText:"Clear",title:"Clear"})))},T=function(e){var t=E()("".concat(e.type,"-input-id-"));return i().createElement(f.ZS,{labelContent:e.label,inputId:t},i().createElement(u.A,{id:t,type:e.type,placeholder:e.placeholder,value:e.value}))};T.propTypes={type:c().string,label:c().string,placeholder:c().string},T.defaultProps={label:"Input Label"};var L=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,formControlClassName:"slds-input-has-fixed-addon",labelId:"fixed-text-label"},i().createElement("span",{className:"slds-form-element__addon",id:"fixed-text-addon-pre"},"$"),i().createElement(u.A,{id:e,placeholder:v,"aria-labelledby":"fixed-text-label fixed-text-addon-pre fixed-text-addon-post"}),i().createElement("span",{className:"slds-form-element__addon",id:"fixed-text-addon-post"},"euro"))},R=function(){var e=E()("text-input-id-"),t=E()("error-message-id-");return i().createElement(f.ZS,{labelId:"inline-text-label",labelContent:y,inputId:e,errorId:t,inlineMessage:"ex: (415)111-2222"},i().createElement(u.A,{id:e,placeholder:v,"aria-describedby":t}))},B=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasTooltip:!0,showTooltip:!0},i().createElement(u.A,{id:e,placeholder:v}))},k=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e},i().createElement(u.A,{id:e,isBare:!0,placeholder:v}))},j=[{id:"default",label:"Default",element:i().createElement(f.ZS,{labelContent:y,inputId:"text-input-id-0"},i().createElement(u.A,{id:"text-input-id-0",placeholder:v}))}],D=[{id:"input-required",label:"Required",element:i().createElement(x,null)},{id:"input-disabled",label:"Disabled",element:i().createElement(A,null)},{id:"input-error",label:"Error",element:i().createElement(g,null)},{id:"input-error-icon",label:"Error with icon",element:i().createElement(_,null)},{id:"input-error-icon-horizontal",label:"Error with icon in Horizontal Form",element:i().createElement(I,null)},{id:"read-only",label:"Readonly",element:i().createElement(w,null)},{id:"read-only-borders",label:"Readonly with borders",element:i().createElement(w,{hasBorders:!0})},{id:"static",label:"Static",element:i().createElement(f.GN,null,i().createElement("span",{className:"slds-form-element__label"},"Input Label"),i().createElement(f.qz,null,i().createElement("span",{className:"slds-form-element__static"},"Read Only")))}],Z=[{id:"left-icon",label:"Left Icon",element:i().createElement(S,null)},{id:"right-icon",label:"Right Icon",element:i().createElement(O,null)},{id:"double-icon",label:"Left Icon & Clear Button",element:i().createElement(N,null)},{id:"double-icon-spinner",label:"Clear Button with Spinner",element:i().createElement(C,null)},{id:"email-input",label:"Email Input",element:i().createElement(T,{type:"email",label:"Email",placeholder:"Email"})},{id:"date-input",label:"Date Input",element:i().createElement(T,{type:"date"})},{id:"date-input-default",label:"Date Input w/ Date Selected by Default",element:i().createElement(T,{type:"date",value:"2023-09-25"})},{id:"search-input",label:"Search Input",element:i().createElement(T,{type:"search"})},{id:"url-input",label:"URL Input",element:i().createElement(T,{type:"url"})},{id:"tel-input",label:"Telephone Input",element:i().createElement(T,{type:"tel"})},{id:"fixed-text",label:"Fixed text",element:i().createElement(L,null)},{id:"inline-help",label:"Inline Help",element:i().createElement(R,null)},{id:"field-level-help",label:"Field level help",demoStyles:"\n padding-top: 3rem;\n position: relative;\n ",storybookStyles:"\n padding-top: 4rem;\n position: relative;\n ",element:i().createElement(B,null)},{id:"bare",label:"Bare",element:i().createElement(k,null)}],q=n(806),M=n(9285),P=n(8342),H=r.XB.a,F=r.XB.code,X=r.XB.h2,z=r.XB.h3,W=r.XB.h4,G=r.XB.li,J=r.XB.ol,V=r.XB.p,Y=function(){return(0,l.createElement)(r.Ay,{},(0,l.createElement)("div",{className:"doc lead"},"Text inputs are used for freeform data entry"),(0,l.createElement)(a.A,{exampleOnly:!0},(0,q.NO)(j)),X({id:"About-Inputs"},"About Inputs"),V({},"You can style the HTML ",F({},"<input>")," element to align with the Salesforce brand by using the ",F({},".slds-input")," class on the ",F({},"<input>")," element."),V({},"The ",F({},"<input>")," element includes support for all HTML5 types: ",F({},"text"),",\n",F({},"password"),", ",F({},"datetime"),", ",F({},"datetime-local"),", ",F({},"date"),", ",F({},"month"),", ",F({},"time"),", ",F({},"week"),",\n",F({},"number"),", ",F({},"email"),", ",F({},"url"),", ",F({},"search"),", ",F({},"tel"),", and ",F({},"color"),"."),V({},"The static state is for form elements that can’t be modified by the user. It is used for small, non-editable form fields that sit next to inputs and allows the size and height to align. It is not meant for large paragraphs of text."),z({id:"Pointer-Events"},"Pointer Events"),V({},"In order to have an actionable SVG within the input, like a clear or increment/decrement button, the icon must be contained within a button, not an anchor ",F({},"<a>"),", in order for pointer events to work properly."),V({},"You can see examples of the correct markup in the ",H({href:"#Icon-and-clear-button"},"Left Icon & Clear Button example")," or the ",H({href:"/components/counter/"},"Counter component"),"."),z({id:"Accessibility"},"Accessibility"),V({},"All input fields marked as required with an * must have an accompanying legend."),V({},"Example:\n",(0,l.createElement)(s.A,null)),V({},"Inputs with errors should have ",F({},"aria-describedby")," to insure that the associated field level error message is read by assistive technology."),V({},"If the error message has an ",F({},'id="my-error-message"'),", then the input should have ",F({},'aria-describedby="my-error-message"')," and ",F({},'aria-invalid="true"'),"."),V({},"If you need some type of field level help and if your tooltips are available on hover, make sure they’re also available on keyboard focus. The help icon needs to be associated to the tooltip so that when the user focuses\non the icon, assistive technology reads out the content of the tooltip. If the tooltip has an ",F({},'id="help"'),", then the ",F({},"<button>")," containing the icon should have ",F({},'aria-describedby="help"'),"."),V({},"In some cases, the read-only field state is swapped and has no ",F({},"<input>"),". This is called ",F({},"static")," in the examples. In that case, don’t use a ",F({},"<label>"),". This provides better accessibility for screen readers and keyboard navigators. Instead, use a ",F({},"<span>")," with the ",F({},".slds-form-element__label")," class. Instead of an ",F({},"<input>"),", use the ",F({},".slds-form-element__static")," class inside the ",F({},".slds-form-element__control")," wrapper."),z({id:"Mobile"},"Mobile"),(0,l.createElement)(M.s9,{patternSpecificText:"inputs will have an increased size to accommodate tapping with a finger instead of the more precise mouse cursor"}),(0,l.createElement)(a.A,{frameOnly:!0,frameTitle:"Example mobile styles for inputs"},(0,q.NO)(j)),X({id:"States"},"States"),z({id:"Required"},"Required"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"input-required")),z({id:"Disabled"},"Disabled"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"input-disabled")),z({id:"Error"},"Error"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"input-error")),z({id:"Error-with-icon"},"Error with icon"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"input-error-icon")),z({id:"Read-Only"},"Read Only"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"read-only")),X({id:"Examples"},"Examples"),z({id:"With-Icons"},"With Icons"),W({id:"Icon-on-the-left"},"Icon on the left"),(0,l.createElement)(o.A,{type:"warning"},(0,l.createElement)("p",null,"A left aligned icon cannot be paired with fixed text.")),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"left-icon")),W({id:"Icon-on-the-right"},"Icon on the right"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"right-icon")),W({id:"Icon-and-clear-button"},"Icon and clear button"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"double-icon")),W({id:"Icon-and-clear-button-with-loading-spinner"},"Icon and clear button, with loading spinner"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"double-icon-spinner")),z({id:"Fixed-Text"},"Fixed Text"),(0,l.createElement)(o.A,{type:"warning"},(0,l.createElement)("p",null,"Fixed text cannot be paired with an icon that is aligned left.")),V({},"When using the fixed text variants for prepending or appending symbols to inputs, please be sure to use ",F({},"aria-labelledby")," on the input, that points to the ids of the label, prepended text and appended text as a space separated list."),V({},"The IDs must appear in that order:"),J({},G({},"label,"),G({},"prepended"),G({},"then appended.")),V({},"The reason we do this is to create a better association between the input and the supporting labels around it."),V({},"By only using the traditional ",F({},"label[for]")," method, the fixed text is never read out in the context of editing the input value. With using the ",F({},"aria-labelledby")," attribute we can create a better label with all the visual labels associated with it, in a relevant order, that is read by assistive technology when the user needs it; when they're editing the value."),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"fixed-text")),z({id:"Inline-Help"},"Inline Help"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"inline-help")),z({id:"Field-Level-Help"},"Field Level Help"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"field-level-help")),X({id:"Styling-Hooks-Overview"},"Styling Hooks Overview"),(0,l.createElement)(P.A,{name:"input",type:"component"}))},$=function(){return(0,r.Qr)(Y())}}},i={};function r(e){var t=i[e];if(void 0!==t)return t.exports;var n=i[e]={id:e,exports:{}};return l[e](n,n.exports,r),n.exports}r.m=l,r.amdO={},e=[],r.O=function(t,n,l,i){if(!n){var a=1/0;for(c=0;c<e.length;c++){n=e[c][0],l=e[c][1],i=e[c][2];for(var o=!0,s=0;s<n.length;s++)(!1&i\|\|a>=i)&&Object.keys(r.O).every(function(e){return r.O[e](n[s])})?n.splice(s--,1):(o=!1,i<a&&(a=i));if(o){e.splice(c--,1);var d=l();void 0!==d&&(t=d)}}return t}i=i\|\|0;for(var c=e.length;c>0&&e[c-1][2]>i;c--)e[c]=e[c-1];e[c]=[n,l,i]},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,{a:t}),t},n=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},r.t=function(e,l){if(1&l&&(e=this(e)),8&l)return e;if("object"==typeof e&&e){if(4&l&&e.__esModule)return e;if(16&l&&"function"==typeof e.then)return e}var i=Object.create(null);r.r(i);var a={};t=t\|\|[null,n({}),n([]),n(n)];for(var o=2&l&&e;("object"==typeof o\|\|"function"==typeof o)&&!~t.indexOf(o);o=n(o))Object.getOwnPropertyNames(o).forEach(function(t){a[t]=function(){return e[t]}});return a.default=function(){return e},r.d(i,a),i},r.d=function(e,t){for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.e=function(){return Promise.resolve()},r.g=function(){if("object"==typeof globalThis)return globalThis;try{return this\|\|new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.j=4773,function(){var e={4773:0};r.O.j=function(t){return 0===e[t]};var t=function(t,n){var l,i,a=n[0],o=n[1],s=n[2],d=0;if(a.some(function(t){return 0!==e[t]})){for(l in o)r.o(o,l)&&(r.m[l]=o[l]);if(s)var c=s(r)}for(t&&t(n);d<a.length;d++)i=a[d],r.o(e,i)&&e[i]&&e[i][0](),e[i]=0;return r.O(c)},n=self.webpackJsonpSLDS___internal_chunked_docs=self.webpackJsonpSLDS___internal_chunked_docs\|\|[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))}(),r.nc=void 0;var a=r.O(void 0,[3540],function(){return r(6793)});a=r.O(a),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/docs/./ui/components/input/docs.mdx.js"]=a}();
1	+ var SLDS;!function(){"use strict";var e,t,n,l={1594:function(e){e.exports=React},1981:function(e){e.exports=JSBeautify},5206:function(e){e.exports=ReactDOM},6793:function(e,t,n){n.r(t),n.d(t,{getContents:function(){return $},getElement:function(){return Y}});var l=n(1594),i=n.n(l),r=n(5671),a=n(6547),o=(n(3212),n(5619)),s=n(9741),d=n(4187),c=n.n(d),u=n(5526),p=n(8347),m=n(6955),h=n(8542),f=n(2711),b=n(6333),E=n.n(b),y="Input Label",v="Placeholder text…",x=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,isRequired:!0},i().createElement(u.A,{id:e,placeholder:v,required:!0}))},g=function(){var e=E()("text-input-id-"),t=E()("error-message-id-");return i().createElement(f.ZS,{hasError:!0,labelContent:y,inputId:e,errorId:t,isRequired:!0,inlineMessage:"Enter a value."},i().createElement(u.A,{id:e,placeholder:v,required:!0,"aria-describedby":t}))},_=function(){var e=E()("text-input-id-"),t=E()("error-message-id-");return i().createElement(f.ZS,{hasError:!0,labelContent:y,inputId:e,hasLeftIcon:!0,errorId:t,isRequired:!0,inlineMessage:"Enter a value."},i().createElement(p.A,{className:"slds-input__icon",sprite:"utility",symbol:"error"}),i().createElement(u.A,{id:e,required:!0,placeholder:v,"aria-describedby":t}))},I=function(){var e=E()("text-input-id-"),t=E()("error-message-id-");return i().createElement(f.ZS,{isHorizontal:!0,hasError:!0,labelContent:y,inputId:e,hasLeftIcon:!0,errorId:t,isRequired:!0,inlineMessage:"Enter a value.",column:1},i().createElement(p.A,{className:"slds-input__icon",sprite:"utility",symbol:"error"}),i().createElement(u.A,{id:e,required:!0,placeholder:v,"aria-describedby":t}))},A=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e},i().createElement(u.A,{id:e,placeholder:v,disabled:!0}))},w=function(e){var t=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:t},i().createElement(u.A,{id:t,readOnly:!0,hasBorders:e.hasBorders,defaultValue:"Read Only",placeholder:""}))},S=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasLeftIcon:!0},i().createElement(p.A,{className:"slds-icon slds-input__icon slds-input__icon_left slds-icon-text-default",sprite:"utility",symbol:"search"}),i().createElement(u.A,{id:e,placeholder:v}))},O=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasRightIcon:!0},i().createElement(p.A,{className:"slds-icon slds-input__icon slds-input__icon_right slds-icon-text-default",sprite:"utility",symbol:"search"}),i().createElement(u.A,{id:e,placeholder:v}))},N=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasLeftIcon:!0,hasRightIcon:!0},i().createElement(p.A,{className:"slds-icon slds-input__icon slds-input__icon_left slds-icon-text-default",sprite:"utility",symbol:"search"}),i().createElement(u.A,{id:e,placeholder:v}),i().createElement(m.A,{symbol:"clear",className:"slds-input__icon slds-input__icon_right",iconClassName:"slds-icon-text-light",assistiveText:"Clear",title:"Clear"}))},C=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasLeftIcon:!0,hasRightIcon:!0,hasRightIconGroup:!0},i().createElement(p.A,{className:"slds-icon slds-input__icon slds-input__icon_left slds-icon-text-default",sprite:"utility",symbol:"search"}),i().createElement(u.A,{id:e,placeholder:v}),i().createElement("div",{className:"slds-input__icon-group slds-input__icon-group_right"},i().createElement(h.y$,{className:"slds-spinner_brand slds-spinner_x-small slds-input__spinner"}),i().createElement(m.A,{symbol:"clear",className:"slds-input__icon slds-input__icon_right",iconClassName:"slds-icon-text-light",assistiveText:"Clear",title:"Clear"})))},T=function(e){var t=E()("".concat(e.type,"-input-id-"));return i().createElement(f.ZS,{labelContent:e.label,inputId:t},i().createElement(u.A,{id:t,type:e.type,placeholder:e.placeholder,value:e.value}))};T.propTypes={type:c().string,label:c().string,placeholder:c().string},T.defaultProps={label:"Input Label"};var L=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,formControlClassName:"slds-input-has-fixed-addon",labelId:"fixed-text-label"},i().createElement("span",{className:"slds-form-element__addon",id:"fixed-text-addon-pre"},"$"),i().createElement(u.A,{id:e,placeholder:v,"aria-labelledby":"fixed-text-label fixed-text-addon-pre fixed-text-addon-post"}),i().createElement("span",{className:"slds-form-element__addon",id:"fixed-text-addon-post"},"euro"))},R=function(){var e=E()("text-input-id-"),t=E()("error-message-id-");return i().createElement(f.ZS,{labelId:"inline-text-label",labelContent:y,inputId:e,errorId:t,inlineMessage:"ex: (415)111-2222"},i().createElement(u.A,{id:e,placeholder:v,"aria-describedby":t}))},B=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e,hasTooltip:!0,showTooltip:!0},i().createElement(u.A,{id:e,placeholder:v}))},k=function(){var e=E()("text-input-id-");return i().createElement(f.ZS,{labelContent:y,inputId:e},i().createElement(u.A,{id:e,isBare:!0,placeholder:v}))},j=[{id:"default",label:"Default",element:i().createElement(f.ZS,{labelContent:y,inputId:"text-input-id-0"},i().createElement(u.A,{id:"text-input-id-0",placeholder:v}))}],D=[{id:"input-required",label:"Required",element:i().createElement(x,null)},{id:"input-disabled",label:"Disabled",element:i().createElement(A,null)},{id:"input-error",label:"Error",element:i().createElement(g,null)},{id:"input-error-icon",label:"Error with icon",element:i().createElement(_,null)},{id:"input-error-icon-horizontal",label:"Error with icon in Horizontal Form",element:i().createElement(I,null)},{id:"read-only",label:"Readonly",element:i().createElement(w,null)},{id:"read-only-borders",label:"Readonly with borders",element:i().createElement(w,{hasBorders:!0})},{id:"static",label:"Static",element:i().createElement(f.GN,null,i().createElement("span",{className:"slds-form-element__label"},"Input Label"),i().createElement(f.qz,null,i().createElement("span",{className:"slds-form-element__static"},"Read Only")))}],Z=[{id:"left-icon",label:"Left Icon",element:i().createElement(S,null)},{id:"right-icon",label:"Right Icon",element:i().createElement(O,null)},{id:"double-icon",label:"Left Icon & Clear Button",element:i().createElement(N,null)},{id:"double-icon-spinner",label:"Clear Button with Spinner",element:i().createElement(C,null)},{id:"email-input",label:"Email Input",element:i().createElement(T,{type:"email",label:"Email",placeholder:"Email"})},{id:"date-input",label:"Date Input",element:i().createElement(T,{type:"date"})},{id:"date-input-default",label:"Date Input w/ Date Selected by Default",element:i().createElement(T,{type:"date",value:"2023-09-25"})},{id:"search-input",label:"Search Input",element:i().createElement(T,{type:"search"})},{id:"url-input",label:"URL Input",element:i().createElement(T,{type:"url"})},{id:"tel-input",label:"Telephone Input",element:i().createElement(T,{type:"tel"})},{id:"fixed-text",label:"Fixed text",element:i().createElement(L,null)},{id:"inline-help",label:"Inline Help",element:i().createElement(R,null)},{id:"field-level-help",label:"Field level help",demoStyles:"\n padding-top: 3rem;\n position: relative;\n ",storybookStyles:"\n padding-top: 4rem;\n position: relative;\n ",element:i().createElement(B,null)},{id:"bare",label:"Bare",element:i().createElement(k,null)}],q=n(806),M=n(9285),P=n(8342),H=r.XB.a,F=r.XB.code,X=r.XB.h2,z=r.XB.h3,W=r.XB.h4,G=r.XB.li,J=r.XB.ol,V=r.XB.p,Y=function(){return(0,l.createElement)(r.Ay,{},(0,l.createElement)("div",{className:"doc lead"},"Text inputs are used for freeform data entry"),(0,l.createElement)(a.A,{exampleOnly:!0},(0,q.NO)(j)),X({id:"About-Inputs"},"About Inputs"),V({},"You can style the HTML ",F({},"<input>")," element to align with the Salesforce brand by using the ",F({},".slds-input")," class on the ",F({},"<input>")," element."),V({},"The ",F({},"<input>")," element includes support for all HTML5 types: ",F({},"text"),",\n",F({},"password"),", ",F({},"datetime"),", ",F({},"datetime-local"),", ",F({},"date"),", ",F({},"month"),", ",F({},"time"),", ",F({},"week"),",\n",F({},"number"),", ",F({},"email"),", ",F({},"url"),", ",F({},"search"),", ",F({},"tel"),", and ",F({},"color"),"."),V({},"The static state is for form elements that can’t be modified by the user. It is used for small, non-editable form fields that sit next to inputs and allows the size and height to align. It is not meant for large paragraphs of text."),z({id:"Pointer-Events"},"Pointer Events"),V({},"In order to have an actionable SVG within the input, like a clear or increment/decrement button, the icon must be contained within a button, not an anchor ",F({},"<a>"),", in order for pointer events to work properly."),V({},"You can see examples of the correct markup in the ",H({href:"#Icon-and-clear-button"},"Left Icon & Clear Button example")," or the ",H({href:"/components/counter/"},"Counter component"),"."),z({id:"Accessibility"},"Accessibility"),V({},"All input fields marked as required with an * must have an accompanying legend."),V({},"Example:\n",(0,l.createElement)(s.A,null)),V({},"Inputs with errors should have ",F({},"aria-describedby")," to insure that the associated field level error message is read by assistive technology."),V({},"If the error message has an ",F({},'id="my-error-message"'),", then the input should have ",F({},'aria-describedby="my-error-message"')," and ",F({},'aria-invalid="true"'),"."),V({},"If you need some type of field level help and if your tooltips are available on hover, make sure they’re also available on keyboard focus. The help icon needs to be associated to the tooltip so that when the user focuses\non the icon, assistive technology reads out the content of the tooltip. If the tooltip has an ",F({},'id="help"'),", then the ",F({},"<button>")," containing the icon should have ",F({},'aria-describedby="help"'),"."),V({},"In some cases, the read-only field state is swapped and has no ",F({},"<input>"),". This is called ",F({},"static")," in the examples. In that case, don’t use a ",F({},"<label>"),". This provides better accessibility for screen readers and keyboard navigators. Instead, use a ",F({},"<span>")," with the ",F({},".slds-form-element__label")," class. Instead of an ",F({},"<input>"),", use the ",F({},".slds-form-element__static")," class inside the ",F({},".slds-form-element__control")," wrapper."),z({id:"Mobile"},"Mobile"),(0,l.createElement)(M.s9,{patternSpecificText:"inputs will have an increased size to accommodate tapping with a finger instead of the more precise mouse cursor"}),(0,l.createElement)(a.A,{frameOnly:!0,frameTitle:"Example mobile styles for inputs"},(0,q.NO)(j)),X({id:"States"},"States"),z({id:"Required"},"Required"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"input-required")),z({id:"Disabled"},"Disabled"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"input-disabled")),z({id:"Error"},"Error"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"input-error")),z({id:"Error-with-icon"},"Error with icon"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"input-error-icon")),z({id:"Read-Only"},"Read Only"),(0,l.createElement)(a.A,null,(0,q.NO)(D,"read-only")),X({id:"Examples"},"Examples"),z({id:"With-Icons"},"With Icons"),W({id:"Icon-on-the-left"},"Icon on the left"),(0,l.createElement)(o.A,{type:"warning"},(0,l.createElement)("p",null,"A left aligned icon cannot be paired with fixed text.")),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"left-icon")),W({id:"Icon-on-the-right"},"Icon on the right"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"right-icon")),W({id:"Icon-and-clear-button"},"Icon and clear button"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"double-icon")),W({id:"Icon-and-clear-button-with-loading-spinner"},"Icon and clear button, with loading spinner"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"double-icon-spinner")),z({id:"Fixed-Text"},"Fixed Text"),(0,l.createElement)(o.A,{type:"warning"},(0,l.createElement)("p",null,"Fixed text cannot be paired with an icon that is aligned left.")),V({},"When using the fixed text variants for prepending or appending symbols to inputs, please be sure to use ",F({},"aria-labelledby")," on the input, that points to the ids of the label, prepended text and appended text as a space separated list."),V({},"The IDs must appear in that order:"),J({},G({},"label,"),G({},"prepended"),G({},"then appended.")),V({},"The reason we do this is to create a better association between the input and the supporting labels around it."),V({},"By only using the traditional ",F({},"label[for]")," method, the fixed text is never read out in the context of editing the input value. With using the ",F({},"aria-labelledby")," attribute we can create a better label with all the visual labels associated with it, in a relevant order, that is read by assistive technology when the user needs it; when they're editing the value."),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"fixed-text")),z({id:"Inline-Help"},"Inline Help"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"inline-help")),z({id:"Field-Level-Help"},"Field Level Help"),(0,l.createElement)(a.A,null,(0,q.NO)(Z,"field-level-help")),X({id:"Styling-Hooks-Overview"},"Styling Hooks Overview"),(0,l.createElement)(P.A,{name:"input",type:"component"}))},$=function(){return(0,r.Qr)(Y())}}},i={};function r(e){var t=i[e];if(void 0!==t)return t.exports;var n=i[e]={id:e,exports:{}};return l[e](n,n.exports,r),n.exports}r.m=l,r.amdO={},e=[],r.O=function(t,n,l,i){if(!n){var a=1/0;for(c=0;c<e.length;c++){n=e[c][0],l=e[c][1],i=e[c][2];for(var o=!0,s=0;s<n.length;s++)(!1&i\|\|a>=i)&&Object.keys(r.O).every(function(e){return r.O[e](n[s])})?n.splice(s--,1):(o=!1,i<a&&(a=i));if(o){e.splice(c--,1);var d=l();void 0!==d&&(t=d)}}return t}i=i\|\|0;for(var c=e.length;c>0&&e[c-1][2]>i;c--)e[c]=e[c-1];e[c]=[n,l,i]},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,{a:t}),t},n=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},r.t=function(e,l){if(1&l&&(e=this(e)),8&l)return e;if("object"==typeof e&&e){if(4&l&&e.__esModule)return e;if(16&l&&"function"==typeof e.then)return e}var i=Object.create(null);r.r(i);var a={};t=t\|\|[null,n({}),n([]),n(n)];for(var o=2&l&&e;("object"==typeof o\|\|"function"==typeof o)&&!~t.indexOf(o);o=n(o))Object.getOwnPropertyNames(o).forEach(function(t){a[t]=function(){return e[t]}});return a.default=function(){return e},r.d(i,a),i},r.d=function(e,t){for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.e=function(){return Promise.resolve()},r.g=function(){if("object"==typeof globalThis)return globalThis;try{return this\|\|new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.j=4773,function(){var e={4773:0};r.O.j=function(t){return 0===e[t]};var t=function(t,n){var l,i,a=n[0],o=n[1],s=n[2],d=0;if(a.some(function(t){return 0!==e[t]})){for(l in o)r.o(o,l)&&(r.m[l]=o[l]);if(s)var c=s(r)}for(t&&t(n);d<a.length;d++)i=a[d],r.o(e,i)&&e[i]&&e[i][0](),e[i]=0;return r.O(c)},n=self.webpackJsonpSLDS___internal_chunked_docs=self.webpackJsonpSLDS___internal_chunked_docs\|\|[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))}(),r.nc=void 0;var a=r.O(void 0,[3540],function(){return r(6793)});a=r.O(a),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/docs/./ui/components/input/docs.mdx.js"]=a}();