@rovula/ui 0.1.22 → 0.1.24

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 (26) hide show
  1. package/dist/cjs/bundle.css +29 -0
  2. package/dist/cjs/bundle.js +2 -2
  3. package/dist/cjs/bundle.js.map +1 -1
  4. package/dist/cjs/types/patterns/menu/Menu.d.ts +5 -1
  5. package/dist/cjs/types/patterns/menu/Menu.stories.d.ts +2 -1
  6. package/dist/components/ActionButton/ActionButton.styles.js +9 -1
  7. package/dist/components/Dropdown/Dropdown.js +1 -1
  8. package/dist/components/DropdownMenu/DropdownMenu.js +2 -2
  9. package/dist/components/TextInput/TextInput.js +4 -2
  10. package/dist/esm/bundle.css +29 -0
  11. package/dist/esm/bundle.js +2 -2
  12. package/dist/esm/bundle.js.map +1 -1
  13. package/dist/esm/types/patterns/menu/Menu.d.ts +5 -1
  14. package/dist/esm/types/patterns/menu/Menu.stories.d.ts +2 -1
  15. package/dist/index.d.ts +5 -1
  16. package/dist/patterns/menu/Menu.js +4 -4
  17. package/dist/src/theme/global.css +104 -6
  18. package/package.json +1 -1
  19. package/src/components/ActionButton/ActionButton.styles.ts +9 -1
  20. package/src/components/Dropdown/Dropdown.tsx +2 -2
  21. package/src/components/DropdownMenu/DropdownMenu.tsx +3 -6
  22. package/src/components/TextInput/TextInput.tsx +36 -29
  23. package/src/patterns/menu/Menu.tsx +9 -0
  24. package/src/theme/presets/colors.js +14 -0
  25. package/src/theme/themes/variable-mapping.css +30 -0
  26. package/src/theme/themes/variable.css +37 -6
package/src/theme/presets/colors.js CHANGED
@@ -159,6 +159,20 @@ module.exports = {
159
159
  "bg-stroke4": withColorMixin("--bg-stroke4"),
160
160
  "bg-stroke5": withColorMixin("--bg-stroke5"),
161
161
 
162
+ // Table
163
+ "table-bg-main": withColorMixin("--table-bg-main"),
164
+ "table-bg-line": withColorMixin("--table-bg-line"),
165
+ "table-bg-a": withColorMixin("--table-bg-a"),
166
+ "table-bg-b": withColorMixin("--table-bg-b"),
167
+ "table-bg-hover": withColorMixin("--table-bg-hover"),
168
+ "table-panel-hover": withColorMixin("--table-panel-hover"),
169
+ "table-panel-sub-line": withColorMixin("--table-panel-sub-line"),
170
+ "table-panel-main-line": withColorMixin("--table-panel-main-line"),
171
+ "table-panel-selected": withColorMixin("--table-panel-selected"),
172
+
173
+ // Modal dropdown surface
174
+ "modal-dropdown-surface": withColorMixin("--modal-dropdown-surface"),
175
+
162
176
  // Common
163
177
  "common-white": withColorMixin("--common-white"),
164
178
  "common-black": withColorMixin("--common-black"),
package/src/theme/themes/variable-mapping.css CHANGED
@@ -353,6 +353,16 @@
353
353
  --bg-stroke3: var(--bg-stroke3-report-xspector-light-mode);
354
354
  --bg-stroke4: var(--bg-stroke4-report-xspector-light-mode);
355
355
  --bg-stroke5: var(--bg-stroke5-report-xspector-light-mode);
356
+ --table-bg-main: var(--table-bg-main-report-xspector-light-mode);
357
+ --table-bg-line: var(--table-bg-line-report-xspector-light-mode);
358
+ --table-bg-a: var(--table-bg-a-report-xspector-light-mode);
359
+ --table-bg-b: var(--table-bg-b-report-xspector-light-mode);
360
+ --table-bg-hover: var(--table-bg-hover-report-xspector-light-mode);
361
+ --table-panel-hover: var(--table-panel-hover-report-xspector-light-mode);
362
+ --table-panel-sub-line: var(--table-panel-sub-line-report-xspector-light-mode);
363
+ --table-panel-main-line: var(--table-panel-main-line-report-xspector-light-mode);
364
+ --table-panel-selected: var(--table-panel-selected-report-xspector-light-mode);
365
+ --modal-dropdown-surface: var(--modal-dropdown-surface-report-xspector-light-mode);
356
366
  }
