@sc-360-v2/storefront-cms-library 0.5.44 → 0.5.46

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 (15) hide show
  1. package/dist/builder.js +1 -1
  2. package/dist/fb-dropdown.scss +135 -125
  3. package/dist/hotspot.scss +375 -109
  4. package/dist/htmlElement.js +1 -1
  5. package/dist/index.js +1 -1
  6. package/dist/types/builder/tools/element-edit/createForm.d.ts +3 -1
  7. package/dist/types/builder/tools/element-edit/faq.d.ts +8 -1
  8. package/dist/types/builder/tools/element-edit/imageHotspot.d.ts +16 -5
  9. package/dist/types/builder/tools/element-edit/profile.d.ts +3 -12
  10. package/dist/types/builder/tools/element-edit/uomSelector.d.ts +5 -0
  11. package/dist/types/upload-media/types.d.ts +2 -1
  12. package/dist/uom-selector.scss +60 -2
  13. package/dist/uploadMedia.js +1 -1
  14. package/dist/volume-pricing.scss +0 -1
  15. package/package.json +1 -1
package/dist/fb-dropdown.scss CHANGED
@@ -1,125 +1,135 @@
1
- .fb_dropdown_main {
2
- position: relative;
3
- width: 100%;
4
- }
5
-
6
- .fb_dropdown_label {
7
- width: 100%;
8
- height: 40px;
9
- border: 1px solid var(--_gray-300);
10
- border-radius: 6px;
11
- background: var(--_base-white);
12
- cursor: pointer;
13
- padding: 0 12px;
14
- display: flex;
15
- align-items: center;
16
- justify-content: space-between;
17
- transition: border 0.2s ease;
18
-
19
- &:focus,
20
- &:focus-within {
21
- border-color: var(--_primary-300);
22
- box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
23
- outline: none;
24
- }
25
-
26
- &.disabled {
27
- cursor: not-allowed;
28
- background: var(--_gray-100);
29
- color: var(--_gray-400);
30
- }
31
-
32
- .fb_dropdown_text {
33
- color: var(--_gray-800);
34
- white-space: nowrap;
35
- overflow: hidden;
36
- text-overflow: ellipsis;
37
- max-width: 90%;
38
- }
39
-
40
- .fb_dropdown_icon {
41
- display: flex;
42
- transition: transform 300ms ease;
43
-
44
- svg {
45
- width: 16px;
46
- height: 16px;
47
- }
48
-
49
- &.open {
50
- transform: rotate(180deg);
51
- }
52
- }
53
- }
54
-
55
- .fb_dropdown_panel {
56
- position: absolute;
57
- width: 100%;
58
- background-color: var(--_base-white);
59
- border: 1px solid var(--_gray-300);
60
- border-radius: 6px;
61
- margin-top: 4px;
62
- z-index: 10;
63
- max-height: 200px;
64
- overflow-y: auto;
65
- box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
66
-
67
- &.drop-up {
68
- bottom: 44px;
69
- top: auto;
70
- margin-top: 0;
71
- margin-bottom: 4px;
72
- }
73
-
74
- &.drop-down {
75
- top: 100%;
76
- }
77
-
78
- ul {
79
- list-style: none;
80
- padding: 4px;
81
- margin: 0;
82
- display: flex;
83
- flex-direction: column;
84
- gap: 2px;
85
-
86
- li {
87
- padding: 0;
88
- }
89
-
90
- .dropdown_option {
91
- display: flex;
92
- align-items: center;
93
- gap: 8px;
94
- padding: 8px 12px;
95
- font-size: 14px;
96
- color: var(--_gray-700);
97
- cursor: pointer;
98
- transition: background 0.2s;
99
- border-radius: 4px;
100
-
101
- input[type="checkbox"] {
102
- margin: 0;
103
- pointer-events: none;
104
- }
105
-
106
- &:hover {
107
- background-color: var(--_primary-50);
108
- color: var(--_primary-500);
109
- }
110
-
111
- &.selected {
112
- background-color: var(--_primary-25);
113
- color: var(--_primary-700);
114
- font-weight: 500;
115
- }
116
- }
117
- }
118
- }
119
-
120
- .empty-options {
121
- padding: 10px 12px;
122
- color: var(--_gray-500);
123
- font-size: 14px;
124
- text-align: center;
125
- }
1
+ .react-grid-item {
2
+ position: inherit !important;
3
+ transform: inherit !important;
4
+ width: 100% !important;
5
+ height: fit-content !important;
6
+ padding-bottom: 16px !important;
7
+ .grid-item {
8
+ margin-bottom: 0px !important;
9
+ }
10
+ }
11
+ .fb_dropdown_main {
12
+ position: relative;
13
+ width: 100%;
14
+ }
15
+
16
+ .fb_dropdown_label {
17
+ width: 100%;
18
+ height: 40px;
19
+ border: 1px solid var(--_gray-300);
20
+ border-radius: 6px;
21
+ background: var(--_base-white);
22
+ cursor: pointer;
23
+ padding: 0 12px;
24
+ display: flex;
25
+ align-items: center;
26
+ justify-content: space-between;
27
+ transition: border 0.2s ease;
28
+
29
+ &:focus,
30
+ &:focus-within {
31
+ border-color: var(--_primary-300);
32
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
33
+ outline: none;
34
+ }
35
+
36
+ &.disabled {
37
+ cursor: not-allowed;
38
+ background: var(--_gray-100);
39
+ color: var(--_gray-400);
40
+ }
41
+
42
+ .fb_dropdown_text {
43
+ color: var(--_gray-800);
44
+ white-space: nowrap;
45
+ overflow: hidden;
46
+ text-overflow: ellipsis;
47
+ max-width: 90%;
48
+ }
49
+
50
+ .fb_dropdown_icon {
51
+ display: flex;
52
+ transition: transform 300ms ease;
53
+
54
+ svg {
55
+ width: 16px;
56
+ height: 16px;
57
+ }
58
+
59
+ &.open {
60
+ transform: rotate(180deg);
61
+ }
62
+ }
63
+ }
64
+
65
+ .fb_dropdown_panel {
66
+ position: absolute;
67
+ width: 100%;
68
+ background-color: var(--_base-white);
69
+ border: 1px solid var(--_gray-300);
70
+ border-radius: 6px;
71
+ margin-top: 4px;
72
+ z-index: 10;
73
+ max-height: 200px;
74
+ overflow-y: auto;
75
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
76
+
77
+ &.drop-up {
78
+ bottom: 44px;
79
+ top: auto;
80
+ margin-top: 0;
81
+ margin-bottom: 4px;
82
+ }
83
+
84
+ &.drop-down {
85
+ top: 100%;
86
+ }
87
+
88
+ ul {
89
+ list-style: none;
90
+ padding: 4px;
91
+ margin: 0;
92
+ display: flex;
93
+ flex-direction: column;
94
+ gap: 2px;
95
+
96
+ li {
97
+ padding: 0;
98
+ }
99
+
100
+ .dropdown_option {
101
+ display: flex;
102
+ align-items: center;
103
+ gap: 8px;
104
+ padding: 8px 12px;
105
+ font-size: 14px;
106
+ color: var(--_gray-700);
107
+ cursor: pointer;
108
+ transition: background 0.2s;
109
+ border-radius: 4px;
110
+
111
+ input[type="checkbox"] {
112
+ margin: 0;
113
+ pointer-events: none;
114
+ }
115
+
116
+ &:hover {
117
+ background-color: var(--_primary-50);
118
+ color: var(--_primary-500);
119
+ }
120
+
121
+ &.selected {
122
+ background-color: var(--_primary-25);
123
+ color: var(--_primary-700);
124
+ font-weight: 500;
125
+ }
126
+ }
127
+ }
128
+ }
129
+
130
+ .empty-options {
131
+ padding: 10px 12px;
132
+ color: var(--_gray-500);
133
+ font-size: 14px;
134
+ text-align: center;
135
+ }