[components,excel][xs]: change data for one of the stories

Bump version
[components,map,excel][l]: fix leaflet map markers on prod and implement excel component
2023-07-13 11:04:36 -03:00 · 2023-07-12 18:20:31 -03:00 · 2023-07-12 18:16:22 -03:00 · 2023-07-12 16:47:10 -03:00 · 2023-07-11 17:43:30 -03:00 · 2023-07-10 17:44:11 -03:00
10 changed files with 443 additions and 24 deletions
--- a/.changeset/shiny-parents-shop.md
+++ b/.changeset/shiny-parents-shop.md
@ -0,0 +1,5 @@
+---
+'@portaljs/components': minor
+---
+
+Implement <Excel /> component
--- a/package-lock.json
+++ b/package-lock.json
@ -13812,6 +13812,33 @@
        "node": ">= 10.0.0"
      }
    },
+    "node_modules/adler-32": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.3.1.tgz",
+      "integrity": "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A==",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
+    "node_modules/ag-grid-community": {
+      "version": "30.0.3",
+      "resolved": "https://registry.npmjs.org/ag-grid-community/-/ag-grid-community-30.0.3.tgz",
+      "integrity": "sha512-agfRVHELQqhnMfRplmYEYdxMxw3c8l5Bu7lNaCfIVOasyRlSAvH4Na8qru0ORaOUN3ClulfvKIuLSWwgGSwJJQ==",
+      "peer": true
+    },
+    "node_modules/ag-grid-react": {
+      "version": "30.0.4",
+      "resolved": "https://registry.npmjs.org/ag-grid-react/-/ag-grid-react-30.0.4.tgz",
+      "integrity": "sha512-6N3O0avco1BVt5jLe6tD3GepvsmoxV4gvqHQ4SguYwqkfvO9IzN8GEOiVScLlAn1zvWjhCeSpnIYRi44bP3wqQ==",
+      "dependencies": {
+        "prop-types": "^15.8.1"
+      },
+      "peerDependencies": {
+        "ag-grid-community": "~30.0.3",
+        "react": "^16.3.0 || ^17.0.0 || ^18.0.0",
+        "react-dom": "^16.3.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
    "node_modules/agent-base": {
      "version": "6.0.2",
      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
@ -15480,6 +15507,18 @@
        "url": "https://github.com/sponsors/wooorm"
      }
    },
+    "node_modules/cfb": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.2.tgz",
+      "integrity": "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==",
+      "dependencies": {
+        "adler-32": "~1.3.0",
+        "crc-32": "~1.2.0"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
    "node_modules/chai": {
      "version": "4.3.7",
      "resolved": "https://registry.npmjs.org/chai/-/chai-4.3.7.tgz",
@ -15803,6 +15842,14 @@
      "integrity": "sha512-q4dMFMlXtKR3XNBHyMHt/3pwYNA69EDk00lloMOaaUMKPUXBw6lpXtbu3MMVG6/uOihGnRDOlkyqsONEUj60+w==",
      "dev": true
    },
+    "node_modules/codepage": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.15.0.tgz",
+      "integrity": "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA==",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
    "node_modules/collect-v8-coverage": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/collect-v8-coverage/-/collect-v8-coverage-1.0.1.tgz",
@ -16291,6 +16338,17 @@
        "node": ">=10"
      }
    },
+    "node_modules/crc-32": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz",
+      "integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ==",
+      "bin": {
+        "crc32": "bin/crc32.njs"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
    "node_modules/create-require": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz",
@ -16621,6 +16679,11 @@
      "integrity": "sha512-PjiQ659aQ+fUTQqSrd1XEDnOr52jh30RBurfzkscaE2tPaFsDH5wOAHJiw8XAHphRknCwMUE9KRayc4K/NbO8A==",
      "dev": true
    },
