@pareto-engineering/design-system 5.3.0 → 5.4.0

package/dist/ui/a/ThroughPutIndicator/index.js

@@ -0,0 +1,4 @@
+import { default as t } from "./ThroughPutIndicator.js";
+export {
+  t as ThroughPutIndicator
+};

package/dist/ui/a/Timestamp/Timestamp.js

@@ -0,0 +1,250 @@
+import { jsxs as Y } from "react/jsx-runtime";
+import { useState as z, useMemo as P, useCallback as U } from "react";
+import { P as f } from "../../../index-CxkFVI6N.js";
+import { s as W } from "../../../exports.module-DmUnHWIJ.js";
+import { r as p, t as c, d as E, e as q, a as L, g as R, l as X, b, c as B, s as _, f as T } from "../../../index-C_b9PQD8.js";
+import '../../../assets/Timestamp.css';function N(r, t) {
+  p(2, arguments);
+  var e = c(r), o = c(t), s = e.getTime() - o.getTime();
+  return s < 0 ? -1 : s > 0 ? 1 : s;
+}
+function y(r, t) {
+  var e = r.getFullYear() - t.getFullYear() || r.getMonth() - t.getMonth() || r.getDate() - t.getDate() || r.getHours() - t.getHours() || r.getMinutes() - t.getMinutes() || r.getSeconds() - t.getSeconds() || r.getMilliseconds() - t.getMilliseconds();
+  return e < 0 ? -1 : e > 0 ? 1 : e;
+}
+function x(r, t) {
+  p(2, arguments);
+  var e = c(r), o = c(t), s = y(e, o), u = Math.abs(E(e, o));
+  e.setDate(e.getDate() - s * u);
+  var a = +(y(e, o) === -s), d = s * (u - a);
+  return d === 0 ? 0 : d;
+}
+function F(r, t) {
+  return p(2, arguments), c(r).getTime() - c(t).getTime();
+}
+var G = {
+  ceil: Math.ceil,
+  round: Math.round,
+  floor: Math.floor,
+  trunc: function(t) {
+    return t < 0 ? Math.ceil(t) : Math.floor(t);
+  }
+  // Math.trunc is not supported by IE
+}, J = "trunc";
+function K(r) {
+  return G[J];
+}
+function Q(r) {
+  p(1, arguments);
+  var t = c(r);
+  return t.setHours(23, 59, 59, 999), t;
+}
+function V(r) {
+  p(1, arguments);
+  var t = c(r);
+  return Q(t).getTime() === q(t).getTime();
+}
+function Z(r, t) {
+  p(2, arguments);
+  var e = c(r), o = c(t), s = N(e, o), u = Math.abs(L(e, o)), a;
+  if (u < 1)
+    a = 0;
+  else {
+    e.getMonth() === 1 && e.getDate() > 27 && e.setDate(30), e.setMonth(e.getMonth() - s * u);
+    var d = N(e, o) === -s;
+    V(c(r)) && u === 1 && N(r, o) === 1 && (d = !1), a = s * (u - Number(d));
+  }
+  return a === 0 ? 0 : a;
+}
+function ee(r, t, e) {
+  p(2, arguments);
+  var o = F(r, t) / 1e3;
+  return K()(o);
+}
+function $(r, t) {
+  if (r == null)
+    throw new TypeError("assign requires that input parameter not be null or undefined");
+  for (var e in t)
+    Object.prototype.hasOwnProperty.call(t, e) && (r[e] = t[e]);
+  return r;
+}
+function re(r) {
+  return $({}, r);
+}
+var k = 1440, te = 2520, I = 43200, ae = 86400;
+function ne(r, t, e) {
+  var o, s;
+  p(2, arguments);
+  var u = R(), a = (o = (s = e == null ? void 0 : e.locale) !== null && s !== void 0 ? s : u.locale) !== null && o !== void 0 ? o : X;
+  if (!a.formatDistance)
+    throw new RangeError("locale must contain formatDistance property");
+  var d = N(r, t);
+  if (isNaN(d))
+    throw new RangeError("Invalid time value");
+  var n = $(re(e), {
+    addSuffix: !!(e != null && e.addSuffix),
+    comparison: d
+  }), v, h;
+  d > 0 ? (v = c(t), h = c(r)) : (v = c(r), h = c(t));
+  var m = ee(h, v), O = (b(h) - b(v)) / 1e3, i = Math.round((m - O) / 60), g;
+  if (i < 2)
+    return e != null && e.includeSeconds ? m < 5 ? a.formatDistance("lessThanXSeconds", 5, n) : m < 10 ? a.formatDistance("lessThanXSeconds", 10, n) : m < 20 ? a.formatDistance("lessThanXSeconds", 20, n) : m < 40 ? a.formatDistance("halfAMinute", 0, n) : m < 60 ? a.formatDistance("lessThanXMinutes", 1, n) : a.formatDistance("xMinutes", 1, n) : i === 0 ? a.formatDistance("lessThanXMinutes", 1, n) : a.formatDistance("xMinutes", i, n);
+  if (i < 45)
+    return a.formatDistance("xMinutes", i, n);
+  if (i < 90)
+    return a.formatDistance("aboutXHours", 1, n);
+  if (i < k) {
+    var l = Math.round(i / 60);
+    return a.formatDistance("aboutXHours", l, n);
+  } else {
+    if (i < te)
+      return a.formatDistance("xDays", 1, n);
+    if (i < I) {
+      var w = Math.round(i / k);
+      return a.formatDistance("xDays", w, n);
+    } else if (i < ae)
+      return g = Math.round(i / I), a.formatDistance("aboutXMonths", g, n);
+  }
+  if (g = Z(h, v), g < 12) {
+    var S = Math.round(i / I);
+    return a.formatDistance("xMonths", S, n);
+  } else {
+    var M = g % 12, D = Math.floor(g / 12);
+    return M < 3 ? a.formatDistance("aboutXYears", D, n) : M < 9 ? a.formatDistance("overXYears", D, n) : a.formatDistance("almostXYears", D + 1, n);
+  }
+}
+function oe(r, t, e) {
+  var o, s, u, a, d, n, v, h, m, O;
+  p(2, arguments);
+  var i = c(r), g = c(t), l = R(), w = (o = (s = e == null ? void 0 : e.locale) !== null && s !== void 0 ? s : l.locale) !== null && o !== void 0 ? o : X, S = B((u = (a = (d = (n = e == null ? void 0 : e.weekStartsOn) !== null && n !== void 0 ? n : e == null || (v = e.locale) === null || v === void 0 || (h = v.options) === null || h === void 0 ? void 0 : h.weekStartsOn) !== null && d !== void 0 ? d : l.weekStartsOn) !== null && a !== void 0 ? a : (m = l.locale) === null || m === void 0 || (O = m.options) === null || O === void 0 ? void 0 : O.weekStartsOn) !== null && u !== void 0 ? u : 0);
+  if (!w.localize)
+    throw new RangeError("locale must contain localize property");
+  if (!w.formatLong)
+    throw new RangeError("locale must contain formatLong property");
+  if (!w.formatRelative)
+    throw new RangeError("locale must contain formatRelative property");
+  var M = E(i, g);
+  if (isNaN(M))
+    throw new RangeError("Invalid time value");
+  var D;
+  M < -6 ? D = "other" : M < -1 ? D = "lastWeek" : M < 0 ? D = "yesterday" : M < 1 ? D = "today" : M < 2 ? D = "tomorrow" : M < 7 ? D = "nextWeek" : D = "other";
+  var C = _(i, b(i)), A = _(g, b(g)), j = w.formatRelative(D, C, A, {
+    locale: w,
+    weekStartsOn: S
+  });
+  return T(i, j, {
+    locale: w,
+    weekStartsOn: S
+  });
+}
+const se = W.base, ie = "timestamp", H = ({
+  id: r,
+  className: t,
+  style: e,
+  time: o,
+  prefix: s,
+  enabledFormats: u,
+  distanceMaxDays: a,
+  relativeMaxDays: d,
+  dateFormat: n,
+  locale: v,
+  // ...otherProps
+  as: h
+}) => {
+  const [m, O] = z(u[0]), i = P(() => ({
+    unix: (l) => Number(l),
+    date: (l) => T(new Date(l), n),
+    distance: (l) => !a || x(Date.now(), new Date(l)) < a ? ne(new Date(l), /* @__PURE__ */ new Date(), { addSuffix: !0, locale: v }) : T(new Date(l), n),
+    relative: (l) => !d || x(Date.now(), new Date(l)) < d ? oe(new Date(l), /* @__PURE__ */ new Date(), { locale: v }) : T(new Date(l), n)
+  }), []), g = U((l) => {
+    l.persist();
+    const S = (u.findIndex((M) => M === m) + 1) % u.length;
+    O(u[S]);
+  }, [m]);
+  return Number(o) ? /* @__PURE__ */ Y(
+    h,
+    {
+      id: r,
+      className: [
+        se,
+        ie,
+        t
+      ].filter((l) => l).join(" "),
+      style: e,
+      onClick: u.length > 1 ? g : void 0,
+      children: [
+        s && s,
+        s && " ",
+        i[m](Number(o))
+      ]
+    }
+  ) : null;
+};
+H.propTypes = {
+  /**
+   * The HTML id for this element
+   */
+  id: f.string,
+  /**
+   * The HTML class names for this element
+   */
+  className: f.string,
+  /**
+   * The React-written, css properties for this element.
+   */
+  style: f.objectOf(f.string),
+  /**
+   *  The children JSX
+   */
+  prefix: f.node,
+  /**
+    * Which html tag to use
+    */
+  as: f.oneOfType([
+    f.string,
+    f.object
+  ]),
+  /**
+    * Formats
+    */
+  enabledFormats: f.arrayOf(
+    f.oneOf([
+      "unix",
+      "date",
+      "distance",
+      "relative"
+    ])
+  ),
+  /**
+   * How many days to display distance before reverting to unix display
+   */
+  distanceMaxDays: f.number,
+  /**
+   * How many days to display distance before reverting to unix display
+   */
+  relativeMaxDays: f.number,
+  /**
+    * Unix Format Read https://date-fns.org/v2.16.1/docs/format for options
+    */
+  dateFormat: f.string,
+  /**
+    * The time to display
+    */
+  time: f.oneOfType([
+    f.object,
+    f.number
+  ]).isRequired,
+  /**
+    * A Date-DNS locale object. Will default to english.
+    */
+  locale: f.instanceOf(Object)
+};
+H.defaultProps = {
+  // someProp:false
+  as: "p",
+  dateFormat: "yyyy-MM-dd'T'HH:mm:ss.SSSxxx",
+  enabledFormats: ["unix", "date"]
+};
+export {
+  H as default
+};

