Popover.svelte 670 B

1234567891011121314151617181920212223
  1. <script lang="ts">
  2. import type { BaseComponentProps } from "@json-render/svelte";
  3. import type { ShadcnProps } from "./catalog.js";
  4. import {
  5. Popover,
  6. PopoverContent,
  7. PopoverTrigger,
  8. } from "./ui/popover/index.js";
  9. import { Button } from "./ui/button/index.js";
  10. interface Props extends BaseComponentProps<ShadcnProps<"Popover">> {}
  11. let { props }: Props = $props();
  12. </script>
  13. <Popover>
  14. <PopoverTrigger>
  15. {#snippet child({ props: triggerProps })}
  16. <Button variant="outline" {...triggerProps}>{props.trigger}</Button>
  17. {/snippet}
  18. </PopoverTrigger>
  19. <PopoverContent class="w-64 text-sm">{props.content}</PopoverContent>
  20. </Popover>