@cgi-learning-hub/ui 1.9.0 → 1.10.0

package/dist/ui.css

@@ -0,0 +1,151 @@
+:root {
+  --toastify-color-light: var(--theme-palette-common-white);
+  --toastify-color-dark: var(--theme-palette-common-black);
+  --toastify-color-info: var(--theme-palette-info-main);
+  --toastify-color-success: var(--theme-palette-success-main);
+  --toastify-color-warning: var(--theme-palette-warning-main);
+  --toastify-color-error: var(--theme-palette-error-main);
+
+  --toastify-font-family: Roboto;
+
+  --toastify-text-color-light: var(--theme-palette-text-primary);
+  --toastify-text-color-dark: var(--theme-palette-common-white);
+}
+.cs-loader {
+  padding: 0 auto;
+  text-align: center;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.cs-loader-inner label {
+  font-size: 16px;
+  opacity: 0;
+  display: inline-block;
+  vertical-align: middle;
+}
+
+@keyframes lol {
+  0% {
+    opacity: 0;
+    transform: translateX(-100px);
+  }
+  33% {
+    opacity: 1;
+    transform: translateX(0px);
+  }
+  66% {
+    opacity: 1;
+    transform: translateX(0px);
+  }
+  100% {
+    opacity: 0;
+    transform: translateX(100px);
+  }
+}
+
+@-webkit-keyframes lol {
+  0% {
+    opacity: 0;
+    -webkit-transform: translateX(-100px);
+  }
+  33% {
+    opacity: 1;
+    -webkit-transform: translateX(0px);
+  }
+  66% {
+    opacity: 1;
+    -webkit-transform: translateX(0px);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: translateX(100px);
+  }
+}
+
+.cs-loader-inner label:nth-child(4) {
+  -webkit-animation: lol 3s 200ms infinite ease-in-out;
+  animation: lol 3s 200ms infinite ease-in-out;
+}
+
+.cs-loader-inner label:nth-child(3) {
+  -webkit-animation: lol 3s 300ms infinite ease-in-out;
+  animation: lol 3s 300ms infinite ease-in-out;
+}
+
+.cs-loader-inner label:nth-child(2) {
+  -webkit-animation: lol 3s 400ms infinite ease-in-out;
+  animation: lol 3s 400ms infinite ease-in-out;
+}
+
+.cs-loader-inner label:nth-child(1) {
+  -webkit-animation: lol 3s 500ms infinite ease-in-out;
+  animation: lol 3s 500ms infinite ease-in-out;
+}
+.cs-loader-backdrop-inner {
+  text-align: center;
+}
+
+.cs-loader-backdrop-inner label {
+  font-size: 20px;
+  opacity: 0;
+  display: inline-block;
+}
+
+@keyframes lol-backdrop {
+  0% {
+    opacity: 0;
+    transform: translateX(-300px);
+  }
+  33% {
+    opacity: 1;
+    transform: translateX(0px);
+  }
+  66% {
+    opacity: 1;
+    transform: translateX(0px);
+  }
+  100% {
+    opacity: 0;
+    transform: translateX(300px);
+  }
+}
+
+@-webkit-keyframes lol-backdrop {
+  0% {
+    opacity: 0;
+    -webkit-transform: translateX(-300px);
+  }
+  33% {
+    opacity: 1;
+    -webkit-transform: translateX(0px);
+  }
+  66% {
+    opacity: 1;
+    -webkit-transform: translateX(0px);
+  }
+  100% {
+    opacity: 0;
+    -webkit-transform: translateX(300px);
+  }
+}
+
+.cs-loader-backdrop-inner label:nth-child(4) {
+  -webkit-animation: lol-backdrop 3s 200ms infinite ease-in-out;
+  animation: lol-backdrop 3s 200ms infinite ease-in-out;
+}
+
+.cs-loader-backdrop-inner label:nth-child(3) {
+  -webkit-animation: lol-backdrop 3s 300ms infinite ease-in-out;
+  animation: lol-backdrop 3s 300ms infinite ease-in-out;
+}
+
+.cs-loader-backdrop-inner label:nth-child(2) {
+  -webkit-animation: lol-backdrop 3s 400ms infinite ease-in-out;
+  animation: lol-backdrop 3s 400ms infinite ease-in-out;
+}
+
+.cs-loader-backdrop-inner label:nth-child(1) {
+  -webkit-animation: lol-backdrop 3s 500ms infinite ease-in-out;
+  animation: lol-backdrop 3s 500ms infinite ease-in-out;
+}

package/package.json

@@ -1,50 +1,47 @@
 {
   "name": "@cgi-learning-hub/ui",
-  "version": "1.9.0",
-  "private": false,
-  "author": "CGI Learning-hub Team",
-  "description": "@cgi-learning-hub/ui is an open-source React component library that implements UI for HUB's features",
+  "version": "1.10.0",
+  "description": "React component library for Hub's design system, built on Material UI with custom and extended components.",
   "keywords": [
     "cgi-learning-hub",
     "react",
-    "react-component",
-    "hub",
-    "hub-ui"
+    "component-library",
+    "mui"
   ],
+  "author": "CGI Learning Hub Team",
   "repository": {
     "type": "git",
-    "url": "https://github.com/CGI-OPEN-ENT-NG/hub-ui.git",
+    "url": "git+https://github.com/CGI-Learning-Hub/hub-ui.git",
     "directory": "packages/ui"
   },
-  "sideEffects": false,
   "type": "module",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.es.js",
       "require": "./dist/index.cjs.js"
-    }
+    },
+    "./index.css": "./dist/ui.css"
   },
