1
0
Fork 0
mirror of synced 2024-07-23 15:15:46 +12:00

Merge pull request #123 from Conor-Mack/bugfix/disable-list-item

Support for disabling list items
This commit is contained in:
Conor_Mack 2020-02-24 11:48:16 +00:00 committed by GitHub
commit 5e64c5e453
3 changed files with 31 additions and 25 deletions

View file

@ -32,6 +32,7 @@
}) })
function handleSelectedItem(item) { function handleSelectedItem(item) {
if (!item.disabled) {
if (singleSelection || inputElement === "radiobutton") { if (singleSelection || inputElement === "radiobutton") {
items.forEach(i => { items.forEach(i => {
if (i.selected) i.selected = false if (i.selected) i.selected = false
@ -46,6 +47,7 @@
} }
onSelect(items.filter(item => item.selected)) onSelect(items.filter(item => item.selected))
} }
}
$: useDoubleLine = $: useDoubleLine =
variant == "two-line" && variant == "two-line" &&

View file

@ -1,27 +1,30 @@
<script> <script>
import { setContext } from "svelte"; import { setContext } from "svelte"
import { Radiobutton } from "../Radiobutton"; import { Radiobutton } from "../Radiobutton"
import { Checkbox } from "../Checkbox"; import { Checkbox } from "../Checkbox"
import ClassBuilder from "../ClassBuilder.js"; import ClassBuilder from "../ClassBuilder.js"
const cb = new ClassBuilder("list-item"); const cb = new ClassBuilder("list-item")
export let onClick = item => {}; export let onClick = item => {}
export let item = null; export let item = null
export let useDoubleLine = false; export let useDoubleLine = false
export let inputElement = null; //radiobutton or checkbox export let inputElement = null //radiobutton or checkbox
$: if (!!inputElement) { $: if (!!inputElement) {
setContext("BBMD:input:context", "list-item"); setContext("BBMD:input:context", "list-item")
} }
$: modifiers = { selected: !inputElement ? item.selected : null }; $: modifiers = {
$: props = { modifiers }; selected: !inputElement ? item.selected : null,
$: listItemClass = cb.build({ props }); disabled: item.disabled,
}
$: props = { modifiers }
$: listItemClass = cb.build({ props })
$: useSecondaryText = $: useSecondaryText =
typeof item.text === "object" && "secondary" in item.text; typeof item.text === "object" && "secondary" in item.text
</script> </script>
<li <li

View file

@ -129,6 +129,7 @@ export const props = {
{ {
text: { primary: "Pastie", secondary: "Bap with Mayo" }, text: { primary: "Pastie", secondary: "Bap with Mayo" },
value: 1, value: 1,
disabled: true,
}, },
{ text: { primary: "Fish", secondary: "Salmon or Cod" }, value: 2 }, { text: { primary: "Fish", secondary: "Salmon or Cod" }, value: 2 },
], ],