// use-make-box
open BsChakra__Theme;
[@bs.module "@chakra-ui/core"] [@react.component]
external make:
  (
    ~_as: component=?,
    // Color
    ~color: responsive(string)=?,
    ~backgroundColor: responsive(string)=?,
    ~opacity: responsive(string)=?,
    // Shadow
    ~boxShadow: responsive(string)=?,
    ~textShadow: responsive(string)=?,
    // Border
    ~outline: responsive(string)=?,
    ~rounded: responsive(string)=?,
    ~roundedTop: responsive(string)=?,
    ~roundedBottom: responsive(string)=?,
    ~roundedLeft: responsive(string)=?,
    ~roundedRight: responsive(string)=?,
    ~roundedTopRight: responsive(string)=?,
    ~roundedTopLeft: responsive(string)=?,
    ~roundedBottomRight: responsive(string)=?,
    ~roundedBottomLeft: responsive(string)=?,
    ~border: responsive(string)=?,
    ~borderWidth: responsive(string)=?,
    ~borderTop: responsive(string)=?,
    ~borderBottom: responsive(string)=?,
    ~borderLeft: responsive(string)=?,
    ~borderRight: responsive(string)=?,
    ~borderTopWidth: responsive(string)=?,
    ~borderBottomWidth: responsive(string)=?,
    ~borderLeftWidth: responsive(string)=?,
    ~borderRightWidth: responsive(string)=?,
    ~borderColor: responsive(string)=?,
    ~borderBottomColor: responsive(string)=?,
    ~borderTopColor: responsive(string)=?,
    ~borderRightColor: responsive(string)=?,
    ~borderLeftColor: responsive(string)=?,
    ~borderStyle: responsive(string)=?,
    // Typography
    ~isTruncated: bool=?,
    ~fontFamily: responsive(string)=?,
    ~fontWeight: responsive(string)=?,
    ~fontSize: responsive(string)=?,
    ~fontStyle: responsive(string)=?,
    ~lineHeight: responsive(string)=?,
    ~letterSpacing: responsive(string)=?,
    ~textAlign: responsive(string)=?,
    ~textDecoration: responsive(string)=?,
    ~textTransform: responsive(string)=?,
    ~whiteSpace: string=?,
    ~wordWrap: string=?,
    // Spacing
    ~margin: responsive(string)=?,
    ~marginTop: responsive(string)=?,
    ~marginBottom: responsive(string)=?,
    ~marginLeft: responsive(string)=?,
    ~marginRight: responsive(string)=?,
    ~marginX: responsive(string)=?,
    ~marginY: responsive(string)=?,
    ~m: responsive(string)=?,
    ~mx: responsive(string)=?,
    ~my: responsive(string)=?,
    ~mr: responsive(string)=?,
    ~ml: responsive(string)=?,
    ~mt: responsive(string)=?,
    ~mb: responsive(string)=?,
    ~padding: responsive(string)=?,
    ~paddingTop: responsive(string)=?,
    ~paddingBottom: responsive(string)=?,
    ~paddingLeft: responsive(string)=?,
    ~paddingRight: responsive(string)=?,
    ~paddingX: responsive(string)=?,
    ~paddingY: responsive(string)=?,
    ~p: responsive(string)=?,
    ~px: responsive(string)=?,
    ~py: responsive(string)=?,
    ~pr: responsive(string)=?,
    ~pl: responsive(string)=?,
    ~pt: responsive(string)=?,
    ~pb: responsive(string)=?,
    // Layout
    ~width: responsive(string)=?,
    ~height: responsive(string)=?,
    ~maxWidth: responsive(string)=?,
    ~maxHeight: responsive(string)=?,
    ~minWidth: responsive(string)=?,
    ~minHeight: responsive(string)=?,
    ~display: responsive(string)=?,
    ~verticalAlign: responsive(string)=?,
    ~overflow: responsive(string)=?,
    ~overflowX: responsive(string)=?,
    ~overflowY: responsive(string)=?,
    // Position
    ~position: responsive(string)=?,
    ~zIndex: responsive(string)=?,
    ~top: responsive(string)=?,
    ~left: responsive(string)=?,
    ~right: responsive(string)=?,
    ~bottom: responsive(string)=?,
    // Transform
    ~transform: string=?,
    ~transition: string=?,
    ~transformOrigin: string=?,
    // Flex
    ~alignItems: responsive(string)=?,
    ~justifyContent: responsive(string)=?,
    ~flexWrap: responsive(string)=?,
    ~flexDirection: responsive(string)=?,
    ~flex: responsive(string)=?,
    ~flexGrow: responsive(int)=?,
    ~flexShrink: responsive(int)=?,
    ~flexBasis: responsive(string)=?,
    ~justifySelf: responsive(string)=?,
    ~alignSelf: responsive(string)=?,
    ~order: responsive(int)=?,
    // Aria
    ~role: string=?,
    ~ariaLabel: string=?,
    ~ariaLabelledby: string=?,
    ~ariaActiveDescendant: string=?,
    ~ariaControls: string=?,
    ~ariaAutocomplete: string=?,
    ~ariaSelected: bool=?,
    ~ariaDisabled: bool=?,
    ~ariaHidden: bool=?,
    ~ariaHaspopup: bool=?,
    ~dataToggle: bool=?,
    // Event
    ~cursor: string=?,
    ~onClick: ReactEvent.Mouse.t => unit=?,
    ~onMouseDown: ReactEvent.Mouse.t => unit=?,
    ~onMouseMove: ReactEvent.Mouse.t => unit=?,
    ~onMouseLeave: ReactEvent.Mouse.t => unit=?,
    ~onMouseEnter: ReactEvent.Mouse.t => unit=?,
    ~onBlur: ReactEvent.Focus.t => unit=?,
    ~onFocus: ReactEvent.Focus.t => unit=?,
    ~onKeyDown: ReactEvent.Keyboard.t => unit=?,
    ~onKeyUp: ReactEvent.Keyboard.t => unit=?,
    // Common
    ~disabled: bool=?,
    ~tabIndex: int=?,
    ~ref: React.Ref.t('ref)=?,
    ~id: string=?,
    ~className: string=?,
    ~key: string=?,
    ~variant: [@bs.string] [
                | `line
                | `enclosed
                | [@bs.as "enclosed-colored"] `enclosedColored
                | [@bs.as "soft-rounded"] `softRounded
                | [@bs.as "solid-rounded"] `solidRounded
                | [@bs.as "unstyled"] `unstyled
              ]
                =?,
    ~size: [@bs.string] [ | `sm | `md | `lg]=?,
    ~children: React.element
  ) =>
  React.element =
  "Tabs";