All skills
raintree-technology avatar

/hig-components-search

@71d5f4e

Apple HIG guidance for navigation-related components including search fields, page controls, and path controls. Use this skill when the user says "how should search work in my app," "I need a breadcrumb," "how do I paginate content," or asks about search field, search bar, page control, path control, breadcrumb, navigation component, search UX, search suggestions, search scopes, paginated content navigation, or file path hierarchy display. Cross-references: hig-components-menus, hig-components-controls, hig-components-dialogs, hig-patterns.

Use this Skill: https://skilld.dev/gh/raintree-technology/hig-doctor/hig-components-search

This session only. Nothing lands on disk.

referencessearch-fields.md

≈944 tokens on demand. Your agent reads this file only when SKILL.md points to it.

<!-- hig-doctor:attribution -->

Source: Apple Inc. Canonical content at https://developer.apple.com/design/human-interface-guidelines/search-fields. This file is a structured index of that content, snapshot 2025-02-02. Apple HIG text and imagery are © Apple Inc.; this repository provides organization and cross-referencing for AI agent consumption only.

Search fields

Best practices

Display placeholder text that describes the type of information people can search for.

If possible, start search immediately when a person types.

Consider showing suggested search terms before search begins, or as a person types.

Simplify search results.

Consider letting people filter search results.

Scope controls and tokens

  • A scope control acts like a segmented control for choosing a category for the search.

  • A token is a visual representation of a search term that someone can select and edit, and acts as a filter for any additional terms in the search.

Use a scope control to filter among clearly defined search categories.

Default to a broader scope and let people refine it as they need.

Use tokens to filter by common search terms or items.

Consider pairing tokens with search suggestions.

Platform considerations

iOS

  • In a tab bar at the bottom of the screen

  • In a toolbar at the bottom or top of the screen

  • Directly inline with content

Search in a tab bar

Start with the search field focused to help people quickly find what they need.

Start with the search field unfocused to promote discovery and exploration.

Search in a toolbar
  • You can include search in a bottom toolbar either as an expanded field or as a toolbar button, depending on how much space is available and how important search is to your app. When someone taps it, it animates into a search field above the keyboard so they can begin typing.

  • You can include search in a top toolbar, also called a navigation bar, where it appears as a toolbar button. When someone taps it, it animates into a search field that appears either above the keyboard or inline at the top if there isn’t space at the bottom.

Place search at the bottom if there’s room.

Place search at the top when itʼs important to defer to content at the bottom of the screen, or thereʼs no bottom toolbar.

Search as an inline field

Place search as an inline field when its position alongside the content it searches strengthens that relationship.

Prefer placing search at the bottom.

When at the top, position an inline search field above the list it searches, and pin it to the top toolbar when scrolling.

iPadOS, macOS

Put a search field at the trailing side of the toolbar for many common uses.

Include search at the top of the sidebar when filtering content or navigation there.

Include search as an item in the sidebar or tab bar when you want an area dedicated to discovery.

In a search field in a dedicated area, consider immediately focusing the field when a person navigates to the section to help people search faster and locate the field itself more easily.

Account for window resizing with the placement of the search field.

tvOS

Provide suggestions to make searching easier.


<!-- hig-doctor:canonical-footer -->

For the complete guidance, including worked examples and illustrations, see the canonical page: https://developer.apple.com/design/human-interface-guidelines/search-fields

Source: SKILL.md on GitHub

No alerts17d5 checks · Risk SAFE
  • Gen Agent Trust Hub17d

    The skill is safe and consists entirely of markdown documentation references regarding the Apple Human Interface Guidelines (HIG) for navigation components. No active code, scripts, or network interactions are present.

  • Socket17d

    No alerts

  • Snyk17d

    Risk: LOW · No issues

  • Runlayer7mo

    4 files scanned · No issues

  • ZeroLeaks5mo

    Score: 93/100 · 2 sections analyzed

Signed by skilld at 71d5f4e. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub 4 weeks ago.

Activeupdated 8 months ago
version
1.0.0

README badge

README badge for raintree-technology/hig-doctor/hig-components-search