Merge branch 'master' of https://github.com/p3ol/oak

p3ol · Oct 22, 2024 · 767e870 · 767e870
2 parents c29eeff + 7991286
commit 767e870
Show file tree

Hide file tree

Showing 6 changed files with 36 additions and 23 deletions.
diff --git a/packages/react/lib/Container/index.tsx b/packages/react/lib/Container/index.tsx
@@ -17,12 +17,14 @@ export declare interface ContainerProps
   content?: Array<ElementObject>;
   component?: ComponentObject | Component;
   depth?: number;
+  droppable?: boolean;
 }
 
 const Container = ({
   element,
   component,
   className,
+  droppable = true,
   content = [],
   depth = 0,
   ...rest
@@ -52,7 +54,9 @@ const Container = ({
     });
   };
 
-  const onDrop = useCallback((data: ElementObject) => {
+  const onDrop = useCallback((
+    data: ElementObject,
+  ) => {
     if (
       component?.disallow?.includes?.(data.type) ||
       override?.disallow?.includes?.(data.type)
@@ -88,7 +92,7 @@ const Container = ({
     <Droppable
       disabled={
         content.length > 0 ||
-        (override?.droppable ?? component?.droppable) === false
+        (override?.droppable ?? droppable) === false
       }
       onDrop={onDrop}
     >

diff --git a/packages/react/lib/Element/index.tsx b/packages/react/lib/Element/index.tsx
@@ -1,7 +1,6 @@
 import type {
   ComponentObject,
   ComponentOverride,
-  ComponentOverrideObject,
   ElementObject,
 } from '@oakjs/core';
 import {
@@ -54,7 +53,7 @@ const Element = forwardRef<ElementRef, ElementProps>(({
   parentComponent,
   className,
   depth = 0,
-}, ref) => {
+}: ElementProps, ref) => {
   const innerRef = useRef<DroppableRef>();
   const editableRef = useRef<EditableRef>();
   const modalRef = useRef<ModalRef>();
@@ -95,7 +94,10 @@ const Element = forwardRef<ElementRef, ElementProps>(({
     builder.duplicateElement(element, { parent });
   };
 
-  const onDrop_ = useCallback((data: any, position: ('before' | 'after')) => {
+  const onDrop_ = useCallback((
+    data: ElementObject,
+    position: 'before' | 'after',
+  ) => {
     if (
       parentComponent?.disallow?.includes?.(data.type) ||
       parentOverride?.disallow?.includes?.(data.type)
@@ -142,7 +144,13 @@ const Element = forwardRef<ElementRef, ElementProps>(({
 
   return (
     <ElementContext.Provider value={getElementContext()}>
-      <Droppable ref={innerRef} onDrop={onDrop_}>
+      <Droppable
+        ref={innerRef}
+        onDrop={onDrop_}
+        disabled={
+          (override?.droppable ?? component?.droppable) === false
+        }
+      >
         <Draggable
           data={element}
           disabled={

diff --git a/packages/react/lib/components/Clickable/index.tsx b/packages/react/lib/components/Clickable/index.tsx
@@ -37,16 +37,16 @@ const Clickable = ({
 
   const onDropElement = useCallback((
     position: 'before' | 'after',
-    sibling: ElementObject
+    data: ElementObject,
   ) => {
     if (
-      parentComponent?.disallow?.includes?.(sibling.type) ||
-      parentOverride?.disallow?.includes?.(sibling.type)
+      parentComponent?.disallow?.includes?.(data.type) ||
+      parentOverride?.disallow?.includes?.(data.type)
     ) {
       return;
     }
 
-    builder.moveElement(sibling, element, { parent, position });
+    builder.moveElement?.(data, element, { parent, position });
   }, [
     builder, element, parent, component, override, parentComponent,
     parentOverride,

diff --git a/packages/react/lib/components/Col/index.tsx b/packages/react/lib/components/Col/index.tsx
@@ -89,7 +89,9 @@ const Col = ({
     });
   };
 
-  const onDrop_ = useCallback((data: ComponentObject) => {
+  const onDrop_ = useCallback((
+    data: ElementObject,
+  ) => {
     if (
       component?.disallow?.includes?.(data.type) ||
       override?.disallow?.includes?.(data.type)
@@ -159,8 +161,8 @@ const Col = ({
           (
             override?.droppable ??
             component?.droppable ??
-            parentComponent?.droppable ??
-            parentOverride?.droppable
+            parentOverride?.droppable ??
+            parentComponent?.droppable
           ) === false
         }
         onDrop={onDrop_}

diff --git a/packages/react/lib/components/Foldable/index.tsx b/packages/react/lib/components/Foldable/index.tsx
@@ -37,16 +37,16 @@ const Foldable = ({
 
   const onDropElement = useCallback((
     position: 'before' | 'after',
-    sibling: ElementObject
+    data: ElementObject,
   ) => {
     if (
-      parentComponent?.disallow?.includes?.(sibling.type) ||
-      parentOverride?.disallow?.includes?.(sibling.type)
+      parentComponent?.disallow?.includes?.(data.type) ||
+      parentOverride?.disallow?.includes?.(data.type)
     ) {
       return;
     }
 
-    builder.moveElement(sibling, element, { parent, position });
+    builder.moveElement?.(data, element, { parent, position });
   }, [
     builder, element, parent, component, override, parentComponent,
     parentOverride,
@@ -71,8 +71,7 @@ const Foldable = ({
             <div className="section">
               <div
                 className={classNames(
-                  'title junipero secondary',
-                  '!oak-text-alternate-text-color'
+                  'title junipero secondary !oak-text-alternate-text-color'
                 )}
               >
                 <Text name="core.components.foldable.sectionsTitle.seeMore">

diff --git a/packages/react/lib/components/Row/index.tsx b/packages/react/lib/components/Row/index.tsx
@@ -81,16 +81,16 @@ const Row = ({
 
   const onDropElement = useCallback((
     position: 'before' | 'after',
-    sibling: ElementObject
+    data: ElementObject,
   ) => {
     if (
-      parentComponent?.disallow?.includes?.(sibling.type) ||
-      parentOverride?.disallow?.includes?.(sibling.type)
+      parentComponent?.disallow?.includes?.(data.type) ||
+      parentOverride?.disallow?.includes?.(data.type)
     ) {
       return;
     }
 
-    builder.moveElement(sibling, element, { parent, position });
+    builder.moveElement?.(data, element, { parent, position });
   }, [builder, element, parent, parentComponent, parentOverride]);
 
   return (