react-iiif-vault 0.9.5 → 0.9.6

package/dist/esm/index.mjs

@@ -1 +1,1462 @@
-import g,{useContext as O,useMemo as m,useState as w,useEffect as b,createContext as je,useCallback as C,useRef as Q,useLayoutEffect as Fe}from"react";import{globalVault as X,Vault as J}from"@iiif/vault";import{ImageServiceLoader as Ne,getImageServices as q}from"@atlas-viewer/iiif-image-api";import{createEventsHelper as W,createStylesHelper as Z,createThumbnailHelper as Be}from"@iiif/vault-helpers";import{createAction as y}from"typesafe-actions";var Ue=Object.defineProperty,K=Object.getOwnPropertySymbols,ke=Object.prototype.hasOwnProperty,He=Object.prototype.propertyIsEnumerable,ee=(e,t,n)=>t in e?Ue(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,te=(e,t)=>{for(var n in t||(t={}))ke.call(t,n)&&ee(e,n,t[n]);if(K)for(var n of K(t))He.call(t,n)&&ee(e,n,t[n]);return e};const Qe={collection:void 0,manifest:void 0,range:void 0,canvas:void 0,annotation:void 0},N=g.createContext(Qe),T=()=>O(N),$=({value:e,children:t})=>{const n=T(),r=m(()=>te(te({},n),e),[e,n]);return g.createElement(N.Provider,{value:r},t)},qe=({annotation:e,children:t})=>g.createElement($,{value:{annotation:e}},t),ne=({canvas:e,children:t})=>g.createElement($,{value:{canvas:e}},t),ze=({collection:e,children:t})=>g.createElement($,{value:{collection:e}},t),re=({manifest:e,children:t})=>g.createElement($,{value:{manifest:e}},t),Ye=({range:e,children:t})=>g.createElement($,{value:{range:e}},t),L=g.createContext({vault:null,setVaultInstance:e=>{}}),oe=({vault:e,vaultOptions:t,useGlobal:n,resources:r,children:a})=>{const[i,s]=w(()=>e||(n?X(t):t?new J(t):new J));return g.createElement(L.Provider,{value:{vault:i,setVaultInstance:s}},g.createElement($,{value:r||{}},a))},_=()=>{const{vault:e}=O(L);if(e===null)throw new Error("Vault not found. Ensure you have your provider set up correctly.");return e};var Ge=(e,t,n)=>new Promise((r,a)=>{var i=c=>{try{o(n.next(c))}catch(l){a(l)}},s=c=>{try{o(n.throw(c))}catch(l){a(l)}},o=c=>c.done?r(c.value):Promise.resolve(c.value).then(i,s);o((n=n.apply(e,t)).next())});function z(e,{noCache:t=!1}={}){const n=typeof e=="string"?e:e.id,r=_(),[a,i]=w(n),[s,o]=w(void 0),c=m(()=>r.get(n,{skipSelfReturn:!0})||void 0,[n,r]),[l,d]=w(c);return b(()=>{Ge(this,null,function*(){try{const u=c&&!t?c:yield r.load(n),p=u?u.id||u["@id"]:null;u&&a!==p&&i(p),d(u)}catch(u){o(u)}})},[n,t]),{isLoaded:!!l,id:a,requestId:n,error:s,resource:l,cached:!!(l&&l===c)}}function ie(e,t){const{id:n,isLoaded:r,error:a,resource:i,requestId:s,cached:o}=z(e,t);return{id:n,isLoaded:r,error:a,manifest:i,requestId:s,cached:o}}function E(e,t=[]){const n=_(),[r,a]=w(()=>e(n.getState(),n));return b(()=>n.subscribe(i=>e(i,n),i=>{a(i)},!1),t),r}const D=g.createContext([]);function se(){const e=O(D);return E(t=>e.map(n=>t.iiif.entities.Canvas[n]).filter(Boolean),[e])}const B=()=>{},j=je({setCurrentCanvasId:B,setCurrentCanvasIndex:B,nextCanvas:B,previousCanvas:B,currentCanvasIndex:-1,totalCanvases:0,pagingView:!0}),Xe=e=>{const t=ie(e.manifest),[n,r]=w(""),[a,i]=w([]),s=(typeof e.pagingEnabled>"u"||e.pagingEnabled)&&t.manifest&&t.manifest.behavior&&t.manifest.behavior.includes("paged");b(()=>{var f,v;t.manifest&&(r((f=t.manifest.items[0])==null?void 0:f.id),i([(v=t.manifest.items[0])==null?void 0:v.id]))},[t.manifest,e.manifest]);const o=m(()=>{var f;return((f=t.manifest)==null?void 0:f.items.map(v=>v.id))||[]},[t.manifest,e.manifest]),c=m(()=>o.indexOf(n),[o,n]),l=C(()=>{if(o.length&&n){if(c===-1||(o[c+2]?c+2===o.length:c===o.length))return;const f=s&&c!==0?o[c+2]:o[c+1],v=s?c!==0?o[c+3]:o[c+2]:null;f&&(r(f),i(v?[f,v]:[f]))}},[s,o,n,c]),d=C(()=>{if(o.length&&n){if(c===0||c===-1)return;const f=s&&c!==1?o[c-2]:o[c-1],v=s&&c!==1?o[c-1]:null;f&&(r(f),i(v?[f,v]:[f]))}},[s,o,n,c]),u=C(f=>{const v=s&&f%2===1?f-1:f,P=o[v],M=s&&v!==0?o[v+1]:null;P&&(r(P),i(A=>{const S=M?[P,M]:[P];if(A.length===A.length){for(let I=0;I<A.length;I++)if(A[I]!==S[I])return S;return A}return S}))},[s,o]),p=C(f=>{const v=o.indexOf(f);v!==-1&&u(v)},[o,u]),h=m(()=>({setCurrentCanvasId:p,nextCanvas:l,previousCanvas:d,currentCanvasIndex:c,totalCanvases:o.length,setCurrentCanvasIndex:u,pagingView:!0}),[l,d,c,o,u,p]);return t.manifest?t.isLoaded?g.createElement(j.Provider,{value:h},g.createElement(D.Provider,{value:a},g.createElement(re,{manifest:t.manifest.id},g.createElement(ne,{canvas:n},e.children)))):g.createElement("div",null,"Loading..."):(console.warn("The manifest passed to the provider is not a valid IIIF manifest."),g.createElement("div",null,"Sorry, something went wrong."))};function Je(){return O(j)}function We(){return{VaultContext:O(L),ResourceContext:O(N),SimpleViewerReactContext:O(j),VisibleCanvasReactContext:O(D)}}const Ze=e=>g.createElement(oe,{vault:e.bridge.VaultContext.vault||void 0,resources:e.bridge.ResourceContext},g.createElement(D.Provider,{value:e.bridge.VisibleCanvasReactContext},g.createElement(j.Provider,{value:e.bridge.SimpleViewerReactContext},e.children))),ae=g.createContext(new Ne);function U(){return O(ae)}const Ke=/&?(xywh=)?(pixel:|percent:)?([0-9]+(?:\.[0-9]+)?),([0-9]+(?:\.[0-9]+)?),([0-9]+(?:\.[0-9]+)?),([0-9]+(?:\.[0-9]+)?)/,et=/&?(t=)(npt:)?([0-9]+(.[0-9]+)?)?(,([0-9]+(.[0-9]+)?))?/;function k(e){if(Array.isArray(e))return e.reduce((t,n)=>{const{selector:r,selectors:a}=k(n);return r&&(t.selector||(t.selector=r),t.selectors.push(...a)),t},{selector:null,selectors:[]});if(!e)return{selector:null,selectors:[]};if(typeof e=="string"){const[t,n]=e.split("#");return n?k({type:"FragmentSelector",value:n}):{selector:null,selectors:[]}}if(e.type==="PointSelector"&&(e.t||e.t===0)){const t={type:"TemporalSelector",temporal:{startTime:e.t}};return{selector:t,selectors:[t]}}if(e.type==="FragmentSelector"){const t=Ke.exec(e.value);if(t){const r={type:"BoxSelector",spatial:{unit:t[2]==="percent:"?"percent":"pixel",x:parseFloat(t[3]),y:parseFloat(t[4]),width:parseFloat(t[5]),height:parseFloat(t[6])}};return{selector:r,selectors:[r]}}const n=e.value.match(et);if(n){const r={type:"TemporalSelector",temporal:{startTime:n[4]?parseFloat(n[4]):0,endTime:n[7]?parseFloat(n[7]):void 0}};return{selector:r,selectors:[r]}}return{selector:null,selectors:[]}}return{selector:null,selectors:[]}}var tt=Object.defineProperty,nt=Object.defineProperties,rt=Object.getOwnPropertyDescriptors,ce=Object.getOwnPropertySymbols,ot=Object.prototype.hasOwnProperty,it=Object.prototype.propertyIsEnumerable,le=(e,t,n)=>t in e?tt(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,ue=(e,t)=>{for(var n in t||(t={}))ot.call(t,n)&&le(e,n,t[n]);if(ce)for(var n of ce(t))it.call(t,n)&&le(e,n,t[n]);return e},fe=(e,t)=>nt(e,rt(t));function R(e,t={}){if(Array.isArray(e))return R(e[0]);if(typeof e=="string"){const[n,r]=e.split("#");return r?R({type:"SpecificResource",source:{id:n,type:"Unknown"},selector:{type:"FragmentSelector",value:r}}):{type:"SpecificResource",source:{id:n,type:t.typeMap&&t.typeMap[n]||"Unknown"},selector:null,selectors:[]}}if(e.type==="Choice"||e.type==="List"||e.type==="Composite"||e.type==="Independents")return R(e.items[0]);if(e.type==="SpecificResource"){e.source.type==="Canvas"&&e.source.partOf&&typeof e.source.partOf=="string"&&(e.source.partOf=[{id:e.source.partOf,type:"Manifest"}]);const{selector:n,selectors:r}=e.selector?k(e.selector):{selector:null,selectors:[]};return{type:"SpecificResource",source:e.source,selector:n,selectors:r}}if(e.id){e.type==="Canvas"&&e.partOf&&typeof e.partOf=="string"&&(e.partOf=[{id:e.partOf,type:"Manifest"}]);const[n,r]=e.id.split("#");return r?R({type:"SpecificResource",source:fe(ue({},e),{id:n}),selector:{type:"FragmentSelector",value:r}}):{type:"SpecificResource",source:fe(ue({},e),{id:n}),selector:null,selectors:[]}}return{type:"SpecificResource",source:e,selector:null,selectors:[]}}function de(e){return e.type==="SpecificResource"?[e.source,{selector:e.selector}]:[e,{selector:null}]}function pe(e,t,n){const r=[];let a=null;const i=[];for(const s of t){const o=e.get(s.body);for(const c of o){const[l,{selector:d}]=de(c),u=(l.type||"unknown").toLowerCase();if(u==="choice"){const p=e.get(l.items),h=n.length?n.map(f=>p.find(v=>v.id===f)).filter(Boolean):[p[0]];h.length===0&&h.push(p[0]),a={type:"single-choice",items:p.map(f=>({id:f.id,label:f.label,selected:h.indexOf(f)!==-1})),label:c.label},o.push(...h);continue}r.indexOf(u)===-1&&r.push(u),i.push({type:u,resource:l,target:s.target,selector:d})}}return{types:r,items:i,choice:a}}const ve={makeChoice:()=>{}},Y={type:"unknown"},x=e=>({type:"unknown",reason:e,annotations:{pages:[]}});function me(e,t,n){const r=[];for(const a of t.items){const i=a.resource&&a.resource.type==="SpecificResource"?a.resource.source:a.resource;if(!i.id)return x("No resource Identifier");let s;if(i.service){const v=q(i);v[0]&&(s=n(v[0],e))}const{selector:o,source:c}=R(a.target);if(c.id!==e.id)continue;const l={type:"BoxSelector",spatial:{x:0,y:0,width:e.width,height:e.height}},d=o?o.type==="TemporalSelector"?{type:"TemporalBoxSelector",temporal:o.temporal,spatial:l.spatial}:o:null,u={type:"BoxSelector",spatial:{x:0,y:0,width:e.width,height:e.height}},p=a.resource.type==="SpecificResource"?R(a.resource):null,h=p&&p.selector&&(p.selector.type==="BoxSelector"||p.selector.type==="TemporalBoxSelector")?{type:"BoxSelector",spatial:{x:p.selector.spatial.x,y:p.selector.spatial.y,width:p.selector.spatial.width,height:p.selector.spatial.height}}:u,f={id:i.id,type:"Image",width:d?i.width:e.width,height:d?i.height:e.height,service:s,sizes:s&&s.sizes?s.sizes:i.width&&i.height?[{width:i.width,height:i.height}]:[],target:d&&d.type!=="PointSelector"?d:l,selector:h};r.push(f)}return{type:"images",image:r[0],images:r,choice:t.choice}}var st=Object.defineProperty,at=Object.defineProperties,ct=Object.getOwnPropertyDescriptors,ge=Object.getOwnPropertySymbols,lt=Object.prototype.hasOwnProperty,ut=Object.prototype.propertyIsEnumerable,he=(e,t,n)=>t in e?st(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,ft=(e,t)=>{for(var n in t||(t={}))lt.call(t,n)&&he(e,n,t[n]);if(ge)for(var n of ge(t))ut.call(t,n)&&he(e,n,t[n]);return e},dt=(e,t)=>at(e,ct(t));function pt(e={},t=[]){const{id:n,selector:r}=e,a=T(),i=_(),s=n||a.annotation,o=E(l=>s?l.iiif.entities.Annotation[s]:void 0,[s]),c=E(l=>o&&o.body?o.body.map(d=>d?l.iiif.entities[d.type][d.id]:null).filter(Boolean):[],[o]);return m(()=>{if(!o)return;const l=dt(ft({},o),{body:c,target:R(o.target,{typeMap:i.getState().iiif.mapping})});return r?r(l):l},[o,r,c,...t])}function F(e={},t=[]){const{id:n,selector:r}=e,a=T();_();const i=n||a.manifest,s=E(o=>i?o.iiif.entities.Manifest[i]:void 0,[i]);return m(()=>{if(!!s)return r?r(s):s},[s,r,...t])}function V(e={},t=[]){const{id:n,selector:r}=e,a=T(),i=n||a.canvas,s=E(o=>i?o.iiif.entities.Canvas[i]:void 0,[i]);return m(()=>{if(!!s)return r?r(s):s},[s,r,...t])}function vt(e,t){var n;const r=(n=e==null?void 0:e.iiif)==null?void 0:n.meta[t];return r?r.annotationPageManager:null}function mt(e,t){return E(n=>{const r=[];if(!e)return r;const a=Object.keys(n.iiif.entities.AnnotationPage);for(const i of a)if(!t||t.indexOf(i)!==-1){const s=vt(n,i);s&&s.views&&s.views[e]&&r.push(i)}return r},[e,t])}function ye({canvas:e,manifest:t,all:n,canvases:r}){const a=[];if(t)for(const i of t.annotations)a.indexOf(i.id)===-1&&a.push(i.id);if(n){if(r&&r.length)for(const i of r)for(const s of i.annotations)a.indexOf(s.id)===-1&&a.push(s.id)}else if(e)for(const i of e.annotations)a.indexOf(i.id)===-1&&a.push(i.id);return a}var gt=Object.defineProperty,ht=Object.defineProperties,yt=Object.getOwnPropertyDescriptors,_e=Object.getOwnPropertySymbols,_t=Object.prototype.hasOwnProperty,Pt=Object.prototype.propertyIsEnumerable,Pe=(e,t,n)=>t in e?gt(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,Se=(e,t)=>{for(var n in t||(t={}))_t.call(t,n)&&Pe(e,n,t[n]);if(_e)for(var n of _e(t))Pt.call(t,n)&&Pe(e,n,t[n]);return e},we=(e,t)=>ht(e,yt(t));function St(e,t){var n;const r=(n=e==null?void 0:e.iiif)==null?void 0:n.meta[t];return r?r.annotationPageManager:null}function Ee(e,t={}){const n=_(),r=F(),a=V(),i=se(),s=m(()=>ye({all:t.all,manifest:r,canvas:a,canvases:i}),[t.all,a,i,r]),o=mt(e,t.all?void 0:s),c=C(d=>{!e||n.setMetaValue([d,"annotationPageManager","views"],u=>u&&!u[e]?u:we(Se({},u||{}),{[e]:!1}))},[e,n]),l=C((d,u={})=>{if(!e)return;const p=n.getState(),h=[];if(u==null?void 0:u.deselectOthers){const f=Object.keys(p.iiif.entities.AnnotationPage);for(const v of f){const P=St(p,v);P&&P.views&&P.views[e]&&h.push(v)}}for(const f of h)c(f);n.setMetaValue([d,"annotationPageManager","views"],f=>f&&f[e]?f:we(Se({},f||{}),{[e]:!0}))},[e,c,n]);return{availablePageIds:s,enabledPageIds:o,setPageEnabled:l,setPageDisabled:c}}function H(e={}){const t=V(e.canvasId?{id:e.canvasId}:void 0);return E((n,r)=>{if(!t)return[];const a=r.get(t.items),i=[];for(const s of a)i.push(...r.get(s.items));return i},[t])}function wt(e,t={}){return H(t)}function Et(e,t=!1){}function Ot(e,t=[]){const{id:n,selector:r}=e,a=T(),i=n||a.collection,s=E(o=>i?o.iiif.entities.Collection[i]:void 0,[i]);return m(()=>{if(!!s)return r?r(s):s},[s,r,...t])}function Oe(){const t=_().getStore();return m(()=>n=>t.dispatch(n),[t])}function Ct(e,t,n,r,a=[]){const i=_(),s=m(()=>W(i),[i]);b(()=>{const o=e;return o?(s.addEventListener(o,t,n,r),()=>{s.removeEventListener(o,t,n)}):()=>{}},[s,e,t,...a])}function xt(){const e=O(L);return e&&e.vault?e.vault:X()}function It(e,t){const{id:n,isLoaded:r,error:a,resource:i,requestId:s,cached:o}=z(e,t);return{id:n,isLoaded:r,error:a,manifest:i,requestId:s,cached:o}}var bt=(e,t,n)=>new Promise((r,a)=>{var i=c=>{try{o(n.next(c))}catch(l){a(l)}},s=c=>{try{o(n.throw(c))}catch(l){a(l)}},o=c=>c.done?r(c.value):Promise.resolve(c.value).then(i,s);o((n=n.apply(e,t)).next())});function Ce({cacheKey:e}={}){const t=V(),n=H(),r=_(),a=U(),[i,s]=w(void 0),[o,c]=w(!1),[l,d]=w("idle"),[u,p]=w(void 0),h=t?t.id:"undefined",f=m(()=>{try{if(t&&n.length){const P=n[0],M=r.get(P.body[0]),S=q(M)[0];return S&&a.loadServiceSync({id:S.id||S["@id"],width:S.width||t.width,height:S.height||t.height})||void 0}}catch(P){console.error(P)}},[h,e,t]),v=l==="success"&&i?i:f;return b(()=>{bt(this,null,function*(){try{if(t&&n.length){const P=n[0],M=r.get(P.body[0]),S=q(M)[0];if(!S)return;c(!0),d("loading");try{const I=(yield a.loadService({id:S.id||S["@id"],width:S.width||t.width,height:S.height||t.height}))||void 0;s(I),d("success"),c(!1)}catch(I){d("error"),p(I)}}}catch(P){d("error"),p(P)}})},[h,e]),m(()=>({data:v,isFetching:o,status:l,error:u}),[v,o,l,u])}function Rt(){const e=Ce();return{isLoading:e.isFetching,tile:e.data?{id:e.data.id||e.data["@id"],width:e.data.width,height:e.data.height,imageService:e.data,thumbnail:void 0}:null}}function xe(e,t=[]){const n=_(),r=H(),[a,i]=w((e==null?void 0:e.defaultChoices)||[]),s=m(()=>pe(n,r,a),[n,r,a,...t]),c={makeChoice:C((l,{deselectOthers:d=!0,deselect:u=!1}={})=>{if(s.choice){if(s.choice.type!=="single-choice")throw new Error("Complex choice not supported yet");i(p=>{if(u){const f=p.filter(v=>v!==l);if(f.length===0){const v=s.items[0].resource.id;return v?[v]:[]}return f}if(d)return[l];const h=[...p];if(h.length===0&&s.items.length){const f=s.items[0].resource.id;f&&h.push(f)}return p.indexOf(l)!==-1?p:[...p,l]})}},[s.choice])};return[s,c]}function At(e={},t=[]){const{id:n,selector:r}=e,a=T(),i=n||a.range,s=E(o=>i?o.iiif.entities.Range[i]:void 0,[i]);return m(()=>{if(!!s)return r?r(s):s},[s,r,...t])}function Tt(e,t){const n=_(),r=m(()=>W(n),[n]),a=E(()=>e&&e.id?n.getResourceMeta(e.id,"eventManager"):null,[e]);return m(()=>e?r.getListenersAsProps(e,t):{},[a,e,n,t])}function Ie(e,t){return E((n,r)=>r.get(e.map(a=>({id:a,type:t}))),[e,t])}function $t(){const e=F();return e?e.service.find(t=>t.profile==="SearchService1"||t.profile==="http://iiif.io/api/search/1/search"):void 0}function Mt(){const e=_();return m(()=>Z(e),[e])}function Vt(e,t){const n=_(),r=m(()=>Z(n),[n]);return E(()=>{if(!e)return null;const a=r.getAppliedStyles(e.id);return a?t?a[t]:a:void 0},[e,t])}const be=(e,t=[])=>{const n=_();b(()=>{e(n)},[n,...t])};function Lt(e,t,{canvasId:n,manifestId:r}={}){const a=_(),i=U(),s=m(()=>Be(a,{imageServiceLoader:i}),[a,i]),[o,c]=w(),l=F(r?{id:r}:void 0),d=V(n?{id:n}:void 0),u=d||l,p=Q(!1);if(b(()=>()=>{p.current=!0},[]),!u)throw new Error("Must be called under a manifest or canvas context.");return be(h=>{s.getBestThumbnailAtSize(u,e,t).then(f=>{f.best&&!p.current&&c(f.best)})},[u]),o}var Dt=Object.defineProperty,jt=Object.defineProperties,Ft=Object.getOwnPropertyDescriptors,Re=Object.getOwnPropertySymbols,Nt=Object.prototype.hasOwnProperty,Bt=Object.prototype.propertyIsEnumerable,Ae=(e,t,n)=>t in e?Dt(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,Te=(e,t)=>{for(var n in t||(t={}))Nt.call(t,n)&&Ae(e,n,t[n]);if(Re)for(var n of Re(t))Bt.call(t,n)&&Ae(e,n,t[n]);return e},$e=(e,t)=>jt(e,Ft(t));function Me(){const e=U(),[t,n]=w({}),r=Q(!1);return b(()=>()=>{r.current=!0},[]),[C((i,{height:s,width:o})=>{if(i){const c=i.id||i["@id"],l=e.loadServiceSync({id:c,width:i.width||o,height:i.height||s});l?i=l:t[c]||(r.current||n(d=>$e(Te({},d),{[c]:"loading"})),e.loadService({id:c,width:i.width||o,height:i.height||s}).then(()=>{r.current||n(d=>$e(Te({},d),{[c]:"done"}))}))}return i},[e,t]),t]}const Ut="@iiif/IMPORT_ENTITIES",kt="@iiif/MODIFY_ENTITY_FIELD",Ht="@iiif/REORDER_ENTITY_FIELD",Qt="@iiif/ADD_REFERENCE",qt="@iiif/REMOVE_REFERENCE",zt=y(Ut)(),Yt=y(kt)(),Gt=y(Ht)(),Xt=y(Qt)(),Jt=y(qt)(),G={importEntities:zt,modifyEntityField:Yt,reorderEntityField:Gt,addReference:Xt,removeReference:Jt},Wt="@iiif/ADD_MAPPING",Zt="@iiif/ADD_MAPPINGS";y(Wt)(),y(Zt)();const Kt="@iiif/SET_META_VALUE",en="@iiif/SET_META_VALUE_DYNAMIC",tn="@iiif/UNSET_META_VALUE";y(Kt)(),y(en)(),y(tn)();const nn="@iiif/REQUEST_RESOURCE",rn="@iiif/REQUEST_ERROR",on="@iiif/REQUEST_MISMATCH",sn="@iiif/REQUEST_COMPLETE",an="@iiif/REQUEST_OFFLINE_RESOURCE";y(nn)(),y(rn)(),y(on)(),y(sn)(),y(an)();const cn="@iiif/BATCH",ln="@iiif/BATCH_IMPORT";y(cn)(),y(ln)();function Ve(e){return typeof e!="string"&&e&&e.bindToVault}function un(){const e=_(),t=Q([]),n=Oe(),r=m(()=>`vault://annotation-page/${new Date().getTime()}/${Math.round(Math.random()*1e9).toString(16)}`,[]);Fe(()=>{const o={id:r,type:"AnnotationPage",behavior:[],motivation:null,label:null,thumbnail:[],summary:null,requiredStatement:null,metadata:[],rights:null,provider:[],items:[],seeAlso:[],homepage:[],logo:[],rendering:[],service:[]};n(G.importEntities({entities:{AnnotationPage:{[o.id]:o}}}))},[r]);const a=E(o=>r?o.iiif.entities.AnnotationPage[r]:null,[r]),i=C((o,c)=>{if(r){if(Ve(o)){const u=o;u.__vault||u.bindToVault(e),o=typeof u.source=="string"?u.source:u.source.id,t.current[o]=u}else typeof o!="string"&&(o=o.id);const l=e.get({id:r,type:"AnnotationPage"}),d=e.get({id:o,type:"Annotation"});l&&d&&(l.items.find(u=>u.id===d.id)||n(G.addReference({id:r,type:"AnnotationPage",key:"items",reference:{id:o,type:"Annotation"},index:c})))}},[r]),s=C(o=>{r&&(Ve(o)?o=typeof o.source=="string"?o.source:o.source.id:typeof o!="string"&&(o=o.id),t.current[o]&&t.current[o].beforeRemove(),e.get({id:r,type:"AnnotationPage"})&&n(G.removeReference({id:r,type:"AnnotationPage",key:"items",reference:{id:o,type:"Annotation"}})))},[r]);return[a,{addAnnotation:i,removeAnnotation:s}]}var fn=Object.defineProperty,dn=Object.defineProperties,pn=Object.getOwnPropertyDescriptors,Le=Object.getOwnPropertySymbols,vn=Object.prototype.hasOwnProperty,mn=Object.prototype.propertyIsEnumerable,De=(e,t,n)=>t in e?fn(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,gn=(e,t)=>{for(var n in t||(t={}))vn.call(t,n)&&De(e,n,t[n]);if(Le)for(var n of Le(t))mn.call(t,n)&&De(e,n,t[n]);return e},hn=(e,t)=>dn(e,pn(t));function yn(e){const t=F(),n=V(),r=_(),[a,i]=Me(),{enabledPageIds:s}=Ee((e==null?void 0:e.annotationPageManagerId)||(t==null?void 0:t.id)||(n==null?void 0:n.id),{all:!1}),o=Ie(s,"AnnotationPage"),c=(e==null?void 0:e.strategies)||["images","media","complex-timeline"],[l,d]=xe(e,[i]),u=m(()=>{if(!n||l.types.length===0)return Y;if(l.types.length!==1)return c.indexOf("complex-timeline")===-1?x("Complex timeline not supported"):x("ComplexTimelineStrategy not yet supported");const p=l.types[0];return p==="image"?c.indexOf("images")===-1?x("Image not supported"):me(n,l,a):p==="audio"?c.indexOf("media")===-1?x("Media not supported"):x("Audio strategy not yet supported"):p==="video"?c.indexOf("media")===-1?x("Media not supported"):x("Video strategy not yet supported"):Y},[n,l,r,d.makeChoice]);return m(()=>u.type==="unknown"?[u,ve]:[hn(gn({},u),{annotations:{pages:o}}),d],[u,o])}export{qe as AnnotationContext,ne as CanvasContext,ze as CollectionContext,Ze as ContextBridge,ae as ImageServiceLoaderContext,re as ManifestContext,Ye as RangeContext,L as ReactVaultContext,$ as ResourceProvider,N as ResourceReactContext,Xe as SimpleViewerProvider,j as SimpleViewerReactContext,oe as VaultProvider,D as VisibleCanvasReactContext,ve as emptyActions,R as expandTarget,ye as flattenAnnotationPageIds,me as getImageStrategy,pe as getPaintables,k as parseSelector,de as parseSpecificResource,Y as unknownResponse,x as unsupportedStrategy,pt as useAnnotation,Ee as useAnnotationPageManager,wt as useAnnotationsAtTime,V as useCanvas,Et as useCanvasClock,Ot as useCollection,We as useContextBridge,Oe as useDispatch,Ct as useEventListener,xt as useExistingVault,It as useExternalCollection,ie as useExternalManifest,z as useExternalResource,Ce as useImageService,U as useImageServiceLoader,Rt as useImageTile,Me as useLoadImageService,F as useManifest,xe as usePaintables,H as usePaintingAnnotations,At as useRange,yn as useRenderingStrategy,T as useResourceContext,Tt as useResourceEvents,Ie as useResources,$t as useSearchService,Je as useSimpleViewer,Mt as useStyleHelper,Vt as useStyles,Lt as useThumbnail,_ as useVault,be as useVaultEffect,E as useVaultSelector,un as useVirtualAnnotationPage,se as useVisibleCanvases};
+import React, { useContext, useMemo, useState, useEffect, createContext, useCallback, useRef, useLayoutEffect } from 'react';
+import { globalVault, Vault } from '@iiif/vault';
+import { ImageServiceLoader, getImageServices } from '@atlas-viewer/iiif-image-api';
+import { createEventsHelper, createStylesHelper, createThumbnailHelper } from '@iiif/vault-helpers';
+import { createAction } from 'typesafe-actions';
+
+var __defProp$5 = Object.defineProperty;
+var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
+var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
+var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$5 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$5.call(b, prop))
+      __defNormalProp$5(a, prop, b[prop]);
+  if (__getOwnPropSymbols$5)
+    for (var prop of __getOwnPropSymbols$5(b)) {
+      if (__propIsEnum$5.call(b, prop))
+        __defNormalProp$5(a, prop, b[prop]);
+    }
+  return a;
+};
+const defaultResourceContext = {
+  collection: void 0,
+  manifest: void 0,
+  range: void 0,
+  canvas: void 0,
+  annotation: void 0
+};
+const ResourceReactContext = React.createContext(defaultResourceContext);
+const useResourceContext = () => {
+  return useContext(ResourceReactContext);
+};
+const ResourceProvider = ({ value, children }) => {
+  const parentContext = useResourceContext();
+  const newContext = useMemo(() => {
+    return __spreadValues$5(__spreadValues$5({}, parentContext), value);
+  }, [value, parentContext]);
+  return /* @__PURE__ */ React.createElement(ResourceReactContext.Provider, {
+    value: newContext
+  }, children);
+};
+
+const AnnotationContext = ({ annotation, children }) => {
+  return /* @__PURE__ */ React.createElement(ResourceProvider, {
+    value: { annotation }
+  }, children);
+};
+
+const CanvasContext = ({ canvas, children }) => {
+  return /* @__PURE__ */ React.createElement(ResourceProvider, {
+    value: { canvas }
+  }, children);
+};
+
+const CollectionContext = ({ collection, children }) => {
+  return /* @__PURE__ */ React.createElement(ResourceProvider, {
+    value: { collection }
+  }, children);
+};
+
+const ManifestContext = ({ manifest, children }) => {
+  return /* @__PURE__ */ React.createElement(ResourceProvider, {
+    value: { manifest }
+  }, children);
+};
+
+const RangeContext = ({ range, children }) => {
+  return /* @__PURE__ */ React.createElement(ResourceProvider, {
+    value: { range }
+  }, children);
+};
+
+const ReactVaultContext = React.createContext({
+  vault: null,
+  setVaultInstance: (vault) => {
+  }
+});
+const VaultProvider = ({ vault, vaultOptions, useGlobal, resources, children }) => {
+  const [vaultInstance, setVaultInstance] = useState(() => {
+    if (vault) {
+      return vault;
+    }
+    if (useGlobal) {
+      return globalVault(vaultOptions);
+    }
+    if (vaultOptions) {
+      return new Vault(vaultOptions);
+    }
+    return new Vault();
+  });
+  return /* @__PURE__ */ React.createElement(ReactVaultContext.Provider, {
+    value: { vault: vaultInstance, setVaultInstance }
+  }, /* @__PURE__ */ React.createElement(ResourceProvider, {
+    value: resources || {}
+  }, children));
+};
+
+const useVault = () => {
+  const { vault } = useContext(ReactVaultContext);
+  if (vault === null) {
+    throw new Error("Vault not found. Ensure you have your provider set up correctly.");
+  }
+  return vault;
+};
+
+var __async$1 = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+function useExternalResource(idOrRef, { noCache = false } = {}) {
+  const id = typeof idOrRef === "string" ? idOrRef : idOrRef.id;
+  const vault = useVault();
+  const [realId, setRealId] = useState(id);
+  const [error, setError] = useState(void 0);
+  const initialData = useMemo(() => {
+    return vault.get(id, { skipSelfReturn: true }) || void 0;
+  }, [id, vault]);
+  const [resource, setResource] = useState(initialData);
+  useEffect(() => {
+    (() => __async$1(this, null, function* () {
+      try {
+        const fetchedResource = initialData && !noCache ? initialData : yield vault.load(id);
+        const _realId = fetchedResource ? fetchedResource.id || fetchedResource["@id"] : null;
+        if (fetchedResource && realId !== _realId) {
+          setRealId(_realId);
+        }
+        setResource(fetchedResource);
+      } catch (err) {
+        setError(err);
+      }
+    }))();
+  }, [id, noCache]);
+  return {
+    isLoaded: !!resource,
+    id: realId,
+    requestId: id,
+    error,
+    resource,
+    cached: !!(resource && resource === initialData)
+  };
+}
+
+function useExternalManifest(idOrRef, options) {
+  const { id, isLoaded, error, resource, requestId, cached } = useExternalResource(idOrRef, options);
+  return { id, isLoaded, error, manifest: resource, requestId, cached };
+}
+
+function useVaultSelector(selector, deps = []) {
+  const vault = useVault();
+  const [selectedState, setSelectedState] = useState(() => selector(vault.getState(), vault));
+  useEffect(() => {
+    return vault.subscribe((s) => selector(s, vault), (state) => {
+      setSelectedState(state);
+    }, false);
+  }, deps);
+  return selectedState;
+}
+
+const VisibleCanvasReactContext = React.createContext([]);
+function useVisibleCanvases() {
+  const ids = useContext(VisibleCanvasReactContext);
+  return useVaultSelector((state) => {
+    return ids.map((id) => state.iiif.entities.Canvas[id]).filter(Boolean);
+  }, [ids]);
+}
+
+const noop = () => {
+};
+const SimpleViewerReactContext = createContext({
+  setCurrentCanvasId: noop,
+  setCurrentCanvasIndex: noop,
+  nextCanvas: noop,
+  previousCanvas: noop,
+  currentCanvasIndex: -1,
+  totalCanvases: 0,
+  pagingView: true
+});
+const SimpleViewerProvider = (props) => {
+  const manifest = useExternalManifest(props.manifest);
+  const [currentCanvasId, setCurrentCanvasId] = useState("");
+  const [visible, setVisible] = useState([]);
+  const pagingView = (typeof props.pagingEnabled === "undefined" || props.pagingEnabled) && manifest.manifest && manifest.manifest.behavior && manifest.manifest.behavior.includes("paged");
+  useEffect(() => {
+    var _a, _b;
+    if (manifest.manifest) {
+      setCurrentCanvasId((_a = manifest.manifest.items[0]) == null ? void 0 : _a.id);
+      setVisible([(_b = manifest.manifest.items[0]) == null ? void 0 : _b.id]);
+    }
+  }, [manifest.manifest, props.manifest]);
+  const canvasList = useMemo(() => {
+    var _a;
+    return ((_a = manifest.manifest) == null ? void 0 : _a.items.map((c) => c.id)) || [];
+  }, [manifest.manifest, props.manifest]);
+  const currentCanvasIndex = useMemo(() => canvasList.indexOf(currentCanvasId), [canvasList, currentCanvasId]);
+  const nextCanvas = useCallback(() => {
+    if (canvasList.length && currentCanvasId) {
+      if (currentCanvasIndex === -1) {
+        return;
+      }
+      if (canvasList[currentCanvasIndex + 2] ? currentCanvasIndex + 2 === canvasList.length : currentCanvasIndex === canvasList.length) {
+        return;
+      }
+      const newCanvas = pagingView && currentCanvasIndex !== 0 ? canvasList[currentCanvasIndex + 2] : canvasList[currentCanvasIndex + 1];
+      const pageCanvas = pagingView ? currentCanvasIndex !== 0 ? canvasList[currentCanvasIndex + 3] : canvasList[currentCanvasIndex + 2] : null;
+      if (newCanvas) {
+        setCurrentCanvasId(newCanvas);
+        setVisible(pageCanvas ? [newCanvas, pageCanvas] : [newCanvas]);
+      }
+    }
+  }, [pagingView, canvasList, currentCanvasId, currentCanvasIndex]);
+  const previousCanvas = useCallback(() => {
+    if (canvasList.length && currentCanvasId) {
+      if (currentCanvasIndex === 0 || currentCanvasIndex === -1) {
+        return;
+      }
+      const newCanvas = pagingView && currentCanvasIndex !== 1 ? canvasList[currentCanvasIndex - 2] : canvasList[currentCanvasIndex - 1];
+      const pageCanvas = pagingView && currentCanvasIndex !== 1 ? canvasList[currentCanvasIndex - 1] : null;
+      if (newCanvas) {
+        setCurrentCanvasId(newCanvas);
+        setVisible(pageCanvas ? [newCanvas, pageCanvas] : [newCanvas]);
+      }
+    }
+  }, [pagingView, canvasList, currentCanvasId, currentCanvasIndex]);
+  const setCurrentCanvasIndex = useCallback((idx) => {
+    const realIdx = pagingView && idx % 2 === 1 ? idx - 1 : idx;
+    const newId = canvasList[realIdx];
+    const newNextId = pagingView && realIdx !== 0 ? canvasList[realIdx + 1] : null;
+    if (newId) {
+      setCurrentCanvasId(newId);
+      setVisible((prevValue) => {
+        const newValue = newNextId ? [newId, newNextId] : [newId];
+        if (prevValue.length === prevValue.length) {
+          for (let i = 0; i < prevValue.length; i++) {
+            if (prevValue[i] !== newValue[i]) {
+              return newValue;
+            }
+          }
+          return prevValue;
+        }
+        return newValue;
+      });
+    }
+  }, [pagingView, canvasList]);
+  const internalSetCurrentCanvasId = useCallback((nextId) => {
+    const idx = canvasList.indexOf(nextId);
+    if (idx !== -1) {
+      setCurrentCanvasIndex(idx);
+    }
+  }, [canvasList, setCurrentCanvasIndex]);
+  const ctx = useMemo(() => ({
+    setCurrentCanvasId: internalSetCurrentCanvasId,
+    nextCanvas,
+    previousCanvas,
+    currentCanvasIndex,
+    totalCanvases: canvasList.length,
+    setCurrentCanvasIndex,
+    pagingView: true
+  }), [nextCanvas, previousCanvas, currentCanvasIndex, canvasList, setCurrentCanvasIndex, internalSetCurrentCanvasId]);
+  if (!manifest.manifest) {
+    console.warn("The manifest passed to the provider is not a valid IIIF manifest.");
+    return /* @__PURE__ */ React.createElement("div", null, "Sorry, something went wrong.");
+  }
+  if (!manifest.isLoaded) {
+    return /* @__PURE__ */ React.createElement("div", null, "Loading...");
+  }
+  return /* @__PURE__ */ React.createElement(SimpleViewerReactContext.Provider, {
+    value: ctx
+  }, /* @__PURE__ */ React.createElement(VisibleCanvasReactContext.Provider, {
+    value: visible
+  }, /* @__PURE__ */ React.createElement(ManifestContext, {
+    manifest: manifest.manifest.id
+  }, /* @__PURE__ */ React.createElement(CanvasContext, {
+    canvas: currentCanvasId
+  }, props.children))));
+};
+function useSimpleViewer() {
+  return useContext(SimpleViewerReactContext);
+}
+
+function useContextBridge() {
+  return {
+    VaultContext: useContext(ReactVaultContext),
+    ResourceContext: useContext(ResourceReactContext),
+    SimpleViewerReactContext: useContext(SimpleViewerReactContext),
+    VisibleCanvasReactContext: useContext(VisibleCanvasReactContext)
+  };
+}
+const ContextBridge = (props) => {
+  return /* @__PURE__ */ React.createElement(VaultProvider, {
+    vault: props.bridge.VaultContext.vault || void 0,
+    resources: props.bridge.ResourceContext
+  }, /* @__PURE__ */ React.createElement(VisibleCanvasReactContext.Provider, {
+    value: props.bridge.VisibleCanvasReactContext
+  }, /* @__PURE__ */ React.createElement(SimpleViewerReactContext.Provider, {
+    value: props.bridge.SimpleViewerReactContext
+  }, props.children)));
+};
+
+const ImageServiceLoaderContext = React.createContext(new ImageServiceLoader());
+function useImageServiceLoader() {
+  return useContext(ImageServiceLoaderContext);
+}
+
+const BOX_SELECTOR = /&?(xywh=)?(pixel:|percent:)?([0-9]+(?:\.[0-9]+)?),([0-9]+(?:\.[0-9]+)?),([0-9]+(?:\.[0-9]+)?),([0-9]+(?:\.[0-9]+)?)/;
+const TEMPORAL_SELECTOR = /&?(t=)(npt:)?([0-9]+(.[0-9]+)?)?(,([0-9]+(.[0-9]+)?))?/;
+function parseSelector(source) {
+  if (Array.isArray(source)) {
+    return source.reduce((data, nextSource) => {
+      const { selector, selectors } = parseSelector(nextSource);
+      if (selector) {
+        if (!data.selector) {
+          data.selector = selector;
+        }
+        data.selectors.push(...selectors);
+      }
+      return data;
+    }, {
+      selector: null,
+      selectors: []
+    });
+  }
+  if (!source) {
+    return {
+      selector: null,
+      selectors: []
+    };
+  }
+  if (typeof source === "string") {
+    const [id, fragment] = source.split("#");
+    if (!fragment) {
+      return {
+        selector: null,
+        selectors: []
+      };
+    }
+    return parseSelector({ type: "FragmentSelector", value: fragment });
+  }
+  if (source.type === "PointSelector" && (source.t || source.t === 0)) {
+    const selector = {
+      type: "TemporalSelector",
+      temporal: {
+        startTime: source.t
+      }
+    };
+    return {
+      selector,
+      selectors: [selector]
+    };
+  }
+  if (source.type === "FragmentSelector") {
+    const matchBoxSelector = BOX_SELECTOR.exec(source.value);
+    if (matchBoxSelector) {
+      const selector = {
+        type: "BoxSelector",
+        spatial: {
+          unit: matchBoxSelector[2] === "percent:" ? "percent" : "pixel",
+          x: parseFloat(matchBoxSelector[3]),
+          y: parseFloat(matchBoxSelector[4]),
+          width: parseFloat(matchBoxSelector[5]),
+          height: parseFloat(matchBoxSelector[6])
+        }
+      };
+      return {
+        selector,
+        selectors: [selector]
+      };
+    }
+    const matchTimeSelector = source.value.match(TEMPORAL_SELECTOR);
+    if (matchTimeSelector) {
+      const selector = {
+        type: "TemporalSelector",
+        temporal: {
+          startTime: matchTimeSelector[4] ? parseFloat(matchTimeSelector[4]) : 0,
+          endTime: matchTimeSelector[7] ? parseFloat(matchTimeSelector[7]) : void 0
+        }
+      };
+      return {
+        selector,
+        selectors: [selector]
+      };
+    }
+    return {
+      selector: null,
+      selectors: []
+    };
+  }
+  return {
+    selector: null,
+    selectors: []
+  };
+}
+
+var __defProp$4 = Object.defineProperty;
+var __defProps$4 = Object.defineProperties;
+var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
+var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
+var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$4 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$4.call(b, prop))
+      __defNormalProp$4(a, prop, b[prop]);
+  if (__getOwnPropSymbols$4)
+    for (var prop of __getOwnPropSymbols$4(b)) {
+      if (__propIsEnum$4.call(b, prop))
+        __defNormalProp$4(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
+function expandTarget(target, options = {}) {
+  if (Array.isArray(target)) {
+    return expandTarget(target[0]);
+  }
+  if (typeof target === "string") {
+    const [id, fragment] = target.split("#");
+    if (!fragment) {
+      return {
+        type: "SpecificResource",
+        source: { id, type: options.typeMap && options.typeMap[id] || "Unknown" },
+        selector: null,
+        selectors: []
+      };
+    }
+    return expandTarget({
+      type: "SpecificResource",
+      source: { id, type: "Unknown" },
+      selector: {
+        type: "FragmentSelector",
+        value: fragment
+      }
+    });
+  }
+  if (target.type === "Choice" || target.type === "List" || target.type === "Composite" || target.type === "Independents") {
+    return expandTarget(target.items[0]);
+  }
+  if (target.type === "SpecificResource") {
+    if (target.source.type === "Canvas" && target.source.partOf && typeof target.source.partOf === "string") {
+      target.source.partOf = [
+        {
+          id: target.source.partOf,
+          type: "Manifest"
+        }
+      ];
+    }
+    const { selector, selectors } = target.selector ? parseSelector(target.selector) : { selector: null, selectors: [] };
+    return {
+      type: "SpecificResource",
+      source: target.source,
+      selector,
+      selectors
+    };
+  }
+  if (target.id) {
+    if (target.type === "Canvas" && target.partOf && typeof target.partOf === "string") {
+      target.partOf = [
+        {
+          id: target.partOf,
+          type: "Manifest"
+        }
+      ];
+    }
+    const [id, fragment] = target.id.split("#");
+    if (!fragment) {
+      return {
+        type: "SpecificResource",
+        source: __spreadProps$4(__spreadValues$4({}, target), {
+          id
+        }),
+        selector: null,
+        selectors: []
+      };
+    }
+    return expandTarget({
+      type: "SpecificResource",
+      source: __spreadProps$4(__spreadValues$4({}, target), {
+        id
+      }),
+      selector: {
+        type: "FragmentSelector",
+        value: fragment
+      }
+    });
+  }
+  return {
+    type: "SpecificResource",
+    source: target,
+    selector: null,
+    selectors: []
+  };
+}
+
+function parseSpecificResource(resource) {
+  if (resource.type === "SpecificResource") {
+    return [resource.source, { selector: resource.selector }];
+  }
+  return [resource, { selector: null }];
+}
+function getPaintables(vault, paintingAnnotations, enabledChoices) {
+  const types = [];
+  let choice = null;
+  const items = [];
+  for (const annotation of paintingAnnotations) {
+    const bodies = vault.get(annotation.body);
+    for (const unknownBody of bodies) {
+      const [body, { selector }] = parseSpecificResource(unknownBody);
+      const type = (body.type || "unknown").toLowerCase();
+      if (type === "choice") {
+        const nestedBodies = vault.get(body.items);
+        const selected = enabledChoices.length ? enabledChoices.map((cid) => nestedBodies.find((b) => b.id === cid)).filter(Boolean) : [nestedBodies[0]];
+        if (selected.length === 0) {
+          selected.push(nestedBodies[0]);
+        }
+        choice = {
+          type: "single-choice",
+          items: nestedBodies.map((b) => ({
+            id: b.id,
+            label: b.label,
+            selected: selected.indexOf(b) !== -1
+          })),
+          label: unknownBody.label
+        };
+        bodies.push(...selected);
+        continue;
+      }
+      if (types.indexOf(type) === -1) {
+        types.push(type);
+      }
+      items.push({
+        type,
+        resource: body,
+        target: annotation.target,
+        selector
+      });
+    }
+  }
+  return {
+    types,
+    items,
+    choice
+  };
+}
+const emptyActions = {
+  makeChoice: () => {
+  }
+};
+const unknownResponse = { type: "unknown" };
+const unsupportedStrategy = (reason) => {
+  return { type: "unknown", reason, annotations: { pages: [] } };
+};
+
+function getImageStrategy(canvas, paintables, loadImageService) {
+  const imageTypes = [];
+  for (const singleImage of paintables.items) {
+    const resource = singleImage.resource && singleImage.resource.type === "SpecificResource" ? singleImage.resource.source : singleImage.resource;
+    if (!resource.id) {
+      return unsupportedStrategy("No resource Identifier");
+    }
+    let imageService = void 0;
+    if (resource.service) {
+      const imageServices = getImageServices(resource);
+      if (imageServices[0]) {
+        imageService = loadImageService(imageServices[0], canvas);
+      }
+    }
+    const { selector: imageTarget, source } = expandTarget(singleImage.target);
+    if (source.id !== canvas.id) {
+      continue;
+    }
+    const defaultTarget = {
+      type: "BoxSelector",
+      spatial: {
+        x: 0,
+        y: 0,
+        width: canvas.width,
+        height: canvas.height
+      }
+    };
+    const target = imageTarget ? imageTarget.type === "TemporalSelector" ? {
+      type: "TemporalBoxSelector",
+      temporal: imageTarget.temporal,
+      spatial: defaultTarget.spatial
+    } : imageTarget : null;
+    const defaultImageSelector = {
+      type: "BoxSelector",
+      spatial: {
+        x: 0,
+        y: 0,
+        width: canvas.width,
+        height: canvas.height
+      }
+    };
+    const imageSelector = singleImage.resource.type === "SpecificResource" ? expandTarget(singleImage.resource) : null;
+    const selector = imageSelector && imageSelector.selector && (imageSelector.selector.type === "BoxSelector" || imageSelector.selector.type === "TemporalBoxSelector") ? {
+      type: "BoxSelector",
+      spatial: {
+        x: imageSelector.selector.spatial.x,
+        y: imageSelector.selector.spatial.y,
+        width: imageSelector.selector.spatial.width,
+        height: imageSelector.selector.spatial.height
+      }
+    } : defaultImageSelector;
+    const imageType = {
+      id: resource.id,
+      type: "Image",
+      width: target ? resource.width : canvas.width,
+      height: target ? resource.height : canvas.height,
+      service: imageService,
+      sizes: imageService && imageService.sizes ? imageService.sizes : resource.width && resource.height ? [{ width: resource.width, height: resource.height }] : [],
+      target: target && target.type !== "PointSelector" ? target : defaultTarget,
+      selector
+    };
+    imageTypes.push(imageType);
+  }
+  return {
+    type: "images",
+    image: imageTypes[0],
+    images: imageTypes,
+    choice: paintables.choice
+  };
+}
+
+var __defProp$3 = Object.defineProperty;
+var __defProps$3 = Object.defineProperties;
+var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
+var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
+var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$3 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$3.call(b, prop))
+      __defNormalProp$3(a, prop, b[prop]);
+  if (__getOwnPropSymbols$3)
+    for (var prop of __getOwnPropSymbols$3(b)) {
+      if (__propIsEnum$3.call(b, prop))
+        __defNormalProp$3(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
+function useAnnotation(options = {}, deps = []) {
+  const { id, selector } = options;
+  const ctx = useResourceContext();
+  const vault = useVault();
+  const annotationId = id ? id : ctx.annotation;
+  const annotation = useVaultSelector((s) => annotationId ? s.iiif.entities.Annotation[annotationId] : void 0, [annotationId]);
+  const body = useVaultSelector((s) => annotation && annotation.body ? annotation.body.map((singleBody) => singleBody ? s.iiif.entities[singleBody.type][singleBody.id] : null).filter(Boolean) : [], [annotation]);
+  return useMemo(() => {
+    if (!annotation) {
+      return void 0;
+    }
+    const newAnnotation = __spreadProps$3(__spreadValues$3({}, annotation), {
+      body,
+      target: expandTarget(annotation.target, { typeMap: vault.getState().iiif.mapping })
+    });
+    if (selector) {
+      return selector(newAnnotation);
+    }
+    return newAnnotation;
+  }, [annotation, selector, body, ...deps]);
+}
+
+function useManifest(options = {}, deps = []) {
+  const { id, selector } = options;
+  const ctx = useResourceContext();
+  useVault();
+  const manifestId = id ? id : ctx.manifest;
+  const manifest = useVaultSelector((s) => manifestId ? s.iiif.entities.Manifest[manifestId] : void 0, [manifestId]);
+  return useMemo(() => {
+    if (!manifest) {
+      return void 0;
+    }
+    if (selector) {
+      return selector(manifest);
+    }
+    return manifest;
+  }, [manifest, selector, ...deps]);
+}
+
+function useCanvas(options = {}, deps = []) {
+  const { id, selector } = options;
+  const ctx = useResourceContext();
+  const canvasId = id ? id : ctx.canvas;
+  const canvas = useVaultSelector((s) => canvasId ? s.iiif.entities.Canvas[canvasId] : void 0, [canvasId]);
+  return useMemo(() => {
+    if (!canvas) {
+      return void 0;
+    }
+    if (selector) {
+      return selector(canvas);
+    }
+    return canvas;
+  }, [canvas, selector, ...deps]);
+}
+
+function getMeta$1(state, resourceId) {
+  var _a;
+  const resourceMeta = (_a = state == null ? void 0 : state.iiif) == null ? void 0 : _a.meta[resourceId];
+  if (!resourceMeta) {
+    return null;
+  }
+  return resourceMeta.annotationPageManager;
+}
+function useEnabledAnnotationPageIds(resourceId, availablePageIds) {
+  return useVaultSelector((state) => {
+    const pageIds = [];
+    if (!resourceId) {
+      return pageIds;
+    }
+    const allAnnotationListIds = Object.keys(state.iiif.entities.AnnotationPage);
+    for (const annotationListId of allAnnotationListIds) {
+      if (!availablePageIds || availablePageIds.indexOf(annotationListId) !== -1) {
+        const annotationListMeta = getMeta$1(state, annotationListId);
+        if (annotationListMeta && annotationListMeta.views && annotationListMeta.views[resourceId]) {
+          pageIds.push(annotationListId);
+        }
+      }
+    }
+    return pageIds;
+  }, [resourceId, availablePageIds]);
+}
+
+function flattenAnnotationPageIds({
+  canvas,
+  manifest,
+  all,
+  canvases
+}) {
+  const foundIds = [];
+  if (manifest) {
+    for (const page of manifest.annotations) {
+      if (foundIds.indexOf(page.id) === -1) {
+        foundIds.push(page.id);
+      }
+    }
+  }
+  if (all) {
+    if (canvases && canvases.length) {
+      for (const canvas_ of canvases) {
+        for (const page of canvas_.annotations) {
+          if (foundIds.indexOf(page.id) === -1) {
+            foundIds.push(page.id);
+          }
+        }
+      }
+    }
+  } else if (canvas) {
+    for (const page of canvas.annotations) {
+      if (foundIds.indexOf(page.id) === -1) {
+        foundIds.push(page.id);
+      }
+    }
+  }
+  return foundIds;
+}
+
+var __defProp$2 = Object.defineProperty;
+var __defProps$2 = Object.defineProperties;
+var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
+var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
+var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$2 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$2.call(b, prop))
+      __defNormalProp$2(a, prop, b[prop]);
+  if (__getOwnPropSymbols$2)
+    for (var prop of __getOwnPropSymbols$2(b)) {
+      if (__propIsEnum$2.call(b, prop))
+        __defNormalProp$2(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
+function getMeta(state, resourceId) {
+  var _a;
+  const resourceMeta = (_a = state == null ? void 0 : state.iiif) == null ? void 0 : _a.meta[resourceId];
+  if (!resourceMeta) {
+    return null;
+  }
+  return resourceMeta.annotationPageManager;
+}
+function useAnnotationPageManager(resourceId, options = {}) {
+  const vault = useVault();
+  const manifest = useManifest();
+  const canvas = useCanvas();
+  const canvases = useVisibleCanvases();
+  const availablePageIds = useMemo(() => {
+    return flattenAnnotationPageIds({
+      all: options.all,
+      manifest,
+      canvas,
+      canvases
+    });
+  }, [options.all, canvas, canvases, manifest]);
+  const enabledPageIds = useEnabledAnnotationPageIds(resourceId, options.all ? void 0 : availablePageIds);
+  const setPageDisabled = useCallback((deselectId) => {
+    if (!resourceId) {
+      return;
+    }
+    vault.setMetaValue([deselectId, "annotationPageManager", "views"], (existingResources) => {
+      if (existingResources && !existingResources[resourceId]) {
+        return existingResources;
+      }
+      return __spreadProps$2(__spreadValues$2({}, existingResources || {}), {
+        [resourceId]: false
+      });
+    });
+  }, [resourceId, vault]);
+  const setPageEnabled = useCallback((id, opt = {}) => {
+    if (!resourceId) {
+      return;
+    }
+    const state = vault.getState();
+    const toDeselect = [];
+    if (opt == null ? void 0 : opt.deselectOthers) {
+      const allAnnotationListIds = Object.keys(state.iiif.entities.AnnotationPage);
+      for (const annotationPageId of allAnnotationListIds) {
+        const annotationListMeta = getMeta(state, annotationPageId);
+        if (annotationListMeta && annotationListMeta.views && annotationListMeta.views[resourceId]) {
+          toDeselect.push(annotationPageId);
+        }
+      }
+    }
+    for (const deselectId of toDeselect) {
+      setPageDisabled(deselectId);
+    }
+    vault.setMetaValue([id, "annotationPageManager", "views"], (existingResources) => {
+      if (existingResources && existingResources[resourceId]) {
+        return existingResources;
+      }
+      return __spreadProps$2(__spreadValues$2({}, existingResources || {}), {
+        [resourceId]: true
+      });
+    });
+  }, [resourceId, setPageDisabled, vault]);
+  return {
+    availablePageIds,
+    enabledPageIds,
+    setPageEnabled,
+    setPageDisabled
+  };
+}
+
+function usePaintingAnnotations(options = {}) {
+  const canvas = useCanvas(options.canvasId ? { id: options.canvasId } : void 0);
+  return useVaultSelector((state, vault) => {
+    if (!canvas) {
+      return [];
+    }
+    const annotationPages = vault.get(canvas.items);
+    const flatAnnotations = [];
+    for (const page of annotationPages) {
+      flatAnnotations.push(...vault.get(page.items));
+    }
+    return flatAnnotations;
+  }, [canvas]);
+}
+
+function useAnnotationsAtTime(time, options = {}) {
+  const allAnnotations = usePaintingAnnotations(options);
+  return allAnnotations;
+}
+
+function useCanvasClock(canvasId, autoplay = false) {
+}
+
+function useCollection(options, deps = []) {
+  const { id, selector } = options;
+  const ctx = useResourceContext();
+  const collectionId = id ? id : ctx.collection;
+  const collection = useVaultSelector((s) => collectionId ? s.iiif.entities.Collection[collectionId] : void 0, [collectionId]);
+  return useMemo(() => {
+    if (!collection) {
+      return void 0;
+    }
+    if (selector) {
+      return selector(collection);
+    }
+    return collection;
+  }, [collection, selector, ...deps]);
+}
+
+function useDispatch() {
+  const vault = useVault();
+  const store = vault.getStore();
+  return useMemo(() => {
+    return (action) => store.dispatch(action);
+  }, [store]);
+}
+
+function useEventListener(resource, name, listener, scope, deps = []) {
+  const vault = useVault();
+  const helper = useMemo(() => createEventsHelper(vault), [vault]);
+  useEffect(() => {
+    const currentResource = resource;
+    if (!currentResource) {
+      return () => {
+      };
+    }
+    helper.addEventListener(currentResource, name, listener, scope);
+    return () => {
+      helper.removeEventListener(currentResource, name, listener);
+    };
+  }, [helper, resource, name, ...deps]);
+}
+
+function useExistingVault() {
+  const oldContext = useContext(ReactVaultContext);
+  return oldContext && oldContext.vault ? oldContext.vault : globalVault();
+}
+
+function useExternalCollection(idOrRef, options) {
+  const { id, isLoaded, error, resource, requestId, cached } = useExternalResource(idOrRef, options);
+  return { id, isLoaded, error, manifest: resource, requestId, cached };
+}
+
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+function useImageService({ cacheKey } = {}) {
+  const canvas = useCanvas();
+  const annotations = usePaintingAnnotations();
+  const vault = useVault();
+  const imageService = useImageServiceLoader();
+  const [_data, setData] = useState(void 0);
+  const [isFetching, setIsFetching] = useState(false);
+  const [status, setStatus] = useState("idle");
+  const [error, setError] = useState(void 0);
+  const key = canvas ? canvas.id : "undefined";
+  const initialData = useMemo(() => {
+    try {
+      if (canvas && annotations.length) {
+        const annotation = annotations[0];
+        const resource = vault.get(annotation.body[0]);
+        const imageServices = getImageServices(resource);
+        const firstImageService = imageServices[0];
+        if (!firstImageService) {
+          return void 0;
+        }
+        return imageService.loadServiceSync({
+          id: firstImageService.id || firstImageService["@id"],
+          width: firstImageService.width || canvas.width,
+          height: firstImageService.height || canvas.height
+        }) || void 0;
+      }
+    } catch (e) {
+      console.error(e);
+    }
+    return void 0;
+  }, [key, cacheKey, canvas]);
+  const data = status === "success" && _data ? _data : initialData;
+  useEffect(() => {
+    (() => __async(this, null, function* () {
+      try {
+        if (canvas && annotations.length) {
+          const annotation = annotations[0];
+          const resource = vault.get(annotation.body[0]);
+          const imageServices = getImageServices(resource);
+          const firstImageService = imageServices[0];
+          if (!firstImageService) {
+            return;
+          }
+          setIsFetching(true);
+          setStatus("loading");
+          try {
+            const loadedService = (yield imageService.loadService({
+              id: firstImageService.id || firstImageService["@id"],
+              width: firstImageService.width || canvas.width,
+              height: firstImageService.height || canvas.height
+            })) || void 0;
+            setData(loadedService);
+            setStatus("success");
+            setIsFetching(false);
+          } catch (err) {
+            setStatus("error");
+            setError(err);
+          }
+        }
+      } catch (err) {
+        setStatus("error");
+        setError(err);
+      }
+    }))();
+  }, [key, cacheKey]);
+  return useMemo(() => {
+    return {
+      data,
+      isFetching,
+      status,
+      error
+    };
+  }, [data, isFetching, status, error]);
+}
+
+function useImageTile() {
+  const imageService = useImageService();
+  return {
+    isLoading: imageService.isFetching,
+    tile: imageService.data ? {
+      id: imageService.data.id || imageService.data["@id"],
+      width: imageService.data.width,
+      height: imageService.data.height,
+      imageService: imageService.data,
+      thumbnail: void 0
+    } : null
+  };
+}
+
+function usePaintables(options, deps = []) {
+  const vault = useVault();
+  const paintingAnnotations = usePaintingAnnotations();
+  const [enabledChoices, setEnabledChoices] = useState((options == null ? void 0 : options.defaultChoices) || []);
+  const paintables = useMemo(() => getPaintables(vault, paintingAnnotations, enabledChoices), [vault, paintingAnnotations, enabledChoices, ...deps]);
+  const makeChoice = useCallback((id, { deselectOthers = true, deselect = false } = {}) => {
+    if (paintables.choice) {
+      if (paintables.choice.type !== "single-choice") {
+        throw new Error("Complex choice not supported yet");
+      }
+      setEnabledChoices((prevChoices) => {
+        if (deselect) {
+          const without = prevChoices.filter((e) => e !== id);
+          if (without.length === 0) {
+            const defaultId = paintables.items[0].resource.id;
+            if (defaultId) {
+              return [defaultId];
+            } else {
+              return [];
+            }
+          }
+          return without;
+        }
+        if (deselectOthers) {
+          return [id];
+        }
+        const newChoices = [...prevChoices];
+        if (newChoices.length === 0 && paintables.items.length) {
+          const defaultId = paintables.items[0].resource.id;
+          if (defaultId) {
+            newChoices.push(defaultId);
+          }
+        }
+        if (prevChoices.indexOf(id) !== -1) {
+          return prevChoices;
+        }
+        return [...prevChoices, id];
+      });
+    }
+  }, [paintables.choice]);
+  const actions = { makeChoice };
+  return [paintables, actions];
+}
+
+function useRange(options = {}, deps = []) {
+  const { id, selector } = options;
+  const ctx = useResourceContext();
+  const rangeId = id ? id : ctx.range;
+  const range = useVaultSelector((s) => rangeId ? s.iiif.entities.Range[rangeId] : void 0, [rangeId]);
+  return useMemo(() => {
+    if (!range) {
+      return void 0;
+    }
+    if (selector) {
+      return selector(range);
+    }
+    return range;
+  }, [range, selector, ...deps]);
+}
+
+function useResourceEvents(resource, scope) {
+  const vault = useVault();
+  const helper = useMemo(() => createEventsHelper(vault), [vault]);
+  const hooks = useVaultSelector(() => {
+    if (resource && resource.id) {
+      return vault.getResourceMeta(resource.id, "eventManager");
+    }
+    return null;
+  }, [resource]);
+  return useMemo(() => {
+    return resource ? helper.getListenersAsProps(resource, scope) : {};
+  }, [hooks, resource, vault, scope]);
+}
+
+function useResources(ids, type) {
+  return useVaultSelector((state, vault) => vault.get(ids.map((id) => ({ id, type }))), [ids, type]);
+}
+
+function useSearchService() {
+  const manifest = useManifest();
+  return manifest ? manifest.service.find((service) => service.profile === "SearchService1" || service.profile === "http://iiif.io/api/search/1/search") : void 0;
+}
+
+function useStyleHelper() {
+  const vault = useVault();
+  return useMemo(() => createStylesHelper(vault), [vault]);
+}
+
+function useStyles(resource, scope) {
+  const vault = useVault();
+  const helper = useMemo(() => createStylesHelper(vault), [vault]);
+  return useVaultSelector(() => {
+    if (!resource) {
+      return null;
+    }
+    const styles = helper.getAppliedStyles(resource.id);
+    return styles ? scope ? styles[scope] : styles : void 0;
+  }, [resource, scope]);
+}
+
+const useVaultEffect = (callback, deps = []) => {
+  const vault = useVault();
+  useEffect(() => {
+    callback(vault);
+  }, [vault, ...deps]);
+};
+
+function useThumbnail(request, dereference, { canvasId, manifestId } = {}) {
+  const vault = useVault();
+  const loader = useImageServiceLoader();
+  const helper = useMemo(() => createThumbnailHelper(vault, { imageServiceLoader: loader }), [vault, loader]);
+  const [thumbnail, setThumbnail] = useState();
+  const manifest = useManifest(manifestId ? { id: manifestId } : void 0);
+  const canvas = useCanvas(canvasId ? { id: canvasId } : void 0);
+  const subject = canvas ? canvas : manifest;
+  const didUnmount = useRef(false);
+  useEffect(() => {
+    return () => {
+      didUnmount.current = true;
+    };
+  }, []);
+  if (!subject) {
+    throw new Error("Must be called under a manifest or canvas context.");
+  }
+  useVaultEffect((v) => {
+    helper.getBestThumbnailAtSize(subject, request, dereference).then((thumb) => {
+      if (thumb.best && !didUnmount.current) {
+        setThumbnail(thumb.best);
+      }
+    });
+  }, [subject]);
+  return thumbnail;
+}
+
+var __defProp$1 = Object.defineProperty;
+var __defProps$1 = Object.defineProperties;
+var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1.call(b, prop))
+      __defNormalProp$1(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(b)) {
+      if (__propIsEnum$1.call(b, prop))
+        __defNormalProp$1(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
+function useLoadImageService() {
+  const loader = useImageServiceLoader();
+  const [imageServiceStatus, setImageServiceStatus] = useState({});
+  const didUnmount = useRef(false);
+  useEffect(() => {
+    return () => {
+      didUnmount.current = true;
+    };
+  }, []);
+  const loadImageService = useCallback((imageService, { height, width }) => {
+    if (imageService) {
+      const imageServiceId = imageService.id || imageService["@id"];
+      const syncLoaded = loader.loadServiceSync({
+        id: imageServiceId,
+        width: imageService.width || width,
+        height: imageService.height || height
+      });
+      if (syncLoaded) {
+        imageService = syncLoaded;
+      } else if (!imageServiceStatus[imageServiceId]) {
+        if (!didUnmount.current) {
+          setImageServiceStatus((r) => {
+            return __spreadProps$1(__spreadValues$1({}, r), {
+              [imageServiceId]: "loading"
+            });
+          });
+        }
+        loader.loadService({
+          id: imageServiceId,
+          width: imageService.width || width,
+          height: imageService.height || height
+        }).then(() => {
+          if (!didUnmount.current) {
+            setImageServiceStatus((r) => {
+              return __spreadProps$1(__spreadValues$1({}, r), {
+                [imageServiceId]: "done"
+              });
+            });
+          }
+        });
+      }
+    }
+    return imageService;
+  }, [loader, imageServiceStatus]);
+  return [loadImageService, imageServiceStatus];
+}
+
+const IMPORT_ENTITIES = "@iiif/IMPORT_ENTITIES";
+const MODIFY_ENTITY_FIELD = "@iiif/MODIFY_ENTITY_FIELD";
+const REORDER_ENTITY_FIELD = "@iiif/REORDER_ENTITY_FIELD";
+const ADD_REFERENCE = "@iiif/ADD_REFERENCE";
+const REMOVE_REFERENCE = "@iiif/REMOVE_REFERENCE";
+const importEntities = createAction(IMPORT_ENTITIES)();
+const modifyEntityField = createAction(MODIFY_ENTITY_FIELD)();
+const reorderEntityField = createAction(REORDER_ENTITY_FIELD)();
+const addReference = createAction(ADD_REFERENCE)();
+const removeReference = createAction(REMOVE_REFERENCE)();
+const entityActions = { importEntities, modifyEntityField, reorderEntityField, addReference, removeReference };
+
+const ADD_MAPPING = "@iiif/ADD_MAPPING";
+const ADD_MAPPINGS = "@iiif/ADD_MAPPINGS";
+createAction(ADD_MAPPING)();
+createAction(ADD_MAPPINGS)();
+
+const SET_META_VALUE = "@iiif/SET_META_VALUE";
+const SET_META_VALUE_DYNAMIC = "@iiif/SET_META_VALUE_DYNAMIC";
+const UNSET_META_VALUE = "@iiif/UNSET_META_VALUE";
+createAction(SET_META_VALUE)();
+createAction(SET_META_VALUE_DYNAMIC)();
+createAction(UNSET_META_VALUE)();
+const REQUEST_RESOURCE = "@iiif/REQUEST_RESOURCE";
+const REQUEST_ERROR = "@iiif/REQUEST_ERROR";
+const REQUEST_MISMATCH = "@iiif/REQUEST_MISMATCH";
+const REQUEST_COMPLETE = "@iiif/REQUEST_COMPLETE";
+const REQUEST_OFFLINE_RESOURCE = "@iiif/REQUEST_OFFLINE_RESOURCE";
+createAction(REQUEST_RESOURCE)();
+createAction(REQUEST_ERROR)();
+createAction(REQUEST_MISMATCH)();
+createAction(REQUEST_COMPLETE)();
+createAction(REQUEST_OFFLINE_RESOURCE)();
+
+const BATCH_ACTIONS = "@iiif/BATCH";
+const BATCH_IMPORT = "@iiif/BATCH_IMPORT";
+createAction(BATCH_ACTIONS)();
+createAction(BATCH_IMPORT)();
+
+function isVaultActivated(obj) {
+  return typeof obj !== "string" && obj && obj.bindToVault;
+}
+function useVirtualAnnotationPage() {
+  const vault = useVault();
+  const sources = useRef([]);
+  const dispatch = useDispatch();
+  const virtualId = useMemo(() => {
+    return `vault://annotation-page/${new Date().getTime()}/${Math.round(Math.random() * 1e9).toString(16)}`;
+  }, []);
+  useLayoutEffect(() => {
+    const page = {
+      id: virtualId,
+      type: "AnnotationPage",
+      behavior: [],
+      motivation: null,
+      label: null,
+      thumbnail: [],
+      summary: null,
+      requiredStatement: null,
+      metadata: [],
+      rights: null,
+      provider: [],
+      items: [],
+      seeAlso: [],
+      homepage: [],
+      logo: [],
+      rendering: [],
+      service: []
+    };
+    dispatch(entityActions.importEntities({
+      entities: {
+        AnnotationPage: {
+          [page.id]: page
+        }
+      }
+    }));
+  }, [virtualId]);
+  const fullPage = useVaultSelector((state) => virtualId ? state.iiif.entities.AnnotationPage[virtualId] : null, [virtualId]);
+  const addAnnotation = useCallback((id, atIndex) => {
+    if (virtualId) {
+      if (isVaultActivated(id)) {
+        const display = id;
+        if (!display.__vault) {
+          display.bindToVault(vault);
+        }
+        id = typeof display.source === "string" ? display.source : display.source.id;
+        sources.current[id] = display;
+      } else if (typeof id !== "string") {
+        id = id.id;
+      }
+      const full = vault.get({ id: virtualId, type: "AnnotationPage" });
+      const annotation = vault.get({ id, type: "Annotation" });
+      if (full && annotation) {
+        if (!full.items.find((r) => r.id === annotation.id)) {
+          dispatch(entityActions.addReference({
+            id: virtualId,
+            type: "AnnotationPage",
+            key: "items",
+            reference: {
+              id,
+              type: "Annotation"
+            },
+            index: atIndex
+          }));
+        }
+      }
+    }
+  }, [virtualId]);
+  const removeAnnotation = useCallback((id) => {
+    if (virtualId) {
+      if (isVaultActivated(id)) {
+        id = typeof id.source === "string" ? id.source : id.source.id;
+      } else if (typeof id !== "string") {
+        id = id.id;
+      }
+      if (sources.current[id]) {
+        sources.current[id].beforeRemove();
+      }
+      const full = vault.get({ id: virtualId, type: "AnnotationPage" });
+      if (full) {
+        dispatch(entityActions.removeReference({
+          id: virtualId,
+          type: "AnnotationPage",
+          key: "items",
+          reference: {
+            id,
+            type: "Annotation"
+          }
+        }));
+      }
+    }
+  }, [virtualId]);
+  return [
+    fullPage,
+    {
+      addAnnotation,
+      removeAnnotation
+    }
+  ];
+}
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+function useRenderingStrategy(options) {
+  const manifest = useManifest();
+  const canvas = useCanvas();
+  const vault = useVault();
+  const [loadImageService, imageServiceStatus] = useLoadImageService();
+  const { enabledPageIds } = useAnnotationPageManager((options == null ? void 0 : options.annotationPageManagerId) || (manifest == null ? void 0 : manifest.id) || (canvas == null ? void 0 : canvas.id), {
+    all: false
+  });
+  const enabledPages = useResources(enabledPageIds, "AnnotationPage");
+  const supports = (options == null ? void 0 : options.strategies) || ["images", "media", "complex-timeline"];
+  const [paintables, actions] = usePaintables(options, [imageServiceStatus]);
+  const strategy = useMemo(() => {
+    if (!canvas || paintables.types.length === 0) {
+      return unknownResponse;
+    }
+    if (paintables.types.length !== 1) {
+      if (supports.indexOf("complex-timeline") === -1) {
+        return unsupportedStrategy("Complex timeline not supported");
+      }
+      return unsupportedStrategy("ComplexTimelineStrategy not yet supported");
+    }
+    const mainType = paintables.types[0];
+    if (mainType === "image") {
+      if (supports.indexOf("images") === -1) {
+        return unsupportedStrategy("Image not supported");
+      }
+      return getImageStrategy(canvas, paintables, loadImageService);
+    }
+    if (mainType === "audio") {
+      if (supports.indexOf("media") === -1) {
+        return unsupportedStrategy("Media not supported");
+      }
+      return unsupportedStrategy("Audio strategy not yet supported");
+    }
+    if (mainType === "video") {
+      if (supports.indexOf("media") === -1) {
+        return unsupportedStrategy("Media not supported");
+      }
+      return unsupportedStrategy("Video strategy not yet supported");
+    }
+    return unknownResponse;
+  }, [canvas, paintables, vault, actions.makeChoice]);
+  return useMemo(() => {
+    if (strategy.type === "unknown") {
+      return [strategy, emptyActions];
+    }
+    return [
+      __spreadProps(__spreadValues({}, strategy), {
+        annotations: { pages: enabledPages }
+      }),
+      actions
+    ];
+  }, [strategy, enabledPages]);
+}
+
+export { AnnotationContext, CanvasContext, CollectionContext, ContextBridge, ImageServiceLoaderContext, ManifestContext, RangeContext, ReactVaultContext, ResourceProvider, ResourceReactContext, SimpleViewerProvider, SimpleViewerReactContext, VaultProvider, VisibleCanvasReactContext, emptyActions, expandTarget, flattenAnnotationPageIds, getImageStrategy, getPaintables, parseSelector, parseSpecificResource, unknownResponse, unsupportedStrategy, useAnnotation, useAnnotationPageManager, useAnnotationsAtTime, useCanvas, useCanvasClock, useCollection, useContextBridge, useDispatch, useEventListener, useExistingVault, useExternalCollection, useExternalManifest, useExternalResource, useImageService, useImageServiceLoader, useImageTile, useLoadImageService, useManifest, usePaintables, usePaintingAnnotations, useRange, useRenderingStrategy, useResourceContext, useResourceEvents, useResources, useSearchService, useSimpleViewer, useStyleHelper, useStyles, useThumbnail, useVault, useVaultEffect, useVaultSelector, useVirtualAnnotationPage, useVisibleCanvases };