mirrors/pocket-id
1
0
Fork 0
mirror of https://github.com/pocket-id/pocket-id.git synced 2026-02-10 03:49:20 +00:00
Code Activity

feat: add required indicator for required inputs (#993)

Browse Source
This commit is contained in:
Elias Schneider
2025-10-01 13:44:17 +02:00
committed by GitHub
parent 69e2083722
commit 043cce615d
12 changed files with 66 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
frontend/src/lib/components/ui/label/label.svelte
View File

@@ -5,16 +5,25 @@
let {
ref = $bindable(null),
class: className,
required = false,
children,
...restProps
}: LabelPrimitive.RootProps = $props();
}: LabelPrimitive.RootProps & {
required?: boolean;
} = $props();
</script>
<LabelPrimitive.Root
bind:ref
data-slot="label"
class={cn(
'mb-3 flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',
'mb-3 flex items-center gap-1.5 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',
required && "after:text-[14px] after:text-red-500 after:content-['*']",
className
)}
{...restProps}
/>
>
{#if children}
{@render children()}
{/if}
</LabelPrimitive.Root>