@ledgerhq/react-ui 0.53.0 → 0.53.1-nightly.20260902021544

package/lib/cjs/components/layout/Drawer/Drawer.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"components/layout/Drawer/Drawer.stories.js","sources":["webpack://@ledgerhq/react-ui/./src/components/asorted/Divider/index.tsx","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/cta/Button/index.tsx","webpack://@ledgerhq/react-ui/./src/components/layout/Drawer/index.tsx","webpack://@ledgerhq/react-ui/./src/components/layout/Flex/index.ts","webpack://@ledgerhq/react-ui/./src/components/styled.ts","webpack://@ledgerhq/react-ui/./src/components/transitions/TransitionInOut.tsx","webpack://@ledgerhq/react-ui/./src/components/transitions/TransitionSlide.tsx","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/Drawer/Drawer.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"styled-components\";\nimport Flex, { FlexBoxProps } from \"../../layout/Flex\";\nimport Text from \"../../asorted/Text\";\n\nexport type Props = FlexBoxProps & { text?: string };\nconst DividerBase = styled(Flex).attrs<FlexBoxProps>((p: FlexBoxProps) => ({\n  my: p.my || 0,\n  height: 1,\n  backgroundColor: p.color || \"neutral.c40\",\n}))`\n  &[data-variant=\"light\"] {\n    background: ${p => p.theme.colors.neutral.c30};\n  }\n`;\n\nconst Divider: React.FC<Props> = props => {\n  if (!props.text) return <DividerBase {...props} />;\n  return (\n    <Flex {...props} flexDirection=\"row\" alignItems=\"center\">\n      <DividerBase my={6} flex={1} />\n      <Text variant=\"bodyLineHeight\" color=\"neutral.c60\" mx={6}>\n        {props.text}\n      </Text>\n      <DividerBase my={6} flex={1} />\n    </Flex>\n  );\n};\n\nexport default Divider;\n","import React from \"react\";\nimport 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  children?: React.ReactNode;\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 ChevronBottom from \"@ledgerhq/icons-ui/reactLegacy/ChevronBottomMedium\";\nimport React, { useMemo, useState } from \"react\";\nimport styled, { css, StyledProps } from \"styled-components\";\nimport { border, BordersProps, compose, fontSize } from \"styled-system\";\nimport { rgba } from \"../../../styles/helpers\";\nimport fontFamily from \"../../../styles/styled/fontFamily\";\nimport { fontSizes } from \"../../../styles/theme\";\nimport baseStyled, { BaseStyledProps } from \"../../styled\";\n\ntype ButtonVariants = \"main\" | \"shade\" | \"error\" | \"color\" | \"neutral\";\ntype IconPosition = \"right\" | \"left\";\ninterface BaseProps extends BaseStyledProps, BordersProps {\n  ff?: string;\n  color?: string;\n  backgroundColor?: string;\n  size?: \"xs\" | \"small\" | \"medium\" | \"large\" | \"xl\";\n  fontSize?: number;\n  variant?: ButtonVariants;\n  outline?: boolean;\n  iconPosition?: IconPosition;\n  iconButton?: boolean;\n  disabled?: boolean;\n  whiteSpace?: string;\n}\n\nexport interface ButtonProps extends BaseProps, React.RefAttributes<HTMLButtonElement> {\n  Icon?: React.ReactElement | React.ComponentType<{ size: number; color?: string }>;\n  children?: React.ReactNode;\n  onClick?: (event: React.SyntheticEvent<HTMLButtonElement>) => void;\n  iconSize?: number;\n  style?: React.CSSProperties;\n}\nconst IconContainer = styled.div<{\n  iconPosition: IconPosition;\n}>`\n  display: inline-block;\n  ${p => `${p.iconPosition === \"left\" ? \"margin-right\" : \"margin-left\"}: ${p.theme.space[4]}px;`}\n  padding-top: 0.2em;\n`;\n\nconst getVariantColors = (p: StyledProps<BaseProps>) => ({\n  main: {\n    outline: `\n        border-color: ${p.theme.colors.neutral.c100};\n        color: ${p.theme.colors.neutral.c100};\n        background-color: transparent;\n        &:hover, &:focus {\n          background-color: ${rgba(p.theme.colors.neutral.c100, 0.03)};\n        }\n        &:active {\n          background-color: ${rgba(p.theme.colors.neutral.c100, 0.05)};\n        }\n      `,\n    filled: `\n        color: ${p.theme.colors.neutral.c00};\n        background-color: ${p.theme.colors.neutral.c100};\n        &:hover, &:focus {\n          background-color: ${p.theme.colors.neutral.c90};\n        }\n      `,\n  },\n  shade: `\n      border-color: ${p.theme.colors.neutral.c40};\n      color: ${p.theme.colors.neutral.c100};\n      &:focus {\n        border-color: ${p.theme.colors.primary.c80};\n      }\n\n      &:hover, &:focus {\n        background-color: ${p.theme.colors.neutral.c20};\n      }\n\n      &:active {\n        background-color: ${p.theme.colors.neutral.c30};\n      }\n    `,\n  error: {\n    outline: `\n      border-color: ${p.theme.colors.error.c50};\n      color: ${p.theme.colors.error.c50};\n      background-color: transparent;\n      &:hover {\n        background-color: ${rgba(p.theme.colors.error.c50, 0.02)};\n      }\n      &:active {\n        background-color: ${rgba(p.theme.colors.error.c50, 0.05)};\n      }\n    `,\n    filled: `\n      color: ${p.theme.colors.neutral.c00};\n      background-color: ${p.theme.colors.error.c50};\n      &:hover {\n        background-color: ${p.theme.colors.error.c40};\n      }\n    `,\n  },\n  neutral: `\n    color: ${p.theme.colors.neutral.c100};\n    background-color: ${p.theme.colors.neutral.c30};\n    &:hover {\n      background-color: ${p.theme.colors.neutral.c40};\n    }\n  `,\n  color: {\n    outline: `\n      border-color: ${p.theme.colors.primary.c80};\n      color: ${p.theme.colors.primary.c80};\n      background-color: transparent;\n      &:hover {\n        background-color: ${rgba(p.theme.colors.primary.c100, 0.02)};\n      }\n      &:active {\n        background-color: ${rgba(p.theme.colors.primary.c100, 0.05)};\n      }\n    `,\n    filled: `\n      color: ${p.theme.colors.neutral.c00};\n      background-color: ${p.theme.colors.primary.c80};\n      &:hover {\n        background-color: ${p.theme.colors.primary.c70};\n      }\n    `,\n  },\n  disabled: {\n    outline: `\n        border-color: ${p.theme.colors.neutral.c50};\n        color: ${p.theme.colors.neutral.c50};\n        background-color: transparent;\n        &:focus, &:hover {\n          box-shadow: none;\n        }\n      `,\n    filled: `\n        color: ${p.theme.colors.neutral.c50};\n        background-color: ${p.theme.colors.neutral.c30};\n        &:focus, &:hover {\n          box-shadow: none;\n        }\n      `,\n  },\n  default: `\n    color: ${p.theme.colors.neutral.c100};\n    background-color: transparent;\n    &:hover {\n      text-decoration: underline;\n    }\n  `,\n});\n\nexport const ButtonUnstyled = baseStyled.button`\n  all: unset;\n  cursor: pointer;\n\n  &:disabled {\n    cursor: default;\n  }\n`;\n\nexport const Base = baseStyled.button.attrs((p: BaseProps) => ({\n  fontFamily: \"Inter\",\n  fontSize: p.fontSize ?? 4,\n}))<BaseProps>`\n  background-color: transparent;\n  border-color: transparent;\n  border-radius: 44px;\n  border-style: solid;\n  border-width: ${p => (p.outline || p.variant === \"shade\" ? 1 : 0)}px;\n  font-weight: 600;\n  ${compose(fontFamily, fontSize, border)};\n  line-height: ${p => p.theme.fontSizes[p.fontSize]}px;\n  text-align: center;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n  ${p => buttonSizeStyle[p.size || \"medium\"]}\n  text-overflow: ellipsis;\n  white-space: ${p => (p.whiteSpace ? p.whiteSpace : \"nowrap\")};\n  max-width: 100%;\n  position: relative;\n  cursor: ${p => (p.disabled ? \"default\" : \"pointer\")};\n  &:active {\n    box-shadow: 0 0 0 4px ${p => rgba(p.theme.colors.primary.c60, 0.4)};\n  }\n  &:focus, &:hover {\n    box-shadow: 0 0 0 2px ${p => rgba(p.theme.colors.primary.c60, 0.4)};\n  }\n\n  ${p => {\n    const variants = getVariantColors(p);\n    if (p.disabled) {\n      return p.outline || p.variant === \"shade\"\n        ? variants.disabled.outline\n        : variants.disabled.filled;\n    }\n\n    const variant: ButtonVariants | \"default\" =\n      p.variant ?? (\"default\" as ButtonVariants | \"default\");\n    switch (variant) {\n      case \"main\":\n        return p.outline ? variants.main.outline : variants.main.filled;\n      case \"shade\":\n        return variants.shade;\n\n      case \"error\":\n        return p.outline ? variants.error.outline : variants.error.filled;\n\n      case \"color\":\n        return p.outline ? variants.color.outline : variants.color.filled;\n\n      case \"neutral\":\n        return variants.neutral;\n\n      case \"default\":\n      default:\n        return variants.default;\n    }\n  }}\n  ${p =>\n    p.iconButton\n      ? css`\n          width: ${p.theme.space[12]}px;\n          padding: 0;\n          ${IconContainer} {\n            margin: 0;\n          }\n        `\n      : \"\"}\n  ${p => p.theme.transition([\"background-color\", \"color\", \"border-color\", \"box-shadow\"], \"0.2s\")}\n`;\n\nconst ContentContainer = styled.div``;\n\nconst Button = (\n  { Icon, iconPosition = \"right\", iconSize = 16, children, onClick, ...props }: ButtonProps,\n  ref?: React.ForwardedRef<HTMLButtonElement>,\n): React.ReactElement => {\n  const iconNodeSize = iconSize || fontSizes[props.fontSize ?? 4];\n  const IconNode = useMemo(() => {\n    if (!Icon) return null;\n    if (typeof Icon === \"object\") return Icon;\n    return <Icon size={iconNodeSize} />;\n  }, [iconNodeSize, Icon]);\n\n  return (\n    <Base {...props} ref={ref} iconButton={!(Icon == null) && !children} onClick={onClick}>\n      {iconPosition === \"right\" ? <ContentContainer>{children}</ContentContainer> : null}\n      {IconNode && <IconContainer iconPosition={iconPosition}>{IconNode}</IconContainer>}\n      {iconPosition === \"left\" ? <ContentContainer>{children}</ContentContainer> : null}\n    </Base>\n  );\n};\nconst ButtonWithRef = React.forwardRef(Button) as unknown as typeof Button;\n\nexport type ButtonExpandProps = React.PropsWithChildren<\n  ButtonProps & {\n    onToggle?: (arg0: boolean) => void;\n  }\n>;\n\nconst StyledButtonExpand = styled(ButtonWithRef).attrs(props => ({\n  Icon: props.Icon != null || ChevronBottom,\n  iconPosition: props.iconPosition || \"right\",\n}))<{ expanded: boolean }>`\n  ${IconContainer} {\n    transition: transform 0.25s;\n    ${p => (p.expanded ? \"transform: rotate(180deg)\" : \"\")}\n  }\n`;\nexport function ButtonExpand(\n  { onToggle, onClick, ...props }: ButtonExpandProps,\n  ref?: React.ForwardedRef<HTMLButtonElement>,\n): React.ReactElement {\n  const [expanded, setExpanded] = useState(false);\n  return (\n    <StyledButtonExpand\n      {...props}\n      ref={ref}\n      expanded={expanded}\n      onClick={(event: React.SyntheticEvent<HTMLButtonElement>) => {\n        setExpanded(expanded => !expanded);\n        onToggle != null && onToggle(!expanded);\n        onClick != null && onClick(event);\n      }}\n    />\n  );\n}\n\nexport const buttonSizeStyle: {\n  [index: string]: {\n    padding: string;\n    height: string;\n  };\n} = {\n  xs: {\n    padding: \"0 12px\",\n    height: \"28px\",\n  },\n  small: {\n    padding: \"0 20px\",\n    height: \"32px\",\n  },\n  medium: {\n    padding: \"0 24px\",\n    height: \"40px\",\n  },\n  large: {\n    padding: \"0 28px\",\n    height: \"48px\",\n  },\n  xl: {\n    padding: \"0 28px\",\n    height: \"56px\",\n  },\n};\n\nButton.Unstyled = ButtonUnstyled;\nButton.Expand = React.forwardRef(ButtonExpand);\nButtonWithRef.Unstyled = Button.Unstyled;\nButtonWithRef.Expand = Button.Expand;\nexport default ButtonWithRef;\n","import React, { useCallback } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport styled from \"styled-components\";\nimport FlexBox, { FlexBoxProps } from \"../Flex\";\nimport Divider, { Props as DividerProps } from \"../../asorted/Divider\";\nimport Close from \"@ledgerhq/icons-ui/reactLegacy/CloseMedium\";\nimport ArrowLeft from \"@ledgerhq/icons-ui/reactLegacy/ArrowLeftMedium\";\n\nimport TransitionSlide from \"../../transitions/TransitionSlide\";\nimport TransitionInOut from \"../../transitions/TransitionInOut\";\nimport Text from \"../../asorted/Text\";\nimport Button from \"../../cta/Button\";\n\nexport enum Direction {\n  Left = \"left\",\n  Right = \"right\",\n}\n\nconst Container = styled(FlexBox)`\n  width: 100%;\n  height: 100%;\n  flex-direction: column;\n`;\n\nconst Wrapper = styled(FlexBox)<{\n  big?: boolean;\n}>`\n  height: 100%;\n  width: ${p =>\n    p.big ? p.theme.sizes.drawer.side.big.width : p.theme.sizes.drawer.side.small.width}px;\n  flex-direction: column;\n  align-items: stretch;\n  justify-content: space-between;\n  z-index: ${p => p.theme.zIndexes[8]};\n`;\n\nconst Overlay = styled.div<{ direction: Direction }>`\n  display: flex;\n  position: fixed;\n  justify-content: ${p => (p.direction === Direction.Left ? \"flex-end\" : \"flex-start\")};\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  z-index: 999;\n  background-color: ${p => p.theme.colors.constant.overlay};\n`;\n\nconst ScrollWrapper = styled(FlexBox)`\n  &::-webkit-scrollbar {\n    display: none;\n  }\n`;\n\nconst ButtonPlaceholder = styled.div`\n  min-width: ${p => p.theme.space[12]}px;\n`;\n\nexport interface DrawerProps {\n  isOpen: boolean;\n  children: React.ReactNode;\n  title?: React.ReactNode;\n  footer?: React.ReactNode;\n  big?: boolean;\n  ignoreBackdropClick?: boolean;\n  backgroundColor?: string;\n  onClose: () => void;\n  onBack?: () => void;\n  setTransitionsEnabled?: (arg0: boolean) => void;\n  hideNavigation?: boolean;\n  menuPortalTarget?: Element | null;\n  direction?: Direction;\n  extraContainerProps?: Partial<FlexBoxProps>;\n  extraHeaderProps?: Partial<FlexBoxProps>;\n  extraFooterProps?: Partial<FlexBoxProps>;\n  extraFooterDividerProps?: Partial<DividerProps>;\n}\n\nconst DrawerContent = React.forwardRef(\n  (\n    {\n      isOpen,\n      title,\n      children,\n      footer,\n      big,\n      onClose,\n      backgroundColor,\n      setTransitionsEnabled = () => 0,\n      onBack,\n      extraContainerProps,\n      extraHeaderProps,\n      extraFooterProps,\n      extraFooterDividerProps,\n      ignoreBackdropClick = false,\n      hideNavigation = true,\n      direction = Direction.Left,\n    }: DrawerProps,\n    ref?: React.ForwardedRef<HTMLDivElement>,\n  ) => {\n    const disableChildAnimations = useCallback(\n      () => setTransitionsEnabled(false),\n      [setTransitionsEnabled],\n    );\n    const enableChildAnimations = useCallback(\n      () => setTransitionsEnabled(true),\n      [setTransitionsEnabled],\n    );\n\n    const handleBackdropClick = useCallback(() => {\n      if (!ignoreBackdropClick) {\n        onClose();\n      }\n    }, [onClose, ignoreBackdropClick]);\n\n    const stopClickPropagation = useCallback((e: React.MouseEvent) => {\n      e.stopPropagation();\n    }, []);\n\n    return (\n      <TransitionInOut\n        in={isOpen}\n        appear\n        mountOnEnter\n        unmountOnExit\n        onEntering={disableChildAnimations}\n        onEntered={enableChildAnimations}\n        onExiting={disableChildAnimations}\n      >\n        <Overlay direction={direction} onClick={handleBackdropClick} ref={ref}>\n          <TransitionSlide\n            in={isOpen}\n            direction={direction}\n            fixed\n            reverseExit\n            appear\n            mountOnEnter\n            unmountOnExit\n          >\n            <Wrapper\n              big={big}\n              onClick={stopClickPropagation}\n              backgroundColor={backgroundColor ?? \"background.main\"}\n            >\n              <Container>\n                <FlexBox\n                  justifyContent=\"space-between\"\n                  alignItems=\"center\"\n                  p={12}\n                  pb={10}\n                  {...extraHeaderProps}\n                >\n                  {!hideNavigation && (\n                    <>\n                      {onBack != null ? (\n                        <Button variant=\"neutral\" onClick={onBack} Icon={ArrowLeft} />\n                      ) : (\n                        <ButtonPlaceholder />\n                      )}\n                    </>\n                  )}\n                  <Text variant={\"h3\"} flex={1} textAlign=\"center\">\n                    {title}\n                  </Text>\n                  <FlexBox alignSelf=\"flex-start\">\n                    <Button variant=\"neutral\" onClick={onClose} Icon={Close} />\n                  </FlexBox>\n                </FlexBox>\n                <ScrollWrapper\n                  flexDirection=\"column\"\n                  alignItems=\"stretch\"\n                  overflow=\"scroll\"\n                  position=\"relative\"\n                  p={12}\n                  pt={0}\n                  flex={1}\n                  {...extraContainerProps}\n                >\n                  {children}\n                </ScrollWrapper>\n                {footer && (\n                  <>\n                    <Divider {...extraFooterDividerProps} />\n                    <FlexBox alignItems=\"center\" py={8} px={12} {...extraFooterProps}>\n                      {footer}\n                    </FlexBox>\n                  </>\n                )}\n              </Container>\n            </Wrapper>\n          </TransitionSlide>\n        </Overlay>\n      </TransitionInOut>\n    );\n  },\n);\n\nconst Drawer = (\n  { children, menuPortalTarget, ...sideProps }: DrawerProps,\n  ref?: React.ForwardedRef<HTMLDivElement>,\n): React.ReactElement => {\n  const $root = React.useMemo(\n    () =>\n      menuPortalTarget === undefined && typeof document !== \"undefined\"\n        ? document.querySelector(\"body\")\n        : menuPortalTarget,\n    [menuPortalTarget],\n  );\n  if (!$root) {\n    return (\n      <DrawerContent ref={ref} {...sideProps}>\n        {children}\n      </DrawerContent>\n    );\n  } else {\n    return ReactDOM.createPortal(\n      <DrawerContent ref={ref} {...sideProps}>\n        {children}\n      </DrawerContent>,\n      $root,\n    );\n  }\n};\n\nexport default React.forwardRef(Drawer);\n","import baseStyled, { BaseStyledProps } from \"../../styled\";\n\nconst FlexBox = baseStyled.div.attrs<BaseStyledProps, BaseStyledProps>({\n  display: \"flex\",\n  minWidth: 0,\n})``;\nexport type FlexBoxProps = BaseStyledProps & React.HTMLAttributes<HTMLDivElement>;\n\nexport default FlexBox;\n","import React from \"react\";\nimport 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    children?: React.ReactNode;\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 React, { useRef } from \"react\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { CSSTransitionProps } from \"react-transition-group/CSSTransition\";\nimport styled from \"styled-components\";\nconst duration = 150;\nconst ChildrenWrapper = styled.div<{ timeout: number }>`\n  transition: ${props => `opacity ${props.timeout}ms ease-in-out`};\n\n  &.transition-inout-enter {\n    opacity: 0;\n  }\n\n  &.transition-inout-enter-active {\n    opacity: 1;\n  }\n\n  &.transition-inout-exit {\n    opacity: 1;\n  }\n\n  &.transition-inout-exit-active {\n    opacity: 0;\n  }\n`;\ntype TransitionInOutProps = Partial<\n  CSSTransitionProps<HTMLDivElement> & {\n    children: React.ReactNode;\n    in: boolean;\n    timeout?: number;\n    appear?: boolean;\n    mountOnEnter?: boolean;\n    unmountOnExit?: boolean;\n  }\n>;\n\nconst TransitionInOut = ({\n  children,\n  in: inProp,\n  timeout = duration,\n  ...TransitionProps\n}: TransitionInOutProps): React.JSX.Element => {\n  const nodeRef = useRef<HTMLDivElement>(null);\n  return (\n    <CSSTransition\n      {...TransitionProps}\n      nodeRef={nodeRef}\n      in={inProp}\n      timeout={timeout}\n      classNames=\"transition-inout\"\n    >\n      <ChildrenWrapper ref={nodeRef} timeout={timeout}>\n        {children}\n      </ChildrenWrapper>\n    </CSSTransition>\n  );\n};\n\nexport default TransitionInOut;\n","import React, { useRef } from \"react\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { CSSTransitionProps } from \"react-transition-group/CSSTransition\";\nimport styled from \"styled-components\";\nconst duration = 300;\nconst ChildrenWrapper = styled.div<{ fixed?: boolean; reverseExit?: boolean }>`\n  transition: all ${duration}ms ease-in-out;\n  will-change: transform;\n  ${p =>\n    !p.fixed\n      ? `\n    position: absolute;\n    width: 100%;\n    `\n      : \"\"}\n  height: 100%;\n\n  &.transition-left-appear,\n  &.transition-left-enter {\n    transform: translateX(100%);\n  }\n\n  &.transition-left-appear-active,\n  &.transition-left-enter-active {\n    transform: translateX(0%);\n  }\n\n  &.transition-left-exit {\n    transform: translateX(0%);\n  }\n\n  &.transition-left-exit-active {\n    transform: translateX(${p => (p.reverseExit ? 100 : -100)}%);\n  }\n\n  &.transition-right-appear,\n  &.transition-right-enter {\n    transform: translateX(-100%);\n  }\n\n  &.transition-right-appear-active,\n  &.transition-right-enter-active {\n    transform: translateX(0%);\n  }\n\n  &.transition-right-exit {\n    transform: translateX(0%);\n  }\n\n  &.transition-right-exit-active {\n    transform: translateX(${p => (p.reverseExit ? -100 : 100)}%);\n  }\n`;\ntype TransitionSlideProps = Partial<\n  CSSTransitionProps<HTMLDivElement> & {\n    children: React.ReactNode;\n    fixed: boolean;\n    reverseExit?: boolean;\n    direction?: \"left\" | \"right\" | string;\n  }\n>;\n\nconst TransitionSlide = ({\n  children,\n  fixed,\n  direction = \"left\",\n  reverseExit,\n  ...props\n}: TransitionSlideProps) => {\n  const nodeRef = useRef<HTMLDivElement>(null);\n  return (\n    <CSSTransition\n      {...props}\n      nodeRef={nodeRef}\n      timeout={duration}\n      classNames={`transition-${direction}`}\n    >\n      <ChildrenWrapper ref={nodeRef} fixed={fixed} reverseExit={reverseExit}>\n        {children}\n      </ChildrenWrapper>\n    </CSSTransition>\n  );\n};\n\nexport default TransitionSlide;\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,\n  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, getters, values) => {\n\tvar define = (defs, kind) => {\n\t\tfor(var key in defs) {\n\t\t\tif(__webpack_require__.o(defs, key) && !__webpack_require__.o(exports, key)) {\n\t\t\t\tObject.defineProperty(exports, key, { enumerable: true, [kind]: defs[key] });\n\t\t\t}\n\t\t}\n\t};\n\tdefine(getters, \"get\");\n\tdefine(values, \"value\");\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 { useArgs } from \"storybook/manager-api\";\n\nimport Button from \"../../cta/Button\";\nimport Drawer, { DrawerProps } from \"./index\";\nimport { Flex } from \"../index\";\n\nexport default {\n  title: \"Layout/Drawer\",\n  component: Drawer,\n  argTypes: {\n    isOpen: {\n      type: \"boolean\",\n      value: true,\n      description: \"Is open\",\n      required: false,\n      control: {\n        type: \"boolean\",\n      },\n    },\n    title: {\n      type: \"text\",\n      description: \"Side default title\",\n      defaultValue: \"Default title\",\n      control: {\n        type: \"text\",\n      },\n      required: false,\n    },\n    backgroundColor: {\n      control: {\n        type: \"color\",\n        presetColors: [\"coral\", \"tomato\", \"orange\", \"blue\", \"purple\"],\n      },\n    },\n    big: {\n      type: \"boolean\",\n      value: true,\n      description: \"Larger width side drawer.\",\n      required: false,\n      control: {\n        type: \"boolean\",\n      },\n    },\n    ignoreBackdropClick: {\n      type: \"boolean\",\n      value: true,\n      description: \"Prevent drawer from calling onClose when clicking on the backdrop.\",\n      required: false,\n      control: {\n        type: \"boolean\",\n      },\n    },\n  },\n};\n\nconst Template = ({ title, big, ignoreBackdropClick, backgroundColor, direction }: DrawerProps) => {\n  const [{ isOpen }, updateArgs] = useArgs();\n\n  return (\n    <div>\n      <Button variant={\"main\"} onClick={() => updateArgs({ isOpen: true })} style={{ flex: 1 }}>\n        Open\n      </Button>\n      <Drawer\n        isOpen={isOpen}\n        onClose={() => updateArgs({ isOpen: false })}\n        title={title}\n        big={big}\n        footer={\n          <Flex flex={1} justifyContent=\"flex-end\">\n            <Button variant={\"main\"} onClick={() => updateArgs({ isOpen: false })}>\n              Close\n            </Button>\n          </Flex>\n        }\n        ignoreBackdropClick={ignoreBackdropClick}\n        backgroundColor={backgroundColor}\n        direction={direction}\n      >\n        <Flex flexDirection={\"column\"}>\n          <p>\n            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elit mi, tempus sed justo\n            et, viverra mattis lorem. Praesent odio ligula, facilisis id porttitor tempor, cursus at\n            metus. Etiam consequat ante efficitur sodales iaculis. Aliquam at justo vel erat\n            eleifend semper eu non lorem. Cras porta, dolor a porttitor varius, augue lectus congue\n            lorem, nec lobortis urna ipsum quis lorem. Nam quis auctor lacus. Aenean sit amet dictum\n            purus, at convallis neque. Etiam ac augue non risus luctus laoreet eget a est. Curabitur\n            magna purus, fermentum at eros a, faucibus sollicitudin erat. Proin purus sem, lacinia\n            tincidunt ornare et, sollicitudin nec libero. Quisque lobortis dui ac lacus mollis\n            posuere. Morbi vitae ligula commodo, scelerisque sapien quis, vulputate justo. Cras\n            sagittis, ligula quis mollis porttitor, massa neque faucibus mauris, quis consectetur\n            eros nibh a ante. Quisque ac porttitor ante. Curabitur in neque a nisl aliquet finibus.\n            Mauris in sapien nec odio molestie vulputate. Suspendisse vitae lorem non quam dapibus\n            cursus sit amet a mauris.\n          </p>\n          <p>\n            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elit mi, tempus sed justo\n            et, viverra mattis lorem. Praesent odio ligula, facilisis id porttitor tempor, cursus at\n            metus. Etiam consequat ante efficitur sodales iaculis. Aliquam at justo vel erat\n            eleifend semper eu non lorem. Cras porta, dolor a porttitor varius, augue lectus congue\n            lorem, nec lobortis urna ipsum quis lorem. Nam quis auctor lacus. Aenean sit amet dictum\n            purus, at convallis neque. Etiam ac augue non risus luctus laoreet eget a est. Curabitur\n            magna purus, fermentum at eros a, faucibus sollicitudin erat. Proin purus sem, lacinia\n            tincidunt ornare et, sollicitudin nec libero. Quisque lobortis dui ac lacus mollis\n            posuere. Morbi vitae ligula commodo, scelerisque sapien quis, vulputate justo. Cras\n            sagittis, ligula quis mollis porttitor, massa neque faucibus mauris, quis consectetur\n            eros nibh a ante. Quisque ac porttitor ante. Curabitur in neque a nisl aliquet finibus.\n            Mauris in sapien nec odio molestie vulputate. Suspendisse vitae lorem non quam dapibus\n            cursus sit amet a mauris.\n          </p>\n\n          <Flex>\n            <Button\n              variant={\"main\"}\n              onClick={() => updateArgs({ isOpen: false })}\n              style={{ flex: 1 }}\n            >\n              {\"Fermer\"}\n            </Button>\n          </Flex>\n        </Flex>\n      </Drawer>\n    </div>\n  );\n};\n\nexport const Default = Template.bind({});\n"],"names":["React","styled","Flex","Text","DividerBase","p","Divider","props","baseStyled","compose","fontSize","fontWeight","textAlign","lineHeight","letterSpacing","system","fontFamily","textVariantStyle","uppercase","value","variant","color","css","getFontSource","name","fontsPath","fontName","fontStyles","ChevronBottom","useMemo","useState","border","rgba","fontSizes","IconContainer","getVariantColors","ButtonUnstyled","Base","buttonSizeStyle","variants","ContentContainer","Button","Icon","iconPosition","iconSize","children","onClick","ref","iconNodeSize","IconNode","ButtonWithRef","StyledButtonExpand","ButtonExpand","onToggle","expanded","setExpanded","event","useCallback","ReactDOM","FlexBox","Close","ArrowLeft","TransitionSlide","TransitionInOut","Direction","Container","Wrapper","Overlay","ScrollWrapper","ButtonPlaceholder","DrawerContent","isOpen","title","footer","big","onClose","backgroundColor","setTransitionsEnabled","onBack","extraContainerProps","extraHeaderProps","extraFooterProps","extraFooterDividerProps","ignoreBackdropClick","hideNavigation","direction","disableChildAnimations","enableChildAnimations","handleBackdropClick","stopClickPropagation","e","Drawer","menuPortalTarget","sideProps","$root","undefined","document","gaps","flexbox","space","position","layout","overflow","baseStyles","proxyStyled","Proxy","target","thisArg","argumentsList","property","useRef","CSSTransition","duration","ChildrenWrapper","inProp","timeout","TransitionProps","nodeRef","fixed","reverseExit","Color","fontFamilies","c","a","darken","lighten","mix","b","ff","v","font","type","style","weight","fallback","ensureContrast","color1","color2","colorL1","colorL2","lRatio","prop","keyframes","palettes","breakpoints","fontWeights","radii","shadows","zIndexes","animationDuration","easings","transition","properties","easing","fadeIn","fadeOut","fadeInGrowX","fadeInUp","animations","theme","useArgs","Template","updateArgs","Default"],"mappings":"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"}

