Skip to content

DataSearch Focus Indicator bounding box is cut off #6671

@JCoder121

Description

@JCoder121

The DataSearch component's focus indicator highlight when interacting with the keyboard is cut off. The focus only appears around the 4 corners in dark mode, not all the way around the box.
image

In light mode, on both the Design Site and Storybook, there is no focus indicator around DataSearch at all, instead showing just a cursor position when interacting with keyboard.

image

See https://design-system.hpe.design/templates/datatable-customization (first Datatable example) or any Data examples on https://storybook.grommet.io/?path=/story/data-data-cards--example to replicate the cut-off focus indicator around DataSearch behavior in light/dark mode.

URL, screen shot, or Codepen exhibiting the issue

Steps to Reproduce

Your Environment

  • Grommet version:
  • Browser Name and version:
  • Operating System and version (desktop or mobile):

Metadata

Metadata

Labels

bugissue that does not match design or documentation and requires code changes to address

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions