qc-trousse-sdg 1.4.0 → 1.4.2

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 (49) hide show
  1. package/README.md +9 -0
  2. package/dist/css/qc-sdg-no-grid.min.css +1 -1
  3. package/dist/css/qc-sdg.min.css +1 -1
  4. package/dist/js/qc-sdg.min.js +1 -1
  5. package/index.html +6 -0
  6. package/package.json +2 -2
  7. package/plugins/buildSvelteTests.js +36 -0
  8. package/public/css/qc-sdg-no-grid.css +18 -28
  9. package/public/css/qc-sdg.css +18 -28
  10. package/public/js/qc-doc-sdg.js +1382 -451
  11. package/public/js/qc-sdg.js +1832 -797
  12. package/rollup.config.js +5 -0
  13. package/src/sdg/components/DropdownList/DropdownListButton/DropdownListButton.svelte +7 -8
  14. package/src/sdg/components/DropdownList/DropdownListButton/_dropdownListButton.scss +2 -12
  15. package/src/sdg/components/TextField/TextField.svelte +7 -5
  16. package/src/sdg/components/TextField/TextFieldWC.svelte +1 -1
  17. package/src/sdg/qc-sdg-test.js +1 -1
  18. package/tests/buildSvelteTestsIgnore.json +4 -0
  19. package/tests/{button.spec.ts → button-baseline.spec.ts} +2 -2
  20. package/tests/choice-group-baseline.spec.ts +20 -0
  21. package/tests/choice-group-svelte.spec.ts +20 -0
  22. package/tests/{dropdown-list.spec.ts → dropdown-list-baseline.spec.ts} +1 -1
  23. package/tests/{icon.spec.ts → icon-baseline.spec.ts} +1 -9
  24. package/tests/icon-svelte.spec.ts +11 -0
  25. package/tests/piv-header-baseline.spec.ts +11 -0
  26. package/tests/piv-header-svelte.spec.ts +11 -0
  27. package/tests/textfield-baseline.spec.ts +28 -0
  28. package/tests/textfield-svelte.spec.ts +28 -0
  29. package/tests/toggle-switch-baseline.spec.ts +11 -0
  30. package/tests/toggle-switch-svelte.spec.ts +11 -0
  31. package/tests/choice-group.spec.ts +0 -36
  32. package/tests/pivHeader.spec.ts +0 -22
  33. package/tests/textfield.spec.ts +0 -21
  34. package/tests/toggle-switch.spec.ts +0 -20
  35. /package/src/sdg/bases/Icon/Test/{IconEmbeddedTest.html → IconSvelteTest.html} +0 -0
  36. /package/src/sdg/bases/Icon/Test/{iconTest.html → iconBaselineTest.html} +0 -0
  37. /package/src/sdg/components/Button/Test/{buttonTest.html → buttonBaselineTest.html} +0 -0
  38. /package/src/sdg/components/ChoiceGroup/Test/{checkboxTest.html → checkboxBaselineTest.html} +0 -0
  39. /package/src/sdg/components/ChoiceGroup/Test/{checkboxEmbeddedTest.html → checkboxSvelteTest.html} +0 -0
  40. /package/src/sdg/components/ChoiceGroup/Test/{radiosTest.html → radiosBaselineTest.html} +0 -0
  41. /package/src/sdg/components/ChoiceGroup/Test/{radiosEmbeddedTest.html → radiosSvelteTest.html} +0 -0
  42. /package/src/sdg/components/DropdownList/Test/{DropdownListEmbeddedTest.svelte → DropdownListSvelteTest.svelte} +0 -0
  43. /package/src/sdg/components/DropdownList/Test/{dropdownListEmbeddedTest.html → dropdownListSvelteTest.html} +0 -0
  44. /package/src/sdg/components/PivHeader/Test/{pivHeaderTest.html → pivHeaderBaselineTest.html} +0 -0
  45. /package/src/sdg/components/PivHeader/Test/{pivHeaderEmbeddedTest.html → pivHeaderSvelteTest.html} +0 -0
  46. /package/src/sdg/components/TextField/Test/{textFieldTest.html → textFieldBaselineTest.html} +0 -0
  47. /package/src/sdg/components/TextField/Test/{textFieldEmbeddedTest.html → textFieldSvelteTest.html} +0 -0
  48. /package/src/sdg/components/ToggleSwitch/Test/{toggleSwitchTest.html → toggleSwitchBaselineTest.html} +0 -0
  49. /package/src/sdg/components/ToggleSwitch/Test/{toggleSwitchEmbeddedTest.html → toggleSwitchSvelteTest.html} +0 -0
