@massimo-cassandro/minimo 1.43.0 → 1.43.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/design-tokens/_src/table.minimo.tokens.mjs +16 -2
  2. package/dev-tools/starter-kit/source_files/app/CLAUDE.md +1 -0
  3. package/dev-tools/starter-kit/source_files/root/CLAUDE.md +1 -0
  4. package/dev-tools/starter-kit/source_files/root/_gitignore +1 -0
  5. package/dev-tools/starter-kit/source_files/root/_reports/.hintrc +12 -0
  6. package/dev-tools/starter-kit/source_files/root/_reports/README.md +45 -0
  7. package/dev-tools/starter-kit/source_files/root/_reports/_package.json +9 -0
  8. package/dev-tools/starter-kit/source_files/root/package-tpl.json +1 -1
  9. package/dev-tools/starter-kit/starter-install.sh +4 -4
  10. package/package.json +1 -1
  11. package/src/css/table.css +12 -9
  12. package/src/custom-properties.css +8 -5
  13. package/src/web-components/json-table/json-table.minimo.tokens.mjs +1 -1
  14. package/src/web-components/json-table/jt-docs.md +1 -1
  15. package/types/classes.d.ts +0 -1
package/design-tokens/_src/table.minimo.tokens.mjs CHANGED
@@ -12,7 +12,11 @@ export default {
12
12
  $type: 'dimension',
13
13
  $value: '3px'
14
14
  }
15
- }
15
+ },
16
+ 'vertical-align': {
17
+ $type: 'string',
18
+ $value: 'middle',
19
+ },
16
20
  },
17
21
  tfoot: {
18
22
  background: {
@@ -32,10 +36,15 @@ export default {
32
36
  $type: 'fontWeight',
33
37
  $value: '{font.weight.semibold}',
34
38
  }
39
+ },
40
+ 'vertical-align': {
41
+ $type: 'string',
42
+ $value: 'middle',
43
+
35
44
  }
36
45
  },
37
46
 
