UI kit reference

components/Restricted

import { … } from 'zidane-ui'ui/src/components/Restricted.tsx

Components#

Renders children dimmed and inert, with reason as a tooltip, while restricted; else as they are.

TypeScript

function Restricted(props: RestrictedProps): Element

Parameters
Name	Type	Description
props	`RestrictedProps`	`RestrictedProps`.

Element

Restricted props
Name	Type	Description
children	`ReactNode`	What it wraps.
className?	`string`	Classes merged on the root while restricted.
inline?	`boolean`	Wrap inline content (a button in a row) instead of a block (a section).
reason	`string`	Why, short: the tooltip and the group's accessible name ("Admin only").
restricted	`boolean`	Whether this connection may not change what it wraps.
style?	`CSSProperties`	Inline styles on the root while restricted.

TypeScript

interface RestrictedProps

RestrictedProps properties
Name	Type	Description
children	`ReactNode`	What it wraps.
className?	`string`	Classes merged on the root while restricted.
inline?	`boolean`	Wrap inline content (a button in a row) instead of a block (a section).
reason	`string`	Why, short: the tooltip and the group's accessible name ("Admin only").
restricted	`boolean`	Whether this connection may not change what it wraps.
style?	`CSSProperties`	Inline styles on the root while restricted.