dirk-cfx-react 1.1.8 → 1.1.10

package/dist/index.js

@@ -2,7 +2,7 @@ import React3, { createContext, useEffect, useRef, useState, useContext, useMemo
 import { create, useStore, createStore } from 'zustand';
 import axios from 'axios';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { Flex, Text, Image as Image$1, createTheme, Box, Code, useMantineTheme, Progress, RingProgress, Button, MantineProvider, BackgroundImage } from '@mantine/core';
+import { Flex, Text, Image as Image$1, createTheme, Box, Code, useMantineTheme, alpha, Progress, RingProgress, Button, MantineProvider, BackgroundImage } from '@mantine/core';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { motion, AnimatePresence, useMotionValue } from 'framer-motion';
 import clickSoundUrl from './click_sound-PNCRRTM4.mp3';
@@ -1144,7 +1144,7 @@ function InputContainer(props) {
       direction: "column",
       h: props.h,
       gap: props.title ? "xs" : 0,
-      bg: props.bg || colorWithAlpha("var(--mantine-color-dark-9)", 0.65),
+      bg: props.bg || alpha(theme2.colors.dark[9], 0.65),
       p: props.p || "sm",
       style: {
         borderRadius: theme2.radius.xs,
@@ -2238,6 +2238,20 @@ var error = {
   fontSize: "var(--mantine-font-size-xs)",
   fontFamily: "Akrobat Regular"
 };
+var description = {
+  fontSize: "var(--mantine-font-size-xs)"
+};
+var genericInputStyles = {
+  styles: {
+    label,
+    error,
+    description,
+    input: {
+      backgroundColor: "rgba(76, 76, 76, 0.3)",
+      minHeight: "4vh"
+    }
+  }
+};
 var theme = createTheme({
   primaryColor: "dirk",
   primaryShade: 9,
@@ -2291,27 +2305,14 @@ var theme = createTheme({
         }
       }
     },
-    Textarea: {
-      styles: {
-        label,
-        error
-      }
-    },
-    Button: {
-      styles: {
-        root: {
-          fontSize: "var(--mantine-font-size-xs)"
-        }
-      }
-    },
-    Select: {
-      styles: {
-        label,
-        input: {
-          padding: "var(--mantine-spacing-sm)"
-        }
-      }
-    },
+    Input: genericInputStyles,
+    TextInput: genericInputStyles,
+    NumberInput: genericInputStyles,
+    Select: genericInputStyles,
+    MultiSelect: genericInputStyles,
+    Textarea: genericInputStyles,
+    ColorInput: genericInputStyles,
+    DateInput: genericInputStyles,
     Pill: {
       styles: (theme2) => ({
         root: {
@@ -2323,52 +2324,12 @@ var theme = createTheme({
           textTransform: "uppercase",
           letterSpacing: "0.05em",
           fontFamily: "Akrobat Bold",
-          fontSize: theme2.fontSizes.xs,
+          fontSize: "1.25vh",
           borderRadius: theme2.defaultRadius,
-          padding: `${theme2.spacing.xs} ${theme2.spacing.sm}`
+          paddingBottom: "0.5vh",
+          paddingTop: "0.5vh"
         }
       })
-    },
-    Input: {
-      styles: {
-        label,
-        error,
-        input: {
-          padding: "var(--mantine-spacing-sm)",
-          backgroundColor: "rgba(76, 76, 76, 0.3)"
-        }
-      }
-    },
-    ColorInput: {
-      styles: {
-        label,
-        input: {
-          padding: "var(--mantine-spacing-sm)"
-        }
-      }
-    },
-    TextInput: {
-      styles: {
-        label,
-        wrapper: {},
-        section: {
-          marginRight: "0.2vh"
-        },
-        input: {
-          padding: "var(--mantine-spacing-sm)"
-        }
-      }
-    },
-    NumberInput: {
-      styles: {
-        label,
-        input: {
-          padding: "var(--mantine-spacing-sm)"
-        },
-        section: {
-          pointerEvents: "all"
-        }
-      }
     }
   },
   colors: {