+    "node_modules/cuint": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/cuint/-/cuint-0.2.2.tgz",
+      "integrity": "sha512-d4ZVpCW31eWwCMe1YT3ur7mUDnTXbgwyzaL320DrcRT45rfjYxkt5QWLrmOJ+/UEAI2+fQgKe/fCjR8l4TpRgw=="
+    },
    "node_modules/cypress": {
      "version": "12.9.0",
      "resolved": "https://registry.npmjs.org/cypress/-/cypress-12.9.0.tgz",
@ -20129,6 +20192,14 @@
        "node": ">= 0.6"
      }
    },
+    "node_modules/frac": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/frac/-/frac-1.1.2.tgz",
+      "integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA==",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
    "node_modules/fraction.js": {
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.2.0.tgz",
@ -28238,7 +28309,6 @@
      "version": "3.1.0",
      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
      "integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==",
-      "dev": true,
      "dependencies": {
        "semver": "^6.0.0"
      },
@ -32166,6 +32236,34 @@
        "postcss": "^8.2.15"
      }
    },
+    "node_modules/postcss-url": {
+      "version": "10.1.3",
+      "resolved": "https://registry.npmjs.org/postcss-url/-/postcss-url-10.1.3.tgz",
+      "integrity": "sha512-FUzyxfI5l2tKmXdYc6VTu3TWZsInayEKPbiyW+P6vmmIrrb4I6CGX0BFoewgYHLK+oIL5FECEK02REYRpBvUCw==",
+      "dependencies": {
+        "make-dir": "~3.1.0",
+        "mime": "~2.5.2",
+        "minimatch": "~3.0.4",
+        "xxhashjs": "~0.2.2"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "peerDependencies": {
+        "postcss": "^8.0.0"
+      }
+    },
+    "node_modules/postcss-url/node_modules/mime": {
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-2.5.2.tgz",
+      "integrity": "sha512-tqkh47FzKeCPD2PUiPB6pkbMzsCasjxAfC62/Wap5qrUWcb+sFasXUC5I3gYM5iBM8v/Qpn4UK0x+j0iHyFPDg==",
+      "bin": {
+        "mime": "cli.js"
+      },
+      "engines": {
+        "node": ">=4.0.0"
+      }
+    },
    "node_modules/postcss-value-parser": {
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
@ -34352,7 +34450,6 @@
      "version": "6.3.0",
      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-      "dev": true,
      "bin": {
        "semver": "bin/semver.js"
      }
@ -34962,6 +35059,17 @@
      "integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==",
      "dev": true
    },
+    "node_modules/ssf": {
+      "version": "0.11.2",
+      "resolved": "https://registry.npmjs.org/ssf/-/ssf-0.11.2.tgz",
+      "integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==",
+      "dependencies": {
+        "frac": "~1.1.2"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
    "node_modules/sshpk": {
      "version": "1.17.0",
      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.17.0.tgz",
@ -38957,6 +39065,22 @@
      "integrity": "sha512-JcKqAHLPxcdb9KM49dufGXn2x3ssnfjbcaQdLlfZsL9rH9wgDQjUtDxbo8NE0F6SFvydeu1VhZe7hZuHsB2/pw==",
      "dev": true
    },
+    "node_modules/wmf": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wmf/-/wmf-1.0.2.tgz",
+      "integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw==",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
+    "node_modules/word": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/word/-/word-0.3.0.tgz",
+      "integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA==",
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
    "node_modules/word-wrap": {
      "version": "1.2.3",
      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
@ -39063,6 +39187,26 @@
        }
      }
    },
+    "node_modules/xlsx": {
+      "version": "0.18.5",
+      "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.18.5.tgz",
+      "integrity": "sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ==",
+      "dependencies": {
+        "adler-32": "~1.3.0",
+        "cfb": "~1.2.1",
+        "codepage": "~1.15.0",
+        "crc-32": "~1.2.1",
+        "ssf": "~0.11.2",
+        "wmf": "~1.0.1",
+        "word": "~0.3.0"
+      },
+      "bin": {
+        "xlsx": "bin/xlsx.njs"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
    "node_modules/xml-name-validator": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-4.0.0.tgz",
@ -39091,6 +39235,14 @@
        "node": ">=0.4"
      }
    },
+    "node_modules/xxhashjs": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/xxhashjs/-/xxhashjs-0.2.2.tgz",
+      "integrity": "sha512-AkTuIuVTET12tpsVIQo+ZU6f/qDmKuRUcjaqR+OIvm+aCBsZ95i7UVY5WJ9TMsSaZ0DA2WxoZ4acu0sPH+OKAw==",
+      "dependencies": {
+        "cuint": "^0.2.2"
+      }
+    },
    "node_modules/y18n": {
      "version": "5.0.8",
      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
@ -39635,18 +39787,20 @@
    },
    "packages/components": {
      "name": "@portaljs/components",
-      "version": "0.1.12",
+      "version": "0.2.0",
      "dependencies": {
        "@githubocto/flat-ui": "^0.14.1",
        "@heroicons/react": "^2.0.17",
        "@planet/maps": "^8.1.0",
        "@tanstack/react-table": "^8.8.5",
+        "ag-grid-react": "^30.0.4",
        "chroma-js": "^2.4.2",
        "flexsearch": "0.7.21",
        "leaflet": "^1.9.4",
        "next-mdx-remote": "^4.4.1",
        "ol": "^7.4.0",
        "papaparse": "^5.4.1",
+        "postcss-url": "^10.1.3",
        "react": "^18.2.0",
        "react-dom": "^18.2.0",
        "react-hook-form": "^7.43.9",
@ -39655,7 +39809,8 @@
        "react-vega": "^7.6.0",
        "vega": "5.25.0",
        "vega-lite": "5.1.0",
-        "vitest": "^0.31.4"
+        "vitest": "^0.31.4",
+        "xlsx": "^0.18.5"
      },
      "devDependencies": {
        "@storybook/addon-essentials": "^7.0.7",
@ -46867,6 +47022,7 @@
        "@typescript-eslint/parser": "^5.57.1",
        "@vitejs/plugin-react": "^4.0.0",
        "@vitejs/plugin-react-swc": "^3.3.2",
+        "ag-grid-react": "^30.0.4",
        "autoprefixer": "^10.4.14",
        "chroma-js": "^2.4.2",
        "eslint": "^8.38.0",
@ -46882,6 +47038,7 @@
        "postcss": "^8.4.23",
        "postcss-import": "^15.1.0",
        "postcss-import-url": "^7.2.0",
+        "postcss-url": "*",
        "prop-types": "^15.8.1",
        "react": "^18.2.0",
        "react-dom": "^18.2.0",
@ -46897,7 +47054,8 @@
        "vite": "^4.3.2",
        "vite-plugin-dts": "^2.3.0",
        "vite-plugin-swc-only": "^0.1.18",
-        "vitest": "^0.31.4"
+        "vitest": "^0.31.4",
+        "xlsx": "^0.18.5"
      },
      "dependencies": {
        "@eslint/eslintrc": {
@ -50929,6 +51087,25 @@
      "integrity": "sha512-4B/qKCfeE/ODUaAUpSwfzazo5x29WD4r3vXiWsB7I2mSDAihwEqKO+g8GELZUQSSAo5e1XTYh3ZVfLyxBc12nA==",
      "dev": true
    },
+    "adler-32": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.3.1.tgz",
+      "integrity": "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A=="
+    },
+    "ag-grid-community": {
+      "version": "30.0.3",
+      "resolved": "https://registry.npmjs.org/ag-grid-community/-/ag-grid-community-30.0.3.tgz",
+      "integrity": "sha512-agfRVHELQqhnMfRplmYEYdxMxw3c8l5Bu7lNaCfIVOasyRlSAvH4Na8qru0ORaOUN3ClulfvKIuLSWwgGSwJJQ==",
+      "peer": true
+    },
+    "ag-grid-react": {
+      "version": "30.0.4",
+      "resolved": "https://registry.npmjs.org/ag-grid-react/-/ag-grid-react-30.0.4.tgz",
+      "integrity": "sha512-6N3O0avco1BVt5jLe6tD3GepvsmoxV4gvqHQ4SguYwqkfvO9IzN8GEOiVScLlAn1zvWjhCeSpnIYRi44bP3wqQ==",
+      "requires": {
+        "prop-types": "^15.8.1"
+      }
+    },
    "agent-base": {
      "version": "6.0.2",
      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
@ -52180,6 +52357,15 @@
      "resolved": "https://registry.npmjs.org/ccount/-/ccount-2.0.1.tgz",
      "integrity": "sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg=="
    },
+    "cfb": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.2.tgz",
+      "integrity": "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==",
+      "requires": {
+        "adler-32": "~1.3.0",
+        "crc-32": "~1.2.0"
+      }
+    },
    "chai": {
      "version": "4.3.7",
      "resolved": "https://registry.npmjs.org/chai/-/chai-4.3.7.tgz",
@ -52403,6 +52589,11 @@
      "integrity": "sha512-q4dMFMlXtKR3XNBHyMHt/3pwYNA69EDk00lloMOaaUMKPUXBw6lpXtbu3MMVG6/uOihGnRDOlkyqsONEUj60+w==",
      "dev": true
    },
