react-restyle-components 0.2.89 → 0.2.91

package/lib/src/core-components/__mocks__/styleMock.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=styleMock.d.ts.map

package/lib/src/core-components/__mocks__/styleMock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styleMock.d.ts","sourceRoot":"","sources":["../../../../src/core-components/__mocks__/styleMock.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC"}

package/lib/src/core-components/__mocks__/styleMock.js

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

package/lib/src/core-components/index.d.ts

@@ -0,0 +1,34 @@
+import * as Form from './src/atoms/form/form.component';
+export * from './src/atoms/button/button.component';
+export * from './src/atoms/button/buttonGroup/buttonGroup.component';
+export * from './src/atoms/check-box/checkBox.component';
+export * from './src/atoms/date-picker/date-picker.component';
+export * from './src/atoms/input/input-otp.component';
+export * from './src/atoms/input/input-pin.component';
+export * from './src/atoms/input/input.component';
+export * from './src/atoms/input-dropdown/input-dropdown.component';
+export * from './src/atoms/loader/loader.component';
+export * from './src/atoms/radio/radio.component';
+export * from './src/atoms/stepper/stepper.component';
+export * from './src/atoms/timer/timer.component';
+export * from './src/atoms/tooltip/tooltip.component';
+export * from './src/atoms/icons/icons.component';
+export * from './src/atoms/tabs/tabs.component';
+export * from './src/atoms/pdf/pdf-images.components';
+export * from './src/atoms/pdf/pdf-table.components';
+export * from './src/atoms/pdf/pdf-typography.components';
+export * from './src/atoms/pdf/pdf-wrapped-view.components';
+export * from './src/molecules/css-multiline-input/css-multiline-input.component';
+export * from './src/molecules/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component';
+export * from './src/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.component';
+export * from './src/molecules/multi-select/multi-select.component';
+export * from './src/molecules/multi-select-with-field/multi-select-with-field.component';
+export * from './src/molecules/modal/modal.component';
+export * from './src/molecules/modal-confirm/modal-confirm.component';
+export * from './src/molecules/autocomplete/autocomplete';
+export * from './src/molecules/auto-complete-group-by/auto-complete-group-by.component';
+export * from './src/molecules/color-picker/color-picker.component';
+export * from './src/molecules/color-picker-modal/color-picker-modal.component';
+export * from './src/molecules/auto-complete-filter-single-select/auto-complete-filter-single-select.component';
+export { Form };
+//# sourceMappingURL=index.d.ts.map

package/lib/src/core-components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core-components/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,IAAI,MAAM,iCAAiC,CAAC;AACxD,cAAc,qCAAqC,CAAC;AACpD,cAAc,sDAAsD,CAAC;AACrE,cAAc,0CAA0C,CAAC;AACzD,cAAc,+CAA+C,CAAC;AAC9D,cAAc,uCAAuC,CAAC;AACtD,cAAc,uCAAuC,CAAC;AACtD,cAAc,mCAAmC,CAAC;AAClD,cAAc,qDAAqD,CAAC;AACpE,cAAc,qCAAqC,CAAC;AACpD,cAAc,mCAAmC,CAAC;AAClD,cAAc,uCAAuC,CAAC;AACtD,cAAc,mCAAmC,CAAC;AAClD,cAAc,uCAAuC,CAAC;AACtD,cAAc,mCAAmC,CAAC;AAClD,cAAc,iCAAiC,CAAC;AAChD,cAAc,uCAAuC,CAAC;AACtD,cAAc,sCAAsC,CAAC;AACrD,cAAc,2CAA2C,CAAC;AAC1D,cAAc,6CAA6C,CAAC;AAE5D,cAAc,mEAAmE,CAAC;AAClF,cAAc,qJAAqJ,CAAC;AACpK,cAAc,iJAAiJ,CAAC;AAChK,cAAc,qDAAqD,CAAC;AACpE,cAAc,2EAA2E,CAAC;AAC1F,cAAc,uCAAuC,CAAC;AACtD,cAAc,uDAAuD,CAAC;AACtE,cAAc,2CAA2C,CAAC;AAC1D,cAAc,yEAAyE,CAAC;AACxF,cAAc,qDAAqD,CAAC;AACpE,cAAc,iEAAiE,CAAC;AAChF,cAAc,iGAAiG,CAAC;AAEhH,OAAO,EAAC,IAAI,EAAC,CAAC"}

