Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Component

Status

Zeplin link

Storybook link

DEV todo

UX todo

Priority

DEV Estimate

Text Field

Status
titledev needed

https://app.zeplin.io/project/5970b366bee38cf87b2de932/screen/5986eb2359182e49f062ce3f

http://10.165.245.224/reactlux/?path=/story/textfield--text-field-story

When text was not inserted and the field is active - Clicking the field will place the cursor at the beginning and the hint text will disappear.

Missing Error and warning icons

2

button

Status
colourGreen
titleDone

https://app.zeplin.io/project/5970b366bee38cf87b2de932/screen/5a0bfac49a997dc84aa89715

http://10.165.245.224/reactlux/?path=/story/button--button-story

Status
colourGreen
titleDone

Status
colourGreen
titleDone

Status
colourGreen
titleDone

icons

Status
colourGreen
titleDone

https://app.zeplin.io/project/5970b366bee38cf87b2de932/screen/59928f231aef8c781243c882

http://10.165.245.224/reactlux/?path=/story/icon--icon-story

Status
colourGreen
titleDone

Status
colourGreen
titleDone

Status
colourGreen
titleDone

table

Status
titledev needed

https://app.zeplin.io/project/5970b366bee38cf87b2de932/screen/59946fcf9428e2cf6df18fa3

http://10.165.245.224/reactlux/?path=/story/table--table-story

Add:

Sorting

Sorting

1

Status
titledev needed

Row selection

Status
title

  • Inline Editable rows

  • Tree tables

    dev needed

    Inline Editing Tables

    Status
    titledev needed

    Tree Tables

    Status
    titledev needed

    Extended Rows

    table

    1Tables

    checkbox + checkbox group

    Status
    titledev needed

    https://app.zeplin.io/project/5970b366bee38cf87b2de932/screen/59928f231aef8c781243c927

    http://10.165.245.224/reactlux/?path=/story/checkbox--checkbox-story

    • Add a focus indication - need to add show a checkbox which has a focus (grey BG)

    • The checkbox will have an hovered/active state when hovering/clicking either the checkbox or the label describing it

    2

    radio button + radio group

    Status
    colourRed
    titleDefect

    https://app.zeplin.io/project/5970b366bee38cf87b2de932/screen/59928f221be7f10a090bbf16

    http://10.165.245.224/reactlux/?path=/story/radio--radio-story

    Status
    colourGreen
    titleDone

    Center radio button check circle

    Select (Drop Down Menu)

    Status
    colourGreen
    titleDone

    https://app.zeplin.io/project/5970b366bee38cf87b2de932/screen/5986eb24bdc8f862e79afe67

    http://10.165.245.224/reactlux/?path=/story/select--selecttory

    Status
    colourGreen
    titleDone

    Status
    colourGreen
    titleDone

    Status
    colourGreen
    titleDone

    Selector - Segmented button

    Status
    titledev needed

    https://zpl.io/2Eyk8XD

    Add selection state (Currently it is missing))

    1

    Date Picker

    Status
    colourGreen
    titleDone

    https://zpl.io/aNXBPk2

    Status
    colourGreen
    titleDone

    Status
    colourGreen
    titleDone

    Status
    colourGreen
    titleDone

    Time Picker

    https://zpl.io/adOXdRV

    Create component according to LUX

    1

    Combo Box

    https://zpl.io/amp1y3V

    Add a combobox with a functionality where the user enters a value which is not from the list

    1

    Split button

    Status
    colourGreen
    titleDone

    https://zpl.io/V4WPQ82

    Add 2 types of split buttons:

    1. Persistent

    2. Fixed

    Currently, only Persistent is supported

    missing disabled, error and warning states

    2

    Slider

    https://zpl.io/VqoY84b

    Add component according to LUX design and according to the design

    2

    Tree

    Status
    titledev needed

    https://zpl.io/agwRA0a

    • When the label is truncated (node name), hovering over it will show a tooltip with the full label.

    Fix styling issues

    1

    Tree

    https://zpl.io/agwRA0a

    • When a user expands a node if the nodes are not shown immediately, provide a "loading" indication at the place below the expanded node.

    4

    Tree

    https://zpl.io/agwRA0a

    • Multiple selection -  Allow the selection of one or more items. For this, the tree provides checkboxes on the left side of each line item

    2Switch

    Toggle Buttons

    https://zpl.io/bl5Myv2

    Add component according to LUX design

    2

    Tabs

    https://zpl.io/bPkL1ma

    Add components according to LUX design (including error/warning indications)

    1

    Tabs

    https://zpl.io/VODWzzr

    Add components according to LUX design

    1

    Tabs

    https://zpl.io/bJvqAmE

    Add components according to LUX design

    2

    Popup window

    https://zpl.io/VKOlj6V

    Add component according to LUX design:

    • The popup should appear at 2/3 height of the screen

    • The user will be able to move the popup across the screen

    4

    Message popups(warning, error etc)

    https://zpl.io/bP6mg6V

    Add components according to LUX design:

    • max-height: 600px for the whole popup

    • if the text is longer, a scroll will be added

    1

    Wizard

    https://zpl.io/bW6oWKa

    Add component according to LUX design

    2

    Tooltips

    https://zpl.io/b6JJj6K

    Add all types of tooltips according to LUX design

    1

    List

    https://zpl.io/V1XnDX2

    Add component according to LUX design

    1

    Numeric stepperStepper

    https://zpl.io/2ZWPJwV

    Add component according to LUX design

    1

    Text Area

    Status
    colourBlue
    titlewaiting for review

    https://zpl.io/2v4yY7a

    When text was not inserted and the field is active - Clicking the field will place the cursor at the beginning and the hint text will disappear.

    2

    search fieldSearch

    Status
    colourBlue
    titlewaiting for review

    https://zpl.io/25Gz0na

    When text was not inserted and the field is active - Clicking the field will place the cursor at the beginning and the hint text will disappear.

    2

    Text link

    Status
    colourBlue
    titlewaiting for review

    https://zpl.io/29WK6ea

    Spreadsheet table

    Add component according to LUX design

    3

    Accordion

    Add component according to LUX design

    2

    Breadcrumbs

    Add component according to LUX design

    1

    Action Menus

    Add component according to LUX design

    1

    Multiple selection drop down menu

    Add component according to LUX design

    2

    Searchable drop down menu

    Add component according to LUX design

    2

    Multi select searchable drop down menu

    Add component according to LUX design

    2

    Dialogs

    Add component according to LUX design

    1

    Progress Indicator

    Add component according to LUX design

    1

    Toast

    Add component according to LUX design

    1

    Tagging

    Add component according to LUX design

    2

    Range Picker

    Add component according to LUX design

    2

    ...