+    "codepage": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.15.0.tgz",
+      "integrity": "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA=="
+    },
    "collect-v8-coverage": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/collect-v8-coverage/-/collect-v8-coverage-1.0.1.tgz",
@ -52804,6 +52995,11 @@
        "yaml": "^1.10.0"
      }
    },
+    "crc-32": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz",
+      "integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ=="
+    },
    "create-require": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz",
@ -53065,6 +53261,11 @@
      "integrity": "sha512-PjiQ659aQ+fUTQqSrd1XEDnOr52jh30RBurfzkscaE2tPaFsDH5wOAHJiw8XAHphRknCwMUE9KRayc4K/NbO8A==",
      "dev": true
    },
+    "cuint": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/cuint/-/cuint-0.2.2.tgz",
+      "integrity": "sha512-d4ZVpCW31eWwCMe1YT3ur7mUDnTXbgwyzaL320DrcRT45rfjYxkt5QWLrmOJ+/UEAI2+fQgKe/fCjR8l4TpRgw=="
+    },
    "cypress": {
      "version": "12.9.0",
      "resolved": "https://registry.npmjs.org/cypress/-/cypress-12.9.0.tgz",
@ -55765,6 +55966,11 @@
      "integrity": "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==",
      "dev": true
    },
+    "frac": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/frac/-/frac-1.1.2.tgz",
+      "integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA=="
+    },
    "fraction.js": {
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.2.0.tgz",
@ -61973,7 +62179,6 @@
      "version": "3.1.0",
      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
      "integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==",
-      "dev": true,
      "requires": {
        "semver": "^6.0.0"
      }
@ -64714,6 +64919,24 @@
        "postcss-selector-parser": "^6.0.5"
      }
    },
