3.2.2 • Published 11 months ago

@bedrock-layout/split v3.2.2

Weekly downloads
15
License
MIT
Repository
github
Last release
11 months ago

@bedrock-layout/split

A layout primitive that creates a split layout based on a fraction value.

Full docs at: bedrock-layout.dev

When to Use

Split Component is to be used when you want to create a split layout based on a fraction value. It will also enforce a spacing between child components with the help of the gutter prop and can also switch to a stack layout when the provided threshold is reached.

How to install

npm install @bedrock-layout/split

or

yarn add @bedrock-layout/split

Usage

import { Split } from '@bedrock-layout/split';

<Split gutter='size3' fraction='2/3'>
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
  <div>6</div>
</Split>;

data-attribute

For styling purposes, you can select data-bedrock-split.

API

* required

PropertyDescriptionTypeDefault
gutter*Sets the space between each child componentone of Spacing**-
fractionSets the fractional splitone of 'auto-start' , 'auto-end' , '1/4' , '1/3' , '1/2' , '2/3' , '3/4'1/2
switchAtSets the width threshold at which layout will change to Stacka number in pixels or valid CSS length as a string-

** By default, Spacing is one of spacing-constants values, but it can be overwritten using the ThemeProvider from @bedrock-layout/spacing-constants

splitlayoutreact
@bedrock-layout/spacing-constants@bedrock-layout/type-utils
@everything-registry/sub-chunk-117@bedrock-layout/primitives@bedrock-layout/switcher@infinitebrahmanuniverse/nolb-_bed
3.2.2

11 months ago

3.2.1

1 year ago

3.2.0

1 year ago

3.1.18

1 year ago

3.1.17

1 year ago

3.1.19

1 year ago

3.1.16

2 years ago

3.1.15

2 years ago

3.1.14

2 years ago

3.1.12

2 years ago

3.1.11

2 years ago

3.1.13

2 years ago

3.1.10

2 years ago

3.1.9

2 years ago

3.1.8

2 years ago

3.1.7

2 years ago

3.1.6

2 years ago

3.1.3

3 years ago

3.1.2

3 years ago

3.1.1

3 years ago

3.1.5

2 years ago

3.1.4

3 years ago

3.0.4

3 years ago

3.0.3

3 years ago

3.0.2

3 years ago

3.0.1

3 years ago

3.0.0

3 years ago

3.1.0

3 years ago

2.8.2

3 years ago

2.8.1

3 years ago

2.6.0

3 years ago

2.8.0

3 years ago

2.5.0

3 years ago

2.7.0

3 years ago

2.4.9

3 years ago

2.4.7

3 years ago

2.4.8

3 years ago

2.4.6

3 years ago

2.4.1

3 years ago

2.4.3

3 years ago

2.4.2

3 years ago

2.4.5

3 years ago

2.4.4

3 years ago

2.4.0

3 years ago

2.3.15

3 years ago

2.3.8

3 years ago

2.3.7

3 years ago

2.3.9

3 years ago

2.3.6

4 years ago

2.3.13

3 years ago

2.3.12

3 years ago

2.3.14

3 years ago

2.3.11

3 years ago

2.3.10

3 years ago

2.2.0

4 years ago

2.3.0

4 years ago

2.3.2

4 years ago

2.3.1

4 years ago

2.3.4

4 years ago

2.3.3

4 years ago

2.3.5

4 years ago

2.1.25

4 years ago

2.1.24

4 years ago

2.1.23

4 years ago

2.1.21

4 years ago

2.1.22

4 years ago

2.1.19

4 years ago

2.1.20

4 years ago

2.1.17

4 years ago

2.1.18

4 years ago

2.1.16

4 years ago

2.1.15

4 years ago

2.1.14

4 years ago

2.1.12

4 years ago

2.1.13

4 years ago

2.1.11

4 years ago

2.1.8

4 years ago

2.1.9

4 years ago

2.1.10

4 years ago

2.1.6

4 years ago

2.1.5

4 years ago

2.1.2

4 years ago

2.1.4

4 years ago

2.1.3

4 years ago

2.1.1

4 years ago

2.1.0

4 years ago

2.0.3

4 years ago

2.0.5

4 years ago

2.0.4

4 years ago

2.0.6

4 years ago

2.0.2

4 years ago

2.0.1

4 years ago

2.0.0

4 years ago

1.2.11

4 years ago

1.2.10

4 years ago

1.2.9

4 years ago

1.2.8

4 years ago

1.2.7

4 years ago

1.2.6

4 years ago

1.2.5

4 years ago

1.2.4

4 years ago

1.2.3

5 years ago

1.2.2

5 years ago

1.2.1

5 years ago

1.2.0

5 years ago

1.1.3

5 years ago

1.1.2

5 years ago

1.1.1

5 years ago

1.1.0

5 years ago

1.0.5

5 years ago

1.0.4

5 years ago

1.0.3

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago