@omniumretail/shared-resources 0.3.81 → 0.3.83

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omniumretail/shared-resources",
-  "version": "0.3.81",
+  "version": "0.3.83",
   "private": false,
   "description": "Shared Components and services or utils to the frontend versions",
   "main": "dist/shared-resources.umd.js",
@@ -17,13 +17,18 @@
   "devDependencies": {
     "@types/react": "^18.0.21",
     "@vitejs/plugin-react": "^5.0.0",
+    "rollup-plugin-visualizer": "^6.0.0",
     "sass": "^1.55.0",
     "tsconfig-paths": "^4.2.0",
     "typescript": "^4.8.3",
     "vite": "^7.1.2",
+    "vite-plugin-css-injected-by-js": "^3.5.2",
     "vite-plugin-dts": "^4.5.4"
   },
   "dependencies": {
+    "@fortawesome/fontawesome-svg-core": "^6.2.0",
+    "@fortawesome/free-solid-svg-icons": "^6.2.0",
+    "@fortawesome/react-fontawesome": "^0.2.0",
     "@tanstack/react-query": "^4.29.19",
     "antd": "^4.23.4",
     "classnames": "^2.3.2",
@@ -33,4 +38,4 @@
     "react-router-dom": "^6.4.1",
     "whatwg-fetch": "^3.6.2"
   }
-}
+}

package/src/components/Header/index.tsx

@@ -1,4 +1,5 @@
-import { MenuOutlined, UserOutlined } from '@ant-design/icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { icons,  } from '../../constants/Icons';
 import sitooIcon from '../../assets/sitoo.svg';
 import styles from './styles.module.scss';
 
@@ -7,13 +8,13 @@ export interface HeaderProps {
 }
 
 export const Header = ({ onOpenMenu }: HeaderProps) => (
-    <div className={styles.header}>
-        <MenuOutlined onClick={onOpenMenu} />
+    <div className={ styles.header }>
+        <FontAwesomeIcon icon={ icons.faBars } onClick={ onOpenMenu } />
 
-        <div className={styles.logoContainer}>
-            <img src={sitooIcon} alt="Logo" />
+        <div className={ styles.logoContainer }>
+            <img src={ sitooIcon } />
         </div>
 
-        <UserOutlined />
+        <FontAwesomeIcon icon={ icons.faUserTie } />
     </div>
 );

package/src/constants/Icons.ts

@@ -0,0 +1,21 @@
+
+import {
+    faBars, faUserTie, faPlus, faXmark, faUser, faUserPlus,
+    faCartShopping, faChevronDown, faFilter, faSearch, faQrcode, faCheck, faTrashAlt
+} from '@fortawesome/free-solid-svg-icons'
+
+export const icons = {
+    faBars,
+    faUser,
+    faUserTie,
+    faPlus,
+    faUserPlus,
+    faXmark,
+    faCartShopping,
+    faChevronDown,
+    faFilter,
+    faSearch,
+    faQrcode,
+    faCheck,
+    faTrashAlt
+};

package/src/constants/index.ts

@@ -1 +1,2 @@
 export * from './QueryClient'
+export * from './Icons';

package/vite.config.js

@@ -2,11 +2,13 @@ import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 import path from 'path';
 import dts from 'vite-plugin-dts';
