@max-ts/components 0.2.1 → 0.2.2

package/lib/components/DataGrid/useLogic/utils/getGridTemplateColumns/getGridTemplateColumns.mjs

@@ -1,4 +1,4 @@
-const e = (t) => t.map(({ width: n }) => n || "1fr").join(" ");
+const t = (r) => r.map(({ width: n }) => typeof n == "number" ? `${n}px` : n || "1fr").join(" ");
 export {
-  e as getGridTemplateColumns
+  t as getGridTemplateColumns
 };

package/lib/components/Select/Select.d.ts

@@ -22,4 +22,4 @@ export type SelectProps<Value> = WithoutEmotionSpecific<Omit<MuiSelectProps<Valu
     error?: boolean;
     label?: string;
 };
-export declare const Select: <Value>({ required, getOptionLabel, placeholder, helperText, hideHelperText, loading, success, children, disabled, error, label, fullWidth, onChange: externalOnChange, isShowClearButton, ...props }: SelectProps<Value>) => import("react/jsx-runtime").JSX.Element;
+export declare function Select<Value>({ required, getOptionLabel, placeholder, helperText, hideHelperText, loading, success, children, disabled, error, label, fullWidth, onChange: externalOnChange, isShowClearButton, ...props }: SelectProps<Value>): import("react/jsx-runtime").JSX.Element;

package/lib/components/Select/Select.mjs

@@ -5,25 +5,26 @@ import { FormHelperText as R } from "../FormHelperText/FormHelperText.mjs";
 import "react";
 import "../FormHelperText/FormHelperTextContent/styles.mjs";
 import { MenuItem as w } from "../MenuItem/MenuItem.mjs";
