@access-ci/ui 0.1.0

package/README.md

@@ -0,0 +1,79 @@
+# ACCESS CI User Interface Components
+
+This library provides user interface components for [ACCESS CI](https://access-ci.org/)
+websites. The components are rendered using the shadow DOM so that their styles are
+isolated from the rest of the site.
+
+## Prerequisites
+
+Sites using ACCESS user interface components should include the Archivo font family:
+
+```html
+<link
+  rel="stylesheet"
+  id="google-font-archivo-css"
+  href="https://fonts.googleapis.com/css2?family=Archivo:ital,wdth,wght@0,70,400;0,100,400;0,100,500;0,100,600;0,100,700;0,100,800;1,100,400&amp;display=swap"
+  media="all"
+/>
+```
+
+## Menus
+
+The library includes functions for rendering the ACCESS universal navigation menus
+and site menus:
+
+```html
+<div id="universal-menus"></div>
+...
+<div id="site-menus"></div>
+<script type="module">
+  import { universalMenus, siteMenus } from "https://esm.sh/@access-ci/ui";
+
+  universalMenus({
+    loginUrl: "/login",
+    logoutUrl: "/logout",
+    target: document.getElementById("universal-menus"),
+  });
+
+  siteMenus({
+    items: [
+      {
+        name: "One",
+        items: [
+          {
+            name: "Item A",
+            href: "/one/a",
+          },
+          {
+            name: "Item B",
+            href: "/one/b",
+          },
+          {
+            name: "Item C",
+            href: "/one/c",
+          },
+        ],
+      },
+      {
+        name: "Two",
+        items: [
+          {
+            name: "Item A",
+            href: "/two/a",
+          },
+          {
+            name: "Item B",
+            href: "/two/b",
+          },
+        ],
+      },
+      {
+        name: "Three",
+        href: "/three",
+      },
+    ],
+    siteName: "Allocations",
+    target: document.getElementById("site-menus"),
+  });
+</script>
+```

package/dist/access-ci-ui.js

@@ -0,0 +1,634 @@
+var I, u, le, P, X, ue, R, L = {}, me = [], Me = /acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i, G = Array.isArray;
+function C(t, e) {
+  for (var n in e)
+    t[n] = e[n];
+  return t;
+}
+function pe(t) {
+  var e = t.parentNode;
+  e && e.removeChild(t);
+}
+function He(t, e, n) {
+  var c, a, o, r = {};
+  for (o in e)
+    o == "key" ? c = e[o] : o == "ref" ? a = e[o] : r[o] = e[o];
+  if (arguments.length > 2 && (r.children = arguments.length > 3 ? I.call(arguments, 2) : n), typeof t == "function" && t.defaultProps != null)
+    for (o in t.defaultProps)
+      r[o] === void 0 && (r[o] = t.defaultProps[o]);
+  return T(t, r, c, a, null);
+}
+function T(t, e, n, c, a) {
+  var o = { type: t, props: e, key: n, ref: c, __k: null, __: null, __b: 0, __e: null, __d: void 0, __c: null, __h: null, constructor: void 0, __v: a ?? ++le };
+  return a == null && u.vnode != null && u.vnode(o), o;
+}
+function N(t) {
+  return t.children;
+}
+function U(t, e) {
+  this.props = t, this.context = e;
+}
+function V(t, e) {
+  if (e == null)
+    return t.__ ? V(t.__, t.__.__k.indexOf(t) + 1) : null;
+  for (var n; e < t.__k.length; e++)
+    if ((n = t.__k[e]) != null && n.__e != null)
+      return n.__e;
+  return typeof t.type == "function" ? V(t) : null;
+}
+function de(t) {
+  var e, n;
+  if ((t = t.__) != null && t.__c != null) {
+    for (t.__e = t.__c.base = null, e = 0; e < t.__k.length; e++)
+      if ((n = t.__k[e]) != null && n.__e != null) {
+        t.__e = t.__c.base = n.__e;
+        break;
+      }
+    return de(t);
+  }
+}
+function Y(t) {
+  (!t.__d && (t.__d = !0) && P.push(t) && !B.__r++ || X !== u.debounceRendering) && ((X = u.debounceRendering) || ue)(B);
+}
+function B() {
+  var t, e, n, c, a, o, r, _, s;
+  for (P.sort(R); t = P.shift(); )
+    t.__d && (e = P.length, c = void 0, a = void 0, o = void 0, _ = (r = (n = t).__v).__e, (s = n.__P) && (c = [], a = [], (o = C({}, r)).__v = r.__v + 1, Q(s, r, o, n.__n, s.ownerSVGElement !== void 0, r.__h != null ? [_] : null, c, _ ?? V(r), r.__h, a), ge(c, r, a), r.__e != _ && de(r)), P.length > e && P.sort(R));
+  B.__r = 0;
+}
+function fe(t, e, n, c, a, o, r, _, s, h, p) {
+  var i, d, f, l, m, H, v, g, x, M, w = 0, k = c && c.__k || me, E = k.length, $ = E, y = e.length;
+  for (n.__k = [], i = 0; i < y; i++)
+    (l = n.__k[i] = (l = e[i]) == null || typeof l == "boolean" || typeof l == "function" ? null : typeof l == "string" || typeof l == "number" || typeof l == "bigint" ? T(null, l, null, null, l) : G(l) ? T(N, { children: l }, null, null, null) : l.__b > 0 ? T(l.type, l.props, l.key, l.ref ? l.ref : null, l.__v) : l) != null && (l.__ = n, l.__b = n.__b + 1, (g = Ce(l, k, v = i + w, $)) === -1 ? f = L : (f = k[g] || L, k[g] = void 0, $--), Q(t, l, f, a, o, r, _, s, h, p), m = l.__e, (d = l.ref) && f.ref != d && (f.ref && J(f.ref, null, l), p.push(d, l.__c || m, l)), m != null && (H == null && (H = m), M = !(x = f === L || f.__v === null) && g === v, x ? g == -1 && w-- : g !== v && (g === v + 1 ? (w++, M = !0) : g > v ? $ > y - v ? (w += g - v, M = !0) : w-- : w = g < v && g == v - 1 ? g - v : 0), v = i + w, M = M || g == i && !x, typeof l.type != "function" || g === v && f.__k !== l.__k ? typeof l.type == "function" || M ? l.__d !== void 0 ? (s = l.__d, l.__d = void 0) : s = m.nextSibling : s = ve(t, m, s) : s = he(l, s, t), typeof n.type == "function" && (n.__d = s)));
+  for (n.__e = H, i = E; i--; )
+    k[i] != null && (typeof n.type == "function" && k[i].__e != null && k[i].__e == n.__d && (n.__d = k[i].__e.nextSibling), be(k[i], k[i]));
+}
+function he(t, e, n) {
+  for (var c, a = t.__k, o = 0; a && o < a.length; o++)
+    (c = a[o]) && (c.__ = t, e = typeof c.type == "function" ? he(c, e, n) : ve(n, c.__e, e));
+  return e;
+}
+function ve(t, e, n) {
+  return n == null || n.parentNode !== t ? t.insertBefore(e, null) : e == n && e.parentNode != null || t.insertBefore(e, n), e.nextSibling;
+}
+function Ce(t, e, n, c) {
+  var a = t.key, o = t.type, r = n - 1, _ = n + 1, s = e[n];
+  if (s === null || s && a == s.key && o === s.type)
+    return n;
+  if (c > (s != null ? 1 : 0))
+    for (; r >= 0 || _ < e.length; ) {
+      if (r >= 0) {
+        if ((s = e[r]) && a == s.key && o === s.type)
+          return r;
+        r--;
+      }
+      if (_ < e.length) {
+        if ((s = e[_]) && a == s.key && o === s.type)
+          return _;
+        _++;
+      }
+    }
+  return -1;
+}
+function Ee(t, e, n, c, a) {
+  var o;
+  for (o in n)
+    o === "children" || o === "key" || o in e || F(t, o, null, n[o], c);
+  for (o in e)
+    a && typeof e[o] != "function" || o === "children" || o === "key" || o === "value" || o === "checked" || n[o] === e[o] || F(t, o, e[o], n[o], c);
+}
+function Z(t, e, n) {
+  e[0] === "-" ? t.setProperty(e, n ?? "") : t[e] = n == null ? "" : typeof n != "number" || Me.test(e) ? n : n + "px";
+}
+function F(t, e, n, c, a) {
+  var o;
+  e:
+    if (e === "style")
+      if (typeof n == "string")
+        t.style.cssText = n;
+      else {
+        if (typeof c == "string" && (t.style.cssText = c = ""), c)
+          for (e in c)
+            n && e in n || Z(t.style, e, "");
+        if (n)
+          for (e in n)
+            c && n[e] === c[e] || Z(t.style, e, n[e]);
+      }
+    else if (e[0] === "o" && e[1] === "n")
+      o = e !== (e = e.replace(/Capture$/, "")), e = e.toLowerCase() in t ? e.toLowerCase().slice(2) : e.slice(2), t.l || (t.l = {}), t.l[e + o] = n, n ? c || t.addEventListener(e, o ? te : ee, o) : t.removeEventListener(e, o ? te : ee, o);
+    else if (e !== "dangerouslySetInnerHTML") {
+      if (a)
+        e = e.replace(/xlink(H|:h)/, "h").replace(/sName$/, "s");
+      else if (e !== "width" && e !== "height" && e !== "href" && e !== "list" && e !== "form" && e !== "tabIndex" && e !== "download" && e !== "rowSpan" && e !== "colSpan" && e in t)
+        try {
+          t[e] = n ?? "";
+          break e;
+        } catch {
+        }
+      typeof n == "function" || (n == null || n === !1 && e[4] !== "-" ? t.removeAttribute(e) : t.setAttribute(e, n));
+    }
+}
+function ee(t) {
+  return this.l[t.type + !1](u.event ? u.event(t) : t);
+}
+function te(t) {
+  return this.l[t.type + !0](u.event ? u.event(t) : t);
+}
+function Q(t, e, n, c, a, o, r, _, s, h) {
+  var p, i, d, f, l, m, H, v, g, x, M, w, k, E, $, y = e.type;
+  if (e.constructor !== void 0)
+    return null;
+  n.__h != null && (s = n.__h, _ = e.__e = n.__e, e.__h = null, o = [_]), (p = u.__b) && p(e);
+  try {
+    e:
+      if (typeof y == "function") {
+        if (v = e.props, g = (p = y.contextType) && c[p.__c], x = p ? g ? g.props.value : p.__ : c, n.__c ? H = (i = e.__c = n.__c).__ = i.__E : ("prototype" in y && y.prototype.render ? e.__c = i = new y(v, x) : (e.__c = i = new U(v, x), i.constructor = y, i.render = Pe), g && g.sub(i), i.props = v, i.state || (i.state = {}), i.context = x, i.__n = c, d = i.__d = !0, i.__h = [], i._sb = []), i.__s == null && (i.__s = i.state), y.getDerivedStateFromProps != null && (i.__s == i.state && (i.__s = C({}, i.__s)), C(i.__s, y.getDerivedStateFromProps(v, i.__s))), f = i.props, l = i.state, i.__v = e, d)
+          y.getDerivedStateFromProps == null && i.componentWillMount != null && i.componentWillMount(), i.componentDidMount != null && i.__h.push(i.componentDidMount);
+        else {
+          if (y.getDerivedStateFromProps == null && v !== f && i.componentWillReceiveProps != null && i.componentWillReceiveProps(v, x), !i.__e && (i.shouldComponentUpdate != null && i.shouldComponentUpdate(v, i.__s, x) === !1 || e.__v === n.__v)) {
+            for (e.__v !== n.__v && (i.props = v, i.state = i.__s, i.__d = !1), e.__e = n.__e, e.__k = n.__k, e.__k.forEach(function(A) {
+              A && (A.__ = e);
+            }), M = 0; M < i._sb.length; M++)
+              i.__h.push(i._sb[M]);
+            i._sb = [], i.__h.length && r.push(i);
+            break e;
+          }
+          i.componentWillUpdate != null && i.componentWillUpdate(v, i.__s, x), i.componentDidUpdate != null && i.__h.push(function() {
+            i.componentDidUpdate(f, l, m);
+          });
+        }
+        if (i.context = x, i.props = v, i.__P = t, i.__e = !1, w = u.__r, k = 0, "prototype" in y && y.prototype.render) {
+          for (i.state = i.__s, i.__d = !1, w && w(e), p = i.render(i.props, i.state, i.context), E = 0; E < i._sb.length; E++)
+            i.__h.push(i._sb[E]);
+          i._sb = [];
+        } else
+          do
+            i.__d = !1, w && w(e), p = i.render(i.props, i.state, i.context), i.state = i.__s;
+          while (i.__d && ++k < 25);
+        i.state = i.__s, i.getChildContext != null && (c = C(C({}, c), i.getChildContext())), d || i.getSnapshotBeforeUpdate == null || (m = i.getSnapshotBeforeUpdate(f, l)), fe(t, G($ = p != null && p.type === N && p.key == null ? p.props.children : p) ? $ : [$], e, n, c, a, o, r, _, s, h), i.base = e.__e, e.__h = null, i.__h.length && r.push(i), H && (i.__E = i.__ = null);
+      } else
+        o == null && e.__v === n.__v ? (e.__k = n.__k, e.__e = n.__e) : e.__e = $e(n.__e, e, n, c, a, o, r, s, h);
+    (p = u.diffed) && p(e);
+  } catch (A) {
+    e.__v = null, (s || o != null) && (e.__e = _, e.__h = !!s, o[o.indexOf(_)] = null), u.__e(A, e, n);
+  }
+}
+function ge(t, e, n) {
+  for (var c = 0; c < n.length; c++)
+    J(n[c], n[++c], n[++c]);
+  u.__c && u.__c(e, t), t.some(function(a) {
+    try {
+      t = a.__h, a.__h = [], t.some(function(o) {
+        o.call(a);
+      });
+    } catch (o) {
+      u.__e(o, a.__v);
+    }
+  });
+}
+function $e(t, e, n, c, a, o, r, _, s) {
+  var h, p, i, d = n.props, f = e.props, l = e.type, m = 0;
+  if (l === "svg" && (a = !0), o != null) {
+    for (; m < o.length; m++)
+      if ((h = o[m]) && "setAttribute" in h == !!l && (l ? h.localName === l : h.nodeType === 3)) {
+        t = h, o[m] = null;
+        break;
+      }
+  }
+  if (t == null) {
+    if (l === null)
+      return document.createTextNode(f);
+    t = a ? document.createElementNS("http://www.w3.org/2000/svg", l) : document.createElement(l, f.is && f), o = null, _ = !1;
+  }
+  if (l === null)
+    d === f || _ && t.data === f || (t.data = f);
+  else {
+    if (o = o && I.call(t.childNodes), p = (d = n.props || L).dangerouslySetInnerHTML, i = f.dangerouslySetInnerHTML, !_) {
+      if (o != null)
+        for (d = {}, m = 0; m < t.attributes.length; m++)
+          d[t.attributes[m].name] = t.attributes[m].value;
+      (i || p) && (i && (p && i.__html == p.__html || i.__html === t.innerHTML) || (t.innerHTML = i && i.__html || ""));
+    }
+    if (Ee(t, f, d, a, _), i)
+      e.__k = [];
+    else if (fe(t, G(m = e.props.children) ? m : [m], e, n, c, a && l !== "foreignObject", o, r, o ? o[0] : n.__k && V(n, 0), _, s), o != null)
+      for (m = o.length; m--; )
+        o[m] != null && pe(o[m]);
+    _ || ("value" in f && (m = f.value) !== void 0 && (m !== t.value || l === "progress" && !m || l === "option" && m !== d.value) && F(t, "value", m, d.value, !1), "checked" in f && (m = f.checked) !== void 0 && m !== t.checked && F(t, "checked", m, d.checked, !1));
+  }
+  return t;
+}
+function J(t, e, n) {
+  try {
+    typeof t == "function" ? t(e) : t.current = e;
+  } catch (c) {
+    u.__e(c, n);
+  }
+}
+function be(t, e, n) {
+  var c, a;
+  if (u.unmount && u.unmount(t), (c = t.ref) && (c.current && c.current !== t.__e || J(c, null, e)), (c = t.__c) != null) {
+    if (c.componentWillUnmount)
+      try {
+        c.componentWillUnmount();
+      } catch (o) {
+        u.__e(o, e);
+      }
+    c.base = c.__P = null, t.__c = void 0;
+  }
+  if (c = t.__k)
+    for (a = 0; a < c.length; a++)
+      c[a] && be(c[a], e, n || typeof t.type != "function");
+  n || t.__e == null || pe(t.__e), t.__ = t.__e = t.__d = void 0;
+}
+function Pe(t, e, n) {
+  return this.constructor(t, n);
+}
+function Le(t, e, n) {
+  var c, a, o, r;
+  u.__ && u.__(t, e), a = (c = typeof n == "function") ? null : n && n.__k || e.__k, o = [], r = [], Q(e, t = (!c && n || e).__k = He(N, null, [t]), a || L, L, e.ownerSVGElement !== void 0, !c && n ? [n] : a ? null : e.firstChild ? I.call(e.childNodes) : null, o, !c && n ? n : a ? a.__e : e.firstChild, c, r), ge(o, t, r);
+}
+I = me.slice, u = { __e: function(t, e, n, c) {
+  for (var a, o, r; e = e.__; )
+    if ((a = e.__c) && !a.__)
+      try {
+        if ((o = a.constructor) && o.getDerivedStateFromError != null && (a.setState(o.getDerivedStateFromError(t)), r = a.__d), a.componentDidCatch != null && (a.componentDidCatch(t, c || {}), r = a.__d), r)
+          return a.__E = a;
+      } catch (_) {
+        t = _;
+      }
+  throw t;
+} }, le = 0, U.prototype.setState = function(t, e) {
+  var n;
+  n = this.__s != null && this.__s !== this.state ? this.__s : this.__s = C({}, this.state), typeof t == "function" && (t = t(C({}, n), this.props)), t && C(n, t), t != null && this.__v && (e && this._sb.push(e), Y(this));
+}, U.prototype.forceUpdate = function(t) {
+  this.__v && (this.__e = !0, t && this.__h.push(t), Y(this));
+}, U.prototype.render = N, P = [], ue = typeof Promise == "function" ? Promise.prototype.then.bind(Promise.resolve()) : setTimeout, R = function(t, e) {
+  return t.__v.__b - e.__v.__b;
+}, B.__r = 0;
+var z, b, W, ne, j = 0, ye = [], D = [], ie = u.__b, oe = u.__r, ce = u.diffed, ae = u.__c, re = u.unmount;
+function K(t, e) {
+  u.__h && u.__h(b, t, j || e), j = 0;
+  var n = b.__H || (b.__H = { __: [], __h: [] });
+  return t >= n.__.length && n.__.push({ __V: D }), n.__[t];
+}
+function _e(t) {
+  return j = 1, Ne(xe, t);
+}
+function Ne(t, e, n) {
+  var c = K(z++, 2);
+  if (c.t = t, !c.__c && (c.__ = [n ? n(e) : xe(void 0, e), function(_) {
+    var s = c.__N ? c.__N[0] : c.__[0], h = c.t(s, _);
+    s !== h && (c.__N = [h, c.__[1]], c.__c.setState({}));
+  }], c.__c = b, !b.u)) {
+    var a = function(_, s, h) {
+      if (!c.__c.__H)
+        return !0;
+      var p = c.__c.__H.__.filter(function(d) {
+        return d.__c;
+      });
+      if (p.every(function(d) {
+        return !d.__N;
+      }))
+        return !o || o.call(this, _, s, h);
+      var i = !1;
+      return p.forEach(function(d) {
+        if (d.__N) {
+          var f = d.__[0];
+          d.__ = d.__N, d.__N = void 0, f !== d.__[0] && (i = !0);
+        }
+      }), !(!i && c.__c.props === _) && (!o || o.call(this, _, s, h));
+    };
+    b.u = !0;
+    var o = b.shouldComponentUpdate, r = b.componentWillUpdate;
+    b.componentWillUpdate = function(_, s, h) {
+      if (this.__e) {
+        var p = o;
+        o = void 0, a(_, s, h), o = p;
+      }
+      r && r.call(this, _, s, h);
+    }, b.shouldComponentUpdate = a;
+  }
+  return c.__N || c.__;
+}
+function ze(t, e) {
+  var n = K(z++, 3);
+  !u.__s && De(n.__H, e) && (n.__ = t, n.i = e, b.__H.__h.push(n));
+}
+function Ae() {
+  var t = K(z++, 11);
+  if (!t.__) {
+    for (var e = b.__v; e !== null && !e.__m && e.__ !== null; )
+      e = e.__;
+    var n = e.__m || (e.__m = [0, 0]);
+    t.__ = "P" + n[0] + "-" + n[1]++;
+  }
+  return t.__;
+}
+function Te() {
+  for (var t; t = ye.shift(); )
+    if (t.__P && t.__H)
+      try {
+        t.__H.__h.forEach(O), t.__H.__h.forEach(q), t.__H.__h = [];
+      } catch (e) {
+        t.__H.__h = [], u.__e(e, t.__v);
+      }
+}
+u.__b = function(t) {
+  b = null, ie && ie(t);
+}, u.__r = function(t) {
+  oe && oe(t), z = 0;
+  var e = (b = t.__c).__H;
+  e && (W === b ? (e.__h = [], b.__h = [], e.__.forEach(function(n) {
+    n.__N && (n.__ = n.__N), n.__V = D, n.__N = n.i = void 0;
+  })) : (e.__h.forEach(O), e.__h.forEach(q), e.__h = [], z = 0)), W = b;
+}, u.diffed = function(t) {
+  ce && ce(t);
+  var e = t.__c;
+  e && e.__H && (e.__H.__h.length && (ye.push(e) !== 1 && ne === u.requestAnimationFrame || ((ne = u.requestAnimationFrame) || Ue)(Te)), e.__H.__.forEach(function(n) {
+    n.i && (n.__H = n.i), n.__V !== D && (n.__ = n.__V), n.i = void 0, n.__V = D;
+  })), W = b = null;
+}, u.__c = function(t, e) {
+  e.some(function(n) {
+    try {
+      n.__h.forEach(O), n.__h = n.__h.filter(function(c) {
+        return !c.__ || q(c);
+      });
+    } catch (c) {
+      e.some(function(a) {
+        a.__h && (a.__h = []);
+      }), e = [], u.__e(c, n.__v);
+    }
+  }), ae && ae(t, e);
+}, u.unmount = function(t) {
+  re && re(t);
+  var e, n = t.__c;
+  n && n.__H && (n.__H.__.forEach(function(c) {
+    try {
+      O(c);
+    } catch (a) {
+      e = a;
+    }
+  }), n.__H = void 0, e && u.__e(e, n.__v));
+};
+var se = typeof requestAnimationFrame == "function";
+function Ue(t) {
+  var e, n = function() {
+    clearTimeout(c), se && cancelAnimationFrame(e), setTimeout(t);
+  }, c = setTimeout(n, 100);
+  se && (e = requestAnimationFrame(n));
+}
+function O(t) {
+  var e = b, n = t.__c;
+  typeof n == "function" && (t.__c = void 0, n()), b = e;
+}
+function q(t) {
+  var e = b;
+  t.__c = t.__(), b = e;
+}
+function De(t, e) {
+  return !t || t.length !== e.length || e.some(function(n, c) {
+    return n !== t[c];
+  });
+}
+function xe(t, e) {
+  return typeof e == "function" ? e(t) : e;
+}
+const Oe = `.acim-menu{--acim-teal-600: #107180;--acim-teal-700: #1a5b6e;--acim-color: white;--acim-padding: 30px;--acim-offset: 0px;--acim-outline: white}.acim-universal{--acim-background: var(--acim-teal-700);--acim-border: rgba(19, 133, 151, .35)}.acim-site{--acim-background: var(--acim-teal-600);--acim-border: #157688}.acim-site ul ul{--acim-border: rgba(19, 133, 151, .35)}.acim-menu,.acim-menu button{font-family:Archivo,sans-serif}.acim-menu ul,.acim-menu li{list-style-type:none;margin:0;padding:0}.acim-menu a{text-decoration:none}.acim-item{background:transparent;border:0 none transparent;border-radius:0;box-sizing:border-box;cursor:pointer;display:block;text-align:left;width:100%}.acim-item{font-size:14px;font-weight:600;line-height:21px;padding:13.5px var(--acim-padding) 13.5px}.acim-menu>ul>li>.acim-item{font-weight:800}.acim-item,.acim-menu>.acim-expanded{border-bottom:1px solid var(--acim-border)}.acim-expanded,.acim-icon-search .acim-item,.acim-menu li:last-child>.acim-item,.acim-menu>.acim-collapsed{border-bottom:0 none transparent}.acim-menu>button{text-transform:uppercase}.acim-menu button{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'><path fill='white' d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/></svg>");background-position:calc(100% - var(--acim-padding) - var(--acim-offset)) center;background-repeat:no-repeat;background-size:14px 24px}.acim-menu button.acim-expanded{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'><path fill='white' d='m 182.62211,201.27501 c -12.5,-12.5 -32.8,-12.5 -45.3,0 L 9.322106,329.275 c -9.19999996,9.2 -11.9,22.9 -6.9,34.9 5,12 16.6,19.8 29.6,19.8 l 256.000004,-0.1 c 12.9,0 24.6,-7.8 29.6,-19.8 5,-12 2.2,-25.7 -6.9,-34.9 l -128,-127.99999 z'/></svg>")}.acim-menu button,.acim-menu ul li{background-color:var(--acim-background)}.acim-menu button,.acim-menu ul li a{color:var(--acim-color)}.acim-menu ul li li{background-color:#fff}.acim-menu ul li li a{color:#138597}.acim-icon>.acim-item{background-position:calc(var(--acim-padding) + var(--acim-offset)) center;background-repeat:no-repeat;background-size:14px 14px;text-indent:-99999px}.acim-icon-home>.acim-item{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512' fill='white'><path d='M543.8 287.6c17 0 32-14 32-32.1c1-9-3-17-11-24L512 185V64c0-17.7-14.3-32-32-32H448c-17.7 0-32 14.3-32 32v36.7L309.5 7c-6-5-14-7-21-7s-15 1-22 8L10 231.5c-7 7-10 15-10 24c0 18 14 32.1 32 32.1h32v69.7c-.1 .9-.1 1.8-.1 2.8V472c0 22.1 17.9 40 40 40h16c1.2 0 2.4-.1 3.6-.2c1.5 .1 3 .2 4.5 .2H160h24c22.1 0 40-17.9 40-40V448 384c0-17.7 14.3-32 32-32h64c17.7 0 32 14.3 32 32v64 24c0 22.1 17.9 40 40 40h24 32.5c1.4 0 2.8 0 4.2-.1c1.1 .1 2.2 .1 3.3 .1h16c22.1 0 40-17.9 40-40V455.8c.3-2.6 .5-5.3 .5-8.1l-.7-160.2h32z'/></svg>")}.acim-icon-search>.acim-item{background-image:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='18' height='18' viewBox='0 0 100 100'><path fill='white' class='st0' d='M98.22,92.72l-5.48,5.47c-1.8,1.82-4.74,1.82-6.55,0L66.9,78.9c-0.87-0.87-1.35-2.05-1.35-3.29v-3.15 c-6.83,5.34-15.42,8.51-24.76,8.51c-22.23,0-40.24-18.01-40.24-40.24S18.55,0.49,40.78,0.49S81.02,18.5,81.02,40.73 c0,9.34-3.18,17.94-8.51,24.76h3.15c1.24,0,2.42,0.48,3.29,1.35l19.29,19.29C100.03,87.95,100.03,90.89,98.22,92.72z M65.54,40.73 c0-13.7-11.08-24.76-24.76-24.76c-13.7,0-24.76,11.08-24.76,24.76c0,13.7,11.08,24.76,24.76,24.76 C54.47,65.49,65.54,54.41,65.54,40.73z'></path></svg>")}.acim-icon-hamburger>.acim-item,.acim-icon-hamburger>.acim-item.acim-expanded{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='white'><path d='M24 6h-24v-4h24v4zm0 4h-24v4h24v-4zm0 8h-24v4h24v-4z'/></svg>")}.acim-track .acim-item{text-transform:uppercase;padding-top:5px;padding-bottom:5px}.acim-track:not(.acim-grow) .acim-item{border-bottom:0 none transparent}.acim-track.acim-grow .acim-item{padding-bottom:10px}.acim-hamburger>button{display:none}@media (min-width: 600px){.acim-menu{--acim-padding:calc((100% - 540px)/2);--acim-offset: 7px}}@media (min-width: 768px){.acim-menu{--acim-padding:calc((100% - 712px)/2)}}@media (min-width: 900px){.acim-menu{--acim-padding: 10px;--acim-offset: 0px}.acim-site{--acim-background: white;--acim-color: var(--acim-teal-600);--acim-outline: var(--acim-teal-700);--acim-padding: 20px;border-bottom:1px solid #d9d9d9;border-top:3px solid var(--acim-teal-700)}.acim-site>ul{justify-content:end}.acim-menu>button{display:none}.acim-menu>ul{display:flex;flex-direction:row;margin:0 auto;width:calc(840px + (2 * var(--acim-padding)))}.acim-item,.acim-track .acim-item{border-bottom:0 none transparent;padding-top:12px;padding-bottom:12px}.acim-site .acim-item{font-size:16px}.acim-grow{flex:1 0 auto}.acim-universal{background-color:var(--acim-teal-700)}.acim-icon>.acim-item{background-position:center center;width:56px}.acim-menu button,.acim-menu button.acim-expanded{background-image:none}.acim-hamburger>button{display:block}.acim-menu>ul>li{display:flex;flex-direction:row;justify-content:start;position:relative}.acim-menu>ul>li.acim-grow>.acim-item{flex:0 1 0}.acim-menu>ul>li>.acim-expanded,.acim-menu>ul>li>.acim-item:active,.acim-menu>ul>li>.acim-item:focus,.acim-menu>ul>li>.acim-item:hover{background-color:var(--acim-teal-600);color:#fff;outline:0 none transparent}.acim-menu>ul>li>.acim-item:focus-visible{outline:3px solid var(--acim-outline);outline-offset:-3px;z-index:1000}.acim-menu>ul ul{background-color:var(--acim-teal-600);padding:10px 0;position:absolute;right:0;top:48px;z-index:9999}.acim-menu>ul ul li{background-color:var(--acim-teal-600)}.acim-menu>ul ul .acim-item{color:#fff;white-space:nowrap;padding:5px 20px}.acim-menu>ul ul .acim-item:active,.acim-menu>ul ul .acim-item:focus,.acim-menu>ul ul .acim-item:hover{color:#cee8e9;outline:0 none transparent;text-decoration:underline}.acim-menu>ul ul .acim-item:focus-visible{outline:3px solid white;outline-offset:-3px;z-index:1000}.acim-menu>ul>li>.acim-item{line-height:24px}}@media (min-width: 1024px){.acim-menu>ul{width:calc(940px + (2 * var(--acim-padding)))}}@media (min-width: 1280px){.acim-menu>ul{width:calc(1180px + (2 * var(--acim-padding)))}}
+`;
+var Ve = 0;
+function S(t, e, n, c, a, o) {
+  var r, _, s = {};
+  for (_ in e)
+    _ == "ref" ? r = e[_] : s[_] = e[_];
+  var h = { type: t, props: s, key: n, ref: r, __k: null, __: null, __b: 0, __e: null, __d: void 0, __c: null, __h: null, constructor: void 0, __v: --Ve, __source: a, __self: o };
+  if (typeof t == "function" && (r = t.defaultProps))
+    for (_ in r)
+      s[_] === void 0 && (s[_] = r[_]);
+  return u.vnode && u.vnode(h), h;
+}
+const we = ({
+  autoOpenMode: t,
+  classes: e = "",
+  href: n = "",
+  html: c = "",
+  items: a,
+  mode: o,
+  name: r,
+  open: _,
+  parentId: s = "root",
+  setOpen: h
+}) => {
+  const p = Ae(), i = _[s] == p, d = i || t == o, f = () => h({
+    ..._,
+    [s]: i ? null : p
+  });
+  if (c)
+    return S("div", {
+      dangerouslySetInnerHTML: {
+        __html: c
+      }
+    });
+  if (n)
+    return S("a", {
+      href: n,
+      class: `acim-item ${e || ""}`,
+      children: r
+    });
+  if (a)
+    return S(N, {
+      children: [r && S("button", {
+        "aria-expanded": d,
+        "aria-controls": p,
+        class: `acim-item ${d ? "acim-expanded" : "acim-collapsed"}`,
+        onClick: f,
+        children: r
+      }), S("ul", {
+        class: e,
+        id: p,
+        hidden: !d,
+        "aria-hidden": !d,
+        children: a.map(({
+          autoOpenMode: l,
+          classes: m,
+          href: H,
+          html: v,
+          items: g,
+          name: x
+        }) => S("li", {
+          class: m || "",
+          children: S(we, {
+            autoOpenMode: l,
+            href: H,
+            html: v,
+            items: g,
+            mode: o,
+            name: x,
+            open: _,
+            parentId: p,
+            setOpen: h
+          })
+        }))
+      })]
+    });
+}, ke = ({
+  classes: t,
+  items: e,
+  name: n,
+  target: c
+}) => {
+  const a = () => document.body.clientWidth >= 900 ? "desktop" : "mobile", [o, r] = _e(a()), [_, s] = _e({});
+  return ze(() => {
+    window.addEventListener("resize", () => r(a())), document.body.addEventListener("click", (h) => {
+      h.target != c && a() == "desktop" && s({});
+    }), c.addEventListener("keydown", ({
+      key: h
+    }) => {
+      h == "Escape" && s({});
+    });
+  }, []), S(N, {
+    children: [S("nav", {
+      class: `acim-menu ${t || ""}`,
+      children: S(we, {
+        autoOpenMode: "desktop",
+        items: e,
+        mode: o,
+        name: n,
+        open: _,
+        setOpen: s
+      })
+    }), S("style", {
+      children: Oe
+    })]
+  });
+}, Be = [{
+  name: "Allocations",
+  href: "https://allocations.access-ci.org/",
+  classes: "acim-track"
+}, {
+  name: "Support",
+  href: "https://support.access-ci.org/",
+  classes: "acim-track"
+}, {
+  name: "Operations",
+  href: "https://operations.access-ci.org/",
+  classes: "acim-track"
+}, {
+  name: "Metrics",
+  href: "https://metrics.access-ci.org/",
+  classes: "acim-track acim-grow"
+}, {
+  name: "ACCESS Home",
+  href: "https://access-ci.org/",
+  classes: "acim-icon acim-icon-home"
+}, {
+  name: "Search",
+  href: "https://support.access-ci.org/knowledge-base",
+  classes: "acim-icon acim-icon-search"
+}, {
+  name: "Menu",
+  classes: "acim-icon acim-icon-hamburger acim-hamburger",
+  autoOpenMode: "mobile",
+  items: [{
+    name: "About",
+    href: "https://access-ci.org/about/"
+  }, {
+    name: "Announcements",
+    href: "https://support.access-ci.org/announcements"
+  }, {
+    name: "Contact",
+    href: "https://access-ci.org/about/contact/"
+  }, {
+    name: "Events & Trainings",
+    href: "https://support.access-ci.org/events"
+  }, {
+    name: "News",
+    href: "https://access-ci.org/news/"
+  }, {
+    name: "Outages",
+    href: "https://support.access-ci.org/outages"
+  }, {
+    name: "Resource Providers",
+    href: "https://access-ci.org/resource-providers/"
+  }]
+}], Fe = {
+  name: "My ACCESS",
+  items: [{
+    name: "Allocations",
+    href: "https://allocations.access-ci.org/requests"
+  }, {
+    name: "Community Persona",
+    href: "https://support.access-ci.org/community-persona"
+  }, {
+    name: "Edit Profile",
+    href: "https://allocations.access-ci.org/profile"
+  }, {
+    name: "Publications",
+    href: "https://allocations.access-ci.org/publications"
+  }, {
+    name: "Share with ORCID",
+    href: "https://allocations.access-ci.org/orcid"
+  }, {
+    name: "Log out",
+    href: "https://cilogon.org/logout/?skin=access"
+  }]
+}, Ie = {
+  name: "Login",
+  items: [{
+    name: "Login",
+    href: "https://cilogon.org/"
+  }, {
+    name: "Questions",
+    href: "https://identity.access-ci.org/"
+  }, {
+    name: "Register",
+    href: "https://identity.access-ci.org/new-user"
+  }, {
+    name: "Reset Password",
+    href: "https://identity.access-ci.orgg/password-reset"
+  }]
+}, Se = (t, e) => {
+  const n = e.attachShadow({
+    mode: "open"
+  });
+  Le(t, n);
+}, We = ({
+  items: t,
+  isLoggedIn: e,
+  loginUrl: n,
+  logoutUrl: c,
+  target: a
+} = {}) => {
+  if (e === void 0 && (e = document.cookie.split("; ").includes("SESSaccesscisso=1")), t === void 0) {
+    const o = {
+      ...e ? Fe : Ie
+    };
+    o.items = o.items.map((r) => ({
+      ...r,
+      href: r.name == "Login" && n || r.name == "Log out" && c || r.href
+    })), t = [...Be, o];
+  }
+  Se(S(ke, {
+    classes: "acim-universal",
+    items: t,
+    name: "ACCESS Menu",
+    target: a
+  }), a);
+}, Re = ({
+  items: t,
+  siteName: e,
+  target: n
+}) => {
+  Se(S(ke, {
+    classes: "acim-site",
+    items: t,
+    name: `${e} Menu`,
+    target: n
+  }), n);
+};
+export {
+  Ie as loginMenuItem,
+  Fe as myAccessMenuItem,
+  Re as siteMenus,
+  Be as universalMenuItems,
+  We as universalMenus
+};

package/dist/access-ci-ui.umd.cjs

@@ -0,0 +1,2 @@
+(function(C,H){typeof exports=="object"&&typeof module<"u"?H(exports):typeof define=="function"&&define.amd?define(["exports"],H):(C=typeof globalThis<"u"?globalThis:C||self,H(C.AccessCiUi={}))})(this,function(C){"use strict";var H,u,Y,P,Z,ee,j,N={},te=[],$e=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,R=Array.isArray;function E(t,e){for(var n in e)t[n]=e[n];return t}function ne(t){var e=t.parentNode;e&&e.removeChild(t)}function Pe(t,e,n){var c,a,o,r={};for(o in e)o=="key"?c=e[o]:o=="ref"?a=e[o]:r[o]=e[o];if(arguments.length>2&&(r.children=arguments.length>3?H.call(arguments,2):n),typeof t=="function"&&t.defaultProps!=null)for(o in t.defaultProps)r[o]===void 0&&(r[o]=t.defaultProps[o]);return U(t,r,c,a,null)}function U(t,e,n,c,a){var o={type:t,props:e,key:n,ref:c,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:a??++Y};return a==null&&u.vnode!=null&&u.vnode(o),o}function T(t){return t.children}function D(t,e){this.props=t,this.context=e}function I(t,e){if(e==null)return t.__?I(t.__,t.__.__k.indexOf(t)+1):null;for(var n;e<t.__k.length;e++)if((n=t.__k[e])!=null&&n.__e!=null)return n.__e;return typeof t.type=="function"?I(t):null}function ie(t){var e,n;if((t=t.__)!=null&&t.__c!=null){for(t.__e=t.__c.base=null,e=0;e<t.__k.length;e++)if((n=t.__k[e])!=null&&n.__e!=null){t.__e=t.__c.base=n.__e;break}return ie(t)}}function oe(t){(!t.__d&&(t.__d=!0)&&P.push(t)&&!O.__r++||Z!==u.debounceRendering)&&((Z=u.debounceRendering)||ee)(O)}function O(){var t,e,n,c,a,o,r,_,s;for(P.sort(j);t=P.shift();)t.__d&&(e=P.length,c=void 0,a=void 0,o=void 0,_=(r=(n=t).__v).__e,(s=n.__P)&&(c=[],a=[],(o=E({},r)).__v=r.__v+1,q(s,r,o,n.__n,s.ownerSVGElement!==void 0,r.__h!=null?[_]:null,c,_??I(r),r.__h,a),ue(c,r,a),r.__e!=_&&ie(r)),P.length>e&&P.sort(j));O.__r=0}function ce(t,e,n,c,a,o,r,_,s,h,d){var i,p,f,l,m,$,v,b,x,M,k=0,S=c&&c.__k||te,A=S.length,L=A,y=e.length;for(n.__k=[],i=0;i<y;i++)(l=n.__k[i]=(l=e[i])==null||typeof l=="boolean"||typeof l=="function"?null:typeof l=="string"||typeof l=="number"||typeof l=="bigint"?U(null,l,null,null,l):R(l)?U(T,{children:l},null,null,null):l.__b>0?U(l.type,l.props,l.key,l.ref?l.ref:null,l.__v):l)!=null&&(l.__=n,l.__b=n.__b+1,(b=Ae(l,S,v=i+k,L))===-1?f=N:(f=S[b]||N,S[b]=void 0,L--),q(t,l,f,a,o,r,_,s,h,d),m=l.__e,(p=l.ref)&&f.ref!=p&&(f.ref&&G(f.ref,null,l),d.push(p,l.__c||m,l)),m!=null&&($==null&&($=m),M=!(x=f===N||f.__v===null)&&b===v,x?b==-1&&k--:b!==v&&(b===v+1?(k++,M=!0):b>v?L>y-v?(k+=b-v,M=!0):k--:k=b<v&&b==v-1?b-v:0),v=i+k,M=M||b==i&&!x,typeof l.type!="function"||b===v&&f.__k!==l.__k?typeof l.type=="function"||M?l.__d!==void 0?(s=l.__d,l.__d=void 0):s=m.nextSibling:s=re(t,m,s):s=ae(l,s,t),typeof n.type=="function"&&(n.__d=s)));for(n.__e=$,i=A;i--;)S[i]!=null&&(typeof n.type=="function"&&S[i].__e!=null&&S[i].__e==n.__d&&(n.__d=S[i].__e.nextSibling),me(S[i],S[i]))}function ae(t,e,n){for(var c,a=t.__k,o=0;a&&o<a.length;o++)(c=a[o])&&(c.__=t,e=typeof c.type=="function"?ae(c,e,n):re(n,c.__e,e));return e}function re(t,e,n){return n==null||n.parentNode!==t?t.insertBefore(e,null):e==n&&e.parentNode!=null||t.insertBefore(e,n),e.nextSibling}function Ae(t,e,n,c){var a=t.key,o=t.type,r=n-1,_=n+1,s=e[n];if(s===null||s&&a==s.key&&o===s.type)return n;if(c>(s!=null?1:0))for(;r>=0||_<e.length;){if(r>=0){if((s=e[r])&&a==s.key&&o===s.type)return r;r--}if(_<e.length){if((s=e[_])&&a==s.key&&o===s.type)return _;_++}}return-1}function Le(t,e,n,c,a){var o;for(o in n)o==="children"||o==="key"||o in e||V(t,o,null,n[o],c);for(o in e)a&&typeof e[o]!="function"||o==="children"||o==="key"||o==="value"||o==="checked"||n[o]===e[o]||V(t,o,e[o],n[o],c)}function _e(t,e,n){e[0]==="-"?t.setProperty(e,n??""):t[e]=n==null?"":typeof n!="number"||$e.test(e)?n:n+"px"}function V(t,e,n,c,a){var o;e:if(e==="style")if(typeof n=="string")t.style.cssText=n;else{if(typeof c=="string"&&(t.style.cssText=c=""),c)for(e in c)n&&e in n||_e(t.style,e,"");if(n)for(e in n)c&&n[e]===c[e]||_e(t.style,e,n[e])}else if(e[0]==="o"&&e[1]==="n")o=e!==(e=e.replace(/Capture$/,"")),e=e.toLowerCase()in t?e.toLowerCase().slice(2):e.slice(2),t.l||(t.l={}),t.l[e+o]=n,n?c||t.addEventListener(e,o?le:se,o):t.removeEventListener(e,o?le:se,o);else if(e!=="dangerouslySetInnerHTML"){if(a)e=e.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if(e!=="width"&&e!=="height"&&e!=="href"&&e!=="list"&&e!=="form"&&e!=="tabIndex"&&e!=="download"&&e!=="rowSpan"&&e!=="colSpan"&&e in t)try{t[e]=n??"";break e}catch{}typeof n=="function"||(n==null||n===!1&&e[4]!=="-"?t.removeAttribute(e):t.setAttribute(e,n))}}function se(t){return this.l[t.type+!1](u.event?u.event(t):t)}function le(t){return this.l[t.type+!0](u.event?u.event(t):t)}function q(t,e,n,c,a,o,r,_,s,h){var d,i,p,f,l,m,$,v,b,x,M,k,S,A,L,y=e.type;if(e.constructor!==void 0)return null;n.__h!=null&&(s=n.__h,_=e.__e=n.__e,e.__h=null,o=[_]),(d=u.__b)&&d(e);try{e:if(typeof y=="function"){if(v=e.props,b=(d=y.contextType)&&c[d.__c],x=d?b?b.props.value:d.__:c,n.__c?$=(i=e.__c=n.__c).__=i.__E:("prototype"in y&&y.prototype.render?e.__c=i=new y(v,x):(e.__c=i=new D(v,x),i.constructor=y,i.render=Te),b&&b.sub(i),i.props=v,i.state||(i.state={}),i.context=x,i.__n=c,p=i.__d=!0,i.__h=[],i._sb=[]),i.__s==null&&(i.__s=i.state),y.getDerivedStateFromProps!=null&&(i.__s==i.state&&(i.__s=E({},i.__s)),E(i.__s,y.getDerivedStateFromProps(v,i.__s))),f=i.props,l=i.state,i.__v=e,p)y.getDerivedStateFromProps==null&&i.componentWillMount!=null&&i.componentWillMount(),i.componentDidMount!=null&&i.__h.push(i.componentDidMount);else{if(y.getDerivedStateFromProps==null&&v!==f&&i.componentWillReceiveProps!=null&&i.componentWillReceiveProps(v,x),!i.__e&&(i.shouldComponentUpdate!=null&&i.shouldComponentUpdate(v,i.__s,x)===!1||e.__v===n.__v)){for(e.__v!==n.__v&&(i.props=v,i.state=i.__s,i.__d=!1),e.__e=n.__e,e.__k=n.__k,e.__k.forEach(function(W){W&&(W.__=e)}),M=0;M<i._sb.length;M++)i.__h.push(i._sb[M]);i._sb=[],i.__h.length&&r.push(i);break e}i.componentWillUpdate!=null&&i.componentWillUpdate(v,i.__s,x),i.componentDidUpdate!=null&&i.__h.push(function(){i.componentDidUpdate(f,l,m)})}if(i.context=x,i.props=v,i.__P=t,i.__e=!1,k=u.__r,S=0,"prototype"in y&&y.prototype.render){for(i.state=i.__s,i.__d=!1,k&&k(e),d=i.render(i.props,i.state,i.context),A=0;A<i._sb.length;A++)i.__h.push(i._sb[A]);i._sb=[]}else do i.__d=!1,k&&k(e),d=i.render(i.props,i.state,i.context),i.state=i.__s;while(i.__d&&++S<25);i.state=i.__s,i.getChildContext!=null&&(c=E(E({},c),i.getChildContext())),p||i.getSnapshotBeforeUpdate==null||(m=i.getSnapshotBeforeUpdate(f,l)),ce(t,R(L=d!=null&&d.type===T&&d.key==null?d.props.children:d)?L:[L],e,n,c,a,o,r,_,s,h),i.base=e.__e,e.__h=null,i.__h.length&&r.push(i),$&&(i.__E=i.__=null)}else o==null&&e.__v===n.__v?(e.__k=n.__k,e.__e=n.__e):e.__e=Ne(n.__e,e,n,c,a,o,r,s,h);(d=u.diffed)&&d(e)}catch(W){e.__v=null,(s||o!=null)&&(e.__e=_,e.__h=!!s,o[o.indexOf(_)]=null),u.__e(W,e,n)}}function ue(t,e,n){for(var c=0;c<n.length;c++)G(n[c],n[++c],n[++c]);u.__c&&u.__c(e,t),t.some(function(a){try{t=a.__h,a.__h=[],t.some(function(o){o.call(a)})}catch(o){u.__e(o,a.__v)}})}function Ne(t,e,n,c,a,o,r,_,s){var h,d,i,p=n.props,f=e.props,l=e.type,m=0;if(l==="svg"&&(a=!0),o!=null){for(;m<o.length;m++)if((h=o[m])&&"setAttribute"in h==!!l&&(l?h.localName===l:h.nodeType===3)){t=h,o[m]=null;break}}if(t==null){if(l===null)return document.createTextNode(f);t=a?document.createElementNS("http://www.w3.org/2000/svg",l):document.createElement(l,f.is&&f),o=null,_=!1}if(l===null)p===f||_&&t.data===f||(t.data=f);else{if(o=o&&H.call(t.childNodes),d=(p=n.props||N).dangerouslySetInnerHTML,i=f.dangerouslySetInnerHTML,!_){if(o!=null)for(p={},m=0;m<t.attributes.length;m++)p[t.attributes[m].name]=t.attributes[m].value;(i||d)&&(i&&(d&&i.__html==d.__html||i.__html===t.innerHTML)||(t.innerHTML=i&&i.__html||""))}if(Le(t,f,p,a,_),i)e.__k=[];else if(ce(t,R(m=e.props.children)?m:[m],e,n,c,a&&l!=="foreignObject",o,r,o?o[0]:n.__k&&I(n,0),_,s),o!=null)for(m=o.length;m--;)o[m]!=null&&ne(o[m]);_||("value"in f&&(m=f.value)!==void 0&&(m!==t.value||l==="progress"&&!m||l==="option"&&m!==p.value)&&V(t,"value",m,p.value,!1),"checked"in f&&(m=f.checked)!==void 0&&m!==t.checked&&V(t,"checked",m,p.checked,!1))}return t}function G(t,e,n){try{typeof t=="function"?t(e):t.current=e}catch(c){u.__e(c,n)}}function me(t,e,n){var c,a;if(u.unmount&&u.unmount(t),(c=t.ref)&&(c.current&&c.current!==t.__e||G(c,null,e)),(c=t.__c)!=null){if(c.componentWillUnmount)try{c.componentWillUnmount()}catch(o){u.__e(o,e)}c.base=c.__P=null,t.__c=void 0}if(c=t.__k)for(a=0;a<c.length;a++)c[a]&&me(c[a],e,n||typeof t.type!="function");n||t.__e==null||ne(t.__e),t.__=t.__e=t.__d=void 0}function Te(t,e,n){return this.constructor(t,n)}function ze(t,e,n){var c,a,o,r;u.__&&u.__(t,e),a=(c=typeof n=="function")?null:n&&n.__k||e.__k,o=[],r=[],q(e,t=(!c&&n||e).__k=Pe(T,null,[t]),a||N,N,e.ownerSVGElement!==void 0,!c&&n?[n]:a?null:e.firstChild?H.call(e.childNodes):null,o,!c&&n?n:a?a.__e:e.firstChild,c,r),ue(o,t,r)}H=te.slice,u={__e:function(t,e,n,c){for(var a,o,r;e=e.__;)if((a=e.__c)&&!a.__)try{if((o=a.constructor)&&o.getDerivedStateFromError!=null&&(a.setState(o.getDerivedStateFromError(t)),r=a.__d),a.componentDidCatch!=null&&(a.componentDidCatch(t,c||{}),r=a.__d),r)return a.__E=a}catch(_){t=_}throw t}},Y=0,D.prototype.setState=function(t,e){var n;n=this.__s!=null&&this.__s!==this.state?this.__s:this.__s=E({},this.state),typeof t=="function"&&(t=t(E({},n),this.props)),t&&E(n,t),t!=null&&this.__v&&(e&&this._sb.push(e),oe(this))},D.prototype.forceUpdate=function(t){this.__v&&(this.__e=!0,t&&this.__h.push(t),oe(this))},D.prototype.render=T,P=[],ee=typeof Promise=="function"?Promise.prototype.then.bind(Promise.resolve()):setTimeout,j=function(t,e){return t.__v.__b-e.__v.__b},O.__r=0;var z,g,Q,de,J=0,pe=[],B=[],fe=u.__b,he=u.__r,ve=u.diffed,ge=u.__c,be=u.unmount;function K(t,e){u.__h&&u.__h(g,t,J||e),J=0;var n=g.__H||(g.__H={__:[],__h:[]});return t>=n.__.length&&n.__.push({__V:B}),n.__[t]}function ye(t){return J=1,Ue(we,t)}function Ue(t,e,n){var c=K(z++,2);if(c.t=t,!c.__c&&(c.__=[n?n(e):we(void 0,e),function(_){var s=c.__N?c.__N[0]:c.__[0],h=c.t(s,_);s!==h&&(c.__N=[h,c.__[1]],c.__c.setState({}))}],c.__c=g,!g.u)){var a=function(_,s,h){if(!c.__c.__H)return!0;var d=c.__c.__H.__.filter(function(p){return p.__c});if(d.every(function(p){return!p.__N}))return!o||o.call(this,_,s,h);var i=!1;return d.forEach(function(p){if(p.__N){var f=p.__[0];p.__=p.__N,p.__N=void 0,f!==p.__[0]&&(i=!0)}}),!(!i&&c.__c.props===_)&&(!o||o.call(this,_,s,h))};g.u=!0;var o=g.shouldComponentUpdate,r=g.componentWillUpdate;g.componentWillUpdate=function(_,s,h){if(this.__e){var d=o;o=void 0,a(_,s,h),o=d}r&&r.call(this,_,s,h)},g.shouldComponentUpdate=a}return c.__N||c.__}function De(t,e){var n=K(z++,3);!u.__s&&Be(n.__H,e)&&(n.__=t,n.i=e,g.__H.__h.push(n))}function Ie(){var t=K(z++,11);if(!t.__){for(var e=g.__v;e!==null&&!e.__m&&e.__!==null;)e=e.__;var n=e.__m||(e.__m=[0,0]);t.__="P"+n[0]+"-"+n[1]++}return t.__}function Oe(){for(var t;t=pe.shift();)if(t.__P&&t.__H)try{t.__H.__h.forEach(F),t.__H.__h.forEach(X),t.__H.__h=[]}catch(e){t.__H.__h=[],u.__e(e,t.__v)}}u.__b=function(t){g=null,fe&&fe(t)},u.__r=function(t){he&&he(t),z=0;var e=(g=t.__c).__H;e&&(Q===g?(e.__h=[],g.__h=[],e.__.forEach(function(n){n.__N&&(n.__=n.__N),n.__V=B,n.__N=n.i=void 0})):(e.__h.forEach(F),e.__h.forEach(X),e.__h=[],z=0)),Q=g},u.diffed=function(t){ve&&ve(t);var e=t.__c;e&&e.__H&&(e.__H.__h.length&&(pe.push(e)!==1&&de===u.requestAnimationFrame||((de=u.requestAnimationFrame)||Ve)(Oe)),e.__H.__.forEach(function(n){n.i&&(n.__H=n.i),n.__V!==B&&(n.__=n.__V),n.i=void 0,n.__V=B})),Q=g=null},u.__c=function(t,e){e.some(function(n){try{n.__h.forEach(F),n.__h=n.__h.filter(function(c){return!c.__||X(c)})}catch(c){e.some(function(a){a.__h&&(a.__h=[])}),e=[],u.__e(c,n.__v)}}),ge&&ge(t,e)},u.unmount=function(t){be&&be(t);var e,n=t.__c;n&&n.__H&&(n.__H.__.forEach(function(c){try{F(c)}catch(a){e=a}}),n.__H=void 0,e&&u.__e(e,n.__v))};var xe=typeof requestAnimationFrame=="function";function Ve(t){var e,n=function(){clearTimeout(c),xe&&cancelAnimationFrame(e),setTimeout(t)},c=setTimeout(n,100);xe&&(e=requestAnimationFrame(n))}function F(t){var e=g,n=t.__c;typeof n=="function"&&(t.__c=void 0,n()),g=e}function X(t){var e=g;t.__c=t.__(),g=e}function Be(t,e){return!t||t.length!==e.length||e.some(function(n,c){return n!==t[c]})}function we(t,e){return typeof e=="function"?e(t):e}const Fe=`.acim-menu{--acim-teal-600: #107180;--acim-teal-700: #1a5b6e;--acim-color: white;--acim-padding: 30px;--acim-offset: 0px;--acim-outline: white}.acim-universal{--acim-background: var(--acim-teal-700);--acim-border: rgba(19, 133, 151, .35)}.acim-site{--acim-background: var(--acim-teal-600);--acim-border: #157688}.acim-site ul ul{--acim-border: rgba(19, 133, 151, .35)}.acim-menu,.acim-menu button{font-family:Archivo,sans-serif}.acim-menu ul,.acim-menu li{list-style-type:none;margin:0;padding:0}.acim-menu a{text-decoration:none}.acim-item{background:transparent;border:0 none transparent;border-radius:0;box-sizing:border-box;cursor:pointer;display:block;text-align:left;width:100%}.acim-item{font-size:14px;font-weight:600;line-height:21px;padding:13.5px var(--acim-padding) 13.5px}.acim-menu>ul>li>.acim-item{font-weight:800}.acim-item,.acim-menu>.acim-expanded{border-bottom:1px solid var(--acim-border)}.acim-expanded,.acim-icon-search .acim-item,.acim-menu li:last-child>.acim-item,.acim-menu>.acim-collapsed{border-bottom:0 none transparent}.acim-menu>button{text-transform:uppercase}.acim-menu button{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'><path fill='white' d='M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z'/></svg>");background-position:calc(100% - var(--acim-padding) - var(--acim-offset)) center;background-repeat:no-repeat;background-size:14px 24px}.acim-menu button.acim-expanded{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'><path fill='white' d='m 182.62211,201.27501 c -12.5,-12.5 -32.8,-12.5 -45.3,0 L 9.322106,329.275 c -9.19999996,9.2 -11.9,22.9 -6.9,34.9 5,12 16.6,19.8 29.6,19.8 l 256.000004,-0.1 c 12.9,0 24.6,-7.8 29.6,-19.8 5,-12 2.2,-25.7 -6.9,-34.9 l -128,-127.99999 z'/></svg>")}.acim-menu button,.acim-menu ul li{background-color:var(--acim-background)}.acim-menu button,.acim-menu ul li a{color:var(--acim-color)}.acim-menu ul li li{background-color:#fff}.acim-menu ul li li a{color:#138597}.acim-icon>.acim-item{background-position:calc(var(--acim-padding) + var(--acim-offset)) center;background-repeat:no-repeat;background-size:14px 14px;text-indent:-99999px}.acim-icon-home>.acim-item{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512' fill='white'><path d='M543.8 287.6c17 0 32-14 32-32.1c1-9-3-17-11-24L512 185V64c0-17.7-14.3-32-32-32H448c-17.7 0-32 14.3-32 32v36.7L309.5 7c-6-5-14-7-21-7s-15 1-22 8L10 231.5c-7 7-10 15-10 24c0 18 14 32.1 32 32.1h32v69.7c-.1 .9-.1 1.8-.1 2.8V472c0 22.1 17.9 40 40 40h16c1.2 0 2.4-.1 3.6-.2c1.5 .1 3 .2 4.5 .2H160h24c22.1 0 40-17.9 40-40V448 384c0-17.7 14.3-32 32-32h64c17.7 0 32 14.3 32 32v64 24c0 22.1 17.9 40 40 40h24 32.5c1.4 0 2.8 0 4.2-.1c1.1 .1 2.2 .1 3.3 .1h16c22.1 0 40-17.9 40-40V455.8c.3-2.6 .5-5.3 .5-8.1l-.7-160.2h32z'/></svg>")}.acim-icon-search>.acim-item{background-image:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='18' height='18' viewBox='0 0 100 100'><path fill='white' class='st0' d='M98.22,92.72l-5.48,5.47c-1.8,1.82-4.74,1.82-6.55,0L66.9,78.9c-0.87-0.87-1.35-2.05-1.35-3.29v-3.15 c-6.83,5.34-15.42,8.51-24.76,8.51c-22.23,0-40.24-18.01-40.24-40.24S18.55,0.49,40.78,0.49S81.02,18.5,81.02,40.73 c0,9.34-3.18,17.94-8.51,24.76h3.15c1.24,0,2.42,0.48,3.29,1.35l19.29,19.29C100.03,87.95,100.03,90.89,98.22,92.72z M65.54,40.73 c0-13.7-11.08-24.76-24.76-24.76c-13.7,0-24.76,11.08-24.76,24.76c0,13.7,11.08,24.76,24.76,24.76 C54.47,65.49,65.54,54.41,65.54,40.73z'></path></svg>")}.acim-icon-hamburger>.acim-item,.acim-icon-hamburger>.acim-item.acim-expanded{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='white'><path d='M24 6h-24v-4h24v4zm0 4h-24v4h24v-4zm0 8h-24v4h24v-4z'/></svg>")}.acim-track .acim-item{text-transform:uppercase;padding-top:5px;padding-bottom:5px}.acim-track:not(.acim-grow) .acim-item{border-bottom:0 none transparent}.acim-track.acim-grow .acim-item{padding-bottom:10px}.acim-hamburger>button{display:none}@media (min-width: 600px){.acim-menu{--acim-padding:calc((100% - 540px)/2);--acim-offset: 7px}}@media (min-width: 768px){.acim-menu{--acim-padding:calc((100% - 712px)/2)}}@media (min-width: 900px){.acim-menu{--acim-padding: 10px;--acim-offset: 0px}.acim-site{--acim-background: white;--acim-color: var(--acim-teal-600);--acim-outline: var(--acim-teal-700);--acim-padding: 20px;border-bottom:1px solid #d9d9d9;border-top:3px solid var(--acim-teal-700)}.acim-site>ul{justify-content:end}.acim-menu>button{display:none}.acim-menu>ul{display:flex;flex-direction:row;margin:0 auto;width:calc(840px + (2 * var(--acim-padding)))}.acim-item,.acim-track .acim-item{border-bottom:0 none transparent;padding-top:12px;padding-bottom:12px}.acim-site .acim-item{font-size:16px}.acim-grow{flex:1 0 auto}.acim-universal{background-color:var(--acim-teal-700)}.acim-icon>.acim-item{background-position:center center;width:56px}.acim-menu button,.acim-menu button.acim-expanded{background-image:none}.acim-hamburger>button{display:block}.acim-menu>ul>li{display:flex;flex-direction:row;justify-content:start;position:relative}.acim-menu>ul>li.acim-grow>.acim-item{flex:0 1 0}.acim-menu>ul>li>.acim-expanded,.acim-menu>ul>li>.acim-item:active,.acim-menu>ul>li>.acim-item:focus,.acim-menu>ul>li>.acim-item:hover{background-color:var(--acim-teal-600);color:#fff;outline:0 none transparent}.acim-menu>ul>li>.acim-item:focus-visible{outline:3px solid var(--acim-outline);outline-offset:-3px;z-index:1000}.acim-menu>ul ul{background-color:var(--acim-teal-600);padding:10px 0;position:absolute;right:0;top:48px;z-index:9999}.acim-menu>ul ul li{background-color:var(--acim-teal-600)}.acim-menu>ul ul .acim-item{color:#fff;white-space:nowrap;padding:5px 20px}.acim-menu>ul ul .acim-item:active,.acim-menu>ul ul .acim-item:focus,.acim-menu>ul ul .acim-item:hover{color:#cee8e9;outline:0 none transparent;text-decoration:underline}.acim-menu>ul ul .acim-item:focus-visible{outline:3px solid white;outline-offset:-3px;z-index:1000}.acim-menu>ul>li>.acim-item{line-height:24px}}@media (min-width: 1024px){.acim-menu>ul{width:calc(940px + (2 * var(--acim-padding)))}}@media (min-width: 1280px){.acim-menu>ul{width:calc(1180px + (2 * var(--acim-padding)))}}
+`;var We=0;function w(t,e,n,c,a,o){var r,_,s={};for(_ in e)_=="ref"?r=e[_]:s[_]=e[_];var h={type:t,props:s,key:n,ref:r,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:--We,__source:a,__self:o};if(typeof t=="function"&&(r=t.defaultProps))for(_ in r)s[_]===void 0&&(s[_]=r[_]);return u.vnode&&u.vnode(h),h}const ke=({autoOpenMode:t,classes:e="",href:n="",html:c="",items:a,mode:o,name:r,open:_,parentId:s="root",setOpen:h})=>{const d=Ie(),i=_[s]==d,p=i||t==o,f=()=>h({..._,[s]:i?null:d});if(c)return w("div",{dangerouslySetInnerHTML:{__html:c}});if(n)return w("a",{href:n,class:`acim-item ${e||""}`,children:r});if(a)return w(T,{children:[r&&w("button",{"aria-expanded":p,"aria-controls":d,class:`acim-item ${p?"acim-expanded":"acim-collapsed"}`,onClick:f,children:r}),w("ul",{class:e,id:d,hidden:!p,"aria-hidden":!p,children:a.map(({autoOpenMode:l,classes:m,href:$,html:v,items:b,name:x})=>w("li",{class:m||"",children:w(ke,{autoOpenMode:l,href:$,html:v,items:b,mode:o,name:x,open:_,parentId:d,setOpen:h})}))})]})},Se=({classes:t,items:e,name:n,target:c})=>{const a=()=>document.body.clientWidth>=900?"desktop":"mobile",[o,r]=ye(a()),[_,s]=ye({});return De(()=>{window.addEventListener("resize",()=>r(a())),document.body.addEventListener("click",h=>{h.target!=c&&a()=="desktop"&&s({})}),c.addEventListener("keydown",({key:h})=>{h=="Escape"&&s({})})},[]),w(T,{children:[w("nav",{class:`acim-menu ${t||""}`,children:w(ke,{autoOpenMode:"desktop",items:e,mode:o,name:n,open:_,setOpen:s})}),w("style",{children:Fe})]})},Me=[{name:"Allocations",href:"https://allocations.access-ci.org/",classes:"acim-track"},{name:"Support",href:"https://support.access-ci.org/",classes:"acim-track"},{name:"Operations",href:"https://operations.access-ci.org/",classes:"acim-track"},{name:"Metrics",href:"https://metrics.access-ci.org/",classes:"acim-track acim-grow"},{name:"ACCESS Home",href:"https://access-ci.org/",classes:"acim-icon acim-icon-home"},{name:"Search",href:"https://support.access-ci.org/knowledge-base",classes:"acim-icon acim-icon-search"},{name:"Menu",classes:"acim-icon acim-icon-hamburger acim-hamburger",autoOpenMode:"mobile",items:[{name:"About",href:"https://access-ci.org/about/"},{name:"Announcements",href:"https://support.access-ci.org/announcements"},{name:"Contact",href:"https://access-ci.org/about/contact/"},{name:"Events & Trainings",href:"https://support.access-ci.org/events"},{name:"News",href:"https://access-ci.org/news/"},{name:"Outages",href:"https://support.access-ci.org/outages"},{name:"Resource Providers",href:"https://access-ci.org/resource-providers/"}]}],Ce={name:"My ACCESS",items:[{name:"Allocations",href:"https://allocations.access-ci.org/requests"},{name:"Community Persona",href:"https://support.access-ci.org/community-persona"},{name:"Edit Profile",href:"https://allocations.access-ci.org/profile"},{name:"Publications",href:"https://allocations.access-ci.org/publications"},{name:"Share with ORCID",href:"https://allocations.access-ci.org/orcid"},{name:"Log out",href:"https://cilogon.org/logout/?skin=access"}]},He={name:"Login",items:[{name:"Login",href:"https://cilogon.org/"},{name:"Questions",href:"https://identity.access-ci.org/"},{name:"Register",href:"https://identity.access-ci.org/new-user"},{name:"Reset Password",href:"https://identity.access-ci.orgg/password-reset"}]},Ee=(t,e)=>{const n=e.attachShadow({mode:"open"});ze(t,n)},je=({items:t,isLoggedIn:e,loginUrl:n,logoutUrl:c,target:a}={})=>{if(e===void 0&&(e=document.cookie.split("; ").includes("SESSaccesscisso=1")),t===void 0){const o={...e?Ce:He};o.items=o.items.map(r=>({...r,href:r.name=="Login"&&n||r.name=="Log out"&&c||r.href})),t=[...Me,o]}Ee(w(Se,{classes:"acim-universal",items:t,name:"ACCESS Menu",target:a}),a)},Re=({items:t,siteName:e,target:n})=>{Ee(w(Se,{classes:"acim-site",items:t,name:`${e} Menu`,target:n}),n)};C.loginMenuItem=He,C.myAccessMenuItem=Ce,C.siteMenus=Re,C.universalMenuItems=Me,C.universalMenus=je,Object.defineProperty(C,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "@access-ci/ui",
+  "version": "0.1.0",
+  "description": "User interface components for ACCESS CI",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/access-ci-ui.umd.cjs",
+  "module": "./dist/access-ci-ui.js",
+  "exports": {
+    ".": {
+      "import": "./dist/access-ci-ui.js",
+      "require": "./dist/access-ci-ui.umd.cjs"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "preact": "^10.13.1"
+  },
+  "devDependencies": {
+    "@preact/preset-vite": "^2.5.0",
+    "eslint": "^8.46.0",
+    "eslint-config-preact": "^1.3.0",
+    "vite": "^4.3.2"
+  },
+  "eslintConfig": {
+    "extends": "preact"
+  }
+}