mayak-common-library 0.0.47 → 0.0.48

package/dist/index.d.mts

@@ -16,7 +16,7 @@ import { SliderProps } from '@mui/material/Slider/Slider';
 import { MenuItemProps } from '@mui/material/MenuItem/MenuItem';
 import { InputProps } from '@mui/material/Input';
 import { PatternFormatProps } from 'react-number-format/types/types';
-import { UseControllerProps } from 'react-hook-form';
+import { UseControllerProps, FieldValues } from 'react-hook-form';
 export { default as MapIcon } from '@/icons/map-search.svg';
 import { ListProps } from '@mui/material/List/List';
 import { CheckboxProps } from '@mui/material/Checkbox';
@@ -53,6 +53,7 @@ interface SelectProProps {
     fullWidth?: boolean;
     freeChildWidth?: boolean;
     isOpen?: boolean;
+    intermediateChild?: ReactElement;
 }
 declare const SelectPro: FC<PropsWithChildren & SelectProProps>;
 
@@ -215,7 +216,7 @@ type Values = {
     title: string;
 }[];
 
-interface ToggleButtonsMultipleProps<T> extends ToggleButtonGroupProps$1 {
+interface ToggleButtonsMultipleProps extends ToggleButtonGroupProps$1 {
     values: Values;
     textView?: boolean;
     collapseOnClick?: boolean;
@@ -223,7 +224,7 @@ interface ToggleButtonsMultipleProps<T> extends ToggleButtonGroupProps$1 {
     label?: string;
     flexDirection?: "row" | "col";
 }
-declare const ToggleButtonsWithLabel: <T extends object>(props: ToggleButtonsMultipleProps<T> & UseControllerProps<T>) => react_jsx_runtime.JSX.Element;
+declare const ToggleButtonsWithLabel: <T extends FieldValues>(props: ToggleButtonsMultipleProps & UseControllerProps<T>) => react_jsx_runtime.JSX.Element;
 
 declare const ToggleButton: FC<ToggleButtonProps & {
     textView?: boolean;

package/dist/index.d.ts

@@ -16,7 +16,7 @@ import { SliderProps } from '@mui/material/Slider/Slider';
 import { MenuItemProps } from '@mui/material/MenuItem/MenuItem';
 import { InputProps } from '@mui/material/Input';
 import { PatternFormatProps } from 'react-number-format/types/types';
-import { UseControllerProps } from 'react-hook-form';
+import { UseControllerProps, FieldValues } from 'react-hook-form';
 export { default as MapIcon } from '@/icons/map-search.svg';
 import { ListProps } from '@mui/material/List/List';
 import { CheckboxProps } from '@mui/material/Checkbox';
@@ -53,6 +53,7 @@ interface SelectProProps {
     fullWidth?: boolean;
     freeChildWidth?: boolean;
     isOpen?: boolean;
+    intermediateChild?: ReactElement;
 }
 declare const SelectPro: FC<PropsWithChildren & SelectProProps>;
 
@@ -215,7 +216,7 @@ type Values = {
     title: string;
 }[];
 
-interface ToggleButtonsMultipleProps<T> extends ToggleButtonGroupProps$1 {
+interface ToggleButtonsMultipleProps extends ToggleButtonGroupProps$1 {
     values: Values;
     textView?: boolean;
     collapseOnClick?: boolean;
@@ -223,7 +224,7 @@ interface ToggleButtonsMultipleProps<T> extends ToggleButtonGroupProps$1 {
     label?: string;
     flexDirection?: "row" | "col";
 }
-declare const ToggleButtonsWithLabel: <T extends object>(props: ToggleButtonsMultipleProps<T> & UseControllerProps<T>) => react_jsx_runtime.JSX.Element;
+declare const ToggleButtonsWithLabel: <T extends FieldValues>(props: ToggleButtonsMultipleProps & UseControllerProps<T>) => react_jsx_runtime.JSX.Element;
 
 declare const ToggleButton: FC<ToggleButtonProps & {
     textView?: boolean;

package/dist/index.js

@@ -303,7 +303,8 @@ var SelectPro = ({
   small = false,
   fullWidth = false,
   freeChildWidth = false,
-  isOpen
+  isOpen,
+  intermediateChild
 }) => {
   const [btn, setAnchorEl] = (0, import_react2.useState)(null);
   const [open, setOpen] = (0, import_react2.useState)(false);
@@ -368,39 +369,38 @@ var SelectPro = ({
         ]
       }
     ),
-    btn ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    btn ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       import_material4.Paper,
       {
         sx: {
           position: "absolute",
-          // width: "min-content",
-          width: freeChildWidth ? "fit-content" : !fullContainerWidth && btn ? (
-            // ? "fit-content" //(btn as HTMLButtonElement).offsetWidth
-            btn.offsetWidth
-          ) : "100%",
+          width: freeChildWidth ? "fit-content" : !fullContainerWidth && btn ? btn.offsetWidth : "100%",
           left: fullContainerWidth ? 0 : "initial",
           right: fullContainerWidth ? 0 : "initial",
           top: overButton ? 0 : "initial"
         },
-        className: `select ${open ? "select--open" : "select--close"} z-50 rounded-none  shadow-sm`,
-        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_material4.Box, { className: `flex flex-col py-3 px-4 gap-2`, children: [
-          overButton ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-            IconButton_default,
-            {
-              className: "bg-accent-silver p-1 self-end absolute",
-              onClick: handleClose,
-              children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(close_default, {})
-            }
-          ) : null,
-          childTitle ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-            import_material4.Typography,
-            {
-              className: "text-sm font-normal text-accent-silver-2",
-              children: childTitle
-            }
-          ) : null,
-          childrenWithHandleChange
-        ] })
+        className: `select ${open ? "select--open" : "select--close"} z-50 rounded-none shadow-none ${intermediateChild ? "mt-[1px]" : "m-0"}`,
+        children: [
+          intermediateChild ? intermediateChild : null,
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_material4.Box, { className: `flex flex-col py-3 px-4 gap-2 shadow-sm`, children: [
+            overButton ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              IconButton_default,
+              {
+                className: "bg-accent-silver p-1 self-end absolute",
+                onClick: handleClose,
+                children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(close_default, {})
+              }
+            ) : null,
+            childTitle ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              import_material4.Typography,
+              {
+                className: "text-sm font-normal text-accent-silver-2",
+                children: childTitle
+              }
+            ) : null,
+            childrenWithHandleChange
+          ] })
+        ]
       }
     ) : null
   ] }) });
