@pareto-engineering/design-system 5.3.0 → 5.4.0

package/dist/ui/g/FormBuilder/common/Renderer/Renderer.js

@@ -0,0 +1,15 @@
+import "react/jsx-runtime";
+import "react";
+import "formik";
+import "../../../../../index-CxkFVI6N.js";
+import "../../../../../exports.module-DmUnHWIJ.js";
+import { s as x } from "../../../../../FormBuilder-653sa2uJ.js";
+import "../../../../b/Page/Context.js";
+import "../../../../b/Title/Title.js";
+import "../../../../../debounce-Cm69Z_cF.js";
+import "../../../../../throttle-BCrS-Wew.js";
+import "../../../../utils/formatting.js";
+import "../../../../utils/applyCharacterLimit.js";
+export {
+  x as default
+};

package/dist/ui/g/FormBuilder/common/Renderer/common/Section/Section.js

@@ -0,0 +1,14 @@
+import "react/jsx-runtime";
+import "react";
+import "../../../../../../../index-CxkFVI6N.js";
+import "../../../../../../f/common/Label/Label.js";
+import "../../../../../../f/common/Description/Description.js";
+import { t as u } from "../../../../../../../FormBuilder-653sa2uJ.js";
+import "../../../../../../f/fields/LatexPreviewInput/convertLatexToHtml.js";
+import "../../../../../../f/fields/FileUpload/utils.js";
+import "../../../../../../f/fields/RadioInput/RadioInput.js";
+import "../../../../../DragAndDrop/DragAndDrop.js";
+import "../../../../../../../exports.module-DmUnHWIJ.js";
+export {
+  u as default
+};

package/dist/ui/g/FormBuilder/common/Renderer/common/Section/index.js

@@ -0,0 +1,4 @@
+import { t as e } from "../../../../../../../FormBuilder-653sa2uJ.js";
+export {
+  e as Section
+};

package/dist/ui/g/FormBuilder/common/Renderer/common/index.js

@@ -0,0 +1,4 @@
+import { t as e } from "../../../../../../FormBuilder-653sa2uJ.js";
+export {
+  e as Section
+};

package/dist/ui/g/FormBuilder/common/Renderer/index.js

@@ -0,0 +1,4 @@
+import { s as o } from "../../../../../FormBuilder-653sa2uJ.js";
+export {
+  o as Renderer
+};

package/dist/ui/g/FormBuilder/common/index.js

@@ -0,0 +1,5 @@
+import { r as s, s as a } from "../../../../FormBuilder-653sa2uJ.js";
+export {
+  s as Builder,
+  a as Renderer
+};

package/dist/ui/g/FormBuilder/index.js

@@ -0,0 +1,4 @@
+import { q as e } from "../../../FormBuilder-653sa2uJ.js";
+export {
+  e as FormBuilder
+};

package/dist/ui/g/index.js

@@ -0,0 +1,7 @@
+import { p as e, q as o } from "../../FormBuilder-653sa2uJ.js";
+import { default as d } from "./DragAndDrop/DragAndDrop.js";
+export {
+  d as DragAndDrop,
+  e as ExpandableLexicalPreview,
+  o as FormBuilder
+};

package/dist/ui/index.js

