@r2digisolutions/ui 0.15.2 → 0.17.0

package/dist/components/index.d.ts

@@ -15,4 +15,6 @@ import Heading from './ui/Heading/Heading.svelte';
 import Label from './ui/Label/Label.svelte';
 import Field from './ui/Field/Field.svelte';
 import Input from './ui/Input/Input.svelte';
-export { Alert, Avatar, Button, Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter, Container, Field, Section, Loading, TableList, Heading, Label, Input };
+import InputRadio from './ui/InputRadio/InputRadio.svelte';
+import Textarea from './ui/Textarea/Textarea.svelte';
+export { Alert, Avatar, Button, Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter, Container, Field, Section, Loading, TableList, Heading, Label, Input, InputRadio, Textarea, };

package/dist/components/index.js

@@ -15,4 +15,6 @@ import Heading from './ui/Heading/Heading.svelte';
 import Label from './ui/Label/Label.svelte';
 import Field from './ui/Field/Field.svelte';
 import Input from './ui/Input/Input.svelte';
-export { Alert, Avatar, Button, Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter, Container, Field, Section, Loading, TableList, Heading, Label, Input };
+import InputRadio from './ui/InputRadio/InputRadio.svelte';
+import Textarea from './ui/Textarea/Textarea.svelte';
+export { Alert, Avatar, Button, Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter, Container, Field, Section, Loading, TableList, Heading, Label, Input, InputRadio, Textarea, };

package/dist/components/ui/InputRadio/InputRadio.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+	import type { Props } from './type.js';
+	import { Circle } from 'lucide-svelte';
+
+	let { children, name, group = $bindable(), value, ...props }: Props = $props();
+</script>
+
+<input aria-hidden="true" {name} tabindex="-1" type="radio" {value} bind:group class="hidden" />
+
+<div class="flex items-center gap-2">
+	<span
+		role="radio"
+		aria-checked="true"
+		class="border-primary text-primary ring-offset-background focus-visible:ring-ring mr-1 flex aspect-square h-4 w-4 items-center justify-center rounded-full border focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
+		aria-describedby="«rl»-form-item-description"
+		tabindex="-1"
+	>
+		<span class="flex items-center justify-center">
+			{#if group === value}
+				<Circle class={`bg-primary h-2 w-2 rounded-full transition`} />
+			{/if}
+		</span>
+	</span>
+	{@render children()}
+</div>

package/dist/components/ui/InputRadio/InputRadio.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { Props } from './type.js';
+declare const InputRadio: import("svelte").Component<Props, {}, "group">;
+type InputRadio = ReturnType<typeof InputRadio>;
+export default InputRadio;

package/dist/components/ui/InputRadio/type.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+import type { ClassValue } from 'svelte/elements';
+export interface Props {
+    name?: string;
+    children: Snippet;
+    class?: ClassValue;
+    group?: string;
+    value: string;
+}

package/dist/components/ui/InputRadio/type.js

@@ -0,0 +1 @@
+export {};

package/dist/components/ui/Textarea/Textarea.svelte

@@ -0,0 +1,18 @@
+<script lang="ts">
+	import type { Props } from './type.js';
+
+	const { onchange, rows = 10, ...props }: Props = $props();
+</script>
+
+<textarea
+	{...props}
+	{rows}
+	onchange={(e) => {
+		const value = e.currentTarget.value;
+		(onchange as (value: string | null, e: Event) => void)?.(value || null, e);
+	}}
+	class={[
+		'block w-full rounded-lg border border-gray-300 px-3 py-3 transition-colors focus:border-transparent focus:ring-2 focus:ring-purple-500',
+		props.class
+	]}
+></textarea>

package/dist/components/ui/Textarea/Textarea.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { Props } from './type.js';
+declare const Textarea: import("svelte").Component<Props, {}, "">;
+type Textarea = ReturnType<typeof Textarea>;
+export default Textarea;

package/dist/components/ui/Textarea/type.d.ts

@@ -0,0 +1,17 @@
+import type { ClassValue } from "svelte/elements";
+export interface Props {
+    onchange?: (value: string | null, e: Event) => void;
+    class?: ClassValue;
+    rows?: number;
+    cols?: number;
+    placeholder?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    autofocus?: boolean;
+    value?: string;
+    name?: string;
+    required?: boolean;
+    maxlength?: number;
+    minlength?: number;
+    autocomplete?: 'on' | 'off';
+}

package/dist/components/ui/Textarea/type.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@r2digisolutions/ui",
-	"version": "0.15.2",
+	"version": "0.17.0",
 	"private": false,
 	"packageManager": "bun@1.2.19",
 	"publishConfig": {
@@ -77,7 +77,7 @@
 		"prettier-plugin-tailwindcss": "^0.6.14",
 		"publint": "^0.3.12",
 		"storybook": "^9.0.17",
-		"svelte": "^5.36.8",
+		"svelte": "^5.36.10",
 		"svelte-check": "^4.3.0",
 		"tailwindcss": "^4.1.11",
 		"typescript": "^5.8.3",