TempMonitor/src/lib/components/ui/range-calendar/range-calendar-prev-button.svelte

<script>
  import { RangeCalendar as RangeCalendarPrimitive } from "bits-ui";
  import ChevronLeft from "@lucide/svelte/icons/chevron-left";
  import { buttonVariants } from "$lib/components/ui/button/index.js";
  import { cn } from "$lib/utils.js";

  let { ref = $bindable(null), class: className, children, ...restProps } = $props();
</script>

{#snippet Fallback()}
  <ChevronLeft class="size-4" />
{/snippet}

<RangeCalendarPrimitive.PrevButton
  bind:ref
  class={cn(
    buttonVariants({ variant: "outline" }),
    "size-7 bg-transparent p-0 opacity-50 hover:opacity-100",
    className,
  )}
  children={children || Fallback}
  {...restProps}
/>