@ctlyst.id/internal-ui 3.1.20 → 3.1.22

Sign up to get free protection for your applications and to get access to all the features.
package/dist/index.d.mts CHANGED
@@ -562,6 +562,7 @@ declare function DropdownIndicator<OptionType>(props: DropdownIndicatorProps<Opt
562
562
  declare function ClearIndicator<OptionType, Group extends GroupBase<OptionType>, IsMulti extends boolean = false>(props: ClearIndicatorProps<OptionType, IsMulti, Group>): react_jsx_runtime.JSX.Element;
563
563
  declare function MultiValue(props: MultiValueProps<any>): react_jsx_runtime.JSX.Element;
564
564
  declare function MultiValueRemove(props: MultiValueRemoveProps<any>): react_jsx_runtime.JSX.Element;
565
+ declare function NoOptionsMessage(props: any): react_jsx_runtime.JSX.Element;
565
566
  declare function Select<OptionType, Group extends GroupBase<OptionType>, IsMulti extends boolean = false>({ styles, isError, ...rest }: SelectProps<OptionType, IsMulti, Group>): react_jsx_runtime.JSX.Element;
566
567
 
567
568
  type SelectAsyncProps<OptionType = unknown, Group extends GroupBase<OptionType> = GroupBase<OptionType>, Additional = unknown, IsMulti extends boolean = false> = AsyncPaginateProps<OptionType, Group, Additional, IsMulti> & ExtendedSelectProps;
@@ -851,4 +852,4 @@ declare const ProviderContext: React__default.Context<ProviderContextObject>;
851
852
  declare const useInternalUI: () => ProviderContextObject;
852
853
  declare const Provider: FC<ProviderProps>;
853
854
 
854
- export { AccordionEye, AccordionIndicator, Alert, AlertAction, type AlertActionProps, AlertClose, type AlertCloseProps, AlertDescription, type AlertDescriptionProps, AlertIcon, type AlertIconProps, type AlertProps, type AlertStatus, AlertTitle, type AlertTitleProps, Anchor, type AnchorProps, Badge, type BadgeProps, BreadCrumb, type BreadCrumbParentProps, type BreadCrumbProps, Button, type ButtonProps, CHECKBOX_STATE, CardCustom as Card, type CardProps, CheckboxComponent as Checkbox, type CheckboxComponentProps, CheckboxGroupComponent as CheckboxGroup, type CheckboxGroupComponentProps, Chips, type ChipsProps, ClearIndicator, Counter, type CustomLoaderProps, _default as DataTable, type DataTableProps, type DataTableRefs, DatePickerMonth, type DatePickerMonthProps, Datepicker, type DatepickerProps, Dialog, type DisabledRowData, DropdownIndicator, EmptyState, type Environment, Field, type FieldProps, Header, type HeaderDataProps, type HeaderProps, InputAddonLeft, InputAddonRight, InputField, type InputFieldProps, Loader, type LoaderProps, Logo, type LogoProps, Navigation as MainMenu, ModalBackButton, MultiDatePickerMonth, type MultiDatePickerMonthProps, MultiValue, MultiValueRemove, NavItem, type NavItemProps, Navbar, type NavbarProps, NavigationBar, type NavigationBarProps, type NavigationProps, type OptionGroup, type OptionMultiGroup, type OptionsGroup, Pagination, PaginationDetail, type PaginationDetailProps, PaginationFilter, type PaginationFilterProps, type PaginationProps, Profile, type ProfileProps, type Props, Provider, ProviderContext, Radio, RadioGroup, type RadioGroupComponentProps, type RadioProps, Rating, type RatingProps, Select, SelectAsync, SelectAsyncCreatable, type SelectAsyncCreatableProps, type SelectAsyncProps, SelectCheckbox as SelectCheckBox, SelectCreatable, type SelectCreatableProps, type SelectProps, type SelectWithCheckboxBaseProps, Sidebar, SidebarHeader, type SidebarHeaderProps, SidebarMenu, type SidebarMenuProps, type SidebarProps, Switch, type SwitchProps, Tab, type TableStyleProps, type TextAreaProps, TextareaField, type Theme, Tooltip, type TooltipProps, Uploader, type UploaderProps, Version, type VersionProps, VoilaLogo, XMSLogo, getSelectAllCheckboxState, getTheme, isCellDisabled, selectStyles, theme, themeSelect, useAlertStyles, useDataTable, useFetcher, useInternalUI, useToast };
855
+ export { AccordionEye, AccordionIndicator, Alert, AlertAction, type AlertActionProps, AlertClose, type AlertCloseProps, AlertDescription, type AlertDescriptionProps, AlertIcon, type AlertIconProps, type AlertProps, type AlertStatus, AlertTitle, type AlertTitleProps, Anchor, type AnchorProps, Badge, type BadgeProps, BreadCrumb, type BreadCrumbParentProps, type BreadCrumbProps, Button, type ButtonProps, CHECKBOX_STATE, CardCustom as Card, type CardProps, CheckboxComponent as Checkbox, type CheckboxComponentProps, CheckboxGroupComponent as CheckboxGroup, type CheckboxGroupComponentProps, Chips, type ChipsProps, ClearIndicator, Counter, type CustomLoaderProps, _default as DataTable, type DataTableProps, type DataTableRefs, DatePickerMonth, type DatePickerMonthProps, Datepicker, type DatepickerProps, Dialog, type DisabledRowData, DropdownIndicator, EmptyState, type Environment, Field, type FieldProps, Header, type HeaderDataProps, type HeaderProps, InputAddonLeft, InputAddonRight, InputField, type InputFieldProps, Loader, type LoaderProps, Logo, type LogoProps, Navigation as MainMenu, ModalBackButton, MultiDatePickerMonth, type MultiDatePickerMonthProps, MultiValue, MultiValueRemove, NavItem, type NavItemProps, Navbar, type NavbarProps, NavigationBar, type NavigationBarProps, type NavigationProps, NoOptionsMessage, type OptionGroup, type OptionMultiGroup, type OptionsGroup, Pagination, PaginationDetail, type PaginationDetailProps, PaginationFilter, type PaginationFilterProps, type PaginationProps, Profile, type ProfileProps, type Props, Provider, ProviderContext, Radio, RadioGroup, type RadioGroupComponentProps, type RadioProps, Rating, type RatingProps, Select, SelectAsync, SelectAsyncCreatable, type SelectAsyncCreatableProps, type SelectAsyncProps, SelectCheckbox as SelectCheckBox, SelectCreatable, type SelectCreatableProps, type SelectProps, type SelectWithCheckboxBaseProps, Sidebar, SidebarHeader, type SidebarHeaderProps, SidebarMenu, type SidebarMenuProps, type SidebarProps, Switch, type SwitchProps, Tab, type TableStyleProps, type TextAreaProps, TextareaField, type Theme, Tooltip, type TooltipProps, Uploader, type UploaderProps, Version, type VersionProps, VoilaLogo, XMSLogo, getSelectAllCheckboxState, getTheme, isCellDisabled, selectStyles, theme, themeSelect, useAlertStyles, useDataTable, useFetcher, useInternalUI, useToast };
package/dist/index.d.ts CHANGED
@@ -562,6 +562,7 @@ declare function DropdownIndicator<OptionType>(props: DropdownIndicatorProps<Opt
562
562
  declare function ClearIndicator<OptionType, Group extends GroupBase<OptionType>, IsMulti extends boolean = false>(props: ClearIndicatorProps<OptionType, IsMulti, Group>): react_jsx_runtime.JSX.Element;
563
563
  declare function MultiValue(props: MultiValueProps<any>): react_jsx_runtime.JSX.Element;
564
564
  declare function MultiValueRemove(props: MultiValueRemoveProps<any>): react_jsx_runtime.JSX.Element;
565
+ declare function NoOptionsMessage(props: any): react_jsx_runtime.JSX.Element;
565
566
  declare function Select<OptionType, Group extends GroupBase<OptionType>, IsMulti extends boolean = false>({ styles, isError, ...rest }: SelectProps<OptionType, IsMulti, Group>): react_jsx_runtime.JSX.Element;
566
567
 
567
568
  type SelectAsyncProps<OptionType = unknown, Group extends GroupBase<OptionType> = GroupBase<OptionType>, Additional = unknown, IsMulti extends boolean = false> = AsyncPaginateProps<OptionType, Group, Additional, IsMulti> & ExtendedSelectProps;
@@ -851,4 +852,4 @@ declare const ProviderContext: React__default.Context<ProviderContextObject>;
851
852
  declare const useInternalUI: () => ProviderContextObject;
852
853
  declare const Provider: FC<ProviderProps>;
853
854
 
854
- export { AccordionEye, AccordionIndicator, Alert, AlertAction, type AlertActionProps, AlertClose, type AlertCloseProps, AlertDescription, type AlertDescriptionProps, AlertIcon, type AlertIconProps, type AlertProps, type AlertStatus, AlertTitle, type AlertTitleProps, Anchor, type AnchorProps, Badge, type BadgeProps, BreadCrumb, type BreadCrumbParentProps, type BreadCrumbProps, Button, type ButtonProps, CHECKBOX_STATE, CardCustom as Card, type CardProps, CheckboxComponent as Checkbox, type CheckboxComponentProps, CheckboxGroupComponent as CheckboxGroup, type CheckboxGroupComponentProps, Chips, type ChipsProps, ClearIndicator, Counter, type CustomLoaderProps, _default as DataTable, type DataTableProps, type DataTableRefs, DatePickerMonth, type DatePickerMonthProps, Datepicker, type DatepickerProps, Dialog, type DisabledRowData, DropdownIndicator, EmptyState, type Environment, Field, type FieldProps, Header, type HeaderDataProps, type HeaderProps, InputAddonLeft, InputAddonRight, InputField, type InputFieldProps, Loader, type LoaderProps, Logo, type LogoProps, Navigation as MainMenu, ModalBackButton, MultiDatePickerMonth, type MultiDatePickerMonthProps, MultiValue, MultiValueRemove, NavItem, type NavItemProps, Navbar, type NavbarProps, NavigationBar, type NavigationBarProps, type NavigationProps, type OptionGroup, type OptionMultiGroup, type OptionsGroup, Pagination, PaginationDetail, type PaginationDetailProps, PaginationFilter, type PaginationFilterProps, type PaginationProps, Profile, type ProfileProps, type Props, Provider, ProviderContext, Radio, RadioGroup, type RadioGroupComponentProps, type RadioProps, Rating, type RatingProps, Select, SelectAsync, SelectAsyncCreatable, type SelectAsyncCreatableProps, type SelectAsyncProps, SelectCheckbox as SelectCheckBox, SelectCreatable, type SelectCreatableProps, type SelectProps, type SelectWithCheckboxBaseProps, Sidebar, SidebarHeader, type SidebarHeaderProps, SidebarMenu, type SidebarMenuProps, type SidebarProps, Switch, type SwitchProps, Tab, type TableStyleProps, type TextAreaProps, TextareaField, type Theme, Tooltip, type TooltipProps, Uploader, type UploaderProps, Version, type VersionProps, VoilaLogo, XMSLogo, getSelectAllCheckboxState, getTheme, isCellDisabled, selectStyles, theme, themeSelect, useAlertStyles, useDataTable, useFetcher, useInternalUI, useToast };
855
+ export { AccordionEye, AccordionIndicator, Alert, AlertAction, type AlertActionProps, AlertClose, type AlertCloseProps, AlertDescription, type AlertDescriptionProps, AlertIcon, type AlertIconProps, type AlertProps, type AlertStatus, AlertTitle, type AlertTitleProps, Anchor, type AnchorProps, Badge, type BadgeProps, BreadCrumb, type BreadCrumbParentProps, type BreadCrumbProps, Button, type ButtonProps, CHECKBOX_STATE, CardCustom as Card, type CardProps, CheckboxComponent as Checkbox, type CheckboxComponentProps, CheckboxGroupComponent as CheckboxGroup, type CheckboxGroupComponentProps, Chips, type ChipsProps, ClearIndicator, Counter, type CustomLoaderProps, _default as DataTable, type DataTableProps, type DataTableRefs, DatePickerMonth, type DatePickerMonthProps, Datepicker, type DatepickerProps, Dialog, type DisabledRowData, DropdownIndicator, EmptyState, type Environment, Field, type FieldProps, Header, type HeaderDataProps, type HeaderProps, InputAddonLeft, InputAddonRight, InputField, type InputFieldProps, Loader, type LoaderProps, Logo, type LogoProps, Navigation as MainMenu, ModalBackButton, MultiDatePickerMonth, type MultiDatePickerMonthProps, MultiValue, MultiValueRemove, NavItem, type NavItemProps, Navbar, type NavbarProps, NavigationBar, type NavigationBarProps, type NavigationProps, NoOptionsMessage, type OptionGroup, type OptionMultiGroup, type OptionsGroup, Pagination, PaginationDetail, type PaginationDetailProps, PaginationFilter, type PaginationFilterProps, type PaginationProps, Profile, type ProfileProps, type Props, Provider, ProviderContext, Radio, RadioGroup, type RadioGroupComponentProps, type RadioProps, Rating, type RatingProps, Select, SelectAsync, SelectAsyncCreatable, type SelectAsyncCreatableProps, type SelectAsyncProps, SelectCheckbox as SelectCheckBox, SelectCreatable, type SelectCreatableProps, type SelectProps, type SelectWithCheckboxBaseProps, Sidebar, SidebarHeader, type SidebarHeaderProps, SidebarMenu, type SidebarMenuProps, type SidebarProps, Switch, type SwitchProps, Tab, type TableStyleProps, type TextAreaProps, TextareaField, type Theme, Tooltip, type TooltipProps, Uploader, type UploaderProps, Version, type VersionProps, VoilaLogo, XMSLogo, getSelectAllCheckboxState, getTheme, isCellDisabled, selectStyles, theme, themeSelect, useAlertStyles, useDataTable, useFetcher, useInternalUI, useToast };
package/dist/index.js CHANGED
@@ -193,6 +193,7 @@ __export(src_exports, {
193
193
  NavItem: () => NavItem,
194
194
  Navbar: () => Navbar,
195
195
  NavigationBar: () => navigation_bar_default,
196
+ NoOptionsMessage: () => NoOptionsMessage,
196
197
  OrderedList: () => import_react51.OrderedList,
197
198
  Pagination: () => pagination_default,
198
199
  PaginationDetail: () => pagination_detail_default,
@@ -4131,6 +4132,9 @@ function MultiValue(props) {
4131
4132
  function MultiValueRemove(props) {
4132
4133
  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_select.components.MultiValueRemove, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react72.Flex, { align: "center", justify: "center", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Icon7.Close, { size: 2.5, color: "inherit" }) }) });
4133
4134
  }
4135
+ function NoOptionsMessage(props) {
4136
+ return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react72.Center, { textStyle: "text.xs", py: "1.5", color: "black.medium", children: (props == null ? void 0 : props.options.length) === 0 ? "Opsi tidak tersedia" : "Hasil tidak ditemukan" });
4137
+ }
4134
4138
  function Select2({
4135
4139
  styles,
4136
4140
  isError = false,
@@ -4148,6 +4152,7 @@ function Select2({
4148
4152
  ClearIndicator,
4149
4153
  MultiValue,
4150
4154
  MultiValueRemove,
4155
+ NoOptionsMessage,
4151
4156
  ...components
4152
4157
  },
4153
4158
  value,
@@ -4178,7 +4183,8 @@ function SelectAsync({
4178
4183
  maxMenuHeight: 320,
4179
4184
  components: {
4180
4185
  DropdownIndicator,
4181
- ClearIndicator
4186
+ ClearIndicator,
4187
+ NoOptionsMessage
4182
4188
  },
4183
4189
  ...rest,
4184
4190
  styles: { ...selectStyles(colorMode, isError), ...styles },
@@ -4201,7 +4207,8 @@ function SelectAsyncCreatable({ styles, isError = false, ...rest }) {
4201
4207
  maxMenuHeight: 320,
4202
4208
  components: {
4203
4209
  DropdownIndicator,
4204
- ClearIndicator
4210
+ ClearIndicator,
4211
+ NoOptionsMessage
4205
4212
  },
4206
4213
  ...rest,
4207
4214
  styles: { ...selectStyles(colorMode, isError), ...styles },
@@ -4223,7 +4230,8 @@ function SelectCreatable({ styles, isError = false, ...rest }) {
4223
4230
  maxMenuHeight: 320,
4224
4231
  components: {
4225
4232
  DropdownIndicator,
4226
- ClearIndicator
4233
+ ClearIndicator,
4234
+ NoOptionsMessage
4227
4235
  },
4228
4236
  ...rest,
4229
4237
  styles: { ...selectStyles(colorMode, isError), ...styles },
@@ -4358,6 +4366,7 @@ var SelectCheckbox = (props) => {
4358
4366
  ClearIndicator,
4359
4367
  MultiValue,
4360
4368
  MultiValueRemove,
4369
+ NoOptionsMessage,
4361
4370
  Option: (optionProps) => {
4362
4371
  const { isSelected, data } = optionProps;
4363
4372
  const optionLength = (options == null ? void 0 : options.length) ? options.length - 1 : 0;
@@ -4400,8 +4409,8 @@ var Sidebar = ({ isCollapse, children, ...props }) => {
4400
4409
  flexDirection: "column",
4401
4410
  overflow: "hidden",
4402
4411
  shadow: "raised",
4412
+ initial: { width: isCollapse ? "62px" : width },
4403
4413
  animate: { width: isCollapse ? "62px" : width },
4404
- transition: "10ms linear",
4405
4414
  ...props,
4406
4415
  children
4407
4416
  }
@@ -4440,9 +4449,9 @@ var SidebarHeader = ({ isCollapse, setCollapse, title }) => {
4440
4449
  {
4441
4450
  as: import_framer_motion2.motion.div,
4442
4451
  boxSize: "4",
4452
+ initial: { rotate: 0, x: 8 },
4443
4453
  animate: { rotate: isCollapse ? 0 : -180, x: isCollapse ? 8 : 0 },
4444
- transition: "ease-in-out",
4445
- transitionDuration: "1ms",
4454
+ transitionTimingFunction: "linear",
4446
4455
  "aria-label": "toggle sidebar",
4447
4456
  children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_internal_icon8.ArrowRight, { size: 4, color: "inherit" })
4448
4457
  }
@@ -4479,130 +4488,142 @@ var Icon8 = __toESM(require("@ctlyst.id/internal-icon"));
4479
4488
  var import_framer_motion3 = require("framer-motion");
4480
4489
  var import_jsx_runtime60 = require("react/jsx-runtime");
4481
4490
  var SidebarMenu = ({ menu, isCollapse, mappingIcon: mappingIcon2, itemStyles, setActive, active }) => {
4482
- return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { as: import_framer_motion3.motion.div, animate: { padding: isCollapse ? "8px 16px" : "8px" }, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Accordion, { index: menu.findIndex((item) => item.children.some((child) => child.navLink === active)), children: menu.map((item) => {
4483
- const isActive = active == null ? void 0 : active.includes(item.navLink);
4484
- return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.AccordionItem, { mt: "4", children: ({ isExpanded }) => {
4485
- const isOpenOptions = isCollapse || !isCollapse && !isExpanded;
4486
- const noChild = !item.children.length;
4487
- const offsetStyle = isCollapse ? noChild ? [-5, 16] : [-1, 16] : [-1, 8];
4488
- return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_jsx_runtime60.Fragment, { children: [
4489
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Popover, { trigger: "hover", placement: "right-start", offset: offsetStyle, children: ({ isOpen, onClose }) => {
4490
- const activeOption = isOpen ? "primary.50" : "white";
4491
- const backgroundColor = isOpen && !isActive ? "primary.50" : "primary.100";
4492
- const activeParent = isActive ? backgroundColor : activeOption;
4491
+ return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
4492
+ import_react76.Box,
4493
+ {
4494
+ as: import_framer_motion3.motion.div,
4495
+ transitionTimingFunction: "linear",
4496
+ initial: { padding: "8px" },
4497
+ animate: { padding: isCollapse ? "8px 16px" : "8px" },
4498
+ children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Accordion, { index: menu.findIndex((item) => item.children.some((child) => child.navLink === active)), children: menu.map((item) => {
4499
+ const isActive = active == null ? void 0 : active.includes(item.navLink);
4500
+ return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.AccordionItem, { mt: "4", children: ({ isExpanded }) => {
4501
+ const isOpenOptions = isCollapse || !isCollapse && !isExpanded;
4502
+ const noChild = !item.children.length;
4503
+ const offsetStyle = isCollapse ? noChild ? [-5, 16] : [-1, 16] : [-1, 8];
4493
4504
  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_jsx_runtime60.Fragment, { children: [
4494
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
4495
- import_react76.AccordionButton,
4496
- {
4497
- "data-test-id": `CTA_button-accordion-${item.title}`,
4498
- p: "0",
4499
- h: "fit-content",
4500
- children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
4505
+ /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Popover, { trigger: "hover", placement: "right-start", offset: offsetStyle, children: ({ isOpen, onClose }) => {
4506
+ const activeOption = isOpen ? "primary.50" : "white";
4507
+ const backgroundColor = isOpen && !isActive ? "primary.50" : "primary.100";
4508
+ const activeParent = isActive ? backgroundColor : activeOption;
4509
+ return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_jsx_runtime60.Fragment, { children: [
4510
+ /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
4511
+ import_react76.AccordionButton,
4512
+ {
4513
+ "data-test-id": `CTA_button-accordion-${item.title}`,
4514
+ p: "0",
4515
+ h: "fit-content",
4516
+ children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
4517
+ NavItem,
4518
+ {
4519
+ as: import_framer_motion3.motion.div,
4520
+ transitionTimingFunction: "linear",
4521
+ justifyContent: isCollapse ? "center" : "space-between",
4522
+ isActive,
4523
+ bg: activeParent,
4524
+ "data-test-id": `CTA_nav-item-${item.title}`,
4525
+ onClick: () => setActive(item.children.length > 0 ? item.children[0].navLink : item.navLink),
4526
+ position: "relative",
4527
+ ...itemStyles,
4528
+ children: [
4529
+ mappingIcon2 && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { display: "flex", boxSize: "3", transition: "50ms linear", children: mappingIcon2.get(item.icon || "") }),
4530
+ !isCollapse && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
4531
+ import_react76.Box,
4532
+ {
4533
+ display: "flex",
4534
+ w: "full",
4535
+ alignItems: "center",
4536
+ justifyContent: "space-between",
4537
+ ml: "2",
4538
+ as: import_framer_motion3.motion.div,
4539
+ transition: "20ms linear",
4540
+ transitionTimingFunction: "linear",
4541
+ initial: { opacity: 0, x: 24 },
4542
+ animate: { opacity: 1, x: 0 },
4543
+ exit: { opacity: 0, x: 16 },
4544
+ children: [
4545
+ /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { h: "3.5", position: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Text, { textStyle: "text.xs", w: "max-content", position: "absolute", children: item.title }) }),
4546
+ !!item.children.length && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
4547
+ import_react76.Box,
4548
+ {
4549
+ display: "flex",
4550
+ boxSize: "3",
4551
+ as: import_framer_motion3.motion.div,
4552
+ transitionTimingFunction: "linear",
4553
+ animate: { transform: isExpanded ? "rotate(-180deg)" : "rotate(0)" },
4554
+ children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon8.ChevronDown, { size: 3 })
4555
+ }
4556
+ )
4557
+ ]
4558
+ }
4559
+ )
4560
+ ]
4561
+ },
4562
+ item.id
4563
+ )
4564
+ },
4565
+ item.id
4566
+ ) }, item.id),
4567
+ isOpenOptions && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Portal, { children: item.children.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_react76.PopoverContent, { w: "176px", borderColor: "neutral.200", bg: "white", rounded: "sm", children: [
4568
+ /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverHeader, { borderColor: "neutral.300", textStyle: "text.xs", p: "2", children: mappingIcon2 && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_react76.Box, { display: "flex", alignItems: "center", children: [
4569
+ mappingIcon2.get(item.icon || ""),
4570
+ /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { as: "span", ml: "2", children: item.title })
4571
+ ] }) }),
4572
+ !!item.children.length && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverBody, { pb: "1", px: "0", pt: "0", children: item.children.map((submenu) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
4573
+ NavItem,
4574
+ {
4575
+ "data-test-id": `CTA_Sidebar-popover-item-${submenu.id}`,
4576
+ isChild: true,
4577
+ isActive: active === submenu.navLink,
4578
+ onClick: () => {
4579
+ setActive(submenu.navLink);
4580
+ onClose();
4581
+ },
4582
+ rounded: "none",
4583
+ ...itemStyles,
4584
+ children: submenu.title
4585
+ },
4586
+ submenu.id
4587
+ )) })
4588
+ ] }) : isCollapse && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverContent, { w: "174px", borderColor: "neutral.200", bg: "white", rounded: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverBody, { py: "1", px: "0", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
4501
4589
  NavItem,
4502
4590
  {
4503
- as: import_framer_motion3.motion.div,
4504
- justifyContent: isCollapse ? "center" : "space-between",
4505
- isActive,
4506
- bg: activeParent,
4507
- "data-test-id": `CTA_nav-item-${item.title}`,
4508
- onClick: () => setActive(item.children.length > 0 ? item.children[0].navLink : item.navLink),
4509
- position: "relative",
4591
+ "data-test-id": `CTA_Sidebar-popover-item-${item.id}`,
4592
+ justifyContent: "flex-start",
4593
+ isActive: active === item.navLink,
4594
+ onClick: () => {
4595
+ setActive(item.navLink);
4596
+ onClose();
4597
+ },
4598
+ rounded: "none",
4510
4599
  ...itemStyles,
4511
4600
  children: [
4512
4601
  mappingIcon2 && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { display: "flex", boxSize: "3", transition: "50ms linear", children: mappingIcon2.get(item.icon || "") }),
4513
- !isCollapse && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
4514
- import_react76.Box,
4515
- {
4516
- display: "flex",
4517
- w: "full",
4518
- alignItems: "center",
4519
- justifyContent: "space-between",
4520
- ml: "2",
4521
- as: import_framer_motion3.motion.div,
4522
- transition: "20ms ease-in",
4523
- initial: { opacity: 0, x: 24 },
4524
- animate: { opacity: 1, x: 0 },
4525
- exit: { opacity: 0, x: 16 },
4526
- children: [
4527
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { h: "3.5", position: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Text, { textStyle: "text.xs", w: "max-content", position: "absolute", children: item.title }) }),
4528
- !!item.children.length && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
4529
- import_react76.Box,
4530
- {
4531
- display: "flex",
4532
- boxSize: "3",
4533
- as: import_framer_motion3.motion.div,
4534
- animate: { transform: isExpanded ? "rotate(-180deg)" : "rotate(0)" },
4535
- children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon8.ChevronDown, { size: 3 })
4536
- }
4537
- )
4538
- ]
4539
- }
4540
- )
4602
+ /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { h: "3.5", position: "relative", ml: "2", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Text, { textStyle: "text.xs", w: "max-content", position: "absolute", children: item.title }) })
4541
4603
  ]
4542
4604
  },
4543
4605
  item.id
4544
- )
4545
- },
4546
- item.id
4547
- ) }, item.id),
4548
- isOpenOptions && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Portal, { children: item.children.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_react76.PopoverContent, { w: "176px", borderColor: "neutral.200", bg: "white", rounded: "sm", children: [
4549
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverHeader, { borderColor: "neutral.300", textStyle: "text.xs", p: "2", children: mappingIcon2 && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_react76.Box, { display: "flex", alignItems: "center", children: [
4550
- mappingIcon2.get(item.icon || ""),
4551
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { as: "span", ml: "2", children: item.title })
4552
- ] }) }),
4553
- !!item.children.length && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverBody, { pb: "1", px: "0", pt: "0", children: item.children.map((submenu) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
4554
- NavItem,
4555
- {
4556
- "data-test-id": `CTA_Sidebar-popover-item-${submenu.id}`,
4557
- isChild: true,
4558
- isActive: active === submenu.navLink,
4559
- onClick: () => {
4560
- setActive(submenu.navLink);
4561
- onClose();
4562
- },
4563
- rounded: "none",
4564
- ...itemStyles,
4565
- children: submenu.title
4566
- },
4567
- submenu.id
4568
- )) })
4569
- ] }) : isCollapse && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverContent, { w: "174px", borderColor: "neutral.200", bg: "white", rounded: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.PopoverBody, { py: "1", px: "0", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
4606
+ ) }) }) })
4607
+ ] });
4608
+ } }, item.id),
4609
+ !isCollapse && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.AccordionPanel, { mt: "1", p: "0", children: item.children.map((submenu) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
4570
4610
  NavItem,
4571
4611
  {
4572
- "data-test-id": `CTA_Sidebar-popover-item-${item.id}`,
4573
- justifyContent: "flex-start",
4574
- isActive: active === item.navLink,
4575
- onClick: () => {
4576
- setActive(item.navLink);
4577
- onClose();
4578
- },
4579
- rounded: "none",
4612
+ mt: "1",
4613
+ "data-test-id": `CTA_Sidebar-accordion-item-${submenu.id}`,
4614
+ isActive: active === submenu.navLink,
4615
+ isChild: true,
4580
4616
  ...itemStyles,
4581
- children: [
4582
- mappingIcon2 && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { display: "flex", boxSize: "3", transition: "50ms linear", children: mappingIcon2.get(item.icon || "") }),
4583
- /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Box, { h: "3.5", position: "relative", ml: "2", children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.Text, { textStyle: "text.xs", w: "max-content", position: "absolute", children: item.title }) })
4584
- ]
4617
+ onClick: () => setActive(submenu.navLink),
4618
+ children: submenu.title
4585
4619
  },
