@plasmicpkgs/plasmic-cms 0.0.297 → 0.0.298

package/dist/index.js

@@ -95,12 +95,8 @@ __export(src_exports, {
   cmsRowFieldValueMeta: () => cmsRowFieldValueMeta,
   cmsRowImageMeta: () => cmsRowImageMeta,
   cmsRowLinkMeta: () => cmsRowLinkMeta,
-  fetchContent: () => fetchContent,
-  fetchCount: () => fetchCount,
-  fetchTables: () => fetchTables,
   mkApi: () => mkApi,
-  registerAll: () => registerAll,
-  registerAllCustomFunctions: () => registerAllCustomFunctions
+  registerAll: () => registerAll
 });
 module.exports = __toCommonJS(src_exports);
 var import_registerComponent = __toESM(require("@plasmicapp/host/registerComponent"));
@@ -109,6 +105,7 @@ var import_registerGlobalContext = __toESM(require("@plasmicapp/host/registerGlo
 // src/components.tsx
 var import_host2 = require("@plasmicapp/host");
 var import_query = require("@plasmicapp/query");
+var import_cms = require("@plasmicpkgs/cms");
 var import_dayjs = __toESM(require("dayjs"));
 var import_react2 = __toESM(require("react"));
 
@@ -258,7 +255,7 @@ function makeDatabaseCacheKey(config) {
   if (!config) {
     return null;
   }
-  const _a = config, { databaseToken } = _a, rest = __objRest(_a, ["databaseToken"]);
+  const _a = config, { databaseToken: _doNotExposeDatabaseToken } = _a, rest = __objRest(_a, ["databaseToken"]);
   return JSON.stringify(rest);
 }
 function DatabaseProvider({
@@ -413,41 +410,6 @@ function CountProvider({
   );
 }
 
-// src/util.ts
-function mkTableOptions(tables) {
-  if (!tables) {
-    return [];
-  }
-  return tables.map((table) => ({
-    value: table.identifier,
-    label: table.name
-  }));
-}
-function mkFieldOptions(tables, tableIdentifier, types) {
-  if (!tables) {
-    return [];
-  }
-  const table = tables.find((t) => t.identifier === tableIdentifier);
-  if (!table) {
-    return [];
-  }
-  let fields = table.schema.fields;
-  if (types) {
-    fields = fields.filter((f) => types.includes(f.type));
-  }
-  const options = fields.map((f) => ({
-    value: f.identifier,
-    label: f.name || f.identifier
-  }));
-  if (!options.some((option) => option.value === "_id")) {
-    options.push({
-      label: "System-assigned ID",
-      value: "_id"
-    });
-  }
-  return options;
-}
-
 // src/components.tsx
 var modulePath = "@plasmicpkgs/plasmic-cms";
 var componentPrefix = "hostless-plasmic-cms";
@@ -574,7 +536,7 @@ var cmsQueryRepeaterMeta = {
       type: "choice",
       displayName: "Model",
       description: "CMS model (table) to query.",
-      options: (_, ctx) => mkTableOptions(ctx == null ? void 0 : ctx.tables),
+      options: (_, ctx) => (0, import_cms._mkTableOptions)(ctx == null ? void 0 : ctx.tables),
       defaultValueHint: (_, ctx) => ctx == null ? void 0 : ctx.table
     },
     useDraft: {
@@ -604,13 +566,20 @@ var cmsQueryRepeaterMeta = {
       description: "Field (from model schema) to filter by",
       options: ({ table }, ctx) => {
         var _a;
-        return mkFieldOptions(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table, [
-          "number" /* NUMBER */,
-          "boolean" /* BOOLEAN */,
-          "text" /* TEXT */,
-          "long-text" /* LONG_TEXT */,
-          "ref" /* REF */
-        ]);
+        return (0, import_cms._mkFieldOptions)(
+          ctx == null ? void 0 : ctx.tables,
+          (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table,
+          [
+            import_cms._CmsMetaType.NUMBER,
+            import_cms._CmsMetaType.BOOLEAN,
+            import_cms._CmsMetaType.TEXT,
+            import_cms._CmsMetaType.LONG_TEXT,
+            import_cms._CmsMetaType.REF
+          ],
+          {
+            includeSystemId: true
+          }
+        );
       }
     },
     filterValue: {
@@ -622,13 +591,20 @@ var cmsQueryRepeaterMeta = {
       type: "choice",
       displayName: "Order by",
       description: "Field to order by.",
-      options: (_, ctx) => mkFieldOptions(ctx == null ? void 0 : ctx.tables, ctx == null ? void 0 : ctx.table, [
-        "number" /* NUMBER */,
-        "boolean" /* BOOLEAN */,
-        "date-time" /* DATE_TIME */,
-        "long-text" /* LONG_TEXT */,
-        "text" /* TEXT */
-      ]),
+      options: (_, ctx) => (0, import_cms._mkFieldOptions)(
+        ctx == null ? void 0 : ctx.tables,
+        ctx == null ? void 0 : ctx.table,
+        [
+          import_cms._CmsMetaType.NUMBER,
+          import_cms._CmsMetaType.BOOLEAN,
+          import_cms._CmsMetaType.DATE_TIME,
+          import_cms._CmsMetaType.LONG_TEXT,
+          import_cms._CmsMetaType.TEXT
+        ],
+        {
+          includeSystemId: true
+        }
+      ),
       hidden: (ps) => ps.mode === "count"
     },
     desc: {
@@ -660,7 +636,9 @@ var cmsQueryRepeaterMeta = {
       description: "Fields from the CMS model to include with each row; by default, all fields are included",
       options: ({ table }, ctx) => {
         var _a;
-        return mkFieldOptions(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table);
+        return (0, import_cms._mkFieldOptions)(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table, void 0, {
+          includeRefStars: true
+        });
       },
       hidden: (ps) => ps.mode === "count"
     },
@@ -819,7 +797,7 @@ var cmsRowFieldMeta = {
       },
       helpText: "Pick model from a CMS Data Fetcher",
       description: "Usually not used! Only with multiple CMS Data Loaders, use this to choose which to show. Otherwise, go select the CMS Data Loader if you want to load different data.",
-      options: (_, ctx) => mkTableOptions(ctx == null ? void 0 : ctx.tables),
+      options: (_, ctx) => (0, import_cms._mkTableOptions)(ctx == null ? void 0 : ctx.tables),
       defaultValueHint: (_, ctx) => ctx == null ? void 0 : ctx.table
     },
     field: {
@@ -828,21 +806,21 @@ var cmsRowFieldMeta = {
       description: "Field (from model schema) to use.",
       options: ({ table }, ctx) => {
         var _a;
-        return mkFieldOptions(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table, [
-          "number" /* NUMBER */,
-          "boolean" /* BOOLEAN */,
-          "text" /* TEXT */,
-          "long-text" /* LONG_TEXT */,
-          "date-time" /* DATE_TIME */,
-          "rich-text" /* RICH_TEXT */,
-          "image" /* IMAGE */,
-          "file" /* FILE */,
-          "enum" /* ENUM */
+        return (0, import_cms._mkFieldOptions)(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table, [
+          import_cms._CmsMetaType.NUMBER,
+          import_cms._CmsMetaType.BOOLEAN,
+          import_cms._CmsMetaType.TEXT,
+          import_cms._CmsMetaType.LONG_TEXT,
+          import_cms._CmsMetaType.DATE_TIME,
+          import_cms._CmsMetaType.RICH_TEXT,
+          import_cms._CmsMetaType.IMAGE,
+          import_cms._CmsMetaType.FILE,
+          import_cms._CmsMetaType.ENUM
         ]);
       },
       defaultValueHint: (_, ctx) => {
         var _a, _b;
-        return ((_a = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _a.name) || ((_b = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _b.identifier);
+        return ((_a = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _a.label) || ((_b = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _b.identifier);
       }
     },
     dateFormat: {
@@ -863,7 +841,7 @@ var cmsRowFieldMeta = {
         if (!fieldMeta) {
           return true;
         }
-        return fieldMeta.type !== "date-time" /* DATE_TIME */;
+        return fieldMeta.type !== import_cms._CmsMetaType.DATE_TIME;
       },
       options: [
         {
@@ -962,9 +940,9 @@ function CmsRowField(_a) {
     tables,
     field,
     typeFilters: [
-      "text" /* TEXT */,
-      "long-text" /* LONG_TEXT */,
-      "rich-text" /* RICH_TEXT */
+      import_cms._CmsMetaType.TEXT,
+      import_cms._CmsMetaType.LONG_TEXT,
+      import_cms._CmsMetaType.RICH_TEXT
     ]
   }) : void 0;
   if (tables) {
@@ -985,7 +963,7 @@ function CmsRowField(_a) {
   if (!data) {
     return null;
   }
-  if (fieldMeta.type === "date-time" /* DATE_TIME */ && dateFormat) {
+  if (fieldMeta.type === import_cms._CmsMetaType.DATE_TIME && dateFormat) {
     data = (0, import_dayjs.default)(data).format(dateFormat);
   }
   return data ? renderValue(data, fieldMeta.type, __spreadValues({
@@ -1007,7 +985,7 @@ var cmsCountFieldMeta = {
       },
       helpText: "Pick model from a CMS Data Fetcher",
       description: "Usually not used! Only with multiple CMS Data Loaders, use this to choose which to show. Otherwise, go select the CMS Data Loader if you want to load different data.",
-      options: (_, ctx) => mkTableOptions(ctx == null ? void 0 : ctx.tables),
+      options: (_, ctx) => (0, import_cms._mkTableOptions)(ctx == null ? void 0 : ctx.tables),
       defaultValueHint: (_, ctx) => ctx == null ? void 0 : ctx.table
     }
   }
@@ -1034,12 +1012,13 @@ function CmsCount(_a) {
     return /* @__PURE__ */ import_react2.default.createElement("div", __spreadValues({ className }, rest), new Intl.NumberFormat().format(res.count));
   }
 }
-var DEFAULT_TYPE_FILTERS = ["text" /* TEXT */];
+var DEFAULT_TYPE_FILTERS = [import_cms._CmsMetaType.TEXT];
 function deriveInferredTableField(opts) {
   var _a;
   const { table, tables, field, typeFilters } = opts;
-  if (!table)
+  if (!table) {
     return void 0;
+  }
   const schema = (_a = tables == null ? void 0 : tables.find((t) => t.identifier === table)) == null ? void 0 : _a.schema;
   const fieldMeta = field ? schema == null ? void 0 : schema.fields.find((f) => f.identifier === field) : schema == null ? void 0 : schema.fields.find(
     (f) => (typeFilters != null ? typeFilters : DEFAULT_TYPE_FILTERS).includes(f.type)
@@ -1051,15 +1030,16 @@ function assertNever(_) {
 }
 function renderValue(value, type, props) {
   switch (type) {
-    case "number" /* NUMBER */:
-    case "boolean" /* BOOLEAN */:
-    case "text" /* TEXT */:
-    case "long-text" /* LONG_TEXT */:
-    case "date-time" /* DATE_TIME */:
-    case "enum" /* ENUM */:
-    case "ref" /* REF */:
+    case import_cms._CmsMetaType.NUMBER:
+    case import_cms._CmsMetaType.BOOLEAN:
+    case import_cms._CmsMetaType.TEXT:
+    case import_cms._CmsMetaType.LONG_TEXT:
+    case import_cms._CmsMetaType.DATE_TIME:
+    case import_cms._CmsMetaType.ENUM:
+    case import_cms._CmsMetaType.REF:
+    case import_cms._CmsMetaType.COLOR:
       return /* @__PURE__ */ import_react2.default.createElement("div", __spreadValues({}, props), value);
-    case "rich-text" /* RICH_TEXT */:
+    case import_cms._CmsMetaType.RICH_TEXT:
       return /* @__PURE__ */ import_react2.default.createElement(
         "div",
         __spreadValues({
@@ -1067,7 +1047,7 @@ function renderValue(value, type, props) {
           style: { whiteSpace: "normal" }
         }, props)
       );
-    case "image" /* IMAGE */:
+    case import_cms._CmsMetaType.IMAGE:
       if (value && typeof value === "object" && value.url && value.imageMeta) {
         return /* @__PURE__ */ import_react2.default.createElement(
           "img",
@@ -1079,11 +1059,14 @@ function renderValue(value, type, props) {
         );
       }
       return null;
-    case "file" /* FILE */:
+    case import_cms._CmsMetaType.FILE:
       if (value && typeof value === "object" && value.url && value.name) {
         return /* @__PURE__ */ import_react2.default.createElement("a", __spreadValues({ href: value.url, target: "_blank" }, props), value.name);
       }
       return null;
+    case import_cms._CmsMetaType.LIST:
+    case import_cms._CmsMetaType.OBJECT:
+      return null;
     default:
       assertNever(type);
   }
@@ -1111,7 +1094,7 @@ var cmsRowLinkMeta = {
       },
       helpText: "Pick model from a CMS Data Fetcher",
       description: "Usually not used! Only with multiple CMS Data Loaders, use this to choose which to show. Otherwise, go select the CMS Data Loader if you want to load different data.",
-      options: (_, ctx) => mkTableOptions(ctx == null ? void 0 : ctx.tables),
+      options: (_, ctx) => (0, import_cms._mkTableOptions)(ctx == null ? void 0 : ctx.tables),
       defaultValueHint: (_, ctx) => ctx == null ? void 0 : ctx.table
     },
     field: {
@@ -1120,11 +1103,11 @@ var cmsRowLinkMeta = {
       description: "Field (from model schema) to use.",
       options: ({ table }, ctx) => {
         var _a;
-        return mkFieldOptions(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table);
+        return (0, import_cms._mkFieldOptions)(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table);
       },
       defaultValueHint: (_, ctx) => {
         var _a, _b;
-        return ((_a = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _a.name) || ((_b = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _b.identifier);
+        return ((_a = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _a.label) || ((_b = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _b.identifier);
       }
     },
     hrefProp: {
@@ -1172,7 +1155,7 @@ function CmsRowLink({
     table: res.table,
     tables,
     field,
-    typeFilters: ["file" /* FILE */, "text" /* TEXT */]
+    typeFilters: [import_cms._CmsMetaType.FILE, import_cms._CmsMetaType.TEXT]
   });
   if (tables) {
     setControlContextData == null ? void 0 : setControlContextData({
@@ -1192,7 +1175,7 @@ function CmsRowLink({
   const childrenWithProps = import_react2.default.Children.map(children, (child) => {
     if (import_react2.default.isValidElement(child)) {
       return import_react2.default.cloneElement(child, {
-        [hrefProp]: fieldMeta.type === "file" /* FILE */ ? value.url : prefix || suffix ? `${prefix || ""}${value}${suffix || ""}` : value
+        [hrefProp]: fieldMeta.type === import_cms._CmsMetaType.FILE ? value.url : prefix || suffix ? `${prefix || ""}${value}${suffix || ""}` : value
       });
     }
     return child;
@@ -1221,7 +1204,7 @@ var cmsRowImageMeta = {
       },
       helpText: "Pick model from a CMS Data Fetcher",
       description: "Usually not used! Only with multiple CMS Data Loaders, use this to choose which to show. Otherwise, go select the CMS Data Loader if you want to load different data.",
-      options: (_, ctx) => mkTableOptions(ctx == null ? void 0 : ctx.tables),
+      options: (_, ctx) => (0, import_cms._mkTableOptions)(ctx == null ? void 0 : ctx.tables),
       defaultValueHint: (_, ctx) => ctx == null ? void 0 : ctx.table
     },
     field: {
@@ -1230,11 +1213,11 @@ var cmsRowImageMeta = {
       description: "Field (from model schema) to use.",
       options: ({ table }, ctx) => {
         var _a;
-        return mkFieldOptions(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table, ["image" /* IMAGE */]);
+        return (0, import_cms._mkFieldOptions)(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table, [import_cms._CmsMetaType.IMAGE]);
       },
       defaultValueHint: (_, ctx) => {
         var _a, _b;
-        return ((_a = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _a.name) || ((_b = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _b.identifier);
+        return ((_a = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _a.label) || ((_b = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _b.identifier);
       }
     },
     srcProp: {
@@ -1262,7 +1245,7 @@ function CmsRowImage({
     table: res.table,
     tables,
     field,
-    typeFilters: ["image" /* IMAGE */]
+    typeFilters: [import_cms._CmsMetaType.IMAGE]
   });
   if (tables) {
     setControlContextData == null ? void 0 : setControlContextData({
@@ -1311,7 +1294,7 @@ var cmsRowFieldValueMeta = {
       },
       helpText: "Pick model from a CMS Data Fetcher",
       description: "Usually not used! Only with multiple CMS Data Loaders, use this to choose which to show. Otherwise, go select the CMS Data Loader if you want to load different data.",
-      options: (_, ctx) => mkTableOptions(ctx == null ? void 0 : ctx.tables),
+      options: (_, ctx) => (0, import_cms._mkTableOptions)(ctx == null ? void 0 : ctx.tables),
       defaultValueHint: (_, ctx) => ctx == null ? void 0 : ctx.table
     },
     field: {
@@ -1320,11 +1303,11 @@ var cmsRowFieldValueMeta = {
       description: "Field (from model schema) to use.",
       options: ({ table }, ctx) => {
         var _a;
-        return mkFieldOptions(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table);
+        return (0, import_cms._mkFieldOptions)(ctx == null ? void 0 : ctx.tables, (_a = ctx == null ? void 0 : ctx.table) != null ? _a : table);
       },
       defaultValueHint: (_, ctx) => {
         var _a, _b;
-        return ((_a = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _a.name) || ((_b = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _b.identifier);
+        return ((_a = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _a.label) || ((_b = ctx == null ? void 0 : ctx.fieldMeta) == null ? void 0 : _b.identifier);
       }
     },
     valueProp: {
@@ -1359,7 +1342,7 @@ function CmsRowFieldValue(_a) {
     table: res.table,
     tables,
     field,
-    typeFilters: ["text" /* TEXT */]
+    typeFilters: [import_cms._CmsMetaType.TEXT]
   });
   if (tables) {
     setControlContextData == null ? void 0 : setControlContextData({
@@ -1382,152 +1365,6 @@ function CmsRowFieldValue(_a) {
   return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, childrenWithProps);
 }
 
-// src/custom-functions.ts
-var import_registerFunction = __toESM(require("@plasmicapp/host/registerFunction"));
-function getCmsHost() {
-  var _a;
-  return (_a = globalThis["__PLASMIC_CMS_HOST__"]) != null ? _a : DEFAULT_HOST;
-}
-function createTableOptions(_args, ctx) {
-  if (!(ctx == null ? void 0 : ctx.tables)) {
-    return [];
-  }
-  return ctx.tables.map((table) => ({
-    value: table.identifier,
-    label: table.name
-  }));
-}
-var sharedTableFnContext = (cmsId, cmsPublicToken, ..._args) => {
-  if (!cmsId || !cmsPublicToken) {
-    return {
-      dataKey: "",
-      fetcher: () => __async(void 0, null, function* () {
-        return { tables: [] };
-      })
-    };
-  }
-  return {
-    dataKey: `cms_tables/${JSON.stringify({
-      cmsId,
-      cmsPublicToken
-    })}`,
-    fetcher: () => __async(void 0, null, function* () {
-      const api = mkApi({
-        databaseId: cmsId,
-        databaseToken: cmsPublicToken,
-        host: getCmsHost()
-      });
-      const tables = yield api.fetchTables();
-      return { tables };
-    })
-  };
-};
-var cmsIdParam = {
-  name: "cmsId",
-  type: "string",
-  description: "The cms ID"
-};
-var cmsPublicTokenParam = {
-  name: "cmsPublicToken",
-  type: "string",
-  description: "The cms public token"
-};
-var tableIdParam = {
-  name: "tableId",
-  type: "choice",
-  options: createTableOptions
-};
-var paramsParam = {
-  name: "params",
-  type: "object",
-  description: "The parameters to filter the content (e.g., for sorting, limit, offset, advanced queries)"
-};
-var useDraftParam = {
-  name: "useDraft",
-  type: "boolean",
-  description: "Whether to use draft data. Defaults to false."
-};
-var localeParam = {
-  name: "locale",
-  type: "string",
-  description: "The locale to use. Defaults to empty string."
-};
-function fetchTables(cmsId, cmsPublicToken) {
-  return __async(this, null, function* () {
-    const api = mkApi({
-      databaseId: cmsId,
-      databaseToken: cmsPublicToken,
-      host: getCmsHost()
-    });
-    return api.fetchTables();
-  });
-}
-function fetchContent(cmsId, cmsPublicToken, tableId, params, useDraft, locale) {
-  return __async(this, null, function* () {
-    const api = mkApi({
-      databaseId: cmsId,
-      databaseToken: cmsPublicToken,
-      host: getCmsHost(),
-      useDraft,
-      locale
-    });
-    return api.query(tableId, params);
-  });
-}
-function fetchCount(cmsId, cmsPublicToken, tableId, params, useDraft) {
-  return __async(this, null, function* () {
-    const api = mkApi({
-      databaseId: cmsId,
-      databaseToken: cmsPublicToken,
-      host: getCmsHost(),
-      useDraft
-    });
-    return api.count(tableId, params);
-  });
-}
-function registerAllCustomFunctions(loader) {
-  function _registerFunction(fn, meta) {
-    if (loader) {
-      loader.registerFunction(fn, meta);
-    } else {
-      (0, import_registerFunction.default)(fn, meta);
-    }
-  }
-  _registerFunction(fetchTables, {
-    name: "fetchTables",
-    description: "Fetches the tables from the cms",
-    importPath: "@plasmicpkgs/plasmic-cms",
-    params: [cmsIdParam, cmsPublicTokenParam]
-  });
-  _registerFunction(fetchContent, {
-    name: "fetchContent",
-    description: "Fetch content from a cms table",
-    importPath: "@plasmicpkgs/plasmic-cms",
-    params: [
-      cmsIdParam,
-      cmsPublicTokenParam,
-      tableIdParam,
-      paramsParam,
-      useDraftParam,
-      localeParam
-    ],
-    fnContext: sharedTableFnContext
-  });
-  _registerFunction(fetchCount, {
-    name: "fetchCount",
-    description: "Fetch the count of entries from a cms table",
-    importPath: "@plasmicpkgs/plasmic-cms",
-    params: [
-      cmsIdParam,
-      cmsPublicTokenParam,
-      tableIdParam,
-      paramsParam,
-      useDraftParam
-    ],
-    fnContext: sharedTableFnContext
-  });
-}
-
 // src/index.tsx
 function registerAll(loader) {
   const _registerComponent = (Component, defaultMeta) => {