### Ricos Viewer Props

#### <span style="font-weight: 700;" class="rounded-lg border-[1px] border-blue-300 font-mono border-none bg-blue-100 px-2 py-1 leading-[18px] tracking-[0.0175em] font-bold text-slate-900">RicosViewerProps</span>

<code class="font-mono text-sm"><span class="text-blue-700">interface</span> RicosViewerProps</code>

<dl class="pl-4 border-l-2 border-slate-200">
<dt><code><strong>children</strong><span class="text-slate-400">?</span>: React.ReactElement</code></dt>
<dd><p>Optional child element to render inside the viewer.</p></dd>
<dt><code><strong>plugins</strong><span class="text-slate-400">?</span>: (ViewerPlugin | any)[]</code></dt>
<dd><p>Array of viewer plugins to enable. Each plugin adds rendering capabilities for specific content types.</p></dd>
<dt><code><strong>seoSettings</strong><span class="text-slate-400">?</span>: boolean | any</code></dt>
<dd><p>SEO settings for server-side rendering. When `true`, enables default SEO mode.</p></dd>
<dt><code><strong>textSelectionToolbar</strong><span class="text-slate-400">?</span>: boolean</code></dt>
<dd><p>When `true`, shows a floating toolbar when the user selects text in the viewer.</p></dd>
<dt><code><strong>content</strong><span class="text-slate-400">?</span>: <a href="/api-docs/related-types#ricosdocument"><span class="font-mono">RicosDocument</span></a></code></dt>
<dd><p>The rich content to display. Required for the viewer to render anything.</p></dd>
<dt><code><strong>addAnchors</strong><span class="text-slate-400">?</span>: boolean | string</code></dt>
<dd><p>When `true`, adds anchor elements to content blocks for deep linking. Pass a string to use as a prefix for generated anchor IDs.</p></dd>
<dt><code><strong>onNodeClick</strong><span class="text-slate-400">?</span>: ({ node }: {         node: any;     }) =&gt; void</code></dt>
<dd><p>Callback fired when a user clicks on a content node in the viewer.</p></dd>
<dt><code><strong>jsdomMode</strong><span class="text-slate-400">?</span>: boolean</code></dt>
<dd><p>When `true`, renders in jsdom-compatible mode for server-side rendering environments.</p></dd>
<dt><code><strong>isPrint</strong><span class="text-slate-400">?</span>: boolean</code></dt>
<dd><p>When `true`, renders in print-optimized mode (e.g., for `window.print()`).</p></dd>
<dt><code><strong>isMobile</strong><span class="text-slate-400">?</span>: boolean</code></dt>
<dd><p>When `true`, renders in mobile-optimized mode.</p></dd>
<dt><code><strong>generalLinkSettings</strong><span class="text-slate-400">?</span>: <a href="/api-docs/related-types#generallinksettings"><span class="font-mono">GeneralLinkSettings</span></a></code></dt>
<dd><p>Link settings applied globally to all linkable plugins.</p></dd>
<dt><code><strong>locale</strong><span class="text-slate-400">?</span>: string</code></dt>
<dd><p>Two-letter locale code (e.g., `'en'`, `'he'`). Determines the language and text direction of modals and settings.</p></dd>
<dt><code><strong>localeContent</strong><span class="text-slate-400">?</span>: string</code></dt>
<dd><p>Locale for content, when different from UI locale. If not defined, `locale` is used.</p></dd>
<dt><code><strong>onError</strong><span class="text-slate-400">?</span>: (error: string) =&gt; void</code></dt>
<dd><p>Callback fired when an error occurs in a Ricos component.</p></dd>
<dt><code><strong>theme</strong><span class="text-slate-400">?</span>: <a href="/api-docs/theming#ricostheme"><span class="font-mono">RicosTheme</span></a></code></dt>
<dd><p>Theme configuration for colors, fonts, and custom styles.</p></dd>
<dt><code><strong>textAlignment</strong><span class="text-slate-400">?</span>: <a href="/api-docs/related-types#textalignment"><span class="font-mono">TextAlignment</span></a></code></dt>
<dd><p>Default text alignment direction.</p></dd>
<dt><code><strong>onAtomicBlockFocus</strong><span class="text-slate-400">?</span>: <a href="/api-docs/related-types#onatomicblockfocus"><span class="font-mono">onAtomicBlockFocus</span></a></code></dt>
<dd><p>Callback fired when an atomic block (plugin) receives focus.</p></dd>
<dt><code><strong>iframeSandboxDomain</strong><span class="text-slate-400">?</span>: string</code></dt>
<dd><p>Domain used to render UGC source code in an isolated sandboxed iframe.</p></dd>
<dt><code><strong>textWrap</strong><span class="text-slate-400">?</span>: boolean</code></dt>
<dd><p>When `true`, wraps text around left/right-aligned plugins.</p></dd>
<dt><code><strong>debugMode</strong><span class="text-slate-400">?</span>: <a href="/api-docs/related-types#debugmode"><span class="font-mono">DebugMode</span></a>[]</code></dt>
<dd><p>Debug mode flags for enabling development-time diagnostics.</p></dd>
<dt><code><strong>environment</strong><span class="text-slate-400">?</span>: <a href="/api-docs/related-types#environment"><span class="font-mono">Environment</span></a></code></dt>
<dd><p>Theme variant to apply: - `'businessManager'`: BM theme is applied and cannot be overridden. - `'liveSite'`: liveSite theme is applied and can be overridden via `theme`.   'liveSite'</p></dd>
<dt><code><strong>baseUrl</strong><span class="text-slate-400">?</span>: string</code></dt>
<dd><p>Base URL of the site, used to resolve page-relative URLs. Must be provided explicitly. If missing, page links will render as relative paths without the site domain.</p></dd>
<dt><code><strong>biSettings</strong><span class="text-slate-400">?</span>: <a href="/api-docs/related-types#bisettings"><span class="font-mono">BISettings</span></a></code></dt>
<dd><p>Business intelligence configuration for analytics and tracking.</p></dd>
<dt><code><strong>wixClient</strong><span class="text-slate-400">?</span>: WixClient</code></dt>
<dd><p>Authenticated `WixClient` from `@wix/sdk`. When provided, takes priority over `instance` for authorizing every request the viewer makes. Use this in headless apps where you own the React tree.</p></dd>
<dt><code><strong>instance</strong><span class="text-slate-400">?</span>: string</code></dt>
<dd><p>Per-session Wix instance token. Used when no `wixClient` is provided — Ricos builds an internal client from it.</p></dd>
<dt><code><strong>msid</strong><span class="text-slate-400">?</span>: string</code></dt>
<dd><p>Metasite ID. Scopes storage and CDN traffic to the owning site when no `wixClient` is given.</p></dd>
<dt><code><strong>shouldNormalizeRichContent</strong><span class="text-slate-400">?</span>: boolean</code></dt>
<dd><p>When `true`, normalises rich content via `normalizeRicosDocument` before rendering. Set to `false` to skip normalisation when content is already known to be valid.   true</p></dd>
<dt><code><strong>mediaSettings</strong><span class="text-slate-400">?</span>: MediaSettings</code></dt>
<dd><p>Media-upload, capture, and resolution settings shared across media plugins.</p></dd>
<dt style="opacity: 0.5;"><code><strong>linkSettings</strong><span class="text-slate-400">?</span>: <a href="/api-docs/related-types#linksettings"><span class="font-mono">LinkSettings</span></a></code></dt>
<dd><p><em>Deprecated.</em> Use `generalLinkSettings` instead.</p></dd>
<dt style="opacity: 0.5;"><code><strong>experiments</strong><span class="text-slate-400">?</span>: AvailableExperiments</code></dt>
<dd><p><em>Deprecated.</em> Not used at runtime.</p></dd>
</dl>

#### `seoSettings`

```jsx
seoSettings?: boolean | {
  paywall: {
    className: string;
    index: number;
  };
}
```

When given a truthy value, renders RicosViewer in a SEO optimized mode.
An object allows extended configuration.

##### `paywall`

className - Content blocked by a payall will be marked up using this string (This class will be used by Googlebot to discern between paid and free content on a page level)
index - number of free content blocks

#### `addAnchors`

TODO

#### `textSelectionToolbar`

When given a truthy value, text-selection-toolbar appears inline when selecting some text and allows tweet text.

Select some text below to see text-selection-toolbar

```tsx widget
import '@wix/ricos/css/all-plugins-viewer.css';
import { quickStartViewerPlugins, RicosViewer } from '@wix/ricos';
import React from 'react';

export default () => {
  return (
    // @essential-start
    <div style={{ position: 'relative' }}>
      <RicosViewer textSelectionToolbar plugins={quickStartViewerPlugins()} content={demoContent} />{' '}
    </div>
    // @essential-end
  );
};
```
