@soomo/react-text-annotator 3.1.0-staging.7 → 3.1.0-staging.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"react-text-annotator.es25.js","sources":["../../../node_modules/CETEIcean/src/behaviors.js"],"sourcesContent":["\n/* \n Add a user-defined set of behaviors to CETEIcean's processing\n workflow. Added behaviors will override predefined behaviors with the\n same name.\n*/\nexport function addBehaviors(bhvs) {\n if (bhvs.namespaces) {\n for (let prefix of Object.keys(bhvs.namespaces)) {\n if (!this.namespaces.has(bhvs.namespaces[prefix]) && !Array.from(this.namespaces.values()).includes(prefix)) {\n this.namespaces.set(bhvs.namespaces[prefix], prefix);\n }\n }\n }\n for (let prefix of this.namespaces.values()) {\n if (bhvs[prefix]) {\n for (let b of Object.keys(bhvs[prefix])) {\n this.behaviors[`${prefix}:${b}`] = bhvs[prefix][b];\n }\n }\n }\n if (bhvs[\"functions\"]) {\n for (let fn of Object.keys(bhvs[\"functions\"])) {\n this.utilities[fn] = bhvs[\"functions\"][fn].bind(this.utilities);\n }\n }\n if (bhvs[\"handlers\"]) {\n console.log(\"Behavior handlers are no longer used.\")\n }\n if (bhvs[\"fallbacks\"]) {\n console.log(\"Fallback behaviors are no longer used.\")\n }\n}\n\n/* \n Adds or replaces an individual behavior. Takes a namespace prefix or namespace definition,\n the element name, and the behavior. E.g.\n addBehavior(\"tei\", \"add\", [\"`\",\"`\"]) for an already-declared namespace or\n addBehavior({\"doc\": \"http://docbook.org/ns/docbook\"}, \"note\", [\"[\",\"]\"]) for a new one\n*/\nexport function addBehavior(ns, element, b) {\n let p;\n if (ns === Object(ns)) {\n for (let prefix of Object.keys(ns)) {\n if (!this.namespaces.has(ns[prefix])) {\n this.namespaces.set(ns[prefix], prefix);\n p = prefix;\n }\n }\n } else {\n p = ns;\n }\n this.behaviors[`${p}:${element}`] = b;\n}\n\n/*\n Removes a previously-defined or default behavior. Takes a namespace prefix or namespace definition\n and the element name.\n*/\nexport function removeBehavior(ns, element) {\n let p;\n if (ns === Object(ns)) {\n for (let prefix of Object.keys(ns)) {\n if (!this.namespaces.has(ns[prefix])) {\n this.namespaces.set(ns[prefix], prefix);\n p = prefix;\n }\n }\n } else {\n p = ns;\n }\n delete this.behaviors[`${p}:${element}`];\n}\n"],"names":[],"mappings":"AAMO,SAAS,aAAa,MAAM;AACjC,MAAI,KAAK,YAAY;AACnB,aAAS,UAAU,OAAO,KAAK,KAAK,UAAU,GAAG;AAC/C,UAAI,CAAC,KAAK,WAAW,IAAI,KAAK,WAAW,MAAM,CAAC,KAAK,CAAC,MAAM,KAAK,KAAK,WAAW,OAAM,CAAE,EAAE,SAAS,MAAM,GAAG;AAC3G,aAAK,WAAW,IAAI,KAAK,WAAW,MAAM,GAAG,MAAM;AAAA,MACpD;AAAA,IACF;AAAA,EACF;AACD,WAAS,UAAU,KAAK,WAAW,OAAM,GAAI;AAC3C,QAAI,KAAK,MAAM,GAAG;AAChB,eAAS,KAAK,OAAO,KAAK,KAAK,MAAM,CAAC,GAAG;AACvC,aAAK,UAAU,GAAG,MAAM,IAAI,CAAC,EAAE,IAAI,KAAK,MAAM,EAAE,CAAC;AAAA,MAClD;AAAA,IACF;AAAA,EACF;AACD,MAAI,KAAK,WAAW,GAAG;AACrB,aAAS,MAAM,OAAO,KAAK,KAAK,WAAW,CAAC,GAAG;AAC7C,WAAK,UAAU,EAAE,IAAI,KAAK,WAAW,EAAE,EAAE,EAAE,KAAK,KAAK,SAAS;AAAA,IAC/D;AAAA,EACF;AACD,MAAI,KAAK,UAAU,GAAG;AACpB,YAAQ,IAAI,uCAAuC;AAAA,EACpD;AACD,MAAI,KAAK,WAAW,GAAG;AACrB,YAAQ,IAAI,wCAAwC;AAAA,EACrD;AACH;AAQO,SAAS,YAAY,IAAI,SAAS,GAAG;AAC1C,MAAI;AACJ,MAAI,OAAO,OAAO,EAAE,GAAG;AACrB,aAAS,UAAU,OAAO,KAAK,EAAE,GAAG;AAClC,UAAI,CAAC,KAAK,WAAW,IAAI,GAAG,MAAM,CAAC,GAAG;AACpC,aAAK,WAAW,IAAI,GAAG,MAAM,GAAG,MAAM;AACtC,YAAI;AAAA,MACL;AAAA,IACF;AAAA,EACL,OAAS;AACL,QAAI;AAAA,EACL;AACD,OAAK,UAAU,GAAG,CAAC,IAAI,OAAO,EAAE,IAAI;AACtC;AAMO,SAAS,eAAe,IAAI,SAAS;AAC1C,MAAI;AACJ,MAAI,OAAO,OAAO,EAAE,GAAG;AACrB,aAAS,UAAU,OAAO,KAAK,EAAE,GAAG;AAClC,UAAI,CAAC,KAAK,WAAW,IAAI,GAAG,MAAM,CAAC,GAAG;AACpC,aAAK,WAAW,IAAI,GAAG,MAAM,GAAG,MAAM;AACtC,YAAI;AAAA,MACL;AAAA,IACF;AAAA,EACL,OAAS;AACL,QAAI;AAAA,EACL;AACD,SAAO,KAAK,UAAU,GAAG,CAAC,IAAI,OAAO,EAAE;AACzC;","x_google_ignoreList":[0]}
1
+ {"version":3,"file":"react-text-annotator.es25.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,23 +1,5 @@
1
- function learnElementNames(XML_dom, namespaces) {
2
- const root = XML_dom.documentElement;
3
- let i = 1;
4
- let qname = function(e) {
5
- if (!namespaces.has(e.namespaceURI ? e.namespaceURI : "")) {
6
- namespaces.set(e.namespaceURI, "ns" + i++);
7
- }
8
- return namespaces.get(e.namespaceURI ? e.namespaceURI : "") + ":" + e.localName;
9
- };
10
- const els = new Set(
11
- Array.from(root.querySelectorAll("*"), qname)
12
- );
13
- els.add(qname(root));
14
- return els;
15
- }
16
- function learnCustomElementNames(HTML_dom) {
17
- return new Set(Array.from(HTML_dom.querySelectorAll("*[data-origname]"), (e) => e.localName.replace(/(\w+)-.+/, "$1:") + e.getAttribute("data-origname")));
18
- }
1
+ var reactJsxRuntime_development = {};
19
2
  export {
20
- learnCustomElementNames,
21
- learnElementNames
3
+ reactJsxRuntime_development as __exports
22
4
  };
23
5
  //# sourceMappingURL=react-text-annotator.es26.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"react-text-annotator.es26.js","sources":["../../../node_modules/CETEIcean/src/dom.js"],"sourcesContent":["export function learnElementNames(XML_dom, namespaces) {\n const root = XML_dom.documentElement;\n let i = 1;\n let qname = function(e) { \n if (!namespaces.has(e.namespaceURI ? e.namespaceURI : \"\")) {\n namespaces.set(e.namespaceURI, \"ns\" + i++);\n } \n return namespaces.get(e.namespaceURI ? e.namespaceURI : \"\") + \":\" + e.localName;\n };\n const els = new Set(\n Array.from(root.querySelectorAll(\"*\"), qname));\n \n // Add the root element to the array\n els.add(qname(root));\n return els\n}\n\nexport function learnCustomElementNames(HTML_dom) {\n return new Set(Array.from(HTML_dom.querySelectorAll(\"*[data-origname]\"), e => e.localName.replace(/(\\w+)-.+/,\"$1:\") + e.getAttribute(\"data-origname\")));\n}"],"names":[],"mappings":"AAAO,SAAS,kBAAkB,SAAS,YAAY;AACrD,QAAM,OAAO,QAAQ;AACrB,MAAI,IAAI;AACR,MAAI,QAAQ,SAAS,GAAG;AACtB,QAAI,CAAC,WAAW,IAAI,EAAE,eAAe,EAAE,eAAe,EAAE,GAAG;AACzD,iBAAW,IAAI,EAAE,cAAc,OAAO,GAAG;AAAA,IAC1C;AACD,WAAO,WAAW,IAAI,EAAE,eAAe,EAAE,eAAe,EAAE,IAAI,MAAM,EAAE;AAAA,EAC1E;AACE,QAAM,MAAM,IAAI;AAAA,IACd,MAAM,KAAK,KAAK,iBAAiB,GAAG,GAAG,KAAK;AAAA,EAAC;AAG/C,MAAI,IAAI,MAAM,IAAI,CAAC;AACnB,SAAO;AACT;AAEO,SAAS,wBAAwB,UAAU;AAChD,SAAO,IAAI,IAAI,MAAM,KAAK,SAAS,iBAAiB,kBAAkB,GAAG,OAAK,EAAE,UAAU,QAAQ,YAAW,KAAK,IAAI,EAAE,aAAa,eAAe,CAAC,CAAC;AACxJ;","x_google_ignoreList":[0]}
1
+ {"version":3,"file":"react-text-annotator.es26.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,7 +1,7 @@
1
1
  import { j as jsxRuntimeExports } from "./react-text-annotator.es8.js";
2
- import { useState, useEffect, useMemo, useCallback } from "react";
2
+ import { useState, useEffect, useMemo } from "react";
3
3
  import { isMobile } from "./react-text-annotator.es11.js";
4
- import { useFloating, useRole, useDismiss, useInteractions, FloatingPortal, FloatingFocusManager } from "./react-text-annotator.es12.js";
4
+ import { useFloating, useDismiss, useRole, useInteractions, FloatingPortal, FloatingFocusManager } from "./react-text-annotator.es12.js";
5
5
  import { useAnnotator, useSelection } from "@annotorious/react";
6
6
  import { isRevived, denormalizeRectWithOffset, toDomRectList } from "@soomo/text-annotator";
7
7
  import { useAnnouncePopupNavigation } from "./react-text-annotator.es4.js";
@@ -25,9 +25,9 @@ const TextAnnotatorPopup = (props) => {
25
25
  const { refs, floatingStyles, update, context } = useFloating({
26
26
  placement: isMobile() ? "bottom" : "top",
27
27
  open: isOpen,
28
- onOpenChange: (open) => {
29
- setOpen(open);
30
- if (!open) {
28
+ onOpenChange: (open, _event, reason) => {
29
+ if (!open && (reason === "escape-key" || reason === "focus-out")) {
30
+ setOpen(open);
31
31
  handleClose();
32
32
  }
33
33
  },
@@ -39,8 +39,8 @@ const TextAnnotatorPopup = (props) => {
39
39
  ],
40
40
  whileElementsMounted: autoUpdate
41
41
  });
42
+ const dismiss = useDismiss(context);
42
43
  const role = useRole(context, { role: "dialog" });
43
- const dismiss = useDismiss(context, { outsidePressEvent: "mousedown" });
44
44
  const { getFloatingProps } = useInteractions([dismiss, role]);
45
45
  useEffect(() => {
46
46
  const annotationSelector = annotation == null ? void 0 : annotation.target.selector;
@@ -85,10 +85,6 @@ const TextAnnotatorPopup = (props) => {
85
85
  floatingOpen: isOpen,
86
86
  message: ariaNavigationMessage
87
87
  });
88
- const getStopEventsPropagationProps2 = useCallback(
89
- () => ({ onPointerUp: (event2) => event2.stopPropagation() }),
90
- []
91
- );
92
88
  return isOpen && annotation ? /* @__PURE__ */ jsxRuntimeExports.jsx(FloatingPortal, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
93
89
  FloatingFocusManager,
94
90
  {
@@ -105,7 +101,7 @@ const TextAnnotatorPopup = (props) => {
105
101
  style: floatingStyles,
106
102
  onFocus: handleFloatingFocus,
107
103
  onBlur: handleFloatingBlur,
108
- ...getFloatingProps(getStopEventsPropagationProps2()),
104
+ ...getFloatingProps(getStopEventsPropagationProps()),
109
105
  children: [
110
106
  popup({
111
107
  annotation: selected[0].annotation,
@@ -1 +1 @@
1
- {"version":3,"file":"react-text-annotator.es6.js","sources":["../src/TextAnnotatorPopup/TextAnnotatorPopup.tsx"],"sourcesContent":["import { FC, PointerEvent, MouseEvent, ReactNode, useCallback, useEffect, useMemo, useState } from 'react';\nimport { isMobile } from './isMobile';\nimport {\n autoUpdate,\n flip,\n FloatingFocusManager,\n FloatingPortal,\n inline,\n offset,\n shift,\n useDismiss,\n useFloating,\n useInteractions,\n useRole\n} from '@floating-ui/react';\n\nimport { useAnnotator, useSelection } from '@annotorious/react';\nimport {\n isRevived,\n denormalizeRectWithOffset,\n toDomRectList,\n type TextAnnotation,\n type TextAnnotator\n} from '@soomo/text-annotator';\n\nimport { useAnnouncePopupNavigation } from '../hooks';\nimport './TextAnnotatorPopup.css';\n\ninterface TextAnnotationPopupProps {\n\n ariaNavigationMessage?: string;\n\n ariaCloseWarning?: string;\n\n popup(props: TextAnnotationPopupContentProps): ReactNode;\n\n}\n\nexport interface TextAnnotationPopupContentProps {\n\n annotation: TextAnnotation;\n\n editable?: boolean;\n\n event?: PointerEvent;\n\n}\n\nexport const TextAnnotatorPopup: FC<TextAnnotationPopupProps> = (props) => {\n\n const { popup, ariaNavigationMessage } = props;\n\n const r = useAnnotator<TextAnnotator>();\n\n const { selected, event } = useSelection<TextAnnotation>();\n\n const annotation = selected[0]?.annotation;\n\n const [isOpen, setOpen] = useState(selected?.length > 0);\n const handleClose = () => r?.cancelSelected();\n\n const [isFloatingFocused, setFloatingFocused] = useState(false);\n const handleFloatingFocus = () => setFloatingFocused(true);\n const handleFloatingBlur = () => setFloatingFocused(false);\n useEffect(() => {\n if (!isOpen) handleFloatingBlur();\n }, [isOpen, handleFloatingBlur]);\n\n const { refs, floatingStyles, update, context } = useFloating({\n placement: isMobile() ? 'bottom' : 'top',\n open: isOpen,\n onOpenChange: (open) => {\n setOpen(open);\n\n if (!open) {\n handleClose();\n }\n },\n middleware: [\n offset(10),\n inline(),\n flip(),\n shift({ mainAxis: false, crossAxis: true, padding: 10 })\n ],\n whileElementsMounted: autoUpdate\n });\n\n const role = useRole(context, { role: 'dialog' });\n const dismiss = useDismiss(context, { outsidePressEvent: 'mousedown' });\n const { getFloatingProps } = useInteractions([dismiss, role]);\n\n useEffect(() => {\n const annotationSelector = annotation?.target.selector;\n if (!annotationSelector) return;\n\n setOpen(isRevived(annotationSelector));\n }, [annotation]);\n\n useEffect(() => {\n if (!r) return;\n\n if (isOpen && annotation?.id) {\n refs.setPositionReference({\n getBoundingClientRect: () => denormalizeRectWithOffset(\n r.state.store.getAnnotationBounds(annotation.id),\n r.element.getBoundingClientRect()\n ),\n getClientRects: () => {\n const rects = r.state.store.getAnnotationRects(annotation.id);\n const denormalizedRects = rects.map(\n rect => denormalizeRectWithOffset(rect, r.element.getBoundingClientRect())\n );\n return toDomRectList(denormalizedRects);\n }\n });\n } else {\n refs.setPositionReference(null);\n }\n }, [isOpen, annotation?.id, annotation?.target, r]);\n\n useEffect(() => {\n const config: MutationObserverInit = { attributes: true, childList: true, subtree: true };\n\n const mutationObserver = new MutationObserver(() => update());\n mutationObserver.observe(document.body, config);\n\n window.document.addEventListener('scroll', update, true);\n\n return () => {\n mutationObserver.disconnect();\n window.document.removeEventListener('scroll', update, true);\n };\n }, [update]);\n\n // Don't shift focus to the floating element if selected via keyboard or on mobile.\n const initialFocus = useMemo(() => {\n return (event?.type === 'keyup' || event?.type === 'contextmenu' || isMobile()) ? -1 : 0;\n }, [event]);\n\n /**\n * Announce the navigation hint only on the keyboard selection,\n * because the focus isn't shifted to the popup automatically then\n */\n useAnnouncePopupNavigation({\n disabled: isFloatingFocused,\n floatingOpen: isOpen,\n message: ariaNavigationMessage,\n });\n\n // Prevent text-annotator from handling the irrelevant events triggered from the popup\n const getStopEventsPropagationProps = useCallback(\n () => ({ onPointerUp: (event: PointerEvent<HTMLDivElement>) => event.stopPropagation() }),\n []\n );\n\n return isOpen && annotation ? (\n <FloatingPortal>\n <FloatingFocusManager\n context={context}\n modal={false}\n closeOnFocusOut={true}\n returnFocus={false}\n initialFocus={initialFocus}>\n <div\n className=\"a9s-popup r6o-popup annotation-popup r6o-text-popup not-annotatable\"\n ref={refs.setFloating}\n style={floatingStyles}\n onFocus={handleFloatingFocus}\n onBlur={handleFloatingBlur}\n {...getFloatingProps(getStopEventsPropagationProps())}>\n {popup({\n annotation: selected[0].annotation,\n editable: selected[0].editable,\n event\n })}\n <button className=\"r6o-popup-sr-only\" aria-live=\"assertive\" onClick={handleClose}>\n {props.ariaCloseWarning || 'Click or leave this dialog to close it.'}\n </button>\n </div>\n </FloatingFocusManager>\n </FloatingPortal>\n ) : null;\n\n}\n\n/**\n * Prevent text-annotator from handling the irrelevant events\n * triggered from the popup/toolbar/dialog\n */\nexport const getStopEventsPropagationProps = <T extends HTMLElement = HTMLElement>() => ({\n onPointerUp: (event: PointerEvent<T>) => event.stopPropagation(),\n onPointerDown: (event: PointerEvent<T>) => event.stopPropagation(),\n onMouseDown: (event: MouseEvent<T>) => event.stopPropagation(),\n onMouseUp: (event: MouseEvent<T>) => event.stopPropagation()\n});\n"],"names":["getStopEventsPropagationProps","event","jsx","jsxs"],"mappings":";;;;;;;;;;AAgDa,MAAA,qBAAmD,CAAC,UAAU;;AAEnE,QAAA,EAAE,OAAO,sBAA0B,IAAA;AAEzC,QAAM,IAAI;AAEV,QAAM,EAAE,UAAU,MAAM,IAAI,aAA6B;AAEnD,QAAA,cAAa,cAAS,CAAC,MAAV,mBAAa;AAEhC,QAAM,CAAC,QAAQ,OAAO,IAAI,UAAS,qCAAU,UAAS,CAAC;AACjD,QAAA,cAAc,MAAM,uBAAG;AAE7B,QAAM,CAAC,mBAAmB,kBAAkB,IAAI,SAAS,KAAK;AACxD,QAAA,sBAAsB,MAAM,mBAAmB,IAAI;AACnD,QAAA,qBAAqB,MAAM,mBAAmB,KAAK;AACzD,YAAU,MAAM;AACV,QAAA,CAAC,OAA2B;EAAA,GAC/B,CAAC,QAAQ,kBAAkB,CAAC;AAE/B,QAAM,EAAE,MAAM,gBAAgB,QAAQ,QAAA,IAAY,YAAY;AAAA,IAC5D,WAAW,aAAa,WAAW;AAAA,IACnC,MAAM;AAAA,IACN,cAAc,CAAC,SAAS;AACtB,cAAQ,IAAI;AAEZ,UAAI,CAAC,MAAM;AACG;MACd;AAAA,IACF;AAAA,IACA,YAAY;AAAA,MACV,OAAO,EAAE;AAAA,MACT,OAAO;AAAA,MACP,KAAK;AAAA,MACL,MAAM,EAAE,UAAU,OAAO,WAAW,MAAM,SAAS,IAAI;AAAA,IACzD;AAAA,IACA,sBAAsB;AAAA,EAAA,CACvB;AAED,QAAM,OAAO,QAAQ,SAAS,EAAE,MAAM,UAAU;AAChD,QAAM,UAAU,WAAW,SAAS,EAAE,mBAAmB,aAAa;AACtE,QAAM,EAAE,iBAAiB,IAAI,gBAAgB,CAAC,SAAS,IAAI,CAAC;AAE5D,YAAU,MAAM;AACR,UAAA,qBAAqB,yCAAY,OAAO;AAC5C,QAAI,CAAC,mBAAoB;AAEnB,YAAA,UAAU,kBAAkB,CAAC;AAAA,EAAA,GACpC,CAAC,UAAU,CAAC;AAEf,YAAU,MAAM;AACd,QAAI,CAAC,EAAG;AAEJ,QAAA,WAAU,yCAAY,KAAI;AAC5B,WAAK,qBAAqB;AAAA,QACxB,uBAAuB,MAAM;AAAA,UAC3B,EAAE,MAAM,MAAM,oBAAoB,WAAW,EAAE;AAAA,UAC/C,EAAE,QAAQ,sBAAsB;AAAA,QAClC;AAAA,QACA,gBAAgB,MAAM;AACpB,gBAAM,QAAQ,EAAE,MAAM,MAAM,mBAAmB,WAAW,EAAE;AAC5D,gBAAM,oBAAoB,MAAM;AAAA,YAC9B,UAAQ,0BAA0B,MAAM,EAAE,QAAQ,uBAAuB;AAAA,UAAA;AAE3E,iBAAO,cAAc,iBAAiB;AAAA,QACxC;AAAA,MAAA,CACD;AAAA,IAAA,OACI;AACL,WAAK,qBAAqB,IAAI;AAAA,IAChC;AAAA,EAAA,GACC,CAAC,QAAQ,yCAAY,IAAI,yCAAY,QAAQ,CAAC,CAAC;AAElD,YAAU,MAAM;AACd,UAAM,SAA+B,EAAE,YAAY,MAAM,WAAW,MAAM,SAAS;AAEnF,UAAM,mBAAmB,IAAI,iBAAiB,MAAM,OAAQ,CAAA;AAC3C,qBAAA,QAAQ,SAAS,MAAM,MAAM;AAE9C,WAAO,SAAS,iBAAiB,UAAU,QAAQ,IAAI;AAEvD,WAAO,MAAM;AACX,uBAAiB,WAAW;AAC5B,aAAO,SAAS,oBAAoB,UAAU,QAAQ,IAAI;AAAA,IAAA;AAAA,EAC5D,GACC,CAAC,MAAM,CAAC;AAGL,QAAA,eAAe,QAAQ,MAAM;AACzB,YAAA,+BAAO,UAAS,YAAW,+BAAO,UAAS,iBAAiB,aAAc,KAAK;AAAA,EAAA,GACtF,CAAC,KAAK,CAAC;AAMiB,6BAAA;AAAA,IACzB,UAAU;AAAA,IACV,cAAc;AAAA,IACd,SAAS;AAAA,EAAA,CACV;AAGD,QAAMA,iCAAgC;AAAA,IACpC,OAAO,EAAE,aAAa,CAACC,WAAwCA,OAAM,gBAAkB,EAAA;AAAA,IACvF,CAAC;AAAA,EAAA;AAGI,SAAA,UAAU,aACfC,kCAAAA,IAAC,gBACC,EAAA,UAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,OAAO;AAAA,MACP,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb;AAAA,MACA,UAAAC,kCAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,KAAK,KAAK;AAAA,UACV,OAAO;AAAA,UACP,SAAS;AAAA,UACT,QAAQ;AAAA,UACP,GAAG,iBAAiBH,gCAA+B;AAAA,UACnD,UAAA;AAAA,YAAM,MAAA;AAAA,cACL,YAAY,SAAS,CAAC,EAAE;AAAA,cACxB,UAAU,SAAS,CAAC,EAAE;AAAA,cACtB;AAAA,YAAA,CACD;AAAA,YACDE,kCAAAA,IAAC,UAAO,EAAA,WAAU,qBAAoB,aAAU,aAAY,SAAS,aAClE,UAAM,MAAA,oBAAoB,0CAC7B,CAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA,EAEJ,CAAA,IACE;AAEN;AAMO,MAAM,gCAAgC,OAA4C;AAAA,EACvF,aAAa,CAAC,UAA2B,MAAM,gBAAgB;AAAA,EAC/D,eAAe,CAAC,UAA2B,MAAM,gBAAgB;AAAA,EACjE,aAAa,CAAC,UAAyB,MAAM,gBAAgB;AAAA,EAC7D,WAAW,CAAC,UAAyB,MAAM,gBAAgB;AAC7D;"}
1
+ {"version":3,"file":"react-text-annotator.es6.js","sources":["../src/TextAnnotatorPopup/TextAnnotatorPopup.tsx"],"sourcesContent":["import { FC, PointerEvent, MouseEvent, ReactNode, useCallback, useEffect, useMemo, useState } from 'react';\nimport { isMobile } from './isMobile';\nimport {\n autoUpdate,\n flip,\n FloatingFocusManager,\n FloatingPortal,\n inline,\n offset,\n shift,\n useDismiss,\n useFloating,\n useInteractions,\n useRole\n} from '@floating-ui/react';\n\nimport { useAnnotator, useSelection } from '@annotorious/react';\nimport {\n isRevived,\n denormalizeRectWithOffset,\n toDomRectList,\n type TextAnnotation,\n type TextAnnotator\n} from '@soomo/text-annotator';\n\nimport { useAnnouncePopupNavigation } from '../hooks';\nimport './TextAnnotatorPopup.css';\n\ninterface TextAnnotationPopupProps {\n\n ariaNavigationMessage?: string;\n\n ariaCloseWarning?: string;\n\n popup(props: TextAnnotationPopupContentProps): ReactNode;\n\n}\n\nexport interface TextAnnotationPopupContentProps {\n\n annotation: TextAnnotation;\n\n editable?: boolean;\n\n event?: PointerEvent;\n\n}\n\nexport const TextAnnotatorPopup: FC<TextAnnotationPopupProps> = (props) => {\n\n const { popup, ariaNavigationMessage } = props;\n\n const r = useAnnotator<TextAnnotator>();\n\n const { selected, event } = useSelection<TextAnnotation>();\n\n const annotation = selected[0]?.annotation;\n\n const [isOpen, setOpen] = useState(selected?.length > 0);\n const handleClose = () => r?.cancelSelected();\n\n const [isFloatingFocused, setFloatingFocused] = useState(false);\n const handleFloatingFocus = () => setFloatingFocused(true);\n const handleFloatingBlur = () => setFloatingFocused(false);\n useEffect(() => {\n if (!isOpen) handleFloatingBlur();\n }, [isOpen, handleFloatingBlur]);\n\n const { refs, floatingStyles, update, context } = useFloating({\n placement: isMobile() ? 'bottom' : 'top',\n open: isOpen,\n onOpenChange: (open, _event, reason) => {\n if (!open && (reason === 'escape-key' || reason === 'focus-out')) {\n setOpen(open);\n handleClose();\n }\n },\n middleware: [\n offset(10),\n inline(),\n flip(),\n shift({ mainAxis: false, crossAxis: true, padding: 10 })\n ],\n whileElementsMounted: autoUpdate\n });\n\n const dismiss = useDismiss(context);\n\n const role = useRole(context, { role: 'dialog' });\n\n const { getFloatingProps } = useInteractions([dismiss, role]);\n\n useEffect(() => {\n const annotationSelector = annotation?.target.selector;\n if (!annotationSelector) return;\n\n setOpen(isRevived(annotationSelector));\n }, [annotation]);\n\n useEffect(() => {\n if (!r) return;\n\n if (isOpen && annotation?.id) {\n refs.setPositionReference({\n getBoundingClientRect: () => denormalizeRectWithOffset(\n r.state.store.getAnnotationBounds(annotation.id),\n r.element.getBoundingClientRect()\n ),\n getClientRects: () => {\n const rects = r.state.store.getAnnotationRects(annotation.id);\n const denormalizedRects = rects.map(\n rect => denormalizeRectWithOffset(rect, r.element.getBoundingClientRect())\n );\n return toDomRectList(denormalizedRects);\n }\n });\n } else {\n refs.setPositionReference(null);\n }\n }, [isOpen, annotation?.id, annotation?.target, r]);\n\n useEffect(() => {\n const config: MutationObserverInit = { attributes: true, childList: true, subtree: true };\n\n const mutationObserver = new MutationObserver(() => update());\n mutationObserver.observe(document.body, config);\n\n window.document.addEventListener('scroll', update, true);\n\n return () => {\n mutationObserver.disconnect();\n window.document.removeEventListener('scroll', update, true);\n };\n }, [update]);\n\n // Don't shift focus to the floating element if selected via keyboard or on mobile.\n const initialFocus = useMemo(() => {\n return (event?.type === 'keyup' || event?.type === 'contextmenu' || isMobile()) ? -1 : 0;\n }, [event]);\n\n /**\n * Announce the navigation hint only on the keyboard selection,\n * because the focus isn't shifted to the popup automatically then\n */\n useAnnouncePopupNavigation({\n disabled: isFloatingFocused,\n floatingOpen: isOpen,\n message: ariaNavigationMessage,\n });\n\n return isOpen && annotation ? (\n <FloatingPortal>\n <FloatingFocusManager\n context={context}\n modal={false}\n closeOnFocusOut={true}\n returnFocus={false}\n initialFocus={initialFocus}>\n <div\n className=\"a9s-popup r6o-popup annotation-popup r6o-text-popup not-annotatable\"\n ref={refs.setFloating}\n style={floatingStyles}\n onFocus={handleFloatingFocus}\n onBlur={handleFloatingBlur}\n {...getFloatingProps(getStopEventsPropagationProps())}>\n {popup({\n annotation: selected[0].annotation,\n editable: selected[0].editable,\n event\n })}\n <button className=\"r6o-popup-sr-only\" aria-live=\"assertive\" onClick={handleClose}>\n {props.ariaCloseWarning || 'Click or leave this dialog to close it.'}\n </button>\n </div>\n </FloatingFocusManager>\n </FloatingPortal>\n ) : null;\n\n}\n\n/**\n * Prevent text-annotator from handling the irrelevant events\n * triggered from the popup/toolbar/dialog\n */\nexport const getStopEventsPropagationProps = <T extends HTMLElement = HTMLElement>() => ({\n onPointerUp: (event: PointerEvent<T>) => event.stopPropagation(),\n onPointerDown: (event: PointerEvent<T>) => event.stopPropagation(),\n onMouseDown: (event: MouseEvent<T>) => event.stopPropagation(),\n onMouseUp: (event: MouseEvent<T>) => event.stopPropagation()\n});\n"],"names":["jsx","jsxs"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@soomo/react-text-annotator",
3
- "version": "3.1.0-staging.7",
3
+ "version": "3.1.0-staging.8",
4
4
  "description": "Recogito Text Annotator React bindings",
5
5
  "author": "Rainer Simon",
6
6
  "license": "BSD-3-Clause",
@@ -48,7 +48,7 @@
48
48
  "@annotorious/react": "^3.0.9",
49
49
  "@floating-ui/react": "^0.26.24",
50
50
  "@react-aria/live-announcer": "^3.3.4",
51
- "@soomo/text-annotator": "3.1.0-staging.7",
51
+ "@soomo/text-annotator": "3.1.0-staging.8",
52
52
  "@recogito/text-annotator-tei": "3.0.0-rc.49",
53
53
  "CETEIcean": "^1.9.3",
54
54
  "unique-random": "^4.0.0"