@beacon-interactive-systems-llc/beacon-platform-ui 19.2.16 → 19.2.17

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 (9) hide show
  1. package/assets/icons/icon-clarity-CONTRAST.svg +3 -0
  2. package/assets/icons/icon-clarity-DARK.svg +3 -0
  3. package/assets/icons/icon-clarity-black.svg +3 -0
  4. package/assets/icons/icon-clarity-darkblue.svg +3 -0
  5. package/assets/icons/icon-clarity-light.svg +9 -0
  6. package/assets/icons/icon-clarity.svg +3 -0
  7. package/package.json +1 -1
  8. package/styles/_buttons.scss +12 -3
  9. package/styles/_widgets.scss +66 -7
package/assets/icons/icon-clarity-CONTRAST.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="18" height="17" viewBox="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M4.47363 8.05273C4.47646 8.07885 4.72659 10.3623 5.68262 11.3184C6.6443 12.2797 8.94824 12.5264 8.94824 12.5264C8.94824 12.5264 6.64415 12.7738 5.68262 13.7354C4.72112 14.6969 4.47363 17.001 4.47363 17.001C4.47363 17.001 4.22697 14.697 3.26562 13.7354C2.30674 12.7764 0.0126165 12.5277 0 12.5264C0.0169785 12.5245 2.30762 12.2763 3.26562 11.3184C4.22091 10.3631 4.47043 8.08233 4.47363 8.05273ZM12.5273 2.68457C12.5273 2.68457 12.823 5.44948 13.9766 6.60352C15.1247 7.75165 17.8683 8.05077 17.8955 8.05371C17.8696 8.05651 15.1249 8.3555 13.9766 9.50391C12.8229 10.6579 12.5273 13.4229 12.5273 13.4229C12.5273 13.4229 12.2309 10.6579 11.0771 9.50391C9.92757 8.35431 7.17852 8.0559 7.1582 8.05371C7.18012 8.05135 9.92791 7.75277 11.0771 6.60352C12.2308 5.4495 12.5273 2.68457 12.5273 2.68457ZM4.47363 0C4.47363 0 4.67129 1.843 5.44043 2.6123C6.20516 3.37705 8.03141 3.57679 8.05273 3.5791C8.03361 3.58117 6.20567 3.78074 5.44043 4.5459C4.67722 5.30913 4.47672 7.12978 4.47363 7.1582C4.47048 7.12921 4.26993 5.309 3.50684 4.5459C2.73908 3.77831 0.901921 3.5799 0.894531 3.5791C0.906548 3.57781 2.74013 3.37902 3.50684 2.6123C4.27516 1.8439 4.47319 0.00411877 4.47363 0Z" fill="#00FFE7"/>
3
+ </svg>
package/assets/icons/icon-clarity-DARK.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="18" height="17" viewBox="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M4.47363 8.05273C4.47646 8.07885 4.72659 10.3623 5.68262 11.3184C6.6443 12.2797 8.94824 12.5264 8.94824 12.5264C8.94824 12.5264 6.64415 12.7738 5.68262 13.7354C4.72112 14.6969 4.47363 17.001 4.47363 17.001C4.47363 17.001 4.22697 14.697 3.26562 13.7354C2.30674 12.7764 0.0126165 12.5277 0 12.5264C0.0169785 12.5245 2.30762 12.2763 3.26562 11.3184C4.22091 10.3631 4.47043 8.08233 4.47363 8.05273ZM12.5273 2.68457C12.5273 2.68457 12.823 5.44948 13.9766 6.60352C15.1247 7.75165 17.8683 8.05077 17.8955 8.05371C17.8696 8.05651 15.1249 8.3555 13.9766 9.50391C12.8229 10.6579 12.5273 13.4229 12.5273 13.4229C12.5273 13.4229 12.2309 10.6579 11.0771 9.50391C9.92757 8.35431 7.17852 8.0559 7.1582 8.05371C7.18012 8.05135 9.92791 7.75277 11.0771 6.60352C12.2308 5.4495 12.5273 2.68457 12.5273 2.68457ZM4.47363 0C4.47363 0 4.67129 1.843 5.44043 2.6123C6.20516 3.37705 8.03141 3.57679 8.05273 3.5791C8.03361 3.58117 6.20567 3.78074 5.44043 4.5459C4.67722 5.30913 4.47672 7.12978 4.47363 7.1582C4.47048 7.12921 4.26993 5.309 3.50684 4.5459C2.73908 3.77831 0.901921 3.5799 0.894531 3.5791C0.906548 3.57781 2.74013 3.37902 3.50684 2.6123C4.27516 1.8439 4.47319 0.00411877 4.47363 0Z" fill="#CF6679"/>
3
+ </svg>
package/assets/icons/icon-clarity-black.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M3 5.39941C3 5.39941 3.16586 6.94405 3.81055 7.58887C4.45171 8.23002 5.9829 8.39756 6 8.39941C5.98497 8.40104 4.45218 8.56841 3.81055 9.20996C3.17012 9.85039 3.00222 11.3789 3 11.3994C2.99773 11.3785 2.8298 9.8503 2.18945 9.20996C1.54635 8.567 0.00819435 8.4003 0 8.39941C0.0115776 8.39817 1.54712 8.23119 2.18945 7.58887C2.83417 6.94407 3 5.39941 3 5.39941ZM8.40039 1.80078C8.40413 1.83512 8.6059 3.66113 9.37207 4.42773C10.142 5.19769 11.9822 5.39846 12 5.40039C11.9822 5.40231 10.1421 5.60307 9.37207 6.37305C8.60598 7.13956 8.40418 8.96526 8.40039 9C8.39692 8.96806 8.19453 7.1401 7.42773 6.37305C6.65402 5.59934 4.7998 5.40039 4.7998 5.40039C4.7998 5.40039 6.65402 5.20145 7.42773 4.42773C8.19462 3.66059 8.39696 1.83229 8.40039 1.80078ZM3 0C3.00049 0.0045674 3.13358 1.2371 3.64844 1.75195C4.16439 2.26757 5.40039 2.40039 5.40039 2.40039C5.40039 2.40039 4.16447 2.53235 3.64844 3.04785C3.13729 3.55899 3.00239 4.77781 3 4.7998C2.99771 4.77876 2.86291 3.5592 2.35156 3.04785C1.8356 2.53225 0.599609 2.40039 0.599609 2.40039C0.599609 2.40039 1.83569 2.26767 2.35156 1.75195C2.86738 1.23615 3 0 3 0Z" fill="black"/>
3
+ </svg>
package/assets/icons/icon-clarity-darkblue.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M3 5.39941C3 5.39941 3.16586 6.94405 3.81055 7.58887C4.45171 8.23002 5.9829 8.39756 6 8.39941C5.98497 8.40104 4.45218 8.56841 3.81055 9.20996C3.17012 9.85039 3.00222 11.3789 3 11.3994C2.99773 11.3785 2.8298 9.8503 2.18945 9.20996C1.54635 8.567 0.00819435 8.4003 0 8.39941C0.0115776 8.39817 1.54712 8.23119 2.18945 7.58887C2.83417 6.94407 3 5.39941 3 5.39941ZM8.40039 1.80078C8.40413 1.83512 8.6059 3.66113 9.37207 4.42773C10.142 5.19769 11.9822 5.39846 12 5.40039C11.9822 5.40231 10.1421 5.60307 9.37207 6.37305C8.60598 7.13956 8.40418 8.96526 8.40039 9C8.39692 8.96806 8.19453 7.1401 7.42773 6.37305C6.65402 5.59934 4.7998 5.40039 4.7998 5.40039C4.7998 5.40039 6.65402 5.20145 7.42773 4.42773C8.19462 3.66059 8.39696 1.83229 8.40039 1.80078ZM3 0C3.00049 0.0045674 3.13358 1.2371 3.64844 1.75195C4.16439 2.26757 5.40039 2.40039 5.40039 2.40039C5.40039 2.40039 4.16447 2.53235 3.64844 3.04785C3.13729 3.55899 3.00239 4.77781 3 4.7998C2.99771 4.77876 2.86291 3.5592 2.35156 3.04785C1.8356 2.53225 0.599609 2.40039 0.599609 2.40039C0.599609 2.40039 1.83569 2.26767 2.35156 1.75195C2.86738 1.23615 3 0 3 0Z" fill="#142A64"/>
3
+ </svg>
package/assets/icons/icon-clarity-light.svg ADDED
@@ -0,0 +1,9 @@
1
+ <svg width="18" height="17" viewBox="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M4.47363 8.05273C4.47646 8.07885 4.72659 10.3623 5.68262 11.3184C6.6443 12.2797 8.94824 12.5264 8.94824 12.5264C8.94824 12.5264 6.64415 12.7738 5.68262 13.7354C4.72112 14.6969 4.47363 17.001 4.47363 17.001C4.47363 17.001 4.22697 14.697 3.26562 13.7354C2.30674 12.7764 0.0126165 12.5277 0 12.5264C0.0169785 12.5245 2.30762 12.2763 3.26562 11.3184C4.22091 10.3631 4.47043 8.08233 4.47363 8.05273ZM12.5273 2.68457C12.5273 2.68457 12.823 5.44948 13.9766 6.60352C15.1247 7.75165 17.8683 8.05077 17.8955 8.05371C17.8696 8.05651 15.1249 8.3555 13.9766 9.50391C12.8229 10.6579 12.5273 13.4229 12.5273 13.4229C12.5273 13.4229 12.2308 10.6579 11.0771 9.50391C9.92757 8.35431 7.17852 8.0559 7.1582 8.05371C7.18012 8.05135 9.92791 7.75277 11.0771 6.60352C12.2308 5.4495 12.5273 2.68457 12.5273 2.68457ZM4.47363 0C4.47363 0 4.67129 1.843 5.44043 2.6123C6.20516 3.37705 8.03141 3.57679 8.05273 3.5791C8.03361 3.58117 6.20567 3.78074 5.44043 4.5459C4.67722 5.30913 4.47672 7.12978 4.47363 7.1582C4.47048 7.12921 4.26993 5.309 3.50684 4.5459C2.73908 3.77831 0.901921 3.5799 0.894531 3.5791C0.906548 3.57781 2.74013 3.37902 3.50684 2.6123C4.27516 1.8439 4.47319 0.00411877 4.47363 0Z" fill="url(#paint0_linear_31627_148148)"/>
3
+ <defs>
4
+ <linearGradient id="paint0_linear_31627_148148" x1="-4.48156" y1="-3.81841" x2="20.1075" y2="1.36359" gradientUnits="userSpaceOnUse">
5
+ <stop offset="0.0695937" stop-color="#0C77FF"/>
6
+ <stop offset="1" stop-color="#C33903"/>
7
+ </linearGradient>
8
+ </defs>
9
+ </svg>
package/assets/icons/icon-clarity.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M3 5.39941C3 5.39941 3.16586 6.94405 3.81055 7.58887C4.45171 8.23002 5.9829 8.39756 6 8.39941C5.98497 8.40104 4.45218 8.56841 3.81055 9.20996C3.17012 9.85039 3.00222 11.3789 3 11.3994C2.99773 11.3785 2.8298 9.8503 2.18945 9.20996C1.54635 8.567 0.00819435 8.4003 0 8.39941C0.0115776 8.39817 1.54712 8.23119 2.18945 7.58887C2.83417 6.94407 3 5.39941 3 5.39941ZM8.40039 1.80078C8.40413 1.83512 8.6059 3.66113 9.37207 4.42773C10.142 5.19769 11.9822 5.39846 12 5.40039C11.9822 5.40231 10.1421 5.60307 9.37207 6.37305C8.60598 7.13956 8.40418 8.96526 8.40039 9C8.39692 8.96806 8.19453 7.1401 7.42773 6.37305C6.65402 5.59934 4.7998 5.40039 4.7998 5.40039C4.7998 5.40039 6.65402 5.20145 7.42773 4.42773C8.19462 3.66059 8.39696 1.83229 8.40039 1.80078ZM3 0C3.00049 0.0045674 3.13358 1.2371 3.64844 1.75195C4.16439 2.26757 5.40039 2.40039 5.40039 2.40039C5.40039 2.40039 4.16447 2.53235 3.64844 3.04785C3.13729 3.55899 3.00239 4.77781 3 4.7998C2.99771 4.77876 2.86291 3.5592 2.35156 3.04785C1.8356 2.53225 0.599609 2.40039 0.599609 2.40039C0.599609 2.40039 1.83569 2.26767 2.35156 1.75195C2.86738 1.23615 3 0 3 0Z" fill="white"/>
3
+ </svg>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@beacon-interactive-systems-llc/beacon-platform-ui",
3
- "version": "19.2.16",
3
+ "version": "19.2.17",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "^19.2.14",
6
6
  "@angular/core": "^19.2.14",
