<turbo-stream action="update" target="icon-sheet"><template><div data-controller="ruby-ui--sheet"><div data-action="click->ruby-ui--sheet#open" data-controller="click"></div><template data-ruby-ui--sheet-target="content"><div data-controller="ruby-ui--sheet-content"><div data-state="open" data-action="click->ruby-ui--sheet-content#close" class="fixed pointer-events-auto inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"></div><div data-state="open" class="fixed pointer-events-auto z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500 inset-y-0 right-0 h-full border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right w-[300px] overflow-scroll"><div class="flex flex-col space-y-1.5 sm:text-left text-left"><h3 class="text-lg font-semibold leading-none tracking-tight">Hold04</h3><p class="text-sm text-muted-foreground gap-y-2">PhlexIcons::Huge</p><a href="https://github.com/AliOsm/phlex-icons/blob/main/lib/phlex-icons/huge/hold04.rb" type="button" class="whitespace-nowrap justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground px-3 py-1.5 h-8 text-xs flex items-center gap-1" target="-blank">Source code<svg class="size-4" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 3h6v6"></path><path d="M10 14 21 3"></path><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path></svg></a></div><div class="py-4 space-y-4"><div class="space-y-2"><div><p class="text-sm font-normal">Icon (Variant: <code class="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold">:stroke</code>) ↓</p><svg class="size-10" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M19.75 12.3347H20.5H20.5H19.75ZM5.81729 15.4792L6.43779 15.0579L6.43779 15.0579L5.81729 15.4792ZM6.3809 16.3093L5.7604 16.7306L5.7604 16.7306L6.3809 16.3093ZM6.2843 8.87473L5.76704 8.33164C5.75364 8.3444 5.74071 8.35766 5.72829 8.37138L6.2843 8.87473ZM8.24493 8.04309C8.54487 7.75741 8.55643 7.28268 8.27076 6.98274C7.98508 6.6828 7.51035 6.67124 7.21041 6.95691L8.24493 8.04309ZM4.25519 12.4372L5.00387 12.3927L4.25519 12.4372ZM4.30904 11.6756L3.57406 11.5262L4.30904 11.6756ZM19.4583 16.168L20.1639 16.4223L19.4583 16.168ZM16.3566 19.2136L16.1104 18.5051L16.3566 19.2136ZM10.197 19.3872L10.3527 18.6535H10.3527L10.197 19.3872ZM7.72767 18.0896L8.24483 17.5464L7.72767 18.0896ZM7 12C7 12.4142 7.33579 12.75 7.75 12.75C8.16421 12.75 8.5 12.4142 8.5 12H7ZM13 8.87473C13 9.28894 13.3358 9.62473 13.75 9.62473C14.1642 9.62473 14.5 9.28894 14.5 8.87473H13ZM16 9.5C16 9.91421 16.3358 10.25 16.75 10.25C17.1642 10.25 17.5 9.91421 17.5 9.5H16ZM19.75 8H19V8L19.75 8ZM10 8.5C10 8.91421 10.3358 9.25 10.75 9.25C11.1642 9.25 11.5 8.91421 11.5 8.5H10ZM5.19679 15.9005L5.7604 16.7306L7.0014 15.888L6.43779 15.0579L5.19679 15.9005ZM6.80156 9.41781L8.24493 8.04309L7.21041 6.95691L5.76704 8.33164L6.80156 9.41781ZM6.43779 15.0579C5.92498 14.3026 5.57104 13.7799 5.33415 13.346C5.10404 12.9245 5.01895 12.6465 5.00387 12.3927L3.50651 12.4817C3.53969 13.0402 3.73104 13.54 4.01761 14.0648C4.2974 14.5773 4.70038 15.1693 5.19679 15.9005L6.43779 15.0579ZM5.72829 8.37138C5.13366 9.02823 4.65143 9.55972 4.30239 10.029C3.94502 10.5095 3.68545 10.978 3.57406 11.5262L5.04403 11.8249C5.09477 11.5751 5.21846 11.3108 5.50599 10.9242C5.80186 10.5264 6.22619 10.0564 6.84031 9.37807L5.72829 8.37138ZM5.00387 12.3927C4.99257 12.2026 5.00605 12.0118 5.04403 11.8249L3.57406 11.5262C3.5102 11.8405 3.48749 12.1616 3.50651 12.4817L5.00387 12.3927ZM19 12.3347C19 14.4151 18.9888 15.2586 18.7527 15.9137L20.1639 16.4223C20.5112 15.4586 20.5 14.2862 20.5 12.3347H19ZM12.4527 20.25C14.4432 20.25 15.6287 20.2605 16.6027 19.922L16.1104 18.5051C15.4358 18.7395 14.5682 18.75 12.4527 18.75V20.25ZM18.7527 15.9137C18.318 17.1201 17.3492 18.0747 16.1104 18.5051L16.6027 19.922C18.2621 19.3455 19.5731 18.0616 20.1639 16.4223L18.7527 15.9137ZM12.4527 18.75C11.2705 18.75 10.7891 18.7461 10.3527 18.6535L10.0414 20.1209C10.6681 20.2539 11.3361 20.25 12.4527 20.25V18.75ZM5.7604 16.7306C6.37929 17.6421 6.74816 18.1926 7.21051 18.6328L8.24483 17.5464C7.92629 17.2431 7.6576 16.8545 7.0014 15.888L5.7604 16.7306ZM10.3527 18.6535C9.55688 18.4847 8.82685 18.1005 8.24483 17.5464L7.21051 18.6328C7.99531 19.38 8.97624 19.8949 10.0414 20.1209L10.3527 18.6535ZM8.5 12V6.5H7V12H8.5ZM9.25 5.75C9.66421 5.75 10 6.08579 10 6.5H11.5C11.5 5.25736 10.4926 4.25 9.25 4.25V5.75ZM8.5 6.5C8.5 6.08579 8.83579 5.75 9.25 5.75V4.25C8.00736 4.25 7 5.25736 7 6.5H8.5ZM13 7V8.87473H14.5V7H13ZM16 7V8H17.5V7H16ZM16 8V9.5H17.5V8H16ZM15.25 6.25C15.6642 6.25 16 6.58579 16 7H17.5C17.5 5.75736 16.4926 4.75 15.25 4.75V6.25ZM14.5 7C14.5 6.58579 14.8358 6.25 15.25 6.25V4.75C14.0074 4.75 13 5.75736 13 7H14.5ZM18.25 7.25C18.6642 7.25 19 7.58579 19 8H20.5C20.5 6.75736 19.4926 5.75 18.25 5.75V7.25ZM17.5 8C17.5 7.58579 17.8358 7.25 18.25 7.25V5.75C17.0074 5.75 16 6.75736 16 8H17.5ZM10 6.5V8.5H11.5V6.5H10ZM13 6V7H14.5V6H13ZM10 6V6.5H11.5V6H10ZM12.25 5.25C12.6642 5.25 13 5.58579 13 6H14.5C14.5 4.75736 13.4926 3.75 12.25 3.75V5.25ZM12.25 3.75C11.0074 3.75 10 4.75736 10 6H11.5C11.5 5.58579 11.8358 5.25 12.25 5.25V3.75ZM19 8L19 12.3347H20.5V8L19 8Z" fill="#141B34"></path></svg></div><div><p class="text-sm font-normal">With <code class="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold">Phlex::Kit</code> ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="no">Huge</span><span class="o">::</span><span class="no">Hold04</span><span class="p">(</span><span class="ss">variant: :stroke</span><span class="p">)</span></pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div><div><p class="text-sm font-normal">Without <code class="relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold">Phlex::Kit</code> (e.g. ERB) ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="n">render</span> <span class="no">PhlexIcons</span><span class="o">::</span><span class="no">Huge</span><span class="o">::</span><span class="no">Hold04</span><span class="p">.</span><span class="nf">new</span><span class="p">(</span><span class="ss">variant: :stroke</span><span class="p">)</span></pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div><div><p class="text-sm font-normal">Plain Phlex ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="k">def</span> <span class="nf">view_template</span>
	<span class="n">svg</span><span class="p">(</span>
		<span class="o">**</span><span class="n">attrs</span><span class="p">,</span>
		<span class="ss">viewbox: </span><span class="s1">'0 0 24 24'</span><span class="p">,</span>
		<span class="ss">fill: </span><span class="s1">'none'</span><span class="p">,</span>
		<span class="ss">xmlns: </span><span class="s1">'http://www.w3.org/2000/svg'</span>
	<span class="p">)</span> <span class="k">do</span> <span class="o">|</span><span class="n">s</span><span class="o">|</span>
		<span class="n">s</span><span class="p">.</span><span class="nf">path</span><span class="p">(</span>
			<span class="ss">d:
				</span><span class="s1">'M19.75 12.3347H20.5H20.5H19.75ZM5.81729 15.4792L6.43779 15.0579L6.43779 15.0579L5.81729 15.4792ZM6.3809 16.3093L5.7604 16.7306L5.7604 16.7306L6.3809 16.3093ZM6.2843 8.87473L5.76704 8.33164C5.75364 8.3444 5.74071 8.35766 5.72829 8.37138L6.2843 8.87473ZM8.24493 8.04309C8.54487 7.75741 8.55643 7.28268 8.27076 6.98274C7.98508 6.6828 7.51035 6.67124 7.21041 6.95691L8.24493 8.04309ZM4.25519 12.4372L5.00387 12.3927L4.25519 12.4372ZM4.30904 11.6756L3.57406 11.5262L4.30904 11.6756ZM19.4583 16.168L20.1639 16.4223L19.4583 16.168ZM16.3566 19.2136L16.1104 18.5051L16.3566 19.2136ZM10.197 19.3872L10.3527 18.6535H10.3527L10.197 19.3872ZM7.72767 18.0896L8.24483 17.5464L7.72767 18.0896ZM7 12C7 12.4142 7.33579 12.75 7.75 12.75C8.16421 12.75 8.5 12.4142 8.5 12H7ZM13 8.87473C13 9.28894 13.3358 9.62473 13.75 9.62473C14.1642 9.62473 14.5 9.28894 14.5 8.87473H13ZM16 9.5C16 9.91421 16.3358 10.25 16.75 10.25C17.1642 10.25 17.5 9.91421 17.5 9.5H16ZM19.75 8H19V8L19.75 8ZM10 8.5C10 8.91421 10.3358 9.25 10.75 9.25C11.1642 9.25 11.5 8.91421 11.5 8.5H10ZM5.19679 15.9005L5.7604 16.7306L7.0014 15.888L6.43779 15.0579L5.19679 15.9005ZM6.80156 9.41781L8.24493 8.04309L7.21041 6.95691L5.76704 8.33164L6.80156 9.41781ZM6.43779 15.0579C5.92498 14.3026 5.57104 13.7799 5.33415 13.346C5.10404 12.9245 5.01895 12.6465 5.00387 12.3927L3.50651 12.4817C3.53969 13.0402 3.73104 13.54 4.01761 14.0648C4.2974 14.5773 4.70038 15.1693 5.19679 15.9005L6.43779 15.0579ZM5.72829 8.37138C5.13366 9.02823 4.65143 9.55972 4.30239 10.029C3.94502 10.5095 3.68545 10.978 3.57406 11.5262L5.04403 11.8249C5.09477 11.5751 5.21846 11.3108 5.50599 10.9242C5.80186 10.5264 6.22619 10.0564 6.84031 9.37807L5.72829 8.37138ZM5.00387 12.3927C4.99257 12.2026 5.00605 12.0118 5.04403 11.8249L3.57406 11.5262C3.5102 11.8405 3.48749 12.1616 3.50651 12.4817L5.00387 12.3927ZM19 12.3347C19 14.4151 18.9888 15.2586 18.7527 15.9137L20.1639 16.4223C20.5112 15.4586 20.5 14.2862 20.5 12.3347H19ZM12.4527 20.25C14.4432 20.25 15.6287 20.2605 16.6027 19.922L16.1104 18.5051C15.4358 18.7395 14.5682 18.75 12.4527 18.75V20.25ZM18.7527 15.9137C18.318 17.1201 17.3492 18.0747 16.1104 18.5051L16.6027 19.922C18.2621 19.3455 19.5731 18.0616 20.1639 16.4223L18.7527 15.9137ZM12.4527 18.75C11.2705 18.75 10.7891 18.7461 10.3527 18.6535L10.0414 20.1209C10.6681 20.2539 11.3361 20.25 12.4527 20.25V18.75ZM5.7604 16.7306C6.37929 17.6421 6.74816 18.1926 7.21051 18.6328L8.24483 17.5464C7.92629 17.2431 7.6576 16.8545 7.0014 15.888L5.7604 16.7306ZM10.3527 18.6535C9.55688 18.4847 8.82685 18.1005 8.24483 17.5464L7.21051 18.6328C7.99531 19.38 8.97624 19.8949 10.0414 20.1209L10.3527 18.6535ZM8.5 12V6.5H7V12H8.5ZM9.25 5.75C9.66421 5.75 10 6.08579 10 6.5H11.5C11.5 5.25736 10.4926 4.25 9.25 4.25V5.75ZM8.5 6.5C8.5 6.08579 8.83579 5.75 9.25 5.75V4.25C8.00736 4.25 7 5.25736 7 6.5H8.5ZM13 7V8.87473H14.5V7H13ZM16 7V8H17.5V7H16ZM16 8V9.5H17.5V8H16ZM15.25 6.25C15.6642 6.25 16 6.58579 16 7H17.5C17.5 5.75736 16.4926 4.75 15.25 4.75V6.25ZM14.5 7C14.5 6.58579 14.8358 6.25 15.25 6.25V4.75C14.0074 4.75 13 5.75736 13 7H14.5ZM18.25 7.25C18.6642 7.25 19 7.58579 19 8H20.5C20.5 6.75736 19.4926 5.75 18.25 5.75V7.25ZM17.5 8C17.5 7.58579 17.8358 7.25 18.25 7.25V5.75C17.0074 5.75 16 6.75736 16 8H17.5ZM10 6.5V8.5H11.5V6.5H10ZM13 6V7H14.5V6H13ZM10 6V6.5H11.5V6H10ZM12.25 5.25C12.6642 5.25 13 5.58579 13 6H14.5C14.5 4.75736 13.4926 3.75 12.25 3.75V5.25ZM12.25 3.75C11.0074 3.75 10 4.75736 10 6H11.5C11.5 5.58579 11.8358 5.25 12.25 5.25V3.75ZM19 8L19 12.3347H20.5V8L19 8Z'</span><span class="p">,</span>
			<span class="ss">fill: </span><span class="s1">'#141B34'</span>
		<span class="p">)</span>
	<span class="k">end</span>