357
367
 
358
368
  :root[data-theme="xspector"] {
@@ -707,6 +717,16 @@
707
717
  --bg-stroke3: var(--bg-stroke3-xspector);
708
718
  --bg-stroke4: var(--bg-stroke4-xspector);
709
719
  --bg-stroke5: var(--bg-stroke5-xspector);
720
+ --table-bg-main: var(--table-bg-main-xspector);
721
+ --table-bg-line: var(--table-bg-line-xspector);
722
+ --table-bg-a: var(--table-bg-a-xspector);
723
+ --table-bg-b: var(--table-bg-b-xspector);
724
+ --table-bg-hover: var(--table-bg-hover-xspector);
725
+ --table-panel-hover: var(--table-panel-hover-xspector);
726
+ --table-panel-sub-line: var(--table-panel-sub-line-xspector);
727
+ --table-panel-main-line: var(--table-panel-main-line-xspector);
728
+ --table-panel-selected: var(--table-panel-selected-xspector);
729
+ --modal-dropdown-surface: var(--modal-dropdown-surface-xspector);
710
730
  }
711
731
 
712
732
  :root[data-theme="skyller"] {
@@ -1061,4 +1081,14 @@
1061
1081
  --bg-stroke3: var(--bg-stroke3-skyller);
1062
1082
  --bg-stroke4: var(--bg-stroke4-skyller);
1063
1083
  --bg-stroke5: var(--bg-stroke5-skyller);
1084
+ --table-bg-main: var(--table-bg-main-skyller);
1085
+ --table-bg-line: var(--table-bg-line-skyller);
1086
+ --table-bg-a: var(--table-bg-a-skyller);
1087
+ --table-bg-b: var(--table-bg-b-skyller);
1088
+ --table-bg-hover: var(--table-bg-hover-skyller);
1089
+ --table-panel-hover: var(--table-panel-hover-skyller);
1090
+ --table-panel-sub-line: var(--table-panel-sub-line-skyller);
1091
+ --table-panel-main-line: var(--table-panel-main-line-skyller);
1092
+ --table-panel-selected: var(--table-panel-selected-skyller);
1093
+ --modal-dropdown-surface: var(--modal-dropdown-surface-skyller);
1064
1094
  }
package/src/theme/themes/variable.css CHANGED
@@ -1020,13 +1020,13 @@
1020
1020
  --page-bg-main-xspector: #091d33;
1021
1021
  --page-bg-main-report-xspector-light-mode: #ffffff;
1022
1022
  --page-bg-main-skyller: #ffffff;
1023
- --page-bg-circle-top-g-in-xspector: #003d6c;
1023
+ --page-bg-circle-top-g-in-xspector: #042c57;
1024
1024
  --page-bg-circle-top-g-in-report-xspector-light-mode: #adcad6;
1025
1025
  --page-bg-circle-top-g-in-skyller: #cfe4fd;
1026
1026
  --page-bg-circle-top-g-out-xspector: rgba(9 29 51 / 0);
1027
1027
  --page-bg-circle-top-g-out-report-xspector-light-mode: rgba(255 255 255 / 0);
1028
1028
  --page-bg-circle-top-g-out-skyller: rgba(255 255 255 / 0);
1029
- --page-bg-circle-bottom-g-in-xspector: #003d6c;
1029
+ --page-bg-circle-bottom-g-in-xspector: #042c57;
1030
1030
  --page-bg-circle-bottom-g-in-report-xspector-light-mode: #adcad6;
1031
1031
  --page-bg-circle-bottom-g-in-skyller: #bed0f9;
