aljaz/mutiny-web
1
0
Fork 0
mirror of https://github.com/aljazceru/mutiny-web.git synced 2026-01-08 00:34:25 +01:00
Code Issues Packages Projects Releases Wiki Activity

working controlled select

Browse Source
This commit is contained in:
Paul Miller
2023-05-02 09:44:27 -05:00
parent 5c06fc3679
commit b8c15a84f4
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/TagEditor.tsx
View File

@@ -1,6 +1,7 @@
import { Select, createOptions } from "@thisbeyond/solid-select";
import "~/styles/solid-select.css"
import { SmallHeader } from "./layout";
import { For } from "solid-js";
// take two arrays, subtract the second from the first, then return the first
function subtract<T>(a: T[], b: T[]) {
@@ -45,20 +46,19 @@ export function TagEditor(props: { title: string, values: TagItem[], setValues:
<SmallHeader>{props.title}</SmallHeader>
<Select
multiple
initialValue={props.selectedValues}
onChange={onChange}
placeholder="Where's it coming from?"
{...selectProps}
/>
{/* TODO: blocked on https://github.com/thisbeyond/solid-select/issues/39 */}
{/* <div class="flex gap-2 flex-wrap">
<div class="flex gap-2 flex-wrap">
<For each={subtract(props.values, props.selectedValues).slice(0, 3)}>
{(contact) => (
<div onClick={() => onChange([...props.selectedValues, contact])} class="bg-m-blue/50 px-1 py-[0.5] rounded cursor-pointer hover:outline-white hover:outline-1">{contact.name}</div>
<div onClick={() => onChange([...props.selectedValues, contact])} class="border border-l-white/50 border-r-white/50 border-t-white/75 border-b-white/25 bg-m-blue px-1 py-[0.5] rounded cursor-pointer hover:outline-white hover:outline-1">{contact.name}</div>
)}
</For>
<button class="bg-black border border-white px-1 py-[0.5] rounded cursor-pointer hover:outline-white hover:outline-1">+ Add Contact</button>
</div> */}
<button class="border border-l-white/50 border-r-white/50 border-t-white/75 border-b-white/25 bg-black px-1 py-[0.5] rounded cursor-pointer hover:outline-white hover:outline-1">+ Add Contact</button>
</div>
</div >
)
}