How to use the @fluentui/accessibility.FocusZoneMode.Embed function in @fluentui/accessibility

To help you get started, we’ve selected a few @fluentui/accessibility examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github microsoft / fluent-ui-react / packages / react / src / utils / renderComponent.tsx View on Github external
const renderWithFocusZone = <p>(
  render: RenderComponentCallback</p><p>,
  focusZoneDefinition: FocusZoneDefinition,
  config: RenderResultConfig</p><p>,
): any =&gt; {
  if (focusZoneDefinition.mode === FocusZoneMode.Wrap) {
    return wrapInGenericFocusZone(
      FocusZone,
      {
        ...focusZoneDefinition.props,
        isRtl: config.rtl,
      },
      render(config),
    )
  }
  if (focusZoneDefinition.mode === FocusZoneMode.Embed) {
    const originalElementType = config.ElementType
    config.ElementType = FocusZone as any
    config.unhandledProps = { ...config.unhandledProps, ...focusZoneDefinition.props }
    config.unhandledProps.as = originalElementType
    config.unhandledProps.isRtl = config.rtl
  }
  return render(config)
}
</p>

@fluentui/accessibility

A set of reusable framework accessibility behaviours.

MIT
Latest version published 1 year ago

Package Health Score

76 / 100
Full package analysis

Similar packages