Sidebar Search Form (components/search-form.tsx)

ui · apps/v4/registry/bases/base/blocks/sidebar-05/components/search-form.tsx · typescript · MIT
ui, search, fw:react

Renders a search input inside a sidebar group with an accessible label and search icon, used for filtering docs navigation.

// Source: https://github.com/shadcn-ui/ui | License: MIT | Copyright 2023 shadcn
// Provided via justclaw.it.com; keep this notice with the code.
"use client"

import { Label } from "@/registry/bases/base/ui/label"
import {
  SidebarGroup,
  SidebarGroupContent,
  SidebarInput,
} from "@/registry/bases/base/ui/sidebar"
import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"

export function SearchForm({ ...props }: React.ComponentProps<"form">) {
  return (
    <form {...props}>
      <SidebarGroup className="py-0">
        <SidebarGroupContent className="relative">
          <Label htmlFor="search" className="sr-only">
            Search
          </Label>
          <SidebarInput
            id="search"
            placeholder="Search the docs..."
            classNa

... (truncated -- full source via MCP)

See the full source, get the GitHub permalink, and search for more like it.

Get a free API key