allaw-ui 2.8.7 → 2.8.8

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 (7) hide show
  1. package/dist/assets/allaw-icon-unlink-red.svg +22 -0
  2. package/dist/components/molecules/checkboxForm/ColoredCheckbox.d.ts +1 -0
  3. package/dist/components/molecules/checkboxForm/ColoredCheckbox.js +3 -2
  4. package/dist/components/molecules/checkboxForm/ColoredCheckbox.module.css +6 -0
  5. package/dist/components/molecules/checkboxForm/ColoredCheckbox.stories.d.ts +12 -0
  6. package/dist/components/molecules/checkboxForm/ColoredCheckbox.stories.js +14 -0
  7. package/package.json +1 -1
package/dist/assets/allaw-icon-unlink-red.svg ADDED
@@ -0,0 +1,22 @@
1
+ <?xml version="1.0" encoding="UTF-8" standalone="no"?>
2
+ <!-- Created with Inkscape (http://www.inkscape.org/) -->
3
+
4
+ <svg
5
+ version="1.1"
6
+ id="svg1"
7
+ width="2335.7976"
8
+ height="1866.5605"
9
+ viewBox="0 0 2335.7976 1866.5605"
10
+ xmlns="http://www.w3.org/2000/svg"
11
+ xmlns:svg="http://www.w3.org/2000/svg">
12
+ <defs
13
+ id="defs1" />
14
+ <g
15
+ id="g1"
16
+ transform="translate(-4.4480934,-12.748703)">
17
+ <path
18
+ style="fill:#e15151;fill-opacity:1"
19
+ d="m 2269.7815,1878.0966 c -13.593,-2.635 -23.5249,-9.5969 -100,-70.096 C 2044.8682,1709.182 994.04249,879.65701 496.44811,487.06609 238.78822,283.77814 27.323043,116.00988 23.458207,111.81426 12.625553,100.05446 4.4480936,82.050354 4.4480936,69.960164 c 0,-13.02018 8.1553014,-31.97103 17.1751034,-39.91058 22.736142,-20.01315 52.503929,-22.8848301 77.313623,-7.45839 3.79827,2.36173 113.84214,88.941856 244.54195,192.400286 130.6998,103.45844 486.03602,384.58766 789.63603,624.73163 303.6,240.14389 693.3001,548.40379 866.0001,685.02189 172.7,136.6182 317.1836,251.489 321.0748,255.2685 9.5783,9.3035 14.4999,17.0576 17.8711,28.1566 2.4862,8.1852 2.6647,10.4765 1.4651,18.8037 -3.5208,24.4389 -21.5986,43.8132 -47.2523,50.6411 -7.9178,2.1074 -13.4903,2.2268 -22.4921,0.4817 z M 680.44812,1526.6632 c -51.04044,-2.7526 -110.96477,-14.0971 -160.28889,-30.345 -31.28393,-10.3052 -43.69596,-15.4028 -74.21337,-30.4796 -57.63055,-28.4716 -103.18031,-61.3968 -151.56211,-109.555 -33.63747,-33.482 -59.98711,-66.3934 -83.98212,-104.8961 -13.05937,-20.9552 -35.8899,-65.8915 -43.94867,-86.5022 -8.29405,-21.2125 -19.13701,-55.4351 -24.70293,-77.9677 -23.24257,-94.09279 -23.79635,-180.00469 -1.7793,-276.03229 18.81484,-82.0611 57.088,-161.65037 109.00027,-226.66671 9.76161,-12.2257 36.62492,-43.33334 37.42095,-43.33334 0.93498,0 89.45114,70.99954 89.82343,72.04812 0.23867,0.67221 -5.19645,7.08638 -12.07804,14.25371 -23.31589,24.28403 -42.82657,49.50436 -58.96194,76.21672 -43.1206,71.3868 -65.16858,152.7644 -65.24498,240.8148 -0.0466,53.6611 6.31376,95.26539 22.72763,148.66659 28.51889,92.7841 91.65512,178.2136 174.45673,236.057 50.17016,35.0478 115.64465,62.1678 177.33333,73.4527 46.23683,8.4582 39.04763,8.168 224.66668,9.0707 l 170.00001,0.8268 7.8935,2.9693 c 20.5598,7.7341 30.6449,18.8701 36.1176,39.8813 6.6256,25.4372 -4.9211,54.3885 -25.9397,65.0394 -14.9045,7.5527 -9.7212,7.3498 -181.40474,7.1032 -86.90001,-0.1248 -161.30001,-0.4049 -165.33334,-0.6224 z M 2014.8325,1313.1135 c -25.4553,-19.5589 -46.3053,-36.1766 -46.3333,-36.9283 -0.028,-0.7517 4.4949,-5.8517 10.0509,-11.3333 42.6738,-42.1022 80.7458,-103.8909 101.4413,-164.6333 16.6253,-48.7961 24.9272,-100.2101 24.9745,-154.66669 0.047,-54.3756 -7.3218,-100.8794 -24.4397,-154.2325 -28.8724,-89.9896 -91.787,-173.93582 -172.7447,-230.49106 -50.0575,-34.96908 -116.037,-62.36535 -176.6666,-73.35613 -47.3808,-8.58908 -39.4076,-8.26568 -225.3334,-9.13955 l -170,-0.79902 -9.048,-3.50947 c -19.6654,-7.62765 -29.6058,-18.82855 -34.9631,-39.39665 -6.6515,-25.53687 4.9927,-54.42477 26.2872,-65.21553 14.9632,-7.58243 9.2982,-7.37985 190.9032,-6.8268 159.7312,0.48643 167.7862,0.62716 189.5397,3.31138 46.3542,5.71979 86.5698,14.48922 125.9801,27.47126 31.5765,10.40152 43.8981,15.46042 74.6,30.62867 57.4597,28.38792 104.7103,62.55176 151.4326,109.49107 48.1582,48.3818 81.0834,93.93156 109.555,151.5621 15.0768,30.51743 20.1744,42.92943 30.4797,74.21333 34.6407,105.16 39.6741,210.9927 15.1379,318.28889 -19.0214,83.1805 -57.5484,165.5223 -106.3669,227.3334 -12.3679,15.6594 -36.6347,44.0358 -37.5374,43.8943 -0.3666,-0.057 -21.4937,-16.1072 -46.949,-35.6661 z M 670.44812,1002.2166 c -22.284,-3.35159 -36.00605,-12.22709 -44.04198,-28.48669 -9.37704,-18.9731 -9.37704,-38.7161 0,-57.6893 4.8759,-9.8657 10.2903,-15.4084 21.05229,-21.5511 9.92689,-5.6661 18.89143,-7.1454 47.80391,-7.8885 l 27.48089,-0.7062 70.51911,56.3324 c 38.78552,30.9828 71.70245,57.4557 73.14875,58.82859 2.57097,2.4405 0.48895,2.4924 -93.33334,2.3298 -52.77963,-0.091 -98.96297,-0.6176 -102.62963,-1.169 z m 881.54678,-55.78969 c -40.216,-31.4865 -73.8145,-57.9427 -74.6633,-58.7915 -1.1688,-1.1689 22.8808,-1.4332 99.12,-1.0896 94.5402,0.4262 101.1499,0.6081 108.6633,2.9912 21.3695,6.778 33.1464,19.0365 38.673,40.2544 6.3781,24.4872 -3.707,52.1861 -23.1211,63.5026 -13.1175,7.64619 -20.5851,9.12079 -49.5519,9.78499 l -26,0.5962 z"
20
+ id="path1" />
21
+ </g>
22
+ </svg>
package/dist/components/molecules/checkboxForm/ColoredCheckbox.d.ts CHANGED
@@ -10,6 +10,7 @@ export interface ColoredCheckboxProps {
10
10
  textColor?: string;
11
11
  size?: "default" | "small";
12
12
  markType?: "cross" | "check";
13
+ isSignedIn?: boolean;
13
14
  }
14
15
  declare const ColoredCheckbox: React.FC<ColoredCheckboxProps>;
15
16
  export default ColoredCheckbox;
package/dist/components/molecules/checkboxForm/ColoredCheckbox.js CHANGED
@@ -19,8 +19,8 @@ var formatEmail = function (email) {
19
19
  React.createElement("span", { className: styles.emailTLD }, tld)));