package/dist/ui/a/Timestamp/index.js

@@ -0,0 +1,4 @@
+import { default as m } from "./Timestamp.js";
+export {
+  m as Timestamp
+};

package/dist/ui/a/Tip/Tip.js

@@ -0,0 +1,74 @@
+import { jsxs as m, jsx as d } from "react/jsx-runtime";
+import "react";
+import { P as s } from "../../../index-CxkFVI6N.js";
+import { s as g } from "../../../exports.module-DmUnHWIJ.js";
+import '../../../assets/Tip.css';const f = g.base, N = "tip", o = ({
+  id: r,
+  className: a,
+  style: e,
+  children: i,
+  icon: n,
+  as: t,
+  color: c,
+  backgroundColor: l
+  // ...otherProps
+}) => /* @__PURE__ */ m(
+  t,
+  {
+    id: r,
+    className: [
+      f,
+      N,
+      a,
+      `x-${l}`
+    ].filter((p) => p).join(" "),
+    style: e,
+    children: [
+      /* @__PURE__ */ d("span", { className: `x-${c} c-x icon`, children: n }),
+      i
+    ]
+  }
+);
+o.propTypes = {
+  /**
+   * The HTML id for this element
+   */
+  id: s.string,
+  /**
+   * The HTML class names for this element
+   */
+  className: s.string,
+  /**
+   * The React-written, css properties for this element.
+   */
+  style: s.objectOf(s.string),
+  /**
+   * The children jsx
+   */
+  children: s.node.isRequired,
+  /**
+   * The icon
+   */
+  icon: s.string,
+  /**
+   * The color of the icon
+   */
+  color: s.string,
+  /**
+   * The background color
+   */
+  backgroundColor: s.string,
+  /**
+   * The wrapper html type
+   */
+  as: s.string
+};
+o.defaultProps = {
+  as: "p",
+  icon: ")",
+  color: "interactive",
+  backgroundColor: "background-near"
+};
+export {
+  o as default
+};

