npm - @razorpay/blade - Versions diffs - 11.13.1 → 11.15.0 - Mend

@razorpay/blade 11.13.1 → 11.15.0

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 (107) hide show

package/build/lib/web/production/components/StepGroup/StepItem.web.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"StepItem.web.js","sources":["../../../../../../src/components/StepGroup/StepItem.web.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { StepLine } from './StepLine';\nimport type { StepLineProps } from './StepLine';\nimport { useStepGroup } from './StepGroupContext';\nimport type {\n InteractiveItemHeaderProps,\n StepGroupContextType,\n StepGroupProps,\n StepItemProps,\n} from './types';\nimport { componentIds } from './componentIds';\nimport { itemLineGap, stepItemHeaderTokens } from './tokens';\nimport { Box } from '~components/Box';\nimport { Text } from '~components/Typography';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport BaseBox from '~components/Box/BaseBox';\nimport { makeSize, makeSpace } from '~utils';\nimport { size as sizeTokens } from '~tokens/global';\nimport { getFocusRingStyles } from '~utils/getFocusRingStyles';\nimport getIn from '~utils/lodashButBetter/get';\nimport { throwBladeError } from '~utils/logger';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\ntype GetStepTypeFromIndexProps = {\n _index: StepItemProps['_index'];\n _nestingLevel: StepGroupProps['_nestingLevel'];\n itemsCount: StepGroupContextType['itemsInGroupCount'];\n};\n\nconst InteractiveItemHeaderBox = styled.button<InteractiveItemHeaderProps>((props) => {\n return {\n padding: `${makeSpace(getIn(props.theme, props.paddingY))} ${makeSpace(\n getIn(props.theme, props.paddingX),\n )}`,\n cursor: 'pointer',\n display: 'inline-block',\n textDecoration: 'none',\n border: 'none',\n textAlign: 'inherit',\n backgroundColor: props.isSelected\n ? props.theme.colors.interactive.background.primary.faded\n : props.theme.colors.transparent,\n borderRadius: props.theme.border.radius.medium,\n width: '100%',\n transition: `background-color ${props.theme.motion.duration.xquick} ${props.theme.motion.easing.standard.effective}`,\n ':hover': {\n backgroundColor: props.isSelected\n ? props.theme.colors.interactive.background.primary.fadedHighlighted\n : props.theme.colors.interactive.background.gray.fadedHighlighted,\n },\n ':focus-visible': {\n ...getFocusRingStyles({ theme: props.theme }),\n },\n };\n});\n\nconst getStepTypeFromIndex = ({\n _index,\n _nestingLevel,\n itemsCount,\n}: GetStepTypeFromIndexProps): StepLineProps['stepType'] => {\n if (_nestingLevel === 0) {\n return 'default';\n }\n\n if (itemsCount === 1) {\n return 'single-item';\n }\n\n if (_index === 0) {\n return 'start';\n }\n\n if (_index === itemsCount - 1) {\n return 'end';\n }\n\n return 'middle';\n};\n\nconst _StepItem = ({\n title,\n timestamp,\n description,\n stepProgress = 'none',\n marker,\n trailing,\n isSelected,\n href,\n target,\n onClick,\n children,\n _index = 0,\n _totalIndex = 0,\n _nestingLevel = 0,\n}: StepItemProps): React.ReactElement => {\n const {\n itemsInGroupCount: itemsCount,\n totalItemsInParentGroupCount,\n orientation,\n size,\n } = useStepGroup();\n const stepType = React.useMemo(\n () => getStepTypeFromIndex({ _index, _nestingLevel, itemsCount }),\n [_index, _nestingLevel, itemsCount],\n );\n\n const itemRef = React.useRef<HTMLDivElement>(null);\n\n const isFirstItem = _totalIndex === 0;\n const isLastItem = _totalIndex === totalItemsInParentGroupCount - 1;\n const isInteractive = Boolean(href) || Boolean(onClick);\n const isVertical = orientation === 'vertical';\n\n if (__DEV__) {\n if (trailing && orientation === 'horizontal') {\n throwBladeError({\n message: 'trailing is not allowed in horizontal StepGroup',\n moduleName: 'StepItem',\n });\n }\n\n if (_nestingLevel >= 1 && orientation === 'horizontal') {\n throwBladeError({\n message: 'Nested StepGroup components are not allowed in horizontal orientation',\n moduleName: 'StepItem',\n });\n }\n }\n\n const stepItemHeaderJSX = (\n <Box display=\"flex\" flexDirection=\"row\" justifyContent=\"space-between\" gap=\"spacing.4\">\n <Box>\n <Text\n size={stepItemHeaderTokens[size].title}\n color=\"surface.text.gray.subtle\"\n weight=\"semibold\"\n >\n {title}\n </Text>\n <Text\n size={stepItemHeaderTokens[size].timestamp}\n marginY=\"spacing.2\"\n color=\"surface.text.gray.muted\"\n variant=\"caption\"\n >\n {timestamp}\n </Text>\n <Text size={stepItemHeaderTokens[size].description} color=\"surface.text.gray.muted\">\n {description}\n </Text>\n </Box>\n <Box>{trailing}</Box>\n </Box>\n );\n\n const stepItemHeaderPaddings: Omit<InteractiveItemHeaderProps, 'isSelected'> = {\n paddingY: 'spacing.3',\n paddingX: 'spacing.4',\n } as const;\n\n return (\n <BaseBox\n display=\"flex\"\n flexDirection={isVertical ? 'row' : 'column'}\n gap={itemLineGap[size]}\n className={`step-item step-index-${_index} step-nesting-level-${_nestingLevel}`}\n textAlign={isVertical ? 'left' : 'center'}\n alignItems={isVertical ? undefined : 'center'}\n minWidth={isVertical ? undefined : `min(${makeSize(sizeTokens['120'])}, 100%)`}\n width={isVertical ? '100%' : undefined}\n flex={isVertical ? undefined : '1'}\n {...metaAttribute({ name: MetaConstants.StepItem })}\n ref={itemRef}\n >\n <StepLine\n shouldShowStartBranch={!isFirstItem}\n shouldShowEndBranch={!isLastItem}\n stepType={stepType}\n marker={marker}\n stepProgress={stepProgress}\n />\n <Box marginTop=\"spacing.3\" flex=\"1\" marginRight={isVertical ? undefined : undefined}>\n {isInteractive ? (\n <InteractiveItemHeaderBox\n {...stepItemHeaderPaddings}\n as={href ? 'a' : 'button'}\n href={href}\n target={target}\n isSelected={isSelected}\n onClick={onClick}\n >\n {stepItemHeaderJSX}\n </InteractiveItemHeaderBox>\n ) : (\n <Box {...stepItemHeaderPaddings}>{stepItemHeaderJSX}</Box>\n )}\n {children ? (\n <Box paddingX=\"spacing.4\" paddingY=\"spacing.3\">\n {children}\n </Box>\n ) : null}\n </Box>\n </BaseBox>\n );\n};\n\n/**\n * ## StepItem\n *\n * Component meant to be used inside the StepGroup parent component\n *\n * ### Usage\n *\n * ```jsx\n * <StepGroup orientation=\"vertical\" size=\"medium\">\n * <StepItem\n * title=\"Personal Details\"\n * timestamp=\"Thu 15th Oct'23 | 12:00pm\"\n * description=\"Fill your personal details here\"\n * marker={<StepItemIndicator color=\"negative\" />}\n * />\n * </StepGroup>\n * ```\n *\n * ---\n *\n * Checkout {@link https://blade.razorpay.com/?path=/docs/components-stepgroup--docs StepGroup Documentation}\n */\nconst StepItem = assignWithoutSideEffects(_StepItem, {\n componentId: componentIds.StepItem,\n displayName: componentIds.StepItem,\n});\n\nexport { StepLine, StepItem };\n"],"names":["InteractiveItemHeaderBox","styled","button","withConfig","displayName","componentId","props","padding","concat","makeSpace","getIn","theme","paddingY","paddingX","cursor","display","textDecoration","border","textAlign","backgroundColor","isSelected","colors","interactive","background","primary","faded","transparent","borderRadius","radius","medium","width","transition","motion","duration","xquick","easing","standard","effective","fadedHighlighted","gray","_objectSpread","getFocusRingStyles","getStepTypeFromIndex","_ref","_index","_nestingLevel","itemsCount","_StepItem","_ref2","title","timestamp","description","_ref2$stepProgress","stepProgress","marker","trailing","href","target","onClick","children","_ref2$_index","_ref2$_totalIndex","_totalIndex","_ref2$_nestingLevel","_useStepGroup","useStepGroup","itemsInGroupCount","totalItemsInParentGroupCount","orientation","size","stepType","React","useMemo","itemRef","useRef","isFirstItem","isLastItem","isInteractive","Boolean","isVertical","throwBladeError","message","moduleName","stepItemHeaderJSX","_jsxs","Box","flexDirection","justifyContent","gap","_jsx","Text","stepItemHeaderTokens","color","weight","marginY","variant","stepItemHeaderPaddings","BaseBox","itemLineGap","className","alignItems","undefined","minWidth","makeSize","sizeTokens","flex","metaAttribute","name","MetaConstants","StepItem","ref","StepLine","shouldShowStartBranch","shouldShowEndBranch","marginTop","marginRight","as","assignWithoutSideEffects","componentIds"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,IAAMA,wBAAwB,gBAAGC,MAAM,CAACC,MAAM,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,uCAAA;EAAAC,WAAA,EAAA,UAAA;AAAA,CAA6B,CAAA,CAAA,UAACC,KAAK,EAAK;EACpF,OAAO;AACLC,IAAAA,OAAO,EAAAC,EAAAA,CAAAA,MAAA,CAAKC,SAAS,CAACC,KAAK,CAACJ,KAAK,CAACK,KAAK,EAAEL,KAAK,CAACM,QAAQ,CAAC,CAAC,EAAAJ,GAAAA,CAAAA,CAAAA,MAAA,CAAIC,SAAS,CACpEC,KAAK,CAACJ,KAAK,CAACK,KAAK,EAAEL,KAAK,CAACO,QAAQ,CACnC,CAAC,CAAE;AACHC,IAAAA,MAAM,EAAE,SAAS;AACjBC,IAAAA,OAAO,EAAE,cAAc;AACvBC,IAAAA,cAAc,EAAE,MAAM;AACtBC,IAAAA,MAAM,EAAE,MAAM;AACdC,IAAAA,SAAS,EAAE,SAAS;IACpBC,eAAe,EAAEb,KAAK,CAACc,UAAU,GAC7Bd,KAAK,CAACK,KAAK,CAACU,MAAM,CAACC,WAAW,CAACC,UAAU,CAACC,OAAO,CAACC,KAAK,GACvDnB,KAAK,CAACK,KAAK,CAACU,MAAM,CAACK,WAAW;IAClCC,YAAY,EAAErB,KAAK,CAACK,KAAK,CAACM,MAAM,CAACW,MAAM,CAACC,MAAM;AAC9CC,IAAAA,KAAK,EAAE,MAAM;IACbC,UAAU,EAAA,mBAAA,CAAAvB,MAAA,CAAsBF,KAAK,CAACK,KAAK,CAACqB,MAAM,CAACC,QAAQ,CAACC,MAAM,EAAA,GAAA,CAAA,CAAA1B,MAAA,CAAIF,KAAK,CAACK,KAAK,CAACqB,MAAM,CAACG,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAE;AACpH,IAAA,QAAQ,EAAE;AACRlB,MAAAA,eAAe,EAAEb,KAAK,CAACc,UAAU,GAC7Bd,KAAK,CAACK,KAAK,CAACU,MAAM,CAACC,WAAW,CAACC,UAAU,CAACC,OAAO,CAACc,gBAAgB,GAClEhC,KAAK,CAACK,KAAK,CAACU,MAAM,CAACC,WAAW,CAACC,UAAU,CAACgB,IAAI,CAACD,gBAAAA;KACpD;AACD,IAAA,gBAAgB,EAAAE,aAAA,CACXC,EAAAA,EAAAA,kBAAkB,CAAC;MAAE9B,KAAK,EAAEL,KAAK,CAACK,KAAAA;AAAM,KAAC,CAAC,CAAA;GAEhD,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,IAAM+B,oBAAoB,GAAG,SAAvBA,oBAAoBA,CAAAC,IAAA,EAIkC;AAAA,EAAA,IAH1DC,MAAM,GAAAD,IAAA,CAANC,MAAM;IACNC,aAAa,GAAAF,IAAA,CAAbE,aAAa;IACbC,UAAU,GAAAH,IAAA,CAAVG,UAAU,CAAA;EAEV,IAAID,aAAa,KAAK,CAAC,EAAE;AACvB,IAAA,OAAO,SAAS,CAAA;AAClB,GAAA;EAEA,IAAIC,UAAU,KAAK,CAAC,EAAE;AACpB,IAAA,OAAO,aAAa,CAAA;AACtB,GAAA;EAEA,IAAIF,MAAM,KAAK,CAAC,EAAE;AAChB,IAAA,OAAO,OAAO,CAAA;AAChB,GAAA;AAEA,EAAA,IAAIA,MAAM,KAAKE,UAAU,GAAG,CAAC,EAAE;AAC7B,IAAA,OAAO,KAAK,CAAA;AACd,GAAA;AAEA,EAAA,OAAO,QAAQ,CAAA;AACjB,CAAC,CAAA;AAED,IAAMC,SAAS,GAAG,SAAZA,SAASA,CAAAC,KAAA,EAe0B;AAAA,EAAA,IAdvCC,KAAK,GAAAD,KAAA,CAALC,KAAK;IACLC,SAAS,GAAAF,KAAA,CAATE,SAAS;IACTC,WAAW,GAAAH,KAAA,CAAXG,WAAW;IAAAC,kBAAA,GAAAJ,KAAA,CACXK,YAAY;AAAZA,IAAAA,YAAY,GAAAD,kBAAA,KAAG,KAAA,CAAA,GAAA,MAAM,GAAAA,kBAAA;IACrBE,MAAM,GAAAN,KAAA,CAANM,MAAM;IACNC,QAAQ,GAAAP,KAAA,CAARO,QAAQ;IACRnC,UAAU,GAAA4B,KAAA,CAAV5B,UAAU;IACVoC,IAAI,GAAAR,KAAA,CAAJQ,IAAI;IACJC,MAAM,GAAAT,KAAA,CAANS,MAAM;IACNC,OAAO,GAAAV,KAAA,CAAPU,OAAO;IACPC,QAAQ,GAAAX,KAAA,CAARW,QAAQ;IAAAC,YAAA,GAAAZ,KAAA,CACRJ,MAAM;AAANA,IAAAA,MAAM,GAAAgB,YAAA,KAAG,KAAA,CAAA,GAAA,CAAC,GAAAA,YAAA;IAAAC,iBAAA,GAAAb,KAAA,CACVc,WAAW;AAAXA,IAAAA,WAAW,GAAAD,iBAAA,KAAG,KAAA,CAAA,GAAA,CAAC,GAAAA,iBAAA;IAAAE,mBAAA,GAAAf,KAAA,CACfH,aAAa;AAAbA,IAAAA,aAAa,GAAAkB,mBAAA,KAAG,KAAA,CAAA,GAAA,CAAC,GAAAA,mBAAA,CAAA;AAEjB,EAAA,IAAAC,aAAA,GAKIC,YAAY,EAAE;IAJGnB,UAAU,GAAAkB,aAAA,CAA7BE,iBAAiB;IACjBC,4BAA4B,GAAAH,aAAA,CAA5BG,4BAA4B;IAC5BC,WAAW,GAAAJ,aAAA,CAAXI,WAAW;IACXC,MAAI,GAAAL,aAAA,CAAJK,IAAI,CAAA;AAEN,EAAA,IAAMC,QAAQ,GAAGC,cAAK,CAACC,OAAO,CAC5B,YAAA;AAAA,IAAA,OAAM9B,oBAAoB,CAAC;AAAEE,MAAAA,MAAM,EAANA,MAAM;AAAEC,MAAAA,aAAa,EAAbA,aAAa;AAAEC,MAAAA,UAAU,EAAVA,UAAAA;AAAW,KAAC,CAAC,CAAA;AAAA,GAAA,EACjE,CAACF,MAAM,EAAEC,aAAa,EAAEC,UAAU,CACpC,CAAC,CAAA;AAED,EAAA,IAAM2B,OAAO,GAAGF,cAAK,CAACG,MAAM,CAAiB,IAAI,CAAC,CAAA;AAElD,EAAA,IAAMC,WAAW,GAAGb,WAAW,KAAK,CAAC,CAAA;AACrC,EAAA,IAAMc,UAAU,GAAGd,WAAW,KAAKK,4BAA4B,GAAG,CAAC,CAAA;EACnE,IAAMU,aAAa,GAAGC,OAAO,CAACtB,IAAI,CAAC,IAAIsB,OAAO,CAACpB,OAAO,CAAC,CAAA;AACvD,EAAA,IAAMqB,UAAU,GAAGX,WAAW,KAAK,UAAU,CAAA;AAE7C,EAAA,IAAI,KAAO,EAAE;AACX,IAAA,IAAIb,QAAQ,IAAIa,WAAW,KAAK,YAAY,EAAE;AAC5CY,MAAAA,eAAe,CAAC;AACdC,QAAAA,OAAO,EAAE,iDAAiD;AAC1DC,QAAAA,UAAU,EAAE,UAAA;AACd,OAAC,CAAC,CAAA;AACJ,KAAA;AAEA,IAAA,IAAIrC,aAAa,IAAI,CAAC,IAAIuB,WAAW,KAAK,YAAY,EAAE;AACtDY,MAAAA,eAAe,CAAC;AACdC,QAAAA,OAAO,EAAE,uEAAuE;AAChFC,QAAAA,UAAU,EAAE,UAAA;AACd,OAAC,CAAC,CAAA;AACJ,KAAA;AACF,GAAA;AAEA,EAAA,IAAMC,iBAAiB,gBACrBC,IAAA,CAACC,GAAG,EAAA;AAACtE,IAAAA,OAAO,EAAC,MAAM;AAACuE,IAAAA,aAAa,EAAC,KAAK;AAACC,IAAAA,cAAc,EAAC,eAAe;AAACC,IAAAA,GAAG,EAAC,WAAW;IAAA7B,QAAA,EAAA,cACpFyB,IAAA,CAACC,GAAG,EAAA;MAAA1B,QAAA,EAAA,cACF8B,GAAA,CAACC,IAAI,EAAA;AACHrB,QAAAA,IAAI,EAAEsB,oBAAoB,CAACtB,MAAI,CAAC,CAACpB,KAAM;AACvC2C,QAAAA,KAAK,EAAC,0BAA0B;AAChCC,QAAAA,MAAM,EAAC,UAAU;AAAAlC,QAAAA,QAAA,EAEhBV,KAAAA;AAAK,OACF,CAAC,eACPwC,GAAA,CAACC,IAAI,EAAA;AACHrB,QAAAA,IAAI,EAAEsB,oBAAoB,CAACtB,MAAI,CAAC,CAACnB,SAAU;AAC3C4C,QAAAA,OAAO,EAAC,WAAW;AACnBF,QAAAA,KAAK,EAAC,yBAAyB;AAC/BG,QAAAA,OAAO,EAAC,SAAS;AAAApC,QAAAA,QAAA,EAEhBT,SAAAA;AAAS,OACN,CAAC,eACPuC,GAAA,CAACC,IAAI,EAAA;AAACrB,QAAAA,IAAI,EAAEsB,oBAAoB,CAACtB,MAAI,CAAC,CAAClB,WAAY;AAACyC,QAAAA,KAAK,EAAC,yBAAyB;AAAAjC,QAAAA,QAAA,EAChFR,WAAAA;AAAW,OACR,CAAC,CAAA;AAAA,KACJ,CAAC,eACNsC,GAAA,CAACJ,GAAG,EAAA;AAAA1B,MAAAA,QAAA,EAAEJ,QAAAA;AAAQ,KAAM,CAAC,CAAA;AAAA,GAClB,CACN,CAAA;AAED,EAAA,IAAMyC,sBAAsE,GAAG;AAC7EpF,IAAAA,QAAQ,EAAE,WAAW;AACrBC,IAAAA,QAAQ,EAAE,WAAA;GACF,CAAA;AAEV,EAAA,oBACEuE,IAAA,CAACa,OAAO,EAAAzD,aAAA,CAAAA,aAAA,CAAA;AACNzB,IAAAA,OAAO,EAAC,MAAM;AACduE,IAAAA,aAAa,EAAEP,UAAU,GAAG,KAAK,GAAG,QAAS;AAC7CS,IAAAA,GAAG,EAAEU,WAAW,CAAC7B,MAAI,CAAE;IACvB8B,SAAS,EAAA,uBAAA,CAAA3F,MAAA,CAA0BoC,MAAM,0BAAApC,MAAA,CAAuBqC,aAAa,CAAG;AAChF3B,IAAAA,SAAS,EAAE6D,UAAU,GAAG,MAAM,GAAG,QAAS;AAC1CqB,IAAAA,UAAU,EAAErB,UAAU,GAAGsB,SAAS,GAAG,QAAS;AAC9CC,IAAAA,QAAQ,EAAEvB,UAAU,GAAGsB,SAAS,UAAA7F,MAAA,CAAU+F,QAAQ,CAACC,IAAU,CAAC,KAAK,CAAC,CAAC,EAAU,SAAA,CAAA;AAC/E1E,IAAAA,KAAK,EAAEiD,UAAU,GAAG,MAAM,GAAGsB,SAAU;AACvCI,IAAAA,IAAI,EAAE1B,UAAU,GAAGsB,SAAS,GAAG,GAAA;AAAI,GAAA,EAC/BK,aAAa,CAAC;IAAEC,IAAI,EAAEC,aAAa,CAACC,QAAAA;AAAS,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;AACnDC,IAAAA,GAAG,EAAErC,OAAQ;IAAAd,QAAA,EAAA,cAEb8B,GAAA,CAACsB,QAAQ,EAAA;MACPC,qBAAqB,EAAE,CAACrC,WAAY;MACpCsC,mBAAmB,EAAE,CAACrC,UAAW;AACjCN,MAAAA,QAAQ,EAAEA,QAAS;AACnBhB,MAAAA,MAAM,EAAEA,MAAO;AACfD,MAAAA,YAAY,EAAEA,YAAAA;AAAa,KAC5B,CAAC,eACF+B,IAAA,CAACC,GAAG,EAAA;AAAC6B,MAAAA,SAAS,EAAC,WAAW;AAACT,MAAAA,IAAI,EAAC,GAAG;AAACU,MAAAA,WAAW,EAAEpC,UAAU,GAAGsB,SAAS,GAAGA,SAAU;MAAA1C,QAAA,EAAA,CACjFkB,aAAa,gBACZY,GAAA,CAACzF,wBAAwB,EAAAwC,aAAA,CAAAA,aAAA,CAAA,EAAA,EACnBwD,sBAAsB,CAAA,EAAA,EAAA,EAAA;AAC1BoB,QAAAA,EAAE,EAAE5D,IAAI,GAAG,GAAG,GAAG,QAAS;AAC1BA,QAAAA,IAAI,EAAEA,IAAK;AACXC,QAAAA,MAAM,EAAEA,MAAO;AACfrC,QAAAA,UAAU,EAAEA,UAAW;AACvBsC,QAAAA,OAAO,EAAEA,OAAQ;AAAAC,QAAAA,QAAA,EAEhBwB,iBAAAA;OACuB,CAAA,CAAC,gBAE3BM,GAAA,CAACJ,GAAG,EAAA7C,aAAA,CAAAA,aAAA,CAAA,EAAA,EAAKwD,sBAAsB,CAAA,EAAA,EAAA,EAAA;AAAArC,QAAAA,QAAA,EAAGwB,iBAAAA;AAAiB,OAAA,CAAM,CAC1D,EACAxB,QAAQ,gBACP8B,GAAA,CAACJ,GAAG,EAAA;AAACxE,QAAAA,QAAQ,EAAC,WAAW;AAACD,QAAAA,QAAQ,EAAC,WAAW;AAAA+C,QAAAA,QAAA,EAC3CA,QAAAA;OACE,CAAC,GACJ,IAAI,CAAA;AAAA,KACL,CAAC,CAAA;AAAA,GAAA,CACC,CAAC,CAAA;AAEd,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMkD,QAAQ,gBAAGQ,wBAAwB,CAACtE,SAAS,EAAE;EACnD1C,WAAW,EAAEiH,YAAY,CAACT,QAAQ;EAClCzG,WAAW,EAAEkH,YAAY,CAACT,QAAAA;AAC5B,CAAC;;;;"}

package/build/lib/web/production/components/StepGroup/StepItemMarker.js ADDED Viewed

@@ -0,0 +1,65 @@
+import { useStepGroup } from './StepGroupContext.js';
+import { getMarkerLineSpacings, iconSizeTokens } from './tokens.js';
+import '../Box/BaseBox/index.js';
+import '../Indicator/index.js';
+import '../../utils/index.js';
+import { jsx } from 'react/jsx-runtime';
+import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
+import { makeSize } from '../../utils/makeSize/makeSize.js';
+import { Indicator } from '../Indicator/Indicator.js';
+var MarkerBackgroundCircle = function MarkerBackgroundCircle(_ref) {
+  var color = _ref.color,
+    size = _ref.size,
+    margin = _ref.margin,
+    children = _ref.children;
+  return /*#__PURE__*/jsx(BaseBox, {
+    backgroundColor: color === 'primary' ? 'surface.background.primary.subtle' : "feedback.background.".concat(color, ".subtle"),
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    height: size,
+    width: size,
+    borderRadius: "round",
+    margin: margin,
+    children: children
+  });
+};
+var StepItemIndicator = function StepItemIndicator(_ref2) {
+  var color = _ref2.color;
+  var _useStepGroup = useStepGroup(),
+    size = _useStepGroup.size;
+  var spacingTokens = getMarkerLineSpacings(size);
+  return /*#__PURE__*/jsx(MarkerBackgroundCircle, {
+    color: color,
+    size: makeSize(spacingTokens.markerBackgroundSize),
+    margin: makeSize(spacingTokens.markerMargin),
+    children: /*#__PURE__*/jsx(Indicator, {
+      position: "relative",
+      marginLeft: "spacing.2",
+      color: color,
+      size: size,
+      accessibilityLabel: "".concat(color, " indicator")
+    })
+  });
+};
+var StepItemIcon = function StepItemIcon(_ref3) {
+  var Icon = _ref3.icon,
+    _ref3$color = _ref3.color,
+    color = _ref3$color === void 0 ? 'neutral' : _ref3$color;
+  var _useStepGroup2 = useStepGroup(),
+    size = _useStepGroup2.size;
+  var spacingTokens = getMarkerLineSpacings(size);
+  return /*#__PURE__*/jsx(MarkerBackgroundCircle, {
+    color: color,
+    size: makeSize(spacingTokens.markerBackgroundSize),
+    margin: makeSize(spacingTokens.markerMargin),
+    children: /*#__PURE__*/jsx(Icon, {
+      size: iconSizeTokens[size],
+      color: color === 'primary' ? 'surface.icon.primary.normal' : "feedback.icon.".concat(color, ".intense")
+    })
+  });
+};
+export { StepItemIcon, StepItemIndicator };
+//# sourceMappingURL=StepItemMarker.js.map

package/build/lib/web/production/components/StepGroup/StepItemMarker.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"StepItemMarker.js","sources":["../../../../../../src/components/StepGroup/StepItemMarker.tsx"],"sourcesContent":["import { useStepGroup } from './StepGroupContext';\nimport { getMarkerLineSpacings, iconSizeTokens } from './tokens';\nimport type { BaseBoxProps } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { IconComponent } from '~components/Icons';\nimport type { IndicatorProps } from '~components/Indicator';\nimport { Indicator } from '~components/Indicator';\nimport { makeSize } from '~utils';\n\ntype MarkerBackgroundCircleProps = {\n color: IndicatorProps['color'];\n size: BaseBoxProps['width'];\n margin: BaseBoxProps['margin'];\n children: BaseBoxProps['children'];\n};\n\nconst MarkerBackgroundCircle = ({\n color,\n size,\n margin,\n children,\n}: MarkerBackgroundCircleProps): React.ReactElement => {\n return (\n <BaseBox\n backgroundColor={\n color === 'primary'\n ? 'surface.background.primary.subtle'\n : `feedback.background.${color}.subtle`\n }\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n height={size}\n width={size}\n borderRadius=\"round\"\n margin={margin}\n >\n {children}\n </BaseBox>\n );\n};\n\nconst StepItemIndicator = ({ color }: { color: IndicatorProps['color'] }): React.ReactElement => {\n const { size } = useStepGroup();\n const spacingTokens = getMarkerLineSpacings(size);\n\n return (\n <MarkerBackgroundCircle\n color={color}\n size={makeSize(spacingTokens.markerBackgroundSize)}\n margin={makeSize(spacingTokens.markerMargin)}\n >\n <Indicator\n position=\"relative\"\n marginLeft=\"spacing.2\"\n color={color}\n size={size}\n accessibilityLabel={`${color} indicator`}\n />\n </MarkerBackgroundCircle>\n );\n};\n\ntype StepItemIconProps = {\n icon: IconComponent;\n color: IndicatorProps['color'];\n};\n\nconst StepItemIcon = ({ icon: Icon, color = 'neutral' }: StepItemIconProps): React.ReactElement => {\n const { size } = useStepGroup();\n const spacingTokens = getMarkerLineSpacings(size);\n\n return (\n <MarkerBackgroundCircle\n color={color}\n size={makeSize(spacingTokens.markerBackgroundSize)}\n margin={makeSize(spacingTokens.markerMargin)}\n >\n <Icon\n size={iconSizeTokens[size]}\n color={\n color === 'primary' ? 'surface.icon.primary.normal' : `feedback.icon.${color}.intense`\n }\n />\n </MarkerBackgroundCircle>\n );\n};\n\nexport { StepItemIndicator, StepItemIcon };\n"],"names":["MarkerBackgroundCircle","_ref","color","size","margin","children","_jsx","BaseBox","backgroundColor","concat","display","alignItems","justifyContent","height","width","borderRadius","StepItemIndicator","_ref2","_useStepGroup","useStepGroup","spacingTokens","getMarkerLineSpacings","makeSize","markerBackgroundSize","markerMargin","Indicator","position","marginLeft","accessibilityLabel","StepItemIcon","_ref3","Icon","icon","_ref3$color","_useStepGroup2","iconSizeTokens"],"mappings":"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"}

