@breadstone/mosaik-elements-foundation 0.0.224 → 0.0.226

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.
Files changed (38) hide show
  1. package/Controls/Components/Grouping/Message/IMessageElementProps.d.ts +19 -0
  2. package/Controls/Components/Grouping/Message/IMessageElementProps.d.ts.map +1 -0
  3. package/Controls/Components/Grouping/Message/IMessageElementProps.js +3 -0
  4. package/Controls/Components/Grouping/Message/IMessageElementProps.js.map +1 -0
  5. package/Controls/Components/Grouping/Message/MessageElement.d.ts +129 -0
  6. package/Controls/Components/Grouping/Message/MessageElement.d.ts.map +1 -0
  7. package/Controls/Components/Grouping/Message/MessageElement.js +225 -0
  8. package/Controls/Components/Grouping/Message/MessageElement.js.map +1 -0
  9. package/Controls/Components/Grouping/Message/MessageElementTemplate.d.ts +9 -0
  10. package/Controls/Components/Grouping/Message/MessageElementTemplate.d.ts.map +1 -0
  11. package/Controls/Components/Grouping/Message/MessageElementTemplate.js +61 -0
  12. package/Controls/Components/Grouping/Message/MessageElementTemplate.js.map +1 -0
  13. package/Controls/Components/Grouping/Message/Themes/MessageElement.Cosmopolitan.d.ts +6 -0
  14. package/Controls/Components/Grouping/Message/Themes/MessageElement.Cosmopolitan.d.ts.map +1 -0
  15. package/Controls/Components/Grouping/Message/Themes/MessageElement.Cosmopolitan.js +193 -0
  16. package/Controls/Components/Grouping/Message/Themes/MessageElement.Cosmopolitan.js.map +1 -0
  17. package/Controls/Components/Grouping/Message/Themes/MessageElement.Joy.d.ts +6 -0
  18. package/Controls/Components/Grouping/Message/Themes/MessageElement.Joy.d.ts.map +1 -0
  19. package/Controls/Components/Grouping/Message/Themes/MessageElement.Joy.js +395 -0
  20. package/Controls/Components/Grouping/Message/Themes/MessageElement.Joy.js.map +1 -0
  21. package/Controls/Components/Grouping/Message/Themes/MessageElement.Memphis.d.ts +6 -0
  22. package/Controls/Components/Grouping/Message/Themes/MessageElement.Memphis.d.ts.map +1 -0
  23. package/Controls/Components/Grouping/Message/Themes/MessageElement.Memphis.js +311 -0
  24. package/Controls/Components/Grouping/Message/Themes/MessageElement.Memphis.js.map +1 -0
  25. package/Controls/Components/Primitives/Text/TextElement.d.ts +0 -3
  26. package/Controls/Components/Primitives/Text/TextElement.d.ts.map +1 -1
  27. package/Controls/Components/Primitives/Text/TextElement.js +2 -5
  28. package/Controls/Components/Primitives/Text/TextElement.js.map +1 -1
  29. package/Controls/Types/TextFormatter.d.ts +171 -29
  30. package/Controls/Types/TextFormatter.d.ts.map +1 -1
  31. package/Controls/Types/TextFormatter.js +550 -129
  32. package/Controls/Types/TextFormatter.js.map +1 -1
  33. package/Index.d.ts +1 -0
  34. package/Index.d.ts.map +1 -1
  35. package/Index.js +1 -0
  36. package/Index.js.map +1 -1
  37. package/custom-elements.json +598 -0
  38. package/package.json +3 -3
