carbon-react/lib/components/step-flow/step-flow.component.js

A library of reusable React components for easily building user interfaces.

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../icon/icon.component.js"),n=require("../icon-button/icon-button.component.js"),a=require("./step-flow.style.js"),o=require("../../__internal__/utils/helpers/tags/tags.js"),l=require("../../__internal__/utils/logger/index.js"),i=require("../typography/typography.component.js"),s=require("../../hooks/__internal__/useLocale/useLocale.js"),c=require("./__internal__/step-flow.context.js"),p=require("./step-flow-title/step-flow-title.component.js");function d(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const u=t.forwardRef(((u,b)=>{var f,y,{category:g,title:h,titleVariant:j="h1",totalSteps:S,currentStep:m,showProgressIndicator:v=!1,showCloseIcon:w=!1,onDismiss:O,"aria-label":x,"aria-labelledby":P,"aria-describedby":_}=u,I=function(e,t){if(null==e)return{};var r,n,a=function(e,t){if(null==e)return{};var r,n,a={},o=Object.keys(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||(a[r]=e[r]);return a}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)r=o[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(a[r]=e[r])}return a}(u,["category","title","titleVariant","totalSteps","currentStep","showProgressIndicator","showCloseIcon","onDismiss","aria-label","aria-labelledby","aria-describedby"]);const q=Array.from({length:S},((e,t)=>t+1)),k=m>S?S:m;let C=!1,F=!1;!C&&m>S&&(C=!0,l.default.warn("[WARNING] The `currentStep` prop should not be higher than the `totalSteps`prop in `StepFlow`. Please ensure `currentStep`s value does not exceed that of `totalSteps`, in the meantime we have set `currentStep` value to that of `totalSteps`, and all indicators have been marked as completed.")),F||b||(F=!0,l.default.warn("[WARNING] A `ref` should be provided to ensure focus is programmatically focused back to a title div, this ensures screen reader users are informed regarding any changes and can navigate back down the page."));const z=q.map((t=>e.jsx(a.StyledProgressIndicator,{"aria-hidden":"true","data-role":"progress-indicator","data-element":"progress-indicator",isCompleted:t<k,isInProgress:t===k,"data-state":t===k?"in-progress":t<k?"is-completed":"not-completed",children:" "},t))),A=s.default(),D=e.jsx(n.default,{"data-element":"close","aria-label":null===(f=(y=A.stepFlow).closeIconAriaLabel)||void 0===f?void 0:f.call(y),onClick:O,children:e.jsx(r.default,{type:"close"})}),L=t.useRef(null);t.useImperativeHandle(b,(()=>({focus(){var e;null===(e=L.current)||void 0===e||e.focus()}})),[]);const R=e.jsx(c.StepFlowProvider,{value:{validatedCurrentStep:k,totalSteps:S,titleVariant:j,category:g,titleRef:L},children:"string"==typeof h?e.jsx(p.StepFlowTitle,{titleString:h}):h}),T=e.jsx(i.Typography,{variant:"span",fontWeight:"400",fontSize:"var(--fontSizes200)",lineHeight:"var(--sizing300)","data-element":"step-label","aria-hidden":"true",children:A.stepFlow.stepLabel(k,S)});return e.jsxs(a.StyledStepFlow,(N=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){d(e,t,r[t])}))}return e}({role:"group","aria-label":x,"aria-describedby":_,"aria-labelledby":P},I,o.default("step-flow",I)),W=null!=(W={children:[e.jsxs(a.StyledStepContent,{children:[g?e.jsxs(a.StyledStepContentText,{children:[e.jsx(i.Typography,{fontWeight:"400",fontSize:"var(--fontSizes100)",lineHeight:"var(--sizing250)",variant:"span","data-element":"category-text","aria-hidden":"true",children:g}),R]}):R,w?D:null]}),v?e.jsxs(a.StyledStepLabelAndProgress,{children:[T,e.jsx(a.StyledProgressIndicatorBar,{"data-element":"progress-indicator-bar","data-role":"progress-indicator-bar",children:z})]}):T]})?W:{},Object.getOwnPropertyDescriptors?Object.defineProperties(N,Object.getOwnPropertyDescriptors(W)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(W)).forEach((function(e){Object.defineProperty(N,e,Object.getOwnPropertyDescriptor(W,e))})),N));var N,W}));exports.StepFlow=u,exports.default=u;