package/build/lib/web/production/components/StepGroup/StepLine.web.js ADDED Viewed

@@ -0,0 +1,336 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import { encode } from 'universal-base64';
+import { StepItemIndicator } from './StepItemMarker.js';
+import { useStepGroup } from './StepGroupContext.js';
+import { markerLineDotWidth, markerLineDotSpacing, markerLineWidth, getMarkerLineSpacings, itemTopMargin } from './tokens.js';
+import '../Box/index.js';
+import '../Box/BaseBox/index.js';
+import '../Icons/_Svg/index.js';
+import '../../utils/index.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import useTheme from '../BladeProvider/useTheme.js';
+import { makeSize } from '../../utils/makeSize/makeSize.js';
+import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
+import Svg from '../Icons/_Svg/Svg/Svg.web.js';
+import Path from '../Icons/_Svg/Path/Path.web.js';
+import { Box } from '../Box/Box.js';
+var _excluded = ["isDotted", "width"],
+  _excluded2 = ["height", "isDotted"],
+  _excluded3 = ["isDotted"],
+  _excluded4 = ["isDotted"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var useDottedLineStyles = function useDottedLineStyles() {
+  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+    isHorizontal = _ref.isHorizontal;
+  var _useTheme = useTheme(),
+    theme = _useTheme.theme;
+  var svgString = "<svg width=\"2\" height=\"2\" viewBox=\"0 0 2 2\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path\n      d=\"M0 1C0 0.447715 0.447715 0 1 0C1.55228 0 2 0.447715 2 1C2 1.55228 1.55228 2 1 2C0.447715 2 0 1.55228 0 1Z\"\n      fill=\"".concat(theme.colors.surface.border.gray.subtle, "\"\n    />\n  </svg>\n  ");
+  var backgroundURL = "url(data:image/svg+xml;base64,".concat(encode(svgString), ")");
+  return {
+    backgroundImage: backgroundURL,
+    backgroundPosition: isHorizontal ? 'left' : 'top',
+    backgroundSize: isHorizontal ? "".concat(makeSize(markerLineDotWidth + markerLineDotSpacing), " ").concat(makeSize(markerLineDotWidth)) : "".concat(makeSize(markerLineDotWidth), " ").concat(makeSize(markerLineDotWidth + markerLineDotSpacing), " "),
+    backgroundRepeat: isHorizontal ? 'round no-repeat' : 'no-repeat round'
+  };
+};
+var StepStraightLineHorizontal = function StepStraightLineHorizontal(_ref2) {
+  var isDotted = _ref2.isDotted,
+    width = _ref2.width,
+    styledProps = _objectWithoutProperties(_ref2, _excluded);
+  var dottedStyles = useDottedLineStyles({
+    isHorizontal: true
+  });
+  var borderStyles = isDotted ? dottedStyles : {
+    borderTopWidth: 'thicker',
+    borderTopColor: 'surface.border.gray.subtle'
+  };
+  return /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread({
+    height: makeSize(markerLineWidth),
+    flex: "1"
+  }, borderStyles), styledProps));
+};
+var StepStraightLineVertical = function StepStraightLineVertical(_ref3) {
+  var height = _ref3.height,
+    isDotted = _ref3.isDotted,
+    styledProps = _objectWithoutProperties(_ref3, _excluded2);
+  var dottedStyles = useDottedLineStyles();
+  var borderStyles = isDotted ? dottedStyles : {
+    borderLeftWidth: 'thicker',
+    borderLeftColor: 'surface.border.gray.subtle'
+  };
+  return /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread({
+    height: height ? makeSize(height) : undefined,
+    flex: height ? undefined : '1',
+    width: makeSize(markerLineWidth)
+  }, borderStyles), styledProps));
+};
+var StepTopCurveVertical = function StepTopCurveVertical(_ref4) {
+  var isDotted = _ref4.isDotted,
+    styledProps = _objectWithoutProperties(_ref4, _excluded3);
+  var _useTheme2 = useTheme(),
+    theme = _useTheme2.theme;
+  return isDotted ? /*#__PURE__*/jsxs(Svg, {
+    width: "21",
+    height: "15",
+    marginLeft: "-1px",
+    viewBox: "0 0 21 15",
+    fill: theme.colors.surface.border.gray.subtle,
+    children: [/*#__PURE__*/jsx(Path, {
+      d: "M1.90332 2.3916C2.20752 2.3916 2.47998 2.25586 2.66357 2.04199C2.81299 1.86719 2.90332 1.63965 2.90332 1.3916C2.90332 0.838867 2.45557 0.391602 1.90332 0.391602C1.35107 0.391602 0.90332 0.838867 0.90332 1.3916C0.90332 1.94434 1.35107 2.3916 1.90332 2.3916Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M9.85352 13.042C9.66992 13.2559 9.39746 13.3916 9.09326 13.3916C8.54102 13.3916 8.09326 12.9443 8.09326 12.3916C8.09326 11.8389 8.54102 11.3916 9.09326 11.3916C9.64551 11.3916 10.0933 11.8389 10.0933 12.3916C10.0933 12.6396 10.0029 12.8672 9.85352 13.042Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M14.498 14.3916C14.8022 14.3916 15.0747 14.2559 15.2583 14.042C15.4077 13.8672 15.498 13.6396 15.498 13.3916C15.498 12.8389 15.0503 12.3916 14.498 12.3916C13.9458 12.3916 13.498 12.8389 13.498 13.3916C13.498 13.9443 13.9458 14.3916 14.498 14.3916Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M19.9033 14.3916C20.2075 14.3916 20.48 14.2559 20.6636 14.042C20.813 13.8672 20.9033 13.6396 20.9033 13.3916C20.9033 12.8389 20.4556 12.3916 19.9033 12.3916C19.3511 12.3916 18.9033 12.8389 18.9033 13.3916C18.9033 13.9443 19.3511 14.3916 19.9033 14.3916Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M3.26318 6.08887C3.07959 6.30273 2.80713 6.43848 2.50293 6.43848C1.95068 6.43848 1.50293 5.99121 1.50293 5.43848C1.50293 4.88574 1.95068 4.43848 2.50293 4.43848C3.05518 4.43848 3.50293 4.88574 3.50293 5.43848C3.50293 5.68652 3.4126 5.91406 3.26318 6.08887Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M5.15137 10.6357C5.45557 10.6357 5.72803 10.5 5.91162 10.2861C6.06104 10.1113 6.15137 9.88379 6.15137 9.63574C6.15137 9.08301 5.70361 8.63574 5.15137 8.63574C4.59912 8.63574 4.15137 9.08301 4.15137 9.63574C4.15137 10.1885 4.59912 10.6357 5.15137 10.6357Z"
+    })]
+  }) : /*#__PURE__*/jsx(Svg, _objectSpread(_objectSpread({
+    width: "20",
+    height: "14",
+    viewBox: "0 0 20 14",
+    fill: "none"
+  }, styledProps), {}, {
+    children: /*#__PURE__*/jsx(Path, {
+      d: "M1 0V1C1 7.62742 6.37258 13 13 13H20",
+      stroke: theme.colors.surface.border.gray.subtle,
+      strokeWidth: "2"
+    })
+  }));
+};
+var StepBottomCurveVertical = function StepBottomCurveVertical(_ref5) {
+  var isDotted = _ref5.isDotted,
+    styledProps = _objectWithoutProperties(_ref5, _excluded4);
+  var _useTheme3 = useTheme(),
+    theme = _useTheme3.theme;
+  return isDotted ? /*#__PURE__*/jsxs(Svg, {
+    width: "35",
+    height: "26",
+    viewBox: "0 0 35 26",
+    fill: theme.colors.surface.border.gray.subtle,
+    children: [/*#__PURE__*/jsx(Path, {
+      d: "M34.7603 1.93457C34.5767 2.14844 34.3042 2.28418 34 2.28418C33.4478 2.28418 33 1.83691 33 1.28418C33 0.731445 33.4478 0.28418 34 0.28418C34.5522 0.28418 35 0.731445 35 1.28418C35 1.53223 34.9097 1.75977 34.7603 1.93457Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M2 18.7803C2.3042 18.7803 2.57666 18.6445 2.76025 18.4307C2.90967 18.2559 3 18.0283 3 17.7803C3 17.2275 2.55225 16.7803 2 16.7803C1.44775 16.7803 1 17.2275 1 17.7803C1 18.333 1.44775 18.7803 2 18.7803Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M1 25.2842C1.3042 25.2842 1.57666 25.1484 1.76025 24.9346C1.90967 24.7598 2 24.5322 2 24.2842C2 23.7314 1.55225 23.2842 1 23.2842C0.447754 23.2842 0 23.7314 0 24.2842C0 24.8369 0.447754 25.2842 1 25.2842Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M7.30127 14.7842C7.60547 14.7842 7.87793 14.6484 8.06152 14.4346C8.21094 14.2598 8.30127 14.0322 8.30127 13.7842C8.30127 13.2314 7.85352 12.7842 7.30127 12.7842C6.74902 12.7842 6.30127 13.2314 6.30127 13.7842C6.30127 14.3369 6.74902 14.7842 7.30127 14.7842Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M14.7188 13.1338C14.5352 13.3477 14.2627 13.4834 13.9585 13.4834C13.4062 13.4834 12.9585 13.0361 12.9585 12.4834C12.9585 11.9307 13.4062 11.4834 13.9585 11.4834C14.5107 11.4834 14.9585 11.9307 14.9585 12.4834C14.9585 12.7314 14.8682 12.959 14.7188 13.1338Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M20.5698 12.2119C20.874 12.2119 21.1465 12.0762 21.3301 11.8623C21.4795 11.6875 21.5698 11.46 21.5698 11.2119C21.5698 10.6592 21.1221 10.2119 20.5698 10.2119C20.0176 10.2119 19.5698 10.6592 19.5698 11.2119C19.5698 11.7646 20.0176 12.2119 20.5698 12.2119Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M27.6211 10.6523C27.4375 10.8662 27.165 11.002 26.8608 11.002C26.3086 11.002 25.8608 10.5547 25.8608 10.002C25.8608 9.44922 26.3086 9.00195 26.8608 9.00195C27.4131 9.00195 27.8608 9.44922 27.8608 10.002C27.8608 10.25 27.7705 10.4775 27.6211 10.6523Z"
+    }), /*#__PURE__*/jsx(Path, {
+      d: "M32.0879 8.2002C32.3921 8.2002 32.6646 8.06445 32.8481 7.85059C32.9976 7.67578 33.0879 7.44824 33.0879 7.2002C33.0879 6.64746 32.6401 6.2002 32.0879 6.2002C31.5356 6.2002 31.0879 6.64746 31.0879 7.2002C31.0879 7.75293 31.5356 8.2002 32.0879 8.2002Z"
+    })]
+  }) : /*#__PURE__*/jsx(Svg, _objectSpread(_objectSpread({
+    width: "35",
+    height: "25",
+    viewBox: "0 0 35 25",
+    fill: "none"
+  }, styledProps), {}, {
+    children: /*#__PURE__*/jsx(Path, {
+      d: "M1 25V21.3088C1 17.4754 3.71928 14.1808 7.48316 13.4539L27.5168 9.58528C31.2807 8.85845 34 5.56381 34 1.7304V-2.98023e-08",
+      stroke: theme.colors.surface.border.gray.subtle,
+      strokeWidth: "2"
+    })
+  }));
+};
+var defaultMarker = /*#__PURE__*/jsx(StepItemIndicator, {
+  color: "neutral"
+});
+var StepLineVertical = function StepLineVertical(_ref6) {
+  var _ref6$marker = _ref6.marker,
+    marker = _ref6$marker === void 0 ? defaultMarker : _ref6$marker,
+    stepProgress = _ref6.stepProgress,
+    isIndented = _ref6.isIndented,
+    shouldShowStartBranch = _ref6.shouldShowStartBranch,
+    shouldShowEndBranch = _ref6.shouldShowEndBranch;
+  var _useStepGroup = useStepGroup(),
+    size = _useStepGroup.size;
+  var spacingTokens = getMarkerLineSpacings(size);
+  return /*#__PURE__*/jsxs(Box, {
+    position: "relative",
+    marginLeft: isIndented ? makeSize(spacingTokens.indentationWidth) : undefined,
+    display: "flex",
+    flexDirection: "column",
+    children: [/*#__PURE__*/jsx(StepStraightLineVertical, {
+      height: itemTopMargin,
+      isDotted: stepProgress === 'none' || stepProgress === 'end',
+      visibility: shouldShowStartBranch ? 'visible' : 'hidden'
+    }), /*#__PURE__*/jsx(Box, {
+      marginLeft: makeSize(-spacingTokens.markerLeftAlignment),
+      children: marker
+    }), /*#__PURE__*/jsx(StepStraightLineVertical, {
+      isDotted: stepProgress === 'none' || stepProgress === 'start',
+      visibility: shouldShowEndBranch ? 'visible' : 'hidden'
+    })]
+  });
+};
+var StepLineStart = function StepLineStart(_ref7) {
+  var _ref7$marker = _ref7.marker,
+    marker = _ref7$marker === void 0 ? defaultMarker : _ref7$marker,
+    stepProgress = _ref7.stepProgress,
+    shouldShowStartBranch = _ref7.shouldShowStartBranch,
+    shouldShowEndBranch = _ref7.shouldShowEndBranch;
+  var _useStepGroup2 = useStepGroup(),
+    size = _useStepGroup2.size;
+  var spacingTokens = getMarkerLineSpacings(size);
+  return /*#__PURE__*/jsxs(Box, {
+    position: "relative",
+    display: "flex",
+    flexDirection: "column",
+    children: [/*#__PURE__*/jsx(StepStraightLineVertical, {
+      height: itemTopMargin,
+      visibility: shouldShowStartBranch ? 'visible' : 'hidden',
+      isDotted: stepProgress === 'none' || stepProgress === 'end'
+    }), /*#__PURE__*/jsx(StepTopCurveVertical, {
+      visibility: shouldShowStartBranch ? 'visible' : 'hidden',
+      isDotted: stepProgress === 'none' || stepProgress === 'end'
+    }), /*#__PURE__*/jsx(Box, {
+      marginLeft: makeSize(-spacingTokens.markerLeftAlignment + spacingTokens.indentationWidth),
+      marginTop: makeSize(spacingTokens.markerTopAlignment),
+      children: marker
+    }), /*#__PURE__*/jsx(StepStraightLineVertical, {
+      visibility: shouldShowEndBranch ? 'visible' : 'hidden',
+      marginLeft: makeSize(spacingTokens.indentationWidth),
+      isDotted: stepProgress === 'none' || stepProgress === 'start'
+    })]
+  });
+};
+var StepLineEnd = function StepLineEnd(_ref8) {
+  var _ref8$marker = _ref8.marker,
+    marker = _ref8$marker === void 0 ? defaultMarker : _ref8$marker,
+    stepProgress = _ref8.stepProgress,
+    shouldShowStartBranch = _ref8.shouldShowStartBranch,
+    shouldShowEndBranch = _ref8.shouldShowEndBranch;
+  var _useStepGroup3 = useStepGroup(),
+    size = _useStepGroup3.size;
+  var spacingTokens = getMarkerLineSpacings(size);
+  return /*#__PURE__*/jsxs(Box, {
+    position: "relative",
+    display: "flex",
+    flexDirection: "column",
+    children: [/*#__PURE__*/jsx(StepStraightLineVertical, {
+      visibility: shouldShowStartBranch ? 'visible' : 'hidden',
+      marginLeft: makeSize(spacingTokens.indentationWidth),
+      height: itemTopMargin,
+      isDotted: stepProgress === 'none' || stepProgress === 'end'
+    }), /*#__PURE__*/jsx(Box, {
+      marginLeft: makeSize(-spacingTokens.markerLeftAlignment + spacingTokens.indentationWidth),
+      children: marker
+    }), /*#__PURE__*/jsx(StepStraightLineVertical, {
+      marginLeft: makeSize(spacingTokens.indentationWidth),
+      visibility: shouldShowEndBranch ? 'visible' : 'hidden',
+      isDotted: stepProgress === 'none' || stepProgress === 'start'
+    }), /*#__PURE__*/jsx(StepBottomCurveVertical, {
+      isDotted: stepProgress === 'none' || stepProgress === 'start',
+      visibility: shouldShowEndBranch ? 'visible' : 'hidden'
+    })]
+  });
+};
+var StepLineHorizontal = function StepLineHorizontal(_ref9) {
+  var _ref9$marker = _ref9.marker,
+    marker = _ref9$marker === void 0 ? defaultMarker : _ref9$marker,
+    stepProgress = _ref9.stepProgress,
+    shouldShowStartBranch = _ref9.shouldShowStartBranch,
+    shouldShowEndBranch = _ref9.shouldShowEndBranch;
+  return /*#__PURE__*/jsxs(Box, {
+    position: "relative",
+    display: "flex",
+    flexDirection: "row",
+    width: "100%",
+    justifyContent: "center",
+    alignItems: "center",
+    children: [/*#__PURE__*/jsx(StepStraightLineHorizontal, {
+      isDotted: stepProgress === 'none' || stepProgress === 'end',
+      visibility: shouldShowStartBranch ? 'visible' : 'hidden'
+    }), /*#__PURE__*/jsx(Box, {
+      children: marker
+    }), /*#__PURE__*/jsx(StepStraightLineHorizontal, {
+      isDotted: stepProgress === 'none' || stepProgress === 'start',
+      visibility: shouldShowEndBranch ? 'visible' : 'hidden'
+    })]
+  });
+};
+var StepLineSingleItem = function StepLineSingleItem(_ref10) {
+  var _ref10$marker = _ref10.marker,
+    marker = _ref10$marker === void 0 ? defaultMarker : _ref10$marker,
+    stepProgress = _ref10.stepProgress,
+    shouldShowEndBranch = _ref10.shouldShowEndBranch,
+    shouldShowStartBranch = _ref10.shouldShowStartBranch;
+  var _useStepGroup4 = useStepGroup(),
+    size = _useStepGroup4.size;
+  var spacingTokens = getMarkerLineSpacings(size);
+  return /*#__PURE__*/jsxs(Box, {
+    position: "relative",
+    display: "flex",
+    flexDirection: "column",
+    children: [/*#__PURE__*/jsx(StepStraightLineVertical, {
+      visibility: shouldShowStartBranch ? 'visible' : 'hidden',
+      height: itemTopMargin,
+      isDotted: stepProgress === 'none' || stepProgress === 'end'
+    }), /*#__PURE__*/jsx(StepTopCurveVertical, {
+      visibility: shouldShowStartBranch ? 'visible' : 'hidden',
+      isDotted: stepProgress === 'none' || stepProgress === 'end'
+    }), /*#__PURE__*/jsx(Box
+    // -12 (markerLeftAlginment) + 33 (indentationWidth)
+    , {
+      marginLeft: makeSize(-spacingTokens.markerLeftAlignment + spacingTokens.indentationWidth),
+      marginTop: makeSize(spacingTokens.markerTopAlignment),
+      children: marker
+    }), /*#__PURE__*/jsx(StepStraightLineVertical, {
+      marginLeft: makeSize(spacingTokens.indentationWidth),
+      visibility: shouldShowEndBranch ? 'visible' : 'hidden',
+      isDotted: stepProgress === 'none' || stepProgress === 'start'
+    }), /*#__PURE__*/jsx(StepBottomCurveVertical, {
+      visibility: shouldShowEndBranch ? 'visible' : 'hidden',
+      isDotted: stepProgress === 'none' || stepProgress === 'start'
+    })]
+  });
+};
+var StepLine = function StepLine(_ref11) {
+  var _ref11$stepType = _ref11.stepType,
+    stepType = _ref11$stepType === void 0 ? 'default' : _ref11$stepType,
+    shouldShowStartBranch = _ref11.shouldShowStartBranch,
+    shouldShowEndBranch = _ref11.shouldShowEndBranch,
+    marker = _ref11.marker,
+    stepProgress = _ref11.stepProgress;
+  var _useStepGroup5 = useStepGroup(),
+    orientation = _useStepGroup5.orientation;
+  var commonProps = {
+    shouldShowStartBranch: shouldShowStartBranch,
+    shouldShowEndBranch: shouldShowEndBranch,
+    marker: marker,
+    stepProgress: stepProgress
+  };
+  if (orientation === 'horizontal') {
+    return /*#__PURE__*/jsx(StepLineHorizontal, _objectSpread({}, commonProps));
+  }
+  if (stepType === 'start') {
+    return /*#__PURE__*/jsx(StepLineStart, _objectSpread({}, commonProps));
+  }
+  if (stepType === 'middle') {
+    return /*#__PURE__*/jsx(StepLineVertical, _objectSpread(_objectSpread({}, commonProps), {}, {
+      isIndented: true
+    }));
+  }
+  if (stepType === 'end') {
+    return /*#__PURE__*/jsx(StepLineEnd, _objectSpread({}, commonProps));
+  }
+  if (stepType === 'single-item') {
+    return /*#__PURE__*/jsx(StepLineSingleItem, _objectSpread({}, commonProps));
+  }
+  return /*#__PURE__*/jsx(StepLineVertical, _objectSpread({}, commonProps));
+};
+export { StepLine };
+//# sourceMappingURL=StepLine.web.js.map

