anentrypoint-design 0.0.204 → 0.0.205

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 (6) hide show
  1. package/app-shell.css +29 -14
  2. package/dist/247420.css +29 -14
  3. package/dist/247420.js +12 -12
  4. package/package.json +1 -1
  5. package/src/kits/os/freddie/pages-tools.js +1 -1
  6. package/src/markdown-cache-perf-test.js +0 -173
package/app-shell.css CHANGED
@@ -534,41 +534,56 @@ body.canvas-host { background: transparent !important; }
534
534
  grid-template-columns: minmax(80px, 12ch) minmax(0, 1fr) auto;
535
535
  gap: var(--space-3);
536
536
  align-items: baseline;
537
- padding: 18px 22px;
537
+ padding: 16px 22px;
538
538
  background: var(--bg);
539
539
  border-radius: var(--r-2);
540
540
  color: var(--fg);
541
541
  position: relative;
542
- transition: background var(--dur-snap) var(--ease), padding var(--dur-base) var(--ease);
542
+ /* Only background + the leading rail animate; padding/size never change on
543
+ interaction, so they are deliberately absent (a padding transition here was
544
+ dead and misleading). */
545
+ transition: background var(--dur-snap) var(--ease);
543
546
  }
544
- .row + .row { margin-top: 4px; }
547
+ .row + .row { margin-top: 2px; }
545
548
  .row::before {
546
549
  content: '';
547
- position: absolute; left: 6px; top: 22%; bottom: 22%; width: 3px;
548
- background: transparent; border-radius: 3px;
549
- transition: background var(--dur-snap) var(--ease);
550
+ position: absolute; left: 7px; top: 0; bottom: 0; width: 3px;
551
+ margin: auto 0;
552
+ height: 0; /* collapsed by default; reveals from centre */
553
+ background: var(--rule-strong);
554
+ border-radius: var(--r-pill);
555
+ opacity: 0;
556
+ transition: height var(--dur-base) var(--ease), opacity var(--dur-snap) var(--ease), background var(--dur-snap) var(--ease);
550
557
  }
551
558
  /* A clickable row (onClick -> role=button, or a link row) is interactive, so it
552
559
  carries a pointer cursor; without this the click affordance is invisible. */
553
560
  .row[role="button"], a.row { cursor: pointer; }
554
- .row:hover { background: var(--bg-2); }
555
- .row:hover::before { background: var(--rule-strong); }
561
+ /* Hover reveals the rail (grows from centre) only on interactive rows — a static
562
+ row should not signal an affordance it does not have. */
563
+ .row[role="button"]:hover, a.row:hover { background: var(--bg-2); }
564
+ .row[role="button"]:hover::before, a.row:hover::before { height: 56%; opacity: 1; }
556
565
  .row.active { background: color-mix(in oklab, var(--accent) 10%, var(--bg-2)); }
557
- .row.active::before { background: var(--accent); }
566
+ .row.active::before { height: 64%; opacity: 1; background: var(--accent); }
567
+ .row.active .title { color: var(--accent); }
558
568
  .row.row-state-disabled { opacity: 0.5; pointer-events: none; }
559
569
  .row.row-state-error { background: color-mix(in oklab, var(--flame) 10%, var(--bg-2)); }
560
- .row.row-state-error::before { background: var(--flame); }
570
+ .row.row-state-error::before { height: 64%; opacity: 1; background: var(--flame); }
561
571
  /* rail tones — a persistent status colour on the leading rail (the ::before
562
- bar). Active/hover/error still win via their own rules below source order. */
572
+ bar). Always shown (a status indicator, not a hover affordance). Active/error
573
+ still win via their own rules below in source order. */
574
+ .row.rail-green::before,
575
+ .row.rail-purple::before,
576
+ .row.rail-flame::before { height: 56%; opacity: 1; }
563
577
  .row.rail-green::before { background: var(--accent); }