+  "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
   "types": "dist/index.d.ts",
   "files": [
-    "dist"
+    "dist/**/*.js",
+    "dist/**/*.d.ts",
+    "dist/**/*.css",
+    "!dist/**/*.map"
   ],
+  "sideEffects": false,
   "dependencies": {
-    "@mui/icons-material": "7.3.1",
-    "@mui/lab": "7.0.0-beta.16",
-    "@mui/x-date-pickers": "8.10.2",
-    "@mui/x-tree-view": "8.10.2",
-    "dayjs": "1.11.13",
+    "@mui/icons-material": "7.3.4",
+    "@mui/lab": "7.0.1-beta.18",
+    "@mui/x-date-pickers": "8.15.0",
+    "@mui/x-tree-view": "8.15.0",
+    "dayjs": "1.11.18",
     "react-color": "2.19.3",
     "react-dropzone": "14.3.8"
   },
-  "devDependencies": {
-    "@reduxjs/toolkit": "2.8.2",
-    "@types/react": "19.1.9",
-    "@types/react-color": "3.0.13",
-    "@types/react-dom": "19.1.7"
-  },
   "peerDependencies": {
     "@emotion/react": "^11",
     "@emotion/styled": "^11",
@@ -52,9 +49,14 @@
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19"
   },
+  "devDependencies": {
+    "@reduxjs/toolkit": "2.9.2",
+    "@types/react": "19.2.2",
+    "@types/react-color": "3.0.13",
+    "@types/react-dom": "19.2.2"
+  },
   "scripts": {
-    "dev": "vite",
     "build": "vite build",
-    "build:watch": "vite build --watch"
+    "watch": "vite build --watch"
   }
 }

package/dist/Alert-BH_3hKCB.cjs

