@bikdotai/bik-component-library 0.0.796-beta.2 → 0.0.796-beta.4

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 (167) hide show
  1. package/dist/cjs/components/QueryBuilder/components/Connectors/Components/InTheLast.js +1 -1
  2. package/dist/cjs/components/QueryBuilder/components/Connectors/Components/InTwoLast.js +1 -1
  3. package/dist/cjs/components/QueryBuilder/constants/connector.js +1 -1
  4. package/dist/cjs/components/QueryBuilder/types/QueryBuilderEnum.type.d.ts +1 -2
  5. package/dist/cjs/components/QueryBuilder/types/QueryBuilderEnum.type.js +1 -1
  6. package/dist/cjs/components/avatar/Avatar.d.ts +2 -1
  7. package/dist/cjs/components/avatar/Avatar.js +1 -1
  8. package/dist/cjs/components/avatar/AvatarHelper.d.ts +2 -0
  9. package/dist/cjs/components/avatar/AvatarHelper.js +1 -1
  10. package/dist/cjs/components/bik-layout/BikSidebarV2/BikSidebarV2.d.ts +33 -0
  11. package/dist/cjs/components/bik-layout/BikSidebarV2/BikSidebarV2.js +1 -0
  12. package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2.model.d.ts +27 -0
  13. package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Popup.d.ts +13 -0
  14. package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Popup.js +1 -0
  15. package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Styles.d.ts +44 -0
  16. package/dist/cjs/components/bik-layout/BikSidebarV2/SidebarV2Styles.js +287 -0
  17. package/dist/cjs/components/bik-layout/BikSidebarV2/SimpleSidebarV2.d.ts +3 -0
  18. package/dist/cjs/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js +1 -0
  19. package/dist/cjs/components/bik-layout/MockMenus.d.ts +1 -0
  20. package/dist/cjs/components/bik-layout/index.d.ts +2 -0
  21. package/dist/cjs/components/button/Button.styled.d.ts +1 -1
  22. package/dist/cjs/components/button/model.d.ts +1 -1
  23. package/dist/cjs/components/button/themes.d.ts +1 -1
  24. package/dist/cjs/components/country-code-picker/CountryCodePicker.d.ts +1 -1
  25. package/dist/cjs/components/country-code-picker/CountryPicker.d.ts +1 -1
  26. package/dist/cjs/components/dropdown/Dropdown.js +1 -1
  27. package/dist/cjs/components/dropdown/DropdownPopover/index.js +1 -1
  28. package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
  29. package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.d.ts +1 -1
  30. package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js +6 -5
  31. package/dist/cjs/components/dropdown/OpenedDropdown/components/description/Description.d.ts +1 -1
  32. package/dist/cjs/components/dropdown/OpenedDropdown/components/description/Description.styled.d.ts +1 -1
  33. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.d.ts +1 -1
  34. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts +1 -1
  35. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuItem.js +7 -7
  36. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.d.ts +1 -1
  37. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.d.ts +1 -1
  38. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.d.ts +1 -1
  39. package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.d.ts +1 -1
  40. package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js +1 -1
  41. package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.d.ts +1 -0
  42. package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js +1 -1
  43. package/dist/cjs/components/dropdown/type.d.ts +1 -1
  44. package/dist/cjs/components/fab-menu/FABMenu.d.ts +1 -1
  45. package/dist/cjs/components/icon-button/IconButton.js +1 -1
  46. package/dist/cjs/components/icon-button/IconButton.styled.d.ts +1 -0
  47. package/dist/cjs/components/icon-button/IconButton.styled.js +3 -3
  48. package/dist/cjs/components/icon-button/model.d.ts +5 -0
  49. package/dist/cjs/components/input/Input.js +1 -1
  50. package/dist/cjs/components/input/Input.model.d.ts +2 -1
  51. package/dist/cjs/components/input/Input.styled.d.ts +16 -1
  52. package/dist/cjs/components/input/Input.styled.js +1 -1
  53. package/dist/cjs/components/list-item/List.model.d.ts +1 -1
  54. package/dist/cjs/components/list-item/ListItem.js +1 -1
  55. package/dist/cjs/components/list-item/ListItem.styled.d.ts +1 -1
  56. package/dist/cjs/components/list-item/ListItem.styled.js +1 -1
  57. package/dist/cjs/components/list-item/themes.d.ts +2 -2
  58. package/dist/cjs/components/list-item/themes.js +1 -1
  59. package/dist/cjs/components/multi-level-dropdown/GroupedMenuList.d.ts +1 -0
  60. package/dist/cjs/components/multi-level-dropdown/GroupedMenuList.js +1 -1
  61. package/dist/cjs/components/multi-level-dropdown/MenuItem.d.ts +1 -0
  62. package/dist/cjs/components/multi-level-dropdown/MenuItem.js +1 -1
  63. package/dist/cjs/components/multi-level-dropdown/MenuList.d.ts +1 -0
  64. package/dist/cjs/components/multi-level-dropdown/MenuList.js +1 -1
  65. package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.js +1 -1
  66. package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.styled.d.ts +13 -3
  67. package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.styled.js +33 -30
  68. package/dist/cjs/components/multi-level-dropdown/type.d.ts +1 -0
  69. package/dist/cjs/components/tag/Tag.d.ts +1 -1
  70. package/dist/cjs/components/tag/Tag.js +1 -1
  71. package/dist/cjs/components/tag/Tag.stories.d.ts +5 -5
  72. package/dist/cjs/components/tag/Tag.styled.d.ts +2 -1
  73. package/dist/cjs/components/tag/Tag.styled.js +1 -1
  74. package/dist/cjs/components/tag/model.d.ts +3 -1
  75. package/dist/cjs/components/whats-new/WhatsNew.d.ts +2 -0
  76. package/dist/cjs/components/whats-new/WhatsNew.js +1 -1
  77. package/dist/cjs/components/whats-new/WhatsNew.types.d.ts +2 -0
  78. package/dist/cjs/components/whats-new/WhatsNewButton.js +1 -1
  79. package/dist/cjs/constants/Theme.d.ts +6 -0
  80. package/dist/cjs/constants/Theme.js +1 -1
  81. package/dist/cjs/icons/Arrows/Chevron/ChevronUp.d.ts +1 -2
  82. package/dist/cjs/icons/Arrows/Chevron/ChevronUp.js +1 -1
  83. package/dist/cjs/index.js +1 -1
  84. package/dist/esm/components/QueryBuilder/components/Connectors/Components/InTheLast.js +1 -1
  85. package/dist/esm/components/QueryBuilder/components/Connectors/Components/InTwoLast.js +1 -1
  86. package/dist/esm/components/QueryBuilder/constants/connector.js +1 -1
  87. package/dist/esm/components/QueryBuilder/types/QueryBuilderEnum.type.d.ts +1 -2
  88. package/dist/esm/components/QueryBuilder/types/QueryBuilderEnum.type.js +1 -1
  89. package/dist/esm/components/avatar/Avatar.d.ts +2 -1
  90. package/dist/esm/components/avatar/Avatar.js +1 -1
  91. package/dist/esm/components/avatar/AvatarHelper.d.ts +2 -0
  92. package/dist/esm/components/avatar/AvatarHelper.js +1 -1
  93. package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.d.ts +33 -0
  94. package/dist/esm/components/bik-layout/BikSidebarV2/BikSidebarV2.js +1 -0
  95. package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2.model.d.ts +27 -0
  96. package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.d.ts +13 -0
  97. package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Popup.js +1 -0
  98. package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.d.ts +44 -0
  99. package/dist/esm/components/bik-layout/BikSidebarV2/SidebarV2Styles.js +287 -0
  100. package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.d.ts +3 -0
  101. package/dist/esm/components/bik-layout/BikSidebarV2/SimpleSidebarV2.js +1 -0
  102. package/dist/esm/components/bik-layout/MockMenus.d.ts +1 -0
  103. package/dist/esm/components/bik-layout/index.d.ts +2 -0
  104. package/dist/esm/components/button/Button.styled.d.ts +1 -1
  105. package/dist/esm/components/button/model.d.ts +1 -1
  106. package/dist/esm/components/button/themes.d.ts +1 -1
  107. package/dist/esm/components/country-code-picker/CountryCodePicker.d.ts +1 -1
  108. package/dist/esm/components/country-code-picker/CountryPicker.d.ts +1 -1
  109. package/dist/esm/components/dropdown/Dropdown.js +1 -1
  110. package/dist/esm/components/dropdown/DropdownPopover/index.js +1 -1
  111. package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
  112. package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.d.ts +1 -1
  113. package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.js +3 -2
  114. package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.d.ts +1 -1
  115. package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.styled.d.ts +1 -1
  116. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.d.ts +1 -1
  117. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts +1 -1
  118. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.js +1 -1
  119. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.d.ts +1 -1
  120. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.d.ts +1 -1
  121. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.d.ts +1 -1
  122. package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.d.ts +1 -1
  123. package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js +1 -1
  124. package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.d.ts +1 -0
  125. package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js +1 -1
  126. package/dist/esm/components/dropdown/type.d.ts +1 -1
  127. package/dist/esm/components/fab-menu/FABMenu.d.ts +1 -1
  128. package/dist/esm/components/icon-button/IconButton.js +1 -1
  129. package/dist/esm/components/icon-button/IconButton.styled.d.ts +1 -0
  130. package/dist/esm/components/icon-button/IconButton.styled.js +1 -1
  131. package/dist/esm/components/icon-button/model.d.ts +5 -0
  132. package/dist/esm/components/input/Input.js +1 -1
  133. package/dist/esm/components/input/Input.model.d.ts +2 -1
  134. package/dist/esm/components/input/Input.styled.d.ts +16 -1
  135. package/dist/esm/components/input/Input.styled.js +1 -1
  136. package/dist/esm/components/list-item/List.model.d.ts +1 -1
  137. package/dist/esm/components/list-item/ListItem.js +1 -1
  138. package/dist/esm/components/list-item/ListItem.styled.d.ts +1 -1
  139. package/dist/esm/components/list-item/ListItem.styled.js +1 -1
  140. package/dist/esm/components/list-item/themes.d.ts +2 -2
  141. package/dist/esm/components/list-item/themes.js +1 -1
  142. package/dist/esm/components/multi-level-dropdown/GroupedMenuList.d.ts +1 -0
  143. package/dist/esm/components/multi-level-dropdown/GroupedMenuList.js +1 -1
  144. package/dist/esm/components/multi-level-dropdown/MenuItem.d.ts +1 -0
  145. package/dist/esm/components/multi-level-dropdown/MenuItem.js +1 -1
  146. package/dist/esm/components/multi-level-dropdown/MenuList.d.ts +1 -0
  147. package/dist/esm/components/multi-level-dropdown/MenuList.js +1 -1
  148. package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.js +1 -1
  149. package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.styled.d.ts +13 -3
  150. package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.styled.js +32 -29
  151. package/dist/esm/components/multi-level-dropdown/type.d.ts +1 -0
  152. package/dist/esm/components/tag/Tag.d.ts +1 -1
  153. package/dist/esm/components/tag/Tag.js +1 -1
  154. package/dist/esm/components/tag/Tag.stories.d.ts +5 -5
  155. package/dist/esm/components/tag/Tag.styled.d.ts +2 -1
  156. package/dist/esm/components/tag/Tag.styled.js +1 -1
  157. package/dist/esm/components/tag/model.d.ts +3 -1
  158. package/dist/esm/components/whats-new/WhatsNew.d.ts +2 -0
  159. package/dist/esm/components/whats-new/WhatsNew.js +1 -1
  160. package/dist/esm/components/whats-new/WhatsNew.types.d.ts +2 -0
  161. package/dist/esm/components/whats-new/WhatsNewButton.js +1 -1
  162. package/dist/esm/constants/Theme.d.ts +6 -0
  163. package/dist/esm/constants/Theme.js +1 -1
  164. package/dist/esm/icons/Arrows/Chevron/ChevronUp.d.ts +1 -2
  165. package/dist/esm/icons/Arrows/Chevron/ChevronUp.js +1 -1
  166. package/dist/esm/index.js +1 -1
  167. package/package.json +1 -2
