Hotfix undefined errors related to selectors.

Author: mathewjordan

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@samvera/clover-iiif",
-  "version": "2.16.4",
+  "version": "2.16.7",
   "description": "Extensible IIIF front-end toolkit and Manifest viewer. Accessible. Composable. Open Source.",
   "files": [
     "dist"

package.json

@@ -11,6 +11,7 @@ const annotationItemRow: CSS = {
   color: "inherit",
   background: "none",
   borderRadius: "3px",
+  border: "none",
 };
 
 const ButtonStyled = styled("button", {

src/components/Viewer/InformationPanel/Annotation/Item.styled.tsx

@@ -15,8 +15,9 @@ export const Item = styled(RadioGroup.Item, {
   textAlign: "left",
   flexGrow: 1,
   margin: 0,
+  marginLeft: "-1rem",
   padding: "0.618rem 1rem",
-  width: "100%",
+  width: "calc(100% + 2rem)",
   fontSize: "1rem",
 
   strong: {

src/components/Viewer/InformationPanel/Annotation/VTT/Cue.styled.tsx

@@ -190,7 +190,8 @@ const Player: React.FC<PlayerProps> = ({
       if (!video) return;
 
       // @ts-ignore
-      const { type, t, value } = contentStateAnnotation?.target?.selector;
+      const selector = contentStateAnnotation?.target?.selector;
+      const { type, t, value } = selector || {};
       const targetSource =
         // @ts-ignore
         contentStateAnnotation?.target?.source ||

src/components/Viewer/Player/Player.tsx

@@ -152,7 +152,7 @@ const RenderViewer: React.FC<CloverViewerProps> = ({
       canvasIdCallback(activeCanvas);
     }
 
-    if (contentStateCallback) {
+    if (contentStateCallback && activeManifest && activeCanvas) {
       const targetSourceId = visibleCanvases[0]?.id || activeCanvas;
       const annotationId = `${activeManifest}/state/${hashCode(targetSourceId + JSON.stringify(activeSelector))}`;