+    "postcss-url": {
+      "version": "10.1.3",
+      "resolved": "https://registry.npmjs.org/postcss-url/-/postcss-url-10.1.3.tgz",
+      "integrity": "sha512-FUzyxfI5l2tKmXdYc6VTu3TWZsInayEKPbiyW+P6vmmIrrb4I6CGX0BFoewgYHLK+oIL5FECEK02REYRpBvUCw==",
+      "requires": {
+        "make-dir": "~3.1.0",
+        "mime": "~2.5.2",
+        "minimatch": "~3.0.4",
+        "xxhashjs": "~0.2.2"
+      },
+      "dependencies": {
+        "mime": {
+          "version": "2.5.2",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-2.5.2.tgz",
+          "integrity": "sha512-tqkh47FzKeCPD2PUiPB6pkbMzsCasjxAfC62/Wap5qrUWcb+sFasXUC5I3gYM5iBM8v/Qpn4UK0x+j0iHyFPDg=="
+        }
+      }
+    },
    "postcss-value-parser": {
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
@ -66346,8 +66569,7 @@
    "semver": {
      "version": "6.3.0",
      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-      "dev": true
+      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw=="
    },
    "send": {
      "version": "0.18.0",
@ -66857,6 +67079,14 @@
      "integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==",
      "dev": true
    },
+    "ssf": {
+      "version": "0.11.2",
+      "resolved": "https://registry.npmjs.org/ssf/-/ssf-0.11.2.tgz",
+      "integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==",
+      "requires": {
+        "frac": "~1.1.2"
+      }
+    },
    "sshpk": {
      "version": "1.17.0",
      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.17.0.tgz",
@ -69873,6 +70103,16 @@
      "integrity": "sha512-JcKqAHLPxcdb9KM49dufGXn2x3ssnfjbcaQdLlfZsL9rH9wgDQjUtDxbo8NE0F6SFvydeu1VhZe7hZuHsB2/pw==",
      "dev": true
    },
+    "wmf": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wmf/-/wmf-1.0.2.tgz",
+      "integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw=="
+    },
+    "word": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/word/-/word-0.3.0.tgz",
+      "integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA=="
+    },
    "word-wrap": {
      "version": "1.2.3",
      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
@ -69946,6 +70186,20 @@
      "devOptional": true,
      "requires": {}
    },