package/build/lib/web/production/components/StepGroup/StepLine.web.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"StepLine.web.js","sources":["../../../../../../src/components/StepGroup/StepLine.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport { encode } from 'universal-base64';\nimport type { StepItemProps } from './types';\nimport { StepItemIndicator } from './StepItemMarker';\nimport { useStepGroup } from './StepGroupContext';\nimport {\n getMarkerLineSpacings,\n itemTopMargin,\n markerLineDotSpacing,\n markerLineDotWidth,\n markerLineWidth,\n} from './tokens';\nimport { Box } from '~components/Box';\nimport type { BaseBoxProps } from '~components/Box/BaseBox';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport Svg, { Path } from '~components/Icons/_Svg';\nimport { makeSize, useTheme } from '~utils';\n\ntype StepLineSvgProps = {\n isDotted?: boolean;\n} & StyledPropsBlade;\n\nconst useDottedLineStyles = ({ isHorizontal }: { isHorizontal?: boolean } = {}): BaseBoxProps => {\n const { theme } = useTheme();\n\n const svgString = `<svg width=\"2\" height=\"2\" viewBox=\"0 0 2 2\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M0 1C0 0.447715 0.447715 0 1 0C1.55228 0 2 0.447715 2 1C2 1.55228 1.55228 2 1 2C0.447715 2 0 1.55228 0 1Z\"\n fill=\"${theme.colors.surface.border.gray.subtle}\"\n />\n </svg>\n `;\n\n const backgroundURL = `url(data:image/svg+xml;base64,${encode(svgString)})`;\n\n return {\n backgroundImage: backgroundURL,\n backgroundPosition: isHorizontal ? 'left' : 'top',\n backgroundSize: isHorizontal\n ? `${makeSize(markerLineDotWidth + markerLineDotSpacing)} ${makeSize(markerLineDotWidth)}`\n : `${makeSize(markerLineDotWidth)} ${makeSize(markerLineDotWidth + markerLineDotSpacing)} `,\n backgroundRepeat: isHorizontal ? 'round no-repeat' : 'no-repeat round',\n };\n};\n\nconst StepStraightLineHorizontal = ({\n isDotted,\n width,\n ...styledProps\n}: StepLineSvgProps & {\n width?: number;\n}): React.ReactElement => {\n const dottedStyles = useDottedLineStyles({ isHorizontal: true });\n const borderStyles: BaseBoxProps = isDotted\n ? dottedStyles\n : {\n borderTopWidth: 'thicker',\n borderTopColor: 'surface.border.gray.subtle',\n };\n\n return <BaseBox height={makeSize(markerLineWidth)} flex=\"1\" {...borderStyles} {...styledProps} />;\n};\n\nconst StepStraightLineVertical = ({\n height,\n isDotted,\n ...styledProps\n}: StepLineSvgProps & {\n height?: number;\n}): React.ReactElement => {\n const dottedStyles = useDottedLineStyles();\n const borderStyles: BaseBoxProps = isDotted\n ? dottedStyles\n : {\n borderLeftWidth: 'thicker',\n borderLeftColor: 'surface.border.gray.subtle',\n };\n return (\n <BaseBox\n height={height ? makeSize(height) : undefined}\n flex={height ? undefined : '1'}\n width={makeSize(markerLineWidth)}\n {...borderStyles}\n {...styledProps}\n />\n );\n};\n\nconst StepTopCurveVertical = ({\n isDotted,\n ...styledProps\n}: StepLineSvgProps): React.ReactElement => {\n const { theme } = useTheme();\n return isDotted ? (\n <Svg\n width=\"21\"\n height=\"15\"\n marginLeft=\"-1px\"\n viewBox=\"0 0 21 15\"\n fill={theme.colors.surface.border.gray.subtle}\n >\n <Path d=\"M1.90332 2.3916C2.20752 2.3916 2.47998 2.25586 2.66357 2.04199C2.81299 1.86719 2.90332 1.63965 2.90332 1.3916C2.90332 0.838867 2.45557 0.391602 1.90332 0.391602C1.35107 0.391602 0.90332 0.838867 0.90332 1.3916C0.90332 1.94434 1.35107 2.3916 1.90332 2.3916Z\" />\n <Path d=\"M9.85352 13.042C9.66992 13.2559 9.39746 13.3916 9.09326 13.3916C8.54102 13.3916 8.09326 12.9443 8.09326 12.3916C8.09326 11.8389 8.54102 11.3916 9.09326 11.3916C9.64551 11.3916 10.0933 11.8389 10.0933 12.3916C10.0933 12.6396 10.0029 12.8672 9.85352 13.042Z\" />\n <Path d=\"M14.498 14.3916C14.8022 14.3916 15.0747 14.2559 15.2583 14.042C15.4077 13.8672 15.498 13.6396 15.498 13.3916C15.498 12.8389 15.0503 12.3916 14.498 12.3916C13.9458 12.3916 13.498 12.8389 13.498 13.3916C13.498 13.9443 13.9458 14.3916 14.498 14.3916Z\" />\n <Path d=\"M19.9033 14.3916C20.2075 14.3916 20.48 14.2559 20.6636 14.042C20.813 13.8672 20.9033 13.6396 20.9033 13.3916C20.9033 12.8389 20.4556 12.3916 19.9033 12.3916C19.3511 12.3916 18.9033 12.8389 18.9033 13.3916C18.9033 13.9443 19.3511 14.3916 19.9033 14.3916Z\" />\n <Path d=\"M3.26318 6.08887C3.07959 6.30273 2.80713 6.43848 2.50293 6.43848C1.95068 6.43848 1.50293 5.99121 1.50293 5.43848C1.50293 4.88574 1.95068 4.43848 2.50293 4.43848C3.05518 4.43848 3.50293 4.88574 3.50293 5.43848C3.50293 5.68652 3.4126 5.91406 3.26318 6.08887Z\" />\n <Path d=\"M5.15137 10.6357C5.45557 10.6357 5.72803 10.5 5.91162 10.2861C6.06104 10.1113 6.15137 9.88379 6.15137 9.63574C6.15137 9.08301 5.70361 8.63574 5.15137 8.63574C4.59912 8.63574 4.15137 9.08301 4.15137 9.63574C4.15137 10.1885 4.59912 10.6357 5.15137 10.6357Z\" />\n </Svg>\n ) : (\n <Svg width=\"20\" height=\"14\" viewBox=\"0 0 20 14\" fill=\"none\" {...styledProps}>\n <Path\n d=\"M1 0V1C1 7.62742 6.37258 13 13 13H20\"\n stroke={theme.colors.surface.border.gray.subtle}\n strokeWidth=\"2\"\n />\n </Svg>\n );\n};\n\nconst StepBottomCurveVertical = ({\n isDotted,\n ...styledProps\n}: StepLineSvgProps): React.ReactElement => {\n const { theme } = useTheme();\n\n return isDotted ? (\n <Svg width=\"35\" height=\"26\" viewBox=\"0 0 35 26\" fill={theme.colors.surface.border.gray.subtle}>\n <Path d=\"M34.7603 1.93457C34.5767 2.14844 34.3042 2.28418 34 2.28418C33.4478 2.28418 33 1.83691 33 1.28418C33 0.731445 33.4478 0.28418 34 0.28418C34.5522 0.28418 35 0.731445 35 1.28418C35 1.53223 34.9097 1.75977 34.7603 1.93457Z\" />\n <Path d=\"M2 18.7803C2.3042 18.7803 2.57666 18.6445 2.76025 18.4307C2.90967 18.2559 3 18.0283 3 17.7803C3 17.2275 2.55225 16.7803 2 16.7803C1.44775 16.7803 1 17.2275 1 17.7803C1 18.333 1.44775 18.7803 2 18.7803Z\" />\n <Path d=\"M1 25.2842C1.3042 25.2842 1.57666 25.1484 1.76025 24.9346C1.90967 24.7598 2 24.5322 2 24.2842C2 23.7314 1.55225 23.2842 1 23.2842C0.447754 23.2842 0 23.7314 0 24.2842C0 24.8369 0.447754 25.2842 1 25.2842Z\" />\n <Path d=\"M7.30127 14.7842C7.60547 14.7842 7.87793 14.6484 8.06152 14.4346C8.21094 14.2598 8.30127 14.0322 8.30127 13.7842C8.30127 13.2314 7.85352 12.7842 7.30127 12.7842C6.74902 12.7842 6.30127 13.2314 6.30127 13.7842C6.30127 14.3369 6.74902 14.7842 7.30127 14.7842Z\" />\n <Path d=\"M14.7188 13.1338C14.5352 13.3477 14.2627 13.4834 13.9585 13.4834C13.4062 13.4834 12.9585 13.0361 12.9585 12.4834C12.9585 11.9307 13.4062 11.4834 13.9585 11.4834C14.5107 11.4834 14.9585 11.9307 14.9585 12.4834C14.9585 12.7314 14.8682 12.959 14.7188 13.1338Z\" />\n <Path d=\"M20.5698 12.2119C20.874 12.2119 21.1465 12.0762 21.3301 11.8623C21.4795 11.6875 21.5698 11.46 21.5698 11.2119C21.5698 10.6592 21.1221 10.2119 20.5698 10.2119C20.0176 10.2119 19.5698 10.6592 19.5698 11.2119C19.5698 11.7646 20.0176 12.2119 20.5698 12.2119Z\" />\n <Path d=\"M27.6211 10.6523C27.4375 10.8662 27.165 11.002 26.8608 11.002C26.3086 11.002 25.8608 10.5547 25.8608 10.002C25.8608 9.44922 26.3086 9.00195 26.8608 9.00195C27.4131 9.00195 27.8608 9.44922 27.8608 10.002C27.8608 10.25 27.7705 10.4775 27.6211 10.6523Z\" />\n <Path d=\"M32.0879 8.2002C32.3921 8.2002 32.6646 8.06445 32.8481 7.85059C32.9976 7.67578 33.0879 7.44824 33.0879 7.2002C33.0879 6.64746 32.6401 6.2002 32.0879 6.2002C31.5356 6.2002 31.0879 6.64746 31.0879 7.2002C31.0879 7.75293 31.5356 8.2002 32.0879 8.2002Z\" />\n </Svg>\n ) : (\n <Svg width=\"35\" height=\"25\" viewBox=\"0 0 35 25\" fill=\"none\" {...styledProps}>\n <Path\n d=\"M1 25V21.3088C1 17.4754 3.71928 14.1808 7.48316 13.4539L27.5168 9.58528C31.2807 8.85845 34 5.56381 34 1.7304V-2.98023e-08\"\n stroke={theme.colors.surface.border.gray.subtle}\n strokeWidth=\"2\"\n />\n </Svg>\n );\n};\n\ntype StepLineProps = {\n stepType: 'single-item' | 'start' | 'middle' | 'end' | 'default';\n shouldShowStartBranch: boolean;\n shouldShowEndBranch: boolean;\n} & Pick<StepItemProps, 'stepProgress' | 'marker'>;\n\ntype StepLineSubComponentProps = Pick<\n StepLineProps,\n 'shouldShowStartBranch' | 'shouldShowEndBranch' | 'marker' | 'stepProgress'\n>;\n\nconst defaultMarker = <StepItemIndicator color=\"neutral\" />;\n\nconst StepLineVertical = ({\n marker = defaultMarker,\n stepProgress,\n isIndented,\n shouldShowStartBranch,\n shouldShowEndBranch,\n}: StepLineSubComponentProps & {\n isIndented?: boolean;\n}): React.ReactElement => {\n const { size } = useStepGroup();\n const spacingTokens = getMarkerLineSpacings(size);\n\n return (\n <Box\n position=\"relative\"\n marginLeft={isIndented ? makeSize(spacingTokens.indentationWidth) : undefined}\n display=\"flex\"\n flexDirection=\"column\"\n >\n <StepStraightLineVertical\n height={itemTopMargin}\n isDotted={stepProgress === 'none' || stepProgress === 'end'}\n visibility={shouldShowStartBranch ? 'visible' : 'hidden'}\n />\n <Box marginLeft={makeSize(-spacingTokens.markerLeftAlignment)}>{marker}</Box>\n <StepStraightLineVertical\n isDotted={stepProgress === 'none' || stepProgress === 'start'}\n visibility={shouldShowEndBranch ? 'visible' : 'hidden'}\n />\n </Box>\n );\n};\n\nconst StepLineStart = ({\n marker = defaultMarker,\n stepProgress,\n shouldShowStartBranch,\n shouldShowEndBranch,\n}: StepLineSubComponentProps): React.ReactElement => {\n const { size } = useStepGroup();\n const spacingTokens = getMarkerLineSpacings(size);\n\n return (\n <Box position=\"relative\" display=\"flex\" flexDirection=\"column\">\n <StepStraightLineVertical\n height={itemTopMargin}\n visibility={shouldShowStartBranch ? 'visible' : 'hidden'}\n isDotted={stepProgress === 'none' || stepProgress === 'end'}\n />\n <StepTopCurveVertical\n visibility={shouldShowStartBranch ? 'visible' : 'hidden'}\n isDotted={stepProgress === 'none' || stepProgress === 'end'}\n />\n <Box\n marginLeft={makeSize(-spacingTokens.markerLeftAlignment + spacingTokens.indentationWidth)}\n marginTop={makeSize(spacingTokens.markerTopAlignment)}\n >\n {marker}\n </Box>\n <StepStraightLineVertical\n visibility={shouldShowEndBranch ? 'visible' : 'hidden'}\n marginLeft={makeSize(spacingTokens.indentationWidth)}\n isDotted={stepProgress === 'none' || stepProgress === 'start'}\n />\n </Box>\n );\n};\n\nconst StepLineEnd = ({\n marker = defaultMarker,\n stepProgress,\n shouldShowStartBranch,\n shouldShowEndBranch,\n}: StepLineSubComponentProps): React.ReactElement => {\n const { size } = useStepGroup();\n const spacingTokens = getMarkerLineSpacings(size);\n return (\n <Box position=\"relative\" display=\"flex\" flexDirection=\"column\">\n <StepStraightLineVertical\n visibility={shouldShowStartBranch ? 'visible' : 'hidden'}\n marginLeft={makeSize(spacingTokens.indentationWidth)}\n height={itemTopMargin}\n isDotted={stepProgress === 'none' || stepProgress === 'end'}\n />\n <Box\n marginLeft={makeSize(-spacingTokens.markerLeftAlignment + spacingTokens.indentationWidth)}\n >\n {marker}\n </Box>\n <StepStraightLineVertical\n marginLeft={makeSize(spacingTokens.indentationWidth)}\n visibility={shouldShowEndBranch ? 'visible' : 'hidden'}\n isDotted={stepProgress === 'none' || stepProgress === 'start'}\n />\n <StepBottomCurveVertical\n isDotted={stepProgress === 'none' || stepProgress === 'start'}\n visibility={shouldShowEndBranch ? 'visible' : 'hidden'}\n />\n </Box>\n );\n};\n\nconst StepLineHorizontal = ({\n marker = defaultMarker,\n stepProgress,\n shouldShowStartBranch,\n shouldShowEndBranch,\n}: StepLineSubComponentProps): React.ReactElement => {\n return (\n <Box\n position=\"relative\"\n display=\"flex\"\n flexDirection=\"row\"\n width=\"100%\"\n justifyContent=\"center\"\n alignItems=\"center\"\n >\n <StepStraightLineHorizontal\n isDotted={stepProgress === 'none' || stepProgress === 'end'}\n visibility={shouldShowStartBranch ? 'visible' : 'hidden'}\n />\n <Box>{marker}</Box>\n <StepStraightLineHorizontal\n isDotted={stepProgress === 'none' || stepProgress === 'start'}\n visibility={shouldShowEndBranch ? 'visible' : 'hidden'}\n />\n </Box>\n );\n};\n\nconst StepLineSingleItem = ({\n marker = defaultMarker,\n stepProgress,\n shouldShowEndBranch,\n shouldShowStartBranch,\n}: StepLineSubComponentProps): React.ReactElement => {\n const { size } = useStepGroup();\n const spacingTokens = getMarkerLineSpacings(size);\n return (\n <Box position=\"relative\" display=\"flex\" flexDirection=\"column\">\n <StepStraightLineVertical\n visibility={shouldShowStartBranch ? 'visible' : 'hidden'}\n height={itemTopMargin}\n isDotted={stepProgress === 'none' || stepProgress === 'end'}\n />\n <StepTopCurveVertical\n visibility={shouldShowStartBranch ? 'visible' : 'hidden'}\n isDotted={stepProgress === 'none' || stepProgress === 'end'}\n />\n <Box\n // -12 (markerLeftAlginment) + 33 (indentationWidth)\n marginLeft={makeSize(-spacingTokens.markerLeftAlignment + spacingTokens.indentationWidth)}\n marginTop={makeSize(spacingTokens.markerTopAlignment)}\n >\n {marker}\n </Box>\n <StepStraightLineVertical\n marginLeft={makeSize(spacingTokens.indentationWidth)}\n visibility={shouldShowEndBranch ? 'visible' : 'hidden'}\n isDotted={stepProgress === 'none' || stepProgress === 'start'}\n />\n <StepBottomCurveVertical\n visibility={shouldShowEndBranch ? 'visible' : 'hidden'}\n isDotted={stepProgress === 'none' || stepProgress === 'start'}\n />\n </Box>\n );\n};\n\nconst StepLine = ({\n stepType = 'default',\n shouldShowStartBranch,\n shouldShowEndBranch,\n marker,\n stepProgress,\n}: StepLineProps): React.ReactElement => {\n const { orientation } = useStepGroup();\n const commonProps = {\n shouldShowStartBranch,\n shouldShowEndBranch,\n marker,\n stepProgress,\n };\n\n if (orientation === 'horizontal') {\n return <StepLineHorizontal {...commonProps} />;\n }\n\n if (stepType === 'start') {\n return <StepLineStart {...commonProps} />;\n }\n\n if (stepType === 'middle') {\n return <StepLineVertical {...commonProps} isIndented={true} />;\n }\n\n if (stepType === 'end') {\n return <StepLineEnd {...commonProps} />;\n }\n\n if (stepType === 'single-item') {\n return <StepLineSingleItem {...commonProps} />;\n }\n\n return <StepLineVertical {...commonProps} />;\n};\n\nexport type { StepLineProps };\nexport { StepLine };\n"],"names":["useDottedLineStyles","_ref","arguments","length","undefined","isHorizontal","_useTheme","useTheme","theme","svgString","concat","colors","surface","border","gray","subtle","backgroundURL","encode","backgroundImage","backgroundPosition","backgroundSize","makeSize","markerLineDotWidth","markerLineDotSpacing","backgroundRepeat","StepStraightLineHorizontal","_ref2","isDotted","width","styledProps","_objectWithoutProperties","_excluded","dottedStyles","borderStyles","borderTopWidth","borderTopColor","_jsx","BaseBox","_objectSpread","height","markerLineWidth","flex","StepStraightLineVertical","_ref3","_excluded2","borderLeftWidth","borderLeftColor","StepTopCurveVertical","_ref4","_excluded3","_useTheme2","_jsxs","Svg","marginLeft","viewBox","fill","children","Path","d","stroke","strokeWidth","StepBottomCurveVertical","_ref5","_excluded4","_useTheme3","defaultMarker","StepItemIndicator","color","StepLineVertical","_ref6","_ref6$marker","marker","stepProgress","isIndented","shouldShowStartBranch","shouldShowEndBranch","_useStepGroup","useStepGroup","size","spacingTokens","getMarkerLineSpacings","Box","position","indentationWidth","display","flexDirection","itemTopMargin","visibility","markerLeftAlignment","StepLineStart","_ref7","_ref7$marker","_useStepGroup2","marginTop","markerTopAlignment","StepLineEnd","_ref8","_ref8$marker","_useStepGroup3","StepLineHorizontal","_ref9","_ref9$marker","justifyContent","alignItems","StepLineSingleItem","_ref10","_ref10$marker","_useStepGroup4","StepLine","_ref11","_ref11$stepType","stepType","_useStepGroup5","orientation","commonProps"],"mappings":"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"}