38
- body: {
47
+ tbody: {
39
48
  background: {
40
49
  color: null
41
50
  },
@@ -45,6 +54,11 @@ export default {
45
54
  $value: '1px'
46
55
  }
47
56
  },
57
+ 'vertical-align': {
58
+ $type: 'string',
59
+ $value: 'middle',
60
+
61
+ },
48
62
  tr: {
49
63
  'alt-bg-color': {
50
64
  $type: 'color',
package/dev-tools/starter-kit/source_files/app/CLAUDE.md CHANGED
@@ -15,3 +15,4 @@
15
15
  - nei commenti jsDoc aggiungere sempre dove possibile una sezione example che riepiloghi i vari parametri mostrando i valori di default
16
16
  - commenti nel codice (inclusi TODO/FIX e jsDoc) e file README vanno scritti sempre in italiano; gli identificatori restano in inglese
17
17
  - nei documenti markdown generati non andare a capo forzatamente alla fine di ogni riga: un paragrafo è una sola riga, così si usa il soft wrap dell'editor ed è più semplice fare correzioni
18
+ - Le tabelle nei file `.md` devono avere le celle allineate con spazi (colonne di larghezza uniforme, separatore `---` della stessa larghezza), in modo da essere leggibili anche in modalità editor.
package/dev-tools/starter-kit/source_files/root/CLAUDE.md CHANGED
@@ -7,3 +7,4 @@
7
7
  Backend in symfony, frontend nella dir `/app`
8
8
 
9
9
  vedi anche `app/CLAUDE.md`
10
+
package/dev-tools/starter-kit/source_files/root/_gitignore CHANGED
@@ -20,6 +20,7 @@
20
20
  # frontend
21
21
  node_modules
22
22
  _private
23
+ _reports/**/*.html
23
24
  public/_dev
24
25
  unresolved-unused-props.md
25
26
  orphan-classes.md
package/dev-tools/starter-kit/source_files/root/_reports/.hintrc ADDED
@@ -0,0 +1,12 @@
1
+ {
2
+ "extends": ["development"],
3
+ "connector": {
4
+ "name": "puppeteer",
5
+ "options": {
6
+ "headless": true,
7
+ "puppeteerOptions": {
8
+ "executablePath": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
9
+ }
10
+ }
11
+ }
12
+ }
package/dev-tools/starter-kit/source_files/root/_reports/README.md ADDED
@@ -0,0 +1,45 @@
1
+ # Report Lighthouse / webhint
2
+
3
+ Cartella ignorata da git. Gli script sono in `package.json` di questa cartella;
4
+ `lighthouse` e `hint` sono devDependencies del progetto (root).
5
+
6
+ ## Installazione
7
+
8
+ ```
9
+ npm i -D lighthouse hint
10
+ ```
11
+
12
+ ## Step
13
+
14
+ Dalla root del progetto (o dentro `_reports`, senza `--prefix`):
15
+
16
+ 1. Build di produzione: `npm run --prefix _reports "webpack PROD"`
17
+ 2. Avvio PHP in prod (porta 8100): `npm run --prefix _reports "server PROD"`
18
+ (a fine test chiudere il terminale con il pulsante cestino di VS Code, per liberare la porta)
19
+ 3. In un altro terminale:
20
+ - `npm run --prefix _reports "lighthouse mobile"` → `mobile.html`
21
+ - `npm run --prefix _reports "lighthouse desktop"` → `desktop.html`
22
+ - `npm run --prefix _reports webhint` → `hint-report/http-localhost-8100.html`
23
+
24
+ ## Note
25
+
26
+ - Lanciare i test sempre sulla build prod, non sul dev server di webpack.
27
+ - webhint usa il connector `puppeteer` con il Chrome installato (`.hintrc` in questa cartella, `executablePath` di macOS; il finder automatico non lo trova), in modalità headless: render reale, quindi anche le regole sul layout sono attendibili. Gli avvisi iniziali su `typescript-config/*` sono normali (regole non applicabili).
28
+ - `.hintrc` va letto dalla directory corrente: lanciare webhint da `_reports` (lo script `--prefix` lo fa).
29
+ - Usare gli stessi dati nel database locale tra un run e l'altro: la home cambia con i gruppi disponibili e rende i punteggi non confrontabili.
30
+ - Lighthouse oscilla di qualche punto tra un run e l'altro: fare 3 run e prendere la mediana.
31
+ - Per i numeri definitivi (rete, compressione, CDN) ripetere su staging/produzione.
32
+
33
+
34
+ ## Caratteristiche del server
35
+
36
+ Lo script prod usa il server integrato di PHP (`php -S`). Rispetto al server reale tenere presente che:
37
+
38
+ * esegue un solo processo per volta, più richieste vanno in coda
39
+ * non esegue compressione gzip/brotli
40
+
41
+ Note:
42
+
43
+ - `APP_ENV=prod APP_DEBUG=0` sono variabili d'ambiente lette da Symfony (non dal server): con `php -S` vengono ereditate dal processo e hanno la precedenza sui file `.env` / `.env.local`.
44
+ - `php -S` usa il `php.ini` della CLI, che può differire da quello di `php-cgi`.
45
+ - Con richieste in coda i tempi di caricamento di asset e immagini possono risultare peggiori: i numeri di performance locali sono indicativi.
package/dev-tools/starter-kit/source_files/root/_reports/_package.json ADDED
@@ -0,0 +1,9 @@
1
+ {
2
+ "scripts": {
3
+ "webpack PROD": "cd .. && NODE_ENV=production webpack --config ./webpack.config.mjs --stats minimal",
4
+ "server PROD": "cd .. && APP_ENV=prod APP_DEBUG=0 php -S 127.0.0.1:8100 -t public public/index.php # http://localhost:8100 (server integrato php: la CLI symfony ammette un solo server per progetto)",
5
+ "lighthouse mobile": "npx lighthouse http://localhost:8100/ --form-factor=mobile --output=html --output-path=./mobile.html --view",
6
+ "lighthouse desktop": "npx lighthouse http://localhost:8100/ --preset=desktop --output=html --output-path=./desktop.html --view",
7
+ "webhint": "npx hint http://localhost:8100/"
8
+ }
9
+ }
package/dev-tools/starter-kit/source_files/root/package-tpl.json CHANGED
@@ -23,7 +23,6 @@
23
23
  "symfony server": "symfony serve --port=[[port8000]] --listen-ip=0.0.0.0 # http://192.168.1.135:[[port8000]] # -d (deamon): rimane aperto anche dopo la chiusura del terminale, terminare con `symfony server:stop`",
24
24
  "launchChrome": "open -n -a 'Google Chrome' --args --profile-directory='Profile 3' # mbn: 1 / mg2: 3",
25
25
  "webpack PROD": "npm run 'UPD-version' && NODE_ENV=production webpack --config ./webpack.config.mjs --stats minimal",
26
- "UPD-version": "npx update-version --no-log-v0 --log-file=./changelog.md # --log-patch --pkg=alt/path/to/package.json --default-patch-log=__log_text__",
27
26
  "email sass": "npx sass ./app/email:./templates/email/css --no-source-map --style=compressed --watch",
28
27
  "postcss email": "postcss ./app/email/[!_]*.css --dir ./templates/email/css --no-map --verbose --config ./app/email --watch",
29
28
  "eslint-check": "npx eslint app/",
@@ -35,6 +34,7 @@
35
34
  "build tokens": "npx buildTokens --config ./app/css/tokens-config.mjs",
36
35
  "check unresolved props": "npx checkUnresolvedProps --config ./app/css/tokens-config.mjs",
37
36
  "find orphan css classes": "npx findOrphanCssClasses --config ./app/css/orphan-css-classes.config.mjs",
37
+ "UPD-version": "npx update-version --no-log-v0 --log-file=./changelog.md # --log-patch --pkg=alt/path/to/package.json --default-patch-log=__log_text__",
38
38
  "npm-outdated": "npm outdated",
39
39
  "upd@m": "npx upd@m",
40
40
  "npm-upd": "npm update --save"
package/dev-tools/starter-kit/starter-install.sh CHANGED
@@ -42,13 +42,13 @@ fi
42
42
  # Package manager da utilizzare per l'installazione dei pacchetti: 1 = pnpm
43
43
  # (default), 2 = npm. Il valore viene usato più sotto (sezione NODE MODULES)
44
44
  # per scegliere il comando di installazione.
45
- read "PM_INPUT?Package manager da utilizzare (1 = pnpm, 2 = npm) [1]: "
45
+ read "PM_INPUT?Package manager da utilizzare (1 = npm, 2 = pnpm) [1]: "
46
46
  PM_INPUT=${PM_INPUT:-1}
47
47
  case "$PM_INPUT" in
48
- 1) PKG_MANAGER="pnpm" ;;
49
- 2) PKG_MANAGER="npm" ;;
48
+ 1) PKG_MANAGER="npm" ;;
49
+ 2) PKG_MANAGER="pnpm" ;;
50
50
  *)
