@ledgerhq/react-ui 0.45.0 → 0.46.0-nightly.20260217030329

package/lib/cjs/components/layout/List/NumberedList/index.js.map

@@ -1,7 +1 @@
-{
-  "version": 3,
-  "sources": ["../../../../../../src/components/layout/List/NumberedList/index.tsx"],
-  "sourcesContent": ["import React from \"react\";\nimport styled, { useTheme } from \"styled-components\";\nimport Flex from \"../../Flex\";\nimport Text from \"../../../asorted/Text\";\nimport { rgba } from \"../../../../styles/helpers\";\n\nexport type Item = {\n  element: React.ReactNode | string;\n};\n\nexport type Props = {\n  steps: Item[];\n  bgIndexColor?: string;\n  indexColor?: string;\n  textColor?: string;\n};\n\nexport default function NumberedList({ steps, bgIndexColor, indexColor, textColor }: Props) {\n  const { colors } = useTheme();\n  const backgroundIndexColor = bgIndexColor ?? colors.primary.c80;\n  const indexTextColor = indexColor ?? colors.neutral.c00;\n  const mainTextColor = textColor ?? rgba(colors.neutral.c100, 0.7);\n  return (\n    <Flex flexDirection=\"column\" rowGap={\"14px\"}>\n      {steps?.map((step, index) => (\n        <Flex key={index} flexDirection=\"row\" alignItems=\"center\">\n          {NumberItem(index + 1, backgroundIndexColor, indexTextColor)}\n\n          {typeof step.element === \"string\" ? (\n            <Text\n              key={index}\n              fontSize={14}\n              variant=\"body\"\n              color={mainTextColor}\n              ml=\"12px\"\n              fontWeight=\"500\"\n              flex={1}\n            >\n              {step.element}\n            </Text>\n          ) : (\n            step.element\n          )}\n        </Flex>\n      ))}\n    </Flex>\n  );\n}\n\nconst NumberItem = (index: number, bgColor: string, color: string) => {\n  return (\n    <StyledNumberItem bgColor={bgColor}>\n      <Text color={color} fontWeight=\"900\" fontSize={\"11px\"}>\n        {index}\n      </Text>\n    </StyledNumberItem>\n  );\n};\n\nconst StyledNumberItem = styled(Flex)<{ bgColor: string }>`\n  border-radius: 50%;\n  background-color: ${p => p.bgColor};\n  align-items: center;\n  justify-content: center;\n  height: 16px;\n  width: 16px;\n`;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,+BAAiC;AACjC,kBAAiB;AACjB,kBAAiB;AACjB,qBAAqB;AAaN,SAAR,aAA8B,EAAE,OAAO,cAAc,YAAY,UAAU,GAAU;AAC1F,QAAM,EAAE,OAAO,QAAI,mCAAS;AAC5B,QAAM,uBAAuB,gBAAgB,OAAO,QAAQ;AAC5D,QAAM,iBAAiB,cAAc,OAAO,QAAQ;AACpD,QAAM,gBAAgB,iBAAa,qBAAK,OAAO,QAAQ,MAAM,GAAG;AAChE,SACE,6BAAAA,QAAA,cAAC,YAAAC,SAAA,EAAK,eAAc,UAAS,QAAQ,UAClC,+BAAO,IAAI,CAAC,MAAM,UACjB,6BAAAD,QAAA,cAAC,YAAAC,SAAA,EAAK,KAAK,OAAO,eAAc,OAAM,YAAW,YAC9C,WAAW,QAAQ,GAAG,sBAAsB,cAAc,GAE1D,OAAO,KAAK,YAAY,WACvB,6BAAAD,QAAA;AAAA,IAAC,YAAAE;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,UAAU;AAAA,MACV,SAAQ;AAAA,MACR,OAAO;AAAA,MACP,IAAG;AAAA,MACH,YAAW;AAAA,MACX,MAAM;AAAA;AAAA,IAEL,KAAK;AAAA,EACR,IAEA,KAAK,OAET,EAEJ;AAEJ;AAEA,MAAM,aAAa,CAAC,OAAe,SAAiB,UAAkB;AACpE,SACE,6BAAAF,QAAA,cAAC,oBAAiB,WAChB,6BAAAA,QAAA,cAAC,YAAAE,SAAA,EAAK,OAAc,YAAW,OAAM,UAAU,UAC5C,KACH,CACF;AAEJ;AAEA,MAAM,uBAAmB,yBAAAC,SAAO,YAAAF,OAAI;AAAA;AAAA,sBAEd,OAAK,EAAE,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": ["React", "Flex", "Text", "styled"]
-}
+{"version":3,"file":"components/layout/List/NumberedList/index.js","sources":["webpack://@ledgerhq/react-ui/./src/components/asorted/Text/index.tsx","webpack://@ledgerhq/react-ui/./src/components/asorted/Text/styles.ts","webpack://@ledgerhq/react-ui/./src/components/layout/Flex/index.ts","webpack://@ledgerhq/react-ui/./src/components/styled.ts","webpack://@ledgerhq/react-ui/./src/styles/helpers.ts","webpack://@ledgerhq/react-ui/./src/styles/styled/fontFamily.ts","webpack://@ledgerhq/react-ui/./src/styles/system/gaps.ts","webpack://@ledgerhq/react-ui/./src/styles/theme.ts","webpack://@ledgerhq/react-ui/webpack/runtime/compat_get_default_export","webpack://@ledgerhq/react-ui/webpack/runtime/define_property_getters","webpack://@ledgerhq/react-ui/webpack/runtime/has_own_property","webpack://@ledgerhq/react-ui/webpack/runtime/make_namespace_object","webpack://@ledgerhq/react-ui/./src/components/layout/List/NumberedList/index.tsx"],"sourcesContent":["import baseStyled, { BaseStyledProps } from \"../../styled\";\nimport {\n  compose,\n  fontSize,\n  fontWeight,\n  textAlign,\n  lineHeight,\n  letterSpacing,\n  system,\n} from \"styled-system\";\nimport fontFamily from \"../../../styles/styled/fontFamily\";\nimport { TextVariants } from \"../../../styles/theme\";\nimport { textVariantStyle } from \"./styles\";\n\nconst uppercase = system({\n  uppercase: {\n    property: \"textTransform\",\n    transform: value => (value ? \"uppercase\" : \"none\"),\n  },\n});\n\ntype FontFamilies =\n  | \"Inter|ExtraLight\"\n  | \"Inter|Light\"\n  | \"Inter|Regular\"\n  | \"Inter|Medium\"\n  | \"Inter|SemiBold\"\n  | \"Inter|Bold\"\n  | \"Inter|ExtraBold\"\n  | \"Alpha|Medium\";\n\ntype WhiteSpace = \"normal\" | \"nowrap\" | \"pre\" | \"pre-line\" | \"pre-wrap\";\n\nexport interface TextProps extends BaseStyledProps {\n  fontFamily?: string;\n  ff?: FontFamilies;\n  fontSize?: number | string | TextVariants;\n  variant?: TextVariants;\n  textAlign?: string;\n  fontWeight?: string;\n  lineHeight?: string;\n  textTransform?: string;\n  textOverflow?: string;\n  uppercase?: boolean;\n  whiteSpace?: WhiteSpace;\n}\n\nconst Text = baseStyled.span.attrs<TextProps, TextProps>(\n  ({ variant = \"body\", fontSize, color }) => ({\n    fontSize: fontSize ? fontSize : variant,\n    color: color || \"neutral.c100\",\n  }),\n)`\n  font-weight: 500;\n  white-space: ${props => props.whiteSpace ?? \"normal\"};\n  ${(p: TextProps) => textVariantStyle[p.variant || \"body\"]}\n  ${compose(\n    uppercase,\n    lineHeight,\n    fontFamily,\n    fontSize,\n    textAlign,\n    fontWeight,\n    letterSpacing,\n    system({\n      textOverflow: true,\n    }),\n  )}\n  ${p => (p.textTransform ? `text-transform: ${p.textTransform};` : \"\")}\n`;\n\nexport default Text;\n","import { GlobalStyleProps } from \"../../../styles/global\";\nimport { css } from \"styled-components\";\nimport { TextVariants } from \"../../../styles/theme\";\n\nconst getFontSource = (name: string) => (props: GlobalStyleProps) => {\n  const fontsPath = props.fontsPath ?? \"assets/fonts\";\n  const fontName = (props.fontMappings && props.fontMappings(name)) || `${name}.woff2`;\n  return `url(\"${fontsPath}/${fontName}\") format(\"woff2\")`;\n};\n\nexport const fontStyles = css`\n  @font-face {\n    font-family: \"Inter\";\n    src: ${getFontSource(\"Inter-ExtraLight-BETA\")};\n    font-weight: 100;\n    font-style: normal;\n  }\n\n  @font-face {\n    font-family: \"Inter\";\n    src: ${getFontSource(\"Inter-Light-BETA\")};\n    font-weight: 300;\n    font-style: normal;\n  }\n\n  @font-face {\n    font-family: \"Inter\";\n    src: ${getFontSource(\"Inter-Regular\")};\n    font-weight: 400;\n    font-style: normal;\n  }\n\n  @font-face {\n    font-family: \"Inter\";\n    src: ${getFontSource(\"Inter-Medium\")};\n    font-weight: 500;\n    font-style: normal;\n  }\n\n  @font-face {\n    font-family: \"Inter\";\n    src: ${getFontSource(\"Inter-SemiBold\")};\n    font-weight: 600;\n    font-style: normal;\n  }\n\n  @font-face {\n    font-family: \"Inter\";\n    src: ${getFontSource(\"Inter-ExtraBold\")};\n    font-weight: 900;\n    font-style: normal;\n  }\n\n  @font-face {\n    font-family: \"Alpha\";\n    src: ${getFontSource(\"HMAlphaMono-Medium\")};\n    font-weight: 500;\n    font-style: normal;\n  }\n`;\n\nexport const textVariantStyle: Record<\n  TextVariants,\n  {\n    fontFamily: string;\n    lineHeight?: string | number;\n    fontWeight?: number;\n    \"text-transform\"?: string;\n  }\n> = {\n  h1: {\n    fontFamily: \"Alpha, Inter, Sans\",\n    fontWeight: 500,\n    \"text-transform\": \"uppercase\",\n  },\n  h1Inter: {\n    fontFamily: \"Inter, Sans\",\n    fontWeight: 500,\n    \"text-transform\": \"uppercase\",\n  },\n  h2: {\n    fontFamily: \"Alpha, Inter, Sans\",\n    fontWeight: 500,\n    \"text-transform\": \"uppercase\",\n  },\n  h2Inter: {\n    fontFamily: \"Inter, Sans\",\n    fontWeight: 500,\n    \"text-transform\": \"uppercase\",\n  },\n  h3: {\n    fontFamily: \"Alpha, Inter, Sans\",\n    fontWeight: 500,\n    \"text-transform\": \"uppercase\",\n  },\n  h3Inter: {\n    fontFamily: \"Inter, Sans\",\n    fontWeight: 500,\n  },\n  h4: {\n    fontFamily: \"Alpha, Inter, Sans\",\n    fontWeight: 500,\n    \"text-transform\": \"uppercase\",\n  },\n  h4Inter: {\n    fontFamily: \"Inter, Sans\",\n    fontWeight: 600,\n  },\n  h5: {\n    fontFamily: \"Alpha, Inter, Sans\",\n    fontWeight: 500,\n    \"text-transform\": \"uppercase\",\n  },\n  h5Inter: {\n    fontFamily: \"Inter, Sans\",\n    fontWeight: 500,\n  },\n  large: {\n    fontFamily: \"Inter, Sans\",\n  },\n  largeLineHeight: {\n    fontFamily: \"Inter, Sans\",\n    lineHeight: 1.7,\n  },\n  body: {\n    fontFamily: \"Inter, Sans\",\n  },\n  bodyLineHeight: {\n    fontFamily: \"Inter, Sans\",\n    lineHeight: 1.7,\n  },\n  paragraph: {\n    fontFamily: \"Inter, Sans\",\n  },\n  paragraphLineHeight: {\n    fontFamily: \"Inter, Sans\",\n    lineHeight: 1.7,\n  },\n  small: {\n    fontFamily: \"Inter, Sans\",\n  },\n  extraSmall: {\n    fontFamily: \"Inter, Sans\",\n  },\n  tiny: {\n    fontFamily: \"Inter, Sans\",\n  },\n  micro: {\n    fontFamily: \"Inter, Sans\",\n  },\n  subtitle: {\n    fontFamily: \"Inter, Sans\",\n    fontWeight: 600,\n    \"text-transform\": \"uppercase\",\n  },\n};\n","import baseStyled, { BaseStyledProps } from \"../../styled\";\n\nconst FlexBox = baseStyled.div.attrs<BaseStyledProps, BaseStyledProps>({ display: \"flex\" })``;\nexport type FlexBoxProps = BaseStyledProps & React.HTMLAttributes<HTMLDivElement>;\n\nexport default FlexBox;\n","import gaps from \"../styles/system/gaps\";\nimport styled, { StyledInterface, InterpolationFunction } from \"styled-components\";\nimport {\n  compose,\n  flexbox,\n  FlexboxProps,\n  space,\n  SpaceProps,\n  position,\n  PositionProps,\n  color,\n  ColorProps,\n  layout,\n  LayoutProps,\n  overflow,\n  OverflowProps,\n  border,\n  BorderProps,\n} from \"styled-system\";\n\nexport type BaseStyledProps = SpaceProps &\n  FlexboxProps &\n  PositionProps &\n  ColorProps &\n  LayoutProps &\n  BorderProps &\n  OverflowProps & {\n    /**\n     * The columnGap CSS property sets the size of the gap (gutter) between an element's grid columns.\n     */\n    columnGap?: string | number;\n    /**\n     * The rowGap CSS property sets the size of the gap (gutter) between an element's grid rows.\n     */\n    rowGap?: string | number;\n    color?: string;\n  };\n\nexport const baseStyles: InterpolationFunction<unknown> = compose(\n  flexbox,\n  space,\n  position,\n  color,\n  layout,\n  overflow,\n  gaps,\n  border,\n);\n\nconst proxyStyled = new Proxy(styled, {\n  apply(target: typeof styled, thisArg, argumentsList: Parameters<typeof styled>) {\n    return styled(target.apply(thisArg, argumentsList)(baseStyles));\n  },\n  get(target, property: keyof typeof styled) {\n    if (typeof target[property] === \"function\") {\n      return styled(target[property].apply(styled, [baseStyles]));\n    }\n    return target[property];\n  },\n});\n\nexport default <StyledInterface>proxyStyled;\n","import Color from \"color\";\n\nimport { fontFamilies } from \"./theme\";\n\nexport const rgba = (c: string, a: number): string => Color(c).alpha(a).rgb().toString();\n\nexport const darken = (c: string, a: number): string => Color(c).darken(a).toString();\n\nexport const lighten = (c: string, a: number): string => Color(c).lighten(a).toString();\n\nexport const mix = (c: string, b: string, a: number): string =>\n  Color(c).mix(Color(b), a).toString();\n\nexport const ff = (v: string) => {\n  const [font, type = \"Regular\"] = v.split(\"|\");\n  // @ts-expect-error FIXME\n  const { style, weight } = fontFamilies[font][type];\n  // @ts-expect-error FIXME\n  const fallback: string = fontFamilies[font].fallback ?? \"Arial\";\n\n  return {\n    fontFamily: `${font}, ${fallback}`,\n    fontWeight: weight,\n    fontStyle: style,\n  };\n};\n\nexport const ensureContrast = (color1: string, color2: string) => {\n  const colorL1 = Color(color1).luminosity() + 0.05;\n  const colorL2 = Color(color2).luminosity() + 0.05;\n\n  const lRatio = colorL1 > colorL2 ? colorL1 / colorL2 : colorL2 / colorL1;\n\n  if (lRatio < 1.5) {\n    return Color(color1).rotate(180).negate().string();\n  }\n  return color1;\n};\n","import { ff } from \"../helpers\";\n\nexport default (props: { ff?: string }) => {\n  const prop = props.ff;\n\n  if (prop == null) {\n    return null;\n  }\n\n  return ff(prop);\n};\n","import { system } from \"styled-system\";\n\nconst gaps = system({\n  rowGap: { property: \"rowGap\", scale: \"space\" },\n  columnGap: { property: \"columnGap\", scale: \"space\" },\n});\n\nexport default gaps;\n","import { keyframes, css, Font } from \"styled-components\";\nimport { palettes, ColorPalette } from \"@ledgerhq/ui-shared\";\n\nexport type screensBreakpoints = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\";\n\nexport const breakpoints = {\n  sm: \"640px\",\n  md: \"768px\",\n  lg: \"1024px\",\n  xl: \"1280px\",\n  xxl: \"1536px\",\n} as Record<screensBreakpoints, string>;\n\nexport const space = [\n  /* space indexes:\n  0, 1, 2, 3, 4,  5,  6,  7,  8,  9,  10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21 */\n  0, 2, 4, 8, 10, 12, 16, 20, 24, 28, 32, 36, 40, 44, 48, 52, 56, 60, 64, 68, 72, 76,\n];\n\nexport type TextVariants =\n  | \"h1\"\n  | \"h1Inter\"\n  | \"h2\"\n  | \"h2Inter\"\n  | \"h3\"\n  | \"h3Inter\"\n  | \"h4\"\n  | \"h4Inter\"\n  | \"h5\"\n  | \"h5Inter\"\n  | \"large\"\n  | \"largeLineHeight\"\n  | \"body\"\n  | \"bodyLineHeight\"\n  | \"paragraph\"\n  | \"paragraphLineHeight\"\n  | \"small\"\n  | \"extraSmall\"\n  | \"tiny\"\n  | \"micro\"\n  | \"subtitle\";\n\nexport type ThemeScale<Type, Aliases extends string> = Array<Type> & Record<Aliases, Type>;\n\nexport const fontSizes = [8, 10, 11, 12, 13, 14, 16, 20, 24, 28, 32, 36] as ThemeScale<\n  number,\n  TextVariants\n>;\n\n[\n  fontSizes.micro,\n  fontSizes.tiny,\n  fontSizes.extraSmall,\n  fontSizes.small,\n  fontSizes.paragraph,\n  fontSizes.body,\n  fontSizes.large,\n  fontSizes.h5,\n  fontSizes.h4,\n  fontSizes.h3,\n  fontSizes.h2,\n  fontSizes.h1,\n] = fontSizes;\nfontSizes.largeLineHeight = fontSizes.large;\nfontSizes.bodyLineHeight = fontSizes.body;\nfontSizes.paragraphLineHeight = fontSizes.paragraph;\nfontSizes.subtitle = fontSizes.extraSmall;\nfontSizes.h1Inter = fontSizes.h1;\nfontSizes.h2Inter = fontSizes.h2;\nfontSizes.h3Inter = fontSizes.h3;\nfontSizes.h4Inter = fontSizes.h4;\nfontSizes.h5Inter = fontSizes.h5;\n\nconst fontWeights = {\n  extraLight: \"100\",\n  light: \"300\",\n  regular: \"400\",\n  medium: \"500\",\n  semiBold: \"600\",\n  bold: \"700\",\n  extraBold: \"800\",\n};\n\nexport const radii = [0, 4, 8, 12, 16, 20];\nexport const shadows = [\"0 4px 8px 0 rgba(0, 0, 0, 0.03)\"];\nexport const zIndexes = [-1, 0, 1, 9, 10, 90, 100, 900, 1000];\n\n// Those fonts are now defined in global.css, this is just a mapping for styled-system\nexport const fontFamilies = {\n  Inter: {\n    ExtraLight: {\n      weight: 100,\n      style: \"normal\",\n    },\n    Light: {\n      weight: 300,\n      style: \"normal\",\n    },\n    Regular: {\n      weight: 400,\n      style: \"normal\",\n    },\n    Medium: {\n      weight: 500,\n      style: \"normal\",\n    },\n    SemiBold: {\n      weight: 600,\n      style: \"normal\",\n    },\n    Bold: {\n      weight: 700,\n      style: \"normal\",\n    },\n    ExtraBold: {\n      weight: 800,\n      style: \"normal\",\n    },\n  },\n  Alpha: {\n    Medium: {\n      weight: 500,\n      style: \"normal\",\n    },\n  },\n};\n\nconst animationDuration = \"0.33s\";\nconst easings = {\n  outQuadratic: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\n};\n\nconst transition = (\n  properties = [\"all\"],\n  duration = animationDuration,\n  easing = easings.outQuadratic,\n) => css`\n  transition-property: ${properties.join(\",\")};\n  transition-duration: ${duration};\n  transition-timing-function: ${easing};\n`;\n\nconst fadeIn = keyframes`\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  `;\nconst fadeOut = keyframes`\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n    }\n  `;\nconst fadeInGrowX = keyframes`\n    0% {\n      opacity: 0;\n      transform: scaleX(0);\n    }\n    100% {\n      opacity: 1;\n      transform: scaleX(1);\n    }\n`;\nconst fadeInUp = keyframes`\n    0% {\n      opacity: 0;\n      transform: translateY(66%);\n    }\n    100% {\n      opacity: 1;\n      transform: translateY(0%);\n    }\n  `;\nconst animations = {\n  fadeIn: () => css`\n    ${fadeIn} ${animationDuration} ${easings.outQuadratic} forwards\n  `,\n  fadeOut: () => css`\n    ${fadeOut} ${animationDuration} ${easings.outQuadratic} forwards\n  `,\n  fadeInGrowX: () => css`\n    ${fadeInGrowX} 0.6s ${easings.outQuadratic} forwards\n  `,\n  fadeInUp: () => css`\n    ${fadeInUp} ${animationDuration} ${easings.outQuadratic} forwards\n  `,\n};\nconst overflow = {\n  x: css`\n    overflow-y: hidden;\n    overflow-x: scroll;\n    will-change: transform;\n    &:hover {\n      --track-color: ${p => p.theme.colors.neutral.c30};\n    }\n  `,\n  y: css`\n    overflow-x: hidden;\n    overflow-y: scroll;\n    will-change: transform;\n    &:hover {\n      --track-color: ${p => p.theme.colors.neutral.c30};\n    }\n  `,\n  yAuto: css`\n    overflow-x: hidden;\n    overflow-y: auto;\n    will-change: transform;\n    &:hover {\n      --track-color: ${p => p.theme.colors.neutral.c30};\n    }\n  `,\n  xy: css`\n    overflow: scroll;\n    will-change: transform;\n    &:hover {\n      --track-color: ${p => p.theme.colors.neutral.c30};\n    }\n  `,\n  trackSize: 12,\n};\n\ninterface DefaultTheme {\n  theme: \"dark\" | \"light\";\n  animations: typeof animations;\n  transition: typeof transition;\n  overflow: typeof overflow;\n  sizes: {\n    topBarHeight: number;\n    sideBarWidth: number;\n    drawer: {\n      side: {\n        big: {\n          width: number;\n        };\n        small: {\n          width: number;\n        };\n      };\n      popin: {\n        min: {\n          height: number;\n          width: number;\n        };\n        max: {\n          height: number;\n          width: number;\n        };\n      };\n    };\n  };\n  radii: number[];\n  fontFamilies: Record<string, Record<string, Font>>;\n  fontSizes: number[];\n  space: number[];\n  shadows: string[];\n  colors: ColorPalette;\n  fontWeights: Record<string, string>;\n  breakpoints: Record<screensBreakpoints, string>;\n  zIndexes: number[];\n}\n\nconst theme: DefaultTheme = {\n  theme: \"light\",\n  sizes: {\n    drawer: {\n      side: {\n        big: {\n          width: 580,\n        },\n        small: {\n          width: 420,\n        },\n      },\n      popin: {\n        min: {\n          height: 158,\n          width: 462,\n        },\n        max: {\n          height: 522,\n          width: 622,\n        },\n      },\n    },\n    topBarHeight: 58,\n    sideBarWidth: 230,\n  },\n  radii,\n  fontFamilies,\n  fontSizes,\n  fontWeights,\n  space,\n  shadows,\n  colors: palettes.light,\n  animations,\n  overflow,\n  transition,\n  zIndexes,\n  breakpoints,\n};\n\nexport default theme;\nexport type Theme = DefaultTheme;\n","// getDefaultExport function for compatibility with non-ESM modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};\n","__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n        if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n            Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n        }\n    }\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import React from \"react\";\nimport styled, { useTheme } from \"styled-components\";\nimport Flex from \"../../Flex\";\nimport Text from \"../../../asorted/Text\";\nimport { rgba } from \"../../../../styles/helpers\";\n\nexport type Item = {\n  element: React.ReactNode | string;\n};\n\nexport type Props = {\n  steps: Item[];\n  bgIndexColor?: string;\n  indexColor?: string;\n  textColor?: string;\n};\n\nexport default function NumberedList({ steps, bgIndexColor, indexColor, textColor }: Props) {\n  const { colors } = useTheme();\n  const backgroundIndexColor = bgIndexColor ?? colors.primary.c80;\n  const indexTextColor = indexColor ?? colors.neutral.c00;\n  const mainTextColor = textColor ?? rgba(colors.neutral.c100, 0.7);\n  return (\n    <Flex flexDirection=\"column\" rowGap={\"14px\"}>\n      {steps?.map((step, index) => (\n        <Flex key={index} flexDirection=\"row\" alignItems=\"center\">\n          {NumberItem(index + 1, backgroundIndexColor, indexTextColor)}\n\n          {typeof step.element === \"string\" ? (\n            <Text\n              key={index}\n              fontSize={14}\n              variant=\"body\"\n              color={mainTextColor}\n              ml=\"12px\"\n              fontWeight=\"500\"\n              flex={1}\n            >\n              {step.element}\n            </Text>\n          ) : (\n            step.element\n          )}\n        </Flex>\n      ))}\n    </Flex>\n  );\n}\n\nconst NumberItem = (index: number, bgColor: string, color: string) => {\n  return (\n    <StyledNumberItem bgColor={bgColor}>\n      <Text color={color} fontWeight=\"900\" fontSize={\"11px\"}>\n        {index}\n      </Text>\n    </StyledNumberItem>\n  );\n};\n\nconst StyledNumberItem = styled(Flex)<{ bgColor: string }>`\n  border-radius: 50%;\n  background-color: ${p => p.bgColor};\n  align-items: center;\n  justify-content: center;\n  height: 16px;\n  width: 16px;\n`;\n"],"names":["baseStyled","compose","fontSize","fontWeight","textAlign","lineHeight","letterSpacing","system","fontFamily","textVariantStyle","uppercase","value","Text","variant","color","props","p","css","getFontSource","name","fontsPath","fontName","fontStyles","FlexBox","gaps","styled","flexbox","space","position","layout","overflow","border","baseStyles","proxyStyled","Proxy","target","thisArg","argumentsList","property","Color","fontFamilies","rgba","c","a","darken","lighten","mix","b","ff","v","font","type","style","weight","fallback","ensureContrast","color1","color2","colorL1","colorL2","lRatio","prop","keyframes","palettes","breakpoints","fontSizes","fontWeights","radii","shadows","zIndexes","animationDuration","easings","transition","properties","duration","easing","fadeIn","fadeOut","fadeInGrowX","fadeInUp","animations","theme","React","useTheme","Flex","NumberedList","steps","bgIndexColor","indexColor","textColor","colors","backgroundIndexColor","indexTextColor","mainTextColor","step","index","NumberItem","bgColor","StyledNumberItem"],"mappings":"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"}

package/lib/cjs/components/layout/List/VerticalTimeline/TimelineIndicator.js

@@ -1,98 +1,238 @@
+(() => {
 "use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
+var __webpack_modules__ = ({
+3696(__unused_rspack_module, __webpack_exports__, __webpack_require__) {
+__webpack_require__.d(__webpack_exports__, {
+  "default": () => (__rspack_default_export)
+});
+/* import */ var _styled__rspack_import_0 = __webpack_require__(7680);
+
+const FlexBox = _styled__rspack_import_0["default"].div.attrs({
+    display: "flex"
+})``;
+/* export default */ const __rspack_default_export = (FlexBox);
+
+
+},
+7680(__unused_rspack_module, __webpack_exports__, __webpack_require__) {
+__webpack_require__.d(__webpack_exports__, {
+  "default": () => (__rspack_default_export)
+});
+/* import */ var _styles_system_gaps__rspack_import_2 = __webpack_require__(4182);
+/* import */ var styled_components__rspack_import_0 = __webpack_require__(2770);
+/* import */ var styled_components__rspack_import_0_default = /*#__PURE__*/__webpack_require__.n(styled_components__rspack_import_0);
+/* import */ var styled_system__rspack_import_1 = __webpack_require__(9351);
+/* import */ var styled_system__rspack_import_1_default = /*#__PURE__*/__webpack_require__.n(styled_system__rspack_import_1);
+
+
+
+const baseStyles = (0,styled_system__rspack_import_1.compose)(styled_system__rspack_import_1.flexbox, styled_system__rspack_import_1.space, styled_system__rspack_import_1.position, styled_system__rspack_import_1.color, styled_system__rspack_import_1.layout, styled_system__rspack_import_1.overflow, _styles_system_gaps__rspack_import_2["default"], styled_system__rspack_import_1.border);
+const proxyStyled = new Proxy((styled_components__rspack_import_0_default()), {
+    apply (target, thisArg, argumentsList) {
+        return styled_components__rspack_import_0_default()(target.apply(thisArg, argumentsList)(baseStyles));
+    },
+    get (target, property) {
+        if (typeof target[property] === "function") {
+            return styled_components__rspack_import_0_default()(target[property].apply((styled_components__rspack_import_0_default()), [
+                baseStyles
+            ]));
+        }
+        return target[property];
+    }
+});
+/* export default */ const __rspack_default_export = (proxyStyled);
+
+
+},
+4182(__unused_rspack_module, __webpack_exports__, __webpack_require__) {
+__webpack_require__.d(__webpack_exports__, {
+  "default": () => (__rspack_default_export)
+});
+/* import */ var styled_system__rspack_import_0 = __webpack_require__(9351);
+/* import */ var styled_system__rspack_import_0_default = /*#__PURE__*/__webpack_require__.n(styled_system__rspack_import_0);
+
+const gaps = (0,styled_system__rspack_import_0.system)({
+    rowGap: {
+        property: "rowGap",
+        scale: "space"
+    },
+    columnGap: {
+        property: "columnGap",
+        scale: "space"
+    }
+});
+/* export default */ const __rspack_default_export = (gaps);
+
+
+},
+2015(module) {
+module.exports = require("react");
+
+},
+2770(module) {
+module.exports = require("styled-components");
+
+},
+9351(module) {
+module.exports = require("styled-system");
+
+},
+
+});
+// The module cache
+var __webpack_module_cache__ = {};
+
+// The require function
+function __webpack_require__(moduleId) {
+
+// Check if module is in cache
+var cachedModule = __webpack_module_cache__[moduleId];
+if (cachedModule !== undefined) {
+return cachedModule.exports;
+}
+// Create a new module (and put it into the cache)
+var module = (__webpack_module_cache__[moduleId] = {
+exports: {}
+});
+// Execute the module function
+__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+
+// Return the exports of the module
+return module.exports;
+
+}
+
+// webpack/runtime/compat_get_default_export
+(() => {
+// getDefaultExport function for compatibility with non-ESM modules
+__webpack_require__.n = (module) => {
+	var getter = module && module.__esModule ?
+		() => (module['default']) :
+		() => (module);
+	__webpack_require__.d(getter, { a: getter });
+	return getter;
+};
+
+})();
+// webpack/runtime/define_property_getters
+(() => {
+__webpack_require__.d = (exports, definition) => {
+	for(var key in definition) {
+        if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+            Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+        }
+    }
 };
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
+})();
+// webpack/runtime/has_own_property
+(() => {
+__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+})();
+// webpack/runtime/make_namespace_object
+(() => {
+// define __esModule on exports
+__webpack_require__.r = (exports) => {
+	if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+		Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+	}
+	Object.defineProperty(exports, '__esModule', { value: true });
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var TimelineIndicator_exports = {};
-__export(TimelineIndicator_exports, {
-  default: () => TimelineIndicator_default
+})();
+var __webpack_exports__ = {};
+// This entry needs to be wrapped in an IIFE because it needs to be isolated against other modules in the chunk.
+(() => {
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  "default": () => (/* binding */ VerticalTimeline_TimelineIndicator)
 });
-module.exports = __toCommonJS(TimelineIndicator_exports);
-var import_react = __toESM(require("react"));
-var import_CircledCheckSolidMedium = __toESM(require("@ledgerhq/icons-ui/reactLegacy/CircledCheckSolidMedium"));
-var import_styled_components = __toESM(require("styled-components"));
-var import_Flex = __toESM(require("../../Flex"));
+
+// EXTERNAL MODULE: external "react"
+var external_react_ = __webpack_require__(2015);
+var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_);
+;// CONCATENATED MODULE: external "@ledgerhq/icons-ui/reactLegacy/CircledCheckSolidMedium"
+const CircledCheckSolidMedium_namespaceObject = require("@ledgerhq/icons-ui/reactLegacy/CircledCheckSolidMedium");
+var CircledCheckSolidMedium_default = /*#__PURE__*/__webpack_require__.n(CircledCheckSolidMedium_namespaceObject);
+// EXTERNAL MODULE: external "styled-components"
+var external_styled_components_ = __webpack_require__(2770);
+var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
+// EXTERNAL MODULE: ./src/components/layout/Flex/index.ts
+var Flex = __webpack_require__(3696);
+;// CONCATENATED MODULE: ./src/components/layout/List/VerticalTimeline/TimelineIndicator.tsx
+
+
+
+
 const linesWidth = 2;
-const BottomSegment = (0, import_styled_components.default)(import_Flex.default)`
+const BottomSegment = external_styled_components_default()((0,Flex["default"]))`
   flex: 1;
-  border-left-width: ${(p) => p.hidden ? 0 : linesWidth}px;
+  border-left-width: ${(p)=>p.hidden ? 0 : linesWidth}px;
   border-right-width: 0;
   border-style: dashed;
-  border-color: ${(p) => p.status === "completed" ? p.theme.colors.primary.c80 : p.theme.colors.neutral.c40};
-  background: ${(p) => p.status === "completed" && p.theme.colors.primary.c80};
+  border-color: ${(p)=>p.status === "completed" ? p.theme.colors.primary.c80 : p.theme.colors.neutral.c40};
+  background: ${(p)=>p.status === "completed" && p.theme.colors.primary.c80};
 `;
-const getIconBackground = (theme, status, isLastItem) => {
-  if (isLastItem) {
-    if (status === "inactive")
-      return theme.colors.success.c10;
-    return "transparent";
-  } else if (status === "active") {
-    return theme.colors.neutral.c40;
-  } else {
-    return "transparent";
-  }
+const getIconBackground = (theme, status, isLastItem)=>{
+    if (isLastItem) {
+        if (status === "inactive") return theme.colors.success.c10;
+        return "transparent";
+    } else if (status === "active") {
+        return theme.colors.neutral.c40;
+    } else {
+        return "transparent";
+    }
 };
-const getIconBorder = (theme, status, isLastItem) => {
-  if (isLastItem) {
-    return theme.colors.success.c70;
-  } else if (status === "inactive") {
-    return theme.colors.neutral.c40;
-  }
-  return theme.colors.primary.c80;
+const getIconBorder = (theme, status, isLastItem)=>{
+    if (isLastItem) {
+        return theme.colors.success.c70;
+    } else if (status === "inactive") {
+        return theme.colors.neutral.c40;
+    }
+    return theme.colors.primary.c80;
 };
-const CenterCircle = (0, import_styled_components.default)(import_Flex.default)`
+const CenterCircle = external_styled_components_default()((0,Flex["default"]))`
   border-radius: 9999px;
   width: 100%;
-  background: ${(p) => getIconBackground(p.theme, p.status, p.isLastItem && !p.isNeutral)};
-  border: 2px solid ${(p) => getIconBorder(p.theme, p.status, p.isLastItem && !p.isNeutral)};
+  background: ${(p)=>getIconBackground(p.theme, p.status, p.isLastItem && !p.isNeutral)};
+  border: 2px solid ${(p)=>getIconBorder(p.theme, p.status, p.isLastItem && !p.isNeutral)};
   align-items: center;
   justify-content: center;
   position: relative;
 `;
-const IconWrapper = (0, import_styled_components.default)(import_Flex.default)`
+const IconWrapper = external_styled_components_default()((0,Flex["default"]))`
   height: 16px;
   width: 16px;
 `;
 const topSegmentDefaultHeight = 23;
-const Container = (0, import_styled_components.default)(import_Flex.default)`
+const Container = external_styled_components_default()((0,Flex["default"]))`
   flex-direction: column;
   align-items: center;
   margin-bottom: ${-topSegmentDefaultHeight}px;
   padding-top: ${topSegmentDefaultHeight}px;
 `;
 function TimelineIndicator({ status, isLastItem, isNeutral, ...props }) {
-  const { colors } = (0, import_styled_components.useTheme)();
-  return /* @__PURE__ */ import_react.default.createElement(Container, { ...props }, /* @__PURE__ */ import_react.default.createElement(IconWrapper, null, /* @__PURE__ */ import_react.default.createElement(CenterCircle, { status, isLastItem, isNeutral }, status === "completed" && /* @__PURE__ */ import_react.default.createElement(import_Flex.default, { position: "absolute" }, /* @__PURE__ */ import_react.default.createElement(
-    import_CircledCheckSolidMedium.default,
-    {
-      color: isLastItem && !isNeutral ? colors.success.c70 : colors.primary.c80,
-      size: 20
-    }
-  )))), isLastItem ? null : /* @__PURE__ */ import_react.default.createElement(BottomSegment, { status }));
+    const { colors } = (0,external_styled_components_.useTheme)();
+    return /*#__PURE__*/ external_react_default().createElement(Container, props, /*#__PURE__*/ external_react_default().createElement(IconWrapper, null, /*#__PURE__*/ external_react_default().createElement(CenterCircle, {
+        status: status,
+        isLastItem: isLastItem,
+        isNeutral: isNeutral
+    }, status === "completed" && /*#__PURE__*/ external_react_default().createElement(Flex["default"], {
+        position: "absolute"
+    }, /*#__PURE__*/ external_react_default().createElement((CircledCheckSolidMedium_default()), {
+        color: isLastItem && !isNeutral ? colors.success.c70 : colors.primary.c80,
+        size: 20
+    })))), isLastItem ? null : /*#__PURE__*/ external_react_default().createElement(BottomSegment, {
+        status: status
+    }));
 }
-var TimelineIndicator_default = import_react.default.memo(TimelineIndicator);
+/* export default */ const VerticalTimeline_TimelineIndicator = (/*#__PURE__*/external_react_default().memo(TimelineIndicator));
 TimelineIndicator.topSegmentDefaultHeight = topSegmentDefaultHeight;
-//# sourceMappingURL=TimelineIndicator.js.map
+
+})();
+
+module.exports = __webpack_exports__;
+})()
+;
+//# sourceMappingURL=TimelineIndicator.js.map

