UBERF-5603 (#4754)

Signed-off-by: Denis Bykhov <bykhov.denis@gmail.com>

packages/presentation/src/components/AttributeEditor.svelte

@@ -48,8 +48,10 @@
     }
   }
 
+  $: isReadonly = (attribute.readonly ?? false) || !editable
+
   function onChange (value: any): void {
-    if (!editable) return
+    if (isReadonly) return
     const doc = object as Doc
     void updateAttribute(client, doc, _class, { key: attributeKey, attr: attribute }, value)
   }
@@ -64,6 +66,9 @@
       label={attribute?.label}
       placeholder={attribute?.label}
       type={attribute?.type}
+      readonly={isReadonly}
+      editable={!isReadonly}
+      disabled={isReadonly}
       {maxWidth}
       {attributeKey}
       value={getAttribute(client, object, { key: attributeKey, attr: attribute })}

packages/presentation/src/components/DraggableList.svelte

@@ -98,7 +98,7 @@
         class:is-dragged-over-down={draggingIndex !== null && index > draggingIndex && index === hoveringIndex}
         class:drag-over-highlight={index === dragOverIndex}
         draggable={editable}
-        on:contextmenu|preventDefault={(ev) => checkIsNotDraft(object) && showContextMenu?.(ev, object)}
+        on:contextmenu={(ev) => checkIsNotDraft(object) && showContextMenu?.(ev, object)}
         on:dragstart={(ev) => {
           handleDragStart(ev, index)
         }}

packages/presentation/src/components/NavLink.svelte

@@ -59,6 +59,7 @@
   <!-- svelte-ignore a11y-no-static-element-interactions -->
   <span
     class:cursor-pointer={!disabled}
+    class:cursor-default={disabled}
     class:noUnderline={noUnderline || disabled}
     class:noOverflow
     class:inline

packages/presentation/src/components/breadcrumbs/Breadcrumbs.svelte

@@ -20,6 +20,7 @@
   import { hasComponent } from './utils'
 
   export let models: readonly BreadcrumbsModel[]
+  export let disabled: boolean = false
 
   $: trimmed = models.length > 3
   $: narrowModel = trimmed ? [models[0], models[models.length - 1]] : models
@@ -51,7 +52,7 @@
     </div>
   {:else}
     {@const { title, href, onClick } = model}
-    <NavLink {href} noUnderline {onClick}>
+    <NavLink {href} noUnderline {onClick} {disabled}>
       <div class="title">{title}</div>
     </NavLink>
   {/if}