@flowuent-org/diagramming-core 1.3.9 → 1.4.0

package/packages/atoms/src/lib/Button/Button.tsx

@@ -1,78 +0,0 @@
-// Import necessary modules and types from React and Material-UI
-import React, { ElementType, useMemo } from 'react';
-import {
-  Button as MuiButton,
-  ButtonProps as MuiButtonProps,
-  SxProps,
-  Theme,
-  useTheme,
-} from '@mui/material';
-import { OverridableStringUnion } from '@mui/types';
-import { ButtonVariantOverrides } from '@flowuent-labs/interfaces';
-
-// Extend the Material-UI theme to include custom button styles
-declare module '@mui/material/styles' {
-  interface Theme {
-    Button: { [key: string]: React.CSSProperties };
-  }
-
-  interface ThemeOptions {
-    Button?: { [key: string]: React.CSSProperties };
-  }
-}
-
-// Define the ButtonProps type with overrides for variant and sx
-type ButtonProps<C extends ElementType = 'button'> = Omit<
-  MuiButtonProps<C>,
-  'variant' | 'sx'
-> & {
-  variant: OverridableStringUnion<
-    'downloadPanel' | 'text' | 'outlined' | 'contained' | "addNode",
-    ButtonVariantOverrides
-  >;
-  sx?: SxProps<Theme>;
-  component?: C;
-  innerRef?: React.Ref<any>;
-};
-
-// Define the Button component with generic type for component
-const Button = <C extends React.ElementType = 'button'>(
-  props: ButtonProps<C> & { component?: C }
-) => {
-  // Destructure props and get the theme
-  const {variant, sx: sxProp, innerRef, ...otherProps} = props;
-  const theme = useTheme();
-
-  // Determine variant styles using useMemo to optimize performance
-  const variantStyles: SxProps<Theme> = useMemo(() => {
-    if (variant && theme.Button && theme.Button[variant]) {
-      return theme.Button[variant] as SxProps<Theme>;
-    }
-    return {};
-  }, [variant, theme.Button]);
-
-  // Combine sxProp with variantStyles using useMemo
-  const sx: SxProps<Theme> = useMemo(
-    () => ({
-      ...sxProp,
-      ...variantStyles,
-    }),
-    [sxProp, variantStyles]
-  );
-
-  // Render the Material-UI Button with computed styles and other props
-  return (
-    <MuiButton
-      component={otherProps.component as C}
-      ref={innerRef}
-      sx={sx}
-      {...otherProps}
-    />
-  );
-};
-
-// Set the display name for the Button component
-Button.displayName = 'Button';
-
-// Export the Button component as the default export
-export default Button;

package/packages/atoms/src/lib/Card/Card.module.css

@@ -1,7 +0,0 @@
-/*
- * Replace this with your own classes
- *
- * e.g.
- * .card {
- * }
-*/

package/packages/atoms/src/lib/Card/Card.spec.tsx

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import Card from './Card';
-
-describe('Card', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<Card />);
-    expect(baseElement).toBeTruthy();
-  });
-});

package/packages/atoms/src/lib/Card/Card.tsx

@@ -1,19 +0,0 @@
-import styles from './Card.module.css';
-import { Card as MuiCard, CardProps as MuiCardProps } from '@mui/material';
-
-/* eslint-disable-next-line */
-export interface CardProps extends MuiCardProps {
-  // if needed then add extra prop
-}
-
-const Card = (props: CardProps) => {
-  return (
-    <>
-      <MuiCard {...props} className={styles['card']}>
-        {props.children}
-      </MuiCard>
-    </>
-  );
-};
-
-export default Card;

package/packages/atoms/src/lib/CardContent/CardContent.module.css

@@ -1,7 +0,0 @@
-/*
- * Replace this with your own classes
- *
- * e.g.
- * .card-content {
- * }
-*/

package/packages/atoms/src/lib/CardContent/CardContent.spec.tsx

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import Card from './CardContent';
-
-describe('Card', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<Card />);
-    expect(baseElement).toBeTruthy();
-  });
-});

package/packages/atoms/src/lib/CardContent/CardContent.tsx

@@ -1,22 +0,0 @@
-import styles from './CardContent.module.css';
-import {
-  CardContent as MuiCardContent,
-  CardContentProps as MuiCardContentProps,
-} from '@mui/material';
-
-/* eslint-disable-next-line */
-export interface CardContentProps extends MuiCardContentProps {
-  // if needed then add extra prop
-}
-
-const CardContent = (props: CardContentProps) => {
-  return (
-    <>
-      <MuiCardContent {...props} className={styles['card-content']}>
-        {props.children}
-      </MuiCardContent>
-    </>
-  );
-};
-
-export default CardContent;

