Non-Polynomial Mantissa

    @jouwomgeving/ui-list

    2.0.3 • Public • Published

    ui-list

    Usage

    import React from 'react';
    import * as List from '@jouwomgeving/ui-list';
    
    function Layout() {
      return (
        <List.Container>
          <List.Row>
            <List.Cell>
              Header
            </List.Cell>
          </List.Row>
          <List.Delimiter />
          <List.Row>
            <List.Cell
              width="120px"
              weight="0"
            >
              Column 1
            </List.Cell>
            <List.Cell>
              Column 2
            </List.Cell>
          </List.Row>
          <List.Delimiter type="secondary" />
          <List.Row>
            <List.Cell
              width="120px"
              weight="0"
            >
              Column 1
            </List.Cell>
            <List.Cell>
              Column 2
            </List.Cell>
          </List.Row>
          <List.Delimiter type="secondary" />
        </List.Container>
      )
    }
    
    export default Layout;

    Container

    About

    Basic container for ui-list, this exist just for the document structure of this project, so it will behave like a real list in the document.

    PropTypes

    Props Values Default Required
    children ReactElement Yes

    Delimiter

    About

    The Delimiter for the list components, this supports the two kinds of JO Delimiters;

    1. Primary
    2. Secondary

    PropTypes

    Props Values Default Required
    type primary, secondary primary No

    Row

    About

    A wrapper which creates a full accessible row for the ui-list package.

    The component also exposes some event handlers:

    1. onSelect | onDeselect
      Will be triggered when there is a select or deselect event happening, this can be controlled with the selected property.
    2. onHover
      This can be used to listen to hover events within the component.
    3. onFocus This can be used to listen to focus events within the component.
    4. onClick The normal onClick handler

    PropTypes

    Props Values Default Required
    children ReactElement Yes
    onSelect function No
    onDeselect function No
    selected boolean No
    onHover function No
    onFocus function No
    onClick function No

    Cell

    About

    A Cell for usage within the Row component.

    PropTypes

    Props Values Default Required
    children ReactElement Yes
    size CSS unit 100% Yes
    weight 0, 1, 2 1 Yes
    vertical top, center, bottom top No

    Keywords

    none

    Install

    npm i @jouwomgeving/ui-list

    DownloadsWeekly Downloads

    51

    Version

    2.0.3

    License

    UNLICENSED

    Unpacked Size

    50.1 kB

    Total Files

    23

    Last publish

    Collaborators

    • gaaltink.avinty
    • marcelblijleven_avinty
    • ivanhulzen
    • dkainama
    • rvanleeuwen
    • heesink
    • hellobramkok
    • dbunskoek