kelt-ui-kit-react 1.8.3 → 1.8.5

package/package/src/index.css

@@ -1,502 +0,0 @@
-/* variables couleur */
-:root {
-  --primary-color: #004aad;
-  --secondary-color: #ff914d;
-  --tertiary-color: #00ada1;
-  --quaternary-color: #0082ad;
-  --success-color: #28a745;
-  --info-color: #17a2b8;
-  --warning-color: #ec942c;
-  --danger-color: #dc3545;
-  --light-color: #f8f9fa;
-  --dark-color: #343a40;
-  --white-color: #fff;
-  --black-color: #000;
-}
-
-html,
-body {
-  margin: 0;
-  font-family: "Raleway", sans-serif !important;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  height: 100%;
-}
-
-#root {
-  height: 100%;
-  width: 100%;
-  background-color: #fff;
-}
-.app {
-  container: app-container/ inline-size;
-}
-
-input[type="number"]::-webkit-outer-spin-button,
-input[type="number"]::-webkit-inner-spin-button {
-  -webkit-appearance: none; /* Chrome, Safari, Edge */
-  margin: 0;
-}
-/* flex properties */
-
-.d-flex {
-  display: flex;
-}
-.justify-content-start {
-  justify-content: start;
-}
-.justify-content-end {
-  justify-content: end;
-}
-.justify-content-center {
-  justify-content: center;
-}
-.justify-content-between {
-  justify-content: space-between;
-}
-.justify-content-around {
-  justify-content: space-around;
-}
-.justify-content-evenly {
-  justify-content: space-evenly;
-}
-.align-items-start {
-  align-items: start;
-}
-
-.align-items-center {
-  align-items: center;
-}
-
-.flex-column {
-  flex-direction: column;
-}
-
-.flex-row {
-  flex-direction: row;
-}
-
-.flex-wrap {
-  flex-wrap: wrap;
-}
-
-.flex-1 {
-  flex: 1;
-}
-
-.flex-2 {
-  flex: 2;
-}
-
-.flex-3 {
-  flex: 3;
-}
-
-.flex-4 {
-  flex: 4;
-}
-
-.flex-5 {
-  flex: 5;
-}
-
-.flex-6 {
-  flex: 6;
-}
-
-.flex-7 {
-  flex: 7;
-}
-
-.flex-8 {
-  flex: 8;
-}
-
-.flex-9 {
-  flex: 9;
-}
-
-.flex-10 {
-  flex: 10;
-}
-
-.flex-11 {
-  flex: 11;
-}
-
-.flex-12 {
-  flex: 12;
-}
-
-/* Reset CSS */
-* {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
-
-p {
-  margin: 0;
-}
-
-ul {
-  list-style: none;
-
-  & li {
-    margin: 0;
-  }
-}
-
-a {
-  text-decoration: none;
-  color: inherit;
-}
-
-/* helper */
-.h-100 {
-  height: 100%;
-}
-
-/* Text */
-.text-center {
-  text-align: center;
-}
-
-.text-left {
-  text-align: left;
-}
-
-.text-right {
-  text-align: right;
-}
-
-.text-justify {
-  text-align: justify;
-}
-
-.text-uppercase {
-  text-transform: uppercase;
-}
-
-.text-lowercase {
-  text-transform: lowercase;
-}
-
-.text-capitalize {
-  text-transform: capitalize;
-}
-
-.text-bold {
-  font-weight: bold;
-}
-
-.text-italic {
-  font-style: italic;
-}
-
-.text-underline {
-  text-decoration: underline;
-}
-
-.text-line-through {
-  text-decoration: line-through;
-}
-
-.text-white {
-  color: var(--white-color);
-}
-
-.text-black {
-  color: var(--black-color);
-}
-
-.text-primary {
-  color: var(--primary-color);
-}
-
-.text-secondary {
-  color: var(--secondary-color);
-}
-
-.text-success {
-  color: var(--success-color);
-}
-
-.text-info {
-  color: var(--info-color);
-}
-
-.text-warning {
-  color: var(--warning-color);
-}
-
-/* Margin et padding  */
-.m-0 {
-  margin: 0;
-}
-
-.m-1 {
-  margin: 0.25rem;
-}
-
-.m-2 {
-  margin: 0.5rem;
-}
-
-.m-3 {
-  margin: 1rem;
-}
-
-.mr-0 {
-  margin-right: 0;
-}
-
-.mr-1 {
-  margin-right: 0.25rem;
-}
-
-.mr-2 {
-  margin-right: 0.5rem;
-}
-
-.mr-3 {
-  margin-right: 1rem;
-}
-
-.ml-0 {
-  margin-left: 0;
-}
-
-.ml-1 {
-  margin-left: 0.25rem;
-}
-
-.ml-2 {
-  margin-left: 0.5rem;
-}
-
-.ml-3 {
-  margin-left: 1rem;
-}
-
-.mt-0 {
-  margin-top: 0;
-}
-
-.mt-1 {
-  margin-top: 0.25rem;
-}
-
-.mt-2 {
-  margin-top: 0.5rem;
-}
-
-.mt-3 {
-  margin-top: 1rem;
-}
-
-.mb-0 {
-  margin-bottom: 0;
-}
-
-.mb-1 {
-  margin-bottom: 0.25rem;
-}
-
-.mb-2 {
-  margin-bottom: 0.5rem;
-}
-
-.mb-3 {
-  margin-bottom: 1rem;
-}
-.pb-0 {
-  padding-bottom: 0;
-}
-.pb-1 {
-  padding-bottom: 0.25rem;
-}
-.pb-2 {
-  padding-bottom: 0.5rem;
-}
-.pb-3 {
-  padding-bottom: 1rem;
-}
-.pt-0 {
-  padding-top: 0;
-}
-.pt-1 {
-  padding-top: 0.25rem;
-}
-.pt-2 {
-  padding-top: 0.5rem;
-}
-.pt-3 {
-  padding-top: 1rem;
-}
-.pl-0 {
-  padding-left: 0;
-}
-.pl-1 {
-  padding-left: 0.25rem;
-}
-.pl-2 {
-  padding-left: 0.5rem;
-}
-.pl-3 {
-  padding-left: 1rem;
-}
-.pr-0 {
-  padding-right: 0;
-}
-.pr-1 {
-  padding-right: 0.25rem;
-}
-.pr-2 {
-  padding-right: 0.5rem;
-}
-.pr-3 {
-  padding-right: 1rem;
-}
-.p-0 {
-  padding: 0;
-}
-.p-1 {
-  padding: 0.25rem;
-}
-.p-2 {
-  padding: 0.5rem;
-}
-.p-3 {
-  padding: 1rem;
-}
-
-/* border */
-.border-bottom {
-  border-bottom: 1px solid #cfbdbd;
-}
-.border-top {
-  border-top: 1px solid #cfbdbd;
-}
-.border-left {
-  border-left: 1px solid #cfbdbd;
-}
-.border-right {
-  border-right: 1px solid #cfbdbd;
-}
-/* fonts */
-.font-weight-bold {
-  font-weight: 600;
-}
-.font-weight-light {
-  font-weight: 300;
-}
-.font-weight-normal {
-  font-weight: 400;
-}
-.font-weight-italic {
-  font-style: italic;
-}
-
-/* class generique*/
-.visible {
-  visibility: visible;
-}
-.hidden {
-  visibility: hidden;
-}
-.position-relative {
-  position: relative;
-}
-.position-absolute {
-  position: absolute;
-}
-.cursor-pointer {
-  cursor: pointer;
-}
-.w-100 {
-  width: 100%;
-}
-.min-width-auto {
-  min-width: auto;
-}
-.disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-  pointer-events: none;
-}
-.overflow-auto {
-  overflow: auto;
-}
-.toggle-btn {
-  display: flex;
-  width: 100%;
-  justify-content: flex-end;
-  background-color: transparent;
-  border: none;
-  color: #333;
-  cursor: pointer;
-  margin: 0;
-  min-width: 10px;
-  width: auto;
-  padding: 0px;
-
-  &.toggle-btn-round {
-    border: 1px solid #cfbdbd;
-    border-radius: 50%;
-    padding: 0.1rem;
-    width: 25px;
-    height: 25px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-
-  .bi {
-    font-size: 0.8rem;
-  }
-
-  &.toggle-btn--absolute {
-    position: absolute;
-    right: 10px;
-    top: 10px;
-  }
-}
-
-/* scrollbar */
-/* Style pour les navigateurs modernes */
-::-webkit-scrollbar {
-  width: 2px;
-  /* Largeur de la barre verticale */
-  height: 2px;
-  /* Hauteur de la barre horizontale */
-}
-
-::-webkit-scrollbar-thumb {
-  background-color: grey;
-  /* Couleur de la barre de défilement */
-  border-radius: 10px;
-  /* Arrondir les bords */
-}
-
-::-webkit-scrollbar-track {
-  background-color: transparent;
-  /* Couleur du fond de la zone de défilement */
-}
-
-/* Style pour Firefox */
-* {
-  scrollbar-width: thin;
-  /* Réduit la largeur */
-  scrollbar-color: grey transparent;
-  /* Couleurs : gris pour la barre, transparent pour le fond */
-}
-
-@media (min-width: 576px) {
-}
-
-@media (min-width: 768px) {
-}
-
-@media (min-width: 992px) {
-}

package/package/src/index.ts

@@ -1,58 +0,0 @@
-import "bootstrap-icons/font/bootstrap-icons.css";
-import "./index.css";
-export {
-  HistoryProvider,
-  useHistoryDepth,
-} from "./_core/hooks/HistoryProvider";
-export { ImageChecker } from "./_core/hooks/ImageChecker";
-export { ImageExist } from "./_core/hooks/imageExist";
-export { isValidEAN13 } from "./_core/hooks/isEAN13";
-export { objectToQueryParams } from "./_core/hooks/objectToQueryParams";
-export { useCurrency } from "./_core/hooks/useCurrency";
-export {
-  FormatDate,
-  localDateEndToUTC,
-  localDateStartToUTC,
-  LocalDateStringToUTC,
-} from "./_core/hooks/useDateutils";
-export { useIsMobile } from "./_core/hooks/useIsMobile";
-export { useToken } from "./_core/hooks/useToken";
-export { useValidate } from "./_core/hooks/useValidate";
-export { WidgetSupport } from "./_core/hooks/widgetSupport";
-export { ButtonAction } from "./action/ButtonAction";
-export { Badge } from "./badge/Badge";
-export { Button } from "./button/Button";
-export { ButtonActions } from "./button/buttonActions/ButtonActions";
-export { ButtonFile } from "./button/buttonFile/ButtonFile";
-export { Card } from "./card/Card";
-export { Carousel } from "./carousel/Carousel";
-export { Damier } from "./damier/Damier";
-export { DataTable } from "./dataTable/DataTable";
-export { DatePicker } from "./datePicker/DatePicker";
-export { Expands } from "./expands/Expands";
-export { FilAriane } from "./filAriane/FilAriane";
-export { DynamicForm } from "./form/Form";
-export { TypeInputEnum } from "./form/form.enum";
-export { Input } from "./form/input/Input";
-export { InputNumber } from "./form/inputNumber/InputNumber";
-export { InputPrice } from "./form/inputPrice/InputPrice";
-export { TextArea } from "./form/textArea/TextArea";
-export { Grid } from "./grid/Grid";
-export { Header } from "./header/Header";
-export { Icon } from "./icon/Icon";
-export { IconSizeEnum } from "./icon/iconSize.enum";
-export { Loader } from "./loader/Loader";
-export { Menus } from "./menus/Menus";
-export { Message } from "./message/Message";
-export { Modal } from "./modal/Modal";
-export { OverlayProvider } from "./overlayPanel/overlay.context";
-export { OverlayPanel } from "./overlayPanel/OverlayPanel";
-export { PdfViewer } from "./pdfViewer/PdfViewer";
-export { Quantity } from "./quantity/Quantity";
-export { Search } from "./search/Search";
-export { Select } from "./select/Select";
-export { Sidebar } from "./sidebar/Sidebar";
-export { SidebarData } from "./sidebarData/SidebarData";
-export { Tabs } from "./tabs/Tabs";
-export { useToasterStore } from "./toaster/store/useToasterStore";
-export { Toaster } from "./toaster/Toaster";

package/package/src/loader/Loader.tsx

@@ -1,37 +0,0 @@
-import { createPortal } from "react-dom";
-import { IconSizeEnum } from "../icon/iconSize.enum";
-import "./loader.css";
-export type LoaderProps = {
-  display: boolean;
-  message?: string;
-  size?: IconSizeEnum;
-  full?: true;
-};
-export const Loader = ({ display, full, message }: LoaderProps) => (
-  <>
-    {display && !full && (
-      <div className={`d-flex flex-column align-items-center`}>
-        {message && <span className="mb-3">{message}</span>}
-        <div className="position-relative">
-          <span className="loader"></span>
-        </div>
-      </div>
-    )}
-
-    {display &&
-      full &&
-      createPortal(
-        <div className="loader-overlay">
-          <div>
-            <div className={`d-flex flex-column align-items-center`}>
-              {message && <span className="mb-3">{message}</span>}
-              <div className="position-relative">
-                <span className="loader"></span>
-              </div>
-            </div>
-          </div>
-        </div>,
-        document.body
-      )}
-  </>
-);

package/package/src/loader/Loader.view.tsx

@@ -1,20 +0,0 @@
-import { useState } from "react";
-import { Button } from "../button/Button";
-import { IconSizeEnum } from "../icon/iconSize.enum";
-import { Loader } from "./Loader";
-
-export const LoaderView = () => {
-  const [display, setDisplay] = useState(false);
-
-  return (
-    <>
-      <Button title={"loader-overlay"} onClick={() => setDisplay(!display)} />
-      <Loader
-        size={IconSizeEnum.EXTRA_LARGE}
-        display={!display}
-        message={"Loading..."}
-      />
-      <Loader display={display} message={"Loading..."} full={true} />
-    </>
-  );
-};

package/package/src/loader/loader.css

@@ -1,30 +0,0 @@
-.loader {
-  width: 48px;
-  height: 48px;
-  border-radius: 50%;
-  display: inline-block;
-  border-top: 3px solid var(--primary-color);
-  border-right: 3px solid transparent;
-  -webkit-animation: rotation 1s linear infinite;
-  animation: rotation 1s linear infinite;
-}
-.loader-overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: rgba(0, 0, 0, 0.5);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  z-index: 1000;
-}
-@keyframes rotation {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}

