0.1.0 • Published 3 years ago

@talixo/grid v0.1.0

Weekly downloads
15
License
MIT
Repository
github
Last release
3 years ago

Talixo Grid

UI components which represents grid. The base one is Segment - in traditional grid systems it's just a column. There are also Group and Masonry components, which are also Segments, so can be stacked.

  • Segment is a block (or column traditionally)
  • Group is a group of segments (or a row traditionally)
  • Masonry is group of groups

We are using grid with 12 columns for now.

How to install

Package is available as @talixo/grid in NPM registry, so you can use it in your project using npm install @talixo/grid --save or yarn add @talixo/grid.

Requirements

Your package should additionally have some extra dependencies:

  • @talixo/shared: ^0.1.0
  • classnames: ^2.2.5
  • prop-types: ^15.6.1
  • react: ^16.2.0
  • react-dom: ^16.2.0

These packages are required by @talixo/grid, but you have to install them manually, to avoid having different versions of these in your application.

Supported props

Segment

Property nameTypeDefaultDescription
classNamestringn/aadditional class name
sizenumbern/a, full rowdefault number of columns (from small screen)
mediumnumbern/anumber of columns from medium screen
largenumbern/anumber of columns from large screen
xlargenumbern/anumber of columns from extra-large screen

Group

Property nameTypeDefaultDescription
classNamestringn/aadditional class name
spacedbooleanfalseShould keep spaces between?
childrenSegment[]n/aSegment elements (includes also Group and Masonry)
sizenumbern/a, full rowlook at Segment
mediumnumbern/alook at Segment
largenumbern/alook at Segment
xlargenumbern/alook at Segment

Masonry

Property nameTypeDefaultDescription
classNamestringn/aadditional class name
childrenGroup[]n/aGroup elements
sizenumbern/a, full rowlook at Segment
mediumnumbern/alook at Segment
largenumbern/alook at Segment
xlargenumbern/alook at Segment

Changelog

  • 0.1.0 - initial version
1.0.0-alpha.35

3 years ago

1.0.0-alpha.31

3 years ago

1.0.0-alpha.30

3 years ago

1.0.0-alpha.27

3 years ago

1.0.0-alpha.24

3 years ago

1.0.0-alpha.20

3 years ago

1.0.0-alpha.19

3 years ago

1.0.0-alpha.18

3 years ago

1.0.0-alpha.16

3 years ago

1.0.0-alpha.12

4 years ago

1.0.0-alpha.9

4 years ago

1.0.0-alpha.8

4 years ago

1.0.0-alpha.7

4 years ago

1.0.0-alpha.6

4 years ago

1.0.0-alpha.5

4 years ago

1.0.0-alpha.4

4 years ago

1.0.0-alpha.2

4 years ago

0.1.0

4 years ago