refactor the Lists variant list selection

[B3nz01d]

The target is to show only one variant "Lists demo" with a link to a new page with a customization bottom sheet to allow:

• "list item size" - step counter from 1 to 2 (defaulted to 2)
• "Leading" - choice chips
  • "none"
  • "icon"
  • "circle" (default)
  • "square"
  • "wide"
• "trailing"
  • "none"
  • "checkmark"
  • "switch"
  • "icon"

Example of list:

• item 1: Title / Subtitle
• item 2: "carrot" / "root vegetables - 41 cal/100g"
• item 3: "apricot" / "stone fruits - 48 cal/100g"
• item 4: "butternut" / "squash fruits - 40 cal/100g"
• item 5: "mango" / "tropical fruit - 60 cal/100g"
• item 6: "nectarine" / "fruit - 44 cal/100g"
• item 7: "pumpkin" / "squash fruits - 26 cal/100g"
• item 8: "orange" / "citrus fruits - 63 cal/100g"

[ludovic35]

@mccart77 @B3nz01d In this screen zpl.io/RMv7A6v it is not possible to have miltuple selection in Trailing Chips because

• None can not be selected with other chips,
• switch can not be selected with other chips Regarding the shape of the leading image, do we consider :
• the image is provided in the right format (circle, square or wide) so the component has just to display it as it is
• the image is provided in a format and the item need to adjust it to fil the space (crop, fit, fill, apply a circle shape ...)

[B3nz01d]

based on the design review:

• the size of the image should not scale up and stay at its current height
• the list of variants should be updated to
  • "Selector list"
  • "trailing"
    • "checkmark"
    • "switch"
  • "standard list"
  • "trailing"
    • "none"
    • "text"
    • "icon"

[ludovic35]

Q1 : For standard List: is it possible to have this kind of item (zpl.io/RMv7A6v) (text and icon: i button) ? If yes, not possible to have :

• "trailing"

  • "none"
  • "text"
  • "icon"

Q2: the size of the image should not scale up and stay at its current height What doest it means its current height ?

@B3nz01d @mccart77 Can you clarify, please ?

[B3nz01d]

Q2: the size in fixed to what you see in zepplin, if the user raizes the font size, it will stay a the same initial size

[B3nz01d]

Q1: Yes it is possible to have text and icon at the same time. 2 options are possible:

• keep the chips but without the choice exclusion mechanism. To be more precise:
  • if one of the text or icon chip is already selected - then if you select none all the others will deactivate
  • if the user has the text chip selected and taps on the icon chip, then both chip get selected - and vise versa
  • if both text and icon chips are selected and the user taps on the icon chip the chip get deselected
• propose 2 separate lines with the a toggle switch on text and one on icon

I'd rather use the first option on my side. what do you propose @mccart77

[ludovic35]

@mccart77 @B3nz01d on zeplin i can't find : spacings between "i" button on "Details" text spacing between title or subtitle and "Details" text spacing above title spacing below subtitle or title is no subtitle spacing above and below the leading image

For dynamic type fonts, Should title or/ and subtitle should be truncated or we accepte all items don't have the same height ?

[Tayebsed93]

bug accessibility ticket : https://github.com/Orange-OpenSource/ods-ios/issues/298

@B3nz01d I will be able to put the label "OK Accessibility" once the ticket 298 has been corrected