hisd3-ui-kit 1.0.0 → 2.0.0

package/src/enum/theme.ts

@@ -1,427 +0,0 @@
-export enum ThemeStyle {
-  MODERN = "modern",
-  STANDARD = "standard",
-}
-export enum ThemeStyleRadius {
-  MODERN = "30px",
-  STANDARD = "16px",
-}
-export enum ThemeMode {
-  LIGHT = "light",
-  SEMI_DARK = "semi-dark",
-  DARK = "dark",
-}
-export enum LayoutType {
-  FULL_WIDTH = "full-width",
-  BOXED = "boxed",
-  FRAMED = "framed",
-}
-
-export enum MenuStyle {
-  DEFAULT = "default",
-  STANDARD = "standard",
-  ROUNDED = "rounded",
-  ROUNDED_REVERSE = "rounded-reverse",
-  CURVED_MENU = "curved-menu",
-}
-
-export enum NavStyle {
-  DEFAULT = "default",
-  MINI = "mini",
-  MINI_SIDEBAR_TOGGLE = "mini-sidebar-toggle",
-  STANDARD = "standard",
-  HEADER_USER = "user-header",
-  HEADER_USER_MINI = "user-mini-header",
-  DRAWER = "drawer",
-  BIT_BUCKET = "bit-bucket",
-  H_DEFAULT = "h-default",
-  HOR_HEADER_FIXED = "hor-header-fixed",
-  HOR_DARK_LAYOUT = "hor-dark-layout",
-}
-export enum FooterType {
-  FIXED = "fixed",
-  FLUID = "fluid",
-}
-export enum LayoutDirection {
-  RTL = "rtl",
-  LTR = "ltr",
-}
-export enum HeaderType {
-  DARK = "dark",
-  LIGHT = "light",
-}
-export enum RouteTransition {
-  NONE = "none",
-  FADE = "fade",
-  SLIDE_LEFT = "slideLeft",
-  SLIDE_RIGHT = "slideRight",
-  SLIDE_UP = "slideUp",
-  SLIDE_DOWN = "slideDown",
-}
-export enum Fonts {
-  LIGHT = "300",
-  REGULAR = "400",
-  MEDIUM = "500",
-  BOLD = "600",
-}
-
-export enum AuthType {
-  FIREBASE = "firebase",
-  AWS_COGNITO = "aws_cognito",
-  AUTH0 = "auth0",
-  JWT_AUTH = "jwt_auth",
-}
-
-export enum AppAnimates {
-  SLIDEUPIN = "transition.slideUpIn",
-  SLIDEUPOUT = "transition.slideUpOut",
-  SLIDEDOWNIN = "transition.slideDownIn",
-  SLIDEDOWNOUT = "transition.slideDownOut",
-  SLIDELEFTIN = "transition.slideLeftIn",
-  SLIDELEFTOUT = "transition.slideLeftOut",
-  SLIDERIGHTIN = "transition.slideRightIn",
-  SLIDERIGHTOUT = "transition.slideRightOut",
-  FADEIN = "transition.fadeIn",
-  FADEOUT = "transition.fadeOut",
-}
-
-export const AppAnimateGroups = {
-  SLIDEUPIN: {
-    hidden: {
-      y: 0,
-    },
-    visible: {
-      opacity: 1,
-      y: 0,
-      transition: {
-        ease: "easeIn",
-        delay: 0,
-        when: "beforeChildren",
-        duration: 0.2,
-        staggerChildren: 0.05,
-      },
-    },
-  },
-  SLIDEUPOUT: {
-    hidden: {
-      y: 0,
-    },
-    visible: {
-      opacity: 0,
-      y: "100vh",
-      transition: {
-        ease: "easeOut",
-        delay: 0,
-        when: "beforeChildren",
-        duration: 0.4,
-        staggerChildren: 0.15,
-      },
-    },
-  },
-  SLIDEDOWNIN: {
-    hidden: {
-      opacity: 0,
-      y: "-100vh",
-    },
-    visible: {
-      opacity: 1,
-      y: 0,
-      transition: {
-        ease: "easeIn",
-        delay: 0,
-        when: "beforeChildren",
-        duration: 0.4,
-        staggerChildren: 0.15,
-      },
-    },
-  },
-  SLIDEDOWNOUT: {
-    hidden: {
-      y: 0,
-    },
-    visible: {
-      opacity: 0,
-      y: "-100vh",
-      transition: {
-        ease: "easeOut",
-        delay: 0,
-        when: "beforeChildren",
-        duration: 0.4,
-        staggerChildren: 0.15,
-      },
-    },
-  },
-  SLIDELEFTIN: {
-    hidden: {
-      x: "100vw",
-    },
-    visible: {
-      opacity: 1,
-      x: 0,
-      transition: {
-        ease: "easeIn",
-        delay: 0,
-        when: "beforeChildren",
-        duration: 0.4,
-        staggerChildren: 0.15,
-      },
-    },
-  },
-  SLIDELEFTOUT: {
-    hidden: {
-      x: 0,
-    },
-    visible: {
-      opacity: 0,
-      x: "100vw",
-      transition: {
-        ease: "easeOut",
-        delay: 0,
-        when: "beforeChildren",
-        duration: 0.4,
-        staggerChildren: 0.15,
-      },
-    },
-  },
-  SLIDERIGHTIN: {
-    hidden: {
-      x: "-100vw",
-    },
-    visible: {
-      opacity: 1,
-      x: 0,
-      transition: {
-        ease: "easeIn",
-        delay: 0,
-        when: "beforeChildren",
-        duration: 0.4,
-        staggerChildren: 0.15,
-      },
-    },
-  },
-  SLIDERIGHTOUT: {
-    hidden: {
-      x: 0,
-    },
-    visible: {
-      opacity: 0,
-      x: "-100vw",
-      transition: {
-        ease: "easeOut",
-        delay: 0,
-        when: "beforeChildren",
-        duration: 0.4,
-        staggerChildren: 0.15,
-      },
-    },
-  },
-  FADEIN: {
-    hidden: {
-      opacity: 0,
-      scale: 1,
-    },
-    visible: {
-      opacity: 1,
-      scale: 1,
-      transition: {
-        ease: "easeIn",
-        when: "beforeChildren",
-        staggerChildren: 0.15,
-      },
-    },
-  },
-  FADEOUT: {
-    hidden: {
-      opacity: 1,
-      scale: 1,
-    },
-    visible: {
-      opacity: 0,
-      scale: 1,
-      transition: {
-        ease: "easeOut",
-        when: "beforeChildren",
-        staggerChildren: 0.15,
-      },
-    },
-  },
-  NOANIMATION: {
-    hidden: {
-      opacity: 1,
-    },
-    visible: {
-      opacity: 1,
-    },
-  },
-};
-
-export const AppMotionAnimate = {
-  SLIDEUPIN: {
-    variants: {
-      hidden: {
-        y: 100,
-        opacity: 0,
-      },
-      visible: {
-        opacity: 1,
-        y: 0,
-      },
-    },
-    transition: {
-      ease: "easeIn",
-      when: "beforeChildren",
-    },
-  },
-  SLIDEUPOUT: {
-    variants: {
-      hidden: {
-        y: 0,
-        opacity: 1,
-      },
-      visible: {
-        opacity: 0,
-        y: "-100vh",
-      },
-    },
-    transition: {
-      ease: "easeOut",
-      when: "beforeChildren",
-    },
-  },
-  SLIDEDOWNIN: {
-    variants: {
-      hidden: {
-        y: -100,
-        opacity: 0,
-      },
-      visible: {
-        opacity: 1,
-        y: 0,
-      },
-    },
-    transition: {
-      ease: "easeIn",
-      when: "beforeChildren",
-    },
-  },
-  SLIDEDOWNOUT: {
-    variants: {
-      hidden: {
-        y: 0,
-        opacity: 1,
-      },
-      visible: {
-        opacity: 0,
-        y: "100vh",
-      },
-    },
-    transition: {
-      ease: "easeOut",
-      when: "beforeChildren",
-    },
-  },
-  SLIDELEFTIN: {
-    variants: {
-      hidden: {
-        x: 100,
-        opacity: 0,
-      },
-      visible: {
-        opacity: 1,
-        x: 0,
-      },
-    },
-    transition: {
-      ease: "easeIn",
-      when: "beforeChildren",
-    },
-  },
-  SLIDELEFTOUT: {
-    variants: {
-      hidden: {
-        x: 0,
-        opacity: 1,
-      },
-      visible: {
-        opacity: 0,
-        x: "-100vw",
-      },
-    },
-    transition: {
-      ease: "easeOut",
-      when: "beforeChildren",
-    },
-  },
-  SLIDERIGHTIN: {
-    variants: {
-      hidden: {
-        x: -100,
-        opacity: 0,
-      },
-      visible: {
-        opacity: 1,
-        x: 0,
-      },
-    },
-    transition: {
-      ease: "easeIn",
-      when: "beforeChildren",
-    },
-  },
-  SLIDERIGHTOUT: {
-    variants: {
-      hidden: {
-        x: 0,
-        opacity: 1,
-      },
-      visible: {
-        opacity: 0,
-        x: "-100vw",
-      },
-    },
-    transition: {
-      ease: "easeOut",
-      when: "beforeChildren",
-    },
-  },
-  FADEIN: {
-    variants: {
-      hidden: {
-        opacity: 0,
-      },
-      visible: {
-        opacity: 1,
-      },
-    },
-    transition: {
-      duration: 0.1,
-      ease: "easeIn",
-      when: "beforeChildren",
-    },
-  },
-  FADEOUT: {
-    variants: {
-      hidden: {
-        opacity: 1,
-      },
-      visible: {
-        opacity: 0,
-      },
-    },
-    transition: {
-      duration: 0.1,
-      ease: "easeOut",
-      when: "beforeChildren",
-    },
-  },
-};
-
-export enum MessageType {
-  MEDIA = 1,
-  TEXT = 2,
-}
-
-export enum RoutePermittedRole {
-  Admin = "admin",
-  User = "user",
-}

