@ouestfrance/sipa-bms-ui 8.23.2 → 8.23.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ouestfrance/sipa-bms-ui",
-  "version": "8.23.2",
+  "version": "8.23.4",
   "author": "Ouest-France BMS",
   "license": "ISC",
   "scripts": {
@@ -33,13 +33,13 @@
     "@chromatic-com/storybook": "^4.1.3",
     "@codemirror/lang-html": "6.4.11",
     "@codemirror/lang-json": "6.0.2",
-    "@commitlint/cli": "20.2.0",
-    "@commitlint/config-conventional": "20.2.0",
+    "@commitlint/cli": "20.3.1",
+    "@commitlint/config-conventional": "20.3.1",
     "@mdx-js/react": "3.1.1",
-    "@storybook/addon-docs": "10.1.10",
-    "@storybook/addon-links": "10.1.10",
-    "@storybook/vue3-vite": "10.1.10",
-    "@types/lodash": "4.17.21",
+    "@storybook/addon-docs": "10.1.11",
+    "@storybook/addon-links": "10.1.11",
+    "@storybook/vue3-vite": "10.1.11",
+    "@types/lodash": "4.17.23",
     "@types/uuid": "11.0.0",
     "@vitejs/plugin-vue": "6.0.3",
     "@vue/test-utils": "2.4.6",
@@ -47,15 +47,15 @@
     "@vueuse/motion": "^3.0.0",
     "axios": "1.13.2",
     "blob-util": "^2.0.2",
-    "chromatic": "13.3.4",
+    "chromatic": "13.3.5",
     "codemirror": "6.0.2",
     "cors": "^2.8.5",
     "cross-env": "^10.0.0",
     "cy2": "^4.0.0",
-    "cypress": "15.8.1",
+    "cypress": "15.8.2",
     "express": "^5.0.0",
     "husky": "9.1.7",
-    "jsdom": "27.3.0",
+    "jsdom": "27.4.0",
     "keycloak-js": "26.1.2",
     "lint-staged": "16.2.7",
     "lodash": "4.17.21",
@@ -66,11 +66,11 @@
     "path": "0.12.7",
     "prettier": "3.7.4",
     "remark-gfm": "^4.0.1",
-    "sass": "1.97.1",
+    "sass": "1.97.2",
     "semantic-release": "25.0.2",
     "start-server-and-test": "2.1.3",
-    "storybook": "10.1.10",
-    "storybook-addon-pseudo-states": "10.1.10",
+    "storybook": "10.1.11",
+    "storybook-addon-pseudo-states": "10.1.11",
     "storybook-addon-tag-badges": "^3.0.2",
     "storybook-vue3-router": "^7.0.0",
     "typescript": "5.2.2",
@@ -85,7 +85,7 @@
     "vue-codemirror": "6.1.1",
     "vue-loader": "17.4.2",
     "vue-router": "4.6.4",
-    "vue-tsc": "3.2.0"
+    "vue-tsc": "3.2.2"
   },
   "files": [
     "dist",

package/src/components/button/BmsToggleIcon.vue

@@ -44,25 +44,32 @@ const handleClick = (event: MouseEvent) => {
   background: none;
   border: none;
   padding: 0;
-  padding-bottom: 0.25em;
   cursor: pointer;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   position: relative;
 
+  width: 34px;
+  height: 34px;
+  padding: 7px 0;
+
   :deep(svg) {
     color: var(--icon-color);
     transition: color 0.2s;
+    width: 20px;
+    height: 20px;
+    display: block;
   }
 
   &::after {
     content: '';
     position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    height: 0.125em;
+    bottom: 3px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 20px;
+    height: 2px;
     background-color: var(--underline-color);
     transition: background-color 0.2s;
   }
@@ -95,6 +102,10 @@ const handleClick = (event: MouseEvent) => {
   }
 
   &.small {
+    width: 24px;
+    height: 24px;
+    padding: 0.25em 0;
+
     :deep(svg) {
       width: 1em;
       height: 1em;
@@ -102,6 +113,10 @@ const handleClick = (event: MouseEvent) => {
 
     &::after {
       height: 1.5px;
+      bottom: -2px;
+      left: 50%;
+      transform: translateX(-50%);
+      width: 1em;
     }
   }
 }

package/src/components/form/BmsTag.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="tag" :class="{ active, disabled, small }" @click="emits('click')">
     <slot></slot>
-    <span class="dismiss-button">
-      <BmsIconButton @click.stop="emits('dismiss')" v-if="canBeDismissed">
+    <span class="dismiss-button" v-if="canBeDismissed">
+      <BmsIconButton @click.stop="emits('dismiss')">
         <slot name="closeIcon"><X /></slot>
       </BmsIconButton>
     </span>

package/src/components/form/RawAutocomplete.vue

@@ -166,11 +166,13 @@ const onClick = () => {
   }
 };
 
-const onInput = () => {
-  openDatalist();
+const onInput = ($event: InputEvent) => {
   if (inputText.value === '') {
     clearInput();
+  } else {
+    emits('input', $event);
   }
+  openDatalist();
 };
 
 const setFocus = () => {

package/src/showroom/server.js

@@ -9,7 +9,7 @@ app.use(cors());
 const port = 3000;
 
 app.get('/pokemon-types', (req, res) => {
-  res.send([
+  let types = [
     { label: 'Grass', value: 'Grass' },
     { label: 'Poison', value: 'Poison' },
     { label: 'Fire', value: 'Fire' },
@@ -27,7 +27,15 @@ app.get('/pokemon-types', (req, res) => {
     { label: 'Ice', value: 'Ice' },
     { label: 'Ghost', value: 'Ghost' },
     { label: 'Dragon', value: 'Dragon' },
-  ]);
+  ];
+
+  if (req.query.search) {
+    types = types.filter((type) =>
+      type.label.toLowerCase().includes(req.query.search.toLowerCase()),
+    );
+  }
+
+  res.send(types);
 });
 
 app.get('/pokemons', (req, res) => {