20
20
  };
21
21
  var ColoredCheckbox = function (_a) {
22
- var id = _a.id, label = _a.label, _b = _a.checked, checked = _b === void 0 ? false : _b, onChange = _a.onChange, _c = _a.boxColor, boxColor = _c === void 0 ? "#000000" : _c, _d = _a.markColor, markColor = _d === void 0 ? "#FFFFFF" : _d, _e = _a.textColor, textColor = _e === void 0 ? "#000000" : _e, _f = _a.size, size = _f === void 0 ? "default" : _f, _g = _a.markType, markType = _g === void 0 ? "cross" : _g;
23
- var _h = useState(checked), isChecked = _h[0], setIsChecked = _h[1];
22
+ var id = _a.id, label = _a.label, _b = _a.checked, checked = _b === void 0 ? false : _b, onChange = _a.onChange, _c = _a.boxColor, boxColor = _c === void 0 ? "#000000" : _c, _d = _a.markColor, markColor = _d === void 0 ? "#FFFFFF" : _d, _e = _a.textColor, textColor = _e === void 0 ? "#000000" : _e, _f = _a.size, size = _f === void 0 ? "default" : _f, _g = _a.markType, markType = _g === void 0 ? "cross" : _g, _h = _a.isSignedIn, isSignedIn = _h === void 0 ? true : _h;
23
+ var _j = useState(checked), isChecked = _j[0], setIsChecked = _j[1];
24
24
  // Generate a random ID if none is provided
25
25
  var checkboxId = id || "checkbox-".concat(Math.random().toString(36).substr(2, 9));
26
26
  var handleClick = function (e) {
@@ -53,6 +53,7 @@ var ColoredCheckbox = function (_a) {
53
53
  : label;
54
54
  return (React.createElement("div", { className: styles.container },
55
55
  React.createElement("button", { id: checkboxId, className: "".concat(styles.checkbox, " ").concat(isChecked ? styles.checked : "", " ").concat(size === "small" ? styles.small : ""), onClick: handleClick, style: checkboxStyle, "aria-checked": isChecked, role: "checkbox", "data-cy": "checkbox-".concat(checkboxId) }, isChecked && (React.createElement("span", { className: "".concat(styles.icon, " ").concat(markType === "cross" ? "allaw-icon-close" : "allaw-icon-check"), style: markStyle }))),
56
+ isSignedIn === false && (React.createElement("img", { src: "/assets/allaw-icon-unlink-red.svg", alt: "Non connect\u00E9", className: styles.unlinkIcon })),
56
57
  label && (React.createElement("label", { htmlFor: checkboxId, className: styles.label, style: labelStyle, onClick: handleClick }, formattedLabel))));
57
58
  };
58
59
  export default ColoredCheckbox;
package/dist/components/molecules/checkboxForm/ColoredCheckbox.module.css CHANGED
@@ -43,6 +43,12 @@
43
43
  font-size: 11px;
44
44
  }
45
45
 
46
+ .unlinkIcon {
47
+ width: 16px;
48
+ height: 16px;
49
+ flex-shrink: 0;
50
+ }
51
+
46
52
  .label {
47
53
  font-family: "Open Sans", sans-serif;
48
54
  font-size: 14px;
package/dist/components/molecules/checkboxForm/ColoredCheckbox.stories.d.ts CHANGED
@@ -53,6 +53,15 @@ declare namespace _default {
53
53
  }
54
54
  export { control_6 as control };
55
55
  }
56
+ export namespace isSignedIn {
57
+ export namespace control_7 {
58
+ let type_3: string;
59
+ export { type_3 as type };
60
+ }
61
+ export { control_7 as control };
62
+ let defaultValue_3: boolean;
63
+ export { defaultValue_3 as defaultValue };
64
+ }
56
65
  }
