@kaizen/components 0.0.0-canary-bundler--fix-style-inject-20240522033251 → 0.0.0-canary-bundler--local-style-inject-20240522043016

package/dist/cjs/RichTextEditor/utils/core/createRichTextEditor.cjs

@@ -0,0 +1,52 @@
+'use strict';
+
+var ProseMirrorState = require('prosemirror-state');
+var prosemirrorView = require('prosemirror-view');
+
+/**
+ * createRichTextEditor
+ * Initialize a ProseMirror EditorView
+ */
+var createRichTextEditor = function (_a) {
+  var initialEditorState = _a.initialEditorState,
+    node = _a.node,
+    _b = _a.onChange,
+    onChange = _b === void 0 ? function () {
+      return undefined;
+    } : _b,
+    attributes = _a.attributes,
+    _c = _a.isEditable,
+    isEditable = _c === void 0 ? function () {
+      return true;
+    } : _c;
+  // Handle transactions eminating from the EditorView instance
+  var dispatch = function (tx) {
+    var newEditorState = editorView && editorView.state.apply(tx);
+    if (newEditorState) {
+      onChange(newEditorState);
+      editorView && editorView.updateState(newEditorState);
+    }
+  };
+  // Allow the dispatcher to handle either a Command or a Transaction so we can
+  // change the state more ergonomically upstream
+  var dispatchCommandOrTransaction = function (commandOrTransaction) {
+    if (commandOrTransaction instanceof ProseMirrorState.Transaction) {
+      dispatch(commandOrTransaction);
+    } else if (editorView) {
+      commandOrTransaction(editorView.state, dispatch);
+    }
+  };
+  var editorView = new prosemirrorView.EditorView(node, {
+    state: initialEditorState,
+    dispatchTransaction: dispatchCommandOrTransaction,
+    attributes: attributes,
+    editable: isEditable
+  });
+  return {
+    destroy: function () {
+      editorView && editorView.destroy();
+    },
+    dispatchTransaction: dispatchCommandOrTransaction
+  };
+};
+exports.createRichTextEditor = createRichTextEditor;

package/dist/cjs/RichTextEditor/utils/core/hooks/useRichTextEditor.cjs

@@ -0,0 +1,75 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var createRichTextEditor = require('../createRichTextEditor.cjs');
+
+/**
+ * useRichTextEditor
+ * React hook to initialize a ProseMirror editor, handle binding it to the DOM,
+ * and updating the state within React’s lifecycle.
+ *
+ * @param {initialEditorState} ProseMirror state
+ * @returns {Array}
+ */
+var useRichTextEditor = function (initialEditorState,
+/*
+ * Pass in HTML attributes into the parent RTE node
+ */
+attributes, options) {
+  options = tslib.__assign({
+    editable: true
+  }, options);
+  var _a = React.useState(initialEditorState),
+    editorState = _a[0],
+    setEditorState = _a[1];
+  // Refs to hold the methods returned from ProseMirror’s initialization
+  var destroyEditorRef = React.useRef();
+  var dispatchTransactionRef = React.useRef(function () {
+    return undefined;
+  });
+  // Construct a consistent reference to call the dispatchTransactionRef without
+  // forcing the consumer to unwind it
+  var dispatchTransaction = React.useCallback(function (commandOrTransaction) {
+    dispatchTransactionRef.current(commandOrTransaction);
+  }, [dispatchTransactionRef]);
+  // Hold editableStatus as a ref so we can toggle its status
+  var editableStatusRef = React.useRef(options.editable);
+  var setEditableStatus = React.useCallback(function (status) {
+    editableStatusRef.current = status;
+    // Trigger an update within ProseMirror by issuing a noop transaction
+    dispatchTransaction(function (state, dispatch) {
+      if (!dispatch) return false;
+      dispatch(state.tr);
+      return true;
+    });
+  }, [editableStatusRef]);
+  var editorRef = React.useCallback(function (node) {
+    if (node !== null) {
+      var instance = createRichTextEditor.createRichTextEditor({
+        node: node,
+        initialEditorState: editorState,
+        onChange: setEditorState,
+        isEditable: function () {
+          return editableStatusRef.current;
+        },
+        attributes: attributes
+      });
+      destroyEditorRef.current = instance.destroy;
+      dispatchTransactionRef.current = instance.dispatchTransaction;
+    }
+  },
+  // Including editorState in the dependencies here will cause an endless
+  // loop as the initialization changes its value
+  [setEditorState, editableStatusRef]);
+  // Tear down ProseMirror when the consuming component is unmounted
+  React.useEffect(function () {
+    return function () {
+      if (destroyEditorRef.current) {
+        destroyEditorRef.current();
+      }
+    };
+  }, [destroyEditorRef]);
+  return [editorRef, editorState, dispatchTransaction, setEditableStatus];
+};
+exports.useRichTextEditor = useRichTextEditor;

