@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 +2 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +138 -116
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +138 -117
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
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
|
-
|
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)(
|
4483
|
-
|
4484
|
-
|
4485
|
-
|
4486
|
-
|
4487
|
-
|
4488
|
-
|
4489
|
-
|
4490
|
-
|
4491
|
-
|
4492
|
-
const
|
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.
|
4495
|
-
|
4496
|
-
|
4497
|
-
|
4498
|
-
|
4499
|
-
|
4500
|
-
|
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
|
-
|
4504
|
-
justifyContent:
|
4505
|
-
isActive,
|
4506
|
-
|
4507
|
-
|
4508
|
-
|
4509
|
-
|
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
|
-
|
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
|
-
|
4547
|
-
)
|
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
|
-
"
|
4573
|
-
|
4574
|
-
isActive: active ===
|
4575
|
-
|
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
|
-
|
4582
|
-
|
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
|
-
|
4587
|
-
)
|
4620
|
+
submenu.id
|
4621
|
+
)) })
|
4588
4622
|
] });
|
4589
|
-
} }, item.id)
|
4590
|
-
|
4591
|
-
|
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,
|