package/packages/atoms/src/lib/FormTextField/FormTextField.module.css

@@ -1,7 +0,0 @@
-/*
- * Replace this with your own classes
- *
- * e.g.
- * .container {
- * }
-*/

package/packages/atoms/src/lib/FormTextField/FormTextField.spec.tsx

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import CustomTextField from './FormTextField';
-
-describe('CustomTextField', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<CustomTextField />);
-    expect(baseElement).toBeTruthy();
-  });
-});

package/packages/atoms/src/lib/FormTextField/FormTextField.tsx

@@ -1,35 +0,0 @@
-import { TextField, TextFieldProps } from '@mui/material';
-import { Controller, useFormContext } from 'react-hook-form';
-
-type FormTextFieldProps = TextFieldProps & {
-  // add more props for overriding
-  name: string;
-};
-
-const FormTextField = ({ name, label, ...props }: FormTextFieldProps) => {
-  const { control } = useFormContext();
-
-  return (
-    <Controller
-      name={name}
-      control={control}
-      render={({
-        field: { onChange, onBlur, value },
-        fieldState: { error },
-      }) => (
-        <TextField
-          {...props}
-          label={label}
-          variant="outlined"
-          onChange={onChange}
-          onBlur={onBlur}
-          value={value}
-          error={!!error}
-          helperText={error ? error.message : null}
-        />
-      )}
-    />
-  );
-};
-
-export default FormTextField;

package/packages/atoms/src/lib/Grid/Grid.module.css

@@ -1,7 +0,0 @@
-/*
- * Replace this with your own classes
- *
- * e.g.
- * .grid {
- * }
-*/

package/packages/atoms/src/lib/Grid/Grid.spec.tsx

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import Grid from './Grid';
-
-describe('Grid', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<Grid />);
-    expect(baseElement).toBeTruthy();
-  });
-});

package/packages/atoms/src/lib/Grid/Grid.tsx

@@ -1,19 +0,0 @@
-import styles from './Grid.module.css';
-import { Grid as MuiGrid, GridProps as MuiGridProps } from '@mui/material';
-
-/* eslint-disable-next-line */
-export interface GridProps extends MuiGridProps {
-  // if needed then add extra prop
-}
-
-const Grid = (props: GridProps) => {
-  return (
-    <>
-      <MuiGrid {...props} className={styles['Grid']}>
-        {props.children}
-      </MuiGrid>
-    </>
-  );
-};
-
-export default Grid;

package/packages/atoms/src/lib/Stack/Stack.module.css

@@ -1,7 +0,0 @@
-/*
- * Replace this with your own classes
- *
- * e.g.
- * .stack {
- * }
-*/

package/packages/atoms/src/lib/Stack/Stack.spec.tsx

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import Stack from './Stack';
-
-describe('Stack', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<Stack />);
-    expect(baseElement).toBeTruthy();
-  });
-});

package/packages/atoms/src/lib/Stack/Stack.tsx

@@ -1,19 +0,0 @@
-import styles from './Stack.module.css';
-import { Stack as MuiStack, StackProps as MuiStackProps } from '@mui/material';
-
-/* eslint-disable-next-line */
-export interface StackProps extends MuiStackProps {
-  // if needed then add extra prop
-}
-
-const Stack = (props: StackProps) => {
-  return (
-    <>
-      <MuiStack {...props} className={styles['stack']}>
-        {props.children}
-      </MuiStack>
-    </>
-  );
-};
-
-export default Stack;

package/packages/atoms/src/lib/Switch/Switch.module.css

@@ -1,7 +0,0 @@
-/*
- * Replace this with your own classes
- *
- * e.g.
- * .container {
- * }
-*/

package/packages/atoms/src/lib/Switch/Switch.spec.tsx

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import Switch from './Switch';
-
-describe('Switch', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<Switch />);
-    expect(baseElement).toBeTruthy();
-  });
-});

package/packages/atoms/src/lib/Switch/Switch.tsx

