@bigbinary/neeto-molecules 1.0.48 → 1.0.50

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neeto-molecules",
-  "version": "1.0.48",
+  "version": "1.0.50",
   "description": "A package of reusable molecular components for neeto products.",
   "repository": "git@github.com:bigbinary/neeto-molecules.git",
   "author": "Amaljith K <amaljith.k@bigbinary.com>",

package/src/translations/en.json

@@ -263,12 +263,12 @@
     },
     "ipRestriction": {
       "switchLabel": "Enable IP restriction",
-      "description": "Restrict access to only trusted locations and networks by defining the range of allowed IP addresses",
+      "description": "Restrict access to only trusted locations and networks by defining the range of allowed IP addresses.",
       "allowedIpRangeTitle": "Allowed IP range",
       "ipStart": "IP start",
       "ipEnd": "IP end",
       "actions": "Actions",
-      "allowedIpRangeConfirmation": "This can't be undone. Confirm deletion of IP range {{ipStart}} to {{ipEnd}}",
+      "allowedIpRangeConfirmation": "Confirm deletion of IP range {{ipStart}} to {{ipEnd}}. This can't be undone.",
       "validations": {
         "invalidIp": "Invalid IP address format",
         "ipEndGreaterThanIpStart": "IP end should be greater than or equal to IP start",
@@ -277,7 +277,7 @@
         "ipEndRequired": "IP end is required"
       },
       "currentIpTitle": "Your current IP is",
-      "currentIpDescription": "Your current IP will be added to the allowed IP range by default. You will not be able to save the IP settings without your current IP address on the list"
+      "currentIpDescription": "Your current IP will be added to the allowed IP range by default. You will not be able to save the IP settings without your current IP address on the list."
     },
     "integrationWalkthroughModal": {
       "header": "Check how it behaves",

package/types/Columns.d.ts

@@ -8,38 +8,6 @@ import { CheckboxProps, DropdownProps, InputProps } from "@bigbinary/neetoui";
  *
  * ![image](https://user-images.githubusercontent.com/32426070/195069324-3cbb4c70-f62b-4080-b4ae-bdeabb449b23.png|height=200|width=300)
  *
- * Props:
- *
- * This is the data structure for the columnData prop:
- *
- * @example 
- *
- *   const columnData = [
- *   {
- *     title: "ID",
- *     dataIndex: "id",
- *     key: "id",
- *     ...
- *   },
- *   {
- *     title: "GUID",
- *     dataIndex: "guid",
- *     key: "guid",
- *     ...
- *   },
- *   ...
- * ];
- * @endexample
- * It is similar to the columnsData prop of the neetoUI table component
- *
- * (reference).
- *
- * These 3 props are required for the Columns as well as the neetoUI Table
- *
- * component to work.
- *
- * Simple:
- *
  * @example 
  *
  * import React, { useState } from "react";

package/types/EmailPreview.d.ts

@@ -7,12 +7,6 @@ import React from "react";
  *
  * @example 
  *
- * ["oliver@example.com", "eve@example.com"]
- * @endexample
- * Simple:
- *
- * @example 
- *
  * import React from "react";
  * import { useFormikContext } from "formik";
  * import EmailPreview from "@bigbinary/neeto-molecules/EmailPreview";

package/types/ErrorPage.d.ts

@@ -3,15 +3,9 @@ import React from "react";
  *
  * A fallback page for handling 404, 403 and 500 errors.
  *
- * This component accepts two optional props status and homeUrl. status is
+ * The component also has a "contact us" link that opens the chat widget for
  *
- * the status code of the error. 404 is the default value for status. homeUrl
- *
- * is the URL to which the user will be taken to when user clicks on back to home
- *
- * button. / is the default value for homeUrl. The component also has a
- *
- * "contact us" link that opens the chat widget for further communication.
+ * further communication.
  *
 */
 const ErrorPage: React.FC<{

package/types/IntegrationCard.d.ts

@@ -4,6 +4,8 @@ import React, { ReactElement } from "react";
  *
  * A common component used for integrations across neeto products.
  *
+ * ![Integrations](https://user-images.githubusercontent.com/49012815/237155224-582fe3b3-2b63-484b-bc08-6898fb8c1ce2.png|height=200|width=300)
+ *
  * @example 
  *
  * import IntegrationCard from "@bigbinary/neeto-molecules/IntegrationCard";

package/types/IntegrationDisconnectAlert.d.ts

@@ -3,6 +3,8 @@ import React from "react";
  *
  * A common component used for disconnect UI of integrations across neeto products.
  *
+ * ![Integration](https://github.com/bigbinary/neeto-molecules/assets/49012815/864c1407-a6c8-4b53-ab01-364db42d2a80|height=200|width=300)
+ *
  * @example 
  *
  * import IntegrationDisconnectAlert from "@bigbinary/neeto-molecules/IntegrationDisconnectAlert";

package/types/IntegrationWalkthroughModal.d.ts

@@ -3,6 +3,8 @@ import React from "react";
  *
  * A component used to display walkthrough video of integration.
  *
+ * ![IntegrationWalkthroughModal](https://user-images.githubusercontent.com/89389135/243562250-9cdd99cf-ee7e-42b5-b578-ca57db5fc94a.png|height=200|width=300)
+ *
  * @example 
  *
  * import React, { useState } from "react";

package/types/IpRestriction.d.ts

@@ -3,7 +3,7 @@ import React from "react";
  *
  * A common component to restrict IPs in neeto applications.
  *
- * ![Ip](https://user-images.githubusercontent.com/49012815/209516878-91d69555-a643-486a-81f8-e59797d3bef3.png|height=200|width=300)
+ * ![Ip](https://user-images.githubusercontent.com/49012815/246818619-209f616c-cfc4-4e98-b137-96d305a71bd8.png|height=200|width=300)
  *
  * @example 
  *

package/types/KeyboardShortcuts.d.ts

@@ -19,6 +19,8 @@ interface ProductShortcuts {
  *
  * defined hotkey (shift+/).
  *
+ * ![image](https://user-images.githubusercontent.com/29166133/223832668-2b92ff28-6565-434c-8a76-cf587c9dbc99.png|height=200|width=300)
+ *
  * All the global shortcuts like open pane, close modal etc will be rendered by
  *
  * default by the component. It provides a single prop called productShortcuts
@@ -77,6 +79,8 @@ interface ProductShortcuts {
  * @endexample
  * This hook can be used to manage the behavior of KeyboardShortcuts pane.
  *
+ * This hook will return an array with exactly 2 values just like useState hook.
+ *
  * @example 
  *
  * import KeyboardShortcuts from "@bigbinary/neeto-molecules/KeyboardShortcuts";

package/types/LoginPage.d.ts

@@ -7,8 +7,6 @@ import React from "react";
  *
  * undefined
  *
- * Usage:
- *
  * @example 
  *
  * import LoginPage from "@bigbinary/neeto-molecules/LoginPage";

package/types/MenuBar.d.ts

@@ -62,7 +62,15 @@ type AddNewProps = {
  *   );
  * };
  * @endexample
- * MenuBar with child components
+ * Props for MenuBar.Block:
+ *
+ * Props for MenuBar.AddNew:
+ *
+ * Props for MenuBar.SubTitle:
+ *
+ * Props for MenuBar.Search:
+ *
+ * Props for MenuBar.Item:
  *
  * @example 
  *

package/types/NeetoWidget.d.ts

@@ -25,14 +25,10 @@ type EmbedCode = React.FC<{
  *
  * application.
  *
- * Usage:
- *
  * @example 
  *
  * <NeetoWidget.EmbedCode primaryApp={NeetoWidget.WIDGET_TYPES.chat} />
  * @endexample
- * Props:
- *
 */
 const NeetoWidget: {
   EmbedCode: EmbedCode;

package/types/PhoneNumber.d.ts

@@ -31,8 +31,6 @@ export
  *
  * ![PhoneNumberInput](https://user-images.githubusercontent.com/35297280/231367938-93aa94b0-2a8c-44b3-b1c7-8c60843e40c4.png|height=200|width=300)
  *
- * Props:
- *
  * @example 
  *
  * import React, { useState } from "react";
@@ -51,8 +49,6 @@ export
  *
  * ![PhoneNumber](https://user-images.githubusercontent.com/35297280/231367945-ee5f0921-92e3-4086-a8e2-f9ab63cf9a37.png|height=200|width=300)
  *
- * Props:
- *
  * @example 
  *
  * import { PhoneNumber } from "@bigbinary/neeto-molecules/PhoneNumber";

package/types/PublishBlock.d.ts

@@ -16,10 +16,6 @@ interface PublishBlockProps {
  *
  * ![image](https://user-images.githubusercontent.com/35297280/219363621-9fb295c4-72e4-4cde-b8d1-614f49e5dfa5.png|height=200|width=300)
  *
- * This optional component can be used to render the reset alert modal for
- *
- * discarding draft.
- *
  * @example 
  *
  * import PublishBlock from "@bigbinary/neeto-molecules/PublishBlock";
@@ -47,21 +43,37 @@ interface PublishBlockProps {
  *     </>
  *   );
  *   return (
- *     <>
- *       <PublishBlock
- *         renderDraftButtons={renderDraftButtons}
- *         renderPublishButtons={renderPublishButtons}
- *       />
+ *     <PublishBlock
+ *       renderDraftButtons={renderDraftButtons}
+ *       renderPublishButtons={renderPublishButtons}
+ *     />
+ *   );
+ * };
+ * @endexample
+ * This optional component can be used to render the reset alert modal for
+ *
+ * discarding draft.
+ *
+ * It also accepts all other alert props.
+ *
+ * @example 
+ *
+ * import PublishBlock from "@bigbinary/neeto-molecules/PublishBlock";
  * 
- *       <PublishBlock.Alert
- *         isOpen={isResetDraftAlertOpen}
- *         message="Leaving this page will delete all unpublished changes."
- *         title="Are you sure you want to discard changes?"
- *         onClose={() => setIsResetDraftAlertOpen(false)}
- *         onSubmit={action("handleReset")}
- *         //other alert props can also be passed
- *       />
- *     </>
+ * const PublishActionBlock = (
+ *   {
+ *     //all variables used in the below example can be passed as props or can be defined in the component itself
+ *   }
+ * ) => {
+ *   return (
+ *     <PublishBlock.Alert
+ *       isOpen={isResetDraftAlertOpen}
+ *       message="Leaving this page will delete all unpublished changes."
+ *       title="Are you sure you want to discard changes?"
+ *       onClose={() => setIsResetDraftAlertOpen(false)}
+ *       onSubmit={action("handleReset")}
+ *       //other alert props can also be passed
+ *     />
  *   );
  * };
  * @endexample

package/types/Schedule.d.ts

@@ -5,8 +5,6 @@ import React from "react";
  *
  * ![image](https://user-images.githubusercontent.com/35630321/198989580-36a91233-8e7b-4300-b980-f50d2b0efcaa.png|height=200|width=300)
  *
- * Props:
- *
  * How to Reset Form from outside Schedule Component:
  *
  * How to get the form errors from outside Schedule Component:
@@ -15,7 +13,7 @@ import React from "react";
  *
  * @example 
  *
- *   const periods = {
+ * const periods = {
  *   sunday: [],
  *   monday: [
  *     {
@@ -95,11 +93,7 @@ import React from "react";
  *   ],
  *   saturday: [],
  * };
- * 
- * ];
  * @endexample
- * Simple:
- *
  * @example 
  *
  * import React, { useState } from "react";

package/types/SubHeader.d.ts

@@ -57,12 +57,6 @@ interface RightBlockComposition {
  *   />
  * );
  * @endexample
- * For common usages with Download, Manage Columns and Filters, we can use the
- *
- * composite component SubHeader.RightBlock
- *
- * Props:
- *
  * @example 
  *
  * import SubHeader from "@bigbinary/neeto-molecules/SubHeader";

package/types/TableWrapper.d.ts

@@ -15,10 +15,6 @@ import React from "react";
  *
  * below.
  *
- * TableWrapper should be used only with Tables used in the listing layout as shown
- *
- * below.
- *
  * @example 
  *
  * import TableWrapper from "@bigbinary/neeto-molecules/TableWrapper";