@marigold/components 0.0.3 → 0.3.1

package/dist/components.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"components.cjs.production.min.js","sources":["../src/Box/Box.tsx","../src/Button/Button.tsx","../src/Label/Label.tsx","../src/Input/Input.tsx","../src/ValidationMessage/ValidationMessage.tsx","../src/Heading/Heading.tsx","../src/Link/Link.tsx","../src/Radio/Radio.tsx","../src/Alert/Alert.tsx","../src/Badge/Badge.tsx","../src/Checkbox/Checkbox.tsx","../src/Column/Column.tsx","../src/Columns/Columns.tsx","../src/Container/Container.tsx","../src/Dialog/Dialog.tsx","../src/Divider/Divider.tsx","../src/Field/Field.tsx","../src/Hidden/Hidden.tsx","../src/Image/Image.tsx","../src/Menu/Menu.tsx","../src/MenuItem/MenuItem.tsx","../src/Message/Message.tsx","../src/Select/Select.tsx","../src/Slider/Slider.tsx","../src/Stack/Stack.tsx","../src/Text/Text.tsx","../src/Textarea/Textarea.tsx"],"sourcesContent":["import { createElement, forwardRef } from 'react';\nimport { ResponsiveStyleValue, useStyles } from '@marigold/system';\nimport { ComponentWithAs } from '@marigold/types';\n\nexport type BoxProps = {\n  className?: string;\n  variant?: string | string[];\n\n  display?: ResponsiveStyleValue<string>;\n\n  height?: ResponsiveStyleValue<number | string>;\n  width?: ResponsiveStyleValue<number | string>;\n  minWidth?: ResponsiveStyleValue<number | string>;\n  maxWidth?: ResponsiveStyleValue<number | string>;\n\n  position?: ResponsiveStyleValue<string>;\n  top?: ResponsiveStyleValue<number | string>;\n  bottom?: ResponsiveStyleValue<number | string>;\n  right?: ResponsiveStyleValue<number | string>;\n  left?: ResponsiveStyleValue<number | string>;\n  zIndex?: ResponsiveStyleValue<number | string>;\n\n  p?: ResponsiveStyleValue<number | string>;\n  px?: ResponsiveStyleValue<number | string>;\n  py?: ResponsiveStyleValue<number | string>;\n  pt?: ResponsiveStyleValue<number | string>;\n  pb?: ResponsiveStyleValue<number | string>;\n  pl?: ResponsiveStyleValue<number | string>;\n  pr?: ResponsiveStyleValue<number | string>;\n\n  m?: ResponsiveStyleValue<number | string>;\n  mx?: ResponsiveStyleValue<number | string>;\n  my?: ResponsiveStyleValue<number | string>;\n  mt?: ResponsiveStyleValue<number | string>;\n  mb?: ResponsiveStyleValue<number | string>;\n  ml?: ResponsiveStyleValue<number | string>;\n  mr?: ResponsiveStyleValue<number | string>;\n\n  flexDirection?: ResponsiveStyleValue<string>;\n  flexWrap?: ResponsiveStyleValue<string>;\n  flexShrink?: ResponsiveStyleValue<number | string>;\n  flexGrow?: ResponsiveStyleValue<number | string>;\n  alignItems?: ResponsiveStyleValue<string>;\n  justifyContent?: ResponsiveStyleValue<string>;\n\n  bg?: ResponsiveStyleValue<number | string>;\n  border?: ResponsiveStyleValue<number | string>;\n  borderRadius?: ResponsiveStyleValue<number | string>;\n  boxShadow?: ResponsiveStyleValue<number | string>;\n  opacity?: ResponsiveStyleValue<number | string>;\n  overflow?: ResponsiveStyleValue<string>;\n\n  transition?: ResponsiveStyleValue<number | string>;\n};\n\nexport const Box: ComponentWithAs<BoxProps, 'div'> = forwardRef(\n  (\n    {\n      variant,\n      as = 'div',\n      children,\n      className,\n      display,\n      height,\n      width,\n      minWidth,\n      maxWidth,\n      position,\n      top,\n      bottom,\n      right,\n      left,\n      zIndex,\n      p,\n      px,\n      py,\n      pt,\n      pb,\n      pl,\n      pr,\n      m,\n      mx,\n      my,\n      mt,\n      mb,\n      ml,\n      mr,\n      flexDirection,\n      flexWrap,\n      flexShrink,\n      flexGrow,\n      alignItems,\n      justifyContent,\n      bg,\n      border,\n      borderRadius,\n      boxShadow,\n      opacity,\n      overflow,\n      transition,\n      ...props\n    },\n    ref\n  ) => {\n    const cn = useStyles({\n      element: as,\n      variant,\n      className,\n      css: {\n        display,\n        height,\n        width,\n        minWidth,\n        maxWidth,\n        position,\n        top,\n        bottom,\n        right,\n        left,\n        zIndex,\n        p,\n        px,\n        py,\n        pt,\n        pb,\n        pl,\n        pr,\n        m,\n        mx,\n        my,\n        mt,\n        mb,\n        ml,\n        mr,\n        flexDirection,\n        flexWrap,\n        flexShrink,\n        flexGrow,\n        alignItems,\n        justifyContent,\n        bg,\n        border,\n        borderRadius,\n        boxShadow,\n        opacity,\n        overflow,\n        transition,\n      },\n    });\n    return createElement(as, { ...props, ref, className: cn }, children);\n  }\n);\n","import React from 'react';\nimport { ComponentPropsWithRef } from '@marigold/types';\nimport { Box } from '../Box';\n\nexport type ButtonProps = {\n  variant?: string;\n} & ComponentPropsWithRef<'button'>;\n\nexport const Button: React.FC<ButtonProps> = ({\n  variant = 'primary.large',\n  children,\n  ...props\n}) => {\n  return (\n    <Box as=\"button\" {...props} variant={`button.${variant}`}>\n      <Box as=\"span\" display=\"inline-flex\" alignItems=\"center\">\n        {children}\n      </Box>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\n\nexport type LabelProps = {\n  htmlFor: string;\n  variant?: string;\n} & ComponentProps<'label'>;\n\nexport const Label: React.FC<LabelProps> = ({\n  variant = 'default',\n  children,\n  ...props\n}) => (\n  <Box {...props} as=\"label\" variant={`label.${variant}`}>\n    {children}\n  </Box>\n);\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\n\nexport type InputProps = {\n  variant?: string;\n} & ComponentProps<'input'>;\n\nexport const Input: React.FC<InputProps> = ({\n  variant = 'default',\n  type = 'text',\n  ...props\n}) => <Box {...props} as=\"input\" type={type} variant={`input.${variant}`} />;\n","import React from 'react';\nimport { useStyles } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\n\nexport type ValidationMessageProps = {\n  variant?: string;\n} & ComponentProps<'span'>;\n\nexport const ValidationMessage: React.FC<ValidationMessageProps> = ({\n  variant = 'error',\n  children,\n  className,\n  ...props\n}) => {\n  const classNames = useStyles({\n    variant: `validation.${variant}`,\n    css: {\n      display: 'flex',\n      alignItems: 'center',\n    },\n    className,\n  });\n\n  return (\n    <span className={classNames} {...props}>\n      {children}\n    </span>\n  );\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\n\nexport type HeadingProps = {\n  as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n  variant?: string;\n} & ComponentProps<'h1'>;\n\nexport const Heading: React.FC<HeadingProps> = ({\n  as = 'h2',\n  variant = 'h2',\n  children,\n  ...props\n}) => (\n  <Box {...props} as={as} variant={`text.${variant}`}>\n    {children}\n  </Box>\n);\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\n\nexport type LinkProps = {\n  variant?: string;\n} & ComponentProps<'a'>;\n\nexport const Link: React.FC<LinkProps> = ({\n  variant = 'normal',\n  children,\n  ...props\n}) => (\n  <Box {...props} as=\"a\" variant={`link.${variant}`}>\n    {children}\n  </Box>\n);\n","import React from 'react';\nimport { CircleUnchecked, CircleChecked, Required } from '@marigold/icons';\nimport { useStyles } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\nimport { Label } from '../Label';\n\n// Radio Icon\n// ---------------\ntype RadioIconProps = {\n  className?: string;\n  variant?: string;\n  checked?: boolean;\n  children?: never;\n};\n\nconst RadioIcon: React.FC<RadioIconProps> = ({\n  className,\n  variant,\n  checked,\n}) => {\n  const radioIconStyle = useStyles({\n    variant: `form.${variant}`,\n    css: {\n      ariaHidden: 'true',\n      mr: 2,\n      verticalAlign: 'middle',\n      ':hover': { cursor: 'pointer' },\n      'input:disabled ~ &': {\n        color: 'muted',\n        cursor: 'not-allowed',\n      },\n    },\n    className,\n  });\n\n  if (checked) {\n    return <CircleChecked className={radioIconStyle} />;\n  }\n  return <CircleUnchecked className={radioIconStyle} />;\n};\n\n// Radio Input\n// ---------------\ntype RadioInputProps = {\n  variant?: string;\n} & ComponentProps<'input'>;\n\nconst RadioInput: React.FC<RadioInputProps> = ({\n  className,\n  variant = 'radio',\n  ...props\n}) => {\n  const radioStyle = useStyles({\n    css: {\n      position: 'absolute',\n      opacity: 0,\n      zIndex: -1,\n      width: 1,\n      height: 1,\n      overflow: 'hidden',\n    },\n  });\n\n  return (\n    <Box display=\"inline-block\">\n      <input type=\"radio\" className={radioStyle} {...props} />\n      <RadioIcon\n        checked={props.checked}\n        className={className}\n        variant={variant}\n      />\n    </Box>\n  );\n};\n\n// Radio\n// ---------------\nexport type RadioProps = {\n  id: string;\n  label?: string;\n  required?: boolean;\n} & RadioInputProps;\n\nexport const Radio: React.FC<RadioProps> = ({ label, required, ...props }) => {\n  if (label) {\n    return (\n      <Label htmlFor={props.id}>\n        <RadioInput {...props} />\n        {label}\n        {required && <Required size={16} />}\n      </Label>\n    );\n  }\n\n  return <RadioInput {...props} />;\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Exclamation, Check, Notification } from '@marigold/icons';\nimport { useStyles } from '@marigold/system';\nimport { Box } from '../Box';\n\nexport type AlertProps = {\n  variant?: string;\n} & ComponentProps<'div'>;\n\nexport const Alert: React.FC<AlertProps> = ({\n  variant = 'success',\n  children,\n  className,\n  ...props\n}) => {\n  const classNames = useStyles({\n    css: {\n      display: 'flex',\n      alignItems: 'center',\n    },\n    variant: `alerts.${variant}`,\n    className,\n  });\n\n  var bgColor = 'success';\n  if (variant === 'warning') {\n    bgColor = 'warning';\n  } else if (variant === 'error') {\n    bgColor = 'error';\n  }\n  const iconClassName = useStyles({ css: { bg: bgColor, m: '10px' } });\n\n  var icon = <Check size={12} color=\"#ffffff\" className={iconClassName} />;\n  if (variant === 'warning') {\n    icon = <Notification size={12} color=\"#ffffff\" className={iconClassName} />;\n  } else if (variant === 'error') {\n    icon = <Exclamation size={12} color=\"#ffffff\" className={iconClassName} />;\n  }\n\n  return (\n    <Box {...props} className={classNames}>\n      <Box\n        display=\"inline-block\"\n        alignItems=\"center\"\n        width=\"32px\"\n        height=\"32px\"\n        className={useStyles({\n          css: {\n            bg: bgColor,\n          },\n        })}\n      >\n        {icon}\n      </Box>\n      <Box mx=\"16px\">{children}</Box>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\nimport { useStyles } from '@marigold/system';\n\nexport type BadgeProps = {\n  variant?: string;\n  bgColor?: string;\n  borderColor?: string;\n} & ComponentProps<'div'>;\n\nexport const Badge: React.FC<BadgeProps> = ({\n  variant = 'default',\n  bgColor = 'transparent',\n  borderColor = 'transparent',\n  children,\n  ...props\n}) => (\n  <Box\n    className={useStyles({ css: { bg: bgColor, borderColor: borderColor } })}\n    variant={`badge.${variant}`}\n    {...props}\n  >\n    {children}\n  </Box>\n);\n","import React from 'react';\nimport { Required, SquareUnchecked, SquareChecked } from '@marigold/icons';\nimport { useStyles } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Box } from '../Box';\nimport { Label } from '../Label';\n\nexport type CheckboxProps = {\n  id: string;\n  variant?: string;\n  label?: string;\n} & Omit<ComponentProps<'input'>, 'type' | 'id'>;\n\nexport const Checkbox: React.FC<CheckboxProps> = ({\n  id,\n  variant = 'default',\n  label,\n  required,\n  className,\n  ...props\n}) => {\n  const checkboxStyles = useStyles({\n    css: {\n      position: 'absolute',\n      opacity: 0,\n      zIndex: -1,\n      width: 1,\n      height: 1,\n      overflow: 'hidden',\n    },\n  });\n\n  const checkboxIconStyles = useStyles({\n    variant: `checkbox.${variant}`,\n    css: {\n      mr: 2,\n      verticalAlign: 'middle',\n      ':hover': { cursor: 'pointer' },\n      'input:disabled ~ &': {\n        color: 'muted',\n        cursor: 'not-allowed',\n      },\n    },\n    className,\n  });\n\n  const checkbox = (\n    <Box display=\"inline-block\">\n      <input type=\"checkbox\" className={checkboxStyles} {...props} />\n      {props.checked ? (\n        <SquareChecked aria-hidden=\"true\" className={checkboxIconStyles} />\n      ) : (\n        <SquareUnchecked aria-hidden=\"true\" className={checkboxIconStyles} />\n      )}\n    </Box>\n  );\n\n  return (\n    <>\n      {label ? (\n        <Label htmlFor={id}>\n          {checkbox}\n          {label}\n          {required ? <Required size={16} /> : ''}\n        </Label>\n      ) : (\n        <>{checkbox}</>\n      )}\n    </>\n  );\n};\n","import React from 'react';\nimport { Box } from '../Box';\n\nexport type ColumnProps = {\n  className?: string;\n  width?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n};\n\nexport const Column: React.FC<ColumnProps> = ({\n  width = 12,\n  children,\n  ...props\n}) => (\n  <Box {...props} width={`${(width / 12) * 100}%`}>\n    {children}\n  </Box>\n);\n","import React, { Children } from 'react';\nimport { useStyles } from '@marigold/system';\nimport { Box } from '../Box';\nimport flattenChildren from 'react-keyed-flatten-children';\n\ntype ColumnsProps = {\n  className?: string;\n  space?: number;\n  horizontalAlign?: 'left' | 'right' | 'center';\n  verticalAlign?: 'top' | 'bottom' | 'center';\n  title?: string; // Should only be used for testing.\n};\n\nexport const Columns: React.FC<ColumnsProps> = ({\n  space = 0,\n  horizontalAlign = 'left',\n  verticalAlign = 'top',\n  className,\n  children,\n  ...props\n}) => {\n  let columnItems = flattenChildren(children);\n  let childClassNames = useStyles({ css: { p: `${space / 2}px` } });\n\n  // horizontal Alignment\n  let justify = 'flex-start';\n  if (horizontalAlign === 'right') {\n    justify = 'flex-end';\n  } else if (horizontalAlign === 'center') {\n    justify = 'center';\n  }\n\n  // vertical Alignment\n  let alignItems = 'flex-start';\n  if (verticalAlign === 'bottom') {\n    alignItems = 'flex-end';\n  } else if (verticalAlign === 'center') {\n    alignItems = 'center';\n  }\n\n  return (\n    <Box p={`${space}px`} display=\"flex\" className={className}>\n      <Box\n        width={`calc(100% + ${space}px)`}\n        m={`${-space / 2}px`}\n        display=\"flex\"\n        flexWrap=\"wrap\"\n        alignItems={alignItems}\n        justifyContent={justify}\n        {...props}\n      >\n        {Children.map(\n          (columnItems as unknown) as React.ReactElement,\n          (child: React.ReactElement) => {\n            return React.cloneElement(\n              child,\n              {\n                className: childClassNames,\n              },\n              <Box className={child && child.props.className}>\n                {child.props.children}\n              </Box>\n            );\n          }\n        )}\n      </Box>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { Box } from '../Box';\n\nexport type ContainerProps = {\n  className?: string;\n  title?: string; // Used for testing.\n};\n\nexport const Container: React.FC<ContainerProps> = ({ children, ...props }) => (\n  <Box {...props} width=\"100%\">\n    {children}\n  </Box>\n);\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Close } from '@marigold/icons';\nimport { Button } from '../Button';\nimport { Box } from '../Box';\n\nexport type DialogProps = {\n  onClose?: ComponentProps<typeof Button>['onClick'];\n} & ComponentProps<'div'>;\n\nexport const Dialog: React.FC<DialogProps> = ({\n  onClose,\n  children,\n  className,\n  ...props\n}) => {\n  return (\n    <Box display=\"flex\" width=\"100%\">\n      <Box {...props} variant=\"dialog.wrapper\" className={className}>\n        <Box display=\"flex\">\n          <Box variant=\"dialog.body\">{children}</Box>\n          <Box variant=\"dialog.onClose\">\n            <Button variant=\"text.root\" onClick={onClose}>\n              <Close size={16} />\n            </Button>\n          </Box>\n        </Box>\n      </Box>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { Box } from '../Box';\n\nexport type DividerProps = {\n  className?: string;\n  variant?: string;\n  title?: string; // Should only be used for testing.\n};\n\nexport const Divider: React.FC<DividerProps> = ({\n  variant = 'regular',\n  ...props\n}) => <Box {...props} as=\"hr\" variant={`divider.${variant}`} />;\n","import React from 'react';\nimport { useStyles } from '@marigold/system';\nimport { Exclamation, Required } from '@marigold/icons';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Input } from '../Input';\nimport { Label } from '../Label';\nimport { ValidationMessage } from '../ValidationMessage';\n\nexport type FieldProps = {\n  variant?: string;\n  htmlFor: string;\n  label: string;\n  error?: string;\n} & ComponentProps<'input'>;\n\nexport const Field: React.FC<FieldProps> = ({\n  variant = 'default',\n  type = 'text',\n  className = '',\n  htmlFor,\n  label,\n  error,\n  ...props\n}) => {\n  const labelClassName = useStyles({\n    variant: `field.${variant}`,\n    className,\n  });\n  const errorClassName = useStyles({ css: { color: 'red60' } });\n\n  return (\n    <div>\n      <Label className={labelClassName} htmlFor={htmlFor}>\n        {label}\n        {error ? <Required size={16} className={errorClassName} /> : ''}\n      </Label>\n      <Input {...props} type={type} id={htmlFor} />\n      {error ? (\n        <ValidationMessage>\n          <Exclamation size={16} />\n          {error}\n        </ValidationMessage>\n      ) : (\n        ''\n      )}\n    </div>\n  );\n};\n","import React from 'react';\nimport { Box } from '../Box';\n\nexport type HiddenProps = {\n  show?: boolean;\n};\n\nexport const Hidden: React.FC<HiddenProps> = ({\n  show = false,\n  children,\n  ...props\n}) => (\n  <Box {...props} as=\"span\" display={show ? 'display' : 'none'}>\n    {children}\n  </Box>\n);\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\n\nexport type ImageProps = {\n  variant?: string;\n  children?: never;\n} & ComponentProps<'img'>;\n\nexport const Image: React.FC<ImageProps> = ({\n  variant = 'fullWidth',\n  ...props\n}) => <Box {...props} as=\"img\" variant={`images.${variant}`} />;\n","import React from 'react';\nimport { useStyles } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Button } from '../Button';\nimport { Box } from '../Box';\n\nexport type MenuProps = {\n  variant?: string;\n  label?: string;\n  onClick: ComponentProps<typeof Button>['onClick'];\n  show?: boolean;\n  className?: string;\n  title?: string; // For testing\n};\n\nexport const Menu: React.FC<MenuProps> = ({\n  variant = 'menu',\n  label = 'Menu',\n  onClick,\n  show = false,\n  children,\n  ...props\n}) => {\n  const itemStyles = useStyles({\n    css: {\n      position: 'absolute',\n      minWidth: '120px',\n      display: 'block',\n      textAlign: 'left',\n      borderRadius: '2px',\n    },\n  });\n\n  return (\n    <Box variant={`content.${variant}`} {...props}>\n      <Button onClick={onClick} variant=\"menu\">\n        {label}\n      </Button>\n      {show ? <div className={itemStyles}>{children}</div> : null}\n    </Box>\n  );\n};\n","import React from 'react';\nimport { useStyles } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\nimport { Link } from '../Link';\n\nexport type MenuItemProps = {\n  variant?: string;\n} & ComponentProps<typeof Link>;\n\nexport const MenuItem: React.FC<MenuItemProps> = ({\n  variant = 'menuItem',\n  className,\n  children,\n  ...props\n}) => {\n  const classNames = useStyles({\n    variant: `menu.${variant}`,\n    className,\n  });\n\n  return (\n    <Link {...props} variant=\"menu\" className={classNames}>\n      {children}\n    </Link>\n  );\n};\n","import React from 'react';\nimport { Exclamation, Info, Notification } from '@marigold/icons';\nimport { useStyles } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\nimport { Heading } from '../Heading';\n\nexport type MessageProps = {\n  messageTitle: string;\n  variant?: string;\n} & ComponentProps<'div'>;\n\nexport const Message: React.FC<MessageProps> = ({\n  messageTitle,\n  variant = 'info',\n  className,\n  children,\n  ...props\n}) => {\n  var icon = <Info />;\n  if (variant === 'warning') {\n    icon = <Notification />;\n  }\n  if (variant === 'error') {\n    icon = <Exclamation />;\n  }\n\n  return (\n    <Box\n      display=\"inline-block\"\n      variant={`messages.${variant}`}\n      className={className}\n      {...props}\n    >\n      <Box display=\"flex\" alignItems=\"center\" variant=\"messages.title\">\n        {icon}\n        <Heading\n          variant=\"h4\"\n          className={useStyles({\n            css: {\n              display: 'inline',\n            },\n          })}\n        >\n          {messageTitle}\n        </Heading>\n      </Box>\n      <Box className={useStyles({ css: { color: 'black' } })}>{children}</Box>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { ArrowDown } from '@marigold/icons';\nimport { useStyles } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\n\nexport type SelectProps = { variant?: string } & ComponentProps<'select'>;\n\nexport const Select: React.FC<SelectProps> = ({\n  variant = 'default',\n  children,\n  ...props\n}) => {\n  const iconStyles = useStyles({\n    css: {\n      alignSelf: 'center',\n      pointerEvents: 'none',\n      ml: '-28px',\n    },\n  });\n\n  return (\n    <Box display=\"flex\">\n      <Box as=\"select\" variant={`select.${variant}`} {...props}>\n        {children}\n      </Box>\n      <ArrowDown className={iconStyles} />\n    </Box>\n  );\n};\n","import React from 'react';\nimport { useStyles } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\n\nexport type SliderProps = {\n  variant?: string;\n} & ComponentProps<'input'>;\n\nexport const Slider: React.FC<SliderProps> = ({\n  variant = 'slider',\n  className,\n  ...props\n}) => {\n  const classNames = useStyles({\n    variant: `form.${variant}`,\n    css: {\n      verticalAlign: 'middle',\n    },\n    className,\n  });\n\n  return <input type=\"range\" className={classNames} {...props} />;\n};\n","import React, { Children } from 'react';\nimport { ResponsiveStyleValue } from '@marigold/system';\nimport { Box } from '../Box';\nimport flattenChildren from 'react-keyed-flatten-children';\n\nexport type StackProps = {\n  className?: string;\n  space?: ResponsiveStyleValue<number | string>;\n  align?: 'left' | 'right' | 'center';\n  title?: string; // For Testing\n};\n\nexport const Stack: React.FC<StackProps> = ({\n  space = 0,\n  align = 'left',\n  children,\n  ...props\n}) => {\n  let stackItems = flattenChildren(children);\n  let display = 'flex';\n  let flexDirection = 'column';\n  let alignItems = align === 'right' ? 'flex-end' : 'center';\n  if (align === 'left') {\n    display = 'block';\n    flexDirection = 'row';\n    alignItems = 'flex-start';\n  }\n\n  return (\n    <Box p={space} display={display} flexDirection={flexDirection} {...props}>\n      {Children.map(stackItems, (child, index) => (\n        <Box\n          display={display}\n          flexDirection={flexDirection}\n          alignItems={alignItems}\n          pt={space}\n          mt={index === 0 ? -space! : 0}\n        >\n          {child}\n        </Box>\n      ))}\n    </Box>\n  );\n};\n","import React from 'react';\nimport { useStyles } from '@marigold/system';\nimport { ComponentPropsWithRef } from '@marigold/types';\nimport { Box, BoxProps } from '../Box';\n\nexport type TextProps = {\n  className?: string;\n  as?: 'p' | 'span' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n  variant?: string;\n  textColor?: string;\n} & ComponentPropsWithRef<'span'> &\n  BoxProps;\n\nexport const Text: React.FC<TextProps> = ({\n  as = 'span',\n  variant = 'body',\n  textColor = 'inherit',\n  className,\n  children,\n  ...props\n}) => {\n  const classNames = useStyles({\n    variant: `text.${variant}`,\n    css: {\n      color: textColor,\n    },\n    className,\n  });\n\n  return (\n    <Box as={as} className={classNames} {...props}>\n      {children}\n    </Box>\n  );\n};\n","import React from 'react';\nimport { useStyles } from '@marigold/system';\nimport { Exclamation, Required } from '@marigold/icons';\nimport { ComponentProps } from '@marigold/types';\n\nimport { ValidationMessage } from '../ValidationMessage';\nimport { Label } from '../Label';\nimport { Box } from '../Box';\n\nexport type TextareaProps = {\n  variant?: string;\n  label?: string;\n  htmlFor?: string;\n  errorMessage?: string;\n  required?: boolean;\n} & ComponentProps<'textarea'>;\n\nexport const Textarea: React.FC<TextareaProps> = ({\n  variant = 'default',\n  htmlFor = 'textarea',\n  label,\n  errorMessage,\n  required = false,\n  className = '',\n  children,\n  ...props\n}) => {\n  const errorClassName = useStyles({ css: { color: 'error' } });\n  const textareaClassNames = useStyles({\n    css: { outlineColor: errorMessage && 'error' },\n    className,\n  });\n\n  return (\n    <Box>\n      {label && (\n        <Label htmlFor={htmlFor}>\n          {label}\n          {(errorMessage || required) && (\n            <Required size={16} className={errorClassName} />\n          )}\n        </Label>\n      )}\n      <Box\n        as=\"textarea\"\n        {...props}\n        display=\"block\"\n        variant={`textarea.${variant}`}\n        className={textareaClassNames}\n      />\n      {errorMessage && (\n        <ValidationMessage>\n          <Exclamation size={16} />\n          {errorMessage}\n        </ValidationMessage>\n      )}\n    </Box>\n  );\n};\n"],"names":["Box","forwardRef","ref","variant","as","children","className","display","height","width","minWidth","maxWidth","position","top","bottom","right","left","zIndex","p","px","py","pt","pb","pl","pr","m","mx","my","mt","mb","ml","mr","flexDirection","flexWrap","flexShrink","flexGrow","alignItems","justifyContent","bg","border","borderRadius","boxShadow","opacity","overflow","transition","props","cn","useStyles","element","css","createElement","Button","React","Label","Input","type","ValidationMessage","classNames","Heading","Link","RadioIcon","checked","radioIconStyle","ariaHidden","verticalAlign","cursor","color","CircleChecked","CircleUnchecked","RadioInput","radioStyle","bgColor","iconClassName","icon","Check","size","Notification","Exclamation","borderColor","id","label","required","checkboxStyles","checkboxIconStyles","checkbox","SquareChecked","SquareUnchecked","htmlFor","Required","space","horizontalAlign","columnItems","flattenChildren","childClassNames","justify","Children","map","child","cloneElement","onClose","onClick","Close","error","labelClassName","errorClassName","show","itemStyles","textAlign","messageTitle","Info","iconStyles","alignSelf","pointerEvents","ArrowDown","align","stackItems","index","textColor","errorMessage","textareaClassNames","outlineColor"],"mappings":"gjBAuDaA,EAAwCC,cACnD,WA8CEC,OA5CEC,IAAAA,YACAC,GAAAA,aAAK,QACLC,IAAAA,SACAC,IAAAA,UACAC,IAAAA,QACAC,IAAAA,OACAC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,SACAC,IAAAA,SACAC,IAAAA,IACAC,IAAAA,OACAC,IAAAA,MACAC,IAAAA,KACAC,IAAAA,OACAC,IAAAA,EACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,EACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,GACAC,IAAAA,cACAC,IAAAA,SACAC,IAAAA,WACAC,IAAAA,SACAC,IAAAA,WACAC,IAAAA,eACAC,IAAAA,GACAC,IAAAA,OACAC,IAAAA,aACAC,IAAAA,UACAC,IAAAA,QACAC,IAAAA,SACAC,IAAAA,WACGC,kXAICC,EAAKC,YAAU,CACnBC,QAAS5C,EACTD,QAAAA,EACAG,UAAAA,EACA2C,IAAK,CACH1C,QAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,IAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,KAAAA,EACAC,OAAAA,EACAC,EAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,EAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,GAAAA,EACAC,cAAAA,EACAC,SAAAA,EACAC,WAAAA,EACAC,SAAAA,EACAC,WAAAA,EACAC,eAAAA,EACAC,GAAAA,EACAC,OAAAA,EACAC,aAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,WAAAA,YAGGM,gBAAc9C,OAASyC,GAAO3C,IAAAA,EAAKI,UAAWwC,IAAMzC,MC7IlD8C,EAAgC,oBAC3ChD,QAAAA,aAAU,kBACVE,IAAAA,SACGwC,qCAGDO,gBAACpD,iBAAII,GAAG,UAAayC,GAAO1C,kBAAmBA,IAC7CiD,gBAACpD,GAAII,GAAG,OAAOG,QAAQ,cAAc6B,WAAW,UAC7C/B,KCPIgD,EAA8B,oBACzClD,QAAAA,aAAU,YACVE,IAAAA,SACGwC,qCAEHO,gBAACpD,mBAAQ6C,GAAOzC,GAAG,QAAQD,iBAAkBA,IAC1CE,ICPQiD,EAA8B,oBACzCnD,QAAAA,aAAU,gBACVoD,KAAAA,aAAO,SACJV,iCACCO,gBAACpD,mBAAQ6C,GAAOzC,GAAG,QAAQmD,KAAMA,EAAMpD,iBAAkBA,MCJlDqD,EAAsD,oBACjErD,QAAAA,aAAU,UACVE,IAAAA,SACAC,IAAAA,UACGuC,0CAEGY,EAAaV,YAAU,CAC3B5C,sBAAuBA,EACvB8C,IAAK,CACH1C,QAAS,OACT6B,WAAY,UAEd9B,UAAAA,WAIA8C,sCAAM9C,UAAWmD,GAAgBZ,GAC9BxC,IChBMqD,EAAkC,oBAC7CtD,GAAAA,aAAK,WACLD,QAAAA,aAAU,OACVE,IAAAA,SACGwC,0CAEHO,gBAACpD,mBAAQ6C,GAAOzC,GAAIA,EAAID,gBAAiBA,IACtCE,ICRQsD,EAA4B,oBACvCxD,QAAAA,aAAU,WACVE,IAAAA,SACGwC,qCAEHO,gBAACpD,mBAAQ6C,GAAOzC,GAAG,IAAID,gBAAiBA,IACrCE,ICECuD,EAAsC,gBAG1CC,IAAAA,QAEMC,EAAiBf,YAAU,CAC/B5C,kBAJFA,QAKE8C,IAAK,CACHc,WAAY,OACZhC,GAAI,EACJiC,cAAe,kBACL,CAAEC,OAAQ,gCACE,CACpBC,MAAO,QACPD,OAAQ,gBAGZ3D,YAhBFA,mBAoBS8C,gBADLS,EACMM,gBAEFC,mBAFgB9D,UAAWwD,KAW/BO,EAAwC,gBAC5C/D,IAAAA,cACAH,QAAAA,aAAU,UACP0C,+BAEGyB,EAAavB,YAAU,CAC3BE,IAAK,CACHrC,SAAU,WACV8B,QAAS,EACTzB,QAAS,EACTR,MAAO,EACPD,OAAQ,EACRmC,SAAU,mBAKZS,gBAACpD,GAAIO,QAAQ,gBACX6C,uCAAOG,KAAK,QAAQjD,UAAWgE,GAAgBzB,IAC/CO,gBAACQ,GACCC,QAAShB,EAAMgB,QACfvD,UAAWA,EACXH,QAASA,oBC5D0B,oBACzCA,QAAAA,aAAU,YACVE,IAAAA,SACAC,IAAAA,UACGuC,0CAEGY,EAAaV,YAAU,CAC3BE,IAAK,CACH1C,QAAS,OACT6B,WAAY,UAEdjC,kBAAmBA,EACnBG,UAAAA,IAGEiE,EAAU,UACE,YAAZpE,EACFoE,EAAU,UACW,UAAZpE,IACToE,EAAU,aAENC,EAAgBzB,YAAU,CAAEE,IAAK,CAAEX,GAAIiC,EAAS9C,EAAG,UAErDgD,EAAOrB,gBAACsB,SAAMC,KAAM,GAAIT,MAAM,UAAU5D,UAAWkE,UACvC,YAAZrE,EACFsE,EAAOrB,gBAACwB,gBAAaD,KAAM,GAAIT,MAAM,UAAU5D,UAAWkE,IACrC,UAAZrE,IACTsE,EAAOrB,gBAACyB,eAAYF,KAAM,GAAIT,MAAM,UAAU5D,UAAWkE,KAIzDpB,gBAACpD,mBAAQ6C,GAAOvC,UAAWmD,IACzBL,gBAACpD,GACCO,QAAQ,eACR6B,WAAW,SACX3B,MAAM,OACND,OAAO,OACPF,UAAWyC,YAAU,CACnBE,IAAK,CACHX,GAAIiC,MAIPE,GAEHrB,gBAACpD,GAAI0B,GAAG,QAAQrB,mBC5CqB,oBACzCF,QAAAA,aAAU,gBACVoE,QAAAA,aAAU,oBACVO,YAAAA,aAAc,gBACdzE,IAAAA,SACGwC,6DAEHO,gBAACpD,iBACCM,UAAWyC,YAAU,CAAEE,IAAK,CAAEX,GAAIiC,EAASO,YAAaA,KACxD3E,iBAAkBA,GACd0C,GAEHxC,oDCT4C,gBAC/C0E,IAAAA,OACA5E,QAAAA,aAAU,YACV6E,IAAAA,MACAC,IAAAA,SACA3E,IAAAA,UACGuC,uDAEGqC,EAAiBnC,YAAU,CAC/BE,IAAK,CACHrC,SAAU,WACV8B,QAAS,EACTzB,QAAS,EACTR,MAAO,EACPD,OAAQ,EACRmC,SAAU,YAIRwC,EAAqBpC,YAAU,CACnC5C,oBAAqBA,EACrB8C,IAAK,CACHlB,GAAI,EACJiC,cAAe,kBACL,CAAEC,OAAQ,gCACE,CACpBC,MAAO,QACPD,OAAQ,gBAGZ3D,UAAAA,IAGI8E,EACJhC,gBAACpD,GAAIO,QAAQ,gBACX6C,uCAAOG,KAAK,WAAWjD,UAAW4E,GAAoBrC,IAEpDO,gBADDP,EAAMgB,QACJwB,gBAEAC,iCAF0B,OAAOhF,UAAW6E,YAQjD/B,gCACG4B,EACC5B,gBAACC,GAAMkC,QAASR,GACbK,EACAJ,EACAC,EAAW7B,gBAACoC,YAASb,KAAM,KAAS,IAGvCvB,gCAAGgC,oBC3DkC,oBAC3C3E,MAAAA,aAAQ,KACRJ,IAAAA,SACGwC,mCAEHO,gBAACpD,mBAAQ6C,GAAOpC,MAAWA,EAAQ,GAAM,UACtCJ,oBCD0C,oBAC7CoF,MAAAA,aAAQ,QACRC,gBAAAA,aAAkB,aAClB1B,cAAAA,aAAgB,QAChB1D,IAAAA,UACAD,IAAAA,SACGwC,0EAEC8C,EAAcC,EAAgBvF,GAC9BwF,EAAkB9C,YAAU,CAAEE,IAAK,CAAE/B,EAAMuE,EAAQ,UAGnDK,EAAU,aACU,UAApBJ,EACFI,EAAU,WACmB,WAApBJ,IACTI,EAAU,cAIR1D,EAAa,mBACK,WAAlB4B,EACF5B,EAAa,WACc,WAAlB4B,IACT5B,EAAa,UAIbgB,gBAACpD,GAAIkB,EAAMuE,OAAWlF,QAAQ,OAAOD,UAAWA,GAC9C8C,gBAACpD,iBACCS,qBAAsBgF,QACtBhE,GAAOgE,EAAQ,OACflF,QAAQ,OACR0B,SAAS,OACTG,WAAYA,EACZC,eAAgByD,GACZjD,GAEHkD,WAASC,IACPL,GACD,SAACM,UACQ7C,EAAM8C,aACXD,EACA,CACE3F,UAAWuF,GAEbzC,gBAACpD,GAAIM,UAAW2F,GAASA,EAAMpD,MAAMvC,WAClC2F,EAAMpD,MAAMxC,mCCpDsB,gBAAGA,IAAAA,SAAawC,2BACjEO,gBAACpD,mBAAQ6C,GAAOpC,MAAM,SACnBJ,mBCCwC,gBAC3C8F,IAAAA,QACA9F,IAAAA,SACAC,IAAAA,UACGuC,iDAGDO,gBAACpD,GAAIO,QAAQ,OAAOE,MAAM,QACxB2C,gBAACpD,mBAAQ6C,GAAO1C,QAAQ,iBAAiBG,UAAWA,IAClD8C,gBAACpD,GAAIO,QAAQ,QACX6C,gBAACpD,GAAIG,QAAQ,eAAeE,GAC5B+C,gBAACpD,GAAIG,QAAQ,kBACXiD,gBAACD,GAAOhD,QAAQ,YAAYiG,QAASD,GACnC/C,gBAACiD,SAAM1B,KAAM,2BCfoB,oBAC7CxE,QAAAA,aAAU,YACP0C,0BACCO,gBAACpD,mBAAQ6C,GAAOzC,GAAG,KAAKD,mBAAoBA,oBCIP,oBACzCA,QAAAA,aAAU,gBACVoD,KAAAA,aAAO,aACPjD,UAAAA,aAAY,KACZiF,IAAAA,QACAP,IAAAA,MACAsB,IAAAA,MACGzD,gEAEG0D,EAAiBxD,YAAU,CAC/B5C,iBAAkBA,EAClBG,UAAAA,IAEIkG,EAAiBzD,YAAU,CAAEE,IAAK,CAAEiB,MAAO,kBAG/Cd,2BACEA,gBAACC,GAAM/C,UAAWiG,EAAgBhB,QAASA,GACxCP,EACAsB,EAAQlD,gBAACoC,YAASb,KAAM,GAAIrE,UAAWkG,IAAqB,IAE/DpD,gBAACE,mBAAUT,GAAOU,KAAMA,EAAMwB,GAAIQ,KACjCe,EACClD,gBAACI,OACCJ,gBAACyB,eAAYF,KAAM,KAClB2B,GAGH,sCCrCqC,oBAC3CG,KAAAA,gBACApG,IAAAA,SACGwC,kCAEHO,gBAACpD,mBAAQ6C,GAAOzC,GAAG,OAAOG,QAASkG,EAAO,UAAY,SACnDpG,kBCJsC,oBACzCF,QAAAA,aAAU,cACP0C,0BACCO,gBAACpD,mBAAQ6C,GAAOzC,GAAG,MAAMD,kBAAmBA,kECIT,oBACvCA,QAAAA,aAAU,aACV6E,MAAAA,aAAQ,SACRoB,IAAAA,YACAK,KAAAA,gBACApG,IAAAA,SACGwC,uDAEG6D,EAAa3D,YAAU,CAC3BE,IAAK,CACHrC,SAAU,WACVF,SAAU,QACVH,QAAS,QACToG,UAAW,OACXnE,aAAc,gBAKhBY,gBAACpD,iBAAIG,mBAAoBA,GAAe0C,GACtCO,gBAACD,GAAOiD,QAASA,EAASjG,QAAQ,QAC/B6E,GAEFyB,EAAOrD,uBAAK9C,UAAWoG,GAAarG,GAAkB,wBC9BZ,oBAC/CF,QAAAA,aAAU,aACVG,IAAAA,UACAD,IAAAA,SACGwC,0CAEGY,EAAaV,YAAU,CAC3B5C,gBAAiBA,EACjBG,UAAAA,WAIA8C,gBAACO,mBAASd,GAAO1C,QAAQ,OAAOG,UAAWmD,IACxCpD,oBCVwC,gBAC7CuG,IAAAA,iBACAzG,QAAAA,aAAU,SACVG,IAAAA,UACAD,IAAAA,SACGwC,yDAEC4B,EAAOrB,gBAACyD,mBACI,YAAZ1G,IACFsE,EAAOrB,gBAACwB,sBAEM,UAAZzE,IACFsE,EAAOrB,gBAACyB,qBAIRzB,gBAACpD,iBACCO,QAAQ,eACRJ,oBAAqBA,EACrBG,UAAWA,GACPuC,GAEJO,gBAACpD,GAAIO,QAAQ,OAAO6B,WAAW,SAASjC,QAAQ,kBAC7CsE,EACDrB,gBAACM,GACCvD,QAAQ,KACRG,UAAWyC,YAAU,CACnBE,IAAK,CACH1C,QAAS,aAIZqG,IAGLxD,gBAACpD,GAAIM,UAAWyC,YAAU,CAAEE,IAAK,CAAEiB,MAAO,YAAe7D,mBdqCpB,gBAAG2E,IAAAA,MAAOC,IAAAA,SAAapC,mCAC5DmC,EAEA5B,gBAACC,GAAMkC,QAAS1C,EAAMkC,IACpB3B,gBAACiB,mBAAexB,IACfmC,EACAC,GAAY7B,gBAACoC,YAASb,KAAM,MAK5BvB,gBAACiB,mBAAexB,oBevFoB,oBAC3C1C,QAAAA,aAAU,YACVE,IAAAA,SACGwC,8BAEGiE,EAAa/D,YAAU,CAC3BE,IAAK,CACH8D,UAAW,SACXC,cAAe,OACflF,GAAI,kBAKNsB,gBAACpD,GAAIO,QAAQ,QACX6C,gBAACpD,iBAAII,GAAG,SAASD,kBAAmBA,GAAe0C,GAChDxC,GAEH+C,gBAAC6D,aAAU3G,UAAWwG,qBClBiB,oBAC3C3G,QAAAA,aAAU,WACVG,IAAAA,UACGuC,+BAEGY,EAAaV,YAAU,CAC3B5C,gBAAiBA,EACjB8C,IAAK,CACHe,cAAe,UAEjB1D,UAAAA,WAGK8C,uCAAOG,KAAK,QAAQjD,UAAWmD,GAAgBZ,mBCTb,oBACzC4C,MAAAA,aAAQ,QACRyB,MAAAA,aAAQ,SACR7G,IAAAA,SACGwC,oCAECsE,EAAavB,EAAgBvF,GAC7BE,EAAU,OACVyB,EAAgB,SAChBI,EAAuB,UAAV8E,EAAoB,WAAa,eACpC,SAAVA,IACF3G,EAAU,QACVyB,EAAgB,MAChBI,EAAa,cAIbgB,gBAACpD,iBAAIkB,EAAGuE,EAAOlF,QAASA,EAASyB,cAAeA,GAAmBa,GAChEkD,WAASC,IAAImB,GAAY,SAAClB,EAAOmB,UAChChE,gBAACpD,GACCO,QAASA,EACTyB,cAAeA,EACfI,WAAYA,EACZf,GAAIoE,EACJ7D,GAAc,IAAVwF,GAAe3B,EAAS,GAE3BQ,qBCzB8B,oBACvC7F,GAAAA,aAAK,aACLD,QAAAA,aAAU,aACVkH,UAAAA,aAAY,YACZ/G,IAAAA,UACAD,IAAAA,SACGwC,2DAEGY,EAAaV,YAAU,CAC3B5C,gBAAiBA,EACjB8C,IAAK,CACHiB,MAAOmD,GAET/G,UAAAA,WAIA8C,gBAACpD,iBAAII,GAAIA,EAAIE,UAAWmD,GAAgBZ,GACrCxC,qBCd0C,oBAC/CF,QAAAA,aAAU,gBACVoF,QAAAA,aAAU,aACVP,IAAAA,MACAsC,IAAAA,iBACArC,SAAAA,oBACA3E,UAAAA,aAAY,KAETuC,sFAEG2D,EAAiBzD,YAAU,CAAEE,IAAK,CAAEiB,MAAO,WAC3CqD,EAAqBxE,YAAU,CACnCE,IAAK,CAAEuE,aAAcF,GAAgB,SACrChH,UAAAA,WAIA8C,gBAACpD,OACEgF,GACC5B,gBAACC,GAAMkC,QAASA,GACbP,GACCsC,GAAgBrC,IAChB7B,gBAACoC,YAASb,KAAM,GAAIrE,UAAWkG,KAIrCpD,gBAACpD,iBACCI,GAAG,YACCyC,GACJtC,QAAQ,QACRJ,oBAAqBA,EACrBG,UAAWiH,KAEZD,GACClE,gBAACI,OACCJ,gBAACyB,eAAYF,KAAM,KAClB2C"}
+{"version":3,"file":"components.cjs.production.min.js","sources":["../src/Inline/Inline.tsx","../src/Stack/Stack.tsx","../src/Alert/Alert.tsx","../src/Button/Button.tsx","../src/Checkbox/CheckboxIcons.tsx","../src/Label/Label.tsx","../src/ValidationMessage/ValidationMessage.tsx","../src/Checkbox/Checkbox.tsx","../src/Column/Column.tsx","../src/Columns/Columns.tsx","../src/Text/Text.tsx","../src/Dialog/ModalDialog.tsx","../src/Input/Input.tsx","../src/Link/Link.tsx","../src/Radio/RadioIcon.tsx","../src/Radio/Radio.tsx","../src/Select/Option.tsx","../src/Select/ListBoxSection.tsx","../src/Select/ListBox.tsx","../src/Select/Popover.tsx","../src/ActionGroup/ActionGroup.tsx","../src/Badge/Badge.tsx","../src/Card/Card.tsx","../src/Container/Container.tsx","../src/Dialog/Dialog.tsx","../src/Divider/Divider.tsx","../src/Field/Field.tsx","../src/Image/Image.tsx","../src/Provider/MarigoldProvider.tsx","../src/Menu/Menu.tsx","../src/MenuItem/MenuItem.tsx","../src/Message/Message.tsx","../src/Select/Select.tsx","../src/Slider/Slider.tsx","../src/Textarea/Textarea.tsx"],"sourcesContent":["import React, { Children } from 'react';\nimport flattenChildren from 'react-keyed-flatten-children';\n\nimport { ResponsiveStyleValue } from '@marigold/system';\n\nimport { Box } from '../Box';\n\nexport type InlineProps = {\n  space?: ResponsiveStyleValue<string>;\n  align?: 'top' | 'center' | 'bottom';\n};\n\nconst ALIGNMENT = {\n  top: 'flex-start',\n  center: 'center',\n  bottom: 'flex-end',\n};\n\nexport const Inline: React.FC<InlineProps> = ({\n  space = 'none',\n  align = 'center',\n  children,\n  ...props\n}) => (\n  <Box\n    display=\"inline-flex\"\n    css={{ '> * + *': { pl: space } }}\n    alignItems={ALIGNMENT[align]}\n    {...props}\n  >\n    {Children.map(\n      flattenChildren(children) as unknown as React.ReactElement,\n      (child: React.ReactElement) => (\n        <Box>{React.cloneElement(child, {}, child.props.children)}</Box>\n      )\n    )}\n  </Box>\n);\n","import React, { Children } from 'react';\nimport flattenChildren from 'react-keyed-flatten-children';\n\nimport { ResponsiveStyleValue } from '@marigold/system';\n\nimport { Box } from '../Box';\n\nexport type StackProps = {\n  space?: ResponsiveStyleValue<string>;\n  align?: 'left' | 'right' | 'center';\n};\n\nconst ALIGNMENT = {\n  left: 'flex-start',\n  center: 'center',\n  right: 'flex-end',\n};\n\nexport const Stack: React.FC<StackProps> = ({\n  space = 'none',\n  align = 'left',\n  children,\n  ...props\n}) => (\n  <Box\n    {...props}\n    display=\"flex\"\n    flexDirection=\"column\"\n    alignItems={ALIGNMENT[align]}\n    css={{ '> * + *': { pt: space } }}\n  >\n    {Children.map(\n      flattenChildren(children) as unknown as React.ReactElement,\n      (child: React.ReactElement) => (\n        <Box>{React.cloneElement(child, {}, child.props.children)}</Box>\n      )\n    )}\n  </Box>\n);\n","import React from 'react';\nimport { Exclamation, Check, Notification } from '@marigold/icons';\nimport { type ComponentProps } from '@marigold/types';\n\nimport { Box } from '../Box';\n\nconst ICON_MAP = {\n  success: Check,\n  warning: Notification,\n  error: Exclamation,\n} as const;\n\nexport type AlertVariants = keyof typeof ICON_MAP;\n\n// Theme Extension\n// ---------------\nexport interface AlertThemeExtension<Value> {\n  alert?: {\n    [key in AlertVariants]?: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type AlertProps = {\n  variant?: AlertVariants;\n} & ComponentProps<'div'>;\n\n// Component\n// ---------------\nexport const Alert: React.FC<AlertProps> = ({\n  variant = 'success',\n  children,\n  ...props\n}) => {\n  const Icon = ICON_MAP[variant];\n\n  return (\n    <Box {...props} display=\"flex\" variant={`alert.${variant}`}>\n      <Box\n        display=\"inline-block\"\n        alignItems=\"center\"\n        width=\"32px\"\n        height=\"32px\"\n        bg={variant}\n      >\n        <Box as={Icon} size={12} color=\"#fff\" bg={variant} m={10} />\n      </Box>\n      <Box mx=\"16px\">{children}</Box>\n    </Box>\n  );\n};\n","import React, { forwardRef, RefObject } from 'react';\nimport { useButton } from '@react-aria/button';\nimport {\n  PolymorphicComponentWithRef,\n  PolymorphicPropsWithRef,\n} from '@marigold/types';\n\nimport { Box, BoxOwnProps } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface ButtonThemeExtension<Value> {\n  button?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type ButtonProps = PolymorphicPropsWithRef<BoxOwnProps, 'button'>;\n\n// Component\n// ---------------\nexport const Button: PolymorphicComponentWithRef<BoxOwnProps, 'button'> =\n  forwardRef(\n    (\n      {\n        as = 'button',\n        variant = 'primary',\n        size = 'large',\n        space = 'none',\n        disabled,\n        children,\n        className,\n        ...props\n      },\n      ref\n    ) => {\n      const { buttonProps } = useButton(\n        {\n          ...props,\n          elementType: typeof as === 'string' ? as : 'span',\n          isDisabled: disabled,\n        },\n        ref as RefObject<HTMLSpanElement>\n      );\n\n      return (\n        <Box\n          {...buttonProps}\n          {...props}\n          as={as}\n          display=\"inline-flex\"\n          alignItems=\"center\"\n          variant={[`button.${variant}`, `button.${size}`]}\n          className={className}\n          ref={ref}\n          css={{ columnGap: space }}\n        >\n          {children}\n        </Box>\n      );\n    }\n  );\n","import React from 'react';\nimport { conditional, State, SVG } from '@marigold/system';\n\nimport { Box } from '../Box';\n\n// Checkbox Icon\n// ---------------\nexport type CheckboxIconProps = {\n  variant?: string;\n  checked?: boolean;\n  disabled?: boolean;\n  error?: boolean;\n  children?: never;\n};\n\nexport const CheckboxIcon: React.FC<CheckboxIconProps> = ({\n  variant = '',\n  checked = false,\n  disabled = false,\n  error = false,\n}) => {\n  const conditionalStates: State = disabled\n    ? {\n        disabled: disabled,\n      }\n    : {\n        checked: checked,\n        error: error,\n      };\n\n  return (\n    <SVG\n      width=\"16\"\n      height=\"32\"\n      viewBox=\"0 0 16 32\"\n      fill=\"none\"\n      aria-hidden=\"true\"\n    >\n      <Box\n        as=\"rect\"\n        x=\"0.5\"\n        y=\"8.5\"\n        width=\"15px\"\n        height=\"15px\"\n        rx=\"1.5\"\n        variant={conditional(`checkbox.${variant}`, conditionalStates)}\n      />\n      {checked && (\n        <Box\n          __baseCSS={{ fill: 'gray00' }}\n          as=\"path\"\n          fillRule=\"evenodd\"\n          clipRule=\"evenodd\"\n          d=\"M13.9571 12.8338L12.4085 11.2852L6.08699 17.6007L3.59887 15.1126L2.04163 16.6588L6.08682 20.704L13.9571 12.8338Z\"\n        />\n      )}\n    </SVG>\n  );\n};\n","import React from 'react';\n\nimport { ComponentProps } from '@marigold/types';\nimport { Required } from '@marigold/icons';\nimport { ResponsiveStyleValue } from '@marigold/system';\n\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface LabelThemeExtension<Value> {\n  label?: {\n    [key: string]: Value;\n  };\n}\n\n// LabelBase\n// ---------------\nexport type LabelBaseProps = {\n  htmlFor?: string;\n  variant?: string;\n  required?: boolean;\n  color?: ResponsiveStyleValue<string>;\n} & ComponentProps<'label'>;\n\nexport const LabelBase: React.FC<LabelProps> = ({\n  variant = 'above',\n  required,\n  color = 'text',\n  children,\n  ...props\n}) => {\n  return (\n    <Box\n      {...props}\n      as=\"label\"\n      __baseCSS={{ color: color }}\n      variant={`label.${variant}`}\n    >\n      {children}\n    </Box>\n  );\n};\n\n// Label\n// ---------------\nexport type LabelProps = {\n  required?: boolean;\n} & LabelBaseProps;\n\nexport const Label: React.FC<LabelProps> = ({\n  required,\n  children,\n  ...props\n}) => {\n  return required ? (\n    <Box as=\"span\" display=\"inline-flex\" alignItems=\"center\">\n      <LabelBase {...props}>{children}</LabelBase>\n      {required && <Box as={Required} size={16} css={{ color: 'error' }} />}\n    </Box>\n  ) : (\n    <LabelBase {...props}>{children}</LabelBase>\n  );\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface ValidationMessageThemeExtension<Value> {\n  validation?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type ValidationMessageProps = {\n  variant?: string;\n} & ComponentProps<'span'>;\n\n// Component\n// ---------------\nexport const ValidationMessage: React.FC<ValidationMessageProps> = ({\n  variant = 'error',\n  children,\n  className,\n  ...props\n}) => {\n  return (\n    <Box\n      as=\"span\"\n      display=\"flex\"\n      alignItems=\"center\"\n      variant={`validation.${variant}`}\n      className={className}\n      {...props}\n    >\n      {children}\n    </Box>\n  );\n};\n","import React from 'react';\nimport { useFocusRing } from '@react-aria/focus';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { useCheckbox } from '@react-aria/checkbox';\nimport { useToggleState } from '@react-stately/toggle';\nimport { ToggleProps } from '@react-types/checkbox';\n\nimport { ComponentProps } from '@marigold/types';\nimport { Exclamation } from '@marigold/icons';\n\nimport { CheckboxIcon, CheckboxIconProps } from './CheckboxIcons';\nimport { Box } from '../Box';\nimport { Label } from '../Label';\nimport { ValidationMessage } from '../ValidationMessage';\n\n// Theme Extension\n// ---------------\nexport interface CheckboxThemeExtension<Value> {\n  checkbox?: {\n    [key: string]: Value;\n  };\n}\n\n// Checkbox Input\n// ---------------\ntype CheckboxInputProps = CheckboxIconProps &\n  ToggleProps &\n  ComponentProps<'input'>;\n\nconst CheckboxInput: React.FC<CheckboxInputProps> = ({ error, ...props }) => {\n  const state = useToggleState(props);\n  const ref = React.useRef<HTMLInputElement>(null);\n  const { inputProps } = useCheckbox(props, state, ref);\n  const { focusProps } = useFocusRing();\n\n  return (\n    <Box pr=\"xsmall\">\n      <VisuallyHidden>\n        <Box\n          as=\"input\"\n          type=\"checkbox\"\n          disabled={props.disabled}\n          {...inputProps}\n          {...focusProps}\n          ref={ref}\n          {...props}\n        />\n      </VisuallyHidden>\n      <CheckboxIcon\n        checked={props.checked}\n        variant={props.variant}\n        disabled={props.disabled}\n        error={error}\n      />\n    </Box>\n  );\n};\n\n// Checkbox\n// ---------------\nexport type CheckboxProps = {\n  id: string;\n  label: string;\n  required?: boolean;\n  labelVariant?: string;\n  error?: boolean;\n  errorMessage?: string;\n} & CheckboxInputProps;\n\nexport const Checkbox: React.FC<CheckboxProps> = ({\n  label,\n  required,\n  labelVariant = 'inline',\n  error,\n  errorMessage,\n  ...props\n}) => {\n  return (\n    <>\n      <Box\n        as={Label}\n        __baseCSS={{\n          ':hover': { cursor: props.disabled ? 'not-allowed' : 'pointer' },\n        }}\n        htmlFor={props.id}\n        required={required}\n        variant={`label.${labelVariant}`}\n        color={props.disabled ? 'disabled' : 'text'}\n      >\n        <Box as={CheckboxInput} error={error} {...props} />\n        {label}\n      </Box>\n      {error && errorMessage && (\n        <ValidationMessage>\n          <Exclamation size={16} />\n          {errorMessage}\n        </ValidationMessage>\n      )}\n    </>\n  );\n};\n","import React from 'react';\nimport { Box } from '../Box';\n\ntype WidthValues = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n\nexport type ColumnProps = {\n  className?: string;\n  width?: WidthValues | WidthValues[];\n};\n\nconst transform = (width: WidthValues | WidthValues[]) => {\n  if (Array.isArray(width)) {\n    return width.map(v => `${(v / 12) * 100}%`);\n  }\n\n  return `${(width / 12) * 100}%`;\n};\n\nexport const Column: React.FC<ColumnProps> = ({\n  width = 12,\n  children,\n  ...props\n}) => (\n  <Box {...props} width={transform(width)}>\n    {children}\n  </Box>\n);\n","import React, { Children } from 'react';\nimport { Box } from '../Box';\nimport flattenChildren from 'react-keyed-flatten-children';\nimport { ResponsiveStyleValue, useTheme } from '@marigold/system';\n\ntype ColumnsProps = {\n  className?: string;\n  space?: ResponsiveStyleValue<string>;\n  horizontalAlign?: 'left' | 'right' | 'center';\n  verticalAlign?: 'top' | 'bottom' | 'center';\n};\n\nconst useAlignment = (direction: string) => {\n  switch (direction) {\n    case 'right':\n      return 'flex-end';\n    case 'bottom':\n      return 'flex-end';\n    case 'center':\n      return 'center';\n  }\n  return 'flex-start';\n};\n\nexport const Columns: React.FC<ColumnsProps> = ({\n  space = 'none',\n  horizontalAlign = 'left',\n  verticalAlign = 'top',\n  className,\n  children,\n  ...props\n}) => {\n  const justifyContent = useAlignment(horizontalAlign);\n  const alignItems = useAlignment(verticalAlign);\n\n  /**\n   * transform space string to space value from theme\n   */\n  const { css } = useTheme();\n  const spaceObject = css({ space }) as Object;\n  const spaceValue = Object.values(spaceObject)[0];\n\n  return (\n    <Box p={space} display=\"flex\" className={className}>\n      <Box\n        width={`calc(100% + ${spaceValue}px)`}\n        m={`${-spaceValue / 2}px`}\n        display=\"flex\"\n        flexWrap=\"wrap\"\n        alignItems={alignItems}\n        justifyContent={justifyContent}\n        {...props}\n      >\n        {Children.map(\n          flattenChildren(children) as unknown as React.ReactElement,\n          (child: React.ReactElement) => {\n            return React.cloneElement(\n              child,\n              {},\n              <Box css={{ p: `${spaceValue / 2}px` }}>\n                {child.props.children}\n              </Box>\n            );\n          }\n        )}\n      </Box>\n    </Box>\n  );\n};\n","import React, { forwardRef } from 'react';\nimport { ResponsiveStyleValue } from '@marigold/system';\nimport {\n  PolymorphicComponentWithRef,\n  PolymorphicPropsWithRef,\n} from '@marigold/types';\n\nimport { Box, BoxOwnProps } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface TextThemeExtension<Value> {\n  text?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type TextOwnProps = {\n  align?: ResponsiveStyleValue<string>;\n  color?: ResponsiveStyleValue<string>;\n  cursor?: ResponsiveStyleValue<string>;\n  outline?: ResponsiveStyleValue<string>;\n  userSelect?: ResponsiveStyleValue<string>;\n} & BoxOwnProps;\n\nexport type TextProps = PolymorphicPropsWithRef<TextOwnProps, 'span'>;\n\n// Component\n// ---------------\nexport const Text: PolymorphicComponentWithRef<TextOwnProps, 'span'> =\n  forwardRef(\n    (\n      {\n        as = 'span',\n        variant = 'body',\n        children,\n        className,\n        align,\n        color,\n        cursor,\n        outline,\n        userSelect,\n        ...props\n      },\n      ref\n    ) => (\n      <Box\n        {...props}\n        as={as}\n        variant={`text.${variant}`}\n        css={{ textAlign: align, color, cursor, outline, userSelect }}\n        className={className}\n        ref={ref}\n      >\n        {children}\n      </Box>\n    )\n  );\n","import React, { RefObject } from 'react';\nimport {\n  useOverlay,\n  usePreventScroll,\n  useModal,\n  OverlayProps,\n} from '@react-aria/overlays';\nimport { useDialog } from '@react-aria/dialog';\nimport { FocusScope } from '@react-aria/focus';\nimport { AriaDialogProps } from '@react-types/dialog';\n\nimport { Box } from '../Box';\n\n// Props\n// ---------------\nexport type ModalDialogProps = {\n  variant?: string;\n  backdropVariant?: string;\n} & OverlayProps &\n  AriaDialogProps;\n\n// Component\n// ---------------\nexport const ModalDialog: React.FC<ModalDialogProps> = ({\n  variant,\n  backdropVariant = 'backdrop',\n  children,\n  ...props\n}) => {\n  const { isDismissable, isOpen, onClose, ...restProps } = props;\n\n  // Handle interacting outside the dialog and pressing\n  // the Escape key to close the modal.\n  const ref = React.useRef<HTMLElement>() as RefObject<HTMLElement>;\n  const { overlayProps, underlayProps } = useOverlay(\n    { isDismissable, isOpen, onClose },\n    ref\n  );\n\n  // Prevent scrolling while the modal is open, and hide content\n  // outside the modal from screen readers.\n  usePreventScroll();\n\n  const { modalProps } = useModal();\n  const { dialogProps } = useDialog(props, ref);\n\n  return (\n    <Box\n      __baseCSS={{\n        display: 'grid',\n        placeItems: 'center',\n        position: 'fixed',\n        zIndex: 100,\n        top: 0,\n        left: 0,\n        bottom: 0,\n        right: 0,\n      }}\n      variant={`dialog.${backdropVariant}`}\n      {...underlayProps}\n    >\n      <FocusScope contain restoreFocus autoFocus>\n        <Box\n          {...overlayProps}\n          {...dialogProps}\n          {...modalProps}\n          ref={ref}\n          variant={variant ? `dialog.${variant}` : `dialog`}\n          {...restProps}\n        >\n          {children}\n        </Box>\n      </FocusScope>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface InputThemeExtension<Value> {\n  input?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type InputProps = {\n  variant?: string;\n} & ComponentProps<'input'>;\n\n// Component\n// ---------------\nexport const Input: React.FC<InputProps> = ({\n  variant = '',\n  type = 'text',\n  ...props\n}) => <Box {...props} as=\"input\" type={type} variant={`input.${variant}`} />;\n","import React, { useRef } from 'react';\nimport { useLink } from '@react-aria/link';\nimport { PolymorphicComponent, PolymorphicProps } from '@marigold/types';\n\nimport { Text, TextOwnProps } from '../Text';\n\n// Theme Extension\n// ---------------\nexport interface LinkThemeExtension<Value> {\n  link?: Value;\n}\n\n// Props\n// ---------------\nexport type LinkOwnProps = { disabled?: boolean } & TextOwnProps;\nexport type LinkProps = PolymorphicProps<LinkOwnProps, 'a'>;\n\n// Component\n// ---------------\nexport const Link = (({\n  as = 'a',\n  variant = 'link',\n  children,\n  disabled,\n  ...props\n}: LinkProps) => {\n  const ref = useRef<any>();\n  const { linkProps } = useLink(\n    {\n      // We typecast here because the element could very well be a `span`\n      ...(props as PolymorphicProps<LinkOwnProps, any>),\n      elementType: typeof as === 'string' ? as : 'span',\n      isDisabled: disabled,\n    },\n    ref\n  );\n\n  return (\n    <Text {...props} {...linkProps} as={as} variant={variant} ref={ref}>\n      {children}\n    </Text>\n  );\n}) as PolymorphicComponent<LinkOwnProps, 'a'>;\n","import React from 'react';\nimport { conditional, State, SVG } from '@marigold/system';\n\nimport { Box } from '../Box';\n\n// Radio Icon\n// ---------------\nexport type RadioIconProps = {\n  variant?: string;\n  checked?: boolean;\n  disabled?: boolean;\n  error?: boolean;\n  children?: never;\n};\n\nexport const RadioIcon: React.FC<RadioIconProps> = ({\n  variant = '',\n  checked = false,\n  disabled = false,\n  error = false,\n}) => {\n  const conditionalStates: State = disabled\n    ? {\n        disabled: disabled,\n      }\n    : {\n        checked: checked,\n        error: error,\n      };\n\n  return (\n    <SVG\n      width=\"16\"\n      height=\"32\"\n      viewBox=\"0 0 16 32\"\n      fill=\"none\"\n      aria-hidden=\"true\"\n    >\n      <Box\n        variant={conditional(`radio.${variant}`, conditionalStates)}\n        as=\"circle\"\n        cx=\"8\"\n        cy=\"16\"\n        r=\"7.5\"\n      />\n      {checked && <circle fill=\"white\" cx=\"8\" cy=\"16\" r=\"3\" />}\n    </SVG>\n  );\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Exclamation } from '@marigold/icons';\nimport { useFocusRing } from '@react-aria/focus';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { RadioIcon, RadioIconProps } from './RadioIcon';\nimport { Box } from '../Box';\nimport { Label } from '../Label';\nimport { ValidationMessage } from '../ValidationMessage';\n\n// Theme Extension\n// ---------------\nexport interface RadioThemeExtension<Value> {\n  radio?: {\n    [key: string]: Value;\n  };\n}\n\n// Radio Input\n// ---------------\ntype RadioInputProps = RadioIconProps & ComponentProps<'input'>;\n\nconst RadioInput: React.FC<RadioInputProps> = ({ error, ...props }) => {\n  const { focusProps } = useFocusRing();\n\n  return (\n    <Box pr=\"xsmall\">\n      <VisuallyHidden>\n        <input\n          type=\"radio\"\n          disabled={props.disabled}\n          {...focusProps}\n          {...props}\n        />\n      </VisuallyHidden>\n      <RadioIcon\n        variant={props.variant}\n        disabled={props.disabled}\n        checked={props.checked}\n        error={error}\n      />\n    </Box>\n  );\n};\n\n// Radio\n// ---------------\nexport type RadioProps = {\n  id: string;\n  label: string;\n  required?: boolean;\n  labelVariant?: string;\n  error?: boolean;\n  errorMessage?: string;\n} & RadioInputProps;\n\nexport const Radio: React.FC<RadioProps> = ({\n  label,\n  required,\n  labelVariant = 'inline',\n  error,\n  errorMessage,\n  ...props\n}) => (\n  <>\n    <Box\n      as={Label}\n      htmlFor={props.id}\n      required={required}\n      variant={`label.${labelVariant}`}\n      css={\n        props.disabled\n          ? { color: 'disabled', ':hover': { cursor: 'not-allowed' } }\n          : { color: 'text', ':hover': { cursor: 'pointer' } }\n      }\n    >\n      <Box as={RadioInput} error={error} {...props} />\n      {label}\n    </Box>\n    {error && errorMessage && (\n      <ValidationMessage>\n        <Exclamation size={16} />\n        {errorMessage}\n      </ValidationMessage>\n    )}\n  </>\n);\n","import React, { useEffect, useRef, useState } from 'react';\nimport type { ListState } from '@react-stately/list';\nimport type { Node } from '@react-types/shared';\nimport { useOption } from '@react-aria/listbox';\n\nimport { Box } from '../Box';\n\ninterface OptionProps {\n  item: Node<unknown>;\n  state: ListState<unknown>;\n}\n\nexport const Option = ({ item, state }: OptionProps) => {\n  const ref = useRef<HTMLLIElement>(null);\n  const [disabled, setDisabled] = useState(false);\n  const { optionProps, isSelected } = useOption(\n    {\n      key: item.key,\n    },\n    state,\n    ref\n  );\n\n  useEffect(() => {\n    for (const key of state.disabledKeys.values()) {\n      if (key === item.key) {\n        setDisabled(true);\n      }\n    }\n  }, [state.disabledKeys, item.key]);\n\n  return (\n    <Box\n      as=\"li\"\n      {...optionProps}\n      ref={ref}\n      variant={\n        isSelected\n          ? 'select.option.selected'\n          : disabled\n          ? 'select.option.disabled'\n          : 'select.option'\n      }\n    >\n      {item.rendered}\n    </Box>\n  );\n};\n","import React from 'react';\nimport { useListBoxSection } from '@react-aria/listbox';\nimport type { ListState } from '@react-stately/list';\nimport type { Node } from '@react-types/shared';\n\nimport { Box } from '../Box';\nimport { Option } from './Option';\n\ninterface SectionProps {\n  section: Node<unknown>;\n  state: ListState<unknown>;\n}\n\nexport const ListBoxSection = ({ section, state }: SectionProps) => {\n  const { itemProps, headingProps, groupProps } = useListBoxSection({\n    heading: section.rendered,\n    'aria-label': section['aria-label'],\n  });\n\n  return (\n    <Box\n      as=\"li\"\n      {...itemProps}\n      css={{\n        cursor: 'not-allowed',\n      }}\n    >\n      {section.rendered && (\n        <Box as=\"span\" {...headingProps} variant={'select.section'}>\n          {section.rendered}\n        </Box>\n      )}\n      <Box as=\"ul\" {...groupProps}>\n        {[...section.childNodes].map(node => (\n          <Option key={node.key} item={node} state={state} />\n        ))}\n      </Box>\n    </Box>\n  );\n};\n","import React, { useRef } from 'react';\nimport { useListBox } from '@react-aria/listbox';\nimport type { AriaListBoxOptions } from '@react-aria/listbox';\nimport type { ListState } from '@react-stately/list';\n\nimport { Box } from '../Box';\nimport { Option } from './Option';\nimport { ListBoxSection } from './ListBoxSection';\n\ninterface ListBoxProps extends AriaListBoxOptions<unknown> {\n  state: ListState<unknown>;\n  error?: boolean;\n}\n\nexport const ListBox = (props: ListBoxProps) => {\n  const ref = useRef<HTMLUListElement>(null);\n  const { state, error } = props;\n  const { listBoxProps } = useListBox(props, state, ref);\n\n  return (\n    <Box\n      as=\"ul\"\n      p=\"none\"\n      css={{\n        listStyle: 'none',\n      }}\n      {...listBoxProps}\n      variant={error ? 'select.listbox.error' : 'select.listbox'}\n      ref={ref}\n    >\n      {[...state.collection].map(item =>\n        item.type === 'section' ? (\n          <ListBoxSection key={item.key} section={item} state={state} />\n        ) : (\n          <Option key={item.key} item={item} state={state} />\n        )\n      )}\n    </Box>\n  );\n};\n","import React, { forwardRef, RefObject } from 'react';\nimport { FocusScope } from '@react-aria/focus';\nimport {\n  DismissButton,\n  OverlayContainer,\n  useModal,\n  useOverlay,\n} from '@react-aria/overlays';\nimport { mergeProps } from '@react-aria/utils';\n\nimport { Box } from '../Box';\n\ninterface PopoverProps {\n  isOpen?: boolean;\n  onClose?: () => void;\n  ref?: React.Ref<HTMLDivElement>;\n  className?: string;\n}\n\nexport const Popover: React.FC<PopoverProps> = forwardRef(\n  ({ children, className, isOpen, onClose, ...otherProps }, ref) => {\n    // Handle events that should cause the popup to close,\n    const { overlayProps } = useOverlay(\n      {\n        isOpen,\n        onClose,\n        shouldCloseOnBlur: true,\n        isDismissable: true,\n      },\n      ref as RefObject<HTMLElement>\n    );\n    // Hide content outside the modal from screen readers.\n    const { modalProps } = useModal();\n\n    return (\n      <OverlayContainer>\n        <FocusScope restoreFocus>\n          <Box\n            {...mergeProps(overlayProps, otherProps, modalProps)}\n            className={className}\n            ref={ref}\n          >\n            {children}\n            <DismissButton onDismiss={onClose} />\n          </Box>\n        </FocusScope>\n      </OverlayContainer>\n    );\n  }\n);\n","import React from 'react';\n\nimport { ResponsiveStyleValue } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Inline } from '../Inline';\nimport { Stack } from '../Stack';\n\n// Props\n// ---------------\nexport type ActionGroupProps = {\n  space?: ResponsiveStyleValue<string>;\n  verticalAlignment?: boolean;\n} & ComponentProps<'div'>;\n\n// Component\n// ---------------\nexport const ActionGroup: React.FC<ActionGroupProps> = ({\n  space = 'none',\n  verticalAlignment = false,\n  children,\n  ...props\n}) =>\n  verticalAlignment ? (\n    <Stack space={space} {...props}>\n      {children}\n    </Stack>\n  ) : (\n    <Inline space={space} {...props}>\n      {children}\n    </Inline>\n  );\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface BadgeThemeExtension<Value> {\n  badge?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type BadgeProps = {\n  variant?: string;\n  bgColor?: string;\n  borderColor?: string;\n} & ComponentProps<'div'>;\n\n// Component\n// ---------------\nexport const Badge: React.FC<BadgeProps> = ({\n  variant = '',\n  bgColor = 'transparent',\n  borderColor = 'transparent',\n  children,\n  ...props\n}) => (\n  <Box\n    css={{ bg: bgColor, borderColor: borderColor }}\n    variant={`badge.${variant}`}\n    {...props}\n  >\n    {children}\n  </Box>\n);\n","import React from 'react';\nimport { ResponsiveStyleValue } from '@marigold/system';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface CardThemeExtension<Value> {\n  card?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type CardProps = {\n  title?: string;\n  width?: ResponsiveStyleValue<string>;\n  variant?: string;\n} & ComponentProps<'div'>;\n\n// Component\n// ---------------\nexport const Card: React.FC<CardProps> = ({\n  variant = '',\n  title,\n  width,\n  className,\n  children,\n  ...props\n}) => {\n  return (\n    <Box\n      {...props}\n      variant={`card.${variant}`}\n      maxWidth={width}\n      className={className}\n    >\n      {title && (\n        <Box as=\"h2\" variant=\"text.h2\" pb=\"small\">\n          {title}\n        </Box>\n      )}\n      {children}\n    </Box>\n  );\n};\n","import React from 'react';\nimport { Box } from '../Box';\n\nexport type ContainerProps = {\n  className?: string;\n  title?: string; // Used for testing.\n};\n\nexport const Container: React.FC<ContainerProps> = ({ children, ...props }) => (\n  <Box {...props} width=\"100%\">\n    {children}\n  </Box>\n);\n","import React, { RefObject } from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { useOverlayTriggerState } from '@react-stately/overlays';\nimport { OverlayContainer } from '@react-aria/overlays';\nimport { useButton } from '@react-aria/button';\nimport { Close } from '@marigold/icons';\n\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { Text } from '../Text';\n\nimport { ModalDialog, ModalDialogProps } from './ModalDialog';\n\n// Props\n// ---------------\nexport type DialogProps = {\n  backdropVariant?: string;\n  close: ComponentProps<typeof Button>['onClick'];\n  isOpen: boolean;\n  title?: string;\n  variant?: string;\n} & ModalDialogProps &\n  ComponentProps<'div'>;\n\n// Component\n// ---------------\nexport const Dialog: React.FC<DialogProps> = ({\n  backdropVariant,\n  children,\n  className,\n  close,\n  isOpen,\n  title,\n  variant,\n  ...props\n}) => {\n  const closeButtonRef = React.useRef<HTMLElement>() as RefObject<HTMLElement>;\n\n  // useButton ensures that focus management is handled correctly,\n  // across all browsers. Focus is restored to the button once the\n  // dialog closes.\n  const { buttonProps: closeButtonProps } = useButton(\n    {\n      onPress: () => close(),\n    },\n    closeButtonRef\n  );\n\n  return (\n    <OverlayContainer>\n      <ModalDialog\n        variant={variant}\n        backdropVariant={backdropVariant}\n        isOpen={isOpen}\n        onClose={close}\n        isDismissable\n        {...props}\n      >\n        <Box\n          __baseCSS={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            borderRadius: 'small',\n            pl: 'large',\n            pb: 'large',\n          }}\n          className={className}\n        >\n          <Box pt=\"medium\">\n            {title && (\n              <Text as=\"h4\" variant=\"headline4\">\n                {title}\n              </Text>\n            )}\n            {children}\n          </Box>\n          <Box\n            __baseCSS={{\n              display: 'flex',\n              justifyContent: 'flex-end',\n              alignItems: 'start',\n              paddingTop: 'xsmall',\n              paddingX: 'xsmall',\n            }}\n          >\n            <Box\n              as={Button}\n              __baseCSS={{\n                color: 'text',\n                bg: 'transparent',\n                lineHeight: 'xsmall',\n                px: 'xxsmall',\n                ':hover': {\n                  color: 'text',\n                  bg: 'transparent',\n                  cursor: 'pointer',\n                },\n                ':focus': {\n                  outline: 0,\n                },\n              }}\n              {...closeButtonProps}\n              ref={closeButtonRef}\n            >\n              <Close size={16} />\n            </Box>\n          </Box>\n        </Box>\n      </ModalDialog>\n    </OverlayContainer>\n  );\n};\n\n// get the overlayTriggerState and openButton props for using the dialog component\nexport const useDialogButtonProps = () => {\n  const state = useOverlayTriggerState({});\n  const openButtonRef = React.useRef<HTMLElement>() as RefObject<HTMLElement>;\n  const { buttonProps: openButtonProps } = useButton(\n    {\n      onPress: () => state.open(),\n    },\n    openButtonRef\n  );\n\n  return {\n    state,\n    openButtonProps,\n    openButtonRef,\n  };\n};\n","import React from 'react';\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface DividerThemeExtension<Value> {\n  divider?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type DividerProps = {\n  className?: string;\n  variant?: string;\n  title?: string; // Should only be used for testing.\n};\n\n// Component\n// ---------------\nexport const Divider: React.FC<DividerProps> = ({\n  variant = 'regular',\n  ...props\n}) => <Box {...props} as=\"hr\" variant={`divider.${variant}`} />;\n","import React from 'react';\nimport { Exclamation } from '@marigold/icons';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Input } from '../Input';\nimport { Label } from '../Label';\nimport { ValidationMessage } from '../ValidationMessage';\n\n// Props\n// ---------------\nexport type FieldProps = {\n  variant?: string;\n  labelVariant?: string;\n  htmlFor: string;\n  label: string;\n  required?: boolean;\n  error?: boolean;\n  errorMessage?: string;\n  disabled?: boolean;\n} & ComponentProps<'input'>;\n\n// Component\n// ---------------\nexport const Field: React.FC<FieldProps> = ({\n  type = 'text',\n  variant = '',\n  labelVariant = 'above',\n  htmlFor,\n  label,\n  required,\n  error,\n  errorMessage,\n  disabled,\n  ...props\n}) => {\n  return (\n    <>\n      <Label variant={labelVariant} htmlFor={htmlFor} required={required}>\n        {label}\n      </Label>\n      <Input\n        {...props}\n        type={type}\n        id={htmlFor}\n        disabled={disabled}\n        variant={variant}\n      />\n      {error && errorMessage && (\n        <ValidationMessage>\n          <Exclamation size={16} />\n          {errorMessage}\n        </ValidationMessage>\n      )}\n    </>\n  );\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface ImageThemeExtension<Value> {\n  image?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type ImageProps = {\n  variant?: string;\n  children?: never;\n} & ComponentProps<'img'>;\n\n// Component\n// ---------------\nexport const Image: React.FC<ImageProps> = ({\n  variant = 'fullWidth',\n  ...props\n}) => <Box {...props} as=\"img\" variant={`image.${variant}`} />;\n","import React from 'react';\nimport { OverlayProvider } from '@react-aria/overlays';\nimport {\n  Theme,\n  Global,\n  ThemeProvider,\n  ThemeProviderProps,\n  useTheme,\n  __defaultTheme,\n} from '@marigold/system';\n\n// Theme Extension\n// ---------------\nexport interface RootThemeExtension<Value> {\n  root?: {\n    body?: Value;\n    html?: Value;\n  };\n}\n\n// Props\n// ---------------\nexport interface MarigoldProviderProps<T extends Theme>\n  extends ThemeProviderProps<T> {}\n\n// Provider\n// ---------------\nexport function MarigoldProvider<T extends Theme>({\n  theme,\n  children,\n}: MarigoldProviderProps<T>) {\n  const outer = useTheme();\n  const isTopLevel = outer.theme === __defaultTheme;\n\n  return (\n    <ThemeProvider theme={theme}>\n      {isTopLevel ? (\n        <>\n          <Global />\n          <OverlayProvider>{children}</OverlayProvider>\n        </>\n      ) : (\n        children\n      )}\n    </ThemeProvider>\n  );\n}\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Button } from '../Button';\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface MenuThemeExtension<Value> {\n  menu?: Value;\n}\n\n// Props\n// ---------------\nexport type MenuProps = {\n  variant?: string;\n  label?: string;\n  onClick: ComponentProps<typeof Button>['onClick'];\n  show?: boolean;\n  className?: string;\n  title?: string; // For testing\n};\n\n// Component\n// ---------------\nexport const Menu: React.FC<MenuProps> = ({\n  variant = 'default',\n  label = 'Menu',\n  onClick,\n  show = false,\n  children,\n  ...props\n}) => {\n  return (\n    <Box variant={`menu.${variant}`} {...props}>\n      <Button onClick={onClick} variant=\"menu\">\n        {label}\n      </Button>\n      {show ? (\n        <Box\n          display=\"block\"\n          position=\"absolute\"\n          minWidth=\"120px\"\n          borderRadius=\"2px\"\n        >\n          {children}\n        </Box>\n      ) : null}\n    </Box>\n  );\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\nimport { Link } from '../Link';\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface MenuItemThemeExtension<Value> {\n  menuItem?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type MenuItemProps = {\n  variant?: string;\n} & ComponentProps<typeof Link>;\n\n// Component\n// ---------------\nexport const MenuItem: React.FC<MenuItemProps> = ({\n  variant = 'default',\n  className,\n  children,\n  ...props\n}) => {\n  return (\n    <Box variant={`menuItem.${variant}`} className={className}>\n      <Link variant=\"menuItemLink\" {...props}>\n        {children}\n      </Link>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { Exclamation, Info, Notification } from '@marigold/icons';\nimport { ComponentProps } from '@marigold/types';\nimport { Box } from '../Box';\nimport { Text } from '../Text';\n\n// Theme Extension\n// ---------------\nexport interface MessageThemeExtension<Value> {\n  message?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type MessageProps = {\n  messageTitle: string;\n  variant?: string;\n} & ComponentProps<'div'>;\n\n// Component\n// ---------------\nexport const Message: React.FC<MessageProps> = ({\n  messageTitle,\n  variant = 'info',\n  className,\n  children,\n  ...props\n}) => {\n  var icon = <Info />;\n  if (variant === 'warning') {\n    icon = <Notification />;\n  }\n  if (variant === 'error') {\n    icon = <Exclamation />;\n  }\n\n  return (\n    <Box\n      display=\"inline-block\"\n      variant={`message.${variant}`}\n      className={className}\n      {...props}\n    >\n      <Box display=\"flex\" alignItems=\"center\" variant=\"message.title\">\n        {icon}\n        <Text as=\"h4\" variant=\"headline4\">\n          {messageTitle}\n        </Text>\n      </Box>\n      <Box css={{ color: 'black' }}>{children}</Box>\n    </Box>\n  );\n};\n","import React, { Ref, RefObject, useRef } from 'react';\nimport { useSelectState } from '@react-stately/select';\nimport { useButton } from '@react-aria/button';\nimport { mergeProps } from '@react-aria/utils';\nimport { useFocusRing } from '@react-aria/focus';\nimport { HiddenSelect, useSelect } from '@react-aria/select';\nimport type { AriaSelectProps } from '@react-types/select';\nimport { useOverlayTriggerState } from '@react-stately/overlays';\nimport { useOverlayTrigger, useOverlayPosition } from '@react-aria/overlays';\nimport { SingleSelection } from '@react-types/shared';\n\nimport { ComponentProps } from '@marigold/types';\nimport { ArrowDown, ArrowUp, Exclamation, Required } from '@marigold/icons';\nimport { ResponsiveStyleValue } from '@marigold/system';\n\nimport { Box } from '../Box';\nimport { Label } from '../Label';\nimport { ValidationMessage } from '../ValidationMessage';\nimport { ListBox } from './ListBox';\nimport { Popover } from './Popover';\n\n// Theme Extension\n// ---------------\nexport interface SelectThemeExtension<Value> {\n  select?: {\n    __default: Value;\n    disabled?: Value;\n    listbox?: {\n      __default: Value;\n      error?: Value;\n    };\n    section?: Value;\n    option?: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type SelectProps = {\n  labelVariant?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  required?: boolean;\n  width?: ResponsiveStyleValue<number | string>;\n  error?: boolean;\n  errorMessage?: string;\n} & ComponentProps<'select'> &\n  AriaSelectProps<object> &\n  SingleSelection;\n\n// Component\n// ---------------\nexport const Select = ({\n  labelVariant = 'above',\n  placeholder = 'Select an option',\n  disabled,\n  required,\n  error,\n  errorMessage,\n  width,\n  className,\n  ...props\n}: SelectProps) => {\n  const state = useSelectState(props);\n  const overlayTriggerState = useOverlayTriggerState({});\n  const triggerRef = useRef<HTMLElement>() as RefObject<HTMLElement>;\n  const overlayRef = useRef<HTMLDivElement>();\n\n  // Get props for the overlay\n  const { overlayProps } = useOverlayTrigger(\n    { type: 'listbox' },\n    overlayTriggerState,\n    triggerRef\n  );\n  // Get popover positioning props relative to the trigger\n  const { overlayProps: positionProps } = useOverlayPosition({\n    targetRef: triggerRef,\n    overlayRef: overlayRef as RefObject<HTMLElement>,\n    placement: 'bottom',\n    shouldFlip: false,\n    isOpen: state.isOpen,\n    onClose: state.close,\n  });\n  // Get props for child elements from useSelect\n  const { labelProps, triggerProps, valueProps, menuProps } = useSelect(\n    props,\n    state,\n    triggerRef\n  );\n  // Get props for the button based on the trigger props from useSelect\n  const { buttonProps } = useButton(triggerProps, triggerRef);\n\n  const { focusProps } = useFocusRing();\n\n  return (\n    <Box position=\"relative\" display=\"inline-block\" width={width && width}>\n      {props.label && (\n        <Box>\n          <Label {...labelProps} htmlFor={labelProps.id} variant={labelVariant}>\n            {required ? (\n              <Box as=\"span\" display=\"inline-flex\" alignItems=\"center\">\n                {props.label}\n                <Box as={Required} size={16} css={{ color: 'error' }} />\n              </Box>\n            ) : (\n              props.label\n            )}\n          </Label>\n        </Box>\n      )}\n      <HiddenSelect\n        state={state}\n        triggerRef={triggerRef}\n        label={props.label}\n        name={props.name}\n        isDisabled={disabled}\n      />\n      <Box\n        as=\"button\"\n        {...mergeProps(buttonProps, focusProps)}\n        ref={triggerRef as RefObject<HTMLButtonElement>}\n        variant={\n          error && state.isOpen && !disabled\n            ? 'button.select.errorOpened'\n            : error\n            ? 'button.select.error'\n            : state.isOpen && !disabled\n            ? 'button.select.open'\n            : 'button.select'\n        }\n        disabled={disabled}\n        className={className}\n      >\n        <Box\n          as=\"span\"\n          {...valueProps}\n          variant={disabled ? 'select.disabled' : 'select'}\n        >\n          {state.selectedItem ? state.selectedItem.rendered : placeholder}\n        </Box>\n        {state.isOpen && !disabled ? (\n          <Box as={ArrowUp} size={16} css={{ fill: 'text' }} />\n        ) : (\n          <Box\n            as={ArrowDown}\n            size={16}\n            css={{ fill: disabled ? 'disabled' : 'text' }}\n          />\n        )}\n      </Box>\n      {state.isOpen && !disabled && (\n        <Box\n          as={Popover}\n          {...overlayProps}\n          {...positionProps}\n          css={{\n            width: triggerRef.current && triggerRef.current.offsetWidth + 'px',\n          }}\n          ref={overlayRef as Ref<HTMLDivElement>}\n          isOpen={state.isOpen}\n          onClose={state.close}\n        >\n          <ListBox error={error} {...menuProps} state={state} />\n        </Box>\n      )}\n      {error && errorMessage && (\n        <Box as=\"span\" display=\"inline-flex\" alignItems=\"center\">\n          <Box as={Exclamation} size={16} css={{ color: 'error' }} />\n          <ValidationMessage>{errorMessage}</ValidationMessage>\n        </Box>\n      )}\n    </Box>\n  );\n};\n","import React from 'react';\nimport { ComponentProps } from '@marigold/types';\n\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface SliderThemeExtension<Value> {\n  slider?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type SliderProps = {\n  variant?: string;\n} & ComponentProps<'input'>;\n\n// Component\n// ---------------\nexport const Slider: React.FC<SliderProps> = ({\n  variant = '',\n  className,\n  ...props\n}) => (\n  <Box\n    as=\"input\"\n    type=\"range\"\n    css={{ verticalAlign: 'middle' }}\n    variant={`slider.${variant}`}\n    className={className}\n    {...props}\n  />\n);\n","import React from 'react';\nimport { Exclamation } from '@marigold/icons';\nimport { ComponentProps } from '@marigold/types';\n\nimport { ValidationMessage } from '../ValidationMessage';\nimport { Label } from '../Label';\nimport { Box } from '../Box';\n\n// Theme Extension\n// ---------------\nexport interface TextareaThemeExtension<Value> {\n  textarea?: {\n    [key: string]: Value;\n  };\n}\n\n// Props\n// ---------------\nexport type TextareaProps = {\n  variant?: string;\n  label?: string;\n  htmlFor?: string;\n  required?: boolean;\n  error?: boolean;\n  errorMessage?: string;\n} & ComponentProps<'textarea'>;\n\n// Component\n// ---------------\nexport const Textarea: React.FC<TextareaProps> = ({\n  variant = '',\n  htmlFor = 'textarea',\n  label,\n  error,\n  errorMessage,\n  required,\n  className = '',\n  children,\n  ...props\n}) => (\n  <Box>\n    {label && (\n      <Label htmlFor={htmlFor} required={required}>\n        {label}\n      </Label>\n    )}\n    <Box\n      as=\"textarea\"\n      {...props}\n      display=\"block\"\n      variant={`textarea.${variant}`}\n      css={{ outlineColor: error && 'error' }}\n      className={className}\n    />\n    {error && errorMessage && (\n      <ValidationMessage>\n        <Exclamation size={16} />\n        {errorMessage}\n      </ValidationMessage>\n    )}\n  </Box>\n);\n"],"names":["ALIGNMENT","top","center","bottom","Inline","space","align","children","props","React","Box","display","css","pl","alignItems","Children","map","flattenChildren","child","cloneElement","left","right","Stack","flexDirection","pt","ICON_MAP","success","Check","warning","Notification","error","Exclamation","Button","forwardRef","ref","as","variant","size","disabled","className","useButton","elementType","isDisabled","buttonProps","columnGap","CheckboxIcon","checked","SVG","width","height","viewBox","fill","x","y","rx","conditional","__baseCSS","fillRule","clipRule","d","LabelBase","required","color","Label","Required","ValidationMessage","CheckboxInput","state","useToggleState","useRef","inputProps","useCheckbox","useFocusRing","pr","VisuallyHidden","type","focusProps","transform","Array","isArray","v","useAlignment","direction","Text","cursor","outline","userSelect","textAlign","ModalDialog","backdropVariant","isDismissable","isOpen","onClose","restProps","useOverlay","overlayProps","underlayProps","usePreventScroll","modalProps","useModal","dialogProps","useDialog","placeItems","position","zIndex","FocusScope","contain","restoreFocus","autoFocus","Input","Link","useLink","linkProps","RadioIcon","cx","cy","r","RadioInput","Option","item","useState","setDisabled","useOption","key","optionProps","isSelected","useEffect","disabledKeys","values","rendered","ListBoxSection","section","useListBoxSection","heading","headingProps","groupProps","itemProps","childNodes","node","ListBox","useListBox","p","listStyle","listBoxProps","collection","Popover","otherProps","shouldCloseOnBlur","OverlayContainer","mergeProps","DismissButton","onDismiss","verticalAlignment","Icon","bg","m","mx","bgColor","borderColor","title","maxWidth","pb","label","labelVariant","errorMessage","htmlFor","id","horizontalAlign","verticalAlign","justifyContent","spaceObject","useTheme","spaceValue","Object","flexWrap","close","closeButtonRef","closeButtonProps","onPress","borderRadius","paddingTop","paddingX","lineHeight","px","Close","theme","outer","ThemeProvider","__defaultTheme","Global","OverlayProvider","onClick","show","minWidth","messageTitle","icon","Info","placeholder","useSelectState","overlayTriggerState","useOverlayTriggerState","triggerRef","overlayRef","useOverlayTrigger","positionProps","useOverlayPosition","targetRef","placement","shouldFlip","useSelect","labelProps","valueProps","menuProps","triggerProps","HiddenSelect","name","selectedItem","ArrowUp","ArrowDown","current","offsetWidth","outlineColor","openButtonRef","open","openButtonProps"],"mappings":"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"}