@bikdotai/bik-component-library 0.0.769 → 0.0.770-beta.1

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 (123) hide show
  1. package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
  2. package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  3. package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
  4. package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  5. package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
  6. package/dist/cjs/components/TablePagination/TablePaginationCard.d.ts +1 -1
  7. package/dist/cjs/components/WhatsAppTextEditor/CustomEditor.styled.d.ts +3 -3
  8. package/dist/cjs/components/WhatsAppTextEditor/WhatsAppTextEditorHeader.d.ts +1 -1
  9. package/dist/cjs/components/analytics-card/AnalyticsCard.styled.d.ts +2 -2
  10. package/dist/cjs/components/analytics-chips-and-dropdowns/CommonStyles.d.ts +5 -5
  11. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.styled.d.ts +3 -3
  12. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapStyled.d.ts +8 -8
  13. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.d.ts +1 -1
  14. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.d.ts +5 -5
  15. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/scoreBlock/ScoreBlock.styled.d.ts +5 -5
  16. package/dist/cjs/components/banner/Banner.styled.d.ts +20 -20
  17. package/dist/cjs/components/bik-layout/CommonStyles.d.ts +17 -17
  18. package/dist/cjs/components/bik-layout/MockMenus.d.ts +1 -0
  19. package/dist/cjs/components/button/Button.styled.d.ts +1 -1
  20. package/dist/cjs/components/card-selection-modal/CardSelectionModal.styled.d.ts +2 -2
  21. package/dist/cjs/components/carousel-secondary/CarouselSecondary.style.d.ts +6 -6
  22. package/dist/cjs/components/checkList/CheckList.styled.d.ts +1 -1
  23. package/dist/cjs/components/colourInput/ColourInput.styled.d.ts +2 -2
  24. package/dist/cjs/components/country-code-picker/CountryCodePicker.styled.d.ts +2 -2
  25. package/dist/cjs/components/country-code-picker/CountryPicker.styled.d.ts +2 -2
  26. package/dist/cjs/components/custom-date-time/CustomDateTime.styled.d.ts +1 -1
  27. package/dist/cjs/components/dashboard-review-popup/DashboardReviewPopUp.styled.d.ts +2 -2
  28. package/dist/cjs/components/dashboard-review-popup/components/FiveStar.styled.d.ts +2 -2
  29. package/dist/cjs/components/dashboard-review-popup/components/Form.styled.d.ts +6 -6
  30. package/dist/cjs/components/datePicker/DatePicker.styled.d.ts +4 -4
  31. package/dist/cjs/components/discount-modal/DiscountModal.styled.d.ts +5 -5
  32. package/dist/cjs/components/dropdown/Dropdown.d.ts +3 -0
  33. package/dist/cjs/components/dropdown/Dropdown.js +1 -1
  34. package/dist/cjs/components/dropdown/DropdownPopover/index.js +1 -1
  35. package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
  36. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts +6 -0
  37. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuItem.js +34 -4
  38. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.d.ts +2 -0
  39. package/dist/cjs/components/dropdown/OpenedDropdown/components/menu/MenuList.js +1 -1
  40. package/dist/cjs/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.d.ts +1 -0
  41. package/dist/cjs/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.js +1 -1
  42. package/dist/cjs/components/dropdown/hooks/useDropdown.js +1 -1
  43. package/dist/cjs/components/dropdown/type.d.ts +8 -0
  44. package/dist/cjs/components/input/Input.styled.d.ts +4 -4
  45. package/dist/cjs/components/keywords-input/KeywordsInput.styled.d.ts +1 -1
  46. package/dist/cjs/components/list-item/ListItem.styled.d.ts +1 -1
  47. package/dist/cjs/components/modals/modal.styled.d.ts +4 -4
  48. package/dist/cjs/components/pagination/Pagination.styled.d.ts +1 -1
  49. package/dist/cjs/components/plans/DurationSelectorStyles.d.ts +1 -1
  50. package/dist/cjs/components/plans/SubscriptionPlanSelector.d.ts +2 -2
  51. package/dist/cjs/components/plans/SubscriptionPlanStyled.d.ts +2 -2
  52. package/dist/cjs/components/product-picker/ProductPicker.styled.d.ts +2 -2
  53. package/dist/cjs/components/progress-bar/ProgressBarComponent.d.ts +1 -1
  54. package/dist/cjs/components/radioList/RadioList.styled.d.ts +1 -1
  55. package/dist/cjs/components/sample-button/SampleButton.styled.d.ts +1 -1
  56. package/dist/cjs/components/shimmer/ShimmerComponent/ShimmerStyled.d.ts +2 -2
  57. package/dist/cjs/components/switch/Switch.d.ts +3 -3
  58. package/dist/cjs/components/tabs/Tabs.styles.d.ts +5 -5
  59. package/dist/cjs/components/tag/Tag.styled.d.ts +1 -1
  60. package/dist/cjs/components/testimonial-card/TestimonialCard.style.d.ts +9 -9
  61. package/dist/cjs/components/toaster/Toaster.styled.d.ts +1 -1
  62. package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
  63. package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  64. package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
  65. package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  66. package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
  67. package/dist/esm/components/TablePagination/TablePaginationCard.d.ts +1 -1
  68. package/dist/esm/components/WhatsAppTextEditor/CustomEditor.styled.d.ts +3 -3
  69. package/dist/esm/components/WhatsAppTextEditor/WhatsAppTextEditorHeader.d.ts +1 -1
  70. package/dist/esm/components/analytics-card/AnalyticsCard.styled.d.ts +2 -2
  71. package/dist/esm/components/analytics-chips-and-dropdowns/CommonStyles.d.ts +5 -5
  72. package/dist/esm/components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.styled.d.ts +3 -3
  73. package/dist/esm/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapStyled.d.ts +8 -8
  74. package/dist/esm/components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.d.ts +1 -1
  75. package/dist/esm/components/analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.d.ts +5 -5
  76. package/dist/esm/components/analytics-chips-and-dropdowns/chart/scoreBlock/ScoreBlock.styled.d.ts +5 -5
  77. package/dist/esm/components/banner/Banner.styled.d.ts +20 -20
  78. package/dist/esm/components/bik-layout/CommonStyles.d.ts +17 -17
  79. package/dist/esm/components/bik-layout/MockMenus.d.ts +1 -0
  80. package/dist/esm/components/button/Button.styled.d.ts +1 -1
  81. package/dist/esm/components/card-selection-modal/CardSelectionModal.styled.d.ts +2 -2
  82. package/dist/esm/components/carousel-secondary/CarouselSecondary.style.d.ts +6 -6
  83. package/dist/esm/components/checkList/CheckList.styled.d.ts +1 -1
  84. package/dist/esm/components/colourInput/ColourInput.styled.d.ts +2 -2
  85. package/dist/esm/components/country-code-picker/CountryCodePicker.styled.d.ts +2 -2
  86. package/dist/esm/components/country-code-picker/CountryPicker.styled.d.ts +2 -2
  87. package/dist/esm/components/custom-date-time/CustomDateTime.styled.d.ts +1 -1
  88. package/dist/esm/components/dashboard-review-popup/DashboardReviewPopUp.styled.d.ts +2 -2
  89. package/dist/esm/components/dashboard-review-popup/components/FiveStar.styled.d.ts +2 -2
  90. package/dist/esm/components/dashboard-review-popup/components/Form.styled.d.ts +6 -6
  91. package/dist/esm/components/datePicker/DatePicker.styled.d.ts +4 -4
  92. package/dist/esm/components/discount-modal/DiscountModal.styled.d.ts +5 -5
  93. package/dist/esm/components/dropdown/Dropdown.d.ts +3 -0
  94. package/dist/esm/components/dropdown/Dropdown.js +1 -1
  95. package/dist/esm/components/dropdown/DropdownPopover/index.js +1 -1
  96. package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
  97. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts +6 -0
  98. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.js +36 -6
  99. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.d.ts +2 -0
  100. package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.js +1 -1
  101. package/dist/esm/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.d.ts +1 -0
  102. package/dist/esm/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.js +1 -1
  103. package/dist/esm/components/dropdown/hooks/useDropdown.js +1 -1
  104. package/dist/esm/components/dropdown/type.d.ts +8 -0
  105. package/dist/esm/components/input/Input.styled.d.ts +4 -4
  106. package/dist/esm/components/keywords-input/KeywordsInput.styled.d.ts +1 -1
  107. package/dist/esm/components/list-item/ListItem.styled.d.ts +1 -1
  108. package/dist/esm/components/modals/modal.styled.d.ts +4 -4
  109. package/dist/esm/components/pagination/Pagination.styled.d.ts +1 -1
  110. package/dist/esm/components/plans/DurationSelectorStyles.d.ts +1 -1
  111. package/dist/esm/components/plans/SubscriptionPlanSelector.d.ts +2 -2
  112. package/dist/esm/components/plans/SubscriptionPlanStyled.d.ts +2 -2
  113. package/dist/esm/components/product-picker/ProductPicker.styled.d.ts +2 -2
  114. package/dist/esm/components/progress-bar/ProgressBarComponent.d.ts +1 -1
  115. package/dist/esm/components/radioList/RadioList.styled.d.ts +1 -1
  116. package/dist/esm/components/sample-button/SampleButton.styled.d.ts +1 -1
  117. package/dist/esm/components/shimmer/ShimmerComponent/ShimmerStyled.d.ts +2 -2
  118. package/dist/esm/components/switch/Switch.d.ts +3 -3
  119. package/dist/esm/components/tabs/Tabs.styles.d.ts +5 -5
  120. package/dist/esm/components/tag/Tag.styled.d.ts +1 -1
  121. package/dist/esm/components/testimonial-card/TestimonialCard.style.d.ts +9 -9
  122. package/dist/esm/components/toaster/Toaster.styled.d.ts +1 -1
  123. package/package.json +1 -1