@@ -0,0 +1,193 @@
1
+ // ------------------------------------------------------------------------------
2
+ // <auto-generated>
3
+ // This code was generated by a tool.
4
+ // Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
5
+ // </auto-generated>
6
+ // ------------------------------------------------------------------------------
7
+ // #region Imports
8
+ import { css } from '../../../../../Dom/Css';
9
+ // #endregion
10
+ /**
11
+ * @public
12
+ */
13
+ export function messageElementCosmopolitanStyle() {
14
+ return css `
15
+ :host {
16
+ --message-background-color: unset;
17
+ --message-border-color: unset;
18
+ --message-border-radius: unset;
19
+ --message-border-style: unset;
20
+ --message-border-width: unset;
21
+ --message-font-family: unset;
22
+ --message-font-letter-spacing: unset;
23
+ --message-font-line-height: unset;
24
+ --message-font-size: unset;
25
+ --message-font-text-decoration: unset;
26
+ --message-font-text-transform: unset;
27
+ --message-font-weight: unset;
28
+ --message-foreground-color: unset;
29
+ --message-gap: unset;
30
+ --message-padding-bottom: unset;
31
+ --message-padding-left: unset;
32
+ --message-padding-right: unset;
33
+ --message-padding-top: unset;
34
+ --message-shadow: unset;
35
+ --message-transition-duration: unset;
36
+ --message-transition-mode: unset;
37
+ --message-transition-property: unset;
38
+ --message-translate: unset;
39
+ }
40
+
41
+ @media screen and (prefers-reduced-motion: reduce) {
42
+ :host {
43
+ transition-duration: .01ms;
44
+ }
45
+ }
46
+
47
+ :host {
48
+ box-sizing: border-box;
49
+ display: block;
50
+ position: relative;
51
+ }
52
+
53
+ :host *, :host :before, :host :after {
54
+ box-sizing: border-box;
55
+ background-repeat: no-repeat;
56
+ }
57
+
58
+ :host :before, :host :after {
59
+ text-decoration: inherit;
60
+ vertical-align: inherit;
61
+ }
62
+
63
+ :host([hidden]) {
64
+ display: none !important;
65
+ }
66
+
67
+ :host {
68
+ font-family: var(--message-font-family);
69
+ font-size: var(--message-font-size);
70
+ font-weight: var(--message-font-weight);
71
+ background-color: var(--message-background-color);
72
+ color: var(--message-foreground-color);
73
+ border-color: var(--message-border-color);
74
+ border-width: var(--message-border-width);
75
+ border-style: var(--message-border-style);
76
+ border-radius: calc(var(--message-border-radius) / 2);
77
+ transition-duration: var(--message-transition-duration);
78
+ transition-timing-function: var(--message-transition-mode);
79
+ transition-property: var(--message-transition-property);
80
+ padding-top: var(--message-padding-top);
81
+ padding-left: var(--message-padding-left);
82
+ padding-bottom: var(--message-padding-bottom);
83
+ padding-right: var(--message-padding-right);
84
+ box-sizing: border-box;
85
+ display: block;
86
+ position: relative;
87
+ overflow: hidden;
88
+ }
89
+
90
+ :host [part="root"] {
91
+ box-sizing: inherit;
92
+ gap: var(--message-gap);
93
+ flex-direction: row;
94
+ max-width: 100%;
95
+ display: flex;
96
+ position: relative;
97
+ }
98
+
99
+ :host [part="root"]:before {
100
+ content: "";
101
+ top: calc(var(--message-padding-top) * -1);
102
+ left: calc(var(--message-padding-left) * -1);
103
+ bottom: calc(var(--message-padding-bottom) * -1);
104
+ width: calc(var(--message-gap) / 2);
105
+ background-color: var(--message-border-color);
106
+ border-radius: var(--message-border-radius);
107
+ position: absolute;
108
+ }
109
+
110
+ :host [part="root"] [part="icon"] {
111
+ color: inherit;
112
+ flex-shrink: 0;
113
+ }
114
+
115
+ :host [part="root"] [part="text"] {
116
+ gap: calc(var(--message-gap) / 2);
117
+ flex-direction: column;
118
+ flex: 1;
119
+ justify-content: center;
120
+ align-items: flex-start;
121
+ display: flex;
122
+ }
123
+
124
+ :host [part="root"] [part="text"] [part="header"], :host [part="root"] [part="text"] [part="content"] {
125
+ color: inherit;
126
+ }
127
+
128
+ :host [part="root"] [part="close"] {
129
+ flex-shrink: 0;
130
+ align-self: flex-start;
131
+ }
132
+
133
+ :host([fit="width"]) {
134
+ width: 100%;
135
+ }
136
+
137
+ :host([fit="height"]) {
138
+ height: 100%;
139
+ }
140
+
141
+ :host([fit="both"]) {
142
+ width: 100%;
143
+ height: 100%;
144
+ }
145
+
146
+ :host([appearance="outline"]) {
147
+ --message-background-color: var(--cosmopolitan-scheme-background);
148
+ --message-foreground-color: var(--cosmopolitan-scheme-foreground);
149
+ --message-border-color: var(--cosmopolitan-scheme-highlight);
150
+ --message-border-width: var(--cosmopolitan-layout-thickness);
151
+ --message-border-style: solid;
152
+ }
153
+
154
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
155
+ --message-foreground-color: var(--cosmopolitan-color-primary-500);
156
+ --message-border-color: var(--cosmopolitan-color-primary-500);
157
+ }
158
+
159
+ :host([appearance="soft"]) {
160
+ --message-background-color: var(--cosmopolitan-scheme-highlight);
161
+ --message-foreground-color: var(--cosmopolitan-scheme-foreground);
162
+ --message-border-width: 0;
163
+ }
164
+
165
+ :host([appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
166
+ --message-background-color: var(--cosmopolitan-color-primary-100);
167
+ --message-foreground-color: var(--cosmopolitan-color-primary-500);
168
+ }
169
+
170
+ :host([appearance="plain"]) {
171
+ --message-background-color: var(--cosmopolitan-scheme-background);
172
+ --message-foreground-color: var(--cosmopolitan-scheme-foreground);
173
+ --message-border-width: 0;
174
+ }
175
+
176
+ :host([appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
177
+ --message-foreground-color: var(--cosmopolitan-color-primary-500);
178
+ }
179
+
180
+ :host([appearance="solid"]) {
181
+ --message-background-color: var(--cosmopolitan-scheme-highlight);
182
+ --message-foreground-color: var(--cosmopolitan-scheme-foreground);
183
+ --message-border-width: 0;
184
+ }
185
+
186
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
187
+ --message-background-color: var(--cosmopolitan-color-primary-500);
188
+ --message-foreground-color: var(--cosmopolitan-color-primary-0);
189
+ }
190
+
191
+ `;
192
+ }
193
+ //# sourceMappingURL=MessageElement.Cosmopolitan.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MessageElement.Cosmopolitan.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/Message/Themes/MessageElement.Cosmopolitan.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,+BAA+B;IAC3C,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAiLT,CAAC;AACN,CAAC"}
@@ -0,0 +1,6 @@
1
+ import { type CSSResult } from '../../../../../Dom/Css';
2
+ /**
3
+ * @public
4
+ */
5
+ export declare function messageElementJoyStyle(): CSSResult;
6
+ //# sourceMappingURL=MessageElement.Joy.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MessageElement.Joy.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/Message/Themes/MessageElement.Joy.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,sBAAsB,IAAI,SAAS,CA6XlD"}
@@ -0,0 +1,395 @@
1
+ // ------------------------------------------------------------------------------
2
+ // <auto-generated>
3
+ // This code was generated by a tool.
4
+ // Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
5
+ // </auto-generated>
6
+ // ------------------------------------------------------------------------------
7
+ // #region Imports
8
+ import { css } from '../../../../../Dom/Css';
9
+ // #endregion
10
+ /**
11
+ * @public
12
+ */
13
+ export function messageElementJoyStyle() {
14
+ return css `
15
+ :host {
16
+ --message-background-color: var(--joy-scheme-background);
17
+ --message-border-color: var(--joy-scheme-highlight);
18
+ --message-border-radius: var(--joy-layout-radius);
19
+ --message-border-style: solid;
20
+ --message-border-width: var(--joy-layout-thickness);
21
+ --message-font-family: var(--joy-font-family);
22
+ --message-font-letter-spacing: unset;
23
+ --message-font-line-height: unset;
24
+ --message-font-size: 16px;
25
+ --message-font-text-decoration: unset;
26
+ --message-font-text-transform: unset;
27
+ --message-font-weight: normal;
28
+ --message-foreground-color: var(--joy-scheme-foreground);
29
+ --message-gap: 8px;
30
+ --message-padding-bottom: var(--joy-layout-space);
31
+ --message-padding-left: calc(var(--joy-layout-space) * 2);
32
+ --message-padding-right: calc(var(--joy-layout-space) * 2);
33
+ --message-padding-top: var(--joy-layout-space);
34
+ --message-shadow: var(--joy-elevation-none);
35
+ --message-transition-duration: var(--joy-duration-short);
36
+ --message-transition-mode: ease;
37
+ --message-transition-property: all;
38
+ --message-translate: unset;
39
+ }
40
+
41
+ @media screen and (prefers-reduced-motion: reduce) {
42
+ :host {
43
+ transition-duration: .01ms;
44
+ }
45
+ }
46
+
47
+ :host {
48
+ box-sizing: border-box;
49
+ display: block;
50
+ position: relative;
51
+ }
52
+
53
+ :host *, :host :before, :host :after {
54
+ box-sizing: border-box;
55
+ background-repeat: no-repeat;
56
+ }
57
+
58
+ :host :before, :host :after {
59
+ text-decoration: inherit;
60
+ vertical-align: inherit;
61
+ }
62
+
63
+ :host([hidden]) {
64
+ display: none !important;
65
+ }
66
+
67
+ :host {
68
+ font-family: var(--message-font-family);
69
+ font-size: var(--message-font-size);
70
+ font-weight: var(--message-font-weight);
71
+ background-color: var(--message-background-color);
72
+ color: var(--message-foreground-color);
73
+ border-color: var(--message-border-color);
74
+ border-width: var(--message-border-width);
75
+ border-style: var(--message-border-style);
76
+ border-radius: calc(var(--message-border-radius) / 2);
77
+ transition-duration: var(--message-transition-duration);
78
+ transition-timing-function: var(--message-transition-mode);
79
+ transition-property: var(--message-transition-property);
80
+ padding-top: var(--message-padding-top);
81
+ padding-left: var(--message-padding-left);
82
+ padding-bottom: var(--message-padding-bottom);
83
+ padding-right: var(--message-padding-right);
84
+ box-sizing: border-box;
85
+ display: block;
86
+ position: relative;
87
+ overflow: hidden;
88
+ }
89
+
90
+ :host [part="root"] {
91
+ box-sizing: inherit;
92
+ gap: var(--message-gap);
93
+ flex-direction: row;
94
+ max-width: 100%;
95
+ display: flex;
96
+ position: relative;
97
+ }
98
+
99
+ :host [part="root"]:before {
100
+ content: "";
101
+ top: calc(var(--message-padding-top) * -1);
102
+ left: calc(var(--message-padding-left) * -1);
103
+ bottom: calc(var(--message-padding-bottom) * -1);
104
+ width: calc(var(--message-gap) / 2);
105
+ background-color: var(--message-border-color);
106
+ border-radius: var(--message-border-radius);
107
+ position: absolute;
108
+ }
109
+
110
+ :host [part="root"] [part="icon"] {
111
+ color: inherit;
112
+ flex-shrink: 0;
113
+ }
114
+
115
+ :host [part="root"] [part="text"] {
116
+ gap: calc(var(--message-gap) / 2);
117
+ flex-direction: column;
118
+ flex: 1;
119
+ justify-content: center;
120
+ align-items: flex-start;
121
+ display: flex;
122
+ }
123
+
124
+ :host [part="root"] [part="text"] [part="header"], :host [part="root"] [part="text"] [part="content"] {
125
+ color: inherit;
126
+ }
127
+
128
+ :host [part="root"] [part="close"] {
129
+ flex-shrink: 0;
130
+ align-self: flex-start;
131
+ }
132
+
133
+ :host([fit="width"]) {
134
+ width: 100%;
135
+ }
136
+
137
+ :host([fit="height"]) {
138
+ height: 100%;
139
+ }
140
+
141
+ :host([fit="both"]) {
142
+ width: 100%;
143
+ height: 100%;
144
+ }
145
+
146
+ :host [part="root"] [part="header"] {
147
+ font-family: var(--joy-typography-body1-font-family);
148
+ font-size: var(--joy-typography-body1-font-size);
149
+ line-height: var(--joy-typography-body1-line-height);
150
+ font-weight: var(--joy-typography-body1-font-weight);
151
+ letter-spacing: var(--joy-typography-body1-letter-spacing);
152
+ -webkit-text-decoration: var(--joy-typography-body1-text-decoration);
153
+ text-decoration: var(--joy-typography-body1-text-decoration);
154
+ text-transform: var(--joy-typography-body1-text-transform);
155
+ }
156
+
157
+ :host [part="root"] [part="content"] {
158
+ font-family: var(--joy-typography-body2-font-family);
159
+ font-size: var(--joy-typography-body2-font-size);
160
+ line-height: var(--joy-typography-body2-line-height);
161
+ font-weight: var(--joy-typography-body2-font-weight);
162
+ letter-spacing: var(--joy-typography-body2-letter-spacing);
163
+ -webkit-text-decoration: var(--joy-typography-body2-text-decoration);
164
+ text-decoration: var(--joy-typography-body2-text-decoration);
165
+ text-transform: var(--joy-typography-body2-text-transform);
166
+ }
167
+
168
+ :host([appearance="outline"]) {
169
+ --message-background-color: var(--joy-scheme-background);
170
+ --message-foreground-color: var(--joy-scheme-foreground);
171
+ --message-border-color: var(--joy-scheme-highlight);
172
+ --message-border-width: var(--joy-layout-thickness);
173
+ --message-border-style: none;
174
+ }
175
+
176
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
177
+ --message-foreground-color: var(--joy-color-primary-500);
178
+ --message-border-color: var(--joy-color-primary-500);
179
+ }
180
+
181
+ :host([appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
182
+ --message-foreground-color: var(--joy-color-secondary-500);
183
+ --message-border-color: var(--joy-color-secondary-500);
184
+ }
185
+
186
+ :host([appearance="outline"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
187
+ --message-foreground-color: var(--joy-color-tertiary-500);
188
+ --message-border-color: var(--joy-color-tertiary-500);
189
+ }
190
+
191
+ :host([appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
192
+ --message-foreground-color: var(--joy-color-danger-500);
193
+ --message-border-color: var(--joy-color-danger-500);
194
+ }
195
+
196
+ :host([appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
197
+ --message-foreground-color: var(--joy-color-warning-500);
198
+ --message-border-color: var(--joy-color-warning-500);
199
+ }
200
+
201
+ :host([appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"]))) {
202
+ --message-foreground-color: var(--joy-color-success-500);
203
+ --message-border-color: var(--joy-color-success-500);
204
+ }
205
+
206
+ :host([appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"]))) {
207
+ --message-foreground-color: var(--joy-color-info-500);
208
+ --message-border-color: var(--joy-color-info-500);
209
+ }
210
+
211
+ :host([appearance="outline"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
212
+ --message-foreground-color: var(--joy-color-highlight-500);
213
+ --message-border-color: var(--joy-color-highlight-500);
214
+ }
215
+
216
+ :host([appearance="outline"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
217
+ --message-foreground-color: var(--joy-color-neutral-500);
218
+ --message-border-color: var(--joy-color-neutral-500);
219
+ }
220
+
221
+ :host([appearance="soft"]) {
222
+ --message-background-color: var(--joy-scheme-highlight);
223
+ --message-foreground-color: var(--joy-scheme-foreground);
224
+ --message-border-color: var(--joy-scheme-highlight);
225
+ --message-border-width: 0;
226
+ }
227
+
228
+ :host([appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
229
+ --message-background-color: var(--joy-color-primary-100);
230
+ --message-foreground-color: var(--joy-color-primary-500);
231
+ --message-border-color: var(--joy-color-primary-500);
232
+ }
233
+
234
+ :host([appearance="soft"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
235
+ --message-background-color: var(--joy-color-secondary-100);
236
+ --message-foreground-color: var(--joy-color-secondary-500);
237
+ --message-border-color: var(--joy-color-secondary-500);
238
+ }
239
+
240
+ :host([appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
241
+ --message-background-color: var(--joy-color-tertiary-100);
242
+ --message-foreground-color: var(--joy-color-tertiary-500);
243
+ --message-border-color: var(--joy-color-tertiary-500);
244
+ }
245
+
246
+ :host([appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
247
+ --message-background-color: var(--joy-color-danger-100);
248
+ --message-foreground-color: var(--joy-color-danger-500);
249
+ --message-border-color: var(--joy-color-danger-500);
250
+ }
251
+
252
+ :host([appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
253
+ --message-background-color: var(--joy-color-warning-100);
254
+ --message-foreground-color: var(--joy-color-warning-500);
255
+ --message-border-color: var(--joy-color-warning-500);
256
+ }
257
+
258
+ :host([appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"]))) {
259
+ --message-background-color: var(--joy-color-success-100);
260
+ --message-foreground-color: var(--joy-color-success-500);
261
+ --message-border-color: var(--joy-color-success-500);
262
+ }
263
+
264
+ :host([appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"]))) {
265
+ --message-background-color: var(--joy-color-info-100);
266
+ --message-foreground-color: var(--joy-color-info-500);
267
+ --message-border-color: var(--joy-color-info-500);
268
+ }
269
+
270
+ :host([appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
271
+ --message-background-color: var(--joy-color-highlight-100);
272
+ --message-foreground-color: var(--joy-color-highlight-500);
273
+ --message-border-color: var(--joy-color-highlight-500);
274
+ }
275
+
276
+ :host([appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
277
+ --message-background-color: var(--joy-color-neutral-100);
278
+ --message-foreground-color: var(--joy-color-neutral-500);
279
+ --message-border-color: var(--joy-color-neutral-500);
280
+ }
281
+
282
+ :host([appearance="plain"]) {
283
+ --message-background-color: var(--joy-scheme-transparent);
284
+ --message-foreground-color: var(--joy-scheme-foreground);
285
+ --message-border-width: 0;
286
+ }
287
+
288
+ :host([appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
289
+ --message-foreground-color: var(--joy-color-primary-500);
290
+ --message-border-color: var(--joy-color-primary-500);
291
+ }
292
+
293
+ :host([appearance="plain"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
294
+ --message-foreground-color: var(--joy-color-secondary-500);
295
+ --message-border-color: var(--joy-color-secondary-500);
296
+ }
297
+
298
+ :host([appearance="plain"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
299
+ --message-foreground-color: var(--joy-color-tertiary-500);
300
+ --message-border-color: var(--joy-color-tertiary-500);
301
+ }
302
+
303
+ :host([appearance="plain"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
304
+ --message-foreground-color: var(--joy-color-danger-500);
305
+ --message-border-color: var(--joy-color-danger-500);
306
+ }
307
+
308
+ :host([appearance="plain"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
309
+ --message-foreground-color: var(--joy-color-warning-500);
310
+ --message-border-color: var(--joy-color-warning-500);
311
+ }
312
+
313
+ :host([appearance="plain"][variant="success"]:not([disabled]:not([disabled="false"]))) {
314
+ --message-foreground-color: var(--joy-color-success-500);
315
+ --message-border-color: var(--joy-color-success-500);
316
+ }
317
+
318
+ :host([appearance="plain"][variant="info"]:not([disabled]:not([disabled="false"]))) {
319
+ --message-foreground-color: var(--joy-color-info-500);
320
+ --message-border-color: var(--joy-color-info-500);
321
+ }
322
+
323
+ :host([appearance="plain"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
324
+ --message-foreground-color: var(--joy-color-highlight-500);
325
+ --message-border-color: var(--joy-color-highlight-500);
326
+ }
327
+
328
+ :host([appearance="plain"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
329
+ --message-foreground-color: var(--joy-color-neutral-500);
330
+ --message-border-color: var(--joy-color-neutral-500);
331
+ }
332
+
333
+ :host([appearance="solid"]) {
334
+ --message-background-color: var(--joy-scheme-transparent);
335
+ --message-foreground-color: var(--joy-scheme-foreground);
336
+ --message-border-width: 0;
337
+ }
338
+
339
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
340
+ --message-background-color: var(--joy-color-primary-500);
341
+ --message-foreground-color: var(--joy-color-primary-0);
342
+ --message-border-color: var(--joy-color-primary-700);
343
+ }
344
+
345
+ :host([appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
346
+ --message-background-color: var(--joy-color-secondary-500);
347
+ --message-foreground-color: var(--joy-color-secondary-0);
348
+ --message-border-color: var(--joy-color-secondary-700);
349
+ }
350
+
351
+ :host([appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
352
+ --message-background-color: var(--joy-color-tertiary-500);
353
+ --message-foreground-color: var(--joy-color-tertiary-0);
354
+ --message-border-color: var(--joy-color-tertiary-700);
355
+ }
356
+
357
+ :host([appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
358
+ --message-background-color: var(--joy-color-danger-500);
359
+ --message-foreground-color: var(--joy-color-danger-0);
360
+ --message-border-color: var(--joy-color-danger-700);
361
+ }
362
+
363
+ :host([appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
364
+ --message-background-color: var(--joy-color-warning-500);
365
+ --message-foreground-color: var(--joy-color-warning-0);
366
+ --message-border-color: var(--joy-color-warning-700);
367
+ }
368
+
369
+ :host([appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"]))) {
370
+ --message-background-color: var(--joy-color-success-500);
371
+ --message-foreground-color: var(--joy-color-success-0);
372
+ --message-border-color: var(--joy-color-success-700);
373
+ }
374
+
375
+ :host([appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"]))) {
376
+ --message-background-color: var(--joy-color-info-500);
377
+ --message-foreground-color: var(--joy-color-info-0);
378
+ --message-border-color: var(--joy-color-info-700);
379
+ }
380
+
381
+ :host([appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
382
+ --message-background-color: var(--joy-color-highlight-500);
383
+ --message-foreground-color: var(--joy-color-highlight-0);
384
+ --message-border-color: var(--joy-color-highlight-700);
385
+ }
386
+
387
+ :host([appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
388
+ --message-background-color: var(--joy-color-neutral-500);
389
+ --message-foreground-color: var(--joy-color-neutral-0);
390
+ --message-border-color: var(--joy-color-neutral-700);
391
+ }
392
+
393
+ `;
394
+ }
395
+ //# sourceMappingURL=MessageElement.Joy.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MessageElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/Message/Themes/MessageElement.Joy.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,sBAAsB;IAClC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2XT,CAAC;AACN,CAAC"}
@@ -0,0 +1,6 @@
1
+ import { type CSSResult } from '../../../../../Dom/Css';
2
+ /**
3
+ * @public
4
+ */
5
+ export declare function messageElementMemphisStyle(): CSSResult;
6
+ //# sourceMappingURL=MessageElement.Memphis.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MessageElement.Memphis.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Grouping/Message/Themes/MessageElement.Memphis.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,0BAA0B,IAAI,SAAS,CAyStD"}