@@ -0,0 +1,137 @@
+import { default as s } from "./a/AppContext/Context.js";
+import { default as p } from "./a/AppContext/ContextProvider.js";
+import { default as u } from "./a/AppContext/useApp.js";
+import { default as d } from "./a/AppContext/useTheme.js";
+import { default as x } from "./a/BlurOverlay/BlurOverlay.js";
+import { A as c, B as T, c as g, j as C, g as h, C as S, a as I, E as F, p as D, n as L, q as P, D as b, F as A, m as B, l as k, L as v, M as y, N as M, b as E, P as O, k as Q, Q as R, i as w, R as U, f as G, d as N, S as H, e as V, h as j, T as q, o as z } from "../FormBuilder-653sa2uJ.js";
+import "./a/Conversation/Context.js";
+import "react";
+import { default as X } from "./a/DotInfo/DotInfo.js";
+import { default as _ } from "./a/Figure/Figure.js";
+import { default as K } from "./a/HamburgerButton/HamburgerButton.js";
+import { default as $ } from "./a/IconList/IconList.js";
+import { default as ae } from "./a/Label/Label.js";
+import { default as oe } from "./a/LoadingCircle/LoadingCircle.js";
+import { default as se } from "./a/People/People.js";
+import { default as pe } from "./a/Popover/Popover.js";
+import { default as ue } from "./a/ProgressBar/ProgressBar.js";
+import { default as de } from "./a/Quote/Quote.js";
+import { default as xe } from "./a/SVG/SVG.js";
+import { default as ce } from "./a/SnapScroller/SnapScroller.js";
+import { default as ge } from "./a/Spinner/Spinner.js";
+import { default as he } from "./a/Timestamp/Timestamp.js";
+import { default as Ie } from "./a/MetaCard/MetaCard.js";
+import { default as De } from "./a/AnimatedBlobs/AnimatedBlobs.js";
+import { default as Pe } from "./a/Tip/Tip.js";
+import { default as Ae } from "./a/TextSteps/TextSteps.js";
+import { default as ke } from "./a/Removable/Removable.js";
+import { default as ye } from "./a/ToggleSwitch/ToggleSwitch.js";
+import { default as Ee } from "./a/XMLEditor/XMLEditor.js";
+import { D as Qe } from "../DatePicker-DHuh_8q6.js";
+import { default as we } from "./a/Tooltip/Tooltip.js";
+import { default as Ge } from "./a/Charts/AreaChart/AreaChart.js";
+import { default as He } from "./a/Charts/BarChart/BarChart.js";
+import { default as je } from "./a/Charts/PieChart/PieChart.js";
+import { default as ze } from "./a/ThroughPutIndicator/ThroughPutIndicator.js";
+import "./b/Page/Context.js";
+import { default as Xe } from "./b/Title/Title.js";
+import { default as _e } from "./c/SocialMediaShareButton/SocialMediaShareButton.js";
+import { default as Ke } from "./f/common/Label/Label.js";
+import { default as $e } from "./f/common/Description/Description.js";
+import { lookUpInputValueFromFetchedOptions as aa } from "./f/common/utils/lookUpInputValueFromFetchedOptions.js";
+import { integerAndGreaterThanZero as oa } from "./f/common/utils/validators.js";
+import { default as sa } from "./f/fields/LatexPreviewInput/convertLatexToHtml.js";
+import { fileUploadOptions as pa, getFileType as la, getFileTypeFromUrl as ua } from "./f/fields/FileUpload/utils.js";
+import { default as da } from "./f/fields/RadioInput/RadioInput.js";
+import { default as xa } from "./g/DragAndDrop/DragAndDrop.js";
+import { default as ca } from "./utils/hooks/useWindowSize.js";
+import { default as ga } from "./utils/hooks/useDynamicPosition.js";
+import { default as ha } from "./utils/hooks/useOutsideClick.js";
+import { DATE_FORMATS as Ia, formatDate as Fa, formatTime as Da, parseDate as La, snakeCaseToTitleCase as Pa } from "./utils/formatting.js";
+import { applyCharacterLimit as Aa } from "./utils/applyCharacterLimit.js";
+export {
+  De as AnimatedBlobs,
+  c as AnimatedGradient,
+  s as AppContext,
+  p as AppContextProvider,
+  Ge as AreaChart,
+  He as BarChart,
+  x as BlurOverlay,
+  T as Button,
+  g as Card,
+  C as Checkbox,
+  h as ChoicesInput,
+  S as ContentTree,
+  I as Conversation,
+  Ia as DATE_FORMATS,
+  Qe as DatePicker,
+  X as DotInfo,
+  xa as DragAndDrop,
+  F as EditorInput,
+  D as ExpandableLexicalPreview,
+  _ as Figure,
+  L as FileUpload,
+  P as FormBuilder,
+  b as FormDebugger,
+  $e as FormDescription,
+  A as FormInput,
+  Ke as FormLabel,
+  K as HamburgerButton,
+  $ as IconList,
+  ae as Label,
+  B as LatexPreviewInput,
+  k as LinkInput,
+  oe as LoadingCircle,
+  v as Logo,
+  Ie as MetaCard,
+  y as Modal,
+  M as Notification,
+  E as NotificationStack,
+  O as Page,
+  se as People,
+  je as PieChart,
+  pe as Popover,
+  ue as ProgressBar,
+  Q as QueryChoices,
+  R as QueryCombobox,
+  w as QuerySelect,
+  de as Quote,
+  da as RadioInput,
+  U as RatingsInput,
+  ke as Removable,
+  xe as SVG,
+  G as SelectInput,
+  N as Shortener,
+  ce as SnapScroller,
+  H as SocialMediaButton,
+  _e as SocialMediaShareButton,
+  ge as Spinner,
+  V as TextInput,
+  Ae as TextSteps,
+  j as TextareaInput,
+  q as ThemeSelector,
+  ze as ThroughPutIndicator,
+  he as Timestamp,
+  Pe as Tip,
+  Xe as Title,
+  z as ToggleInput,
+  ye as ToggleSwitch,
+  we as Tooltip,
+  Ee as XMLEditor,
+  Aa as applyCharacterLimit,
+  sa as convertLatexToHtml,
+  pa as fileUploadOptions,
+  Fa as formatDate,
+  Da as formatTime,
+  la as getFileType,
+  ua as getFileTypeFromUrl,
+  oa as integerAndGreaterThanZero,
+  aa as lookUpInputValueFromFetchedOptions,
+  La as parseDate,
+  Pa as snakeCaseToTitleCase,
+  u as useApp,
+  ga as useDynamicPosition,
+  ha as useOutsideClick,
+  d as useTheme,
+  ca as useWindowSize
+};

