Components
Client Only
Installation
pnpm dlx @docyrus/cli add @docyrus/ui-record-sharingUI Primitives(10 components)
npx shadcn@latest add avatar badge button command popover scroll-area select separator skeleton tooltipUsage
import {
RecordSharingButton
} from "@docyrus/ui/components/record-sharing";
import type {
RecordSharingButtonProps,
RecordSharingPanelProps,
RecordSharingItemProps,
SharedEntity,
SharingSearchResult,
SharingResourceType,
SharingPermissionValue,
SharingPermissionPresetValue,
PermissionPresetOption
} from "@docyrus/ui/components/record-sharing";
<RecordSharingButton />API Reference
| Component | Prop | Type | Default |
|---|---|---|---|
RecordSharing | className | string | — |
Components
| Component | Description |
|---|---|
RecordSharingButton | Public export |
RecordSharingItem | Internal — record-sharing-item.tsx |
RecordSharingPanel | Internal — record-sharing-panel.tsx |
Type Exports
| Type | Description |
|---|---|
RecordSharingButtonProps | — |
RecordSharingPanelProps | — |
RecordSharingItemProps | — |
SharedEntity | — |
SharingSearchResult | — |
SharingResourceType | — |
SharingPermissionValue | — |
SharingPermissionPresetValue | — |
PermissionPresetOption | — |
Type Reference
RecordSharingButtonProps
| Field | Type | Description |
|---|---|---|
ref | Ref<HTMLDivElement> | — |
variant | 'button' | 'avatar-group' | — |
maxAvatars | number | — |
size | 'sm' | 'default' | 'lg' | — |
align | 'start' | 'center' | 'end' | — |
side | 'top' | 'right' | 'bottom' | 'left' | — |
open | boolean | — |
onOpenChange | (open: boolean) => void | — |
disabled | boolean | — |
triggerClassName | string | — |
RecordSharingPanelProps
| Field | Type | Description |
|---|---|---|
sharedEntities | SharedEntity[] | — |
resources | SharingResourceType[] | — |
permissionPresets | PermissionPresetOption[] | — |
defaultPermission | number | — |
onSearch | (query: string) => Promise<SharingSearchResult[]> | SharingSearchResult[] | — |
onAdd | (entities: Array<{ id: string; type: SharingResourceType; permission: number }>) => void | Promise<void> | — |
onPermissionChange | (entityId: string, permission: number) => void | Promise<void> | — |
onRemove | (entityId: string) => void | Promise<void> | — |
isLoading | boolean | — |
isSearching | boolean | — |
isAddPending | boolean | — |
pendingPermissionChanges | Record<string, boolean> | — |
pendingRemovals | Record<string, boolean> | — |
title | string | — |
maxHeight | number | string | — |
className | string | — |
RecordSharingItemProps
| Field | Type | Description |
|---|---|---|
entity | SharedEntity | — |
permissionPresets | PermissionPresetOption[] | — |
onPermissionChange | (entityId: string, permission: number) => void | Promise<void> | — |
onRemove | (entityId: string) => void | Promise<void> | — |
isPermissionChangePending | boolean | — |
isRemovePending | boolean | — |
SharedEntity
| Field | Type | Description |
|---|---|---|
id | string | — |
name | string | — |
description | string | — |
type | SharingResourceType | — |
avatarUrl | string | null | — |
initials | string | — |
permission | number | — |
SharingSearchResult
| Field | Type | Description |
|---|---|---|
id | string | — |
name | string | — |
description | string | — |
type | SharingResourceType | — |
avatarUrl | string | null | — |
initials | string | — |
SharingResourceType
"user" | "team" | "role" | "tenant" | "public"
PermissionPresetOption
| Field | Type | Description |
|---|---|---|
label | string | — |
value | number | — |
description | string | — |