@ngnyan/data-table 1.0.5

package/README.md

@@ -0,0 +1,16 @@
+# React + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## React Compiler
+
+The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the [TS template](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-react-ts) for information on how to integrate TypeScript and [`typescript-eslint`](https://typescript-eslint.io) in your project.

package/dist/data-table.css

@@ -0,0 +1 @@
+.datatable{width:80%;border-collapse:separate;border-spacing:0;border-radius:10px;overflow:hidden}.datatable__th{text-align:center}.datatable__td{text-align:left;font-size:.8rem}.datatable__th,.datatable__td{padding:8px 12px}

package/dist/data-table.es.js

@@ -0,0 +1,361 @@
+import ee from "react";
+var x = { exports: {} }, _ = {};
+var I;
+function re() {
+  if (I) return _;
+  I = 1;
+  var a = /* @__PURE__ */ Symbol.for("react.transitional.element"), s = /* @__PURE__ */ Symbol.for("react.fragment");
+  function i(u, t, c) {
+    var b = null;
+    if (c !== void 0 && (b = "" + c), t.key !== void 0 && (b = "" + t.key), "key" in t) {
+      c = {};
+      for (var d in t)
+        d !== "key" && (c[d] = t[d]);
+    } else c = t;
+    return t = c.ref, {
+      $$typeof: a,
+      type: u,
+      key: b,
+      ref: t !== void 0 ? t : null,
+      props: c
+    };
+  }
+  return _.Fragment = s, _.jsx = i, _.jsxs = i, _;
+}
+var E = {};
+var L;
+function te() {
+  return L || (L = 1, process.env.NODE_ENV !== "production" && (function() {
+    function a(e) {
+      if (e == null) return null;
+      if (typeof e == "function")
+        return e.$$typeof === Z ? null : e.displayName || e.name || null;
+      if (typeof e == "string") return e;
+      switch (e) {
+        case h:
+          return "Fragment";
+        case q:
+          return "Profiler";
+        case U:
+          return "StrictMode";
+        case G:
+          return "Suspense";
+        case X:
+          return "SuspenseList";
+        case H:
+          return "Activity";
+      }
+      if (typeof e == "object")
+        switch (typeof e.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), e.$$typeof) {
+          case W:
+            return "Portal";
+          case V:
+            return e.displayName || "Context";
+          case J:
+            return (e._context.displayName || "Context") + ".Consumer";
+          case z:
+            var r = e.render;
+            return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case B:
+            return r = e.displayName || null, r !== null ? r : a(e.type) || "Memo";
+          case j:
+            r = e._payload, e = e._init;
+            try {
+              return a(e(r));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function s(e) {
+      return "" + e;
+    }
+    function i(e) {
+      try {
+        s(e);
+        var r = !1;
+      } catch {
+        r = !0;
+      }
+      if (r) {
+        r = console;
+        var n = r.error, o = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return n.call(
+          r,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          o
+        ), s(e);
+      }
+    }
+    function u(e) {
+      if (e === h) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === j)
+        return "<...>";
+      try {
+        var r = a(e);
+        return r ? "<" + r + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function t() {
+      var e = y.A;
+      return e === null ? null : e.getOwner();
+    }
+    function c() {
+      return Error("react-stack-top-frame");
+    }
+    function b(e) {
+      if (N.call(e, "key")) {
+        var r = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (r && r.isReactWarning) return !1;
+      }
+      return e.key !== void 0;
+    }
+    function d(e, r) {
+      function n() {
+        C || (C = !0, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          r
+        ));
+      }
+      n.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: n,
+        configurable: !0
+      });
+    }
+    function p() {
+      var e = a(this.type);
+      return F[e] || (F[e] = !0, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      )), e = this.props.ref, e !== void 0 ? e : null;
+    }
+    function k(e, r, n, o, T, g) {
+      var l = n.ref;
+      return e = {
+        $$typeof: w,
+        type: e,
+        key: r,
+        props: n,
+        _owner: o
+      }, (l !== void 0 ? l : null) !== null ? Object.defineProperty(e, "ref", {
+        enumerable: !1,
+        get: p
+      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(e, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(e, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: T
+      }), Object.defineProperty(e, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: g
+      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+    }
+    function R(e, r, n, o, T, g) {
+      var l = r.children;
+      if (l !== void 0)
+        if (o)
+          if (Q(l)) {
+            for (o = 0; o < l.length; o++)
+              A(l[o]);
+            Object.freeze && Object.freeze(l);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else A(l);
+      if (N.call(r, "key")) {
+        l = a(e);
+        var m = Object.keys(r).filter(function(K) {
+          return K !== "key";
+        });
+        o = 0 < m.length ? "{key: someKey, " + m.join(": ..., ") + ": ...}" : "{key: someKey}", $[l + o] || (m = 0 < m.length ? "{" + m.join(": ..., ") + ": ...}" : "{}", console.error(
+          `A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,
+          o,
+          l,
+          m,
+          l
+        ), $[l + o] = !0);
+      }
+      if (l = null, n !== void 0 && (i(n), l = "" + n), b(r) && (i(r.key), l = "" + r.key), "key" in r) {
+        n = {};
+        for (var S in r)
+          S !== "key" && (n[S] = r[S]);
+      } else n = r;
+      return l && d(
+        n,
+        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
+      ), k(
+        e,
+        l,
+        n,
+        t(),
+        T,
+        g
+      );
+    }
+    function A(e) {
+      P(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === j && (e._payload.status === "fulfilled" ? P(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+    }
+    function P(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === w;
+    }
+    var v = ee, w = /* @__PURE__ */ Symbol.for("react.transitional.element"), W = /* @__PURE__ */ Symbol.for("react.portal"), h = /* @__PURE__ */ Symbol.for("react.fragment"), U = /* @__PURE__ */ Symbol.for("react.strict_mode"), q = /* @__PURE__ */ Symbol.for("react.profiler"), J = /* @__PURE__ */ Symbol.for("react.consumer"), V = /* @__PURE__ */ Symbol.for("react.context"), z = /* @__PURE__ */ Symbol.for("react.forward_ref"), G = /* @__PURE__ */ Symbol.for("react.suspense"), X = /* @__PURE__ */ Symbol.for("react.suspense_list"), B = /* @__PURE__ */ Symbol.for("react.memo"), j = /* @__PURE__ */ Symbol.for("react.lazy"), H = /* @__PURE__ */ Symbol.for("react.activity"), Z = /* @__PURE__ */ Symbol.for("react.client.reference"), y = v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, N = Object.prototype.hasOwnProperty, Q = Array.isArray, O = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    v = {
+      react_stack_bottom_frame: function(e) {
+        return e();
+      }
+    };
+    var C, F = {}, Y = v.react_stack_bottom_frame.bind(
+      v,
+      c
+    )(), D = O(u(c)), $ = {};
+    E.Fragment = h, E.jsx = function(e, r, n) {
+      var o = 1e4 > y.recentlyCreatedOwnerStacks++;
+      return R(
+        e,
+        r,
+        n,
+        !1,
+        o ? Error("react-stack-top-frame") : Y,
+        o ? O(u(e)) : D
+      );
+    }, E.jsxs = function(e, r, n) {
+      var o = 1e4 > y.recentlyCreatedOwnerStacks++;
+      return R(
+        e,
+        r,
+        n,
+        !0,
+        o ? Error("react-stack-top-frame") : Y,
+        o ? O(u(e)) : D
+      );
+    };
+  })()), E;
+}
+var M;
+function ae() {
+  return M || (M = 1, process.env.NODE_ENV === "production" ? x.exports = re() : x.exports = te()), x.exports;
+}
+var f = ae();
+function ne({
+  columns: a,
+  getCellStyle: s,
+  headerBgColor: i,
+  headerFontColor: u
+}) {
+  return /* @__PURE__ */ f.jsx("thead", { children: /* @__PURE__ */ f.jsx("tr", { children: a.map((t, c) => /* @__PURE__ */ f.jsx(
+    "th",
+    {
+      className: "datatable__th",
+      style: {
+        ...s(c),
+        backgroundColor: i,
+        color: u
+      },
+      children: t.title
+    },
+    t.key
+  )) }) });
+}
+function oe({ value: a, style: s }) {
+  return /* @__PURE__ */ f.jsx("td", { className: "datatable__td", style: s, children: a ?? "" });
+}
+function le({ row: a, columns: s, getCellStyle: i, isLastRow: u }) {
+  return /* @__PURE__ */ f.jsx("tr", { children: s.map((t) => /* @__PURE__ */ f.jsx(
+    oe,
+    {
+      value: a[t.key],
+      style: i(s.indexOf(t), u)
+    },
+    t.key
+  )) });
+}
+function se({ data: a, columns: s, getCellStyle: i }) {
+  return /* @__PURE__ */ f.jsx("tbody", { children: a.map((u, t) => /* @__PURE__ */ f.jsx(
+    le,
+    {
+      row: u,
+      columns: s,
+      getCellStyle: i,
+      isLastRow: t === a.length - 1
+    },
+    u.id ?? t
+  )) });
+}
+function ce({
+  columns: a,
+  data: s,
+  headerBgColor: i = "#cccccc",
+  headerFontColor: u = "#FFFFFF",
+  fontFamily: t = "sans-serif",
+  borderColor: c = "#000000",
+  boxShadow: b = "0px 4px 12px rgba(0, 0, 0, 0.15)"
+}) {
+  if (!a || a.length === 0)
+    return /* @__PURE__ */ f.jsx("p", { children: "No columns defined." });
+  if (!s || s.length === 0)
+    return /* @__PURE__ */ f.jsx("p", { children: "No data available." });
+  const d = `0.5px solid ${c}`, p = (k, R = !1) => ({
+    borderTop: "none",
+    borderBottom: R ? "none" : d,
+    borderLeft: "none",
+    borderRight: k === a.length - 1 ? "none" : d
+  });
+  return /* @__PURE__ */ f.jsxs(
+    "table",
+    {
+      className: "datatable",
+      style: { fontFamily: t, border: d, boxShadow: b },
+      role: "table",
+      "aria-label": "Data table",
+      children: [
+        /* @__PURE__ */ f.jsx(
+          ne,
+          {
+            columns: a,
+            getCellStyle: p,
+            headerBgColor: i,
+            headerFontColor: u
+          }
+        ),
+        /* @__PURE__ */ f.jsx(
+          se,
+          {
+            data: s,
+            columns: a,
+            getCellStyle: p
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  ce as DataTable,
+  se as DataTableBody,
+  oe as DataTableCell,
+  ne as DataTableHeader,
+  le as DataTableRow
+};

package/dist/data-table.umd.js

@@ -0,0 +1,6 @@
+(function(d,E){typeof exports=="object"&&typeof module<"u"?E(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],E):(d=typeof globalThis<"u"?globalThis:d||self,E(d.DataTable={},d.React))})(this,(function(d,E){"use strict";var p={exports:{}},T={};var w;function G(){if(w)return T;w=1;var a=Symbol.for("react.transitional.element"),s=Symbol.for("react.fragment");function f(u,t,i){var m=null;if(i!==void 0&&(m=""+i),t.key!==void 0&&(m=""+t.key),"key"in t){i={};for(var b in t)b!=="key"&&(i[b]=t[b])}else i=t;return t=i.ref,{$$typeof:a,type:u,key:m,ref:t!==void 0?t:null,props:i}}return T.Fragment=s,T.jsx=f,T.jsxs=f,T}var R={};var N;function B(){return N||(N=1,process.env.NODE_ENV!=="production"&&(function(){function a(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===se?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case x:return"Fragment";case K:return"Profiler";case Q:return"StrictMode";case ae:return"Suspense";case ne:return"SuspenseList";case le:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case Z:return"Portal";case re:return e.displayName||"Context";case ee:return(e._context.displayName||"Context")+".Consumer";case te:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case oe:return r=e.displayName||null,r!==null?r:a(e.type)||"Memo";case O:r=e._payload,e=e._init;try{return a(e(r))}catch{}}return null}function s(e){return""+e}function f(e){try{s(e);var r=!1}catch{r=!0}if(r){r=console;var n=r.error,o=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return n.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",o),s(e)}}function u(e){if(e===x)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===O)return"<...>";try{var r=a(e);return r?"<"+r+">":"<...>"}catch{return"<...>"}}function t(){var e=S.A;return e===null?null:e.getOwner()}function i(){return Error("react-stack-top-frame")}function m(e){if(W.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function b(e,r){function n(){U||(U=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",r))}n.isReactWarning=!0,Object.defineProperty(e,"key",{get:n,configurable:!0})}function v(){var e=a(this.type);return q[e]||(q[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function j(e,r,n,o,k,A){var l=n.ref;return e={$$typeof:M,type:e,key:r,props:n,_owner:o},(l!==void 0?l:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:v}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:k}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:A}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function h(e,r,n,o,k,A){var l=r.children;if(l!==void 0)if(o)if(ue(l)){for(o=0;o<l.length;o++)I(l[o]);Object.freeze&&Object.freeze(l)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else I(l);if(W.call(r,"key")){l=a(e);var _=Object.keys(r).filter(function(ie){return ie!=="key"});o=0<_.length?"{key: someKey, "+_.join(": ..., ")+": ...}":"{key: someKey}",z[l+o]||(_=0<_.length?"{"+_.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,o,l,_,l),z[l+o]=!0)}if(l=null,n!==void 0&&(f(n),l=""+n),m(r)&&(f(r.key),l=""+r.key),"key"in r){n={};for(var P in r)P!=="key"&&(n[P]=r[P])}else n=r;return l&&b(n,typeof e=="function"?e.displayName||e.name||"Unknown":e),j(e,l,n,t(),k,A)}function I(e){L(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===O&&(e._payload.status==="fulfilled"?L(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function L(e){return typeof e=="object"&&e!==null&&e.$$typeof===M}var y=E,M=Symbol.for("react.transitional.element"),Z=Symbol.for("react.portal"),x=Symbol.for("react.fragment"),Q=Symbol.for("react.strict_mode"),K=Symbol.for("react.profiler"),ee=Symbol.for("react.consumer"),re=Symbol.for("react.context"),te=Symbol.for("react.forward_ref"),ae=Symbol.for("react.suspense"),ne=Symbol.for("react.suspense_list"),oe=Symbol.for("react.memo"),O=Symbol.for("react.lazy"),le=Symbol.for("react.activity"),se=Symbol.for("react.client.reference"),S=y.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,W=Object.prototype.hasOwnProperty,ue=Array.isArray,g=console.createTask?console.createTask:function(){return null};y={react_stack_bottom_frame:function(e){return e()}};var U,q={},J=y.react_stack_bottom_frame.bind(y,i)(),V=g(u(i)),z={};R.Fragment=x,R.jsx=function(e,r,n){var o=1e4>S.recentlyCreatedOwnerStacks++;return h(e,r,n,!1,o?Error("react-stack-top-frame"):J,o?g(u(e)):V)},R.jsxs=function(e,r,n){var o=1e4>S.recentlyCreatedOwnerStacks++;return h(e,r,n,!0,o?Error("react-stack-top-frame"):J,o?g(u(e)):V)}})()),R}var C;function X(){return C||(C=1,process.env.NODE_ENV==="production"?p.exports=G():p.exports=B()),p.exports}var c=X();function D({columns:a,getCellStyle:s,headerBgColor:f,headerFontColor:u}){return c.jsx("thead",{children:c.jsx("tr",{children:a.map((t,i)=>c.jsx("th",{className:"datatable__th",style:{...s(i),backgroundColor:f,color:u},children:t.title},t.key))})})}function F({value:a,style:s}){return c.jsx("td",{className:"datatable__td",style:s,children:a??""})}function Y({row:a,columns:s,getCellStyle:f,isLastRow:u}){return c.jsx("tr",{children:s.map(t=>c.jsx(F,{value:a[t.key],style:f(s.indexOf(t),u)},t.key))})}function $({data:a,columns:s,getCellStyle:f}){return c.jsx("tbody",{children:a.map((u,t)=>c.jsx(Y,{row:u,columns:s,getCellStyle:f,isLastRow:t===a.length-1},u.id??t))})}function H({columns:a,data:s,headerBgColor:f="#cccccc",headerFontColor:u="#FFFFFF",fontFamily:t="sans-serif",borderColor:i="#000000",boxShadow:m="0px 4px 12px rgba(0, 0, 0, 0.15)"}){if(!a||a.length===0)return c.jsx("p",{children:"No columns defined."});if(!s||s.length===0)return c.jsx("p",{children:"No data available."});const b=`0.5px solid ${i}`,v=(j,h=!1)=>({borderTop:"none",borderBottom:h?"none":b,borderLeft:"none",borderRight:j===a.length-1?"none":b});return c.jsxs("table",{className:"datatable",style:{fontFamily:t,border:b,boxShadow:m},role:"table","aria-label":"Data table",children:[c.jsx(D,{columns:a,getCellStyle:v,headerBgColor:f,headerFontColor:u}),c.jsx($,{data:s,columns:a,getCellStyle:v})]})}d.DataTable=H,d.DataTableBody=$,d.DataTableCell=F,d.DataTableHeader=D,d.DataTableRow=Y,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@ngnyan/data-table",
+  "version": "1.0.5",
+  "type": "module",
+  "main": "dist/data-table.umd.js",
+  "module": "dist/data-table.es.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/data-table.es.js",
+      "require": "./dist/data-table.umd.js"
+    }
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/NGnYan/HRnet-DataTables.git"
+  },
+  "homepage": "https://github.com/NGnYan/HRnet-DataTables#readme",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "lint": "eslint ."
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-react": "^5.1.1",
+    "vite": "^7.3.1",
+    "@types/react": "^19.2.7",
+    "@types/react-dom": "^19.2.3",
+    "eslint": "^9.39.1",
+    "prop-types": "^15.8.1",
+    "storybook": "^10.2.12",
+    "@storybook/react-vite": "^10.2.12"
+  }
+}