math-main-components 0.0.2 → 0.0.4

package/README.md

@@ -0,0 +1,7 @@
+# math-main-components
+
+Component Library for math-main-app
+
+Includes
+- reusable ui components
+- math components

package/package.json

@@ -1,31 +1,24 @@
 {
     "name": "math-main-components",
-    "version": "0.0.2",
+    "version": "0.0.4",
     "author": "Emilian Scheel",
     "license": "MIT",
-    "main": "dist/cjs/index.js",
-    "module": "dist/esm/index.js",
-    "types": "dist/index.d.ts",
-    "scripts": {
-        "build": "rollup -c --bundleConfigAsCjs"
-    },
+    "main": "src/index.ts",
+    "files": [
+        "src/**/*"
+    ],
     "dependencies": {
-        "prop-types": "^15.8.1"
+        "prop-types": "^15.8.1",
+        "react": "^18.2.0",
+        "react-dom": "^18.2.0",
+        "tsc": "^2.0.4"
     },
     "devDependencies": {
-        "rollup-plugin-dts": "^6.0.2",
-        "rollup-plugin-peer-deps-external": "^2.2.4",
-        "rollup-plugin-terser": "^7.0.2",
-        "tslib": "^2.6.2",
-        "@rollup/plugin-commonjs": "^25.0.4",
-        "@rollup/plugin-node-resolve": "^15.2.1",
-        "@rollup/plugin-typescript": "^11.1.3",
-        "@types/node-sass": "^4.11.4",
+        "@tsconfig/recommended": "^1.0.3",
         "@types/react": "^18.2.22",
         "css-loader": "^6.8.1",
         "css-modules-typescript-loader": "^4.0.1",
         "node-sass": "^9.0.0",
-        "rollup": "^3.29.2",
         "sass": "^1.67.0",
         "sass-loader": "^13.3.2",
         "typescript": "^5.2.2"

package/src/components/Accordeon/Accordeon.tsx

@@ -0,0 +1,24 @@
+import React, { useState } from 'react'
+import { SvgIcon } from '../SvgIcon'
+import { AccordeonProps } from './Accordeon.types'
+import styles from './styles.module.scss'
+
+export function Accordeon({
+    title,
+    children
+}: AccordeonProps) {
+
+    const [isActive, setActive] = useState(false)
+
+    return (
+        <div className={[styles.container, isActive ? styles.active : styles.not_active].join(" ")}>
+            <div className={styles.head} onClick={() => setActive(!isActive)}>
+                <SvgIcon iconName="expand_more" />
+                <h3>{title}</h3>
+            </div>
+            <div className={styles.content}>
+                {children}
+            </div>
+        </div>
+    )
+}

package/src/components/Accordeon/index.tsx

@@ -1,24 +1 @@
-import React, { useState } from 'react'
-import SvgIcon from '../SvgIcon'
-import { AccordeonProps } from './Accordeon.types'
-import styles from './styles.module.scss'
-
-export default function Accordeon({
-    title,
-    children
-}: AccordeonProps) {
-
-    const [isActive, setActive] = useState(false)
-
-    return (
-        <div className={[styles.container, isActive ? styles.active : styles.not_active].join(" ")}>
-            <div className={styles.head} onClick={() => setActive(!isActive)}>
-                <SvgIcon iconName="expand_more" />
-                <h3>{title}</h3>
-            </div>
-            <div className={styles.content}>
-                {children}
-            </div>
-        </div>
-    )
-}
+export * from './Accordeon';

package/src/components/Dialog/Dialog.tsx

@@ -0,0 +1,26 @@
+import React from "react";
+import { DialogProps } from "./Dialog.types";
+import styles from './styles.module.scss';
+
+
+
+export function Dialog({
+    active = false,
+    onClose = (event: any) => { },
+    children = null
+}: DialogProps) {
+
+    function onClick(event: any) {
+        if (event.target.id == 'dialog-backdrop') {
+            onClose(event)
+        }
+    }
+
+    return (
+        <div id="dialog-backdrop" className={`${styles.container} ${active ? styles.active : styles.disabled}`} onClick={onClick}>
+            <div className={styles.dialog_window}>
+                {children}
+            </div>
+        </div>
+    )
+}

package/src/components/Dialog/index.tsx

@@ -1,26 +1 @@
-import React from "react";
-import { DialogProps } from "./Dialog.types";
-import styles from './styles.module.scss';
-
-
-
-export default function Dialog({
-    active = false,
-    onClose = (event: any) => { },
-    children = null
-}: DialogProps) {
-
-    function onClick(event: any) {
-        if (event.target.id == 'dialog-backdrop') {
-            onClose(event)
-        }
-    }
-
-    return (
-        <div id="dialog-backdrop" className={`${styles.container} ${active ? styles.active : styles.disabled}`} onClick={onClick}>
-            <div className={styles.dialog_window}>
-                {children}
-            </div>
-        </div>
-    )
-}
+export * from './Dialog';

package/src/components/Gap/Gap.tsx

@@ -0,0 +1,9 @@
+import React from "react";
+import { GapProps } from "./Gap.types";
+
+
+export function Gap({ size }: GapProps) {
+    return (
+        <div style={{ height: size }}></div>
+    )
+}

package/src/components/Gap/index.tsx

@@ -1,9 +1 @@
-import React from "react";
-import { GapProps } from "./Gap.types";
-
-
-export default function Gap({ size }: GapProps) {
-    return (
-        <div style={{ height: size }}></div>
-    )
-}
+export * from './';

package/src/components/SvgIcon/SvgIcon.tsx

@@ -0,0 +1,19 @@
+import "external-svg-loader";
+import { SvgIconProps } from "./SvgIcon.types";
+
+
+export function SvgIcon({
+    iconName,
+    size = "24px",
+    className = "",
+    onClick
+}: SvgIconProps) {
+    return (
+        <>
+            <span onClick={onClick} className={`material-symbols-outlined ${className}`} style={{ fontSize: size }}>
+                {iconName}
+            </span >
+            Lib
+        </>
+    )
+}

package/src/components/SvgIcon/index.ts

@@ -0,0 +1,2 @@
+
+export * from './SvgIcon';

package/dist/cjs/index.js

@@ -1,2 +0,0 @@
-"use strict";require("react");
-//# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/cjs/types/components/Accordeon/Accordeon.types.d.ts

@@ -1,4 +0,0 @@
-export interface AccordeonProps {
-    title?: string;
-    children?: any;
-}

package/dist/cjs/types/components/Accordeon/index.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-import { AccordeonProps } from './Accordeon.types';
-export default function Accordeon({ title, children }: AccordeonProps): React.JSX.Element;

package/dist/cjs/types/components/Dialog/Dialog.types.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-export interface DialogProps {
-    active?: boolean;
-    onClose?: (event: React.MouseEventHandler<HTMLDivElement>) => void;
-    children: any;
-}

package/dist/cjs/types/components/Dialog/index.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { DialogProps } from "./Dialog.types";
-export default function Dialog({ active, onClose, children }: DialogProps): React.JSX.Element;

package/dist/cjs/types/components/Gap/Gap.types.d.ts

@@ -1,3 +0,0 @@
-export interface GapProps {
-    size?: string;
-}

package/dist/cjs/types/components/Gap/index.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { GapProps } from "./Gap.types";
-export default function Gap({ size }: GapProps): React.JSX.Element;

package/dist/cjs/types/components/SvgIcon/SvgIcon.types.d.ts

@@ -1,8 +0,0 @@
-import { MouseEventHandler } from "react";
-export interface SvgIconProps {
-    iconName?: string;
-    size?: string;
-    fill?: string;
-    className?: string;
-    onClick?: MouseEventHandler<HTMLSpanElement>;
-}

package/dist/cjs/types/components/SvgIcon/index.d.ts

@@ -1,4 +0,0 @@
-import "external-svg-loader";
-import React from 'react';
-import { SvgIconProps } from "./SvgIcon.types";
-export default function SvgIcon({ iconName, size, className, onClick }: SvgIconProps): React.JSX.Element;

package/dist/cjs/types/index.d.ts

@@ -1 +0,0 @@
-export * from './components';

package/dist/esm/index.js

@@ -1,2 +0,0 @@
-import"react";
-//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/esm/types/components/Accordeon/Accordeon.types.d.ts

@@ -1,4 +0,0 @@
-export interface AccordeonProps {
-    title?: string;
-    children?: any;
-}

package/dist/esm/types/components/Accordeon/index.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-import { AccordeonProps } from './Accordeon.types';
-export default function Accordeon({ title, children }: AccordeonProps): React.JSX.Element;

package/dist/esm/types/components/Dialog/Dialog.types.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-export interface DialogProps {
-    active?: boolean;
-    onClose?: (event: React.MouseEventHandler<HTMLDivElement>) => void;
-    children: any;
-}

package/dist/esm/types/components/Dialog/index.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { DialogProps } from "./Dialog.types";
-export default function Dialog({ active, onClose, children }: DialogProps): React.JSX.Element;

package/dist/esm/types/components/Gap/Gap.types.d.ts

@@ -1,3 +0,0 @@
-export interface GapProps {
-    size?: string;
-}

package/dist/esm/types/components/Gap/index.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { GapProps } from "./Gap.types";
-export default function Gap({ size }: GapProps): React.JSX.Element;

package/dist/esm/types/components/SvgIcon/SvgIcon.types.d.ts

@@ -1,8 +0,0 @@
-import { MouseEventHandler } from "react";
-export interface SvgIconProps {
-    iconName?: string;
-    size?: string;
-    fill?: string;
-    className?: string;
-    onClick?: MouseEventHandler<HTMLSpanElement>;
-}

package/dist/esm/types/components/SvgIcon/index.d.ts

@@ -1,4 +0,0 @@
-import "external-svg-loader";
-import React from 'react';
-import { SvgIconProps } from "./SvgIcon.types";
-export default function SvgIcon({ iconName, size, className, onClick }: SvgIconProps): React.JSX.Element;

package/dist/esm/types/components/index.d.ts

@@ -1 +0,0 @@
-export * from './Gap';

package/dist/esm/types/index.d.ts

@@ -1 +0,0 @@
-export * from './components';

package/dist/types.d.ts

@@ -1,2 +0,0 @@
-
-export {  }

package/rollup.config.js

@@ -1,39 +0,0 @@
-import commonjs from "@rollup/plugin-commonjs";
-import resolve from "@rollup/plugin-node-resolve";
-import typescript from "@rollup/plugin-typescript";
-import dts from "rollup-plugin-dts";
-import peerDepsExternal from "rollup-plugin-peer-deps-external";
-import { terser } from "rollup-plugin-terser";
-
-const packageJson = require("./package.json");
-
-export default [
-    {
-        input: "src/index.ts",
-        output: [
-            {
-                file: packageJson.main,
-                format: "cjs",
-                sourcemap: true,
-            },
-            {
-                file: packageJson.module,
-                format: "esm",
-                sourcemap: true,
-            },
-        ],
-        plugins: [
-            peerDepsExternal(),
-            resolve(),
-            commonjs(),
-            typescript({ tsconfig: "./tsconfig.json" }),
-            terser(),
-        ],
-        external: ["react", "react-dom", "styled-components"],
-    },
-    {
-        input: "src/index.ts",
-        output: [{ file: "dist/types.d.ts", format: "es" }],
-        plugins: [dts.default()],
-    },
-];

package/src/components/SvgIcon/index.tsx

@@ -1,16 +0,0 @@
-import "external-svg-loader";
-import React from 'react';
-import { SvgIconProps } from "./SvgIcon.types";
-
-
-export default function SvgIcon({
-    iconName,
-    size = "24px",
-    className = "",
-    onClick
-}: SvgIconProps) {
-    return (
-        <span onClick={onClick} className={`material-symbols-outlined ${className}`} style={{ fontSize: size }
-        }> {iconName}</span >
-    )
-}

package/src/types/typings.d.ts

@@ -1,4 +0,0 @@
-declare module "*.module.scss" {
-    const content: Record<string, string>;
-    export default content;
-}

package/tsconfig.json

@@ -1,27 +0,0 @@
-{
-    "compilerOptions": {
-        "esModuleInterop": true,
-        "strict": true,
-        "skipLibCheck": true,
-        "jsx": "react",
-        "module": "ESNext",
-        "declaration": true,
-        "declarationDir": "types",
-        "sourceMap": true,
-        "outDir": "dist",
-        "moduleResolution": "node",
-        "emitDeclarationOnly": false,
-        "allowSyntheticDefaultImports": true,
-        "forceConsistentCasingInFileNames": true
-    },
-    "include": [
-        "src/types/typings.d.ts",
-        "src/**/*"
-    ],
-    "exclude": [
-        "dist",
-        "node_modules",
-        "src/**/*.test.tsx",
-        "src/**/*.stories.tsx"
-    ]
-}