@lanaco/lnc-react-ui 3.11.35 → 4.0.2

package/dist/SearchBar.js

@@ -0,0 +1,994 @@
+import { jsx as v, jsxs as _ } from "react/jsx-runtime";
+import g, { Children as ue, isValidElement as w, cloneElement as R, useState as M, createElement as X } from "react";
+import { n as x } from "./emotion-styled.browser.esm-BZSYYThs.js";
+import { P as u } from "./index-Ds9PUTwb.js";
+import ce from "./Chip.js";
+import { k as de } from "./emotion-react.browser.esm-OWM-uG8Q.js";
+import { useTheme as pe } from "./ThemeProvider.js";
+import { _ as L } from "./objectWithoutPropertiesLoose-DwEN6RBQ.js";
+import { _ as V } from "./emotion-element-5486c51c.browser.esm-CSejtOeT.js";
+import { a as fe, _ as me } from "./setPrototypeOf-a891FLQJ.js";
+import { R as $ } from "./index-CZJEA84h.js";
+const he = de`
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+`, ve = x.div`
+  @media (prefers-reduced-motion: no-preference) {
+    animation-name: ${he};
+    animation-fill-mode: backwards;
+  }
+`, ge = ({ duration: e = 300, delay: o = 0, children: l, ...n }) => /* @__PURE__ */ v(
+  ve,
+  {
+    ...n,
+    style: {
+      ...n.style || {},
+      animationDuration: e + "ms",
+      animationDelay: o + "ms"
+    },
+    children: l
+  }
+);
+function F(e, o) {
+  e.prototype = Object.create(o.prototype), e.prototype.constructor = e, fe(e, o);
+}
+function Ee(e, o) {
+  return e.classList ? !!o && e.classList.contains(o) : (" " + (e.className.baseVal || e.className) + " ").indexOf(" " + o + " ") !== -1;
+}
+function xe(e, o) {
+  e.classList ? e.classList.add(o) : Ee(e, o) || (typeof e.className == "string" ? e.className = e.className + " " + o : e.setAttribute("class", (e.className && e.className.baseVal || "") + " " + o));
+}
+function H(e, o) {
+  return e.replace(new RegExp("(^|\\s)" + o + "(?:\\s|$)", "g"), "$1").replace(/\s+/g, " ").replace(/^\s*|\s*$/g, "");
+}
+function Ce(e, o) {
+  e.classList ? e.classList.remove(o) : typeof e.className == "string" ? e.className = H(e.className, o) : e.setAttribute("class", H(e.className && e.className.baseVal || "", o));
+}
+const J = {
+  disabled: !1
+};
+var be = process.env.NODE_ENV !== "production" ? u.oneOfType([u.number, u.shape({
+  enter: u.number,
+  exit: u.number,
+  appear: u.number
+}).isRequired]) : null, Ne = process.env.NODE_ENV !== "production" ? u.oneOfType([u.string, u.shape({
+  enter: u.string,
+  exit: u.string,
+  active: u.string
+}), u.shape({
+  enter: u.string,
+  enterDone: u.string,
+  enterActive: u.string,
+  exit: u.string,
+  exitDone: u.string,
+  exitActive: u.string
+})]) : null;
+const I = g.createContext(null);
+var Q = function(o) {
+  return o.scrollTop;
+}, O = "unmounted", N = "exited", y = "entering", D = "entered", P = "exiting", C = /* @__PURE__ */ function(e) {
+  F(o, e);
+  function o(n, r) {
+    var t;
+    t = e.call(this, n, r) || this;
+    var i = r, a = i && !i.isMounting ? n.enter : n.appear, s;
+    return t.appearStatus = null, n.in ? a ? (s = N, t.appearStatus = y) : s = D : n.unmountOnExit || n.mountOnEnter ? s = O : s = N, t.state = {
+      status: s
+    }, t.nextCallback = null, t;
+  }
+  o.getDerivedStateFromProps = function(r, t) {
+    var i = r.in;
+    return i && t.status === O ? {
+      status: N
+    } : null;
+  };
+  var l = o.prototype;
+  return l.componentDidMount = function() {
+    this.updateStatus(!0, this.appearStatus);
+  }, l.componentDidUpdate = function(r) {
+    var t = null;
+    if (r !== this.props) {
+      var i = this.state.status;
+      this.props.in ? i !== y && i !== D && (t = y) : (i === y || i === D) && (t = P);
+    }
+    this.updateStatus(!1, t);
+  }, l.componentWillUnmount = function() {
+    this.cancelNextCallback();
+  }, l.getTimeouts = function() {
+    var r = this.props.timeout, t, i, a;
+    return t = i = a = r, r != null && typeof r != "number" && (t = r.exit, i = r.enter, a = r.appear !== void 0 ? r.appear : i), {
+      exit: t,
+      enter: i,
+      appear: a
+    };
+  }, l.updateStatus = function(r, t) {
+    if (r === void 0 && (r = !1), t !== null)
+      if (this.cancelNextCallback(), t === y) {
+        if (this.props.unmountOnExit || this.props.mountOnEnter) {
+          var i = this.props.nodeRef ? this.props.nodeRef.current : $.findDOMNode(this);
+          i && Q(i);
+        }
+        this.performEnter(r);
+      } else
+        this.performExit();
+    else this.props.unmountOnExit && this.state.status === N && this.setState({
+      status: O
+    });
+  }, l.performEnter = function(r) {
+    var t = this, i = this.props.enter, a = this.context ? this.context.isMounting : r, s = this.props.nodeRef ? [a] : [$.findDOMNode(this), a], c = s[0], p = s[1], m = this.getTimeouts(), h = a ? m.appear : m.enter;
+    if (!r && !i || J.disabled) {
+      this.safeSetState({
+        status: D
+      }, function() {
+        t.props.onEntered(c);
+      });
+      return;
+    }
+    this.props.onEnter(c, p), this.safeSetState({
+      status: y
+    }, function() {
+      t.props.onEntering(c, p), t.onTransitionEnd(h, function() {
+        t.safeSetState({
+          status: D
+        }, function() {
+          t.props.onEntered(c, p);
+        });
+      });
+    });
+  }, l.performExit = function() {
+    var r = this, t = this.props.exit, i = this.getTimeouts(), a = this.props.nodeRef ? void 0 : $.findDOMNode(this);
+    if (!t || J.disabled) {
+      this.safeSetState({
+        status: N
+      }, function() {
+        r.props.onExited(a);
+      });
+      return;
+    }
+    this.props.onExit(a), this.safeSetState({
+      status: P
+    }, function() {
+      r.props.onExiting(a), r.onTransitionEnd(i.exit, function() {
+        r.safeSetState({
+          status: N
+        }, function() {
+          r.props.onExited(a);
+        });
+      });
+    });
+  }, l.cancelNextCallback = function() {
+    this.nextCallback !== null && (this.nextCallback.cancel(), this.nextCallback = null);
+  }, l.safeSetState = function(r, t) {
+    t = this.setNextCallback(t), this.setState(r, t);
+  }, l.setNextCallback = function(r) {
+    var t = this, i = !0;
+    return this.nextCallback = function(a) {
+      i && (i = !1, t.nextCallback = null, r(a));
+    }, this.nextCallback.cancel = function() {
+      i = !1;
+    }, this.nextCallback;
+  }, l.onTransitionEnd = function(r, t) {
+    this.setNextCallback(t);
+    var i = this.props.nodeRef ? this.props.nodeRef.current : $.findDOMNode(this), a = r == null && !this.props.addEndListener;
+    if (!i || a) {
+      setTimeout(this.nextCallback, 0);
+      return;
+    }
+    if (this.props.addEndListener) {
+      var s = this.props.nodeRef ? [this.nextCallback] : [i, this.nextCallback], c = s[0], p = s[1];
+      this.props.addEndListener(c, p);
+    }
+    r != null && setTimeout(this.nextCallback, r);
+  }, l.render = function() {
+    var r = this.state.status;
+    if (r === O)
+      return null;
+    var t = this.props, i = t.children;
+    t.in, t.mountOnEnter, t.unmountOnExit, t.appear, t.enter, t.exit, t.timeout, t.addEndListener, t.onEnter, t.onEntering, t.onEntered, t.onExit, t.onExiting, t.onExited, t.nodeRef;
+    var a = L(t, ["children", "in", "mountOnEnter", "unmountOnExit", "appear", "enter", "exit", "timeout", "addEndListener", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "nodeRef"]);
+    return (
+      // allows for nested Transitions
+      /* @__PURE__ */ g.createElement(I.Provider, {
+        value: null
+      }, typeof i == "function" ? i(r, a) : g.cloneElement(g.Children.only(i), a))
+    );
+  }, o;
+}(g.Component);
+C.contextType = I;
+C.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * A React reference to DOM element that need to transition:
+   * https://stackoverflow.com/a/51127130/4671932
+   *
+   *   - When `nodeRef` prop is used, `node` is not passed to callback functions
+   *      (e.g. `onEnter`) because user already has direct access to the node.
+   *   - When changing `key` prop of `Transition` in a `TransitionGroup` a new
+   *     `nodeRef` need to be provided to `Transition` with changed `key` prop
+   *     (see
+   *     [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)).
+   */
+  nodeRef: u.shape({
+    current: typeof Element > "u" ? u.any : function(e, o, l, n, r, t) {
+      var i = e[o];
+      return u.instanceOf(i && "ownerDocument" in i ? i.ownerDocument.defaultView.Element : Element)(e, o, l, n, r, t);
+    }
+  }),
+  /**
+   * A `function` child can be used instead of a React element. This function is
+   * called with the current transition status (`'entering'`, `'entered'`,
+   * `'exiting'`, `'exited'`), which can be used to apply context
+   * specific props to a component.
+   *
+   * ```jsx
+   * <Transition in={this.state.in} timeout={150}>
+   *   {state => (
+   *     <MyComponent className={`fade fade-${state}`} />
+   *   )}
+   * </Transition>
+   * ```
+   */
+  children: u.oneOfType([u.func.isRequired, u.element.isRequired]).isRequired,
+  /**
+   * Show the component; triggers the enter or exit states
+   */
+  in: u.bool,
+  /**
+   * By default the child component is mounted immediately along with
+   * the parent `Transition` component. If you want to "lazy mount" the component on the
+   * first `in={true}` you can set `mountOnEnter`. After the first enter transition the component will stay
+   * mounted, even on "exited", unless you also specify `unmountOnExit`.
+   */
+  mountOnEnter: u.bool,
+  /**
+   * By default the child component stays mounted after it reaches the `'exited'` state.
+   * Set `unmountOnExit` if you'd prefer to unmount the component after it finishes exiting.
+   */
+  unmountOnExit: u.bool,
+  /**
+   * By default the child component does not perform the enter transition when
+   * it first mounts, regardless of the value of `in`. If you want this
+   * behavior, set both `appear` and `in` to `true`.
+   *
+   * > **Note**: there are no special appear states like `appearing`/`appeared`, this prop
+   * > only adds an additional enter transition. However, in the
+   * > `<CSSTransition>` component that first enter transition does result in
+   * > additional `.appear-*` classes, that way you can choose to style it
+   * > differently.
+   */
+  appear: u.bool,
+  /**
+   * Enable or disable enter transitions.
+   */
+  enter: u.bool,
+  /**
+   * Enable or disable exit transitions.
+   */
+  exit: u.bool,
+  /**
+   * The duration of the transition, in milliseconds.
+   * Required unless `addEndListener` is provided.
+   *
+   * You may specify a single timeout for all transitions:
+   *
+   * ```jsx
+   * timeout={500}
+   * ```
+   *
+   * or individually:
+   *
+   * ```jsx
+   * timeout={{
+   *  appear: 500,
+   *  enter: 300,
+   *  exit: 500,
+   * }}
+   * ```
+   *
+   * - `appear` defaults to the value of `enter`
+   * - `enter` defaults to `0`
+   * - `exit` defaults to `0`
+   *
+   * @type {number | { enter?: number, exit?: number, appear?: number }}
+   */
+  timeout: function(o) {
+    var l = be;
+    o.addEndListener || (l = l.isRequired);
+    for (var n = arguments.length, r = new Array(n > 1 ? n - 1 : 0), t = 1; t < n; t++)
+      r[t - 1] = arguments[t];
+    return l.apply(void 0, [o].concat(r));
+  },
+  /**
+   * Add a custom transition end trigger. Called with the transitioning
+   * DOM node and a `done` callback. Allows for more fine grained transition end
+   * logic. Timeouts are still used as a fallback if provided.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * ```jsx
+   * addEndListener={(node, done) => {
+   *   // use the css transitionend event to mark the finish of a transition
+   *   node.addEventListener('transitionend', done, false);
+   * }}
+   * ```
+   */
+  addEndListener: u.func,
+  /**
+   * Callback fired before the "entering" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool) -> void
+   */
+  onEnter: u.func,
+  /**
+   * Callback fired after the "entering" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool)
+   */
+  onEntering: u.func,
+  /**
+   * Callback fired after the "entered" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool) -> void
+   */
+  onEntered: u.func,
+  /**
+   * Callback fired before the "exiting" status is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement) -> void
+   */
+  onExit: u.func,
+  /**
+   * Callback fired after the "exiting" status is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement) -> void
+   */
+  onExiting: u.func,
+  /**
+   * Callback fired after the "exited" status is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed
+   *
+   * @type Function(node: HtmlElement) -> void
+   */
+  onExited: u.func
+} : {};
+function T() {
+}
+C.defaultProps = {
+  in: !1,
+  mountOnEnter: !1,
+  unmountOnExit: !1,
+  appear: !1,
+  enter: !0,
+  exit: !0,
+  onEnter: T,
+  onEntering: T,
+  onEntered: T,
+  onExit: T,
+  onExiting: T,
+  onExited: T
+};
+C.UNMOUNTED = O;
+C.EXITED = N;
+C.ENTERING = y;
+C.ENTERED = D;
+C.EXITING = P;
+var ye = function(o, l) {
+  return o && l && l.split(" ").forEach(function(n) {
+    return xe(o, n);
+  });
+}, A = function(o, l) {
+  return o && l && l.split(" ").forEach(function(n) {
+    return Ce(o, n);
+  });
+}, U = /* @__PURE__ */ function(e) {
+  F(o, e);
+  function o() {
+    for (var n, r = arguments.length, t = new Array(r), i = 0; i < r; i++)
+      t[i] = arguments[i];
+    return n = e.call.apply(e, [this].concat(t)) || this, n.appliedClasses = {
+      appear: {},
+      enter: {},
+      exit: {}
+    }, n.onEnter = function(a, s) {
+      var c = n.resolveArguments(a, s), p = c[0], m = c[1];
+      n.removeClasses(p, "exit"), n.addClass(p, m ? "appear" : "enter", "base"), n.props.onEnter && n.props.onEnter(a, s);
+    }, n.onEntering = function(a, s) {
+      var c = n.resolveArguments(a, s), p = c[0], m = c[1], h = m ? "appear" : "enter";
+      n.addClass(p, h, "active"), n.props.onEntering && n.props.onEntering(a, s);
+    }, n.onEntered = function(a, s) {
+      var c = n.resolveArguments(a, s), p = c[0], m = c[1], h = m ? "appear" : "enter";
+      n.removeClasses(p, h), n.addClass(p, h, "done"), n.props.onEntered && n.props.onEntered(a, s);
+    }, n.onExit = function(a) {
+      var s = n.resolveArguments(a), c = s[0];
+      n.removeClasses(c, "appear"), n.removeClasses(c, "enter"), n.addClass(c, "exit", "base"), n.props.onExit && n.props.onExit(a);
+    }, n.onExiting = function(a) {
+      var s = n.resolveArguments(a), c = s[0];
+      n.addClass(c, "exit", "active"), n.props.onExiting && n.props.onExiting(a);
+    }, n.onExited = function(a) {
+      var s = n.resolveArguments(a), c = s[0];
+      n.removeClasses(c, "exit"), n.addClass(c, "exit", "done"), n.props.onExited && n.props.onExited(a);
+    }, n.resolveArguments = function(a, s) {
+      return n.props.nodeRef ? [n.props.nodeRef.current, a] : [a, s];
+    }, n.getClassNames = function(a) {
+      var s = n.props.classNames, c = typeof s == "string", p = c && s ? s + "-" : "", m = c ? "" + p + a : s[a], h = c ? m + "-active" : s[a + "Active"], b = c ? m + "-done" : s[a + "Done"];
+      return {
+        baseClassName: m,
+        activeClassName: h,
+        doneClassName: b
+      };
+    }, n;
+  }
+  var l = o.prototype;
+  return l.addClass = function(r, t, i) {
+    var a = this.getClassNames(t)[i + "ClassName"], s = this.getClassNames("enter"), c = s.doneClassName;
+    t === "appear" && i === "done" && c && (a += " " + c), i === "active" && r && Q(r), a && (this.appliedClasses[t][i] = a, ye(r, a));
+  }, l.removeClasses = function(r, t) {
+    var i = this.appliedClasses[t], a = i.base, s = i.active, c = i.done;
+    this.appliedClasses[t] = {}, a && A(r, a), s && A(r, s), c && A(r, c);
+  }, l.render = function() {
+    var r = this.props;
+    r.classNames;
+    var t = L(r, ["classNames"]);
+    return /* @__PURE__ */ g.createElement(C, V({}, t, {
+      onEnter: this.onEnter,
+      onEntered: this.onEntered,
+      onEntering: this.onEntering,
+      onExit: this.onExit,
+      onExiting: this.onExiting,
+      onExited: this.onExited
+    }));
+  }, o;
+}(g.Component);
+U.defaultProps = {
+  classNames: ""
+};
+U.propTypes = process.env.NODE_ENV !== "production" ? V({}, C.propTypes, {
+  /**
+   * The animation classNames applied to the component as it appears, enters,
+   * exits or has finished the transition. A single name can be provided, which
+   * will be suffixed for each stage, e.g. `classNames="fade"` applies:
+   *
+   * - `fade-appear`, `fade-appear-active`, `fade-appear-done`
+   * - `fade-enter`, `fade-enter-active`, `fade-enter-done`
+   * - `fade-exit`, `fade-exit-active`, `fade-exit-done`
+   *
+   * A few details to note about how these classes are applied:
+   *
+   * 1. They are _joined_ with the ones that are already defined on the child
+   *    component, so if you want to add some base styles, you can use
+   *    `className` without worrying that it will be overridden.
+   *
+   * 2. If the transition component mounts with `in={false}`, no classes are
+   *    applied yet. You might be expecting `*-exit-done`, but if you think
+   *    about it, a component cannot finish exiting if it hasn't entered yet.
+   *
+   * 2. `fade-appear-done` and `fade-enter-done` will _both_ be applied. This
+   *    allows you to define different behavior for when appearing is done and
+   *    when regular entering is done, using selectors like
+   *    `.fade-enter-done:not(.fade-appear-done)`. For example, you could apply
+   *    an epic entrance animation when element first appears in the DOM using
+   *    [Animate.css](https://daneden.github.io/animate.css/). Otherwise you can
+   *    simply use `fade-enter-done` for defining both cases.
+   *
+   * Each individual classNames can also be specified independently like:
+   *
+   * ```js
+   * classNames={{
+   *  appear: 'my-appear',
+   *  appearActive: 'my-active-appear',
+   *  appearDone: 'my-done-appear',
+   *  enter: 'my-enter',
+   *  enterActive: 'my-active-enter',
+   *  enterDone: 'my-done-enter',
+   *  exit: 'my-exit',
+   *  exitActive: 'my-active-exit',
+   *  exitDone: 'my-done-exit',
+   * }}
+   * ```
+   *
+   * If you want to set these classes using CSS Modules:
+   *
+   * ```js
+   * import styles from './styles.css';
+   * ```
+   *
+   * you might want to use camelCase in your CSS file, that way could simply
+   * spread them instead of listing them one by one:
+   *
+   * ```js
+   * classNames={{ ...styles }}
+   * ```
+   *
+   * @type {string | {
+   *  appear?: string,
+   *  appearActive?: string,
+   *  appearDone?: string,
+   *  enter?: string,
+   *  enterActive?: string,
+   *  enterDone?: string,
+   *  exit?: string,
+   *  exitActive?: string,
+   *  exitDone?: string,
+   * }}
+   */
+  classNames: Ne,
+  /**
+   * A `<Transition>` callback fired immediately after the 'enter' or 'appear' class is
+   * applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool)
+   */
+  onEnter: u.func,
+  /**
+   * A `<Transition>` callback fired immediately after the 'enter-active' or
+   * 'appear-active' class is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool)
+   */
+  onEntering: u.func,
+  /**
+   * A `<Transition>` callback fired immediately after the 'enter' or
+   * 'appear' classes are **removed** and the `done` class is added to the DOM node.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool)
+   */
+  onEntered: u.func,
+  /**
+   * A `<Transition>` callback fired immediately after the 'exit' class is
+   * applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed
+   *
+   * @type Function(node: HtmlElement)
+   */
+  onExit: u.func,
+  /**
+   * A `<Transition>` callback fired immediately after the 'exit-active' is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed
+   *
+   * @type Function(node: HtmlElement)
+   */
+  onExiting: u.func,
+  /**
+   * A `<Transition>` callback fired immediately after the 'exit' classes
+   * are **removed** and the `exit-done` class is added to the DOM node.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed
+   *
+   * @type Function(node: HtmlElement)
+   */
+  onExited: u.func
+}) : {};
+function G(e, o) {
+  var l = function(t) {
+    return o && w(t) ? o(t) : t;
+  }, n = /* @__PURE__ */ Object.create(null);
+  return e && ue.map(e, function(r) {
+    return r;
+  }).forEach(function(r) {
+    n[r.key] = l(r);
+  }), n;
+}
+function Se(e, o) {
+  e = e || {}, o = o || {};
+  function l(p) {
+    return p in o ? o[p] : e[p];
+  }
+  var n = /* @__PURE__ */ Object.create(null), r = [];
+  for (var t in e)
+    t in o ? r.length && (n[t] = r, r = []) : r.push(t);
+  var i, a = {};
+  for (var s in o) {
+    if (n[s])
+      for (i = 0; i < n[s].length; i++) {
+        var c = n[s][i];
+        a[n[s][i]] = l(c);
+      }
+    a[s] = l(s);
+  }
+  for (i = 0; i < r.length; i++)
+    a[r[i]] = l(r[i]);
+  return a;
+}
+function S(e, o, l) {
+  return l[o] != null ? l[o] : e.props[o];
+}
+function Te(e, o) {
+  return G(e.children, function(l) {
+    return R(l, {
+      onExited: o.bind(null, l),
+      in: !0,
+      appear: S(l, "appear", e),
+      enter: S(l, "enter", e),
+      exit: S(l, "exit", e)
+    });
+  });
+}
+function De(e, o, l) {
+  var n = G(e.children), r = Se(o, n);
+  return Object.keys(r).forEach(function(t) {
+    var i = r[t];
+    if (w(i)) {
+      var a = t in o, s = t in n, c = o[t], p = w(c) && !c.props.in;
+      s && (!a || p) ? r[t] = R(i, {
+        onExited: l.bind(null, i),
+        in: !0,
+        exit: S(i, "exit", e),
+        enter: S(i, "enter", e)
+      }) : !s && a && !p ? r[t] = R(i, {
+        in: !1
+      }) : s && a && w(c) && (r[t] = R(i, {
+        onExited: l.bind(null, i),
+        in: c.props.in,
+        exit: S(i, "exit", e),
+        enter: S(i, "enter", e)
+      }));
+    }
+  }), r;
+}
+var Oe = Object.values || function(e) {
+  return Object.keys(e).map(function(o) {
+    return e[o];
+  });
+}, ke = {
+  component: "div",
+  childFactory: function(o) {
+    return o;
+  }
+}, j = /* @__PURE__ */ function(e) {
+  F(o, e);
+  function o(n, r) {
+    var t;
+    t = e.call(this, n, r) || this;
+    var i = t.handleExited.bind(me(t));
+    return t.state = {
+      contextValue: {
+        isMounting: !0
+      },
+      handleExited: i,
+      firstRender: !0
+    }, t;
+  }
+  var l = o.prototype;
+  return l.componentDidMount = function() {
+    this.mounted = !0, this.setState({
+      contextValue: {
+        isMounting: !1
+      }
+    });
+  }, l.componentWillUnmount = function() {
+    this.mounted = !1;
+  }, o.getDerivedStateFromProps = function(r, t) {
+    var i = t.children, a = t.handleExited, s = t.firstRender;
+    return {
+      children: s ? Te(r, a) : De(r, i, a),
+      firstRender: !1
+    };
+  }, l.handleExited = function(r, t) {
+    var i = G(this.props.children);
+    r.key in i || (r.props.onExited && r.props.onExited(t), this.mounted && this.setState(function(a) {
+      var s = V({}, a.children);
+      return delete s[r.key], {
+        children: s
+      };
+    }));
+  }, l.render = function() {
+    var r = this.props, t = r.component, i = r.childFactory, a = L(r, ["component", "childFactory"]), s = this.state.contextValue, c = Oe(this.state.children).map(i);
+    return delete a.appear, delete a.enter, delete a.exit, t === null ? /* @__PURE__ */ g.createElement(I.Provider, {
+      value: s
+    }, c) : /* @__PURE__ */ g.createElement(I.Provider, {
+      value: s
+    }, /* @__PURE__ */ g.createElement(t, a, c));
+  }, o;
+}(g.Component);
+j.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * `<TransitionGroup>` renders a `<div>` by default. You can change this
+   * behavior by providing a `component` prop.
+   * If you use React v16+ and would like to avoid a wrapping `<div>` element
+   * you can pass in `component={null}`. This is useful if the wrapping div
+   * borks your css styles.
+   */
+  component: u.any,
+  /**
+   * A set of `<Transition>` components, that are toggled `in` and out as they
+   * leave. the `<TransitionGroup>` will inject specific transition props, so
+   * remember to spread them through if you are wrapping the `<Transition>` as
+   * with our `<Fade>` example.
+   *
+   * While this component is meant for multiple `Transition` or `CSSTransition`
+   * children, sometimes you may want to have a single transition child with
+   * content that you want to be transitioned out and in when you change it
+   * (e.g. routes, images etc.) In that case you can change the `key` prop of
+   * the transition child as you change its content, this will cause
+   * `TransitionGroup` to transition the child out and back in.
+   */
+  children: u.node,
+  /**
+   * A convenience prop that enables or disables appear animations
+   * for all children. Note that specifying this will override any defaults set
+   * on individual children Transitions.
+   */
+  appear: u.bool,
+  /**
+   * A convenience prop that enables or disables enter animations
+   * for all children. Note that specifying this will override any defaults set
+   * on individual children Transitions.
+   */
+  enter: u.bool,
+  /**
+   * A convenience prop that enables or disables exit animations
+   * for all children. Note that specifying this will override any defaults set
+   * on individual children Transitions.
+   */
+  exit: u.bool,
+  /**
+   * You may need to apply reactive updates to a child as it is exiting.
+   * This is generally done by using `cloneElement` however in the case of an exiting
+   * child the element has already been removed and not accessible to the consumer.
+   *
+   * If you do need to update a child as it leaves you can provide a `childFactory`
+   * to wrap every child, even the ones that are leaving.
+   *
+   * @type Function(child: ReactElement) -> ReactElement
+   */
+  childFactory: u.func
+} : {};
+j.defaultProps = ke;
+const Y = (e) => {
+  if (e.size === "small") return e.theme.typography.medium.fontSize;
+  if (e.size === "medium") return e.theme.typography.large.fontSize;
+  if (e.size === "large") return "1.3125rem";
+}, $e = (e) => {
+  if (e === "small") return "0.40625rem 0.375rem";
+  if (e === "medium") return "0.46875rem 0.375rem";
+  if (e === "large") return "0.53125rem 0.375rem";
+}, Z = (e) => {
+  if (e === "small") return "0.625rem 0.5rem 0.375rem 0.5rem";
+  if (e === "medium") return "0.71875rem 0.5625rem 0.375rem 0.5625rem";
+  if (e === "large") return "0.78125rem 0.625rem 0.375rem 0.625rem";
+}, we = x.div`
+  display: inline-block;
+  position: relative;
+  box-sizing: border-box;
+  border: 0.09375rem solid #bfbfbf;
+  background-color: white;
+  border-radius: 0.1875rem;
+  width: 100%;
+  transition: all 250ms ease;
+`, Re = x.div`
+  padding: 0.15rem;
+  transition: all 250ms ease;
+  display: inline-block;
+`, Ie = x.div`
+  display: inline-block;
+  margin: 0.125rem;
+  flex-grow: 1;
+  transition: all 250ms ease;
+  width: fit-content;
+  & > div {
+    width: 100%;
+  }
+`, ze = x.div`
+  display: inline-block;
+  box-sizing: border-box;
+  margin: 0.125rem;
+  margin-left: 0.25rem;
+  flex-grow: 1;
+  transition: all 250ms ease;
+`, _e = x.input`
+  width: 100%;
+  transition: all 250ms ease;
+  text-decoration: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  box-sizing: border-box;
+  outline: none;
+  border: none;
+  padding: ${(e) => $e(e.size)};
+  background-color: transparent;
+  font-family: ${(e) => e.theme.typography.fontFamily};
+  font-size: ${(e) => e.theme.typography[e.size].fontSize};
+  color: ${(e) => e.theme.palette[e.color].textDark};
+  border-radius: 0.1875rem;
+`, Me = x.div`
+  display: flex;
+  width: 100%;
+`, Ae = x.div`
+  padding: ${(e) => Z(e.size)};
+  color: ${(e) => e.disabled ? e.theme.palette.gray[800] : e.theme.palette[e.color].main};
+  font-size: ${(e) => Y(e)};
+  background-color: whitesmoke;
+  transition: all 250ms ease;
+`, Pe = x.div`
+  padding: ${(e) => Z(e.size)};
+  color: ${(e) => e.disabled ? e.theme.palette.gray[800] : e.theme.palette[e.color].main};
+  font-size: ${(e) => Y(e)};
+  background-color: whitesmoke;
+  transition: all 250ms ease;
+  cursor: ${(e) => e.disabled === !0 ? "default" : "pointer"};
+  margin-right: 0;
+  margin-left: auto;
+`, Le = x.div`
+  position: absolute;
+  background-color: white;
+  z-index: 1;
+  margin-top: 0.25rem;
+  padding: 0.1875rem;
+  width: calc(100% - 0.625rem);
+  border-radius: 0.15625rem;
+  box-shadow: 0 0 0.375rem #bebebe;
+  border: 0.125rem solid ${(e) => e.theme.palette[e.color].main};
+  display: flex;
+  flex-direction: column;
+  transition: all 250ms ease;
+`, Ve = x.div`
+  font-family: ${(e) => e.theme.typography.fontFamily};
+  font-size: ${(e) => e.theme.typography[e.size].fontSize};
+  padding: 0.375rem;
+  cursor: pointer;
+  background-color: ${(e) => e.hover ? "whitesmoke" : "inherit"};
+  color: ${(e) => e.hover ? e.theme.palette[e.color].main : "inherit"};
+
+  &:hover {
+    background-color: whitesmoke;
+    color: ${(e) => e.theme.palette[e.color].main};
+  }
+`, K = (e) => {
+  const { items: o, suggestions: l, onChange: n, id: r, disabled: t, className: i, size: a, color: s } = e, [c, p] = M(""), [m, h] = M(!1), [b, k] = M(0);
+  let W = g.createRef();
+  const { theme: ee } = pe();
+  let E = { size: a, color: s, theme: ee };
+  const te = () => ("10000000-1000-4000-8000" + -1e11).replace(
+    /[018]/g,
+    (d) => (d ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> d / 4).toString(16)
+  ), ne = (d) => {
+    d.keyCode === 27 && W.current.blur(), (d.keyCode === 38 || d.keyCode === 40) && d.preventDefault(), d.keyCode === 38 && b > 0 && k(b - 1), d.keyCode === 40 && b < l.length - 1 && k(b + 1), d.key === "Enter" && l.length > 0 && c && c.length > 0 && B(l[b]), d.key === "Backspace" && o.length > 0 && c === "" && q(o.length - 1);
+  }, B = (d) => {
+    oe({
+      id: te(),
+      field: d.field,
+      description: d.description,
+      value: c,
+      active: !0,
+      dataType: d.dataType,
+      operation: d.operation,
+      operationDescription: d.operationDescription
+    }), p(""), h(!1), k(0);
+  }, re = () => {
+    h(!1);
+  }, ie = (d) => {
+    h(!0), k(0), p(d.target.value);
+  }, q = (d) => {
+    let f = [...o].find((le, z) => z !== d);
+    n(
+      r,
+      [...o].filter((le, z) => z !== d),
+      f
+    );
+  }, oe = (d) => {
+    n(r, [...o, d], d);
+  }, ae = (d) => {
+    let f = [...o];
+    f[d] = { ...f[d], active: !f[d].active }, n(r, f, f[d]);
+  }, se = () => {
+    if (m)
+      return /* @__PURE__ */ v(ge, { children: /* @__PURE__ */ v(Le, { ...E, children: l.map((d, f) => /* @__PURE__ */ X(
+        Ve,
+        {
+          ...E,
+          key: f,
+          onMouseDown: () => B(d),
+          hover: b === f
+        },
+        `${d.description} - ${d.operationDescription}`
+      )) }) });
+  };
+  return /* @__PURE__ */ _(we, { className: i, ...E, children: [
+    /* @__PURE__ */ _(Me, { ...E, children: [
+      /* @__PURE__ */ v(Ae, { ...E, disabled: t, children: /* @__PURE__ */ v("i", { className: "fas fa-search fa-fw" }) }),
+      /* @__PURE__ */ _(Re, { ...E, children: [
+        /* @__PURE__ */ v(j, { component: null, children: o.map((d, f) => /* @__PURE__ */ v(U, { timeout: 200, classNames: "item", children: /* @__PURE__ */ X(
+          Ie,
+          {
+            ...E,
+            key: f,
+            first: f === 0,
+            title: `${d.description} - ${d.operationDescription}:  ${d.value}`
+          },
+          /* @__PURE__ */ v(
+            ce,
+            {
+              ...E,
+              id: d.id,
+              text: d.description,
+              additionalInfo: d.value,
+              inactive: !d.active,
+              onRemove: () => t ? {} : q(f),
+              onClick: () => t ? {} : ae(f),
+              disabled: t
+            }
+          )
+        ) }, f)) }),
+        /* @__PURE__ */ v(ze, { ...E, children: /* @__PURE__ */ v(
+          _e,
+          {
+            ...E,
+            ref: W,
+            value: c,
+            onBlur: re,
+            onChange: ie,
+            onKeyDown: ne,
+            disabled: t
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ v(Pe, { ...E, disabled: t, children: /* @__PURE__ */ v(
+        "i",
+        {
+          className: "fas fa-times fa-fw",
+          onClick: () => t ? {} : n(r, [])
+        }
+      ) })
+    ] }),
+    se()
+  ] });
+};
+K.defaultProps = {
+  id: "",
+  disabled: !1,
+  onChange: () => {
+  },
+  items: [],
+  suggestions: [],
+  className: "",
+  size: "small",
+  color: "primary"
+};
+K.propTypes = {
+  id: u.any,
+  disabled: u.bool,
+  onChange: u.func,
+  className: u.string,
+  items: u.array,
+  suggestions: u.array,
+  size: u.oneOf(["small", "medium", "large"]),
+  color: u.oneOf([
+    "primary",
+    "secondary",
+    "success",
+    "error",
+    "warning",
+    "gray",
+    "background",
+    "transparent",
+    "neutral"
+  ])
+};
+export {
+  K as default
+};