package/dist/ui/utils/applyCharacterLimit.js

@@ -0,0 +1,31 @@
+const v = (m = !0) => {
+  setTimeout(() => {
+    document.querySelectorAll("[class*='limit-character-count-']").forEach((s) => {
+      const i = s.className.match(/limit-character-count-(\d+)/);
+      if (!i) return;
+      const r = parseInt(i[1], 10), l = s.matches("input[type='text'], input[type='email'], input[type='password'], input[type='search'], textarea") ? [s] : Array.from(s.querySelectorAll("input[type='text'], input[type='email'], input[type='password'], input[type='search'], textarea"));
+      if (!l.length) return;
+      const c = "s-2 character-counter", u = `${c} x-paragraph c-x`, h = `${c} x-orange c-x`, y = `${c} x-error c-x`;
+      l.forEach((e) => {
+        if (e.parentNode.querySelector(".character-counter")) return;
+        m && e.setAttribute("maxlength", r);
+        const t = document.createElement("span");
+        t.className = u, t.style.position = "absolute", t.style.right = "10px", t.style.bottom = "-20px", t.style.pointerEvents = "none";
+        let a;
+        const { parentNode: o } = e, x = window.getComputedStyle(o);
+        o.style && o.style.position === "relative" || x.getPropertyValue("position") === "relative" ? a = o : (a = document.createElement("div"), a.style.position = "relative", a.style.display = "inline-block", a.style.width = "100%", e.parentNode.insertBefore(a, e), a.appendChild(e)), a.appendChild(t);
+        function n() {
+          e.value.length > r && (e.value = e.value.substring(0, r));
+          const { length: p } = e.value;
+          t.textContent = `${p}/${r}`, p >= r ? t.className = y : p >= r * 0.9 ? t.className = h : t.className = u;
+        }
+        e.removeEventListener("input", n), e.removeEventListener("paste", n), e.addEventListener("input", n), e.addEventListener("paste", () => {
+          setTimeout(n, 0);
+        }), n();
+      });
+    });
+  }, 100);
+};
+export {
+  v as applyCharacterLimit
+};

