From mboxrd@z Thu Jan  1 00:00:00 1970
Return-Path: <kiizuha@gnuweeb.org>
X-Spam-Checker-Version: SpamAssassin 3.4.6 (2021-04-09) on
	server-vie001.gnuweeb.org
X-Spam-Level: 
X-Spam-Status: No, score=-1.2 required=5.0 tests=ALL_TRUSTED,DKIM_SIGNED,
	DKIM_VALID,DKIM_VALID_AU,DKIM_VALID_EF,URIBL_DBL_BLOCKED_OPENDNS,
	URIBL_ZEN_BLOCKED_OPENDNS autolearn=ham autolearn_force=no
	version=3.4.6
DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/simple; d=gnuweeb.org;
	s=default; t=1740264898;
	bh=O8LkWb03vcgIQdDdGcVI15HaN1z7YU3hff2GDXg9cOQ=;
	h=From:To:Cc:Subject:Date:Message-ID:In-Reply-To:References:
	 MIME-Version:Content-Transfer-Encoding:Message-ID:Date:From:
	 Reply-To:Subject:To:Cc:In-Reply-To:References:Resent-Date:
	 Resent-From:Resent-To:Resent-Cc:User-Agent:Content-Type:
	 Content-Transfer-Encoding;
	b=IfOyS7Rvt/hXfrEcWNG3Z7QE/k4oDn0EY+xhKxvzKquCEc6xpksyiwfr3aP3J4UK9
	 k4BBKovhcRurxqeY+3TlnR7gj8Rc/99WNw+s1dHxW8LvbNxT6tiLH/LQ7dUBaIz0Q5
	 loYGu6l7BUSQj2zVDW1C7xZOtxWYb2I8qUTt2IqhuEzkzPdn3nm6NkkWJneTHWn452
	 8X+VP30KZOHv7NHHTX9mwk8no7vlaXMMfyI5ewzHrGJQ0Oti1fIN5kBjPAoynWf+BG
	 xeLAvS6uatMsYHuNY25RWdI+h2EvcJWwDIRwdbDVTb6qdi22x2g3oc4ntVIJPKPbbJ
	 Hxm4QqtFT60Sg==
Received: from localhost.localdomain (unknown [101.128.125.35])
	by server-vie001.gnuweeb.org (Postfix) with ESMTPSA id 5916C20744CB;
	Sat, 22 Feb 2025 22:54:57 +0000 (UTC)
From: Muhammad Rizki <kiizuha@gnuweeb.org>
To: Ammar Faizi <ammarfaizi2@gnuweeb.org>
Cc: Muhammad Rizki <kiizuha@gnuweeb.org>,
	Alviro Iskandar Setiawan <alviro.iskandar@gnuweeb.org>,
	GNU/Weeb Mailing List <gwml@vger.gnuweeb.org>
Subject: [PATCH v1 11/13] feat(ui): add radio-group ui
Date: Sun, 23 Feb 2025 05:54:17 +0700
Message-ID: <20250222225423.1377-12-kiizuha@gnuweeb.org>
X-Mailer: git-send-email 2.45.2.windows.1
In-Reply-To: <20250222225423.1377-1-kiizuha@gnuweeb.org>
References: <20250222225423.1377-1-kiizuha@gnuweeb.org>
MIME-Version: 1.0
Content-Transfer-Encoding: 8bit
List-Id: <gwml.vger.gnuweeb.org>

Signed-off-by: Muhammad Rizki <kiizuha@gnuweeb.org>
---
 src/lib/components/ui/radio-group/index.ts    | 10 +++++++
 .../ui/radio-group/radio-group-item.svelte    | 30 +++++++++++++++++++
 .../ui/radio-group/radio-group.svelte         | 13 ++++++++
 3 files changed, 53 insertions(+)
 create mode 100644 src/lib/components/ui/radio-group/index.ts
 create mode 100644 src/lib/components/ui/radio-group/radio-group-item.svelte
 create mode 100644 src/lib/components/ui/radio-group/radio-group.svelte

diff --git a/src/lib/components/ui/radio-group/index.ts b/src/lib/components/ui/radio-group/index.ts
new file mode 100644
index 0000000..86c6131
--- /dev/null
+++ b/src/lib/components/ui/radio-group/index.ts
@@ -0,0 +1,10 @@
+import Root from "./radio-group.svelte";
+import Item from "./radio-group-item.svelte";
+
+export {
+  Root,
+  Item,
+  //
+  Root as RadioGroup,
+  Item as RadioGroupItem
+};
diff --git a/src/lib/components/ui/radio-group/radio-group-item.svelte b/src/lib/components/ui/radio-group/radio-group-item.svelte
new file mode 100644
index 0000000..646ab35
--- /dev/null
+++ b/src/lib/components/ui/radio-group/radio-group-item.svelte
@@ -0,0 +1,30 @@
+<script lang="ts">
+  import { RadioGroup as RadioGroupPrimitive, type WithoutChildrenOrChild } from "bits-ui";
+  import Circle from "lucide-svelte/icons/circle";
+  import { cn } from "$utils";
+
+  let {
+    ref = $bindable(null),
+    class: className,
+    ...restProps
+  }: WithoutChildrenOrChild<RadioGroupPrimitive.ItemProps> & {
+    value: string;
+  } = $props();
+</script>
+
+<RadioGroupPrimitive.Item
+  bind:ref
+  class={cn(
+    "aspect-square size-4 rounded-full border border-primary text-primary shadow focus:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
+    className
+  )}
+  {...restProps}
+>
+  {#snippet children({ checked })}
+    <div class="flex items-center justify-center">
+      {#if checked}
+        <Circle class="size-3.5 fill-primary" />
+      {/if}
+    </div>
+  {/snippet}
+</RadioGroupPrimitive.Item>
diff --git a/src/lib/components/ui/radio-group/radio-group.svelte b/src/lib/components/ui/radio-group/radio-group.svelte
new file mode 100644
index 0000000..e2b0147
--- /dev/null
+++ b/src/lib/components/ui/radio-group/radio-group.svelte
@@ -0,0 +1,13 @@
+<script lang="ts">
+  import { RadioGroup as RadioGroupPrimitive } from "bits-ui";
+  import { cn } from "$utils";
+
+  let {
+    ref = $bindable(null),
+    class: className,
+    value = $bindable(),
+    ...restProps
+  }: RadioGroupPrimitive.RootProps = $props();
+</script>
+
+<RadioGroupPrimitive.Root bind:value class={cn("grid gap-2", className)} {...restProps} bind:ref />
-- 
Muhammad Rizki