allaw-ui 1.0.63 → 1.0.65

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.
Files changed (6) hide show
  1. package/dist/components/atoms/buttons/TabNavigation.css +16 -16
  2. package/dist/components/atoms/buttons/TabNavigation.js +2 -2
  3. package/dist/components/molecules/caseLinkCard/CaseLinkCard.css +66 -61
  4. package/dist/components/molecules/caseLinkCard/CaseLinkCard.d.ts +1 -1
  5. package/dist/components/molecules/caseLinkCard/CaseLinkCard.js +6 -6
  6. package/package.json +1 -1
package/dist/components/atoms/buttons/TabNavigation.css CHANGED
@@ -1,18 +1,18 @@
1
- .tab-navigation {
1
+ .tab-navigation-d {
2
2
  display: inline-flex;
3
3
  align-items: flex-start;
4
4
  }
5
5
 
6
- .tab-navigation.small .tab-label {
6
+ .tab-navigation-d.small .tab-label-d {
7
7
  font-size: 14px;
8
8
  }
9
9
 
10
- .tab-navigation.normal .tab-label {
10
+ .tab-navigation-d.normal .tab-label-d {
11
11
  font-size: 18px;
12
12
  }
13
13
 
14
14
  /* Style normal (par défaut) */
15
- .tab-navigation.normal .tab-item {
15
+ .tab-navigation-d.normal .tab-item-d {
16
16
  display: flex;
17
17
  padding: 0px 16px 10px 16px;
18
18
  justify-content: center;
@@ -22,30 +22,30 @@
22
22
  position: relative;
23
23
  }
24
24
 
25
- .tab-navigation.normal .tab-item.active {
25
+ .tab-navigation-d.normal .tab-item-d.active {
26
26
  border-bottom: 3px solid #000;
27
27
  padding-bottom: 10px;
28
28
  color: var(--Primary-Mid-black, var(--primary-black, #171e25));
29
29
  }
30
30
 
31
- .tab-navigation.normal .tab-item.inactive {
31
+ .tab-navigation-d.normal .tab-item-d.inactive {
32
32
  border-bottom: 3px solid var(--grey-venom, #e6edf5);
33
33
  color: var(--Tags-Mid-grey, var(--light-grey, #728ea7));
34
34
  }
35
35
 
36
- .tab-navigation.normal .tab-item.inactive:hover {
36
+ .tab-navigation-d.normal .tab-item-d.inactive:hover {
37
37
  border-bottom: 3px solid var(--venom-grey-dark, #d1dce8);
38
38
  color: var(--Tags-Mid-grey, var(--dark-grey, #456073));
39
39
  }
40
40
 
41
41
  /* Style round */
42
- .tab-navigation.tab-navigation--round {
42
+ .tab-navigation-d.tab-navigation--round {
43
43
  padding: 4px;
44
44
  border-radius: 8px;
45
45
  gap: 8px;
46
46
  }
47
47
 
48
- .tab-navigation.tab-navigation--round .tab-item {
48
+ .tab-navigation-d.tab-navigation--round .tab-item-d {
49
49
  display: flex;
50
50
  padding: 8px 16px;
51
51
  justify-content: center;
@@ -56,7 +56,7 @@
56
56
  border-radius: 6px;
57
57
  }
58
58
 
59
- .tab-navigation.tab-navigation--round .tab-item.active {
59
+ .tab-navigation-d.tab-navigation--round .tab-item-d.active {
60
60
  background: var(--dark-grey, #456073);
61
61
  color: var(--pure-white, #fff);
62
62
  height: 35px;
@@ -65,12 +65,12 @@
65
65
  border: 1px solid var(--dark-grey, #456073);
66
66
  }
67
67
 
68
- .tab-navigation.tab-navigation--round .tab-item.active:hover {
68
+ .tab-navigation-d.tab-navigation--round .tab-item-d.active:hover {
69
69
  background: #3c5364;
70
70
  color: var(--pure-white, #fff);
71
71
  }
72
72
 
73
- .tab-navigation.tab-navigation--round .tab-item.inactive {
73
+ .tab-navigation-d.tab-navigation--round .tab-item-d.inactive {
74
74
  background: var(--grey-light, #f6fcfe);
75
75
  color: var(--noir, #171e25);
76
76
  height: 35px;
@@ -79,11 +79,11 @@
79
79
  border: 1px solid var(--grey-venom, #e6edf5);
80
80
  }
81
81
 
82
- .tab-navigation.tab-navigation--round .tab-item.inactive:hover {
82
+ .tab-navigation-d.tab-navigation--round .tab-item-d.inactive:hover {
83
83
  background: var(--grey-venom, #e6edf5);
84
84
  }
85
85
 
86
- .tab-label {
86
+ .tab-label-d {
87
87
  font-family: "Open Sans", sans-serif;
88
88
  font-size: 14px;
89
89
  font-style: normal;
@@ -101,10 +101,10 @@
101
101
  right: 10px;
102
102
  }
103
103
 
104
- .tab-navigation.normal .tab-notification-dot {
104
+ .tab-navigation-d.normal .tab-notification-dot {
105
105
  top: 7px;
106
106
  }
107
107
 
108
- .tab-navigation.tab-navigation--round .tab-notification-dot {
108
+ .tab-navigation-d.tab-navigation--round .tab-notification-dot {
109
109
  top: 15px;
110
110
  }
package/dist/components/atoms/buttons/TabNavigation.js CHANGED
@@ -3,8 +3,8 @@ import "./TabNavigation.css";
3
3
  import "../../../styles/global.css";
4
4
  var TabNavigation = function (_a) {
5
5
  var tabs = _a.tabs, onTabClick = _a.onTabClick, _b = _a.size, size = _b === void 0 ? "normal" : _b, _c = _a.variant, variant = _c === void 0 ? "normal" : _c;
6
- return (React.createElement("div", { className: "tab-navigation ".concat(size, " ").concat(variant === "round" ? "tab-navigation--round" : "") }, tabs.map(function (tab, index) { return (React.createElement("div", { key: index, className: "tab-item ".concat(tab.isActive ? "active" : "inactive"), onClick: function () { return onTabClick(index); } },
7
- React.createElement("span", { className: "tab-label" }, tab.label),
6
+ return (React.createElement("div", { className: "tab-navigation-d ".concat(size, " ").concat(variant === "round" ? "tab-navigation--round" : "") }, tabs.map(function (tab, index) { return (React.createElement("div", { key: index, className: "tab-item-d ".concat(tab.isActive ? "active" : "inactive"), onClick: function () { return onTabClick(index); } },
7
+ React.createElement("span", { className: "tab-label-d" }, tab.label),
8
8
  tab.hasNotification && React.createElement("span", { className: "tab-notification-dot" }))); })));
9
9
  };
10
10
  export default TabNavigation;
package/dist/components/molecules/caseLinkCard/CaseLinkCard.css CHANGED
@@ -1,89 +1,94 @@
1
1
  @import "../../../styles/colors.css";
2
2
 
3
3
  .case-card-link {
4
- display: flex;
4
+ display: flex;
5
5
 
6
- align-items: flex-start;
7
- align-self: stretch;
8
- border-radius: 8px;
9
- background: var(--Primary-Light-grey, #F4F7FB);
10
- display: flex;
11
- padding: 16px;
12
- align-items: center;
13
- gap: 16px;
6
+ align-items: flex-start;
7
+ align-self: stretch;
8
+ border-radius: 16px;
9
+ background: var(--Primary-Light-grey, #f4f7fb);
10
+ display: flex;
11
+ padding: 16px;
12
+ align-items: center;
13
+ gap: 16px;
14
+ transition:
15
+ border-color 0.2s ease,
16
+ border-width 0.2s ease;
14
17
  }
15
18
 
16
19
  .case-card-link-right {
17
- display: flex;
18
- width: 100%;
19
- flex-direction: column;
20
- justify-content: flex-end;
21
- align-items: flex-start;
22
- flex: 1 0 0;
20
+ display: flex;
21
+ width: 100%;
22
+ flex-direction: column;
23
+ justify-content: flex-end;
24
+ align-items: flex-start;
25
+ flex: 1 0 0;
23
26
  }
24
27
 
25
28
  .case-card-no-folder-wrapper {
26
- cursor: pointer;
27
- border-radius: 8px;
28
- border: 1px solid var(--Primary-Gris-de-fond, #E6EDF5);
29
- background: #fff;
30
- display: flex;
31
- flex-direction: row;
32
- justify-content: space-between;
33
- width: 100%;
34
- padding: 16px;
35
- align-items: center;
36
- gap: 56px;
37
- height: 96px;
29
+ cursor: pointer;
30
+ border-radius: 16px;
31
+ border: 1px solid var(--Primary-Gris-de-fond, #e6edf5);
32
+ background: #fff;
33
+ display: flex;
34
+ flex-direction: row;
35
+ justify-content: space-between;
36
+ width: 100%;
37
+ padding: 16px;
38
+ align-items: center;
39
+ gap: 56px;
40
+ height: 96px;
38
41
  }
39
42
 
40
- .case-card-no-folder-right {
41
- display: flex;
42
- flex-direction: column;
43
- gap: 8px;
44
-
43
+ .case-card-no-folder-wrapper:hover {
44
+ border: 1px solid var(--bleu-allaw, #25beeb);
45
45
  }
46
46
 
47
+ .case-card-no-folder-right {
48
+ display: flex;
49
+ flex-direction: column;
50
+ gap: 8px;
51
+ }
47
52
 
48
53
  .case-card-link-folder-icon {
49
- border-radius: 8px;
50
- background: rgba(255, 255, 255, 0.90);
51
- display: flex;
52
- padding: 12px 14px;
53
- flex-direction: column;
54
- justify-content: center;
55
- align-items: center;
56
- align-self: stretch;
54
+ border-radius: 8px;
55
+ background: rgba(255, 255, 255, 0.9);
56
+ display: flex;
57
+ padding: 12px 14px;
58
+ flex-direction: column;
59
+ justify-content: center;
60
+ align-items: center;
61
+ align-self: stretch;
57
62
  }
58
63
 
59
64
  .case-card-link-no-folder-icon {
60
- border-radius: 8px;
61
- background: #F4F7FB;
62
- display: flex;
63
- padding: 12px 14px;
64
- flex-direction: column;
65
- justify-content: center;
66
- align-items: center;
67
- align-self: stretch;
65
+ border-radius: 8px;
66
+ background: #f4f7fb;
67
+ display: flex;
68
+ padding: 12px 14px;
69
+ flex-direction: column;
70
+ justify-content: center;
71
+ align-items: center;
72
+ align-self: stretch;
68
73
  }
69
74
 
70
75
  .case-card-link-info-row {
71
- display: flex;
72
- width: 100%;
73
- flex-direction: row;
74
- justify-content: space-between;
76
+ display: flex;
77
+ width: 100%;
78
+ flex-direction: row;
79
+ justify-content: space-between;
75
80
  }
76
81
 
77
82
  .case-card-link-info-row-bottom {
78
- display: flex;
79
- width: 100%;
80
- flex-direction: row;
81
- justify-content: space-between;
82
- align-items: end;
83
+ display: flex;
84
+ width: 100%;
85
+ flex-direction: row;
86
+ justify-content: space-between;
87
+ align-items: end;
83
88
  }
84
89
 
85
90
  .case-card-link-info-col {
86
- display: flex;
87
- flex-direction:column;
88
- justify-content: space-between;
89
- }
91
+ display: flex;
92
+ flex-direction: column;
93
+ justify-content: space-between;
94
+ }
package/dist/components/molecules/caseLinkCard/CaseLinkCard.d.ts CHANGED
@@ -9,5 +9,5 @@ export type CaseLinkCardProps = {
9
9
  onCaseCardClick?: () => any;
10
10
  onCaseLinkRequest?: () => any;
11
11
  };
12
- declare function CaseLinkCard({ proName, caseName, createdDate, onCaseCardClick, isLoading, canLinkCase, onCaseLinkRequest }: CaseLinkCardProps): React.JSX.Element;
12
+ declare function CaseLinkCard({ proName, caseName, createdDate, onCaseCardClick, isLoading, canLinkCase, onCaseLinkRequest, }: CaseLinkCardProps): React.JSX.Element;
13
13
  export default CaseLinkCard;
package/dist/components/molecules/caseLinkCard/CaseLinkCard.js CHANGED
@@ -14,7 +14,7 @@ function CaseLinkCard(_a) {
14
14
  var formatProName = function (name) {
15
15
  return "Ma\u00EEtre ".concat(name).toUpperCase();
16
16
  };
17
- return !isLoading ? React.createElement(React.Fragment, null, caseName || (!onCaseLinkRequest && !canLinkCase) ? React.createElement(React.Fragment, null,
17
+ return !isLoading ? (React.createElement(React.Fragment, null, caseName || (!onCaseLinkRequest && !canLinkCase) ? (React.createElement(React.Fragment, null,
18
18
  React.createElement("div", { className: "case-card-link", onClick: function () { return onCaseCardClick && onCaseCardClick(); }, style: { cursor: onCaseCardClick ? "pointer" : "default" } },
19
19
  React.createElement("div", { className: "case-card-link-folder-icon" },
20
20
  React.createElement("i", { className: "allaw-icon-folder", style: { fontSize: "20px" } })),
@@ -22,16 +22,16 @@ function CaseLinkCard(_a) {
22
22
  React.createElement("div", { className: "case-card-link-right" },
23
23
  React.createElement("div", { className: "case-card-link-info-row" },
24
24
  React.createElement(SmallTitle, { text: "DOSSIER", variant: "semiBold12", color: "dark-grey" }),
25
- createdDate && React.createElement(SmallTitle, { text: "Cr\u00E9\u00E9 le ".concat(formatDate(createdDate)), variant: "semiBold12", color: "dark-grey" })),
25
+ createdDate && (React.createElement(SmallTitle, { text: "Cr\u00E9\u00E9 le ".concat(formatDate(createdDate)), variant: "semiBold12", color: "dark-grey" }))),
26
26
  React.createElement("div", { className: "case-card-link-info-row-bottom" },
27
27
  React.createElement("div", { className: "case-card-link-info-col" },
28
28
  React.createElement(Paragraph, { variant: "bold", size: "default", text: caseName, maxLines: 1 }),
29
- proName && React.createElement(SmallTitle, { variant: "medium12", color: "mid-grey", text: formatProName(proName) })),
30
- React.createElement("i", { className: "allaw-icon-arrow-right" })))))) : React.createElement("div", { className: "case-card-no-folder-wrapper", onClick: function () { return onCaseLinkRequest && onCaseLinkRequest(); } },
29
+ proName && (React.createElement(SmallTitle, { variant: "medium12", color: "mid-grey", text: formatProName(proName) }))),
30
+ React.createElement("i", { className: "allaw-icon-arrow-right" }))))))) : (React.createElement("div", { className: "case-card-no-folder-wrapper", onClick: function () { return onCaseLinkRequest && onCaseLinkRequest(); } },
31
31
  React.createElement("div", { className: "case-card-no-folder-right" },
32
- React.createElement(SmallTitle, { text: "CE RENDEZ-VOUS N'APPARTIENT A AUNCUN DOSSIER", variant: "semiBold12", color: "dark-grey" }),
32
+ React.createElement(SmallTitle, { text: "AUNCUN DOSSIER LI\u00C9", variant: "semiBold12", color: "dark-grey" }),
33
33
  React.createElement(Paragraph, { variant: "bold", size: "default", text: "Ajouter à un dossier", maxLines: 1 })),
34
34
  React.createElement("div", { className: "case-card-link-no-folder-icon" },
35
- React.createElement("i", { className: "allaw-icon-add", style: { fontSize: "18px" } })))) : React.createElement(LoadingBox, { boxHeight: "100px", boxRadius: "8px", boxWidth: "100%" });
35
+ React.createElement("i", { className: "allaw-icon-add", style: { fontSize: "18px" } })))))) : (React.createElement(LoadingBox, { boxHeight: "100px", boxRadius: "8px", boxWidth: "100%" }));
36
36
  }
37
37
  export default CaseLinkCard;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "allaw-ui",
3
- "version": "1.0.63",
3
+ "version": "1.0.65",
4
4
  "description": "Composants UI pour l'application Allaw",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",