57
66
  export namespace parameters {
58
67
  namespace backgrounds {
@@ -81,4 +90,7 @@ export const EmailLabelVerySmallContainer: any;
81
90
  export const LongEmailLabel: any;
82
91
  export const LongEmailLabelSmallContainer: any;
83
92
  export const LongEmailLabelVerySmallContainer: any;
93
+ export const NotSignedIn: any;
94
+ export const NotSignedInEmail: any;
95
+ export const NotSignedInChecked: any;
84
96
  import ColoredCheckbox from "./ColoredCheckbox";
package/dist/components/molecules/checkboxForm/ColoredCheckbox.stories.js CHANGED
@@ -52,6 +52,12 @@ export default {
52
52
  options: ["cross", "check"],
53
53
  },
54
54
  },
55
+ isSignedIn: {
56
+ control: {
57
+ type: "boolean",
58
+ },
59
+ defaultValue: true,
60
+ },
55
61
  },
56
62
  parameters: {
57
63
  backgrounds: {
@@ -82,6 +88,7 @@ Default.args = {
82
88
  textColor: "#000000",
83
89
  size: "default",
84
90
  markType: "cross",
91
+ isSignedIn: true,
85
92
  };
86
93
  export var Checked = Template.bind({});
87
94
  Checked.args = __assign(__assign({}, Default.args), { checked: true, label: "Checked Checkbox" });
@@ -115,3 +122,10 @@ export var LongEmailLabelSmallContainer = Template.bind({});
115
122
  LongEmailLabelSmallContainer.args = __assign(__assign({}, LongEmailLabel.args), { containerWidth: "300px" });
116
123
  export var LongEmailLabelVerySmallContainer = Template.bind({});
117
124
  LongEmailLabelVerySmallContainer.args = __assign(__assign({}, LongEmailLabel.args), { containerWidth: "200px" });
125
+ // Exemples avec isSignedIn
126
+ export var NotSignedIn = Template.bind({});
127
+ NotSignedIn.args = __assign(__assign({}, Default.args), { label: "User not signed in", isSignedIn: false });
128
+ export var NotSignedInEmail = Template.bind({});
129
+ NotSignedInEmail.args = __assign(__assign({}, EmailLabel.args), { label: "vincent.desbrosses@hotmail.com", isSignedIn: false });
130
+ export var NotSignedInChecked = Template.bind({});
131
+ NotSignedInChecked.args = __assign(__assign({}, NotSignedIn.args), { checked: true });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "allaw-ui",
3
- "version": "2.8.7",
3
+ "version": "2.8.8",
4
4
  "description": "Composants UI pour l'application Allaw",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",