@@ -1 +0,0 @@
-"use strict";const n=require("react/jsx-runtime"),m=require("./useTheme-BrGF2Vm0.cjs"),f=require("./Alert-BoYBWOXe.cjs"),g=require("react"),s=require("./index-kjfz41UI.cjs"),l=require("./generateUtilityClasses-CENS22bI.cjs"),d=require("./memoTheme-Bi1UNdyO.cjs"),i=require("./DefaultPropsProvider-C1g4BXET.cjs"),A=require("./Typography-DHjq4GzQ.cjs");function h(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const P=h(g);function p(e){return l.generateUtilityClass("MuiAlertTitle",e)}const b=l.generateUtilityClasses("MuiAlertTitle",["root"]),j=e=>{const{classes:t}=e,r={root:["root"]};return i.composeClasses(r,p,t)},q=i.styled(A.Typography,{name:"MuiAlertTitle",slot:"Root"})(d.memoTheme(({theme:e})=>({fontWeight:e.typography.fontWeightMedium,marginTop:-2}))),c=P.forwardRef(function(t,r){const o=i.useDefaultProps({props:t,name:"MuiAlertTitle"}),{className:u,...T}=o,a=o,y=j(a);return n.jsx(q,{gutterBottom:!0,component:"div",ownerState:a,ref:r,className:l.clsx(y.root,u),...T})});process.env.NODE_ENV!=="production"&&(c.propTypes={children:s.PropTypes.node,classes:s.PropTypes.object,className:s.PropTypes.string,sx:s.PropTypes.oneOfType([s.PropTypes.arrayOf(s.PropTypes.oneOfType([s.PropTypes.func,s.PropTypes.object,s.PropTypes.bool])),s.PropTypes.func,s.PropTypes.object])});const x=({severity:e="success",...t})=>{const r=m.useTheme();return n.jsxs(f.Alert,{severity:e,color:e,sx:{bgcolor:l.alpha(r.palette[e].light,.35),...t.sx},...t,children:[t.title?n.jsx(c,{children:t.title}):null,t.children]})};exports.Alert=x;exports.AlertTitle=c;exports.alertTitleClasses=b;exports.getAlertTitleUtilityClass=p;

package/dist/Alert-BeVYzSS-.js

@@ -1,94 +0,0 @@
-import { jsx as a, jsxs as p } from "react/jsx-runtime";
-import { u } from "./useTheme-0AkY41zn.js";
-import { A as f } from "./Alert-CEu3llDi.js";
-import * as T from "react";
-import { P as t } from "./index-B9vkf41S.js";
-import { F as g, G as y, H as A, n as d } from "./generateUtilityClasses-B_xKAflz.js";
-import { m as h } from "./memoTheme-C-PaH-Cy.js";
-import { u as x, s as b, c as C } from "./DefaultPropsProvider-BrmlvPWg.js";
-import { T as j } from "./Typography-Cr-aIusw.js";
-function M(e) {
-  return y("MuiAlertTitle", e);
-}
-const B = g("MuiAlertTitle", ["root"]), N = (e) => {
-  const {
-    classes: s
-  } = e;
-  return C({
-    root: ["root"]
-  }, M, s);
-}, O = b(j, {
-  name: "MuiAlertTitle",
-  slot: "Root"
-})(h(({
-  theme: e
-}) => ({
-  fontWeight: e.typography.fontWeightMedium,
-  marginTop: -2
-}))), n = /* @__PURE__ */ T.forwardRef(function(s, o) {
-  const r = x({
-    props: s,
-    name: "MuiAlertTitle"
-  }), {
-    className: i,
-    ...c
-  } = r, l = r, m = N(l);
-  return /* @__PURE__ */ a(O, {
-    gutterBottom: !0,
-    component: "div",
-    ownerState: l,
-    ref: o,
-    className: A(m.root, i),
-    ...c
-  });
-});
-process.env.NODE_ENV !== "production" && (n.propTypes = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * The content of the component.
-   */
-  children: t.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: t.object,
-  /**
-   * @ignore
-   */
-  className: t.string,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object])
-});
-const F = ({
-  severity: e = "success",
-  ...s
-}) => {
-  const o = u();
-  return /* @__PURE__ */ p(
-    f,
-    {
-      severity: e,
-      color: e,
-      sx: {
-        bgcolor: d(o.palette[e].light, 0.35),
-        ...s.sx
-      },
-      ...s,
-      children: [
-        s.title ? /* @__PURE__ */ a(n, { children: s.title }) : null,
-        s.children
-      ]
-    }
-  );
-};
-export {
-  n as A,
-  B as a,
-  F as b,
-  M as g
-};

package/dist/Alert-BoYBWOXe.cjs