<span class="k">end</span>
</pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div><div><p class="text-sm font-normal">Plain SVG ↓</p><div class="w-full mt-1"><style>.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #c9d1d9;
  background-color: #161b22;
}
.highlight .k, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .kt, .highlight .kv {
  color: #ff7b72;
}
.highlight .gr {
  color: #f0f6fc;
}
.highlight .gd {
  color: #ffdcd7;
  background-color: #67060c;
}
.highlight .nb {
  color: #ffa657;
}
.highlight .nc {
  color: #ffa657;
}
.highlight .no {
  color: #ffa657;
}
.highlight .nn {
  color: #ffa657;
}
.highlight .sr {
  color: #7ee787;
}
.highlight .na {
  color: #7ee787;
}
.highlight .nt {
  color: #7ee787;
}
.highlight .gi {
  color: #aff5b4;
  background-color: #033a16;
}
.highlight .ges {
  font-weight: bold;
  font-style: italic;
}
.highlight .kc {
  color: #79c0ff;
}
.highlight .l, .highlight .ld, .highlight .m, .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .il, .highlight .mo, .highlight .mx {
  color: #79c0ff;
}
.highlight .sb {
  color: #79c0ff;
}
.highlight .bp {
  color: #79c0ff;
}
.highlight .ne {
  color: #79c0ff;
}
.highlight .nl {
  color: #79c0ff;
}
.highlight .py {
  color: #79c0ff;
}
.highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi, .highlight .vm {
  color: #79c0ff;
}
.highlight .o, .highlight .ow {
  color: #79c0ff;
}
.highlight .gh {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .gu {
  color: #1f6feb;
  font-weight: bold;
}
.highlight .s, .highlight .sa, .highlight .sc, .highlight .dl, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .sx, .highlight .s1, .highlight .ss {
  color: #a5d6ff;
}
.highlight .nd {
  color: #d2a8ff;
}
.highlight .nf, .highlight .fm {
  color: #d2a8ff;
}
.highlight .err {
  color: #f0f6fc;
  background-color: #8e1519;
}
.highlight .c, .highlight .ch, .highlight .cd, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1, .highlight .cs {
  color: #8b949e;
}
.highlight .gl {
  color: #8b949e;
}
.highlight .gt {
  color: #8b949e;
}
.highlight .ni {
  color: #c9d1d9;
}
.highlight .si {
  color: #c9d1d9;
}
.highlight .ge {
  color: #c9d1d9;
  font-style: italic;
}
.highlight .gs {
  color: #c9d1d9;
  font-weight: bold;
}</style><div data-controller="ruby-ui--clipboard" data-action="click@window->ruby-ui--clipboard#onClickOutside" data-ruby-ui--clipboard-success-value="Copied!" data-ruby-ui--clipboard-error-value="Copy failed!" data-ruby-ui--clipboard-options-value="{}" class="relative"><div><div data-ruby-ui--clipboard-target="source"><div style="tab-size: 2;" class="highlight text-sm max-h-[350px] after:content-none flex font-mono overflow-auto overflow-x rounded-md border !bg-stone-900 [&_pre]:p-4"><div class="after:content-none"><pre><span class="nt">&lt;svg</span> <span class="na">xmlns=</span><span class="s">"http://www.w3.org/2000/svg"</span> <span class="na">class=</span><span class="s">""</span> <span class="na">viewbox=</span><span class="s">"0 0 24 24"</span> <span class="na">fill=</span><span class="s">"none"</span><span class="nt">&gt;</span>
	<span class="nt">&lt;path</span> <span class="na">d=</span><span class="s">"M19.75 12.3347H20.5H20.5H19.75ZM5.81729 15.4792L6.43779 15.0579L6.43779 15.0579L5.81729 15.4792ZM6.3809 16.3093L5.7604 16.7306L5.7604 16.7306L6.3809 16.3093ZM6.2843 8.87473L5.76704 8.33164C5.75364 8.3444 5.74071 8.35766 5.72829 8.37138L6.2843 8.87473ZM8.24493 8.04309C8.54487 7.75741 8.55643 7.28268 8.27076 6.98274C7.98508 6.6828 7.51035 6.67124 7.21041 6.95691L8.24493 8.04309ZM4.25519 12.4372L5.00387 12.3927L4.25519 12.4372ZM4.30904 11.6756L3.57406 11.5262L4.30904 11.6756ZM19.4583 16.168L20.1639 16.4223L19.4583 16.168ZM16.3566 19.2136L16.1104 18.5051L16.3566 19.2136ZM10.197 19.3872L10.3527 18.6535H10.3527L10.197 19.3872ZM7.72767 18.0896L8.24483 17.5464L7.72767 18.0896ZM7 12C7 12.4142 7.33579 12.75 7.75 12.75C8.16421 12.75 8.5 12.4142 8.5 12H7ZM13 8.87473C13 9.28894 13.3358 9.62473 13.75 9.62473C14.1642 9.62473 14.5 9.28894 14.5 8.87473H13ZM16 9.5C16 9.91421 16.3358 10.25 16.75 10.25C17.1642 10.25 17.5 9.91421 17.5 9.5H16ZM19.75 8H19V8L19.75 8ZM10 8.5C10 8.91421 10.3358 9.25 10.75 9.25C11.1642 9.25 11.5 8.91421 11.5 8.5H10ZM5.19679 15.9005L5.7604 16.7306L7.0014 15.888L6.43779 15.0579L5.19679 15.9005ZM6.80156 9.41781L8.24493 8.04309L7.21041 6.95691L5.76704 8.33164L6.80156 9.41781ZM6.43779 15.0579C5.92498 14.3026 5.57104 13.7799 5.33415 13.346C5.10404 12.9245 5.01895 12.6465 5.00387 12.3927L3.50651 12.4817C3.53969 13.0402 3.73104 13.54 4.01761 14.0648C4.2974 14.5773 4.70038 15.1693 5.19679 15.9005L6.43779 15.0579ZM5.72829 8.37138C5.13366 9.02823 4.65143 9.55972 4.30239 10.029C3.94502 10.5095 3.68545 10.978 3.57406 11.5262L5.04403 11.8249C5.09477 11.5751 5.21846 11.3108 5.50599 10.9242C5.80186 10.5264 6.22619 10.0564 6.84031 9.37807L5.72829 8.37138ZM5.00387 12.3927C4.99257 12.2026 5.00605 12.0118 5.04403 11.8249L3.57406 11.5262C3.5102 11.8405 3.48749 12.1616 3.50651 12.4817L5.00387 12.3927ZM19 12.3347C19 14.4151 18.9888 15.2586 18.7527 15.9137L20.1639 16.4223C20.5112 15.4586 20.5 14.2862 20.5 12.3347H19ZM12.4527 20.25C14.4432 20.25 15.6287 20.2605 16.6027 19.922L16.1104 18.5051C15.4358 18.7395 14.5682 18.75 12.4527 18.75V20.25ZM18.7527 15.9137C18.318 17.1201 17.3492 18.0747 16.1104 18.5051L16.6027 19.922C18.2621 19.3455 19.5731 18.0616 20.1639 16.4223L18.7527 15.9137ZM12.4527 18.75C11.2705 18.75 10.7891 18.7461 10.3527 18.6535L10.0414 20.1209C10.6681 20.2539 11.3361 20.25 12.4527 20.25V18.75ZM5.7604 16.7306C6.37929 17.6421 6.74816 18.1926 7.21051 18.6328L8.24483 17.5464C7.92629 17.2431 7.6576 16.8545 7.0014 15.888L5.7604 16.7306ZM10.3527 18.6535C9.55688 18.4847 8.82685 18.1005 8.24483 17.5464L7.21051 18.6328C7.99531 19.38 8.97624 19.8949 10.0414 20.1209L10.3527 18.6535ZM8.5 12V6.5H7V12H8.5ZM9.25 5.75C9.66421 5.75 10 6.08579 10 6.5H11.5C11.5 5.25736 10.4926 4.25 9.25 4.25V5.75ZM8.5 6.5C8.5 6.08579 8.83579 5.75 9.25 5.75V4.25C8.00736 4.25 7 5.25736 7 6.5H8.5ZM13 7V8.87473H14.5V7H13ZM16 7V8H17.5V7H16ZM16 8V9.5H17.5V8H16ZM15.25 6.25C15.6642 6.25 16 6.58579 16 7H17.5C17.5 5.75736 16.4926 4.75 15.25 4.75V6.25ZM14.5 7C14.5 6.58579 14.8358 6.25 15.25 6.25V4.75C14.0074 4.75 13 5.75736 13 7H14.5ZM18.25 7.25C18.6642 7.25 19 7.58579 19 8H20.5C20.5 6.75736 19.4926 5.75 18.25 5.75V7.25ZM17.5 8C17.5 7.58579 17.8358 7.25 18.25 7.25V5.75C17.0074 5.75 16 6.75736 16 8H17.5ZM10 6.5V8.5H11.5V6.5H10ZM13 6V7H14.5V6H13ZM10 6V6.5H11.5V6H10ZM12.25 5.25C12.6642 5.25 13 5.58579 13 6H14.5C14.5 4.75736 13.4926 3.75 12.25 3.75V5.25ZM12.25 3.75C11.0074 3.75 10 4.75736 10 6H11.5C11.5 5.58579 11.8358 5.25 12.25 5.25V3.75ZM19 8L19 12.3347H20.5V8L19 8Z"</span> <span class="na">fill=</span><span class="s">"#141B34"</span><span class="nt">&gt;&lt;/path&gt;</span>
<span class="nt">&lt;/svg&gt;</span>
</pre></div></div></div><div class="absolute top-2 right-2"><div data-ruby-ui--clipboard-target="trigger" data-action="click->ruby-ui--clipboard#copy"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 h-6 w-6 text-white hover:text-white hover:bg-white/20"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4 h-4"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></button></div></div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="successPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copied!</div></div><div class="hidden" style="width: max-content; position: absolute; top: 0; left: 0;" data-ruby-ui--clipboard-target="errorPopover"><div data-state="open" class="z-50 rounded-md text-sm border bg-background px-2 py-0.5 text-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2">Copy failed!</div></div></div></div></div></div></div><div class="flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 gap-y-2 sm:gap-y-0"><button type="button" class="whitespace-nowrap inline-flex items-center justify-center rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground px-4 py-2 h-9 text-sm w-full" data-action="click->ruby-ui--sheet-content#close">Close</button></div><button type="button" class="absolute end-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground" data-action="click->ruby-ui--sheet-content#close"><svg width="15" height="15" viewbox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-4 w-4"><path d="M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg><span class="sr-only">Close</span></button></div></div></template></div></template></turbo-stream>