@bigbinary/neeto-molecules 1.6.13 → 1.6.15

package/types/Builder.d.ts

@@ -3,41 +3,85 @@ type Element = {
   value: string;
   icon: React.ReactNode;
 };
-
 type ElementSection = {
   title: string;
   elements: Element[];
   key: string;
   isCreatable: (element: Element) => boolean;
 };
-
 type SelectedElement = {
   id: string;
   kind: string;
   position: number;
   label: string;
   icon: React.ReactNode;
+  isPending: boolean;
 };
-
 type dragResult = {
   index: number;
 };
-
 type SelectedElementAction = {
   label: string;
   key: string;
   onClick: (element: Element) => void;
   isVisible?: boolean;
 };
-
-export const ElementsPanel: React.FC<{
+export
+/**
+ *
+ * @example 
+ *
+ * import React from "react";
+ * import Container from "@bigbinary/neeto-molecules/Container";
+ * import {
+ *   ElementsPanel,
+ *   PropertiesPanel,
+ * } from "@bigbinary/neeto-molecules/Builder";
+ * 
+ * const Component = () => (
+ *   <Container isHeaderFixed>
+ *     <div className="flex h-full w-full justify-between">
+ *       <ElementsPanel
+ *         elementSections={sections}
+ *         {...{
+ *           handleAddElement,
+ *           isElementVisible,
+ *           selectedElements,
+ *           fixedFirstElement,
+ *           fixedLastElement,
+ *         }}
+ *         selectedElementActions={[
+ *           {
+ *             label: "Duplicate",
+ *             key: "duplicate",
+ *             onClick: element => alert("Clicked", JSON.stringify(element)),
+ *           },
+ *           {
+ *             label: "Delete",
+ *             key: "delete",
+ *             onClick: element => alert("Clicked", JSON.stringify(element)),
+ *           },
+ *         ]}
+ *       />
+ *       <PropertiesPanel>
+ *         <PropertiesPanel.EmptyProperty />
+ *       </PropertiesPanel>
+ *     </div>
+ *   </Container>
+ * );
+ * @endexample
+*/
+const ElementsPanel: React.FC<{
   elementSections: ElementSection[];
   selectedElements: SelectedElement[];
   handleAddElement: (element: Element) => void;
   isElementVisible: (element: Element) => boolean;
   fixedFirstElement?: SelectedElement;
   fixedLastElement?: SelectedElement;
-  handleDragEnd?: ({ source: dragResult, destination: dragResult }) => void;
+  handleDragEnd?: ({
+    source: dragResult,
+    destination: dragResult
+  }) => void;
   isDragDisabled?: boolean;
   handleSelectElement: (index: number) => void;
   selectedElementIndex: number;
@@ -49,7 +93,6 @@ export const ElementsPanel: React.FC<{
   isAddingNewElement?: boolean;
   returnElementOnSelect?: boolean;
 }>;
-
 export const PropertiesPanel: React.FC<{
   children: React.ReactNode;
-}>;
+}>;

package/types/HelpPopover.d.ts

@@ -35,5 +35,6 @@ const HelpPopover: React.FC<{
   helpLinkProps?: ButtonProps;
   popoverProps?: PopoverProps;
   size?: "default" | "large";
+  className?: string;
 }>;
 export default HelpPopover;