1032
1032
  --page-bg-circle-bottom-g-out-xspector: rgba(9 29 51 / 0);
@@ -1035,7 +1035,7 @@
1035
1035
  --text-white-xspector: #ffffff;
1036
1036
  --text-white-report-xspector-light-mode: #ffffff;
1037
1037
  --text-white-skyller: #ffffff;
1038
- --modal-line-xspector: rgba(158 158 158 / 0.24);
1038
+ --modal-line-xspector: #4a4a4a;
1039
1039
  --modal-line-report-xspector-light-mode: #cfcfcf;
1040
1040
  --modal-line-skyller: #d4d4d4;
1041
1041
  --bg-bg4-xspector: #0f2a46;
@@ -1044,15 +1044,46 @@
1044
1044
  --bg-bg5-xspector: #000000;
1045
1045
  --bg-bg5-report-xspector-light-mode: #000000;
1046
1046
  --bg-bg5-skyller: #000000;
1047
- --bg-stroke3-xspector: #000000;
1048
- --bg-stroke3-report-xspector-light-mode: #000000;
1049
- --bg-stroke3-skyller: #000000;
1047
+ --bg-stroke3-xspector: #2d2e30;
1048
+ --bg-stroke3-report-xspector-light-mode: #e5e5e5;
1049
+ --bg-stroke3-skyller: #d4d4d4;
1050
1050
  --bg-stroke4-xspector: #000000;
1051
1051
  --bg-stroke4-report-xspector-light-mode: #000000;
1052
1052
  --bg-stroke4-skyller: #000000;
1053
1053
  --bg-stroke5-xspector: #000000;
1054
1054
  --bg-stroke5-report-xspector-light-mode: #000000;
1055
1055
  --bg-stroke5-skyller: #000000;
1056
+ --table-bg-main-xspector: #091a2a;
1057
+ --table-bg-main-report-xspector-light-mode: #e5e5e5;
1058
+ --table-bg-main-skyller: #f5f5f5;
1059
+ --table-bg-line-xspector: #1c3955;
1060
+ --table-bg-line-report-xspector-light-mode: #d2d2d2;
1061
+ --table-bg-line-skyller: #ececec;
1062
+ --table-bg-a-xspector: #0c2845;
1063
+ --table-bg-a-report-xspector-light-mode: #f3f3f3;
1064
+ --table-bg-a-skyller: #fdfdfd;
1065
+ --table-bg-b-xspector: #0f2f50;
1066
+ --table-bg-b-report-xspector-light-mode: #f3f3f3;
1067
+ --table-bg-b-skyller: #f1f1f1;
1068
+ --table-panel-hover-xspector: #343638;
1069
+ --table-panel-hover-report-xspector-light-mode: #d4d4d4;
1070
+ --table-panel-hover-skyller: #eff6fe;
1071
+ --table-bg-hover-xspector: #103861;
1072
+ --table-bg-hover-report-xspector-light-mode: #ffffff;
1073
+ --table-bg-hover-skyller: #eff6fe;
1074
+ --table-panel-sub-line-xspector: #393b3f;
1075
+ --table-panel-sub-line-report-xspector-light-mode: #d4d4d4;
1076
+ --table-panel-sub-line-skyller: #ececec;
1077
+ --table-panel-main-line-xspector: #606b77;
1078
+ --table-panel-main-line-report-xspector-light-mode: #d4d4d4;
1079
+ --table-panel-main-line-skyller: #d4d4d4;
1080
+ --table-panel-selected-xspector: #6f6700;
1081
+ --table-panel-selected-report-xspector-light-mode: #d4d4d4;
1082
+ --table-panel-selected-skyller: #bfdbfd;
1083
+ --modal-dropdown-surface-xspector: #252628;
1084
+ --modal-dropdown-surface-report-xspector-light-mode: #ffffff;
1085
+ --modal-dropdown-surface-skyller: #ffffff;
1086
+ --modal-dropdown-surface-skyller: #ffffff;
1056
1087
 
1057
1088
  /* BUTTON RADIUS */
1058
1089
  --button-l-round: 8px;