@synopackageland/ui 0.23.1 → 0.23.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/CHANGELOG.md +8 -0
- package/dist/cli.js +0 -0
- package/dist/index.js +2068 -2067
- package/dist/json-preview/preview.js +2966 -2965
- package/dist/reka-runtime.json +1 -1
- package/dist/theme.css +1 -1
- package/dist/themes/dsm7-embedded-theme.css +1 -1
- package/dist/themes/dsm7-embedded.css +1 -1
- package/dist/themes/dsm7.css +1 -1
- package/docs/mobile-native.md +15 -5
- package/package.json +88 -3
package/docs/mobile-native.md
CHANGED
|
@@ -483,12 +483,22 @@ the page, `--ui-chrome-height` tall (44px, plus a 1px rule):
|
|
|
483
483
|
tab bar already names the page. The bar keeps its height, its menu or
|
|
484
484
|
actions and its "…", and still hides on scroll. The `title` prop stays in
|
|
485
485
|
the bar for screen readers only, and a `PageHeader` title still moves out of
|
|
486
|
-
the page.
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
486
|
+
the page. When the bar then holds nothing (no menu button, Back, action,
|
|
487
|
+
account entry, "…" or page action) it is not drawn at all: the page starts
|
|
488
|
+
at the top, with no empty strip, and in the DSM portal no empty bar takes
|
|
489
|
+
the place of DSM's banner (the `title` it kept for screen readers goes
|
|
490
|
+
with it; the tab bar's selected tab still names the page). It is drawn
|
|
491
|
+
again as soon as it holds something. The drawer
|
|
492
|
+
(from the menu button or the tab bar's More) is still headed by
|
|
493
|
+
`brand-name` and `brand-icon`, and the document title is untouched. A
|
|
494
|
+
sub-page (Back) shows its title as usual. Only the phone layout changes; a
|
|
495
|
+
DSM window and a desktop draw no phone bar. Set it per page:
|
|
496
|
+
`:phone-bar-title="onTabPage ? 'none' : 'auto'"`, and always pass the
|
|
497
|
+
App's real `title`, `brand-name` and `brand-icon`. Do not pass an empty
|
|
491
498
|
`title` or brand to hide them: the drawer would lose the App's name.
|
|
499
|
+
- **The drawer's head:** the App's icon and name, then the close button. The
|
|
500
|
+
name takes the row up to the close button and is cut with "…" only when it
|
|
501
|
+
is longer than that.
|
|
492
502
|
- **Actions:** first the page's own actions, then `headerActions`
|
|
493
503
|
(DropdownMenu entries). A pick emits `headerAction` with the key.
|
|
494
504
|
- **One "…".** The bar never shows two overflow buttons. While the page's own
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@synopackageland/ui",
|
|
3
|
-
"version": "0.23.
|
|
3
|
+
"version": "0.23.2",
|
|
4
4
|
"description": "Shared Vue 3 UI component library with a DSM 7 inspired application theme",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -79,6 +79,34 @@
|
|
|
79
79
|
"@tiptap/vue-3": "3.32.1",
|
|
80
80
|
"zod": "^4.6.5"
|
|
81
81
|
},
|
|
82
|
+
"devDependencies": {
|
|
83
|
+
"@eslint/js": "10.0.1",
|
|
84
|
+
"@histoire/plugin-vue": "1.0.0-beta.1",
|
|
85
|
+
"@tailwindcss/vite": "4.3.3",
|
|
86
|
+
"@tanstack/vue-virtual": "3.13.39",
|
|
87
|
+
"@vitejs/plugin-vue": "6.0.9",
|
|
88
|
+
"@vue/test-utils": "2.5.1",
|
|
89
|
+
"@vueuse/core": "14.4.0",
|
|
90
|
+
"eslint": "10.11.0",
|
|
91
|
+
"eslint-plugin-vue": "10.11.1",
|
|
92
|
+
"flexsearch": "0.8.212",
|
|
93
|
+
"globals": "17.12.0",
|
|
94
|
+
"histoire": "1.0.0-beta.1",
|
|
95
|
+
"jsdom": "30.1.1",
|
|
96
|
+
"playwright": "1.58.2",
|
|
97
|
+
"reka-ui": "2.11.0",
|
|
98
|
+
"tailwindcss": "4.3.3",
|
|
99
|
+
"typescript": "5.9.3",
|
|
100
|
+
"typescript-eslint": "8.71.0",
|
|
101
|
+
"vite": "7.3.6",
|
|
102
|
+
"vite-plugin-dts": "5.1.1",
|
|
103
|
+
"vitest": "5.0.2",
|
|
104
|
+
"vscode-oniguruma": "2.0.1",
|
|
105
|
+
"vscode-textmate": "9.3.2",
|
|
106
|
+
"vue": "3.5.43",
|
|
107
|
+
"vue-eslint-parser": "10.4.1",
|
|
108
|
+
"vue-tsc": "3.3.11"
|
|
109
|
+
},
|
|
82
110
|
"engines": {
|
|
83
111
|
"node": ">=20"
|
|
84
112
|
},
|
|
@@ -89,5 +117,62 @@
|
|
|
89
117
|
"reka-ui": "2.11.0"
|
|
90
118
|
}
|
|
91
119
|
},
|
|
92
|
-
"homepage": "https://www.varvis.me/docs/"
|
|
93
|
-
|
|
120
|
+
"homepage": "https://www.varvis.me/docs/",
|
|
121
|
+
"scripts": {
|
|
122
|
+
"check:docs": "node --test scripts/check-doc-versions.test.mjs && node scripts/check-doc-versions.mjs",
|
|
123
|
+
"dev": "vite build --watch",
|
|
124
|
+
"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",
|
|
125
|
+
"lint": "eslint .",
|
|
126
|
+
"typecheck": "vue-tsc --noEmit -p tsconfig.json",
|
|
127
|
+
"test": "vitest run",
|
|
128
|
+
"test:watch": "vitest",
|
|
129
|
+
"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}",
|
|
130
|
+
"story": "histoire dev",
|
|
131
|
+
"story:build": "histoire build",
|
|
132
|
+
"check:host": "node scripts/dsm-host-shots.mjs",
|
|
133
|
+
"check:switch": "node scripts/check-switch.mjs",
|
|
134
|
+
"check:tabs": "node scripts/check-tabs.mjs",
|
|
135
|
+
"check:mobile": "node scripts/check-mobile-overflow.mjs",
|
|
136
|
+
"check:ui-patch": "node scripts/check-ui-patch.mjs",
|
|
137
|
+
"check:narrow": "node scripts/check-narrow-controls.mjs",
|
|
138
|
+
"check:drawer-form": "node scripts/check-drawer-form.mjs",
|
|
139
|
+
"check:responsive": "node scripts/check-responsive.mjs",
|
|
140
|
+
"check:adaptive": "node scripts/check-adaptive.mjs",
|
|
141
|
+
"check:sidebar-focus": "node scripts/check-sidebar-focus.mjs",
|
|
142
|
+
"check:json-render": "node scripts/check-json-render.mjs",
|
|
143
|
+
"check:motion": "node scripts/check-motion.mjs",
|
|
144
|
+
"check:topology": "node scripts/check-topology.mjs",
|
|
145
|
+
"check:wizard": "node scripts/check-wizard.mjs",
|
|
146
|
+
"check:edges": "node scripts/check-edges.mjs",
|
|
147
|
+
"check:data-grid": "node scripts/check-data-grid.mjs",
|
|
148
|
+
"check:truncation": "node scripts/check-truncation.mjs",
|
|
149
|
+
"check:link": "node scripts/check-link.mjs",
|
|
150
|
+
"check:text-select": "node scripts/check-text-select.mjs",
|
|
151
|
+
"check:date-picker": "node scripts/check-date-picker.mjs",
|
|
152
|
+
"check:full-page": "node scripts/check-full-page.mjs",
|
|
153
|
+
"check:short-viewport": "node scripts/check-short-viewport.mjs",
|
|
154
|
+
"check:phone-layout": "node scripts/check-phone-layout.mjs",
|
|
155
|
+
"check:text-zoom": "node scripts/check-text-zoom.mjs",
|
|
156
|
+
"check:focus-restore": "node scripts/check-focus-restore.mjs",
|
|
157
|
+
"check:detail-surface": "node scripts/check-detail-surface.mjs",
|
|
158
|
+
"check:internal": "node --test scripts/check-internal-content.test.mjs scripts/check-npm-metadata.test.mjs && node scripts/check-internal-content.mjs --repo .",
|
|
159
|
+
"check:npm-metadata": "node scripts/check-npm-metadata.mjs",
|
|
160
|
+
"check:package": "node scripts/check-package-content.mjs",
|
|
161
|
+
"check:public-api-consumer": "node scripts/check-public-api-consumer.mjs",
|
|
162
|
+
"notices:update": "node scripts/third-party-notices.mjs --write",
|
|
163
|
+
"notices:check": "node scripts/third-party-notices.mjs --check",
|
|
164
|
+
"check": "bash scripts/docker-check.sh \"npm run gates\"",
|
|
165
|
+
"check:fast": "bash scripts/docker-check.sh \"npm run gates\"",
|
|
166
|
+
"check:local-browser": "node scripts/app-local-browser.mjs",
|
|
167
|
+
"check:infotip": "node scripts/check-infotip.mjs",
|
|
168
|
+
"release:stage": "node scripts/stage-release.mjs",
|
|
169
|
+
"check:polish": "bash scripts/docker-check.sh --build --out .polish-shots 'node scripts/check-polish.mjs'",
|
|
170
|
+
"check:acceptance": "node scripts/check-acceptance.mjs",
|
|
171
|
+
"check:palette": "node scripts/check-palette.mjs",
|
|
172
|
+
"gates": "node scripts/gates.mjs",
|
|
173
|
+
"gates:full": "node scripts/gates.mjs --full",
|
|
174
|
+
"check:layout": "node scripts/check-layout.mjs",
|
|
175
|
+
"release:smoke": "node scripts/release-smoke.mjs",
|
|
176
|
+
"check:browser-install": "playwright install chromium"
|
|
177
|
+
}
|
|
178
|
+
}
|