package/lib/cjs/components/layout/List/VerticalTimeline/TimelineIndicator.js.map

@@ -1,7 +1 @@
-{
-  "version": 3,
-  "sources": ["../../../../../../src/components/layout/List/VerticalTimeline/TimelineIndicator.tsx"],
-  "sourcesContent": ["import React from \"react\";\nimport CircledCheckSolidMedium from \"@ledgerhq/icons-ui/reactLegacy/CircledCheckSolidMedium\";\nimport styled, { useTheme } from \"styled-components\";\n\nimport Flex, { FlexBoxProps as FlexProps } from \"../../Flex\";\nimport { ItemStatus } from \"./index\";\nimport { Theme } from \"../../../../styles/theme\";\n\nconst linesWidth = 2;\n\nconst BottomSegment = styled(Flex)<{ status: ItemStatus; hidden?: boolean }>`\n  flex: 1;\n  border-left-width: ${p => (p.hidden ? 0 : linesWidth)}px;\n  border-right-width: 0;\n  border-style: dashed;\n  border-color: ${p =>\n    p.status === \"completed\" ? p.theme.colors.primary.c80 : p.theme.colors.neutral.c40};\n  background: ${p => p.status === \"completed\" && p.theme.colors.primary.c80};\n`;\n\nconst getIconBackground = (theme: Theme, status: ItemStatus, isLastItem?: boolean) => {\n  if (isLastItem) {\n    if (status === \"inactive\") return theme.colors.success.c10;\n    return \"transparent\";\n  } else if (status === \"active\") {\n    return theme.colors.neutral.c40;\n  } else {\n    return \"transparent\";\n  }\n};\n\nconst getIconBorder = (theme: Theme, status: ItemStatus, isLastItem?: boolean) => {\n  if (isLastItem) {\n    return theme.colors.success.c70;\n  } else if (status === \"inactive\") {\n    return theme.colors.neutral.c40;\n  }\n  return theme.colors.primary.c80;\n};\n\nconst CenterCircle = styled(Flex)<{\n  status: ItemStatus;\n  isLastItem?: boolean;\n  isNeutral?: boolean;\n}>`\n  border-radius: 9999px;\n  width: 100%;\n  background: ${p => getIconBackground(p.theme, p.status, p.isLastItem && !p.isNeutral)};\n  border: 2px solid ${p => getIconBorder(p.theme, p.status, p.isLastItem && !p.isNeutral)};\n  align-items: center;\n  justify-content: center;\n  position: relative;\n`;\n\nconst IconWrapper = styled(Flex)`\n  height: 16px;\n  width: 16px;\n`;\n\nexport type Props = FlexProps & {\n  status: \"inactive\" | \"active\" | \"completed\";\n  isFirstItem?: boolean;\n  isLastItem?: boolean;\n  isNeutral?: boolean;\n};\n\nconst topSegmentDefaultHeight = 23;\n\nconst Container = styled(Flex)`\n  flex-direction: column;\n  align-items: center;\n  margin-bottom: ${-topSegmentDefaultHeight}px;\n  padding-top: ${topSegmentDefaultHeight}px;\n`;\n\nfunction TimelineIndicator({ status, isLastItem, isNeutral, ...props }: Props) {\n  const { colors } = useTheme();\n\n  return (\n    <Container {...props}>\n      <IconWrapper>\n        <CenterCircle status={status} isLastItem={isLastItem} isNeutral={isNeutral}>\n          {status === \"completed\" && (\n            <Flex position=\"absolute\">\n              <CircledCheckSolidMedium\n                color={isLastItem && !isNeutral ? colors.success.c70 : colors.primary.c80}\n                size={20}\n              />\n            </Flex>\n          )}\n        </CenterCircle>\n      </IconWrapper>\n      {isLastItem ? null : <BottomSegment status={status} />}\n    </Container>\n  );\n}\n\nexport default React.memo(TimelineIndicator);\n\nTimelineIndicator.topSegmentDefaultHeight = topSegmentDefaultHeight;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,qCAAoC;AACpC,+BAAiC;AAEjC,kBAAgD;AAIhD,MAAM,aAAa;AAEnB,MAAM,oBAAgB,yBAAAA,SAAO,YAAAC,OAAI;AAAA;AAAA,uBAEV,OAAM,EAAE,SAAS,IAAI,UAAW;AAAA;AAAA;AAAA,kBAGrC,OACd,EAAE,WAAW,cAAc,EAAE,MAAM,OAAO,QAAQ,MAAM,EAAE,MAAM,OAAO,QAAQ,GAAG;AAAA,gBACtE,OAAK,EAAE,WAAW,eAAe,EAAE,MAAM,OAAO,QAAQ,GAAG;AAAA;AAG3E,MAAM,oBAAoB,CAAC,OAAc,QAAoB,eAAyB;AACpF,MAAI,YAAY;AACd,QAAI,WAAW;AAAY,aAAO,MAAM,OAAO,QAAQ;AACvD,WAAO;AAAA,EACT,WAAW,WAAW,UAAU;AAC9B,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B,OAAO;AACL,WAAO;AAAA,EACT;AACF;AAEA,MAAM,gBAAgB,CAAC,OAAc,QAAoB,eAAyB;AAChF,MAAI,YAAY;AACd,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B,WAAW,WAAW,YAAY;AAChC,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B;AACA,SAAO,MAAM,OAAO,QAAQ;AAC9B;AAEA,MAAM,mBAAe,yBAAAD,SAAO,YAAAC,OAAI;AAAA;AAAA;AAAA,gBAOhB,OAAK,kBAAkB,EAAE,OAAO,EAAE,QAAQ,EAAE,cAAc,CAAC,EAAE,SAAS,CAAC;AAAA,sBACjE,OAAK,cAAc,EAAE,OAAO,EAAE,QAAQ,EAAE,cAAc,CAAC,EAAE,SAAS,CAAC;AAAA;AAAA;AAAA;AAAA;AAMzF,MAAM,kBAAc,yBAAAD,SAAO,YAAAC,OAAI;AAAA;AAAA;AAAA;AAY/B,MAAM,0BAA0B;AAEhC,MAAM,gBAAY,yBAAAD,SAAO,YAAAC,OAAI;AAAA;AAAA;AAAA,mBAGV,CAAC,uBAAuB;AAAA,iBAC1B,uBAAuB;AAAA;AAGxC,SAAS,kBAAkB,EAAE,QAAQ,YAAY,WAAW,GAAG,MAAM,GAAU;AAC7E,QAAM,EAAE,OAAO,QAAI,mCAAS;AAE5B,SACE,6BAAAC,QAAA,cAAC,aAAW,GAAG,SACb,6BAAAA,QAAA,cAAC,mBACC,6BAAAA,QAAA,cAAC,gBAAa,QAAgB,YAAwB,aACnD,WAAW,eACV,6BAAAA,QAAA,cAAC,YAAAD,SAAA,EAAK,UAAS,cACb,6BAAAC,QAAA;AAAA,IAAC,+BAAAC;AAAA,IAAA;AAAA,MACC,OAAO,cAAc,CAAC,YAAY,OAAO,QAAQ,MAAM,OAAO,QAAQ;AAAA,MACtE,MAAM;AAAA;AAAA,EACR,CACF,CAEJ,CACF,GACC,aAAa,OAAO,6BAAAD,QAAA,cAAC,iBAAc,QAAgB,CACtD;AAEJ;AAEA,IAAO,4BAAQ,aAAAA,QAAM,KAAK,iBAAiB;AAE3C,kBAAkB,0BAA0B;",
-  "names": ["styled", "Flex", "React", "CircledCheckSolidMedium"]
-}
+{"version":3,"file":"components/layout/List/VerticalTimeline/TimelineIndicator.js","sources":["webpack://@ledgerhq/react-ui/./src/components/layout/Flex/index.ts","webpack://@ledgerhq/react-ui/./src/components/styled.ts","webpack://@ledgerhq/react-ui/./src/styles/system/gaps.ts","webpack://@ledgerhq/react-ui/webpack/runtime/compat_get_default_export","webpack://@ledgerhq/react-ui/webpack/runtime/define_property_getters","webpack://@ledgerhq/react-ui/webpack/runtime/has_own_property","webpack://@ledgerhq/react-ui/webpack/runtime/make_namespace_object","webpack://@ledgerhq/react-ui/./src/components/layout/List/VerticalTimeline/TimelineIndicator.tsx"],"sourcesContent":["import baseStyled, { BaseStyledProps } from \"../../styled\";\n\nconst FlexBox = baseStyled.div.attrs<BaseStyledProps, BaseStyledProps>({ display: \"flex\" })``;\nexport type FlexBoxProps = BaseStyledProps & React.HTMLAttributes<HTMLDivElement>;\n\nexport default FlexBox;\n","import gaps from \"../styles/system/gaps\";\nimport styled, { StyledInterface, InterpolationFunction } from \"styled-components\";\nimport {\n  compose,\n  flexbox,\n  FlexboxProps,\n  space,\n  SpaceProps,\n  position,\n  PositionProps,\n  color,\n  ColorProps,\n  layout,\n  LayoutProps,\n  overflow,\n  OverflowProps,\n  border,\n  BorderProps,\n} from \"styled-system\";\n\nexport type BaseStyledProps = SpaceProps &\n  FlexboxProps &\n  PositionProps &\n  ColorProps &\n  LayoutProps &\n  BorderProps &\n  OverflowProps & {\n    /**\n     * The columnGap CSS property sets the size of the gap (gutter) between an element's grid columns.\n     */\n    columnGap?: string | number;\n    /**\n     * The rowGap CSS property sets the size of the gap (gutter) between an element's grid rows.\n     */\n    rowGap?: string | number;\n    color?: string;\n  };\n\nexport const baseStyles: InterpolationFunction<unknown> = compose(\n  flexbox,\n  space,\n  position,\n  color,\n  layout,\n  overflow,\n  gaps,\n  border,\n);\n\nconst proxyStyled = new Proxy(styled, {\n  apply(target: typeof styled, thisArg, argumentsList: Parameters<typeof styled>) {\n    return styled(target.apply(thisArg, argumentsList)(baseStyles));\n  },\n  get(target, property: keyof typeof styled) {\n    if (typeof target[property] === \"function\") {\n      return styled(target[property].apply(styled, [baseStyles]));\n    }\n    return target[property];\n  },\n});\n\nexport default <StyledInterface>proxyStyled;\n","import { system } from \"styled-system\";\n\nconst gaps = system({\n  rowGap: { property: \"rowGap\", scale: \"space\" },\n  columnGap: { property: \"columnGap\", scale: \"space\" },\n});\n\nexport default gaps;\n","// getDefaultExport function for compatibility with non-ESM modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};\n","__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n        if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n            Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n        }\n    }\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import React from \"react\";\nimport CircledCheckSolidMedium from \"@ledgerhq/icons-ui/reactLegacy/CircledCheckSolidMedium\";\nimport styled, { useTheme } from \"styled-components\";\n\nimport Flex, { FlexBoxProps as FlexProps } from \"../../Flex\";\nimport { ItemStatus } from \"./index\";\nimport { Theme } from \"../../../../styles/theme\";\n\nconst linesWidth = 2;\n\nconst BottomSegment = styled(Flex)<{ status: ItemStatus; hidden?: boolean }>`\n  flex: 1;\n  border-left-width: ${p => (p.hidden ? 0 : linesWidth)}px;\n  border-right-width: 0;\n  border-style: dashed;\n  border-color: ${p =>\n    p.status === \"completed\" ? p.theme.colors.primary.c80 : p.theme.colors.neutral.c40};\n  background: ${p => p.status === \"completed\" && p.theme.colors.primary.c80};\n`;\n\nconst getIconBackground = (theme: Theme, status: ItemStatus, isLastItem?: boolean) => {\n  if (isLastItem) {\n    if (status === \"inactive\") return theme.colors.success.c10;\n    return \"transparent\";\n  } else if (status === \"active\") {\n    return theme.colors.neutral.c40;\n  } else {\n    return \"transparent\";\n  }\n};\n\nconst getIconBorder = (theme: Theme, status: ItemStatus, isLastItem?: boolean) => {\n  if (isLastItem) {\n    return theme.colors.success.c70;\n  } else if (status === \"inactive\") {\n    return theme.colors.neutral.c40;\n  }\n  return theme.colors.primary.c80;\n};\n\nconst CenterCircle = styled(Flex)<{\n  status: ItemStatus;\n  isLastItem?: boolean;\n  isNeutral?: boolean;\n}>`\n  border-radius: 9999px;\n  width: 100%;\n  background: ${p => getIconBackground(p.theme, p.status, p.isLastItem && !p.isNeutral)};\n  border: 2px solid ${p => getIconBorder(p.theme, p.status, p.isLastItem && !p.isNeutral)};\n  align-items: center;\n  justify-content: center;\n  position: relative;\n`;\n\nconst IconWrapper = styled(Flex)`\n  height: 16px;\n  width: 16px;\n`;\n\nexport type Props = FlexProps & {\n  status: \"inactive\" | \"active\" | \"completed\";\n  isFirstItem?: boolean;\n  isLastItem?: boolean;\n  isNeutral?: boolean;\n};\n\nconst topSegmentDefaultHeight = 23;\n\nconst Container = styled(Flex)`\n  flex-direction: column;\n  align-items: center;\n  margin-bottom: ${-topSegmentDefaultHeight}px;\n  padding-top: ${topSegmentDefaultHeight}px;\n`;\n\nfunction TimelineIndicator({ status, isLastItem, isNeutral, ...props }: Props) {\n  const { colors } = useTheme();\n\n  return (\n    <Container {...props}>\n      <IconWrapper>\n        <CenterCircle status={status} isLastItem={isLastItem} isNeutral={isNeutral}>\n          {status === \"completed\" && (\n            <Flex position=\"absolute\">\n              <CircledCheckSolidMedium\n                color={isLastItem && !isNeutral ? colors.success.c70 : colors.primary.c80}\n                size={20}\n              />\n            </Flex>\n          )}\n        </CenterCircle>\n      </IconWrapper>\n      {isLastItem ? null : <BottomSegment status={status} />}\n    </Container>\n  );\n}\n\nexport default React.memo(TimelineIndicator);\n\nTimelineIndicator.topSegmentDefaultHeight = topSegmentDefaultHeight;\n"],"names":["baseStyled","FlexBox","gaps","styled","compose","flexbox","space","position","color","layout","overflow","border","baseStyles","proxyStyled","Proxy","target","thisArg","argumentsList","property","system","React","CircledCheckSolidMedium","useTheme","Flex","linesWidth","BottomSegment","p","getIconBackground","theme","status","isLastItem","getIconBorder","CenterCircle","IconWrapper","topSegmentDefaultHeight","Container","TimelineIndicator","isNeutral","props","colors"],"mappings":"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"}