UNPKG

@lanaco/lnc-react-ui

Version:

React component library

1,498 lines (1,473 loc) 37.8 kB
import { jsx as f, jsxs as fe, Fragment as x } from "react/jsx-runtime"; import { useLayoutEffect as Yr, useEffect as Pe, useState as wt, useMemo as Kr, createElement as P, isValidElement as Xr, forwardRef as qr, useImperativeHandle as Jr } from "react"; import { s as R } from "./emotion-styled.browser.esm-DfbrHHed.js"; import { c as _, d as De, a as Zr, r as H, j as $ } from "./utils-BUdHa0nB.js"; import { c as F, g as We } from "./_commonjsHelpers-BkfeUUK-.js"; import { l as ue } from "./theme-mUflS4q4.js"; import { u as G } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js"; import { i as Qr } from "./index-vz5mtWGo.js"; import At from "./CheckBoxInput.js"; import en from "./Icon.js"; import tn from "./Spinner.js"; import { d as rn, s as U } from "./breakpoints-BubDitvo.js"; var nn = function() { }, vt = typeof window < "u", on = vt ? Yr : Pe, Lt = { x: 0, y: 0, width: 0, height: 0, top: 0, left: 0, bottom: 0, right: 0 }; function an() { var t = wt(null), o = t[0], i = t[1], d = wt(Lt), u = d[0], g = d[1], w = Kr(function() { return new window.ResizeObserver(function(A) { if (A[0]) { var b = A[0].contentRect, C = b.x, E = b.y, y = b.width, v = b.height, O = b.top, D = b.left, p = b.bottom, h = b.right; g({ x: C, y: E, width: y, height: v, top: O, left: D, bottom: p, right: h }); } }); }, []); return on(function() { if (o) return w.observe(o), function() { w.disconnect(); }; }, [o]), [i, u]; } const ln = vt && typeof window.ResizeObserver < "u" ? an : function() { return [nn, Lt]; }; var ke = { exports: {} }; ke.exports; (function(t, o) { var i = 200, d = "__lodash_hash_undefined__", u = 9007199254740991, g = "[object Arguments]", w = "[object Array]", A = "[object Boolean]", b = "[object Date]", C = "[object Error]", E = "[object Function]", y = "[object GeneratorFunction]", v = "[object Map]", O = "[object Number]", D = "[object Object]", p = "[object Promise]", h = "[object RegExp]", L = "[object Set]", k = "[object String]", oe = "[object Symbol]", he = "[object WeakMap]", X = "[object ArrayBuffer]", B = "[object DataView]", Te = "[object Float32Array]", ye = "[object Float64Array]", _e = "[object Int8Array]", be = "[object Int16Array]", we = "[object Int32Array]", Ce = "[object Uint8Array]", Ee = "[object Uint8ClampedArray]", Se = "[object Uint16Array]", J = "[object Uint32Array]", Ae = /[\\^$.*+?()[\]{}|]/g, S = /\w*$/, Fe = /^\[object .+?Constructor\]$/, V = /^(?:0|[1-9]\d*)$/, m = {}; m[g] = m[w] = m[X] = m[B] = m[A] = m[b] = m[Te] = m[ye] = m[_e] = m[be] = m[we] = m[v] = m[O] = m[D] = m[h] = m[L] = m[k] = m[oe] = m[Ce] = m[Ee] = m[Se] = m[J] = !0, m[C] = m[E] = m[he] = !1; var Z = typeof F == "object" && F && F.Object === Object && F, ae = typeof self == "object" && self && self.Object === Object && self, z = Z || ae || Function("return this")(), ve = o && !o.nodeType && o, q = ve && !0 && t && !t.nodeType && t, ze = q && q.exports === ve; function Ge(e, r) { return e.set(r[0], r[1]), e; } function Me(e, r) { return e.add(r), e; } function Ue(e, r) { for (var n = -1, a = e ? e.length : 0; ++n < a && r(e[n], n, e) !== !1; ) ; return e; } function Ve(e, r) { for (var n = -1, a = r.length, I = e.length; ++n < a; ) e[I + n] = r[n]; return e; } function Le(e, r, n, a) { for (var I = -1, j = e ? e.length : 0; ++I < j; ) n = r(n, e[I], I, e); return n; } function Ye(e, r) { for (var n = -1, a = Array(e); ++n < e; ) a[n] = r(n); return a; } function Ke(e, r) { return e == null ? void 0 : e[r]; } function Oe(e) { var r = !1; if (e != null && typeof e.toString != "function") try { r = !!(e + ""); } catch { } return r; } function Re(e) { var r = -1, n = Array(e.size); return e.forEach(function(a, I) { n[++r] = [I, a]; }), n; } function me(e, r) { return function(n) { return e(r(n)); }; } function Ie(e) { var r = -1, n = Array(e.size); return e.forEach(function(a) { n[++r] = a; }), n; } var Xe = Array.prototype, qe = Function.prototype, le = Object.prototype, xe = z["__core-js_shared__"], l = function() { var e = /[^.]+$/.exec(xe && xe.keys && xe.keys.IE_PROTO || ""); return e ? "Symbol(src)_1." + e : ""; }(), c = qe.toString, s = le.hasOwnProperty, T = le.toString, M = RegExp( "^" + c.call(s).replace(Ae, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$" ), W = ze ? z.Buffer : void 0, Q = z.Symbol, He = z.Uint8Array, Je = me(Object.getPrototypeOf, Object), Wt = Object.create, Ft = le.propertyIsEnumerable, zt = Xe.splice, it = Object.getOwnPropertySymbols, Gt = W ? W.isBuffer : void 0, Mt = me(Object.keys, Object), Ze = se(z, "DataView"), ge = se(z, "Map"), Qe = se(z, "Promise"), et = se(z, "Set"), tt = se(z, "WeakMap"), pe = se(Object, "create"), Ut = re(Ze), Vt = re(ge), Yt = re(Qe), Kt = re(et), Xt = re(tt), ct = Q ? Q.prototype : void 0, st = ct ? ct.valueOf : void 0; function ee(e) { var r = -1, n = e ? e.length : 0; for (this.clear(); ++r < n; ) { var a = e[r]; this.set(a[0], a[1]); } } function qt() { this.__data__ = pe ? pe(null) : {}; } function Jt(e) { return this.has(e) && delete this.__data__[e]; } function Zt(e) { var r = this.__data__; if (pe) { var n = r[e]; return n === d ? void 0 : n; } return s.call(r, e) ? r[e] : void 0; } function Qt(e) { var r = this.__data__; return pe ? r[e] !== void 0 : s.call(r, e); } function er(e, r) { var n = this.__data__; return n[e] = pe && r === void 0 ? d : r, this; } ee.prototype.clear = qt, ee.prototype.delete = Jt, ee.prototype.get = Zt, ee.prototype.has = Qt, ee.prototype.set = er; function Y(e) { var r = -1, n = e ? e.length : 0; for (this.clear(); ++r < n; ) { var a = e[r]; this.set(a[0], a[1]); } } function tr() { this.__data__ = []; } function rr(e) { var r = this.__data__, n = $e(r, e); if (n < 0) return !1; var a = r.length - 1; return n == a ? r.pop() : zt.call(r, n, 1), !0; } function nr(e) { var r = this.__data__, n = $e(r, e); return n < 0 ? void 0 : r[n][1]; } function or(e) { return $e(this.__data__, e) > -1; } function ar(e, r) { var n = this.__data__, a = $e(n, e); return a < 0 ? n.push([e, r]) : n[a][1] = r, this; } Y.prototype.clear = tr, Y.prototype.delete = rr, Y.prototype.get = nr, Y.prototype.has = or, Y.prototype.set = ar; function ie(e) { var r = -1, n = e ? e.length : 0; for (this.clear(); ++r < n; ) { var a = e[r]; this.set(a[0], a[1]); } } function lr() { this.__data__ = { hash: new ee(), map: new (ge || Y)(), string: new ee() }; } function ir(e) { return Be(this, e).delete(e); } function cr(e) { return Be(this, e).get(e); } function sr(e) { return Be(this, e).has(e); } function dr(e, r) { return Be(this, e).set(e, r), this; } ie.prototype.clear = lr, ie.prototype.delete = ir, ie.prototype.get = cr, ie.prototype.has = sr, ie.prototype.set = dr; function ce(e) { this.__data__ = new Y(e); } function ur() { this.__data__ = new Y(); } function fr(e) { return this.__data__.delete(e); } function hr(e) { return this.__data__.get(e); } function br(e) { return this.__data__.has(e); } function mr(e, r) { var n = this.__data__; if (n instanceof Y) { var a = n.__data__; if (!ge || a.length < i - 1) return a.push([e, r]), this; n = this.__data__ = new ie(a); } return n.set(e, r), this; } ce.prototype.clear = ur, ce.prototype.delete = fr, ce.prototype.get = hr, ce.prototype.has = br, ce.prototype.set = mr; function gr(e, r) { var n = ot(e) || Wr(e) ? Ye(e.length, String) : [], a = n.length, I = !!a; for (var j in e) s.call(e, j) && !(I && (j == "length" || Nr(j, a))) && n.push(j); return n; } function dt(e, r, n) { var a = e[r]; (!(s.call(e, r) && bt(a, n)) || n === void 0 && !(r in e)) && (e[r] = n); } function $e(e, r) { for (var n = e.length; n--; ) if (bt(e[n][0], r)) return n; return -1; } function pr(e, r) { return e && ut(r, at(r), e); } function rt(e, r, n, a, I, j, K) { var N; if (a && (N = j ? a(e, I, j, K) : a(e)), N !== void 0) return N; if (!je(e)) return e; var pt = ot(e); if (pt) { if (N = $r(e), !r) return Ir(e, N); } else { var de = te(e), Tt = de == E || de == y; if (zr(e)) return Er(e, r); if (de == D || de == g || Tt && !j) { if (Oe(e)) return j ? e : {}; if (N = Br(Tt ? {} : e), !r) return xr(e, pr(N, e)); } else { if (!m[de]) return j ? e : {}; N = jr(e, de, rt, r); } } K || (K = new ce()); var yt = K.get(e); if (yt) return yt; if (K.set(e, N), !pt) var _t = n ? Hr(e) : at(e); return Ue(_t || e, function(lt, Ne) { _t && (Ne = lt, lt = e[Ne]), dt(N, Ne, rt(lt, r, n, a, Ne, e, K)); }), N; } function Tr(e) { return je(e) ? Wt(e) : {}; } function yr(e, r, n) { var a = r(e); return ot(e) ? a : Ve(a, n(e)); } function _r(e) { return T.call(e); } function wr(e) { if (!je(e) || kr(e)) return !1; var r = gt(e) || Oe(e) ? M : Fe; return r.test(re(e)); } function Cr(e) { if (!ht(e)) return Mt(e); var r = []; for (var n in Object(e)) s.call(e, n) && n != "constructor" && r.push(n); return r; } function Er(e, r) { if (r) return e.slice(); var n = new e.constructor(e.length); return e.copy(n), n; } function nt(e) { var r = new e.constructor(e.byteLength); return new He(r).set(new He(e)), r; } function Sr(e, r) { var n = r ? nt(e.buffer) : e.buffer; return new e.constructor(n, e.byteOffset, e.byteLength); } function Ar(e, r, n) { var a = r ? n(Re(e), !0) : Re(e); return Le(a, Ge, new e.constructor()); } function vr(e) { var r = new e.constructor(e.source, S.exec(e)); return r.lastIndex = e.lastIndex, r; } function Lr(e, r, n) { var a = r ? n(Ie(e), !0) : Ie(e); return Le(a, Me, new e.constructor()); } function Or(e) { return st ? Object(st.call(e)) : {}; } function Rr(e, r) { var n = r ? nt(e.buffer) : e.buffer; return new e.constructor(n, e.byteOffset, e.length); } function Ir(e, r) { var n = -1, a = e.length; for (r || (r = Array(a)); ++n < a; ) r[n] = e[n]; return r; } function ut(e, r, n, a) { n || (n = {}); for (var I = -1, j = r.length; ++I < j; ) { var K = r[I], N = void 0; dt(n, K, N === void 0 ? e[K] : N); } return n; } function xr(e, r) { return ut(e, ft(e), r); } function Hr(e) { return yr(e, at, ft); } function Be(e, r) { var n = e.__data__; return Pr(r) ? n[typeof r == "string" ? "string" : "hash"] : n.map; } function se(e, r) { var n = Ke(e, r); return wr(n) ? n : void 0; } var ft = it ? me(it, Object) : Ur, te = _r; (Ze && te(new Ze(new ArrayBuffer(1))) != B || ge && te(new ge()) != v || Qe && te(Qe.resolve()) != p || et && te(new et()) != L || tt && te(new tt()) != he) && (te = function(e) { var r = T.call(e), n = r == D ? e.constructor : void 0, a = n ? re(n) : void 0; if (a) switch (a) { case Ut: return B; case Vt: return v; case Yt: return p; case Kt: return L; case Xt: return he; } return r; }); function $r(e) { var r = e.length, n = e.constructor(r); return r && typeof e[0] == "string" && s.call(e, "index") && (n.index = e.index, n.input = e.input), n; } function Br(e) { return typeof e.constructor == "function" && !ht(e) ? Tr(Je(e)) : {}; } function jr(e, r, n, a) { var I = e.constructor; switch (r) { case X: return nt(e); case A: case b: return new I(+e); case B: return Sr(e, a); case Te: case ye: case _e: case be: case we: case Ce: case Ee: case Se: case J: return Rr(e, a); case v: return Ar(e, a, n); case O: case k: return new I(e); case h: return vr(e); case L: return Lr(e, a, n); case oe: return Or(e); } } function Nr(e, r) { return r = r ?? u, !!r && (typeof e == "number" || V.test(e)) && e > -1 && e % 1 == 0 && e < r; } function Pr(e) { var r = typeof e; return r == "string" || r == "number" || r == "symbol" || r == "boolean" ? e !== "__proto__" : e === null; } function kr(e) { return !!l && l in e; } function ht(e) { var r = e && e.constructor, n = typeof r == "function" && r.prototype || le; return e === n; } function re(e) { if (e != null) { try { return c.call(e); } catch { } try { return e + ""; } catch { } } return ""; } function Dr(e) { return rt(e, !1, !0); } function bt(e, r) { return e === r || e !== e && r !== r; } function Wr(e) { return Fr(e) && s.call(e, "callee") && (!Ft.call(e, "callee") || T.call(e) == g); } var ot = Array.isArray; function mt(e) { return e != null && Gr(e.length) && !gt(e); } function Fr(e) { return Mr(e) && mt(e); } var zr = Gt || Vr; function gt(e) { var r = je(e) ? T.call(e) : ""; return r == E || r == y; } function Gr(e) { return typeof e == "number" && e > -1 && e % 1 == 0 && e <= u; } function je(e) { var r = typeof e; return !!e && (r == "object" || r == "function"); } function Mr(e) { return !!e && typeof e == "object"; } function at(e) { return mt(e) ? gr(e) : Cr(e); } function Ur() { return []; } function Vr() { return !1; } t.exports = Dr; })(ke, ke.exports); var cn = ke.exports; const Ct = /* @__PURE__ */ We(cn); var sn = typeof F == "object" && F && F.Object === Object && F, dn = typeof self == "object" && self && self.Object === Object && self, un = sn || dn || Function("return this")(), fn = un.isFinite; function hn(t) { return typeof t == "number" && fn(t); } var bn = hn; const mn = /* @__PURE__ */ We(bn); function gn(t) { var o = typeof t; return !!t && (o == "object" || o == "function"); } var pn = gn; const Tn = /* @__PURE__ */ We(pn), Et = { SUCCESS: ue.palette.green[500], ERROR: ue.palette.red[500], WARNING: ue.palette.yellow[500], PRIMARY: ue.palette.teal[500], SECONDARY: ue.palette.blue[500], DISABLED: ue.palette.gray[300], NONE: "white" }, yn = R.tbody``, Ot = (t) => { const { className: o = "", size: i = "small", color: d = "primary" } = t, u = G(); return /* @__PURE__ */ f(yn, { "data-tbody": !0, ...{ className: o, size: i, color: d, theme: u }, children: t.children }); }; Ot.displayName = "TABLE_BODY"; const _n = R.thead` border-radius: 0.5rem 0.5rem 0 0; `, Rt = (t) => { const { className: o = "", size: i = "small", color: d = "primary" } = t, u = G(); return /* @__PURE__ */ f(_n, { ...{ className: o, size: i, color: d, theme: u }, children: t.children }); }; Rt.displayName = "TABLE_HEAD"; const wn = R.tr` ${(t) => t.noBorder == !1 && `border-bottom: 1px solid ${_( t.theme, "TableRow", null, "enabled", "border" )};`} ${(t) => t.noBorder == !1 && `border-left: 1px solid ${_( t.theme, "TableRow", null, "enabled", "border" )};`} ${(t) => t.noBorder == !1 && `border-right: 1px solid ${_( t.theme, "TableRow", null, "enabled", "border" )};`} ${(t) => t.rowCss || ""} &:last-of-type > td:first-of-type { border-radius: 0 0 0 0.5rem; } &:last-of-type > td:last-of-type { border-radius: 0 0 0.5rem 0; } ${(t) => t.IsSelected !== !0 ? ` &:hover { & > td { background-color: ${_( t.theme, "TableRow", null, "hover", "background" )}; } }` : ""} ${(t) => t.IsSelected === !0 ? ` & > td { background-color: ${_( t.theme, "TableRow", t.color, "active", "background" )}; } ` : ""} `, It = (t) => { const { onRowClick: o = () => { }, RowData: i = {}, Index: d, IsSelected: u = null, noBorder: g = !1, rowCss: w = "", //---------------- className: A = "", size: b = "small", color: C = "primary" } = t, E = G(); return /* @__PURE__ */ P( wn, { ...{ className: A, size: b, color: C, theme: E }, IsSelected: u, key: d, onClick: (O) => { O.stopPropagation(), O.nativeEvent.stopImmediatePropagation(), o && o(O, i); }, noBorder: g, rowCss: w }, t.children ); }; It.displayName = "TABLE_ROW"; var Cn = "[object AsyncFunction]", En = "[object Function]", Sn = "[object GeneratorFunction]", An = "[object Null]", vn = "[object Proxy]", Ln = "[object Undefined]", On = typeof F == "object" && F && F.Object === Object && F, Rn = typeof self == "object" && self && self.Object === Object && self, In = On || Rn || Function("return this")(), xt = Object.prototype, xn = xt.hasOwnProperty, Ht = xt.toString, St = In.Symbol, ne = St ? St.toStringTag : void 0; function Hn(t) { return t == null ? t === void 0 ? Ln : An : ne && ne in Object(t) ? $n(t) : Bn(t); } function $n(t) { var o = xn.call(t, ne), i = t[ne]; try { t[ne] = void 0; var d = !0; } catch { } var u = Ht.call(t); return d && (o ? t[ne] = i : delete t[ne]), u; } function Bn(t) { return Ht.call(t); } function jn(t) { if (!Nn(t)) return !1; var o = Hn(t); return o == En || o == Sn || o == Cn || o == vn; } function Nn(t) { var o = typeof t; return t != null && (o == "object" || o == "function"); } var Pn = jn; const kn = /* @__PURE__ */ We(Pn), Dn = R.td` white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: ${(t) => t.width}; padding: 0.875rem 1.5rem; background-color: ${(t) => _(t.theme, "TableRow", null, "enabled", "background")}; ${(t) => t.bgColor} ${(t) => De(t.theme, "TableCell", t.size, "enabled")}; `, $t = (t) => { const { Column: o = {}, RowData: i = {}, Index: d = 0, EnableSelection: u = !1, EnableRowHighlight: g = !1, GetRowHighlightColor: w = () => "", //---------------- className: A = "", size: b = "small", color: C = "primary" } = t, E = G(), y = { className: A, size: b, color: C, theme: E }, v = (h) => { const L = new Option().style; return L.color = h, L.color !== ""; }, O = () => o && o.width ? o.width + "%" : "auto", D = () => { var h = w(i); return g === !0 && v(h) ? ` background-color: ${h}; ` : ""; }, p = () => { if (o.render && kn(o.render)) { var h = o.render(i); if (Xr(h)) return h; console.error( `${o.id}/${o.accessor}: invalid render function.` ); } return Qr(o.accessor) && console.error( `${o.index}: accessor property is required when the render function is not suplied` ), i[o.accessor]; }; return /* @__PURE__ */ P( Dn, { ...y, bgColor: D(), selection: u, width: O(), key: d, title: i[o.accessor] }, p() ); }; $t.displayName = "TABLE_CELL"; const Wn = R.td` padding: 0 0 0 1.25rem; background-color: ${(t) => _(t.theme, "TableRow", null, "enabled", "background")}; width: ${(t) => t.width}%; ${(t) => t.bgColor} `, Bt = (t) => { const { RowData: o = {}, onSelectRow: i = () => { }, IsSelected: d = null, Index: u = 0, EnableRowHighlight: g = !1, GetRowHighlightColor: w = () => "", //---------------- className: A = "", size: b = "small", color: C = "primary" } = t, E = G(), y = { className: A, size: b, color: C, theme: E }, v = (p) => { i(p, o, d); }, O = (p) => { const h = new Option().style; return h.color = p, h.color !== ""; }; return /* @__PURE__ */ P( Wn, { bgColor: (() => { var p = w(o); return g === !0 && O(p) ? ` background-color: ${p}; ` : ""; })(), ...y, key: u, width: t.width }, /* @__PURE__ */ f(At, { id: u, checked: d, onChange: v }) ); }; Bt.displayName = "TABLE_SELECTION_CELL"; const Fn = R.tr` border-radius: 0.5rem 0.5rem 0 0; `, jt = (t) => { const { Index: o = 0, //------------- className: i = "", size: d = "small", color: u = "primary" } = t, g = G(); return /* @__PURE__ */ P(Fn, { ...{ className: i, size: d, color: u, theme: g }, key: o }, t.children); }; jt.displayName = "TABLE_HEAD_ROW"; const zn = R.th` white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; transition: all 250ms ease; padding: 0.875rem 1.5rem; cursor: ${(t) => t.ordering ? "pointer" : "default"}; width: ${(t) => t.width}; &:hover { ${(t) => t.ordering ? `background-color: ${_( t.theme, "TableHeadCell", null, "hover", "background" )};` : ""} } ${(t) => De( t.theme, "TableHeadCell", t.size, "enabled" )}; color: ${(t) => _(t.theme, "TableHeadCell", null, "enabled", "text")}; background-color: ${(t) => _( t.theme, "TableHeadCell", null, "enabled", "background" )}; border-top: ${(t) => "1px solid " + _( t.theme, "TableHeadCell", null, "enabled", "border" )}; border-bottom: ${(t) => "1px solid " + _( t.theme, "TableHeadCell", null, "enabled", "border" )}; &:first-of-type { border-radius: 0.5rem 0 0 0; border-left: ${(t) => "1px solid " + _( t.theme, "TableHeadCell", null, "enabled", "border" )}; } &:last-of-type { border-radius: 0 0.5rem 0 0; border-right: ${(t) => "1px solid " + _( t.theme, "TableHeadCell", null, "enabled", "border" )}; } `, Gn = R.div` display: flex; flex-direction: row; align-items: center; `, Mn = R.span` padding-right: 0.25rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: ${(t) => _( t.theme, "TableHeadCell", t.color, "enabled", "text" )}; font-weight: ${(t) => _( t.theme, "TableHeadCell", t.color, "enabled", "fontWeight" )}; `, Un = R.span` & i { color: ${(t) => t.sort ? "transparent" : _( t.theme, "TableHeadCell", t.color, "enabled", "text" )}; font-weight: ${(t) => _( t.theme, "TableHeadCell", t.color, "enabled", "fontWeight" )}; } `, Nt = (t) => { const { Column: o = {}, Ordering: i = {}, Index: d = 0, onColumnClick: u = () => { }, EnableSelectAll: g = !1, EnableOrdering: w = !1, //----------- className: A = "", size: b = "small", color: C = "primary" } = t, E = G(), y = { className: A, size: b, color: C, theme: E }, v = () => { if (o.sortable === !0 && w === !0) { let p; return i && i.columnId === o.id ? (i.ascending === !0 && (p = "angle-up"), i.descending === !0 && (p = "angle-down"), i.ascending && i.descending && (p = "sort")) : p = "sort", /* @__PURE__ */ f(Un, { ...y, sort: p === "sort", children: /* @__PURE__ */ f(en, { ...y, sizeInUnits: "14px", icon: p }) }); } return /* @__PURE__ */ f(x, {}); }, O = (p) => { var h = { columnId: o.id, ascending: !1, descending: !0 }; w === !0 && o.sortable === !0 && i && i.columnId === o.id && (i.ascending === !0 && (h.ascending = !1, h.descending = !1), i.descending === !0 && (h.ascending = !0, h.descending = !1), i.descending === !1 && i.ascending === !1 && (h.ascending = !1, h.descending = !0), u(p, o, h)), w === !0 && o.sortable === !0 && i && i.columnId !== o.id && u(p, o, h), (o.sortable !== !0 || w !== !0) && u(p, o); }, D = () => o && o.width ? o.width + "%" : "auto"; return /* @__PURE__ */ P( zn, { onClick: O, ...y, selection: g, ordering: w === !0 && o.sortable === !0, key: d, width: D(), title: o.displayName }, /* @__PURE__ */ fe(Gn, { ...y, children: [ /* @__PURE__ */ f(Mn, { ...y, children: o.displayName }), v() ] }) ); }; Nt.displayName = "TABLE_HEAD_CELL"; const Vn = R.th` text-align: left; width: ${(t) => t.width}; padding-left: 1.25rem; background-color: ${(t) => _( t.theme, "TableHeadCell", null, "enabled", "background" )}; border-top: ${(t) => "1px solid " + _( t.theme, "TableHeadCell", null, "enabled", "border" )}; border-bottom: ${(t) => "1px solid " + _( t.theme, "TableHeadCell", null, "enabled", "border" )}; border-radius: 0.5rem 0 0 0; `, Pt = (t) => { const { EnableSelectAll: o, IsSelected: i = null, Index: d = 0, onSelectAll: u, //---------------- className: g = "", size: w = "small", color: A = "primary" } = t, b = G(); return /* @__PURE__ */ P( Vn, { ...{ className: g, size: w, color: A, theme: b }, selection: o, key: d, width: t.width }, o && /* @__PURE__ */ f( At, { id: d, checked: i || !1, onChange: (E) => u(E, i) } ) ); }; Pt.displayName = "TABLE_HEAD_SELECTION_CELL"; const Yn = R.td` white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0.25rem 0.125rem; `, Kn = R.div` width: ${(t) => t.width}; height: 100%; border-radius: 100px; background-color: ${(t) => t.bgColor} !important; `, kt = (t) => { const { RowData: o = {}, Index: i, GetRowStatusIndicatorColor: d, //---------------- className: u = "", size: g = "small", color: w = "Primary" } = t, A = G(), b = { className: u, size: g, color: w, theme: A }, C = () => "4px", E = (y) => { const v = new Option().style; return v.color = y, v.color !== ""; }; return /* @__PURE__ */ P( Yn, { ...b, width: C(), key: i, bgColor: () => { var y = d(o); return E(y) ? y : Et.NONE; } }, /* @__PURE__ */ f( Kn, { ...b, width: C(), bgColor: () => { var y = d(o); return E(y) ? y : Et.NONE; } } ) ); }; kt.displayName = "TABLE_ROW_STATUS_INDICATOR_CELL"; const Xn = R.th` padding: 0.125rem; width: 8px; background-color: ${(t) => _( t.theme, "TableHeadCell", null, "enabled", "background" )}; border-bottom: ${(t) => "1px solid " + _( t.theme, "TableHeadCell", null, "enabled", "border" )}; border-radius: 0.5rem 0 0 0; `, Dt = (t) => { const { Index: o, className: i = "", size: d = "small", color: u = "primary" } = t, g = G(); return /* @__PURE__ */ P(Xn, { ...{ className: i, size: d, color: u, theme: g }, key: o }); }; Dt.displayName = "TABLE_HEAD_ROW_STATUS_INDICATOR_CELL"; const qn = R.div` display: flex; flex-direction: column; padding: 0.625rem; margin: 0.125rem; border-radius: 0.125rem; overflow-x: ${(t) => t.isLoading ? "hidden" : "auto"}; white-space: nowrap; position: relative; ${(t) => De(t.theme, "Table", t.size, "enabled")}; @media ${rn("S")} { padding: 0.5rem; margin: 0; } `, Jn = R.div` position: absolute; top: 0px; right: 0px; width: 100%; height: 100%; overflow: auto; z-index: 1000; opacity: 0.7; background-color: ${(t) => _( t.theme, "Background", "primary", "enabled", "background" )}; filter: alpha(opacity=10); display: flex; align-items: center; justify-content: center; `, Zn = R.table` height: 1px; width: ${(t) => t.tableWidth}; white-space: nowrap; border-collapse: collapse; border-radius: 0.5rem; border-style: hidden; table-layout: fixed; ${(t) => t.noBorder == !1 && `box-shadow: 0 0 0 0.0625rem ${_( t.theme, "Table", null, "enabled", "border" )};`} `, Qn = R.span` display: flex; align-items: center; justify-content: center; ${(t) => De(t.theme, "Table", t.size, "enabled")}; padding: 0.5rem; `, bo = { TableContainer: "TABLE_CONTAINER", TableRow: "TABLE_ROW", TableCell: "TABLE_CELL", TableSelectionCell: "TABLE_SELLECTION_CELL", TableHeadRow: "TABLE_HEAD_ROW", TableHeadCell: "TABLE_HEAD_CELL", TableHeadSelectionCell: "TABLE_HEAD_SELECTION_CELL", TableHeader: "TABLE_HEADER", TableFooter: "TABLE_FOOTER", TableSpecialLastRow: "TABLE_SPECIAL_LAST_ROW", TableRowStatusIndicatorCell: "TABLE_ROW_STATUS_INDICATOR_CELL", TableHeadRowStatusIndicatorCell: "TABLE_HEAD_ROW_STATUS_INDICATOR_CELL", TableLoader: "TABLE_LOADER", TableBody: "TABLE_BODY", TableHead: "TABLE_HEAD" }, eo = qr((t, o) => { var { EnableSelection: i = !1, EnableOrdering: d = !1, EnableSelectAll: u = !1, EnableLoader: g = !1, PreRenderedTableBody: w = !1, PreRenderedTableHead: A = !1, noBorder: b = !1, //-------------------- EnableRowStatusIndicator: C = !1, EnableRowHighlight: E = !1, GetRowStatusIndicatorColor: y = () => { }, GetRowHighlightColor: v = () => { }, GetRowHighlightCss: O = () => { }, //-------------------- NoDataText: D = "No data to show", NoDataComponent: p = null, //-------------------- Loading: h = !1, // TODO: add alignText prop to Column object Columns: L = [], Data: k = [], SelectedData: oe = [], SelectedEntirePage: he = !1, RowIdentifier: X = "id", VisibilityPattern: B = null, Ordering: Te = {}, //-------------------- onColumnClick: ye = () => { }, onRowClick: _e = () => { }, onSelectRow: be = () => { }, onSelectAll: we = () => { }, //-------------------- tableWidth: Ce = "100%", className: Ee = "", color: Se = "primary", size: J = "small" } = t; const Ae = G(), S = { theme: Ae, color: Se, size: J }; Jr( o, () => ({ getTableData: () => k }), [ k // Update functions when certain state changes ] ); const [Fe, { width: V }] = ln(); var m = Zr(); Pe(() => { i === !0 && (X === null || X === "") && console.error( "Error: Selection is enabled but the 'RowIdentifier' is empty" ); }, []), Pe(() => { (L == null || L.length === 0) && console.error("Error: Columns array must have at least one item."); }, [L]), Pe(() => { B && (Object.hasOwn(B, U.XS.type) || console.error(Z(U.XS.type)), Object.hasOwn(B, U.S.type) || console.error(Z(U.S.type)), Object.hasOwn(B, U.M.type) || console.error(Z(U.M.type)), Object.hasOwn(B, U.L.type) || console.error(Z(U.L.type)), Object.hasOwn(B, U.XL.type) || console.error(Z(U.XL.type))); }, [B]); const Z = (l) => `Error: 'VisibilityPattern' missing property ${l}.`, ae = () => { let l = []; if (Tn(B)) { if (l = B[m].map((c) => ({ ...L.find((T) => String(T.id) === String(c.id)), ...c })), i === !0) { let c = q() / V * 100 / l.length; C === !0 && (c += 3 / V * 100), l = l.map((s) => ({ ...s, width: s.width - c })); } } else if (l = L.map((c) => ({ ...c })), i === !0) { let c = q() / V * 100 / l.length; C === !0 && (c += 3 / V * 100), l = l.map((s) => ({ ...s, width: s.width - c })); } return l; }, z = (l, c) => { if (l && l.length > 0) { var s = 0, T = l.map((W) => W.width).reduce((W, Q) => W + Q); i === !0 && (s = q() / V * 100); var M = T + s; mn(M) && (M > 101 || M < 98) && console.error(`Error: Row ${c} - sum of column widths is ${M}.`); } }, ve = (l) => { let c = {}, s = oe.find( (T) => String(T[X]) === String(l[X]) ); return s != null ? c.IsSelected = !0 : c.IsSelected = !1, c; }, q = () => J === "small" ? 37 : J === "medium" ? 43 : J === "large" ? 49 : 37, ze = (l = {}, c) => { let s = {}; var T = ae(), M = (O == null ? void 0 : O(l)) || ""; z(T, c), i === !0 && (s = ve(l)); var W = { onRowClick: _e, onSelectRow: be, RowData: l, SelectedData: oe, EnableSelection: i, Columns: L, ColumnsToRender: T, Index: c, key: c, rowCss: M, ...S, ...s }, Q = /* @__PURE__ */ fe(x, { children: [ C === !0 && me(l), i === !0 && Me(s.IsSelected, l), T.map((He, Je) => Ge(l, He, Je, c, T)) ] }); return H( $("TABLE_ROW", t.children), W, Q ) || /* @__PURE__ */ P(It, { ...W, key: c, noBorder: b }, Q); }, Ge = (l, c, s, T, M) => { var W = { RowData: l, Column: c, ColumnsToRender: M, Index: s, RowIndex: T, key: s, EnableSelection: i, RowIdentifier: X, EnableRowHighlight: E, GetRowHighlightColor: v, ...S }; return H( $("TABLE_CELL", t.children), W ) || /* @__PURE__ */ P($t, { ...W, key: s }); }, Me = (l, c, s = -1) => { var T = { SelectedData: oe, RowData: c, onSelectRow: be, Index: s, key: s, IsSelected: l, EnableRowHighlight: E, GetRowHighlightColor: v, ...S }; return H( $("TABLE_SELLECTION_CELL", t.children), T ) || /* @__PURE__ */ P( Bt, { ...T, key: s, width: q() / V * 100 } ); }, Ue = () => { var l = { Columns: L, ...S }, c = /* @__PURE__ */ fe(x, { children: [ C === !0 && Ie(), i === !0 && Le(), ae().map((s, T) => Ve(s, T)) ] }); return H( $("TABLE_HEAD_ROW", t.children), l, c ) || /* @__PURE__ */ P(jt, { ...l, key: 0 }, c); }, Ve = (l, c, s) => { var T = { Index: c, Column: l, Ordering: Te, EnableOrdering: d, EnableSelectAll: u, onColumnClick: ye, ColumnsToRender: s, ...S }; return H( $("TABLE_HEAD_CELL", t.children), T ) || /* @__PURE__ */ P(Nt, { ...T, key: c }); }, Le = () => { var l = { Index: -1, IsSelected: he, onSelectAll: we, EnableSelectAll: u, ...S }; return H( $("TABLE_HEAD_SELECTION_CELL", t.children), l ) || /* @__PURE__ */ P( Pt, { ...l, key: -1, width: q() / V * 100 } ); }, Ye = () => H($("TABLE_HEADER", t.children), { Data: k, Columns: L, ...S }) || /* @__PURE__ */ f(x, {}), Ke = () => H($("TABLE_FOOTER", t.children), { Data: k, Columns: L, ...S }) || /* @__PURE__ */ f(x, {}), Oe = () => H( $("TABLE_SPECIAL_LAST_ROW", t.children), { Data: k, Columns: L, ColumnsToRender: ae(), Disabled: h, ...S } ) || /* @__PURE__ */ f(x, {}), Re = () => { if (k == null || k && k.length === 0) { var l = ae().length; return i === !0 && l++, C === !0 && l++, /* @__PURE__ */ f("tr", { children: /* @__PURE__ */ f("td", { colSpan: l, children: p ? /* @__PURE__ */ f(p, {}) : /* @__PURE__ */ f(Qn, { ...S, children: D }) }) }); } return /* @__PURE__ */ f(x, {}); }, me = (l) => { var c = { ...S, key: -1, RowData: l, GetRowStatusIndicatorColor: y }; return C === !0 ? /* @__PURE__ */ f(x, { children: H( $("TABLE_ROW_STATUS_INDICATOR_CELL", t.children), c ) || /* @__PURE__ */ f(kt, { ...c, noBorder: b }) }) : /* @__PURE__ */ f(x, {}); }, Ie = () => { var l = { ...S, key: -1 }; return C === !0 ? /* @__PURE__ */ f(x, { children: H( $( "TABLE_HEAD_ROW_STATUS_INDICATOR_CELL", t.children ), l ) || /* @__PURE__ */ f(Dt, { ...l }) }) : /* @__PURE__ */ f(x, {}); }, Xe = () => g === !0 && h === !0 ? /* @__PURE__ */ f(x, { children: /* @__PURE__ */ f(Jn, { theme: Ae, children: H( $("TABLE_LOADER", t.children), { ...S, Loading: h } ) || /* @__PURE__ */ f(tn, { ...S }) }) }) : /* @__PURE__ */ f(x, {}), qe = () => { var l = Ct(t); delete l.__TYPE__; var c = /* @__PURE__ */ fe(x, { children: [ k.map((s, T) => ze(s, T)), Re() ] }); return H( $("TABLE_BODY", t.children), l, w ? c : void 0 ) || /* @__PURE__ */ f(Ot, { ...S, children: c }); }, le = () => { var l = Ct(t); delete l.__TYPE__; var c = /* @__PURE__ */ f(x, { children: Ue() }); return H( $("TABLE_HEAD", t.children), l, A ? c : null ) || /* @__PURE__ */ f(Rt, { ...S, children: c }); }; return (() => { var l = { className: Ee, Loading: h, ...S }, c = /* @__PURE__ */ fe(x, { children: [ Xe(), Ye(), /* @__PURE__ */ fe( Zn, { ...S, width: Ce || "100%", "data-table": !0, ref: Fe, noBorder: b, children: [ le(), qe() ] } ), Oe(), Ke() ] }); return H( $("TABLE_CONTAINER", t.children), l, c ) || /* @__PURE__ */ f( qn, { ...l, isLoading: g ? h : !1, children: c } ); })(); }); eo.displayName = "TABLE"; export { bo as TableComponentOverrides, eo as default };