package/lib/cjs/components/layout/Flex/Flex.stories.js

@@ -1,491 +0,0 @@
-(() => {
-"use strict";
-var __webpack_modules__ = ({
-3696(__unused_rspack_module, __webpack_exports__, __webpack_require__) {
-/* import */ var _styled__rspack_import_0 = __webpack_require__(7680);
-
-const FlexBox = _styled__rspack_import_0["default"].div.attrs({
-    display: "flex",
-    minWidth: 0
-})``;
-/* export default */ const __rspack_default_export = (FlexBox);
-
-__webpack_require__.d(__webpack_exports__, {
-}, {
-  "default": __rspack_default_export
-});
-
-
-},
-7680(__unused_rspack_module, __webpack_exports__, __webpack_require__) {
-/* 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);
-
-__webpack_require__.d(__webpack_exports__, {
-}, {
-  "default": __rspack_default_export
-});
-
-
-},
-4182(__unused_rspack_module, __webpack_exports__, __webpack_require__) {
-/* 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);
-
-__webpack_require__.d(__webpack_exports__, {
-}, {
-  "default": __rspack_default_export
-});
-
-
-},
-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, getters, values) => {
-	var define = (defs, kind) => {
-		for(var key in defs) {
-			if(__webpack_require__.o(defs, key) && !__webpack_require__.o(exports, key)) {
-				Object.defineProperty(exports, key, { enumerable: true, [kind]: defs[key] });
-			}
-		}
-	};
-	define(getters, "get");
-	define(values, "value");
-};
-})();
-// 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 __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 */ Default),
-  "default": () => (/* binding */ Flex_stories)
-});
-
-;// CONCATENATED MODULE: external "react"
-const external_react_namespaceObject = require("react");
-var external_react_default = /*#__PURE__*/__webpack_require__.n(external_react_namespaceObject);
-// EXTERNAL MODULE: ./src/components/layout/Flex/index.ts
-var Flex = __webpack_require__(3696);
-;// CONCATENATED MODULE: ./src/components/layout/Flex/Flex.stories.tsx
-
-
-/* export default */ const Flex_stories = ({
-    title: "Layout/Flex",
-    component: Flex["default"],
-    argTypes: {
-        children: {
-            type: "text",
-            description: "Any valid React node",
-            required: true,
-            control: false
-        },
-        alignItems: {
-            type: "text",
-            description: "This defines the default behavior for how flex items are laid out along the cross axis on the current line. Think of it as the justify-content version for the cross-axis (perpendicular to the main-axis).",
-            required: false,
-            options: [
-                "stretch",
-                "flex-start",
-                "flex-end",
-                "center",
-                "baseline",
-                "first baseline",
-                "last baseline",
-                "start",
-                "end",
-                "self-start",
-                "self-end",
-                "safe center",
-                "unsafe center"
-            ],
-            control: {
-                type: "select"
-            },
-            table: {
-                category: "Parent",
-                subcategory: "cross-axis"
-            }
-        },
-        flexDirection: {
-            type: "text",
-            description: "This establishes the main-axis, thus defining the direction flex items are placed in the flex container. Think of flex items as primarily laying out either in horizontal rows or vertical columns.",
-            required: false,
-            options: [
-                "row",
-                "row-reverse",
-                "column",
-                "column-reverse"
-            ],
-            control: {
-                type: "select"
-            },
-            table: {
-                category: "Parent",
-                subcategory: "main-axis"
-            }
-        },
-        justifyItems: {
-            type: "text",
-            description: "This defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.",
-            required: false,
-            options: [
-                "flex-start",
-                "flex-end",
-                "center",
-                "space-between",
-                "space-around",
-                "space-evenly",
-                "stretch",
-                "start",
-                "end",
-                "baseline",
-                "first baseline",
-                "last baseline",
-                "safe center",
-                "unsafe center"
-            ],
-            control: {
-                type: "select"
-            },
-            table: {
-                category: "Parent"
-            }
-        },
-        justifyContent: {
-            type: "text",
-            description: "This defines the alignment along the main axis. It helps distribute extra free space leftover when either all the flex items on a line are inflexible, or are flexible but have reached their maximum size. It also exerts some control over the alignment of items when they overflow the line.",
-            required: false,
-            options: [
-                "flex-start",
-                "flex-end",
-                "center",
-                "space-between",
-                "space-around",
-                "space-evenly",
-                "stretch",
-                "start",
-                "end",
-                "left",
-                "right",
-                "safe center",
-                "unsafe center"
-            ],
-            control: {
-                type: "select"
-            },
-            table: {
-                category: "Parent",
-                subcategory: "main-axis"
-            }
-        },
-        flexWrap: {
-            type: "text",
-            description: "By default, flex items will all try to fit onto one line. You can change that and allow the items to wrap as needed with this property.",
-            required: false,
-            options: [
-                "nowrap",
-                "wrap",
-                "wrap-reverse"
-            ],
-            control: {
-                type: "select"
-            },
-            table: {
-                category: "Parent"
-            }
-        },
-        flex: {
-            type: "text",
-            description: "This is the shorthand for flex-grow, flex-shrink and flex-basis combined. The second and third parameters (flex-shrink and flex-basis) are optional. The default is 0 1 auto, but if you set it with a single number value, it’s like 1 0.",
-            required: false,
-            control: {
-                type: "text"
-            },
-            table: {
-                category: "Children"
-            }
-        },
-        flexGrow: {
-            type: "text",
-            description: "This defines the ability for a flex item to grow if necessary. It accepts a unitless value that serves as a proportion. It dictates what amount of the available space inside the flex container the item should take up.",
-            required: false,
-            control: {
-                type: "number"
-            },
-            table: {
-                category: "Children"
-            }
-        },
-        flexShrink: {
-            type: "text",
-            description: "This defines the ability for a flex item to shrink if necessary.",
-            required: false,
-            control: {
-                type: "number"
-            },
-            table: {
-                category: "Children"
-            }
-        },
-        flexBasis: {
-            type: "text",
-            description: "This defines the default size of an element before the remaining space is distributed. It can be a length (e.g. 20%, 5rem, etc.) or a keyword. The auto keyword means “look at my width or height property” (which was temporarily done by the main-size keyword until deprecated).",
-            required: false,
-            control: {
-                type: "number"
-            },
-            table: {
-                category: "Children"
-            }
-        },
-        justifySelf: {
-            type: "text",
-            description: "This  sets the way a box is justified inside its alignment container along the appropriate axis.",
-            required: false,
-            options: [
-                "flex-start",
-                "flex-end",
-                "center",
-                "space-between",
-                "space-around",
-                "space-evenly",
-                "stretch",
-                "start",
-                "end",
-                "baseline",
-                "first baseline",
-                "last baseline",
-                "safe center",
-                "unsafe center"
-            ],
-            control: {
-                type: "select"
-            },
-            table: {
-                category: "Children"
-            }
-        },
-        alignContent: {
-            type: "text",
-            description: "This aligns a flex container’s lines within when there is extra space in the cross-axis, similar to how justify-content aligns individual items within the main-axis.",
-            required: false,
-            options: [
-                "flex-start",
-                "flex-end",
-                "center",
-                "space-between",
-                "space-around",
-                "space-evenly",
-                "stretch",
-                "start",
-                "end",
-                "baseline",
-                "first baseline",
-                "last baseline",
-                "safe center",
-                "unsafe center"
-            ],
-            control: {
-                type: "select"
-            },
-            table: {
-                category: "Parent",
-                subcategory: "cross-axis"
-            }
-        },
-        alignSelf: {
-            type: "text",
-            description: "This allows the default alignment (or the one specified by align-items) to be overridden for individual flex items.",
-            required: false,
-            options: [
-                "flex-start",
-                "flex-end",
-                "center",
-                "space-between",
-                "space-around",
-                "space-evenly",
-                "stretch",
-                "start",
-                "end",
-                "baseline",
-                "first baseline",
-                "last baseline",
-                "safe center",
-                "unsafe center"
-            ],
-            control: {
-                type: "select"
-            },
-            table: {
-                category: "Children"
-            }
-        },
-        order: {
-            type: "text",
-            description: "By default, flex items are laid out in the source order. However, the order property controls the order in which they appear in the flex container.",
-            required: false,
-            control: {
-                type: "number"
-            },
-            table: {
-                category: "Children"
-            }
-        },
-        rowGap: {
-            type: "text",
-            description: "The row-gap CSS property sets the size of the gap (gutter) between an element's flex rows.",
-            required: false,
-            control: {
-                type: "text"
-            },
-            table: {
-                category: "Parent"
-            }
-        },
-        columnGap: {
-            type: "text",
-            description: "The column-gap CSS property sets the size of the gap (gutter) between an element's flex columns.",
-            required: false,
-            control: {
-                type: "text"
-            },
-            table: {
-                category: "Parent"
-            }
-        }
-    },
-    parameters: {
-        docs: {
-            description: {
-                component: `The Flex component is a flexbox helper component that lets you write these common css properties more succinctly and inline.
-      
-Like the Box component, it includes all the style props exported by the color, layout, position, and shadow utilities from the [styled-system](https://styled-system.com) library, but also fully includes the flexbox ones.
-      
-[See more about styled-system utilities](https://styled-system.com/api)`
-            }
-        }
-    }
-});
-/*
- ** Template component creates a sandbox to play with Flexbox properties.
- ** Children Flexbox props are passed to the first Square child, that allow
- ** you to play with the flexbox properties for children.
- */ const Template = (args)=>/*#__PURE__*/ external_react_default().createElement(Flex["default"], args, /*#__PURE__*/ external_react_default().createElement(Flex["default"], {
-        ...args,
-        width: "25vw",
-        height: "25vw",
-        color: "white",
-        backgroundColor: "darkslategray"
-    }, "Control me with flex children props"), /*#__PURE__*/ external_react_default().createElement(Flex["default"], {
-        width: "25vw",
-        height: "25vw",
-        backgroundColor: "lightslategray"
-    }), /*#__PURE__*/ external_react_default().createElement(Flex["default"], {
-        width: "25vw",
-        height: "25vw",
-        backgroundColor: "darkgray"
-    }));
-const Default = Template.bind({});
-
-})();
-
-module.exports = __webpack_exports__;
-})()
-;
-//# sourceMappingURL=Flex.stories.js.map