51
- printf "${RED}Errore: inserire 1 (pnpm) oppure 2 (npm).${NC}\n" >&2
51
+ printf "${RED}Errore: inserire 1 (npm) oppure 2 (pnpm).${NC}\n" >&2
52
52
  exit 1
53
53
  ;;
54
54
  esac
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@massimo-cassandro/minimo",
3
- "version": "1.43.0",
3
+ "version": "1.43.1",
4
4
  "description": "Light css framework & utilities",
5
5
  "type": "module",
6
6
  "main": "./src/index.js",
package/src/css/table.css CHANGED
@@ -24,6 +24,10 @@
24
24
  tr:last-child {
25
25
  border-width: var(--table-thead-border-width);
26
26
  }
27
+
28
+ th {
29
+ vertical-align: var(--table-thead-vertical-align, top);
30
+ }
27
31
  }
28
32
 
29
33
  tfoot {
@@ -33,31 +37,30 @@
33
37
  }
34
38
  th, td {
35
39
  font-weight: var(--table-tfoot-font-weight);
40
+ vertical-align: var(--table-tfoot-vertical-align, top);
36
41
  }
37
42
  }
38
43
 
39
44
  tbody {
40
45
  tr:nth-child(even) {
41
- background-color: var(--table-body-tr-alt-bg-color);
46
+ background-color: var(--table-tbody-tr-alt-bg-color);
42
47
  }
43
48
 
44
49
  @media (hover: hover) {
45
50
  tr:hover {
46
- background-color: var(--table-body-tr-hover-bg-color);
51
+ background-color: var(--table-tbody-tr-hover-bg-color);
47
52
  }
48
53
  }
54
+ th {
55
+ vertical-align: var(--table-tbody-vertical-align, top);
56
+ }
49
57
  }
50
58
 
51
59
 
52
60
  th, td {
53
61
  padding: var(--table-cell-padding-block) var(--table-cell-padding-inline);
54
62
  line-height: var(--table-cell-line-height);
55
- vertical-align: top;
56
63
  text-align: start;
57
-
58
- .valign-middle &, &.valign-middle {
59
- vertical-align: middle;
60
- }
61
64
  }
62
65
 
