meveo-org / mv-select

0 stars 1 forks source link

Handle hirerarchic data #10

Open ClementBareth opened 1 year ago

ClementBareth commented 1 year ago

Data input format example (= .value attribute's value of mv-select) :

[
  {
    label: 'Option 1',
    value: 'option1',
    children: [
      {
        label: "Child Option 1.1",
        value: "option1.childOpt1"
      }, 
      {
        label: "Child Option 1.2",
        value: "option1.childOpt2"
      }
    ]
  },
  {
    label: 'Option 2',
    value: 'option2',
    children: [
      {
        label: "Child Option 2.1",
        value: "option2.childOpt1",
        children: [
          {
            label: "Child option 2.1.1",
            value: "option2.childOpt1.childOpt1"
          }
        ]
      }
    ]
  },
  {
    label: 'Option 3',
    value: 'option3',
  }
]

Graphically, it should look like this : image We don't need the checkboxes and the "select all", as we are using highlighting to show a selection. The point here is the identation. It should be handled using a class, ie: option-level-1, option-level-2, etc ...

An other point is that when a option is selected, all its children should be selected as well