package/styles/_buttons.scss CHANGED
@@ -42,7 +42,8 @@ $platform_button_contrasts: (
42
42
 
43
43
  buttonHoverStyleColor: $beacon-dark-blue-300,
44
44
  buttonGradientColor: linear-gradient(to right, rgba(22, 93, 184, 1), rgba(177, 63, 157, 1)),
45
- buttonGradientTextColor: $beacon-white
45
+ buttonGradientTextColor: $beacon-white,
46
+ buttonGradientIcon: url('../assets/icons/icon-clarity.svg'),
46
47
  ),
47
48
  dark: (
48
49
  buttonBlue: $beacon-blue-200,
@@ -87,7 +88,8 @@ $platform_button_contrasts: (
87
88
 
88
89
  buttonHoverStyleColor: $beacon-dark-blue-400,
89
90
  buttonGradientColor: $beacon-orange-650,
90
- buttonGradientTextColor: $beacon-dark-blue-600
91
+ buttonGradientTextColor: $beacon-dark-blue-600,
92
+ buttonGradientIcon: url('../assets/icons/icon-clarity-darkblue.svg'),
91
93
  ),
92
94
  highcontrast: (
93
95
  buttonBlue: $highcontrast-bright-blue-200,
@@ -132,7 +134,8 @@ $platform_button_contrasts: (
132
134
 
133
135
  buttonHoverStyleColor: $highcontrast-bright-blue-300,
134
136
  buttonGradientColor: $highcontrast-teal-100,
135
- buttonGradientTextColor: $beacon-black
137
+ buttonGradientTextColor: $beacon-black,
138
+ buttonGradientIcon: url('../assets/icons/icon-clarity-black.svg'),
136
139
  )
137
140
  );
138
141
 
@@ -357,6 +360,12 @@ button.platform-btn {
357
360
  cursor: pointer;
358
361
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.16);
359
362
  }