package/package/src/logo.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>

package/package/src/main.tsx

@@ -1,10 +0,0 @@
-import "bootstrap-icons/font/bootstrap-icons.css";
-import React from "react";
-import ReactDOM from "react-dom/client";
-import App from "./App";
-import "./index.css";
-ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);

package/package/src/menus/Menus.tsx

@@ -1,42 +0,0 @@
-import { useCallback, useState } from "react";
-import { Menu } from "./menu/Menu";
-import { MenuInterface } from "./menu/menu.interface";
-import "./menus.css";
-
-export type ExpandProps = {
-  items: MenuInterface[];
-  className?: string;
-};
-
-export const Menus = (props: ExpandProps) => {
-  const [currentItem, setCurrentItem] = useState<MenuInterface | null>(null);
-
-  const onChange = useCallback((item: MenuInterface) => {
-    setCurrentItem(item);
-  }, []);
-
-  const renderMenuItems = (items: MenuInterface[]) => (
-    <ul>
-      {items.map((item) => (
-        <li key={item.id}>
-          <Menu
-            item={item}
-            onChange={onChange}
-            active={currentItem?.id === item.id}
-          />
-          {item.subMenu && item.subMenu.length > 0 && (
-            <div className="ml-3 mt-1 submenu">
-              {renderMenuItems(item.subMenu)}
-            </div>
-          )}
-        </li>
-      ))}
-    </ul>
-  );
-
-  return (
-    <div className={`menu ${props.className || ""}`}>
-      {renderMenuItems(props.items)}
-    </div>
-  );
-};