react-data-matrix 0.3.7 → 0.4.0

package/dist/react-data-matrix.umd.js

@@ -0,0 +1,27 @@
+(function(m,g){typeof exports=="object"&&typeof module<"u"?g(require("react")):typeof define=="function"&&define.amd?define(["react"],g):(m=typeof globalThis<"u"?globalThis:m||self,g(m.React))})(this,function(m){"use strict";var g={};/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var X;function Oe(){if(X)return g;X=1;var V=m,j=Symbol.for("react.element"),M=Symbol.for("react.fragment"),T=Object.prototype.hasOwnProperty,F=V.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,A={key:!0,ref:!0,__self:!0,__source:!0};function x(y,l,O){var v,h={},_=null,I=null;O!==void 0&&(_=""+O),l.key!==void 0&&(_=""+l.key),l.ref!==void 0&&(I=l.ref);for(v in l)T.call(l,v)&&!A.hasOwnProperty(v)&&(h[v]=l[v]);if(y&&y.defaultProps)for(v in l=y.defaultProps,l)h[v]===void 0&&(h[v]=l[v]);return{$$typeof:j,type:y,key:_,ref:I,props:h,_owner:F.current}}return g.Fragment=M,g.jsx=x,g.jsxs=x,g}var w={};/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var Z;function Ce(){return Z||(Z=1,process.env.NODE_ENV!=="production"&&function(){var V=m,j=Symbol.for("react.element"),M=Symbol.for("react.portal"),T=Symbol.for("react.fragment"),F=Symbol.for("react.strict_mode"),A=Symbol.for("react.profiler"),x=Symbol.for("react.provider"),y=Symbol.for("react.context"),l=Symbol.for("react.forward_ref"),O=Symbol.for("react.suspense"),v=Symbol.for("react.suspense_list"),h=Symbol.for("react.memo"),_=Symbol.for("react.lazy"),I=Symbol.for("react.offscreen"),Q=Symbol.iterator,Pe="@@iterator";function Se(e){if(e===null||typeof e!="object")return null;var r=Q&&e[Q]||e[Pe];return typeof r=="function"?r:null}var C=V.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function c(e){{for(var r=arguments.length,t=new Array(r>1?r-1:0),n=1;n<r;n++)t[n-1]=arguments[n];we("error",e,t)}}function we(e,r,t){{var n=C.ReactDebugCurrentFrame,o=n.getStackAddendum();o!==""&&(r+="%s",t=t.concat([o]));var u=t.map(function(i){return String(i)});u.unshift("Warning: "+r),Function.prototype.apply.call(console[e],console,u)}}var je=!1,xe=!1,ke=!1,De=!1,Fe=!1,ee;ee=Symbol.for("react.module.reference");function Ae(e){return!!(typeof e=="string"||typeof e=="function"||e===T||e===A||Fe||e===F||e===O||e===v||De||e===I||je||xe||ke||typeof e=="object"&&e!==null&&(e.$$typeof===_||e.$$typeof===h||e.$$typeof===x||e.$$typeof===y||e.$$typeof===l||e.$$typeof===ee||e.getModuleId!==void 0))}function Ie(e,r,t){var n=e.displayName;if(n)return n;var o=r.displayName||r.name||"";return o!==""?t+"("+o+")":t}function re(e){return e.displayName||"Context"}function b(e){if(e==null)return null;if(typeof e.tag=="number"&&c("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof e=="function")return e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case T:return"Fragment";case M:return"Portal";case A:return"Profiler";case F:return"StrictMode";case O:return"Suspense";case v:return"SuspenseList"}if(typeof e=="object")switch(e.$$typeof){case y:var r=e;return re(r)+".Consumer";case x:var t=e;return re(t._context)+".Provider";case l:return Ie(e,e.render,"ForwardRef");case h:var n=e.displayName||null;return n!==null?n:b(e.type)||"Memo";case _:{var o=e,u=o._payload,i=o._init;try{return b(i(u))}catch{return null}}}return null}var R=Object.assign,k=0,te,ne,ae,ie,oe,ue,fe;function se(){}se.__reactDisabledLog=!0;function We(){{if(k===0){te=console.log,ne=console.info,ae=console.warn,ie=console.error,oe=console.group,ue=console.groupCollapsed,fe=console.groupEnd;var e={configurable:!0,enumerable:!0,value:se,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}k++}}function Ye(){{if(k--,k===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:R({},e,{value:te}),info:R({},e,{value:ne}),warn:R({},e,{value:ae}),error:R({},e,{value:ie}),group:R({},e,{value:oe}),groupCollapsed:R({},e,{value:ue}),groupEnd:R({},e,{value:fe})})}k<0&&c("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var U=C.ReactCurrentDispatcher,B;function W(e,r,t){{if(B===void 0)try{throw Error()}catch(o){var n=o.stack.trim().match(/\n( *(at )?)/);B=n&&n[1]||""}return`
+`+B+e}}var q=!1,Y;{var $e=typeof WeakMap=="function"?WeakMap:Map;Y=new $e}function le(e,r){if(!e||q)return"";{var t=Y.get(e);if(t!==void 0)return t}var n;q=!0;var o=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var u;u=U.current,U.current=null,We();try{if(r){var i=function(){throw Error()};if(Object.defineProperty(i.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(i,[])}catch(E){n=E}Reflect.construct(e,[],i)}else{try{i.call()}catch(E){n=E}e.call(i.prototype)}}else{try{throw Error()}catch(E){n=E}e()}}catch(E){if(E&&n&&typeof E.stack=="string"){for(var a=E.stack.split(`
+`),d=n.stack.split(`
+`),f=a.length-1,s=d.length-1;f>=1&&s>=0&&a[f]!==d[s];)s--;for(;f>=1&&s>=0;f--,s--)if(a[f]!==d[s]){if(f!==1||s!==1)do if(f--,s--,s<0||a[f]!==d[s]){var p=`
+`+a[f].replace(" at new "," at ");return e.displayName&&p.includes("<anonymous>")&&(p=p.replace("<anonymous>",e.displayName)),typeof e=="function"&&Y.set(e,p),p}while(f>=1&&s>=0);break}}}finally{q=!1,U.current=u,Ye(),Error.prepareStackTrace=o}var S=e?e.displayName||e.name:"",Te=S?W(S):"";return typeof e=="function"&&Y.set(e,Te),Te}function Le(e,r,t){return le(e,!1)}function Ne(e){var r=e.prototype;return!!(r&&r.isReactComponent)}function $(e,r,t){if(e==null)return"";if(typeof e=="function")return le(e,Ne(e));if(typeof e=="string")return W(e);switch(e){case O:return W("Suspense");case v:return W("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case l:return Le(e.render);case h:return $(e.type,r,t);case _:{var n=e,o=n._payload,u=n._init;try{return $(u(o),r,t)}catch{}}}return""}var L=Object.prototype.hasOwnProperty,ce={},de=C.ReactDebugCurrentFrame;function N(e){if(e){var r=e._owner,t=$(e.type,e._source,r?r.type:null);de.setExtraStackFrame(t)}else de.setExtraStackFrame(null)}function Ve(e,r,t,n,o){{var u=Function.call.bind(L);for(var i in e)if(u(e,i)){var a=void 0;try{if(typeof e[i]!="function"){var d=Error((n||"React class")+": "+t+" type `"+i+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[i]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw d.name="Invariant Violation",d}a=e[i](r,i,n,t,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(f){a=f}a&&!(a instanceof Error)&&(N(o),c("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",n||"React class",t,i,typeof a),N(null)),a instanceof Error&&!(a.message in ce)&&(ce[a.message]=!0,N(o),c("Failed %s type: %s",t,a.message),N(null))}}}var Me=Array.isArray;function J(e){return Me(e)}function Ue(e){{var r=typeof Symbol=="function"&&Symbol.toStringTag,t=r&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t}}function Be(e){try{return ve(e),!1}catch{return!0}}function ve(e){return""+e}function pe(e){if(Be(e))return c("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",Ue(e)),ve(e)}var D=C.ReactCurrentOwner,qe={key:!0,ref:!0,__self:!0,__source:!0},ge,he,G;G={};function Je(e){if(L.call(e,"ref")){var r=Object.getOwnPropertyDescriptor(e,"ref").get;if(r&&r.isReactWarning)return!1}return e.ref!==void 0}function Ge(e){if(L.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function ze(e,r){if(typeof e.ref=="string"&&D.current&&r&&D.current.stateNode!==r){var t=b(D.current.type);G[t]||(c('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref',b(D.current.type),e.ref),G[t]=!0)}}function Ke(e,r){{var t=function(){ge||(ge=!0,c("%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://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}}function He(e,r){{var t=function(){he||(he=!0,c("%s: `ref` 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://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"ref",{get:t,configurable:!0})}}var Xe=function(e,r,t,n,o,u,i){var a={$$typeof:j,type:e,key:r,ref:t,props:i,_owner:u};return a._store={},Object.defineProperty(a._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(a,"_self",{configurable:!1,enumerable:!1,writable:!1,value:n}),Object.defineProperty(a,"_source",{configurable:!1,enumerable:!1,writable:!1,value:o}),Object.freeze&&(Object.freeze(a.props),Object.freeze(a)),a};function Ze(e,r,t,n,o){{var u,i={},a=null,d=null;t!==void 0&&(pe(t),a=""+t),Ge(r)&&(pe(r.key),a=""+r.key),Je(r)&&(d=r.ref,ze(r,o));for(u in r)L.call(r,u)&&!qe.hasOwnProperty(u)&&(i[u]=r[u]);if(e&&e.defaultProps){var f=e.defaultProps;for(u in f)i[u]===void 0&&(i[u]=f[u])}if(a||d){var s=typeof e=="function"?e.displayName||e.name||"Unknown":e;a&&Ke(i,s),d&&He(i,s)}return Xe(e,a,d,o,n,D.current,i)}}var z=C.ReactCurrentOwner,be=C.ReactDebugCurrentFrame;function P(e){if(e){var r=e._owner,t=$(e.type,e._source,r?r.type:null);be.setExtraStackFrame(t)}else be.setExtraStackFrame(null)}var K;K=!1;function H(e){return typeof e=="object"&&e!==null&&e.$$typeof===j}function Ee(){{if(z.current){var e=b(z.current.type);if(e)return`
+
+Check the render method of \``+e+"`."}return""}}function Qe(e){{if(e!==void 0){var r=e.fileName.replace(/^.*[\\\/]/,""),t=e.lineNumber;return`
+
+Check your code at `+r+":"+t+"."}return""}}var ye={};function er(e){{var r=Ee();if(!r){var t=typeof e=="string"?e:e.displayName||e.name;t&&(r=`
+
+Check the top-level render call using <`+t+">.")}return r}}function _e(e,r){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var t=er(r);if(ye[t])return;ye[t]=!0;var n="";e&&e._owner&&e._owner!==z.current&&(n=" It was passed a child from "+b(e._owner.type)+"."),P(e),c('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',t,n),P(null)}}function Re(e,r){{if(typeof e!="object")return;if(J(e))for(var t=0;t<e.length;t++){var n=e[t];H(n)&&_e(n,r)}else if(H(e))e._store&&(e._store.validated=!0);else if(e){var o=Se(e);if(typeof o=="function"&&o!==e.entries)for(var u=o.call(e),i;!(i=u.next()).done;)H(i.value)&&_e(i.value,r)}}}function rr(e){{var r=e.type;if(r==null||typeof r=="string")return;var t;if(typeof r=="function")t=r.propTypes;else if(typeof r=="object"&&(r.$$typeof===l||r.$$typeof===h))t=r.propTypes;else return;if(t){var n=b(r);Ve(t,e.props,"prop",n,e)}else if(r.PropTypes!==void 0&&!K){K=!0;var o=b(r);c("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",o||"Unknown")}typeof r.getDefaultProps=="function"&&!r.getDefaultProps.isReactClassApproved&&c("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function tr(e){{for(var r=Object.keys(e.props),t=0;t<r.length;t++){var n=r[t];if(n!=="children"&&n!=="key"){P(e),c("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",n),P(null);break}}e.ref!==null&&(P(e),c("Invalid attribute `ref` supplied to `React.Fragment`."),P(null))}}function me(e,r,t,n,o,u){{var i=Ae(e);if(!i){var a="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(a+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var d=Qe(o);d?a+=d:a+=Ee();var f;e===null?f="null":J(e)?f="array":e!==void 0&&e.$$typeof===j?(f="<"+(b(e.type)||"Unknown")+" />",a=" Did you accidentally export a JSX literal instead of a component?"):f=typeof e,c("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",f,a)}var s=Ze(e,r,t,o,u);if(s==null)return s;if(i){var p=r.children;if(p!==void 0)if(n)if(J(p)){for(var S=0;S<p.length;S++)Re(p[S],e);Object.freeze&&Object.freeze(p)}else c("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 Re(p,e)}return e===T?tr(s):rr(s),s}}function nr(e,r,t){return me(e,r,t,!0)}function ar(e,r,t){return me(e,r,t,!1)}var ir=ar,or=nr;w.Fragment=T,w.jsx=ir,w.jsxs=or}()),w}process.env.NODE_ENV==="production"?Oe():Ce()});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-data-matrix",
-  "version": "0.3.7",
+  "version": "0.4.0",
   "private": false,
   "license": "MIT",
   "homepage": "https://bronz3beard.github.io/react-matrix",
@@ -17,35 +17,41 @@
     "data matrix"
   ],
   "engines": {
-    "npm": ">=8.12.0",
-    "node": ">=18.4.0"
+    "npm": ">=8.19.2",
+    "node": ">=18.12.0"
+  },
+  "main": "./dist/react-data-matrix.umd.js",
+  "module": "./dist/react-data-matrix.es.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/react-data-matrix.es.js",
+      "require": "./dist/react-data-matrix.umd.js"
+    }
   },
-  "main": "dist/index.js",
-  "module": "dist/index.js",
   "files": [
-    "dist",
+    "dist/lib",
+    "dist/manifest.json",
+    "dist/react-data-matrix.es.js",
+    "dist/react-data-matrix.umd.js",
     "README.md"
   ],
   "repository": {
     "type": "git",
     "url": "git+https://github.com/bronz3beard/react-matrix.git"
   },
+  "bugs": {
+    "url": "https://github.com/bronz3beard/react-matrix/issues"
+  },
   "description": "View structured data in a matrix table (data grid), showing a value located at an X and Y coordinate.",
   "scripts": {
-    "start": "react-scripts start",
-    "build": "rm -rf dist && NODE_ENV=production tsc",
-    "babel": "babel src/lib --out-dir dist --copy-files",
-    "build:og": "react-scripts build",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject",
-    "predeploy": "npm run build:og",
-    "deploy": "gh-pages -d build"
-  },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "build:watch": "tsc && vite build --watch",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "preview": "vite preview",
+    "mock:publish": "npm pack --dry-run",
+    "deploy": "vite build && gh-pages -d dist"
   },
   "browserslist": {
     "production": [
@@ -60,27 +66,25 @@
     ]
   },
   "devDependencies": {
-    "@babel/cli": "^7.15.7",
-    "@babel/core": "^7.15.8",
-    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
-    "@babel/preset-env": "^7.15.8",
     "@fortawesome/fontawesome-svg-core": "latest",
     "@fortawesome/free-brands-svg-icons": "latest",
     "@fortawesome/react-fontawesome": "latest",
-    "@testing-library/jest-dom": "latest",
-    "@testing-library/react": "latest",
-    "@testing-library/user-event": "latest",
+    "@types/node": "^20.4.4",
     "@types/react": "^18.2.15",
     "@types/react-dom": "^18.2.7",
+    "@typescript-eslint/eslint-plugin": "^6.0.0",
+    "@typescript-eslint/parser": "^6.0.0",
+    "@vitejs/plugin-react": "^4.0.3",
+    "eslint": "^8.45.0",
+    "eslint-plugin-react": "^7.33.0",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-refresh": "^0.4.3",
     "gh-pages": "latest",
-    "react": "latest",
-    "react-dom": "latest",
-    "react-scripts": "^5.0.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "sass": "latest",
-    "typescript": "latest",
-    "web-vitals": "latest"
-  },
-  "dependencies": {
-    "react-data-matrix": "^0.3.6"
+    "typescript": "^5.0.2",
+    "vite": "^4.4.5",
+    "vite-plugin-dts": "^3.3.1"
   }
 }

package/README.md

@@ -1,350 +0,0 @@
-# React Matrix   [![npm version](https://badge.fury.io/js/react-data-matrix.svg)](https://badge.fury.io/js/react-data-matrix)
-
-[React Matrix Demo](https://bronz3beard.github.io/react-matrix)
-
-React Matrix table shows relationships between two or more variables in a data set in grid format.
-
-The most common usage for a table like React Matrix, is to display the **likelihood** and **consequence** "scores" of **risks/hazards**, this can be for anything from Corporate, Work Health Safety and Environment risks, and more.
-
-# PR's
-
-- Have a look at the [PR template doc](https://github.com/bronz3beard/react-matrix/blob/main/docs) for best approach to getting your pr merged.
-
-# Usage
-
-```ts
-import { ReactMatrix } from "react-data-matrix";
-
-const App: FC = () => {
-  ...
-
-  return (
-    <ReactMatrix
-      {...{
-        matrixName: "",
-        matrixDescription: "",
-        hasTableBorder: true,
-        rowPrimaryUpper: true,
-        hasInlineStyles: true,
-        matrixSizeSelected: 5,
-        headerPrimaryUpper: true,
-        hasContainerStyles: true,
-        reverseMatrixValues: true,
-
-        tableContainerStyles: {},
-        tableStyles: {},
-
-        thRowStyles: {},
-        thTitleStyles: {},
-        thSubTitleStyles: {},
-        thPrimaryTitleStyles: {},
-
-        trRowStyles: {},
-        trTitleStyles: {},
-        trSubTitleStyles: {},
-        trPrimaryTitleStyles: {},
-
-        tdStyles: {},
-
-        customHeaderRowIdValue: "",
-        customRowDynamicIdValue: "",
-        customTableDataDynamicIdValue: "",
-        customRowHeaderDynamicIdValue: "",
-        customDynamicHeaderTitleIdValue: "",
-        customDynamicSubHeaderTitleIdValue: "",
-        data,
-      }}
-    />
-  )
-}
-```
-
-# Expected Data Structure
-
-- See [`./src/lib/utils/data.ts`](https://github.com/bronz3beard/react-matrix/blob/main/src/lib/utils/data.ts) for an example of the data, this can be used for testing if needed,
-  or an example of how to construct/deconstruct your data objects from your api.
-
-```ts
-  const data = {
-    id: 1,
-    matrix_size: 5,
-    matrix_name: "React Matrix",
-    matrix_description: "Risk Matrix Template",
-    matrix_details: [
-      {
-        id: 1,
-        likelihood: "LIKELIHOOD VALUE",
-        consequence: CONSEQUENCE VALUE,
-        header_title: "Title",
-        header_sub_title: "Sub-title/description.",
-        row_header_title: "Row Title",
-        row_header_sub_title: "Row Sub-title/description.",
-      }, {
-        id: 2,
-        ...
-      } {
-        id: 3,
-        ...
-      } {
-        id: 4,
-        ...
-      } {
-        id: 5,
-        ...
-      }
-    ],
-    matrix_values: [
-      {
-        id: 1,
-        position: 1,
-        matrix_id: 1,
-        score_value: 1,
-        colour: "green",
-        description: "low",
-        consequence_descriptor: 1,
-        likelihood_descriptor: "E",
-        response: "Business as usual",
-      }, {
-        id: 2,
-        ...
-      },
-      ...,
-      ...,
-      , {
-        id: 25,
-        ...
-      },
-    ]
-  }
-```
-
-# Types
-
-```ts
-export interface MatrixDetail {
-  id: number;
-  position: number;
-  matrix_type: string;
-  likelihood: string;
-  consequence: number;
-  header_title: string;
-  header_sub_title: string;
-  row_header_title: string;
-  row_header_sub_title: string;
-}
-
-export interface MatrixValue {
-  id: number;
-  matrix_id: number;
-  description: string;
-  score_value: number;
-  colour: string;
-  position: number;
-  likelihood_descriptor: string;
-  consequence_descriptor: number;
-  response: string;
-}
-
-export interface MatrixData {
-  id: number;
-  matrix_size: number;
-  matrix_name: string;
-  primary_header_title: string;
-  primary_row_header_title: string;
-  matrix_description: string;
-  matrix_details: MatrixDetail[];
-  matrix_values: MatrixValue[];
-}
-
-export interface ReactMatrixProps {
-  data: MatrixData;
-  hasTableBorder?: boolean;
-  hasInlineStyles?: boolean;
-  hasContainerStyles?: boolean;
-  reverseMatrixValues?: boolean;
-  matrixSizeSelected?: number;
-  rowPrimaryUpper?: boolean;
-  headerPrimaryUpper?: boolean;
-  tableContainerStyles?: React.CSSProperties;
-  tableStyles?: React.CSSProperties;
-  thRowStyles?: React.CSSProperties;
-  thTitleStyles?: React.CSSProperties;
-  thSubTitleStyles?: React.CSSProperties;
-  thPrimaryTitleStyles?: React.CSSProperties;
-  trRowStyles?: React.CSSProperties;
-  trTitleStyles?: React.CSSProperties;
-  trSubTitleStyles?: React.CSSProperties;
-  trPrimaryTitleStyles?: React.CSSProperties;
-  tdStyles?: React.CSSProperties;
-  customHeaderRowIdValue?: string;
-  customDynamicHeaderTitleIdValue?: string;
-  customDynamicSubHeaderTitleIdValue?: string;
-  customRowDynamicIdValue?: string;
-  customRowHeaderDynamicIdValue?: string;
-  customTableDataDynamicIdValue?: string;
-}
-
-export interface TableDataProps {
-  data: {
-    id: number;
-    colour: string;
-    position: number;
-    matrix_id: number;
-    score_value: number;
-    description: string;
-    response: string;
-    likelihood_descriptor: string;
-    consequence_descriptor: number;
-  };
-  tdStyles?: React.CSSProperties;
-  hasInlineStyles?: boolean;
-  customTableDataDynamicIdValue?: string;
-}
-```
-
-```ts
-defaultProps = {
-  matrixName: "",
-  matrixDescription: "",
-  hasTableBorder: true,
-  rowPrimaryUpper: true,
-  hasInlineStyles: true,
-  matrixSizeSelected: 5,
-  headerPrimaryUpper: true,
-  hasContainerStyles: true,
-  reverseMatrixValues: true,
-
-  tableContainerStyles: {},
-  tableStyles: {},
-
-  thRowStyles: {},
-  thTitleStyles: {},
-  thSubTitleStyles: {},
-  thPrimaryTitleStyles: {},
-
-  trRowStyles: {},
-  trTitleStyles: {},
-  trSubTitleStyles: {},
-  trPrimaryTitleStyles: {},
-
-  tdStyles: {},
-
-  customHeaderRowIdValue: "",
-  customRowDynamicIdValue: "",
-  customTableDataDynamicIdValue: "",
-  customRowHeaderDynamicIdValue: "",
-  customDynamicHeaderTitleIdValue: "",
-  customDynamicSubHeaderTitleIdValue: "",
-};
-```
-
-# Available Properties
-
-- **hasInlineStyles**
-  - Default is true.
-  - If false all inline styles are removed.
-
----
-
-- **hasTableBorder**
-  - Default is true.
-  - If false the most outer border is removed.
-
----
-
-- **hasContainerStyles**
-  - Default is true.
-  - This will center the matrix in the middle of the page.
-
----
-
-- **reverseMatrixValues**
-  - Default is true.
-  - When true the lowest value will be in the bottom left and the highest value will be in the top right, with all sequential values in-between.
-  - When false the values will be reversed, lowest value top left highest value bottom right.
-
----
-
-- **rowPrimaryUpper**
-  - Default is true.
-  - If false string formatting will be removed.
-
----
-
-- **headerPrimaryUpper**
-  - Default is true.
-  - If false string formatting will be removed.
-
----
-
-- **customHeaderRowIdValue**
-  - Default is empty string.
-  - can be used to target element through id prop.
-
----
-
-- **customDynamicHeaderTitleIdValue**
-  - Default is empty string.
-  - can be used to target element through id prop.
-
----
-
-- **customDynamicSubHeaderTitleIdValue**
-  - Default is empty string.
-  - can be used to target element through id prop.
-
----
-
-- **customRowDynamicIdValue**
-  - Default is empty string.
-  - can be used to target element through id prop.
-
----
-
-- **customRowHeaderDynamicIdValue**
-  - Default is empty string.
-  - can be used to target element through id prop.
-
----
-
-- **customTableDataDynamicIdValue**
-  - Default is empty string.
-  - can be used to target element through id prop.
-
----
-
-# Styling Properties
-
-### Inline
-
-**These styles can be added to the current styles or,
-if you make `hasInlineStyles = false`, then add these values with your own styles, you can have full control over styling inline.**
-
-**ReactMatrix**
-
-- tableContainerStyles={{}}
-- tableStyles={{}}
-
-**MatrixHeaders**
-
-- thRowStyles={{}}
-- thTitleStyles={{}}
-- thSubTitleStyles={{}}
-- thPrimaryTitleStyles={{}}
-
-**MatrixRows**
-
-- trRowStyles={{}},
-- trTitleStyles={{}},
-- trSubTitleStyles={{}},
-- trPrimaryTitleStyles={{}},
-
-**TableData**
-
-- tdStyles={{}},
-
----
-
-# Create React App
-
-- This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).

package/dist/components/MatrixHeaders.jsx

@@ -1,38 +0,0 @@
-import React from "react";
-import { getHeaderRowStyles, getHeaderTitleStyles, getHeaderSubTitleStyles, getHeaderPrimaryTitleStyles, } from "../helpers/getStyles";
-import { capitaliseString } from "../utils/functions";
-// import "./styles/riskMatrix.scss";
-const MatrixHeaders = ({ data, hasInlineStyles = true, headerPrimaryUpper = true, thRowStyles = {}, thTitleStyles = {}, thSubTitleStyles = {}, thPrimaryTitleStyles = {}, customHeaderRowIdValue = "", customDynamicHeaderTitleIdValue = "", customDynamicSubHeaderTitleIdValue = "", }) => {
-    const headerRowStyles = getHeaderRowStyles(hasInlineStyles, thRowStyles);
-    const headerTitleStyles = getHeaderTitleStyles(hasInlineStyles, thTitleStyles);
-    const headerSubTitleStyles = getHeaderSubTitleStyles(hasInlineStyles, thSubTitleStyles);
-    const headerPrimaryTitleStyles = getHeaderPrimaryTitleStyles(hasInlineStyles, thPrimaryTitleStyles);
-    const headerPrimaryTitle = !headerPrimaryUpper
-        ? capitaliseString(data === null || data === void 0 ? void 0 : data.primary_header_title)
-        : data === null || data === void 0 ? void 0 : data.primary_header_title;
-    return (<thead>
-      <tr id="react-matrix-blank-headers-primary-title-row">
-        <th headers="blank" colSpan={4}></th>
-        <th style={headerPrimaryTitleStyles} id="react-matrix-header-primary-title">
-          {headerPrimaryTitle}
-        </th>
-        <th headers="blank" colSpan={2}></th>
-      </tr>
-      <tr style={headerRowStyles} id={`react-matrix-dynamic-headers-row-${customHeaderRowIdValue}`}>
-        <th headers="blank" colSpan={2}></th>
-        {data.matrix_details.slice(0, data.matrix_size).map((column, index) => {
-            return (<th scope="col" style={headerTitleStyles} id={`react-matrix-dynamic-column-header-title${!customDynamicHeaderTitleIdValue
-                    ? ""
-                    : `-${customDynamicHeaderTitleIdValue}`}`} key={`${column.id}-${index}`}>
-              {column.header_title}
-              <div style={headerSubTitleStyles} id={`react-matrix-dynamic-column-header-sub-title${!customDynamicSubHeaderTitleIdValue
-                    ? ""
-                    : `-${customDynamicSubHeaderTitleIdValue}`}`}>
-                {column.header_sub_title}
-              </div>
-            </th>);
-        })}
-      </tr>
-    </thead>);
-};
-export default MatrixHeaders;

package/dist/components/MatrixRows.jsx

@@ -1,48 +0,0 @@
-import React from "react";
-import { getHeaderRowStyles, getHeaderTitleStyles, getHeaderSubTitleStyles, getHeaderPrimaryTitleStyles, } from "../helpers/getStyles";
-import { groupObjectsByProp, capitaliseString } from "../utils/functions";
-import TableData from "./TableData";
-const MatrixRows = ({ data, rowPrimaryUpper = true, hasInlineStyles = true, reverseMatrixValues = true, trRowStyles = {}, trTitleStyles = {}, trSubTitleStyles = {}, trPrimaryTitleStyles = {}, tdStyles = {}, customRowDynamicIdValue = "", customRowHeaderDynamicIdValue = "", customTableDataDynamicIdValue = "", }) => {
-    const valuesArray = reverseMatrixValues
-        ? groupObjectsByProp(data.matrix_values, "likelihood_descriptor")
-            .reverse()
-            .slice(0, data.matrix_size)
-        : groupObjectsByProp(data.matrix_values, "likelihood_descriptor").slice(0, data.matrix_size);
-    const tableRowStyles = getHeaderRowStyles(hasInlineStyles, trRowStyles);
-    const tableRowHeaderTitleStyles = getHeaderTitleStyles(hasInlineStyles, trTitleStyles);
-    const tableRowHeaderSubTitleStyles = getHeaderSubTitleStyles(hasInlineStyles, trSubTitleStyles);
-    const rowHeaderPrimaryTitleStyles = getHeaderPrimaryTitleStyles(hasInlineStyles, trPrimaryTitleStyles);
-    const rowPrimaryTitle = rowPrimaryUpper
-        ? capitaliseString(data.primary_row_header_title)
-        : data.primary_row_header_title;
-    return (<tbody>
-      <tr id="react-matrix-row-primary-title">
-        <th scope="row" rowSpan={6} style={rowHeaderPrimaryTitleStyles}>
-          {rowPrimaryTitle}
-        </th>
-      </tr>
-      {valuesArray.map((row, index) => {
-            var _a, _b, _c, _d, _e, _f;
-            const rowHeaderOrder = reverseMatrixValues
-                ? data.matrix_size - (index + 1)
-                : index;
-            return (<tr style={tableRowStyles} key={`row-${index}`} id={`react-matrix-dynamic-rows-${(_a = data.matrix_details[rowHeaderOrder]) === null || _a === void 0 ? void 0 : _a.row_header_title}-${(_b = data.matrix_details[rowHeaderOrder]) === null || _b === void 0 ? void 0 : _b.row_header_sub_title}${!customRowDynamicIdValue ? "" : `-${customRowDynamicIdValue}`}`}>
-            <th scope="row" style={tableRowHeaderTitleStyles} id={`react-matrix-dynamic-rows-${(_c = data.matrix_details[rowHeaderOrder]) === null || _c === void 0 ? void 0 : _c.row_header_title}-${(_d = data.matrix_details[rowHeaderOrder]) === null || _d === void 0 ? void 0 : _d.row_header_sub_title}${!customRowHeaderDynamicIdValue
-                    ? ""
-                    : `-${customRowHeaderDynamicIdValue}`}`}>
-              {(_e = data.matrix_details[rowHeaderOrder]) === null || _e === void 0 ? void 0 : _e.row_header_title}
-              <div style={tableRowHeaderSubTitleStyles}>
-                {(_f = data.matrix_details[rowHeaderOrder]) === null || _f === void 0 ? void 0 : _f.row_header_sub_title}
-              </div>
-            </th>
-            {row
-                    .slice(0, data.matrix_size)
-                    .map((item, index) => {
-                    return (<TableData data={item} tdStyles={tdStyles} key={`${item.id}-${index}`} hasInlineStyles={hasInlineStyles} customTableDataDynamicIdValue={customTableDataDynamicIdValue}/>);
-                })}
-          </tr>);
-        })}
-    </tbody>);
-};
-MatrixRows.defaultProps = {};
-export default MatrixRows;

package/dist/components/ReactMatrix.d.ts

@@ -1,4 +0,0 @@
-import { FC } from "react";
-import { ReactMatrixProps } from "../types";
-declare const ReactMatrix: FC<ReactMatrixProps>;
-export default ReactMatrix;

package/dist/components/ReactMatrix.jsx

@@ -1,42 +0,0 @@
-import React from "react";
-import { getTableStyles, getTableBoarder, getContainerStyles, } from "../helpers/getStyles";
-import MatrixHeaders from "./MatrixHeaders";
-import MatrixRows from "./MatrixRows";
-const ReactMatrix = ({ data, matrixName, tableStyles: contextTableStyles, hasTableBorder: contextHasTableBorder, hasInlineStyles: contextHasInlineStyles, matrixDescription, hasContainerStyles: contextHasContainerStyles, tableContainerStyles: contextTableContainerStyles, tableStyles = {}, }) => {
-    const tableBorder = getTableBoarder(!!(contextHasInlineStyles && contextHasTableBorder));
-    const tableElmStyles = getTableStyles(!!(contextHasInlineStyles && contextTableStyles), tableStyles);
-    const containerStyles = getContainerStyles(!!(contextHasInlineStyles && contextHasContainerStyles), contextTableContainerStyles !== null && contextTableContainerStyles !== void 0 ? contextTableContainerStyles : {});
-    return (<div style={containerStyles}>
-      <h1>{matrixName}</h1>
-      <h4>{matrixDescription}</h4>
-      <table id="matrix-table" style={Object.assign(Object.assign({}, tableElmStyles), tableBorder)}>
-        <MatrixHeaders {...{
-        data,
-        hasInlineStyles: true,
-        headerPrimaryUpper: true,
-        thRowStyles: {},
-        thTitleStyles: {},
-        thSubTitleStyles: {},
-        thPrimaryTitleStyles: {},
-        customHeaderRowIdValue: "",
-        customDynamicHeaderTitleIdValue: "",
-        customDynamicSubHeaderTitleIdValue: "",
-    }}/>
-        <MatrixRows {...{
-        data,
-        rowPrimaryUpper: true,
-        hasInlineStyles: true,
-        reverseMatrixValues: true,
-        trRowStyles: {},
-        trTitleStyles: {},
-        trSubTitleStyles: {},
-        trPrimaryTitleStyles: {},
-        tdStyles: {},
-        customRowDynamicIdValue: "",
-        customRowHeaderDynamicIdValue: "",
-        customTableDataDynamicIdValue: "",
-    }}/>
-      </table>
-    </div>);
-};
-export default ReactMatrix;

package/dist/components/TableData.jsx

@@ -1,19 +0,0 @@
-import React from "react";
-const TableData = ({ data, tdStyles = {}, hasInlineStyles = true, customTableDataDynamicIdValue = "", }) => {
-    const handleCellClick = (tdSelected) => {
-        alert(`${tdSelected === null || tdSelected === void 0 ? void 0 : tdSelected.description}, ${tdSelected === null || tdSelected === void 0 ? void 0 : tdSelected.score_value} \n${tdSelected === null || tdSelected === void 0 ? void 0 : tdSelected.response}`);
-    };
-    const customTdStyles = !tdStyles ? {} : tdStyles;
-    const tableDataStyles = hasInlineStyles
-        ? Object.assign({ cursor: "pointer", textAlign: "center", borderColor: "black", borderStyle: "solid", borderWidth: `${1}px`, backgroundColor: data === null || data === void 0 ? void 0 : data.colour }, tdStyles) : Object.assign({}, customTdStyles);
-    return (<>
-      <td style={tableDataStyles} onClick={() => handleCellClick(data)} id={`react-matrix-dynamic-table-data${!customTableDataDynamicIdValue
-            ? ""
-            : `-${customTableDataDynamicIdValue}`}`}>
-        {`${data === null || data === void 0 ? void 0 : data.description}`}
-        <br />
-        {`(${data === null || data === void 0 ? void 0 : data.score_value})`}
-      </td>
-    </>);
-};
-export default TableData;