+    "xlsx": {
+      "version": "0.18.5",
+      "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.18.5.tgz",
+      "integrity": "sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ==",
+      "requires": {
+        "adler-32": "~1.3.0",
+        "cfb": "~1.2.1",
+        "codepage": "~1.15.0",
+        "crc-32": "~1.2.1",
+        "ssf": "~0.11.2",
+        "wmf": "~1.0.1",
+        "word": "~0.3.0"
+      }
+    },
    "xml-name-validator": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-4.0.0.tgz",
@ -69968,6 +70222,14 @@
      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
      "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ=="
    },
+    "xxhashjs": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/xxhashjs/-/xxhashjs-0.2.2.tgz",
+      "integrity": "sha512-AkTuIuVTET12tpsVIQo+ZU6f/qDmKuRUcjaqR+OIvm+aCBsZ95i7UVY5WJ9TMsSaZ0DA2WxoZ4acu0sPH+OKAw==",
+      "requires": {
+        "cuint": "^0.2.2"
+      }
+    },
    "y18n": {
      "version": "5.0.8",
      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
--- a/packages/components/.storybook/preview-head.html
+++ b/packages/components/.storybook/preview-head.html
@ -1,10 +0,0 @@
-<!--
-  This is necessary for Leaflet maps to work.
-->
-
-<link
-  rel="stylesheet"
-  href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
-  integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
-  crossorigin=""
-/>
--- a/packages/components/package.json
+++ b/packages/components/package.json
@ -17,7 +17,7 @@
    "lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
    "storybook": "storybook dev -p 6006",
    "build-storybook": "storybook build",
-    "build-tailwind": "NODE_ENV=production npx tailwindcss --postcss -c tailwind.config.js -i src/index.css -o ./dist/styles.css --minify",
+    "build-tailwind": "NODE_ENV=production npx tailwindcss --postcss -c tailwind.config.js -i src/index.css -o ./dist/style.css --minify",
    "prepare": "npm run build",
    "fix-leaflet": "node ./scripts/fix-leaflet.cjs"
  },
@ -30,12 +30,14 @@
    "@heroicons/react": "^2.0.17",
    "@planet/maps": "^8.1.0",
    "@tanstack/react-table": "^8.8.5",
+    "ag-grid-react": "^30.0.4",
    "chroma-js": "^2.4.2",
    "flexsearch": "0.7.21",
    "leaflet": "^1.9.4",
    "next-mdx-remote": "^4.4.1",
    "ol": "^7.4.0",
    "papaparse": "^5.4.1",
+    "postcss-url": "^10.1.3",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-hook-form": "^7.43.9",
@ -44,7 +46,8 @@
    "react-vega": "^7.6.0",
    "vega": "5.25.0",
    "vega-lite": "5.1.0",
