clickgo 6.1.4 → 6.1.5
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/dist/app/demo.cga +0 -0
- package/dist/app/task.cga +0 -0
- package/dist/control/form.cgc +0 -0
- package/dist/index.js +1 -1
- package/doc/clickgo-rag.md +2 -0
- package/package.json +1 -1
- package/test/form-native-style.mjs +70 -0
package/doc/clickgo-rag.md
CHANGED
|
@@ -2852,6 +2852,8 @@ public init(canvas: fabric.Canvas): void {
|
|
|
2852
2852
|
|
|
2853
2853
|
标准的窗体组件，支持拖拽、缩放、最大化、最小化等。
|
|
2854
2854
|
|
|
2855
|
+
沉浸式 Native 的首个窗体不绘制外层圆角、边框和阴影，由系统负责实体窗口外形；不受主题和 `border` 参数影响。标题栏仍按 `border` 参数显示，窗体内其他控件的圆角和边框不受影响。网页、带系统标题栏的 Native 和后续窗体保持原有样式。
|
|
2856
|
+
|
|
2855
2857
|
### 参数
|
|
2856
2858
|
|
|
2857
2859
|
#### icon
|
package/package.json
CHANGED
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
// Run: node test/form-native-style.mjs
|
|
2
|
+
import assert from 'node:assert/strict';
|
|
3
|
+
import { readFile } from 'node:fs/promises';
|
|
4
|
+
import { JSDOM } from 'jsdom';
|
|
5
|
+
|
|
6
|
+
const dom = new JSDOM('<!doctype html><html><head></head><body></body></html>');
|
|
7
|
+
for (const name of ['window', 'document', 'Element', 'SVGElement', 'Node', 'HTMLElement']) {
|
|
8
|
+
globalThis[name] = dom.window[name];
|
|
9
|
+
}
|
|
10
|
+
const { createApp, compile, nextTick } = await import('vue');
|
|
11
|
+
const template = await readFile(new URL('../dist/sources/control/form/layout.html', import.meta.url), 'utf8');
|
|
12
|
+
const render = compile(template);
|
|
13
|
+
const theme = document.createElement('style');
|
|
14
|
+
theme.textContent = `
|
|
15
|
+
.wrap { border: 3px solid black !important; border-radius: 24px !important; box-shadow: 0 0 8px black !important; }
|
|
16
|
+
.wrap > .inner, .wrap > .inner > .header, .wrap > .inner > .content { border-radius: 24px !important; }
|
|
17
|
+
.child-control { border: 1px solid blue; border-radius: 12px; }
|
|
18
|
+
`;
|
|
19
|
+
document.head.append(theme);
|
|
20
|
+
|
|
21
|
+
for (const nativeFirst of [true, false]) {
|
|
22
|
+
for (const border of ['normal', 'thin', 'plain', 'none']) {
|
|
23
|
+
const host = document.createElement('div');
|
|
24
|
+
document.body.append(host);
|
|
25
|
+
const app = createApp({
|
|
26
|
+
render,
|
|
27
|
+
data: () => ({
|
|
28
|
+
border, isNativeNoFrameFirst: nativeFirst, flashTimer: undefined,
|
|
29
|
+
stateMinData: false, stateMaxData: false, taskPosition: 'bottom',
|
|
30
|
+
isShow: true, isInside: false, formFocus: false, widthData: 500,
|
|
31
|
+
heightData: 400, leftData: 0, topData: 0, zIndex: 1,
|
|
32
|
+
isMask: false, isResize: false, iconDataUrl: '', title: 'Notepad',
|
|
33
|
+
isMin: true, isMax: true, isClose: true, direction: 'v',
|
|
34
|
+
background: '', padding: '', stepShowData: false, stepData: [],
|
|
35
|
+
stepValue: '', isLoading: false,
|
|
36
|
+
}),
|
|
37
|
+
methods: { moveMethod() {}, minMethod() {}, maxMethod() {}, closeMethod() {}, stepDown() {} },
|
|
38
|
+
});
|
|
39
|
+
app.component('cg-step', { render: () => null });
|
|
40
|
+
app.component('cg-loading', { render: () => null });
|
|
41
|
+
const form = app.mount(host);
|
|
42
|
+
const wrap = host.querySelector('.wrap');
|
|
43
|
+
const inner = host.querySelector('.inner');
|
|
44
|
+
const content = host.querySelector('.content');
|
|
45
|
+
const header = host.querySelector('.header');
|
|
46
|
+
assert.equal(Boolean(header), border === 'normal' || border === 'thin');
|
|
47
|
+
const child = document.createElement('div');
|
|
48
|
+
child.className = 'child-control';
|
|
49
|
+
content.append(child);
|
|
50
|
+
for (const focused of [false, true]) {
|
|
51
|
+
form.formFocus = focused;
|
|
52
|
+
form.stateMaxData = focused;
|
|
53
|
+
await nextTick();
|
|
54
|
+
for (const el of [wrap, inner, content, header].filter(Boolean)) {
|
|
55
|
+
assert.equal(el.style.getPropertyPriority('border-radius'), nativeFirst ? 'important' : '');
|
|
56
|
+
assert.equal(dom.window.getComputedStyle(el).borderRadius, nativeFirst ? '0' : '24px');
|
|
57
|
+
}
|
|
58
|
+
for (const property of ['border', 'box-shadow']) {
|
|
59
|
+
assert.equal(wrap.style.getPropertyPriority(property), nativeFirst ? 'important' : '');
|
|
60
|
+
}
|
|
61
|
+
assert.equal(dom.window.getComputedStyle(wrap).boxShadow, nativeFirst ? 'none' : '0 0 8px black');
|
|
62
|
+
assert.equal(dom.window.getComputedStyle(wrap).borderTopWidth, nativeFirst ? '0px' : '3px');
|
|
63
|
+
assert.equal(dom.window.getComputedStyle(child).borderRadius, '12px');
|
|
64
|
+
assert.equal(dom.window.getComputedStyle(child).borderTopWidth, '1px');
|
|
65
|
+
}
|
|
66
|
+
app.unmount();
|
|
67
|
+
host.remove();
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
console.log('Native first-Form styling, theme overrides and ordinary Form isolation checks passed.');
|