package/dist/ui/a/Tip/index.js

@@ -0,0 +1,4 @@
+import { default as f } from "./Tip.js";
+export {
+  f as Tip
+};

package/dist/ui/a/ToggleSwitch/ToggleSwitch.js

@@ -0,0 +1,77 @@
+import { jsxs as p, jsx as o } from "react/jsx-runtime";
+import "react";
+import { P as s } from "../../../index-CxkFVI6N.js";
+import { s as g } from "../../../exports.module-DmUnHWIJ.js";
+import '../../../assets/ToggleSwitch.css';const h = g.base, b = "toggle-switch", a = ({
+  id: i,
+  className: n,
+  style: l,
+  handleOnChange: r,
+  checked: e,
+  size: c,
+  inputId: t
+  // ...otherProps
+}) => /* @__PURE__ */ p(
+  "button",
+  {
+    id: i,
+    className: [
+      h,
+      b,
+      n
+    ].filter((m) => m).join(" "),
+    style: {
+      "--size": c,
+      ...l
+    },
+    type: "button",
+    children: [
+      /* @__PURE__ */ o(
+        "input",
+        {
+          type: "checkbox",
+          id: t,
+          checked: e,
+          onChange: r
+        }
+      ),
+      /* @__PURE__ */ o("label", { htmlFor: t, className: e ? "checked" : "" })
+    ]
+  }
+);
+a.propTypes = {
+  /**
+   * The HTML id for this element
+   */
+  id: s.string,
+  /**
+   * The HTML class names for this element
+   */
+  className: s.string,
+  /**
+   * The React-written, css properties for this element.
+   */
+  style: s.objectOf(s.string),
+  /**
+   * The onClick handler for this element
+   */
+  handleOnChange: s.func,
+  /**
+   * The checked state of this element
+   */
+  checked: s.bool,
+  /**
+   * The size of this element
+   */
+  size: s.string,
+  /**
+   * The ID of the elelment to be toggled
+   */
+  inputId: s.string.isRequired
+};
+a.defaultProps = {
+  // someProp: 'someValue',
+};
+export {
+  a as default
+};