@@ -1,46 +0,0 @@
-import {
-  FormControlLabel,
-  Switch as MuiSwitch,
-  SwitchProps as MuiSwitchProps,
-} from '@mui/material';
-import { Controller, useFormContext } from 'react-hook-form';
-
-export interface SwitchProps extends MuiSwitchProps {
-  // if needed then add extra prop
-  name: string;
-  label?: string;
-  showOnOffLabel?: boolean;
-}
-
-const Switch = ({
-  name,
-  label = '',
-  showOnOffLabel = true,
-  ...props
-}: SwitchProps) => {
-  const { control } = useFormContext(); // Use the form context
-
-  return (
-    <Controller
-      name={name}
-      control={control}
-      render={({ field: { onChange, value } }) => (
-        <FormControlLabel
-          sx={{ bgcolor: 'inherit' }}
-          control={
-            <MuiSwitch
-              {...props}
-              sx={{ mr: 2, ...props.sx }}
-              onChange={onChange}
-              value={value}
-            />
-          }
-          label={showOnOffLabel ? (value ? 'ON' : 'OFF') : label}
-          labelPlacement="end"
-        />
-      )}
-    />
-  );
-};
-
-export default Switch;

package/packages/atoms/src/lib/TableView/TableView.module.css

@@ -1,7 +0,0 @@
-/*
- * Replace this with your own classes
- *
- * e.g.
- * .container {
- * }
-*/

package/packages/atoms/src/lib/TableView/TableView.spec.tsx

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import TableView from './TableView';
-
-describe('TableView', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<TableView />);
-    expect(baseElement).toBeTruthy();
-  });
-});

package/packages/atoms/src/lib/TableView/TableView.tsx

@@ -1,88 +0,0 @@
-import { useMemo } from 'react';
-import { SxProps, Theme, useTheme } from '@mui/material';
-import { DataGrid, GridColDef } from '@mui/x-data-grid';
-import { OverridableStringUnion } from '@mui/types';
-
-import {
-  DataGridVariantOverrides,
-  TableViewProps,
-} from '@flowuent-labs/interfaces';
-
-declare module '@mui/material/styles' {
-  interface Theme {
-    tableView?: {
-      [key: string]:
-        | React.CSSProperties
-        | { [key: string]: React.CSSProperties };
-    };
-  }
-
-  interface ThemeOptions {
-    tableView?: {
-      [key: string]:
-        | React.CSSProperties
-        | { [key: string]: React.CSSProperties };
-    };
-  }
-}
-
-type TableProps = TableViewProps & {
-  variant: OverridableStringUnion<
-    'primary' | 'secondary',
-    DataGridVariantOverrides
-  >;
-  sx?: SxProps<Theme>;
-  innerRef?: React.Ref<any>;
-};
-
-const TableView = ({
-  records,
-  columns,
-  variant,
-  sx: sxProp,
-  ...rest
-}: TableProps) => {
-  const theme = useTheme();
-
-  const columnsDef: GridColDef[] = columns.map((column) => ({
-    ...column,
-    field: column.id,
-    renderHeader: column.headerRenderer,
-    renderCell: column.cellRenderer,
-    flex: 1,
-    sortable: false,
-    editable: true,
-  }));
-
-  // Determine variant styles
-  const variantStyles: SxProps<Theme> = useMemo(() => {
-    if (variant && theme.tableView && theme.tableView[variant]) {
-      return theme.tableView[variant] as SxProps<Theme>;
-    }
-    return {};
-  }, [variant, theme.tableView]);
-
-  const sx: SxProps<Theme> = useMemo(
-    () => ({
-      ...sxProp,
-      ...variantStyles,
-    }),
-    [sxProp, variantStyles],
-  );
-
-  return (
-    <DataGrid
-      sx={sx}
-      autoHeight
-      hideFooter
-      disableColumnFilter
-      disableColumnMenu
-      disableColumnSelector
-      columns={columnsDef}
-      rows={records}
-      {...rest}
-    />
-  );
-};
-
-export default TableView;

package/packages/atoms/src/lib/TextField/TextField.module.css

@@ -1,7 +0,0 @@
-/*
- * Replace this with your own classes
- *
- * e.g.
- * .textfield {
- * }
-*/

package/packages/atoms/src/lib/TextField/TextField.spec.tsx

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import TextField from './TextField';
-
-describe('TextField', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<TextField />);
-    expect(baseElement).toBeTruthy();
-  });
-});

package/packages/atoms/src/lib/TextField/TextField.tsx

