@react-foundry/simple-table 0.1.0

package/LICENSE

@@ -0,0 +1,22 @@
+The MIT License (MIT)
+
+Copyright (C) 2019-2025 Crown Copyright
+Copyright (C) 2019-2026 Daniel A.C. Martin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
+of the Software, and to permit persons to whom the Software is furnished to do
+so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,83 @@
+React Foundry - Simple Table
+============================
+
+A simple table for displaying data.
+
+
+Using this package
+------------------
+
+First install the package into your project:
+
+```shell
+npm install -S @react-foundry/simple-table
+```
+
+Then use it in your code as follows:
+
+```js
+import React, { createElement as h } from 'react';
+import SimpleTable from '@react-foundry/simple-table';
+
+export const MyComponent = props => (
+  <SimpleTable
+    keys={['name', 'qty', 'cost']}
+    headings={{
+      cost: 'Price',
+      qty: 'Quantity',
+      name: 'Name'
+    }}
+    data={[
+      {
+        cost: '£7.99',
+        qty: '4',
+        name: 'Blu-ray disk'
+      },
+      {
+        cost: '£0.85',
+        qty: '10',
+        name: 'Pencil'
+      },
+      {
+        cost: '£21.45',
+        qty: '1',
+        name: 'Text book'
+      },
+    ]}
+  />
+);
+
+export default MyComponent;
+```
+
+
+Working on this package
+-----------------------
+
+Before working on this package you must install its dependencies using
+the following command:
+
+```shell
+pnpm install
+```
+
+
+### Testing
+
+```shell
+npm test
+```
+
+
+### Building
+
+```shell
+npm run build
+```
+
+
+### Clean-up
+
+```shell
+npm run clean
+```

package/dist/SimpleTable.d.ts

@@ -0,0 +1,11 @@
+import { FC, HTMLAttributes, ReactNode } from 'react';
+import { StandardProps } from '@react-foundry/component-helpers';
+import '../assets/SimpleTable.scss';
+export type SimpleTableProps<T> = StandardProps & HTMLAttributes<HTMLTableElement> & {
+    caption?: string | ReactNode;
+    data: T[];
+    headings: T;
+    keys: (keyof T)[];
+};
+export declare const SimpleTable: FC<SimpleTableProps<any>>;
+export default SimpleTable;

package/dist/SimpleTable.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SimpleTable = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const component_helpers_1 = require("@react-foundry/component-helpers");
+require("../assets/SimpleTable.scss");
+const SimpleTable = ({ caption: _caption, classBlock, classModifiers, className, data, headings, keys, ...attrs }) => {
+    const classes = (0, component_helpers_1.classBuilder)('penultimate-simple-table', classBlock, classModifiers, className);
+    const caption = (typeof _caption !== 'string'
+        ? _caption
+        : _caption && ((0, jsx_runtime_1.jsx)("caption", { className: classes('caption'), children: _caption })));
+    return ((0, jsx_runtime_1.jsxs)("table", { ...attrs, className: classes(), children: [caption, (0, jsx_runtime_1.jsx)("thead", { className: classes('head'), children: (0, jsx_runtime_1.jsx)("tr", { className: classes('row'), children: keys.map((k, i) => ((0, jsx_runtime_1.jsx)("th", { scope: "col", className: classes('header'), children: headings[k] }, i))) }) }), (0, jsx_runtime_1.jsx)("tbody", { className: classes('body'), children: data.map((e, io) => ((0, jsx_runtime_1.jsx)("tr", { className: classes('row'), children: keys.map((k, i) => (i === 0
+                        ? ((0, jsx_runtime_1.jsx)("th", { scope: "row", className: classes('header'), children: e[k] }, i))
+                        : ((0, jsx_runtime_1.jsx)("td", { className: classes('cell'), children: e[k] }, i)))) }, io))) })] }));
+};
+exports.SimpleTable = SimpleTable;
+exports.default = exports.SimpleTable;

package/dist/SimpleTable.mjs

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { classBuilder } from '@react-foundry/component-helpers';
+import '../assets/SimpleTable.scss';
+export const SimpleTable = ({ caption: _caption, classBlock, classModifiers, className, data, headings, keys, ...attrs }) => {
+    const classes = classBuilder('penultimate-simple-table', classBlock, classModifiers, className);
+    const caption = (typeof _caption !== 'string'
+        ? _caption
+        : _caption && (_jsx("caption", { className: classes('caption'), children: _caption })));
+    return (_jsxs("table", { ...attrs, className: classes(), children: [caption, _jsx("thead", { className: classes('head'), children: _jsx("tr", { className: classes('row'), children: keys.map((k, i) => (_jsx("th", { scope: "col", className: classes('header'), children: headings[k] }, i))) }) }), _jsx("tbody", { className: classes('body'), children: data.map((e, io) => (_jsx("tr", { className: classes('row'), children: keys.map((k, i) => (i === 0
+                        ? (_jsx("th", { scope: "row", className: classes('header'), children: e[k] }, i))
+                        : (_jsx("td", { className: classes('cell'), children: e[k] }, i)))) }, io))) })] }));
+};
+export default SimpleTable;

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@react-foundry/simple-table",
+  "version": "0.1.0",
+  "description": "A simple table for displaying data.",
+  "main": "dist/SimpleTable.js",
+  "sass": "assets/SimpleTable.scss",
+  "exports": {
+    ".": {
+      "sass": "./assets/SimpleTable.scss",
+      "types": "./dist/SimpleTable.d.ts",
+      "import": "./dist/SimpleTable.mjs",
+      "require": "./dist/SimpleTable.js",
+      "default": "./dist/SimpleTable.mjs"
+    }
+  },
+  "files": [
+    "/assets",
+    "/dist"
+  ],
+  "author": "Daniel A.C. Martin <npm@daniel-martin.co.uk> (http://daniel-martin.co.uk/)",
+  "license": "MIT",
+  "keywords": [
+    "react-components"
+  ],
+  "dependencies": {
+    "@react-foundry/component-helpers": "^0.1.0"
+  },
+  "peerDependencies": {
+    "@react-foundry/docs-components": "^0.1.0",
+    "@storybook/addon-docs": "^9.1.17",
+    "react": "^19.2.3"
+  },
+  "peerDependenciesMeta": {
+    "@react-foundry/docs-components": {
+      "optional": true
+    },
+    "@storybook/addon-docs": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@types/react": "19.2.9",
+    "jest": "30.2.0",
+    "jest-environment-jsdom": "30.2.0",
+    "ts-jest": "29.4.6",
+    "typescript": "5.9.3",
+    "@react-foundry/component-test-helpers": "0.1.0"
+  },
+  "scripts": {
+    "test": "NODE_OPTIONS=--experimental-vm-modules jest",
+    "build": "npm run build:esm && npm run build:cjs",
+    "build:esm": "tsc -m es2022 && find dist -name '*.js' -exec sh -c 'mv \"$0\" \"${0%.js}.mjs\"' {} \\;",
+    "build:cjs": "tsc",
+    "clean": "rm -rf dist tsconfig.tsbuildinfo"
+  },
+  "module": "dist/SimpleTable.mjs",
+  "typings": "dist/SimpleTable.d.ts"
+}