@riboseinc/paneron-registry-kit 2.2.6 → 2.2.7

package/index.d.ts

@@ -1,6 +1,24 @@
+import React from 'react';
 import type { Extension } from '@riboseinc/paneron-extension-kit/types';
 import type { ExtensionMakerProps } from '@riboseinc/paneron-extension-kit/types/extension-maker';
 import type { RegistryViewProps } from './types';
 export declare type RegistryExtensionMakerProps = Pick<ExtensionMakerProps, 'name'> & RegistryViewProps;
 export declare type RegistryExtensionMaker = (opts: RegistryExtensionMakerProps) => Promise<Extension>;
 export declare const makeRegistryExtension: RegistryExtensionMaker;
+import { BrowserCtx } from './views/BrowserCtx';
+import { itemRefToItemPath, incompleteItemRefToItemPathPrefix } from './views/itemPathUtils';
+declare const _default: {
+    makeRegistryExtension: RegistryExtensionMaker;
+    itemRefToItemPath: typeof itemRefToItemPath;
+    incompleteItemRefToItemPathPrefix: typeof incompleteItemRefToItemPathPrefix;
+    BrowserCtx: React.Context<BrowserCtx>;
+    CRITERIA_CONFIGURATION: import("./views/FilterCriteria/models").CriteriaConfiguration;
+    GenericRelatedItemView: React.FC<import("./types").GenericRelatedItemViewProps>;
+    PropertyDetailView: React.FC<{
+        title: React.ReactNode;
+        secondaryTitle?: React.ReactNode;
+        inline?: boolean | undefined;
+        className?: string | undefined;
+    }>;
+};
+export default _default;

package/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.makeRegistryExtension = void 0;
+exports.default = exports.makeRegistryExtension = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -13,6 +13,16 @@ var _initial = _interopRequireDefault(require("./migrations/initial"));
 
 var _views = require("./views");
 