@@ -1 +0,0 @@
-"use strict";const _=require("react"),e=require("./index-kjfz41UI.cjs"),f=require("./generateUtilityClasses-CENS22bI.cjs"),Z=require("./memoTheme-Bi1UNdyO.cjs"),a=require("./useSlot-C-aMxEm0.cjs"),P=require("./createSimplePaletteValueFilter-PTK3TAhW.cjs"),d=require("./createSvgIcon-CcWpa9Le.cjs"),n=require("react/jsx-runtime"),G=require("./Close-DR9m6hv3.cjs"),i=require("./DefaultPropsProvider-C1g4BXET.cjs"),J=require("./IconButton-BTN16gZi.cjs"),g=require("./capitalize-3OjkeP9i.cjs"),K=require("./Paper-DcVuAxq3.cjs");function Q(o){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const r in o)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(o,r);Object.defineProperty(s,r,t.get?t:{enumerable:!0,get:()=>o[r]})}}return s.default=o,Object.freeze(s)}const X=Q(_);function Y(o){return f.generateUtilityClass("MuiAlert",o)}const I=f.generateUtilityClasses("MuiAlert",["root","action","icon","message","filled","colorSuccess","colorInfo","colorWarning","colorError","filledSuccess","filledInfo","filledWarning","filledError","outlined","outlinedSuccess","outlinedInfo","outlinedWarning","outlinedError","standard","standardSuccess","standardInfo","standardWarning","standardError"]),ee=d.createSvgIcon(n.jsx("path",{d:"M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2, 4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0, 0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z"}),"SuccessOutlined"),oe=d.createSvgIcon(n.jsx("path",{d:"M12 5.99L19.53 19H4.47L12 5.99M12 2L1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z"}),"ReportProblemOutlined"),te=d.createSvgIcon(n.jsx("path",{d:"M11 15h2v2h-2zm0-8h2v6h-2zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"}),"ErrorOutline"),re=d.createSvgIcon(n.jsx("path",{d:"M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20, 12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10, 10 0 0,0 12,2M11,17H13V11H11V17Z"}),"InfoOutlined"),se=o=>{const{variant:s,color:r,severity:t,classes:c}=o,T={root:["root",`color${g.capitalize(r||t)}`,`${s}${g.capitalize(r||t)}`,`${s}`],icon:["icon"],message:["message"],action:["action"]};return i.composeClasses(T,Y,c)},ne=i.styled(K.Paper,{name:"MuiAlert",slot:"Root",overridesResolver:(o,s)=>{const{ownerState:r}=o;return[s.root,s[r.variant],s[`${r.variant}${g.capitalize(r.color||r.severity)}`]]}})(Z.memoTheme(({theme:o})=>{const s=o.palette.mode==="light"?o.darken:o.lighten,r=o.palette.mode==="light"?o.lighten:o.darken;return{...o.typography.body2,backgroundColor:"transparent",display:"flex",padding:"6px 16px",variants:[...Object.entries(o.palette).filter(P.createSimplePaletteValueFilter(["light"])).map(([t])=>({props:{colorSeverity:t,variant:"standard"},style:{color:o.vars?o.vars.palette.Alert[`${t}Color`]:s(o.palette[t].light,.6),backgroundColor:o.vars?o.vars.palette.Alert[`${t}StandardBg`]:r(o.palette[t].light,.9),[`& .${I.icon}`]:o.vars?{color:o.vars.palette.Alert[`${t}IconColor`]}:{color:o.palette[t].main}}})),...Object.entries(o.palette).filter(P.createSimplePaletteValueFilter(["light"])).map(([t])=>({props:{colorSeverity:t,variant:"outlined"},style:{color:o.vars?o.vars.palette.Alert[`${t}Color`]:s(o.palette[t].light,.6),border:`1px solid ${(o.vars||o).palette[t].light}`,[`& .${I.icon}`]:o.vars?{color:o.vars.palette.Alert[`${t}IconColor`]}:{color:o.palette[t].main}}})),...Object.entries(o.palette).filter(P.createSimplePaletteValueFilter(["dark"])).map(([t])=>({props:{colorSeverity:t,variant:"filled"},style:{fontWeight:o.typography.fontWeightMedium,...o.vars?{color:o.vars.palette.Alert[`${t}FilledColor`],backgroundColor:o.vars.palette.Alert[`${t}FilledBg`]}:{backgroundColor:o.palette.mode==="dark"?o.palette[t].dark:o.palette[t].main,color:o.palette.getContrastText(o.palette[t].main)}}}))]}})),le=i.styled("div",{name:"MuiAlert",slot:"Icon"})({marginRight:12,padding:"7px 0",display:"flex",fontSize:22,opacity:.9}),pe=i.styled("div",{name:"MuiAlert",slot:"Message"})({padding:"8px 0",minWidth:0,overflow:"auto"}),ae=i.styled("div",{name:"MuiAlert",slot:"Action"})({display:"flex",alignItems:"flex-start",padding:"4px 0 0 16px",marginLeft:"auto",marginRight:-8}),O={success:n.jsx(ee,{fontSize:"inherit"}),warning:n.jsx(oe,{fontSize:"inherit"}),error:n.jsx(te,{fontSize:"inherit"}),info:n.jsx(re,{fontSize:"inherit"})},b=X.forwardRef(function(s,r){const t=i.useDefaultProps({props:s,name:"MuiAlert"}),{action:c,children:T,className:M,closeText:v="Close",color:S,components:m={},componentsProps:z={},icon:C,iconMapping:h=O,onClose:x,role:$="alert",severity:y="success",slotProps:B={},slots:q={},variant:k="standard",...w}=t,l={...t,color:S,severity:y,variant:k,colorSeverity:S||y},u=se(l),p={slots:{closeButton:m.CloseButton,closeIcon:m.CloseIcon,...q},slotProps:{...z,...B}},[L,R]=a.useSlot("root",{ref:r,shouldForwardComponentProp:!0,className:f.clsx(u.root,M),elementType:ne,externalForwardedProps:{...p,...w},ownerState:l,additionalProps:{role:$,elevation:0}}),[F,N]=a.useSlot("icon",{className:u.icon,elementType:le,externalForwardedProps:p,ownerState:l}),[E,V]=a.useSlot("message",{className:u.message,elementType:pe,externalForwardedProps:p,ownerState:l}),[A,j]=a.useSlot("action",{className:u.action,elementType:ae,externalForwardedProps:p,ownerState:l}),[W,D]=a.useSlot("closeButton",{elementType:J.IconButton,externalForwardedProps:p,ownerState:l}),[H,U]=a.useSlot("closeIcon",{elementType:G.CloseIcon,externalForwardedProps:p,ownerState:l});return n.jsxs(L,{...R,children:[C!==!1?n.jsx(F,{...N,children:C||h[y]||O[y]}):null,n.jsx(E,{...V,children:T}),c!=null?n.jsx(A,{...j,children:c}):null,c==null&&x?n.jsx(A,{...j,children:n.jsx(W,{size:"small","aria-label":v,title:v,color:"inherit",onClick:x,...D,children:n.jsx(H,{fontSize:"small",...U})})}):null]})});process.env.NODE_ENV!=="production"&&(b.propTypes={action:e.PropTypes.node,children:e.PropTypes.node,classes:e.PropTypes.object,className:e.PropTypes.string,closeText:e.PropTypes.string,color:e.PropTypes.oneOfType([e.PropTypes.oneOf(["error","info","success","warning"]),e.PropTypes.string]),components:e.PropTypes.shape({CloseButton:e.PropTypes.elementType,CloseIcon:e.PropTypes.elementType}),componentsProps:e.PropTypes.shape({closeButton:e.PropTypes.object,closeIcon:e.PropTypes.object}),icon:e.PropTypes.node,iconMapping:e.PropTypes.shape({error:e.PropTypes.node,info:e.PropTypes.node,success:e.PropTypes.node,warning:e.PropTypes.node}),onClose:e.PropTypes.func,role:e.PropTypes.string,severity:e.PropTypes.oneOfType([e.PropTypes.oneOf(["error","info","success","warning"]),e.PropTypes.string]),slotProps:e.PropTypes.shape({action:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object]),closeButton:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object]),closeIcon:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object]),icon:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object]),message:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object]),root:e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object])}),slots:e.PropTypes.shape({action:e.PropTypes.elementType,closeButton:e.PropTypes.elementType,closeIcon:e.PropTypes.elementType,icon:e.PropTypes.elementType,message:e.PropTypes.elementType,root:e.PropTypes.elementType}),sx:e.PropTypes.oneOfType([e.PropTypes.arrayOf(e.PropTypes.oneOfType([e.PropTypes.func,e.PropTypes.object,e.PropTypes.bool])),e.PropTypes.func,e.PropTypes.object]),variant:e.PropTypes.oneOfType([e.PropTypes.oneOf(["filled","outlined","standard"]),e.PropTypes.string])});exports.Alert=b;