-    "vitest": "^0.31.4"
+    "vitest": "^0.31.4",
+    "xlsx": "^0.18.5"
  },
  "devDependencies": {
    "@storybook/addon-essentials": "^7.0.7",
@ -93,7 +96,7 @@
      "require": "./dist/components.umd.js"
    },
    "./styles.css": {
-      "import": "./dist/styles.css"
+      "import": "./dist/style.css"
    }
  },
  "publishConfig": {
--- a/packages/components/postcss.config.js
+++ b/packages/components/postcss.config.js
@ -1,8 +1,9 @@
-console.log('PostCSS')
+console.log('PostCSS');

 export default {
  plugins: {
    'postcss-import': {},
+    'postcss-url': { url: 'inline' },
    tailwindcss: {},
    autoprefixer: {},
  },
--- a/packages/components/src/components/Excel.tsx
+++ b/packages/components/src/components/Excel.tsx
@ -0,0 +1,99 @@
+import { useEffect, useState } from 'react';
+import LoadingSpinner from './LoadingSpinner';
+import { read, utils } from 'xlsx';
+import { AgGridReact } from 'ag-grid-react';
+import 'ag-grid-community/styles/ag-grid.css';
+import 'ag-grid-community/styles/ag-theme-alpine.css';
+
+export type ExcelProps = {
+  url: string;
+};
+
+export function Excel({ url }: ExcelProps) {
+  const [isLoading, setIsLoading] = useState<boolean>(false);
+  const [activeSheetName, setActiveSheetName] = useState<string>();
+  const [workbook, setWorkbook] = useState<any>();
+  const [rows, setRows] = useState<any>();
+  const [cols, setCols] = useState<any>();
+
+  const loadSpreadsheet = (wb: any, name: string) => {
+    setActiveSheetName(name);
+    const ws = wb.Sheets[name];
+
+    const range = utils.decode_range(ws['!ref'] || 'A1');
+    const columns = Array.from({ length: range.e.c + 1 }, (_, i) => ({
+      field: utils.encode_col(i),
+    }));
+
+    const rowsAr = utils.sheet_to_json(ws, { header: 1 });
+    const rows = rowsAr.map((row) => {
+      const obj = {};
+      columns.forEach((col, i) => {
+        obj[col.field] = row[i];
+      });
+      return obj;
+    });
+
+    setRows(rows);
+    setCols(columns);
+  };
+
+  useEffect(() => {
+    setIsLoading(true);
+
+    fetch(url)
+      .then((res) => res.arrayBuffer())
+      .then((f) => {
+        const wb = read(f);
+        setWorkbook(wb);
+        loadSpreadsheet(wb, wb.SheetNames[0]);
+        setIsLoading(false);
+      });
+  }, [url]);
+
+  return isLoading ? (
+    <div className="w-full flex items-center justify-center w-[600px] h-[300px]">
+      <LoadingSpinner />
+    </div>
+  ) : (
+    <>
+      {cols && rows && (
+        <div>
+          <div
+            className="ag-theme-alpine"
+            style={{ height: 400, width: '100%' }}
+          >
+            <AgGridReact
+              rowData={rows}
+              columnDefs={cols}
+              defaultColDef={{
+                resizable: true,
+                minWidth: 200,
+                flex: 1,
+                sortable: true,
+                filter: true,
+              }}
+            ></AgGridReact>
+          </div>
+          <div className="border-t">
+            {workbook.SheetNames.map((name: string, idx: number) => {
+              return (
+                <>
+                  <button
+                    key={idx}
+                    className={`text-sm px-3 pb-2 pt-4 border-b border-l border-r ${
+                      name == activeSheetName ? 'font-semibold' : ''
+                    }`}
+                    onClick={() => loadSpreadsheet(workbook, name)}
+                  >
+                    {name}
+                  </button>
+                </>
+              );
+            })}
+          </div>
+        </div>
+      )}
+    </>
+  );
+}
--- a/packages/components/src/components/Map.tsx
+++ b/packages/components/src/components/Map.tsx
@ -6,9 +6,10 @@ import {
  MapContainer,
  TileLayer,
  GeoJSON as GeoJSONLayer,
-  LayersControl
+  LayersControl,
 } from 'react-leaflet';

+import 'leaflet/dist/leaflet.css';
 import * as L from 'leaflet';

 export type MapProps = {
@ -131,6 +132,27 @@ export function Map({
              <LayersControl.Overlay key={layer.name} checked name={layer.name}>
                <GeoJSONLayer
                  data={data}
+                  //  @ts-ignore
+                  pointToLayer={(feature, latlng) => {
+                    //  This resolver an issue in which the bundled map was
+                    //  not finding the images
+                    const leafletBase =
+                      'https://unpkg.com/leaflet@1.9.4/dist/images/';
+
+                    const icon = new L.Icon({
+                      iconUrl: leafletBase + 'marker-icon.png',
+                      iconRetinaUrl: leafletBase + 'marker-icon-2x.png',
+                      shadowUrl: leafletBase + 'marker-shadow.png',
+                      iconSize: [25, 41],
+                      iconAnchor: [12, 41],
+                      popupAnchor: [1, -34],
+                      tooltipAnchor: [16, -28],
+                      shadowSize: [41, 41],
+                    });
+
+                    const iconMarker = L.marker(latlng, { icon });
+                    return iconMarker;
+                  }}
                  style={(geoJsonFeature: any) => {
                    //  Set the fill color of each feature when appliable
                    if (
--- a/packages/components/src/index.css
+++ b/packages/components/src/index.css
@ -1,7 +1,9 @@

@import "tailwindcss/base";
@import "tailwindcss/components";
-@import "leaflet";
@import "include";
+@import "leaflet";
+@import 'ag-grid-community/styles/ag-grid.css';
+@import 'ag-grid-community/styles/ag-theme-alpine.css';
@import "tailwindcss/utilities";

--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@ -6,3 +6,4 @@ export * from "./components/VegaLite";
 export * from "./components/FlatUiTable";
 export * from './components/OpenLayers/OpenLayers';
 export * from "./components/Map";
+export * from "./components/Excel";
--- a/packages/components/stories/Excel.stories.ts
+++ b/packages/components/stories/Excel.stories.ts
@ -0,0 +1,34 @@
+import type { Meta, StoryObj } from '@storybook/react';
+
+import { Excel, ExcelProps } from '../src/components/Excel';
+
+// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction
+const meta: Meta = {
+  title: 'Components/Excel',
+  component: Excel,
+  tags: ['autodocs'],
+  argTypes: {
+    url: {
+      description:
+        'Url of the file to be displayed e.g.: "https://url.to/data.csv"',
+    },
+  },
+};
+
+export default meta;
+
+type Story = StoryObj<ExcelProps>;
+
+export const SingleSheet: Story = {
+  name: 'Excel file with just one sheet',
+  args: {
+    url: 'https://sheetjs.com/pres.xlsx',
+  },
+};
+
+export const MultipleSheet: Story = {
+  name: 'Excel file with multiple sheets',
+  args: {
+    url: 'https://storage.portaljs.org/IC-Gantt-Chart-Project-Template-8857.xlsx',
+  },
+};
Author	SHA1	Message	Date
João Demenech	8086e2a2d1	[components,excel][xs]: change data for one of the stories	2023-07-13 11:04:36 -03:00
João Demenech	537d19cb2a	Bump version	2023-07-12 18:20:31 -03:00
João Demenech	ea6f6a219f	[components,map,excel][l]: fix leaflet map markers on prod and implement excel component	2023-07-12 18:16:22 -03:00
João Demenech	af548c56fd	Merge branch 'main' of github.com:datopian/portaljs into feature/excel-component	2023-07-12 16:47:10 -03:00
João Demenech	990939175e	[components,excel][m]: add support for multiple sheets	2023-07-11 17:43:30 -03:00
João Demenech	cbe693825c	[components,excel][m]: initial version of the <Excel /> component	2023-07-10 17:44:11 -03:00