package/dist/ui/utils/formatting.js

@@ -0,0 +1,90 @@
+const a = {
+  HUMAN_READABLE: "human_readable",
+  HUMAN_READABLE_WITH_TIME: "human_readable_with_time",
+  TIME: "time",
+  DATETIME: "datetime",
+  CHART_DATE: "chart_date",
+  CHART_TIME: "chart_time",
+  WEEKDAY_DATE: "weekday_date",
+  DAY_VIEW: "day_view"
+}, s = (e) => e instanceof Date && !Number.isNaN(e), c = (e) => /^([01]?[0-9]|2[0-3]):[0-5][0-9]$/.test(e), m = (e) => {
+  const [t, r] = e.split(":").map(Number), n = /* @__PURE__ */ new Date();
+  return n.setHours(t, r, 0, 0), n;
+}, u = (e) => {
+  const t = e.getHours(), r = t >= 12 ? "PM" : "AM";
+  return `${t % 12 || 12} ${r}`;
+}, T = (e) => {
+  const t = (/* @__PURE__ */ new Date()).getFullYear();
+  return e.getFullYear() !== t;
+}, A = (e) => {
+  if (!e) return "0s";
+  const t = Math.floor(e / 3600), r = Math.floor(e % 3600 / 60), n = Math.floor(e % 60), o = [];
+  return t > 0 && o.push(`${t}h`), (r > 0 || t > 0 && n > 0) && o.push(`${r}m`), n > 0 && o.push(`${n}s`), o.length === 0 ? "0s" : o.join(" ");
+}, i = {
+  [a.CHART_DATE]: (e) => {
+    const t = e.toLocaleDateString("en-US", {
+      month: "short",
+      day: "numeric",
+      timeZone: "UTC"
+    });
+    return T(e) ? `${t} ${e.getFullYear()}` : t;
+  },
+  [a.CHART_TIME]: (e) => u(e),
+  [a.HUMAN_READABLE]: (e) => e.toLocaleDateString("en-US", {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+    timeZone: "UTC"
+  }),
+  [a.HUMAN_READABLE_WITH_TIME]: (e) => e.toLocaleString("en-US", {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    timeZone: "UTC"
+  }),
+  default: (e) => e.toISOString()
+}, l = (e) => {
+  if (e instanceof Date) return e;
+  if (typeof e == "number") return new Date(e);
+  if (typeof e == "string") {
+    if (c(e))
+      return m(e);
+    const t = new Date(e);
+    if (s(t)) return t;
+    const r = parseInt(e, 10);
+    if (!Number.isNaN(r)) {
+      const n = new Date(r * 1e3);
+      if (s(n)) return n;
+    }
+  }
+  return null;
+}, f = (e, t = a.HUMAN_READABLE) => {
+  try {
+    if (typeof e == "string" && c(e)) {
+      if (t === a.CHART_TIME || t === a.TIME) {
+        const o = m(e);
+        return t === a.CHART_TIME ? u(o) : o.toLocaleTimeString("en-US", {
+          hour: "2-digit",
+          minute: "2-digit",
+          timeZone: "UTC"
+        });
+      }
+      return e;
+    }
+    const r = l(e);
+    return !r && (typeof e == "string" || typeof e == "number") ? e.toString() : (i[t] || i.default)(r);
+  } catch {
+    return "Invalid Date";
+  }
+}, h = (e) => {
+  const t = e.replace(/([A-Z])/g, " $1");
+  return t.charAt(0).toUpperCase() + t.slice(1);
+};
+export {
+  a as DATE_FORMATS,
+  f as formatDate,
+  A as formatTime,
+  l as parseDate,
+  h as snakeCaseToTitleCase
+};

package/dist/ui/utils/hooks/index.js

@@ -0,0 +1,8 @@
+import { default as s } from "./useWindowSize.js";
+import { default as a } from "./useDynamicPosition.js";
+import { default as u } from "./useOutsideClick.js";
+export {
+  a as useDynamicPosition,
+  u as useOutsideClick,
+  s as useWindowSize
+};