package/lib/src/core-components/index.js

@@ -0,0 +1,33 @@
+import * as Form from './src/atoms/form/form.component';
+export * from './src/atoms/button/button.component';
+export * from './src/atoms/button/buttonGroup/buttonGroup.component';
+export * from './src/atoms/check-box/checkBox.component';
+export * from './src/atoms/date-picker/date-picker.component';
+export * from './src/atoms/input/input-otp.component';
+export * from './src/atoms/input/input-pin.component';
+export * from './src/atoms/input/input.component';
+export * from './src/atoms/input-dropdown/input-dropdown.component';
+export * from './src/atoms/loader/loader.component';
+export * from './src/atoms/radio/radio.component';
+export * from './src/atoms/stepper/stepper.component';
+export * from './src/atoms/timer/timer.component';
+export * from './src/atoms/tooltip/tooltip.component';
+export * from './src/atoms/icons/icons.component';
+export * from './src/atoms/tabs/tabs.component';
+export * from './src/atoms/pdf/pdf-images.components';
+export * from './src/atoms/pdf/pdf-table.components';
+export * from './src/atoms/pdf/pdf-typography.components';
+export * from './src/atoms/pdf/pdf-wrapped-view.components';
+export * from './src/molecules/css-multiline-input/css-multiline-input.component';
+export * from './src/molecules/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component';
+export * from './src/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.component';
+export * from './src/molecules/multi-select/multi-select.component';
+export * from './src/molecules/multi-select-with-field/multi-select-with-field.component';
+export * from './src/molecules/modal/modal.component';
+export * from './src/molecules/modal-confirm/modal-confirm.component';
+export * from './src/molecules/autocomplete/autocomplete';
+export * from './src/molecules/auto-complete-group-by/auto-complete-group-by.component';
+export * from './src/molecules/color-picker/color-picker.component';
+export * from './src/molecules/color-picker-modal/color-picker-modal.component';
+export * from './src/molecules/auto-complete-filter-single-select/auto-complete-filter-single-select.component';
+export { Form };

package/lib/src/core-components/jest.config.d.ts

@@ -0,0 +1,12 @@
+declare const _default: {
+    present: string;
+    testEnvironment: string;
+    transform: {
+        '^.+\\.tsx?$': string;
+    };
+    moduleNameMapper: {
+        '\\.(css|sass)$': string;
+    };
+};
+export default _default;
+//# sourceMappingURL=jest.config.d.ts.map

package/lib/src/core-components/jest.config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"jest.config.d.ts","sourceRoot":"","sources":["../../../src/core-components/jest.config.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,wBASE"}

package/lib/src/core-components/jest.config.js

@@ -0,0 +1,10 @@
+export default {
+    present: 'ts-jest',
+    testEnvironment: 'jest-environment-jsdom',
+    transform: {
+        '^.+\\.tsx?$': 'ts-jest',
+    },
+    moduleNameMapper: {
+        '\\.(css|sass)$': '<rootDir>/src/__mocks__/styleMock.ts',
+    },
+};

package/lib/src/core-components/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/core-components/src/App.d.ts

@@ -0,0 +1,4 @@
+import './App.css';
+declare function App(): import("react/jsx-runtime").JSX.Element;
+export default App;
+//# sourceMappingURL=App.d.ts.map

package/lib/src/core-components/src/App.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../../../../src/core-components/src/App.tsx"],"names":[],"mappings":"AACA,OAAO,WAAW,CAAC;AAInB,iBAAS,GAAG,4CAiBX;AAED,eAAe,GAAG,CAAC"}

package/lib/src/core-components/src/App.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import './App.css';
+import { Tab, Tabs } from './atoms/tabs/tabs.component';
+function App() {
+    const [color, setColor] = useState('#aabbcc');
+    return (_jsx("div", { className: "flex flex-col gap-4 p-4", children: _jsxs(Tabs, { options: [{ title: 'Work History' }, { title: 'Book Order' }], children: [_jsx(Tab, { title: "Work History", children: _jsx("div", { children: "Work" }) }), _jsx(Tab, { title: "Book Order", children: _jsx("div", { children: "Book" }) })] }) }));
+}
+export default App;

package/lib/src/core-components/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/core-components/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/core-components/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/core-components/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/core-components/src/assets/styles/typography.css

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

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

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Button.test.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.test.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/atoms/button/Button.test.tsx"],"names":[],"mappings":""}