package/index.html ADDED
@@ -0,0 +1,6 @@
1
+ <!DOCTYPE html>
2
+ <html lang="fr">
3
+ <head>
4
+ <meta http-equiv="refresh" content="0;url=/public/index.html" />
5
+ </head>
6
+ </html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "qc-trousse-sdg",
3
- "version": "1.4.0",
3
+ "version": "1.4.2",
4
4
  "description": "Trousse de développement du Système de design gouvernemental du Québec",
5
5
  "main": "index.js",
6
6
  "scripts": {
@@ -8,7 +8,7 @@
8
8
  "preversion": "./scripts/check-release-note.sh",
9
9
  "version": "./scripts/compile-doc.sh",
10
10
  "build": "rollup -c --bundleConfigAsCjs",
11
- "start": "sirv public",
11
+ "start": "sirv .",
12
12
  "rewrite-bootstrap": "gulp rewriteBs",
13
13
  "build-images-scss-map": "node ./scripts/buildImagesMap.js"
14
14
  },
@@ -0,0 +1,36 @@
1
+ import fs from 'fs';
2
+ import path from 'path';
3
+ import glob from 'glob';
4
+
5
+ function buildSvelteTests({input, ignorePathsFile}) {
6
+ return {
7
+ name: "build-svelte-tests",
8
+ buildStart() {
9
+ const testsRoot = path.resolve(input);
10
+ const resolvedIgnorePathsFile = ignorePathsFile ? `${testsRoot}/${ignorePathsFile}` : null;
11
+ const ignorePaths = resolvedIgnorePathsFile ?
12
+ JSON.parse(fs.readFileSync(resolvedIgnorePathsFile, 'utf-8'))
13
+ : [];
14
+
15
+ const partialPaths = glob.sync('**/*-baseline.spec.ts', {
16
+ cwd: testsRoot,
17
+ absolute: true,
18
+ ignore: ignorePaths
19
+ });
20
+
21
+ partialPaths.forEach(partialPath => {
22
+ this.addWatchFile(partialPath);
23
+
24
+ let testCode = fs.readFileSync(partialPath, 'utf-8');
25
+
26
+ testCode = testCode.replace(/Baseline\.test\.html/g, "Svelte.test.html");
27
+ testCode = testCode.replace(/baseline/g, "svelte");
28
+
29
+ const outputPath = partialPath.replace(/-baseline\.spec\.ts/g, "-svelte.spec.ts");
30
+ fs.writeFileSync(outputPath, testCode, 'utf-8');
31
+ });
32
+ }
33
+ }
34
+ }
35
+
36
+ export default buildSvelteTests;
@@ -950,7 +950,7 @@ dd {
950
950
  font-family: "Open Sans";
951
951
  font-style: normal;
952
952
  font-weight: 400;
953
- src: url("../fonts/open-sans-v43-latin-regular.woff2") format("woff2");
953
+ src: url("../../dist/fonts/open-sans-v43-latin-regular.woff2") format("woff2");
954
954
  }
955
955
  /* open-sans-italic - latin */