@@ -1,43 +1,43 @@
1
1
  /// <reference types="react" />
2
2
  export declare const GlobalContainer: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
6
6
  export declare const LoaderWrapper: import("@emotion/styled").StyledComponent<{
7
7
  theme?: import("@emotion/react").Theme | undefined;
8
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
8
+ as?: import("react").ElementType<any> | undefined;
9
9
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
10
10
  export declare const LoadingMessageWrapper: import("@emotion/styled").StyledComponent<{
11
11
  theme?: import("@emotion/react").Theme | undefined;
12
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
12
+ as?: import("react").ElementType<any> | undefined;
13
13
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
14
14
  export declare const BikLayoutContainer: import("@emotion/styled").StyledComponent<{
15
15
  theme?: import("@emotion/react").Theme | undefined;
16
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
16
+ as?: import("react").ElementType<any> | undefined;
17
17
  } & {
18
18
  type?: "overflow-within" | "overflow-body" | undefined;
19
19
  backgroundColor?: string | undefined;
20
20
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
21
21
  export declare const BikHeaderWrapper: import("@emotion/styled").StyledComponent<{
22
22
  theme?: import("@emotion/react").Theme | undefined;
23
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
23
+ as?: import("react").ElementType<any> | undefined;
24
24
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
25
25
  export declare const BikHeaderContainer: import("@emotion/styled").StyledComponent<{
26
26
  theme?: import("@emotion/react").Theme | undefined;
27
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
27
+ as?: import("react").ElementType<any> | undefined;
28
28
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
29
29
  export declare const MenuInnerContainer: import("@emotion/styled").StyledComponent<{
30
30
  theme?: import("@emotion/react").Theme | undefined;
31
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
31
+ as?: import("react").ElementType<any> | undefined;
32
32
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
33
- export declare const ProfileDropdownToggleContainer: import("@emotion/styled").StyledComponent<import("react-bootstrap/esm/helpers").Omit<any, import("react-bootstrap/esm/helpers").BsPrefixProps<import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements>> & import("react-bootstrap/esm/DropdownToggle").DropdownToggleProps> & import("react-bootstrap/esm/helpers").BsPrefixProps<import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements>> & import("react-bootstrap/esm/DropdownToggle").DropdownToggleProps & {
33
+ export declare const ProfileDropdownToggleContainer: import("@emotion/styled").StyledComponent<import("react-bootstrap/esm/helpers").Omit<any, import("react-bootstrap/esm/helpers").BsPrefixProps<import("react").ElementType<any>> & import("react-bootstrap/esm/DropdownToggle").DropdownToggleProps> & import("react-bootstrap/esm/helpers").BsPrefixProps<import("react").ElementType<any>> & import("react-bootstrap/esm/DropdownToggle").DropdownToggleProps & {
34
34
  children?: import("react").ReactNode;
35
35
  } & {
36
36
  theme?: import("@emotion/react").Theme | undefined;
37
37
  }, {}, {}>;
38
38
  export declare const ProfileDropdownInnerContainer: import("@emotion/styled").StyledComponent<{
39
39
  theme?: import("@emotion/react").Theme | undefined;
40
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
40
+ as?: import("react").ElementType<any> | undefined;
41
41
  } & {
42
42
  isDropdownOpen: boolean;
43
43
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -55,24 +55,24 @@ export declare const UserNameTitleSmall: import("@emotion/styled").StyledCompone
55
55
  }, {}, {}>;
56
56
  export declare const UserAvatarContainer: import("@emotion/styled").StyledComponent<{
57
57
  theme?: import("@emotion/react").Theme | undefined;
58
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
58
+ as?: import("react").ElementType<any> | undefined;
59
59
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
60
60
  export declare const StyledTooltip: import("@emotion/styled").StyledComponent<import("react-bootstrap").TooltipProps & import("react").RefAttributes<HTMLDivElement> & {
61
61
  theme?: import("@emotion/react").Theme | undefined;
62
62
  }, {}, {}>;
63
63
  export declare const UserInfoContainer: import("@emotion/styled").StyledComponent<{
64
64
  theme?: import("@emotion/react").Theme | undefined;
65
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
65
+ as?: import("react").ElementType<any> | undefined;
66
66
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
67
67
  export declare const StatusContainer: import("@emotion/styled").StyledComponent<{
68
68
  theme?: import("@emotion/react").Theme | undefined;
69
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
69
+ as?: import("react").ElementType<any> | undefined;
70
70
  } & {
71
71
  isAvailable: boolean;
72
72
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
73
73
  export declare const UserStatusContainer: import("@emotion/styled").StyledComponent<{
74
74
  theme?: import("@emotion/react").Theme | undefined;
75
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
75
+ as?: import("react").ElementType<any> | undefined;
76
76
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
77
77
  export declare const StyledBodyCaption: import("@emotion/styled").StyledComponent<{
78
78
  [x: string]: any;
@@ -90,7 +90,7 @@ export declare const StyledBodyCaption: import("@emotion/styled").StyledComponen
90
90
  }, {}, {}>;
91
91
  export declare const FeatureModalContainer: import("@emotion/styled").StyledComponent<{
92
92
  theme?: import("@emotion/react").Theme | undefined;
93
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
93
+ as?: import("react").ElementType<any> | undefined;
94
94
  } & {
95
95
  zIndex?: number | undefined;
96
96
  resetHeight?: boolean | undefined;
@@ -98,13 +98,13 @@ export declare const FeatureModalContainer: import("@emotion/styled").StyledComp
98
98
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
99
99
  export declare const InnerModalContainer: import("@emotion/styled").StyledComponent<{
100
100
  theme?: import("@emotion/react").Theme | undefined;
101
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
101
+ as?: import("react").ElementType<any> | undefined;
102
102
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
103
103
  export declare const RelativeModalContainer: import("@emotion/styled").StyledComponent<{
104
104
  theme?: import("@emotion/react").Theme | undefined;
105
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
105
+ as?: import("react").ElementType<any> | undefined;
106
106
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
107
107
  export declare const FeatureModalV2Container: import("@emotion/styled").StyledComponent<{
108
108
  theme?: import("@emotion/react").Theme | undefined;
109
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
109
+ as?: import("react").ElementType<any> | undefined;
110
110
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const Menus: ({
2
3
  displayName: string;
3
4
  key: number;
@@ -2,7 +2,7 @@
2
2
  import { Size, Type } from './model';
3
3
  export declare const Button: import("@emotion/styled").StyledComponent<{
4
4
  theme?: import("@emotion/react").Theme | undefined;
5
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
5
+ as?: import("react").ElementType<any> | undefined;
6
6
  } & {
7
7
  size: Size;
8
8
  buttonType: Type;
@@ -1,9 +1,9 @@
1
1
  /// <reference types="react" />
2
2
  export declare const StyledCardContainer: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
6
6
  export declare const StyledCard: import("@emotion/styled").StyledComponent<{
7
7
  theme?: import("@emotion/react").Theme | undefined;
8
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
8
+ as?: import("react").ElementType<any> | undefined;
9
9
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -2,35 +2,35 @@
2
2
  import { CarouselVersion } from './model';
3
3
  export declare const CarouselContainer: import("@emotion/styled").StyledComponent<{
4
4
  theme?: import("@emotion/react").Theme | undefined;
5
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
5
+ as?: import("react").ElementType<any> | undefined;
6
6
  } & {
7
7
  version?: CarouselVersion | undefined;
8
8
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
9
9
  export declare const CarouselBody: import("@emotion/styled").StyledComponent<{
10
10
  theme?: import("@emotion/react").Theme | undefined;
11
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
11
+ as?: import("react").ElementType<any> | undefined;
12
12
  } & {
13
13
  textAlign: string | undefined;
14
14
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
15
15
  export declare const CarouselPage: import("@emotion/styled").StyledComponent<{
16
16
  theme?: import("@emotion/react").Theme | undefined;
17
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
17
+ as?: import("react").ElementType<any> | undefined;
18
18
  } & {
19
19
  isActive: boolean;
20
20
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
21
21
  export declare const CarouselFooter: import("@emotion/styled").StyledComponent<{
22
22
  theme?: import("@emotion/react").Theme | undefined;
23
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
23
+ as?: import("react").ElementType<any> | undefined;
24
24
  } & {
25
25
  version?: CarouselVersion | undefined;
26
26
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
27
27
  export declare const PageIndicator: import("@emotion/styled").StyledComponent<{
28
28
  theme?: import("@emotion/react").Theme | undefined;
29
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
29
+ as?: import("react").ElementType<any> | undefined;
30
30
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
31
31
  export declare const Indicator: import("@emotion/styled").StyledComponent<{
32
32
  theme?: import("@emotion/react").Theme | undefined;
33
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
33
+ as?: import("react").ElementType<any> | undefined;
34
34
  } & {
35
35
  isActive: boolean;
36
36
  version?: CarouselVersion | undefined;
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  export declare const CheckListStyled: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -1,9 +1,9 @@
1
1
  /// <reference types="react" />
2
2
  export declare const ColorInputContainer: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
6
6
  export declare const StyledColorInput: import("@emotion/styled").StyledComponent<{
7
7
  theme?: import("@emotion/react").Theme | undefined;
8
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
8
+ as?: import("react").ElementType<any> | undefined;
9
9
  }, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;
@@ -1,11 +1,11 @@
1
1
  /// <reference types="react" />
2
2
  export declare const StyledCountryPickerOption: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
6
6
  export declare const StyledCountryPickerWrapper: import("@emotion/styled").StyledComponent<{
7
7
  theme?: import("@emotion/react").Theme | undefined;
8
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
8
+ as?: import("react").ElementType<any> | undefined;
9
9
  } & {
10
10
  height?: string | undefined;
11
11
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -1,11 +1,11 @@
1
1
  /// <reference types="react" />
2
2
  export declare const StyledCountryOption: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
6
6
  export declare const StyledCountryPickerContainer: import("@emotion/styled").StyledComponent<{
7
7
  theme?: import("@emotion/react").Theme | undefined;
8
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
8
+ as?: import("react").ElementType<any> | undefined;
9
9
  } & {
10
10
  height?: string | undefined;
11
11
  disabled?: boolean | undefined;
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  export declare const CustomDateTimeStyle: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -1,9 +1,9 @@
1
1
  /// <reference types="react" />
2
2
  export declare const Container: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
6
6
  export declare const CrossIconHolder: import("@emotion/styled").StyledComponent<{
7
7
  theme?: import("@emotion/react").Theme | undefined;
8
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
8
+ as?: import("react").ElementType<any> | undefined;
9
9
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -1,9 +1,9 @@
1
1
  /// <reference types="react" />
2
2
  export declare const Container: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
6
6
  export declare const Button: import("@emotion/styled").StyledComponent<{
7
7
  theme?: import("@emotion/react").Theme | undefined;
8
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
8
+ as?: import("react").ElementType<any> | undefined;
9
9
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -1,27 +1,27 @@
1
1
  /// <reference types="react" />
2
2
  export declare const Container: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
6
6
  export declare const StarWrapper: import("@emotion/styled").StyledComponent<{
7
7
  theme?: import("@emotion/react").Theme | undefined;
8
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
8
+ as?: import("react").ElementType<any> | undefined;
9
9
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
10
10
  export declare const Chip: import("@emotion/styled").StyledComponent<{
11
11
  theme?: import("@emotion/react").Theme | undefined;
12
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
12
+ as?: import("react").ElementType<any> | undefined;
13
13
  } & {
14
14
  selected?: boolean | undefined;
15
15
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
16
16
  export declare const Wrapper: import("@emotion/styled").StyledComponent<{
17
17
  theme?: import("@emotion/react").Theme | undefined;
18
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
18
+ as?: import("react").ElementType<any> | undefined;
19
19
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
20
20
  export declare const TextArea: import("@emotion/styled").StyledComponent<{
21
21
  theme?: import("@emotion/react").Theme | undefined;
22
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
22
+ as?: import("react").ElementType<any> | undefined;
23
23
  }, import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, {}>;
24
24
  export declare const Button: import("@emotion/styled").StyledComponent<{
25
25
  theme?: import("@emotion/react").Theme | undefined;
26
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
26
+ as?: import("react").ElementType<any> | undefined;
27
27
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -1,19 +1,19 @@
1
1
  /// <reference types="react" />
2
2
  export declare const PickerContainer: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  } & {
6
6
  selectRange: boolean;
7
7
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
8
8
  export declare const TimePickerContainer: import("@emotion/styled").StyledComponent<{
9
9
  theme?: import("@emotion/react").Theme | undefined;
10
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
10
+ as?: import("react").ElementType<any> | undefined;
11
11
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
12
12
  export declare const TimeInputWrapper: import("@emotion/styled").StyledComponent<{
13
13
  theme?: import("@emotion/react").Theme | undefined;
14
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
14
+ as?: import("react").ElementType<any> | undefined;
15
15
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
16
16
  export declare const TimeLabel: import("@emotion/styled").StyledComponent<{
17
17
  theme?: import("@emotion/react").Theme | undefined;
18
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
18
+ as?: import("react").ElementType<any> | undefined;
19
19
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -1,23 +1,23 @@
1
1
  /// <reference types="react" />
2
2
  export declare const CouponTypeContainerStyled: import("@emotion/styled").StyledComponent<{
3
3
  theme?: import("@emotion/react").Theme | undefined;
4
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
4
+ as?: import("react").ElementType<any> | undefined;
5
5
  } & {
6
6
  selectedDiv: number;
7
7
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
8
8
  export declare const StaticCouponContainerStyled: import("@emotion/styled").StyledComponent<{
9
9
  theme?: import("@emotion/react").Theme | undefined;
10
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
10
+ as?: import("react").ElementType<any> | undefined;
11
11
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
12
12
  export declare const DynamicCouponContainer: import("@emotion/styled").StyledComponent<{
13
13
  theme?: import("@emotion/react").Theme | undefined;
14
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
14
+ as?: import("react").ElementType<any> | undefined;
15
15
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
16
16
  export declare const StyledDiscountDialogueContainer: import("@emotion/styled").StyledComponent<{
17
17
  theme?: import("@emotion/react").Theme | undefined;
18
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
18
+ as?: import("react").ElementType<any> | undefined;
19
19
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
20
20
  export declare const VariablePickerContainer: import("@emotion/styled").StyledComponent<{
21
21
  theme?: import("@emotion/react").Theme | undefined;
22
- as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
22
+ as?: import("react").ElementType<any> | undefined;
23
23
  }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
@@ -17,5 +17,8 @@ export type DropdownProps = OpenDropdownProps & {
17
17
  showTrailingIconPlaceholder?: boolean;
18
18
  showLabelsOnMoreHover?: boolean;
19
19
  backgroundColor?: string;
20
+ value?: string;
21
+ /** When true, resizes the input box to fit the selected text. Defaults to false for backward compatibility. */
22
+ autoResize?: boolean;
20
23
  };
21
24
  export declare const Dropdown: React.FC<DropdownProps>;
@@ -1 +1 @@
1
- import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as o,jsxs as n,Fragment as t}from"react/jsx-runtime";import{useState as l,useRef as r,useEffect as i}from"react";import{COLORS as s}from"../../constants/Theme.js";import a from"../../assets/icons/chevronDown.svg.js";import{Input as d}from"../input/Input.js";import{InputStyleContext as c}from"../input/context/InputStyleProvider.js";import p from"./ChipInput.js";import{DropdownPopover as h}from"./DropdownPopover/index.js";import{getSelectedOptionsAsText as u}from"./OpenedDropdown/utils/iterationOnOptions.js";function m(){}const v=v=>{var g,f,w,b,x,{placeHolder:I,size:j,onSelect:O,defaultOptions:y,disabled:H,noErrorHint:S,placeHolderHeight:T,showPlaceholderWhenSelected:D=!1,inputStyle:P={},inputType:C="default",onDeleteChip:E,truncatedText:L,showLeadingIconInPlaceholder:M=!1,showTrailingIconPlaceholder:z=!1,showLabelsOnMoreHover:W=!1}=v,A=e(v,["placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint","placeHolderHeight","showPlaceholderWhenSelected","inputStyle","inputType","onDeleteChip","truncatedText","showLeadingIconInPlaceholder","showTrailingIconPlaceholder","showLabelsOnMoreHover"]);const[_,k]=l(!1),N=null!=j?j:"default",U=r(),[V,q]=l(null!=y?y:[]);i((()=>{var e;const o=[];null===(e=null==A?void 0:A.options)||void 0===e||e.forEach((e=>{e.options?e.options.forEach((e=>{e.selected&&o.push(Object.assign(Object.assign({},e),{label:e.label}))})):e.selected&&o.push(e)})),q([...o])}),[A.options]),i((()=>{y&&q([...y])}),[y]);const B=u(V);return o(c.Provider,Object.assign({value:{InputWrapper:Object.assign({height:T||("x-small"===N?24:"small"===N?32:48),width:null!==(f=null!==(g=A.buttonWidth)&&void 0!==g?g:A.width)&&void 0!==f?f:"100%",zIndex:1,cursor:"pointer",padding:"x-small"===N?"4px 8px":"6px 8px"},P),input:{minHeight:"100%"}}},{children:n(h,Object.assign({"data-test":A["data-test"],ref:U,onSelect:function(e){Array.isArray(e)?q([...e]):q([e]),null==O||O(e)},disabled:H,onDropdownVisbilityChange:e=>k(e)},A,{children:["default"==C&&o(d,{version:A.version,noErrorHint:S,state:H?"disabled":"none",value:D?I:null!=B?B:"",errorMessage:A.error,variant:N,placeholder:null!=I?I:"Select an option",width:null!==(w=A.width)&&void 0!==w?w:"100%",onChangeText:m,leftIcon:M&&(null===(b=V[0])||void 0===b?void 0:b.leadingIcon)?{icon:()=>{var e;return o(t,{children:null===(e=V[0])||void 0===e?void 0:e.leadingIcon})}}:void 0,rightIcon:{icon:()=>{var e;return n("div",Object.assign({style:{display:"flex"}},{children:[z&&(null===(e=V[0])||void 0===e?void 0:e.trailingIcon),o(a,{style:{transform:_?"rotate(180deg)":"rotate(0deg)"},onClick:m,width:"x-small"===N?16:"small"===N?20:24,height:"x-small"===N?16:"small"===N?20:24,color:s.content.primary})]}))}},truncateText:null==L||L}),"chip"==C&&o(p,{placeholder:null!=I?I:"Select options",chips:V,onDeleteChip:e=>{null==E||E(e)},errorMessage:A.error,isDropdownOpened:_,sizeToUse:N,containerStyle:{width:null!==(x=A.width)&&void 0!==x?x:"100%",cursor:"pointer"},showLabelsOnMoreHover:W})]}))}))};v.displayName="Dropdown";export{v as Dropdown};
1
+ import{__rest as e}from"../../_virtual/_tslib.js";import{jsxs as o,Fragment as n,jsx as l}from"react/jsx-runtime";import{useState as t,useRef as i,useEffect as r}from"react";import{COLORS as s}from"../../constants/Theme.js";import a from"../../assets/icons/chevronDown.svg.js";import{Input as d}from"../input/Input.js";import{InputStyleContext as c}from"../input/context/InputStyleProvider.js";import p from"./ChipInput.js";import{DropdownPopover as u}from"./DropdownPopover/index.js";import{getSelectedOptionsAsText as h}from"./OpenedDropdown/utils/iterationOnOptions.js";function m(){}const v=v=>{var f,g,x,b,w,{placeHolder:j,size:y,onSelect:I,defaultOptions:O,disabled:S,noErrorHint:H,placeHolderHeight:E,showPlaceholderWhenSelected:C=!1,inputStyle:T={},inputType:D="default",onDeleteChip:P,truncatedText:M,showLeadingIconInPlaceholder:W=!1,showTrailingIconPlaceholder:z=!1,showLabelsOnMoreHover:L=!1,value:k,autoResize:A=!1}=v,R=e(v,["placeHolder","size","onSelect","defaultOptions","disabled","noErrorHint","placeHolderHeight","showPlaceholderWhenSelected","inputStyle","inputType","onDeleteChip","truncatedText","showLeadingIconInPlaceholder","showTrailingIconPlaceholder","showLabelsOnMoreHover","value","autoResize"]);const[_,F]=t(!1),[N,U]=t(!1),V=null!=y?y:"default",$=i(),[q,B]=t(null!=O?O:[]),G=i(null),[J,K]=t(null);r((()=>{var e;const o=[];null===(e=null==R?void 0:R.options)||void 0===e||e.forEach((e=>{e.options?e.options.forEach((e=>{e.selected&&o.push(Object.assign(Object.assign({},e),{label:e.label}))})):e.selected&&o.push(e)})),B([...o])}),[R.options]),r((()=>{O&&B([...O])}),[O]);const Q=h(q),X=C?j:null!==(f=null!=Q?Q:j)&&void 0!==f?f:"Select an option";r((()=>{if(A&&G.current){const e=G.current.scrollWidth,o="x-small"===V?60:"small"===V?80:100,n=e+("x-small"===V?16:"small"===V?20:24)+2*("x-small"===V?16:12)+8+2;K(Math.max(n,o))}}),[X,V,A]);const Y=null!==(x=null!==(g=R.buttonWidth)&&void 0!==g?g:R.inputWidth)&&void 0!==x?x:"100%",Z=A&&J?`${J}px`:Y;return o(n,{children:[l("span",Object.assign({ref:G,style:{position:"absolute",visibility:"hidden",whiteSpace:"nowrap",fontSize:"x-small"===V?"12px":"small"===V?"14px":"16px",fontFamily:"Inter"}},{children:X})),l(c.Provider,Object.assign({value:{InputWrapper:Object.assign({height:E||("x-small"===V?24:"small"===V?32:48),width:Z,maxWidth:Y,zIndex:1,cursor:"pointer",padding:"x-small"===V?"4px 8px":"6px 8px",backgroundColor:void 0!==k?"#C3E4C4":N?"#E0E0E0":"#ffffff",transition:"background-color 0.3s ease"},T),input:{minHeight:"100%",maxWidth:"100%",color:void 0!==k?"#00580E":"inherit"}}},{children:l("div",Object.assign({onMouseEnter:()=>U(!0),onMouseLeave:()=>U(!1)},{children:o(u,Object.assign({"data-test":R["data-test"],ref:$,onSelect:function(e){Array.isArray(e)?B([...e]):B([e]),null==I||I(e)},disabled:S,onDropdownVisbilityChange:e=>F(e)},R,{children:["default"==D&&l(d,{version:R.version,noErrorHint:H,state:S?"disabled":"none",value:void 0===k?X:k,errorMessage:R.error,variant:V,placeholder:null!=j?j:"Select an option",onChangeText:m,leftIcon:W&&(null===(b=q[0])||void 0===b?void 0:b.leadingIcon)?{icon:()=>{var e;return l(n,{children:null===(e=q[0])||void 0===e?void 0:e.leadingIcon})}}:void 0,rightIcon:{icon:()=>{var e;return o("div",Object.assign({style:{display:"flex"}},{children:[z&&(null===(e=q[0])||void 0===e?void 0:e.trailingIcon),l(a,{style:{transform:_?"rotate(180deg)":"rotate(0deg)"},onClick:m,width:"x-small"===V?16:"small"===V?20:24,height:"x-small"===V?16:"small"===V?20:24,color:s.content.primary})]}))}},truncateText:null==M||M}),"chip"==D&&l(p,{placeholder:null!=j?j:"Select options",chips:q,onDeleteChip:e=>{null==P||P(e)},errorMessage:R.error,isDropdownOpened:_,sizeToUse:V,containerStyle:{width:null!==(w=R.width)&&void 0!==w?w:"100%",cursor:"pointer"},showLabelsOnMoreHover:L})]}))}))}))]})};v.displayName="Dropdown";export{v as Dropdown};
@@ -1 +1 @@
1
- import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as t,jsxs as l}from"react/jsx-runtime";import n,{useState as i,useRef as r,useImperativeHandle as s,useEffect as d}from"react";import{usePopper as a}from"react-popper";import{DropShadow as p}from"../../dropShadow/DropShadow.js";import{Tooltip as c}from"../../tooltips/Tooltip.js";import{OverLapAbs as v,OpenDropdownContainer as m}from"../Common.styled.js";import{OpenedDropdown as u}from"../OpenedDropdown/components/OpennedDropdown.js";const h=n.forwardRef(((n,h)=>{var{children:w,onDropdownVisbilityChange:b,version:f="1.0",tooltipContent:g,tooltipDirection:j,showTooltipArrow:O,isChildLoading:D,forceOpen:y}=n,C=o(n,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow","isChildLoading","forceOpen"]);const S=h,[z,E]=i(!1),[x,A]=i(null),[L,R]=i(null),T=r(null),{styles:M,attributes:V}=a(x,L,{placement:C.placement,strategy:C.strategy}),_=o=>{var e,t;"2.0"===f&&C.isMultiSelect&&o&&(null===(e=C.onSelect)||void 0===e||e.call(C,[...o])),E(!1),null===(t=null==C?void 0:C.onClose)||void 0===t||t.call(C)};s(S,(()=>({openDropdown:z})),[]),d((()=>{(null==S?void 0:S.current)&&(S.current.openDropdown=z)}),[z]),d((()=>{null==b||b(z)}),[z]);const k=()=>l(t,{children:[l("div",Object.assign({style:{position:"relative"},ref:A},{children:[e(v,Object.assign({ref:T,allowEvents:C.allowEvents,disabled:C.disabled,onClick:o=>{var e;null===(e=C.onDropdownOpen)||void 0===e||e.call(C),z?(E(!1),o.preventDefault()):C.disabled||E(!0)},isChildLoading:D},{children:C.allowEvents?w:null})),C.allowEvents?null:w]})),(z||y)&&e(m,Object.assign({ref:R,style:Object.assign(Object.assign({},M.popper),{zIndex:3})},V.popper,{"data-test":C["data-test"]},{children:e(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(u,Object.assign({},C,{onSelect:o=>{var e;"2.0"===f&&C.isMultiSelect||(null===(e=C.onSelect)||void 0===e||e.call(C,o),E(!1))},onClose:_,version:f,headerRef:T,zeroState:null==C?void 0:C.zeroState}))}))}))]});return e(t,{children:z||y||void 0===g?k():e(c,Object.assign({body:g,placement:j,hideArrow:!O},{children:e("div",Object.assign({"data-test":C["data-test"]},{children:k()}))}))})}));h.displayName="DropdownPopover";export{h as DropdownPopover};
1
+ import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import l,{useState as r,useRef as i,useImperativeHandle as s,useEffect as d}from"react";import{usePopper as a}from"react-popper";import{DropShadow as p}from"../../dropShadow/DropShadow.js";import{Tooltip as c}from"../../tooltips/Tooltip.js";import{OverLapAbs as v,OpenDropdownContainer as u}from"../Common.styled.js";import{OpenedDropdown as m}from"../OpenedDropdown/components/OpennedDropdown.js";const w=l.forwardRef(((l,w)=>{var{children:h,onDropdownVisbilityChange:b,version:g="1.0",tooltipContent:f,tooltipDirection:O,showTooltipArrow:j,isChildLoading:D,forceOpen:y}=l,C=o(l,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow","isChildLoading","forceOpen"]);const S=w,[R,x]=r(!1),[z,E]=r(null),[A,L]=r(null),T=i(null),{styles:I,attributes:M}=a(z,A,{placement:C.placement,strategy:C.strategy}),V=o=>{var e,t;"2.0"===g&&C.isMultiSelect&&o&&(null===(e=C.onSelect)||void 0===e||e.call(C,[...o])),x(!1),null===(t=null==C?void 0:C.onClose)||void 0===t||t.call(C)};s(S,(()=>({openDropdown:R})),[]),d((()=>{(null==S?void 0:S.current)&&(S.current.openDropdown=R)}),[R]),d((()=>{null==b||b(R)}),[R]);const _=()=>{var o;return n(t,{children:[n("div",Object.assign({style:{position:"relative"},ref:E},{children:[e(v,Object.assign({ref:T,allowEvents:C.allowEvents,disabled:C.disabled,onClick:o=>{var e;null===(e=C.onDropdownOpen)||void 0===e||e.call(C),R?(x(!1),o.preventDefault()):C.disabled||x(!0)},isChildLoading:D},{children:C.allowEvents?h:null})),C.allowEvents?null:h]})),(R||y)&&e(u,Object.assign({ref:L,style:Object.assign(Object.assign({},I.popper),{zIndex:null!==(o=C.dropdownZIndex)&&void 0!==o?o:3})},M.popper,{"data-test":C["data-test"]},{children:e(p,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(m,Object.assign({},C,{onSelect:o=>{var e;"2.0"===g&&C.isMultiSelect||(null===(e=C.onSelect)||void 0===e||e.call(C,o),x(!1))},onClose:V,version:g,headerRef:T,zeroState:null==C?void 0:C.zeroState,isDraggable:C.isDraggable,onOptionsReorder:C.onOptionsReorder}))}))}))]})};return e(t,{children:R||y||void 0===f?_():e(c,Object.assign({body:f,placement:O,hideArrow:!j},{children:e("div",Object.assign({"data-test":C["data-test"]},{children:_()}))}))})}));w.displayName="DropdownPopover";export{w as DropdownPopover};
@@ -1 +1 @@
1
- import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useRef as n,useEffect as r}from"react";import{ZeroState as i}from"../../../zeroState/ZeroState.js";import{useOutside as s}from"../../../../hooks/useOutside.js";import{useDropdown as l}from"../../hooks/useDropdown.js";import{Description as c}from"./description/Description.js";import{FreeFormMenu as a}from"./menu/FreeFormMenu.js";import{MenuList as u}from"./menu/MenuList.js";import{SelectAllMenu as d}from"./menu/SelectAllMenu.js";import p from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as h,MenuListContainer as f}from"./OpennedDropdown.styled.js";import{SearchBox as m}from"./searchbox/SearchBox.js";import{SearchZeroState as b}from"./searchbox/SearchZeroState.js";const g=304,S=290,v=v=>{let{options:j,isSearchable:w,isMultiSelect:O,maxSelections:y,width:x,allowFreeForm:C,height:D,onClose:k,onSelect:L,onSearch:M,version:I,skipSorting:A,headerRef:T,hideSelectAll:E,primaryButtonText:F,onInfiniteScroll:B,onMultiSelectClear:H,onDropdownItemClick:q,buttonOptions:z,isSearchLoading:R,disableSearchOptions:V,disableSearchedOptionExcept:W,useDefaultCursor:Z,containerStyle:$={},zeroState:K}=v;const{dropdownOptions:N,search:P,searchedString:U,searchedOptions:G,onApplyHandler:J,selectAllHandler:Q,onMultiSelectClear:X,onFreeFormSelect:Y,onMultiSelectApply:_,latestDropdownOptionsRef:ee,getSelectedOptions:te,getCurrentSelectionCount:oe}=l(I,j,L,A,O,M,V,W,y),[ne,re]=o(null!=x?x:S),[ie,se]=o(null),[le,ce]=o(-1),ae=n(null),ue=n([]),de=n(null);s(ae,(()=>{if(se(null),O&&"2.0"===I){const e=te(ee.current);null==k||k(e)}else null==k||k(N)}),[T,ue]),r((()=>{const e=setTimeout((()=>{ae.current&&ae.current.focus({preventScroll:!0})}),0);return()=>clearTimeout(e)}),[]);r((()=>{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 o=e;o.disabled||t.push(o)}})),t})(U&&M?G:N);if(0!==t.length)if("ArrowDown"===e.key)e.preventDefault(),ce((e=>{const o=e<t.length-1?e+1:0;return setTimeout((()=>{var e;const t=null===(e=de.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${o}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),o}));else if("ArrowUp"===e.key)e.preventDefault(),ce((e=>{const o=e>0?e-1:t.length-1;return setTimeout((()=>{var e;const t=null===(e=de.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${o}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),o}));else if("Enter"===e.key&&le>=0){e.preventDefault();const o=t[le];o&&(J(Object.assign(Object.assign({},o),{selected:!o.selected})),q&&q(o))}},t=ae.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}}),[le,U,G,N,M,J,q]);const pe=null!=D?D:g,he="number"==typeof pe?w&&O?pe-96:w&&!O||!w&&O?pe-48:pe:pe;r((()=>{const e=null!=x?x:S;if(null===ie)re(e);else if("number"==typeof e)re(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));re(t)}}),[ie]);const fe=[],me=(e=>{if(!O||!y&&0!==y)return e;const t=oe(e)>=y;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 o=e;return Object.assign(Object.assign({},o),{disabled:o.disabled||!o.selected&&t})}})):e})((U&&M?G:N).map((e=>{var t,o;if(U&&!M){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(U.toLowerCase()))&&(fe.push(!U||e.label===U),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(U.toLowerCase()))||(null===(o=e.searchKey)||void 0===o?void 0:o.toLowerCase().includes(U.toLowerCase()))?(fe.push(!U||e.label===U),e):null}return e})).filter((e=>null!==e))),be=!!w&&U&&0===me.length;return e(h,Object.assign({version:I,ref:ae,tabIndex:-1,style:Object.assign(Object.assign({width:ne},$),{outline:"none"})},{children:[e("div",Object.assign({style:{width:ie?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!w&&t(m,{onSearch:P,version:I}),me.length||U?e(f,Object.assign({minHeight:pe,maxHeight:he,ref:de},{children:[!!O&&!be&&!E&&t(d,{version:I,options:U&&M?G:N,onSelect:Q}),!C&&be&&t(b,{isLoading:R,height:he,searchedString:U,containerWidth:x}),C&&(be||!!fe.length&&fe.every((e=>!1===e)))&&t(a,{version:I,isMultiSelect:O,onSelect:Y,searchedString:U}),t(u,{onInfiniteScroll:B,onDropdownItemClick:q,version:I,onSelect:J,showDescription:function(e,t){se(e&&t?{title:e,description:t}:null)},isMultiSelect:O,options:me,useDefaultCursor:Z,ref:ue,focusedIndex:le})]})):t("div",Object.assign({style:{height:pe,display:"flex"}},{children:t(i,Object.assign({},K,{title:(null==K?void 0:K.title)||"No results found",subTitle:(null==K?void 0:K.subTitle)||"Please try again later or contact us at support@bik.ai if you require further assistance."}))})),!!O&&!(!me.length&&!U)&&"2.0"!==I&&t(p,{onClear:()=>{X(),null==H||H()},onApply:_,list:U&&M?G:N,buttonText:F,buttonOptions:z})]})),!!ie&&t(c,{title:ie.title,description:ie.description,version:I})]}))};export{v as OpenedDropdown};
1
+ import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useCallback as o,useState as n,useRef as r,useEffect as i}from"react";import{ZeroState as s}from"../../../zeroState/ZeroState.js";import{useOutside as l}from"../../../../hooks/useOutside.js";import{useDropdown as c}from"../../hooks/useDropdown.js";import{Description as u}from"./description/Description.js";import{FreeFormMenu as a}from"./menu/FreeFormMenu.js";import{MenuList as d}from"./menu/MenuList.js";import{SelectAllMenu as p}from"./menu/SelectAllMenu.js";import h from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as f,MenuListContainer as m}from"./OpennedDropdown.styled.js";import{SearchBox as b}from"./searchbox/SearchBox.js";import{SearchZeroState as g}from"./searchbox/SearchZeroState.js";const S=304,v=290,j=j=>{let{options:O,isSearchable:w,isMultiSelect:y,maxSelections:x,width:C,allowFreeForm:D,height:k,onClose:L,onSelect:M,onSearch:I,version:A,skipSorting:T,headerRef:E,hideSelectAll:B,primaryButtonText:F,onInfiniteScroll:H,onMultiSelectClear:R,onDropdownItemClick:q,buttonOptions:z,isSearchLoading:V,disableSearchOptions:W,disableSearchedOptionExcept:Z,useDefaultCursor:$,containerStyle:K={},zeroState:N,isDraggable:P=!1,onOptionsReorder:U,hideClearButton:G=!1}=j;const J=o((e=>{if(!P||!y)return e;const t=[],o=[];return e.forEach((e=>{if(e.options)o.push(e);else{e.selected?t.push(e):o.push(e)}})),[...t,...o]}),[P,y]),[Q,X]=n((()=>J(O))),Y=r(Q),_=r(!1),ee=r(U);i((()=>{X(J(O))}),[O,J]),i((()=>{Y.current=Q}),[Q]),i((()=>{ee.current=U}),[U]),i((()=>()=>{_.current&&ee.current&&ee.current(Y.current)}),[]);const te=o((e=>{X(e),"2.0"===A?null==U||U(e):_.current=!0}),[U,A]),oe=P?Q:O,{dropdownOptions:ne,search:re,searchedString:ie,searchedOptions:se,onApplyHandler:le,selectAllHandler:ce,onMultiSelectClear:ue,onFreeFormSelect:ae,onMultiSelectApply:de,latestDropdownOptionsRef:pe,getSelectedOptions:he,getCurrentSelectionCount:fe}=c(A,oe,M,T||P,y,I,W,Z,x),[me,be]=n(null!=C?C:v),[ge,Se]=n(null),[ve,je]=n(-1),Oe=r(null),we=r([]),ye=r(null);l(Oe,(()=>{if(Se(null),y&&"2.0"===A){const e=he(pe.current);null==L||L(e)}else null==L||L(ne)}),[E,we]),i((()=>{const e=setTimeout((()=>{Oe.current&&Oe.current.focus({preventScroll:!0})}),0);return()=>clearTimeout(e)}),[]);i((()=>{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 o=e;o.disabled||t.push(o)}})),t})(ie&&I?se:ne);if(0!==t.length)if("ArrowDown"===e.key)e.preventDefault(),je((e=>{const o=e<t.length-1?e+1:0;return setTimeout((()=>{var e;const t=null===(e=ye.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${o}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),o}));else if("ArrowUp"===e.key)e.preventDefault(),je((e=>{const o=e>0?e-1:t.length-1;return setTimeout((()=>{var e;const t=null===(e=ye.current)||void 0===e?void 0:e.querySelector(`[data-option-index="${o}"]`);t&&t.scrollIntoView({block:"nearest",behavior:"smooth"})}),0),o}));else if("Enter"===e.key&&ve>=0){e.preventDefault();const o=t[ve];o&&(le(Object.assign(Object.assign({},o),{selected:!o.selected})),q&&q(o))}},t=Oe.current;if(t)return t.addEventListener("keydown",e),()=>{t.removeEventListener("keydown",e)}}),[ve,ie,se,ne,I,le,q]);const xe=null!=k?k:S,Ce="number"==typeof xe?w&&y?xe-96:w&&!y||!w&&y?xe-48:xe:xe;i((()=>{const e=null!=C?C:v;if(null===ge)be(e);else if("number"==typeof e)be(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));be(t)}}),[ge]);const De=[],ke=(e=>{if(!y||!x&&0!==x)return e;const t=fe(ne)>=x;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 o=e;return Object.assign(Object.assign({},o),{disabled:o.disabled||!o.selected&&t})}})):e})((ie&&I?se:ne).map((e=>{var t,o;if(ie&&!I){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(ie.toLowerCase()))&&(De.push(!ie||e.label===ie),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(ie.toLowerCase()))||(null===(o=e.searchKey)||void 0===o?void 0:o.toLowerCase().includes(ie.toLowerCase()))?(De.push(!ie||e.label===ie),e):null}return e})).filter((e=>null!==e))),Le=!!w&&ie&&0===ke.length;return e(f,Object.assign({version:A,ref:Oe,tabIndex:-1,style:Object.assign(Object.assign({width:me},K),{outline:"none"})},{children:[e("div",Object.assign({style:{width:ge?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!w&&t(b,{onSearch:re,version:A}),ke.length||ie?e(m,Object.assign({minHeight:xe,maxHeight:Ce,ref:ye},{children:[!!y&&!Le&&!B&&t(p,{version:A,options:ie&&I?se:ne,onSelect:ce}),!D&&Le&&t(g,{isLoading:V,height:Ce,searchedString:ie,containerWidth:C}),D&&(Le||!!De.length&&De.every((e=>!1===e)))&&t(a,{version:A,isMultiSelect:y,onSelect:ae,searchedString:ie}),t(d,{onInfiniteScroll:H,onDropdownItemClick:q,version:A,onSelect:le,showDescription:function(e,t){Se(e&&t?{title:e,description:t}:null)},isMultiSelect:y,options:ke,useDefaultCursor:$,ref:we,focusedIndex:ve,isDraggable:P,onOptionsReorder:te})]})):t("div",Object.assign({style:{height:xe,display:"flex"}},{children:t(s,Object.assign({},N,{title:(null==N?void 0:N.title)||"No results found",subTitle:(null==N?void 0:N.subTitle)||"Please try again later or contact us at support@bik.ai if you require further assistance."}))})),!!y&&!(!ke.length&&!ie)&&"2.0"!==A&&t(h,{onClear:()=>{ue(),null==R||R()},onApply:de,list:ie&&I?se:ne,buttonText:F,buttonOptions:z,hideClearButton:G})]})),!!ge&&t(u,{title:ge.title,description:ge.description,version:A})]}))};export{j as OpenedDropdown};
@@ -11,6 +11,12 @@ interface MenuItemProps {
11
11
  useDefaultCursor?: boolean;
12
12
  isFocused?: boolean;
13
13
  dataIndex?: number;
14
+ isDraggable?: boolean;
15
+ onDragStart?: (e: React.DragEvent<HTMLDivElement>) => void;
16
+ onDragOver?: (e: React.DragEvent<HTMLDivElement>) => void;
17
+ onDrop?: (e: React.DragEvent<HTMLDivElement>) => void;
18
+ onDragEnd?: (e: React.DragEvent<HTMLDivElement>) => void;
19
+ isDraggedOver?: boolean;
14
20
  }
15
21
  export declare const MenuItem: import("react").ForwardRefExoticComponent<MenuItemProps & import("react").RefAttributes<HTMLDivElement>>;
16
22
  export {};
@@ -1,13 +1,43 @@
1
- import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import n from"../../../../../assets/icons/chevronRight.svg.js";import{forwardRef as i,useState as r}from"react";import s from"styled-components";import{CheckBox as l}from"../../../../checkBox/CheckBox.js";import{ListItem as a}from"../../../../list-item/ListItem.js";import{Tooltip as c}from"../../../../tooltips/Tooltip.js";import{BodyCaption as d}from"../../../../TypographyStyle.js";import{DEFAULT_THEME as p,COLORS as m}from"../../../../../constants/Theme.js";import{FreeFormContainer as u}from"./FreeFormMenu.styled.js";const g=s(a)`
1
+ import{jsx as e,Fragment as n,jsxs as o}from"react/jsx-runtime";import t from"../../../../../assets/icons/chevronRight.svg.js";import{forwardRef as r,useState as i}from"react";import l from"styled-components";import{CheckBox as a}from"../../../../checkBox/CheckBox.js";import{ListItem as s}from"../../../../list-item/ListItem.js";import{Tooltip as d}from"../../../../tooltips/Tooltip.js";import{BodyCaption as c}from"../../../../TypographyStyle.js";import{DEFAULT_THEME as p,COLORS as g}from"../../../../../constants/Theme.js";import{FreeFormContainer as m}from"./FreeFormMenu.styled.js";const u=l(s)`
2
2
  padding: ${e=>"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
- `,v=s.div`
5
+ `,v=l.div`
6
6
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12);
7
- border-radius: ${e=>{let{version:t}=e;return"1.0"===t?"0":"8px"}};
8
- padding: ${e=>{let{version:t}=e;return"1.0"===t?"0":"4px"}};
7
+ border-radius: ${e=>{let{version:n}=e;return"1.0"===n?"0":"8px"}};
8
+ padding: ${e=>{let{version:n}=e;return"1.0"===n?"0":"4px"}};
9
9
  min-width: 148px;
10
- border: ${e=>{let{version:t}=e;return"1.0"===t?`1px solid ${p.colorsV2.stroke.primary}`:"none"}};
10
+ border: ${e=>{let{version:n}=e;return"1.0"===n?`1px solid ${p.colorsV2.stroke.primary}`:"none"}};
11
11
  max-height: 248px;
12
12
  overflow-y: auto;
13
- `,h=i(((i,s)=>{let{option:a,isMultiSelect:h,showDescription:b,onSelect:x,last:f,version:j,onDropdownItemClick:y,useDefaultCursor:I,isFocused:C=!1,dataIndex:O=-1}=i;var k;const[w,T]=r(a.selected),D=(e,t)=>{if(!e.children){F(!e.selected);const o=t?Object.assign(Object.assign({},e),{parent:t}):e;null==y||y(o)}},F=e=>{a.disabled||x(Object.assign(Object.assign({},a),{selected:e}))},$=I?{cursor:"default"}:{};return e(t,{children:e(c,Object.assign({body:"",tooltipContent:a.children?e("div",Object.assign({style:{backgroundColor:p.colorsV2.surface.standard},ref:s,onMouseEnter:()=>T(!0),onMouseLeave:()=>T(!1)},{children:e(v,Object.assign({version:null!=j?j:"2.0"},{children:a.children.map((t=>{var o;return e(g,{version:j,style:"1.0"!==j&&(null!==(o=null==a?void 0:a.children)&&void 0!==o?o:[]).length-1?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),D(t,a)},listItem:{value:t.value,label:t.label},subText:t.subText,leadingIcon:t.leadingIcon||void 0,customComponent:t.customComponent,trailingIcon:t.trailingIcon||void 0,variant:a.disabled?"inactive":t.selected?"selected":"default"},t.value)}))}))})):e(t,{}),placement:"right-start",hideArrow:!0},{children:e(g,{version:j,style:f?Object.assign({borderBottom:0},$):Object.assign({},$),onClick:e=>{e.preventDefault(),D(a)},onMouseOver:()=>{a.description?b(a.label,a.description):b()},listItem:{value:a.value,label:a.label},subText:a.subText,"data-option-index":O,role:"option",id:`dropdown-option-${O}`,"aria-selected":!!a.selected,leadingIcon:h?o("div",Object.assign({style:{display:"flex",alignContent:"center",justifyContent:"center",gap:8}},{children:[e(l,{size:"2.0"===j?"SMALL":"DEFAULT",isDisabled:null!==(k=a.disabled)&&void 0!==k&&k,isChecked:!!a.selected,onValueChange:F}),e("div",Object.assign({style:{marginRight:"-4px"}},{children:a.leadingIcon}))]})):a.leadingIcon?e(t,{children:a.leadingIcon}):void 0,customComponent:a.customComponent,trailingIcon:a.isFreeForm?e(u,{children:e(d,Object.assign({style:{color:m.content.secondary}},{children:"Freeform"}))}):a.children?e(n,{width:12,height:12}):a.trailingIcon?e(t,{children:a.trailingIcon}):void 0,variant:a.disabled?"inactive":C||a.selected||!h&&w?"selected":"default"})}))})}));export{h as MenuItem};
13
+ `,h=l.div`
14
+ display: grid;
15
+ grid-template-columns: repeat(2, 2.86px);
16
+ grid-template-rows: repeat(3, 2.86px);
17
+ column-gap: 3.8px;
18
+ row-gap: 4px;
19
+ margin-right: 8px;
20
+ cursor: move;
21
+ flex-shrink: 0;
22
+ align-self: center;
23
+ height: fit-content;
24
+ min-height: 18px;
25
+ `,x=l.div`
26
+ width: 2.86px;
27
+ height: 2.86px;
28
+ border-radius: 50%;
29
+ background-color: ${g.content.inactive};
30
+ flex-shrink: 0;
31
+ `,b=l.div`
32
+ display: flex;
33
+ align-content: center;
34
+ justify-content: center;
35
+ gap: 8px;
36
+ `,f=l.div`
37
+ margin-right: -4px;
38
+ `,D=l.div`
39
+ display: flex;
40
+ align-items: center;
41
+ flex-direction: column;
42
+ flex: 1;
43
+ `,j=n=>{let{onDragStart:t,onDragEnd:r}=n;return o(h,Object.assign({draggable:!0,onDragStart:t,onDragEnd:r},{children:[e(x,{}),e(x,{}),e(x,{}),e(x,{}),e(x,{}),e(x,{})]}))},y=r(((r,l)=>{let{option:s,isMultiSelect:h,showDescription:x,onSelect:y,last:I,version:O,onDropdownItemClick:C,useDefaultCursor:k,isFocused:w=!1,dataIndex:T=-1,isDraggable:$=!1,onDragStart:S,onDragOver:E,onDrop:F,onDragEnd:M,isDraggedOver:L=!1}=r;var B;const[A,V]=i(s.selected),z=(e,n)=>{if(!e.children){R(!e.selected);const o=n?Object.assign(Object.assign({},e),{parent:n}):e;null==C||C(o)}},R=e=>{s.disabled||y(Object.assign(Object.assign({},s),{selected:e}))},U=k?{cursor:"default"}:{};return e(n,{children:e(d,Object.assign({body:"",tooltipContent:s.children?e("div",Object.assign({style:{backgroundColor:p.colorsV2.surface.standard},ref:l,onMouseEnter:()=>V(!0),onMouseLeave:()=>V(!1)},{children:e(v,Object.assign({version:null!=O?O:"2.0"},{children:s.children.map((n=>{var o;return e(u,{version:O,style:"1.0"!==O&&(null!==(o=null==s?void 0:s.children)&&void 0!==o?o:[]).length-1?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),z(n,s)},listItem:{value:n.value,label:n.label},subText:n.subText,leadingIcon:n.leadingIcon||void 0,customComponent:n.customComponent,trailingIcon:n.trailingIcon||void 0,variant:s.disabled?"inactive":n.selected?"selected":"default"},n.value)}))}))})):e(n,{}),placement:"right-start",hideArrow:!0},{children:e(u,{version:O,style:I?Object.assign(Object.assign({borderBottom:0},U),L?{borderTop:`2px solid ${g.content.brand}`,opacity:.5}:{}):Object.assign(Object.assign({},U),L?{borderTop:`2px solid ${g.content.brand}`,opacity:.5}:{}),onClick:e=>{e.preventDefault(),z(s)},onMouseOver:()=>{s.description?x(s.label,s.description):x()},listItem:{value:s.value,label:s.label},subText:s.subText,"data-option-index":T,role:"option",id:`dropdown-option-${T}`,"aria-selected":!!s.selected,onDragOver:$?E:void 0,onDrop:$?F:void 0,leadingIcon:h?o(b,{children:[$&&e(j,{onDragStart:S,onDragEnd:M}),e(a,{size:"2.0"===O?"SMALL":"DEFAULT",isDisabled:null!==(B=s.disabled)&&void 0!==B&&B,isChecked:!!s.selected,onValueChange:R}),e(f,{children:s.leadingIcon})]}):$?o(D,{children:[e(j,{onDragStart:S,onDragEnd:M}),s.leadingIcon&&e("div",{children:s.leadingIcon})]}):s.leadingIcon?e(n,{children:s.leadingIcon}):void 0,customComponent:s.customComponent,trailingIcon:s.isFreeForm?e(m,{children:e(c,Object.assign({style:{color:g.content.secondary}},{children:"Freeform"}))}):s.children?e(t,{width:12,height:12}):s.trailingIcon?e(n,{children:s.trailingIcon}):void 0,variant:s.disabled?"inactive":w||s.selected||!h&&A?"selected":"default"})}))})}));export{y as MenuItem};
@@ -10,6 +10,8 @@ interface MenuListProps {
10
10
  onDropdownItemClick?: (option: DropdownOption) => void;
11
11
  useDefaultCursor?: boolean;
12
12
  focusedIndex?: number;
13
+ isDraggable?: boolean;
14
+ onOptionsReorder?: (reorderedOptions: DropdownOption[]) => void;
13
15
  }
14
16
  export declare const MenuList: import("react").ForwardRefExoticComponent<MenuListProps & import("react").RefAttributes<HTMLDivElement[]>>;
15
17
  export {};
@@ -1 +1 @@
1
- import{jsx as e,Fragment as n,jsxs as t}from"react/jsx-runtime";import{forwardRef as r,useRef as o,useCallback as s,useEffect as i}from"react";import{MenuItem as c}from"./MenuItem.js";import{StyledGroupedLabel as l}from"./MenuList.styled.js";const u=r(((r,u)=>{let{options:a,isMultiSelect:d,showDescription:p,onSelect:f,version:m,onInfiniteScroll:g,onDropdownItemClick:h,useDefaultCursor:b,focusedIndex:I=-1}=r;const v=o(null),D=o(null),j=s((()=>{v.current&&v.current.disconnect(),v.current=new IntersectionObserver((e=>{e[0].isIntersecting&&(null==g||g())})),D.current&&v.current.observe(D.current)}),[g]);i((()=>(j(),()=>{v.current&&v.current.disconnect()})),[j,a]);const w=new Map;let S=-1;return a.forEach((e=>{if(e.options)e.options.forEach((e=>{e.disabled||(S++,w.set(e,S))}));else{const n=e;n.disabled||(S++,w.set(n,S))}})),e(n,{children:a.map(((n,r)=>{const o=r===a.length-1;if(n.options){const s=n;return t("div",Object.assign({style:{marginTop:"2.0"===m?2:0}},{children:[t(l,Object.assign({version:m},{children:[s.leadingIcon?e("span",Object.assign({style:{marginRight:8}},{children:s.leadingIcon})):null,s.label]})),s.options.map(((n,t)=>{const o=w.get(n),i=o===I&&!n.disabled;return e(c,{version:m,last:t===s.options.length-1,onSelect:f,showDescription:p,onDropdownItemClick:h,isMultiSelect:d,option:n,useDefaultCursor:b,isFocused:i,dataIndex:o,ref:e=>{u&&"object"==typeof u&&u.current&&e&&e&&e&&e&&(u.current[r]=e)}},`${r}-${t}`)})),o?e("span",{ref:D}):null]}),r)}const s=n,i=w.get(s),g=i===I&&!s.disabled;return t("div",{children:[e(c,{version:m,last:o,onSelect:f,showDescription:p,onDropdownItemClick:h,isMultiSelect:d,option:s,useDefaultCursor:b,isFocused:g,dataIndex:i,ref:e=>{u&&"object"==typeof u&&u.current&&e&&(u.current[r]=e)}},s.value),o?e("span",{ref:D}):null]},r)}))})}));export{u as MenuList};
1
+ import{jsx as e,Fragment as n,jsxs as t}from"react/jsx-runtime";import{forwardRef as r,useRef as o,useState as s,useCallback as l,useEffect as i}from"react";import{MenuItem as c}from"./MenuItem.js";import{StyledGroupedLabel as a}from"./MenuList.styled.js";const u=r(((r,u)=>{let{options:d,isMultiSelect:p,showDescription:f,onSelect:g,version:m,onInfiniteScroll:D,onDropdownItemClick:b,useDefaultCursor:v,focusedIndex:h=-1,isDraggable:I=!1,onOptionsReorder:w}=r;const j=o(null),S=o(null),[O,C]=s(null),[M,x]=s(null),y=l((()=>{j.current&&j.current.disconnect(),j.current=new IntersectionObserver((e=>{e[0].isIntersecting&&(null==D||D())})),S.current&&j.current.observe(S.current)}),[D]);i((()=>(y(),()=>{j.current&&j.current.disconnect()})),[y,d]);const E=l((e=>n=>{I&&(C(e),n.dataTransfer.effectAllowed="move")}),[I]),k=l((e=>n=>{I&&(n.preventDefault(),n.dataTransfer.dropEffect="move",x(e))}),[I]),T=l((e=>n=>{if(I&&null!==O){if(n.preventDefault(),O!==e){const n=[...d],[t]=n.splice(O,1);n.splice(e,0,t),null==w||w(n)}C(null),x(null)}}),[I,O,d,w]),F=l((()=>{C(null),x(null)}),[]),R=new Map;let $=-1;return d.forEach((e=>{if(e.options)e.options.forEach((e=>{e.disabled||($++,R.set(e,$))}));else{const n=e;n.disabled||($++,R.set(n,$))}})),e(n,{children:d.map(((n,r)=>{const o=r===d.length-1;if(n.options){const s=n;return t("div",Object.assign({style:{marginTop:"2.0"===m?2:0}},{children:[t(a,Object.assign({version:m},{children:[s.leadingIcon?e("span",Object.assign({style:{marginRight:8}},{children:s.leadingIcon})):null,s.label]})),s.options.map(((n,t)=>{const o=R.get(n),l=o===h&&!n.disabled;return e(c,{version:m,last:t===s.options.length-1,onSelect:g,showDescription:f,onDropdownItemClick:b,isMultiSelect:p,option:n,useDefaultCursor:v,isFocused:l,dataIndex:o,isDraggable:!1,ref:e=>{u&&"object"==typeof u&&u.current&&e&&e&&e&&e&&(u.current[r]=e)}},`${r}-${t}`)})),o?e("span",{ref:S}):null]}),r)}const s=n,l=R.get(s),i=l===h&&!s.disabled;return t("div",{children:[e(c,{version:m,last:o,onSelect:g,showDescription:f,onDropdownItemClick:b,isMultiSelect:p,option:s,useDefaultCursor:v,isFocused:i,dataIndex:l,isDraggable:I,onDragStart:E(r),onDragOver:k(r),onDrop:T(r),onDragEnd:F,isDraggedOver:M===r,ref:e=>{u&&"object"==typeof u&&u.current&&e&&(u.current[r]=e)}},s.value),o?e("span",{ref:S}):null]},r)}))})}));export{u as MenuList};
@@ -6,6 +6,7 @@ interface MultiSelectDropdownBottomBarProps {
6
6
  list: DropdownOption[];
7
7
  buttonText?: string;
8
8
  buttonOptions?: ButtonOptions;
9
+ hideClearButton?: boolean;
9
10
  }
10
11
  declare const MultiSelectDropdownBottomBar: React.FC<MultiSelectDropdownBottomBarProps>;
11
12
  export default MultiSelectDropdownBottomBar;
@@ -1 +1 @@
1
- import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Button as o}from"../../../../button/Button.js";import{BodySecondary as n}from"../../../../TypographyStyle.js";import{COLORS as r}from"../../../../../constants/Theme.js";import{BottomBarContainer as s}from"./MultiSelectDropdownBottomBar.styled.js";const l=l=>{const{onClear:i,onApply:p,list:a,buttonText:c,buttonOptions:y}=l,{primaryButtonText:u,primaryButtonType:m,secondaryButtonText:d,secondaryButtonType:f}=null!=y?y:{},b=a.reduce(((t,e)=>{if(e.options){return t+e.options.filter((t=>!0===t.selected)).length}return e.selected?t+1:t}),0);return t(s,Object.assign({style:{justifyContent:"space-between"}},{children:[e(n,Object.assign({style:{flex:1,color:r.content.primary}},{children:b?`${b} selected`:""})),t("div",Object.assign({style:{flexDirection:"row",display:"flex",gap:12}},{children:[e(o,{size:"small",buttonType:f||"primary",buttonText:d||"Clear",onClick:i}),e(o,{size:"small",buttonText:u||c||"Apply",buttonType:m||"primary",onClick:()=>{p()}})]}))]}))};export{l as default};
1
+ import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Button as o}from"../../../../button/Button.js";import{BodySecondary as n}from"../../../../TypographyStyle.js";import{COLORS as r}from"../../../../../constants/Theme.js";import{BottomBarContainer as s}from"./MultiSelectDropdownBottomBar.styled.js";const l=l=>{const{onClear:i,onApply:p,list:a,buttonText:c,buttonOptions:u,hideClearButton:y}=l,{primaryButtonText:m,primaryButtonType:d,secondaryButtonText:f,secondaryButtonType:b}=null!=u?u:{},T=a.reduce(((t,e)=>{if(e.options){return t+e.options.filter((t=>!0===t.selected)).length}return e.selected?t+1:t}),0);return t(s,Object.assign({style:{justifyContent:"space-between"}},{children:[e(n,Object.assign({style:{flex:1,color:r.content.primary}},{children:T?`${T} selected`:""})),t("div",Object.assign({style:{flexDirection:"row",display:"flex",gap:12}},{children:[!y&&e(o,{size:"small",buttonType:b||"primary",buttonText:f||"Clear",onClick:i}),e(o,{size:"small",buttonText:m||c||"Apply",buttonType:d||"primary",onClick:()=>{p()}})]}))]}))};export{l as default};