ilokesto

OptionalWrapper

OptionalWrapper conditionally wraps children. When when is truthy, it returns wrapper(children). Otherwise it returns fallback(children) or the original children.

import { OptionalWrapper } from '@ilokesto/utilinent';

<OptionalWrapper
  when={href}
  wrapper={(children) => <a href={href}>{children}</a>}
>
  Read more
</OptionalWrapper>

Use it when the content should stay the same but its container changes, such as optional links, tooltips, feature-flag wrappers, or tracking wrappers.

With fallback transformer

<OptionalWrapper
  when={enabled}
  wrapper={(children) => <FeatureShell>{children}</FeatureShell>}
  fallback={(children) => <DisabledShell>{children}</DisabledShell>}
>
  <FeatureContent />
</OptionalWrapper>

On this page