package/dist/ui/utils/hooks/useDynamicPosition.js

@@ -0,0 +1,61 @@
+import { useState as m, useMemo as H, useCallback as j, useEffect as x } from "react";
+import { t as y } from "../../../throttle-BCrS-Wew.js";
+import D from "./useWindowSize.js";
+const b = ["top", "bottom"], f = ["left", "right"], T = (t, n) => b.includes(t) ? n.filter((o) => f.includes(o)) : f.includes(t) ? n.filter((o) => b.includes(o)) : [], I = ({
+  elementRef: t,
+  parentRef: n,
+  preferredPrimaryOrder: o,
+  preferredSecondaryOrder: a,
+  // offsetYPx,
+  offsetXPx: p,
+  throttleMs: h = 200
+}) => {
+  const P = typeof window == "object", {
+    height: v,
+    width: C
+  } = D(), [c, E] = m(o[0]), r = H(
+    () => T(
+      c,
+      a
+    ),
+    [c, a]
+  ), [L, z] = m(r[0]), s = j(
+    y(() => {
+      const l = n == null ? void 0 : n.current, u = t == null ? void 0 : t.current, {
+        top: k,
+        bottom: B,
+        right: S,
+        left: W
+      } = (l == null ? void 0 : l.getBoundingClientRect()) || {}, {
+        width: d,
+        height: g
+      } = (u == null ? void 0 : u.getBoundingClientRect()) || {}, w = {
+        top: k >= g,
+        bottom: v - B >= g,
+        right: S >= d,
+        left: C - W >= d
+      };
+      for (let i = 0; i < o.length; i += 1) {
+        const e = o[i];
+        if (w[e]) {
+          E(e);
+          break;
+        }
+      }
+      for (let i = 0; i < r.length; i += 1) {
+        const e = r[i];
+        if (w[e]) {
+          z(e);
+          break;
+        }
+      }
+    }, h),
+    [t, p, h]
+  );
+  return x(() => P ? (s(), window.addEventListener("scroll", s), window.addEventListener("resize", s), () => {
+    window.removeEventListener("scroll", s), window.removeEventListener("resize", s);
+  }) : !1, [s]), { primaryPosition: c, secondaryPosition: L };
+};
+export {
+  I as default
+};

package/dist/ui/utils/hooks/useOutsideClick.js

@@ -0,0 +1,14 @@
+import { useEffect as r } from "react";
+const u = (t, n) => {
+  r(() => {
+    const e = (o) => {
+      t.current && !t.current.contains(o.target) && n();
+    };
+    return document.addEventListener("mousedown", e), document.addEventListener("touchstart", e), () => {
+      document.removeEventListener("mousedown", e), document.removeEventListener("touchstart", e);
+    };
+  }, [n]);
+};
+export {
+  u as default
+};

package/dist/ui/utils/hooks/useWindowSize.js

@@ -0,0 +1,16 @@
+import { useState as r, useCallback as s, useEffect as w } from "react";
+import { d as u } from "../../../debounce-Cm69Z_cF.js";
+const c = (t = 700) => {
+  const e = typeof window == "object", n = () => ({
+    width: e ? window.innerWidth : void 0,
+    height: e ? window.innerHeight : void 0
+  }), [o, d] = r(n), i = s(
+    u(() => {
+      d(n());
+    }, t)
+  );
+  return w(() => e ? (window.addEventListener("resize", i), () => window.removeEventListener("resize", i)) : !1, [n, i, e]), o;
+};
+export {
+  c as default
+};

package/dist/ui/utils/index.js

