@apia/components 4.0.60 → 4.0.63

package/dist/index.d.ts

@@ -491,10 +491,11 @@ interface IConfirm {
     title?: string;
     size?: TModalSize;
     variant?: string;
+    htmlContent?: string;
 }
 declare const ConfirmModal: ({ onConfirm, onCancel, title, size, ...props }: IConfirm) => JSX.Element;
 
-type TApiaUtilConfirm = Pick<IConfirm, 'additionalButtons' | 'additionalButtonsOnRight' | 'cancelButtonText' | 'children' | 'className' | 'confirmButtonText' | 'confirmButtonVariant' | 'contentRef' | 'hideCancelButton' | 'hideConfirmButton' | 'title' | 'size' | 'variant'>;
+type TApiaUtilConfirm = Pick<IConfirm, 'additionalButtons' | 'additionalButtonsOnRight' | 'cancelButtonText' | 'children' | 'className' | 'confirmButtonText' | 'confirmButtonVariant' | 'contentRef' | 'hideCancelButton' | 'hideConfirmButton' | 'title' | 'size' | 'variant' | 'htmlContent'>;
 type TApiaUtilInnerConfirm = TApiaUtilConfirm & {
     id: string;
 } & Pick<IConfirm, 'onCancel' | 'onConfirm'>;
@@ -1194,6 +1195,20 @@ declare const FieldLabel: React$1.ForwardRefExoticComponent<{
     requiredMarkPosition?: "before" | "after";
 } & BoxProps & React$1.RefAttributes<HTMLDivElement>>;
 