+import cssInjectedByJsPlugin from 'vite-plugin-css-injected-by-js';
 
 export default defineConfig({
   plugins: [
     react(),
     dts({ insertTypesEntry: true }),
+    cssInjectedByJsPlugin(),
   ],
   build: {
     lib: {

package/dist/shared-resources.css

@@ -1 +0,0 @@
-._header_1olx4_1{height:88px;display:flex;align-items:flex-end;padding:13px 20px;border-bottom:2px solid #E5E5E5;box-sizing:border-box}._logoContainer_1olx4_10{display:flex;flex-grow:1;align-items:flex-end;justify-content:center}._footerComponent_1f9yk_1{height:60px;background-color:var(--app-footer-bg-color);padding:13px 24px;box-sizing:border-box}._footerComponent_1f9yk_1 ._date_1f9yk_7,._footerComponent_1f9yk_1 ._time_1f9yk_8{font-weight:500;font-size:10px;color:var(--app-footer-color);display:inline-flex}._footerComponent_1f9yk_1 ._dateTime_1f9yk_14{line-height:12px}._footerComponent_1f9yk_1 ._time_1f9yk_8{margin-left:8px}._footerComponent_1f9yk_1 ._omniumLogo_1f9yk_20{line-height:12px;text-align:right}._footerComponent_1f9yk_1 ._omniumLogoImg_1f9yk_24{height:23px;margin-top:-5px;margin-right:-6px}._header_i89hr_1{background:var(--white-color);height:37px;border-bottom:2px solid var(--disabled-input);color:var(--app-footer-bg-color);display:flex;gap:21px;align-items:center}._pageContent_i89hr_11,._header_i89hr_1{padding:8.5px 20px}._pageContainer_i89hr_15{height:100%}._pageContentLoading_i89hr_19{min-height:50%;display:flex;align-items:center;justify-content:center}._drawerComponent_1h26k_1 .ant-drawer-content-wrapper{top:10%}._drawerComponent_1h26k_1 .ant-drawer-content{background:var(--app-footer-color);border-radius:7px 7px 0 0}._drawerComponent_1h26k_1 .ant-drawer-header{border-bottom:1px solid var(--disabled-input);text-align:center;padding:16px 0}._drawerComponent_1h26k_1 .ant-drawer-title{font-weight:700;font-size:14px;color:var(--app-footer-bg-color)}._drawerComponent_1h26k_1 .ant-drawer-close{position:absolute;top:15px;right:0;font-weight:400;font-size:12px;color:var(--active-button-color)}._drawerComponent_1h26k_1 ._resetButton_1h26k_26{display:inline-block;margin-left:12px;font-style:normal;line-height:1;text-align:center;text-transform:none;text-decoration:none;background:transparent;border:0;outline:0;cursor:pointer;transition:color .3s;text-rendering:auto;position:absolute;top:15px;left:0;font-weight:400;font-size:12px;color:var(--active-button-color)}._link_nlg64_1{display:inline-flex;text-decoration:none;height:auto;color:var(--color-black);font-size:var(--font-size-body-3);line-height:100%;font-weight:300;font-style:var(--font-style-italic)}._linkSecondary_nlg64_12{color:var(--color-orange);font-style:var(--font-style-normal)}._iconAlignRight_nlg64_17 span:nth-child(2){margin-inline-end:8px;margin-inline-start:0;order:-1}._navigation_1x5af_1{display:flex;align-items:center;justify-content:space-between;padding:0 24px;height:75px;gap:0 24px;position:relative}@media (max-width: 767px){._navigation_1x5af_1{padding-top:32px}}@media (min-width: 767px){._navigation_1x5af_1{padding:0 40px}}._navigation_1x5af_1 ._title_1x5af_20{font-size:var(--font-size-body-4);font-weight:var(--font-weight-semibold);text-transform:uppercase}@media (max-width: 767px){._navigation_1x5af_1 ._columnCenter_1x5af_26{position:absolute;top:12px;margin:0 auto;left:0;right:0;text-align:center}}:root{--primary-color: red;--white-color: white;--grad-bg-button-color: #DADADA;--button-border-color: #707070;--button-color: #37383A;--customer-icon-color: #63B299;--default-background-image-color: #D9D9D9;--field-border-color: #D5D8D7;--page-bg-color: #F9F9F9;--page-border-color: #CECECE;--page-footer-bg-color: #DEDEDE;--app-footer-bg-color: #2C2D2E;--app-footer-color: #F5F6F7;--app-header-bg-1-color: #F7F7F7;--app-header-bg-2-color: #E3E3E3;--app-header-bg-3-color: #797979;--app-header-bt-border-color: #090909;--page-header-bg-color: #282c34;--success-color: #64B298;--error-color: #E05151;--disabled-input: #E8E8E8;--job-title-bg: #A83D3D;--job-date-info-bg: #E0F0EA;--job-date-edit-bg: #F0F0F0;--header-border-color: #C7CAC9;--grey: #E6E6E6;--active-button-color: #35779D;--sf-pro: normal normal bold 12px/14px SF Pro Text;--delete-bg: #E15151;--color-black: #2c2d2e;--color-black-rgb: 44, 45, 46;--color-white: #FFFFFF;--color-white-rgb: 255, 255, 255;--color-orange: #FF674C;--color-orange-rgb: 255, 103, 76;--color-blue: #09168B;--color-blue-rgb: 9, 22, 139;--color-grey-light: #D9D9D9;--color-grey-light-rgb: 217, 217, 217;--color-grey: #C7CAC9;--color-grey-rgb: 199, 202, 201;--color-grey-dark: #797979;--color-grey-dark-rgb: 121, 121, 121;--color-warning-400: #E36262;--color-warning-500: #E05151;--color-confirmation-400: #73b9a2;--color-confirmation-600: #64B298;--font-family-primary: SF Pro;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-style-normal: normal;--font-style-italic: italic;--font-size-body-1: 10px;--font-size-body-2: 12px;--font-size-body-3: 14px;--font-size-body-4: 16px;--font-size-body-5: 18px;--font-size-body-6: 20px;--font-size-h1: 46px;--font-size-h2: 40px;--font-size-h3: 36px;--font-size-h4: 30px;--font-size-h5: 24px;--font-size-body-base: var(--font-size-body-4);--font-size-label: var(--font-size-body-3);--button-default-background: var(--color-orange);--button-default-text-color: var(--color-white);--button-default-background-hover-color: rgba(var(--color-orange-rgb), .9);--button-default-text-hover-color: var(--color-white);--button-default-background-focus-color: var(--color-grey-dark);--button-default-text-focus-color: rgba(var(--color-white-rgb), .8);--button-style-1-background: var(--color-black);--button-style-1-text-color: var(--color-white);--button-style-1-background-hover-color: rgba(var(--color-black-rgb), .9);--button-style-1-text-hover-color: var(--color-white);--button-style-1-background-focus-color: var(--color-grey-dark);--button-style-1-text-focus-color: rgba(var(--color-white-rgb), .8);--button-disabled-background-color: var(--color-grey-dark);--button-disabled-default-text-color: var(--color-white);--link-color: var(--color-orange);--link-hover-color: var(--color-black);--link-focus-color: rgba(var(--color-orange), .9);--link-disabled-color: rgba(var(--color-grey), .2);--transition-slow: .2s;--transition: .6s;--transition-fast: 1s}body.a2aiStyle{--primary-color: red;--white-color: white;--grad-bg-button-color: #DADADA;--button-border-color: #707070;--button-color: #37383A;--customer-icon-color: #63B299;--default-background-image-color: #D9D9D9;--field-border-color: #D5D8D7;--page-bg-color: #F9F9F9;--page-border-color: #CECECE;--page-footer-bg-color: #DEDEDE;--app-footer-bg-color: #2C2D2E;--app-footer-color: #F5F6F7;--app-header-bg-1-color: #F7F7F7;--app-header-bg-2-color: #E3E3E3;--app-header-bg-3-color: #797979;--app-header-bt-border-color: #090909;--page-header-bg-color: #282c34;--success-color: #64B298;--error-color: #E05151;--disabled-input: #E8E8E8;--job-title-bg: #A83D3D;--job-date-info-bg: #E0F0EA;--job-date-edit-bg: #F0F0F0;--header-border-color: #C7CAC9;--grey: #E6E6E6;--active-button-color: #35779D;--sf-pro: normal normal bold 12px/14px SF Pro Text;--delete-bg: #E15151;--color-black: #2c2d2e;--color-black-rgb: 44, 45, 46;--color-white: #FFFFFF;--color-white-rgb: 255, 255, 255;--color-orange: #A9D046;--color-orange-rgb: 169, 208, 70;--color-blue: #09168B;--color-blue-rgb: 9, 22, 139;--color-purple-blue: #324A6D;--color-purple-blue-rgb: 50, 74, 109;--color-dark-blue: #1C244B;--color-dark-blue-rgb: 28, 36, 75;--color-grey-light: #D9D9D9;--color-grey-light-rgb: 217, 217, 217;--color-grey: #C7CAC9;--color-grey-rgb: 199, 202, 201;--color-grey-dark: #797979;--color-grey-dark-rgb: 121, 121, 121;--color-warning-400: #E36262;--color-warning-500: #E05151;--color-confirmation-400: #73b9a2;--color-confirmation-600: #64B298;--font-family-primary: SF Pro;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-style-normal: normal;--font-style-italic: italic;--font-size-body-1: 10px;--font-size-body-2: 12px;--font-size-body-3: 14px;--font-size-body-4: 16px;--font-size-body-5: 18px;--font-size-body-6: 20px;--font-size-h1: 46px;--font-size-h2: 40px;--font-size-h3: 36px;--font-size-h4: 30px;--font-size-h5: 24px;--font-size-body-base: var(--font-size-body-4);--font-size-label: var(--font-size-body-3);--button-default-background: var(--color-orange);--button-default-text-color: var(--color-white);--button-default-background-hover-color: rgba(var(--color-orange-rgb), .9);--button-default-text-hover-color: var(--color-white);--button-default-background-focus-color: var(--color-orange-rgb);--button-default-text-focus-color: rgba(var(--color-white-rgb), .8);--button-style-1-background: var(--color-black);--button-style-1-text-color: var(--color-white);--button-style-1-background-hover-color: rgba(var(--color-black-rgb), .9);--button-style-1-text-hover-color: var(--color-white);--button-style-1-background-focus-color: var(--color-grey-dark);--button-style-1-text-focus-color: rgba(var(--color-white-rgb), .8);--button-disabled-background-color: var(--color-grey);--button-disabled-default-text-color: var(--color-white);--link-color: var(--color-orange);--link-hover-color: var(--color-black);--link-focus-color: rgba(var(--color-orange), .9);--link-disabled-color: rgba(var(--color-grey), .2);--transition-slow: .2s;--transition: .6s;--transition-fast: 1s}