@envisiongroup/porygon 1.0.0-rc.34 → 1.0.0-rc.36

package/README.md

@@ -10,10 +10,10 @@ Estos componentes cumplen con los siguientes criterios:
 
 ## Instalación
 
-Porygon es compatible con **React 17**, **18** y **19**. Instala el paquete con npm:
+Porygon es compatible con **React 17**, **18** y **19**. Instala el paquete con pnpm:
 
 ```bash
-npm install @grupoenvision/porygon
+pnpm add @grupoenvision/porygon
 ```
 
 ## Configuración inicial
@@ -66,4 +66,4 @@ root.render(
     <App />
   </FluentProvider>
 );
-```
+```

package/dist/react-components/tables/EFWTable/components/EFWTableBody/EFWTableBody.js

@@ -1,51 +1,51 @@
-import { jsx as u, jsxs as V } from "react/jsx-runtime";
-import { useEffect as z } from "react";
+import { jsx as d, jsxs as V } from "react/jsx-runtime";
+import { useEffect as v } from "react";
 import { useVirtualizer as F } from "@tanstack/react-virtual";
-import { EFWTableRow as v } from "../EFWTableRow/EFWTableRow.js";
+import { EFWTableRow as x } from "../EFWTableRow/EFWTableRow.js";
 import { tokens as m } from "@fluentui/react-components";