@@ -0,0 +1,16 @@
+import { default as t } from "./hooks/useWindowSize.js";
+import { default as r } from "./hooks/useDynamicPosition.js";
+import { default as i } from "./hooks/useOutsideClick.js";
+import { DATE_FORMATS as m, formatDate as p, formatTime as u, parseDate as l, snakeCaseToTitleCase as d } from "./formatting.js";
+import { applyCharacterLimit as T } from "./applyCharacterLimit.js";
+export {
+  m as DATE_FORMATS,
+  T as applyCharacterLimit,
+  p as formatDate,
+  u as formatTime,
+  l as parseDate,
+  d as snakeCaseToTitleCase,
+  r as useDynamicPosition,
+  i as useOutsideClick,
+  t as useWindowSize
+};

package/dist/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/package.json

@@ -1,54 +1,58 @@
 {
   "name": "@pareto-engineering/design-system",
-  "version": "5.3.0",
+  "version": "5.4.0",
   "description": "",
-  "main": "dist/cjs/index.js",
-  "module": "dist/es/index.js",
+  "type": "module",
+  "main": "dist/index.js",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
   "scripts": {
-    "test": "npm run test:stylelint && npm run test:eslint && npm run test:jest",
+    "test": "npm run test:stylelint && npm run test:eslint",
+    "test-storybook": "test-storybook",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
-    "testconfig:stylelint": "stylelint src/local.scss",
     "testconfig:eslint": "eslint src/**/*.jsx",
-    "test:jest": "jest",
-    "test:jest:update": "jest --updateSnapshot",
     "test:eslint": "eslint --ext .jsx,.js src/",
     "test:stylelint": "stylelint 'src/**/*.scss' --rd --rdd --risd --color --formatter verbose",
     "fix:stylelint": "npm run test:stylelint -- --fix",
     "fix:eslint": "npm run test:eslint -- --fix",
-    "copy-css:cjs": "copyfiles -u 2 src/ui/**/*.scss dist/cjs",
-    "copy-css:es": "copyfiles -u 2 src/ui/**/*.scss dist/es",
-    "compile:cjs": "TARGET=cjs babel src/ui --extensions '.js,.jsx' --out-dir dist/cjs",
-    "compile:es": "TARGET=es babel src/ui --extensions '.js,.jsx' --out-dir dist/es",
-    "build:cjs": "npm run compile:cjs && npm run copy-css:cjs",
-    "build:es": "npm run compile:es && npm run copy-css:es",
-    "compile": "npm run build:es && npm run build:cjs",
+    "build": "tsc -b ./tsconfig.app.json && vite build",
+    "compile": "npm run build",
     "prepare": "npm run compile"
   },
   "keywords": [],
   "author": "",
   "license": "ISC",
   "devDependencies": {
-    "@babel/cli": "^7.21.0",
-    "@pareto-engineering/eslint-config": "^5.0.0",
+    "@chromatic-com/storybook": "^3.2.6",
+    "@pareto-engineering/eslint-config": "^5.4.0",
     "@pareto-engineering/stylelint-config": "^5.0.0",
-    "@storybook/addon-essentials": "^7.0.6",
-    "@storybook/addon-interactions": "^7.0.6",
-    "@storybook/addon-links": "^7.0.6",
-    "@storybook/addon-storyshots": "^7.0.6",
-    "@storybook/blocks": "^7.0.6",
-    "@storybook/react": "^7.0.6",
-    "@storybook/react-webpack5": "^7.0.6",
-    "@storybook/testing-library": "^0.1.0",
-    "babel-plugin-relay": "^15.0.0",
+    "@pareto-engineering/ts-config": "^5.4.0",
+    "@storybook/addon-essentials": "^8.6.12",
+    "@storybook/addon-interactions": "^8.6.12",
+    "@storybook/addon-links": "^8.6.12",
+    "@storybook/addon-mdx-gfm": "^8.6.12",
+    "@storybook/blocks": "^8.6.12",
+    "@storybook/react": "^8.6.12",
+    "@storybook/react-vite": "^8.6.12",
+    "@storybook/react-webpack5": "^8.6.12",
+    "@storybook/test": "^8.6.12",
+    "@storybook/test-runner": "^0.22.0",
     "copyfiles": "^2.4.1",
-    "css-loader": "^6.7.3",
+    "eslint-import-resolver-typescript": "^4.3.4",
+    "eslint-plugin-storybook": "^0.12.0",
+    "globals": "^16.0.0",
     "identity-obj-proxy": "^3.0.0",
     "jest-environment-jsdom": "^29.5.0",
     "sass": "^1.85.1",
-    "sass-loader": "^16.0.5",
-    "storybook": "^7.0.6",
-    "style-loader": "^3.3.2"
+    "storybook": "^8.6.12",
+    "typescript": "~5.7.2",
+    "vite": "^6.3.1",
+    "vite-tsconfig-paths": "^5.1.4"
   },
   "dependencies": {
     "@codemirror/lang-xml": "^6.0.2",
@@ -60,16 +64,18 @@
     "@lexical/selection": "0.12.2",
     "@lexical/table": "0.12.2",
     "@lexical/utils": "0.12.2",
-    "@pareto-engineering/assets": "^5.3.0",
-    "@pareto-engineering/bem": "^5.3.0",
-    "@pareto-engineering/styles": "^5.3.0",
-    "@pareto-engineering/utils": "^5.0.0",
+    "@pareto-engineering/assets": "^5.4.0",
+    "@pareto-engineering/bem": "^5.4.0",
+    "@pareto-engineering/styles": "^5.4.0",
+    "@types/node": "^22.14.1",
+    "@vitejs/plugin-react": "^4.3.4",
     "better-react-mathjax": "^2.0.3",
     "codemirror": "^6.0.1",
     "date-fns": "^2.29.3",
     "downshift": "^6.1.12",
     "formik": "^2.2.9",
     "fuse.js": "^7.0.0",
+    "glob": "^11.0.1",
     "hamburgers": "^1.2.1",
     "lexical": "0.12.2",
     "lodash": "^4.17.21",
@@ -78,15 +84,17 @@
     "react-color-palette": "^7.1.0",
     "react-day-picker": "^8.10.0",
     "react-dom": "^18.2.0",
-    "react-helmet-async": "^1.3.0",
+    "react-helmet-async": "^2.0.5",
     "react-markdown": "^9.0.1",
     "react-relay": "^15.0.0",
     "react-router-dom": "^5.3.4",
     "recharts": "^2.13.3",
     "rehype-mathjax": "^6.0.0",
     "relay-test-utils": "^15.0.0",
-    "remark-math": "^6.0.0"
+    "remark-math": "^6.0.0",
+    "vite-plugin-dts": "^4.5.3",
+    "vite-plugin-lib-inject-css": "^2.2.2"
   },
   "browserslist": "> 2%",
-  "gitHead": "74dc91892e6471a3c42e65ce673c62693ce943f5"
+  "gitHead": "1e230928c7431a2cc07018dbd3fa0266a89b094e"
 }

package/.eslintrc.js

@@ -1,3 +0,0 @@
-module.exports = {
-  extends:['@pareto-engineering/eslint-config'],
-}

package/.storybook/main.js

@@ -1,32 +0,0 @@
-/** @type { import('@storybook/react-webpack5').StorybookConfig } */
-import webpackFinal from './webpackFinal'
-
-const config = {
-  webpackFinal,
-  staticDirs:[
-    '../../../node_modules/@pareto-engineering/assets/images',
-    '../../../node_modules/@pareto-engineering/assets/fonts',
-  ],
-  stories:[
-    '../src/stories/**/*.mdx',
-    '../src/stories/**/*.stories.@(js|jsx|ts|tsx)',
-  ],
-  addons:[
-    '@storybook/addon-links',
-    '@storybook/addon-essentials',
-    //'@storybook/addon-interactions',
-    //'storybook-addon-themes',
-  ],
-  framework:{
-    name   :'@storybook/react-webpack5',
-    options:{},
-  },
-  docs:{
-    autodocs:true,
-    //autodocs:'tag',
-  },
-  core:{
-    disableTelemetry:true, // 👈 Disables telemetry
-  },
-}
-export default config