open-index/open-npm huggingface dataset:
npm package: @piksl/box
Description: - `<Box />` is a Styled Component that wraps the `<div>` HTML-element and provides properties to change the styling of the element. More information about the available properties can be found in the API description below.
Author: Robin van der Voort
Latest version: 1.2.0

# @piksl/box

- `<Box />` is a Styled Component that wraps the `<div>` HTML-element and provides properties to change the styling of the element. More information about the available properties can be found in the API description below.

## API
### Box
Prop | Description | Type | Default
--- | --- | --- | ---
display | Minimum height of the `<Container />` | `inline`, `block`, `flex` | -
justify | Sets the distribution of space between and around `<Box />` children items. | `flex-start`, `flex-end`, `center`, `space-between`, `space-around`, `space-evenly`  | -
align | Sets the destribution of space between and around `<Box />` children items. | `flex-start`, `flex-end`, `center` | -
wrap | Defines whether the flex items are inside `<Box />` are forced in a single line or can be flowed into multiple lines. | `nowrap`, `wrap`, `wrap-reverse` | `nowrap`
position | Sets how the `<Box />` is positioned | `static`, `relative`, `fixed`, `absolute`, `sticky` | -
margin | Sets the margin area on sides of the `<Box />` | `OffsetShorthandType`  | -
padding | Sets the padding area on sides of the `<Box />` | `OffsetShorthandType` | -
top | Determine the top location of positioned `<Box />` | `string` | -
right | Determine the right location of positioned `<Box />` | `string` | -
bottom | Determine the bottom location of positioned `<Box />` | `string` | -
left | Determine the left location of positioned `<Box />` | `string` | -
classname | The classname of the `<Box />` | `string` | -

## Types
### OffsetType
`number | "auto"`

### OffsetShorthandType
`[OffsetType, OffsetType, OffsetType, OffsetType]` | <br/>
`[OffsetType, OffsetType, OffsetType]` | <br/>
`[OffsetType, OffsetType]` | <br/>
`[OffsetType]`