-const R = (e) => e ? {
+const S = (e) => e ? {
   fontSize: m.fontSizeBase200,
   lineHeight: m.lineHeightBase200
 } : {
   fontSize: m.fontSizeBase300,
   lineHeight: m.lineHeightBase300
-}, S = (e) => {
-  z(() => {
+}, B = (e) => {
+  v(() => {
     const t = e.current;
     if (!t) return;
-    let i = 0, o = !1, l = !1;
-    const s = () => {
+    let i = 0, o = !1, s = !1;
+    const a = () => {
       cancelAnimationFrame(i), i = requestAnimationFrame(() => {
-        const a = t.scrollLeft > 0, c = t.scrollTop > 0;
-        a !== o && (t.classList.toggle("is-scrolling-x", a), o = a), c !== l && (t.classList.toggle("is-scrolling-y", c), l = c);
+        const c = t.scrollLeft > 0, u = t.scrollTop > 0;
+        c !== o && (t.classList.toggle("is-scrolling-x", c), o = c), u !== s && (t.classList.toggle("is-scrolling-y", u), s = u);
       });
     };
-    return t.addEventListener("scroll", s, { passive: !0 }), s(), () => {
-      t.removeEventListener("scroll", s), cancelAnimationFrame(i);
+    return t.addEventListener("scroll", a, { passive: !0 }), a(), () => {
+      t.removeEventListener("scroll", a), cancelAnimationFrame(i);
     };
   }, [e]);
-}, A = ({
+}, I = ({
   tableContainerRef: e,
   enableSelection: t = !0,
   itemSize: i,
   dense: o = !0,
-  table: l,
-  gridTemplateColumns: s,
-  columnSizing: a,
-  stickyColumnsInfo: c,
+  table: s,
+  gridTemplateColumns: a,
+  columnSizing: c,
+  stickyColumnsInfo: u,
   onRowClick: h,
-  onRowDoubleClick: w
+  onRowDoubleClick: p
 }) => {
-  const d = l.getRowModel().rows.length, f = d > 0;
-  S(f ? e : { current: null });
+  const g = s.getRowModel().rows.length, f = g > 0;
+  B(f ? e : { current: null });
   const n = F({
-    count: d,
+    count: g,
     getScrollElement: () => e.current,
     estimateSize: () => i ?? o ? 32 : 44,
     measureElement: typeof window < "u" && navigator.userAgent.indexOf("Firefox") === -1 ? (r) => r?.getBoundingClientRect().height : void 0,
     overscan: 10
   });
-  z(() => {
+  v(() => {
     requestAnimationFrame(() => {
       try {
         n.measure();
@@ -53,62 +53,64 @@ const R = (e) => e ? {
         console.warn("Error al recalcular virtualizer:", r);
       }
     });
-  }, [d > 0, n]);
-  const g = n.getVirtualItems(), B = n.getTotalSize(), y = g.length > 0 ? g[0].start : 0, p = g.length > 0 ? B - g[g.length - 1].end : 0, T = g.map((r) => ({
+  }, [g > 0, n]);
+  const l = n.getVirtualItems(), R = n.getTotalSize(), y = l.length > 0 ? l[0].start : 0, w = l.length > 0 ? R - l[l.length - 1].end : 0, T = l.map((r) => ({
     virtualRow: r,
-    row: l.getRowModel().rows[r.index]
-  })), x = R(o);
-  return /* @__PURE__ */ V("div", { className: "table-body", style: x, children: [
-    y > 0 && /* @__PURE__ */ u("div", { style: { height: y } }),
-    T.map(({ row: r, virtualRow: E }) => /* @__PURE__ */ u(
-      v,
+    row: s.getRowModel().rows[r.index]
+  })), E = S(o);
+  return /* @__PURE__ */ V("div", { className: "table-body", style: E, children: [
+    y > 0 && /* @__PURE__ */ d("div", { style: { height: y } }),
+    T.map(({ row: r, virtualRow: z }) => /* @__PURE__ */ d(
+      x,
       {
         row: r,
-        virtualRow: E,
+        stripeIndex: z.index,
+        virtualRow: z,
         dense: o,
         rowVirtualizer: n,
         useVirtualization: !0,
         enableSelection: t,
-        gridTemplateColumns: s,
-        columnSizing: a,
-        stickyColumnsInfo: c,
+        gridTemplateColumns: a,
+        columnSizing: c,
+        stickyColumnsInfo: u,
         onRowClick: h,
-        onRowDoubleClick: w
+        onRowDoubleClick: p
       },
       r.original._rowId || r.id
     )),
-    p > 0 && /* @__PURE__ */ u("div", { style: { height: p } })
+    w > 0 && /* @__PURE__ */ d("div", { style: { height: w } })
   ] });
-}, H = ({
+}, A = ({
   tableContainerRef: e,
   enableSelection: t = !0,
   dense: i = !0,
   table: o,
-  gridTemplateColumns: l,
-  columnSizing: s,
-  stickyColumnsInfo: a,
-  onRowClick: c,
+  gridTemplateColumns: s,
+  columnSizing: a,
+  stickyColumnsInfo: c,
+  onRowClick: u,
   onRowDoubleClick: h
 }) => {
-  const d = o.getRowModel().rows.length > 0, f = R(i);
-  return S(d ? e : { current: null }), /* @__PURE__ */ u("div", { className: "table-body", style: f, children: o.getRowModel().rows.map((n) => /* @__PURE__ */ u(
-    v,
+  const g = o.getRowModel().rows.length > 0, f = S(i);
+  return B(g ? e : { current: null }), /* @__PURE__ */ d("div", { className: "table-body", style: f, children: o.getRowModel().rows.map((n, l) => /* @__PURE__ */ d(
+    x,
     {
       row: n,
+      stripeIndex: l,
       virtualRow: null,
       dense: i,
       rowVirtualizer: null,
       useVirtualization: !1,
       enableSelection: t,
-      gridTemplateColumns: l,
-      columnSizing: s,
-      stickyColumnsInfo: a,
-      onRowClick: c,
+      gridTemplateColumns: s,
+      columnSizing: a,
+      stickyColumnsInfo: c,
+      onRowClick: u,
       onRowDoubleClick: h
     },
     n.original._rowId || n.id
   )) });
-}, q = (e) => e.useVirtualization ? /* @__PURE__ */ u(A, { ...e }) : /* @__PURE__ */ u(H, { ...e });
+}, q = (e) => e.useVirtualization ? /* @__PURE__ */ d(I, { ...e }) : /* @__PURE__ */ d(A, { ...e });
 export {
   q as EFWTableBody
 };

package/dist/react-components/tables/EFWTable/components/EFWTableRow/EFWTableRow.js

@@ -1,7 +1,7 @@
-import { jsx as d } from "react/jsx-runtime";
-import { makeStyles as x, tokens as r, mergeClasses as y } from "@fluentui/react-components";
-import { EFWTableCell as C } from "../EFWTableCell/EFWTableCell.js";
-const f = x({
+import { jsx as c } from "react/jsx-runtime";
+import { makeStyles as C, tokens as r, mergeClasses as f } from "@fluentui/react-components";
+import { EFWTableCell as S } from "../EFWTableCell/EFWTableCell.js";
+const N = C({
   tableRow: {
     display: "grid",
     backgroundColor: r.colorNeutralBackground1,
@@ -16,55 +16,56 @@ const f = x({
       }
     }
   }
-}), S = ({
+}), B = ({
   row: o,
-  dense: c = !0,
-  virtualRow: l,
-  rowVirtualizer: s,
-  useVirtualization: t,
-  enableSelection: n,
-  gridTemplateColumns: i,
-  columnSizing: u,
-  stickyColumnsInfo: k,
-  onRowClick: b,
+  stripeIndex: d,
+  dense: s = !0,
+  virtualRow: t,
+  rowVirtualizer: n,
+  useVirtualization: l,
+  enableSelection: i,
+  gridTemplateColumns: u,
+  columnSizing: k,
+  stickyColumnsInfo: b,
+  onRowClick: g,
   onRowDoubleClick: a
 }) => {
-  const g = f(), m = o.getIsSelected(), p = y(g.tableRow, "table-row", m && "selected");
-  return /* @__PURE__ */ d(
+  const m = N(), p = o.getIsSelected(), y = d & 1 ? "odd" : "even", x = f(m.tableRow, "table-row", p && "selected");
+  return /* @__PURE__ */ c(
     "div",
     {
       "data-row-index": o.index,
-      "data-row-parity": o.index % 2 === 0 ? "even" : "odd",
-      ...t && l ? {
-        "data-index": l.index,
-        ref: (e) => s?.measureElement(e)
+      "data-row-parity": y,
+      ...l && t ? {
+        "data-index": t.index,
+        ref: (e) => n?.measureElement(e)
       } : {},
-      className: p,
+      className: x,
       role: "row",
       tabIndex: 0,
       onKeyDown: (e) => {
         (e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.currentTarget.click());
       },
-      onClick: (e) => b(o, e),
+      onClick: (e) => g(o, e),
       onDoubleClick: a ? (e) => a(o, e) : void 0,
       style: {
-        gridTemplateColumns: i,
-        cursor: n ? "pointer" : "default"
+        gridTemplateColumns: u,
+        cursor: i ? "pointer" : "default"
       },
-      children: o.getVisibleCells().map((e) => /* @__PURE__ */ d(
-        C,
+      children: o.getVisibleCells().map((e) => /* @__PURE__ */ c(
+        S,
         {
           cell: e,
-          dense: c,
-          columnSizing: u,
-          stickyColumnsInfo: k,
-          useVirtualization: t
+          dense: s,
+          columnSizing: k,
+          stickyColumnsInfo: b,
+          useVirtualization: l
         },
         e.id
       ))
     }
   );
-}, T = S;
+}, h = B;
 export {
-  T as EFWTableRow
+  h as EFWTableRow
 };

package/dist/react-components/tables/EFWTable/components/EFWTableRow/EFWTableRow.types.d.ts

@@ -5,6 +5,7 @@ import { EFWTableItem } from '../../EFWTable.types';
 
 export interface EFWTableRowProps {
     row: Row<EFWTableItem>;
+    stripeIndex: number;
     dense?: boolean;
     virtualRow: VirtualItem | null;
     rowVirtualizer: Virtualizer<HTMLDivElement, Element> | null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@envisiongroup/porygon",
-  "version": "1.0.0-rc.34",
+  "version": "1.0.0-rc.36",
   "description": "Librerias de componentes de React creados por la empresa Envision",
   "license": "CC-BY-ND-4.0",
   "main": "./dist/index.js",
@@ -44,7 +44,7 @@
       "import": "./dist/react-components/hooks/*/index.js",
       "require": "./dist/react-components/hooks/*/index.js"
     },
-	"./react-components/i18n/*": {
+    "./react-components/i18n/*": {
       "types": "./dist/react-components/i18n/*/index.d.ts",
       "import": "./dist/react-components/i18n/*/index.js",
       "require": "./dist/react-components/i18n/*/index.js"
@@ -60,25 +60,9 @@
     "README.md",
     "LICENSE"
   ],
-  "scripts": {
-    "build": "npm run clean && vite build --config vite.lib.config.js",
-    "build:tsc": "npm run clean && tsc",
-    "clean": "rm -rf dist",
-    "prepublishOnly": "npm run build",
-    "dev": "vite build --config vite.lib.config.js --watch",
-    "typecheck": "npm run typecheck:src && npm run typecheck:type-tests",
-    "typecheck:src": "tsc --noEmit -p tsconfig.json",
-    "typecheck:type-tests": "tsc --noEmit -p tsconfig.type-tests.json",
-    "analyze": "vite build --config vite.lib.config.js && npx vite-bundle-visualizer",
-    "verify:build": "npm run clean && npm run build",
-    "verify:types": "npm run typecheck",
-    "verify:pack": "npm pack --dry-run",
-    "verify:content": "npm pack && tar -tzf *.tgz | head -50",
-    "verify:all": "npm run verify:build && npm run verify:types && npm run verify:pack && echo '\n✅ All verifications passed! Ready to publish.'"
-  },
   "peerDependencies": {
-    "@fluentui/react-components": "9.72.2",
-    "@fluentui/react-datepicker-compat": "^0.6.14",
+    "@fluentui/react-components": "9.73.1",
+    "@fluentui/react-datepicker-compat": "^0.6.24",
     "@fluentui/react-icons": "^2.0.0",
     "@tanstack/react-table": "^8.21.3",
     "@tanstack/react-virtual": "^3.13.9",
@@ -102,6 +86,7 @@
     }
   },
   "devDependencies": {
+    "@storybook/react": "^10.2.13",
     "@types/react": "^18.2.0",
     "@types/react-dom": "^18.2.0",
     "typescript": "^5.3.0",
@@ -112,11 +97,26 @@
     "react",
     "components",
     "ui",
-	"envision",
-	"porygon"
+    "envision",
+    "porygon"
   ],
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
+  },
+  "scripts": {
+    "build": "pnpm run clean && vite build --config vite.lib.config.js",
+    "build:tsc": "pnpm run clean && tsc",
+    "clean": "rm -rf dist",
+    "dev": "vite build --config vite.lib.config.js --watch",
+    "typecheck": "pnpm run typecheck:src && pnpm run typecheck:type-tests",
+    "typecheck:src": "tsc --noEmit -p tsconfig.json",
+    "typecheck:type-tests": "tsc --noEmit -p tsconfig.type-tests.json",
+    "analyze": "vite build --config vite.lib.config.js && npx vite-bundle-visualizer",
+    "verify:build": "pnpm run clean && pnpm run build",
+    "verify:types": "pnpm run typecheck",
+    "verify:pack": "pnpm pack --dry-run",
+    "verify:content": "pnpm pack && tar -tzf *.tgz | head -50",
+    "verify:all": "pnpm run verify:build && pnpm run verify:types && pnpm run verify:pack && echo '\n✅ All verifications passed! Ready to publish.'"
   }
-}
+}