@ctlyst.id/internal-ui 3.1.8 → 3.1.9

package/dist/index.mjs

@@ -930,7 +930,6 @@ import { Box as Box11, Checkbox as Checkbox2, Flex as Flex2, Skeleton as Skeleto
 import { css } from "@emotion/react";
 import { flexRender, getCoreRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
 import * as React5 from "react";
-import { useRef } from "react";
 import { jsx as jsx24, jsxs as jsxs8 } from "react/jsx-runtime";
 var isCellDisabled = (row, cellId) => {
   if (row.disabled) {
@@ -1146,13 +1145,11 @@ var DataTable = React5.forwardRef((props, ref) => {
       }
     ),
     /* @__PURE__ */ jsx24(Tbody, { ...styles == null ? void 0 : styles.tableBody, children: table.getRowModel().rows.map((row) => {
-      const trRef = useRef();
       return /* @__PURE__ */ jsx24(
         Tr,
         {
           "data-test-id": "-RU0hNYGRzeVM3HQ4cXHl",
           tabindex: "0",
-          ref: trRef,
           ...styles == null ? void 0 : styles.tableRow,
           css: css`
                     &:last-child {
@@ -1161,13 +1158,13 @@ var DataTable = React5.forwardRef((props, ref) => {
                       }
                     }
                   `,
-          onMouseDown: () => {
+          onMouseDown: (e) => {
             var _a;
-            (_a = trRef.current) == null ? void 0 : _a.setAttribute("data-active", "true");
+            (_a = e.currentTarget) == null ? void 0 : _a.setAttribute("data-active", "true");
           },
-          onMouseUp: () => {
+          onMouseUp: (e) => {
             var _a;
-            (_a = trRef.current) == null ? void 0 : _a.removeAttribute("data-active");
+            (_a = e.currentTarget) == null ? void 0 : _a.removeAttribute("data-active");
           },
           onClick: () => {
             if (onRowClick) {
@@ -3855,6 +3852,9 @@ function selectStyles(colorMode, _isError) {
     placeholder: (base) => {
       return { ...base, ...selectStyle, color: "var(--chakra-colors-black-low)" };
     },
+    clearIndicator: (base) => {
+      return { ...base, cursor: "pointer" };
+    },
     multiValue: (base) => {
       return {
         ...base,
@@ -3912,10 +3912,11 @@ function Select2({
   ...rest
 }) {
   const { colorMode } = useColorMode3();
-  const { components } = rest;
+  const { components, value, onChange } = rest;
   return /* @__PURE__ */ jsx53(
     ReactSelect,
     {
+      "data-test-id": "",
       classNamePrefix: "react-select",
       components: {
         DropdownIndicator,
@@ -3924,6 +3925,8 @@ function Select2({
         MultiValueRemove,
         ...components
       },
+      value,
+      onChange,
       styles: { ...selectStyles(colorMode, isError) },
       theme: themeSelect,
       ...rest
@@ -4095,21 +4098,24 @@ var SelectWithCheckboxBase = ({
   isError = false,
   components,
   options,
+  onChange,
+  value,
   ...rest
 }) => {
   const { colorMode } = useColorMode7();
   return /* @__PURE__ */ jsx57(
     ReactSelect2,
     {
+      "data-test-id": "",
       classNamePrefix: "react-select",
       options,
+      value,
+      onChange,
       styles: { ...selectStyles(colorMode, !!isError) },
       theme: themeSelect,
       closeMenuOnSelect: false,
       hideSelectedOptions: false,
-      components: {
-        ...components
-      },
+      components,
       ...rest
     }
   );
@@ -4117,24 +4123,29 @@ var SelectWithCheckboxBase = ({
 var SelectCheckbox = (props) => {
   const { isMulti, options, value, components, ...rest } = props;
   const selectValue = value || [];
+  const defaultComponents = {
+    DropdownIndicator,
+    ClearIndicator,
+    MultiValue,
+    MultiValueRemove,
+    Option: (optionProps) => {
+      const { isSelected, data } = optionProps;
+      const optionLength = (options == null ? void 0 : options.length) ? options.length - 1 : 0;
+      const selectedValue = isSelected ? CHECKBOX_STATE.CHECKED : CHECKBOX_STATE.UNCHECKED;
+      const checkedState = data.selectAllCheckbox ? getSelectAllCheckboxState(selectValue == null ? void 0 : selectValue.length, optionLength) : selectedValue;
+      return /* @__PURE__ */ jsx57(InputOption, { ...optionProps, checkedState });
+    }
+  };
   return /* @__PURE__ */ jsx57(
     SelectWithCheckboxBase,
     {
+      "data-test-id": "",
       isMulti,
       options,
+      value,
       components: {
-        DropdownIndicator,
-        ClearIndicator,
-        MultiValue,
-        MultiValueRemove,
-        ...components,
-        Option: (optionProps) => {
-          const { isSelected, data } = optionProps;
-          const optionLength = (options == null ? void 0 : options.length) ? options.length - 1 : 0;
-          const selectedValue = isSelected ? CHECKBOX_STATE.CHECKED : CHECKBOX_STATE.UNCHECKED;
-          const checkedState = data.selectAllCheckbox ? getSelectAllCheckboxState(selectValue == null ? void 0 : selectValue.length, optionLength) : selectedValue;
-          return /* @__PURE__ */ jsx57(InputOption, { ...optionProps, checkedState });
-        }
+        ...defaultComponents,
+        ...components
       },
       ...rest
     }
@@ -4744,7 +4755,7 @@ import {
   UnorderedList as UnorderedList2
 } from "@chakra-ui/react";
 import { Close as X, Plus } from "@ctlyst.id/internal-icon";
-import { useCallback as useCallback2, useEffect as useEffect2, useRef as useRef2, useState as useState4 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect2, useRef, useState as useState4 } from "react";
 import { useDropzone } from "react-dropzone";
 
 // src/components/uploader/constants.ts
@@ -4804,7 +4815,7 @@ var Uploader = ({
   size: size2 = "lg",
   ...props
 }) => {
-  const inputRef = useRef2(null);
+  const inputRef = useRef(null);
   const [filePreview, setFilePreview] = useState4();
   const toast2 = useToast();
   const handleRejection = useCallback2(
@@ -6692,7 +6703,7 @@ import { useMemo as useMemo5 } from "react";
 
 // src/provider/components/provider.tsx
 import axios from "axios";
-import { createContext as createContext2, useContext, useEffect as useEffect3, useMemo as useMemo4, useRef as useRef3 } from "react";
+import { createContext as createContext2, useContext, useEffect as useEffect3, useMemo as useMemo4, useRef as useRef2 } from "react";
 import { ToastContainer as ToastContainer2 } from "react-toastify";
 import { jsx as jsx66, jsxs as jsxs31 } from "react/jsx-runtime";
 var ProviderContext = createContext2({
@@ -6703,7 +6714,7 @@ var useInternalUI = () => {
   return { instance };
 };
 var Provider = ({ children, config: config2, requestInterceptors, responseInterceptors }) => {
-  const instanceRef = useRef3(axios.create(config2));
+  const instanceRef = useRef2(axios.create(config2));
   useEffect3(() => {
     requestInterceptors == null ? void 0 : requestInterceptors.forEach((interceptor) => {
       instanceRef.current.interceptors.request.use(interceptor);