diff options
| author | ivar <i@oiee.no> | 2024-04-28 22:37:30 +0200 |
|---|---|---|
| committer | ivar <i@oiee.no> | 2024-04-28 22:37:30 +0200 |
| commit | ced66c5807575cd29f6aa5632e8ad02b38c8448a (patch) | |
| tree | 01760648ee293a2aef2288328014b5747d2192b4 /code/frontend/src/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte | |
| parent | 691ad60d7bff5934053d87267c4e303ef3ed5f97 (diff) | |
| download | greatoffice-ced66c5807575cd29f6aa5632e8ad02b38c8448a.tar.xz greatoffice-ced66c5807575cd29f6aa5632e8ad02b38c8448a.zip | |
WIP new frontend
Diffstat (limited to 'code/frontend/src/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte')
| -rw-r--r-- | code/frontend/src/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/code/frontend/src/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte b/code/frontend/src/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte new file mode 100644 index 0000000..ea02af0 --- /dev/null +++ b/code/frontend/src/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte @@ -0,0 +1,35 @@ +<script lang="ts"> + import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui' + import Check from 'svelte-radix/Check.svelte' + import { cn } from '$utils/ui' + + type $$Props = DropdownMenuPrimitive.CheckboxItemProps + type $$Events = DropdownMenuPrimitive.CheckboxItemEvents + + let className: $$Props['class'] = undefined + export let checked: $$Props['checked'] = undefined + export { className as class } +</script> + +<DropdownMenuPrimitive.CheckboxItem + bind:checked + class={cn( + 'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50', + className + )} + {...$$restProps} + on:click + on:keydown + on:focusin + on:focusout + on:pointerdown + on:pointerleave + on:pointermove +> + <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center"> + <DropdownMenuPrimitive.CheckboxIndicator> + <Check class="h-4 w-4" /> + </DropdownMenuPrimitive.CheckboxIndicator> + </span> + <slot /> +</DropdownMenuPrimitive.CheckboxItem> |