+type SwitchMultipleOption<T extends string> = {
+    value: T;
+    label: string;
+};
+declare const SwitchMultiple: (<T extends string>({ options, defaultValue, value, onChange, variant, }: {
+    options: SwitchMultipleOption<T>[];
+    defaultValue?: T;
+    value?: T;
+    onChange: (ev: T) => unknown;
+    variant?: string;
+}) => React$1.JSX.Element) & {
+    displayName: string;
+};
+
 interface IAccordionItemButton {
     ariaLabel: string;
     /**
@@ -1601,7 +1616,7 @@ declare function useModal(configuration?: TUseModalConfiguration): {
     show: () => void;
 };
 
-declare const Confirm: ({ children, additionalButtons, additionalButtonsOnRight, cancelButtonText: cancelText, className, confirmButtonText: confirmText, confirmButtonVariant, contentRef, disabled, hideCancelButton, hideConfirmButton, isLoading, onCancel, onConfirm, variant, }: Omit<IConfirm, "title">) => React$1.JSX.Element;
+declare const Confirm: ({ children, additionalButtons, additionalButtonsOnRight, cancelButtonText: cancelText, className, confirmButtonText: confirmText, confirmButtonVariant, contentRef, disabled, hideCancelButton, hideConfirmButton, isLoading, onCancel, onConfirm, variant, htmlContent, }: Omit<IConfirm, "title">) => React$1.JSX.Element;
 
 interface IDialogButtonBar {
     children: React$1.ReactNode;
@@ -2616,5 +2631,5 @@ declare class Templater {
     parseString(content: string, options?: IAlterDefaultOptions): string | JSX.Element | JSX.Element[];
 }
 
-export { Accordion, AccordionAside, AccordionContext, AccordionItem, AccordionItemButton, AccordionItemContent, AccordionItemContext, AlertModal, ApiaFilter, ApiaUtil, ApiaUtilModalHandler, ApiaUtilTooltip, Aside, AsideLoader, AsidePanel, AutoEllipsis, Autocomplete, type AutocompleteCmpProps, AutocompleteController, type AutocompleteOption, type AutocompleteProps, AutogrowTextarea, BaseButton, BodyAside, CalendarModal, Captcha, CenteredHeaderButtons, Checkbox, CheckboxLabel, CollapsiblePanel, Confirm, ConfirmModal, ContainerWithHeader, DateInput, DeadSessionModal, DefaultAccordionItemButton, DefaultIconRenderer, DefaultTabsLabelRenderer, DialogButtonBar, Dropzone, FavoriteIcon, FieldErrorMessage, FieldLabel, FileCard, FilterConditionDTO, FilterDTO, FiltersStore, FloatingAside, FooterButtons, FooterResponsiveButtons, HamburguerMenu, Header, HeaderButtons, type IAccordionItemButton, type IAccordionItemProps, type IAccordionProps, type IAlert, type IApiaFilter, type IAsidePanel, type ICalendarModal, type IConfirm, type IDialogButtonBar, type IDialogHeader, type IField, type IFieldErrorMessage, type IFilterCondition, type IFilterDTOState, type IFilterValue, type IIconInput, type IMenuDefinition, type IOverlay, type IPagination, type IParameter, type IParametersGroup, type IRequiredMark, type IResponsiveComponent, type ISimpleButton, type ITableParameterProps, IconButton, IconInput, IconsList, Label, LabelBox, LinearLoader, LinearSpinnerLock, ListSkeletonLoader, Listbox, ListboxItem, LoaderSpinner, _default as MDRenderer, Modal, ModalContext, NumberInput, Overlay, Pagination, Parameter, type ParameterObject, type ParameterPossibleValue, ParameterRender, type ParameterRenderer, type ParameterRendererProps, type ParameterType, Parameters, type ParametersDefinition, ParametersGroup, type ParametersGroupRenderer, ParametersStore, ParametersTable, type Payload, Permissions, ProgressBar, RequiredMark, ScreenLocker, ShowResponsive, SimpleButton, SortableList, SortableListItem, SwitchCard, type TAccordionHandler, type TAccordionItemButton, type TApiaButtonType, type TApiaIconButton, type TCheckbox, type TCheckboxLabel, type TCssProps, type TDateProps, type TFieldLabel, type TFilterOp, type TFilterPayload, type TFilterType, type TFilterValue, type TFilterValueType, type TGetTabsController, type TIcon, type TIconButton, type TIconRenderer, type TIconSize, type TIconsList, type TListbox, type TMenuItem, type TModal, type TModalSize, type TNumberInput, type TNumberInputChangeEvent, type TOnClickNode, type TOnConfirmSelection, type TOnSelectionChange, type TOpenModal, type TParameterType, type TPickPoolForPermissions, type TPickUserForPermissions, type TSubmenu, type TTab, type TTabLabelRenderer as TTabRenderer, type TToolbarIconButton as TToolDefinition, type TTooltip, type TUploadHandlerProps, type TUploadInProgress, type TUploadedFile, type TUseModalConfiguration, type TVisualizationType, Tab, Tabs, TabsContent, TabsController, TabsList, Templater, Toolbar, ToolbarController, ToolbarIconButton, ToolbarInput, ToolbarSelect, ToolbarSeparator, ToolbarTextButton, UnstyledSortableList, UploadHandler, Uploader, WaiTypeAhead, getFieldErrorStyles, getFieldTouchedStyles, importComponent, isFavoriteIcon, isParametersGroup, makeResponsiveComponent, menuController, parseNumberInputValueToNumber, parseNumberValueToNumberInput, useAccordionContext, useCurrentTab, useMenu, useModal, useModalContext, useOtherTagButton, useTabsContext };
+export { Accordion, AccordionAside, AccordionContext, AccordionItem, AccordionItemButton, AccordionItemContent, AccordionItemContext, AlertModal, ApiaFilter, ApiaUtil, ApiaUtilModalHandler, ApiaUtilTooltip, Aside, AsideLoader, AsidePanel, AutoEllipsis, Autocomplete, type AutocompleteCmpProps, AutocompleteController, type AutocompleteOption, type AutocompleteProps, AutogrowTextarea, BaseButton, BodyAside, CalendarModal, Captcha, CenteredHeaderButtons, Checkbox, CheckboxLabel, CollapsiblePanel, Confirm, ConfirmModal, ContainerWithHeader, DateInput, DeadSessionModal, DefaultAccordionItemButton, DefaultIconRenderer, DefaultTabsLabelRenderer, DialogButtonBar, Dropzone, FavoriteIcon, FieldErrorMessage, FieldLabel, FileCard, FilterConditionDTO, FilterDTO, FiltersStore, FloatingAside, FooterButtons, FooterResponsiveButtons, HamburguerMenu, Header, HeaderButtons, type IAccordionItemButton, type IAccordionItemProps, type IAccordionProps, type IAlert, type IApiaFilter, type IAsidePanel, type ICalendarModal, type IConfirm, type IDialogButtonBar, type IDialogHeader, type IField, type IFieldErrorMessage, type IFilterCondition, type IFilterDTOState, type IFilterValue, type IIconInput, type IMenuDefinition, type IOverlay, type IPagination, type IParameter, type IParametersGroup, type IRequiredMark, type IResponsiveComponent, type ISimpleButton, type ITableParameterProps, IconButton, IconInput, IconsList, Label, LabelBox, LinearLoader, LinearSpinnerLock, ListSkeletonLoader, Listbox, ListboxItem, LoaderSpinner, _default as MDRenderer, Modal, ModalContext, NumberInput, Overlay, Pagination, Parameter, type ParameterObject, type ParameterPossibleValue, ParameterRender, type ParameterRenderer, type ParameterRendererProps, type ParameterType, Parameters, type ParametersDefinition, ParametersGroup, type ParametersGroupRenderer, ParametersStore, ParametersTable, type Payload, Permissions, ProgressBar, RequiredMark, ScreenLocker, ShowResponsive, SimpleButton, SortableList, SortableListItem, SwitchCard, SwitchMultiple, type SwitchMultipleOption, type TAccordionHandler, type TAccordionItemButton, type TApiaButtonType, type TApiaIconButton, type TCheckbox, type TCheckboxLabel, type TCssProps, type TDateProps, type TFieldLabel, type TFilterOp, type TFilterPayload, type TFilterType, type TFilterValue, type TFilterValueType, type TGetTabsController, type TIcon, type TIconButton, type TIconRenderer, type TIconSize, type TIconsList, type TListbox, type TMenuItem, type TModal, type TModalSize, type TNumberInput, type TNumberInputChangeEvent, type TOnClickNode, type TOnConfirmSelection, type TOnSelectionChange, type TOpenModal, type TParameterType, type TPickPoolForPermissions, type TPickUserForPermissions, type TSubmenu, type TTab, type TTabLabelRenderer as TTabRenderer, type TToolbarIconButton as TToolDefinition, type TTooltip, type TUploadHandlerProps, type TUploadInProgress, type TUploadedFile, type TUseModalConfiguration, type TVisualizationType, Tab, Tabs, TabsContent, TabsController, TabsList, Templater, Toolbar, ToolbarController, ToolbarIconButton, ToolbarInput, ToolbarSelect, ToolbarSeparator, ToolbarTextButton, UnstyledSortableList, UploadHandler, Uploader, WaiTypeAhead, getFieldErrorStyles, getFieldTouchedStyles, importComponent, isFavoriteIcon, isParametersGroup, makeResponsiveComponent, menuController, parseNumberInputValueToNumber, parseNumberValueToNumberInput, useAccordionContext, useCurrentTab, useMenu, useModal, useModalContext, useOtherTagButton, useTabsContext };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -17,6 +17,7 @@ import { makeObservable, observable, makeAutoObservable, reaction, isObservable,
 import { observer } from 'mobx-react-lite';
 import { Icon as Icon$1, icons, FileIcon, isIconName } from '@apia/icons';
 import { MenuDivider, SubMenu, MenuItem, ControlledMenu, useMenuState } from '@szhsin/react-menu';
+import axios from 'axios';
 import { shallowEqual } from '@apia/store';
 import AnimateHeight from 'react-animate-height';
 import { useUpdateEffect as useUpdateEffect$1, useScroll } from 'ahooks';
@@ -1884,7 +1885,8 @@ const Confirm = ({
   isLoading,
   onCancel,
   onConfirm,
-  variant
+  variant,
+  htmlContent
 }) => {
   const { descriptionId } = useModalContext();
   const showsCancelButton = onCancel && !hideCancelButton;
@@ -1901,7 +1903,7 @@ const Confirm = ({
       ...getVariant(variant ?? "layout.common.modals.confirm"),
       className: `${className ?? ""} confirm`,
       children: [
-        /* @__PURE__ */ jsx(Box, { ref: contentRef, className: "confirm__content", id: descriptionId, children }),
+        /* @__PURE__ */ jsx(Box, { ref: contentRef, className: "confirm__content", id: descriptionId, children: htmlContent ? /* @__PURE__ */ jsx(Box, { dangerouslySetInnerHTML: { __html: htmlContent } }) : children }),
         /* @__PURE__ */ jsxs(DialogButtonBar, { className: "confirm__buttonBar", children: [
           /* @__PURE__ */ jsx(
             Box,
@@ -3507,40 +3509,50 @@ const SearchBox = observer((props) => {
         },
         children: handler.state.options.map((c) => /* @__PURE__ */ jsx("option", { value: c.value, children: c.label }, c.value))
       }
-    ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
-        Input,
-        {
-          ...props,
-          className: `autocomplete__search ${handler.state.disabled ? "disabled" : ""} ${handler.state.readOnly ? "readOnly" : ""}`,
-          onChange: async (ev) => {
-            handler.search(ev.target.value);
-          },
-          onClick: () => {
-            handler.state.width = boxRef.current?.getBoundingClientRect().width ?? handler.state.width;
-            handler.toggleOpen();
-          },
-          onFocus: (ev) => {
-            ev.target.setSelectionRange(0, ev.target.value.length);
-          },
-          onBlur: () => {
-            handler.close();
-          },
-          value: handler.state.showValue
-        }
-      ),
-      /* @__PURE__ */ jsxs(Box, { className: "autocomplete__icons", children: [
-        handler.state.loading && /* @__PURE__ */ jsx(Spinner, { className: "autocomplete__loadingSpinner" }),
-        /* @__PURE__ */ jsx(
-          Icon$1,
-          {
-            title: "",
-            name: handler.state?.icon || "ArrowDown",
-            className: "autocomplete__downArrow"
-          }
-        )
-      ] })
-    ] })
+    ) : /* @__PURE__ */ jsxs(
+      Box,
+      {
+        sx: { display: "flex", flexDirection: "row", alignItems: "center" },
+        onClick: () => {
+          handler.state.width = boxRef.current?.getBoundingClientRect().width ?? handler.state.width;
+          handler.toggleOpen();
+        },
+        children: [
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              ...props,
+              className: `autocomplete__search ${handler.state.disabled ? "disabled" : ""} ${handler.state.readOnly ? "readOnly" : ""}`,
+              onChange: async (ev) => {
+                handler.search(ev.target.value);
+              },
+              onClick: () => {
+                handler.state.width = boxRef.current?.getBoundingClientRect().width ?? handler.state.width;
+                handler.toggleOpen();
+              },
+              onFocus: (ev) => {
+                ev.target.setSelectionRange(0, ev.target.value.length);
+              },
+              onBlur: () => {
+                handler.close();
+              },
+              value: handler.state.showValue
+            }
+          ),
+          /* @__PURE__ */ jsxs(Box, { className: "autocomplete__icons", children: [
+            handler.state.loading && /* @__PURE__ */ jsx(Spinner, { className: "autocomplete__loadingSpinner" }),
+            /* @__PURE__ */ jsx(
+              Icon$1,
+              {
+                title: "",
+                name: handler.state?.icon || "ArrowDown",
+                className: "autocomplete__downArrow"
+              }
+            )
+          ] })
+        ]
+      }
+    )
   ] });
 });
 
