From 09f2453b1690385bb4acc459d01d0a1eddb52f54 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 14:30:30 +1100 Subject: [PATCH 01/24] major refactor --- declarations.d.ts | 15 +- dev/dev-global.css | 388 +++++++++++++++++++++++++ dev/index.js | 7 +- index.d.ts | 2 + package-lock.json | 473 +++++++++++++++++++++++++++++++ package.json | 8 +- src/{meetingPane.js => index.js} | 99 +++---- src/styles/meetingPane.css | 110 +++++++ webpack.config.mjs | 137 ++++++--- webpack.dev.config.mjs | 16 +- webpack.module.rules.mjs | 28 ++ 11 files changed, 1176 insertions(+), 107 deletions(-) create mode 100644 dev/dev-global.css create mode 100644 index.d.ts rename src/{meetingPane.js => index.js} (93%) create mode 100644 src/styles/meetingPane.css create mode 100644 webpack.module.rules.mjs diff --git a/declarations.d.ts b/declarations.d.ts index 2c131cd..e344443 100644 --- a/declarations.d.ts +++ b/declarations.d.ts @@ -1,4 +1,17 @@ declare module '*.ttl' { const content: string; export default content; -} \ No newline at end of file +} + +export interface PaneDefinition { + icon: string + name: string + audience: unknown[] + label: (subject: unknown, context: unknown) => string | null + render: (subject: unknown, context: { dom: Document }) => HTMLElement + mintClass?: unknown + mintNew?: (context: unknown, options: unknown) => Promise +} + +declare const meetingPane: PaneDefinition +export default meetingPane \ No newline at end of file diff --git a/dev/dev-global.css b/dev/dev-global.css new file mode 100644 index 0000000..b7ad4fd --- /dev/null +++ b/dev/dev-global.css @@ -0,0 +1,388 @@ +/* ---ONLY FOR LOCAL DEV--- */ +/* ---final version is in mashlib--- */ + +/* Global CSS: base styles, variables, and resets */ +/* Accessible color palette */ + +:root { + /* Primary/Accent colors (profile-pane specific) */ + --color-primary: #7C4DFF; /* Vivid Purple */ + --color-secondary: #0077B6; /* Accessible Blue */ + --color-accent: #FFD600; /* Bright Yellow */ + --color-error: #B00020; /* Accessible Red */ + --color-success: #00C853; /* Accessible Green */ + + /* Card/Section backgrounds */ + --color-background: #FFFFFF; /* White */ + --color-card-bg: #FFFFFF; /* White for inner cards */ + --color-section-bg: #F5F5F5; /* Light grey for outer sections */ + + --color-text: #1A1A1A; /* Near-black */ + --color-text-secondary: #666; /* Added for repeated usage */ + --color-text-muted: #444; /* Added for repeated usage */ + --color-border-pale: #eee; /* Added for repeated borders */ + --border-radius-full: 1em; /* Matches module usage */ + --border-radius-base: 0.5em; + --box-shadow: 0 2px 8px rgba(124,77,255,0.08); /* Matches module usage */ + --box-shadow-sm: 0 1px 4px rgba(124,77,255,0.12); + --spacing-xs: 0.5em; + --spacing-sm: 0.75em; + --spacing-md: 1em; + --spacing-lg: 1.5em; + --spacing-xl: 2em; + --font-family-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; + --font-size-base: 1em; /* 16px default */ + --font-size-sm: 0.875em; /* 14px */ + --font-size-lg: 1.125em; /* 18px */ + --font-size-xl: 1.25em; /* 20px */ + --line-height-base: 1.5; /* WCAG recommended */ + --line-height-tight: 1.4; + --line-height-loose: 1.6; + --letter-spacing-wide: 0.025em; + + /* Minimum font sizes for accessibility */ + --min-font-size: 14px; + --min-line-height: 1.4; + + /* Accessibility improvements */ + --min-touch-target: 44px; /* WCAG minimum touch target */ + --focus-ring-width: 2px; + --animation-duration: 0.2s; /* Reduced motion friendly */ + + /* Additional accessibility variables */ + --focus-indicator-width: 3px; + --animation-duration-slow: 0.3s; + --high-contrast-ratio: 7:1; /* WCAG AAA standard */ +} + + +/* Improve text rendering */ +html, body { + margin: 0; + padding: 0; + font-family: var(--font-family-base); + font-size: var(--font-size-base); + line-height: var(--line-height-base); + background: var(--color-background); + color: var(--color-text); + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + text-rendering: optimizeLegibility; +} + +/* Improved heading hierarchy */ +h1, h2, h3, h4, h5, h6 { + color: var(--color-primary); + font-weight: 600; + line-height: var(--line-height-tight); + margin-top: 0; + margin-bottom: var(--spacing-sm); +} + +h1 { font-size: 2em; } /* 32px */ +h2 { font-size: 1.5em; } /* 24px */ +h3 { font-size: 1.25em; } /* 20px */ +h4 { font-size: 1.125em; }/* 18px */ +h5, h6 { font-size: 1em; }/* 16px */ + +/* Better paragraph spacing */ +p { + margin-bottom: var(--spacing-md); + line-height: var(--line-height-base); + max-width: 65ch; /* Optimal reading width */ +} + +/* Improved link accessibility */ +a { + color: var(--color-primary); + text-decoration: underline; + text-underline-offset: 0.125em; + text-decoration-thickness: 0.0625em; +} + +a:hover, a:focus { + text-decoration-thickness: 0.125em; +} + +/* Ensure minimum font sizes are respected */ +@media screen and (max-width: 768px) { + html { + font-size: max(16px, 1rem); /* Never smaller than 16px on mobile */ + } +} + +/* Support for larger text preferences */ +@media (prefers-reduced-motion: no-preference) { + html { + scroll-behavior: smooth; + } +} + +/* Accessibility: focus styles */ +:focus { + outline: 2px solid var(--color-primary); + outline-offset: 1px; + box-shadow: 0 0 0 1px var(--color-background); +} + +/* Accessibility: Respect user motion preferences */ +@media (prefers-reduced-motion: reduce) { + *, *::before, *::after { + animation-duration: 0.01ms !important; + animation-iteration-count: 1 !important; + transition-duration: 0.01ms !important; + scroll-behavior: auto !important; + } +} + +/* Accessibility: High contrast mode support */ +@media (prefers-contrast: high) { + :root { + --color-border-pale: #000; + --box-shadow: 0 2px 4px rgba(0,0,0,0.5); + --box-shadow-sm: 0 1px 2px rgba(0,0,0,0.3); + } +} + +/* Accessibility: Improved focus management */ +:focus-visible { + outline: var(--focus-ring-width) solid var(--color-primary); + outline-offset: 2px; + box-shadow: 0 0 0 1px var(--color-background); +} + +:focus:not(:focus-visible) { + outline: none; +} + +/* Skip link for screen readers */ +.skip-link { + position: absolute; + top: -40px; + left: 6px; + background: var(--color-primary); + color: white; + padding: var(--spacing-sm) var(--spacing-md); + text-decoration: none; + border-radius: var(--border-radius-base); + z-index: 1000; + font-weight: 600; + font-size: var(--font-size-base); + line-height: 1; +} + +.skip-link:focus { + top: 6px; + outline: 2px solid white; + outline-offset: 2px; +} + +/* Semantic HTML5 improvements */ +article, aside, section { + display: block; +} + +header { + margin-bottom: var(--spacing-md); +} + +nav { + display: block; +} + +nav ul { + list-style: none; + padding: 0; + margin: 0; +} + +/* Enhanced keyboard navigation */ +*:focus-visible { + outline: var(--focus-indicator-width) solid var(--color-primary); + outline-offset: 2px; + box-shadow: 0 0 0 1px var(--color-background), 0 0 0 4px rgba(124, 77, 255, 0.2); + border-radius: 2px; + transition: none; /* Remove transitions on focus for immediate feedback */ +} + +/* Improve focus management for interactive elements */ +[role="button"]:focus, +[role="link"]:focus, +button:focus, +a:focus { + outline: 2px solid var(--color-primary); + outline-offset: 2px; + box-shadow: 0 0 0 1px var(--color-background); +} + +/* Enhanced error message accessibility */ +[role="alert"] { + padding: var(--spacing-md); + border: 2px solid var(--color-error); + border-radius: var(--border-radius-base); + background-color: rgba(176, 0, 32, 0.1); + margin: var(--spacing-md) 0; +} + +/* Success message styling */ +[role="status"] { + padding: var(--spacing-md); + border: 2px solid var(--color-success); + border-radius: var(--border-radius-base); + background-color: rgba(0, 200, 83, 0.1); + margin: var(--spacing-md) 0; +} + +/* Enhanced table accessibility */ +table { + border-collapse: collapse; + width: 100%; +} + +th { + background-color: var(--color-section-bg); + font-weight: 600; + text-align: left; + padding: var(--spacing-sm); +} + +td { + padding: var(--spacing-sm); +} + +/* Focus trap for modals */ +.focus-trap { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 9999; + background: rgba(0, 0, 0, 0.5); + display: flex; + justify-content: center; + align-items: center; +} + +/* Enhanced button accessibility */ +button, [role="button"] { + cursor: pointer; + border: none; + border-radius: var(--border-radius-base); + padding: var(--spacing-sm) var(--spacing-md); + min-height: var(--min-touch-target); + min-width: var(--min-touch-target); + font-size: var(--font-size-base); + font-weight: 600; + transition: all var(--animation-duration) ease; + position: relative; + border: 1px solid grey; +} + +button:disabled, [role="button"][aria-disabled="true"] { + opacity: 0.6; + cursor: not-allowed; + pointer-events: none; +} + +/* Loading indicator accessibility */ +.loading-spinner { + width: 40px; + height: 40px; + border: 3px solid var(--color-border-pale); + border-top: 3px solid var(--color-primary); + border-radius: 50%; + animation: spin 1s linear infinite; +} + +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} + +@media (prefers-reduced-motion: reduce) { + .loading-spinner { + animation: none; + border-top-color: var(--color-primary); + } +} + +/* Utility classes */ +.u-flex { + display: flex; +} +.u-grid { + display: grid; +} +.u-center { + justify-content: center; + align-items: center; +} +.u-gap { + gap: 1em; +} + +/* Common card component - used across all modules */ +.module-card { + background: var(--color-card-bg); + border-radius: var(--border-radius-full); + box-shadow: var(--box-shadow); + padding: var(--spacing-lg); + margin-bottom: var(--spacing-lg); + width: 100%; + max-width: 100%; + box-sizing: border-box; +} + +/* Common header styles */ +.module-header { + text-align: center; + margin-bottom: var(--spacing-md); +} + +/* Common flex patterns */ +.flex-center { + display: flex; + justify-content: center; + align-items: center; +} + +.flex-column { + display: flex; + flex-direction: column; +} + +.flex-column-center { + display: flex; + flex-direction: column; + align-items: center; +} + +/* Text utilities */ +.text-center { + text-align: center; +} + +.text-secondary { + color: var(--color-text-secondary); +} + +.text-muted { + color: var(--color-text-muted); +} + +/* Override solid-ui error message close button styling */ +.errorMessageBlock .close, +.errorMessageBlock button[type="button"], +.errorMessageBlock .button { + background: var(--color-border-pale) !important; + color: var(--color-text) !important; + border: 1px solid var(--color-border-pale) !important; +} + +.errorMessageBlock .close:hover, +.errorMessageBlock button[type="button"]:hover, +.errorMessageBlock .button:hover { + background: var(--color-text-secondary) !important; + color: var(--color-background) !important; +} diff --git a/dev/index.js b/dev/index.js index eaa7d0f..6400552 100644 --- a/dev/index.js +++ b/dev/index.js @@ -1,7 +1,8 @@ import * as logic from 'solid-logic' -import MeetingPane from '../src/meetingPane' +import MeetingPane from '../src/index' import * as $rdf from 'rdflib' import * as UI from 'solid-ui' +import './dev-global.css' async function appendMeetingPane (dom, uri) { const subject = $rdf.sym(uri) @@ -24,8 +25,8 @@ async function appendMeetingPane (dom, uri) { } // const webIdToShow = 'https://timbl.com/timbl/Public/Test/Meeting/Brainstorming/index.ttl#this' -const webIdToShow = 'https://timea.solidcommunity.net/TestMeeting/index.ttl#this' - +// const webIdToShow = 'https://timea.solidcommunity.net/TestMeeting/index.ttl#this' +const webIdToShow = 'https://sstratsianis.solidcommunity.net/MeetingTest1/index.ttl#this' logic.store.fetcher.load(webIdToShow).then(() => { appendMeetingPane(document, webIdToShow) }) diff --git a/index.d.ts b/index.d.ts new file mode 100644 index 0000000..416e9d7 --- /dev/null +++ b/index.d.ts @@ -0,0 +1,2 @@ +export { default } from './declarations' +export type { PaneDefinition } from './declarations' \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index bd17bbf..49da78e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,6 +13,8 @@ "babel-loader": "^10.0.0", "babel-plugin-inline-import": "^3.0.0", "buffer": "^6.0.3", + "copy-webpack-plugin": "^11.0.0", + "css-loader": "^7.1.2", "eslint": "^9.39.2", "globals": "^17.1.0", "html-webpack-plugin": "^5.6.6", @@ -21,6 +23,8 @@ "rdflib": "^2.3.5", "solid-logic": "^4.0.2", "solid-ui": "^3.0.3", + "style-loader": "^4.0.0", + "terser-webpack-plugin": "^5.3.6", "typescript": "^5.9.3", "webpack": "^5.104.1", "webpack-cli": "^6.0.1", @@ -2099,6 +2103,44 @@ "url": "https://paulmillr.com/funding/" } }, + "node_modules/@nodelib/fs.scandir": { + "version": "2.1.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", + "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.stat": "2.0.5", + "run-parallel": "^1.1.9" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.stat": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", + "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.walk": { + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", + "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.scandir": "2.1.5", + "fastq": "^1.6.0" + }, + "engines": { + "node": ">= 8" + } + }, "node_modules/@peculiar/asn1-cms": { "version": "2.6.0", "resolved": "https://registry.npmjs.org/@peculiar/asn1-cms/-/asn1-cms-2.6.0.tgz", @@ -4389,6 +4431,41 @@ "dev": true, "license": "MIT" }, + "node_modules/copy-webpack-plugin": { + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-11.0.0.tgz", + "integrity": "sha512-fX2MWpamkW0hZxMEg0+mYnA40LTosOSa5TqZ9GYIBzyJa9C3QUaMPSE2xAi/buNr8u89SfD9wHSQVBzrRa/SOQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "fast-glob": "^3.2.11", + "glob-parent": "^6.0.1", + "globby": "^13.1.1", + "normalize-path": "^3.0.0", + "schema-utils": "^4.0.0", + "serialize-javascript": "^6.0.0" + }, + "engines": { + "node": ">= 14.15.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + }, + "peerDependencies": { + "webpack": "^5.1.0" + } + }, + "node_modules/copy-webpack-plugin/node_modules/serialize-javascript": { + "version": "6.0.2", + "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz", + "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==", + "dev": true, + "license": "BSD-3-Clause", + "dependencies": { + "randombytes": "^2.1.0" + } + }, "node_modules/core-js": { "version": "3.47.0", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.47.0.tgz", @@ -4535,6 +4612,55 @@ "dev": true, "license": "MIT" }, + "node_modules/css-loader": { + "version": "7.1.4", + "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-7.1.4.tgz", + "integrity": "sha512-vv3J9tlOl04WjiMvHQI/9tmIrCxVrj6PFbHemBB1iihpeRbi/I4h033eoFIhwxBBqLhI0KYFS7yvynBFhIZfTw==", + "dev": true, + "license": "MIT", + "dependencies": { + "icss-utils": "^5.1.0", + "postcss": "^8.4.40", + "postcss-modules-extract-imports": "^3.1.0", + "postcss-modules-local-by-default": "^4.0.5", + "postcss-modules-scope": "^3.2.0", + "postcss-modules-values": "^4.0.0", + "postcss-value-parser": "^4.2.0", + "semver": "^7.6.3" + }, + "engines": { + "node": ">= 18.12.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + }, + "peerDependencies": { + "@rspack/core": "0.x || ^1.0.0 || ^2.0.0-0", + "webpack": "^5.27.0" + }, + "peerDependenciesMeta": { + "@rspack/core": { + "optional": true + }, + "webpack": { + "optional": true + } + } + }, + "node_modules/css-loader/node_modules/semver": { + "version": "7.7.4", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.4.tgz", + "integrity": "sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==", + "dev": true, + "license": "ISC", + "bin": { + "semver": "bin/semver.js" + }, + "engines": { + "node": ">=10" + } + }, "node_modules/css-select": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/css-select/-/css-select-4.3.0.tgz", @@ -4565,6 +4691,19 @@ "url": "https://github.com/sponsors/fb55" } }, + "node_modules/cssesc": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", + "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==", + "dev": true, + "license": "MIT", + "bin": { + "cssesc": "bin/cssesc" + }, + "engines": { + "node": ">=4" + } + }, "node_modules/data-view-buffer": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.2.tgz", @@ -4781,6 +4920,19 @@ "dev": true, "license": "MIT" }, + "node_modules/dir-glob": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz", + "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==", + "dev": true, + "license": "MIT", + "dependencies": { + "path-type": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/dns-packet": { "version": "5.6.1", "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz", @@ -5660,6 +5812,36 @@ "dev": true, "license": "MIT" }, + "node_modules/fast-glob": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz", + "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.stat": "^2.0.2", + "@nodelib/fs.walk": "^1.2.3", + "glob-parent": "^5.1.2", + "merge2": "^1.3.0", + "micromatch": "^4.0.8" + }, + "engines": { + "node": ">=8.6.0" + } + }, + "node_modules/fast-glob/node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "license": "ISC", + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/fast-json-stable-stringify": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz", @@ -5701,6 +5883,16 @@ "node": ">= 4.9.1" } }, + "node_modules/fastq": { + "version": "1.20.1", + "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz", + "integrity": "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==", + "dev": true, + "license": "ISC", + "dependencies": { + "reusify": "^1.0.4" + } + }, "node_modules/faye-websocket": { "version": "0.11.4", "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz", @@ -6113,6 +6305,26 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/globby": { + "version": "13.2.2", + "resolved": "https://registry.npmjs.org/globby/-/globby-13.2.2.tgz", + "integrity": "sha512-Y1zNGV+pzQdh7H39l9zgB4PJqjRNqydvdYCDG4HFXM4XuvSaQQlEc91IU1yALL8gUTDomgBAfz3XJdmUS+oo0w==", + "dev": true, + "license": "MIT", + "dependencies": { + "dir-glob": "^3.0.1", + "fast-glob": "^3.3.0", + "ignore": "^5.2.4", + "merge2": "^1.4.1", + "slash": "^4.0.0" + }, + "engines": { + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/globrex": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/globrex/-/globrex-0.1.2.tgz", @@ -6517,6 +6729,19 @@ "node": ">=0.10.0" } }, + "node_modules/icss-utils": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz", + "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==", + "dev": true, + "license": "ISC", + "engines": { + "node": "^10 || ^12 || >= 14" + }, + "peerDependencies": { + "postcss": "^8.1.0" + } + }, "node_modules/ieee754": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz", @@ -7665,6 +7890,16 @@ "dev": true, "license": "MIT" }, + "node_modules/merge2": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", + "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 8" + } + }, "node_modules/methods": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz", @@ -7842,6 +8077,25 @@ "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, + "node_modules/nanoid": { + "version": "3.3.11", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz", + "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "bin": { + "nanoid": "bin/nanoid.cjs" + }, + "engines": { + "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" + } + }, "node_modules/natural-compare": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz", @@ -8519,6 +8773,16 @@ "dev": true, "license": "MIT" }, + "node_modules/path-type": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", + "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, "node_modules/pbkdf2": { "version": "3.1.5", "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.1.5.tgz", @@ -8622,6 +8886,119 @@ "node": ">= 0.4" } }, + "node_modules/postcss": { + "version": "8.5.8", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.8.tgz", + "integrity": "sha512-OW/rX8O/jXnm82Ey1k44pObPtdblfiuWnrd8X7GJ7emImCOstunGbXUpp7HdBrFQX6rJzn3sPT397Wp5aCwCHg==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "nanoid": "^3.3.11", + "picocolors": "^1.1.1", + "source-map-js": "^1.2.1" + }, + "engines": { + "node": "^10 || ^12 || >=14" + } + }, + "node_modules/postcss-modules-extract-imports": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.1.0.tgz", + "integrity": "sha512-k3kNe0aNFQDAZGbin48pL2VNidTF0w4/eASDsxlyspobzU3wZQLOGj7L9gfRe0Jo9/4uud09DsjFNH7winGv8Q==", + "dev": true, + "license": "ISC", + "engines": { + "node": "^10 || ^12 || >= 14" + }, + "peerDependencies": { + "postcss": "^8.1.0" + } + }, + "node_modules/postcss-modules-local-by-default": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.2.0.tgz", + "integrity": "sha512-5kcJm/zk+GJDSfw+V/42fJ5fhjL5YbFDl8nVdXkJPLLW+Vf9mTD5Xe0wqIaDnLuL2U6cDNpTr+UQ+v2HWIBhzw==", + "dev": true, + "license": "MIT", + "dependencies": { + "icss-utils": "^5.0.0", + "postcss-selector-parser": "^7.0.0", + "postcss-value-parser": "^4.1.0" + }, + "engines": { + "node": "^10 || ^12 || >= 14" + }, + "peerDependencies": { + "postcss": "^8.1.0" + } + }, + "node_modules/postcss-modules-scope": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.2.1.tgz", + "integrity": "sha512-m9jZstCVaqGjTAuny8MdgE88scJnCiQSlSrOWcTQgM2t32UBe+MUmFSO5t7VMSfAf/FJKImAxBav8ooCHJXCJA==", + "dev": true, + "license": "ISC", + "dependencies": { + "postcss-selector-parser": "^7.0.0" + }, + "engines": { + "node": "^10 || ^12 || >= 14" + }, + "peerDependencies": { + "postcss": "^8.1.0" + } + }, + "node_modules/postcss-modules-values": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz", + "integrity": "sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==", + "dev": true, + "license": "ISC", + "dependencies": { + "icss-utils": "^5.0.0" + }, + "engines": { + "node": "^10 || ^12 || >= 14" + }, + "peerDependencies": { + "postcss": "^8.1.0" + } + }, + "node_modules/postcss-selector-parser": { + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.1.tgz", + "integrity": "sha512-orRsuYpJVw8LdAwqqLykBj9ecS5/cRHlI5+nvTo8LcCKmzDmqVORXtOIYEEQuL9D4BxtA1lm5isAqzQZCoQ6Eg==", + "dev": true, + "license": "MIT", + "dependencies": { + "cssesc": "^3.0.0", + "util-deprecate": "^1.0.2" + }, + "engines": { + "node": ">=4" + } + }, + "node_modules/postcss-value-parser": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", + "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", + "dev": true, + "license": "MIT" + }, "node_modules/prelude-ls": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz", @@ -8770,6 +9147,27 @@ "node": ">=0.4.x" } }, + "node_modules/queue-microtask": { + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", + "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT" + }, "node_modules/randombytes": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz", @@ -9173,6 +9571,17 @@ "node": ">= 4" } }, + "node_modules/reusify": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz", + "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==", + "dev": true, + "license": "MIT", + "engines": { + "iojs": ">=1.0.0", + "node": ">=0.10.0" + } + }, "node_modules/ripemd160": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.3.tgz", @@ -9263,6 +9672,30 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/run-parallel": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", + "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT", + "dependencies": { + "queue-microtask": "^1.2.2" + } + }, "node_modules/safe-array-concat": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz", @@ -9830,6 +10263,19 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/slash": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-4.0.0.tgz", + "integrity": "sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/sockjs": { "version": "0.3.24", "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz", @@ -9923,6 +10369,16 @@ "node": ">=0.10.0" } }, + "node_modules/source-map-js": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", + "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==", + "dev": true, + "license": "BSD-3-Clause", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/source-map-support": { "version": "0.5.21", "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz", @@ -10148,6 +10604,23 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/style-loader": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-4.0.0.tgz", + "integrity": "sha512-1V4WqhhZZgjVAVJyt7TdDPZoPBPNHbekX4fWnCJL1yQukhCeZhJySUL+gL9y6sNdN95uEOS83Y55SqHcP7MzLA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 18.12.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + }, + "peerDependencies": { + "webpack": "^5.27.0" + } + }, "node_modules/supports-color": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", diff --git a/package.json b/package.json index 0f22cd4..f626259 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "meeting-pane", "version": "3.0.1", "description": "Solid-compatible Panes: meeting collaborative tool", - "main": "dist/meetingPane.js", + "main": "dist/index.js", "files": [ "dist/", "README.md", @@ -53,6 +53,8 @@ "babel-loader": "^10.0.0", "babel-plugin-inline-import": "^3.0.0", "buffer": "^6.0.3", + "copy-webpack-plugin": "^11.0.0", + "css-loader": "^7.1.2", "eslint": "^9.39.2", "globals": "^17.1.0", "html-webpack-plugin": "^5.6.6", @@ -61,9 +63,11 @@ "rdflib": "^2.3.5", "solid-logic": "^4.0.2", "solid-ui": "^3.0.3", + "terser-webpack-plugin": "^5.3.6", "typescript": "^5.9.3", "webpack": "^5.104.1", "webpack-cli": "^6.0.1", - "webpack-dev-server": "^5.2.3" + "webpack-dev-server": "^5.2.3", + "style-loader": "^4.0.0" } } diff --git a/src/meetingPane.js b/src/index.js similarity index 93% rename from src/meetingPane.js rename to src/index.js index 1bebc0b..a71c9c5 100644 --- a/src/meetingPane.js +++ b/src/index.js @@ -6,6 +6,7 @@ import * as UI from 'solid-ui' import * as $rdf from 'rdflib' import { meetingDetailsFormText } from './meetingDetailsForm.ttl' import { solidLogicSingleton, authn } from 'solid-logic' +import './styles/meetingPane.css' const { typeIndex } = solidLogicSingleton const { loadTypeIndexesFor } = typeIndex @@ -104,18 +105,19 @@ export default { const meetingDoc = subject.doc() const meetingBase = subject.dir().uri const div = dom.createElement('div') + div.classList.add('meetingPane') const table = div.appendChild(dom.createElement('table')) - table.style = 'width: 100%; height: 100%; margin:0;' + table.classList.add('meetingPaneTable') const topTR = table.appendChild(dom.createElement('tr')) + topTR.classList.add('meetingPaneHeader') topTR.appendChild(dom.createElement('div')) // topDiv const mainTR = table.appendChild(dom.createElement('tr')) + mainTR.classList.add('meetingPaneMainRow') const toolBar0 = table.appendChild(dom.createElement('td')) const toolBar1 = toolBar0.appendChild(dom.createElement('table')) const toolBar = toolBar1.appendChild(dom.createElement('tr')) - topTR.setAttribute('style', 'height: 2em;') // spacer if notthing else - let me = null // @@ Put code to find out logged in person const saveBackMeetingDoc = function () { @@ -842,23 +844,32 @@ export default { 'text/turtle' ) // Load form directly - const iconStyle = 'padding: 1em; width: 3em; height: 3em;' const iconCell = toolBar.appendChild(dom.createElement('td')) + iconCell.classList.add('meetingToolBarIcons') + const iconRow = iconCell.appendChild(dom.createElement('div')) + iconRow.classList.add('meetingToolIconRow') const parameterCell = toolBar.appendChild(dom.createElement('td')) - const star = iconCell.appendChild(dom.createElement('img')) + const star = iconRow.appendChild(dom.createElement('img')) + star.classList.add( + 'meetingToolIcon', + 'meetingToolIcon-visible', + 'meetingToolIconAddButton' + ) let visible = false // the inividual tools tools star.setAttribute('src', UI.icons.iconBase + 'noun_19460_green.svg') // noun_272948.svg - star.setAttribute('style', iconStyle + 'opacity: 50%;') star.setAttribute('title', 'Add another tool to the meeting') + const toggleIconsVisibility = function (showIcons) { + for (let i = 0; i < iconArray.length; i++) { + iconArray[i].classList.toggle('meetingToolIcon-visible', showIcons) + } + } + const selectNewTool = function (_event) { visible = !visible - star.setAttribute( - 'style', - iconStyle + (visible ? 'background-color: yellow;' : '') - ) - styleTheIcons(visible ? '' : 'display: none;') + star.classList.toggle('meetingToolIcon-yellow', visible) + toggleIconsVisibility(visible) } let loginOutButton @@ -866,7 +877,6 @@ export default { if (webId) { me = webId star.addEventListener('click', selectNewTool) - star.setAttribute('style', iconStyle) return } @@ -874,9 +884,7 @@ export default { if (webIdUri) { me = kb.sym(webIdUri) parameterCell.removeChild(loginOutButton) - // loginOutButton.setAttribute('',iconStyle) // make it match the icons star.addEventListener('click', selectNewTool) - star.setAttribute('style', iconStyle) } else { console.log('(Logged out)') me = null @@ -890,9 +898,12 @@ export default { for (let i = 0; i < toolIcons.length; i++) { const foo = function () { const toolObject = toolIcons[i] - const icon = iconCell.appendChild(dom.createElement('img')) + const icon = iconRow.appendChild(dom.createElement('img')) + icon.classList.add('meetingToolIcon') icon.setAttribute('src', UI.icons.iconBase + toolObject.icon) - icon.setAttribute('style', iconStyle + 'display: none;') + if (toolObject.disabled) { + icon.classList.add('meetingToolIcon-disabled') + } iconArray.push(icon) icon.tool = toolObject const maker = toolObject.maker @@ -906,23 +917,20 @@ export default { foo() } - const styleTheIcons = function (style) { - for (let i = 0; i < iconArray.length; i++) { - let st = iconStyle + style - if (toolIcons[i].disabled) { - st += 'opacity: 0.3;' - } - iconArray[i].setAttribute('style', st) // eg 'background-color: #ccc;' - } - } const resetTools = function () { - styleTheIcons('display: none;') - star.setAttribute('style', iconStyle) + visible = false + toggleIconsVisibility(false) + star.classList.remove('meetingToolIcon-yellow') } const selectTool = function (icon) { - styleTheIcons('display: none;') // 'background-color: #ccc;' - icon.setAttribute('style', iconStyle + 'background-color: yellow;') + visible = false + toggleIconsVisibility(false) + for (let i = 0; i < iconArray.length; i++) { + iconArray[i].classList.remove('meetingToolIcon-yellow') + } + icon.classList.add('meetingToolIcon-visible', 'meetingToolIcon-yellow') + star.classList.remove('meetingToolIcon-yellow') } // ////////////////////////////// @@ -933,8 +941,8 @@ export default { let label = kb.any(item, ns.rdfs('label')) label = label ? label.value : UI.utils.label(target) const s = div.appendChild(dom.createElement('div')) + s.classList.add('meetingToolLabel') s.textContent = label - s.setAttribute('style', 'margin-left: 0.7em') const icon = kb.any(item, ns.meeting('icon')) if (icon) { // Make sure the icon is cleanly on the left of the label @@ -942,11 +950,9 @@ export default { const tr = table.appendChild(dom.createElement('tr')) const left = tr.appendChild(dom.createElement('td')) const right = tr.appendChild(dom.createElement('td')) - // var img = div.appendChild(dom.createElement('img')) const img = left.appendChild(dom.createElement('img')) + img.classList.add('meetingToolIconImg') img.setAttribute('src', icon.uri) - // img.setAttribute('style', 'max-width: 1.5em; max-height: 1.5em;') // @@ SVG shrinks to 0 - img.setAttribute('style', 'width: 1.5em; height: 1.5em;') // @ img.setAttribute('title', label) right.appendChild(s) } else { @@ -960,7 +966,7 @@ export default { const tipDiv = function (text) { const d = dom.createElement('div') const p = d.appendChild(dom.createElement('p')) - p.setAttribute('style', 'margin: 0em; padding:3em; color: #888;') + p.classList.add('meetingToolTip') p.textContent = 'Tip: ' + text return d } @@ -1004,10 +1010,7 @@ export default { saveBackMeetingDoc() } ) - delButton.setAttribute('style', 'width: 1.5em; height: 1.5em;') - // delButton.setAttribute('class', '') - // delButton.setAttribute('style', 'height: 2em; width: 2em; margin: 1em; border-radius: 0.5em; padding: 1em; font-size: 120%; background-color: red; color: white;') - // delButton.textContent = 'Delete this tab' + delButton.classList.add('meetingPaneDeleteButton') } else { containerDiv.appendChild(dom.createElement('h4')).textContent = '(No adjustments available)' @@ -1031,17 +1034,8 @@ export default { // See https://stackoverflow.com/questions/325273/make-iframe-to-fit-100-of-containers-remaining-height // Set the container position (sic) so it becaomes a 100% reference for the size of the iframe height 100% /* For now at least , leave the container style as set by the tab system. 20200115b - containerDiv.setAttribute( - 'style', - 'position: relative; top: 0px; left:0px; right:0px; resize: both; overflow:scroll; min-width: 30em; min-height: 30em;' - ) - */ - // iframe.setAttribute('style', 'height: 350px; border: 0; margin: 0; padding: 0; resize:both; overflow:scroll; width: 100%;') - // iframe.setAttribute('style', 'border: none; margin: 0; padding: 0; height: 100%; width: 100%; resize: both; overflow:scroll;') - iframe.setAttribute( - 'style', - 'border: none; margin: 0; padding: 0; height: 100%; width: 100%;' - ) +*/ + iframe.classList.add('meetingPaneIframe') // Following https://dev.chromium.org/Home/chromium-security/deprecating-permissions-in-cross-origin-iframes : iframe.setAttribute('allow', 'microphone camera') // Allow iframe to request camera and mic // containerDiv.style.resize = 'none' // Remove scroll bars on outer div - don't seem to work so well @@ -1139,22 +1133,21 @@ export default { ) // "Make a new meeting" button - const imageStyle = 'height: 2em; width: 2em; margin:0.5em;' const detailsBottom = containerDiv.appendChild(dom.createElement('div')) const spawn = detailsBottom.appendChild(dom.createElement('img')) + spawn.classList.add('meetingToolIconSpawn') spawn.setAttribute('src', UI.icons.iconBase + 'noun_145978.svg') spawn.setAttribute('title', 'Make a fresh new meeting') spawn.addEventListener('click', makeNewMeeting) - spawn.setAttribute('style', imageStyle) // "Fork me on Github" button const forka = detailsBottom.appendChild(dom.createElement('a')) forka.setAttribute('href', 'https://github.com/solid/solid-panes') // @@ Move when code moves forka.setAttribute('target', '_blank') const fork = forka.appendChild(dom.createElement('img')) + fork.classList.add('meetingToolIconForkGithub') fork.setAttribute('src', UI.icons.iconBase + 'noun_368567.svg') fork.setAttribute('title', 'Fork me on github') - fork.setAttribute('style', imageStyle + 'opacity: 50%;') } if (kb.holds(subject, ns.rdf('type'), ns.meeting('Tool'))) { @@ -1176,7 +1169,7 @@ export default { ? dataBrowserContext.session.paneRegistry.byName(view) : null table = containerDiv.appendChild(dom.createElement('table')) - table.style.width = '100%' + table.classList.add('meetingPaneTableMain') dataBrowserContext .getOutliner(dom) .GotoSubject(target, true, pane, false, undefined, table) diff --git a/src/styles/meetingPane.css b/src/styles/meetingPane.css new file mode 100644 index 0000000..daf26b2 --- /dev/null +++ b/src/styles/meetingPane.css @@ -0,0 +1,110 @@ +.meetingPaneTable { + border-collapse: collapse; + width: 100%; + height: 100%; + margin: 0; +} +.meetingPaneHeader { + height: 2em; +} + +.meetingPane { + padding-right: 1.5em; + box-sizing: border-box; +} + +.meetingPane .meetingToolBarIcons { + width: 1%; + white-space: nowrap !important; + vertical-align: middle; +} + +.meetingPane .meetingToolIconRow { + display: flex !important; + flex-direction: row !important; + flex-wrap: nowrap !important; + align-items: center !important; + justify-content: flex-start !important; + gap: var(--spacing-xl); +} + +.meetingPane .meetingToolIcon { + box-sizing: border-box; + padding: 0.24em !important; + width: 4.1em !important; + height: 4.1em !important; + max-width: 4.1em !important; + max-height: 4.1em !important; + min-width: 4.1em !important; + min-height: 4.1em !important; + margin: 0 !important; + opacity: 50%; + display: none !important; + vertical-align: middle; + object-fit: contain; + flex: 0 0 auto !important; +} + +.meetingPane .meetingToolIcon-visible { + display: inline-block !important; + opacity: 100% !important; +} +.meetingPane .meetingToolIcon-yellow { + background-color: yellow; +} + +.meetingPane .meetingToolIcon-disabled { + opacity: 30%; +} + +.meetingPane .meetingToolIconAddButton { + width: 4.45em !important; + height: 4.45em !important; + max-width: 4.45em !important; + max-height: 4.45em !important; + min-width: 4.45em !important; + min-height: 4.45em !important; +} + +.meetingToolLabel { + margin-left: 0.7em; +} +.meetingToolIconImg { + width: 1em; + height: 1em; +} +.meetingToolTip { + margin: 0em; + padding:3em; + color: #888; +} +.meetingPaneDeleteButton { + width: 1.5em; + height: 1.5em; +} +.meetingPaneIframe { + border: none; + margin: 0; + padding: 0; + height: 100%; + width: 100%; +} +.meetingToolIconSpawn { + height: 2em; + width: 2em; + margin: var(--spacing-xs); +} +.meetingToolIconForkGithub { + height: 2em; + width: 2em; + margin: var(--spacing-xs); + opacity: 50%; +} +.meetingPaneTableMain { + border-collapse: collapse; + width: 100%; +} +/* ai generated below */ +.meetingPaneMainRow { + height: calc(100% - 50px); +} \ No newline at end of file diff --git a/webpack.config.mjs b/webpack.config.mjs index 4a8eeb0..1719edc 100644 --- a/webpack.config.mjs +++ b/webpack.config.mjs @@ -1,46 +1,115 @@ import path from 'path' import NodePolyfillPlugin from 'node-polyfill-webpack-plugin' +import { moduleRules } from './webpack.module.rules.mjs' +import { createRequire } from 'module' +import TerserPlugin from 'terser-webpack-plugin' +import CopyPlugin from 'copy-webpack-plugin' -export default [ - { - mode: 'production', - entry: './src/meetingPane.js', - output: { - path: path.resolve(process.cwd(), 'dist'), - filename: 'meetingPane.js', - library: { - name: 'MeetingPane', - type: 'umd' - }, - globalObject: 'this', - clean: false +const require = createRequire(import.meta.url) + +const common = { + mode: 'production', + entry: './src/index.js', + output: { + path: path.resolve(process.cwd(), 'dist'), + filename: 'meetingPane.js', + library: { + name: 'MeetingPane', + type: 'umd' }, - plugins: [ - new NodePolyfillPlugin() - ], + globalObject: 'this', + clean: false + }, + plugins: [ + new NodePolyfillPlugin() + ], module: { - rules: [ + rules: moduleRules, + }, + externals: { + 'solid-ui': 'UI', + 'solid-logic': 'SolidLogic', + rdflib: '$rdf', + }, + resolve: { + extensions: ['.js', '.ts'], + fallback: { + path: require.resolve('path-browserify') + }, + }, + devtool: 'source-map', +} + + +const normalConfig = { + ...common, + mode: 'production', + output: { + path: path.resolve(process.cwd(), 'lib'), + filename: 'meeting-pane.js', + library: { + type: 'umd', + name: 'MeetingPane', + export: 'default', + }, + globalObject: 'this', + clean: true, + }, + plugins: [ + ...(common.plugins || []), + new CopyPlugin({ + patterns: [ { - test: /\.(js|ts)$/, - exclude: /node_modules/, - use: ['babel-loader'], + from: path.resolve('src/styles'), + to: path.resolve('lib/styles'), }, + ], + }), + ], + optimization: { + minimize: false, + } +} +const minConfig = { + ...common, + mode: 'production', + output: { + path: path.resolve(process.cwd(), 'lib'), + filename: 'meeting-pane.min.js', + library: { + type: 'umd', + name: 'MeetingPane', + export: 'default', + }, + globalObject: 'this', + clean: false, + }, + plugins: [ + ...(common.plugins || []), + new CopyPlugin({ + patterns: [ { - test: /\.ttl$/, // Target text files - type: 'asset/source', // Load the file's content as a string + from: path.resolve('src/styles'), + to: path.resolve('lib/styles'), }, - ], - }, - externals: { - 'solid-ui': 'UI', - 'solid-logic': 'SolidLogic', - rdflib: '$rdf', - }, - resolve: { - extensions: ['.js'], - }, - devtool: false, + }), + ], + optimization: { + minimize: true, + minimizer: [ + new TerserPlugin({ + terserOptions: { + format: { + comments: false, + }, + }, + extractComments: false, + }) + ], } -] +} + +export default [normalConfig, minConfig] + diff --git a/webpack.dev.config.mjs b/webpack.dev.config.mjs index 4b721f4..ccbc93a 100644 --- a/webpack.dev.config.mjs +++ b/webpack.dev.config.mjs @@ -9,20 +9,8 @@ export default [ new HtmlWebpackPlugin({ template: './dev/index.html' }), new NodePolyfillPlugin() ], - module: { - rules: [ - { - test: /\.(js|ts)$/, - exclude: /node_modules/, - use: ['babel-loader'], - }, - - { - test: /\.ttl$/, // Target text files - type: 'asset/source', // Load the file's content as a string - }, - - ], + module: { + rules: moduleRules, }, resolve: { extensions: ['.js', '.ts'], diff --git a/webpack.module.rules.mjs b/webpack.module.rules.mjs new file mode 100644 index 0000000..c1c9aac --- /dev/null +++ b/webpack.module.rules.mjs @@ -0,0 +1,28 @@ +export const moduleRules = [ + { + test: /\.(js|ts)$/, + exclude: /node_modules/, + use: ['babel-loader'], + }, + { + test: /\.css$/, + exclude: /\.module\.css$/, + use: ['style-loader', 'css-loader'], + }, + { + test: /\.module\.css$/, + use: [ + 'style-loader', + { + loader: 'css-loader', + options: { + modules: true + } + } + ] + }, + { + test: /\.ttl$/, + type: 'asset/source', + } +] From 2ef69e0eb62fff7d697675dae1a044b39eb3081b Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 16:43:46 +1100 Subject: [PATCH 02/24] change json main and types --- package.json | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index f626259..fa77cfe 100644 --- a/package.json +++ b/package.json @@ -2,9 +2,10 @@ "name": "meeting-pane", "version": "3.0.1", "description": "Solid-compatible Panes: meeting collaborative tool", - "main": "dist/index.js", + "main": "lib/index.js", + "types": "lib/index.d.ts", "files": [ - "dist/", + "lib/", "README.md", "LICENSE" ], From 1397d4763851517a514277d0a785924f855b5ee2 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 16:49:28 +1100 Subject: [PATCH 03/24] resolved linting errors --- webpack.config.mjs | 4 +--- webpack.dev.config.mjs | 3 ++- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/webpack.config.mjs b/webpack.config.mjs index 1719edc..1a85761 100644 --- a/webpack.config.mjs +++ b/webpack.config.mjs @@ -23,7 +23,7 @@ const common = { plugins: [ new NodePolyfillPlugin() ], - module: { + module: { rules: moduleRules, }, externals: { @@ -40,7 +40,6 @@ const common = { devtool: 'source-map', } - const normalConfig = { ...common, mode: 'production', @@ -112,4 +111,3 @@ const minConfig = { } export default [normalConfig, minConfig] - diff --git a/webpack.dev.config.mjs b/webpack.dev.config.mjs index ccbc93a..acdc6f0 100644 --- a/webpack.dev.config.mjs +++ b/webpack.dev.config.mjs @@ -1,5 +1,6 @@ import HtmlWebpackPlugin from 'html-webpack-plugin' import NodePolyfillPlugin from 'node-polyfill-webpack-plugin' +import { moduleRules } from './webpack.module.rules.mjs' export default [ { @@ -9,7 +10,7 @@ export default [ new HtmlWebpackPlugin({ template: './dev/index.html' }), new NodePolyfillPlugin() ], - module: { + module: { rules: moduleRules, }, resolve: { From 59160567c2b5d19c23a2a1c8723809d55c6e9ceb Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 16:55:34 +1100 Subject: [PATCH 04/24] one place had dist --- webpack.config.mjs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webpack.config.mjs b/webpack.config.mjs index 1a85761..83a8902 100644 --- a/webpack.config.mjs +++ b/webpack.config.mjs @@ -11,7 +11,7 @@ const common = { mode: 'production', entry: './src/index.js', output: { - path: path.resolve(process.cwd(), 'dist'), + path: path.resolve(process.cwd(), 'lib'), filename: 'meetingPane.js', library: { name: 'MeetingPane', From ca44eace7a076eb1a733413d31f8df99e40932b9 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 16:57:32 +1100 Subject: [PATCH 05/24] added sideeffects css --- package.json | 3 +++ 1 file changed, 3 insertions(+) diff --git a/package.json b/package.json index fa77cfe..349ec29 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,9 @@ "description": "Solid-compatible Panes: meeting collaborative tool", "main": "lib/index.js", "types": "lib/index.d.ts", + "sideEffects": [ + "**/*.css" + ], "files": [ "lib/", "README.md", From 7a6faa5219b0e044fd5117e84e644f7c6014c477 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 17:05:29 +1100 Subject: [PATCH 06/24] change to meeting-pane.js --- .gitignore | 3 --- package.json | 12 +++++++++--- 2 files changed, 9 insertions(+), 6 deletions(-) diff --git a/.gitignore b/.gitignore index b4c3555..9b497c7 100644 --- a/.gitignore +++ b/.gitignore @@ -6,11 +6,8 @@ yarn-debug.log* yarn-error.log* # Webpack -dist - # Babel lib -dist # Runtime data pids diff --git a/package.json b/package.json index 349ec29..13d030d 100644 --- a/package.json +++ b/package.json @@ -2,8 +2,14 @@ "name": "meeting-pane", "version": "3.0.1", "description": "Solid-compatible Panes: meeting collaborative tool", - "main": "lib/index.js", - "types": "lib/index.d.ts", + "main": "lib/meeting-pane.js", + "types": "index.d.ts", + "exports": { + ".": { + "types": "./index.d.ts", + "default": "./lib/meeting-pane.js" + } + }, "sideEffects": [ "**/*.css" ], @@ -13,7 +19,7 @@ "LICENSE" ], "scripts": { - "clean": "rm -rf dist", + "clean": "rm -rf lib", "build": "npm run clean && npm run build-dist", "build-dist": "webpack --progress", "lint": "eslint", From 0b8c362ef030ec47491d943c7ba23d662ddb2b5b Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 17:09:52 +1100 Subject: [PATCH 07/24] needed types in files --- index.d.ts | 14 ++++++++++++-- package.json | 1 + 2 files changed, 13 insertions(+), 2 deletions(-) diff --git a/index.d.ts b/index.d.ts index 416e9d7..3f585cd 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,2 +1,12 @@ -export { default } from './declarations' -export type { PaneDefinition } from './declarations' \ No newline at end of file +export interface PaneDefinition { + icon: string + name: string + audience: unknown[] + label: (subject: unknown, context: unknown) => string | null + render: (subject: unknown, context: { dom: Document }) => HTMLElement + mintClass?: unknown + mintNew?: (context: unknown, options: unknown) => Promise +} + +declare const meetingPane: PaneDefinition +export default meetingPane \ No newline at end of file diff --git a/package.json b/package.json index 13d030d..b2a9341 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ ], "files": [ "lib/", + "index.d.ts", "README.md", "LICENSE" ], From ac4226910b3ee20b2e3333bf72c4a2c3045aaf70 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 17:56:13 +1100 Subject: [PATCH 08/24] needed to export from index --- index.d.ts | 14 ++------------ 1 file changed, 2 insertions(+), 12 deletions(-) diff --git a/index.d.ts b/index.d.ts index 3f585cd..67507ff 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,12 +1,2 @@ -export interface PaneDefinition { - icon: string - name: string - audience: unknown[] - label: (subject: unknown, context: unknown) => string | null - render: (subject: unknown, context: { dom: Document }) => HTMLElement - mintClass?: unknown - mintNew?: (context: unknown, options: unknown) => Promise -} - -declare const meetingPane: PaneDefinition -export default meetingPane \ No newline at end of file +export { default } from './declarations' +export type { PaneDefinition } from './declarations' From 27f717877d74a184f50fcbc54a49e6a9dcba8a47 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 18:46:55 +1100 Subject: [PATCH 09/24] changed button style --- src/styles/meetingPane.css | 34 +++++++++++++++++----------------- 1 file changed, 17 insertions(+), 17 deletions(-) diff --git a/src/styles/meetingPane.css b/src/styles/meetingPane.css index daf26b2..c8ad115 100644 --- a/src/styles/meetingPane.css +++ b/src/styles/meetingPane.css @@ -25,19 +25,16 @@ flex-wrap: nowrap !important; align-items: center !important; justify-content: flex-start !important; - gap: var(--spacing-xl); + gap: 0; } .meetingPane .meetingToolIcon { box-sizing: border-box; - padding: 0.24em !important; - width: 4.1em !important; - height: 4.1em !important; - max-width: 4.1em !important; - max-height: 4.1em !important; - min-width: 4.1em !important; - min-height: 4.1em !important; - margin: 0 !important; + padding: 1em; + width: 3em; + height: 3em; + min-width: 3em; + min-height: 3em; opacity: 50%; display: none !important; vertical-align: middle; @@ -58,21 +55,24 @@ } .meetingPane .meetingToolIconAddButton { - width: 4.45em !important; - height: 4.45em !important; - max-width: 4.45em !important; - max-height: 4.45em !important; - min-width: 4.45em !important; - min-height: 4.45em !important; + padding: 0 !important; + margin: 0.5em !important; + width: 2em !important; + height: 2em !important; + max-width: 2em !important; + max-height: 2em !important; + min-width: 2em !important; + min-height: 2em !important; } .meetingToolLabel { margin-left: 0.7em; } .meetingToolIconImg { - width: 1em; - height: 1em; + width: 1.5em; + height: 1.5em; } + .meetingToolTip { margin: 0em; padding:3em; From 2b6928a8552337a4ce9aa4e4792bdf4fc1dcfd2a Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 18:58:20 +1100 Subject: [PATCH 10/24] changed button size --- src/styles/meetingPane.css | 27 ++++++++++++++------------- 1 file changed, 14 insertions(+), 13 deletions(-) diff --git a/src/styles/meetingPane.css b/src/styles/meetingPane.css index c8ad115..9c983c3 100644 --- a/src/styles/meetingPane.css +++ b/src/styles/meetingPane.css @@ -9,7 +9,7 @@ } .meetingPane { - padding-right: 1.5em; + padding: 5em; box-sizing: border-box; } @@ -25,16 +25,17 @@ flex-wrap: nowrap !important; align-items: center !important; justify-content: flex-start !important; - gap: 0; + gap: 1em; } .meetingPane .meetingToolIcon { box-sizing: border-box; - padding: 1em; - width: 3em; - height: 3em; - min-width: 3em; - min-height: 3em; + padding: 0 !important; + width: 3.1em; + height: 3.1em; + min-width: 3.1em; + min-height: 3.1em; + margin: 0.5em !important; opacity: 50%; display: none !important; vertical-align: middle; @@ -57,12 +58,12 @@ .meetingPane .meetingToolIconAddButton { padding: 0 !important; margin: 0.5em !important; - width: 2em !important; - height: 2em !important; - max-width: 2em !important; - max-height: 2em !important; - min-width: 2em !important; - min-height: 2em !important; + width: 3.1em !important; + height: 3.1em !important; + max-width: 3.1em !important; + max-height: 3.1em !important; + min-width: 3.1em !important; + min-height: 3.1em !important; } .meetingToolLabel { From 8867dae1aaa1969a35557c223fc5b8fe42e9dce4 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 19:23:10 +1100 Subject: [PATCH 11/24] applied copilot suggestions --- dev/index.js | 4 +- package-lock.json | 258 ++++--------------------------------- package.json | 6 +- src/styles/meetingPane.css | 4 +- webpack.config.mjs | 24 +--- webpack.module.rules.mjs | 58 +++++---- 6 files changed, 69 insertions(+), 285 deletions(-) diff --git a/dev/index.js b/dev/index.js index 6400552..ae30c37 100644 --- a/dev/index.js +++ b/dev/index.js @@ -25,8 +25,8 @@ async function appendMeetingPane (dom, uri) { } // const webIdToShow = 'https://timbl.com/timbl/Public/Test/Meeting/Brainstorming/index.ttl#this' -// const webIdToShow = 'https://timea.solidcommunity.net/TestMeeting/index.ttl#this' -const webIdToShow = 'https://sstratsianis.solidcommunity.net/MeetingTest1/index.ttl#this' +const webIdToShow = 'https://timea.solidcommunity.net/TestMeeting/index.ttl#this' + logic.store.fetcher.load(webIdToShow).then(() => { appendMeetingPane(document, webIdToShow) }) diff --git a/package-lock.json b/package-lock.json index 49da78e..91afcc1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,11 +13,11 @@ "babel-loader": "^10.0.0", "babel-plugin-inline-import": "^3.0.0", "buffer": "^6.0.3", - "copy-webpack-plugin": "^11.0.0", "css-loader": "^7.1.2", "eslint": "^9.39.2", "globals": "^17.1.0", "html-webpack-plugin": "^5.6.6", + "mini-css-extract-plugin": "^2.9.4", "neostandard": "^0.13.0", "node-polyfill-webpack-plugin": "^4.1.0", "rdflib": "^2.3.5", @@ -2103,44 +2103,6 @@ "url": "https://paulmillr.com/funding/" } }, - "node_modules/@nodelib/fs.scandir": { - "version": "2.1.5", - "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", - "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", - "dev": true, - "license": "MIT", - "dependencies": { - "@nodelib/fs.stat": "2.0.5", - "run-parallel": "^1.1.9" - }, - "engines": { - "node": ">= 8" - } - }, - "node_modules/@nodelib/fs.stat": { - "version": "2.0.5", - "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", - "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">= 8" - } - }, - "node_modules/@nodelib/fs.walk": { - "version": "1.2.8", - "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", - "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", - "dev": true, - "license": "MIT", - "dependencies": { - "@nodelib/fs.scandir": "2.1.5", - "fastq": "^1.6.0" - }, - "engines": { - "node": ">= 8" - } - }, "node_modules/@peculiar/asn1-cms": { "version": "2.6.0", "resolved": "https://registry.npmjs.org/@peculiar/asn1-cms/-/asn1-cms-2.6.0.tgz", @@ -4431,41 +4393,6 @@ "dev": true, "license": "MIT" }, - "node_modules/copy-webpack-plugin": { - "version": "11.0.0", - "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-11.0.0.tgz", - "integrity": "sha512-fX2MWpamkW0hZxMEg0+mYnA40LTosOSa5TqZ9GYIBzyJa9C3QUaMPSE2xAi/buNr8u89SfD9wHSQVBzrRa/SOQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "fast-glob": "^3.2.11", - "glob-parent": "^6.0.1", - "globby": "^13.1.1", - "normalize-path": "^3.0.0", - "schema-utils": "^4.0.0", - "serialize-javascript": "^6.0.0" - }, - "engines": { - "node": ">= 14.15.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/webpack" - }, - "peerDependencies": { - "webpack": "^5.1.0" - } - }, - "node_modules/copy-webpack-plugin/node_modules/serialize-javascript": { - "version": "6.0.2", - "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz", - "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==", - "dev": true, - "license": "BSD-3-Clause", - "dependencies": { - "randombytes": "^2.1.0" - } - }, "node_modules/core-js": { "version": "3.47.0", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.47.0.tgz", @@ -4920,19 +4847,6 @@ "dev": true, "license": "MIT" }, - "node_modules/dir-glob": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz", - "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==", - "dev": true, - "license": "MIT", - "dependencies": { - "path-type": "^4.0.0" - }, - "engines": { - "node": ">=8" - } - }, "node_modules/dns-packet": { "version": "5.6.1", "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz", @@ -5812,36 +5726,6 @@ "dev": true, "license": "MIT" }, - "node_modules/fast-glob": { - "version": "3.3.3", - "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz", - "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==", - "dev": true, - "license": "MIT", - "dependencies": { - "@nodelib/fs.stat": "^2.0.2", - "@nodelib/fs.walk": "^1.2.3", - "glob-parent": "^5.1.2", - "merge2": "^1.3.0", - "micromatch": "^4.0.8" - }, - "engines": { - "node": ">=8.6.0" - } - }, - "node_modules/fast-glob/node_modules/glob-parent": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", - "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", - "dev": true, - "license": "ISC", - "dependencies": { - "is-glob": "^4.0.1" - }, - "engines": { - "node": ">= 6" - } - }, "node_modules/fast-json-stable-stringify": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz", @@ -5883,16 +5767,6 @@ "node": ">= 4.9.1" } }, - "node_modules/fastq": { - "version": "1.20.1", - "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz", - "integrity": "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==", - "dev": true, - "license": "ISC", - "dependencies": { - "reusify": "^1.0.4" - } - }, "node_modules/faye-websocket": { "version": "0.11.4", "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz", @@ -6305,26 +6179,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/globby": { - "version": "13.2.2", - "resolved": "https://registry.npmjs.org/globby/-/globby-13.2.2.tgz", - "integrity": "sha512-Y1zNGV+pzQdh7H39l9zgB4PJqjRNqydvdYCDG4HFXM4XuvSaQQlEc91IU1yALL8gUTDomgBAfz3XJdmUS+oo0w==", - "dev": true, - "license": "MIT", - "dependencies": { - "dir-glob": "^3.0.1", - "fast-glob": "^3.3.0", - "ignore": "^5.2.4", - "merge2": "^1.4.1", - "slash": "^4.0.0" - }, - "engines": { - "node": "^12.20.0 || ^14.13.1 || >=16.0.0" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/globrex": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/globrex/-/globrex-0.1.2.tgz", @@ -7890,16 +7744,6 @@ "dev": true, "license": "MIT" }, - "node_modules/merge2": { - "version": "1.4.1", - "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", - "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">= 8" - } - }, "node_modules/methods": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz", @@ -7998,6 +7842,27 @@ "url": "https://opencollective.com/express" } }, + "node_modules/mini-css-extract-plugin": { + "version": "2.10.1", + "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.10.1.tgz", + "integrity": "sha512-k7G3Y5QOegl380tXmZ68foBRRjE9Ljavx835ObdvmZjQ639izvZD8CS7BkWw1qKPPzHsGL/JDhl0uyU1zc2rJw==", + "dev": true, + "license": "MIT", + "dependencies": { + "schema-utils": "^4.0.0", + "tapable": "^2.2.1" + }, + "engines": { + "node": ">= 12.13.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + }, + "peerDependencies": { + "webpack": "^5.0.0" + } + }, "node_modules/minimalistic-assert": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz", @@ -8773,16 +8638,6 @@ "dev": true, "license": "MIT" }, - "node_modules/path-type": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", - "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=8" - } - }, "node_modules/pbkdf2": { "version": "3.1.5", "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.1.5.tgz", @@ -9147,27 +9002,6 @@ "node": ">=0.4.x" } }, - "node_modules/queue-microtask": { - "version": "1.2.3", - "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", - "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", - "dev": true, - "funding": [ - { - "type": "github", - "url": "https://github.com/sponsors/feross" - }, - { - "type": "patreon", - "url": "https://www.patreon.com/feross" - }, - { - "type": "consulting", - "url": "https://feross.org/support" - } - ], - "license": "MIT" - }, "node_modules/randombytes": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz", @@ -9571,17 +9405,6 @@ "node": ">= 4" } }, - "node_modules/reusify": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz", - "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==", - "dev": true, - "license": "MIT", - "engines": { - "iojs": ">=1.0.0", - "node": ">=0.10.0" - } - }, "node_modules/ripemd160": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.3.tgz", @@ -9672,30 +9495,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/run-parallel": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", - "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", - "dev": true, - "funding": [ - { - "type": "github", - "url": "https://github.com/sponsors/feross" - }, - { - "type": "patreon", - "url": "https://www.patreon.com/feross" - }, - { - "type": "consulting", - "url": "https://feross.org/support" - } - ], - "license": "MIT", - "dependencies": { - "queue-microtask": "^1.2.2" - } - }, "node_modules/safe-array-concat": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz", @@ -10263,19 +10062,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/slash": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/slash/-/slash-4.0.0.tgz", - "integrity": "sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/sockjs": { "version": "0.3.24", "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz", diff --git a/package.json b/package.json index b2a9341..633922d 100644 --- a/package.json +++ b/package.json @@ -8,8 +8,12 @@ ".": { "types": "./index.d.ts", "default": "./lib/meeting-pane.js" + }, + "./styles.css": { + "default": "./lib/meeting-pane.css" } }, + "style": "lib/meeting-pane.css", "sideEffects": [ "**/*.css" ], @@ -64,7 +68,6 @@ "babel-loader": "^10.0.0", "babel-plugin-inline-import": "^3.0.0", "buffer": "^6.0.3", - "copy-webpack-plugin": "^11.0.0", "css-loader": "^7.1.2", "eslint": "^9.39.2", "globals": "^17.1.0", @@ -74,6 +77,7 @@ "rdflib": "^2.3.5", "solid-logic": "^4.0.2", "solid-ui": "^3.0.3", + "mini-css-extract-plugin": "^2.9.4", "terser-webpack-plugin": "^5.3.6", "typescript": "^5.9.3", "webpack": "^5.104.1", diff --git a/src/styles/meetingPane.css b/src/styles/meetingPane.css index 9c983c3..6602803 100644 --- a/src/styles/meetingPane.css +++ b/src/styles/meetingPane.css @@ -93,12 +93,12 @@ .meetingToolIconSpawn { height: 2em; width: 2em; - margin: var(--spacing-xs); + margin: var(--spacing-xs, 0.5em); } .meetingToolIconForkGithub { height: 2em; width: 2em; - margin: var(--spacing-xs); + margin: var(--spacing-xs, 0.5em); opacity: 50%; } .meetingPaneTableMain { diff --git a/webpack.config.mjs b/webpack.config.mjs index 83a8902..5b22b23 100644 --- a/webpack.config.mjs +++ b/webpack.config.mjs @@ -1,9 +1,9 @@ import path from 'path' import NodePolyfillPlugin from 'node-polyfill-webpack-plugin' -import { moduleRules } from './webpack.module.rules.mjs' +import { getModuleRules } from './webpack.module.rules.mjs' import { createRequire } from 'module' import TerserPlugin from 'terser-webpack-plugin' -import CopyPlugin from 'copy-webpack-plugin' +import MiniCssExtractPlugin from 'mini-css-extract-plugin' const require = createRequire(import.meta.url) @@ -24,7 +24,7 @@ const common = { new NodePolyfillPlugin() ], module: { - rules: moduleRules, + rules: getModuleRules(MiniCssExtractPlugin.loader), }, externals: { 'solid-ui': 'UI', @@ -56,13 +56,8 @@ const normalConfig = { }, plugins: [ ...(common.plugins || []), - new CopyPlugin({ - patterns: [ - { - from: path.resolve('src/styles'), - to: path.resolve('lib/styles'), - }, - ], + new MiniCssExtractPlugin({ + filename: 'meeting-pane.css', }), ], optimization: { @@ -86,13 +81,8 @@ const minConfig = { }, plugins: [ ...(common.plugins || []), - new CopyPlugin({ - patterns: [ - { - from: path.resolve('src/styles'), - to: path.resolve('lib/styles'), - }, - ], + new MiniCssExtractPlugin({ + filename: 'meeting-pane.css', }), ], optimization: { diff --git a/webpack.module.rules.mjs b/webpack.module.rules.mjs index c1c9aac..d361c54 100644 --- a/webpack.module.rules.mjs +++ b/webpack.module.rules.mjs @@ -1,28 +1,32 @@ -export const moduleRules = [ - { - test: /\.(js|ts)$/, - exclude: /node_modules/, - use: ['babel-loader'], - }, - { - test: /\.css$/, - exclude: /\.module\.css$/, - use: ['style-loader', 'css-loader'], - }, - { - test: /\.module\.css$/, - use: [ - 'style-loader', - { - loader: 'css-loader', - options: { - modules: true +export const getModuleRules = function (styleLoader = 'style-loader') { + return [ + { + test: /\.(js|ts)$/, + exclude: /node_modules/, + use: ['babel-loader'], + }, + { + test: /\.css$/, + exclude: /\.module\.css$/, + use: [styleLoader, 'css-loader'], + }, + { + test: /\.module\.css$/, + use: [ + styleLoader, + { + loader: 'css-loader', + options: { + modules: true + } } - } - ] - }, - { - test: /\.ttl$/, - type: 'asset/source', - } -] + ] + }, + { + test: /\.ttl$/, + type: 'asset/source', + } + ] +} + +export const moduleRules = getModuleRules() From 3f9bfbdc276d6a2f5bbf95a7a7b765258b11cc29 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Wed, 11 Mar 2026 19:33:12 +1100 Subject: [PATCH 12/24] changed back style build --- package-lock.json | 258 +++++++++++++++++++++++++++++++++++++++++---- package.json | 6 +- webpack.config.mjs | 24 +++-- 3 files changed, 256 insertions(+), 32 deletions(-) diff --git a/package-lock.json b/package-lock.json index 91afcc1..49da78e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,11 +13,11 @@ "babel-loader": "^10.0.0", "babel-plugin-inline-import": "^3.0.0", "buffer": "^6.0.3", + "copy-webpack-plugin": "^11.0.0", "css-loader": "^7.1.2", "eslint": "^9.39.2", "globals": "^17.1.0", "html-webpack-plugin": "^5.6.6", - "mini-css-extract-plugin": "^2.9.4", "neostandard": "^0.13.0", "node-polyfill-webpack-plugin": "^4.1.0", "rdflib": "^2.3.5", @@ -2103,6 +2103,44 @@ "url": "https://paulmillr.com/funding/" } }, + "node_modules/@nodelib/fs.scandir": { + "version": "2.1.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", + "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.stat": "2.0.5", + "run-parallel": "^1.1.9" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.stat": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", + "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.walk": { + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", + "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.scandir": "2.1.5", + "fastq": "^1.6.0" + }, + "engines": { + "node": ">= 8" + } + }, "node_modules/@peculiar/asn1-cms": { "version": "2.6.0", "resolved": "https://registry.npmjs.org/@peculiar/asn1-cms/-/asn1-cms-2.6.0.tgz", @@ -4393,6 +4431,41 @@ "dev": true, "license": "MIT" }, + "node_modules/copy-webpack-plugin": { + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-11.0.0.tgz", + "integrity": "sha512-fX2MWpamkW0hZxMEg0+mYnA40LTosOSa5TqZ9GYIBzyJa9C3QUaMPSE2xAi/buNr8u89SfD9wHSQVBzrRa/SOQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "fast-glob": "^3.2.11", + "glob-parent": "^6.0.1", + "globby": "^13.1.1", + "normalize-path": "^3.0.0", + "schema-utils": "^4.0.0", + "serialize-javascript": "^6.0.0" + }, + "engines": { + "node": ">= 14.15.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + }, + "peerDependencies": { + "webpack": "^5.1.0" + } + }, + "node_modules/copy-webpack-plugin/node_modules/serialize-javascript": { + "version": "6.0.2", + "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz", + "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==", + "dev": true, + "license": "BSD-3-Clause", + "dependencies": { + "randombytes": "^2.1.0" + } + }, "node_modules/core-js": { "version": "3.47.0", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.47.0.tgz", @@ -4847,6 +4920,19 @@ "dev": true, "license": "MIT" }, + "node_modules/dir-glob": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz", + "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==", + "dev": true, + "license": "MIT", + "dependencies": { + "path-type": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/dns-packet": { "version": "5.6.1", "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz", @@ -5726,6 +5812,36 @@ "dev": true, "license": "MIT" }, + "node_modules/fast-glob": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz", + "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.stat": "^2.0.2", + "@nodelib/fs.walk": "^1.2.3", + "glob-parent": "^5.1.2", + "merge2": "^1.3.0", + "micromatch": "^4.0.8" + }, + "engines": { + "node": ">=8.6.0" + } + }, + "node_modules/fast-glob/node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "license": "ISC", + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/fast-json-stable-stringify": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz", @@ -5767,6 +5883,16 @@ "node": ">= 4.9.1" } }, + "node_modules/fastq": { + "version": "1.20.1", + "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz", + "integrity": "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==", + "dev": true, + "license": "ISC", + "dependencies": { + "reusify": "^1.0.4" + } + }, "node_modules/faye-websocket": { "version": "0.11.4", "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz", @@ -6179,6 +6305,26 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/globby": { + "version": "13.2.2", + "resolved": "https://registry.npmjs.org/globby/-/globby-13.2.2.tgz", + "integrity": "sha512-Y1zNGV+pzQdh7H39l9zgB4PJqjRNqydvdYCDG4HFXM4XuvSaQQlEc91IU1yALL8gUTDomgBAfz3XJdmUS+oo0w==", + "dev": true, + "license": "MIT", + "dependencies": { + "dir-glob": "^3.0.1", + "fast-glob": "^3.3.0", + "ignore": "^5.2.4", + "merge2": "^1.4.1", + "slash": "^4.0.0" + }, + "engines": { + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/globrex": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/globrex/-/globrex-0.1.2.tgz", @@ -7744,6 +7890,16 @@ "dev": true, "license": "MIT" }, + "node_modules/merge2": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", + "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 8" + } + }, "node_modules/methods": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz", @@ -7842,27 +7998,6 @@ "url": "https://opencollective.com/express" } }, - "node_modules/mini-css-extract-plugin": { - "version": "2.10.1", - "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.10.1.tgz", - "integrity": "sha512-k7G3Y5QOegl380tXmZ68foBRRjE9Ljavx835ObdvmZjQ639izvZD8CS7BkWw1qKPPzHsGL/JDhl0uyU1zc2rJw==", - "dev": true, - "license": "MIT", - "dependencies": { - "schema-utils": "^4.0.0", - "tapable": "^2.2.1" - }, - "engines": { - "node": ">= 12.13.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/webpack" - }, - "peerDependencies": { - "webpack": "^5.0.0" - } - }, "node_modules/minimalistic-assert": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz", @@ -8638,6 +8773,16 @@ "dev": true, "license": "MIT" }, + "node_modules/path-type": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", + "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, "node_modules/pbkdf2": { "version": "3.1.5", "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.1.5.tgz", @@ -9002,6 +9147,27 @@ "node": ">=0.4.x" } }, + "node_modules/queue-microtask": { + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", + "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT" + }, "node_modules/randombytes": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz", @@ -9405,6 +9571,17 @@ "node": ">= 4" } }, + "node_modules/reusify": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz", + "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==", + "dev": true, + "license": "MIT", + "engines": { + "iojs": ">=1.0.0", + "node": ">=0.10.0" + } + }, "node_modules/ripemd160": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.3.tgz", @@ -9495,6 +9672,30 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/run-parallel": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", + "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT", + "dependencies": { + "queue-microtask": "^1.2.2" + } + }, "node_modules/safe-array-concat": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz", @@ -10062,6 +10263,19 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/slash": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/slash/-/slash-4.0.0.tgz", + "integrity": "sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/sockjs": { "version": "0.3.24", "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz", diff --git a/package.json b/package.json index 633922d..74cf4a6 100644 --- a/package.json +++ b/package.json @@ -10,10 +10,10 @@ "default": "./lib/meeting-pane.js" }, "./styles.css": { - "default": "./lib/meeting-pane.css" + "default": "./lib/styles/meetingPane.css" } }, - "style": "lib/meeting-pane.css", + "style": "lib/styles/meetingPane.css", "sideEffects": [ "**/*.css" ], @@ -68,6 +68,7 @@ "babel-loader": "^10.0.0", "babel-plugin-inline-import": "^3.0.0", "buffer": "^6.0.3", + "copy-webpack-plugin": "^11.0.0", "css-loader": "^7.1.2", "eslint": "^9.39.2", "globals": "^17.1.0", @@ -77,7 +78,6 @@ "rdflib": "^2.3.5", "solid-logic": "^4.0.2", "solid-ui": "^3.0.3", - "mini-css-extract-plugin": "^2.9.4", "terser-webpack-plugin": "^5.3.6", "typescript": "^5.9.3", "webpack": "^5.104.1", diff --git a/webpack.config.mjs b/webpack.config.mjs index 5b22b23..83a8902 100644 --- a/webpack.config.mjs +++ b/webpack.config.mjs @@ -1,9 +1,9 @@ import path from 'path' import NodePolyfillPlugin from 'node-polyfill-webpack-plugin' -import { getModuleRules } from './webpack.module.rules.mjs' +import { moduleRules } from './webpack.module.rules.mjs' import { createRequire } from 'module' import TerserPlugin from 'terser-webpack-plugin' -import MiniCssExtractPlugin from 'mini-css-extract-plugin' +import CopyPlugin from 'copy-webpack-plugin' const require = createRequire(import.meta.url) @@ -24,7 +24,7 @@ const common = { new NodePolyfillPlugin() ], module: { - rules: getModuleRules(MiniCssExtractPlugin.loader), + rules: moduleRules, }, externals: { 'solid-ui': 'UI', @@ -56,8 +56,13 @@ const normalConfig = { }, plugins: [ ...(common.plugins || []), - new MiniCssExtractPlugin({ - filename: 'meeting-pane.css', + new CopyPlugin({ + patterns: [ + { + from: path.resolve('src/styles'), + to: path.resolve('lib/styles'), + }, + ], }), ], optimization: { @@ -81,8 +86,13 @@ const minConfig = { }, plugins: [ ...(common.plugins || []), - new MiniCssExtractPlugin({ - filename: 'meeting-pane.css', + new CopyPlugin({ + patterns: [ + { + from: path.resolve('src/styles'), + to: path.resolve('lib/styles'), + }, + ], }), ], optimization: { From c67ca2d42ba1fd5ef088c0aea296976a72c9d04f Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Thu, 12 Mar 2026 07:03:51 +1100 Subject: [PATCH 13/24] updated package json to match profile --- package.json | 13 +------------ 1 file changed, 1 insertion(+), 12 deletions(-) diff --git a/package.json b/package.json index 74cf4a6..30b70cf 100644 --- a/package.json +++ b/package.json @@ -3,23 +3,12 @@ "version": "3.0.1", "description": "Solid-compatible Panes: meeting collaborative tool", "main": "lib/meeting-pane.js", - "types": "index.d.ts", - "exports": { - ".": { - "types": "./index.d.ts", - "default": "./lib/meeting-pane.js" - }, - "./styles.css": { - "default": "./lib/styles/meetingPane.css" - } - }, - "style": "lib/styles/meetingPane.css", + "types": "lib/index.d.ts", "sideEffects": [ "**/*.css" ], "files": [ "lib/", - "index.d.ts", "README.md", "LICENSE" ], From 5e1e673da789e30163bd112f64a5c85b6b9f3d02 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Thu, 12 Mar 2026 12:04:44 +1100 Subject: [PATCH 14/24] change yellow class to highlighted --- src/styles/meetingPane.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/meetingPane.css b/src/styles/meetingPane.css index 6602803..f0d74d1 100644 --- a/src/styles/meetingPane.css +++ b/src/styles/meetingPane.css @@ -47,7 +47,7 @@ display: inline-block !important; opacity: 100% !important; } -.meetingPane .meetingToolIcon-yellow { +.meetingPane .meetingToolIcon-highlighted { background-color: yellow; } From 406776b4c226fe4ce6aa364ca3b7e725dd3f0c29 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Mon, 16 Mar 2026 13:40:21 +1100 Subject: [PATCH 15/24] gen ai message --- README.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/README.md b/README.md index 6f56c83..ebfba85 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,14 @@ # meeting-pane Bring together schedule, people, materials, discussion around a meeting. + +## Genertive AI usage +The SolidOS team is using GitHub Copilot integrated in Visual Studio Code. +We have added comments in the code to make it explicit which parts are 100% written by AI. +Example: +* Some code was generated by the GPT-5.3-Codex model in GitHub Copilot based on the following prompt: +* I have these classes meetingToolIcon, meetingToolIcon-visible, meetingToolIconAddButton, meetingToolIcon-disabled, meetingToolIcon-yellow. I want to toggle the visibility of the icons by adding or removing the class meetingToolIcon-visible. Write a function that takes a boolean showIcons and toggles the class on all the icons in iconArray accordingly. +* the icons are way too big and they are lined up vertically +instead of horizontally. Can you fix that? +* also icon sizing - the icons should be about an inch big + From d7e4d52413ca7a2ee7c2909abe8afd916e0d7f08 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Mon, 16 Mar 2026 13:40:58 +1100 Subject: [PATCH 16/24] gen ai msg in code --- src/index.js | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) diff --git a/src/index.js b/src/index.js index a71c9c5..32ff8d6 100644 --- a/src/index.js +++ b/src/index.js @@ -7,6 +7,7 @@ import * as $rdf from 'rdflib' import { meetingDetailsFormText } from './meetingDetailsForm.ttl' import { solidLogicSingleton, authn } from 'solid-logic' import './styles/meetingPane.css' +import './styles/utilities.css' const { typeIndex } = solidLogicSingleton const { loadTypeIndexesFor } = typeIndex @@ -860,6 +861,11 @@ export default { star.setAttribute('src', UI.icons.iconBase + 'noun_19460_green.svg') // noun_272948.svg star.setAttribute('title', 'Add another tool to the meeting') + // This code was generated by Generative AI (GPT-5.3-Codex in GitHub Copilot) based on the following prompt: + // I have these classes meetingToolIcon, meetingToolIcon-visible, meetingToolIconAddButton, + // meetingToolIcon-disabled, meetingToolIcon-yellow. I want to toggle the visibility of + // the icons by adding or removing the class meetingToolIcon-visible. Write a function + // that takes a boolean showIcons and toggles the class on all the icons in iconArray accordingly. const toggleIconsVisibility = function (showIcons) { for (let i = 0; i < iconArray.length; i++) { iconArray[i].classList.toggle('meetingToolIcon-visible', showIcons) @@ -868,9 +874,10 @@ export default { const selectNewTool = function (_event) { visible = !visible - star.classList.toggle('meetingToolIcon-yellow', visible) + star.classList.toggle('meetingToolIcon-highlighted', visible) toggleIconsVisibility(visible) } + // end ai generated code let loginOutButton authn.checkUser().then(webId => { @@ -920,17 +927,17 @@ export default { const resetTools = function () { visible = false toggleIconsVisibility(false) - star.classList.remove('meetingToolIcon-yellow') + star.classList.remove('meetingToolIcon-highlighted') } const selectTool = function (icon) { visible = false toggleIconsVisibility(false) for (let i = 0; i < iconArray.length; i++) { - iconArray[i].classList.remove('meetingToolIcon-yellow') + iconArray[i].classList.remove('meetingToolIcon-highlighted') } - icon.classList.add('meetingToolIcon-visible', 'meetingToolIcon-yellow') - star.classList.remove('meetingToolIcon-yellow') + icon.classList.add('meetingToolIcon-visible', 'meetingToolIcon-highlighted') + star.classList.remove('meetingToolIcon-highlighted') } // ////////////////////////////// From 24273e352eb0c1f936bde1ccd497bb91dcd48366 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Mon, 16 Mar 2026 13:41:15 +1100 Subject: [PATCH 17/24] style vars --- src/styles/meetingPane.css | 46 +++++++++++++++++++++----------------- src/styles/utilities.css | 5 +++++ 2 files changed, 30 insertions(+), 21 deletions(-) create mode 100644 src/styles/utilities.css diff --git a/src/styles/meetingPane.css b/src/styles/meetingPane.css index f0d74d1..4013b54 100644 --- a/src/styles/meetingPane.css +++ b/src/styles/meetingPane.css @@ -1,3 +1,7 @@ +/* Some of the CSS code below was generated by Generative AI (GPT-5.3-Codex in GitHub Copilot) based on the following prompt: +the icons are way too big and they are lined up vertically +instead of horizontally. Can you fix that? */ +/* also icon sizing - the icons should be about an inch big */ .meetingPaneTable { border-collapse: collapse; width: 100%; @@ -25,17 +29,17 @@ flex-wrap: nowrap !important; align-items: center !important; justify-content: flex-start !important; - gap: 1em; + gap: var(--spacing-md, 1em); } .meetingPane .meetingToolIcon { box-sizing: border-box; padding: 0 !important; - width: 3.1em; - height: 3.1em; - min-width: 3.1em; - min-height: 3.1em; - margin: 0.5em !important; + width: var(--icon-xl, 3.1em); + height: var(--icon-xl, 3.1em); + min-width: var(--icon-xl, 3.1em); + min-height: var(--icon-xl, 3.1em); + margin: var(--spacing-xs, 0.5em) !important; opacity: 50%; display: none !important; vertical-align: middle; @@ -57,21 +61,21 @@ .meetingPane .meetingToolIconAddButton { padding: 0 !important; - margin: 0.5em !important; - width: 3.1em !important; - height: 3.1em !important; - max-width: 3.1em !important; - max-height: 3.1em !important; - min-width: 3.1em !important; - min-height: 3.1em !important; + margin: var(--spacing-xs, 0.5em) !important; + width: var(--icon-xl, 3.1em) !important; + height: var(--icon-xl, 3.1em) !important; + max-width: var(--icon-xl, 3.1em) !important; + max-height: var(--icon-xl, 3.1em) !important; + min-width: var(--icon-xl, 3.1em) !important; + min-height: var(--icon-xl, 3.1em) !important; } .meetingToolLabel { margin-left: 0.7em; } .meetingToolIconImg { - width: 1.5em; - height: 1.5em; + width: var(--icon-xs, 1.5em); + height: var(--icon-xs, 1.5em); } .meetingToolTip { @@ -80,8 +84,8 @@ color: #888; } .meetingPaneDeleteButton { - width: 1.5em; - height: 1.5em; + width: var(--icon-xs, 1.5em); + height: var(--icon-xs, 1.5em); } .meetingPaneIframe { border: none; @@ -91,13 +95,13 @@ width: 100%; } .meetingToolIconSpawn { - height: 2em; - width: 2em; + height: var(--icon-base, 2em); + width: var(--icon-base, 2em); margin: var(--spacing-xs, 0.5em); } .meetingToolIconForkGithub { - height: 2em; - width: 2em; + height: var(--icon-base, 2em); + width: var(--icon-base, 2em); margin: var(--spacing-xs, 0.5em); opacity: 50%; } diff --git a/src/styles/utilities.css b/src/styles/utilities.css new file mode 100644 index 0000000..6c860a4 --- /dev/null +++ b/src/styles/utilities.css @@ -0,0 +1,5 @@ +:root { + --icon-xs: 1.5em; + --icon-base: 2em; + --icon-xl: 3.1em; +} \ No newline at end of file From f25246b8ce857acd7ac49fbe70dbad3e6665122c Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Mon, 16 Mar 2026 16:22:22 +1100 Subject: [PATCH 18/24] fix lint errors --- src/index.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/index.js b/src/index.js index 32ff8d6..af8f4f9 100644 --- a/src/index.js +++ b/src/index.js @@ -862,10 +862,10 @@ export default { star.setAttribute('title', 'Add another tool to the meeting') // This code was generated by Generative AI (GPT-5.3-Codex in GitHub Copilot) based on the following prompt: - // I have these classes meetingToolIcon, meetingToolIcon-visible, meetingToolIconAddButton, - // meetingToolIcon-disabled, meetingToolIcon-yellow. I want to toggle the visibility of - // the icons by adding or removing the class meetingToolIcon-visible. Write a function - // that takes a boolean showIcons and toggles the class on all the icons in iconArray accordingly. + // I have these classes meetingToolIcon, meetingToolIcon-visible, meetingToolIconAddButton, + // meetingToolIcon-disabled, meetingToolIcon-yellow. I want to toggle the visibility of + // the icons by adding or removing the class meetingToolIcon-visible. Write a function + // that takes a boolean showIcons and toggles the class on all the icons in iconArray accordingly. const toggleIconsVisibility = function (showIcons) { for (let i = 0; i < iconArray.length; i++) { iconArray[i].classList.toggle('meetingToolIcon-visible', showIcons) From 50e5ad1738c2d9d36a82fdb08022478c54d92bf9 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Mon, 16 Mar 2026 17:07:06 +1100 Subject: [PATCH 19/24] remove dup build --- README.md | 4 ++++ package.json | 1 - webpack.config.mjs | 17 ----------------- 3 files changed, 4 insertions(+), 18 deletions(-) diff --git a/README.md b/README.md index ebfba85..1bc0fab 100644 --- a/README.md +++ b/README.md @@ -2,6 +2,10 @@ Bring together schedule, people, materials, discussion around a meeting. +## Styles +Styles are imported by the pane and bundled into the JavaScript build. +Consumers should import the pane module only; no separate CSS import is required. + ## Genertive AI usage The SolidOS team is using GitHub Copilot integrated in Visual Studio Code. We have added comments in the code to make it explicit which parts are 100% written by AI. diff --git a/package.json b/package.json index 30b70cf..0c421e4 100644 --- a/package.json +++ b/package.json @@ -57,7 +57,6 @@ "babel-loader": "^10.0.0", "babel-plugin-inline-import": "^3.0.0", "buffer": "^6.0.3", - "copy-webpack-plugin": "^11.0.0", "css-loader": "^7.1.2", "eslint": "^9.39.2", "globals": "^17.1.0", diff --git a/webpack.config.mjs b/webpack.config.mjs index 83a8902..fb41f94 100644 --- a/webpack.config.mjs +++ b/webpack.config.mjs @@ -3,7 +3,6 @@ import NodePolyfillPlugin from 'node-polyfill-webpack-plugin' import { moduleRules } from './webpack.module.rules.mjs' import { createRequire } from 'module' import TerserPlugin from 'terser-webpack-plugin' -import CopyPlugin from 'copy-webpack-plugin' const require = createRequire(import.meta.url) @@ -56,14 +55,6 @@ const normalConfig = { }, plugins: [ ...(common.plugins || []), - new CopyPlugin({ - patterns: [ - { - from: path.resolve('src/styles'), - to: path.resolve('lib/styles'), - }, - ], - }), ], optimization: { minimize: false, @@ -86,14 +77,6 @@ const minConfig = { }, plugins: [ ...(common.plugins || []), - new CopyPlugin({ - patterns: [ - { - from: path.resolve('src/styles'), - to: path.resolve('lib/styles'), - }, - ], - }), ], optimization: { minimize: true, From 8ef6c82f121260fb988e25b72f79c96d50a88031 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Mon, 16 Mar 2026 21:05:53 +1100 Subject: [PATCH 20/24] revert back to meetingPane --- src/{index.js => meetingPane.js} | 0 webpack.config.mjs | 2 +- 2 files changed, 1 insertion(+), 1 deletion(-) rename src/{index.js => meetingPane.js} (100%) diff --git a/src/index.js b/src/meetingPane.js similarity index 100% rename from src/index.js rename to src/meetingPane.js diff --git a/webpack.config.mjs b/webpack.config.mjs index fb41f94..abbb02b 100644 --- a/webpack.config.mjs +++ b/webpack.config.mjs @@ -8,7 +8,7 @@ const require = createRequire(import.meta.url) const common = { mode: 'production', - entry: './src/index.js', + entry: './src/meetingPane.js', output: { path: path.resolve(process.cwd(), 'lib'), filename: 'meetingPane.js', From 6fb7f24c529d5b67ab40495d364b6f1ae913dfe9 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Thu, 19 Mar 2026 12:03:56 +1100 Subject: [PATCH 21/24] add copy plugins --- README.md | 4 - package-lock.json | 227 +++------------------------------------------ package.json | 5 +- webpack.config.mjs | 17 ++++ 4 files changed, 33 insertions(+), 220 deletions(-) diff --git a/README.md b/README.md index 1bc0fab..ebfba85 100644 --- a/README.md +++ b/README.md @@ -2,10 +2,6 @@ Bring together schedule, people, materials, discussion around a meeting. -## Styles -Styles are imported by the pane and bundled into the JavaScript build. -Consumers should import the pane module only; no separate CSS import is required. - ## Genertive AI usage The SolidOS team is using GitHub Copilot integrated in Visual Studio Code. We have added comments in the code to make it explicit which parts are 100% written by AI. diff --git a/package-lock.json b/package-lock.json index 03dc7ae..a35c90d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,7 +13,7 @@ "babel-loader": "^10.0.0", "babel-plugin-inline-import": "^3.0.0", "buffer": "^6.0.3", - "copy-webpack-plugin": "^11.0.0", + "copy-webpack-plugin": "^14.0.0", "css-loader": "^7.1.2", "eslint": "^9.39.2", "globals": "^17.1.0", @@ -2103,44 +2103,6 @@ "url": "https://paulmillr.com/funding/" } }, - "node_modules/@nodelib/fs.scandir": { - "version": "2.1.5", - "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", - "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", - "dev": true, - "license": "MIT", - "dependencies": { - "@nodelib/fs.stat": "2.0.5", - "run-parallel": "^1.1.9" - }, - "engines": { - "node": ">= 8" - } - }, - "node_modules/@nodelib/fs.stat": { - "version": "2.0.5", - "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", - "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">= 8" - } - }, - "node_modules/@nodelib/fs.walk": { - "version": "1.2.8", - "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", - "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", - "dev": true, - "license": "MIT", - "dependencies": { - "@nodelib/fs.scandir": "2.1.5", - "fastq": "^1.6.0" - }, - "engines": { - "node": ">= 8" - } - }, "node_modules/@peculiar/asn1-cms": { "version": "2.6.0", "resolved": "https://registry.npmjs.org/@peculiar/asn1-cms/-/asn1-cms-2.6.0.tgz", @@ -4432,21 +4394,20 @@ "license": "MIT" }, "node_modules/copy-webpack-plugin": { - "version": "11.0.0", - "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-11.0.0.tgz", - "integrity": "sha512-fX2MWpamkW0hZxMEg0+mYnA40LTosOSa5TqZ9GYIBzyJa9C3QUaMPSE2xAi/buNr8u89SfD9wHSQVBzrRa/SOQ==", + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-14.0.0.tgz", + "integrity": "sha512-3JLW90aBGeaTLpM7mYQKpnVdgsUZRExY55giiZgLuX/xTQRUs1dOCwbBnWnvY6Q6rfZoXMNwzOQJCSZPppfqXA==", "dev": true, "license": "MIT", "dependencies": { - "fast-glob": "^3.2.11", "glob-parent": "^6.0.1", - "globby": "^13.1.1", "normalize-path": "^3.0.0", - "schema-utils": "^4.0.0", - "serialize-javascript": "^6.0.0" + "schema-utils": "^4.2.0", + "serialize-javascript": "^7.0.3", + "tinyglobby": "^0.2.12" }, "engines": { - "node": ">= 14.15.0" + "node": ">= 20.9.0" }, "funding": { "type": "opencollective", @@ -4457,13 +4418,13 @@ } }, "node_modules/copy-webpack-plugin/node_modules/serialize-javascript": { - "version": "6.0.2", - "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz", - "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==", + "version": "7.0.4", + "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-7.0.4.tgz", + "integrity": "sha512-DuGdB+Po43Q5Jxwpzt1lhyFSYKryqoNjQSA9M92tyw0lyHIOur+XCalOUe0KTJpyqzT8+fQ5A0Jf7vCx/NKmIg==", "dev": true, "license": "BSD-3-Clause", - "dependencies": { - "randombytes": "^2.1.0" + "engines": { + "node": ">=20.0.0" } }, "node_modules/core-js": { @@ -4920,19 +4881,6 @@ "dev": true, "license": "MIT" }, - "node_modules/dir-glob": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz", - "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==", - "dev": true, - "license": "MIT", - "dependencies": { - "path-type": "^4.0.0" - }, - "engines": { - "node": ">=8" - } - }, "node_modules/dns-packet": { "version": "5.6.1", "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz", @@ -5812,36 +5760,6 @@ "dev": true, "license": "MIT" }, - "node_modules/fast-glob": { - "version": "3.3.3", - "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz", - "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==", - "dev": true, - "license": "MIT", - "dependencies": { - "@nodelib/fs.stat": "^2.0.2", - "@nodelib/fs.walk": "^1.2.3", - "glob-parent": "^5.1.2", - "merge2": "^1.3.0", - "micromatch": "^4.0.8" - }, - "engines": { - "node": ">=8.6.0" - } - }, - "node_modules/fast-glob/node_modules/glob-parent": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", - "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", - "dev": true, - "license": "ISC", - "dependencies": { - "is-glob": "^4.0.1" - }, - "engines": { - "node": ">= 6" - } - }, "node_modules/fast-json-stable-stringify": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz", @@ -5883,16 +5801,6 @@ "node": ">= 4.9.1" } }, - "node_modules/fastq": { - "version": "1.20.1", - "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz", - "integrity": "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==", - "dev": true, - "license": "ISC", - "dependencies": { - "reusify": "^1.0.4" - } - }, "node_modules/faye-websocket": { "version": "0.11.4", "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz", @@ -6305,26 +6213,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/globby": { - "version": "13.2.2", - "resolved": "https://registry.npmjs.org/globby/-/globby-13.2.2.tgz", - "integrity": "sha512-Y1zNGV+pzQdh7H39l9zgB4PJqjRNqydvdYCDG4HFXM4XuvSaQQlEc91IU1yALL8gUTDomgBAfz3XJdmUS+oo0w==", - "dev": true, - "license": "MIT", - "dependencies": { - "dir-glob": "^3.0.1", - "fast-glob": "^3.3.0", - "ignore": "^5.2.4", - "merge2": "^1.4.1", - "slash": "^4.0.0" - }, - "engines": { - "node": "^12.20.0 || ^14.13.1 || >=16.0.0" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/globrex": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/globrex/-/globrex-0.1.2.tgz", @@ -7890,16 +7778,6 @@ "dev": true, "license": "MIT" }, - "node_modules/merge2": { - "version": "1.4.1", - "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", - "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">= 8" - } - }, "node_modules/methods": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz", @@ -8773,16 +8651,6 @@ "dev": true, "license": "MIT" }, - "node_modules/path-type": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", - "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=8" - } - }, "node_modules/pbkdf2": { "version": "3.1.5", "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.1.5.tgz", @@ -9147,27 +9015,6 @@ "node": ">=0.4.x" } }, - "node_modules/queue-microtask": { - "version": "1.2.3", - "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", - "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", - "dev": true, - "funding": [ - { - "type": "github", - "url": "https://github.com/sponsors/feross" - }, - { - "type": "patreon", - "url": "https://www.patreon.com/feross" - }, - { - "type": "consulting", - "url": "https://feross.org/support" - } - ], - "license": "MIT" - }, "node_modules/randombytes": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz", @@ -9571,17 +9418,6 @@ "node": ">= 4" } }, - "node_modules/reusify": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz", - "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==", - "dev": true, - "license": "MIT", - "engines": { - "iojs": ">=1.0.0", - "node": ">=0.10.0" - } - }, "node_modules/ripemd160": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.3.tgz", @@ -9672,30 +9508,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/run-parallel": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", - "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", - "dev": true, - "funding": [ - { - "type": "github", - "url": "https://github.com/sponsors/feross" - }, - { - "type": "patreon", - "url": "https://www.patreon.com/feross" - }, - { - "type": "consulting", - "url": "https://feross.org/support" - } - ], - "license": "MIT", - "dependencies": { - "queue-microtask": "^1.2.2" - } - }, "node_modules/safe-array-concat": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz", @@ -10263,19 +10075,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/slash": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/slash/-/slash-4.0.0.tgz", - "integrity": "sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/sockjs": { "version": "0.3.24", "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz", diff --git a/package.json b/package.json index 0c421e4..7f0e183 100644 --- a/package.json +++ b/package.json @@ -57,6 +57,7 @@ "babel-loader": "^10.0.0", "babel-plugin-inline-import": "^3.0.0", "buffer": "^6.0.3", + "copy-webpack-plugin": "^14.0.0", "css-loader": "^7.1.2", "eslint": "^9.39.2", "globals": "^17.1.0", @@ -66,11 +67,11 @@ "rdflib": "^2.3.5", "solid-logic": "^4.0.2", "solid-ui": "^3.0.3", + "style-loader": "^4.0.0", "terser-webpack-plugin": "^5.3.6", "typescript": "^5.9.3", "webpack": "^5.104.1", "webpack-cli": "^6.0.1", - "webpack-dev-server": "^5.2.3", - "style-loader": "^4.0.0" + "webpack-dev-server": "^5.2.3" } } diff --git a/webpack.config.mjs b/webpack.config.mjs index abbb02b..f3ececb 100644 --- a/webpack.config.mjs +++ b/webpack.config.mjs @@ -3,6 +3,7 @@ import NodePolyfillPlugin from 'node-polyfill-webpack-plugin' import { moduleRules } from './webpack.module.rules.mjs' import { createRequire } from 'module' import TerserPlugin from 'terser-webpack-plugin' +import CopyPlugin from 'copy-webpack-plugin' const require = createRequire(import.meta.url) @@ -55,6 +56,14 @@ const normalConfig = { }, plugins: [ ...(common.plugins || []), + new CopyPlugin({ + patterns: [ + { + from: path.resolve('src/styles'), + to: path.resolve('lib/styles'), + }, + ], + }), ], optimization: { minimize: false, @@ -77,6 +86,14 @@ const minConfig = { }, plugins: [ ...(common.plugins || []), + new CopyPlugin({ + patterns: [ + { + from: path.resolve('src/styles'), + to: path.resolve('lib/styles'), + }, + ], + }), ], optimization: { minimize: true, From d86b1cc865e66c7895dbf0a0524ea7d268fbc136 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Thu, 19 Mar 2026 14:38:29 +1100 Subject: [PATCH 22/24] wrong filename in dev index --- dev/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dev/index.js b/dev/index.js index ae30c37..45af2d0 100644 --- a/dev/index.js +++ b/dev/index.js @@ -1,5 +1,5 @@ import * as logic from 'solid-logic' -import MeetingPane from '../src/index' +import MeetingPane from '../src/meetingPane' import * as $rdf from 'rdflib' import * as UI from 'solid-ui' import './dev-global.css' From ec438c54936328470b709f78893630125444b50d Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Thu, 19 Mar 2026 14:39:18 +1100 Subject: [PATCH 23/24] wrong filename in dev index --- dev/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dev/index.js b/dev/index.js index ae30c37..45af2d0 100644 --- a/dev/index.js +++ b/dev/index.js @@ -1,5 +1,5 @@ import * as logic from 'solid-logic' -import MeetingPane from '../src/index' +import MeetingPane from '../src/meetingPane' import * as $rdf from 'rdflib' import * as UI from 'solid-ui' import './dev-global.css' From 4aa056d6ba7cc6bee26d73501cce7aeb75e1a1e1 Mon Sep 17 00:00:00 2001 From: Sharon Stratsianis Date: Thu, 19 Mar 2026 16:28:05 +1100 Subject: [PATCH 24/24] resolve participant render error --- src/meetingPane.js | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/src/meetingPane.js b/src/meetingPane.js index af8f4f9..1f0a65e 100644 --- a/src/meetingPane.js +++ b/src/meetingPane.js @@ -1075,20 +1075,31 @@ export default { authn.checkUser().then(webId => { if (webId) { - loadTypeIndexesFor(kb.sym(webId)).then(function () { + const meNode = typeof webId === 'string' ? kb.sym(webId) : webId + loadTypeIndexesFor(meNode).then(function (scopes) { // Assumes that the type index has an entry for addressbook + const privateScope = scopes.find(scope => scope.label === 'private') + const chosenScope = privateScope || scopes[0] + if (!chosenScope || !chosenScope.index) { + complain('No type index available for this user to load participants.') + return + } const options = { defaultNewGroupName: 'Meeting Participants', selectedGroup } const picker = new UI.widgets.PeoplePicker( context.div, - context.index.private[0], + chosenScope.index, groupPickedCb, options ) picker.render() + }).catch(function (err) { + complain('Could not load type indexes for participants: ' + err) }) + } else { + complain('Please log in to manage meeting participants.') } }) }