@@ -0,0 +1,287 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../TypographyStyle.js"),i=require("../../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=r(e);const n=o.default.div`
2
+ background-color: #28034e;
3
+ width: 72px;
4
+ justify-content: space-between;
5
+ position: sticky;
6
+ top: 0;
7
+ left: 0;
8
+ z-index: 10;
9
+ overflow-y: auto;
10
+ height: 100vh;
11
+
12
+ .bik-header-logo {
13
+ padding: 8px 8px 0 8px;
14
+ display: flex;
15
+ flex-direction: column;
16
+ justify-content: center;
17
+ align-items: center;
18
+ width: 100%;
19
+ cursor: pointer;
20
+ img {
21
+ width: 100%;
22
+ height: 100%;
23
+ object-fit: container;
24
+ }
25
+ }
26
+ `,a=o.default.div`
27
+ margin: 0px 0px 16px;
28
+ padding-bottom: 8px;
29
+ `,d=o.default.div``,s=o.default.div`
30
+ padding: 0px 6px;
31
+ margin-bottom: 6px;
32
+ > * {
33
+ gap: 4px;
34
+ }
35
+ `,p=o.default.div`
36
+ position: absolute;
37
+ right: 5px;
38
+ background: ${i.COLORS.stroke.warning.vibrant} !important;
39
+ font-size: 7.7px;
40
+ font-family: 'Inter';
41
+ line-height: 10px;
42
+ padding: 2px 9.27px 2px 9.27px;
43
+ border-radius: 16px 16px 0px 16px;
44
+ background: ${i.COLORS.background.inverse};
45
+ ${t=>{let{isLastSticky:i}=t;return i&&e.css`
46
+ @media (min-height: 768px) {
47
+ bottom: 116px;
48
+ z-index: 1;
49
+ }
50
+ `}}
51
+ `,b=o.default.div`
52
+ position: absolute;
53
+ right: 10px;
54
+ margin-top: -5px;
55
+ ${t=>{let{isLastSticky:i}=t;return i&&e.css`
56
+ @media (min-height: 768px) {
57
+ bottom: 116px;
58
+ z-index: 1;
59
+ }
60
+ `}}
61
+ ${t=>{let{is2ndLastSticky:i}=t;return i&&e.css`
62
+ @media (min-height: 768px) {
63
+ bottom: 48px;
64
+ z-index: 1;
65
+ }
66
+ `}}
67
+ `,x=o.default.div`
68
+ display: flex;
69
+ flex-direction: column;
70
+ border-radius: 10px;
71
+ align-items: center;
72
+ justify-content: space-around;
73
+ cursor: pointer;
74
+ > * {
75
+ gap: 10px;
76
+ }
77
+ padding: 8px;
78
+
79
+ ${t=>{let{isNew:i}=t;return i&&e.css`
80
+ padding-top: 14px;
81
+ `}}
82
+
83
+ ${t=>{let{isActive:r}=t;return r&&e.css`
84
+ border-radius: 8px;
85
+ background-color: ${i.BASE_COLORS.brand[850]};
86
+ color: ${i.COLORS.content.primaryInverse};
87
+ box-shadow: inset 0 0 0 1px ${i.COLORS.stroke.brandSubdued};
88
+ `}}
89
+
90
+ ${t=>{let{isHovered:r}=t;return r&&e.css`
91
+ background: ${i.COLORS.background.brandHovered};
92
+ border-radius: 8px;
93
+ `}}
94
+
95
+ ${t=>{let{isActive:r,isHovered:o}=t;return r&&o&&e.css`
96
+ border-radius: 8px;
97
+ border: 1px solid ${i.BASE_COLORS.brand[700]};
98
+ background-color: ${i.BASE_COLORS.brand[800]};
99
+ `}}
100
+
101
+
102
+ ${t=>{let{isLastSticky:i}=t;return i&&e.css`
103
+ @media (min-height: 768px) {
104
+ position: absolute;
105
+ bottom: 72px;
106
+ left: 6px;
107
+ right: 6px;
108
+ }
109
+ `}}
110
+
111
+ ${t=>{let{is2ndLastSticky:i}=t;return i&&e.css`
112
+ @media (min-height: 768px) {
113
+ position: absolute;
114
+ bottom: 8px;
115
+ left: 6px;
116
+ right: 6px;
117
+ }
118
+ `}}
119
+
120
+ ${t=>{let{stickyBottom:i}=t;return void 0!==i&&e.css`
121
+ @media (min-height: 768px) {
122
+ position: absolute;
123
+ bottom: ${i}px;
124
+ left: 6px;
125
+ right: 6px;
126
+ }
127
+ `}}
128
+ `,c=o.default.div`
129
+ display: flex;
130
+ flex-direction: row;
131
+ cursor: pointer;
132
+ `,u=o.default(t.BodyTiny)`
133
+ user-select: none;
134
+ color: ${e=>{let{isActive:t}=e;return t?i.COLORS.content.primaryInverse:i.COLORS.content.secondaryInverse}};
135
+ margin-bottom: 0px;
136
+ text-align: center;
137
+ `,l=o.default.div`
138
+ .transform-class {
139
+ position: relative;
140
+ animation: animatebottom 0.2s;
141
+ transition-timing-function: ease-out;
142
+ }
143
+ @keyframes animatebottom {
144
+ from {
145
+ opacity: 0;
146
+ }
147
+
148
+ to {
149
+ opacity: 1;
150
+ }
151
+ }
152
+ .sidebar-right-menu {
153
+ position: ${e=>e.postion?e.postion:"sticky"};
154
+ top: ${e=>e.top?e.top:0}px;
155
+ left: ${e=>e.left?e.left:0}px; //72
156
+ width: ${e=>e.width?e.width:240}px;
157
+ z-index: ${e=>e.zIndex?e.zIndex:2};
158
+ background-color: ${e=>"brand"==e.theme?i.COLORS.background.inverse:i.COLORS.surface.standard};
159
+ height: ${e=>e.isNewSidebar?"fit-content":"100vh"};
160
+ display: flex;
161
+ flex-direction: column;
162
+ padding: 4px;
163
+ border-radius: ${e=>e.isNewSidebar?"8px":""};
164
+
165
+ .sidebar-bridge {
166
+ position: absolute;
167
+ right: 100%;
168
+ top: 0;
169
+ width: 6px;
170
+ height: 100%;
171
+ }
172
+ }
173
+
174
+ .sub-child-menu {
175
+ display: flex;
176
+ align-items: center;
177
+ justify-content: flex-start;
178
+ margin-bottom: ${e=>e.isNewSidebar?"":"8px"};
179
+ cursor: pointer;
180
+ background: ${e=>"brand"==e.theme?i.COLORS.background.inverse:"transparent"};
181
+ border-radius: 4px;
182
+ .sub-child-text {
183
+ color: ${e=>"brand"==e.theme?i.COLORS.surface.standard:""};
184
+ margin-bottom: 0px;
185
+ padding: 8px 12px;
186
+ font-size: ${i.FONTS.caption.fontSize}px;
187
+ line-height: ${i.FONTS.caption.lineHeight}px;
188
+ font-weight: ${i.FONTS.caption.fontWeight};
189
+ white-space: nowrap;
190
+ overflow: hidden;
191
+ text-overflow: ellipsis;
192
+ }
193
+ .sub-child-new-tag {
194
+ padding: 2px 9px 2px 9px;
195
+ border-radius: 16px;
196
+ background-color: rgba(254, 192, 45, 1);
197
+ font-family: Inter;
198
+ font-size: 7px;
199
+ font-weight: 600;
200
+ line-height: 10px;
201
+ color: rgba(40, 3, 78, 1);
202
+ }
203
+ .sub-child-active-text {
204
+ display: none;
205
+ }
206
+ .active-bold-weight {
207
+ font-weight: 600;
208
+ color: ${e=>e.isNewSidebar?i.COLORS.background.warning.vibrant:""};
209
+ }
210
+ .sub-child-active-menu-style {
211
+ color: ${e=>e.isNewSidebar?i.COLORS.background.warning.vibrant:""};
212
+ }
213
+ }
214
+ .sub-child-menu:hover {
215
+ background: ${e=>"brand"==e.theme?i.COLORS.background.brandHovered:i.COLORS.background.base};
216
+ border-radius: 4px;
217
+ }
218
+ .sub-child-active-menu {
219
+ background: ${e=>"brand"==e.theme?i.COLORS.background.brandHovered:i.COLORS.background.base};
220
+ border-radius: 4px;
221
+ border: ${e=>"brand"==e.theme?`1px solid ${i.COLORS.stroke.brandSubdued}`:"none"};
222
+ .sub-child-active-text {
223
+ background: ${e=>"brand"==e.theme?i.COLORS.stroke.brandSubdued:i.COLORS.background.warning.vibrant};
224
+ }
225
+ }
226
+ .sub-child-active-menu:hover {
227
+ background: ${e=>"brand"==e.theme?i.COLORS.background.inverseLight:i.COLORS.background.base};
228
+ border-radius: 4px;
229
+ border: ${e=>"brand"==e.theme?`1px solid ${i.COLORS.stroke.brandSubdued}`:"none"};
230
+ .sub-child-active-text {
231
+ background: ${e=>"brand"==e.theme?i.COLORS.stroke.brandSubdued:i.COLORS.background.warning.vibrant};
232
+ }
233
+ }
234
+ .sub-child-display-name {
235
+ padding: 14px 12px;
236
+ color: ${e=>"brand"==e.theme?i.COLORS.content.secondaryInverse:i.COLORS.text.secondary};
237
+ }
238
+ .lower-sticky-panel {
239
+ position: ${e=>e.isNewSidebar?"relative":"absolute"};
240
+ bottom: ${e=>e.isNewSidebar?"":"16px"};
241
+ margin-top: ${e=>e.isNewSidebar?"auto":""};
242
+ margin-bottom: ${e=>e.isNewSidebar?"16px":""};
243
+ .title-text {
244
+ padding: 8px 12px;
245
+ text-align: center;
246
+ }
247
+ .upgrade-button {
248
+ margin: auto;
249
+ }
250
+ }
251
+ .sidebar-skeleton {
252
+ padding: 8px;
253
+ }
254
+ `,g=o.default.div`
255
+ .sidebar-right-menu {
256
+ border-radius: 8px;
257
+ border: 0.5px solid var(--stroke-color-stroke-primary, #e0e0e0);
258
+ box-shadow: 0px 0px 12px 0px rgba(222, 236, 255, 0.6);
259
+ position: ${e=>e.postion?e.postion:"sticky"};
260
+ top: ${e=>e.top?e.top:void 0}px;
261
+ bottom: 10px;
262
+ left: ${e=>e.left?e.left:0}px; //72
263
+ z-index: ${e=>e.zIndex?e.zIndex:2};
264
+ background-color: ${e=>"brand"==e.theme?"#381062":i.COLORS.surface.standard};
265
+ display: flex;
266
+ flex-direction: column;
267
+ padding: 4px;
268
+ gap: 4px;
269
+ min-height: 100px;
270
+ overflow-y: auto;
271
+ }
272
+ .each-menu {
273
+ padding: 8px;
274
+ gap: 4px;
275
+ display: flex;
276
+ flex-direction: column;
277
+ justify-content: flex-start;
278
+ align-items: flex-start;
279
+ border-bottom: 0.5px solid #e0e0e0;
280
+ cursor: pointer;
281
+ max-width: 320px;
282
+ &:hover {
283
+ background-color: ${i.COLORS.background.base};
284
+ border-radius: 8px;
285
+ }
286
+ }
287
+ `;exports.MainSideBarV2MenuWrapper=a,exports.SibeBarV2MenuItem=d,exports.SideBarV2Container=n,exports.SidebarLockedChannel=b,exports.SidebarMainMenu=s,exports.SidebarMenuItemContainer=c,exports.SidebarMenuItemInner=x,exports.SidebarMenuItemText=u,exports.SidebarNewTag=p,exports.SidebarV2PopupContainer=g,exports.SimpleSidebarV2Container=l;
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { SimpleSidebarV2Props } from './SidebarV2.model';
3
+ export declare const SimpleSidebarV2: React.FC<SimpleSidebarV2Props>;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),i=require("../../../constants/Theme.js"),a=require("../../button/Button.js"),n=require("../../navigation-hyperlink/NavigationHyperlink.js"),t=require("../../TypographyStyle.js"),r=require("./SidebarV2Styles.js");exports.SimpleSidebarV2=l=>{const{menuList:d,activeMenu:c,theme:o,showAccessUpgradePanel:u=!1,header:p,width:b,zIndex:h,left:j,postion:m,top:v,router:g,onMouseLeaveOnMenu:x,onMouseEnterOnMenu:y,onMenuClick:N,onUpgrade:O,isNewSidebar:k}=l,[S,w]=s.useState(c),M=(s,i)=>e.jsxs("div",Object.assign({className:"sub-child-menu "+((null==S?void 0:S.key)==(null==s?void 0:s.key)?"sub-child-active-menu":""),onClick:()=>{w(s),N(s,!s.page)},"aria-hidden":"true"},{children:[e.jsx("span",{className:(null==S?void 0:S.key)==(null==s?void 0:s.key)&&"brand"==o?"sub-child-active-text":""}),e.jsx(t.BodyCaption,Object.assign({className:"sub-child-text "+((null==S?void 0:S.key)==(null==s?void 0:s.key)&&"white"==o?"active-bold-weight":"")},{children:null==s?void 0:s.displayName})),s.isNew&&e.jsx("div",Object.assign({className:"sub-child-new-tag"},{children:"NEW"}))]}),i);return e.jsx(r.SimpleSidebarV2Container,Object.assign({width:b,zIndex:h,left:j,theme:o,postion:m,top:v,isNewSidebar:k},{children:e.jsxs("div",Object.assign({id:"_sub-menu",className:"sidebar-right-menu transform-class",onMouseLeave:x,onMouseEnter:y},{children:[e.jsx("div",{className:"sidebar-bridge"}),e.jsxs("div",{children:[!k&&e.jsx(t.BodyCaption,Object.assign({className:"sub-child-display-name"},{children:p})),null==d?void 0:d.map(((s,i)=>s.page?e.jsx(n.NavigationHyperlink,Object.assign({href:s.page,router:g},{children:M(s,i)})):M(s,i)))]}),u&&e.jsxs("div",Object.assign({className:"lower-sticky-panel"},{children:[e.jsx(t.TitleSmall,Object.assign({className:"title-text",style:{color:i.COLORS.surface.standard}},{children:"Upgrade plan to access this feature."})),e.jsx(a.Button,{className:"upgrade-button",buttonText:"Upgrade plan",buttonType:"primary",size:"small",inverse:!0,onClick:()=>O?O():""})]}))]}),"_sub-menu")}))};
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const Menus: ({
2
3
  displayName: string;
3
4
  key: number;
@@ -3,6 +3,8 @@ export * from './BikLayout';
3
3
  export * from './BikProfile';
4
4
  export * from './SimpleSidebar';
5
5
  export * from './BikSidebar';
6
+ export * from './BikSidebarV2/BikSidebarV2';
7
+ export * from './BikSidebarV2/SidebarV2.model';
6
8
  export * from './FeatureModal';
7
9
  export * from './SidebarSkeleton';
8
10
  export * from './ShowShopifyRestrictedModal';
@@ -10,7 +10,7 @@ export declare const Button: import("@emotion/styled").StyledComponent<{
10
10
  inverse?: boolean | undefined;
11
11
  disabled?: boolean | undefined;
12
12
  matchParentWidth?: boolean | undefined;
13
- version?: "1.0" | "2.0" | undefined;
13
+ version?: "1.0" | "2.0" | "3.0" | undefined;
14
14
  darkMode?: boolean | undefined;
15
15
  activated?: boolean | undefined;
16
16
  error?: boolean | undefined;
@@ -66,7 +66,7 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
66
66
  */
67
67
  matchParentWidth?: boolean;
68
68
  subtitle?: string;
69
- version?: '1.0' | '2.0';
69
+ version?: '1.0' | '2.0' | '3.0';
70
70
  darkMode?: boolean;
71
71
  activated?: boolean;
72
72
  error?: boolean;
@@ -8,7 +8,7 @@ export declare const GetButtonTextComponent: (size: Size, type: Type, disabled?:
8
8
  color?: string | undefined;
9
9
  }, never>;
10
10
  export declare const getBorderColor: (type: Type, inverse?: boolean, error?: boolean) => string;
11
- export declare const getBorder: (version: '1.0' | '2.0', type: Type, size: Size, inverse?: boolean, error?: boolean) => string;
11
+ export declare const getBorder: (version: '1.0' | '2.0' | '3.0', type: Type, size: Size, inverse?: boolean, error?: boolean) => string;
12
12
  export declare const getLinearGradientValue: (size: Size) => string;
13
13
  /**
14
14
  * Adjusts the brightness of a given hex color by a specified percentage.
@@ -2,7 +2,7 @@ import { Placement, PositioningStrategy } from '@popperjs/core';
2
2
  import React from 'react';
3
3
  import { CountryCode } from "./CountryCodePicker.modal";
4
4
  export declare const CountryCodePicker: React.FC<{
5
- version: '1.0' | '2.0';
5
+ version: '1.0' | '2.0' | '3.0';
6
6
  onCountrySelect: (country: CountryCode) => void;
7
7
  selectedCountry: CountryCode;
8
8
  popoverWidth?: string;
@@ -8,7 +8,7 @@ export interface CountryPickerProps {
8
8
  /**
9
9
  * Version of the dropdown popover to use
10
10
  */
11
- version: '1.0' | '2.0';
11
+ version: '1.0' | '2.0' | '3.0';
12
12
  /**
13
13
  * Callback function when a country is selected
14
14
  */
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),o=require("react"),n=require("../../constants/Theme.js"),i=require("../../assets/icons/chevronDown.svg.js"),l=require("../input/Input.js"),r=require("../input/context/InputStyleProvider.js"),s=require("./ChipInput.js"),a=require("./DropdownPopover/index.js"),d=require("./OpenedDropdown/utils/iterationOnOptions.js");function c(){}const u=u=>{var p,h,v,g,x,{placeHolder:w,size:j,onSelect:O,defaultOptions:f,disabled:b,noErrorHint:S,placeHolderHeight:I,showPlaceholderWhenSelected:m=!1,inputStyle:y={},inputType:C="default",onDeleteChip:H,truncatedText:D,showLeadingIconInPlaceholder:E=!1,showTrailingIconPlaceholder:P=!1,showLabelsOnMoreHover:T=!1,value:q,showSelected:L=!1}=u,M=e.__rest(u,["placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint","placeHolderHeight","showPlaceholderWhenSelected","inputStyle","inputType","onDeleteChip","truncatedText","showLeadingIconInPlaceholder","showTrailingIconPlaceholder","showLabelsOnMoreHover","value","showSelected"]);const[W,_]=o.useState(!1),[R,k]=o.useState(!1),z=null!=j?j:"default",A=o.useRef(),[F,N]=o.useState(null!=f?f:[]);o.useEffect((()=>{var e;const t=[];null===(e=null==M?void 0:M.options)||void 0===e||e.forEach((e=>{e.options?e.options.forEach((e=>{e.selected&&t.push(Object.assign(Object.assign({},e),{label:e.label}))})):e.selected&&t.push(e)})),N([...t])}),[M.options]),o.useEffect((()=>{f&&N([...f])}),[f]);const U=d.getSelectedOptionsAsText(F),V=m?w:null!==(p=null!=U?U:w)&&void 0!==p?p:"Select an option",B=M.buttonWidth,G=null!==(h=null!=B?B:M.width)&&void 0!==h?h:"100%",J=null!==(v=M.dropdownWidth)&&void 0!==v?v:G;return t.jsx(t.Fragment,{children:t.jsx(r.InputStyleContext.Provider,Object.assign({value:{InputWrapper:Object.assign(Object.assign(Object.assign({height:I||("x-small"===z?24:"small"===z?32:48),width:G},B?{maxWidth:B}:{}),{zIndex:1,cursor:"pointer",padding:"x-small"===z?"4px 8px":"6px 8px",backgroundColor:L&&void 0!==q?n.COLORS.background.positive.light:R?"#E0E0E0":"#ffffff",transition:"background-color 0.3s ease"}),y),input:{minHeight:"100%",maxWidth:"100%",color:L&&void 0!==q?n.COLORS.content.positive:"inherit"}}},{children:t.jsx("div",Object.assign({onMouseEnter:()=>k(!0),onMouseLeave:()=>k(!1),style:M.width?{width:M.width}:void 0},{children:t.jsxs(a.DropdownPopover,Object.assign({"data-test":M["data-test"],ref:A,onSelect:function(e){Array.isArray(e)?N([...e]):N([e]),null==O||O(e)},disabled:b,onDropdownVisbilityChange:e=>_(e)},M,{width:J},{children:["default"==C&&t.jsx(l.Input,{version:M.version,noErrorHint:S,state:b?"disabled":"none",value:void 0===q?V:q,errorMessage:M.error,variant:z,placeholder:null!=w?w:"Select an option",onChangeText:c,leftIcon:E&&(null===(g=F[0])||void 0===g?void 0:g.leadingIcon)?{icon:()=>{var e;return t.jsx(t.Fragment,{children:null===(e=F[0])||void 0===e?void 0:e.leadingIcon})}}:void 0,rightIcon:{icon:()=>{var e;return t.jsxs("div",Object.assign({style:{display:"flex"}},{children:[P&&(null===(e=F[0])||void 0===e?void 0:e.trailingIcon),t.jsx(i.default,{style:{transform:W?"rotate(180deg)":"rotate(0deg)"},onClick:c,width:"x-small"===z?16:"small"===z?20:24,height:"x-small"===z?16:"small"===z?20:24,color:L?n.COLORS.content.positive:n.COLORS.content.primary})]}))}},truncateText:null==D||D}),"chip"==C&&t.jsx(s.default,{placeholder:null!=w?w:"Select options",chips:F,onDeleteChip:e=>{null==H||H(e)},errorMessage:M.error,isDropdownOpened:W,sizeToUse:z,containerStyle:{width:null!==(x=M.width)&&void 0!==x?x:"100%",cursor:"pointer"},showLabelsOnMoreHover:T})]}))}))}))})};u.displayName="Dropdown",exports.Dropdown=u;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("react"),o=require("../../constants/Theme.js"),i=require("../../assets/icons/chevronDown.svg.js"),r=require("../input/Input.js"),l=require("../input/context/InputStyleProvider.js"),s=require("./ChipInput.js"),a=require("./DropdownPopover/index.js"),d=require("./OpenedDropdown/utils/iterationOnOptions.js");function c(){}const u=u=>{var p,h,v,g,O,{placeHolder:x,size:w,onSelect:j,defaultOptions:S,disabled:b,noErrorHint:f,placeHolderHeight:I,showPlaceholderWhenSelected:m=!1,inputStyle:y={},inputType:C="default",onDeleteChip:L,truncatedText:H,showLeadingIconInPlaceholder:D=!1,showTrailingIconPlaceholder:P=!1,showLabelsOnMoreHover:T=!1,value:q,showSelected:E=!1}=u,R=e.__rest(u,["placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint","placeHolderHeight","showPlaceholderWhenSelected","inputStyle","inputType","onDeleteChip","truncatedText","showLeadingIconInPlaceholder","showTrailingIconPlaceholder","showLabelsOnMoreHover","value","showSelected"]);const[M,W]=n.useState(!1),[_,k]=n.useState(!1),z=null!=w?w:"default",A=n.useRef(),[F,B]=n.useState(null!=S?S:[]);n.useEffect((()=>{var e;const t=[];null===(e=null==R?void 0:R.options)||void 0===e||e.forEach((e=>{e.options?e.options.forEach((e=>{e.selected&&t.push(Object.assign(Object.assign({},e),{label:e.label}))})):e.selected&&t.push(e)})),B([...t])}),[R.options]),n.useEffect((()=>{S&&B([...S])}),[S]);const N=d.getSelectedOptionsAsText(F),U=m?x:null!==(p=null!=N?N:x)&&void 0!==p?p:"Select an option",V=R.buttonWidth,G=null!==(h=null!=V?V:R.width)&&void 0!==h?h:"100%",J=null!==(v=R.dropdownWidth)&&void 0!==v?v:G;return t.jsx(t.Fragment,{children:t.jsx(l.InputStyleContext.Provider,Object.assign({value:{InputWrapper:Object.assign(Object.assign(Object.assign({height:I||("x-small"===z?24:"small"===z?32:48),width:G},V?{maxWidth:V}:{}),{zIndex:1,cursor:"pointer",padding:"x-small"===z?"4px 8px":"6px 8px",backgroundColor:"3.0"===R.version?M||_?o.COLORS.surface.hovered:o.COLORS.surface.standard:E&&void 0!==q?o.BASE_COLORS.positive[100]:_?o.COLORS.background.inactive:o.COLORS.surface.standard,transition:"background-color 0.3s ease"}),y),input:{minHeight:"100%",maxWidth:"100%",color:E&&void 0!==q?o.COLORS.content.positive:"inherit"}}},{children:t.jsx("div",Object.assign({onMouseEnter:()=>k(!0),onMouseLeave:()=>k(!1),style:R.width?{width:R.width}:void 0},{children:t.jsxs(a.DropdownPopover,Object.assign({"data-test":R["data-test"],ref:A,onSelect:function(e){Array.isArray(e)?B([...e]):B([e]),null==j||j(e)},disabled:b,onDropdownVisbilityChange:e=>W(e)},R,{width:J},{children:["default"==C&&t.jsx(r.Input,{version:R.version,noErrorHint:f,state:b?"disabled":"none",value:void 0===q?U:q,errorMessage:R.error,variant:z,placeholder:null!=x?x:"Select an option",onChangeText:c,leftIcon:D&&(null===(g=F[0])||void 0===g?void 0:g.leadingIcon)?{icon:()=>{var e;return t.jsx(t.Fragment,{children:null===(e=F[0])||void 0===e?void 0:e.leadingIcon})}}:void 0,rightIcon:{icon:()=>{var e;return t.jsxs("div",Object.assign({style:{display:"flex"}},{children:[P&&(null===(e=F[0])||void 0===e?void 0:e.trailingIcon),t.jsx(i.default,{style:{transform:M?"rotate(180deg)":"rotate(0deg)"},onClick:c,width:"x-small"===z?16:"small"===z?20:24,height:"x-small"===z?16:"small"===z?20:24,color:E?o.COLORS.content.positive:o.COLORS.content.primary})]}))}},truncateText:null==H||H}),"chip"==C&&t.jsx(s.default,{placeholder:null!=x?x:"Select options",chips:F,onDeleteChip:e=>{null==L||L(e)},errorMessage:R.error,isDropdownOpened:M,sizeToUse:z,containerStyle:{width:null!==(O=R.width)&&void 0!==O?O:"100%",cursor:"pointer"},showLabelsOnMoreHover:T})]}))}))}))})};u.displayName="Dropdown",exports.Dropdown=u;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),o=require("react/jsx-runtime"),t=require("react"),n=require("react-popper"),r=require("../../dropShadow/DropShadow.js"),l=require("../../tooltips/Tooltip.js"),i=require("../Common.styled.js"),s=require("../OpenedDropdown/components/OpennedDropdown.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const d=a(t).default.forwardRef(((a,d)=>{var{children:p,onDropdownVisbilityChange:c,version:u="1.0",tooltipContent:v,tooltipDirection:j,showTooltipArrow:w,isChildLoading:b,forceOpen:g}=a,h=e.__rest(a,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow","isChildLoading","forceOpen"]);const f=d,[O,D]=t.useState(!1),[x,y]=t.useState(null),[S,C]=t.useState(null),m=t.useRef(null),{styles:q,attributes:E}=n.usePopper(x,S,{placement:h.placement,strategy:h.strategy}),R=e=>{var o,t;"2.0"===u&&h.isMultiSelect&&e&&(null===(o=h.onSelect)||void 0===o||o.call(h,[...e])),D(!1),null===(t=null==h?void 0:h.onClose)||void 0===t||t.call(h)};t.useImperativeHandle(f,(()=>({openDropdown:O})),[]),t.useEffect((()=>{(null==f?void 0:f.current)&&(f.current.openDropdown=O)}),[O]),t.useEffect((()=>{null==c||c(O)}),[O]);const _=()=>{var e;return o.jsxs(o.Fragment,{children:[o.jsxs("div",Object.assign({style:{position:"relative"},ref:y},{children:[o.jsx(i.OverLapAbs,Object.assign({ref:m,allowEvents:h.allowEvents,disabled:h.disabled,onClick:e=>{var o;null===(o=h.onDropdownOpen)||void 0===o||o.call(h),O?(D(!1),e.preventDefault()):h.disabled||D(!0)},isChildLoading:b},{children:h.allowEvents?p:null})),h.allowEvents?null:p]})),(O||g)&&o.jsx(i.OpenDropdownContainer,Object.assign({ref:C,style:Object.assign(Object.assign({},q.popper),{zIndex:null!==(e=h.dropdownZIndex)&&void 0!==e?e:3})},E.popper,{"data-test":h["data-test"]},{children:o.jsx(r.DropShadow,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:o.jsx(s.OpenedDropdown,Object.assign({},h,{onSelect:e=>{var o;"2.0"===u&&h.isMultiSelect||(null===(o=h.onSelect)||void 0===o||o.call(h,e),D(!1))},onClose:R,version:u,headerRef:m,zeroState:null==h?void 0:h.zeroState,isDraggable:h.isDraggable,onOptionsReorder:h.onOptionsReorder}))}))}))]})};return o.jsx(o.Fragment,{children:O||g||void 0===v?_():o.jsx(l.Tooltip,Object.assign({body:v,placement:j,hideArrow:!w},{children:o.jsx("div",Object.assign({"data-test":h["data-test"]},{children:_()}))}))})}));d.displayName="DropdownPopover",exports.DropdownPopover=d;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),o=require("react/jsx-runtime"),t=require("react"),r=require("react-popper"),n=require("../../dropShadow/DropShadow.js"),s=require("../../tooltips/Tooltip.js"),i=require("../../../constants/Theme.js"),l=require("../Common.styled.js"),a=require("../OpenedDropdown/components/OpennedDropdown.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const p=d(t).default.forwardRef(((d,p)=>{var{children:c,onDropdownVisbilityChange:u,version:v="1.0",tooltipContent:b,tooltipDirection:j,showTooltipArrow:w,isChildLoading:g,forceOpen:h}=d,O=e.__rest(d,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow","isChildLoading","forceOpen"]);const f=p,[D,x]=t.useState(!1),[S,C]=t.useState(!1),[y,m]=t.useState(null),[q,R]=t.useState(null),E=t.useRef(null),{styles:L,attributes:_}=r.usePopper(y,q,{placement:O.placement,strategy:O.strategy}),M=e=>{var o,t;"2.0"===v&&O.isMultiSelect&&e&&(null===(o=O.onSelect)||void 0===o||o.call(O,[...e])),x(!1),null===(t=null==O?void 0:O.onClose)||void 0===t||t.call(O)};t.useImperativeHandle(f,(()=>({openDropdown:D})),[]),t.useEffect((()=>{(null==f?void 0:f.current)&&(f.current.openDropdown=D)}),[D]),t.useEffect((()=>{null==u||u(D)}),[D]);const T=()=>{var e;return o.jsxs(o.Fragment,{children:[o.jsxs("div",Object.assign({style:Object.assign({position:"relative"},"3.0"===v&&{backgroundColor:D||S?i.COLORS.surface.hovered:i.COLORS.surface.standard,transition:"background-color 0.3s ease",borderRadius:4}),ref:m,onMouseEnter:"3.0"===v?()=>C(!0):void 0,onMouseLeave:"3.0"===v?()=>C(!1):void 0},{children:[o.jsx(l.OverLapAbs,Object.assign({ref:E,allowEvents:O.allowEvents,disabled:O.disabled,onClick:e=>{var o;null===(o=O.onDropdownOpen)||void 0===o||o.call(O),D?(x(!1),e.preventDefault()):O.disabled||x(!0)},isChildLoading:g},{children:O.allowEvents?c:null})),O.allowEvents?null:c]})),(D||h)&&o.jsx(l.OpenDropdownContainer,Object.assign({ref:R,style:Object.assign(Object.assign({},L.popper),{zIndex:null!==(e=O.dropdownZIndex)&&void 0!==e?e:3})},_.popper,{"data-test":O["data-test"]},{children:o.jsx(n.DropShadow,Object.assign({level:"z2",position:"down",style:{borderRadius:"3.0"===v?4:8,boxShadow:"0 2px 8px 0 rgba(0, 0, 0, 0.12)"}},{children:o.jsx(a.OpenedDropdown,Object.assign({},O,{onSelect:e=>{var o;"2.0"===v&&O.isMultiSelect||(null===(o=O.onSelect)||void 0===o||o.call(O,e),x(!1))},onClose:M,version:v,headerRef:E,zeroState:null==O?void 0:O.zeroState,isDraggable:O.isDraggable,onOptionsReorder:O.onOptionsReorder}))}))}))]})};return o.jsx(o.Fragment,{children:D||h||void 0===b?T():o.jsx(s.Tooltip,Object.assign({body:b,placement:j,hideArrow:!w},{children:o.jsx("div",Object.assign({"data-test":O["data-test"]},{children:T()}))}))})}));p.displayName="DropdownPopover",exports.DropdownPopover=p;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../assets/icons/errorInfo.svg.js"),n=require("../../../../assets/icons/refresh-purple.svg.js"),o=require("react"),s=require("../../../zeroState/ZeroState.js"),r=require("../../../../hooks/useOutside.js"),i=require("../../../../constants/Theme.js"),l=require("../../hooks/useDropdown.js"),u=require("./description/Description.js"),c=require("./menu/FreeFormMenu.js"),a=require("./menu/MenuList.js"),d=require("./menu/SelectAllMenu.js"),p=require("./multiSelect/MultiSelectDropdownBottomBar.js"),h=require("./OpennedDropdown.styled.js"),f=require("./searchbox/SearchBox.js"),g=require("./searchbox/SearchZeroState.js");const b=304,S=290;exports.OpenedDropdown=v=>{let{options:j,isSearchable:O,isMultiSelect:x,maxSelections:m,width:w,allowFreeForm:C,height:y,onClose:k,onSelect:L,onSearch:D,version:q,skipSorting:E,headerRef:M,hideSelectAll:R,primaryButtonText:I,onInfiniteScroll:T,onMultiSelectClear:F,onDropdownItemClick:A,buttonOptions:B,isSearchLoading:H,isOptionsLoading:Z,optionsErrorState:z,disableSearchOptions:P,disableSearchedOptionExcept:V,useDefaultCursor:W,containerStyle:$={},zeroState:_,isDraggable:K=!1,onOptionsReorder:N,hideClearButton:U=!1,showCheckboxForCustomElement:G=!1}=v;var J;const Q=o.useCallback((e=>{if(!K||!x)return e;const t=[],n=[];return e.forEach((e=>{if(e.options)n.push(e);else{e.selected?t.push(e):n.push(e)}})),[...t,...n]}),[K,x]),[X,Y]=o.useState((()=>Q(j))),ee=o.useRef(X),te=o.useRef(!1),ne=o.useRef(N);o.useEffect((()=>{Y(Q(j))}),[j,Q]),o.useEffect((()=>{ee.current=X}),[X]),o.useEffect((()=>{ne.current=N}),[N]),o.useEffect((()=>()=>{te.current&&ne.current&&ne.current(ee.current)}),[]);const oe=o.useCallback((e=>{Y(e),"2.0"===q?null==N||N(e):te.current=!0}),[N,q]),se=K?X:j,{dropdownOptions:re,search:ie,searchedString:le,searchedOptions:ue,searchError:ce,retrySearch:ae,onApplyHandler:de,selectAllHandler:pe,onMultiSelectClear:he,onFreeFormSelect:fe,onMultiSelectApply:ge,latestDropdownOptionsRef:be,getSelectedOptions:Se,getCurrentSelectionCount:ve}=l.useDropdown(q,se,L,E||K,x,D,P,V,m),[je,Oe]=o.useState(null!=w?w:S),[xe,me]=o.useState(null),[we,Ce]=o.useState(-1),ye=o.useRef(null),ke=o.useRef([]),Le=o.useRef(null);r.useOutside(ye,(()=>{if(me(null),x&&"2.0"===q){const e=Se(be.current);null==k||k(e)}else null==k||k(re)}),[M,ke]),o.useEffect((()=>{const e=setTimeout((()=>{ye.current&&ye.current.focus({preventScroll:!0})}),0);return()=>clearTimeout(e)}),[]);o.useEffect((()=>{const e=e=>{const t=(e=>{const t=[];return e.forEach((e=>{if(e.options)e.options.forEach((e=>{e.disabled||t.push(e)}));else{const n=e;n.disabled||t.push(n)}})),t})(le&&D?ue:re);if(0!==t.length)if("ArrowDown"===e.key)e.preventDefault(),Ce((e=>{const n=e<t.length-1?e+1:0;return setTimeout((()=>{var e;const t=null===(e=Le.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${n}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),n}));else if("ArrowUp"===e.key)e.preventDefault(),Ce((e=>{const n=e>0?e-1:t.length-1;return setTimeout((()=>{var e;const t=null===(e=Le.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${n}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),n}));else if("Enter"===e.key&&we>=0){e.preventDefault();const n=t[we];n&&(de(Object.assign(Object.assign({},n),{selected:!n.selected})),A&&A(n))}},t=ye.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}}),[we,le,ue,re,D,de,A]);const De=null!=y?y:b,qe="number"==typeof De?O&&x?De-96:O&&!x||!O&&x?De-48:De:De;o.useEffect((()=>{const e=null!=w?w:S;if(null===xe)Oe(e);else if("number"==typeof e)Oe(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));Oe(t)}}),[xe]);const Ee=[],Me=(e=>{if(!x||!m&&0!==m)return e;const t=ve(re)>=m;return t?e.map((e=>{if(e.options)return Object.assign(Object.assign({},e),{options:e.options.map((e=>Object.assign(Object.assign({},e),{disabled:e.disabled||!e.selected&&t})))});{const n=e;return Object.assign(Object.assign({},n),{disabled:n.disabled||!n.selected&&t})}})):e})((le&&D?ue:re).map((e=>{var t,n;if(le&&!D){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(le.toLowerCase()))&&(Ee.push(!le||e.label===le),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(le.toLowerCase()))||(null===(n=e.searchKey)||void 0===n?void 0:n.toLowerCase().includes(le.toLowerCase()))?(Ee.push(!le||e.label===le),e):null}return e})).filter((e=>null!==e))),Re=!!O&&le&&0===Me.length,Ie=!le&&!!Z,Te=!le&&!!z&&!Ie,Fe=!(le||Me.length||Ie||Te),Ae=Ie||Te||Fe,Be=(null==_?void 0:_.title)||"No results found",He=(null==_?void 0:_.subTitle)||"Please try again later or contact us at support@bik.ai if you require further assistance.",Ze=(null==z?void 0:z.title)||"Failed to load options",ze=(null==z?void 0:z.subTitle)||"Something went wrong while fetching the list. Please try again",Pe={buttonText:"Try again",buttonType:"text",size:"small",buttonTextColor:i.COLORS.background.inverseLight,customIconColor:i.COLORS.background.inverseLight,LeadingIcon:n.default},Ve=Object.assign({IconHolderStyle:{background:i.COLORS.background.negative.light},Icon:e.jsx(t.default,{color:i.COLORS.content.negative,width:24,height:24})},z);Ve.actionButton=Object.assign(Object.assign({},Pe),null!==(J=null==z?void 0:z.actionButton)&&void 0!==J?J:{});const We=Ie?void 0:Te?Ve:_;return e.jsxs(h.OpennedDropdownContainer,Object.assign({version:q,ref:ye,tabIndex:-1,style:Object.assign(Object.assign({width:je},$),{outline:"none"})},{children:[e.jsxs("div",Object.assign({style:{width:xe?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!O&&e.jsx(f.SearchBox,{onSearch:ie,version:q}),Ae?e.jsx("div",Object.assign({style:{height:De,display:"flex",background:i.COLORS.background.base}},{children:e.jsx(s.ZeroState,Object.assign({},null!=We?We:{},{isLoading:Ie,title:Te?Ze:Be,subTitle:Te?ze:He}))})):e.jsxs(h.MenuListContainer,Object.assign({minHeight:De,maxHeight:qe,ref:Le},{children:[!!x&&!Re&&!R&&e.jsx(d.SelectAllMenu,{version:q,options:le&&D?ue:re,onSelect:pe}),!C&&Re&&e.jsx(g.SearchZeroState,{isLoading:H,errorMessage:ce,onRetry:ae,height:qe,searchedString:le,containerWidth:w}),C&&(Re||!!Ee.length&&Ee.every((e=>!1===e)))&&e.jsx(c.FreeFormMenu,{version:q,isMultiSelect:x,onSelect:fe,searchedString:le}),e.jsx(a.MenuList,{onInfiniteScroll:T,onDropdownItemClick:A,version:q,onSelect:de,showDescription:function(e,t){me(e&&t?{title:e,description:t}:null)},isMultiSelect:x,options:Me,useDefaultCursor:W,ref:ke,focusedIndex:we,isDraggable:K,onOptionsReorder:oe,showCheckboxForCustomElement:G})]})),!!x&&!Ae&&"2.0"!==q&&e.jsx(p.default,{onClear:()=>{he(),null==F||F()},onApply:ge,list:le&&D?ue:re,buttonText:I,buttonOptions:B,hideClearButton:U})]})),!!xe&&e.jsx(u.Description,{title:xe.title,description:xe.description,version:q})]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../assets/icons/errorInfo.svg.js"),n=require("../../../../assets/icons/refresh-purple.svg.js"),o=require("react"),s=require("../../../zeroState/ZeroState.js"),r=require("../../../../hooks/useOutside.js"),i=require("../../../../constants/Theme.js"),l=require("../../hooks/useDropdown.js"),u=require("./description/Description.js"),c=require("./menu/FreeFormMenu.js"),a=require("./menu/MenuList.js"),d=require("./menu/SelectAllMenu.js"),p=require("./multiSelect/MultiSelectDropdownBottomBar.js"),h=require("./OpennedDropdown.styled.js"),f=require("./searchbox/SearchBox.js"),g=require("./searchbox/SearchZeroState.js");const b=304,S=290;exports.OpenedDropdown=v=>{let{options:j,isSearchable:O,isMultiSelect:x,maxSelections:m,width:w,allowFreeForm:C,height:y,onClose:k,onSelect:L,onSearch:D,version:q,skipSorting:E,headerRef:M,hideSelectAll:R,primaryButtonText:I,onInfiniteScroll:T,onMultiSelectClear:F,onDropdownItemClick:A,buttonOptions:B,isSearchLoading:H,isOptionsLoading:Z,optionsErrorState:z,disableSearchOptions:P,disableSearchedOptionExcept:V,useDefaultCursor:W,containerStyle:$={},zeroState:_,isDraggable:K=!1,onOptionsReorder:N,hideClearButton:U=!1,showCheckboxForCustomElement:G=!1}=v;var J;const Q=o.useCallback((e=>{if(!K||!x)return e;const t=[],n=[];return e.forEach((e=>{if(e.options)n.push(e);else{e.selected?t.push(e):n.push(e)}})),[...t,...n]}),[K,x]),[X,Y]=o.useState((()=>Q(j))),ee=o.useRef(X),te=o.useRef(!1),ne=o.useRef(N);o.useEffect((()=>{Y(Q(j))}),[j,Q]),o.useEffect((()=>{ee.current=X}),[X]),o.useEffect((()=>{ne.current=N}),[N]),o.useEffect((()=>()=>{te.current&&ne.current&&ne.current(ee.current)}),[]);const oe=o.useCallback((e=>{Y(e),"2.0"===q?null==N||N(e):te.current=!0}),[N,q]),se=K?X:j,{dropdownOptions:re,search:ie,searchedString:le,searchedOptions:ue,searchError:ce,retrySearch:ae,onApplyHandler:de,selectAllHandler:pe,onMultiSelectClear:he,onFreeFormSelect:fe,onMultiSelectApply:ge,latestDropdownOptionsRef:be,getSelectedOptions:Se,getCurrentSelectionCount:ve}=l.useDropdown(q,se,L,E||K,x,D,P,V,m),[je,Oe]=o.useState(null!=w?w:S),[xe,me]=o.useState(null),[we,Ce]=o.useState(-1),ye=o.useRef(null),ke=o.useRef([]),Le=o.useRef(null);r.useOutside(ye,(()=>{if(me(null),x&&"2.0"===q){const e=Se(be.current);null==k||k(e)}else null==k||k(re)}),[M,ke]),o.useEffect((()=>{const e=setTimeout((()=>{ye.current&&ye.current.focus({preventScroll:!0})}),0);return()=>clearTimeout(e)}),[]);o.useEffect((()=>{const e=e=>{const t=(e=>{const t=[];return e.forEach((e=>{if(e.options)e.options.forEach((e=>{e.disabled||t.push(e)}));else{const n=e;n.disabled||t.push(n)}})),t})(le&&D?ue:re);if(0!==t.length)if("ArrowDown"===e.key)e.preventDefault(),Ce((e=>{const n=e<t.length-1?e+1:0;return setTimeout((()=>{var e;const t=null===(e=Le.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${n}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),n}));else if("ArrowUp"===e.key)e.preventDefault(),Ce((e=>{const n=e>0?e-1:t.length-1;return setTimeout((()=>{var e;const t=null===(e=Le.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${n}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),n}));else if("Enter"===e.key&&we>=0){e.preventDefault();const n=t[we];n&&(de(Object.assign(Object.assign({},n),{selected:!n.selected})),A&&A(n))}},t=ye.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}}),[we,le,ue,re,D,de,A]);const De=null!=y?y:b,qe="number"==typeof De?O&&x?De-96:O&&!x||!O&&x?De-48:De:De;o.useEffect((()=>{const e=null!=w?w:S;if(null===xe)Oe(e);else if("number"==typeof e)Oe(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));Oe(t)}}),[xe]);const Ee=[],Me=(e=>{if(!x||!m&&0!==m)return e;const t=ve(re)>=m;return t?e.map((e=>{if(e.options)return Object.assign(Object.assign({},e),{options:e.options.map((e=>Object.assign(Object.assign({},e),{disabled:e.disabled||!e.selected&&t})))});{const n=e;return Object.assign(Object.assign({},n),{disabled:n.disabled||!n.selected&&t})}})):e})((le&&D?ue:re).map((e=>{var t,n;if(le&&!D){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(le.toLowerCase()))&&(Ee.push(!le||e.label===le),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(le.toLowerCase()))||(null===(n=e.searchKey)||void 0===n?void 0:n.toLowerCase().includes(le.toLowerCase()))?(Ee.push(!le||e.label===le),e):null}return e})).filter((e=>null!==e))),Re=!!O&&le&&0===Me.length,Ie=!le&&!!Z,Te=!le&&!!z&&!Ie,Fe=!(le||Me.length||Ie||Te),Ae=Ie||Te||Fe,Be=(null==_?void 0:_.title)||"No results found",He=(null==_?void 0:_.subTitle)||"Please try again later or contact us at support@bik.ai if you require further assistance.",Ze=(null==z?void 0:z.title)||"Failed to load options",ze=(null==z?void 0:z.subTitle)||"Something went wrong while fetching the list. Please try again",Pe={buttonText:"Try again",buttonType:"text",size:"small",buttonTextColor:i.COLORS.background.inverseLight,customIconColor:i.COLORS.background.inverseLight,LeadingIcon:n.default},Ve=Object.assign({IconHolderStyle:{background:i.COLORS.background.negative.light},Icon:e.jsx(t.default,{color:i.COLORS.content.negative,width:24,height:24})},z);Ve.actionButton=Object.assign(Object.assign({},Pe),null!==(J=null==z?void 0:z.actionButton)&&void 0!==J?J:{});const We=Ie?void 0:Te?Ve:_;return e.jsxs(h.OpennedDropdownContainer,Object.assign({version:q,ref:ye,tabIndex:-1,style:Object.assign(Object.assign({width:je},$),{outline:"none"})},{children:[e.jsxs("div",Object.assign({style:{width:xe?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!O&&e.jsx(f.SearchBox,{onSearch:ie,version:q}),Ae?e.jsx("div",Object.assign({style:{height:De,display:"flex",background:i.COLORS.background.base}},{children:e.jsx(s.ZeroState,Object.assign({},null!=We?We:{},{isLoading:Ie,title:Te?Ze:Be,subTitle:Te?ze:He}))})):e.jsxs(h.MenuListContainer,Object.assign({minHeight:De,maxHeight:qe,ref:Le},{children:[!!x&&!Re&&!R&&e.jsx(d.SelectAllMenu,{version:q,options:le&&D?ue:re,onSelect:pe}),!C&&Re&&e.jsx(g.SearchZeroState,{isLoading:H,errorMessage:ce,onRetry:ae,height:qe,searchedString:le,containerWidth:w,version:q}),C&&(Re||!!Ee.length&&Ee.every((e=>!1===e)))&&e.jsx(c.FreeFormMenu,{version:q,isMultiSelect:x,onSelect:fe,searchedString:le}),e.jsx(a.MenuList,{onInfiniteScroll:T,onDropdownItemClick:A,version:q,onSelect:de,showDescription:function(e,t){me(e&&t?{title:e,description:t}:null)},isMultiSelect:x,options:Me,useDefaultCursor:W,ref:ke,focusedIndex:we,isDraggable:K,onOptionsReorder:oe,showCheckboxForCustomElement:G})]})),!!x&&!Ae&&"2.0"!==q&&e.jsx(p.default,{onClear:()=>{he(),null==F||F()},onApply:ge,list:le&&D?ue:re,buttonText:I,buttonOptions:B,hideClearButton:U})]})),!!xe&&e.jsx(u.Description,{title:xe.title,description:xe.description,version:q})]}))};
@@ -1,5 +1,5 @@
1
1
  export declare const OpennedDropdownContainer: import("styled-components").StyledComponent<"div", any, {
2
- version?: "1.0" | "2.0" | undefined;
2
+ version?: "1.0" | "2.0" | "3.0" | undefined;
3
3
  }, never>;
4
4
  export declare const ItemContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
5
5
  export declare const MenuListContainer: import("styled-components").StyledComponent<"div", any, {
@@ -1,21 +1,22 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../../../../constants/Theme.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=o(e);const i=t.default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),o=require("../../../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=r(e);const i=t.default.div`
2
2
  border-radius: ${e=>"2.0"===e.version?8:4}px;
3
- border: ${e=>"2.0"===e.version?0:1}px solid
4
- ${r.COLORS.stroke.primary};
3
+ border: ${e=>"2.0"===e.version||"3.0"===e.version?0:1}px
4
+ solid ${o.COLORS.stroke.primary};
5
+ box-shadow: ${e=>"3.0"===e.version?"0px 2px 8px 0px rgba(0, 0, 0, 0.12)":"none"};
5
6
  max-height: 480px;
6
7
  overflow: hidden;
7
8
  display: flex;
8
9
  flex-direction: row;
9
10
  position: relative;
10
11
  padding: ${e=>"2.0"===e.version?4:0}px;
11
- background-color: ${r.COLORS.surface.standard};
12
+ background-color: ${o.COLORS.surface.standard};
12
13
  `;t.default.div`
13
14
  padding: 14px 16px 14px 18px;
14
15
  flex-direction: row;
15
16
  align-items: center;
16
17
  border-bottom-width: 1px;
17
18
  border-bottom-style: solid;
18
- border-bottom-color: ${r.COLORS.stroke.primary};
19
+ border-bottom-color: ${o.COLORS.stroke.primary};
19
20
  width: 100%;
20
21
  height: 100%;
21
22
  `;const d=t.default.div`
@@ -2,5 +2,5 @@ import React from 'react';
2
2
  export declare const Description: React.FC<{
3
3
  title: string;
4
4
  description: string;
5
- version?: '1.0' | '2.0';
5
+ version?: '1.0' | '2.0' | '3.0';
6
6
  }>;
@@ -1,3 +1,3 @@
1
1
  export declare const DescriptionContainer: import("styled-components").StyledComponent<"div", any, {
2
- version?: "1.0" | "2.0" | undefined;
2
+ version?: "1.0" | "2.0" | "3.0" | undefined;
3
3
  }, never>;
@@ -3,5 +3,5 @@ export declare const FreeFormMenu: React.FC<{
3
3
  isMultiSelect?: boolean;
4
4
  searchedString: string;
5
5
  onSelect: (isChecked: boolean) => void;
6
- version?: '1.0' | '2.0';
6
+ version?: '1.0' | '2.0' | '3.0';
7
7
  }>;
@@ -7,7 +7,7 @@ interface MenuItemProps {
7
7
  onSelect: (option: SingleOption) => void;
8
8
  onDropdownItemClick?: (option: SingleOption) => void;
9
9
  last?: boolean;
10
- version?: '1.0' | '2.0';
10
+ version?: '1.0' | '2.0' | '3.0';
11
11
  useDefaultCursor?: boolean;
12
12
  isFocused?: boolean;
13
13
  dataIndex?: number;
@@ -1,8 +1,8 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../../assets/icons/chevronRight.svg.js"),n=require("react"),r=require("styled-components"),o=require("../../../../checkBox/CheckBox.js"),i=require("../../../../list-item/ListItem.js"),s=require("../../../../tooltips/Tooltip.js"),a=require("../../../../TypographyStyle.js"),l=require("../../../../../constants/Theme.js"),d=require("./FreeFormMenu.styled.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=c(r);const g=u.default(i.ListItem)`
2
- padding: ${e=>"2.0"===e.version?"8px 12px":"14px 16px"} !important;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../../assets/icons/chevronRight.svg.js"),n=require("react"),r=require("styled-components"),o=require("../../../../checkBox/CheckBox.js"),i=require("../../../../list-item/ListItem.js"),s=require("../../../../tooltips/Tooltip.js"),a=require("../../../../TypographyStyle.js"),l=require("../../../../../constants/Theme.js"),d=require("./FreeFormMenu.styled.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=c(r);const p=u.default(i.ListItem)`
2
+ padding: ${e=>"3.0"===e.version?"8px":"2.0"===e.version?"8px 12px":"14px 16px"} !important;
3
3
  cursor: pointer;
4
4
  margin-top: ${e=>"2.0"===e.version?"2px":"0"};
5
- `,p=u.default.div`
5
+ `,g=u.default.div`
6
6
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12);
7
7
  border-radius: ${e=>{let{version:t}=e;return"1.0"===t?"0":"8px"}};
8
8
  padding: ${e=>{let{version:t}=e;return"1.0"===t?"0":"4px"}};
@@ -28,16 +28,16 @@
28
28
  border-radius: 50%;
29
29
  background-color: ${l.COLORS.content.inactive};
30
30
  flex-shrink: 0;
31
- `,j=u.default.div`
31
+ `,v=u.default.div`
32
32
  display: flex;
33
33
  align-content: center;
34
34
  justify-content: center;
35
35
  gap: 8px;
36
- `,m=u.default.div`
36
+ `,j=u.default.div`
37
37
  margin-right: -4px;
38
- `,v=u.default.div`
38
+ `,m=u.default.div`
39
39
  display: flex;
40
40
  align-items: center;
41
41
  flex-direction: column;
42
42
  flex: 1;
43
- `,b=t=>{let{onDragStart:n,onDragEnd:r}=t;return e.jsxs(x,Object.assign({draggable:!0,onDragStart:n,onDragEnd:r},{children:[e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{})]}))},f=n.forwardRef(((r,i)=>{let{option:c,isMultiSelect:u,showDescription:x,onSelect:h,last:f,version:D,onDropdownItemClick:C,useDefaultCursor:O,isFocused:y=!1,dataIndex:I=-1,isDraggable:F=!1,onDragStart:E,onDragOver:S,onDrop:T,onDragEnd:k,isDraggedOver:L=!1,showCheckboxForCustomElement:w=!1}=r;var M,q;const[$,A]=n.useState(c.selected),B=(e,t)=>{if(!e.children){R(!e.selected);const n=t?Object.assign(Object.assign({},e),{parent:t}):e;null==C||C(n)}},R=e=>{c.disabled||h(Object.assign(Object.assign({},c),{selected:e}))},U=O?{cursor:"default"}:{};return e.jsx(e.Fragment,{children:e.jsx(s.Tooltip,Object.assign({body:"",tooltipContent:c.children?e.jsx("div",Object.assign({style:{backgroundColor:l.DEFAULT_THEME.colorsV2.surface.standard},ref:i,onMouseEnter:()=>A(!0),onMouseLeave:()=>A(!1)},{children:e.jsx(p,Object.assign({version:null!=D?D:"2.0"},{children:c.children.map((t=>{var n;return e.jsx(g,{version:D,style:"1.0"!==D&&(null!==(n=null==c?void 0:c.children)&&void 0!==n?n:[]).length-1?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),B(t,c)},listItem:{value:t.value,label:t.label},subText:t.subText,leadingIcon:t.leadingIcon||void 0,customComponent:t.customComponent,trailingIcon:t.trailingIcon||void 0,variant:c.disabled?"inactive":t.selected?"selected":"default"},t.value)}))}))})):e.jsx(e.Fragment,{}),placement:"right-start",hideArrow:!0},{children:e.jsx(g,{version:D,style:f?Object.assign(Object.assign({borderBottom:0},U),L?{borderTop:`2px solid ${l.COLORS.content.brand}`,opacity:.5}:{}):Object.assign(Object.assign({},U),L?{borderTop:`2px solid ${l.COLORS.content.brand}`,opacity:.5}:{}),onClick:e=>{e.preventDefault(),B(c)},onMouseOver:()=>{c.description?x(c.label,c.description):x()},listItem:{value:c.value,label:c.label},subText:c.subText,"data-option-index":I,role:"option",id:`dropdown-option-${I}`,"aria-selected":!!c.selected,onDragOver:F?S:void 0,onDrop:F?T:void 0,leadingIcon:!u||w&&c.customComponent?F?e.jsxs(v,{children:[e.jsx(b,{onDragStart:E,onDragEnd:k}),c.leadingIcon&&e.jsx("div",{children:c.leadingIcon})]}):c.leadingIcon?e.jsx(e.Fragment,{children:c.leadingIcon}):void 0:e.jsxs(j,{children:[F&&e.jsx(b,{onDragStart:E,onDragEnd:k}),e.jsx(o.CheckBox,{size:"2.0"===D?"SMALL":"DEFAULT",isDisabled:null!==(M=c.disabled)&&void 0!==M&&M,isChecked:!!c.selected,onValueChange:R}),e.jsx(m,{children:c.leadingIcon})]}),customComponent:u&&w&&c.customComponent?e.jsxs(j,{children:[F&&e.jsx(b,{onDragStart:E,onDragEnd:k}),e.jsx(o.CheckBox,{size:"2.0"===D?"SMALL":"DEFAULT",isDisabled:null!==(q=c.disabled)&&void 0!==q&&q,isChecked:!!c.selected,onValueChange:R}),c.customComponent]}):c.customComponent,trailingIcon:c.isFreeForm?e.jsx(d.FreeFormContainer,{children:e.jsx(a.BodyCaption,Object.assign({style:{color:l.COLORS.content.secondary}},{children:"Freeform"}))}):c.children?e.jsx(t.default,{width:12,height:12}):c.trailingIcon?e.jsx(e.Fragment,{children:c.trailingIcon}):void 0,variant:c.disabled?"inactive":y||c.selected||!u&&$?"selected":"default"})}))})}));exports.MenuItem=f;
43
+ `,b=t=>{let{onDragStart:n,onDragEnd:r}=t;return e.jsxs(x,Object.assign({draggable:!0,onDragStart:n,onDragEnd:r},{children:[e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{})]}))},f=n.forwardRef(((r,i)=>{let{option:c,isMultiSelect:u,showDescription:x,onSelect:h,last:f,version:D,onDropdownItemClick:C,useDefaultCursor:O,isFocused:y=!1,dataIndex:I=-1,isDraggable:F=!1,onDragStart:E,onDragOver:S,onDrop:T,onDragEnd:k,isDraggedOver:L=!1,showCheckboxForCustomElement:w=!1}=r;var M,q;const[$,A]=n.useState(c.selected),B=(e,t)=>{if(!e.children){R(!e.selected);const n=t?Object.assign(Object.assign({},e),{parent:t}):e;null==C||C(n)}},R=e=>{c.disabled||h(Object.assign(Object.assign({},c),{selected:e}))},U=O?{cursor:"default"}:{};return e.jsx(e.Fragment,{children:e.jsx(s.Tooltip,Object.assign({body:"",tooltipContent:c.children?e.jsx("div",Object.assign({style:{backgroundColor:l.DEFAULT_THEME.colorsV2.surface.standard},ref:i,onMouseEnter:()=>A(!0),onMouseLeave:()=>A(!1)},{children:e.jsx(g,Object.assign({version:null!=D?D:"2.0"},{children:c.children.map((t=>{var n;return e.jsx(p,{version:D,style:"1.0"!==D&&(null!==(n=null==c?void 0:c.children)&&void 0!==n?n:[]).length-1?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),B(t,c)},listItem:{value:t.value,label:t.label},subText:t.subText,leadingIcon:t.leadingIcon||void 0,customComponent:t.customComponent,trailingIcon:t.trailingIcon||void 0,variant:c.disabled?"inactive":t.selected?"selected":"default"},t.value)}))}))})):e.jsx(e.Fragment,{}),placement:"right-start",hideArrow:!0},{children:e.jsx(p,{version:D,style:f?Object.assign(Object.assign({borderBottom:0},U),L?{borderTop:`2px solid ${l.COLORS.content.brand}`,opacity:.5}:{}):Object.assign(Object.assign({},U),L?{borderTop:`2px solid ${l.COLORS.content.brand}`,opacity:.5}:{}),onClick:e=>{e.preventDefault(),B(c)},onMouseOver:()=>{c.description?x(c.label,c.description):x()},listItem:{value:c.value,label:c.label},subText:c.subText,"data-option-index":I,role:"option",id:`dropdown-option-${I}`,"aria-selected":!!c.selected,onDragOver:F?S:void 0,onDrop:F?T:void 0,leadingIcon:!u||w&&c.customComponent?F?e.jsxs(m,{children:[e.jsx(b,{onDragStart:E,onDragEnd:k}),c.leadingIcon&&e.jsx("div",{children:c.leadingIcon})]}):c.leadingIcon?e.jsx(e.Fragment,{children:c.leadingIcon}):void 0:e.jsxs(v,{children:[F&&e.jsx(b,{onDragStart:E,onDragEnd:k}),e.jsx(o.CheckBox,{size:"2.0"===D?"SMALL":"DEFAULT",isDisabled:null!==(M=c.disabled)&&void 0!==M&&M,isChecked:!!c.selected,onValueChange:R}),e.jsx(j,{children:c.leadingIcon})]}),customComponent:u&&w&&c.customComponent?e.jsxs(v,{children:[F&&e.jsx(b,{onDragStart:E,onDragEnd:k}),e.jsx(o.CheckBox,{size:"2.0"===D?"SMALL":"DEFAULT",isDisabled:null!==(q=c.disabled)&&void 0!==q&&q,isChecked:!!c.selected,onValueChange:R}),c.customComponent]}):c.customComponent,trailingIcon:c.isFreeForm?e.jsx(d.FreeFormContainer,{children:e.jsx(a.BodyCaption,Object.assign({style:{color:l.COLORS.content.secondary}},{children:"Freeform"}))}):c.children?e.jsx(t.default,{width:12,height:12}):c.trailingIcon?e.jsx(e.Fragment,{children:c.trailingIcon}):void 0,variant:c.disabled?"inactive":y||c.selected||!u&&$?"selected":"default"})}))})}));exports.MenuItem=f;
@@ -5,7 +5,7 @@ interface MenuListProps {
5
5
  isMultiSelect?: boolean;
6
6
  showDescription: (title?: string, description?: string) => void;
7
7
  onSelect: (optionSelect: SingleOption) => void;
8
- version?: '1.0' | '2.0';
8
+ version?: '1.0' | '2.0' | '3.0';
9
9
  onInfiniteScroll?: () => void;
10
10
  onDropdownItemClick?: (option: DropdownOption) => void;
11
11
  useDefaultCursor?: boolean;
@@ -2,5 +2,5 @@ export declare const StyledGroupedLabel: import("styled-components").StyledCompo
2
2
  numberOfLines?: number | undefined;
3
3
  color?: string | undefined;
4
4
  } & {
5
- version?: "1.0" | "2.0" | undefined;
5
+ version?: "1.0" | "2.0" | "3.0" | undefined;
6
6
  }, never>;