package/dist/cjs/RichTextEditor/utils/core/inputrules.cjs

@@ -0,0 +1,25 @@
+'use strict';
+
+var ProseMirrorInputrules = require('prosemirror-inputrules');
+
+// Given a list node type, returns an input rule that turns a number
+// followed by a dot at the start of a textblock into an ordered list.
+// Copied from https://github.com/ProseMirror/prosemirror-example-setup/blob/master/src/inputrules.js
+var orderedListRule = function (nodeType) {
+  return ProseMirrorInputrules.wrappingInputRule(/^(\d+)\.\s$/, nodeType, function (match) {
+    return {
+      order: +match[1]
+    };
+  }, function (match, node) {
+    return node.childCount + node.attrs.order == +match[1];
+  });
+};
+// Given a list node type, returns an input rule that turns a bullet
+// (dash, plush, or asterisk) at the start of a textblock into a
+// bullet list.
+// Copied from https://github.com/ProseMirror/prosemirror-example-setup/blob/master/src/inputrules.js
+var bulletListRule = function (nodeType) {
+  return ProseMirrorInputrules.wrappingInputRule(/^\s*([-+*])\s$/, nodeType);
+};
+exports.bulletListRule = bulletListRule;
+exports.orderedListRule = orderedListRule;

package/dist/cjs/RichTextEditor/utils/core/state.cjs

@@ -0,0 +1,40 @@
+'use strict';
+
+var ProseMirrorModel = require('prosemirror-model');
+var ProseMirrorState = require('prosemirror-state');
+
+/**
+ * createEditorState
+ * Create a ProseMirror EditorState. Wrapper for EditorState.create to make the
+ * API obvious to consumers
+ */
+var createEditorState = function (schema, doc, plugins) {
+  if (plugins === void 0) {
+    plugins = [];
+  }
+  return ProseMirrorState.EditorState.create({
+    doc: doc,
+    schema: schema,
+    plugins: plugins
+  });
+};
+/**
+ * Create a ProseMirror doc node from the combination of a schema and the object
+ * representation of a document
+ */
+var createDocNode = function (schema, docObject) {
+  return ProseMirrorModel.Node.fromJSON(schema, docObject);
+};
+/**
+ * Create a ProseMirror doc node from the combination of a schema and the doc’s
+ * content array (rather than the top-level doc node).
+ */
+var createDocNodeFromContent = function (schema, docContent) {
+  return createDocNode(schema, {
+    type: "doc",
+    content: docContent
+  });
+};
+exports.createDocNode = createDocNode;
+exports.createDocNodeFromContent = createDocNodeFromContent;
+exports.createEditorState = createEditorState;

package/dist/cjs/RichTextEditor/utils/plugins/LinkManager/LinkManager.cjs

