@synopackageland/ui 0.20.13 → 0.20.15

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.
@@ -170,6 +170,19 @@ components below it. Every App gets it; there is nothing to set.
170
170
  Other pages, such as a DataGrid that scrolls itself, keep their layout.
171
171
  - **The header does not stick.** A `PageHeader` scrolls with the page, in a
172
172
  tight row (8px above and below).
173
+ - **The bars are compact on touch.** Under a coarse pointer the `SectionTabs`
174
+ strip is drawn 36px tall and a `SettingsPage` footer 48px (its buttons
175
+ 36px), not the 44px strip and 64px footer of a taller touch layout. The 44px
176
+ tap boxes come from the hit slop (`data-ui-hit`, docs/mobile-native.md): a
177
+ tab's box reaches 8px down, into the strip's unpainted bottom padding,
178
+ which hangs over the top of the page (the strip sticks at the top of the
179
+ window, with nothing above it to reach into); a footer button's box reaches
180
+ 4px up and down inside the footer. At 753×239 (a 279px landscape window
181
+ under DSM's 40px header) that leaves the rows 147px from the strip's box,
182
+ 155px from what is drawn. This follows the media query, not
183
+ `data-ui-layout-short`, so an App without `AppLayout` gets it too. A taller
184
+ touch layout keeps the drawn 44px: there the slop would only hide a strip
185
+ of the page under the bar, for no room the page needs.
173
186
 
174
187
  At any height, a `SectionTabs fill` strip (and a pushed section's Back header on a phone) sticks below a sticky `PageHeader`
175
188
  in the same `PageContent` (`--ui-page-sticky-top`, the header's height)
@@ -160,6 +160,17 @@ hidden` (or `truncate`) on the control or a scroller around it cuts the box
160
160
  off, so truncate the label inside instead and clip a row sideways only
161
161
  (`overflow-x-clip`).
162
162
 
163
+ At a page's end edge the box sticks out past the page: a 36px IconButton
164
+ flush with the right of a header row reaches 4px further. On touch,
165
+ AppLayout's column and page area and every `PageContent` clip their
166
+ children sideways (`overflow-x: clip`), so a page scroller never counts that
167
+ overhang as content and never scrolls sideways; the box keeps its full 44px
168
+ wherever the page has room, vertical scrolling and sticky headers are
169
+ unchanged, and a table or code block that scrolls sideways (a scroller of its
170
+ own) keeps scrolling. An App that puts small controls flush with the edge of
171
+ its own scroller, outside a `PageContent`, clips that content sideways the
172
+ same way.
173
+
163
174
  `check:mobile` exempts a link set in a sentence (inline, with text beside it
164
175
  in the same parent): WCAG 2.5.8 lets the line of text decide its size. A link
165
176
  alone on its line still needs 44px.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synopackageland/ui",
3
- "version": "0.20.13",
3
+ "version": "0.20.15",
4
4
  "description": "Shared Vue 3 UI component library with a DSM 7 inspired application theme",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -60,60 +60,6 @@
60
60
  "./themes/dsm7-embedded-reset.css": "./dist/themes/dsm7-embedded-reset.css",
61
61
  "./themes/dsm7-embedded-theme.css": "./dist/themes/dsm7-embedded-theme.css"
62
62
  },
63
- "scripts": {
64
- "check:docs": "node --test scripts/check-doc-versions.test.mjs && node scripts/check-doc-versions.mjs",
65
- "dev": "vite build --watch",
66
- "build": "vite build && vite build --mode json && vite build --mode rich-text && vite build --mode grid && vite build --mode cli && vite build --mode preview && vite build --mode embedded && node scripts/postbuild.mjs",
67
- "lint": "eslint .",
68
- "typecheck": "vue-tsc --noEmit -p tsconfig.json",
69
- "test": "vitest run",
70
- "test:watch": "vitest",
71
- "test:changed": "echo \"test:changed skips the tests the changes since ${SYNOPKGLAND_GATE_BASE:-origin/master} do not reach (vitest --changed); pnpm check runs them all\" && vitest run --changed ${SYNOPKGLAND_GATE_BASE:-origin/master}",
72
- "story": "histoire dev",
73
- "story:build": "histoire build",
74
- "check:host": "node scripts/dsm-host-shots.mjs",
75
- "check:switch": "node scripts/check-switch.mjs",
76
- "check:tabs": "node scripts/check-tabs.mjs",
77
- "check:mobile": "node scripts/check-mobile-overflow.mjs",
78
- "check:ui-patch": "node scripts/check-ui-patch.mjs",
79
- "check:narrow": "node scripts/check-narrow-controls.mjs",
80
- "check:drawer-form": "node scripts/check-drawer-form.mjs",
81
- "check:responsive": "node scripts/check-responsive.mjs",
82
- "check:adaptive": "node scripts/check-adaptive.mjs",
83
- "check:sidebar-focus": "node scripts/check-sidebar-focus.mjs",
84
- "check:json-render": "node scripts/check-json-render.mjs",
85
- "check:motion": "node scripts/check-motion.mjs",
86
- "check:topology": "node scripts/check-topology.mjs",
87
- "check:wizard": "node scripts/check-wizard.mjs",
88
- "check:edges": "node scripts/check-edges.mjs",
89
- "check:data-grid": "node scripts/check-data-grid.mjs",
90
- "check:truncation": "node scripts/check-truncation.mjs",
91
- "check:link": "node scripts/check-link.mjs",
92
- "check:text-select": "node scripts/check-text-select.mjs",
93
- "check:date-picker": "node scripts/check-date-picker.mjs",
94
- "check:full-page": "node scripts/check-full-page.mjs",
95
- "check:short-viewport": "node scripts/check-short-viewport.mjs",
96
- "check:detail-surface": "node scripts/check-detail-surface.mjs",
97
- "check:internal": "node --test scripts/check-internal-content.test.mjs scripts/check-npm-metadata.test.mjs && node scripts/check-internal-content.mjs --repo .",
98
- "check:npm-metadata": "node scripts/check-npm-metadata.mjs",
99
- "check:package": "node scripts/check-package-content.mjs",
100
- "check:public-api-consumer": "node scripts/check-public-api-consumer.mjs",
101
- "notices:update": "node scripts/third-party-notices.mjs --write",
102
- "notices:check": "node scripts/third-party-notices.mjs --check",
103
- "check": "bash scripts/docker-check.sh \"npm run gates\"",
104
- "check:fast": "bash scripts/docker-check.sh \"npm run gates\"",
105
- "check:local-browser": "node scripts/app-local-browser.mjs",
106
- "check:infotip": "node scripts/check-infotip.mjs",
107
- "release:stage": "node scripts/stage-release.mjs",
108
- "check:polish": "bash scripts/docker-check.sh --build --out .polish-shots 'node scripts/check-polish.mjs'",
109
- "check:acceptance": "node scripts/check-acceptance.mjs",
110
- "check:palette": "node scripts/check-palette.mjs",
111
- "gates": "node scripts/gates.mjs",
112
- "gates:full": "node scripts/gates.mjs --full",
113
- "check:layout": "node scripts/check-layout.mjs",
114
- "release:smoke": "node scripts/release-smoke.mjs",
115
- "check:browser-install": "playwright install chromium"
116
- },
117
63
  "peerDependencies": {
118
64
  "vue": "^3.5.0"
119
65
  },
@@ -133,44 +79,9 @@
133
79
  "@tiptap/vue-3": "3.32.1",
134
80
  "zod": "^4.6.5"
135
81
  },
136
- "devDependencies": {
137
- "@eslint/js": "10.0.1",
138
- "@histoire/plugin-vue": "1.0.0-beta.1",
139
- "@tailwindcss/vite": "4.3.3",
140
- "@tanstack/vue-virtual": "3.13.39",
141
- "@vitejs/plugin-vue": "6.0.9",
142
- "@vue/test-utils": "2.5.1",
143
- "@vueuse/core": "14.4.0",
144
- "eslint": "10.11.0",
145
- "eslint-plugin-vue": "10.11.1",
146
- "flexsearch": "0.8.212",
147
- "globals": "17.12.0",
148
- "histoire": "1.0.0-beta.1",
149
- "jsdom": "30.1.1",
150
- "playwright": "1.58.2",
151
- "reka-ui": "2.11.0",
152
- "tailwindcss": "4.3.3",
153
- "typescript": "5.9.3",
154
- "typescript-eslint": "8.71.0",
155
- "vite": "7.3.6",
156
- "vite-plugin-dts": "5.1.1",
157
- "vitest": "5.0.2",
158
- "vscode-oniguruma": "2.0.1",
159
- "vscode-textmate": "9.3.2",
160
- "vue": "3.5.43",
161
- "vue-eslint-parser": "10.4.1",
162
- "vue-tsc": "3.3.11"
163
- },
164
82
  "engines": {
165
83
  "node": ">=20"
166
84
  },
167
- "packageManager": "pnpm@10.33.2",
168
- "pnpm": {
169
- "onlyBuiltDependencies": [
170
- "esbuild",
171
- "vue-demi"
172
- ]
173
- },
174
85
  "config": {
175
86
  "bundledRuntime": {
176
87
  "@tanstack/vue-virtual": "3.13.39",