@@ -1,17 +0,0 @@
-import styles from './TextField.module.css';
-import {
-  TextField as MuiTextField,
-  TextFieldProps as MuiTextFieldProps,
-} from '@mui/material';
-
-const TextField = (props: MuiTextFieldProps) => {
-  return (
-    <>
-      <MuiTextField {...props} className={styles['textfield']}>
-        {props.children}
-      </MuiTextField>
-    </>
-  );
-};
-
-export default TextField;

package/packages/atoms/src/lib/Typography/Typography.module.css

@@ -1,7 +0,0 @@
-/*
- * Replace this with your own classes
- *
- * e.g.
- * .typography {
- * }
-*/

package/packages/atoms/src/lib/Typography/Typography.spec.tsx

@@ -1,10 +0,0 @@
-import { render } from '@testing-library/react';
-
-import Typography from './Typography';
-
-describe('Typography', () => {
-  it('should render successfully', () => {
-    const { baseElement } = render(<Typography />);
-    expect(baseElement).toBeTruthy();
-  });
-});

package/packages/atoms/src/lib/Typography/Typography.tsx

@@ -1,22 +0,0 @@
-import styles from './Typography.module.css';
-import {
-  Typography as MuiTypography,
-  TypographyProps as MuiTypographyProps,
-} from '@mui/material';
-
-/* eslint-disable-next-line */
-export interface TypographyProps extends MuiTypographyProps {
-  // if needed then add extra prop
-}
-
-const Typography = (props: TypographyProps) => {
-  return (
-    <>
-      <MuiTypography {...props} className={styles['typography']}>
-        {props.children}
-      </MuiTypography>
-    </>
-  );
-};
-
-export default Typography;

package/packages/atoms/tsconfig.json

@@ -1,17 +0,0 @@
-{
-  "compilerOptions": {
-    "jsx": "react-jsx",
-    "allowJs": false,
-    "esModuleInterop": false,
-    "allowSyntheticDefaultImports": true,
-    "strict": true
-  },
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "./tsconfig.lib.json"
-    }
-  ],
-  "extends": "../../tsconfig.base.json"
-}

package/packages/atoms/tsconfig.lib.json

@@ -1,30 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
-    "types": [
-      "node",
-
-      "@nx/react/typings/cssmodule.d.ts",
-      "@nx/react/typings/image.d.ts"
-    ]
-  },
-  "exclude": [
-    "jest.config.ts",
-    "src/**/*.spec.ts",
-    "src/**/*.test.ts",
-    "src/**/*.spec.tsx",
-    "src/**/*.test.tsx",
-    "src/**/*.spec.js",
-    "src/**/*.test.js",
-    "src/**/*.spec.jsx",
-    "src/**/*.test.jsx"
-  ],
-  "include": [
-    "src/**/*.js",
-    "src/**/*.jsx",
-    "src/**/*.ts",
-    "src/**/*.tsx",
-    "forms/Switch.tsx"
-  ]
-}

package/packages/common/.babelrc

@@ -1,12 +0,0 @@
-{
-  "presets": [
-    [
-      "@nx/react/babel",
-      {
-        "runtime": "automatic",
-        "useBuiltIns": "usage"
-      }
-    ]
-  ],
-  "plugins": []
-}

package/packages/common/.eslintrc.json

@@ -1,18 +0,0 @@
-{
-  "extends": ["plugin:@nx/react", "../../.eslintrc.json"],
-  "ignorePatterns": ["!**/*"],
-  "overrides": [
-    {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.ts", "*.tsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.js", "*.jsx"],
-      "rules": {}
-    }
-  ]
-}

package/packages/common/README.md

@@ -1,7 +0,0 @@
-# common
-
-This library was generated with [Nx](https://nx.dev).
-
-## Running unit tests
-
-Run `nx test common` to execute the unit tests via [Jest](https://jestjs.io).

package/packages/common/project.json

@@ -1,8 +0,0 @@
-{
-  "name": "common",
-  "$schema": "../../node_modules/nx/schemas/project-schema.json",
-  "sourceRoot": "packages/common/src",
-  "projectType": "library",
-  "tags": [],
-  "targets": {}
-}

package/packages/common/src/index.ts

@@ -1,4 +0,0 @@
-import { generateRandomProfilePic } from './lib/generateRandomProfilePic';
-import { generateValidationSchema } from './lib/generateValidationSchema';
-
-export { generateRandomProfilePic, generateValidationSchema };

package/packages/common/src/lib/generateRandomProfilePic.ts

@@ -1,3 +0,0 @@
-export const generateRandomProfilePic = (size = 200) => {
-  return `https://picsum.photos/${size}`;
-};