@@ -0,0 +1,141 @@
+'use strict';
+
+var debounce = require('lodash.debounce');
+var ProseMirrorState = require('prosemirror-state');
+var getMarkAttrs = require('../../commands/getMarkAttrs.cjs');
+var getMarkRange = require('../../commands/getMarkRange.cjs');
+require('prosemirror-utils');
+var markContainsSelection = require('../../commands/markContainsSelection.cjs');
+var markIsActive = require('../../commands/markIsActive.cjs');
+var removeMark = require('../../commands/removeMark.cjs');
+var updateMark = require('../../commands/updateMark.cjs');
+var validateAndRemoveMarks = require('../../commands/validateAndRemoveMarks.cjs');
+var LinkEditor = require('./components/LinkEditor/LinkEditor.cjs');
+var createReactTooltipWrapper = require('./createReactTooltipWrapper.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var debounce__default = /*#__PURE__*/_interopDefault(debounce);
+var LinkManager = /** @class */function () {
+  function LinkManager(view, markType, editorComponent, linkAttributeValidator) {
+    var _this = this;
+    this.editorComponent = editorComponent;
+    this.linkActive = function (state) {
+      return markIsActive.markIsActive(state, markType);
+    };
+    this.validateLinks = validateAndRemoveMarks.validateAndRemoveMarks(markType, linkAttributeValidator);
+    this.markType = markType;
+    this.tooltipTarget = null;
+    this.update(view, null);
+    this.onResize = debounce__default.default(function () {
+      _this.update(view, null);
+    }, 15);
+  }
+  LinkManager.prototype.update = function (view, lastState) {
+    var state = view.state;
+    // Don’t do anything if the document/TextSelection didn't change
+    if (lastState && lastState.doc.eq(state.doc) && lastState.selection.eq(state.selection)) {
+      return;
+    }
+    // Is the selection empty or not a link
+    //
+    // TODO: Also need to check if the selection is _only_ a link. If it covers
+    // more than a single mark then we don’t want to allow edited
+    if (state.selection.empty || !this.linkActive(state)) {
+      this.destroyElement(view);
+      return;
+    }
+    // If there is a selection and we dont have something in DOM
+    // then create element and inject
+    if (!this.tooltipTarget) {
+      this.createElement(view);
+    }
+    this.updateElement(view);
+  };
+  LinkManager.prototype.destroy = function () {
+    var _a;
+    (_a = this.tooltipTarget) === null || _a === void 0 ? void 0 : _a.destroy();
+    window.removeEventListener("resize", this.onResize);
+  };
+  LinkManager.prototype.createElement = function (view) {
+    if (!view.dom.parentElement) return;
+    this.tooltipTarget = createReactTooltipWrapper.createReactTooltipWrapper(view.dom.parentElement, this.editorComponent, this.getEditorProps(view));
+    window.addEventListener("resize", this.onResize);
+  };
+  LinkManager.prototype.updateElement = function (view) {
+    var _a;
+    (_a = this.tooltipTarget) === null || _a === void 0 ? void 0 : _a.update(this.getEditorProps(view));
+  };
+  LinkManager.prototype.destroyElement = function (view) {
+    var _a;
+    view.dispatch(this.validateLinks);
+    (_a = this.tooltipTarget) === null || _a === void 0 ? void 0 : _a.destroy();
+    this.tooltipTarget = null;
+  };
+  LinkManager.prototype.getEditorProps = function (view) {
+    var _this = this;
+    var selectionPosition = null;
+    var selection = view.state.selection;
+    var contained = markContainsSelection.markContainsSelection(view.state, this.markType);
+    var $from = selection.$from;
+    var range = getMarkRange.getMarkRange($from, this.markType);
+    var start;
+    var end;
+    if (!contained && range) {
+      start = view.coordsAtPos(range.from);
+      end = view.coordsAtPos(range.to);
+    } else {
+      start = view.coordsAtPos(selection.from);
+      if (selection.to === view.state.doc.content.size) {
+        end = view.coordsAtPos(selection.to - 1);
+      } else {
+        end = view.coordsAtPos(selection.to);
+      }
+    }
+    selectionPosition = {
+      top: start.top,
+      left: start.left,
+      width: end.right - start.left,
+      height: start.top - start.bottom
+    };
+    return {
+      removeMark: function () {
+        view.dispatch(removeMark.removeMark(_this.markType, {
+          toExtent: true
+        }));
+      },
+      updateAttrs: function (attrs) {
+        view.dispatch(updateMark.updateMark(_this.markType, attrs, {
+          toExtent: true
+        }));
+      },
+      attrs: getMarkAttrs.getMarkAttrs(view.state, this.markType),
+      selectionPosition: selectionPosition,
+      focusEditor: function () {
+        view.focus();
+      }
+    };
+  };
+  return LinkManager;
+}();
+var defaultLinkAttributeValidator = function (attrs) {
+  if (attrs == null) {
+    return false;
+  }
+  return attrs.href && attrs.href !== "";
+};
+var createLinkManager = function (_a) {
+  var markType = _a.markType,
+    _b = _a.editorComponent,
+    editorComponent = _b === void 0 ? LinkEditor.LinkEditor : _b,
+    _c = _a.linkAttributeValidator,
+    linkAttributeValidator = _c === void 0 ? defaultLinkAttributeValidator : _c;
+  return new ProseMirrorState.Plugin({
+    view: function (editorView) {
+      return new LinkManager(editorView, markType, editorComponent, linkAttributeValidator);
+    }
+  });
+};
+exports.createLinkManager = createLinkManager;

package/dist/cjs/RichTextEditor/utils/plugins/LinkManager/components/LinkEditor/LinkEditor.cjs

@@ -0,0 +1,64 @@
+'use strict';
+
+var React = require('react');
+var LinkModal = require('../LinkModal/LinkModal.cjs');
+var LinkPopover = require('../LinkPopover/LinkPopover.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var LinkEditor = function (_a) {
+  var _b;
+  var attrs = _a.attrs,
+    removeMark = _a.removeMark,
+    updateAttrs = _a.updateAttrs,
+    selectionPosition = _a.selectionPosition,
+    focusEditor = _a.focusEditor;
+  var _c = React.useState(attrs.href != null),
+    isPopoverOpen = _c[0],
+    setIsPopoverOpen = _c[1];
+  var _d = React.useState(
+    // eslint-disable-next-line no-underscore-dangle
+    ((_b = attrs._metadata) === null || _b === void 0 ? void 0 : _b.added) === true),
+    modalOpen = _d[0],
+    setModalOpen = _d[1];
+  var _e = React.useState(attrs.href ? attrs.href : undefined),
+    href = _e[0],
+    setHref = _e[1];
+  return React__default.default.createElement(React__default.default.Fragment, null, isPopoverOpen && React__default.default.createElement(LinkPopover.LinkPopover, {
+    href: href,
+    selectionPosition: selectionPosition,
+    onRemove: function () {
+      removeMark();
+      focusEditor();
+    },
+    onEdit: function () {
+      setIsPopoverOpen(false);
+      setModalOpen(true);
+    }
+  }), React__default.default.createElement(LinkModal.LinkModal, {
+    defaultHref: href,
+    isOpen: modalOpen,
+    onAfterLeave: focusEditor,
+    onSubmit: function (submittedHref) {
+      setHref(submittedHref);
+      updateAttrs({
+        href: submittedHref,
+        _metadata: null
+      });
+      setModalOpen(false);
+    },
+    onDismiss: function () {
+      setModalOpen(false);
+      if (href) {
+        setIsPopoverOpen(true);
+      } else {
+        removeMark();
+      }
+    }
+  }));
+};
+LinkEditor.displayName = "LinkEditor";
+exports.LinkEditor = LinkEditor;

package/dist/cjs/RichTextEditor/utils/plugins/LinkManager/components/LinkModal/LinkModal.cjs

@@ -0,0 +1,74 @@
+'use strict';
+
+var React = require('react');
+require('../../../../../../Modal/ConfirmationModal/ConfirmationModal.cjs');
+require('../../../../../../Modal/ContextModal/ContextModal.cjs');
+require('../../../../../../Modal/GenericModal/GenericModal.cjs');
+require('../../../../../../Modal/GenericModal/context/ModalContext.cjs');
+require('../../../../../../Modal/GenericModal/subcomponents/ModalAccessibleDescription/ModalAccessibleDescription.cjs');
+require('../../../../../../Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.cjs');
+require('../../../../../../Modal/GenericModal/subcomponents/ModalHeader/ModalHeader.cjs');
+require('../../../../../../Modal/GenericModal/subcomponents/ModalAccessibleLabel/ModalAccessibleLabel.cjs');
+require('../../../../../../Modal/GenericModal/subcomponents/ModalBody/ModalBody.cjs');
+var InputEditModal = require('../../../../../../Modal/InputEditModal/InputEditModal.cjs');
+var TextField = require('../../../../../../TextField/TextField.cjs');
+var validation = require('../../validation.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var LinkModal = function (_a) {
+  var onSubmit = _a.onSubmit,
+    onDismiss = _a.onDismiss,
+    onAfterLeave = _a.onAfterLeave,
+    isOpen = _a.isOpen,
+    defaultHref = _a.defaultHref;
+  var _b = React.useState(defaultHref || ""),
+    href = _b[0],
+    setHref = _b[1];
+  var _c = React.useState({
+      status: "default"
+    }),
+    validationStatus = _c[0],
+    setValidationStatus = _c[1];
+  var inputRef = React.useRef(null);
+  var handleSubmit = function () {
+    var _a;
+    var validation$1 = validation.validateLink(href);
+    if (validation$1.status !== "success") {
+      (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+      setValidationStatus(validation$1);
+      return;
+    }
+    onSubmit(href);
+  };
+  return React__default.default.createElement(InputEditModal.InputEditModal, {
+    submitLabel: defaultHref ? "Save" : "Add",
+    mood: "positive",
+    isOpen: isOpen,
+    title: defaultHref ? "Edit link" : "Add link",
+    onSubmit: handleSubmit,
+    onDismiss: onDismiss,
+    onAfterLeave: onAfterLeave,
+    onAfterEnter: function () {
+      var _a;
+      return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    }
+  }, React__default.default.createElement(TextField.TextField, {
+    id: "href",
+    type: "text",
+    defaultValue: href !== null && href !== void 0 ? href : "",
+    labelText: "Link URL",
+    inputRef: inputRef,
+    validationMessage: validationStatus.message,
+    status: validationStatus.status,
+    onChange: function (e) {
+      setHref(e.target.value);
+    },
+    inline: true
+  }));
+};
+LinkModal.displayName = "LinkModal";
+exports.LinkModal = LinkModal;

package/dist/cjs/RichTextEditor/utils/plugins/LinkManager/components/LinkPopover/LinkPopover.cjs

@@ -0,0 +1,59 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+require('../../../../../../Icon/subcomponents/SVG/SVG.cjs');
+var EditIcon = require('../../../../../../Icon/EditIcon.cjs');
+var ExternalLinkIcon = require('../../../../../../Icon/ExternalLinkIcon.cjs');
+var RemoveLinkIcon = require('../../../../../../Icon/RemoveLinkIcon.cjs');
+var Popover = require('../../../../../../Popover/Popover.cjs');
+var Text = require('../../../../../../Text/Text.cjs');
+var Positioner = require('./Positioner.cjs');
+var LinkPopover_module = require('./LinkPopover.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var LinkPopover = function (_a) {
+  var href = _a.href,
+    onRemove = _a.onRemove,
+    onEdit = _a.onEdit,
+    selectionPosition = _a.selectionPosition;
+  var _b = Popover.usePopover(),
+    ElementRef = _b[0],
+    Popover$1 = _b[1];
+  return React__default.default.createElement(React__default.default.Fragment, null, React__default.default.createElement(Positioner.Positioner, tslib.__assign({
+    ref: ElementRef
+  }, selectionPosition)), React__default.default.createElement(Popover$1, {
+    size: "large"
+  }, React__default.default.createElement("div", {
+    className: LinkPopover_module.default.popoverContent
+  }, React__default.default.createElement(ExternalLinkIcon.ExternalLinkIcon, {
+    role: "presentation"
+  }), React__default.default.createElement("div", {
+    className: LinkPopover_module.default.popoverLinkContainer
+  }, React__default.default.createElement(Text.Text, {
+    variant: "body",
+    tag: "div",
+    classNameOverride: LinkPopover_module.default.paragraphFlex
+  }, React__default.default.createElement("a", {
+    className: LinkPopover_module.default.popoverLink,
+    href: href != null ? href : undefined,
+    target: "_blank",
+    rel: "noopener noreferrer"
+  }, href))), React__default.default.createElement("div", {
+    className: LinkPopover_module.default.popoverActions
+  }, React__default.default.createElement(EditIcon.EditIcon, {
+    role: "img",
+    onClick: onEdit,
+    "aria-label": "Edit link"
+  })), React__default.default.createElement(RemoveLinkIcon.RemoveLinkIcon, {
+    role: "img",
+    onClick: onRemove,
+    "aria-label": "Remove link"
+  }))));
+};
+LinkPopover.displayName = "LinkPopover";
+exports.LinkPopover = LinkPopover;

package/dist/cjs/RichTextEditor/utils/plugins/LinkManager/components/LinkPopover/LinkPopover.module.scss.cjs

@@ -0,0 +1,39 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var css_248z = ".LinkPopover-module_popoverContent__qGPyp{align-items:center;display:flex;justify-content:center}.LinkPopover-module_popoverLinkContainer__6H0PQ{padding-inline:var(--spacing-8,.5rem) var(--spacing-12,.75rem)}.LinkPopover-module_popoverLink__p1BTG{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.LinkPopover-module_paragraphFlex__PKECm{display:inline-flex}.LinkPopover-module_popoverActions__QuW1-{border-left:1px solid rgba(var(--color-gray-600-rgb,82,78,86),.1);padding-inline:var(--spacing-4,.25rem) var(--spacing-4,.25rem)}";
+var styles = {
+  "popoverContent": "LinkPopover-module_popoverContent__qGPyp",
+  "popoverLinkContainer": "LinkPopover-module_popoverLinkContainer__6H0PQ",
+  "popoverLink": "LinkPopover-module_popoverLink__p1BTG",
+  "paragraphFlex": "LinkPopover-module_paragraphFlex__PKECm",
+  "popoverActions": "LinkPopover-module_popoverActions__QuW1-"
+};
+// Forked from https://github.com/egoist/style-inject
+function styleInject(css, {
+  insertAt
+} = {}) {
+  if (typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+styleInject(css_248z);
+exports.default = styles;
+exports.styleInject = styleInject;

package/dist/cjs/RichTextEditor/utils/plugins/LinkManager/components/LinkPopover/Positioner.cjs

@@ -0,0 +1,54 @@
+'use strict';
+
+var React = require('react');
+var ReactDOM = require('react-dom');
+var debounce = require('lodash.debounce');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var debounce__default = /*#__PURE__*/_interopDefault(debounce);
+var Positioner = React.forwardRef(function (_a, ref) {
+  var top = _a.top,
+    left = _a.left,
+    height = _a.height,
+    width = _a.width;
+  var _b = React.useState(),
+    portalContainer = _b[0],
+    setPortalContainer = _b[1];
+  var _c = React.useState(),
+    windowScroll = _c[0],
+    setWindowScroll = _c[1];
+  React.useEffect(function () {
+    setWindowScroll([window.scrollX, window.scrollY]);
+    setPortalContainer(document.body);
+  }, []);
+  var onResize = React.useRef(debounce__default.default(function () {
+    return setWindowScroll([window.scrollX, window.scrollY]);
+  }, 15));
+  React.useEffect(function () {
+    var resizeCurrent = onResize.current;
+    window.addEventListener("resize", resizeCurrent);
+    return function () {
+      window.removeEventListener("resize", resizeCurrent);
+    };
+  }, [setWindowScroll, onResize]);
+  if (windowScroll === undefined || portalContainer === undefined) return null;
+  var x = windowScroll[0],
+    y = windowScroll[1];
+  return ReactDOM.createPortal(React__default.default.createElement("div", {
+    ref: ref,
+    style: {
+      height: "".concat(height, "px"),
+      left: "".concat(left + x, "px"),
+      pointerEvents: "none",
+      position: "absolute",
+      top: "".concat(top + y, "px"),
+      width: "".concat(width, "px")
+    }
+  }), portalContainer);
+});
+Positioner.displayName = "Positioner";
+exports.Positioner = Positioner;