@websolutespa/bom-mixer-llm 1.8.21 → 1.8.22

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @websolutespa/bom-mixer-llm
 
+## 1.8.22
+
+### Patch Changes
+
+- Modified: suggestions a11y
+
 ## 1.8.21
 
 ### Patch Changes

package/dist/cjs/index.css

@@ -1330,30 +1330,43 @@ llm-embed {
   max-width: calc(100% + var(--margin) * 2);
   margin: 0 var(--negative-margin);
   padding: 4px var(--margin);
-  overflow-x: auto;
-  overflow-y: hidden;
-  /* Hide scrollbar for Chrome, Safari and Opera */
-  /* Hide scrollbar for IE, Edge and Firefox */
-}
-.llm .llm__prompt-suggestions .llm__suggestions::-webkit-scrollbar {
-  display: none;
+  flex-wrap: wrap;
+  /* if device has a touch screen */
+  /* if device has no touch screen */
+  /*
+  @media (any-pointer: fine) {
+  }
+  */
 }
-.llm .llm__prompt-suggestions .llm__suggestions {
-  -ms-overflow-style: none;
-  /* IE and Edge */
-  scrollbar-width: none;
-  /* Firefox */
+@media (any-pointer: coarse) {
+  .llm .llm__prompt-suggestions .llm__suggestions {
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    overflow-y: hidden;
+    /* Hide scrollbar for Chrome, Safari and Opera */
+    /* Hide scrollbar for IE, Edge and Firefox */
+  }
+  .llm .llm__prompt-suggestions .llm__suggestions::-webkit-scrollbar {
+    display: none;
+  }
+  .llm .llm__prompt-suggestions .llm__suggestions {
+    -ms-overflow-style: none;
+    /* IE and Edge */
+    scrollbar-width: none;
+    /* Firefox */
+  }
+  .llm .llm__prompt-suggestions .llm__suggestions .llm__pill {
+    white-space: nowrap;
+  }
 }
 .llm .llm__prompt-suggestions .llm__suggestions .llm__pill {
-  white-space: nowrap;
+  box-shadow: var(--llm-shadow-xs);
 }
 @media (min-width: 1024px) {
   .llm .llm__prompt-suggestions .llm__suggestions {
     max-width: calc(100% + 8px);
     margin: 0 -4px;
     padding: 4px;
-    flex-wrap: wrap;
-    overflow: hidden;
   }
 }
 .llm .llm__prompt-suggestions .swiper {

package/dist/esm/index.css

@@ -1330,30 +1330,43 @@ llm-embed {
   max-width: calc(100% + var(--margin) * 2);
   margin: 0 var(--negative-margin);
   padding: 4px var(--margin);
-  overflow-x: auto;
-  overflow-y: hidden;
-  /* Hide scrollbar for Chrome, Safari and Opera */
-  /* Hide scrollbar for IE, Edge and Firefox */
-}
-.llm .llm__prompt-suggestions .llm__suggestions::-webkit-scrollbar {
-  display: none;
+  flex-wrap: wrap;
+  /* if device has a touch screen */
+  /* if device has no touch screen */
+  /*
+  @media (any-pointer: fine) {
+  }
+  */
 }
-.llm .llm__prompt-suggestions .llm__suggestions {
-  -ms-overflow-style: none;
-  /* IE and Edge */
-  scrollbar-width: none;
-  /* Firefox */
+@media (any-pointer: coarse) {
+  .llm .llm__prompt-suggestions .llm__suggestions {
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    overflow-y: hidden;
+    /* Hide scrollbar for Chrome, Safari and Opera */
+    /* Hide scrollbar for IE, Edge and Firefox */
+  }
+  .llm .llm__prompt-suggestions .llm__suggestions::-webkit-scrollbar {
+    display: none;
+  }
+  .llm .llm__prompt-suggestions .llm__suggestions {
+    -ms-overflow-style: none;
+    /* IE and Edge */
+    scrollbar-width: none;
+    /* Firefox */
+  }
+  .llm .llm__prompt-suggestions .llm__suggestions .llm__pill {
+    white-space: nowrap;
+  }
 }
 .llm .llm__prompt-suggestions .llm__suggestions .llm__pill {
-  white-space: nowrap;
+  box-shadow: var(--llm-shadow-xs);
 }
 @media (min-width: 1024px) {
   .llm .llm__prompt-suggestions .llm__suggestions {
     max-width: calc(100% + 8px);
     margin: 0 -4px;
     padding: 4px;
-    flex-wrap: wrap;
-    overflow: hidden;
   }
 }
 .llm .llm__prompt-suggestions .swiper {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@websolutespa/bom-mixer-llm",
-  "version": "1.8.21",
+  "version": "1.8.22",
   "description": "Mixer LLM module of the BOM Repository",
   "keywords": [
     "bom",

package/src/llm/components/Prompt/_style.scss

@@ -200,20 +200,34 @@
       max-width: calc(100% + var(--margin) * 2);
       margin: 0 var(--negative-margin);
       padding: 4px var(--margin);
-      overflow-x: auto;
-      overflow-y: hidden;
-      @include hideScrollbar();
+      flex-wrap: wrap;
+
+      /* if device has a touch screen */
+      @media (any-pointer: coarse) {
+        flex-wrap: nowrap;
+        overflow-x: auto;
+        overflow-y: hidden;
+        @include hideScrollbar();
+
+        .llm__pill {
+          white-space: nowrap;
+        }
+      }
+
+      /* if device has no touch screen */
+      /*
+      @media (any-pointer: fine) {
+      }
+      */
 
       .llm__pill {
-        white-space: nowrap;
+        box-shadow: shadow(xs);
       }
 
       @include bp(md) {
         max-width: calc(100% + 8px);
         margin: 0 -4px;
         padding: 4px;
-        flex-wrap: wrap;
-        overflow: hidden;
       }
     }