package/src/index.ts

@@ -1,3 +0,0 @@
-export { default as HISD3Sidebar } from "./components/Sidebar";
-// export { default as Form } from "./components/Form";
-// export { default as CustomButton } from "./components/CustomButton";

package/src/types/account.ts

@@ -1,7 +0,0 @@
-export interface IUserEmployee {
-  id: string;
-  fullName: string;
-  gender: "MALE" | "FEMALE";
-  positionType?: string;
-  [key: string]: any;
-}

package/src/types/styled-components.d.ts

@@ -1,7 +0,0 @@
-// styled-components.d.ts
-import "styled-components";
-import { StyledTheme } from "./theme";
-
-declare module "styled-components" {
-  export interface DefaultTheme extends StyledTheme {}
-}

package/src/types/theme.ts

@@ -1,129 +0,0 @@
-import { LayoutDirection, ThemeMode } from "../enum/theme";
-
-interface FontSize {
-  xs: string;
-  sm: string;
-  md: string;
-  lg: string;
-  xl: string;
-  xxl: string;
-}
-
-interface FontWeight {
-  light: string;
-  regular: string;
-  medium: string;
-  bold: string;
-  lg: string; // Assuming 'lg' is for large font weight
-}
-
-interface Font {
-  size: FontSize;
-  weight: FontWeight;
-}
-
-interface Palette {
-  mode: ThemeMode;
-  borderColor: string;
-  dividerColor: string;
-  tooltipBg: string;
-  background: string;
-  primary: {
-    main: string;
-    contrastText: string;
-  };
-  secondary: {
-    main: string;
-  };
-  success: {
-    main: string;
-    light: string;
-  };
-  warning: {
-    main: string;
-    light: string;
-  };
-  gray: {
-    50: string;
-    100: string;
-    200: string;
-    300: string;
-    400: string;
-    500: string;
-    600: string;
-    700: string;
-    800: string;
-    900: string;
-    A100: string;
-    A200: string;
-    A400: string;
-    A700: string;
-  };
-  black: string;
-  white: string;
-  orange: {
-    5: string;
-    6: string;
-  };
-  cyan: {
-    7: string;
-  };
-  red: {
-    6: string;
-  };
-  green: {
-    3: string;
-    5: string;
-    6: string;
-    7: string;
-  };
-  blue: {
-    5: string;
-    7: string;
-  };
-  text: string;
-}
-
-interface Sidebar {
-  light: string;
-  dark: string;
-}
-
-interface Breakpoints {
-  xs: number;
-  sm: number;
-  md: number;
-  lg: number;
-  xl: number;
-  xxl: number;
-}
-
-interface Sizes {
-  line: {
-    base: number;
-  };
-  borderRadius: {
-    base: string;
-    circle: string;
-  };
-  framed: {
-    base: string;
-  };
-}
-
-export interface StyledTheme {
-  spacing: number;
-  cardRadius: string;
-  cardRadius30: string;
-  cardShadow: string;
-  direction: LayoutDirection;
-  palette: Palette;
-  status: {
-    danger: string;
-  };
-  divider: string;
-  font: Font;
-  sidebar: Sidebar;
-  breakpoints: Breakpoints;
-  sizes: Sizes;
-}

