Components
Client Only
Installation
pnpm dlx @docyrus/cli add @docyrus/ui-enum-option-editorRequired Packages(1 package)
pnpm add @tanstack/react-queryUI Primitives(11 components)
npx shadcn@latest add alert badge button dialog input label popover scroll-area separator sortable switchUsage
import {
EnumOptionEditor,
EnumOptionEditorDialog
} from "@docyrus/ui/components/enum-option-editor";
import type {
EnumEditorOption,
EnumOptionOrigin,
EnumOptionInput,
EnumOptionEditorProps,
EnumOptionEditorDialogProps,
DocyrusEnumOptionEditorProps,
UseDocyrusEnumEditorPermissionOptions
} from "@docyrus/ui/components/enum-option-editor";
<EnumOptionEditor
value={...}
disabled
onChange={() => {}}
/>API Reference
| Prop | Type | Default |
|---|---|---|
value | string | undefined | — |
disabled | boolean | — |
onChange | (value: string | undefined) => void | — |
className | string | — |
Components
| Component | Description |
|---|---|
EnumOptionEditor | Public export |
EnumOptionEditorDialog | Public export |
ADMIN | Internal — docyrus-enum-option-editor.tsx |
ARCHITECT | Internal — docyrus-enum-option-editor.tsx |
DocyrusEnumOptionEditor | Internal — docyrus-enum-option-editor.tsx |
Type Exports
| Type | Description |
|---|---|
EnumEditorOption | — |
EnumOptionOrigin | — |
EnumOptionInput | — |
EnumOptionEditorProps | — |
EnumOptionEditorDialogProps | — |
DocyrusEnumOptionEditorProps | — |
UseDocyrusEnumEditorPermissionOptions | — |
Type Reference
EnumEditorOption
| Field | Type | Description |
|---|---|---|
origin | EnumOptionOrigin | — |
isCustomized | boolean | — |
EnumOptionOrigin
"custom" | "inherited"
EnumOptionInput
| Field | Type | Description |
|---|---|---|
name | string | — |
slug | string | — |
color | string | — |
icon | string | — |
description | string | — |
active | boolean | — |
parent | string | — |
EnumOptionEditorProps
| Field | Type | Description |
|---|---|---|
options | EnumEditorOption[] | — |
onCreateOption | (input: EnumOptionInput) => Promise<EnumEditorOption> | EnumEditorOption | — |
onUpdateOption | (id: string, patch: Partial<EnumOptionInput>) => Promise<void> | void | — |
onDeleteOption | (id: string) => Promise<void> | void | — |
onRevertOption | (id: string) => Promise<void> | void | — |
onReorder | (orderedIds: string[]) => Promise<void> | void | — |
readOnly | boolean | — |
allowCreate | boolean | — |
allowDelete | boolean | — |
allowReorder | boolean | — |
noticeText | string | — |
emptyText | string | — |
className | string | — |
EnumOptionEditorDialogProps
| Field | Type | Description |
|---|---|---|
trigger | ReactNode | — |
open | boolean | — |
onOpenChange | (open: boolean) => void | — |
title | string | — |
description | string | — |
disabled | boolean | — |
DocyrusEnumOptionEditorProps
| Field | Type | Description |
|---|---|---|
client | RestApiClient | — |
appId | string | — |
dataSourceId | string | — |
fieldId | string | — |
fieldName | string | — |
trigger | ReactNode | — |
open | boolean | — |
onOpenChange | (open: boolean) => void | — |
onChanged | () => void | — |
disabled | boolean | — |
title | string | — |
UseDocyrusEnumEditorPermissionOptions
| Field | Type | Description |
|---|---|---|
enabled | boolean | — |
adminRoleIds | Array<string> | — |
meEndpoint | string | — |