@@ -413,7 +413,8 @@ var import_jsx_runtime9 = require("react/jsx-runtime");
 var StyledChip = (0, import_material5.styled)(import_material5.Chip)(({ theme: theme2 }) => ({
   borderRadius: theme2.shape.borderRadius,
   ".MuiChip-label": { padding: 0 },
-  ".MuiChip-icon": { margin: "0 6px 0 0" }
+  ".MuiChip-icon": { margin: "0 6px 0 0" },
+  ".MuiChip-deleteIcon": { margin: "0 0 0 10px" }
 }));
 var ChipViews = {
   black: "bg-accent-dark text-accent-white py-1.5 px-4",
@@ -425,9 +426,11 @@ var CustomChip = (props) => {
   const _a = props, { view } = _a, rest = __objRest(_a, ["view"]);
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     StyledChip,
-    __spreadValues({
-      className: `rounded-none w-fit h-fit px-2.5 py-0 text-14 ${ChipViews[view]}`
-    }, rest)
+    __spreadProps(__spreadValues({
+      className: `rounded-none w-fit px-2.5 py-0 text-14 h-[28px] ${ChipViews[view]}`
+    }, rest), {
+      deleteIcon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(close_default, {})
+    })
   );
 };
 var Chip_default = CustomChip;
@@ -1327,7 +1330,6 @@ var ToggleButtonsWithLabel = (props) => {
   } = props;
   const { field } = (0, import_react_hook_form3.useController)(props);
   const handleFormat = (_event, newFormats) => {
-    console.log(newFormats);
     if (newFormats !== null) field.onChange(newFormats);
     if (collapseOnClick && collapseParent) collapseParent();
   };
