@websolutespa/bom-llm 0.0.53 → 0.0.55

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @websolutespa/bom-llm
 
+## 0.0.55
+
+### Patch Changes
+
+- Added: disclaimerShort, Disclaimer, Scroller image-mask
+
+## 0.0.54
+
+### Patch Changes
+
+- Added: ScrollProposition, imperative flag
+
 ## 0.0.53
 
 ### Patch Changes

package/README.md

@@ -74,6 +74,11 @@ document.addEventListener('DOMContentLoaded', () => {
 Using imperatively.
 
 ```js
+const options = {
+  appKey: 'MY_APP_KEY',
+  apiKey: 'MY_API_KEY',
+  imperative: true, // hide trigger button
+};
 const llm = bomLlm(options);
 // using open command imperatively
 setTimeout(() => {

package/dist/index.d.ts

@@ -49,6 +49,7 @@ type LlmContents = {
     disableSpeechRecognition?: boolean;
     disableSpeechSynthesis?: boolean;
     disclaimer?: string;
+    disclaimerShort?: string;
     disclaimerFooter?: boolean;
     enableUpload?: boolean;
     extendedWelcomeText?: string;
@@ -90,6 +91,7 @@ type LlmViewOptions = {
     preview?: boolean;
     opened?: boolean;
     dismissable?: boolean;
+    imperative?: boolean;
     skipCustomIntro?: boolean;
     embedded?: boolean;
 };

package/dist/umd/index.css

@@ -1184,6 +1184,7 @@ llm-embed {
   overflow-x: hidden;
   overflow-y: auto;
   max-width: 100%;
+  mask-image: linear-gradient(to bottom, black calc(100% - 240px), transparent calc(100% - 60px));
   /*
   &.lenis.lenis-stopped {
     overflow-x: hidden;
@@ -1966,6 +1967,68 @@ llm-embed {
   color: var(--llm-color-foreground);
   opacity: 0.8;
 }
+.llm .llm__prompt-disclaimer button {
+  margin: 0;
+  padding: 0;
+  border: none;
+  text-decoration: none;
+  background: none;
+  appearance: none;
+  font-family: inherit;
+  font-style: inherit;
+  font-variant-ligatures: inherit;
+  font-variant-caps: inherit;
+  font-variant-numeric: inherit;
+  font-variant-east-asian: inherit;
+  font-weight: inherit;
+  font-stretch: inherit;
+  text-rendering: inherit;
+  letter-spacing: inherit;
+  word-spacing: inherit;
+  line-height: inherit;
+  text-transform: none;
+  text-indent: inherit;
+  text-shadow: none;
+  text-align: inherit;
+  pointer-events: auto;
+  cursor: pointer;
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  text-decoration: underline;
+}
+.llm .llm__prompt-disclaimer button:focus, .llm .llm__prompt-disclaimer button:focus-visible {
+  outline-color: var(--llm-color-outline);
+}
+.llm .llm__prompt-disclaimer button:hover {
+  outline-color: color-mix(in srgb, var(--llm-color-outline) 10%, transparent 90%);
+}
+.llm .llm__prompt-disclaimer button:active {
+  outline-color: var(--llm-color-accent-foreground);
+}
+.llm .llm__prompt-disclaimer__long {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translateX(-50%) translateY(-50%);
+  font-size: 14px;
+  line-height: 1.4;
+  padding: var(--llm-size-2, 1rem) var(--llm-size-3, 1.5rem);
+  width: calc(100vw - var(--rem, 1rem) * 2);
+  max-width: 600px;
+  border-radius: 12px;
+  background: var(--llm-popup-background);
+  color: var(--llm-popup-foreground);
+  border: var(--llm-popup-border, none);
+  box-shadow: var(--llm-trigger-box-shadow);
+  transition: 0.4s;
+  pointer-events: auto;
+}
+.llm .llm__prompt-disclaimer__long a {
+  text-decoration: underline;
+}
+.llm .llm__prompt-disclaimer__long a:link, .llm .llm__prompt-disclaimer__long a:active, .llm .llm__prompt-disclaimer__long a:visited, .llm .llm__prompt-disclaimer__long a:hover {
+  color: var(--llm-pill-foreground);
+}
 @media (min-width: 1024px) {
   .llm .llm__prompt-disclaimer {
     font-size: 11px;
@@ -4281,6 +4344,30 @@ llm-embed {
   left: -1px;
 }
 
+.llm .llm__scroll-proposition {
+  position: absolute;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  top: -50px;
+  left: 50%;
+  width: var(--llm-scroll-proposition-size);
+  height: var(--llm-scroll-proposition-size);
+  border-radius: var(--llm-scroll-proposition-border-radius);
+  font-size: var(--llm-scroll-proposition-border-radius);
+  z-index: 1000;
+  transform: translateX(-50%);
+  background: var(--llm-scroll-proposition-background);
+  color: var(--llm-scroll-proposition-foreground);
+  box-shadow: var(--llm-scroll-proposition-box-shadow);
+  cursor: pointer;
+}
+.llm .llm__scroll-proposition svg {
+  width: var(--llm-scroll-proposition-border-radius);
+  height: var(--llm-scroll-proposition-border-radius);
+  transform: rotate(90deg);
+}
+
 /**
  * Swiper 8.4.7
  * Most modern mobile touch slider and framework with hardware accelerated transitions