956
956
  @font-face {
@@ -958,7 +958,7 @@ dd {
958
958
  font-family: "Open Sans";
959
959
  font-style: italic;
960
960
  font-weight: 400;
961
- src: url("../fonts/open-sans-v43-latin-italic.woff2") format("woff2");
961
+ src: url("../../dist/fonts/open-sans-v43-latin-italic.woff2") format("woff2");
962
962
  }
963
963
  /* open-sans-500 - latin */
964
964
  @font-face {
@@ -966,7 +966,7 @@ dd {
966
966
  font-family: "Open Sans";
967
967
  font-style: normal;
968
968
  font-weight: 500;
969
- src: url("../fonts/open-sans-v43-latin-500.woff2") format("woff2");
969
+ src: url("../../dist/fonts/open-sans-v43-latin-500.woff2") format("woff2");
970
970
  }
971
971
  /* open-sans-500italic - latin */
972
972
  @font-face {
@@ -974,7 +974,7 @@ dd {
974
974
  font-family: "Open Sans";
975
975
  font-style: italic;
976
976
  font-weight: 500;
977
- src: url("../fonts/open-sans-v43-latin-500italic.woff2") format("woff2");
977
+ src: url("../../dist/fonts/open-sans-v43-latin-500italic.woff2") format("woff2");
978
978
  }
979
979
  /* open-sans-600 - latin */
980
980
  @font-face {
@@ -982,7 +982,7 @@ dd {
982
982
  font-family: "Open Sans";
983
983
  font-style: normal;
984
984
  font-weight: 600;
985
- src: url("../fonts/open-sans-v43-latin-600.woff2") format("woff2");
985
+ src: url("../../dist/fonts/open-sans-v43-latin-600.woff2") format("woff2");
986
986
  }
987
987
  /* open-sans-600italic - latin */
988
988
  @font-face {
@@ -990,7 +990,7 @@ dd {
990
990
  font-family: "Open Sans";
991
991
  font-style: italic;
992
992
  font-weight: 600;
993
- src: url("../fonts/open-sans-v43-latin-600italic.woff2") format("woff2");
993
+ src: url("../../dist/fonts/open-sans-v43-latin-600italic.woff2") format("woff2");
994
994
  }
995
995
  /* open-sans-700 - latin */
996
996
  @font-face {
@@ -998,7 +998,7 @@ dd {
998
998
  font-family: "Open Sans";
999
999
  font-style: normal;
1000
1000
  font-weight: 700;
1001
- src: url("../fonts/open-sans-v43-latin-700.woff2") format("woff2");
1001
+ src: url("../../dist/fonts/open-sans-v43-latin-700.woff2") format("woff2");
1002
1002
  }
1003
1003
  /* open-sans-700italic - latin */
1004
1004
  @font-face {
@@ -1006,7 +1006,7 @@ dd {
1006
1006
  font-family: "Open Sans";
1007
1007
  font-style: italic;
1008
1008
  font-weight: 700;
1009
- src: url("../fonts/open-sans-v43-latin-700italic.woff2") format("woff2");
1009
+ src: url("../../dist/fonts/open-sans-v43-latin-700italic.woff2") format("woff2");
1010
1010
  }
1011
1011
  /* roboto-regular - latin */
1012
1012
  @font-face {
@@ -1014,7 +1014,7 @@ dd {
1014
1014
  font-family: "Roboto";
1015
1015
  font-style: normal;
1016
1016
  font-weight: 400;
1017
- src: url("../fonts/roboto-v48-latin-regular.woff2") format("woff2");
1017
+ src: url("../../dist/fonts/roboto-v48-latin-regular.woff2") format("woff2");
1018
1018
  }
1019
1019
  /* roboto-italic - latin */
1020
1020
  @font-face {
@@ -1022,7 +1022,7 @@ dd {
1022
1022
  font-family: "Roboto";
1023
1023
  font-style: italic;
1024
1024
  font-weight: 400;
1025
- src: url("../fonts/roboto-v48-latin-italic.woff2") format("woff2");
1025
+ src: url("../../dist/fonts/roboto-v48-latin-italic.woff2") format("woff2");
1026
1026
  }
1027
1027
  /* roboto-500 - latin */
1028
1028
  @font-face {
@@ -1030,7 +1030,7 @@ dd {
1030
1030
  font-family: "Roboto";
1031
1031
  font-style: normal;
1032
1032
  font-weight: 500;
1033
- src: url("../fonts/roboto-v48-latin-500.woff2") format("woff2");
1033
+ src: url("../../dist/fonts/roboto-v48-latin-500.woff2") format("woff2");
1034
1034
  }
1035
1035
  /* roboto-500italic - latin */
1036
1036
  @font-face {
@@ -1038,7 +1038,7 @@ dd {
1038
1038
  font-family: "Roboto";
1039
1039
  font-style: italic;
1040
1040
  font-weight: 500;
1041
- src: url("../fonts/roboto-v48-latin-500italic.woff2") format("woff2");
1041
+ src: url("../../dist/fonts/roboto-v48-latin-500italic.woff2") format("woff2");
1042
1042
  }
1043
1043
  /* roboto-600 - latin */
1044
1044
  @font-face {
@@ -1046,7 +1046,7 @@ dd {
1046
1046
  font-family: "Roboto";
1047
1047
  font-style: normal;
1048
1048
  font-weight: 600;
1049
- src: url("../fonts/roboto-v48-latin-600.woff2") format("woff2");
1049
+ src: url("../../dist/fonts/roboto-v48-latin-600.woff2") format("woff2");
1050
1050
  }
1051
1051
  /* roboto-600italic - latin */
1052
1052
  @font-face {
@@ -1054,7 +1054,7 @@ dd {
1054
1054
  font-family: "Roboto";
1055
1055
  font-style: italic;
1056
1056
  font-weight: 600;
1057
- src: url("../fonts/roboto-v48-latin-600italic.woff2") format("woff2");
1057
+ src: url("../../dist/fonts/roboto-v48-latin-600italic.woff2") format("woff2");
1058
1058
  }
1059
1059
  /* roboto-700 - latin */
1060
1060
  @font-face {
@@ -1062,7 +1062,7 @@ dd {
1062
1062
  font-family: "Roboto";
1063
1063
  font-style: normal;
1064
1064
  font-weight: 700;
1065
- src: url("../fonts/roboto-v48-latin-700.woff2") format("woff2");
1065
+ src: url("../../dist/fonts/roboto-v48-latin-700.woff2") format("woff2");
1066
1066
  }
1067
1067
  /* roboto-700italic - latin */
1068
1068
  @font-face {
@@ -1070,7 +1070,7 @@ dd {
1070
1070
  font-family: "Roboto";
1071
1071
  font-style: italic;
1072
1072
  font-weight: 700;
1073
- src: url("../fonts/roboto-v48-latin-700italic.woff2") format("woff2");
1073
+ src: url("../../dist/fonts/roboto-v48-latin-700italic.woff2") format("woff2");
1074
1074
  }
1075
1075
  hr {
1076
1076
  margin: var(--qc-spacer-lg) 0;
@@ -2467,12 +2467,6 @@ li[aria-selected=true] {
2467
2467
  background-color: var(--qc-color-grey-pale);
2468
2468
  }
2469
2469
 
2470
- .qc-dropdown-text {
2471
- display: flex;
2472
- justify-items: start;
2473
- overflow: hidden;
2474
- }
2475
-
2476
2470
  .qc-dropdown-choice, .qc-dropdown-placeholder {
2477
2471
  display: block;
2478
2472
  justify-content: start;
@@ -2491,12 +2485,8 @@ li[aria-selected=true] {
2491
2485
  }
2492
2486
 
2493
2487
  .qc-dropdown-button-icon {
2494
- align-items: center;
2495
- rotate: 180deg;
2496
- }
2497
-
2498
- .qc-dropdown-button-icon-expanded {
2499
- transform: rotate(180deg);
2488
+ display: flex;
2489
+ align-content: center;
2500
2490
  }
2501
2491
 
2502
2492
  .qc-dropdown-list-margin {
@@ -950,7 +950,7 @@ dd {
950
950
  font-family: "Open Sans";
951
951
  font-style: normal;
952
952
  font-weight: 400;
953
- src: url("../fonts/open-sans-v43-latin-regular.woff2") format("woff2");
953
+ src: url("../../dist/fonts/open-sans-v43-latin-regular.woff2") format("woff2");
954
954
  }
955
955
  /* open-sans-italic - latin */
956
956
  @font-face {
@@ -958,7 +958,7 @@ dd {
958
958
  font-family: "Open Sans";
959
959
  font-style: italic;
960
960
  font-weight: 400;
961
- src: url("../fonts/open-sans-v43-latin-italic.woff2") format("woff2");
961
+ src: url("../../dist/fonts/open-sans-v43-latin-italic.woff2") format("woff2");
962
962
  }
963
963
  /* open-sans-500 - latin */
964
964
  @font-face {
@@ -966,7 +966,7 @@ dd {
966
966
  font-family: "Open Sans";
967
967
  font-style: normal;
968
968
  font-weight: 500;
969
- src: url("../fonts/open-sans-v43-latin-500.woff2") format("woff2");
969
+ src: url("../../dist/fonts/open-sans-v43-latin-500.woff2") format("woff2");
970
970
  }
971
971
  /* open-sans-500italic - latin */
972
972
  @font-face {
@@ -974,7 +974,7 @@ dd {
974
974
  font-family: "Open Sans";
975
975
  font-style: italic;
976
976
  font-weight: 500;
977
- src: url("../fonts/open-sans-v43-latin-500italic.woff2") format("woff2");
977
+ src: url("../../dist/fonts/open-sans-v43-latin-500italic.woff2") format("woff2");
978
978
  }
979
979
  /* open-sans-600 - latin */
980
980
  @font-face {
@@ -982,7 +982,7 @@ dd {
982
982
  font-family: "Open Sans";
983
983
  font-style: normal;
984
984
  font-weight: 600;
985
- src: url("../fonts/open-sans-v43-latin-600.woff2") format("woff2");
985
+ src: url("../../dist/fonts/open-sans-v43-latin-600.woff2") format("woff2");
986
986
  }
987
987
  /* open-sans-600italic - latin */
988
988
  @font-face {
@@ -990,7 +990,7 @@ dd {
990
990
  font-family: "Open Sans";
991
991
  font-style: italic;
992
992
  font-weight: 600;
993
- src: url("../fonts/open-sans-v43-latin-600italic.woff2") format("woff2");
993
+ src: url("../../dist/fonts/open-sans-v43-latin-600italic.woff2") format("woff2");
994
994
  }
995
995
  /* open-sans-700 - latin */
996
996
  @font-face {
@@ -998,7 +998,7 @@ dd {
998
998
  font-family: "Open Sans";
999
999
  font-style: normal;
1000
1000
  font-weight: 700;
1001
- src: url("../fonts/open-sans-v43-latin-700.woff2") format("woff2");
1001
+ src: url("../../dist/fonts/open-sans-v43-latin-700.woff2") format("woff2");
1002
1002
  }
1003
1003
  /* open-sans-700italic - latin */
1004
1004
  @font-face {
@@ -1006,7 +1006,7 @@ dd {
1006
1006
  font-family: "Open Sans";
1007
1007
  font-style: italic;
1008
1008
  font-weight: 700;
1009
- src: url("../fonts/open-sans-v43-latin-700italic.woff2") format("woff2");
1009
+ src: url("../../dist/fonts/open-sans-v43-latin-700italic.woff2") format("woff2");
1010
1010
  }
1011
1011
  /* roboto-regular - latin */
1012
1012
  @font-face {
@@ -1014,7 +1014,7 @@ dd {
1014
1014
  font-family: "Roboto";
1015
1015
  font-style: normal;
1016
1016
  font-weight: 400;
1017
- src: url("../fonts/roboto-v48-latin-regular.woff2") format("woff2");
1017
+ src: url("../../dist/fonts/roboto-v48-latin-regular.woff2") format("woff2");
1018
1018
  }
1019
1019
  /* roboto-italic - latin */
1020
1020
  @font-face {
@@ -1022,7 +1022,7 @@ dd {
1022
1022
  font-family: "Roboto";
1023
1023
  font-style: italic;
1024
1024
  font-weight: 400;
1025
- src: url("../fonts/roboto-v48-latin-italic.woff2") format("woff2");
1025
+ src: url("../../dist/fonts/roboto-v48-latin-italic.woff2") format("woff2");
1026
1026
  }
1027
1027
  /* roboto-500 - latin */
1028
1028
  @font-face {
@@ -1030,7 +1030,7 @@ dd {
1030
1030
  font-family: "Roboto";
1031
1031
  font-style: normal;
1032
1032
  font-weight: 500;
1033
- src: url("../fonts/roboto-v48-latin-500.woff2") format("woff2");
1033
+ src: url("../../dist/fonts/roboto-v48-latin-500.woff2") format("woff2");
1034
1034
  }
1035
1035
  /* roboto-500italic - latin */
1036
1036
  @font-face {
@@ -1038,7 +1038,7 @@ dd {
1038
1038
  font-family: "Roboto";
1039
1039
  font-style: italic;
1040
1040
  font-weight: 500;
1041
- src: url("../fonts/roboto-v48-latin-500italic.woff2") format("woff2");
1041
+ src: url("../../dist/fonts/roboto-v48-latin-500italic.woff2") format("woff2");
1042
1042
  }
1043
1043
  /* roboto-600 - latin */
1044
1044
  @font-face {
@@ -1046,7 +1046,7 @@ dd {
1046
1046
  font-family: "Roboto";
1047
1047
  font-style: normal;
1048
1048
  font-weight: 600;
1049
- src: url("../fonts/roboto-v48-latin-600.woff2") format("woff2");
1049
+ src: url("../../dist/fonts/roboto-v48-latin-600.woff2") format("woff2");
1050
1050
  }
1051
1051
  /* roboto-600italic - latin */
1052
1052
  @font-face {
@@ -1054,7 +1054,7 @@ dd {
1054
1054
  font-family: "Roboto";
1055
1055
  font-style: italic;
1056
1056
  font-weight: 600;
1057
- src: url("../fonts/roboto-v48-latin-600italic.woff2") format("woff2");
1057
+ src: url("../../dist/fonts/roboto-v48-latin-600italic.woff2") format("woff2");
1058
1058
  }
1059
1059
  /* roboto-700 - latin */
1060
1060
  @font-face {
@@ -1062,7 +1062,7 @@ dd {
1062
1062
  font-family: "Roboto";
1063
1063
  font-style: normal;
1064
1064
  font-weight: 700;
1065
- src: url("../fonts/roboto-v48-latin-700.woff2") format("woff2");
1065
+ src: url("../../dist/fonts/roboto-v48-latin-700.woff2") format("woff2");
1066
1066
  }
1067
1067
  /* roboto-700italic - latin */
1068
1068
  @font-face {
@@ -1070,7 +1070,7 @@ dd {
1070
1070
  font-family: "Roboto";
1071
1071
  font-style: italic;
1072
1072
  font-weight: 700;
1073
- src: url("../fonts/roboto-v48-latin-700italic.woff2") format("woff2");
1073
+ src: url("../../dist/fonts/roboto-v48-latin-700italic.woff2") format("woff2");
1074
1074
  }
1075
1075
  hr {
1076
1076
  margin: var(--qc-spacer-lg) 0;
@@ -2467,12 +2467,6 @@ li[aria-selected=true] {
2467
2467
  background-color: var(--qc-color-grey-pale);
2468
2468
  }
2469
2469
 
2470
- .qc-dropdown-text {
2471
- display: flex;
2472
- justify-items: start;
2473
- overflow: hidden;
2474
- }
2475
-
2476
2470
  .qc-dropdown-choice, .qc-dropdown-placeholder {
2477
2471
  display: block;
2478
2472
  justify-content: start;
@@ -2491,12 +2485,8 @@ li[aria-selected=true] {
2491
2485
  }
2492
2486
 
2493
2487
  .qc-dropdown-button-icon {
2494
- align-items: center;
2495
- rotate: 180deg;
2496
- }
2497
-
2498
- .qc-dropdown-button-icon-expanded {
2499
- transform: rotate(180deg);
2488
+ display: flex;
2489
+ align-content: center;
2500
2490
  }
2501
2491
 
2502
2492
  .qc-dropdown-list-margin {