@@ -4,5 +4,5 @@ export type SelectAllCheckboxState = 'notSelected' | 'selectAll' | 'partiallySel
4
4
  export declare const SelectAllMenu: React.FC<{
5
5
  options: DropdownOption[];
6
6
  onSelect: (newState: SelectAllCheckboxState) => void;
7
- version?: '1.0' | '2.0';
7
+ version?: '1.0' | '2.0' | '3.0';
8
8
  }>;
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  export declare const SearchBox: React.FC<{
3
3
  onSearch: (searchString: string) => void;
4
- version?: '1.0' | '2.0';
4
+ version?: '1.0' | '2.0' | '3.0';
5
5
  }>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../../../icon-button/IconButton.js"),n=require("../../../../input/Input.js"),o=require("../../../../input/context/InputStyleProvider.js"),s=require("../../../../../constants/Theme.js"),i=require("../../../../../assets/icons/cross.svg.js"),c=require("../../../../../assets/icons/search.svg.js");exports.SearchBox=a=>{let{onSearch:u,version:l}=a;const[p,d]=t.useState(""),[h,x]=t.useState(!1);return e.jsx(o.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===l?.5:1}px solid ${s.COLORS.stroke.primary}`,padding:""+("2.0"===l?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:e.jsx(n.Input,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===l?"small":"default",leftIcon:{icon:()=>e.jsx(c.default,{width:"2.0"===l?18:24,height:"2.0"===l?18:24,color:s.COLORS.content.placeholder})},rightIcon:{icon:()=>p?e.jsx(r.IconButton,{onClick:()=>{x(!0),u(""),d("")},Icon:i.default,width:"2.0"===l?18:24,height:"2.0"===l?18:24,iconColor:s.COLORS.content.placeholder}):e.jsx(e.Fragment,{})},reset:h,onChangeText:e=>{x(!1),d(e),u(e)}})}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../../../icon-button/IconButton.js"),n=require("../../../../input/Input.js"),o=require("../../../../input/context/InputStyleProvider.js"),s=require("../../../../../constants/Theme.js"),i=require("../../../../../assets/icons/cross.svg.js"),c=require("../../../../../assets/icons/search.svg.js");exports.SearchBox=a=>{let{onSearch:u,version:l}=a;const[p,d]=t.useState(""),[h,x]=t.useState(!1);return e.jsx(o.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===l||"3.0"===l?.5:1}px solid ${s.COLORS.stroke.primary}`,padding:""+("2.0"===l||"3.0"===l?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:e.jsx(n.Input,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===l||"3.0"===l?"small":"default",leftIcon:{icon:()=>e.jsx(c.default,{width:"2.0"===l||"3.0"===l?18:24,height:"2.0"===l||"3.0"===l?18:24,color:s.COLORS.content.placeholder})},rightIcon:{icon:()=>p?e.jsx(r.IconButton,{onClick:()=>{x(!0),u(""),d("")},Icon:i.default,width:"2.0"===l||"3.0"===l?18:24,height:"2.0"===l||"3.0"===l?18:24,iconColor:s.COLORS.content.placeholder}):e.jsx(e.Fragment,{})},reset:h,onChangeText:e=>{x(!1),d(e),u(e)}})}))};
@@ -6,4 +6,5 @@ export declare const SearchZeroState: React.FC<{
6
6
  containerWidth?: string;
7
7
  errorMessage?: string;
8
8
  onRetry?: () => void;
9
+ version?: '1.0' | '2.0' | '3.0';
9
10
  }>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../zeroState/ZeroState.js");exports.SearchZeroState=r=>{let{searchedString:o,height:i,isLoading:n,containerWidth:s,errorMessage:a,onRetry:l}=r;const d=!!a&&!n;return e.jsx("div",Object.assign({style:{height:i,display:"flex",alignItems:"center"}},{children:e.jsx(t.ZeroState,{isLoading:n,title:d?"Failed to load options":"No results found",subTitle:d?a:`Sorry we could not find any results for "${null!=o?o:""}"`,actionButton:d?{buttonText:"Try again",buttonType:"text",onClick:l}:void 0,containerWidth:s})}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../zeroState/ZeroState.js"),n=require("../../../../../constants/Theme.js");exports.SearchZeroState=i=>{let{searchedString:r,height:o,isLoading:s,containerWidth:a,errorMessage:l,onRetry:c,version:d}=i;const u=!!l&&!s;return"3.0"!==d||u||s?e.jsx("div",Object.assign({style:{height:o,display:"flex",alignItems:"center"}},{children:e.jsx(t.ZeroState,{isLoading:s,title:u?"Failed to load options":"No results found",subTitle:u?l:`Sorry we could not find any results for "${null!=r?r:""}"`,actionButton:u?{buttonText:"Try again",buttonType:"text",onClick:c}:void 0,containerWidth:a})})):e.jsx("div",Object.assign({style:{height:o,display:"flex",alignItems:"center",justifyContent:"center"}},{children:e.jsx("span",Object.assign({style:{fontFamily:"Inter",fontSize:"12px",fontWeight:400,lineHeight:"16px",color:n.COLORS.content.placeholder,whiteSpace:"nowrap"}},{children:"No results found!"}))}))};