package/build/lib/web/production/components/StepGroup/componentIds.js ADDED Viewed

@@ -0,0 +1,7 @@
+var componentIds = {
+  StepGroup: 'StepGroup',
+  StepItem: 'StepItem'
+};
+export { componentIds };
+//# sourceMappingURL=componentIds.js.map

package/build/lib/web/production/components/StepGroup/componentIds.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"componentIds.js","sources":["../../../../../../src/components/StepGroup/componentIds.ts"],"sourcesContent":["export const componentIds = {\n StepGroup: 'StepGroup',\n StepItem: 'StepItem',\n};\n"],"names":["componentIds","StepGroup","StepItem"],"mappings":"AAAO,IAAMA,YAAY,GAAG;AAC1BC,EAAAA,SAAS,EAAE,WAAW;AACtBC,EAAAA,QAAQ,EAAE,UAAA;AACZ;;;;"}

package/build/lib/web/production/components/StepGroup/index.js ADDED Viewed

@@ -0,0 +1,4 @@
+export { StepGroup } from './StepGroup.web.js';
+export { StepItem } from './StepItem.web.js';
+export { StepItemIcon, StepItemIndicator } from './StepItemMarker.js';
+//# sourceMappingURL=index.js.map

package/build/lib/web/production/components/StepGroup/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/build/lib/web/production/components/StepGroup/tokens.js ADDED Viewed