@@ -1364,7 +1366,7 @@ var BpCheckedIcon = (0, import_material31.styled)(BpIcon)({
     width: 16,
     height: 16,
     display: "flex",
-    alignItems: "center",
+    // alignItems: "center",
     justifyContent: "center",
     content: `url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 3.66667L4.82353 8L11 1' stroke='%23343434' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")`
   }
@@ -1375,7 +1377,7 @@ var CustomCheckbox = (props) => {
     return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       import_material31.FormControlLabel,
       __spreadProps(__spreadValues({
-        className: `w-fit bg-accent-silver px-3 py-0.5 ml-0 ${toggleView ? "gap-0" : "gap-x-1"} ${(checkboxProps == null ? void 0 : checkboxProps.checked) && toggleView && "!bg-accent-beige"}`,
+        className: `w-fit bg-accent-silver px-3 py-0.5 ml-0 h-[28px] ${toggleView ? "gap-0" : "gap-x-1"} ${(checkboxProps == null ? void 0 : checkboxProps.checked) && toggleView && "!bg-accent-beige"}`,
         control: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
           import_Checkbox.default,
           __spreadProps(__spreadValues({}, checkboxProps), {

package/dist/index.mjs

@@ -243,7 +243,8 @@ var SelectPro = ({
   small = false,
   fullWidth = false,
   freeChildWidth = false,
-  isOpen
+  isOpen,
+  intermediateChild
 }) => {
   const [btn, setAnchorEl] = useState2(null);
   const [open, setOpen] = useState2(false);
@@ -308,39 +309,38 @@ var SelectPro = ({
         ]
       }
     ),
-    btn ? /* @__PURE__ */ jsx7(
+    btn ? /* @__PURE__ */ jsxs3(
       Paper,
       {
         sx: {
           position: "absolute",
-          // width: "min-content",
-          width: freeChildWidth ? "fit-content" : !fullContainerWidth && btn ? (
-            // ? "fit-content" //(btn as HTMLButtonElement).offsetWidth
-            btn.offsetWidth
-          ) : "100%",
+          width: freeChildWidth ? "fit-content" : !fullContainerWidth && btn ? btn.offsetWidth : "100%",
           left: fullContainerWidth ? 0 : "initial",
           right: fullContainerWidth ? 0 : "initial",
           top: overButton ? 0 : "initial"
         },
-        className: `select ${open ? "select--open" : "select--close"} z-50 rounded-none  shadow-sm`,
-        children: /* @__PURE__ */ jsxs3(Box, { className: `flex flex-col py-3 px-4 gap-2`, children: [
-          overButton ? /* @__PURE__ */ jsx7(
-            IconButton_default,
-            {
-              className: "bg-accent-silver p-1 self-end absolute",
-              onClick: handleClose,
-              children: /* @__PURE__ */ jsx7(close_default, {})
-            }
-          ) : null,
-          childTitle ? /* @__PURE__ */ jsx7(
-            Typography2,
-            {
-              className: "text-sm font-normal text-accent-silver-2",
-              children: childTitle
-            }
-          ) : null,
-          childrenWithHandleChange
-        ] })
+        className: `select ${open ? "select--open" : "select--close"} z-50 rounded-none shadow-none ${intermediateChild ? "mt-[1px]" : "m-0"}`,
+        children: [
+          intermediateChild ? intermediateChild : null,
+          /* @__PURE__ */ jsxs3(Box, { className: `flex flex-col py-3 px-4 gap-2 shadow-sm`, children: [
+            overButton ? /* @__PURE__ */ jsx7(
+              IconButton_default,
+              {
+                className: "bg-accent-silver p-1 self-end absolute",
+                onClick: handleClose,
+                children: /* @__PURE__ */ jsx7(close_default, {})
+              }
+            ) : null,
+            childTitle ? /* @__PURE__ */ jsx7(
+              Typography2,
+              {
+                className: "text-sm font-normal text-accent-silver-2",
+                children: childTitle
+              }
+            ) : null,
+            childrenWithHandleChange
+          ] })
+        ]
       }
     ) : null
   ] }) });
@@ -353,7 +353,8 @@ import { jsx as jsx8 } from "react/jsx-runtime";
 var StyledChip = styled4(Chip)(({ theme: theme2 }) => ({
   borderRadius: theme2.shape.borderRadius,
   ".MuiChip-label": { padding: 0 },
-  ".MuiChip-icon": { margin: "0 6px 0 0" }
+  ".MuiChip-icon": { margin: "0 6px 0 0" },
+  ".MuiChip-deleteIcon": { margin: "0 0 0 10px" }
 }));
 var ChipViews = {
   black: "bg-accent-dark text-accent-white py-1.5 px-4",
@@ -365,9 +366,11 @@ var CustomChip = (props) => {
   const _a = props, { view } = _a, rest = __objRest(_a, ["view"]);
   return /* @__PURE__ */ jsx8(
     StyledChip,
-    __spreadValues({
-      className: `rounded-none w-fit h-fit px-2.5 py-0 text-14 ${ChipViews[view]}`
-    }, rest)
+    __spreadProps(__spreadValues({
+      className: `rounded-none w-fit px-2.5 py-0 text-14 h-[28px] ${ChipViews[view]}`
+    }, rest), {
+      deleteIcon: /* @__PURE__ */ jsx8(close_default, {})
+    })
   );
 };
 var Chip_default = CustomChip;
@@ -1191,7 +1194,9 @@ var ListItem_default = ListItem;
 
 // src/components/ToggleButton/ToggleButtonsWithLabel.tsx
 import { Stack as Stack6 } from "@mui/material";
-import { useController as useController3 } from "react-hook-form";
+import {
+  useController as useController3
+} from "react-hook-form";
 import Typography17 from "@mui/material/Typography";
 
 // src/components/ToggleButton/ToggleButtonGroup.tsx
@@ -1279,7 +1284,6 @@ var ToggleButtonsWithLabel = (props) => {
   } = props;
   const { field } = useController3(props);
   const handleFormat = (_event, newFormats) => {
-    console.log(newFormats);
     if (newFormats !== null) field.onChange(newFormats);
     if (collapseOnClick && collapseParent) collapseParent();
   };
@@ -1316,7 +1320,7 @@ var BpCheckedIcon = styled11(BpIcon)({
     width: 16,
     height: 16,
     display: "flex",
-    alignItems: "center",
+    // alignItems: "center",
     justifyContent: "center",
     content: `url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 3.66667L4.82353 8L11 1' stroke='%23343434' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")`
   }
@@ -1327,7 +1331,7 @@ var CustomCheckbox = (props) => {
     return /* @__PURE__ */ jsx47(
       FormControlLabel2,
       __spreadProps(__spreadValues({
-        className: `w-fit bg-accent-silver px-3 py-0.5 ml-0 ${toggleView ? "gap-0" : "gap-x-1"} ${(checkboxProps == null ? void 0 : checkboxProps.checked) && toggleView && "!bg-accent-beige"}`,
+        className: `w-fit bg-accent-silver px-3 py-0.5 ml-0 h-[28px] ${toggleView ? "gap-0" : "gap-x-1"} ${(checkboxProps == null ? void 0 : checkboxProps.checked) && toggleView && "!bg-accent-beige"}`,
         control: /* @__PURE__ */ jsx47(
           Checkbox,
           __spreadProps(__spreadValues({}, checkboxProps), {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mayak-common-library",
-  "version": "0.0.47",
+  "version": "0.0.48",
   "private": false,
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",