3.2.0 • Published 1 month ago

@bedrock-layout/split v3.2.0

Weekly downloads
15
License
MIT
Repository
github
Last release
1 month 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@infinitebrahmanuniverse/nolb-_bed@bedrock-layout/switcher@bedrock-layout/primitives
3.2.0

1 month ago

3.1.18

3 months ago

3.1.17

3 months ago

3.1.19

3 months ago

3.1.16

4 months ago

3.1.15

4 months ago

3.1.14

5 months ago

3.1.12

7 months ago

3.1.11

7 months ago

3.1.13

7 months ago

3.1.10

8 months ago

3.1.9

8 months ago

3.1.8

10 months ago

3.1.7

1 year ago

3.1.6

1 year ago

3.1.3

1 year ago

3.1.2

1 year ago

3.1.1

1 year ago

3.1.5

1 year ago

3.1.4

1 year ago

3.0.4

1 year ago

3.0.3

1 year ago

3.0.2

1 year ago

3.0.1

1 year ago

3.0.0

1 year ago

3.1.0

1 year ago

2.8.2

1 year ago

2.8.1

2 years ago

2.6.0

2 years ago

2.8.0

2 years ago

2.5.0

2 years ago

2.7.0

2 years ago

2.4.9

2 years ago

2.4.7

2 years ago

2.4.8

2 years ago

2.4.6

2 years ago

2.4.1

2 years ago

2.4.3

2 years ago

2.4.2

2 years ago

2.4.5

2 years ago

2.4.4

2 years ago

2.4.0

2 years ago

2.3.15

2 years ago

2.3.8

2 years ago

2.3.7

2 years ago

2.3.9

2 years ago

2.3.6

2 years ago

2.3.13

2 years ago

2.3.12

2 years ago

2.3.14

2 years ago

2.3.11

2 years ago

2.3.10

2 years ago

2.2.0

2 years ago

2.3.0

2 years ago

2.3.2

2 years ago

2.3.1

2 years ago

2.3.4

2 years ago

2.3.3

2 years ago

2.3.5

2 years ago

2.1.25

3 years ago

2.1.24

3 years ago

2.1.23

3 years ago

2.1.21

3 years ago

2.1.22

3 years ago

2.1.19

3 years ago

2.1.20

3 years ago

2.1.17

3 years ago

2.1.18

3 years ago

2.1.16

3 years ago

2.1.15

3 years ago

2.1.14

3 years ago

2.1.12

3 years ago

2.1.13

3 years ago

2.1.11

3 years ago

2.1.8

3 years ago

2.1.9

3 years ago

2.1.10

3 years ago

2.1.6

3 years ago

2.1.5

3 years ago

2.1.2

3 years ago

2.1.4

3 years ago

2.1.3

3 years ago

2.1.1

3 years ago

2.1.0

3 years ago

2.0.3

3 years ago

2.0.5

3 years ago

2.0.4

3 years ago

2.0.6

3 years ago

2.0.2

3 years ago

2.0.1

3 years ago

2.0.0

3 years ago

1.2.11

3 years ago

1.2.10

3 years ago

1.2.9

3 years ago

1.2.8

3 years ago

1.2.7

3 years ago

1.2.6

3 years ago

1.2.5

3 years ago

1.2.4

3 years ago

1.2.3

3 years ago

1.2.2

3 years ago

1.2.1

4 years ago

1.2.0

4 years ago

1.1.3

4 years ago

1.1.2

4 years ago

1.1.1

4 years ago

1.1.0

4 years ago

1.0.5

4 years ago

1.0.4

4 years ago

1.0.3

4 years ago

1.0.2

4 years ago

1.0.1

4 years ago

1.0.0

4 years ago