@@ -0,0 +1,62 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import '../../tokens/global/index.js';
+import { size } from '../../tokens/global/size.js';
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var markerLineDotWidth = size['2'];
+var markerLineDotSpacing = size['4'];
+var markerLineWidth = size['2'];
+var itemTopMargin = size['16'];
+/**
+ * Returns the tokens that are related to marker line alignment and spacing
+ */
+var getMarkerLineSpacings = function getMarkerLineSpacings(size$1) {
+  var indentationWidth = size['33'];
+  var LINE_SPACINGS = {
+    large: {
+      markerBackgroundSize: size['24'],
+      markerMargin: size['2']
+      // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
+    },
+    medium: {
+      markerBackgroundSize: size['20'],
+      markerMargin: size['2']
+    }
+  };
+  var markerLeftAlignment =
+  // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
+  (LINE_SPACINGS[size$1].markerBackgroundSize + LINE_SPACINGS[size$1].markerMargin) / 2;
+  var markerTopAlignment = -1 * (
+  // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
+  LINE_SPACINGS[size$1].markerBackgroundSize + LINE_SPACINGS[size$1].markerMargin * 2 + markerLineWidth) / 2;
+  return _objectSpread(_objectSpread({}, LINE_SPACINGS[size$1]), {}, {
+    markerLeftAlignment: markerLeftAlignment,
+    markerTopAlignment: markerTopAlignment,
+    indentationWidth: indentationWidth
+  });
+};
+var stepItemHeaderTokens = {
+  medium: {
+    title: 'medium',
+    description: 'small',
+    timestamp: 'small'
+  },
+  large: {
+    title: 'large',
+    description: 'medium',
+    timestamp: 'medium'
+  }
+};
+var iconSizeTokens = {
+  medium: 'small',
+  large: 'medium'
+};
+var itemLineGap = {
+  medium: 'spacing.2',
+  large: 'spacing.3'
+};
+export { getMarkerLineSpacings, iconSizeTokens, itemLineGap, itemTopMargin, markerLineDotSpacing, markerLineDotWidth, markerLineWidth, stepItemHeaderTokens };
+//# sourceMappingURL=tokens.js.map

package/build/lib/web/production/components/StepGroup/tokens.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"tokens.js","sources":["../../../../../../src/components/StepGroup/tokens.ts"],"sourcesContent":["import type { StepGroupProps } from './types';\nimport { size as sizeTokens } from '~tokens/global';\n\nconst markerLineDotWidth = sizeTokens['2'];\nconst markerLineDotSpacing = sizeTokens['4'];\nconst markerLineWidth = sizeTokens['2'];\nconst itemTopMargin = sizeTokens['16'];\n\n/**\n * Returns the tokens that are related to marker line alignment and spacing\n */\nconst getMarkerLineSpacings = (\n size: NonNullable<StepGroupProps['size']>,\n): {\n markerLeftAlignment: number;\n markerTopAlignment: number;\n markerBackgroundSize: number;\n markerMargin: number;\n indentationWidth: number;\n} => {\n const indentationWidth = sizeTokens['33'];\n\n const LINE_SPACINGS = {\n large: {\n markerBackgroundSize: sizeTokens['24'],\n markerMargin: sizeTokens['2'],\n // eslint-disable-next-line @typescript-eslint/restrict-plus-operands\n },\n medium: {\n markerBackgroundSize: sizeTokens['20'],\n markerMargin: sizeTokens['2'],\n },\n } as const;\n\n const markerLeftAlignment =\n // eslint-disable-next-line @typescript-eslint/restrict-plus-operands\n (LINE_SPACINGS[size].markerBackgroundSize + LINE_SPACINGS[size].markerMargin) / 2;\n\n const markerTopAlignment =\n (-1 *\n // eslint-disable-next-line @typescript-eslint/restrict-plus-operands\n (LINE_SPACINGS[size].markerBackgroundSize +\n LINE_SPACINGS[size].markerMargin * 2 +\n markerLineWidth)) /\n 2;\n return {\n ...LINE_SPACINGS[size],\n markerLeftAlignment,\n markerTopAlignment,\n indentationWidth,\n };\n};\n\nconst stepItemHeaderTokens = {\n medium: {\n title: 'medium',\n description: 'small',\n timestamp: 'small',\n },\n large: {\n title: 'large',\n description: 'medium',\n timestamp: 'medium',\n },\n} as const;\n\nconst iconSizeTokens = {\n medium: 'small',\n large: 'medium',\n} as const;\n\nconst itemLineGap = {\n medium: 'spacing.2',\n large: 'spacing.3',\n} as const;\n\nexport {\n getMarkerLineSpacings,\n stepItemHeaderTokens,\n iconSizeTokens,\n itemLineGap,\n markerLineDotWidth,\n markerLineDotSpacing,\n markerLineWidth,\n itemTopMargin,\n};\n"],"names":["markerLineDotWidth","sizeTokens","markerLineDotSpacing","markerLineWidth","itemTopMargin","getMarkerLineSpacings","size","indentationWidth","LINE_SPACINGS","large","markerBackgroundSize","markerMargin","medium","markerLeftAlignment","markerTopAlignment","_objectSpread","stepItemHeaderTokens","title","description","timestamp","iconSizeTokens","itemLineGap"],"mappings":";;;;;;AAGA,IAAMA,kBAAkB,GAAGC,IAAU,CAAC,GAAG,EAAC;AAC1C,IAAMC,oBAAoB,GAAGD,IAAU,CAAC,GAAG,EAAC;AAC5C,IAAME,eAAe,GAAGF,IAAU,CAAC,GAAG,EAAC;AACvC,IAAMG,aAAa,GAAGH,IAAU,CAAC,IAAI,EAAC;;AAEtC;AACA;AACA;AACA,IAAMI,qBAAqB,GAAG,SAAxBA,qBAAqBA,CACzBC,MAAyC,EAOtC;AACH,EAAA,IAAMC,gBAAgB,GAAGN,IAAU,CAAC,IAAI,CAAC,CAAA;AAEzC,EAAA,IAAMO,aAAa,GAAG;AACpBC,IAAAA,KAAK,EAAE;AACLC,MAAAA,oBAAoB,EAAET,IAAU,CAAC,IAAI,CAAC;MACtCU,YAAY,EAAEV,IAAU,CAAC,GAAG,CAAA;AAC5B;KACD;AACDW,IAAAA,MAAM,EAAE;AACNF,MAAAA,oBAAoB,EAAET,IAAU,CAAC,IAAI,CAAC;MACtCU,YAAY,EAAEV,IAAU,CAAC,GAAG,CAAA;AAC9B,KAAA;GACQ,CAAA;AAEV,EAAA,IAAMY,mBAAmB;AACvB;AACA,EAAA,CAACL,aAAa,CAACF,MAAI,CAAC,CAACI,oBAAoB,GAAGF,aAAa,CAACF,MAAI,CAAC,CAACK,YAAY,IAAI,CAAC,CAAA;EAEnF,IAAMG,kBAAkB,GACrB,CAAC,CAAC;AACD;AACCN,EAAAA,aAAa,CAACF,MAAI,CAAC,CAACI,oBAAoB,GACvCF,aAAa,CAACF,MAAI,CAAC,CAACK,YAAY,GAAG,CAAC,GACpCR,eAAe,CAAC,GACpB,CAAC,CAAA;AACH,EAAA,OAAAY,aAAA,CAAAA,aAAA,KACKP,aAAa,CAACF,MAAI,CAAC,CAAA,EAAA,EAAA,EAAA;AACtBO,IAAAA,mBAAmB,EAAnBA,mBAAmB;AACnBC,IAAAA,kBAAkB,EAAlBA,kBAAkB;AAClBP,IAAAA,gBAAgB,EAAhBA,gBAAAA;AAAgB,GAAA,CAAA,CAAA;AAEpB,EAAC;AAED,IAAMS,oBAAoB,GAAG;AAC3BJ,EAAAA,MAAM,EAAE;AACNK,IAAAA,KAAK,EAAE,QAAQ;AACfC,IAAAA,WAAW,EAAE,OAAO;AACpBC,IAAAA,SAAS,EAAE,OAAA;GACZ;AACDV,EAAAA,KAAK,EAAE;AACLQ,IAAAA,KAAK,EAAE,OAAO;AACdC,IAAAA,WAAW,EAAE,QAAQ;AACrBC,IAAAA,SAAS,EAAE,QAAA;AACb,GAAA;AACF,EAAU;AAEV,IAAMC,cAAc,GAAG;AACrBR,EAAAA,MAAM,EAAE,OAAO;AACfH,EAAAA,KAAK,EAAE,QAAA;AACT,EAAU;AAEV,IAAMY,WAAW,GAAG;AAClBT,EAAAA,MAAM,EAAE,WAAW;AACnBH,EAAAA,KAAK,EAAE,WAAA;AACT;;;;"}