react-restyle-components 0.2.42 → 0.2.44

package/lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-restyle-components",
-  "version": "0.2.41",
+  "version": "0.2.43",
   "private": false,
   "description": "Easy use restyle components",
   "author": {
@@ -24,6 +24,7 @@
     "storybook": "storybook dev -p 6006",
     "build-storybook": "rm -rf docs-build && storybook build -o docs-build",
     "deploy-storybook": "gh-pages -d docs-build",
+    "serve-storybook": "npm run build-storybook -- -o ./docs-build && npx http-server ./docs-build",
     "lint": "eslint .",
     "lint:fix": "eslint --fix .",
     "prettier": "prettier --write '**/*.{js,jsx}'",
@@ -45,7 +46,7 @@
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/user-event": "^13.5.0",
     "@types/jest": "^27.5.2",
-    "@types/node": "^16.18.113",
+    "@types/node": "^22.10.2",
     "@types/react": "^18.3.11",
     "@types/react-dom": "^18.3.0",
     "buffer": "^6.0.3",
@@ -83,13 +84,13 @@
     "@svgr/webpack": "^8.1.0",
     "@tailwindcss/forms": "^0.5.9",
     "@testing-library/react": "^16.0.1",
+    "@vitejs/plugin-react": "^4.2.1",
     "@vitest/coverage-c8": "^0.31.4",
     "@vitest/ui": "^0.31.4",
     "autoprefixer": "^10.4.19",
     "copyfiles": "^2.4.1",
     "craco-alias": "^3.0.1",
     "css-loader": "^7.1.2",
-    "@vitejs/plugin-react": "^4.2.1",
     "eslint": "^9.14.0",
     "eslint-plugin-storybook": "^0.8.0",
     "gh-pages": "^3.2.3",
@@ -102,11 +103,11 @@
     "sass": "^1.77.5",
     "sass-loader": "^14.2.1",
     "storybook": "^8.0.6",
+    "storybook-css-modules": "^1.0.8",
     "storybook-multilevel-sort": "^2.0.1",
     "style-loader": "^4.0.0",
     "tailwindcss": "^3.4.14",
     "ts-jest": "^29.2.5",
-    "webpack": "^5.72.0",
     "vite": "^5.0.11",
     "vite-plugin-css-injected-by-js": "^3.1.1",
     "vite-plugin-dts": "^2.3.0",
@@ -115,7 +116,8 @@
     "vite-plugin-svgr": "^4.2.0",
     "vite-tsconfig-paths": "^4.2.0",
     "vitest": "^0.31.4",
-    "vitest-dom": "^0.1.0"
+    "vitest-dom": "^0.1.0",
+    "webpack": "^5.72.0"
   },
   "eslintConfig": {
     "extends": [

package/lib/src/App.css

@@ -0,0 +1,45 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  background-color: #282c34;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.react-bootstrap-table table {
+  table-layout: auto;
+}
+.bg-orange1 {
+  background-color: "#EF4444";
+}

package/lib/src/assets/styles/colors.css

@@ -0,0 +1,217 @@
+html.theme--dark {
+  color-scheme: dark;
+}
+html.theme--light {
+  color-scheme: light;
+}
+
+:root {
+  --B25: #ebf3ff;
+  --B50: #dbeaff;
+  --B100: #b2d2ff;
+  --B200: #9bc5ff;
+  --B300: #7ab1fd;
+  --B400: #337ee7;
+  --B500: #145bbf;
+  --B600: #0c489c;
+  --B700: #033273;
+  --Brand: var(--B700);
+
+  --A50: #e0feff;
+  --A100: #adf8fb;
+  --A200: #5ae8ed;
+  --A300: #36dbe0;
+  --A400: #1ac7cd;
+  --A500: #16a8ad;
+  --A600: #108b8f;
+  --A700: #075255;
+  --Accent: var(--A400);
+
+  --N0: #ffffff;
+  --N25: #f9f9f9;
+  --N50: #f2f2f2;
+  --N75: #e6e6e6;
+  --N100: #dbdbdb;
+  --N200: #cbcbcb;
+  --N300: #b5b5b5;
+  --N400: #a4a2a2;
+  --N500: #808080;
+  --N600: #4d4d4d;
+  --N700: #242323;
+  --N1000: #000000;
+  --Natural: var(--N700);
+
+  --Gl25: #f7f9fc;
+  --Gl50: #e7edf8;
+  --Gl100: #d6e1f4;
+  --Gl200: #b9c8e7;
+  --Gl300: #9babd1;
+  --Gl400: #7a89b1;
+  --Gl500: #566384;
+  --Gl600: #4a5777;
+  --Gl700: #3f4b6a;
+  --Gl800: #2e3750;
+  --Gl850: #262e43;
+  --Gl900: #1e2537;
+  --Gl950: #1b1d24;
+  --Glacious: var(--Gl800);
+
+  --HO50: #ffded5;
+  --HO100: #feb9a5;
+  --HO200: #ff906e;
+  --HO300: #ff784f;
+  --HO400: #ff5d2d;
+  --HO500: #eb4d13;
+  --HO600: #7e2600;
+  --HO700: #421604;
+  --HotOrange: var(--HO400);
+
+  --Y50: #fbf3e0;
+  --Y100: #f9e3b6;
+  --Y200: #fcc003;
+  --Y300: #e4a201;
+  --Y400: #ca8501;
+  --Y500: #a35803;
+  --Y600: #6f3400;
+  --Y700: #2e2204;
+  --Yellow: var(--Y200);
+
+  --Gr25: #eafae6;
+  --Gr50: #cdefc4;
+  --Gr100: #91db8b;
+  --Gr200: #45c65a;
+  --Gr300: #3ba755;
+  --Gr400: #2e844a;
+  --Gr500: #22683e;
+  --Gr600: #194e31;
+  --Gr700: #0e3522;
+  --Green: var(--Gr300);
+
+  --CB50: #cfe9fe;
+  --CB100: #90d0fe;
+  --CB200: #1ab9ff;
+  --CB300: #08abed;
+  --CB400: #0d9dda;
+  --CB500: #107cad;
+  --CB600: #084968;
+  --CB700: #023248;
+  --CloudBlue: var(--CB500);
+
+  --I50: #e0e5f8;
+  --I100: #bec7f6;
+  --I200: #9ea9f1;
+  --I300: #8e9bef;
+  --I400: #7f8ced;
+  --I500: #5867e8;
+  --I600: #3a49da;
+  --I700: #260f8f;
+  --Indigo: var(--I500);
+
+  --Pu50: #ece1f9;
+  --Pu100: #d7bff2;
+  --Pu200: #c29ef1;
+  --Pu300: #b78def;
+  --Pu400: #ad7bee;
+  --Pu500: #9050e9;
+  --Pu600: #7526e3;
+  --Pu700: #401075;
+  --Purple: var(--Pu500);
+
+  --V50: #f2defe;
+  --V100: #e5b9fe;
+  --V200: #d892fe;
+  --V300: #d384fe;
+  --V400: #cb65ff;
+  --V500: #ba01ff;
+  --V600: #7b119a;
+  --V700: #3d0157;
+  --Violet: var(--V500);
+
+  --Pi50: #fddde3;
+  --Pi100: #fdb6c5;
+  --Pi200: #fe8aa7;
+  --Pi300: #fe7298;
+  --Pi400: #ff538a;
+  --Pi500: #e3066a;
+  --Pi600: #b60554;
+  --Pi700: #61022a;
+  --Pink: var(--Pi400);
+
+  --R25: #fcece8;
+  --R50: #ffdfd7;
+  --R100: #feb8ab;
+  --R200: #fe8f7d;
+  --R300: #fe7765;
+  --R400: #fe5c4c;
+  --R500: #ee3e3e;
+  --R600: #ba0517;
+  --R700: #640103;
+  --Red: var(--R400);
+
+  --color-impersonation-start: #ec4b4b;
+  --color-bloomberg: #fe9c29;
+}
+
+.theme--dark {
+  --global-focus-color: var(--B300);
+  --global-window-border-color: var(--Gl800);
+  --global-text-primary: var(--N0);
+  --global-text-primary-inverse: var(--N1000);
+  --global-text-secondary: var(--Gl100);
+  --global-input-disabled-color: var(--Gl600);
+  --global-input-bg: var(--Gl800);
+  --global-input-disabled-bg: var(--Gl800);
+  --global-input-disabled-label-color: var(--Gl600);
+  --global-input-error-highlight: var(--R400);
+  --global-input-placeholder-color: rgb(from var(--N0) r g b / 0.4);
+  --global-input-caret-color: var(--B300);
+  --global-input-error-caret-color: var(--R400);
+  --global-input-border-color: var(--Gl600);
+  --global-input-color: var(--N0);
+  --global-input-label-color: var(--Gl100);
+}
+
+.theme--light {
+  --global-focus-color: var(--B400);
+  --global-window-border-color: var(--N100);
+  --global-text-primary: var(--N1000);
+  --global-text-primary-inverse: var(--N0);
+  --global-text-secondary: var(--N700);
+  --global-input-disabled-color: var(--N300);
+  --global-input-bg: var(--N0);
+  --global-input-disabled-bg: var(--N50);
+  --global-input-disabled-label-color: var(--N300);
+  --global-input-error-highlight: var(--R500);
+  --global-input-placeholder-color: var(--N300);
+  --global-input-caret-color: var(--B500);
+  --global-input-error-caret-color: var(--R500);
+  --global-input-border-color: var(--N200);
+  --global-input-color: var(--N1000);
+  --global-input-label-color: var(--N700);
+}
+
+/* Menu colors - used for Dropdowns, Context Menus, etc */
+.theme--dark {
+  --menu-panel-bg-color: var(--Gl700);
+  --menu-panel-border-color: var(--Gl500);
+  --menu-button-bg-color-hover: var(--Gl500);
+  --menu-heading-color: var(--A400);
+  --menu-toggle_bg: var(--Gl400);
+  --menu-toggle_bg_disabled: var(--Gl800);
+  --menu-toggle_thumb_bg_disabled: var(--Gl500);
+  --menu-toggle_bg_active: var(--A400);
+  --menu-toggle_thumb_bg: var(--N0);
+  --menu-panel-shadow-color: rgba(0, 0, 0, 0.4);
+}
+.theme--light {
+  --menu-panel-bg-color: var(--N0);
+  --menu-panel-border-color: var(--N100);
+  --menu-button-bg-color-hover: var(--N50);
+  --menu-heading-color: var(--A500);
+  --menu-toggle_bg: var(--N200);
+  --menu-toggle_bg_disabled: var(--N50);
+  --menu-toggle_thumb_bg_disabled: var(--N300);
+  --menu-toggle_bg_active: var(--A500);
+  --menu-toggle_thumb_bg: var(--N0);
+  --menu-panel-shadow-color: rgba(0, 0, 0, 0.15);
+}

package/lib/src/assets/styles/decorations.css

@@ -0,0 +1,15 @@
+/* 
+  Consuming apps can expect these variables to exist and use them directly - much like the colors.css file.
+  We shouldn't resort to using this for every case where we want 2 or more components to share a style.
+*/
+:root {
+  --menu-panel-border: 1px solid var(--menu-panel-border-color);
+  --menu-panel-shadow: 0px 16px 40px var(--menu-panel-shadow-color);
+  --menu-panel-radius: 4px;
+  --menu-panel-vertical-padding: 4px;
+  --menu-clickable-color: var(--global-text-primary);
+  --menu-clickable-font-size: 12px;
+  --menu-clickable-font-weight: 400;
+  --menu-clickable-disabled: 0.5;
+  --menu-clickable-vertical-padding: 6px;
+}

package/lib/src/assets/styles/fontface.css

@@ -0,0 +1,17 @@
+/* // Inter (variable weight fonts) Main typeface used throughout the app */
+@font-face {
+  font-family: 'Inter var';
+  font-weight: 100 900;
+  font-display: swap;
+  font-style: normal;
+  font-named-instance: 'Regular';
+  src: url('../fonts/Inter-roman.var.woff2?v=3.19') format('woff2');
+}
+@font-face {
+  font-family: 'Inter var';
+  font-weight: 100 900;
+  font-display: swap;
+  font-style: italic;
+  font-named-instance: 'Italic';
+  src: url('../fonts/Inter-italic.var.woff2?v=3.19') format('woff2');
+}

package/lib/src/assets/styles/scrollbars.css

@@ -0,0 +1,70 @@
+.theme--dark {
+  --scrollbar-background: transparent;
+  --scrollbar-button-display: none;
+  --scrollbar-thumb: rgb(142 142 142);
+}
+.theme--light {
+  --scrollbar-background: transparent;
+  --scrollbar-button-display: none;
+  --scrollbar-thumb: rgb(163 179 221);
+}
+/* The bar/track */
+::-webkit-scrollbar {
+  background: var(--scrollbar-background);
+  width: var(--scrollbar-size, 20px);
+  height: var(--scrollbar-size, 20px);
+}
+/* The thumb/drag/pill */
+::-webkit-scrollbar-thumb {
+  border: calc(var(--scrollbar-size, 20px) * var(--scrollbar-inset, 0.2)) solid transparent;
+  border-radius: calc(var(--scrollbar-size, 20px) / 2);
+  background-color: rgb(from var(--scrollbar-thumb) r g b / 0.3);
+  background-clip: padding-box;
+}
+::-webkit-scrollbar-thumb:hover {
+  background-color: rgb(from var(--scrollbar-thumb) r g b / 0.7);
+}
+/* The buttons */
+::-webkit-scrollbar-button:single-button {
+  display: var(--scrollbar-button-display, block);
+  background-color: transparent;
+  background-position: center center;
+  background-repeat: no-repeat;
+  background-size: var(--scrollbar-size, 20px);
+  width: var(--scrollbar-size, 20px);
+  height: var(--scrollbar-size, 20px);
+}
+::-webkit-scrollbar-button:single-button:hover {
+  background-color: rgb(from var(--scrollbar-thumb) r g b / 0.25);
+}
+::-webkit-scrollbar-button:not(:single-button) {
+  display: none;
+}
+/* Left button */
+.theme--dark ::-webkit-scrollbar-button:horizontal:start {
+  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='rgb(185, 200, 231)'><polygon points='12,6 12,14 8,10'/></svg>");
+}
+.theme--light ::-webkit-scrollbar-button:horizontal:start {
+  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='rgb(77, 77, 77)'><polygon points='12,6 12,14 8,10'/></svg>");
+}
+/* Right button */
+.theme--dark ::-webkit-scrollbar-button:horizontal:end {
+  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='rgb(185, 200, 231)'><polygon points='8,6 8,14 12,10'/></svg>");
+}
+.theme--light ::-webkit-scrollbar-button:horizontal:end {
+  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='rgb(77, 77, 77)'><polygon points='8,6 8,14 12,10'/></svg>");
+}
+/* Up button */
+.theme--dark ::-webkit-scrollbar-button:vertical:start {
+  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='rgb(185, 200, 231)'><polygon points='6,12 14,12 10,8'/></svg>");
+}
+.theme--light ::-webkit-scrollbar-button:vertical:start {
+  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='rgb(77, 77, 77)'><polygon points='6,12 14,12 10,8'/></svg>");
+}
+/* Down button */
+.theme--dark ::-webkit-scrollbar-button:vertical:end {
+  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='rgb(185, 200, 231)'><polygon points='6,8 14,8 10,12'/></svg>");
+}
+.theme--light ::-webkit-scrollbar-button:vertical:end {
+  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='rgb(77, 77, 77)'><polygon points='6,8 14,8 10,12'/></svg>");
+}

package/lib/src/assets/styles/typography.css

@@ -0,0 +1,3 @@
+:root {
+  font-family: 'Inter var', sans-serif;
+}

package/lib/src/core-components/atoms/button/button.component.d.ts

@@ -1,7 +1,4 @@
 import React from 'react';
 import { ButtonProps } from './Button.types';
-/**
- * It's a `<button>button</button>`. Pass in regular button props such as onClick as well as any of the props defined here.
- */
 export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
 //# sourceMappingURL=button.component.d.ts.map

package/lib/src/core-components/atoms/button/button.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/button/button.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAI3C;;GAEG;AACH,eAAO,MAAM,MAAM,uIA0DlB,CAAC"}
+{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/button/button.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAK3C,eAAO,MAAM,MAAM,uIA0DlB,CAAC"}

package/lib/src/core-components/atoms/button/button.component.js

@@ -3,14 +3,11 @@ import { forwardRef } from 'react';
 import { Tooltip } from '../tooltip/tooltip.component';
 import s from '../../../tc.module.css';
 import { cn } from '../../../core-utils';
-/**
- * It's a `<button>button</button>`. Pass in regular button props such as onClick as well as any of the props defined here.
- */
 export const Button = forwardRef(({ variant = 'solid', tooltip, disabled = false, type = 'button', className, children, ...args }, ref) => {
     const buttonColorClass = variant === 'solid'
         ? cn(s['text-white'], s['bg-[#007BFF]'], s['hover:bg-[#007BFF]'], s['hover:shadow-lg'], s['text-white'])
         : cn(s['dark:text-white'], s['text-black'], s['border'], s['border-gray-400'], s['hover:shadow-lg']);
-    const button = (_jsx("button", { ref: ref, ...args, className: cn(s['rounded-100px'], s['px-3'], s['py-1'], s['text-md'], buttonColorClass, s['pt-2'], s['pb-2'], s['font-nunitoSansRegular'], disabled ? s['opacity-50'] : s['opacity-100'], className), type: type, disabled: disabled, children: children }));
+    const button = (_jsx("button", { ref: ref, ...args, className: cn(s['rounded-100px'], s['px-3'], s['py-1'], s['text-md'], s['pt-2'], s['pb-2'], s['font-nunitoSansRegular'], disabled ? s['opacity-50'] : s['opacity-100'], buttonColorClass, className), type: type, disabled: disabled, children: children }));
     if (tooltip) {
         return _jsx(Tooltip, { content: tooltip, children: button });
     }

package/lib/src/core-components/atoms/button/buttonGroup/buttonGroup.component.d.ts

@@ -1,5 +1,4 @@
 import { ReactNode } from 'react';
-import '../../../../tc.module.css';
 export declare const ButtonGroup: ({ children, orientation, className, }: {
     children: ReactNode;
     orientation?: "horizontal" | "vertical" | undefined;

package/lib/src/core-components/atoms/button/buttonGroup/buttonGroup.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"buttonGroup.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/atoms/button/buttonGroup/buttonGroup.component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAChC,OAAO,2BAA2B,CAAC;AAEnC,eAAO,MAAM,WAAW;cAKZ,SAAS;;;6CASpB,CAAC"}
+{"version":3,"file":"buttonGroup.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/atoms/button/buttonGroup/buttonGroup.component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAIhC,eAAO,MAAM,WAAW;cAKZ,SAAS;;;6CAepB,CAAC"}

package/lib/src/core-components/atoms/button/buttonGroup/buttonGroup.component.js

@@ -1,3 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import '../../../../tc.module.css';
-export const ButtonGroup = ({ children, orientation = 'horizontal', className, }) => (_jsx("div", { className: `flex ${orientation == 'horizontal' ? 'flex-row' : 'flex-col'} w-fit gap-2 ${className}`, children: children }));
+import s from '../../../../tc.module.css';
+import { cn } from '../../../../core-utils';
+export const ButtonGroup = ({ children, orientation = 'horizontal', className, }) => (_jsx("div", { className: cn(s.flex, orientation == 'horizontal' ? s['flex-row'] : s['flex-col'], s['w-fit'], s['gap-2'], className), children: children }));

package/lib/src/core-components/atoms/check-box/checkBox.component.d.ts

@@ -1,4 +1,3 @@
-import '../../../tc.module.css';
 interface CheckBoxProps {
     title: string;
     data: Array<any>;

package/lib/src/core-components/atoms/check-box/checkBox.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"checkBox.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/check-box/checkBox.component.tsx"],"names":[],"mappings":"AACA,OAAO,wBAAwB,CAAC;AAMhC,UAAU,aAAa;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;CAChC;AAED,eAAO,MAAM,QAAQ,0CAKlB,aAAa,4CAqCf,CAAC"}
+{"version":3,"file":"checkBox.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/check-box/checkBox.component.tsx"],"names":[],"mappings":"AAMA,UAAU,aAAa;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;CAChC;AAED,eAAO,MAAM,QAAQ,0CAKlB,aAAa,4CAmCf,CAAC"}

package/lib/src/core-components/atoms/check-box/checkBox.component.js

@@ -1,14 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
-import '../../../tc.module.css';
+import s from '../../../tc.module.css';
+import { cn } from '../../../core-utils';
 import { UnCheckbox, CheckedBox } from '../../../library/assets/svg';
-// import UnCheckbox from '../../../library/assets/svg/UnCheckbox.svg?react';
-// import CheckedBox from '../../../library/assets/svg/CheckedBox.svg?react';
 import { InputWrapper } from '../form/form.component';
 export const CheckBox = ({ title = 'Banks', data = [{ title: 'SBI Bank', checked: false }], className, onChange, }) => {
     const [list, setList] = useState(data);
     const width = 20;
-    return (_jsx(InputWrapper, { label: title, children: list?.map((item, index) => (_jsxs("div", { className: `${className} flex flex-row  items-center `, onClick: () => {
+    return (_jsx(InputWrapper, { label: title, children: list?.map((item, index) => (_jsxs("div", { className: `${cn(s.flex, s['flex-row'], s['items-center'])} ${className}`, onClick: () => {
                 const result = list?.map((e, i) => {
                     if (i === index)
                         return { ...e, checked: !item.checked };
@@ -17,5 +16,5 @@ export const CheckBox = ({ title = 'Banks', data = [{ title: 'SBI Bank', checked
                 });
                 setList(result);
                 onChange(result?.filter((item) => item.checked));
-            }, children: [_jsx("div", { className: "flex mt-1", children: item.checked ? (_jsx(CheckedBox, { width: width, height: width, fill: "#E7503D", stroke: "E7503D" })) : (_jsx(UnCheckbox, { width: width, height: width })) }), _jsx("span", { children: item?.title })] }, index))) }));
+            }, children: [_jsx("div", { className: cn(s.flex, s['mt-1']), children: item.checked ? (_jsx(CheckedBox, { width: width, height: width, fill: "#E7503D", stroke: "E7503D" })) : (_jsx(UnCheckbox, { width: width, height: width })) }), _jsx("span", { children: item?.title })] }, index))) }));
 };

package/lib/src/core-components/atoms/date-picker/date-picker.component.d.ts

@@ -1,4 +1,3 @@
-import '../../../tc.module.css';
 import 'react-datepicker/dist/react-datepicker.css';
 interface DatePickerProps {
     title: string;

package/lib/src/core-components/atoms/date-picker/date-picker.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/date-picker/date-picker.component.tsx"],"names":[],"mappings":"AACA,OAAO,wBAAwB,CAAC;AAEhC,OAAO,4CAA4C,CAAC;AAKpD,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,cAAc,mEAOxB,eAAe,4CAoCjB,CAAC"}
+{"version":3,"file":"date-picker.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/date-picker/date-picker.component.tsx"],"names":[],"mappings":"AAEA,OAAO,4CAA4C,CAAC;AAOpD,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,cAAc,mEAOxB,eAAe,4CAkDjB,CAAC"}

package/lib/src/core-components/atoms/date-picker/date-picker.component.js

@@ -1,19 +1,20 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, forwardRef } from 'react';
-import '../../../tc.module.css';
 import DatePicker from 'react-datepicker';
 import 'react-datepicker/dist/react-datepicker.css';
 import { DatePickerSvg } from '../../../library/assets/svg';
 import dayjs from 'dayjs';
 import { InputWrapper } from '../form/form.component';
+import s from '../../../tc.module.css';
+import { cn } from '../../../core-utils';
 export const DatePickerComp = ({ title = 'Title', className, disable, value, showFormat = 'yyyy-MM-dd', placeholder = 'Select Date', }) => {
     const [pickedDate, setPickedDate] = useState(value && dayjs(value).toDate());
     const CustomInput = forwardRef((props, ref) => {
-        return (_jsxs("div", { onClick: !disable && props.onClick, ref: ref, className: " border-gray-light place-items-center  border rounded-md px-2 flex ", children: [_jsx("label", { className: "mr-3 font-arimaRegular text-primaryCharcoal text-lg", children: props.value || props.placeholder }), _jsx(DatePickerSvg, { width: 15, height: 15 })] }));
+        return (_jsxs("div", { onClick: !disable && props.onClick, ref: ref, className: cn(s['border-gray-light'], s['place-items-center'], s['border'], s['rounded-md'], s['px-2'], s.flex), children: [_jsx("label", { className: cn(s['mr-3'], s['font-arimaRegular'], s['text-primaryCharcoal'], s['text-lg']), children: props.value || props.placeholder }), _jsx(DatePickerSvg, { width: 15, height: 15 })] }));
     });
     CustomInput.displayName = 'CustomInput';
     const handleChanges = (date) => {
         setPickedDate(date);
     };
-    return (_jsx(InputWrapper, { label: title, children: _jsx("div", { className: `${className} flex zIndex-999`, children: _jsx(DatePicker, { selected: pickedDate || new Date(), dateFormat: showFormat, placeholder: placeholder, onChange: handleChanges, customInput: _jsx(CustomInput, {}) }) }) }));
+    return (_jsx(InputWrapper, { label: title, children: _jsx("div", { className: cn(s.flex, s['zIndex-999'], className), children: _jsx(DatePicker, { selected: pickedDate || new Date(), dateFormat: showFormat, placeholder: placeholder, onChange: handleChanges, customInput: _jsx(CustomInput, {}) }) }) }));
 };

package/lib/src/core-components/atoms/form/form.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/form/form.component.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"form.component.d.ts","sourceRoot":"","sources":["../../../../../src/core-components/atoms/form/form.component.tsx"],"names":[],"mappings":"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"}