@cgi-learning-hub/ui 1.3.5-dev.1738155719 → 1.3.5-dev.1738158711
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),u=require("@mui/material"),b=require("react"),g=require("../../createSvgIcon-DestgQu_.cjs"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),u=require("@mui/material"),b=require("react"),g=require("../../createSvgIcon-DestgQu_.cjs"),o=require("./style.cjs.js"),j=require("../EllipsisWithTooltip/EllipsisWithTooltip.cjs.js"),y=g.createSvgIcon(r.jsx("path",{d:"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2m0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2"}),"MoreVert"),R=b.forwardRef(({isSelected:c=!1,onSelect:p=()=>{},image:x,title:s,logo:h,propertyItems:i=[],infoIcons:l=[],size:t="md",width:d,onClick:n=()=>{}},m)=>(l=l.slice(0,3),r.jsx(u.Box,{ref:m,sx:{position:"relative",width:d&&t==="md"?d:"320px",height:"auto"},children:r.jsxs(o.StyledCard,{selected:c,size:t,onClick:n,onKeyDown:e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),n==null||n())},role:"button",tabIndex:0,"aria-label":`Resource card for ${s}`,children:[r.jsx(o.SelectedIcon,{onClick:e=>{e.preventDefault(),e.stopPropagation(),p()},onKeyDown:e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),e.stopPropagation(),p())},className:"selected-icon",selected:c,role:"button",tabIndex:0,"aria-label":c?"Unselect card":"Select card",children:r.jsx(y,{})}),r.jsx(u.Box,{sx:{width:t=="sm"?110:"100%",display:"flex",alignItems:"center",justifyContent:"center",boxSizing:"border-box"},children:r.jsx(o.ResourceCardImage,{image:x,logo:h,size:t,role:"img","aria-label":`Image for ${s}`})}),r.jsxs(o.ResourceCardBody,{size:t,children:[r.jsx(j,{typographyProps:{fontWeight:"700",fontSize:"1.1rem"},tooltipProps:{placement:"bottom",arrow:!0},children:s}),i.length>0&&i.map((e,a)=>r.jsxs(o.ResourcePropertyItem,{size:t,role:"group","aria-label":`Property ${a}`,children:[e.icon,r.jsx(o.ResourcePropertyText,{isLast:a===i.length-1,size:t,width:d,children:e.text})]},`property-${a}`)),r.jsx(o.PublicIconWrapper,{size:t,children:l.length>0&&l.map((e,a)=>r.jsx(u.Tooltip,{title:e.text,placement:"top",arrow:!0,children:r.jsx(o.ResourceIconItem,{size:t,role:"button",tabIndex:0,"aria-label":e.text,children:e.icon})},`info-${a}`))})]})]})})));exports.ResourceCard=R;
|
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
import { jsx as r, jsxs as
|
|
1
|
+
import { jsx as r, jsxs as i } from "react/jsx-runtime";
|
|
2
2
|
import { Box as s, Tooltip as f } from "@mui/material";
|
|
3
|
-
import { forwardRef as
|
|
4
|
-
import { c as
|
|
5
|
-
import { StyledCard as y, SelectedIcon as
|
|
3
|
+
import { forwardRef as g } from "react";
|
|
4
|
+
import { c as x } from "../../createSvgIcon-C9kh-71a.js";
|
|
5
|
+
import { StyledCard as y, SelectedIcon as P, ResourceCardImage as R, ResourceCardBody as I, ResourcePropertyItem as v, ResourcePropertyText as w, PublicIconWrapper as D, ResourceIconItem as $ } from "./style.es.js";
|
|
6
6
|
import j from "../EllipsisWithTooltip/EllipsisWithTooltip.es.js";
|
|
7
|
-
const E =
|
|
7
|
+
const E = x(/* @__PURE__ */ r("path", {
|
|
8
8
|
d: "M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2m0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2"
|
|
9
|
-
}), "MoreVert"), V =
|
|
10
|
-
isSelected:
|
|
9
|
+
}), "MoreVert"), V = g(({
|
|
10
|
+
isSelected: n = !1,
|
|
11
11
|
onSelect: m = () => {
|
|
12
12
|
},
|
|
13
13
|
image: h,
|
|
14
|
-
title:
|
|
14
|
+
title: c,
|
|
15
15
|
logo: u,
|
|
16
|
-
propertyItems:
|
|
16
|
+
propertyItems: p = [],
|
|
17
17
|
infoIcons: a = [],
|
|
18
18
|
size: t = "md",
|
|
19
|
-
width:
|
|
19
|
+
width: d,
|
|
20
20
|
onClick: l = () => {
|
|
21
21
|
}
|
|
22
22
|
}, b) => (a = a.slice(0, 3), /* @__PURE__ */ r(s, { ref: b, sx: {
|
|
23
23
|
position: "relative",
|
|
24
|
-
width:
|
|
24
|
+
width: d && t === "md" ? d : "320px",
|
|
25
25
|
height: "auto"
|
|
26
|
-
}, children: /* @__PURE__ */
|
|
26
|
+
}, children: /* @__PURE__ */ i(
|
|
27
27
|
y,
|
|
28
28
|
{
|
|
29
|
-
selected:
|
|
29
|
+
selected: n,
|
|
30
30
|
size: t,
|
|
31
31
|
onClick: l,
|
|
32
32
|
onKeyDown: (e) => {
|
|
@@ -34,22 +34,22 @@ const E = g(/* @__PURE__ */ r("path", {
|
|
|
34
34
|
},
|
|
35
35
|
role: "button",
|
|
36
36
|
tabIndex: 0,
|
|
37
|
-
"aria-label": `Resource card for ${
|
|
37
|
+
"aria-label": `Resource card for ${c}`,
|
|
38
38
|
children: [
|
|
39
39
|
/* @__PURE__ */ r(
|
|
40
|
-
|
|
40
|
+
P,
|
|
41
41
|
{
|
|
42
42
|
onClick: (e) => {
|
|
43
|
-
e.stopPropagation(), m();
|
|
43
|
+
e.preventDefault(), e.stopPropagation(), m();
|
|
44
44
|
},
|
|
45
45
|
onKeyDown: (e) => {
|
|
46
|
-
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), m());
|
|
46
|
+
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), m());
|
|
47
47
|
},
|
|
48
48
|
className: "selected-icon",
|
|
49
|
-
selected:
|
|
49
|
+
selected: n,
|
|
50
50
|
role: "button",
|
|
51
51
|
tabIndex: 0,
|
|
52
|
-
"aria-label":
|
|
52
|
+
"aria-label": n ? "Unselect card" : "Select card",
|
|
53
53
|
children: /* @__PURE__ */ r(E, {})
|
|
54
54
|
}
|
|
55
55
|
),
|
|
@@ -60,15 +60,16 @@ const E = g(/* @__PURE__ */ r("path", {
|
|
|
60
60
|
justifyContent: "center",
|
|
61
61
|
boxSizing: "border-box"
|
|
62
62
|
}, children: /* @__PURE__ */ r(
|
|
63
|
-
|
|
63
|
+
R,
|
|
64
64
|
{
|
|
65
65
|
image: h,
|
|
66
66
|
logo: u,
|
|
67
|
+
size: t,
|
|
67
68
|
role: "img",
|
|
68
|
-
"aria-label": `Image for ${
|
|
69
|
+
"aria-label": `Image for ${c}`
|
|
69
70
|
}
|
|
70
71
|
) }),
|
|
71
|
-
/* @__PURE__ */
|
|
72
|
+
/* @__PURE__ */ i(
|
|
72
73
|
I,
|
|
73
74
|
{
|
|
74
75
|
size: t,
|
|
@@ -78,22 +79,23 @@ const E = g(/* @__PURE__ */ r("path", {
|
|
|
78
79
|
{
|
|
79
80
|
typographyProps: { fontWeight: "700", fontSize: "1.1rem" },
|
|
80
81
|
tooltipProps: { placement: "bottom", arrow: !0 },
|
|
81
|
-
children:
|
|
82
|
+
children: c
|
|
82
83
|
}
|
|
83
84
|
),
|
|
84
|
-
|
|
85
|
-
|
|
85
|
+
p.length > 0 && p.map((e, o) => /* @__PURE__ */ i(
|
|
86
|
+
v,
|
|
86
87
|
{
|
|
88
|
+
size: t,
|
|
87
89
|
role: "group",
|
|
88
90
|
"aria-label": `Property ${o}`,
|
|
89
91
|
children: [
|
|
90
92
|
e.icon,
|
|
91
93
|
/* @__PURE__ */ r(
|
|
92
|
-
|
|
94
|
+
w,
|
|
93
95
|
{
|
|
94
|
-
isLast: o ===
|
|
96
|
+
isLast: o === p.length - 1,
|
|
95
97
|
size: t,
|
|
96
|
-
width:
|
|
98
|
+
width: d,
|
|
97
99
|
children: e.text
|
|
98
100
|
}
|
|
99
101
|
)
|
|
@@ -102,7 +104,7 @@ const E = g(/* @__PURE__ */ r("path", {
|
|
|
102
104
|
`property-${o}`
|
|
103
105
|
)),
|
|
104
106
|
/* @__PURE__ */ r(
|
|
105
|
-
|
|
107
|
+
D,
|
|
106
108
|
{
|
|
107
109
|
size: t,
|
|
108
110
|
children: a.length > 0 && a.map((e, o) => /* @__PURE__ */ r(
|
|
@@ -112,8 +114,9 @@ const E = g(/* @__PURE__ */ r("path", {
|
|
|
112
114
|
placement: "top",
|
|
113
115
|
arrow: !0,
|
|
114
116
|
children: /* @__PURE__ */ r(
|
|
115
|
-
|
|
117
|
+
$,
|
|
116
118
|
{
|
|
119
|
+
size: t,
|
|
117
120
|
role: "button",
|
|
118
121
|
tabIndex: 0,
|
|
119
122
|
"aria-label": e.text,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),c=require("../ResourceCard/ResourceCard.cjs.js"),o=require("../../createSvgIcon-DestgQu_.cjs"),r=require("@mui/material"),s=o.createSvgIcon(e.jsx("path",{d:"M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2m0 18H4V8h16z"}),"CalendarToday"),i=o.createSvgIcon(e.jsx("path",{d:"M19 2H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h4l3 3 3-3h4c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2m-6 16h-2v-2h2zm2.07-7.75-.9.92C13.45 11.9 13 12.5 13 14h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25"}),"LiveHelp"),l=o.createSvgIcon(e.jsx("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39"}),"Public"),a=o.createSvgIcon(e.jsx("path",{d:"M12 17.27 18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"}),"Star"),n={title:"Components/ResourceCard",component:c.ResourceCard,argTypes:{title:{description:"Titre de la carte.",control:"text",table:{type:{summary:"string"}},required:!0},logo:{description:"Logo de l'application",control:"text",table:{type:{summary:"string"}},required:!0},isSelected:{description:"Indique si la carte est sélectionnée.",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"false"}}},onSelect:{description:"Callback déclenché lorsque l'utilisateur sélectionne la carte.",action:"card-selected",table:{type:{summary:"() => void"}}},image:{description:"URL de l'image affichée sur la carte.",control:"text",table:{type:{summary:"string"}}},propertyItems:{description:"Liste des propriétés affichées sous le titre.",control:"object",table:{type:{summary:"PropertyItem[{text: Typography, icon: MuiIcon}]"}}},infoIcons:{description:"Liste des icônes d'information affichées dans la carte. (3 maximums)",control:"object",table:{type:{summary:"InfoItem[{text: string, icon: MuiIcon}]"}}},size:{description:"Taille de la carte (petite ou moyenne).",control:"radio",options:["sm","md"],table:{type:{summary:'"sm" | "md"'},defaultValue:{summary:"md"}}},width:{description:"Largeur de la carte.",control:"text",table:{type:{summary:"string"},defaultValue:{summary:"320px"}}}}},t={args:{isSelected:!1,image:"https://dummyimage.com/600x400/000/fff.png&text=flashquizz",logo:"https://flashquizz-dev.support-ent.fr/images/logo.svg",title:"Titre de la Ressource tres loooooooooooooooooooooooooooooooooooooooooooooooooooooong",propertyItems:[{text:e.jsx(r.Typography,{color:"text.primary",children:"0 questions"}),icon:e.jsx(i,{color:"primary"})},{text:e.jsx(r.Typography,{color:"text.primary",children:"27 septembre 2025"}),icon:e.jsx(s,{color:"primary"})}],infoIcons:[{text:"Information 1",icon:e.jsx(l,{color:"primary"})},{text:"Information 2",icon:e.jsx(a,{color:"primary"})},{text:"Information 3",icon:e.jsx(a,{color:"primary"})}],size:"md",onSelect:()=>{console.log("Carte sélectionnée !")},onClick:()=>{console.log("Select all")}}},m={args:{...t.args,isSelected:!0,title:"Carte Sélectionnée"}},d={args:{...t.args,size:"sm",title:"Petite Carte"}},u={args:{...t.args,title:"Pas d'image",image:void 0}};exports.Default=t;exports.NoImage=u;exports.Selected=m;exports.Small=d;exports.default=n;
|
|
@@ -14,6 +14,22 @@ const i = e(/* @__PURE__ */ o("path", {
|
|
|
14
14
|
title: "Components/ResourceCard",
|
|
15
15
|
component: c,
|
|
16
16
|
argTypes: {
|
|
17
|
+
title: {
|
|
18
|
+
description: "Titre de la carte.",
|
|
19
|
+
control: "text",
|
|
20
|
+
table: {
|
|
21
|
+
type: { summary: "string" }
|
|
22
|
+
},
|
|
23
|
+
required: !0
|
|
24
|
+
},
|
|
25
|
+
logo: {
|
|
26
|
+
description: "Logo de l'application",
|
|
27
|
+
control: "text",
|
|
28
|
+
table: {
|
|
29
|
+
type: { summary: "string" }
|
|
30
|
+
},
|
|
31
|
+
required: !0
|
|
32
|
+
},
|
|
17
33
|
isSelected: {
|
|
18
34
|
description: "Indique si la carte est sélectionnée.",
|
|
19
35
|
control: "boolean",
|
|
@@ -36,13 +52,6 @@ const i = e(/* @__PURE__ */ o("path", {
|
|
|
36
52
|
type: { summary: "string" }
|
|
37
53
|
}
|
|
38
54
|
},
|
|
39
|
-
title: {
|
|
40
|
-
description: "Titre de la carte.",
|
|
41
|
-
control: "text",
|
|
42
|
-
table: {
|
|
43
|
-
type: { summary: "string" }
|
|
44
|
-
}
|
|
45
|
-
},
|
|
46
55
|
propertyItems: {
|
|
47
56
|
description: "Liste des propriétés affichées sous le titre.",
|
|
48
57
|
control: "object",
|
|
@@ -104,13 +113,13 @@ const i = e(/* @__PURE__ */ o("path", {
|
|
|
104
113
|
isSelected: !0,
|
|
105
114
|
title: "Carte Sélectionnée"
|
|
106
115
|
}
|
|
107
|
-
},
|
|
116
|
+
}, g = {
|
|
108
117
|
args: {
|
|
109
118
|
...t.args,
|
|
110
119
|
size: "sm",
|
|
111
120
|
title: "Petite Carte"
|
|
112
121
|
}
|
|
113
|
-
},
|
|
122
|
+
}, f = {
|
|
114
123
|
args: {
|
|
115
124
|
...t.args,
|
|
116
125
|
title: "Pas d'image",
|
|
@@ -119,8 +128,8 @@ const i = e(/* @__PURE__ */ o("path", {
|
|
|
119
128
|
};
|
|
120
129
|
export {
|
|
121
130
|
t as Default,
|
|
122
|
-
|
|
131
|
+
f as NoImage,
|
|
123
132
|
y as Selected,
|
|
124
|
-
|
|
133
|
+
g as Small,
|
|
125
134
|
u as default
|
|
126
135
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cgi-learning-hub/ui",
|
|
3
|
-
"version": "1.3.5-dev.
|
|
3
|
+
"version": "1.3.5-dev.1738158711",
|
|
4
4
|
"private": false,
|
|
5
5
|
"author": "CGI Learning-hub Team",
|
|
6
6
|
"description": "@cgi-learning-hub/ui is an open-source React component library that implements UI for HUB's features",
|