lucid-extension-sdk 0.0.263 → 0.0.264

package/commandtypes.d.ts

@@ -42,6 +42,7 @@ export declare const enum CommandName {
     CanEditPackageSettings = "ceps",
     Confirm = "c",
     CreateBlock = "cb",
+    CreateCards = "ca",
     CreateCollection = "cc",
     CreateDataSource = "cds",
     CreateDocumentElement = "cde",
@@ -232,6 +233,10 @@ export type CommandArgs = {
         query: CreateBlockQuery;
         result: CreateBlockResult;
     };
+    [CommandName.CreateCards]: {
+        query: CreateCardsQuery;
+        result: CreateCardsResult;
+    };
     [CommandName.CreateCollection]: {
         query: CreateCollectionQuery;
         result: CreateCollectionResult;
@@ -714,13 +719,10 @@ export type AddCardIntegrationQuery = {
         /** OnSetup action */
         'os'?: string | undefined;
     } | undefined;
-    /** If specified, custom import modal via iframe url */
+    /** If specified, custom import modal*/
     'cim'?: {
-        'su': string;
-        'w': number;
-        'h': number;
-        'i': string;
-    };
+        'sh': string;
+    } | undefined;
     /** If specified, add-card settings */
     'ac'?: {
         /** Get input fields action */
@@ -901,6 +903,15 @@ export type CreateBlockQuery = {
     's'?: JsonSerializable | undefined;
 };
 export type CreateBlockResult = string;
+export type CreateCardsQuery = {
+    /** Identifier for the cards integration. */
+    'cid': string;
+    /** Identifier for the collection. */
+    'coid': string;
+    /** Primary keys of the items to import. */
+    'pks': string[];
+};
+export type CreateCardsResult = Promise<string[]>;
 export type CreateGroupQuery = {
     /**
      * By default, we add the group to the current page & currently active group. If specified, the

package/core/cardintegration/lucidcardintegration.d.ts

@@ -1,30 +1,13 @@
-import { CollectionDefinition } from '../../data/collectiondefinition';
 import { CollectionProxy } from '../../data/collectionproxy';
 import { DataSourceProxy } from '../../data/datasourceproxy';
 import { TextStyle } from '../../document/text/textstyle';
 import { EditorClient } from '../../editorclient';
 import { SerializedFieldType } from '../data/serializedfield/serializedfields';
-import { JsonSerializable } from '../jsonserializable';
 import { CardIntegrationConfig } from './cardintegrationconfig';
 import { ExtensionCardFieldDefinition } from './cardintegrationdefinitions';
-/**
- * Result of searching for data in the import modal
- */
-export interface SearchResult {
-    partialImportMetadata?: {
-        collectionId: string;
-        syncDataSourceId?: string;
-    };
-    data: CollectionDefinition;
-    fields: ExtensionCardFieldDefinition[];
-}
-/**
- * Result of importing data from  the import modal
- */
-export interface ImportResult {
-    collection: CollectionProxy;
-    primaryKeys: string[];
-}
+import { LucidCardIntegrationCustomImportModal } from './lucidcardintegrationcustomimportmodal';
+import { LucidCardIntegrationStandardImportModal } from './lucidcardintegrationstandardimportmodal';
+export { ImportResult, SearchResult } from './lucidcardintegrationstandardimportmodal';
 export declare abstract class LucidCardIntegration {
     protected readonly client: EditorClient;
     constructor(client: EditorClient);
@@ -89,65 +72,10 @@ export declare abstract class LucidCardIntegration {
      */
     abstract getDefaultConfig: (dataSource: DataSourceProxy) => Promise<CardIntegrationConfig>;
     /**
-     * If specified, allow the user to import cards using the standard card-import modal.
-     *
-     * getSearchFields:
-     * Given the values entered by the user so far into search fields, return the list of all search fields
-     * to display in the search form.
-     *
-     * search:
-     * Given values entered by the user into the search fields so far, return a collection of data to
-     * display in the results table. If partialImportMetadata is also returned, it will be used to create the tasks cards before
-     * the import is completed—which allows users to interact with the cards while the
-     * data is fetched asynchronously. The collectionId needs to match the id that will be
-     * returned from the completed import. The syncDataSourceId needs to match the
-     * syncDataSourceId that is passed into performDataAction.
-     * The last requirement for the partial import to work is that the primary keys in the data also
-     * returned in this search need to match the primary keys that will be returned
-     * on import.
-     *
-     * import:
-     * The user checked the boxes beside the given list of items in the collection returned from search().
-     * Import them, and return the collection and primary keys in that final collection that were imported.
-     *
-     * onSetup:
-     * If specified, it's going to be called everytime the modal is setting up, right after the modal is displayed
-     * and before the initial form fields are shown to the user.
-     *
-     * The config provided here is only used on the first import from a given source; on subsequent imports,
-     * the existing config will remain unchanged to preserve any customizations by the user.
+     * This allows the user to import cards by selecting items from within a modal. You can either create a custom
+     * import modal or the standard import modal can be used.
      */
-    importModal?: {
-        getSearchFields: (searchSoFar: Map<string, SerializedFieldType>) => Promise<ExtensionCardFieldDefinition[]>;
-        search: (fields: Map<string, SerializedFieldType>) => Promise<SearchResult>;
-        import: (primaryKeys: string[], searchFields: Map<string, SerializedFieldType>) => Promise<ImportResult>;
-        onSetup?: () => Promise<void>;
-    };
-    /**
-     * If specified, allow the user to import cards using a custom card-import modal.
-     *
-     * srcUrl:
-     * The url to be displayed in an iframe. This can either be a public url, or a local
-     * file located in the public folder of your packages root directory.
-     *
-     * width:
-     * The width of the iframe. The maximum width is 1344px.
-     *
-     * height:
-     * The height of the iframe. The maximum height is 1000px.
-     *
-     * import:
-     * Imports the items selected from you custom iframe. You can pass in whatever data is needed to import the items
-     * through you data-connector. The data must be of type JsonSerializable. Return the collection created and the
-     * primary keys of the items that were imported.
-     *
-     */
-    customImportModal?: {
-        srcUrl: string;
-        width: number;
-        height: number;
-        import: (data: JsonSerializable) => Promise<ImportResult>;
-    };
+    importModal?: LucidCardIntegrationStandardImportModal | LucidCardIntegrationCustomImportModal;
     /**
      * If specified, allow the user to create new cards and convert other shapes to cards
      */

package/core/cardintegration/lucidcardintegrationcustomimportmodal.d.ts

@@ -0,0 +1,13 @@
+import { EditorClient } from '../../editorclient';
+import { Modal, ModalConfig } from '../../ui/modal';
+/**
+ * Extending this class lets you create a custom import modal for a Lucid card integration.
+ */
+export declare abstract class LucidCardIntegrationCustomImportModal extends Modal {
+    private readonly cardIntegrationLabel;
+    constructor(client: EditorClient, config: ModalConfig, cardIntegrationLabel: string);
+    /**
+     * Once the data has been imported, call this function to create Lucid cards on the canvas.
+     */
+    protected createCards(collectionId: string, primaryKeys: string[]): import("../../commandtypes").CreateCardsResult;
+}

package/core/cardintegration/lucidcardintegrationcustomimportmodal.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LucidCardIntegrationCustomImportModal = void 0;
+const modal_1 = require("../../ui/modal");
+/**
+ * Extending this class lets you create a custom import modal for a Lucid card integration.
+ */
+class LucidCardIntegrationCustomImportModal extends modal_1.Modal {
+    constructor(client, config, cardIntegrationLabel) {
+        super(client, config);
+        this.cardIntegrationLabel = cardIntegrationLabel;
+    }
+    /**
+     * Once the data has been imported, call this function to create Lucid cards on the canvas.
+     */
+    createCards(collectionId, primaryKeys) {
+        return this.client.sendCommand("ca" /* CommandName.CreateCards */, {
+            'cid': this.cardIntegrationLabel,
+            'coid': collectionId,
+            'pks': primaryKeys,
+        });
+    }
+}
+exports.LucidCardIntegrationCustomImportModal = LucidCardIntegrationCustomImportModal;

package/core/cardintegration/lucidcardintegrationregistry.js

@@ -5,6 +5,7 @@ const collectiondefinition_1 = require("../../data/collectiondefinition");
 const datasourceproxy_1 = require("../../data/datasourceproxy");
 const cardintegrationconfig_1 = require("./cardintegrationconfig");
 const cardintegrationdefinitions_1 = require("./cardintegrationdefinitions");
+const lucidcardintegrationcustomimportmodal_1 = require("./lucidcardintegrationcustomimportmodal");
 class LucidCardIntegrationRegistry {
     static nextHookName() {
         return '__lucidcard__hook' + LucidCardIntegrationRegistry.nextHookId++;
@@ -73,57 +74,49 @@ class LucidCardIntegrationRegistry {
         };
         if (cardIntegration.importModal) {
             const importModal = cardIntegration.importModal;
-            serialized['im'] = {
-                'gsf': LucidCardIntegrationRegistry.nextHookName(),
-                's': LucidCardIntegrationRegistry.nextHookName(),
-                'i': LucidCardIntegrationRegistry.nextHookName(),
-                'os': importModal.onSetup ? LucidCardIntegrationRegistry.nextHookName() : undefined,
-            };
-            client.registerAction(serialized['im']['gsf'], async ({ 's': searchSoFar }) => {
-                const result = await importModal.getSearchFields(new Map(searchSoFar));
-                return (0, cardintegrationdefinitions_1.serializeCardFieldArrayDefinition)(result);
-            });
-            client.registerAction(serialized['im']['s'], async ({ 's': param }) => {
-                const result = await importModal.search(new Map(param));
-                return {
-                    'd': (0, collectiondefinition_1.serializeCollectionDefinition)(result.data),
-                    'f': (0, cardintegrationdefinitions_1.serializeCardFieldArrayDefinition)(result.fields),
-                    'm': result.partialImportMetadata && {
-                        'cid': result.partialImportMetadata.collectionId,
-                        'sid': result.partialImportMetadata.syncDataSourceId,
-                    },
+            if (importModal instanceof lucidcardintegrationcustomimportmodal_1.LucidCardIntegrationCustomImportModal) {
+                serialized['cim'] = {
+                    'sh': LucidCardIntegrationRegistry.nextHookName(),
                 };
-            });
-            client.registerAction(serialized['im']['i'], async ({ 'pks': primaryKeys, 's': searchFields }) => {
-                const result = await importModal.import(primaryKeys, new Map(searchFields));
-                return {
-                    'c': result.collection.id,
-                    'pks': result.primaryKeys,
+                client.registerAction(serialized['cim']['sh'], () => importModal.show());
+            }
+            else {
+                serialized['im'] = {
+                    'gsf': LucidCardIntegrationRegistry.nextHookName(),
+                    's': LucidCardIntegrationRegistry.nextHookName(),
+                    'i': LucidCardIntegrationRegistry.nextHookName(),
+                    'os': importModal.onSetup ? LucidCardIntegrationRegistry.nextHookName() : undefined,
                 };
-            });
-            if (serialized['im']['os']) {
-                client.registerAction(serialized['im']['os'], async () => {
-                    var _a;
-                    await ((_a = importModal.onSetup) === null || _a === void 0 ? void 0 : _a.call(importModal));
+                client.registerAction(serialized['im']['gsf'], async ({ 's': searchSoFar }) => {
+                    const result = await importModal.getSearchFields(new Map(searchSoFar));
+                    return (0, cardintegrationdefinitions_1.serializeCardFieldArrayDefinition)(result);
                 });
+                client.registerAction(serialized['im']['s'], async ({ 's': param }) => {
+                    const result = await importModal.search(new Map(param));
+                    return {
+                        'd': (0, collectiondefinition_1.serializeCollectionDefinition)(result.data),
+                        'f': (0, cardintegrationdefinitions_1.serializeCardFieldArrayDefinition)(result.fields),
+                        'm': result.partialImportMetadata && {
+                            'cid': result.partialImportMetadata.collectionId,
+                            'sid': result.partialImportMetadata.syncDataSourceId,
+                        },
+                    };
+                });
+                client.registerAction(serialized['im']['i'], async ({ 'pks': primaryKeys, 's': searchFields }) => {
+                    const result = await importModal.import(primaryKeys, new Map(searchFields));
+                    return {
+                        'c': result.collection.id,
+                        'pks': result.primaryKeys,
+                    };
+                });
+                if (serialized['im']['os']) {
+                    client.registerAction(serialized['im']['os'], async () => {
+                        var _a;
+                        await ((_a = importModal.onSetup) === null || _a === void 0 ? void 0 : _a.call(importModal));
+                    });
+                }
             }
         }
-        if (cardIntegration.customImportModal) {
-            const customImportModal = cardIntegration.customImportModal;
-            serialized['cim'] = {
-                'su': customImportModal.srcUrl,
-                'w': customImportModal.width,
-                'h': customImportModal.height,
-                'i': LucidCardIntegrationRegistry.nextHookName(),
-            };
-            client.registerAction(serialized['cim']['i'], async ({ 'd': data }) => {
-                const result = await customImportModal.import(data);
-                return {
-                    'c': result.collection.id,
-                    'pks': result.primaryKeys,
-                };
-            });
-        }
         if (cardIntegration.addCard) {
             const addCard = cardIntegration.addCard;
             serialized['ac'] = {

package/core/cardintegration/lucidcardintegrationstandardimportmodal.d.ts

@@ -0,0 +1,58 @@
+import { CollectionDefinition } from '../../data/collectiondefinition';
+import { CollectionProxy } from '../../data/collectionproxy';
+import { SerializedFieldType } from '../data/serializedfield/serializedfields';
+import { ExtensionCardFieldDefinition } from './cardintegrationdefinitions';
+/**
+ * You can use the standard import modal can be used by providing the following data:
+ *
+ * getSearchFields:
+ * Given the values entered by the user so far into search fields, return the list of all search fields
+ * to display in the search form.
+ *
+ * search:
+ * Given values entered by the user into the search fields so far, return a collection of data to
+ * display in the results table. If partialImportMetadata is also returned, it will be used to create the tasks cards before
+ * the import is completed—which allows users to interact with the cards while the
+ * data is fetched asynchronously. The collectionId needs to match the id that will be
+ * returned from the completed import. The syncDataSourceId needs to match the
+ * syncDataSourceId that is passed into performDataAction.
+ * The last requirement for the partial import to work is that the primary keys in the data also
+ * returned in this search need to match the primary keys that will be returned
+ * on import.
+ *
+ * import:
+ * The user checked the boxes beside the given list of items in the collection returned from search().
+ * Import them, and return the collection and primary keys in that final collection that were imported.
+ *
+ * onSetup:
+ * If specified, it's going to be called everytime the modal is setting up, right after the modal is displayed
+ * and before the initial form fields are shown to the user.
+ *
+ * The config provided here is only used on the first import from a given source; on subsequent imports,
+ * the existing config will remain unchanged to preserve any customizations by the user.
+ *
+ */
+export interface LucidCardIntegrationStandardImportModal {
+    getSearchFields: (searchSoFar: Map<string, SerializedFieldType>) => Promise<ExtensionCardFieldDefinition[]>;
+    search: (fields: Map<string, SerializedFieldType>) => Promise<SearchResult>;
+    import: (primaryKeys: string[], searchFields: Map<string, SerializedFieldType>) => Promise<ImportResult>;
+    onSetup?: () => Promise<void>;
+}
+/**
+ * Result of searching for data in the import modal
+ */
+export interface SearchResult {
+    partialImportMetadata?: {
+        collectionId: string;
+        syncDataSourceId?: string;
+    };
+    data: CollectionDefinition;
+    fields: ExtensionCardFieldDefinition[];
+}
+/**
+ * Result of importing data from  the import modal
+ */
+export interface ImportResult {
+    collection: CollectionProxy;
+    primaryKeys: string[];
+}

package/core/cardintegration/lucidcardintegrationstandardimportmodal.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "lucid-extension-sdk",
-    "version": "0.0.263",
+    "version": "0.0.264",
     "description": "Utility classes for writing Lucid Software editor extensions",
     "main": "index.js",
     "types": "index.d.ts",