@salesforce-ux/design-system
Version:
Salesforce Lightning Design System
1 lines • 6.94 kB
JavaScript
var SLDS;!function(){"use strict";var e,t={1594:function(e){e.exports=React},2870:function(e,t,n){n.r(t),n.d(t,{Progress:function(){return o},Step:function(){return c},examples:function(){return d},states:function(){return m}});var r=n(1594),a=n.n(r),l=n(942),s=n.n(l),i=n(538),o=function(e){var t=e.hasSuccessBar,n=e.className,r=e.style,l=e.hasBorders,i=e.value,o=void 0===i?0:i;return a().createElement("div",{className:s()("slds-progress slds-progress_vertical",{"slds-progress_success":t},n),style:r},a().createElement("ol",{className:s()("slds-progress__list",{"slds-progress__list-bordered":l})},e.children),a().createElement("div",{"aria-valuemin":"0","aria-valuemax":"100","aria-valuenow":o,"aria-labelledby":e["aria-labelledby"],role:"progressbar"},a().createElement("span",{className:"slds-assistive-text",id:e["aria-labelledby"]},"Progress: ","".concat(o,"%"))))},c=function(e){var t=e.className,n=e.active,r=e.done,l=e.error,o=e.hasSuccessMarker;return a().createElement("li",{className:s()("slds-progress__item",t,n?"slds-is-active":null,r?"slds-is-completed":null,l?"slds-has-error":null)},r||l?a().createElement(i.UtilityIcon,{className:"slds-icon_xx-small",containerClassName:s()("slds-progress__marker","slds-progress__marker_icon",{"slds-progress__marker_icon-success":r&&o}),symbol:r?"success":"error","aria-describedby":e["aria-describedby"],assistiveText:r?"Complete":"Error",title:r?"Complete":"Error"}):a().createElement("div",{className:"slds-progress__marker","aria-describedby":e["aria-describedby"]},n&&a().createElement("span",{className:"slds-assistive-text"},"Active")),a().createElement("div",{className:"slds-progress__item_content slds-grid slds-grid_align-spread"},e.children))};t.default=[{id:"default",label:"Default",element:a().createElement("div",{className:"demo-only",style:{padding:"1rem",height:"350px"}},a().createElement(o,null,a().createElement(c,{active:!0},"Step 1"),a().createElement(c,null,"Step 2"),a().createElement(c,null,"Step 3"),a().createElement(c,null,"Step 4"),a().createElement(c,null,"Step 5")))}];var m=[{id:"next-step",label:"Next Step",element:a().createElement("div",{className:"demo-only",style:{padding:"1rem",height:"350px"}},a().createElement(o,{value:"25"},a().createElement(c,{done:!0},"Step 1"),a().createElement(c,{active:!0},"Step 2"),a().createElement(c,null,"Step 3"),a().createElement(c,null,"Step 4"),a().createElement(c,null,"Step 5")))},{id:"has-error",label:"Step - Error",element:a().createElement("div",{className:"demo-only",style:{padding:"1rem",height:"350px"}},a().createElement(o,{value:"25"},a().createElement(c,{done:!0},"Step 1"),a().createElement(c,{error:!0},"Step 2"),a().createElement(c,null,"Step 3"),a().createElement(c,null,"Step 4"),a().createElement(c,null,"Step 5")))}],d=[{id:"shade",label:"On a gray background",element:a().createElement("div",{className:"demo-only",style:{background:"#F3F2F2",padding:"1rem",height:"350px"}},a().createElement(o,{className:"slds-progress_shade",value:"50"},a().createElement(c,{done:!0},"Step 1"),a().createElement(c,{done:!0},"Step 2"),a().createElement(c,{active:!0},"Step 3"),a().createElement(c,null,"Step 4"),a().createElement(c,null,"Step 5")))},{id:"green-success",label:"With a green success check",element:a().createElement("div",{className:"demo-only",style:{padding:"1rem",height:"350px"}},a().createElement(o,{value:"25"},a().createElement(c,{done:!0,hasSuccessMarker:!0},"Step 1"),a().createElement(c,{active:!0},"Step 2"),a().createElement(c,null,"Step 3"),a().createElement(c,null,"Step 4"),a().createElement(c,null,"Step 5")))},{id:"varying-stage-size",label:"With varying stage sizes",element:a().createElement("div",{className:"demo-only",style:{padding:"1rem",height:"350px"}},a().createElement(o,{value:"75"},a().createElement(c,{done:!0},"Step 1"),a().createElement(c,{done:!0},"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."),a().createElement(c,{done:!0},"Step 3"),a().createElement(c,{active:!0},"Step 4"),a().createElement(c,null,"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.")))},{id:"varying-stage-size-with-completed",label:"With varying stage sizes and multiple completed steps",element:a().createElement(o,{value:"100"},a().createElement(c,{done:!0},"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."),a().createElement(c,{done:!0},"Step 2"),a().createElement(c,{done:!0},"Step 3"),a().createElement(c,{done:!0},"Step 4"),a().createElement(c,{done:!0},"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat ut aliquip ex ea commodo consequat."))}]}},n={};function r(e){var a=n[e];if(void 0!==a)return a.exports;var l=n[e]={exports:{}};return t[e](l,l.exports,r),l.exports}r.m=t,r.amdO={},e=[],r.O=function(t,n,a,l){if(!n){var s=1/0;for(m=0;m<e.length;m++){n=e[m][0],a=e[m][1],l=e[m][2];for(var i=!0,o=0;o<n.length;o++)(!1&l||s>=l)&&Object.keys(r.O).every(function(e){return r.O[e](n[o])})?n.splice(o--,1):(i=!1,l<s&&(s=l));if(i){e.splice(m--,1);var c=a();void 0!==c&&(t=c)}}return t}l=l||0;for(var m=e.length;m>0&&e[m-1][2]>l;m--)e[m]=e[m-1];e[m]=[n,a,l]},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,{a:t}),t},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.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=9002,function(){var e={518:0,1117:0,1252:0,1578:0,1974:0,2033:0,2274:0,2782:0,3140:0,4268:0,4583:0,4723:0,4924:0,6671:0,7217:0,7257:0,7385:0,7508:0,8167:0,8458:0,9002:0};r.O.j=function(t){return 0===e[t]};var t=function(t,n){var a,l,s=n[0],i=n[1],o=n[2],c=0;if(s.some(function(t){return 0!==e[t]})){for(a in i)r.o(i,a)&&(r.m[a]=i[a]);if(o)var m=o(r)}for(t&&t(n);c<s.length;c++)l=s[c],r.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return r.O(m)},n=self.webpackJsonpSLDS___internal_chunked_showcase=self.webpackJsonpSLDS___internal_chunked_showcase||[];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,[6790],function(){return r(2870)});a=r.O(a),(SLDS=void 0===SLDS?{}:SLDS)["__internal/chunked/showcase/./ui/components/progress-indicator/vertical/example.jsx.js"]=a}();