-import { TagsList as D } from "../TagsList/TagsList.mjs";
-import { ChevronDown as H, ChevronUp as M } from "lucide-react";
-import { CLEAR_TEXT as f } from "./constants.mjs";
-import { StyledSelect as N, Placeholder as U, ProgressWrapper as V, EndAdornmentWrapper as W, StyledIconButton as C, StyledCloseFillSm as X } from "./styles.mjs";
-import { useLogic as _ } from "./useLogic/useLogic.mjs";
-const q = ({ onClick: s, disabled: e, ref: t }) => /* @__PURE__ */ r.jsx(
+import { TagsList as z } from "../TagsList/TagsList.mjs";
+import { ChevronDown as D, ChevronUp as H } from "lucide-react";
+import { CLEAR_TEXT as h } from "./constants.mjs";
+import { StyledSelect as M, Placeholder as N, ProgressWrapper as U, EndAdornmentWrapper as V, StyledIconButton as C, StyledCloseFillSm as W } from "./styles.mjs";
+import { useLogic as X } from "./useLogic/useLogic.mjs";
+const _ = ({ onClick: s, disabled: o, ref: t }) => /* @__PURE__ */ r.jsx(
   C,
   {
-    disabled: e,
+    disabled: o,
     ref: t,
     onClick: s,
     variant: "text",
-    title: f,
-    "aria-label": f,
-    children: /* @__PURE__ */ r.jsx(X, {})
+    title: h,
+    "aria-label": h,
+    children: /* @__PURE__ */ r.jsx(W, {})
   }
-), nr = ({
+);
+function nr({
   required: s,
-  getOptionLabel: e = (i) => i,
+  getOptionLabel: o = (i) => i,
   placeholder: t,
   helperText: d,
   hideHelperText: v = !1,
@@ -31,13 +32,13 @@ const q = ({ onClick: s, disabled: e, ref: t }) => /* @__PURE__ */ r.jsx(
   success: y,
   children: c,
   disabled: l,
-  error: p,
-  label: u,
+  error: u,
+  label: p,
   fullWidth: x,
   onChange: n,
   isShowClearButton: g,
   ...j
-}) => {
+}) {
   const {
     isOpened: i,
     isShowingClearButton: S,
@@ -46,16 +47,16 @@ const q = ({ onClick: s, disabled: e, ref: t }) => /* @__PURE__ */ r.jsx(
     openSelect: a,
     closeSelect: I,
     resetButtonRef: k
-  } = _({
+  } = X({
     ...j,
     children: c,
     onChange: n,
     isShowClearButton: g
-  }), B = (o) => {
-    if (Array.isArray(o) && o.length) {
-      const F = (h) => n?.(h ? {
+  }), B = (e) => {
+    if (Array.isArray(e) && e.length) {
+      const F = (f) => n?.(f ? {
         target: {
-          value: h
+          value: f
         }
       } : {
         target: {
@@ -63,22 +64,22 @@ const q = ({ onClick: s, disabled: e, ref: t }) => /* @__PURE__ */ r.jsx(
         }
       }, void 0);
       return /* @__PURE__ */ r.jsx(
-        D,
+        z,
         {
-          data: o,
+          data: e,
           keyId: "value",
-          getOptionLabel: e,
+          getOptionLabel: o,
           onChange: F,
           onClick: a
         }
       );
     }
-    return (Array.isArray(o) || typeof o == "string") && !o.length ? t : e(o);
+    return (Array.isArray(e) || typeof e == "string") && !e.length ? t : o(e);
   };
-  return /* @__PURE__ */ r.jsxs(T, { error: p, fullWidth: x, children: [
-    u && /* @__PURE__ */ r.jsx(L, { htmlFor: "grouped-select", required: s, children: u }),
+  return /* @__PURE__ */ r.jsxs(T, { error: u, fullWidth: x, children: [
+    p && /* @__PURE__ */ r.jsx(L, { htmlFor: "grouped-select", required: s, children: p }),
     /* @__PURE__ */ r.jsxs(
-      N,
+      M,
       {
         ...j,
         open: i,
@@ -90,9 +91,9 @@ const q = ({ onClick: s, disabled: e, ref: t }) => /* @__PURE__ */ r.jsx(
         displayEmpty: !0,
         fullWidth: x,
         onChange: n,
-        endAdornment: /* @__PURE__ */ r.jsxs(W, { children: [
+        endAdornment: /* @__PURE__ */ r.jsxs(V, { children: [
           S && /* @__PURE__ */ r.jsx(
-            q,
+            _,
             {
               disabled: l,
               ref: k,
@@ -105,21 +106,21 @@ const q = ({ onClick: s, disabled: e, ref: t }) => /* @__PURE__ */ r.jsx(
               variant: "text",
               disabled: l,
               onClick: a,
-              children: i ? /* @__PURE__ */ r.jsx(M, {}) : /* @__PURE__ */ r.jsx(H, {})
+              children: i ? /* @__PURE__ */ r.jsx(H, { size: 16 }) : /* @__PURE__ */ r.jsx(D, { size: 16 })
             }
           )
         ] }),
         children: [
-          /* @__PURE__ */ r.jsx(U, { value: "", children: t }),
-          m && /* @__PURE__ */ r.jsx(V, { children: /* @__PURE__ */ r.jsx(P, { color: "primary" }) }),
+          /* @__PURE__ */ r.jsx(N, { value: "", children: t }),
+          m && /* @__PURE__ */ r.jsx(U, { children: /* @__PURE__ */ r.jsx(P, { color: "primary" }) }),
           !m && c,
           !m && A && /* @__PURE__ */ r.jsx(w, { disabled: !0, children: "Нет данных" })
         ]
       }
     ),
-    !v && /* @__PURE__ */ r.jsx(R, { error: p, success: y, children: d })
+    !v && /* @__PURE__ */ r.jsx(R, { error: u, success: y, children: d })
   ] });
-};
+}
 export {
   nr as Select
 };

package/lib/components/Select/styles.d.ts

@@ -19,5 +19,5 @@ export declare const StyledIconButton: import('@emotion/styled').StyledComponent
     loading?: boolean;
 } & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
 export declare const StyledCloseFillSm: import('@emotion/styled').StyledComponent<Omit<import('lucide-react').LucideProps, "ref"> & import('react').RefAttributes<SVGSVGElement> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
-export declare const EndAdornmentWrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const EndAdornmentWrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
 export declare const StyledSelect: typeof Select;

package/lib/components/Select/styles.mjs

@@ -1,8 +1,8 @@
 import { styled as t, selectClasses as r, Select as o } from "@mui/material";
 import { CircleX as n } from "lucide-react";
-import { IconButton as l } from "../IconButton/IconButton.mjs";
-import { MenuItem as i } from "../MenuItem/MenuItem.mjs";
-const d = t("div")`
+import { IconButton as i } from "../IconButton/IconButton.mjs";
+import { MenuItem as l } from "../MenuItem/MenuItem.mjs";
+const c = t("div")`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -14,16 +14,17 @@ const d = t("div")`
 
     color: ${({ theme: e }) => e.palette.grey[900]};
   }
-`, g = t(i)`
+`, g = t(l)`
   display: none;
-`, m = t(l)`
-  background-color: transparent;
-
+`, m = t(i)`
+  padding: 0;
+  svg {
+    stroke: ${({ theme: e }) => e.palette.grey[600]};
+  }
   &:hover {
     background-color: transparent;
-
     svg {
-      fill: ${({ theme: e }) => e.palette.grey[700]};
+      stroke: ${({ theme: e }) => e.palette.grey[700]};
     }
   }
 
@@ -34,23 +35,24 @@ const d = t("div")`
 `, h = t(n)`
   width: 16px;
   height: 16px;
-
-  fill: ${({ theme: e }) => e.palette.grey[500]};
-`, f = t("div")`
+  padding: 0;
+`, y = t("div", {
+  label: "EndAdornmentWrapper"
+})`
   display: flex;
   align-items: center;
 
   margin-left: auto;
-`, y = t(o)`
+`, x = t(o)`
   .${r.select} {
     padding-right: ${({ theme: e }) => e.spacing(2)} !important;
   }
 `;
 export {
-  f as EndAdornmentWrapper,
+  y as EndAdornmentWrapper,
   g as Placeholder,
-  d as ProgressWrapper,
+  c as ProgressWrapper,
   h as StyledCloseFillSm,
   m as StyledIconButton,
-  y as StyledSelect
+  x as StyledSelect
 };

package/lib/components/Tag/styles.mjs

@@ -164,8 +164,8 @@ const f = {
   }
 
   .MuiChip-deleteIcon {
-    width: 20px;
-    height: 20px;
+    width: 16px;
+    height: 16px;
     margin: 0;
 
     color: ${c};

package/lib/theme/palette/palette.mjs

@@ -1,16 +1,16 @@
-import { componentsColors as F } from "./componentsColors/componentsColors.mjs";
+import { componentsColors as r } from "./componentsColors/componentsColors.mjs";
 const t = () => {
-  const r = {
+  const F = {
     primary: {
-      900: "#0F52B8",
-      800: "#2165CC",
-      700: "#1874FF",
-      600: "#2684FF",
-      500: "#4C9AFF",
-      400: "#70AEFF",
-      300: "#94C2FF",
-      200: "#C5DCFF",
-      100: "#E1EDFF"
+      900: "#213555",
+      800: "#2B3E6F",
+      700: "#3F51B5",
+      600: "#4C6FFF",
+      500: "#5F7DFF",
+      400: "#7C98FF",
+      300: "#99B2FF",
+      200: "#B7CCFF",
+      100: "#D0E1FF"
     },
     secondary: {
       800: "#55B8F0"
@@ -62,16 +62,16 @@ const t = () => {
       100: "#F0F4F7"
     },
     primary: {
-      main: r.primary[800],
-      dark: r.primary[900],
+      main: F.primary[800],
+      dark: F.primary[900],
       contrastText: "#FFF",
-      ...r.primary
+      ...F.primary
     },
     secondary: {
-      main: r.secondary[800],
-      dark: r.primary[900],
+      main: F.secondary[800],
+      dark: F.primary[900],
       contrastText: "#FFF",
-      ...r.secondary
+      ...F.secondary
     },
     background: {
       default: "#FFF",
@@ -117,7 +117,7 @@ const t = () => {
         contrastText: "#FFF"
       };
     },
-    components: F
+    components: r
   };
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@max-ts/components",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "browser": "./src/index.ts",
   "main": "./src/index.ts",
   "module": "./src/index.ts",