@adcops/autocore-react 3.3.9 → 3.3.10

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 (215) hide show
  1. package/LICENSE +58 -58
  2. package/additional-docs/AutoCoreTagContext.md +441 -441
  3. package/additional-docs/ButtonApiSpecs.md +48 -48
  4. package/additional-docs/GlobalEventEmitter.md +243 -243
  5. package/additional-docs/general_recommendations.md +22 -22
  6. package/additional-docs/react_performance_notes.md +94 -94
  7. package/dist/assets/svg/blockly_logo.svg +82 -82
  8. package/dist/assets/svg/distance.svg +40 -40
  9. package/dist/assets/svg/python_logo.svg +246 -246
  10. package/dist/assets/svg/rotation_ccw.svg +50 -50
  11. package/dist/assets/svg/rotation_ccw_a.svg +57 -57
  12. package/dist/assets/svg/rotation_ccw_b.svg +57 -57
  13. package/dist/assets/svg/rotation_ccw_c.svg +57 -57
  14. package/dist/assets/svg/rotation_cw.svg +49 -49
  15. package/dist/assets/svg/rotation_cw_a.svg +30 -30
  16. package/dist/assets/svg/rotation_cw_b.svg +30 -30
  17. package/dist/assets/svg/rotation_cw_c.svg +30 -30
  18. package/dist/assets/svg/speed.svg +39 -39
  19. package/dist/components/BlocklyEditor.css +93 -93
  20. package/dist/components/JogPanel.css +41 -41
  21. package/dist/components/ProgressBarWithValue.css +27 -27
  22. package/dist/components/ValueIndicator.css +31 -31
  23. package/dist/components/osk.css +123 -123
  24. package/dist/core/AutoCoreTagContext.d.ts.map +1 -1
  25. package/dist/core/AutoCoreTagContext.js +1 -1
  26. package/dist/hub/HubBase.d.ts +3 -3
  27. package/dist/hub/HubBase.d.ts.map +1 -1
  28. package/dist/hub/HubBase.js +1 -1
  29. package/package.json +104 -104
  30. package/readme.md +343 -343
  31. package/src/assets/BlocklyLogo.tsx +27 -27
  32. package/src/assets/Distance.tsx +18 -18
  33. package/src/assets/JogLong.tsx +13 -13
  34. package/src/assets/JogMedium.tsx +13 -13
  35. package/src/assets/JogShort.tsx +13 -13
  36. package/src/assets/PythonLogo.tsx +83 -83
  37. package/src/assets/Rotation3D.tsx +13 -13
  38. package/src/assets/RotationCcw.tsx +33 -33
  39. package/src/assets/RotationCcwA.tsx +45 -45
  40. package/src/assets/RotationCcwB.tsx +45 -45
  41. package/src/assets/RotationCcwC.tsx +45 -45
  42. package/src/assets/RotationCw.tsx +31 -31
  43. package/src/assets/RotationCwA.tsx +42 -42
  44. package/src/assets/RotationCwB.tsx +42 -42
  45. package/src/assets/RotationCwC.tsx +42 -42
  46. package/src/assets/Run.tsx +13 -13
  47. package/src/assets/Speed.tsx +18 -18
  48. package/src/assets/SpeedFast.tsx +13 -13
  49. package/src/assets/SpeedMedium.tsx +13 -13
  50. package/src/assets/SpeedNone.tsx +13 -13
  51. package/src/assets/SpeedSlow.tsx +13 -13
  52. package/src/assets/Walk.tsx +13 -13
  53. package/src/assets/index.ts +22 -22
  54. package/src/assets/svg/blockly_logo.svg +82 -82
  55. package/src/assets/svg/distance.svg +40 -40
  56. package/src/assets/svg/python_logo.svg +246 -246
  57. package/src/assets/svg/rotation_ccw.svg +50 -50
  58. package/src/assets/svg/rotation_ccw_a.svg +57 -57
  59. package/src/assets/svg/rotation_ccw_b.svg +57 -57
  60. package/src/assets/svg/rotation_ccw_c.svg +57 -57
  61. package/src/assets/svg/rotation_cw.svg +49 -49
  62. package/src/assets/svg/rotation_cw_a.svg +30 -30
  63. package/src/assets/svg/rotation_cw_b.svg +30 -30
  64. package/src/assets/svg/rotation_cw_c.svg +30 -30
  65. package/src/assets/svg/speed.svg +39 -39
  66. package/src/components/AutoCoreDevPanel.tsx +414 -414
  67. package/src/components/BlocklyEditor.css +93 -93
  68. package/src/components/BlocklyEditor.tsx +609 -609
  69. package/src/components/CodeEditor.tsx +155 -155
  70. package/src/components/FileList.tsx +390 -390
  71. package/src/components/FileSelect.tsx +128 -128
  72. package/src/components/FitText.tsx +35 -35
  73. package/src/components/Indicator.tsx +188 -188
  74. package/src/components/IndicatorButton.tsx +214 -214
  75. package/src/components/IndicatorRect.tsx +172 -172
  76. package/src/components/JogPanel.css +41 -41
  77. package/src/components/JogPanel.tsx +461 -461
  78. package/src/components/Lamp.tsx +243 -243
  79. package/src/components/Osk.tsx +192 -192
  80. package/src/components/OskDialog.tsx +164 -164
  81. package/src/components/ProgressBarWithValue.css +27 -27
  82. package/src/components/ProgressBarWithValue.tsx +48 -48
  83. package/src/components/TextInput.tsx +195 -195
  84. package/src/components/ToggleGroup.tsx +322 -322
  85. package/src/components/ValueDisplay.tsx +236 -236
  86. package/src/components/ValueIndicator.css +31 -31
  87. package/src/components/ValueIndicator.tsx +135 -135
  88. package/src/components/ValueInput.tsx +368 -368
  89. package/src/components/osk.css +123 -123
  90. package/src/core/ActionMode.ts +19 -19
  91. package/src/core/AutoCoreTagContext.tsx +625 -614
  92. package/src/core/AutoCoreTagTypes.ts +334 -334
  93. package/src/core/CoreStreamTypes.ts +512 -512
  94. package/src/core/EventEmitterContext.tsx +434 -434
  95. package/src/core/IndicatorButtonState.ts +34 -34
  96. package/src/core/IndicatorColor.ts +35 -35
  97. package/src/core/MaskPatterns.ts +87 -87
  98. package/src/core/NumerableTypes.ts +80 -80
  99. package/src/core/PositionContext.ts +59 -59
  100. package/src/core/UniqueId.ts +41 -41
  101. package/src/core/ValueSimulator.ts +166 -166
  102. package/src/core/hoc.tsx +65 -65
  103. package/src/hooks/adsHooks.tsx +287 -287
  104. package/src/hooks/commandHooks.tsx +300 -300
  105. package/src/hooks/index.ts +12 -12
  106. package/src/hooks/useAutoCoreTag.ts +103 -103
  107. package/src/hooks/useScaledValue.tsx +99 -99
  108. package/src/hub/CommandMessage.ts +89 -89
  109. package/src/hub/DebugPanel.ts +307 -307
  110. package/src/hub/HubBase.ts +249 -236
  111. package/src/hub/HubSimulate.ts +124 -124
  112. package/src/hub/HubTauri.ts +140 -140
  113. package/src/hub/HubWebSocket.ts +250 -250
  114. package/src/hub/debug.ts +211 -211
  115. package/src/hub/index.ts +81 -81
  116. package/src/themes/adc-dark/_extensions.scss +166 -166
  117. package/src/themes/adc-dark/_variables.scss +913 -913
  118. package/src/themes/adc-dark/blue/_fonts.scss +23 -23
  119. package/src/themes/adc-dark/blue/adc_theme.scss +31 -31
  120. package/src/themes/adc-dark/blue/theme.scss +14 -14
  121. package/src/themes/theme-base/_colors.scss +17 -17
  122. package/src/themes/theme-base/_common.scss +74 -74
  123. package/src/themes/theme-base/_components.scss +111 -111
  124. package/src/themes/theme-base/_mixins.scss +243 -243
  125. package/src/themes/theme-base/components/button/_button.scss +644 -644
  126. package/src/themes/theme-base/components/button/_speeddial.scss +91 -91
  127. package/src/themes/theme-base/components/button/_splitbutton.scss +358 -358
  128. package/src/themes/theme-base/components/data/_carousel.scss +39 -39
  129. package/src/themes/theme-base/components/data/_datascroller.scss +47 -47
  130. package/src/themes/theme-base/components/data/_datatable.scss +388 -388
  131. package/src/themes/theme-base/components/data/_dataview.scss +47 -47
  132. package/src/themes/theme-base/components/data/_filter.scss +137 -137
  133. package/src/themes/theme-base/components/data/_orderlist.scss +86 -86
  134. package/src/themes/theme-base/components/data/_organizationchart.scss +50 -50
  135. package/src/themes/theme-base/components/data/_paginator.scss +91 -91
  136. package/src/themes/theme-base/components/data/_picklist.scss +73 -73
  137. package/src/themes/theme-base/components/data/_timeline.scss +38 -38
  138. package/src/themes/theme-base/components/data/_tree.scss +184 -184
  139. package/src/themes/theme-base/components/data/_treetable.scss +431 -431
  140. package/src/themes/theme-base/components/file/_fileupload.scss +41 -41
  141. package/src/themes/theme-base/components/input/_autocomplete.scss +94 -94
  142. package/src/themes/theme-base/components/input/_calendar.scss +251 -251
  143. package/src/themes/theme-base/components/input/_cascadeselect.scss +107 -107
  144. package/src/themes/theme-base/components/input/_checkbox.scss +181 -181
  145. package/src/themes/theme-base/components/input/_chips.scss +102 -102
  146. package/src/themes/theme-base/components/input/_colorpicker.scss +17 -17
  147. package/src/themes/theme-base/components/input/_dropdown.scss +252 -252
  148. package/src/themes/theme-base/components/input/_editor.scss +122 -122
  149. package/src/themes/theme-base/components/input/_iconfield.scss +9 -9
  150. package/src/themes/theme-base/components/input/_inputgroup.scss +74 -74
  151. package/src/themes/theme-base/components/input/_inputicon.scss +14 -14
  152. package/src/themes/theme-base/components/input/_inputnumber.scss +4 -4
  153. package/src/themes/theme-base/components/input/_inputotp.scss +10 -10
  154. package/src/themes/theme-base/components/input/_inputswitch.scss +99 -99
  155. package/src/themes/theme-base/components/input/_inputtext.scss +101 -101
  156. package/src/themes/theme-base/components/input/_listbox.scss +138 -138
  157. package/src/themes/theme-base/components/input/_mention.scss +30 -30
  158. package/src/themes/theme-base/components/input/_multiselect.scss +278 -278
  159. package/src/themes/theme-base/components/input/_password.scss +32 -32
  160. package/src/themes/theme-base/components/input/_radiobutton.scss +169 -169
  161. package/src/themes/theme-base/components/input/_rating.scss +80 -80
  162. package/src/themes/theme-base/components/input/_selectbutton.scss +49 -49
  163. package/src/themes/theme-base/components/input/_slider.scss +49 -49
  164. package/src/themes/theme-base/components/input/_togglebutton.scss +99 -99
  165. package/src/themes/theme-base/components/input/_treeselect.scss +151 -151
  166. package/src/themes/theme-base/components/input/_tristatecheckbox.scss +46 -46
  167. package/src/themes/theme-base/components/menu/_breadcrumb.scss +42 -42
  168. package/src/themes/theme-base/components/menu/_contextmenu.scss +39 -39
  169. package/src/themes/theme-base/components/menu/_dock.scss +109 -109
  170. package/src/themes/theme-base/components/menu/_megamenu.scss +141 -141
  171. package/src/themes/theme-base/components/menu/_menu.scss +33 -33
  172. package/src/themes/theme-base/components/menu/_menubar.scss +216 -216
  173. package/src/themes/theme-base/components/menu/_panelmenu.scss +153 -153
  174. package/src/themes/theme-base/components/menu/_slidemenu.scss +60 -60
  175. package/src/themes/theme-base/components/menu/_steps.scss +57 -57
  176. package/src/themes/theme-base/components/menu/_tabmenu.scss +50 -50
  177. package/src/themes/theme-base/components/menu/_tieredmenu.scss +43 -43
  178. package/src/themes/theme-base/components/messages/_inlinemessage.scss +69 -69
  179. package/src/themes/theme-base/components/messages/_message.scss +107 -107
  180. package/src/themes/theme-base/components/messages/_toast.scss +100 -100
  181. package/src/themes/theme-base/components/misc/_avatar.scss +33 -33
  182. package/src/themes/theme-base/components/misc/_badge.scss +76 -76
  183. package/src/themes/theme-base/components/misc/_chip.scss +38 -38
  184. package/src/themes/theme-base/components/misc/_inplace.scss +17 -17
  185. package/src/themes/theme-base/components/misc/_metergroup.scss +80 -80
  186. package/src/themes/theme-base/components/misc/_progressbar.scss +17 -17
  187. package/src/themes/theme-base/components/misc/_scrolltop.scss +24 -24
  188. package/src/themes/theme-base/components/misc/_skeleton.scss +7 -7
  189. package/src/themes/theme-base/components/misc/_tag.scss +39 -39
  190. package/src/themes/theme-base/components/misc/_terminal.scss +12 -12
  191. package/src/themes/theme-base/components/multimedia/_galleria.scss +153 -153
  192. package/src/themes/theme-base/components/multimedia/_image.scss +53 -53
  193. package/src/themes/theme-base/components/overlay/_confirmpopup.scss +72 -72
  194. package/src/themes/theme-base/components/overlay/_dialog.scss +78 -78
  195. package/src/themes/theme-base/components/overlay/_overlaypanel.scss +64 -64
  196. package/src/themes/theme-base/components/overlay/_sidebar.scss +23 -23
  197. package/src/themes/theme-base/components/overlay/_tooltip.scss +33 -33
  198. package/src/themes/theme-base/components/panel/_accordion.scss +118 -118
  199. package/src/themes/theme-base/components/panel/_card.scss +30 -30
  200. package/src/themes/theme-base/components/panel/_divider.scss +30 -30
  201. package/src/themes/theme-base/components/panel/_fieldset.scss +47 -47
  202. package/src/themes/theme-base/components/panel/_panel.scss +47 -47
  203. package/src/themes/theme-base/components/panel/_scrollpanel.scss +10 -10
  204. package/src/themes/theme-base/components/panel/_splitter.scss +23 -23
  205. package/src/themes/theme-base/components/panel/_stepper.scss +136 -136
  206. package/src/themes/theme-base/components/panel/_tabview.scss +147 -147
  207. package/src/themes/theme-base/components/panel/_toolbar.scss +11 -11
  208. package/terser.config.cjs +25 -25
  209. package/todo.md +18 -18
  210. package/tools/build-themes.cjs +65 -65
  211. package/tools/copy-distribution-files.cjs +77 -77
  212. package/tools/minify.cjs +55 -55
  213. package/tsconfig.json +48 -48
  214. package/typedoc.json +12 -12
  215. package/.claude/settings.local.json +0 -7