@@ -3650,15 +3662,25 @@ const AutogrowTextarea = observer(
         const bounding = el.getBoundingClientRect();
         if (bounding.width > 0) {
           clearInterval(interval);
+          const style = window.getComputedStyle(el);
           const copy = el.cloneNode(true);
-          copy.style.opacity = "0";
+          copy.style.boxSizing = style.boxSizing;
+          copy.style.padding = style.padding;
+          copy.style.border = style.border;
+          copy.style.lineHeight = style.lineHeight;
+          copy.style.font = style.font;
+          copy.style.whiteSpace = style.whiteSpace;
           copy.style.position = "fixed";
           copy.style.left = "-9999px";
-          copy.style.width = `${bounding.width}px`;
-          copy.style.height = "1px";
+          copy.style.top = "0";
+          copy.style.height = "auto";
+          copy.style.opacity = "0";
+          copy.style.overflow = "hidden";
+          copy.style.width = `${el.clientWidth}px`;
           document.body.append(copy);
-          el.style.height = `${copy.scrollHeight + 5}px`;
+          const height = copy.scrollHeight;
           copy.remove();
+          el.style.height = `${height + 5}px`;
         }
       };
       const interval = setInterval(update, 100);
@@ -4688,6 +4710,39 @@ const FieldLabel = forwardRef(
 );
 FieldLabel.displayName = "FieldLabel";
 
