@monolith-forensics/monolith-ui 1.0.12 → 1.1.0

package/package.json

@@ -1,23 +1,17 @@
 {
   "name": "@monolith-forensics/monolith-ui",
-  "version": "1.0.12",
-  "description": "UI used for Monolith Apps",
-  "main": "index.js",
-  "type": "module",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "compile": "rollup -c"
-  },
+  "version": "1.1.0",
+  "main": "./dist/index.js",
+  "author": "Matt Danner (Monolith Forensics LLC)",
+  "license": "private",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/Monolith-Forensics/monolith-ui.git"
+    "url": "git+"
   },
-  "author": "Matt Danner, Monolith Forensics LLC",
-  "license": "ISC",
-  "bugs": {
-    "url": "https://github.com/Monolith-Forensics/monolith-ui/issues"
+  "types": "index.d.ts",
+  "scripts": {
+    "prepublish": "rm -r ./dist && tsc"
   },
-  "homepage": "https://github.com/Monolith-Forensics/monolith-ui#readme",
   "dependencies": {
     "@floating-ui/react": "^0.26.16",
     "@radix-ui/react-tooltip": "^1.0.7",
@@ -26,12 +20,10 @@
     "react-textarea-autosize": "^8.5.3",
     "styled-components": "^6.1.11"
   },
+  "peerDependencies": {
+    "react": "18.2.0"
+  },
   "devDependencies": {
-    "@rollup/plugin-typescript": "^11.1.6",
-    "@types/react": "^18.3.2",
-    "react": "^18.3.1",
-    "rollup": "^4.18.0",
-    "tslib": "^2.6.2",
-    "typescript": "^5.4.5"
+    "typescript": "^5.5.4"
   }
 }

package/{src/components/theme → theme}/components.js

