Access Record Editor
Typical tag name: ar-editor
Exported class: AREditor
Inheritance: AREditor <-- SKUIBase <-- (imm-dom stack)
UI for editing access records for the current workspace determined by ZSession. It will load the Access Record supplied in the ar attribute via AREditorModel and MsgFabric API. It will also react to the ar attribute changing from the outside.
View only mode (ui==view_only) disables all controls.
See utils.jsy for icons, labels, and valid access record kinds.
External Requirements
- Open Props
- Font Awesome 6
- Shoelace WCs
Required Assets
- imm-dom, i18n
- sk.css
WC Dependencies
- AREditorMain
- AREditorBtn
- AREditorInfo
- AREditorInfoForm
- AREditorTools
- AREditorModel
- AREditorItem
API
Attributes
| Attribute | Default | Enumerators | Usage |
|---|---|---|---|
| ui | full |
full, view_only, button |
Determines UI mode (either full editor or button which opens it in a modal). |
| ar | null |
N/A | HK1 for the Access Record to edit. |
| tag | ar-editor-item |
N/A | Tag used for rendering each Access Record. |
| is-circle | false |
Boolean | Presence attribute: when ui==button then render button as a circle with icon. |
| btn-label | Edit Access Record |
N/A | When ui==button then use this attribute as the label text. |
| btn-icon | fas fa-gear |
N/A | When ui==button then use this attribute as the button icon (prefixed when there is a label). |
| save-btn-text | 'Save Access Record' | N/A | Text for save button. |
Properties
| Property | Type | Default | Usage |
|---|---|---|---|
| AREditorModel.ar_ctx | <Access Record> |
null |
This is the data loaded by the editor (m$_viz when attribute view_only==true else m$_mut). |
Events
| Event | Detail | Usage |
|---|---|---|
ar-editor-saved |
map( ar -> updated_record ) |
Emitted when saving were complete (no error). |
Methods
| Method | Arguments | Usage |
|---|---|---|
| (None.) |
Slots
| Slot | Usage |
|---|---|
| (None.) |
CSS Parts
| Part | Usage |
|---|---|
| (None.) |
Example
<link rel="stylesheet" type="text/css" href="/css/sk-root.css">
<script type=module src='/cdn/@encipher-sk/ivcore/esm/auto.js'></script>
<script type=module src='/cdn/@encipher-sk/ivcore/esm/wc/ar_editor.js'></script>
<div class='example'>
<ivc-i18n></ivc-i18n>
<ivc-zs workspace></ivc-zs>
<ar-editor></ar-editor>
</div>