63
66
  &.table-bordered {
@@ -76,8 +79,8 @@
76
79
  @media (prefers-color-scheme: dark) {
77
80
  .table {
78
81
  --table-border-color: var(--_stone-8);
79
- --table-body-tr-alt-bg-color: color-mix(in srgb, var(--_stone-12) 60%, transparent);
80
- --table-body-tr-hover-bg-color: color-mix(in srgb, var(--_blue-12) 60%, transparent);
82
+ --table-tbody-tr-alt-bg-color: color-mix(in srgb, var(--_stone-12) 60%, transparent);
83
+ --table-tbody-tr-hover-bg-color: color-mix(in srgb, var(--_blue-12) 60%, transparent);
81
84
  }
82
85
  }
83
86
  */
package/src/custom-properties.css CHANGED
@@ -227,7 +227,7 @@
227
227
  --jt-caption-font-size: var(--font-size-sm);
228
228
  --jt-empty-color: var(--text-muted);
229
229
  --jt-empty-padding-block: var(--size-sm);
230
- --jt-info-color: var(--text-muted);
230
+ --jt-info-color: var(--text-color);
231
231
  --jt-info-font-size: var(--font-size-sm);
232
232
  --jt-info-gap: var(--size-sm);
233
233
  --jt-info-outer-padding-block-end: var(--size-xs);
@@ -240,7 +240,7 @@
240
240
  --jt-pagination-current-font-weight: var(--font-weight-semibold);
241
241
  --jt-pagination-disabled-opacity: .5;
242
242
  --jt-pagination-font-size: var(--font-size-sm);
243
- --jt-pagination-hover-background-color: var(--table-body-tr-hover-bg-color);
243
+ --jt-pagination-hover-background-color: var(--table-tbody-tr-hover-bg-color);
244
244
  --jt-pagination-icon-size: 1em;
245
245
  --jt-pagination-line-height: var(--table-cell-line-height);
246
246
  --jt-pagination-radius: var(--radius-xxs);
@@ -420,18 +420,21 @@
420
420
  --status-warning-color: #fc0;
421
421
  --status-warning-fg: #4f2900;
422
422
 
423
- --table-body-border-width: 1px;
424
- --table-body-tr-alt-bg-color: #efefef;
425
- --table-body-tr-hover-bg-color: #cbcbcb;
426
423
  --table-border-color: #333;
427
424
  --table-cell-line-height: 1.3;
428
425
  --table-cell-padding-block: .3rem;
429
426
  --table-cell-padding-inline: .6rem;
427
+ --table-tbody-border-width: 1px;
428
+ --table-tbody-tr-alt-bg-color: #efefef;
429
+ --table-tbody-tr-hover-bg-color: #cbcbcb;
430
+ --table-tbody-vertical-align: middle;
430
431
  --table-tfoot-background-color: var(--table-thead-background-color);
431
432
  --table-tfoot-border-width: var(--table-thead-border-width);
432
433
  --table-tfoot-font-weight: var(--font-weight-semibold);
434
+ --table-tfoot-vertical-align: middle;
433
435
  --table-thead-background-color: #ddd;
434
436
  --table-thead-border-width: 3px;
437
+ --table-thead-vertical-align: middle;
435
438
 
436
439
  --text-color: #000;
437
440
  --text-dim: var(--text-muted);
package/src/web-components/json-table/json-table.minimo.tokens.mjs CHANGED
@@ -214,7 +214,7 @@ export default {
214
214
  background: {
215
215
  color: {
216
216
  $type: 'color',
217
- $value: '{table.body.tr.hover-bg-color}'
217
+ $value: '{table.tbody.tr.hover-bg-color}'
218
218
  }
219
219
  }
220
220
  },
package/src/web-components/json-table/jt-docs.md CHANGED
@@ -506,7 +506,7 @@ Definite in `json-table.minimo.tokens.mjs` (namespace `--jt-*`):
506
506
  | `--jt-pagination-icon-size` | `1em` |
507
507
  | `--jt-pagination-current-background-color` | `{table.thead.background.color}` |
508
508
  | `--jt-pagination-current-font-weight` | `{font.weight.semibold}` |
509
- | `--jt-pagination-hover-background-color` | `{table.body.tr.hover-bg-color}` |
509
+ | `--jt-pagination-hover-background-color` | `{table.tbody.tr.hover-bg-color}` |
510
510
  | `--jt-pagination-disabled-opacity` | `.5` |
511
511
  | `--jt-bool-icon-size` | `1.1em` |
512
512
  | `--jt-bool-true-color` | `{status.success.color}` |
package/types/classes.d.ts CHANGED
@@ -878,7 +878,6 @@ export type MinimoClass =
878
878
  | 'text-upper'
879
879
  | 'text-warning'
880
880
  | 'text-xs'
881
- | 'valign-middle'
882
881
  | 'visibility-hidden'
883
882
  | 'visually-hidden'
884
883
  | 'w-100'