@bpmn-io/form-js-viewer 2.0.0 → 2.1.0
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/index.cjs +7 -6
- package/dist/index.cjs.map +1 -1
- package/dist/index.es.js +8 -7
- package/dist/index.es.js.map +1 -1
- package/package.json +3 -3
- package/dist/assets/theme.css +0 -168
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bpmn-io/form-js-viewer",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.1.0",
|
|
4
4
|
"description": "View forms - powered by bpmn.io",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
@@ -46,14 +46,14 @@
|
|
|
46
46
|
"url": "https://github.com/bpmn-io"
|
|
47
47
|
},
|
|
48
48
|
"dependencies": {
|
|
49
|
-
"@bpmn-io/feelin": "^
|
|
49
|
+
"@bpmn-io/feelin": "^7.0.0",
|
|
50
50
|
"@carbon/grid": "^11.49.0",
|
|
51
51
|
"big.js": "^7.0.1",
|
|
52
52
|
"classnames": "^2.5.1",
|
|
53
53
|
"diagram-js": "^15.22.0",
|
|
54
54
|
"didi": "^11.0.0",
|
|
55
55
|
"dompurify": "^3.4.11",
|
|
56
|
-
"feelers": "^3.
|
|
56
|
+
"feelers": "^3.2.0",
|
|
57
57
|
"flatpickr": "^4.6.13",
|
|
58
58
|
"ids": "^3.0.2",
|
|
59
59
|
"lodash": "^4.18.1",
|
package/dist/assets/theme.css
DELETED
|
@@ -1,168 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* The bpmn.io design tokens.
|
|
3
|
-
*
|
|
4
|
-
* Apply `bio-theme` to a component root — or to any common ancestor — and
|
|
5
|
-
* everything below inherits the tokens.
|
|
6
|
-
*
|
|
7
|
-
* Two tiers: the raw palette (`--color-*`) and the semantic tokens (`--bio-*`).
|
|
8
|
-
* Components derive their own variables from the semantic tokens; a theme
|
|
9
|
-
* rebinds the tokens, and reaches a component variable only to deviate.
|
|
10
|
-
*
|
|
11
|
-
* A theme has to match the element itself, not just an ancestor
|
|
12
|
-
* (`.my-theme .bio-theme`), because a custom property declared on an
|
|
13
|
-
* element always beats one inherited from above.
|
|
14
|
-
*/
|
|
15
|
-
.bio-theme {
|
|
16
|
-
|
|
17
|
-
/* greys */
|
|
18
|
-
--color-grey-225-10-15: hsl(225, 10%, 15%);
|
|
19
|
-
--color-grey-225-10-35: hsl(225, 10%, 35%);
|
|
20
|
-
--color-grey-225-10-45: hsl(225, 10%, 45%);
|
|
21
|
-
--color-grey-225-10-55: hsl(225, 10%, 55%);
|
|
22
|
-
--color-grey-225-10-75: hsl(225, 10%, 75%);
|
|
23
|
-
--color-grey-225-10-80: hsl(225, 10%, 80%);
|
|
24
|
-
--color-grey-225-10-85: hsl(225, 10%, 85%);
|
|
25
|
-
--color-grey-225-10-90: hsl(225, 10%, 90%);
|
|
26
|
-
--color-grey-225-10-93: hsl(225, 10%, 93%);
|
|
27
|
-
--color-grey-225-10-95: hsl(225, 10%, 95%);
|
|
28
|
-
--color-grey-225-10-97: hsl(225, 10%, 97%);
|
|
29
|
-
--color-grey-0-0-22: hsl(0, 0%, 22%);
|
|
30
|
-
--color-grey-0-0-88: hsl(0, 0%, 88%);
|
|
31
|
-
|
|
32
|
-
/* blues */
|
|
33
|
-
--color-blue-205-100-35: hsl(205, 100%, 35%);
|
|
34
|
-
--color-blue-205-100-40: hsl(205, 100%, 40%);
|
|
35
|
-
--color-blue-205-100-45: hsl(205, 100%, 45%);
|
|
36
|
-
--color-blue-205-100-50: hsl(205, 100%, 50%);
|
|
37
|
-
|
|
38
|
-
/* name says 70, value is 75%; preserved verbatim, since correcting it would
|
|
39
|
-
change what diagram-js renders */
|
|
40
|
-
--color-blue-205-100-70: hsl(205, 100%, 75%);
|
|
41
|
-
|
|
42
|
-
--color-blue-205-100-80: hsl(205, 100%, 80%);
|
|
43
|
-
--color-blue-205-100-85: hsl(205, 100%, 85%);
|
|
44
|
-
--color-blue-205-100-95: hsl(205, 100%, 95%);
|
|
45
|
-
--color-blue-218-100-74: hsl(218, 100%, 74%);
|
|
46
|
-
|
|
47
|
-
--color-blue-219-99-53: hsl(219, 99%, 53%);
|
|
48
|
-
|
|
49
|
-
/* greens */
|
|
50
|
-
--color-green-150-86-44: hsl(150, 86%, 44%);
|
|
51
|
-
|
|
52
|
-
/* reds */
|
|
53
|
-
--color-red-360-100-35: hsl(360, 100%, 35%);
|
|
54
|
-
--color-red-360-100-40: hsl(360, 100%, 40%);
|
|
55
|
-
--color-red-360-100-45: hsl(360, 100%, 45%);
|
|
56
|
-
--color-red-360-100-92: hsl(360, 100%, 92%);
|
|
57
|
-
--color-red-360-100-95: hsl(360, 100%, 95%);
|
|
58
|
-
--color-red-360-100-97: hsl(360, 100%, 97%);
|
|
59
|
-
|
|
60
|
-
/* ambers */
|
|
61
|
-
--color-amber-39-100-33: hsl(39, 100%, 33%);
|
|
62
|
-
--color-amber-35-84-57: hsl(35, 84%, 57%);
|
|
63
|
-
--color-amber-35-84-62: hsl(35, 84%, 62%);
|
|
64
|
-
--color-amber-38-100-96: hsl(38, 100%, 96%);
|
|
65
|
-
|
|
66
|
-
/* neutrals */
|
|
67
|
-
--color-white: hsl(0, 0%, 100%);
|
|
68
|
-
--color-black: hsl(0, 0%, 0%);
|
|
69
|
-
--color-transparent: transparent;
|
|
70
|
-
|
|
71
|
-
/* alpha variants */
|
|
72
|
-
--color-blue-205-100-45-opacity-30: hsla(205, 100%, 45%, 30%);
|
|
73
|
-
--color-blue-205-100-50-opacity-15: hsla(205, 100%, 50%, 15%);
|
|
74
|
-
--color-blue-205-100-50-a35: hsla(205, 100%, 50%, 0.35);
|
|
75
|
-
/* name says 100 and 05, value is 99% at 0.5 alpha; preserved verbatim, since
|
|
76
|
-
correcting it would change what diagram-js renders */
|
|
77
|
-
--color-blue-219-100-53-05: hsla(219, 99%, 53%, 0.5);
|
|
78
|
-
--color-red-360-100-45-a35: hsla(360, 100%, 45%, 0.35);
|
|
79
|
-
--color-amber-35-84-62-a35: hsla(35, 84%, 62%, 0.35);
|
|
80
|
-
--color-black-opacity-05: hsla(0, 0%, 0%, 5%);
|
|
81
|
-
--color-black-opacity-10: hsla(0, 0%, 0%, 10%);
|
|
82
|
-
--color-black-opacity-20: hsla(0, 0%, 0%, 20%);
|
|
83
|
-
--color-black-opacity-30: hsla(0, 0%, 0%, 30%);
|
|
84
|
-
|
|
85
|
-
/**
|
|
86
|
-
* Semantic tokens — the theming contract. Defaults reproduce the current
|
|
87
|
-
* bpmn.io look, so adopting the layer is not a visual change.
|
|
88
|
-
*/
|
|
89
|
-
|
|
90
|
-
/* surfaces */
|
|
91
|
-
--bio-surface: var(--color-white);
|
|
92
|
-
--bio-surface-overlay: var(--color-white);
|
|
93
|
-
--bio-surface-subtle: var(--color-grey-225-10-97);
|
|
94
|
-
--bio-surface-medium: var(--color-grey-225-10-95);
|
|
95
|
-
--bio-surface-strong: var(--color-grey-225-10-90);
|
|
96
|
-
|
|
97
|
-
/* tooltips contrast with the page rather than sit on it, so they invert */
|
|
98
|
-
--bio-surface-inverted: var(--color-grey-225-10-15);
|
|
99
|
-
--bio-surface-inverted-subtle: var(--color-grey-225-10-35);
|
|
100
|
-
|
|
101
|
-
/* content */
|
|
102
|
-
--bio-text: var(--color-grey-225-10-15);
|
|
103
|
-
--bio-text-subtle: var(--color-grey-225-10-35);
|
|
104
|
-
--bio-text-subtlest: var(--color-grey-225-10-55);
|
|
105
|
-
--bio-text-on-primary: var(--color-white);
|
|
106
|
-
--bio-text-on-inverted: var(--color-white);
|
|
107
|
-
|
|
108
|
-
/* lines */
|
|
109
|
-
--bio-border: var(--color-grey-225-10-75);
|
|
110
|
-
--bio-border-subtle: var(--color-grey-225-10-85);
|
|
111
|
-
--bio-border-disabled: var(--color-grey-225-10-90);
|
|
112
|
-
|
|
113
|
-
/* form-control borders */
|
|
114
|
-
--bio-border-input: var(--color-grey-225-10-75);
|
|
115
|
-
|
|
116
|
-
/* primary action */
|
|
117
|
-
--bio-primary: var(--color-blue-205-100-50);
|
|
118
|
-
--bio-primary-hover: var(--color-blue-205-100-45);
|
|
119
|
-
--bio-primary-surface: var(--color-blue-205-100-95);
|
|
120
|
-
|
|
121
|
-
/* stronger than `--bio-primary-surface`, to stay visible under selected text */
|
|
122
|
-
--bio-primary-surface-strong: var(--color-blue-205-100-85);
|
|
123
|
-
|
|
124
|
-
/* danger */
|
|
125
|
-
--bio-danger: var(--color-red-360-100-45);
|
|
126
|
-
--bio-danger-hover: var(--color-red-360-100-40);
|
|
127
|
-
--bio-danger-surface: var(--color-red-360-100-92);
|
|
128
|
-
--bio-danger-surface-subtle: var(--color-red-360-100-97);
|
|
129
|
-
|
|
130
|
-
/* warning */
|
|
131
|
-
--bio-warning: var(--color-amber-35-84-62);
|
|
132
|
-
--bio-warning-hover: var(--color-amber-35-84-57);
|
|
133
|
-
--bio-warning-text: var(--color-amber-39-100-33);
|
|
134
|
-
--bio-warning-surface: var(--color-amber-38-100-96);
|
|
135
|
-
|
|
136
|
-
/* success */
|
|
137
|
-
--bio-success: var(--color-green-150-86-44);
|
|
138
|
-
|
|
139
|
-
/* informational — links */
|
|
140
|
-
--bio-info: var(--color-blue-205-100-50);
|
|
141
|
-
--bio-info-hover: var(--color-blue-205-100-45);
|
|
142
|
-
|
|
143
|
-
/* a link on `--bio-surface-inverted` */
|
|
144
|
-
--bio-info-on-inverted: var(--color-blue-218-100-74);
|
|
145
|
-
|
|
146
|
-
/* a selected menu entry, which the default look marks no louder than hover */
|
|
147
|
-
--bio-selected-surface: var(--bio-surface-medium);
|
|
148
|
-
--bio-selected-text: var(--bio-text);
|
|
149
|
-
|
|
150
|
-
/* focus */
|
|
151
|
-
--bio-focus: var(--color-blue-205-100-40);
|
|
152
|
-
--bio-focus-ring: var(--color-blue-205-100-50-a35);
|
|
153
|
-
--bio-focus-ring-danger: var(--color-red-360-100-45-a35);
|
|
154
|
-
--bio-focus-ring-warning: var(--color-amber-35-84-62-a35);
|
|
155
|
-
|
|
156
|
-
/* a wash behind a focused control, where the design fills rather than rings */
|
|
157
|
-
--bio-focus-surface: var(--color-blue-205-100-95);
|
|
158
|
-
|
|
159
|
-
/* elevation */
|
|
160
|
-
--bio-shadow: var(--color-black-opacity-30);
|
|
161
|
-
--bio-shadow-subtle: var(--color-black-opacity-10);
|
|
162
|
-
|
|
163
|
-
/* corners — fully-round shapes (dots, toggle tracks) are geometry, not scale,
|
|
164
|
-
and stay off this ladder */
|
|
165
|
-
--bio-radius-sm: 2px;
|
|
166
|
-
--bio-radius-md: 3px;
|
|
167
|
-
--bio-radius-lg: 4px;
|
|
168
|
-
}
|