package/dist/ui/a/ToggleSwitch/index.js

@@ -0,0 +1,4 @@
+import { default as t } from "./ToggleSwitch.js";
+export {
+  t as ToggleSwitch
+};

package/dist/ui/a/Tooltip/Tooltip.js

@@ -0,0 +1,101 @@
+import { jsxs as f, jsx as i } from "react/jsx-runtime";
+import { useEffect as v } from "react";
+import { P as e } from "../../../index-CxkFVI6N.js";
+import { s as y } from "../../../exports.module-DmUnHWIJ.js";
+import '../../../assets/Tooltip.css';const b = y.base, g = "tooltip", n = ({
+  id: m,
+  className: l,
+  style: d,
+  position: a,
+  isFloating: t,
+  color: c,
+  description: s,
+  content: p,
+  children: u
+  // ...otherProps
+}) => (v(() => {
+  const o = (r) => {
+    document.documentElement.style.setProperty("--mouse-x", `${r.clientX}px`), document.documentElement.style.setProperty("--mouse-y", `${r.clientY}px`);
+  };
+  return t ? (window.addEventListener("mousemove", o), () => window.removeEventListener("mousemove", o)) : () => window.removeEventListener("mousemove", o);
+}, [t]), /* @__PURE__ */ f(
+  "div",
+  {
+    id: m,
+    className: [
+      b,
+      g,
+      l,
+      `x-${c}`
+    ].filter((o) => o).join(" "),
+    style: d,
+    children: [
+      /* @__PURE__ */ i(
+        "div",
+        {
+          className: "tooltip-trigger-wrapper",
+          "aria-describedby": s,
+          children: u
+        }
+      ),
+      /* @__PURE__ */ i(
+        "div",
+        {
+          className: [
+            "tooltip-content",
+            a,
+            t ? "floating" : ""
+          ].filter((o) => o).join(" "),
+          role: "tooltip",
+          id: s,
+          children: p
+        }
+      )
+    ]
+  }
+));
+n.propTypes = {
+  /**
+   * The HTML id for this element
+   */
+  id: e.string.isRequired,
+  /**
+   * The HTML class names for this element
+   */
+  className: e.string,
+  /**
+   * The React-written, css properties for this element.
+   */
+  style: e.objectOf(e.string),
+  /**
+   *  The children JSX where the tooltip will be applied
+   */
+  children: e.node.isRequired,
+  /**
+   *  The content JSX that renders the tooltip content
+   */
+  content: e.node.isRequired,
+  /**
+   *  The text description  to identify the element that describes the tooltip
+   */
+  description: e.string.isRequired,
+  /**
+   * The position of the tooltip with respect to the trigger element
+   */
+  position: e.oneOf(["top", "bottom", "left", "right"]),
+  /**
+   * Whether or not the tooltip should be floating
+   */
+  isFloating: e.bool,
+  /**
+   * The base color of the tooltip
+   */
+  color: e.string
+};
+n.defaultProps = {
+  position: "bottom",
+  color: "background-cards"
+};
+export {
+  n as default
+};

package/dist/ui/a/Tooltip/index.js

@@ -0,0 +1,4 @@
+import { default as a } from "./Tooltip.js";
+export {
+  a as Tooltip
+};