@@ -26,8 +26,6 @@ const components = {
     styleOverrides: {
       root: {
         borderRadius: "0px",
-        // boxShadow:
-        //   "rgba(50, 50, 93, 0.025) 0px 2px 5px -1px, rgba(0, 0, 0, 0.05) 0px 1px 3px -1px",
         boxShadow:
           "0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%) !important",
         backgroundImage: "none",

package/{src/components/theme → theme}/index.js

@@ -51,7 +51,6 @@ const createTheme = (name) => {
       // @ts-ignore
       components: componentsStyled,
       typography: typography,
-      // shadows: shadows,
       palette: themeConfig.palette,
       zIndex: {
         mobileStepper: 1800,

package/{src/components/theme → theme}/variants.js

@@ -41,7 +41,6 @@ const defaultVariant = {
       contrastText: "#FFF",
     },
     background: {
-      // default: "#F7F9FC",
       default: "#FFF",
       paper: "#FFF",
       alt: "#ededed",

package/tsconfig.json

@@ -1,4 +1,5 @@
 {
+  "exclude": ["node_modules", "dist"],
   "compilerOptions": {
     /* Visit https://aka.ms/tsconfig to read more about this file */
 
@@ -11,9 +12,9 @@
     // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
 
     /* Language and Environment */
-    "target": "ES2016" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
+    "target": "es2016" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
     // "lib": [],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */
-    "jsx": "react" /* Specify what JSX code is generated. */,
+    "jsx": "react-jsx" /* Specify what JSX code is generated. */,
     // "experimentalDecorators": true,                   /* Enable experimental support for legacy experimental decorators. */
     // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
     // "jsxFactory": "",                                 /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
@@ -25,9 +26,9 @@
     // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
 
     /* Modules */
-    "module": "ESNext" /* Specify what module code is generated. */,
+    "module": "commonjs" /* Specify what module code is generated. */,
     // "rootDir": "./",                                  /* Specify the root folder within your source files. */
-    "moduleResolution": "node" /* Specify how TypeScript looks up a file from a given module specifier. */,
+    // "moduleResolution": "node10",                     /* Specify how TypeScript looks up a file from a given module specifier. */
     // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
     // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
     // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
@@ -51,15 +52,14 @@
     /* Emit */
     "declaration": true /* Generate .d.ts files from TypeScript and JavaScript files in your project. */,
     // "declarationMap": true,                           /* Create sourcemaps for d.ts files. */
-    "emitDeclarationOnly": true /* Only output d.ts files and not JavaScript files. */,
-    "sourceMap": true /* Create source map files for emitted JavaScript files. */,
+    // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
+    // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
     // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
     // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
-    "outDir": "dist" /* Specify an output folder for all emitted files. */,
+    "outDir": "./dist" /* Specify an output folder for all emitted files. */,
     // "removeComments": true,                           /* Disable emitting comments. */
     // "noEmit": true,                                   /* Disable emitting files from a compilation. */
     // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
-    // "importsNotUsedAsValues": "remove",               /* Specify emit/checking behavior for imports that are only used for types. */
     // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
     // "sourceRoot": "",                                 /* Specify the root path for debuggers to find the reference source code. */
     // "mapRoot": "",                                    /* Specify the location where debugger should locate map files instead of generated locations. */
@@ -70,13 +70,13 @@
     // "noEmitHelpers": true,                            /* Disable generating custom helper functions like '__extends' in compiled output. */
     // "noEmitOnError": true,                            /* Disable emitting files if any type checking errors are reported. */
     // "preserveConstEnums": true,                       /* Disable erasing 'const enum' declarations in generated code. */
-    "declarationDir": "dist/types" /* Specify the output directory for generated declaration files. */,
-    // "preserveValueImports": true,                     /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */
+    // "declarationDir": "./",                           /* Specify the output directory for generated declaration files. */
 
     /* Interop Constraints */
     // "isolatedModules": true,                          /* Ensure that each file can be safely transpiled without relying on other imports. */
     // "verbatimModuleSyntax": true,                     /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */
-    "allowSyntheticDefaultImports": true /* Allow 'import x from y' when a module doesn't have a default export. */,
+    // "isolatedDeclarations": true,                     /* Require sufficient annotation on exports so other tools can trivially generate declaration files. */
+    // "allowSyntheticDefaultImports": true,             /* Allow 'import x from y' when a module doesn't have a default export. */
     "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */,
     // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
     "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,

package/.gitattributes

@@ -1,2 +0,0 @@
-# Auto detect text files and perform LF normalization
-* text=auto

package/rollup.config.js

@@ -1,10 +0,0 @@
-import typescript from "@rollup/plugin-typescript";
-
-export default {
-  input: "src/index.ts",
-  output: {
-    dir: "dist",
-    format: "cjs",
-  },
-  plugins: [typescript()],
-};

package/src/components/ArrowButton/index.tsx

@@ -1 +0,0 @@
-export { default } from "./ArrowButton";

package/src/components/Button/Button.tsx

@@ -1,278 +0,0 @@
-import React from "react";
-import { forwardRef } from "react";
-import styled from "styled-components";
-
-const colors = {
-  gray: "#dee2e6",
-  red: "#e03131",
-  pink: "#c2255c",
-  grape: "#9c36b5",
-  violet: "#6741d9",
-  indigo: "#3b5bdb",
-  cyan: "#0c8599",
-  teal: "#099268",
-  green: "#2f9e44",
-  lime: "#66a80f",
-  yellow: "#f08c00",
-  orange: "#e8590c",
-};
-
-interface StyledButtonProps {
-  variant?:
-    | "default"
-    | "contained"
-    | "filled"
-    | "light"
-    | "outlined"
-    | "text"
-    | "subtle";
-  color?: string;
-  size?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl";
-  fullWidth?: boolean;
-}
-
-const StyledButton = styled.button<StyledButtonProps>`
-  width: ${({ fullWidth }) => (fullWidth ? "100%" : "auto")};
-  height: ${({ size }) => {
-    switch (size) {
-      case "xxs":
-        return `24px`;
-      case "xs":
-        return `28px`;
-      case "sm":
-        return `34px`;
-      case "md":
-        return `40px`;
-      case "lg":
-        return `48px`;
-      case "xl":
-        return `58px`;
-      default:
-        return `34px`;
-    }
-  }};
-
-  font-weight: 525;
-  letter-spacing: 0.75px;
-  font-size: ${({ size }) => {
-    switch (size) {
-      case "xxs":
-        return `11px`;
-      case "xs":
-        return `12px`;
-      case "sm":
-        return `14px`;
-      case "md":
-        return `16px`;
-      case "lg":
-        return `18px`;
-      case "xl":
-        return `20px`;
-      default:
-        return `14px`;
-    }
-  }};
-
-  padding: ${({ size }) => {
-    switch (size) {
-      case "xxs":
-        return `0px 8px`;
-      case "xs":
-        return `0px 12px`;
-      case "sm":
-        return `0px 16px`;
-      case "md":
-        return `0px 20px`;
-      case "lg":
-        return `0px 24px`;
-      case "xl":
-        return `0px 30px`;
-      default:
-        return `0px 16px`;
-    }
-  }};
-
-  color: ${({ theme, variant, color }) => {
-    if (variant === "default") return theme.palette.text.primary;
-    if (variant === "contained") return "white";
-    if (variant === "filled") return "white";
-
-    switch (color) {
-      case "primary":
-        return theme.palette.primary.main;
-      case undefined || null:
-        return theme.palette.text.primary;
-      default:
-        return (
-          theme?.palette?.[color!]?.main ||
-          colors?.[color!] ||
-          theme.palette.text.primary
-        );
-    }
-  }};
-
-  background-color: ${({ theme, variant, color }) => {
-    if (variant === "default") return "transparent";
-    switch (variant) {
-      case "contained":
-        if (!color) return theme.palette.background.secondary;
-        return (
-          theme?.palette?.[color]?.main ||
-          colors?.[color] ||
-          theme.palette.background.secondary
-        );
-      case "filled":
-        if (!color) return theme.palette.background.secondary;
-        return (
-          theme?.palette?.[color]?.main ||
-          colors?.[color] ||
-          theme.palette.background.secondary
-        );
-      case "light":
-        if (!color) return theme.palette.background.secondary + "30";
-        return (
-          (theme?.palette?.[color]?.main ||
-            colors?.[color] ||
-            theme.palette.background.secondary) + "30"
-        );
-      case "outlined":
-        return "transparent";
-      case "text":
-        return "transparent";
-      default:
-        return "transparent";
-    }
-  }};
-
-  border-radius: 4px;
-  border: 1px solid
-    ${({ theme, variant, color }) => {
-      switch (variant) {
-        case "contained":
-          return "transparent";
-        case "filled":
-          return "transparent";
-        case "light":
-          return "transparent";
-        case "outlined":
-          if (!color) return theme.palette.divider;
-          return (
-            theme?.palette?.[color]?.main ||
-            colors?.[color] ||
-            theme.palette.divider
-          );
-        case "text":
-          return "transparent";
-        case "subtle":
-          return "transparent";
-        default:
-          if (!color) return theme.palette.divider;
-          return (
-            theme?.palette?.[color]?.main ||
-            colors?.[color] ||
-            theme.palette.divider
-          );
-      }
-    }};
-
-  cursor: pointer;
-
-  transition: background-color 0.2s, border 0.2s;
-
-  &:hover {
-    background-color: ${({ theme, variant, color }) => {
-      if (variant === "default") return "transparent";
-      switch (variant) {
-        case "contained":
-          if (!color) return theme.palette.background.secondary + "90";
-          return (
-            (theme?.palette?.[color]?.main ||
-              colors?.[color] ||
-              theme.palette.background.secondary) + "90"
-          );
-        case "filled":
-          if (!color) return theme.palette.background.secondary + "90";
-          return (
-            (theme?.palette?.[color]?.main ||
-              colors?.[color] ||
-              theme.palette.background.secondary) + "90"
-          );
-        case "light":
-          if (!color) return theme.palette.background.secondary + "70";
-          return (
-            (theme?.palette?.[color]?.main ||
-              colors?.[color] ||
-              theme.palette.background.secondary) + "70"
-          );
-        case "outlined":
-          return theme.palette.action.hover;
-        case "text":
-          return "transparent";
-        case "subtle":
-          if (!color) return theme.palette.action.hover;
-          return theme?.palette?.[color]?.main || colors?.[color]
-            ? (theme?.palette?.[color]?.main || colors?.[color]) + "30"
-            : theme.palette.action.hover;
-        default:
-          return theme.palette.action.hover;
-      }
-    }};
-
-    border: 1px solid
-      ${({ theme, variant, color }) => {
-        switch (variant) {
-          case "contained":
-            return "transparent";
-          case "filled":
-            return "transparent";
-          case "light":
-            return "transparent";
-          case "outlined":
-            if (!color) return theme.palette.divider;
-            return colors?.[color] || theme.palette.divider;
-          case "text":
-            return "transparent";
-          case "subtle":
-            return "transparent";
-          default:
-            if (!color) return theme.palette.divider;
-            return (
-              theme?.palette?.[color]?.main ||
-              colors?.[color] ||
-              theme.palette.divider
-            );
-        }
-      }};
-  }
-`;
-
-export interface ButtonProps {
-  children: React.ReactNode;
-  variant?:
-    | "default"
-    | "contained"
-    | "filled"
-    | "light"
-    | "outlined"
-    | "text"
-    | "subtle";
-  color?: string;
-  size?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl";
-  fullWidth?: boolean;
-  onClick?: () => void;
-}
-
-const Button = forwardRef(
-  (props: ButtonProps, ref: React.Ref<HTMLButtonElement>) => {
-    const { children, ...other } = props;
-    return (
-      <StyledButton ref={ref} {...other}>
-        <span style={{ height: "100%" }}>
-          <span style={{ height: "100%" }}>{children}</span>
-        </span>
-      </StyledButton>
-    );
-  }
-);
-
-export default Button;

package/src/components/Button/index.ts

@@ -1 +0,0 @@
-export { default } from "./Button";