VelvetKit

Previews

No matching results.

x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<div class="space-y-6">
  <div>
    <h3 class="text-sm font-medium mb-2 text-muted-foreground">Default</h3>
    <div role="radiogroup" id="ui-rg-09bdc940" class="flex flex-col gap-2">  <label for="ui-rg-item-587df1e4" class="inline-flex items-center gap-2 select-none">
        <span class="relative inline-flex">
          <input id="ui-rg-item-587df1e4" type="radio" value="free" checked="checked" name="default_plan" class="peer appearance-none shrink-0 rounded-full border border-input bg-background transition-all checked:bg-primary checked:border-primary focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-1 ring-offset-background w-4 h-4">
          <span class="pointer-events-none absolute inset-0 flex items-center justify-center opacity-0 peer-checked:opacity-100 transition-opacity">
            <span class="w-2.5 h-2.5 rounded-full bg-primary-foreground"></span>
          </span></span>    <span class="text-sm leading-none">Free plan</span>
      </label>  <label for="ui-rg-item-a699bf51" class="inline-flex items-center gap-2 select-none">
        <span class="relative inline-flex">
          <input id="ui-rg-item-a699bf51" type="radio" value="pro" name="default_plan" class="peer appearance-none shrink-0 rounded-full border border-input bg-background transition-all checked:bg-primary checked:border-primary focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-1 ring-offset-background w-4 h-4">
          <span class="pointer-events-none absolute inset-0 flex items-center justify-center opacity-0 peer-checked:opacity-100 transition-opacity">
            <span class="w-2.5 h-2.5 rounded-full bg-primary-foreground"></span>
          </span></span>    <span class="text-sm leading-none">Pro plan — $9/mo</span>
      </label>  <label for="ui-rg-item-9483674d" class="inline-flex items-center gap-2 select-none">
        <span class="relative inline-flex">
          <input id="ui-rg-item-9483674d" type="radio" value="enterprise" name="default_plan" class="peer appearance-none shrink-0 rounded-full border border-input bg-background transition-all checked:bg-primary checked:border-primary focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-1 ring-offset-background w-4 h-4">
          <span class="pointer-events-none absolute inset-0 flex items-center justify-center opacity-0 peer-checked:opacity-100 transition-opacity">
            <span class="w-2.5 h-2.5 rounded-full bg-primary-foreground"></span>
          </span></span>    <span class="text-sm leading-none">Enterprise — Contact us</span>
      </label></div>
  </div>
</div>
1
2
3
4
5
6
7
8
9
10
<div class="space-y-6">
  <div>
    <h3 class="text-sm font-medium mb-2 text-muted-foreground">Default</h3>
    <%= render(UI::RadioGroup.new(name: "default_plan", value: "free")) do |rg| %>
      <% rg.with_item(value: "free", label: "Free plan") %>
      <% rg.with_item(value: "pro", label: "Pro plan — $9/mo") %>
      <% rg.with_item(value: "enterprise", label: "Enterprise — Contact us") %>
    <% end %>
  </div>
</div>

No notes provided.

No params configured.