@useloops/design-system
Version:
The official React based Loops design system
2 lines (1 loc) • 1.25 kB
JavaScript
;const e=(e,t,r=500)=>{switch(t){case"draft":return e.custom.palette.blue[r];case"in-progress":return e.custom.palette.yellow[r];case"results-ready":return e.custom.palette.green[r];default:return"red"}};exports.getColorByStatus=e,exports.getStatusIconName=e=>{switch(e){case"draft":default:return"test-edit";case"in-progress":return"test-pending";case"results-ready":return"data-bar"}},exports.getStatusStyling=(t,r)=>({..."draft"===r&&{background:t.custom.palette.surface.raised,border:`1px solid ${t.custom.palette.stroke.default}`,"& svg":{color:e(t,r)}},..."in-progress"===r&&{background:t.custom.palette.yellow[0],border:`1px solid ${t.custom.palette.yellow[100]}`,"& svg":{color:e(t,r)}},..."results-ready"===r&&{background:t.custom.palette.green[0],border:`1px solid ${t.custom.palette.green[100]}`,"& svg":{color:e(t,r)}}}),exports.getStatusText=e=>{switch(e){case"draft":return"Draft";case"in-progress":return"In progress";case"results-ready":return"Results ready";default:return"Unknown status"}},exports.getTextColorByStatus=(e,t,r)=>{switch(t){case"draft":return e.custom.palette.text.primary;case"in-progress":return e.custom.palette.yellow[r];case"results-ready":return e.custom.palette.green[r];default:return"red"}};