@@ -1,43 +1,43 @@
1
- .p-tieredmenu {
2
- padding: $verticalMenuPadding;
3
- background: $menuBg;
4
- color: $menuTextColor;
5
- border: $menuBorder;
6
- border-radius: $borderRadius;
7
- width: $menuWidth;
8
-
9
- &.p-tieredmenu-overlay {
10
- background: $overlayMenuBg;
11
- border: $overlayMenuBorder;
12
- box-shadow: $overlayMenuShadow;
13
- }
14
-
15
- .p-tieredmenu-root-list {
16
- outline: 0 none;
17
- }
18
-
19
- .p-submenu-list {
20
- padding: $verticalMenuPadding;
21
- background: $overlayMenuBg;
22
- border: $overlayMenuBorder;
23
- box-shadow: $overlayMenuShadow;
24
- }
25
-
26
- .p-menuitem {
27
- @include menuitem-link();
28
- }
29
-
30
- .p-menuitem-separator {
31
- border-top: $divider;
32
- margin: $menuSeparatorMargin;
33
- }
34
-
35
- .p-submenu-icon {
36
- font-size: $menuitemSubmenuIconFontSize;
37
-
38
- &.p-icon {
39
- width: $menuitemSubmenuIconFontSize;
40
- height: $menuitemSubmenuIconFontSize;
41
- }
42
- }
43
- }
1
+ .p-tieredmenu {
2
+ padding: $verticalMenuPadding;
3
+ background: $menuBg;
4
+ color: $menuTextColor;
5
+ border: $menuBorder;
6
+ border-radius: $borderRadius;
7
+ width: $menuWidth;
8
+
9
+ &.p-tieredmenu-overlay {
10
+ background: $overlayMenuBg;
11
+ border: $overlayMenuBorder;
12
+ box-shadow: $overlayMenuShadow;
13
+ }
14
+
15
+ .p-tieredmenu-root-list {
16
+ outline: 0 none;
17
+ }
18
+
19
+ .p-submenu-list {
20
+ padding: $verticalMenuPadding;
21
+ background: $overlayMenuBg;
22
+ border: $overlayMenuBorder;
23
+ box-shadow: $overlayMenuShadow;
24
+ }
25
+
26
+ .p-menuitem {
27
+ @include menuitem-link();
28
+ }
29
+
30
+ .p-menuitem-separator {
31
+ border-top: $divider;
32
+ margin: $menuSeparatorMargin;
33
+ }
34
+
35
+ .p-submenu-icon {
36
+ font-size: $menuitemSubmenuIconFontSize;
37
+
38
+ &.p-icon {
39
+ width: $menuitemSubmenuIconFontSize;
40
+ height: $menuitemSubmenuIconFontSize;
41
+ }
42
+ }
43
+ }
@@ -1,69 +1,69 @@
1
- .p-inline-message {
2
- padding: $inlineMessagePadding;
3
- margin: $inlineMessageMargin;
4
- border-radius: $borderRadius;
5
-
6
- &.p-inline-message-info {
7
- background: $infoMessageBg;
8
- border: $infoMessageBorder;
9
- border-width: $inlineMessageBorderWidth;
10
- color: $infoMessageTextColor;
11
-
12
- .p-inline-message-icon {
13
- color: $infoMessageIconColor;
14
- }
15
- }
16
-
17
- &.p-inline-message-success {
18
- background: $successMessageBg;
19
- border: $successMessageBorder;
20
- border-width: $inlineMessageBorderWidth;
21
- color: $successMessageTextColor;
22
-
23
- .p-inline-message-icon {
24
- color: $successMessageIconColor;
25
- }
26
- }
27
-
28
- &.p-inline-message-warn {
29
- background: $warningMessageBg;
30
- border: $warningMessageBorder;
31
- border-width: $inlineMessageBorderWidth;
32
- color: $warningMessageTextColor;
33
-
34
- .p-inline-message-icon {
35
- color: $warningMessageIconColor;
36
- }
37
- }
38
-
39
- &.p-inline-message-error {
40
- background: $errorMessageBg;
41
- border: $errorMessageBorder;
42
- border-width: $inlineMessageBorderWidth;
43
- color: $errorMessageTextColor;
44
-
45
- .p-inline-message-icon {
46
- color: $errorMessageIconColor;
47
- }
48
- }
49
-
50
- .p-inline-message-icon {
51
- font-size: $inlineMessageIconFontSize;
52
- margin-right: $inlineSpacing;
53
-
54
- &.p-icon {
55
- width: $inlineMessageIconFontSize;
56
- height: $inlineMessageIconFontSize;
57
- }
58
- }
59
-
60
- .p-inline-message-text {
61
- font-size: $inlineMessageTextFontSize;
62
- }
63
-
64
- &.p-inline-message-icon-only {
65
- .p-inline-message-icon {
66
- margin-right: 0;
67
- }
68
- }
69
- }
1
+ .p-inline-message {
2
+ padding: $inlineMessagePadding;
3
+ margin: $inlineMessageMargin;
4
+ border-radius: $borderRadius;
5
+
6
+ &.p-inline-message-info {
7
+ background: $infoMessageBg;
8
+ border: $infoMessageBorder;
9
+ border-width: $inlineMessageBorderWidth;
10
+ color: $infoMessageTextColor;
11
+
12
+ .p-inline-message-icon {
13
+ color: $infoMessageIconColor;
14
+ }
15
+ }
16
+
17
+ &.p-inline-message-success {
18
+ background: $successMessageBg;
19
+ border: $successMessageBorder;
20
+ border-width: $inlineMessageBorderWidth;
21
+ color: $successMessageTextColor;
22
+
23
+ .p-inline-message-icon {
24
+ color: $successMessageIconColor;
25
+ }
26
+ }
27
+
28
+ &.p-inline-message-warn {
29
+ background: $warningMessageBg;
30
+ border: $warningMessageBorder;
31
+ border-width: $inlineMessageBorderWidth;
32
+ color: $warningMessageTextColor;
33
+
34
+ .p-inline-message-icon {
35
+ color: $warningMessageIconColor;
36
+ }
37
+ }
38
+
39
+ &.p-inline-message-error {
40
+ background: $errorMessageBg;
41
+ border: $errorMessageBorder;
42
+ border-width: $inlineMessageBorderWidth;
43
+ color: $errorMessageTextColor;
44
+
45
+ .p-inline-message-icon {
46
+ color: $errorMessageIconColor;
47
+ }
48
+ }
49
+
50
+ .p-inline-message-icon {
51
+ font-size: $inlineMessageIconFontSize;
52
+ margin-right: $inlineSpacing;
53
+
54
+ &.p-icon {
55
+ width: $inlineMessageIconFontSize;
56
+ height: $inlineMessageIconFontSize;
57
+ }
58
+ }
59
+
60
+ .p-inline-message-text {
61
+ font-size: $inlineMessageTextFontSize;
62
+ }
63
+
64
+ &.p-inline-message-icon-only {
65
+ .p-inline-message-icon {
66
+ margin-right: 0;
67
+ }
68
+ }
69
+ }
@@ -1,107 +1,107 @@
1
- .p-message {
2
- margin: $messageMargin;
3
- border-radius: $borderRadius;
4
-
5
- .p-message-wrapper {
6
- padding: $messagePadding;
7
- }
8
-
9
- .p-message-close {
10
- width: $actionIconWidth;
11
- height: $actionIconHeight;
12
- border-radius: $actionIconBorderRadius;
13
- background: transparent;
14
- transition: $actionIconTransition;
15
-
16
- &:hover {
17
- background: rgba(255,255,255,.5);
18
- }
19
-
20
- &:focus-visible {
21
- @include focused();
22
- }
23
- }
24
-
25
- &.p-message-info {
26
- background: $infoMessageBg;
27
- border: $infoMessageBorder;
28
- border-width: $messageBorderWidth;
29
- color: $infoMessageTextColor;
30
-
31
- .p-message-icon {
32
- color: $infoMessageIconColor;
33
- }
34
-
35
- .p-message-close {
36
- color: $infoMessageIconColor;
37
- }
38
- }
39
-
40
- &.p-message-success {
41
- background: $successMessageBg;
42
- border: $successMessageBorder;
43
- border-width: $messageBorderWidth;
44
- color: $successMessageTextColor;
45
-
46
- .p-message-icon {
47
- color: $successMessageIconColor;
48
- }
49
-
50
- .p-message-close {
51
- color: $successMessageIconColor;
52
- }
53
- }
54
-
55
- &.p-message-warn {
56
- background: $warningMessageBg;
57
- border: $warningMessageBorder;
58
- border-width: $messageBorderWidth;
59
- color: $warningMessageTextColor;
60
-
61
- .p-message-icon {
62
- color: $warningMessageIconColor;
63
- }
64
-
65
- .p-message-close {
66
- color: $warningMessageIconColor;
67
- }
68
- }
69
-
70
- &.p-message-error {
71
- background: $errorMessageBg;
72
- border: $errorMessageBorder;
73
- border-width: $messageBorderWidth;
74
- color: $errorMessageTextColor;
75
-
76
- .p-message-icon {
77
- color: $errorMessageIconColor;
78
- }
79
-
80
- .p-message-close {
81
- color: $errorMessageIconColor;
82
- }
83
- }
84
-
85
- .p-message-text {
86
- font-size: $messageTextFontSize;
87
- font-weight: $messageTextFontWeight;
88
- }
89
-
90
- .p-message-icon {
91
- font-size: $messageIconFontSize;
92
- margin-right: $inlineSpacing;
93
-
94
- &.p-icon {
95
- width: $messageIconFontSize;
96
- height: $messageIconFontSize;
97
- }
98
- }
99
-
100
- .p-message-summary {
101
- font-weight: 700;
102
- }
103
-
104
- .p-message-detail {
105
- margin-left: $inlineSpacing;
106
- }
107
- }
1
+ .p-message {
2
+ margin: $messageMargin;
3
+ border-radius: $borderRadius;
4
+
5
+ .p-message-wrapper {
6
+ padding: $messagePadding;
7
+ }
8
+
9
+ .p-message-close {
10
+ width: $actionIconWidth;
11
+ height: $actionIconHeight;
12
+ border-radius: $actionIconBorderRadius;
13
+ background: transparent;
14
+ transition: $actionIconTransition;
15
+
16
+ &:hover {
17
+ background: rgba(255,255,255,.5);
18
+ }
19
+
20
+ &:focus-visible {
21
+ @include focused();
22
+ }
23
+ }
24
+
25
+ &.p-message-info {
26
+ background: $infoMessageBg;
27
+ border: $infoMessageBorder;
28
+ border-width: $messageBorderWidth;
29
+ color: $infoMessageTextColor;
30
+
31
+ .p-message-icon {
32
+ color: $infoMessageIconColor;
33
+ }
34
+
35
+ .p-message-close {
36
+ color: $infoMessageIconColor;
37
+ }
38
+ }
39
+
40
+ &.p-message-success {
41
+ background: $successMessageBg;
42
+ border: $successMessageBorder;
43
+ border-width: $messageBorderWidth;
44
+ color: $successMessageTextColor;
45
+
46
+ .p-message-icon {
47
+ color: $successMessageIconColor;
48
+ }
49
+
50
+ .p-message-close {
51
+ color: $successMessageIconColor;
52
+ }
53
+ }
54
+
55
+ &.p-message-warn {
56
+ background: $warningMessageBg;
57
+ border: $warningMessageBorder;
58
+ border-width: $messageBorderWidth;
59
+ color: $warningMessageTextColor;
60
+
61
+ .p-message-icon {
62
+ color: $warningMessageIconColor;
63
+ }
64
+
65
+ .p-message-close {
66
+ color: $warningMessageIconColor;
67
+ }
68
+ }
69
+
70
+ &.p-message-error {
71
+ background: $errorMessageBg;
72
+ border: $errorMessageBorder;
73
+ border-width: $messageBorderWidth;
74
+ color: $errorMessageTextColor;
75
+
76
+ .p-message-icon {
77
+ color: $errorMessageIconColor;
78
+ }
79
+
80
+ .p-message-close {
81
+ color: $errorMessageIconColor;
82
+ }
83
+ }
84
+
85
+ .p-message-text {
86
+ font-size: $messageTextFontSize;
87
+ font-weight: $messageTextFontWeight;
88
+ }
89
+
90
+ .p-message-icon {
91
+ font-size: $messageIconFontSize;
92
+ margin-right: $inlineSpacing;
93
+
94
+ &.p-icon {
95
+ width: $messageIconFontSize;
96
+ height: $messageIconFontSize;
97
+ }
98
+ }
99
+
100
+ .p-message-summary {
101
+ font-weight: 700;
102
+ }
103
+
104
+ .p-message-detail {
105
+ margin-left: $inlineSpacing;
106
+ }
107
+ }
@@ -1,100 +1,100 @@
1
- .p-toast {
2
- opacity: $toastOpacity;
3
-
4
- .p-toast-message {
5
- margin: $toastMargin;
6
- box-shadow: $toastShadow;
7
- border-radius: $borderRadius;
8
-
9
- .p-toast-message-content {
10
- padding: $toastPadding;
11
-
12
- .p-toast-message-text {
13
- margin: $toastMessageTextMargin;
14
- }
15
-
16
- .p-toast-message-icon {
17
- font-size: $toastIconFontSize;
18
-
19
- &.p-icon {
20
- width: $toastIconFontSize;
21
- height: $toastIconFontSize;
22
- }
23
- }
24
-
25
-
26
- .p-toast-summary {
27
- font-weight: $toastTitleFontWeight;
28
- }
29
-
30
- .p-toast-detail {
31
- margin: $toastDetailMargin;
32
- }
33
- }
34
-
35
- .p-toast-icon-close {
36
- width: $toastIconFontSize;
37
- height: $toastIconFontSize;
38
- border-radius: $actionIconBorderRadius;
39
- background: transparent;
40
- transition: $actionIconTransition;
41
-
42
- &:hover {
43
- background: rgba(255,255,255,.5);
44
- }
45
-
46
- &:focus-visible {
47
- @include focused();
48
- }
49
- }
50
-
51
- &.p-toast-message-info {
52
- background: $infoMessageBg;
53
- border: $infoMessageBorder;
54
- border-width: $messageBorderWidth;
55
- color: $infoMessageTextColor;
56
-
57
- .p-toast-message-icon,
58
- .p-toast-icon-close {
59
- color: $infoMessageIconColor;
60
- }
61
- }
62
-
63
- &.p-toast-message-success {
64
- background: $successMessageBg;
65
- border: $successMessageBorder;
66
- border-width: $messageBorderWidth;
67
- color: $successMessageTextColor;
68
-
69
- .p-toast-message-icon,
70
- .p-toast-icon-close {
71
- color: $successMessageIconColor;
72
- }
73
- }
74
-
75
- &.p-toast-message-warn {
76
- background: $warningMessageBg;
77
- border: $warningMessageBorder;
78
- border-width: $messageBorderWidth;
79
- color: $warningMessageTextColor;
80
-
81
- .p-toast-message-icon,
82
- .p-toast-icon-close {
83
- color: $warningMessageIconColor;
84
- }
85
- }
86
-
87
- &.p-toast-message-error {
88
- background: $errorMessageBg;
89
- border: $errorMessageBorder;
90
- border-width: $messageBorderWidth;
91
- color: $errorMessageTextColor;
92
-
93
- .p-toast-message-icon,
94
- .p-toast-icon-close {
95
- color: $errorMessageIconColor;
96
- }
97
- }
98
-
99
- }
100
- }
1
+ .p-toast {
2
+ opacity: $toastOpacity;
3
+
4
+ .p-toast-message {
5
+ margin: $toastMargin;
6
+ box-shadow: $toastShadow;
7
+ border-radius: $borderRadius;
8
+
9
+ .p-toast-message-content {
10
+ padding: $toastPadding;
11
+
12
+ .p-toast-message-text {
13
+ margin: $toastMessageTextMargin;
14
+ }
15
+
16
+ .p-toast-message-icon {
17
+ font-size: $toastIconFontSize;
18
+
19
+ &.p-icon {
20
+ width: $toastIconFontSize;
21
+ height: $toastIconFontSize;
22
+ }
23
+ }
24
+
25
+
26
+ .p-toast-summary {
27
+ font-weight: $toastTitleFontWeight;
28
+ }
29
+
30
+ .p-toast-detail {
31
+ margin: $toastDetailMargin;
32
+ }
33
+ }
34
+
35
+ .p-toast-icon-close {
36
+ width: $toastIconFontSize;
37
+ height: $toastIconFontSize;
38
+ border-radius: $actionIconBorderRadius;
39
+ background: transparent;
40
+ transition: $actionIconTransition;
41
+
42
+ &:hover {
43
+ background: rgba(255,255,255,.5);
44
+ }
45
+
46
+ &:focus-visible {
47
+ @include focused();
48
+ }
49
+ }
50
+
51
+ &.p-toast-message-info {
52
+ background: $infoMessageBg;
53
+ border: $infoMessageBorder;
54
+ border-width: $messageBorderWidth;
55
+ color: $infoMessageTextColor;
56
+
57
+ .p-toast-message-icon,
58
+ .p-toast-icon-close {
59
+ color: $infoMessageIconColor;
60
+ }
61
+ }
62
+
63
+ &.p-toast-message-success {
64
+ background: $successMessageBg;
65
+ border: $successMessageBorder;
66
+ border-width: $messageBorderWidth;
67
+ color: $successMessageTextColor;
68
+
69
+ .p-toast-message-icon,
70
+ .p-toast-icon-close {
71
+ color: $successMessageIconColor;
72
+ }
73
+ }
74
+
75
+ &.p-toast-message-warn {
76
+ background: $warningMessageBg;
77
+ border: $warningMessageBorder;
78
+ border-width: $messageBorderWidth;
79
+ color: $warningMessageTextColor;
80
+
81
+ .p-toast-message-icon,
82
+ .p-toast-icon-close {
83
+ color: $warningMessageIconColor;
84
+ }
85
+ }
86
+
87
+ &.p-toast-message-error {
88
+ background: $errorMessageBg;
89
+ border: $errorMessageBorder;
90
+ border-width: $messageBorderWidth;
91
+ color: $errorMessageTextColor;
92
+
93
+ .p-toast-message-icon,
94
+ .p-toast-icon-close {
95
+ color: $errorMessageIconColor;
96
+ }
97
+ }
98
+
99
+ }
100
+ }