+const SwitchMultiple = observer(
+  ({
+    options,
+    defaultValue,
+    value,
+    onChange,
+    variant
+  }) => {
+    const actualValue = value ?? defaultValue;
+    return /* @__PURE__ */ jsx(
+      Box,
+      {
+        ...getVariant(variant ?? "layout.validations.fields.switchMultiple"),
+        children: options.map((o, idx) => {
+          const active = actualValue === o.value;
+          return /* @__PURE__ */ jsx(
+            Button,
+            {
+              className: `switchButton ${active ? "active" : ""} ${idx === 0 ? "first" : idx === options.length - 1 ? "last" : "middle"}`,
+              type: "button",
+              onClick: () => {
+                onChange(o.value);
+              },
+              children: o.label
+            },
+            o.value
+          );
+        })
+      }
+    );
+  }
+);
+
 const Checkbox = (props) => {
   return /* @__PURE__ */ jsx(
     Box,
@@ -4987,6 +5042,7 @@ const DefaultAccordionItemButton = (props) => {
             }
           ),
           (props.label ?? props.title ?? props.ariaLabel).split(" | ").map((content, i) => {
+            console.log(props, content, i);
             if (typeof props.isHtml === "boolean" && props.isHtml || Array.isArray(props.isHtml) && props.isHtml[i]) {
               return /* @__PURE__ */ jsx(
                 Box,
@@ -9624,6 +9680,9 @@ class TabsController {
     if (tab && tabProps) {
       if (!tabProps.isClosable && !force)
         return false;
+      await axios.post(
+        window.CONTEXT + "/apia.splash.MenuAction.run?action=removeTab&isAjax=true&tabId=" + tabId + window.TAB_ID_REQUEST
+      );
       const { onBeforeClose } = tabProps;
       if (onBeforeClose) {
         const canClose = await onBeforeClose();
@@ -11418,5 +11477,5 @@ const _FiltersStore = class _FiltersStore {
 __publicField(_FiltersStore, "instance", new _FiltersStore());
 let FiltersStore = _FiltersStore;
 
-export { Accordion, AccordionAside, AccordionContext, AccordionItem, AccordionItemButton, AccordionItemContent, AccordionItemContext, AlertModal, ApiaFilter, ApiaUtil, ApiaUtilModalHandler, ApiaUtilTooltip, Aside, AsideLoader, AsidePanel, AutoEllipsis, Autocomplete, AutocompleteController, AutogrowTextarea, BaseButton, BodyAside, CalendarModal, Captcha, CenteredHeaderButtons, Checkbox$1 as Checkbox, CheckboxLabel, CollapsiblePanel, Confirm, ConfirmModal, ContainerWithHeader, DateInput, DeadSessionModal, DefaultIconRenderer, DefaultTabsLabelRenderer, DialogButtonBar, Dropzone, FavoriteIcon, FieldErrorMessage, FieldLabel, FileCard, FilterConditionDTO, FilterDTO, FiltersStore, FloatingAside, FooterButtons, FooterResponsiveButtons, HamburguerMenu, Header, HeaderButtons, IconButton, IconInput, IconsList, Label, LabelBox, LinearLoader, LinearSpinnerLock, ListSkeletonLoader, Listbox, ListboxItem, LoaderSpinner, index as MDRenderer, Modal, ModalContext, NumberInput, Overlay, Pagination, Parameter, ParameterRender, Parameters, ParametersGroup, ParametersStore, ParametersTable, Permissions, ProgressBar, RequiredMark, ScreenLocker, ShowResponsive, SimpleButton, SortableList, SortableListItem, SwitchCard, Tab, Tabs, TabsContent, TabsController, TabsList, Templater, Toolbar, ToolbarController, ToolbarIconButton, ToolbarInput, ToolbarSelect, ToolbarSeparator, ToolbarTextButton, UnstyledSortableList, UploadHandler, Uploader, WaiTypeAhead, getFieldErrorStyles, getFieldTouchedStyles, importComponent, isFavoriteIcon, isParametersGroup, makeResponsiveComponent, menuController, parseNumberInputValueToNumber, parseNumberValueToNumberInput, useAccordionContext, useCurrentTab, useMenu, useModal, useModalContext, useOtherTagButton, useTabsContext };
+export { Accordion, AccordionAside, AccordionContext, AccordionItem, AccordionItemButton, AccordionItemContent, AccordionItemContext, AlertModal, ApiaFilter, ApiaUtil, ApiaUtilModalHandler, ApiaUtilTooltip, Aside, AsideLoader, AsidePanel, AutoEllipsis, Autocomplete, AutocompleteController, AutogrowTextarea, BaseButton, BodyAside, CalendarModal, Captcha, CenteredHeaderButtons, Checkbox$1 as Checkbox, CheckboxLabel, CollapsiblePanel, Confirm, ConfirmModal, ContainerWithHeader, DateInput, DeadSessionModal, DefaultIconRenderer, DefaultTabsLabelRenderer, DialogButtonBar, Dropzone, FavoriteIcon, FieldErrorMessage, FieldLabel, FileCard, FilterConditionDTO, FilterDTO, FiltersStore, FloatingAside, FooterButtons, FooterResponsiveButtons, HamburguerMenu, Header, HeaderButtons, IconButton, IconInput, IconsList, Label, LabelBox, LinearLoader, LinearSpinnerLock, ListSkeletonLoader, Listbox, ListboxItem, LoaderSpinner, index as MDRenderer, Modal, ModalContext, NumberInput, Overlay, Pagination, Parameter, ParameterRender, Parameters, ParametersGroup, ParametersStore, ParametersTable, Permissions, ProgressBar, RequiredMark, ScreenLocker, ShowResponsive, SimpleButton, SortableList, SortableListItem, SwitchCard, SwitchMultiple, Tab, Tabs, TabsContent, TabsController, TabsList, Templater, Toolbar, ToolbarController, ToolbarIconButton, ToolbarInput, ToolbarSelect, ToolbarSeparator, ToolbarTextButton, UnstyledSortableList, UploadHandler, Uploader, WaiTypeAhead, getFieldErrorStyles, getFieldTouchedStyles, importComponent, isFavoriteIcon, isParametersGroup, makeResponsiveComponent, menuController, parseNumberInputValueToNumber, parseNumberValueToNumberInput, useAccordionContext, useCurrentTab, useMenu, useModal, useModalContext, useOtherTagButton, useTabsContext };
 //# sourceMappingURL=index.js.map