@riboseinc/paneron-registry-kit 2.2.16 → 2.2.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riboseinc/paneron-registry-kit",
-  "version": "2.2.16",
+  "version": "2.2.18",
   "main": "index.js",
   "author": "Ribose Inc. <open.source@ribose.com>",
   "scripts": {

package/views/GenericRelatedItemView.js

@@ -19,9 +19,9 @@ var _ChangeRequestContext = require("./change-request/ChangeRequestContext");
 
 var _cr = require("../types/cr");
 
-var _protocolRegistry = require("./protocolRegistry");
+var _ItemSearchDrawer = _interopRequireDefault(require("./ItemSearchDrawer"));
 
-var _ItemDrawer = _interopRequireDefault(require("./ItemDrawer"));
+var _ItemDetailsDrawer = _interopRequireDefault(require("./ItemDetailsDrawer"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -74,7 +74,8 @@ const GenericRelatedItemView = function ({
 
   const affectedByActiveCR = activeChangeRequest && (0, _cr.isDrafted)(activeChangeRequest) && activeChangeRequest.items[itemPathWithSubregister];
   const itemPath = affectedByActiveCR ? `/proposals/${activeChangeRequest.id}/items/${itemPathWithSubregister}` : `/${itemPathWithSubregister}`;
-  const [selectDialogState, setSelectDialogState] = (0, _react2.useState)(false); //log.debug("Rendering generic related item view", itemRef);
+  const [selectDialogState, setSelectDialogState] = (0, _react2.useState)(false);
+  const [peekingDrawerState, setPeekingDrawerState] = (0, _react2.useState)(false); //log.debug("Rendering generic related item view", itemRef);
   //const { jumpToItem } = useContext(BrowserCtx);
 
   const itemResult = useRegisterItemData({
@@ -109,7 +110,7 @@ const GenericRelatedItemView = function ({
   const willShowItemView = hasItem || itemIsMissing || !onChange;
   const canJump = (item !== null || itemIsMissing) && classConfigured && !itemResult.isUpdating && (onJump || jumpTo);
   const jump = (0, _react2.useCallback)(function jump() {
-    return onJump ? onJump() : jumpTo === null || jumpTo === void 0 ? void 0 : jumpTo(`${_protocolRegistry.Protocols.ITEM_DETAILS}:/${itemPathWithSubregister}`);
+    return onJump ? onJump() : setPeekingDrawerState(true);
   }, [onJump, jumpTo]);
   const itemView = (0, _react2.useMemo)(() => {
     var _a;
@@ -216,16 +217,20 @@ const GenericRelatedItemView = function ({
   }), canJump ? (0, _react.jsx)(_core.Button, {
     outlined: true,
     onClick: jump,
-    icon: "open-application"
+    icon: "maximize"
   }) : null, itemButtons.map((props, idx) => (0, _react.jsx)(_core.Button, {
     key: idx,
     outlined: true,
     ...props
-  })), onChange ? (0, _react.jsx)(_ItemDrawer.default, {
+  })), (0, _react.jsx)(_ItemSearchDrawer.default, {
     isOpen: selectDialogState,
     onClose: () => setSelectDialogState(false),
     onChooseItem: onChange,
     availableClassIDs: classIDs
+  }), itemRef ? (0, _react.jsx)(_ItemDetailsDrawer.default, {
+    isOpen: peekingDrawerState,
+    onClose: () => setPeekingDrawerState(false),
+    itemRef: itemRef
   }) : null);
 };
 

package/views/GenericRelatedItemView.js.map

@@ -1 +1 @@
-{"version":3,"file":"GenericRelatedItemView.js","sourceRoot":"","sources":["../../src/views/GenericRelatedItemView.tsx"],"names":[],"mappings":"AAAA,eAAe;AACf,8BAA8B;AAE9B,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,YAAY,EAA4C,MAAM,mBAAmB,CAAC;AAC/G,OAAO,EAGL,cAAc,GACf,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,gBAAgB,MAAM,cAAc,CAAC;AAG5C,MAAM,SAAS,GAAG;IAChB,OAAO,EAAE,EAAE;IACX,MAAM,EAAE,EAAE;IACV,aAAa,EAAE,EAAE;CACT,CAAC;AAGX,MAAM,CAAC,MAAM,sBAAsB,GAE9B,UAAU,EACb,OAAO,EAAE,SAAS,EAClB,WAAW,EAAE,OAAO,EAAE,QAAQ,EAC9B,iBAAiB,EACjB,MAAM,EACN,QAAQ,EACR,iBAAiB;AACjB,2BAA2B;AAC3B,cAAc;EACf;;IACC,MAAM,EACJ,mBAAmB,EACnB,gCAAgC,EAChC,MAAM,GACP,GAAG,UAAU,CAAC,UAAU,CAAC,CAAC;IAC3B,MAAM,EAAE,aAAa,EAAE,mBAAmB,EAAE,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAChF,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,aAAP,OAAO,cAAP,OAAO,GAAI,SAAS,CAAC;IAEhE,MAAM,iBAAiB,GAAG,GAAG,OAAO,IAAI,MAAM,OAAO,CAAC;IACtD,0EAA0E;IAC1E,MAAM,uBAAuB,GAAG,aAAa;QAC3C,CAAC,CAAC,gBAAgB,aAAa,IAAI,iBAAiB,EAAE;QACtD,CAAC,CAAC,GAAG,iBAAiB,EAAE,CAAC;IAC3B,gCAAgC;IAChC,qDAAqD;IACrD,oDAAoD;IACpD,MAAM,kBAAkB,GAAG,CACzB,mBAAmB;QACnB,SAAS,CAAC,mBAAmB,CAAC;QAC9B,mBAAmB,CAAC,KAAK,CAAC,uBAAuB,CAAC,CACnD,CAAC;IACF,MAAM,QAAQ,GAAG,kBAAkB;QACjC,CAAC,CAAC,cAAc,mBAAmB,CAAC,EAAE,UAAU,uBAAuB,EAAE;QACzE,CAAC,CAAC,IAAI,uBAAuB,EAAE,CAAC;IAElC,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElE,4DAA4D;IAC5D,gDAAgD;IAEhD,MAAM,UAAU,GAAG,mBAAmB,CAAC,EAAE,SAAS,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAClE,MAAM,IAAI,GAAG,CAAC,CAAA,MAAA,UAAU,CAAC,KAAK,0CAAG,QAAQ,CAAC,KAAI,IAAI,CAAC,CAAC;IAEpD,MAAM,CAAC,eAAe,EAAE,GAAG,CAAC,GAA6C,OAAO,CAAC,GAAG,EAAE;QACpF,IAAI,eAAwB,CAAC;QAC7B,IAAI,GAAkC,CAAC;QACvC,IAAI;YACF,GAAG,GAAG,gCAAgC,CAAC,OAAO,CAAC,CAAC;YAChD,eAAe,GAAG,IAAI,CAAC;SACxB;QAAC,OAAO,CAAC,EAAE;YACV,GAAG,GAAG;gBACJ,KAAK,EAAE,OAAO;gBACd,QAAQ,EAAE,GAAG,EAAE,CAAC,kBAAO,MAAM,CAAQ;aACtC,CAAC;YACF,eAAe,GAAG,KAAK,CAAC;SACzB;QACD,OAAO,CAAC,eAAe,EAAE,GAAG,CAAC,CAAC;IAChC,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,gCAAgC,CAAC,CAAC,CAAC;IAExD,MAAM,IAAI,GAAG,GAAG,CAAC,QAAQ,CAAC;IAE1B,MAAM,QAAQ,GAAG,OAAO,CAAC,CAAC,GAAG,EAAE,WAC7B,OAAA,iBAAiB,aAAjB,iBAAiB,cAAjB,iBAAiB,GAAI,CAAC,CAAC,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,mCAAI,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,OAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAA,EAAA,CACjF,EAAE,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,IAAI,CAAC,GAAG,CAAC,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,CAAC,CAAC,CAAC;IAErD,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI,IAAI,eAAe,IAAI,cAAc,CAAC,IAAI,CAAC,CAAC;IACzE,MAAM,aAAa,GAAG,MAAM,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC;IACjF,MAAM,gBAAgB,GAAG,OAAO,IAAI,aAAa,IAAI,CAAC,QAAQ,CAAC;IAC/D,MAAM,OAAO,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,aAAa,CAAC,IAAI,eAAe,IAAI,CAAC,UAAU,CAAC,UAAU,IAAI,CAAC,MAAM,IAAI,MAAM,CAAC,CAAC;IAEpH,MAAM,IAAI,GAAG,WAAW,CAAC,SAAS,IAAI;QACpC,OAAO,MAAM;YACX,CAAC,CAAC,MAAM,EAAE;YACV,CAAC,CAAC,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,GAAG,SAAS,CAAC,YAAY,KAAK,uBAAuB,EAAE,CAAC,CAAC;IACxE,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IAErB,MAAM,QAAQ,GAAuB,OAAO,CAAC,GAAG,EAAE;;QAChD,IAAI,QAA4B,CAAC;QAEjC,IAAI,OAAO,EAAE;YACX,QAAQ,GAAG;gBACT,IAAC,IAAI,IACH,OAAO,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,EAC3C,QAAQ,EAAE,IAAI,CAAC,IAAI,GACnB;;gBAAM,mBAAQ,MAAA,GAAG,CAAC,KAAK,mCAAI,eAAe,CAAS,CACpD,CAAC;SACL;aAAM;YACL,IAAI,aAAa,EAAE;gBACjB,QAAQ,GAAG;wCAAuB,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,KAAK,CAAQ,CAAC;aAC3D;iBAAM;gBACL,QAAQ,GAAG,uCAA+B,CAAC;aAC5C;SACF;QACD,OAAO,QAAQ,CAAC;IAClB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC;IAEnE,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE;QAC/B,MAAM,wBAAwB,GAAG,MAAM,KAAK,EAAE,IAAI,WAAW,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC;QACxF,MAAM,oBAAoB,GAAG,4BAA4B,CAAA,QAAQ,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC;QAC5F,MAAM,QAAQ,GAAG,OAAO,IAAI,MAAM,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC;QAEpE,IAAI,WAAW,GAAwC,EAAE,CAAC;QAE1D,KAAK,UAAU,eAAe;YAC5B,IAAI,CAAC,WAAW,EAAE;gBAAE,OAAO;aAAE;YAC7B,MAAM,OAAO,GAAG,MAAM,WAAW,EAAE,CAAC;YACpC,OAAO,CAAC,KAAK,CAAC,kBAAkB,EAAE,OAAO,CAAC,CAAC;QAC7C,CAAC;QAED,IAAI,CAAC,OAAO,IAAI,wBAAwB,EAAE;YACxC,WAAW,CAAC,IAAI,CAAC;gBACf,OAAO,EAAE,eAAe;gBACxB,IAAI,EAAE,KAAK;gBACX,IAAI,EAAE,aAAa;gBACnB,MAAM,EAAE,SAAS;gBACjB,KAAK,EAAE,+BAA+B;aACvC,CAAC,CAAC;SACJ;QACD,IAAI,oBAAoB,EAAE;YACxB,WAAW,CAAC,IAAI,CAAC;gBACf,OAAO,EAAE,GAAG,EAAE,CAAC,oBAAoB,CAAC,IAAI,CAAC;gBACzC,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;gBAC9C,MAAM,EAAE,SAAS;gBACjB,KAAK,EAAE,qBAAqB;gBAC5B,kCAAkC;aACnC,CAAC,CAAC;SACJ;QACD,IAAI,QAAQ,EAAE;YACZ,WAAW,CAAC,IAAI,CAAC;gBACf,OAAO,EAAE,OAAO;gBAChB,IAAI,EAAE,QAAQ;gBACd,MAAM,EAAE,QAAQ;gBAChB,KAAK,EAAE,8BAA8B;aACtC,CAAC,CAAC;SACJ;QAED,OAAO,WAAW,CAAC;IACrB,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,UAAU,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC;IAEpE,mEAAmE;IACnE,OAAO,CACL,IAAC,YAAY,IACT,GAAG,EAAC,KAAK,EACT,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,OAAO;YACZ,CAAC,CAAC,GAAG,MAAA,GAAG,CAAC,KAAK,mCAAI,eAAe,SAAS,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,iBAAiB,EAAE;YACvE,CAAC,CAAC,SAAS,KACT,iBAAiB;QAEvB,IAAC,UAAU,IACT,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,CAAC,QAAQ,IAAI,CAAC,OAAO,EAC/B,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,EACtB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,GAAG,CAAA;;;;;;;;;;;;;SAaP,EACD,WAAW,EAAE,QAAQ,EACrB,KAAK,EAAE,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,EAAE,EACnB,KAAK,EAAE,OAAO;gBACZ,CAAC,CAAC,GAAG,MAAA,GAAG,CAAC,KAAK,mCAAI,eAAe,SAAS,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,iBAAiB,EAAE;gBACvE,CAAC,CAAC,SAAS,GACb;QAED,OAAO;YACN,CAAC,CAAC,IAAC,MAAM,IAAC,QAAQ,QAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAC,kBAAkB,GAAG;YAC5D,CAAC,CAAC,IAAI;QAEP,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAC9B,IAAC,MAAM,IAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,WAAK,KAAK,GAAI,CACzC;QAEA,QAAQ;YACP,CAAC,CAAC,IAAC,gBAAgB,IACf,MAAM,EAAE,iBAAiB,EACzB,OAAO,EAAE,GAAG,EAAE,CAAC,oBAAoB,CAAC,KAAK,CAAC,EAC1C,YAAY,EAAE,QAAQ,EACtB,iBAAiB,EAAE,QAAQ,GAC3B;YACJ,CAAC,CAAC,IAAI,CACK,CAChB,CAAC;AACJ,CAAC,CAAC;AAGF,eAAe,sBAAsB,CAAC","sourcesContent":["/** @jsx jsx */\n/** @jsxFrag React.Fragment */\n\nimport { jsx, css } from '@emotion/react';\nimport React, { useContext, useCallback, useMemo, useState } from 'react';\nimport { InputGroup, Button, ControlGroup, type ControlGroupProps, type ButtonProps } from '@blueprintjs/core';\nimport {\n  type GenericRelatedItemViewProps,\n  type RelatedItemClassConfiguration,\n  isRegisterItem,\n} from '../types';\nimport { BrowserCtx } from './BrowserCtx';\nimport { ChangeRequestContext } from './change-request/ChangeRequestContext';\nimport { isDrafted } from '../types/cr';\nimport { Protocols } from './protocolRegistry';\nimport ItemSearchDrawer from './ItemDrawer';\n\n\nconst DUMMY_REF = {\n  classID: '',\n  itemID: '',\n  subregisterID: '',\n} as const;\n\n\nexport const GenericRelatedItemView: React.FC<GenericRelatedItemViewProps & {\n  controlGroupProps?: ControlGroupProps\n}> = function ({\n  itemRef, className,\n  onCreateNew, onClear, onChange,\n  availableClassIDs,\n  onJump,\n  inputRef,\n  controlGroupProps,\n  // availableSubregisterIDs,\n  // itemSorter,\n}) {\n  const {\n    useRegisterItemData,\n    getRelatedItemClassConfiguration,\n    jumpTo,\n  } = useContext(BrowserCtx);\n  const { changeRequest: activeChangeRequest } = useContext(ChangeRequestContext);\n  const { classID, itemID, subregisterID } = itemRef ?? DUMMY_REF;\n\n  const itemPathWithClass = `${classID}/${itemID}.yaml`;\n  // If curretn register has subregisters, specify subregister-relative path\n  const itemPathWithSubregister = subregisterID\n    ? `subregisters/${subregisterID}/${itemPathWithClass}`\n    : `${itemPathWithClass}`;\n  // If a change request is active\n  // and this item is among clarifications or additions\n  // then use item path relative to the change request\n  const affectedByActiveCR = (\n    activeChangeRequest &&\n    isDrafted(activeChangeRequest) &&\n    activeChangeRequest.items[itemPathWithSubregister]\n  );\n  const itemPath = affectedByActiveCR\n    ? `/proposals/${activeChangeRequest.id}/items/${itemPathWithSubregister}`\n    : `/${itemPathWithSubregister}`;\n\n  const [selectDialogState, setSelectDialogState] = useState(false);\n\n  //log.debug(\"Rendering generic related item view\", itemRef);\n  //const { jumpToItem } = useContext(BrowserCtx);\n\n  const itemResult = useRegisterItemData({ itemPaths: [itemPath] });\n  const item = (itemResult.value?.[itemPath] || null);\n\n  const [classConfigured, cfg]: [boolean, RelatedItemClassConfiguration] = useMemo(() => {\n    let classConfigured: boolean;\n    let cfg: RelatedItemClassConfiguration;\n    try {\n      cfg = getRelatedItemClassConfiguration(classID);\n      classConfigured = true;\n    } catch (e) {\n      cfg = {\n        title: classID,\n        itemView: () => <span>{itemID}</span>\n      };\n      classConfigured = false;\n    }\n    return [classConfigured, cfg];\n  }, [itemID, classID, getRelatedItemClassConfiguration]);\n\n  const Item = cfg.itemView;\n\n  const classIDs = useMemo((() =>\n    availableClassIDs ?? ((itemRef?.classID ?? '') !== '' ? [itemRef!.classID] : [])\n  ), [availableClassIDs?.join(','), itemRef?.classID]);\n\n  const hasItem = item !== null && classConfigured && isRegisterItem(item);\n  const itemIsMissing = itemID !== '' && (item === null && !itemResult.isUpdating);\n  const willShowItemView = hasItem || itemIsMissing || !onChange;\n  const canJump = (item !== null || itemIsMissing) && classConfigured && !itemResult.isUpdating && (onJump || jumpTo);\n\n  const jump = useCallback(function jump() {\n    return onJump\n      ? onJump()\n      : jumpTo?.(`${Protocols.ITEM_DETAILS}:/${itemPathWithSubregister}`);\n  }, [onJump, jumpTo]);\n\n  const itemView: JSX.Element | null = useMemo(() => {\n    let itemView: JSX.Element | null;\n\n    if (hasItem) {\n      itemView = <>\n        <Item\n          itemRef={{ classID, itemID, subregisterID }}\n          itemData={item.data}\n        />&emsp;<small>{cfg.title ?? 'unknown class'}</small>\n      </>;\n    } else {\n      if (itemIsMissing) {\n        itemView = <span>Item not found: {itemID ?? 'N/A'}</span>;\n      } else {\n        itemView = <span>Item not specified</span>;\n      }\n    }\n    return itemView;\n  }, [itemID, classID, subregisterID, item, hasItem, itemIsMissing]);\n\n  const itemButtons = useMemo(() => {\n    const canAutoCreateRelatedItem = itemID === '' && onCreateNew && !itemResult.isUpdating;\n    const canChangeRelatedItem = /*classIDs.length >= 1 && */onChange && !itemResult.isUpdating;\n    const canClear = onClear && itemID !== '' && !itemResult.isUpdating;\n\n    let itemButtons: (ButtonProps & { title: string })[] = [];\n\n    async function handleCreateNew() {\n      if (!onCreateNew) { return; }\n      const itemRef = await onCreateNew();\n      console.debug(\"Created new item\", itemRef);\n    }\n\n    if (!hasItem && canAutoCreateRelatedItem) {\n      itemButtons.push({\n        onClick: handleCreateNew,\n        icon: 'add',\n        text: 'Auto create',\n        intent: 'primary',\n        title: \"Automatically create new item\",\n      });\n    }\n    if (canChangeRelatedItem) {\n      itemButtons.push({\n        onClick: () => setSelectDialogState(true),\n        icon: 'edit',\n        text: willShowItemView ? undefined : 'Specify',\n        intent: 'primary',\n        title: \"Select related item\",\n        /*disabled: classIDs.length < 1,*/\n      });\n    }\n    if (canClear) {\n      itemButtons.push({\n        onClick: onClear,\n        icon: 'eraser',\n        intent: 'danger',\n        title: \"Clear related item selection\",\n      });\n    }\n\n    return itemButtons;\n  }, [itemID, itemResult.isUpdating, onCreateNew, onChange, onClear]);\n\n  //log.debug(\"Rendering generic related item view: got item\", item);\n  return (\n    <ControlGroup\n        dir=\"ltr\"\n        className={className}\n        title={hasItem\n          ? `${cfg.title ?? 'unknown class'} item ${itemID ?? 'with unknown ID'}`\n          : undefined}\n        {...controlGroupProps}>\n\n      <InputGroup\n        fill={hasItem}\n        readOnly={!onChange && !onClear}\n        onChange={() => void 0}\n        inputRef={inputRef}\n        css={css`\n          /* leftElement which displays itemView */\n          .bp4-input-left-container {\n            top: unset;\n            bottom: .45em;\n            padding-left: 10px;\n            padding-right: 5px;\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n\n            max-width: 70%;\n          }\n        `}\n        leftElement={itemView}\n        value={itemID ?? ''}\n        title={hasItem\n          ? `${cfg.title ?? 'unknown class'} item ${itemID ?? 'with unknown ID'}`\n          : undefined}\n      />\n\n      {canJump\n        ? <Button outlined onClick={jump} icon=\"open-application\" />\n        : null}\n\n      {itemButtons.map((props, idx) =>\n        <Button key={idx} outlined {...props} />\n      )}\n\n      {onChange\n        ? <ItemSearchDrawer\n            isOpen={selectDialogState}\n            onClose={() => setSelectDialogState(false)}\n            onChooseItem={onChange}\n            availableClassIDs={classIDs}\n          />\n        : null}\n    </ControlGroup>\n  );\n};\n\n\nexport default GenericRelatedItemView;\n"]}
+{"version":3,"file":"GenericRelatedItemView.js","sourceRoot":"","sources":["../../src/views/GenericRelatedItemView.tsx"],"names":[],"mappings":"AAAA,eAAe;AACf,8BAA8B;AAE9B,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,YAAY,EAA4C,MAAM,mBAAmB,CAAC;AAC/G,OAAO,EAGL,cAAc,GACf,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,gBAAgB,MAAM,oBAAoB,CAAC;AAClD,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AAGpD,MAAM,SAAS,GAAG;IAChB,OAAO,EAAE,EAAE;IACX,MAAM,EAAE,EAAE;IACV,aAAa,EAAE,EAAE;CACT,CAAC;AAGX,MAAM,CAAC,MAAM,sBAAsB,GAE9B,UAAU,EACb,OAAO,EAAE,SAAS,EAClB,WAAW,EAAE,OAAO,EAAE,QAAQ,EAC9B,iBAAiB,EACjB,MAAM,EACN,QAAQ,EACR,iBAAiB;AACjB,2BAA2B;AAC3B,cAAc;EACf;;IACC,MAAM,EACJ,mBAAmB,EACnB,gCAAgC,EAChC,MAAM,GACP,GAAG,UAAU,CAAC,UAAU,CAAC,CAAC;IAC3B,MAAM,EAAE,aAAa,EAAE,mBAAmB,EAAE,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAChF,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,aAAP,OAAO,cAAP,OAAO,GAAI,SAAS,CAAC;IAEhE,MAAM,iBAAiB,GAAG,GAAG,OAAO,IAAI,MAAM,OAAO,CAAC;IACtD,0EAA0E;IAC1E,MAAM,uBAAuB,GAAG,aAAa;QAC3C,CAAC,CAAC,gBAAgB,aAAa,IAAI,iBAAiB,EAAE;QACtD,CAAC,CAAC,GAAG,iBAAiB,EAAE,CAAC;IAC3B,gCAAgC;IAChC,qDAAqD;IACrD,oDAAoD;IACpD,MAAM,kBAAkB,GAAG,CACzB,mBAAmB;QACnB,SAAS,CAAC,mBAAmB,CAAC;QAC9B,mBAAmB,CAAC,KAAK,CAAC,uBAAuB,CAAC,CACnD,CAAC;IACF,MAAM,QAAQ,GAAG,kBAAkB;QACjC,CAAC,CAAC,cAAc,mBAAmB,CAAC,EAAE,UAAU,uBAAuB,EAAE;QACzE,CAAC,CAAC,IAAI,uBAAuB,EAAE,CAAC;IAElC,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClE,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpE,4DAA4D;IAC5D,gDAAgD;IAEhD,MAAM,UAAU,GAAG,mBAAmB,CAAC,EAAE,SAAS,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAClE,MAAM,IAAI,GAAG,CAAC,CAAA,MAAA,UAAU,CAAC,KAAK,0CAAG,QAAQ,CAAC,KAAI,IAAI,CAAC,CAAC;IAEpD,MAAM,CAAC,eAAe,EAAE,GAAG,CAAC,GAA6C,OAAO,CAAC,GAAG,EAAE;QACpF,IAAI,eAAwB,CAAC;QAC7B,IAAI,GAAkC,CAAC;QACvC,IAAI;YACF,GAAG,GAAG,gCAAgC,CAAC,OAAO,CAAC,CAAC;YAChD,eAAe,GAAG,IAAI,CAAC;SACxB;QAAC,OAAO,CAAC,EAAE;YACV,GAAG,GAAG;gBACJ,KAAK,EAAE,OAAO;gBACd,QAAQ,EAAE,GAAG,EAAE,CAAC,kBAAO,MAAM,CAAQ;aACtC,CAAC;YACF,eAAe,GAAG,KAAK,CAAC;SACzB;QACD,OAAO,CAAC,eAAe,EAAE,GAAG,CAAC,CAAC;IAChC,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,gCAAgC,CAAC,CAAC,CAAC;IAExD,MAAM,IAAI,GAAG,GAAG,CAAC,QAAQ,CAAC;IAE1B,MAAM,QAAQ,GAAG,OAAO,CAAC,CAAC,GAAG,EAAE,WAC7B,OAAA,iBAAiB,aAAjB,iBAAiB,cAAjB,iBAAiB,GAAI,CAAC,CAAC,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,mCAAI,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,OAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAA,EAAA,CACjF,EAAE,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,IAAI,CAAC,GAAG,CAAC,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,CAAC,CAAC,CAAC;IAErD,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI,IAAI,eAAe,IAAI,cAAc,CAAC,IAAI,CAAC,CAAC;IACzE,MAAM,aAAa,GAAG,MAAM,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC;IACjF,MAAM,gBAAgB,GAAG,OAAO,IAAI,aAAa,IAAI,CAAC,QAAQ,CAAC;IAC/D,MAAM,OAAO,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,aAAa,CAAC,IAAI,eAAe,IAAI,CAAC,UAAU,CAAC,UAAU,IAAI,CAAC,MAAM,IAAI,MAAM,CAAC,CAAC;IAEpH,MAAM,IAAI,GAAG,WAAW,CAAC,SAAS,IAAI;QACpC,OAAO,MAAM;YACX,CAAC,CAAC,MAAM,EAAE;YACV,CAAC,CAAC,qBAAqB,CAAC,IAAI,CAAC,CAAA;IACjC,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IAErB,MAAM,QAAQ,GAAuB,OAAO,CAAC,GAAG,EAAE;;QAChD,IAAI,QAA4B,CAAC;QAEjC,IAAI,OAAO,EAAE;YACX,QAAQ,GAAG;gBACT,IAAC,IAAI,IACH,OAAO,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,EAC3C,QAAQ,EAAE,IAAI,CAAC,IAAI,GACnB;;gBAAM,mBAAQ,MAAA,GAAG,CAAC,KAAK,mCAAI,eAAe,CAAS,CACpD,CAAC;SACL;aAAM;YACL,IAAI,aAAa,EAAE;gBACjB,QAAQ,GAAG;wCAAuB,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,KAAK,CAAQ,CAAC;aAC3D;iBAAM;gBACL,QAAQ,GAAG,uCAA+B,CAAC;aAC5C;SACF;QACD,OAAO,QAAQ,CAAC;IAClB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC;IAEnE,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE;QAC/B,MAAM,wBAAwB,GAAG,MAAM,KAAK,EAAE,IAAI,WAAW,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC;QACxF,MAAM,oBAAoB,GAAG,4BAA4B,CAAA,QAAQ,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC;QAC5F,MAAM,QAAQ,GAAG,OAAO,IAAI,MAAM,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC;QAEpE,IAAI,WAAW,GAAwC,EAAE,CAAC;QAE1D,KAAK,UAAU,eAAe;YAC5B,IAAI,CAAC,WAAW,EAAE;gBAAE,OAAO;aAAE;YAC7B,MAAM,OAAO,GAAG,MAAM,WAAW,EAAE,CAAC;YACpC,OAAO,CAAC,KAAK,CAAC,kBAAkB,EAAE,OAAO,CAAC,CAAC;QAC7C,CAAC;QAED,IAAI,CAAC,OAAO,IAAI,wBAAwB,EAAE;YACxC,WAAW,CAAC,IAAI,CAAC;gBACf,OAAO,EAAE,eAAe;gBACxB,IAAI,EAAE,KAAK;gBACX,IAAI,EAAE,aAAa;gBACnB,MAAM,EAAE,SAAS;gBACjB,KAAK,EAAE,+BAA+B;aACvC,CAAC,CAAC;SACJ;QACD,IAAI,oBAAoB,EAAE;YACxB,WAAW,CAAC,IAAI,CAAC;gBACf,OAAO,EAAE,GAAG,EAAE,CAAC,oBAAoB,CAAC,IAAI,CAAC;gBACzC,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;gBAC9C,MAAM,EAAE,SAAS;gBACjB,KAAK,EAAE,qBAAqB;gBAC5B,kCAAkC;aACnC,CAAC,CAAC;SACJ;QACD,IAAI,QAAQ,EAAE;YACZ,WAAW,CAAC,IAAI,CAAC;gBACf,OAAO,EAAE,OAAO;gBAChB,IAAI,EAAE,QAAQ;gBACd,MAAM,EAAE,QAAQ;gBAChB,KAAK,EAAE,8BAA8B;aACtC,CAAC,CAAC;SACJ;QAED,OAAO,WAAW,CAAC;IACrB,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,UAAU,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC;IAEpE,mEAAmE;IACnE,OAAO,CACL,IAAC,YAAY,IACT,GAAG,EAAC,KAAK,EACT,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,OAAO;YACZ,CAAC,CAAC,GAAG,MAAA,GAAG,CAAC,KAAK,mCAAI,eAAe,SAAS,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,iBAAiB,EAAE;YACvE,CAAC,CAAC,SAAS,KACT,iBAAiB;QAEvB,IAAC,UAAU,IACT,IAAI,EAAE,OAAO,EACb,QAAQ,EAAE,CAAC,QAAQ,IAAI,CAAC,OAAO,EAC/B,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,EACtB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,GAAG,CAAA;;;;;;;;;;;;;SAaP,EACD,WAAW,EAAE,QAAQ,EACrB,KAAK,EAAE,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,EAAE,EACnB,KAAK,EAAE,OAAO;gBACZ,CAAC,CAAC,GAAG,MAAA,GAAG,CAAC,KAAK,mCAAI,eAAe,SAAS,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,iBAAiB,EAAE;gBACvE,CAAC,CAAC,SAAS,GACb;QAED,OAAO;YACN,CAAC,CAAC,IAAC,MAAM,IAAC,QAAQ,QAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAC,UAAU,GAAG;YACpD,CAAC,CAAC,IAAI;QAEP,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAC9B,IAAC,MAAM,IAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,WAAK,KAAK,GAAI,CACzC;QAED,IAAC,gBAAgB,IACf,MAAM,EAAE,iBAAiB,EACzB,OAAO,EAAE,GAAG,EAAE,CAAC,oBAAoB,CAAC,KAAK,CAAC,EAC1C,YAAY,EAAE,QAAQ,EACtB,iBAAiB,EAAE,QAAQ,GAC3B;QAED,OAAO;YACN,CAAC,CAAC,IAAC,iBAAiB,IAChB,MAAM,EAAE,kBAAkB,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAC3C,OAAO,EAAE,OAAO,GAChB;YACJ,CAAC,CAAC,IAAI,CAEK,CAChB,CAAC;AACJ,CAAC,CAAC;AAGF,eAAe,sBAAsB,CAAC","sourcesContent":["/** @jsx jsx */\n/** @jsxFrag React.Fragment */\n\nimport { jsx, css } from '@emotion/react';\nimport React, { useContext, useCallback, useMemo, useState } from 'react';\nimport { InputGroup, Button, ControlGroup, type ControlGroupProps, type ButtonProps } from '@blueprintjs/core';\nimport {\n  type GenericRelatedItemViewProps,\n  type RelatedItemClassConfiguration,\n  isRegisterItem,\n} from '../types';\nimport { BrowserCtx } from './BrowserCtx';\nimport { ChangeRequestContext } from './change-request/ChangeRequestContext';\nimport { isDrafted } from '../types/cr';\nimport ItemSearchDrawer from './ItemSearchDrawer';\nimport ItemDetailsDrawer from './ItemDetailsDrawer';\n\n\nconst DUMMY_REF = {\n  classID: '',\n  itemID: '',\n  subregisterID: '',\n} as const;\n\n\nexport const GenericRelatedItemView: React.FC<GenericRelatedItemViewProps & {\n  controlGroupProps?: ControlGroupProps\n}> = function ({\n  itemRef, className,\n  onCreateNew, onClear, onChange,\n  availableClassIDs,\n  onJump,\n  inputRef,\n  controlGroupProps,\n  // availableSubregisterIDs,\n  // itemSorter,\n}) {\n  const {\n    useRegisterItemData,\n    getRelatedItemClassConfiguration,\n    jumpTo,\n  } = useContext(BrowserCtx);\n  const { changeRequest: activeChangeRequest } = useContext(ChangeRequestContext);\n  const { classID, itemID, subregisterID } = itemRef ?? DUMMY_REF;\n\n  const itemPathWithClass = `${classID}/${itemID}.yaml`;\n  // If curretn register has subregisters, specify subregister-relative path\n  const itemPathWithSubregister = subregisterID\n    ? `subregisters/${subregisterID}/${itemPathWithClass}`\n    : `${itemPathWithClass}`;\n  // If a change request is active\n  // and this item is among clarifications or additions\n  // then use item path relative to the change request\n  const affectedByActiveCR = (\n    activeChangeRequest &&\n    isDrafted(activeChangeRequest) &&\n    activeChangeRequest.items[itemPathWithSubregister]\n  );\n  const itemPath = affectedByActiveCR\n    ? `/proposals/${activeChangeRequest.id}/items/${itemPathWithSubregister}`\n    : `/${itemPathWithSubregister}`;\n\n  const [selectDialogState, setSelectDialogState] = useState(false);\n  const [peekingDrawerState, setPeekingDrawerState] = useState(false);\n\n  //log.debug(\"Rendering generic related item view\", itemRef);\n  //const { jumpToItem } = useContext(BrowserCtx);\n\n  const itemResult = useRegisterItemData({ itemPaths: [itemPath] });\n  const item = (itemResult.value?.[itemPath] || null);\n\n  const [classConfigured, cfg]: [boolean, RelatedItemClassConfiguration] = useMemo(() => {\n    let classConfigured: boolean;\n    let cfg: RelatedItemClassConfiguration;\n    try {\n      cfg = getRelatedItemClassConfiguration(classID);\n      classConfigured = true;\n    } catch (e) {\n      cfg = {\n        title: classID,\n        itemView: () => <span>{itemID}</span>\n      };\n      classConfigured = false;\n    }\n    return [classConfigured, cfg];\n  }, [itemID, classID, getRelatedItemClassConfiguration]);\n\n  const Item = cfg.itemView;\n\n  const classIDs = useMemo((() =>\n    availableClassIDs ?? ((itemRef?.classID ?? '') !== '' ? [itemRef!.classID] : [])\n  ), [availableClassIDs?.join(','), itemRef?.classID]);\n\n  const hasItem = item !== null && classConfigured && isRegisterItem(item);\n  const itemIsMissing = itemID !== '' && (item === null && !itemResult.isUpdating);\n  const willShowItemView = hasItem || itemIsMissing || !onChange;\n  const canJump = (item !== null || itemIsMissing) && classConfigured && !itemResult.isUpdating && (onJump || jumpTo);\n\n  const jump = useCallback(function jump() {\n    return onJump\n      ? onJump()\n      : setPeekingDrawerState(true)\n  }, [onJump, jumpTo]);\n\n  const itemView: JSX.Element | null = useMemo(() => {\n    let itemView: JSX.Element | null;\n\n    if (hasItem) {\n      itemView = <>\n        <Item\n          itemRef={{ classID, itemID, subregisterID }}\n          itemData={item.data}\n        />&emsp;<small>{cfg.title ?? 'unknown class'}</small>\n      </>;\n    } else {\n      if (itemIsMissing) {\n        itemView = <span>Item not found: {itemID ?? 'N/A'}</span>;\n      } else {\n        itemView = <span>Item not specified</span>;\n      }\n    }\n    return itemView;\n  }, [itemID, classID, subregisterID, item, hasItem, itemIsMissing]);\n\n  const itemButtons = useMemo(() => {\n    const canAutoCreateRelatedItem = itemID === '' && onCreateNew && !itemResult.isUpdating;\n    const canChangeRelatedItem = /*classIDs.length >= 1 && */onChange && !itemResult.isUpdating;\n    const canClear = onClear && itemID !== '' && !itemResult.isUpdating;\n\n    let itemButtons: (ButtonProps & { title: string })[] = [];\n\n    async function handleCreateNew() {\n      if (!onCreateNew) { return; }\n      const itemRef = await onCreateNew();\n      console.debug(\"Created new item\", itemRef);\n    }\n\n    if (!hasItem && canAutoCreateRelatedItem) {\n      itemButtons.push({\n        onClick: handleCreateNew,\n        icon: 'add',\n        text: 'Auto create',\n        intent: 'primary',\n        title: \"Automatically create new item\",\n      });\n    }\n    if (canChangeRelatedItem) {\n      itemButtons.push({\n        onClick: () => setSelectDialogState(true),\n        icon: 'edit',\n        text: willShowItemView ? undefined : 'Specify',\n        intent: 'primary',\n        title: \"Select related item\",\n        /*disabled: classIDs.length < 1,*/\n      });\n    }\n    if (canClear) {\n      itemButtons.push({\n        onClick: onClear,\n        icon: 'eraser',\n        intent: 'danger',\n        title: \"Clear related item selection\",\n      });\n    }\n\n    return itemButtons;\n  }, [itemID, itemResult.isUpdating, onCreateNew, onChange, onClear]);\n\n  //log.debug(\"Rendering generic related item view: got item\", item);\n  return (\n    <ControlGroup\n        dir=\"ltr\"\n        className={className}\n        title={hasItem\n          ? `${cfg.title ?? 'unknown class'} item ${itemID ?? 'with unknown ID'}`\n          : undefined}\n        {...controlGroupProps}>\n\n      <InputGroup\n        fill={hasItem}\n        readOnly={!onChange && !onClear}\n        onChange={() => void 0}\n        inputRef={inputRef}\n        css={css`\n          /* leftElement which displays itemView */\n          .bp4-input-left-container {\n            top: unset;\n            bottom: .45em;\n            padding-left: 10px;\n            padding-right: 5px;\n            white-space: nowrap;\n            overflow: hidden;\n            text-overflow: ellipsis;\n\n            max-width: 70%;\n          }\n        `}\n        leftElement={itemView}\n        value={itemID ?? ''}\n        title={hasItem\n          ? `${cfg.title ?? 'unknown class'} item ${itemID ?? 'with unknown ID'}`\n          : undefined}\n      />\n\n      {canJump\n        ? <Button outlined onClick={jump} icon=\"maximize\" />\n        : null}\n\n      {itemButtons.map((props, idx) =>\n        <Button key={idx} outlined {...props} />\n      )}\n\n      <ItemSearchDrawer\n        isOpen={selectDialogState}\n        onClose={() => setSelectDialogState(false)}\n        onChooseItem={onChange}\n        availableClassIDs={classIDs}\n      />\n\n      {itemRef\n        ? <ItemDetailsDrawer\n            isOpen={peekingDrawerState}\n            onClose={() => setPeekingDrawerState(false)}\n            itemRef={itemRef}\n          />\n        : null}\n\n    </ControlGroup>\n  );\n};\n\n\nexport default GenericRelatedItemView;\n"]}

package/views/ItemDetailsDrawer.d.ts

@@ -0,0 +1,11 @@
+/** @jsx jsx */
+/** @jsxFrag React.Fragment */
+import React from 'react';
+import type { InternalItemReference } from '../types';
+declare const ItemDetailDrawer: React.FC<{
+    itemRef: InternalItemReference;
+    isOpen: boolean;
+    usePortal?: boolean;
+    onClose: () => void;
+}>;
+export default ItemDetailDrawer;

package/views/ItemDetailsDrawer.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = require("@emotion/react");
+
+var _react2 = require("react");
+
+var _core = require("@blueprintjs/core");
+
+var _context = require("@riboseinc/paneron-extension-kit/widgets/TabbedWorkspace/context");
+
+var _RegisterItem = _interopRequireDefault(require("./detail/RegisterItem"));
+
+var _protocolRegistry = require("./protocolRegistry");
+
+var _itemPathUtils = require("./itemPathUtils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/** @jsx jsx */
+
+/** @jsxFrag React.Fragment */
+const ItemDetailDrawer = function ({
+  itemRef,
+  usePortal,
+  isOpen,
+  onClose
+}) {
+  const {
+    spawnTab
+  } = (0, _react2.useContext)(_context.TabbedWorkspaceContext);
+  const path = (0, _itemPathUtils.itemRefToItemPath)(itemRef);
+  return (0, _react.jsx)(_core.Drawer, {
+    isOpen: isOpen,
+    usePortal: usePortal,
+    onClose: onClose,
+    enforceFocus: false,
+    size: _core.DrawerSize.LARGE,
+    css: (0, _react.css)`display: flex; flex-flow: column nowrap;`,
+    style: {
+      padding: '0',
+      width: 'unset'
+    }
+  }, (0, _react.jsx)(_core.ButtonGroup, {
+    fill: true
+  }, (0, _react.jsx)(_core.Button, {
+    icon: "open-application",
+    onClick: () => {
+      onClose();
+      spawnTab(`${_protocolRegistry.Protocols.ITEM_DETAILS}:${path}`);
+    },
+    text: "Open in a tab"
+  }), (0, _react.jsx)(_core.Button, {
+    icon: "minimize",
+    onClick: onClose,
+    text: "Minimize"
+  })), (0, _react.jsx)("div", {
+    css: (0, _react.css)`position: relative; flex: 1;`
+  }, (0, _react.jsx)(_RegisterItem.default.main, {
+    uri: path
+  })));
+};
+
+var _default = ItemDetailDrawer;
+exports.default = _default;

package/views/ItemDetailsDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ItemDetailsDrawer.js","sourceRoot":"","sources":["../../src/views/ItemDetailsDrawer.tsx"],"names":[],"mappings":"AAAA,eAAe;AACf,8BAA8B;AAE9B,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAc,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE5E,OAAO,EAAE,sBAAsB,EAAE,MAAM,kEAAkE,CAAC;AAC1G,OAAO,eAAe,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAGpD,MAAM,gBAAgB,GAKjB,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE;IACpD,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,sBAAsB,CAAC,CAAC;IACxD,MAAM,IAAI,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;IAExC,OAAO,CACL,IAAC,MAAM,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,KAAK,EACnB,IAAI,EAAE,UAAU,CAAC,KAAK,EACtB,GAAG,EAAE,GAAG,CAAA,0CAA0C,EAClD,KAAK,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE;QACzC,IAAC,WAAW,IAAC,IAAI;YACf,IAAC,MAAM,IACL,IAAI,EAAC,kBAAkB,EACvB,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,EAAE,CAAC,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC,YAAY,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAC5E,IAAI,EAAC,eAAe,GACpB;YACF,IAAC,MAAM,IACL,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,OAAO,EAChB,IAAI,EAAC,UAAU,GACf,CACU;QACd,aAAK,GAAG,EAAE,GAAG,CAAA,8BAA8B;YACzC,IAAC,eAAe,CAAC,IAAI,IAAC,GAAG,EAAE,IAAI,GAAI,CAC/B,CACC,CACV,CAAC;AACJ,CAAC,CAAC;AAGF,eAAe,gBAAgB,CAAC","sourcesContent":["/** @jsx jsx */\n/** @jsxFrag React.Fragment */\n\nimport { jsx, css } from '@emotion/react';\nimport React, { useContext } from 'react';\nimport { Button, ButtonGroup, Drawer, DrawerSize } from '@blueprintjs/core';\nimport type { InternalItemReference } from '../types';\nimport { TabbedWorkspaceContext } from '@riboseinc/paneron-extension-kit/widgets/TabbedWorkspace/context';\nimport MaybeItemDetail from './detail/RegisterItem';\nimport { Protocols } from './protocolRegistry';\nimport { itemRefToItemPath } from './itemPathUtils';\n\n\nconst ItemDetailDrawer: React.FC<{\n  itemRef: InternalItemReference\n  isOpen: boolean\n  usePortal?: boolean\n  onClose: () => void\n}> = function ({ itemRef, usePortal, isOpen, onClose }) {\n  const { spawnTab } = useContext(TabbedWorkspaceContext);\n  const path = itemRefToItemPath(itemRef);\n\n  return (\n    <Drawer\n        isOpen={isOpen}\n        usePortal={usePortal}\n        onClose={onClose}\n        enforceFocus={false}\n        size={DrawerSize.LARGE}\n        css={css`display: flex; flex-flow: column nowrap;`}\n        style={{ padding: '0', width: 'unset' }}>\n      <ButtonGroup fill>\n        <Button\n          icon=\"open-application\"\n          onClick={() => { onClose(); spawnTab(`${Protocols.ITEM_DETAILS}:${path}`); }}\n          text=\"Open in a tab\"\n        />\n        <Button\n          icon=\"minimize\"\n          onClick={onClose}\n          text=\"Minimize\"\n        />\n      </ButtonGroup>\n      <div css={css`position: relative; flex: 1;`}>\n        <MaybeItemDetail.main uri={path} />\n      </div>\n    </Drawer>\n  );\n};\n\n\nexport default ItemDetailDrawer;\n"]}

package/views/{ItemDrawer.d.ts → ItemSearchDrawer.d.ts}

@@ -5,7 +5,7 @@ import type { InternalItemReference } from '../types';
 declare const ItemSearchDrawer: React.FC<{
     isOpen: boolean;
     onClose: () => void;
-    onChooseItem: (itemRef: InternalItemReference) => void;
+    onChooseItem?: (itemRef: InternalItemReference) => void;
     availableClassIDs: string[];
 }>;
 export default ItemSearchDrawer;

package/views/{ItemDrawer.js → ItemSearchDrawer.js}

@@ -40,13 +40,14 @@ const ItemSearchDrawer = function ({
     criteria: classCriteria
   } : undefined, [classCriteria]);
   const handleOpenItem = (0, _react2.useCallback)(itemPath => {
-    onChooseItem((0, _itemPathUtils.itemPathToItemRef)(subregisters !== undefined, itemPath));
+    onChooseItem === null || onChooseItem === void 0 ? void 0 : onChooseItem((0, _itemPathUtils.itemPathToItemRef)(subregisters !== undefined, itemPath));
     onClose();
   }, [onChooseItem, onClose]);
   return (0, _react.jsx)(_core.Drawer, {
     isOpen: isOpen,
     onClose: onClose,
     enforceFocus: false,
+    size: "50vw",
     style: {
       padding: '0',
       width: 'unset'
@@ -54,14 +55,14 @@ const ItemSearchDrawer = function ({
   }, (0, _react.jsx)(_Search.default, {
     style: {
       height: '100vh',
-      width: '80vw',
+      width: '50vw',
       minWidth: '500px',
-      maxWidth: '100vw'
+      maxWidth: '90vw'
     },
     availableClassIDs: availableClassIDs,
     implicitCriteria: implicitCriteria,
     stateName: "superseding-item-selector-search",
-    onOpenItem: handleOpenItem
+    onOpenItem: onChooseItem ? handleOpenItem : undefined
   }));
 };
 

package/views/ItemSearchDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ItemSearchDrawer.js","sourceRoot":"","sources":["../../src/views/ItemSearchDrawer.tsx"],"names":[],"mappings":"AAAA,eAAe;AACf,8BAA8B;AAE9B,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAc,EAAE,UAAU,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAG3C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,MAAM,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAGpD,MAAM,gBAAgB,GAKjB,UAAU,EACb,MAAM,EAAE,OAAO,EAAE,YAAY,EAC7B,iBAAiB,GAClB;IACC,MAAM,EAAE,YAAY,EAAE,GAAG,UAAU,CAAC,UAAU,CAAC,CAAC;IAEhD,MAAM,aAAa,GAAgB,OAAO,CAAC,GAAG,EAAE,CAAC,CAC/C,iBAAiB,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QAC9B,GAAG,EAAE,YAAY;QACjB,KAAK,EAAE,sBAAsB,KAAK,WAAW;KAC9C,CAAC,CAAC,CACJ,EAAE,CAAC,iBAAiB,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;IAEnC,MAAM,gBAAgB,GAA8B,OAAO,CAAC,GAAG,EAAE,CAAC,CAChE,aAAa,CAAC,MAAM,GAAG,CAAC;QACtB,CAAC,CAAC;YACE,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,aAAa;SACxB;QACH,CAAC,CAAC,SAAS,CACd,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,QAAQ,EAAE,EAAE;QAC9C,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,iBAAiB,CAAC,YAAY,KAAK,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;QACxE,OAAO,EAAE,CAAC;IACZ,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC;IAE5B,OAAO,CACL,IAAC,MAAM,IACH,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,KAAK,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE;QACzC,IAAC,MAAM,IACL,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAC9E,iBAAiB,EAAE,iBAAiB,EACpC,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAC,kCAAkC,EAC5C,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,GACrD,CACK,CACV,CAAC;AACJ,CAAC,CAAC;AAGF,eAAe,gBAAgB,CAAC","sourcesContent":["/** @jsx jsx */\n/** @jsxFrag React.Fragment */\n\nimport { jsx } from '@emotion/react';\nimport React, { useContext, useMemo, useCallback } from 'react';\nimport { Drawer } from '@blueprintjs/core';\nimport type { InternalItemReference } from '../types';\nimport type { Criterion, CriteriaGroup } from './FilterCriteria/models';\nimport { BrowserCtx } from './BrowserCtx';\nimport Search from './sidebar/Search';\nimport { itemPathToItemRef } from './itemPathUtils';\n\n\nconst ItemSearchDrawer: React.FC<{\n  isOpen: boolean\n  onClose: () => void\n  onChooseItem?: (itemRef: InternalItemReference) => void\n  availableClassIDs: string[]\n}> = function ({\n  isOpen, onClose, onChooseItem,\n  availableClassIDs,\n}) {\n  const { subregisters } = useContext(BrowserCtx);\n\n  const classCriteria: Criterion[] = useMemo(() => (\n    availableClassIDs.map(clsID => ({\n      key: 'item-class',\n      query: `objPath.indexOf(\\\"/${clsID}/\\\") >= 0`,\n    }))\n  ), [availableClassIDs.toString()]);\n\n  const implicitCriteria: CriteriaGroup | undefined = useMemo(() => (\n    classCriteria.length > 0\n      ? {\n          require: 'any',\n          criteria: classCriteria,\n        }\n      : undefined\n  ), [classCriteria]);\n\n  const handleOpenItem = useCallback((itemPath) => {\n    onChooseItem?.(itemPathToItemRef(subregisters !== undefined, itemPath));\n    onClose();\n  }, [onChooseItem, onClose]);\n\n  return (\n    <Drawer\n        isOpen={isOpen}\n        onClose={onClose}\n        enforceFocus={false}\n        size=\"50vw\"\n        style={{ padding: '0', width: 'unset' }}>\n      <Search\n        style={{ height: '100vh', width: '50vw', minWidth: '500px', maxWidth: '90vw' }}\n        availableClassIDs={availableClassIDs}\n        implicitCriteria={implicitCriteria}\n        stateName=\"superseding-item-selector-search\"\n        onOpenItem={onChooseItem ? handleOpenItem : undefined}\n      />\n    </Drawer>\n  );\n};\n\n\nexport default ItemSearchDrawer;\n"]}

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

@@ -6,12 +6,13 @@ import type { ChangeProposal, Clarification, InternalItemReference, Payload, Reg
 import type { Drafted } from '../../types/cr';
 interface ProposalBrowserProps<CR extends Drafted> {
     proposals: CR['items'];
+    selectedItem?: (string & keyof CR['items']) | null;
+    onSelectItem: (selectedItem: (string & keyof CR['items']) | null) => void;
     /**
      * If provided, button to delete each proposed change
      * is shown in change card list mode.
      */
     onDeleteProposalForItemAtPath?: (itemPath: string) => void;
-    className?: string;
 }
 /**
  * Shows a list of individual proposed changes as cards by default,
@@ -19,7 +20,7 @@ interface ProposalBrowserProps<CR extends Drafted> {
  *
  * If no proposals exist, returns null.
  */
-export declare function Proposals<CR extends Drafted>({ proposals, onDeleteProposalForItemAtPath, className }: ProposalBrowserProps<CR>): jsx.JSX.Element | null;
+export declare function Proposals<CR extends Drafted>({ proposals, onDeleteProposalForItemAtPath, selectedItem, onSelectItem: selectProposal }: ProposalBrowserProps<CR>): jsx.JSX.Element;
 interface ProposalProps<P extends ChangeProposal> {
     proposal: P;
     /** Highlight changes. */

package/views/change-request/Proposals.js

@@ -59,12 +59,13 @@ function stringifiedJSONEqual(i1, i2) {
 function Proposals({
   proposals,
   onDeleteProposalForItemAtPath,
-  className
+  selectedItem,
+  onSelectItem: selectProposal
 }) {
-  var _a, _b;
+  var _a;
 
-  const [selectedProposal, selectProposal] = (0, _react.useState)(null);
-  const [preferDiff, setPreferDiff] = (0, _react.useState)(false); // TODO: Temporarily unsupported
+  const [preferDiff, setPreferDiff] = (0, _react.useState)(false);
+  const selectedProposal = selectedItem !== null && selectedItem !== void 0 ? selectedItem : null; // TODO: Temporarily unsupported
   // (limitations of current change annotation implementation)
   //const [ showOnlyChanged, setShowOnlyChanged ] = useState(true);
 
@@ -150,156 +151,134 @@ function Proposals({
     };
   }), [proposals, getCurrentItem, getProposedItem]);
   const haveSelectedItem = selectedProposal && selectedItemRef && proposals[selectedProposal] && (selectedItemProposed || selectedItemCurrent);
-  const proposalCount = Object.keys(proposals).length;
-  const selectedProposalDetailRef = (0, _react.useRef)(null);
-  (0, _react.useEffect)(() => {
-    // if (!selectedProposal) {
-    //   const firstProposal = Object.keys(proposals)[0];
-    //   if (firstProposal) {
-    //     if (getCurrentItem(firstProposal) || getProposedItem(firstProposal)) {
-    //       selectProposal(firstProposal);
-    //     }
-    //   }
-    // }
-    if (selectedProposal) {
-      if (selectedProposalDetailRef.current) {
-        selectedProposalDetailRef.current.scrollIntoView({
-          block: 'center'
-        });
-      }
-    }
-  }, [selectedProposal === null]);
+  const proposalCount = Object.keys(proposals).length; //useEffect(() => {
+  //  // if (!selectedProposal) {
+  //  //   const firstProposal = Object.keys(proposals)[0];
+  //  //   if (firstProposal) {
+  //  //     if (getCurrentItem(firstProposal) || getProposedItem(firstProposal)) {
+  //  //       selectProposal(firstProposal);
+  //  //     }
+  //  //   }
+  //  // }
+  //  if (selectedProposal) {
+  //    if (selectedProposalDetailRef.current) {
+  //      selectedProposalDetailRef.current.scrollIntoView({ block: 'center' });
+  //    }
+  //  }
+  //}, [selectedProposal === null]);
+
   const canShowDiff = haveSelectedItem && ((_a = proposals[selectedProposal]) === null || _a === void 0 ? void 0 : _a.type) === 'clarification' ? true : false;
   const showDiff = canShowDiff && preferDiff;
+  const selectedItemSummary = haveSelectedItem ? (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]
+  }) : (0, _react2.jsx)(_react.default.Fragment, null, "Select item\u2026");
+  const icon = haveSelectedItem ? getProposalIcon(proposals[selectedProposal]) : undefined;
+  const selectedItemDrawer = (0, _react.useMemo)(() => {
+    var _a;
 
-  if (!currentItemDataReq.isUpdating && !proposedItemDataReq.isUpdating) {
-    const selectedItemSummary = haveSelectedItem ? (0, _react2.jsx)(ProposalSummary, {
+    return (0, _react2.jsx)(_core.Drawer, {
+      isOpen: proposalCount > 0 && haveSelectedItem ? true : false,
+      onClose: () => selectProposal(null),
+      size: _core.DrawerSize.LARGE,
+      enforceFocus: false
+    }, proposalCount > 0 && haveSelectedItem ? (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_core.ButtonGroup, null, (0, _react2.jsx)(_core.Button, {
+      disabled: !jumpTo || ((_a = proposals[selectedProposal]) === null || _a === void 0 ? void 0 : _a.type) === 'addition',
+      icon: 'open-application',
+      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)"
+    }), (0, _react2.jsx)(_core.Button, {
+      active: preferDiff,
+      onClick: () => setPreferDiff(v => !v),
+      // Diffing only makes sense for clarifications.
+      // Additions are entire new items, and for amendments
+      // item data is unchanged.
+      disabled: !canShowDiff,
+      text: "Compare",
+      title: "Annotate proposed clarifications for this item"
+    }), (0, _react2.jsx)(_react2.ClassNames, null, ({
+      css: css2
+    }) => (0, _react2.jsx)(_select.Select2, {
+      filterable: false,
+      itemsEqual: stringifiedJSONEqual,
+      menuProps: {
+        className: css2(`max-height: 50vh; overflow-y: auto;`)
+      },
+      activeItem: activeItem,
+      items: allItems,
+      popoverProps: {
+        minimal: true,
+        matchTargetWidth: true
+      },
+      fill: true,
+      itemRenderer: ChangeProposalItemView,
+      onItemSelect: handleItemSelect
+    }, (0, _react2.jsx)(_core.Button, {
+      fill: true,
+      rightIcon: "chevron-down",
+      icon: icon,
+      title: "Switch between items in this proposal",
+      css: (0, _react2.css)`white-space: nowrap;`
+    }, selectedItemSummary))), (0, _react2.jsx)(_core.Button, {
+      onClick: () => selectProposal(null),
+      icon: "minimize",
+      title: "Minimize proposed change view",
+      text: "Minimize"
+    })), (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]
-    }) : (0, _react2.jsx)(_react.default.Fragment, null, "Select item\u2026");
-    const icon = haveSelectedItem ? getProposalIcon(proposals[selectedProposal]) : undefined;
-
-    if (proposalCount > 0 && haveSelectedItem) {
-      return (0, _react2.jsx)(_core.Card, {
-        key: selectedProposal,
-        elevation: 0,
-        css: (0, _react2.css)`
-              flex: 100%;
-              background: ${_core.Colors.LIGHT_GRAY3};
-              padding: 0;
-              min-height: 70vh;
-
-              overflow: hidden;
-
-              border-radius: 5px;
-              display: flex;
-              flex-flow: column nowrap;
-              transition:
-                width .5s linear
-                height .5s linear;
-            `,
-        className: className
-      }, (0, _react2.jsx)(_core.ButtonGroup, null, (0, _react2.jsx)(_core.Button, {
-        disabled: !jumpTo || ((_b = proposals[selectedProposal]) === null || _b === void 0 ? void 0 : _b.type) === 'addition',
-        icon: 'open-application',
-        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)"
-      }), (0, _react2.jsx)(_core.Button, {
-        active: preferDiff,
-        onClick: () => setPreferDiff(v => !v),
-        // Diffing only makes sense for clarifications.
-        // Additions are entire new items, and for amendments
-        // item data is unchanged.
-        disabled: !canShowDiff,
-        text: "Compare",
-        title: "Annotate proposed clarifications for this item"
-      }), (0, _react2.jsx)(_react2.ClassNames, null, ({
-        css: css2
-      }) => (0, _react2.jsx)(_select.Select2, {
-        filterable: false,
-        itemsEqual: stringifiedJSONEqual,
-        menuProps: {
-          className: css2(`max-height: 50vh; overflow-y: auto;`)
-        },
-        activeItem: activeItem,
-        items: allItems,
-        popoverProps: {
-          minimal: true,
-          matchTargetWidth: true
-        },
-        fill: true,
-        itemRenderer: ChangeProposalItemView,
-        onItemSelect: handleItemSelect
-      }, (0, _react2.jsx)(_core.Button, {
-        fill: true,
-        rightIcon: "chevron-down",
-        icon: icon,
-        css: (0, _react2.css)`white-space: nowrap;`
-      }, selectedItemSummary))), (0, _react2.jsx)(_core.Button, {
-        onClick: () => selectProposal(null),
-        icon: "minimize",
-        title: "Minimize proposed change view",
-        text: "Minimize"
-      })), (0, _react2.jsx)("div", {
-        css: (0, _react2.css)`position: relative; flex: 1;`,
-        ref: selectedProposalDetailRef
-      }, (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)(_react.default.Fragment, null, allItems.map(cpi => {
-        const actions = [{
-          onClick: () => selectProposal(cpi.itemPath),
-          text: "Expand",
-          title: "Expand proposed change to see item details",
-          icon: 'maximize'
-        }];
-
-        if (onDeleteProposalForItemAtPath) {
-          actions.push({
-            text: "Delete this proposal",
-            intent: 'danger',
-            onClick: () => onDeleteProposalForItemAtPath(cpi.itemPath),
-            icon: 'trash'
-          });
-        }
-
-        return (0, _react2.jsx)(_Block.HomeBlockCard, {
-          css: (0, _react2.css)`
-                  flex-basis: calc(33.33% - 10px*2/3);
-                `,
-          description: `${cpi.proposal.type} proposal`,
-          key: cpi.itemPath
-        }, (0, _react2.jsx)(ProposalType, {
-          item: cpi
-        }), (0, _react2.jsx)("div", {
-          css: (0, _react2.css)`padding: 5px; flex-grow: 1;`
-        }, cpi.item !== null ? (0, _react2.jsx)(_core.H5, {
-          css: (0, _react2.css)`margin: 0; overflow: hidden; text-overflow: ellipsis;`
-        }, (0, _react2.jsx)(ProposalSummary, {
-          itemRef: cpi.itemRef,
-          proposal: cpi.proposal,
-          itemBefore: cpi.itemBefore,
-          item: cpi.item
-        })) : (0, _react2.jsx)(_react.default.Fragment, null, "Problem reading proposed item data.")), actions.length > 0 ? (0, _react2.jsx)(_Block.HomeBlockActions, {
-          actions: actions
-        }) : null);
-      }));
+    }))))) : null);
+  }, [proposalCount > 0, haveSelectedItem, selectedItemProposed, selectedItemCurrent, preferDiff, jumpTo, handleItemSelect, selectedProposal && proposals[selectedProposal]]);
+  return (0, _react2.jsx)(_react.default.Fragment, null, selectedItemDrawer, allItems.map(cpi => {
+    const actions = [{
+      onClick: () => selectProposal(cpi.itemPath),
+      text: "Expand",
+      title: "Expand proposed change to see item details",
+      icon: 'maximize'
+    }];
+
+    if (onDeleteProposalForItemAtPath) {
+      actions.push({
+        text: "Delete this proposal",
+        intent: 'danger',
+        onClick: () => onDeleteProposalForItemAtPath(cpi.itemPath),
+        icon: 'trash'
+      });
     }
-  } else {
-    return null;
-  }
+
+    return (0, _react2.jsx)(_Block.HomeBlockCard, {
+      css: (0, _react2.css)`
+              flex-basis: calc(33.33% - 10px*2/3);
+            `,
+      description: `${cpi.proposal.type} proposal`,
+      key: cpi.itemPath
+    }, (0, _react2.jsx)(ProposalType, {
+      item: cpi
+    }), (0, _react2.jsx)("div", {
+      css: (0, _react2.css)`padding: 5px; flex-grow: 1;`
+    }, cpi.item !== null ? (0, _react2.jsx)(_core.H5, {
+      css: (0, _react2.css)`margin: 0; overflow: hidden; text-overflow: ellipsis;`
+    }, (0, _react2.jsx)(ProposalSummary, {
+      itemRef: cpi.itemRef,
+      proposal: cpi.proposal,
+      itemBefore: cpi.itemBefore,
+      item: cpi.item
+    })) : (0, _react2.jsx)(_react.default.Fragment, null, "Problem reading proposed item data.")), actions.length > 0 ? (0, _react2.jsx)(_Block.HomeBlockActions, {
+      actions: actions
+    }) : null);
+  }));
 }
 
 ;