363
+
364
+ .gradient-icon {
365
+ @include themify($platform_button_contrasts) {
366
+ content: apply('buttonGradientIcon') !important;
367
+ }
368
+ }
360
369
  }
361
370
 
362
371
  .btn-group.platform-btn-group {
package/styles/_widgets.scss CHANGED
@@ -26,11 +26,16 @@ $platform_widget_contrasts: (
26
26
  selectedFilterAltBackground: $beacon-green-100,
27
27
  widgetLineChartText: $beacon-gray-500,
28
28
  widgetCircleIconRed: $beacon-orange-500,
29
+ suggestionIcon: url('../assets/icons/icon-clarity-light.svg'),
29
30
  suggestionTextAnimation: linear-gradient(90deg,rgba(12,119,255,1), rgba(184,61,18,1),rgba(12,119,255,1)),
31
+ suggestionTextNoAnimation: $beacon-dark-blue-400,
30
32
  suggestionTextHeader: $beacon-purple-100,
31
33
  suggestionTableBorder: linear-gradient(to right,rgba(12,119,255,1), rgba(195, 57, 3, 1)),
32
34
  suggestionTableRowBorder: $beacon-gray-300,
33
- suggestionTableBackGround: linear-gradient($beacon-white, $beacon-white)
35
+ suggestionTableBackGround: linear-gradient($beacon-white, $beacon-white),
36
+ suggestionTableTextId: $beacon-black,
37
+ suggestionTableTextDetail: $beacon-dark-blue-600,
38
+ suggestionTableTextClone: $beacon-blue-200,
34
39
  ),
35
40
  dark: (
36
41
  widgetText: $beacon-gray-200,
@@ -58,11 +63,16 @@ $platform_widget_contrasts: (
58
63
  selectedFilterAltBackground: $beacon-green-600,
59
64
  widgetLineChartText: $beacon-gray-700,
60
65
  widgetCircleIconRed: $beacon-orange-500,
61
- suggestionTextAnimation: linear-gradient(to right, rgba(12, 119, 255, 1), rgba(184, 61, 18, 1)),
66
+ suggestionIcon: url('../assets/icons/icon-clarity-DARK.svg'),
67
+ suggestionTextAnimation: $beacon-orange-650,
68
+ suggestionTextNoAnimation: $beacon-gray-300,
62
69
  suggestionTextHeader: $beacon-orange-650,
63
- suggestionTableBorder: linear-gradient(to right,rgba(12,119,255,1), rgba(195, 57, 3, 1)),
70
+ suggestionTableBorder: linear-gradient(to right,$beacon-orange-650, $beacon-orange-650),
64
71
  suggestionTableRowBorder: $beacon-gray-300,
65
- suggestionTableBackGround: linear-gradient($beacon-gray-600, $beacon-gray-600)
72
+ suggestionTableBackGround: linear-gradient($beacon-gray-700, $beacon-gray-700),
73
+ suggestionTableTextId: $beacon-gray-400,
74
+ suggestionTableTextDetail:$beacon-gray-300,
75
+ suggestionTableTextClone: $beacon-blue-200,
66
76
  ),
67
77
  highcontrast: (
68
78
  widgetText: $beacon-white,
@@ -90,11 +100,16 @@ $platform_widget_contrasts: (
90
100
  selectedFilterAltBackground: $highcontrast-bright-green-300,
91
101
  widgetLineChartText: $beacon-white,
92
102
  widgetCircleIconRed: $beacon-orange-500,
93
- suggestionTextAnimation: linear-gradient(to right, rgba(12, 119, 255, 1), rgba(184, 61, 18, 1)),
103
+ suggestionIcon: url('../assets/icons/icon-clarity-CONTRAST.svg'),
104
+ suggestionTextAnimation: $highcontrast-teal-100,
105
+ suggestionTextNoAnimation: $beacon-gray-300,
94
106
  suggestionTextHeader: $highcontrast-teal-100,
95
- suggestionTableBorder: linear-gradient(to right,rgba(12,119,255,1), rgba(195, 57, 3, 1)),
107
+ suggestionTableBorder: linear-gradient(to right,$highcontrast-teal-100, $highcontrast-teal-100),
96
108
  suggestionTableRowBorder: $beacon-gray-300,
97
- suggestionTableBackGround: linear-gradient($beacon-black, $beacon-black)
109
+ suggestionTableBackGround: linear-gradient($beacon-black, $beacon-black),
110
+ suggestionTableTextId: $beacon-gray-400,
111
+ suggestionTableTextDetail:$beacon-white,
112
+ suggestionTableTextClone: $highcontrast-bright-blue-200,
98
113
  )
99
114
  );
100
115
 
@@ -944,6 +959,44 @@ $platform_widget_contrasts: (
944
959
  transition: opacity 600ms ease-in-out;
945
960
  }
946
961
  }
962
+
963
+ &--search-no-animation {
964
+ @include themify($platform_widget_contrasts) {
965
+ color: apply('suggestionTextNoAnimation') !important;
966
+ }
967
+ }
968
+
969
+ &--text {
970
+ @include themify($platform_widget_contrasts) {
971
+ color: apply('suggestionTextHeader') !important;
972
+ }
973
+ }
974
+ }
975
+
976
+ .result-section {
977
+ .text-id {
978
+ @include themify($platform_widget_contrasts) {
979
+ color: apply('suggestionTableTextId') !important;
980
+ }
981
+ }
982
+
983
+ .text-detail {
984
+ @include themify($platform_widget_contrasts) {
985
+ color: apply('suggestionTableTextDetail') !important;
986
+ }
987
+ }
988
+
989
+ .text-clone {
990
+ @include themify($platform_widget_contrasts) {
991
+ color: apply('suggestionTableTextClone') !important;
992
+ }
993
+ }
994
+ }
995
+
996
+ .icon {
997
+ @include themify($platform_widget_contrasts) {
998
+ content: apply('suggestionIcon') !important;
999
+ }
947
1000
  }
948
1001
  }
949
1002
 
@@ -987,5 +1040,11 @@ $platform_widget_contrasts: (
987
1040
  border-bottom: none;
988
1041
  }
989
1042
  }
1043
+
1044
+ .text-detail {
1045
+ @include themify($platform_widget_contrasts) {
1046
+ color: apply('suggestionTableTextDetail') !important;
1047
+ }
1048
+ }
990
1049
  }
991
1050
  }