+var _BrowserCtx = require("./views/BrowserCtx");
+
+var _itemPathUtils = require("./views/itemPathUtils");
+
+var _GenericRelatedItemView = _interopRequireDefault(require("./views/GenericRelatedItemView"));
+
+var _util = require("./views/util");
+
+var _CRITERIA_CONFIGURATION = _interopRequireDefault(require("./views/FilterCriteria/CRITERIA_CONFIGURATION"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const makeRegistryExtension = function (opts) {
@@ -20,7 +30,7 @@ const makeRegistryExtension = function (opts) {
     name
   } = opts;
 
-  const mainView = function () {
+  const mainView = function _RegistryView() {
     return _react.default.createElement(_views.RegistryView, {
       itemClassConfiguration: opts.itemClassConfiguration,
       subregisters: opts.subregisters
@@ -36,4 +46,14 @@ const makeRegistryExtension = function (opts) {
   });
 };
 
-exports.makeRegistryExtension = makeRegistryExtension;
+exports.makeRegistryExtension = makeRegistryExtension;
+var _default = {
+  makeRegistryExtension,
+  itemRefToItemPath: _itemPathUtils.itemRefToItemPath,
+  incompleteItemRefToItemPathPrefix: _itemPathUtils.incompleteItemRefToItemPathPrefix,
+  BrowserCtx: _BrowserCtx.BrowserCtx,
+  CRITERIA_CONFIGURATION: _CRITERIA_CONFIGURATION.default,
+  GenericRelatedItemView: _GenericRelatedItemView.default,
+  PropertyDetailView: _util.PropertyDetailView
+};
+exports.default = _default;

package/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AAIjE,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAQvC,MAAM,CAAC,MAAM,qBAAqB,GAA2B,UAAU,IAAI;IACzE,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IAEtB,MAAM,QAAQ,GAAoC;QAChD,OAAO,CACL,oBAAC,YAAY,IACX,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,EACnD,YAAY,EAAE,IAAI,CAAC,YAAY,GAC/B,CACH,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,aAAa,CAAC;QACnB,QAAQ;QACR,IAAI;QACJ,sBAAsB,EAAE,OAAO;QAC/B,iBAAiB,EAAE,EAAE;QACrB,kBAAkB;KACnB,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { makeExtension } from '@riboseinc/paneron-extension-kit';\nimport type { Extension } from '@riboseinc/paneron-extension-kit/types';\nimport type { ExtensionMakerProps } from '@riboseinc/paneron-extension-kit/types/extension-maker';\nimport type { RegistryViewProps } from './types';\nimport datasetInitializer from './migrations/initial';\nimport { RegistryView } from './views';\n\nexport type RegistryExtensionMakerProps =\n  Pick<ExtensionMakerProps, 'name'> & RegistryViewProps\n\nexport type RegistryExtensionMaker =\n  (opts: RegistryExtensionMakerProps) => Promise<Extension>;\n\nexport const makeRegistryExtension: RegistryExtensionMaker = function (opts) {\n  const { name } = opts;\n\n  const mainView: ExtensionMakerProps[\"mainView\"] = function () {\n    return (\n      <RegistryView\n        itemClassConfiguration={opts.itemClassConfiguration}\n        subregisters={opts.subregisters}\n      />\n    );\n  };\n\n  return makeExtension({\n    mainView,\n    name,\n    requiredHostAppVersion: '2.0.0',\n    datasetMigrations: {},\n    datasetInitializer,\n  });\n};\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AAIjE,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAQvC,MAAM,CAAC,MAAM,qBAAqB,GAA2B,UAAU,IAAI;IACzE,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IAEtB,MAAM,QAAQ,GAAoC,SAAS,aAAa;QACtE,OAAO,CACL,oBAAC,YAAY,IACX,sBAAsB,EAAE,IAAI,CAAC,sBAAsB,EACnD,YAAY,EAAE,IAAI,CAAC,YAAY,GAC/B,CACH,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,aAAa,CAAC;QACnB,QAAQ;QACR,IAAI;QACJ,sBAAsB,EAAE,OAAO;QAC/B,iBAAiB,EAAE,EAAE;QACrB,kBAAkB;KACnB,CAAC,CAAC;AACL,CAAC,CAAC;AAGF,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,iCAAiC,EAAE,MAAM,uBAAuB,CAAC;AAC7F,OAAO,sBAAsB,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,sBAAsB,MAAM,+CAA+C,CAAC;AAEnF,eAAe;IACb,qBAAqB;IACrB,iBAAiB;IACjB,iCAAiC;IACjC,UAAU;IACV,sBAAsB;IACtB,sBAAsB;IACtB,kBAAkB;CACnB,CAAC","sourcesContent":["import React from 'react';\nimport { makeExtension } from '@riboseinc/paneron-extension-kit';\nimport type { Extension } from '@riboseinc/paneron-extension-kit/types';\nimport type { ExtensionMakerProps } from '@riboseinc/paneron-extension-kit/types/extension-maker';\nimport type { RegistryViewProps } from './types';\nimport datasetInitializer from './migrations/initial';\nimport { RegistryView } from './views';\n\nexport type RegistryExtensionMakerProps =\n  Pick<ExtensionMakerProps, 'name'> & RegistryViewProps\n\nexport type RegistryExtensionMaker =\n  (opts: RegistryExtensionMakerProps) => Promise<Extension>;\n\nexport const makeRegistryExtension: RegistryExtensionMaker = function (opts) {\n  const { name } = opts;\n\n  const mainView: ExtensionMakerProps[\"mainView\"] = function _RegistryView () {\n    return (\n      <RegistryView\n        itemClassConfiguration={opts.itemClassConfiguration}\n        subregisters={opts.subregisters}\n      />\n    );\n  };\n\n  return makeExtension({\n    mainView,\n    name,\n    requiredHostAppVersion: '2.0.0',\n    datasetMigrations: {},\n    datasetInitializer,\n  });\n};\n\n\nimport { BrowserCtx } from './views/BrowserCtx';\nimport { itemRefToItemPath, incompleteItemRefToItemPathPrefix } from './views/itemPathUtils';\nimport GenericRelatedItemView from './views/GenericRelatedItemView';\nimport { PropertyDetailView } from './views/util';\nimport CRITERIA_CONFIGURATION from './views/FilterCriteria/CRITERIA_CONFIGURATION';\n\nexport default {\n  makeRegistryExtension,\n  itemRefToItemPath,\n  incompleteItemRefToItemPathPrefix,\n  BrowserCtx,\n  CRITERIA_CONFIGURATION,\n  GenericRelatedItemView,\n  PropertyDetailView,\n};\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riboseinc/paneron-registry-kit",
-  "version": "2.2.6",
+  "version": "2.2.7",
   "main": "index.js",
   "author": "Ribose Inc. <open.source@ribose.com>",
   "scripts": {
@@ -28,7 +28,7 @@
     "@blueprintjs/select": "~4.9.10",
     "@emotion/react": "^11.10.6",
     "@emotion/styled": "^11.10.6",
-    "@riboseinc/paneron-extension-kit": "2.2.4",
+    "@riboseinc/paneron-extension-kit": "2.2.5",
     "@types/react": "17.0.53",
     "@types/react-dom": "^17.0.2",
     "@types/react-helmet": "^6.1.2",

package/types/item.d.ts

@@ -10,7 +10,7 @@ export interface RegisterItemClass {
     id: string;
     title: string;
     description?: string;
-    alternativeNames?: LocalizedAlternative<string>[];
+    alternativeNames?: Readonly<LocalizedAlternative<string>[]>;
 }
 interface ItemReference {
     registerID: string;

package/types/item.js.map

@@ -1 +1 @@
-{"version":3,"file":"item.js","sourceRoot":"","sources":["../../src/types/item.ts"],"names":[],"mappings":"AAKA,MAAM,aAAa,GAAG;IACpB,WAAW;IACX,OAAO;IACP,YAAY;IACZ,SAAS;IACT,SAAS;CACD,CAAC;AA2BX,MAAM,UAAU,uBAAuB,CAAC,GAAQ;IAC9C,OAAO,CACL,GAAG;QACH,GAAG,CAAC,cAAc,CAAC,QAAQ,CAAC;QAC5B,GAAG,CAAC,cAAc,CAAC,SAAS,CAAC;QAC7B,OAAO,GAAG,CAAC,QAAQ,CAAC,IAAI,QAAQ;QAChC,OAAO,GAAG,CAAC,SAAS,CAAC,IAAI,QAAQ,CAClC,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,SAAS,GAA0B;IAC9C,MAAM,EAAE,qBAAqB;IAC7B,OAAO,EAAE,sBAAsB;IAC/B,aAAa,EAAE,SAAS;CAChB,CAAC;AA0CX,MAAM,UAAU,cAAc,CAAC,GAAQ;IACrC,OAAO,CACL,GAAG;QACH,GAAG,CAAC,cAAc,CAAC,IAAI,CAAC;QACxB,GAAG,CAAC,cAAc,CAAC,MAAM,CAAC;QAC1B,GAAG,CAAC,cAAc,CAAC,QAAQ,CAAC;QAC5B,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CACvC,CAAC;AACJ,CAAC","sourcesContent":["import type { Citation, LocalizedAlternative } from './util';\n\n\nexport type Payload = Record<string, any>\n\nconst ITEM_STATUSES = [\n  'submitted',\n  'valid',\n  'superseded',\n  'retired',\n  'invalid',\n] as const;\n\nexport type ItemStatus = typeof ITEM_STATUSES[number];\n\n\nexport interface RegisterItemID {\n  classID: string\n  itemID: string\n}\n\n\nexport interface RegisterItemClass {\n  id: string\n  title: string\n  description?: string\n  alternativeNames?: LocalizedAlternative<string>[]\n}\n\ninterface ItemReference {\n  registerID: string\n  subregisterID?: string\n  classID: string\n  itemID: string\n}\n\nexport type InternalItemReference = Omit<ItemReference, 'registerID'>\n\nexport function isInternalItemReference(val: any): val is InternalItemReference {\n  return (\n    val &&\n    val.hasOwnProperty('itemID') &&\n    val.hasOwnProperty('classID') &&\n    typeof val['itemID'] == 'string' &&\n    typeof val['classID'] == 'string'\n  );\n}\n\nexport const DUMMY_REF: InternalItemReference = {\n  itemID: 'NONEXISTENT_ITEM_ID',\n  classID: 'NONEXISTENT_CLASS_ID',\n  subregisterID: undefined,\n} as const;\n\n\ninterface AbstractItemSource {\n  type: string\n}\ninterface PaneronRegisterItemSource extends AbstractItemSource {\n  type: 'paneron_register'\n  itemRef: ItemReference\n}\ninterface ExternalSource extends AbstractItemSource {\n  type: 'external'\n  citation: Citation\n}\ntype RegisterItemSource = PaneronRegisterItemSource | ExternalSource\n\nexport interface RegisterItem<P extends Payload> {\n  id: string // UUID\n\n  status: ItemStatus\n\n  dateAccepted: Date\n  // This is a mandatory property, since until their acceptance items “live” as part of their corresponding change requests\n\n  /** UUID of change request that defined the current version. */\n  amendedInCR?: string\n\n  // TODO: Denormalized, should be validated with consistency checks\n  supersededBy?: InternalItemReference[]\n  supersedes?: InternalItemReference[]\n\n  /**\n   * Register item data. Domain-specific. May include additional human-readable identifiers.\n   * In ISO 19135-1 was represented by “definition”.\n   */\n  data: P\n\n  source?: RegisterItemSource\n  // TODO: Citations were suggested to be moved to proposals, as motivating/substantiating evidence.\n  // TODO: Register item, however, should have a relationship that points to the original proto-item from another register.\n}\n\nexport function isRegisterItem(val: any): val is RegisterItem<any> {\n  return (\n    val &&\n    val.hasOwnProperty('id') &&\n    val.hasOwnProperty('data') &&\n    val.hasOwnProperty('status') &&\n    ITEM_STATUSES.indexOf(val.status) >= 0\n  );\n}\n"]}
+{"version":3,"file":"item.js","sourceRoot":"","sources":["../../src/types/item.ts"],"names":[],"mappings":"AAKA,MAAM,aAAa,GAAG;IACpB,WAAW;IACX,OAAO;IACP,YAAY;IACZ,SAAS;IACT,SAAS;CACD,CAAC;AA2BX,MAAM,UAAU,uBAAuB,CAAC,GAAQ;IAC9C,OAAO,CACL,GAAG;QACH,GAAG,CAAC,cAAc,CAAC,QAAQ,CAAC;QAC5B,GAAG,CAAC,cAAc,CAAC,SAAS,CAAC;QAC7B,OAAO,GAAG,CAAC,QAAQ,CAAC,IAAI,QAAQ;QAChC,OAAO,GAAG,CAAC,SAAS,CAAC,IAAI,QAAQ,CAClC,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,SAAS,GAA0B;IAC9C,MAAM,EAAE,qBAAqB;IAC7B,OAAO,EAAE,sBAAsB;IAC/B,aAAa,EAAE,SAAS;CAChB,CAAC;AA0CX,MAAM,UAAU,cAAc,CAAC,GAAQ;IACrC,OAAO,CACL,GAAG;QACH,GAAG,CAAC,cAAc,CAAC,IAAI,CAAC;QACxB,GAAG,CAAC,cAAc,CAAC,MAAM,CAAC;QAC1B,GAAG,CAAC,cAAc,CAAC,QAAQ,CAAC;QAC5B,aAAa,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CACvC,CAAC;AACJ,CAAC","sourcesContent":["import type { Citation, LocalizedAlternative } from './util';\n\n\nexport type Payload = Record<string, any>\n\nconst ITEM_STATUSES = [\n  'submitted',\n  'valid',\n  'superseded',\n  'retired',\n  'invalid',\n] as const;\n\nexport type ItemStatus = typeof ITEM_STATUSES[number];\n\n\nexport interface RegisterItemID {\n  classID: string\n  itemID: string\n}\n\n\nexport interface RegisterItemClass {\n  id: string\n  title: string\n  description?: string\n  alternativeNames?: Readonly<LocalizedAlternative<string>[]>\n}\n\ninterface ItemReference {\n  registerID: string\n  subregisterID?: string\n  classID: string\n  itemID: string\n}\n\nexport type InternalItemReference = Omit<ItemReference, 'registerID'>\n\nexport function isInternalItemReference(val: any): val is InternalItemReference {\n  return (\n    val &&\n    val.hasOwnProperty('itemID') &&\n    val.hasOwnProperty('classID') &&\n    typeof val['itemID'] == 'string' &&\n    typeof val['classID'] == 'string'\n  );\n}\n\nexport const DUMMY_REF: InternalItemReference = {\n  itemID: 'NONEXISTENT_ITEM_ID',\n  classID: 'NONEXISTENT_CLASS_ID',\n  subregisterID: undefined,\n} as const;\n\n\ninterface AbstractItemSource {\n  type: string\n}\ninterface PaneronRegisterItemSource extends AbstractItemSource {\n  type: 'paneron_register'\n  itemRef: ItemReference\n}\ninterface ExternalSource extends AbstractItemSource {\n  type: 'external'\n  citation: Citation\n}\ntype RegisterItemSource = PaneronRegisterItemSource | ExternalSource\n\nexport interface RegisterItem<P extends Payload> {\n  id: string // UUID\n\n  status: ItemStatus\n\n  dateAccepted: Date\n  // This is a mandatory property, since until their acceptance items “live” as part of their corresponding change requests\n\n  /** UUID of change request that defined the current version. */\n  amendedInCR?: string\n\n  // TODO: Denormalized, should be validated with consistency checks\n  supersededBy?: InternalItemReference[]\n  supersedes?: InternalItemReference[]\n\n  /**\n   * Register item data. Domain-specific. May include additional human-readable identifiers.\n   * In ISO 19135-1 was represented by “definition”.\n   */\n  data: P\n\n  source?: RegisterItemSource\n  // TODO: Citations were suggested to be moved to proposals, as motivating/substantiating evidence.\n  // TODO: Register item, however, should have a relationship that points to the original proto-item from another register.\n}\n\nexport function isRegisterItem(val: any): val is RegisterItem<any> {\n  return (\n    val &&\n    val.hasOwnProperty('id') &&\n    val.hasOwnProperty('data') &&\n    val.hasOwnProperty('status') &&\n    ITEM_STATUSES.indexOf(val.status) >= 0\n  );\n}\n"]}

package/types/views.d.ts

@@ -75,7 +75,7 @@ export interface ItemClassConfiguration<P extends Payload> {
      * Passed to useFilteredIndex().
      */
     keyExpression?: string;
-    exportFormats?: ExportFormatConfiguration<P>[];
+    exportFormats?: Readonly<ExportFormatConfiguration<P>[]>;
     views: {
         listItemView: ItemListView<P>;
         editView: ItemEditView<P>;

package/types/views.js.map

@@ -1 +1 @@
-{"version":3,"file":"views.js","sourceRoot":"","sources":["../../src/types/views.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\nimport type { ButtonProps, MenuItemProps } from '@blueprintjs/core';\nimport type { ObjectDatasetRequest, ObjectDatasetResponse, ValueHook } from '@riboseinc/paneron-extension-kit/types';\nimport type { InternalItemReference, Payload, RegisterItem, RegisterItemClass } from './item';\nimport type { CriteriaGroup } from '../views/FilterCriteria/models';\n\n\n// Hooks\n\n/**\n * Mostly a wrapper around useObjectData, but coerces value type\n * (TODO: validate!) and takes into account change request from any\n * wrapping change request context. If a change request is present,\n * will substitute proposed item data unless `ignoreActiveCR` is set.\n *\n * NOTE: Despite the name, returns the entire RegisterItem,\n * not just the `.data` property with item payload.\n */\nexport type RegisterItemDataHook<P extends Payload = Payload> =\n  (opts: { itemPaths: string[], ignoreActiveCR?: true }) => ValueHook<Record<string, RegisterItem<P> | null>>;\n\n\n// Extension configuration\n\n// TODO: Obsolete?\n// export interface ExtensionContext {\n//   getRelatedItemClassConfiguration: (classID: string) => RelatedItemClassConfiguration\n//   useRegisterItemData: RegisterItemDataHook\n//   onJump?: () => void\n// }\n\nexport interface RegisterConfiguration\n<Items extends ItemClassConfigurationSet = Record<string, ItemClassConfiguration<any>>> {\n  /**\n   * Configuration for all items in this register.\n   * This includes items in subregisters.\n   */\n  itemClassConfiguration: Items\n\n  /**\n   * Default expression used to sort an item.\n   * Passed to useFilteredIndex().\n   */\n  keyExpression?: string\n\n  /** Subregister information. */\n  subregisters?: Subregisters<Items>\n}\n\nexport type Subregisters\n<Items extends ItemClassConfigurationSet = Record<string, ItemClassConfiguration<any>>> = {\n  [subregisterID: string]: {\n    title: string\n\n    /** Names of item classes that go in this subregister. */\n    itemClasses: (keyof Items)[]\n  }\n};\n\nexport type ItemClassConfigurationSet = {\n  [itemClassID: string]: ItemClassConfiguration<any>\n};\n\n\n\nexport interface ExportFormatConfiguration<P extends Payload> {\n  /** The name of the export format. */\n  label: string\n\n  /**\n   * Trailing part of the filename to save export as;\n   * must include at least extension (with separator),\n   * must not include any path prefix.\n   */\n  filenameExtension: string\n\n  /**\n   * The function that takes register item data and some helper functions\n   * and is expected to return a blob.\n   */\n  exportItem: (\n    itemData: RegisterItem<P>,\n    opts: {\n      getObjectData: (opts: ObjectDatasetRequest) => Promise<ObjectDatasetResponse>,\n      getBlob: (val: string) => Promise<Uint8Array>,\n      logger?: { log: Console[\"log\"], error: Console[\"error\"], debug: Console[\"debug\"] },\n    },\n  ) => Promise<Uint8Array>\n}\n\n\nexport interface ItemClassConfiguration<P extends Payload/*, F extends Field*/> {\n  meta: RegisterItemClass\n\n  itemCanBeSuperseded?: boolean\n  // If false, items of this class cannot be superseded, only retired.\n  // Default is true.\n\n  defaults?: RegistryItemPayloadDefaults<P>\n  // Used to pre-populate item data e.g. when a new item is created.\n\n  validatePayload?: (item: P) => Promise<boolean>\n  sanitizePayload?: (item: P) => Promise<P>\n\n  // XXX: Confirm if obsolete and remove\n  itemSorter?: (a: P, b: P) => number\n\n  /**\n   * Expression used to sort an item of this class.\n   * Passed to useFilteredIndex().\n   */\n  keyExpression?: string\n\n  exportFormats?: ExportFormatConfiguration<P>[]\n\n  views: {\n    listItemView: ItemListView<P>\n    editView: ItemEditView<P>\n    detailView?: ItemDetailView<P>\n  }\n}\n\n\nexport interface RegistryViewProps\n<Items extends ItemClassConfigurationSet = Record<string, ItemClassConfiguration<any>>>\nextends RegisterConfiguration<Items> {\n  /**\n   * When search is initially opened, have this query pre-defined.\n   * Not very useful since there are also preset searches in the browser now.\n   */\n  // TODO: Obsoluete?\n  defaultSearchCriteria?: CriteriaGroup\n\n  customViews?: CustomViewConfiguration[]\n}\n\nexport interface CustomViewConfiguration {\n  id: string\n  label: string\n  description: string\n  view: React.FC<{\n    /** View can support optional path for custom state/inner navigation (provisional). */\n    path: string\n  }>\n  icon?: JSX.Element\n}\n\n\n// Item views\n\nexport interface ItemAction {\n  getButtonProps:\n    (item: RegisterItem<any>, itemClass: ItemClassConfiguration<any>, subregisterID?: string) =>\n      ButtonProps | MenuItemProps\n}\n\nexport type RegistryView = React.FC<RegistryViewProps>\n\ntype RegistryItemPayloadDefaults<P extends Payload> =\n  Partial<Omit<P, 'id'>>;\n\n/**\n * A small part of item class configuration,\n * useful e.g. for formatting related items.\n */\nexport type RelatedItemClassConfiguration = {\n  title: string\n  itemView: ItemListView<any>\n}\n\n\nexport interface RegistryItemViewProps<P extends Payload> {\n  /**\n   * Item reference.\n   * Glossarist, for example, uses it to determine language subregister and set appropriate writing direction.\n   */\n  itemRef: Omit<InternalItemReference, 'itemID'> & { itemID?: InternalItemReference['itemID'] }\n\n  /** Item data (payload). */\n  itemData: P\n\n  className?: string\n  //subregisterID?: string\n\n  /** Deprecated */\n  useRegisterItemData?: any\n  /** Deprecated */\n  getRelatedItemClassConfiguration?: any\n}\n\nexport interface GenericRelatedItemViewProps {\n  /** Currently selected item’s ref. */\n  itemRef?: InternalItemReference\n\n  /**\n   * By default, clicking the item will spawn a tab via TabbedWorkspace context.\n   * This prop can customize that behavior.\n   */\n  onJump?: () => void\n\n  className?: string\n\n  /**\n   * Determines which item classes can be selected in the search dialog.\n   * If undefined, *any* class can be chosen.\n   * If empty list, no class can be chosen (weird).\n   */\n  availableClassIDs?: string[]\n\n  // XXX: Check if obsolete, remove if unused\n  itemSorter?: ItemClassConfiguration<any>[\"itemSorter\"]\n\n  /** Called to auto-create an item (can’t auto-create if not provided) */\n  onCreateNew?: () => Promise<InternalItemReference>\n\n  /** Called when current item is cleared (can’t clear if not provided) */\n  onClear?: () => void\n\n  /** Called when a new item is selected (can’t change if not provided) */\n  onChange?: (newRef: InternalItemReference) => void\n\n  /** @deprecated subregisters no longer supported. */\n  availableSubregisterIDs?: string[]\n\n  /** @deprecated */\n  useRegisterItemData?: any\n  //useRegisterItemData: RegisterItemDataHook\n\n  /** @deprecated */\n  getRelatedItemClassConfiguration?: any\n  //getRelatedItemClassConfiguration: ExtensionContext[\"getRelatedItemClassConfiguration\"]\n}\n\n\nexport type ItemEditView<P extends Payload> = React.FC<ItemEditViewProps<P>>;\n\nexport interface ItemEditViewProps<P extends Payload> extends RegistryItemViewProps<P> {\n  onChange?: (newData: P) => void\n  onCreateRelatedItem?:\n    (classID: string, subregisterID?: string) => Promise<InternalItemReference>\n}\n\nexport interface ItemDetailViewProps<P extends Payload> extends RegistryItemViewProps<P> {\n  //useRegisterItemData: RegisterItemDataHook\n}\n\nexport type ItemDetailView<P extends Payload> = React.FC<ItemDetailViewProps<P>>;\n\nexport interface ItemListViewProps<P extends Payload> extends RegistryItemViewProps<P> {\n}\n\nexport type ItemListView<P extends Payload> = React.FC<ItemListViewProps<P>>;\n\nexport type LazyItemView = React.FC<{ itemID: string }>;\n"]}
+{"version":3,"file":"views.js","sourceRoot":"","sources":["../../src/types/views.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\nimport type { ButtonProps, MenuItemProps } from '@blueprintjs/core';\nimport type { ObjectDatasetRequest, ObjectDatasetResponse, ValueHook } from '@riboseinc/paneron-extension-kit/types';\nimport type { InternalItemReference, Payload, RegisterItem, RegisterItemClass } from './item';\nimport type { CriteriaGroup } from '../views/FilterCriteria/models';\n\n\n// Hooks\n\n/**\n * Mostly a wrapper around useObjectData, but coerces value type\n * (TODO: validate!) and takes into account change request from any\n * wrapping change request context. If a change request is present,\n * will substitute proposed item data unless `ignoreActiveCR` is set.\n *\n * NOTE: Despite the name, returns the entire RegisterItem,\n * not just the `.data` property with item payload.\n */\nexport type RegisterItemDataHook<P extends Payload = Payload> =\n  (opts: { itemPaths: string[], ignoreActiveCR?: true }) => ValueHook<Record<string, RegisterItem<P> | null>>;\n\n\n// Extension configuration\n\n// TODO: Obsolete?\n// export interface ExtensionContext {\n//   getRelatedItemClassConfiguration: (classID: string) => RelatedItemClassConfiguration\n//   useRegisterItemData: RegisterItemDataHook\n//   onJump?: () => void\n// }\n\nexport interface RegisterConfiguration\n<Items extends ItemClassConfigurationSet = Record<string, ItemClassConfiguration<any>>> {\n  /**\n   * Configuration for all items in this register.\n   * This includes items in subregisters.\n   */\n  itemClassConfiguration: Items\n\n  /**\n   * Default expression used to sort an item.\n   * Passed to useFilteredIndex().\n   */\n  keyExpression?: string\n\n  /** Subregister information. */\n  subregisters?: Subregisters<Items>\n}\n\nexport type Subregisters\n<Items extends ItemClassConfigurationSet = Record<string, ItemClassConfiguration<any>>> = {\n  [subregisterID: string]: {\n    title: string\n\n    /** Names of item classes that go in this subregister. */\n    itemClasses: (keyof Items)[]\n  }\n};\n\nexport type ItemClassConfigurationSet = {\n  [itemClassID: string]: ItemClassConfiguration<any>\n};\n\n\n\nexport interface ExportFormatConfiguration<P extends Payload> {\n  /** The name of the export format. */\n  label: string\n\n  /**\n   * Trailing part of the filename to save export as;\n   * must include at least extension (with separator),\n   * must not include any path prefix.\n   */\n  filenameExtension: string\n\n  /**\n   * The function that takes register item data and some helper functions\n   * and is expected to return a blob.\n   */\n  exportItem: (\n    itemData: RegisterItem<P>,\n    opts: {\n      getObjectData: (opts: ObjectDatasetRequest) => Promise<ObjectDatasetResponse>,\n      getBlob: (val: string) => Promise<Uint8Array>,\n      logger?: { log: Console[\"log\"], error: Console[\"error\"], debug: Console[\"debug\"] },\n    },\n  ) => Promise<Uint8Array>\n}\n\n\nexport interface ItemClassConfiguration<P extends Payload/*, F extends Field*/> {\n  meta: RegisterItemClass\n\n  itemCanBeSuperseded?: boolean\n  // If false, items of this class cannot be superseded, only retired.\n  // Default is true.\n\n  defaults?: RegistryItemPayloadDefaults<P>\n  // Used to pre-populate item data e.g. when a new item is created.\n\n  validatePayload?: (item: P) => Promise<boolean>\n  sanitizePayload?: (item: P) => Promise<P>\n\n  // XXX: Confirm if obsolete and remove\n  itemSorter?: (a: P, b: P) => number\n\n  /**\n   * Expression used to sort an item of this class.\n   * Passed to useFilteredIndex().\n   */\n  keyExpression?: string\n\n  exportFormats?: Readonly<ExportFormatConfiguration<P>[]>\n\n  views: {\n    listItemView: ItemListView<P>\n    editView: ItemEditView<P>\n    detailView?: ItemDetailView<P>\n  }\n}\n\n\nexport interface RegistryViewProps\n<Items extends ItemClassConfigurationSet = Record<string, ItemClassConfiguration<any>>>\nextends RegisterConfiguration<Items> {\n  /**\n   * When search is initially opened, have this query pre-defined.\n   * Not very useful since there are also preset searches in the browser now.\n   */\n  // TODO: Obsoluete?\n  defaultSearchCriteria?: CriteriaGroup\n\n  customViews?: CustomViewConfiguration[]\n}\n\nexport interface CustomViewConfiguration {\n  id: string\n  label: string\n  description: string\n  view: React.FC<{\n    /** View can support optional path for custom state/inner navigation (provisional). */\n    path: string\n  }>\n  icon?: JSX.Element\n}\n\n\n// Item views\n\nexport interface ItemAction {\n  getButtonProps:\n    (item: RegisterItem<any>, itemClass: ItemClassConfiguration<any>, subregisterID?: string) =>\n      ButtonProps | MenuItemProps\n}\n\nexport type RegistryView = React.FC<RegistryViewProps>\n\ntype RegistryItemPayloadDefaults<P extends Payload> =\n  Partial<Omit<P, 'id'>>;\n\n/**\n * A small part of item class configuration,\n * useful e.g. for formatting related items.\n */\nexport type RelatedItemClassConfiguration = {\n  title: string\n  itemView: ItemListView<any>\n}\n\n\nexport interface RegistryItemViewProps<P extends Payload> {\n  /**\n   * Item reference.\n   * Glossarist, for example, uses it to determine language subregister and set appropriate writing direction.\n   */\n  itemRef: Omit<InternalItemReference, 'itemID'> & { itemID?: InternalItemReference['itemID'] }\n\n  /** Item data (payload). */\n  itemData: P\n\n  className?: string\n  //subregisterID?: string\n\n  /** Deprecated */\n  useRegisterItemData?: any\n  /** Deprecated */\n  getRelatedItemClassConfiguration?: any\n}\n\nexport interface GenericRelatedItemViewProps {\n  /** Currently selected item’s ref. */\n  itemRef?: InternalItemReference\n\n  /**\n   * By default, clicking the item will spawn a tab via TabbedWorkspace context.\n   * This prop can customize that behavior.\n   */\n  onJump?: () => void\n\n  className?: string\n\n  /**\n   * Determines which item classes can be selected in the search dialog.\n   * If undefined, *any* class can be chosen.\n   * If empty list, no class can be chosen (weird).\n   */\n  availableClassIDs?: string[]\n\n  // XXX: Check if obsolete, remove if unused\n  itemSorter?: ItemClassConfiguration<any>[\"itemSorter\"]\n\n  /** Called to auto-create an item (can’t auto-create if not provided) */\n  onCreateNew?: () => Promise<InternalItemReference>\n\n  /** Called when current item is cleared (can’t clear if not provided) */\n  onClear?: () => void\n\n  /** Called when a new item is selected (can’t change if not provided) */\n  onChange?: (newRef: InternalItemReference) => void\n\n  /** @deprecated subregisters no longer supported. */\n  availableSubregisterIDs?: string[]\n\n  /** @deprecated */\n  useRegisterItemData?: any\n  //useRegisterItemData: RegisterItemDataHook\n\n  /** @deprecated */\n  getRelatedItemClassConfiguration?: any\n  //getRelatedItemClassConfiguration: ExtensionContext[\"getRelatedItemClassConfiguration\"]\n}\n\n\nexport type ItemEditView<P extends Payload> = React.FC<ItemEditViewProps<P>>;\n\nexport interface ItemEditViewProps<P extends Payload> extends RegistryItemViewProps<P> {\n  onChange?: (newData: P) => void\n  onCreateRelatedItem?:\n    (classID: string, subregisterID?: string) => Promise<InternalItemReference>\n}\n\nexport interface ItemDetailViewProps<P extends Payload> extends RegistryItemViewProps<P> {\n  //useRegisterItemData: RegisterItemDataHook\n}\n\nexport type ItemDetailView<P extends Payload> = React.FC<ItemDetailViewProps<P>>;\n\nexport interface ItemListViewProps<P extends Payload> extends RegistryItemViewProps<P> {\n}\n\nexport type ItemListView<P extends Payload> = React.FC<ItemListViewProps<P>>;\n\nexport type LazyItemView = React.FC<{ itemID: string }>;\n"]}

package/views/change-request/Proposals.d.ts

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 /** @jsxFrag React.Fragment */
 import React from 'react';
-import type { ChangeProposal, Clarification, InternalItemReference, Payload } from '../../types';
+import type { ChangeProposal, Clarification, InternalItemReference, Payload, RegisterItem } from '../../types';
 import type { Drafted } from '../../types/cr';
 declare const Proposals: React.FC<{
     proposals: Drafted['items'];
@@ -12,8 +12,8 @@ interface ProposalProps<P extends ChangeProposal> {
     showDiff?: boolean;
     showOnlyChanged?: boolean;
     itemRef: InternalItemReference;
-    itemData: Payload;
-    itemDataBefore: P extends Clarification ? Payload : undefined;
+    item: RegisterItem<Payload>;
+    itemBefore: P extends Clarification ? RegisterItem<Payload> : undefined;
     onChange?: (newProposal: P) => void;
 }
 export declare const ProposalDetail: React.FC<ProposalProps<ChangeProposal>>;

package/views/change-request/Proposals.js

@@ -17,15 +17,19 @@ var _select = require("@blueprintjs/select");
 
 var _HelpTooltip = _interopRequireDefault(require("@riboseinc/paneron-extension-kit/widgets/HelpTooltip"));
 
+var _ErrorBoundary = _interopRequireDefault(require("@riboseinc/paneron-extension-kit/widgets/ErrorBoundary"));
+
 var _protocolRegistry = require("../protocolRegistry");
 
 var _BrowserCtx = require("../BrowserCtx");
 
 var _itemPathUtils = require("../itemPathUtils");
 
+var _useItemClassConfig = _interopRequireDefault(require("../hooks/useItemClassConfig"));
+
 var _StructuredDiff = _interopRequireDefault(require("../diffing/StructuredDiff"));
 
-var _RegisterItem = _interopRequireDefault(require("../detail/RegisterItem"));
+var _RegisterItem = require("../detail/RegisterItem");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -36,6 +40,10 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 /** @jsx jsx */
 
 /** @jsxFrag React.Fragment */
+function stringifiedJSONEqual(i1, i2) {
+  return JSON.stringify(i1) === JSON.stringify(i2);
+}
+
 const Proposals = function ({
   proposals,
   className
@@ -67,9 +75,9 @@ const Proposals = function ({
       }
     }
   }, [Object.keys(proposals), jumpTo]);
-  const proposalBrowserCtx = { ...outerBrowserCtx,
+  const proposalBrowserCtx = (0, _react.useMemo)(() => ({ ...outerBrowserCtx,
     jumpTo: handleCRJump
-  };
+  }), [handleCRJump, outerBrowserCtx]);
   const firstProposal = Object.keys(proposals)[0]; // Effective selected proposal
 
   const selectedProposal = (_b = (_a = _selectedProposal && proposals[_selectedProposal] ? _selectedProposal : null) !== null && _a !== void 0 ? _a : firstProposal) !== null && _b !== void 0 ? _b : undefined; // Force select available proposal
@@ -78,8 +86,8 @@ const Proposals = function ({
     if (firstProposal && (_selectedProposal === null || !proposals[_selectedProposal])) {
       selectProposal(firstProposal !== null && firstProposal !== void 0 ? firstProposal : null);
     }
-  }, [firstProposal, _selectedProposal, JSON.stringify(proposals)]);
-  const selectedItemRef = selectedProposal ? (0, _itemPathUtils.itemPathToItemRef)(subregisters !== undefined, selectedProposal) : null; // Data for proposed items
+  }, [firstProposal, _selectedProposal, proposals]);
+  const selectedItemRef = (0, _itemPathUtils.useItemRef)(subregisters !== undefined, selectedProposal); // Data for proposed items
 
   const proposedItemPaths = Object.entries(proposals).map(([itemPath, proposal]) => {
     if (proposal.type === 'clarification' || proposal.type === 'addition') {
@@ -96,116 +104,101 @@ const Proposals = function ({
     itemPaths: Object.keys(proposals),
     ignoreActiveCR: true
   });
-
-  const getCurrentItemData = itemPath => {
+  const getCurrentItem = (0, _react.useCallback)(itemPath => {
+    var _a;
+
+    return (_a = currentItemDataReq.value[itemPath]) !== null && _a !== void 0 ? _a : null;
+  }, [currentItemDataReq.value]);
+  const getProposedItem = (0, _react.useCallback)(itemPath => {
+    var _a;
+
+    return (_a = proposedItemDataReq.value[itemPath]) !== null && _a !== void 0 ? _a : null;
+  }, [proposedItemDataReq.value]);
+  const selectedItemCurrent = getCurrentItem(selectedProposal);
+  const selectedItemProposed = getProposedItem(selectedProposal);
+  const handleItemSelect = (0, _react.useCallback)(item => selectProposal(item.itemPath), [selectProposal]);
+  const activeItem = (0, _react.useMemo)(() => selectedProposal ? {
+    itemPath: selectedProposal,
+    proposal: proposals[selectedProposal],
+    item: selectedItemProposed !== null && selectedItemProposed !== void 0 ? selectedItemProposed : selectedItemCurrent,
+    itemBefore: selectedItemCurrent !== null && selectedItemCurrent !== void 0 ? selectedItemCurrent : undefined,
+    itemRef: (0, _itemPathUtils.itemPathToItemRef)(subregisters !== undefined, selectedProposal)
+  } : null, [selectedProposal, proposals, subregisters]);
+  const allItems = (0, _react.useMemo)(() => Object.entries(proposals).map(([itemPath, proposal]) => {
     var _a, _b;
 
-    return (_b = (_a = currentItemDataReq.value[itemPath]) === null || _a === void 0 ? void 0 : _a.data) !== null && _b !== void 0 ? _b : null;
-  };
-
-  const getProposedItemData = itemPath => {
-    var _a, _b;
-
-    return (_b = (_a = proposedItemDataReq.value[itemPath]) === null || _a === void 0 ? void 0 : _a.data) !== null && _b !== void 0 ? _b : null;
-  };
-
-  const selectedItemCurrentData = getCurrentItemData(selectedProposal);
-  const selectedItemProposedData = getProposedItemData(selectedProposal);
+    return {
+      itemPath,
+      proposal,
+      item: (_b = (_a = getProposedItem(itemPath)) !== null && _a !== void 0 ? _a : getCurrentItem(itemPath)) !== null && _b !== void 0 ? _b : null,
+      itemBefore: undefined,
+      itemRef: (0, _itemPathUtils.itemPathToItemRef)(subregisters !== undefined, itemPath)
+    };
+  }).filter(cpi => cpi.item !== null), [proposals, getCurrentItem, getProposedItem]);
 
   if (selectedProposal && selectedItemRef && proposals[selectedProposal] && !currentItemDataReq.isUpdating && !proposedItemDataReq.isUpdating) {
-    if (selectedItemCurrentData || selectedItemProposedData || true) {
-      const selectedItemSummary = (0, _react2.jsx)(ProposalSummary, {
-        itemRef: selectedItemRef,
-        itemData: selectedItemProposedData !== null && selectedItemProposedData !== void 0 ? selectedItemProposedData : selectedItemCurrentData,
-        itemDataBefore: selectedItemCurrentData !== null && selectedItemCurrentData !== void 0 ? selectedItemCurrentData : undefined,
-        proposal: proposals[selectedProposal]
-      });
-      return (0, _react2.jsx)("div", {
-        css: (0, _react2.css)`display: flex; flex-flow: column nowrap;`,
-        className: className
-      }, (0, _react2.jsx)("div", null, (0, _react2.jsx)(_core.ControlGroup, null, (0, _react2.jsx)(_core.Switch, {
-        checked: showDiff,
-        onChange: evt => setShowDiff(evt.currentTarget.checked),
-        label: "View source",
-        css: (0, _react2.css)`margin-right: 1em !important`
-      }), (0, _react2.jsx)(_core.Switch, {
-        checked: showDiff && showOnlyChanged,
-        disabled: !showDiff,
-        onChange: evt => setShowOnlyChanged(evt.currentTarget.checked),
-        label: "Show clarified properties only"
-      })), (0, _react2.jsx)(_core.ButtonGroup, null, (0, _react2.jsx)(_core.Button, {
-        disabled: !jumpTo || ((_c = proposals[selectedProposal]) === null || _c === void 0 ? void 0 : _c.type) === 'addition',
-        icon: 'locate',
-        onClick: () => jumpTo === null || jumpTo === void 0 ? void 0 : jumpTo(`${_protocolRegistry.Protocols.ITEM_DETAILS}:${selectedProposal}`),
-        title: "Open selected item in a new tab (not applicable to proposed additions)"
-      }, "Reveal in registry"), Object.keys(proposals).length > 1 ? (0, _react2.jsx)(_react2.ClassNames, null, ({
-        css: css2
-      }) => (0, _react2.jsx)(_select.Select2, {
-        filterable: false,
-        itemsEqual: (i1, i2) => JSON.stringify(i1) === JSON.stringify(i2),
-        menuProps: {
-          className: css2(`height: 50vh; overflow-y: auto;`)
-        },
-        activeItem: {
-          itemPath: selectedProposal,
-          proposal: proposals[selectedProposal],
-          itemData: selectedItemProposedData !== null && selectedItemProposedData !== void 0 ? selectedItemProposedData : selectedItemCurrentData,
-          itemDataBefore: selectedItemCurrentData !== null && selectedItemCurrentData !== void 0 ? selectedItemCurrentData : undefined,
-          itemRef: (0, _itemPathUtils.itemPathToItemRef)(subregisters !== undefined, selectedProposal)
-        },
-        items: Object.entries(proposals).map(([itemPath, proposal]) => {
-          var _a, _b;
-
-          return {
-            itemPath,
-            proposal,
-            itemData: (_b = (_a = getProposedItemData(itemPath)) !== null && _a !== void 0 ? _a : getCurrentItemData(itemPath)) !== null && _b !== void 0 ? _b : null,
-            itemDataBefore: undefined,
-            itemRef: (0, _itemPathUtils.itemPathToItemRef)(subregisters !== undefined, itemPath)
-          };
-        }).filter(item => item.itemData !== null),
-        popoverProps: {
-          minimal: true
-        },
-        fill: true,
-        itemRenderer: ChangeProposalItemView,
-        onItemSelect: item => selectProposal(item.itemPath)
-      }, (0, _react2.jsx)(_core.Button, {
-        rightIcon: "chevron-down",
-        icon: getProposalIcon(proposals[selectedProposal])
-      }, selectedItemSummary))) : (0, _react2.jsx)(_core.Button, {
-        fill: true,
-        alignText: "left",
-        icon: getProposalIcon(proposals[selectedProposal]),
-        rightIcon: "chevron-down"
-      }, selectedItemSummary))), (0, _react2.jsx)("div", {
-        css: (0, _react2.css)`position: relative; flex: 1;`
-      }, (0, _react2.jsx)(_BrowserCtx.BrowserCtx.Provider, {
-        value: proposalBrowserCtx
-      }, (0, _react2.jsx)(ProposalDetail, {
-        itemRef: selectedItemRef,
-        showDiff: showDiff,
-        showOnlyChanged: showOnlyChanged,
-        itemData: selectedItemProposedData !== null && selectedItemProposedData !== void 0 ? selectedItemProposedData : selectedItemCurrentData,
-        itemDataBefore: selectedItemCurrentData !== null && selectedItemCurrentData !== void 0 ? selectedItemCurrentData : undefined,
-        proposal: proposals[selectedProposal]
-      }))));
-    } else {
-      return (0, _react2.jsx)(_core.NonIdealState, {
-        icon: 'warning-sign',
-        className: className,
-        title: "Unable to retrieve proposed item data",
-        description: (0, _react2.jsx)("div", {
-          css: (0, _react2.css)`text-align: left;`
-        }, "Attempted to retrieve data for ", (0, _react2.jsx)("code", null, selectedProposal), ", but failed.", (0, _react2.jsx)("br", null), "Perhaps selected item was removed, or there is a data integrity issue.", (0, _react2.jsx)("br", null), "This might be caused by a problem in the application, or repository contents having been edited outside of the application.", (0, _react2.jsx)("br", null), "The data should be recoverable by inspecting version control system commit history.", (0, _react2.jsx)("br", null), (0, _react2.jsx)("br", null), (0, _react2.jsx)(_core.ButtonGroup, null, (0, _react2.jsx)(_core.Button, {
-          onClick: () => selectProposal(firstProposal !== null && firstProposal !== void 0 ? firstProposal : null)
-        }, firstProposal ? "Go to first proposed item" : "Unselect proposal"), (0, _react2.jsx)(_core.Button, {
-          intent: "danger",
-          onClick: () => selectProposal(firstProposal !== null && firstProposal !== void 0 ? firstProposal : null),
-          title: "This should help if there\u2019s an addition or clarification proposal with missing proposed item data. NOTE: It removes the proposal, so you may need to create it again."
-        }, "Delete phantom proposal item")))
-      });
-    }
+    const selectedItemSummary = (0, _react2.jsx)(ProposalSummary, {
+      itemRef: selectedItemRef,
+      item: selectedItemProposed !== null && selectedItemProposed !== void 0 ? selectedItemProposed : selectedItemCurrent,
+      itemBefore: selectedItemCurrent !== null && selectedItemCurrent !== void 0 ? selectedItemCurrent : undefined,
+      proposal: proposals[selectedProposal]
+    });
+    return (0, _react2.jsx)("div", {
+      css: (0, _react2.css)`display: flex; flex-flow: column nowrap;`,
+      className: className
+    }, (0, _react2.jsx)("div", null, (0, _react2.jsx)(_core.ControlGroup, null, (0, _react2.jsx)(_core.Switch, {
+      checked: showDiff,
+      onChange: evt => setShowDiff(evt.currentTarget.checked),
+      label: "View source",
+      css: (0, _react2.css)`margin-right: 1em !important`
+    }), (0, _react2.jsx)(_core.Switch, {
+      checked: showDiff && showOnlyChanged,
+      disabled: !showDiff,
+      onChange: evt => setShowOnlyChanged(evt.currentTarget.checked),
+      label: "Show clarified properties only"
+    })), (0, _react2.jsx)(_core.ButtonGroup, null, (0, _react2.jsx)(_core.Button, {
+      disabled: !jumpTo || ((_c = proposals[selectedProposal]) === null || _c === void 0 ? void 0 : _c.type) === 'addition',
+      icon: 'locate',
+      onClick: () => jumpTo === null || jumpTo === void 0 ? void 0 : jumpTo(`${_protocolRegistry.Protocols.ITEM_DETAILS}:${selectedProposal}`),
+      title: "Open selected item in a new tab (not applicable to proposed additions)"
+    }, "Reveal in registry"), Object.keys(proposals).length > 1 ? (0, _react2.jsx)(_react2.ClassNames, null, ({
+      css: css2
+    }) => (0, _react2.jsx)(_select.Select2, {
+      filterable: false,
+      itemsEqual: stringifiedJSONEqual,
+      menuProps: {
+        className: css2(`height: 50vh; overflow-y: auto;`)
+      },
+      activeItem: activeItem,
+      items: allItems,
+      popoverProps: {
+        minimal: true
+      },
+      fill: true,
+      itemRenderer: ChangeProposalItemView,
+      onItemSelect: handleItemSelect
+    }, (0, _react2.jsx)(_core.Button, {
+      rightIcon: "chevron-down",
+      icon: getProposalIcon(proposals[selectedProposal])
+    }, selectedItemSummary))) : (0, _react2.jsx)(_core.Button, {
+      fill: true,
+      alignText: "left",
+      icon: getProposalIcon(proposals[selectedProposal]),
+      rightIcon: "chevron-down"
+    }, selectedItemSummary))), (0, _react2.jsx)("div", {
+      css: (0, _react2.css)`position: relative; flex: 1;`
+    }, (0, _react2.jsx)(_BrowserCtx.BrowserCtx.Provider, {
+      value: proposalBrowserCtx
+    }, (0, _react2.jsx)(_ErrorBoundary.default, {
+      viewName: "Proposal detail"
+    }, (0, _react2.jsx)(ProposalDetail, {
+      itemRef: selectedItemRef,
+      showDiff: showDiff,
+      showOnlyChanged: showOnlyChanged,
+      item: selectedItemProposed !== null && selectedItemProposed !== void 0 ? selectedItemProposed : selectedItemCurrent,
+      itemBefore: selectedItemCurrent !== null && selectedItemCurrent !== void 0 ? selectedItemCurrent : undefined,
+      proposal: proposals[selectedProposal]
+    })))));
   } else {
     return (0, _react2.jsx)(_core.NonIdealState, {
       icon: 'clean',
@@ -237,38 +230,46 @@ const ChangeProposalItemView = (item, {
   });
 };
 
-const ProposalDetail = function ({
+const ProposalDetail = (0, _react.memo)(function ({
   proposal,
   showDiff,
   showOnlyChanged,
   itemRef,
-  itemData,
-  itemDataBefore,
+  item,
+  itemBefore,
   onChange
 }) {
-  const ItemView = _RegisterItem.default.main;
+  var _a, _b;
+
+  const itemClass = (0, _useItemClassConfig.default)((_a = itemRef.classID) !== null && _a !== void 0 ? _a : 'NONEXISTENT_CLASS_ID');
+
+  if (!itemClass) {
+    throw new Error(`Unknown item class “${itemRef.classID}”!`);
+  }
+
   const view = showDiff ? (0, _react2.jsx)(MaximizedStructuredDiff, {
-    item1: itemDataBefore !== null && itemDataBefore !== void 0 ? itemDataBefore : {},
-    item2: itemData,
+    item1: (_b = itemBefore === null || itemBefore === void 0 ? void 0 : itemBefore.data) !== null && _b !== void 0 ? _b : ITEM_DATA_PLACEHOLDER,
+    item2: item.data,
     showUnchanged: !showOnlyChanged,
     css: (0, _react2.css)`background: white; border-radius: 2.5px; padding: 10px 0; margin: 10px 0;`,
     className: _core.Classes.ELEVATION_2
-  }) : (0, _react2.jsx)(ItemView, {
-    uri: (0, _itemPathUtils.itemRefToItemPath)(itemRef),
+  }) : (0, _react2.jsx)(_RegisterItem.ItemDetail, {
+    itemRef: itemRef,
+    item: item,
+    itemClass: itemClass,
     key: JSON.stringify(itemRef)
   });
   return (0, _react2.jsx)("div", {
     css: (0, _react2.css)`position: absolute; inset: 0; display: flex; flex-flow: column;`
   }, view);
-};
-
+});
 exports.ProposalDetail = ProposalDetail;
 
 const ProposalSummary = function ({
   proposal,
   itemRef,
-  itemData,
-  itemDataBefore,
+  item,
+  itemBefore,
   onChange
 }) {
   const {
@@ -280,50 +281,50 @@ const ProposalSummary = function ({
   const ListItemView = itemClasses[classID].views.listItemView;
   return (0, _react2.jsx)(ListItemView, {
     itemRef: itemRef,
-    itemData: itemData
+    itemData: item.data
   });
 };
 
 exports.ProposalSummary = ProposalSummary;
 const clarification = {
   hint: (0, _react2.jsx)(_react.default.Fragment, null, "altered to represent the same concept more clearly."),
-  summary: ({
+  summary: (0, _react.memo)(({
     proposal,
-    itemData,
+    item,
     itemRef
-  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Clarification")
+  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Clarification"), () => true)
 };
 const addition = {
   hint: (0, _react2.jsx)(_react.default.Fragment, null, "added to this register."),
-  summary: ({
+  summary: (0, _react.memo)(({
     proposal,
-    itemData,
+    item,
     itemRef
-  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Addition")
+  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Addition"), () => true)
 };
 const retirement = {
   hint: (0, _react2.jsx)(_react.default.Fragment, null, "marked as no longer current. (Note that this register is append-only, so the item cannot be removed altogether.)"),
-  summary: ({
+  summary: (0, _react.memo)(({
     proposal,
     itemRef,
-    itemData
-  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Retirement")
+    item
+  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Retirement"), () => true)
 };
 const supersession = {
   hint: (0, _react2.jsx)(_react.default.Fragment, null, "removed from the register with another item recommended for use in its place. A relation between the superseding and superseded item will be created, though the exact semantics of that relation depend on the register."),
-  summary: ({
+  summary: (0, _react.memo)(({
     proposal,
     itemRef,
-    itemData
-  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Supersession")
+    item
+  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Supersession"), () => true)
 };
 const invalidation = {
   hint: (0, _react2.jsx)(_react.default.Fragment, null, "marked as invalid. The exact semantics of invalidation depend on the register."),
-  summary: ({
+  summary: (0, _react.memo)(({
     proposal,
     itemRef,
-    itemData
-  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Invalidation")
+    item
+  }) => (0, _react2.jsx)(_react.default.Fragment, null, "Invalidation"), () => true)
 };
 const MaximizedStructuredDiff = (0, _styled.default)(_StructuredDiff.default)`
   position: absolute;
@@ -342,4 +343,5 @@ function getProposalIcon(proposal) {
 }
 
 var _default = Proposals;
-exports.default = _default;
+exports.default = _default;
+const ITEM_DATA_PLACEHOLDER = {};