@1024pix/pix-ui 29.0.0 → 29.1.1

package/.circleci/config.yml

@@ -1,7 +1,7 @@
 version: 2.1
 
 orbs:
-  browser-tools: circleci/browser-tools@1.3.0
+  browser-tools: circleci/browser-tools@1.4.1
 
 workflows:
   version: 2
@@ -16,7 +16,7 @@ workflows:
 jobs:
   build-and-test:
     docker:
-      - image: cimg/node:16.19.0-browsers
+      - image: cimg/node:16.19.1-browsers
     resource_class: medium+
     steps:
       - checkout

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # Pix-UI Changelog
 
+## v29.1.1 (31/03/2023)
+
+
+### :building_construction: Tech
+- [#375](https://github.com/1024pix/pix-ui/pull/375) [TECH] Améliorer l'affichage des éléments en screen-reader-only ayant des sous élements (PIX-7623)
+
+### :bug: Correction
+- [#373](https://github.com/1024pix/pix-ui/pull/373) [BUGFIX] Rendre les couleurs des tags cohérentes avec celles des maquettes (PIX-7582)
+- [#374](https://github.com/1024pix/pix-ui/pull/374) [BUGFIX] Rendre les typographies de la modale cohérentes avec celles des maquettes (PIX-7615) 
+
+## v29.1.0 (28/03/2023)
+
+
+### :building_construction: Tech
+- [#364](https://github.com/1024pix/pix-ui/pull/364) [TECH] Mise à jour de ember-click-outside
+
+### :bug: Correction
+- [#372](https://github.com/1024pix/pix-ui/pull/372) [BUGFIX] Augmenter l'épaisseur du label de PixInput (PIX-7574).
+- [#365](https://github.com/1024pix/pix-ui/pull/365) [BUGFIX] Corriger la sémantique et l'affichage du scroll sur la dropdown du PixSelect (PIX-7480)
+
+### :coffee: Autre
+- [#362](https://github.com/1024pix/pix-ui/pull/362) [CLEANUP] Nettoie quelques dépendances et de la doc
+- [#371](https://github.com/1024pix/pix-ui/pull/371) [BUMP] Update actions/setup-node action to v3 (workflows)
+- [#370](https://github.com/1024pix/pix-ui/pull/370) [BUMP] Update actions/checkout action to v3 (workflows)
+- [#341](https://github.com/1024pix/pix-ui/pull/341) [BUMP] Update Node.js to v16.19.1 (.circleci)
+- [#342](https://github.com/1024pix/pix-ui/pull/342) [BUMP] Update browser-tools orb to v1.4.1 (.circleci)
+
 ## v29.0.0 (24/03/2023)
 
 

package/addon/components/pix-select.hbs

@@ -59,7 +59,7 @@
         />
       </div>
     {{/if}}
-    <div role="listbox" id={{this.listId}} class="pix-select__options">
+    <ul role="listbox" id={{this.listId}} class="pix-select__options">
       <li
         class="pix-select-options-category__option{{unless
             @value
@@ -135,9 +135,9 @@
           {{/each}}
         {{/if}}
       {{else}}
-        <p class="pix-select__empty-search-message">{{@emptySearchMessage}}</p>
+        <li class="pix-select__empty-search-message">{{@emptySearchMessage}}</li>
       {{/if}}
-    </div>
+    </ul>
   </div>
   {{#if @errorMessage}}
     <p class="pix-select__error-message">{{@errorMessage}}</p>

package/addon/styles/_a11y.scss

@@ -1,4 +1,4 @@
-.screen-reader-only {
+.screen-reader-only, .screen-reader-only > * {
   position: absolute;
   width: 1px;
   height: 1px;

package/addon/styles/_pix-indicator-card.scss

@@ -23,7 +23,6 @@
     justify-content: center;
     color: $pix-neutral-60;
     padding: $pix-spacing-s $pix-spacing-m;
-    margin: 0;
   }
 
   &__title {
@@ -40,7 +39,6 @@
   &__value {
     @extend %pix-title-m;
 
-    margin: 0;
     margin-bottom: $pix-spacing-xxs;
   }
 
@@ -50,7 +48,6 @@
     font-weight: $font-normal;
     display: flex;
     gap: 10px;
-    margin: 0;
   }
 
   &__tooltip {

package/addon/styles/_pix-input.scss

@@ -4,16 +4,11 @@
   position: relative;
 
   &__label {
-    font-size: 0.875rem;
-    color: $pix-neutral-70;
-    margin-bottom: 4px;
+    @include label();
   }
 
   &__information {
-    font-size: 0.75rem;
-    margin-top: 4px;
-    color: $pix-neutral-60;
-    display: block;
+    @include subLabel();
   }
 
   &__container {

package/addon/styles/_pix-modal.scss

@@ -68,7 +68,7 @@ $button-margin: 16px;
   }
 
   &__title {
-    @extend %pix-title-s;
+    @extend %pix-title-xs;
 
     margin-bottom: 0;
     color: $pix-neutral-90;
@@ -80,7 +80,7 @@ $button-margin: 16px;
   }
 
   &__content {
-    @extend %pix-body-m;
+    @extend %pix-body-s;
 
     padding: $modal-padding;
     color: $pix-neutral-90;

package/addon/styles/_pix-select.scss

@@ -13,10 +13,10 @@
   &__dropdown {
     z-index: 200;
     position: absolute;
-    max-height: 200px;
+    max-height: 12.5rem;
     width: inherit;
     border-top: none;
-    border-radius: 0 0 4px 4px;
+    border-radius: 0 0 $pix-spacing-xxs $pix-spacing-xxs;
     list-style-type: none;
     padding: 0;
     background-color: $pix-neutral-0;
@@ -24,19 +24,20 @@
     transition: all 0.1s ease-in-out;
     white-space: nowrap;
     margin-top: $pix-spacing-xxs;
+    overflow-y: auto;
 
     &::-webkit-scrollbar {
       width: 0.5rem;
     }
 
     &::-webkit-scrollbar-track {
-      border-radius: 4px;
+      border-radius: $pix-spacing-xxs;
       border: 1px solid $pix-neutral-20;
       background: $pix-neutral-20;
     }
 
     &::-webkit-scrollbar-thumb {
-      border-radius: 4px;
+      border-radius: $pix-spacing-xxs;
       width: 0.375rem;
       background: $pix-neutral-30;
     }
@@ -63,7 +64,7 @@
     border-bottom: 2px solid $pix-neutral-22;
     margin: $pix-spacing-s $pix-spacing-m;
     color: $pix-neutral-30;
-    border-radius: 4px 4px 0 0;
+    border-radius: $pix-spacing-xxs $pix-spacing-xxs 0 0;
 
     &:focus-within {
       background: $pix-neutral-10;
@@ -72,8 +73,6 @@
   }
 
   &__options {
-    overflow-y: auto;
-    max-height: inherit;
     border-top: 1px solid $pix-neutral-20;
   }
 
@@ -84,14 +83,13 @@
 
 .pix-select-button {
   display: flex;
-  flex-direction: row;
   align-items: center;
   position: relative;
   border: 1px $pix-neutral-45 solid;
   padding: 0 $pix-spacing-s 0 $pix-spacing-s;
   width: 100%;
   background-color: $pix-neutral-0;
-  border-radius: 4px;
+  border-radius: $pix-spacing-xxs;
   outline: none;
   height: 2.25rem;
   cursor: pointer;

package/addon/styles/_pix-tag.scss

@@ -11,8 +11,8 @@
   background-color: $pix-primary;
 
   &--blue-light {
-    color: darken($pix-primary, 10%);
-    background-color: lighten($pix-primary, 30%);
+    color: $pix-primary-80;
+    background-color: $pix-primary-10;
   }
 
   &--green {
@@ -20,8 +20,8 @@
   }
 
   &--green-light {
-    color: $pix-success-70;
-    background-color: $pix-success-5;
+    color: $pix-success-80;
+    background-color: $pix-success-10;
   }
 
   &--purple {
@@ -39,8 +39,8 @@
   }
 
   &--yellow-light {
-    color: darken($pix-warning-40, 25%);
-    background-color: lighten($pix-warning-40, 35%);
+    color: $pix-warning-80;
+    background-color: $pix-warning-10;
   }
 
   &--orange {
@@ -48,8 +48,8 @@
   }
 
   &--orange-light {
-    color: $pix-warning-70;
-    background-color: $pix-warning-5;
+    color: $pix-warning-80;
+    background-color: $pix-warning-10;
   }
 
   &--grey {
@@ -58,8 +58,8 @@
   }
 
   &--grey-light {
-    color: $pix-neutral-60;
-    background-color: $pix-neutral-15;
+    color: $pix-neutral-90;
+    background-color: $pix-neutral-20;
   }
 
   &--compact {

package/addon/styles/normalize-reset/_normalize.scss

@@ -9,7 +9,7 @@
  */
 
 html {
-  line-height: 1.15; /* 1 */
+  line-height: normal; /* 1 */
   -webkit-text-size-adjust: 100%; /* 2 */
 }
   

package/addon/styles/normalize-reset/_reset.scss

@@ -44,13 +44,18 @@ input::-moz-focus-inner {
 }
 
 ul,
-ol,
-dd {
+ol {
   margin: 0;
   padding: 0;
   list-style: none;
 }
 
+dl,
+dt,
+dd {
+  margin: 0;
+}
+
 h1,
 h2,
 h3,

package/addon/styles/pix-design-tokens/_form.scss

@@ -93,7 +93,8 @@
   }
 }
 
-abbr.mandatory-mark {
+.mandatory-mark,
+.mandatory-mark[title] {
   cursor: help;
   color: $pix-error-70;
   text-decoration: none;

package/docs/make-a-release.stories.mdx

@@ -16,7 +16,7 @@ dernières features en précisant le numéro de la version.
 
 Par ailleurs, sur Pix UI une release signifie aussi la mise à jour automatique de [notre storybook en ligne](https://storybook.pix.fr/).
 
-## Effectuer la release, méthode via slack (conseillée)
+## Effectuer la release via slack
 
 Aller dans le canal slack dédié aux releases : [#tech-releases](https://1024pix.slack.com/archives/CVAMDQYHY), puis taper la commande suivante :
 
@@ -43,27 +43,3 @@ Pour vérifier si la release s'est bien déroulée :
 
 - vérifier le contenu du [CHANGELOG.md](../CHANGELOG.md) : contient-il toutes les PR qui ont été mergées récemment sur la branche `dev` ?
 - vérifier si notre [Storybook en ligne](https://1024pix.github.io/pix-ui/) montre bien les nouveaux composants.
-
-## Effectuer la release, méthode à la mano (déconseillée)
-
-Après s'être mis à jour sur la branche dev, lancer le script de publication :
-
-- `git checkout dev`
-- `git pull`
-- `./scripts/publish.sh <version_souhaitée>`
-
-  `<version_souhaitée>` peut prendre 3 valeurs :
-
-  - `patch` : correctif de bug
-  - `minor` : modifications n'apportant pas de changement dans l'utilisation de Pix UI
-  - `major` : modifications apportant des breaking changes
-
-Pour plus d'informations au sujet de la version à choisir se référencer à [SemVer](https://semver.org/lang/fr/).
-
-Le script de publication effectuera automatiquement les actions suivantes :
-
-- mise à jour de la version du projet dans le `package.json`
-- création d'un tag git correspondant à la nouvelle version
-- mise à jour de la liste des changements dans le [CHANGELOG.md](../CHANGELOG.md)
-- mise à jour de la branche `master` par rapport à `dev`
-- re-[déploiement de storybook sur les GitHub Pages](/?path=/docs/développement-storybook--page)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@1024pix/pix-ui",
-  "version": "29.0.0",
+  "version": "29.1.1",
   "description": "Pix-UI is the implementation of Pix design principles and guidelines for its products.",
   "keywords": [
     "ember-addon"
@@ -53,8 +53,7 @@
     "ember-cli-babel": "^7.26.8",
     "ember-cli-htmlbars": "^6.1.1",
     "ember-cli-sass": "^11.0.1",
-    "ember-cli-string-utils": "^1.1.0",
-    "ember-click-outside": "^4.0.0",
+    "ember-click-outside": "^6.0.1",
     "ember-truth-helpers": "^3.1.1",
     "lodash.debounce": "^4.0.8"
   },
@@ -86,8 +85,6 @@
     "@storybook/theming": "^6.5.13",
     "@testing-library/dom": "^8.20.0",
     "@testing-library/user-event": "^14.4.3",
-    "axios": "^1.2.0",
-    "broccoli-asset-rev": "^3.0.0",
     "core-js": "^3.26.1",
     "ember-cli": "^4.8.0",
     "ember-cli-dependency-checker": "^3.3.1",
@@ -116,7 +113,6 @@
     "html-webpack-plugin": "^5.5.0",
     "loader.js": "^4.7.0",
     "lodash": "^4.17.21",
-    "moment": "^2.29.4",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.8.0",
     "qunit": "^2.19.3",