564
578
  .row.rail-purple::before { background: var(--purple-2, #7F18A4); }
565
579
  .row.rail-flame::before { background: var(--flame); }
566
580
  .row-grid { /* explicit grid-template-columns set inline */ }
567
581
 
568
- .row .code { font-family: var(--ff-mono); font-size: var(--fs-xs); color: var(--fg-3); }
569
- .row .title { font-family: var(--ff-body); font-weight: 600; font-size: var(--fs-lg); display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
582
+ .row .code { font-family: var(--ff-mono); font-size: var(--fs-xs); color: var(--fg-3); font-variant-numeric: tabular-nums; letter-spacing: 0.01em; }
583
+ .row .title { font-family: var(--ff-body); font-weight: 600; font-size: var(--fs-lg); line-height: var(--lh-snug, 1.3); display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; min-width: 0; }
584
+ .row .title .sub { font-family: var(--ff-body); font-weight: 400; font-size: var(--fs-sm); color: var(--fg-3); }
570
585
  .row .sub { font-family: var(--ff-body); font-weight: 400; font-size: var(--fs-sm); color: var(--fg-3); }
571
- .row .meta { font-family: var(--ff-mono); font-size: var(--fs-xs); color: var(--fg-3); text-align: right; }
586
+ .row .meta { font-family: var(--ff-mono); font-size: var(--fs-xs); color: var(--fg-3); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; align-self: center; }
572
587
 
573
588
  a.row { text-decoration: none; }
574
589
 
package/dist/247420.css CHANGED
@@ -935,41 +935,56 @@
935
935
  grid-template-columns: minmax(80px, 12ch) minmax(0, 1fr) auto;
936
936
  gap: var(--space-3);
937
937
  align-items: baseline;
938
- padding: 18px 22px;
938
+ padding: 16px 22px;
939
939
  background: var(--bg);
940
940
  border-radius: var(--r-2);
941
941
  color: var(--fg);
942
942
  position: relative;
943
- transition: background var(--dur-snap) var(--ease), padding var(--dur-base) var(--ease);
943
+ /* Only background + the leading rail animate; padding/size never change on
944
+ interaction, so they are deliberately absent (a padding transition here was
945
+ dead and misleading). */
946
+ transition: background var(--dur-snap) var(--ease);
944
947
  }
945
- .ds-247420 .row + .row { margin-top: 4px; }
948
+ .ds-247420 .row + .row { margin-top: 2px; }
946
949
  .ds-247420 .row::before {
947
950
  content: '';
948
- position: absolute; left: 6px; top: 22%; bottom: 22%; width: 3px;
949
- background: transparent; border-radius: 3px;
950
- transition: background var(--dur-snap) var(--ease);
951
+ position: absolute; left: 7px; top: 0; bottom: 0; width: 3px;
952
+ margin: auto 0;
953
+ height: 0; /* collapsed by default; reveals from centre */
954
+ background: var(--rule-strong);
955
+ border-radius: var(--r-pill);
956
+ opacity: 0;
957
+ transition: height var(--dur-base) var(--ease), opacity var(--dur-snap) var(--ease), background var(--dur-snap) var(--ease);
951
958
  }
952
959
  /* A clickable row (onClick -> role=button, or a link row) is interactive, so it
953
960
  carries a pointer cursor; without this the click affordance is invisible. */
954
961
  .ds-247420 .row[role="button"], .ds-247420 a.row { cursor: pointer; }
955
- .ds-247420 .row:hover { background: var(--bg-2); }
956
- .ds-247420 .row:hover::before { background: var(--rule-strong); }
962
+ /* Hover reveals the rail (grows from centre) only on interactive rows — a static
963
+ row should not signal an affordance it does not have. */
964
+ .ds-247420 .row[role="button"]:hover, .ds-247420 a.row:hover { background: var(--bg-2); }
965
+ .ds-247420 .row[role="button"]:hover::before, .ds-247420 a.row:hover::before { height: 56%; opacity: 1; }
957
966
  .ds-247420 .row.active { background: color-mix(in oklab, var(--accent) 10%, var(--bg-2)); }
958
- .ds-247420 .row.active::before { background: var(--accent); }
967
+ .ds-247420 .row.active::before { height: 64%; opacity: 1; background: var(--accent); }
968
+ .ds-247420 .row.active .title { color: var(--accent); }
959
969
  .ds-247420 .row.row-state-disabled { opacity: 0.5; pointer-events: none; }
960
970
  .ds-247420 .row.row-state-error { background: color-mix(in oklab, var(--flame) 10%, var(--bg-2)); }
961
- .ds-247420 .row.row-state-error::before { background: var(--flame); }
971
+ .ds-247420 .row.row-state-error::before { height: 64%; opacity: 1; background: var(--flame); }
962
972
  /* rail tones — a persistent status colour on the leading rail (the ::before
963
- bar). Active/hover/error still win via their own rules below source order. */
973
+ bar). Always shown (a status indicator, not a hover affordance). Active/error
974
+ still win via their own rules below in source order. */
975
+ .ds-247420 .row.rail-green::before,
976
+ .ds-247420 .row.rail-purple::before,
977
+ .ds-247420 .row.rail-flame::before { height: 56%; opacity: 1; }
964
978
  .ds-247420 .row.rail-green::before { background: var(--accent); }
965
979
  .ds-247420 .row.rail-purple::before { background: var(--purple-2, #7F18A4); }
966
980
  .ds-247420 .row.rail-flame::before { background: var(--flame); }
967
981
  .ds-247420 .row-grid { /* explicit grid-template-columns set inline */ }
968
982
 
969
- .ds-247420 .row .code { font-family: var(--ff-mono); font-size: var(--fs-xs); color: var(--fg-3); }
970
- .ds-247420 .row .title { font-family: var(--ff-body); font-weight: 600; font-size: var(--fs-lg); display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
983
+ .ds-247420 .row .code { font-family: var(--ff-mono); font-size: var(--fs-xs); color: var(--fg-3); font-variant-numeric: tabular-nums; letter-spacing: 0.01em; }
984
+ .ds-247420 .row .title { font-family: var(--ff-body); font-weight: 600; font-size: var(--fs-lg); line-height: var(--lh-snug, 1.3); display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; min-width: 0; }
985
+ .ds-247420 .row .title .sub { font-family: var(--ff-body); font-weight: 400; font-size: var(--fs-sm); color: var(--fg-3); }
971
986
  .ds-247420 .row .sub { font-family: var(--ff-body); font-weight: 400; font-size: var(--fs-sm); color: var(--fg-3); }
972
- .ds-247420 .row .meta { font-family: var(--ff-mono); font-size: var(--fs-xs); color: var(--fg-3); text-align: right; }
987
+ .ds-247420 .row .meta { font-family: var(--ff-mono); font-size: var(--fs-xs); color: var(--fg-3); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; align-self: center; }
973
988
 
974
989
  .ds-247420 a.row { text-decoration: none; }
975
990