@dillingerstaffing/strand-svelte 0.15.1 → 0.15.2

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.
package/README.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # @dillingerstaffing/strand-svelte
2
2
 
3
- Svelte component library built on the [Strand Design Language](https://github.com/dillingerstaffing/strand/blob/main/DESIGN_LANGUAGE.md). 34 components. Zero-runtime CSS. WCAG 2.2 AA.
3
+ Svelte component library built on the [Strand Design Language](https://github.com/dillingerstaffing/strand/blob/main/docs/design-language.md). 34 components. Zero-runtime CSS. WCAG 2.2 AA.
4
4
 
5
5
  ## Quick Start
6
6
 
@@ -51,8 +51,8 @@ This package produces identical visual output to [@dillingerstaffing/strand-ui](
51
51
  ## Links
52
52
 
53
53
  - [GitHub](https://github.com/dillingerstaffing/strand)
54
- - [Design Language](https://github.com/dillingerstaffing/strand/blob/main/DESIGN_LANGUAGE.md)
55
- - [HTML Reference (CSS-only API)](https://github.com/dillingerstaffing/strand/blob/main/HTML_REFERENCE.md)
54
+ - [Design Language](https://github.com/dillingerstaffing/strand/blob/main/docs/design-language.md)
55
+ - [HTML Reference (CSS-only API)](https://github.com/dillingerstaffing/strand/blob/main/generated/html-reference.md)
56
56
  - [Documentation](https://dillingerstaffing.com/labs/strand)
57
57
 
58
58
  Created by [Dillinger Staffing](https://dillingerstaffing.com)
@@ -1526,8 +1526,13 @@ body:has(.strand-banner) .strand-instrument-viewport--full-bleed {
1526
1526
  border-radius: var(--strand-radius-lg);
1527
1527
  overflow: hidden;
1528
1528
  position: relative;
1529
+ padding: var(--strand-space-5);
1529
1530
  }
1530
1531
 
1532
+ /* Dark-surface overrides: KV and log text needs higher contrast on #0F192A */
1533
+ .strand-instrument-viewport .strand-kv__label { color: var(--strand-gray-400); }
1534
+ .strand-instrument-viewport .strand-kv__value { color: var(--strand-gray-200); }
1535
+
1531
1536
  .strand-instrument-viewport__label {
1532
1537
  color: var(--strand-gray-400);
1533
1538
  font-family: var(--strand-font-mono);
@@ -5011,7 +5016,7 @@ body:has(.strand-banner) .strand-instrument-viewport--full-bleed {
5011
5016
  display: flex;
5012
5017
  justify-content: space-between;
5013
5018
  align-items: center;
5014
- padding-block: var(--strand-space-2);
5019
+ padding: var(--strand-space-2) var(--strand-space-4);
5015
5020
  }
5016
5021
 
5017
5022
  .strand-kv + .strand-kv {
@@ -5030,8 +5035,9 @@ body:has(.strand-banner) .strand-instrument-viewport--full-bleed {
5030
5035
  .strand-kv__value {
5031
5036
  font-family: var(--strand-font-mono);
5032
5037
  font-size: var(--strand-text-xs);
5033
- color: var(--strand-gray-600);
5038
+ color: var(--strand-gray-700);
5034
5039
  font-variant-numeric: tabular-nums;
5040
+ text-align: right;
5035
5041
  }
5036
5042
 
5037
5043
  .strand-kv__value--status {
@@ -5043,8 +5049,9 @@ body:has(.strand-banner) .strand-instrument-viewport--full-bleed {
5043
5049
  time(OVERLINE) + status(OVERLINE+COLOR_SEMANTIC) + text(SECONDARY) + RANK_BORDER */
5044
5050
  .strand-log {
5045
5051
  display: flex;
5052
+ align-items: baseline;
5046
5053
  gap: var(--strand-space-3);
5047
- padding-block: var(--strand-space-2);
5054
+ padding: var(--strand-space-2) var(--strand-space-4);
5048
5055
  }
5049
5056
 
5050
5057
  .strand-log + .strand-log {
@@ -5076,6 +5083,18 @@ body:has(.strand-banner) .strand-instrument-viewport--full-bleed {
5076
5083
  .strand-log__status--warning { color: var(--strand-amber-caution); }
5077
5084
  .strand-log__status--error { color: var(--strand-red-alert); }
5078
5085
 
5086
+ .strand-log__text {
5087
+ font-family: var(--strand-font-mono);
5088
+ font-size: var(--strand-text-xs);
5089
+ color: var(--strand-gray-300);
5090
+ line-height: var(--strand-leading-normal);
5091
+ }
5092
+
5093
+ .strand-log__text strong {
5094
+ font-weight: var(--strand-weight-semibold);
5095
+ color: var(--strand-gray-100);
5096
+ }
5097
+
5079
5098
  /* ── Metric Row ──
5080
5099
  Derivation: centered-group (DL 11.10).
5081
5100
  self-contained(atom)* with center distribution + responsive gap */
@@ -5094,8 +5113,8 @@ body:has(.strand-banner) .strand-instrument-viewport--full-bleed {
5094
5113
  display: flex;
5095
5114
  gap: var(--strand-space-2);
5096
5115
  align-items: flex-end;
5097
- height: var(--strand-space-24);
5098
- padding: var(--strand-space-5);
5116
+ height: var(--strand-space-40);
5117
+ padding: var(--strand-space-4);
5099
5118
  }
5100
5119
 
5101
5120
  .strand-bar-chart__col {
@@ -5134,6 +5153,13 @@ body:has(.strand-banner) .strand-instrument-viewport--full-bleed {
5134
5153
  color: var(--strand-gray-400);
5135
5154
  }
5136
5155
 
5156
+ /* ── Bar chart size modifiers ── */
5157
+ .strand-bar-chart--sm { height: var(--strand-space-24); }
5158
+ .strand-bar-chart--lg { height: var(--strand-space-48); }
5159
+
5160
+ /* ── Nav offset for glass (fixed) nav ── */
5161
+ .strand-nav-offset { padding-top: var(--strand-space-16); }
5162
+
5137
5163
  /* ══════════════════════════════════════════════════
5138
5164
  UTILITIES
5139
5165
  ══════════════════════════════════════════════════ */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dillingerstaffing/strand-svelte",
3
- "version": "0.15.1",
3
+ "version": "0.15.2",
4
4
  "description": "Strand UI - Svelte component library built on the Strand Design Language",
5
5
  "author": "Dillinger Staffing <engineering@dillingerstaffing.com> (https://dillingerstaffing.com)",
6
6
  "license": "MIT",
@@ -48,14 +48,15 @@
48
48
  "dist/css/*.css"
49
49
  ],
50
50
  "scripts": {
51
- "build": "vite build && cp ../../HTML_REFERENCE.md ./HTML_REFERENCE.md",
51
+ "prepack": "pnpm run build",
52
+ "build": "vite build && cp ../../generated/html-reference.md ./HTML_REFERENCE.md && cp ../../docs/design-language.md ./DESIGN_LANGUAGE.md",
52
53
  "test": "vitest run"
53
54
  },
54
55
  "peerDependencies": {
55
56
  "svelte": "^4.0.0 || ^5.0.0"
56
57
  },
57
58
  "dependencies": {
58
- "@dillingerstaffing/strand": "^0.15.1"
59
+ "@dillingerstaffing/strand": "^0.15.2"
59
60
  },
60
61
  "devDependencies": {
61
62
  "@sveltejs/vite-plugin-svelte": "^5.0.0",