package/lib/src/core-components/src/atoms/button/Button.test.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, it, expect } from 'vitest';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { Button } from './button.component';
+import { TooltipProvider } from '../tooltip/tooltip.component';
+describe('Renders a button', async () => {
+    it('Renders the supplied children', async () => {
+        render(_jsx(Button, { children: "Hello" }));
+        const b = await screen.queryByText('Hello');
+        expect(b).toBeInTheDocument();
+    });
+    it('Renders as a button', async () => {
+        render(_jsx(Button, { children: "Hello" }));
+        const b = await screen.queryByText('Hello');
+        expect(b?.tagName.toLowerCase()).toBe('button');
+    });
+    it('Includes the tooltip when specified', async () => {
+        render(_jsx(TooltipProvider, { children: _jsx(Button, { "data-testid": "btn", tooltip: "bye", children: "Hello" }) }));
+        const button = await screen.getByTestId('btn');
+        fireEvent.mouseOver(button);
+        setTimeout(async () => {
+            //delay for tooltip to be available in DOM
+            const t = await screen.queryByText('bye');
+            expect(t).toBeInTheDocument();
+        }, 1000);
+    });
+});

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

@@ -0,0 +1,26 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+import { LinkProps } from 'react-router-dom';
+export type ButtonProps = {
+    variant?: 'solid' | 'outline';
+    /** Optional tooltip content */
+    tooltip?: string;
+    /** ClassName to add so you can add additional styling */
+    className?: string;
+};
+export type LinkButtonProps = Omit<ButtonProps, 'loading'> & {
+    /** The location the link will take you to */
+    to: string;
+    /** The underlaying UI component to use */
+    Component: ForwardRefExoticComponent<LinkProps & RefAttributes<HTMLAnchorElement>>;
+};
+export type ToggleButtonProps = Omit<ButtonProps, 'variant'> & {
+    /** Optionally pass an extra classname to the label wrapper */
+    labelClassName?: string;
+    /** Optionally pass an extra classname to the content wrapper */
+    contentClassName?: string;
+    /** Optionally pass an active state. If not passed the component will be uncontrolled. */
+    active?: boolean;
+    /** What variant of button? Defaults to 'brand' */
+    variant?: 'brand' | 'accent';
+};
+//# sourceMappingURL=Button.types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/atoms/button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,yBAAyB,EAAE,aAAa,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAC,SAAS,EAAC,MAAM,kBAAkB,CAAC;AAE3C,MAAM,MAAM,WAAW,GAAG;IACxB,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,+BAA+B;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC3D,6CAA6C;IAC7C,EAAE,EAAE,MAAM,CAAC;IACX,0CAA0C;IAC1C,SAAS,EAAE,yBAAyB,CAClC,SAAS,GAAG,aAAa,CAAC,iBAAiB,CAAC,CAC7C,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC7D,8DAA8D;IAC9D,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gEAAgE;IAChE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yFAAyF;IACzF,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,kDAAkD;IAClD,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC9B,CAAC"}

package/lib/src/core-components/src/atoms/button/Button.types.js

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

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

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ButtonProps } from './Button.types';
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=button.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/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/src/atoms/button/button.component.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { Tooltip } from '../tooltip/tooltip.component';
+import s from '../../tc.module.css';
+import { cn } from '../../utils';
+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'], 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 });
+    }
+    else {
+        return button;
+    }
+});
+Button.displayName = 'Button';

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

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+export declare const ButtonGroup: ({ children, orientation, className, }: {
+    children: ReactNode;
+    orientation?: "horizontal" | "vertical" | undefined;
+    className?: string | undefined;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=buttonGroup.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"buttonGroup.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/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/src/atoms/button/buttonGroup/buttonGroup.component.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import s from '../../../tc.module.css';
+import { cn } from '../../../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/src/atoms/check-box/checkBox.component.d.ts

@@ -0,0 +1,10 @@
+interface CheckBoxProps {
+    title: string;
+    data: Array<any>;
+    className?: string;
+    disable?: boolean;
+    onChange: (items: any) => void;
+}
+export declare const CheckBox: ({ title, data, className, onChange, }: CheckBoxProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=checkBox.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"checkBox.component.d.ts","sourceRoot":"","sources":["../../../../../../src/core-components/src/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,4CAuCf,CAAC"}