@pepperi-addons/ngx-composite-lib-react 0.5.2 → 0.5.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pepperi-addons/ngx-composite-lib-react",
-  "version": "0.5.2",
+  "version": "0.5.4",
   "description": "React wrappers for Pepperi ngx-composite-lib Angular Elements.",
   "license": "MIT",
   "author": "Pepperi",

package/pep-generic-list.d.ts

@@ -66,5 +66,9 @@ export interface PepGenericListProps {
     listLoad?: () => void;
     className?: string;
     style?: React.CSSProperties;
+    leftButtonsContent?: React.ReactNode;
+    rightButtonsContent?: React.ReactNode;
+    leftBottomAreaContent?: React.ReactNode;
+    rightBottomAreaContent?: React.ReactNode;
 }
 export declare const PepGenericList: React.FC<PepGenericListProps>;

package/pep-generic-list.js

@@ -122,6 +122,20 @@ export const PepGenericList = (props) => {
         props.startIndexChange,
         props.listLoad,
     ]);
-    return React.createElement('pep-generic-list-element', { ref, class: props.className, style: props.style });
+    // Render projected content for Angular ng-content slots by using matching attributes
+    const children = [];
+    if (props.leftButtonsContent) {
+        children.push(React.createElement('div', { ['left-buttons']: '' }, props.leftButtonsContent));
+    }
+    if (props.rightButtonsContent) {
+        children.push(React.createElement('div', { ['right-buttons']: '' }, props.rightButtonsContent));
+    }
+    if (props.leftBottomAreaContent) {
+        children.push(React.createElement('div', { ['left-bottom-area']: '' }, props.leftBottomAreaContent));
+    }
+    if (props.rightBottomAreaContent) {
+        children.push(React.createElement('div', { ['right-bottom-area']: '' }, props.rightBottomAreaContent));
+    }
+    return React.createElement('pep-generic-list-element', { ref, class: props.className, style: props.style }, children.length > 0 ? children : undefined);
 };
 //# sourceMappingURL=pep-generic-list.js.map

package/pep-group-buttons-settings.js

@@ -6,55 +6,40 @@ export const PepGroupButtonsSettings = ({ header, subHeader, groupType, btnsArra
         const el = ref.current;
         if (!el)
             return;
-        console.log('[REACT DEBUG] Setting Group Buttons properties...');
-        console.log('[REACT DEBUG] Props received:', { header, subHeader, excludeKeys, groupType, btnsArray, useNone, disabled, dir, titleSize, bold, btnKey });
         // Set properties in the correct order - excludeKeys must be set before groupType
         if (header !== undefined) {
             el.header = header;
-            console.log('[REACT DEBUG] Set header:', el.header);
         }
         if (subHeader !== undefined) {
             el.subHeader = subHeader;
-            console.log('[REACT DEBUG] Set subHeader:', el.subHeader);
         }
         if (excludeKeys !== undefined) {
             el.excludeKeys = excludeKeys; // Set excludeKeys FIRST
-            console.log('[REACT DEBUG] Set excludeKeys:', el.excludeKeys);
         }
         if (groupType !== undefined) {
             el.groupType = groupType; // Then set groupType
-            console.log('[REACT DEBUG] Set groupType:', el.groupType);
         }
         if (btnsArray !== undefined) {
             el.btnsArray = btnsArray;
-            console.log('[REACT DEBUG] Set btnsArray:', el.btnsArray);
         }
         if (useNone !== undefined) {
             el.useNone = useNone;
-            console.log('[REACT DEBUG] Set useNone:', el.useNone);
         }
         if (disabled !== undefined) {
             el.disabled = disabled;
-            console.log('[REACT DEBUG] Set disabled:', el.disabled);
         }
         if (dir !== undefined) {
             el.dir = dir;
-            console.log('[REACT DEBUG] Set dir:', el.dir);
         }
         if (titleSize !== undefined) {
             el.titleSize = titleSize;
-            console.log('[REACT DEBUG] Set titleSize:', el.titleSize);
         }
         if (bold !== undefined) {
             el.bold = bold;
-            console.log('[REACT DEBUG] Set bold:', el.bold);
         }
         if (btnKey !== undefined) {
             el.btnKey = btnKey;
-            console.log('[REACT DEBUG] Set btnKey:', el.btnKey);
         }
-        console.log('[REACT DEBUG] btnsArray:', el.btnsArray);
-        console.log('[REACT DEBUG] excludeKeys should trigger automatic arrayMerge via setter');
     }, [header, subHeader, groupType, btnsArray, excludeKeys, useNone, disabled, dir, titleSize, bold, btnKey]);
     // Wire outputs (Angular emits custom event name 'btnkeyChange')
     useEffect(() => {