package/webpack.config.js

@@ -1,45 +0,0 @@
-const path = require("path");
-const TerserPlugin = require("terser-webpack-plugin");
-const MiniCssExtractPlugin = require("mini-css-extract-plugin");
-
-module.exports = {
-  entry: "./src/index.ts", // Entry file for your component library
-  output: {
-    path: path.resolve(__dirname, "dist"),
-    filename: "index.js",
-    library: "HISD3UIKIT", // Expose your component under a global name
-    libraryTarget: "umd", // UMD allows for various module systems (CommonJS, AMD, or as a global)
-    umdNamedDefine: true, // Ensures proper module naming when using UMD
-  },
-  resolve: {
-    extensions: [".ts", ".tsx", ".js", ".jsx"], // Resolve TypeScript and JavaScript files
-  },
-  module: {
-    rules: [
-      {
-        test: /\.tsx?$/,
-        use: "ts-loader",
-        exclude: /node_modules/,
-      },
-      {
-        test: /\.jsx?$/,
-        use: "babel-loader",
-        exclude: /node_modules/,
-      },
-      {
-        test: /\.css$/,
-        use: [MiniCssExtractPlugin.loader, "css-loader"],
-      },
-    ],
-  },
-  optimization: {
-    minimize: true,
-    minimizer: [new TerserPlugin()], // Minify the output for smaller bundle size
-  },
-  externals: {
-    // Externalize React and ReactDOM (you don't want to bundle these)
-    react: "React",
-    "react-dom": "ReactDOM",
-    "styled-components": "styled-components",
-  },
-};