4586
- item.id
4587
- ) }) }) })
4620
+ submenu.id
4621
+ )) })
4588
4622
  ] });
4589
- } }, item.id),
4590
- !isCollapse && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react76.AccordionPanel, { mt: "1", p: "0", children: item.children.map((submenu) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
4591
- NavItem,
4592
- {
4593
- mt: "1",
4594
- "data-test-id": `CTA_Sidebar-accordion-item-${submenu.id}`,
4595
- isActive: active === submenu.navLink,
4596
- isChild: true,
4597
- ...itemStyles,
4598
- onClick: () => setActive(submenu.navLink),
4599
- children: submenu.title
4600
- },
4601
- submenu.id
4602
- )) })
4603
- ] });
4604
- } }, item.id);
4605
- }) }) });
4623
+ } }, item.id);
4624
+ }) })
4625
+ }
4626
+ );
4606
4627
  };
4607
4628
  SidebarMenu.displayName = "SidebarMenu";
4608
4629
  SidebarMenu.defaultProps = {
@@ -7031,6 +7052,7 @@ var import_react101 = require("@chakra-ui/react");
7031
7052
  NavItem,
7032
7053
  Navbar,
7033
7054
  NavigationBar,
7055
+ NoOptionsMessage,
7034
7056
  OrderedList,
7035
7057
  Pagination,
7036
7058
  PaginationDetail,