@limetech/lime-elements 38.12.0 → 38.12.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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,19 @@
1
+ ## [38.12.2](https://github.com/Lundalogik/lime-elements/compare/v38.12.1...v38.12.2) (2025-05-12)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+
7
+ * **input-field:** ensure that the helper line doesn't render outside of the component ([16b31fe](https://github.com/Lundalogik/lime-elements/commit/16b31fe4b89ac30f7e8626e6d7783e4410deebbd))
8
+
9
+ ## [38.12.1](https://github.com/Lundalogik/lime-elements/compare/v38.12.0...v38.12.1) (2025-05-08)
10
+
11
+
12
+ ### Bug Fixes
13
+
14
+
15
+ * **ai-avatar:** ui improvement ([54b69a4](https://github.com/Lundalogik/lime-elements/commit/54b69a453da48cdc56b3c363ee412bad384b5e07))
16
+
1
17
  ## [38.12.0](https://github.com/Lundalogik/lime-elements/compare/v38.11.1...v38.12.0) (2025-05-06)
2
18
 
3
19
 
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  const index = require('./index-174a078a.js');
6
6
  const translations = require('./translations-1d376e48.js');
7
7
 
8
- const aiAvatarCss = ":host(limel-ai-avatar){display:flex;justify-content:center;align-self:center;position:relative;isolation:isolate;aspect-ratio:1;max-width:10rem;max-height:8rem;min-width:1.75rem;min-height:1.75rem;border-radius:0.5rem}*{box-sizing:border-box}:host(limel-ai-avatar[is-thinking]:not([is-thinking=false])){--ai-avatar-animation-play-state:running;--ai-avatar-orbitals-opacity:1;--ai-avatar-orbitals-animation-play-state:running}.core,.orbitals{mix-blend-mode:overlay;isolation:isolate;position:absolute;z-index:10;inset:0;margin:auto;display:flex;align-items:center;justify-content:center;aspect-ratio:1;width:clamp(0.5rem, 20%, 3.5rem);border-radius:50%}.core{animation:breathe 3s ease infinite;animation-play-state:var(--ai-avatar-animation-play-state, paused);background-color:rgb(var(--color-glaucous-lighter));box-shadow:var(--shadow-depth-8)}.orbitals{animation:rotate 5s linear infinite;animation-play-state:var(--ai-avatar-animation-play-state, paused);transition:opacity 0.2s ease;opacity:var(--ai-avatar-orbitals-opacity, 0)}.orbitals:after,.orbitals:before{animation-play-state:var(--ai-avatar-orbitals-animation-play-state, paused);content:\"\";display:block;position:absolute;inset:0;margin:auto;width:clamp(0.125rem, 50%, 0.75rem);aspect-ratio:1;border-radius:50%;background-color:rgb(var(--color-glaucous-lighter))}.orbitals:before{animation:orbit 1s linear infinite;opacity:0.6;transform-origin:-220% 0;margin-right:-70%}.orbitals:after{animation:orbit 2s linear infinite;opacity:0.8;scale:0.7;transform-origin:0% -250%;margin-bottom:-70%}@keyframes orbit{0%{transform:rotateZ(0deg) translate3d(0, 0, 0)}100%{transform:rotateZ(360deg) translate3d(0, 0, 0)}}@keyframes breathe{1%,100%{transform:scale(1)}50%{transform:scale(0.7)}}@keyframes rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}svg{position:absolute;margin:auto;mix-blend-mode:screen;animation-iteration-count:infinite;animation-play-state:var(--ai-avatar-animation-play-state, paused)}.red{rotate:20deg;color:rgb(var(--color-red-default));animation-name:rotate, scale-circle-one;animation-duration:5s}.green{rotate:36deg;color:rgb(var(--color-green-default));animation-name:rotate, scale-circle-two;animation-duration:5.5s}.blue{rotate:100deg;color:rgb(var(--color-blue-default));animation-name:rotate, scale-circle-three;animation-duration:4.5s}.orange{rotate:165deg;color:rgb(var(--color-orange-default));animation-name:rotate, scale-circle-four;animation-duration:6.5s}@keyframes scale-circle-one{0%,100%{transform:scaleX(1) scaleY(0.8)}25%,75%{transform:scaleX(0.8) scaleY(0.9)}50%{transform:scaleX(1) scaleY(0.7)}}@keyframes scale-circle-two{0%,100%{transform:scaleX(0.8) scaleY(1)}25%,75%{transform:scaleX(0.9) scaleY(0.75)}50%{transform:scaleX(0.72) scaleY(1)}}@keyframes scale-circle-three{0%,100%{transform:scaleX(0.9) scaleY(0.8)}50%{transform:scaleX(0.75) scaleY(0.9)}}@keyframes scale-circle-four{0%,100%{transform:scaleX(0.8) scaleY(0.95)}25%,75%{transform:scaleX(0.95) scaleY(0.75)}50%{transform:scaleX(0.75) scaleY(0.95)}}";
8
+ const aiAvatarCss = ":host(limel-ai-avatar){display:flex;justify-content:center;align-self:center;position:relative;aspect-ratio:1;max-width:10rem;max-height:8rem;min-width:1.75rem;min-height:1.75rem;border-radius:0.5rem}*{box-sizing:border-box}:host(limel-ai-avatar[is-thinking]:not([is-thinking=false])){--ai-avatar-animation-play-state:running;--ai-avatar-orbitals-opacity:1;--ai-avatar-orbitals-animation-play-state:running}.core,.orbitals{mix-blend-mode:overlay;position:absolute;z-index:10;inset:0;margin:auto;display:flex;align-items:center;justify-content:center;aspect-ratio:1;width:clamp(0.375rem, 20%, 3.5rem);border-radius:50%}.core{animation:breathe 3s ease infinite;animation-play-state:var(--ai-avatar-animation-play-state, paused);background-color:rgb(var(--color-glaucous-lighter));box-shadow:var(--shadow-depth-8)}.orbitals{animation:rotate 5s linear infinite;animation-play-state:var(--ai-avatar-animation-play-state, paused);transition:opacity 0.2s ease;opacity:var(--ai-avatar-orbitals-opacity, 0)}.orbitals:after,.orbitals:before{animation-play-state:var(--ai-avatar-orbitals-animation-play-state, paused);content:\"\";display:block;position:absolute;inset:0;margin:auto;width:clamp(0.125rem, 50%, 0.75rem);aspect-ratio:1;border-radius:50%;background-color:rgb(var(--color-glaucous-lighter))}.orbitals:before{animation:orbit 1s linear infinite;opacity:0.6;transform-origin:-220% 0;margin-right:-70%}.orbitals:after{animation:orbit 2s linear infinite;opacity:0.8;scale:0.7;transform-origin:0% -250%;margin-bottom:-70%}@keyframes orbit{0%{transform:rotateZ(0deg) translate3d(0, 0, 0)}100%{transform:rotateZ(360deg) translate3d(0, 0, 0)}}@keyframes breathe{1%,100%{transform:scale(1)}50%{transform:scale(0.7)}}@keyframes rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}svg{position:absolute;margin:auto;mix-blend-mode:screen;animation-iteration-count:infinite;animation-play-state:var(--ai-avatar-animation-play-state, paused)}.red{rotate:20deg;color:rgb(var(--color-red-default));animation-name:rotate, scale-circle-one;animation-duration:5s}.green{rotate:36deg;color:rgb(var(--color-green-default));animation-name:rotate, scale-circle-two;animation-duration:5.5s}.blue{rotate:100deg;color:rgb(var(--color-blue-default));animation-name:rotate, scale-circle-three;animation-duration:4.5s}.orange{rotate:165deg;color:rgb(var(--color-orange-default));animation-name:rotate, scale-circle-four;animation-duration:6.5s}@keyframes scale-circle-one{0%,100%{transform:scaleX(1) scaleY(0.8)}25%,75%{transform:scaleX(0.8) scaleY(0.9)}50%{transform:scaleX(1) scaleY(0.7)}}@keyframes scale-circle-two{0%,100%{transform:scaleX(0.8) scaleY(1)}25%,75%{transform:scaleX(0.9) scaleY(0.75)}50%{transform:scaleX(0.72) scaleY(1)}}@keyframes scale-circle-three{0%,100%{transform:scaleX(0.9) scaleY(0.8)}50%{transform:scaleX(0.75) scaleY(0.9)}}@keyframes scale-circle-four{0%,100%{transform:scaleX(0.8) scaleY(0.95)}25%,75%{transform:scaleX(0.95) scaleY(0.75)}50%{transform:scaleX(0.75) scaleY(0.95)}}";
9
9
 
10
10
  const AiAvatar = class {
11
11
  constructor(hostRef) {
@@ -1 +1 @@
1
- {"file":"limel-ai-avatar.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,WAAW,GAAG,q9FAAq9F;;MCwB59F,QAAQ;;;IAwDT,mBAAc,GAAG,CAAC,GAAW;MACjC,OAAOA,sBAAS,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;KAC5C,CAAC;sBApDkB,KAAK;oBAMI,QAAQ,CAAC,eAAe,CAAC,IAAiB;;EAEhE,MAAM;IACT,QACIC,QAACC,UAAI,IAAC,IAAI,EAAC,KAAK,gBAAa,IAAI,CAAC,gBAAgB,EAAE,IAC/C,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,EACxB,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,EAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EACzB,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,EAC5BD,iBAAK,KAAK,EAAC,MAAM,GAAG,EACpBA,iBAAK,KAAK,EAAC,UAAU,GAAG,CACrB,EACT;GACL;EAEO,gBAAgB;IACpB,IAAI,YAAY,GAAG,EAAE,CAAC;IACtB,IAAI,IAAI,CAAC,UAAU,EAAE;MACjB,YAAY,GAAG,KAAK,IAAI,CAAC,cAAc,CAAC,oBAAoB,CAAC,GAAG,CAAC;KACpE;IAED,OAAO,GAAG,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,GAAG,YAAY,EAAE,CAAC;GACrE;EAEO,YAAY,CAAC,SAAiB;IAClC,QACIA,iBACI,KAAK,EAAE,SAAS,EAChB,OAAO,EAAC,aAAa,EACrB,KAAK,EAAC,4BAA4B,EAClC,IAAI,EAAC,cAAc,IAEnBA,oBACI,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,CAAC,EAAC,IAAI,EACN,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,kBACR,GAAG,GAClB,CACA,EACR;GACL;;;;;;","names":["translate","h","Host"],"sources":["./src/components/ai-avatar/ai-avatar.scss?tag=limel-ai-avatar&encapsulation=shadow","./src/components/ai-avatar/ai-avatar.tsx"],"sourcesContent":["/**\n* @prop --ai-avatar-animation-play-state: Set it to `running` to start the animation.\n*/\n:host(limel-ai-avatar) {\n display: flex;\n justify-content: center;\n align-self: center;\n position: relative;\n isolation: isolate;\n\n aspect-ratio: 1;\n max-width: 10rem;\n max-height: 8rem;\n min-width: 1.75rem;\n min-height: 1.75rem;\n\n border-radius: 0.5rem;\n}\n\n* {\n box-sizing: border-box;\n}\n\n:host(limel-ai-avatar[is-thinking]:not([is-thinking='false'])) {\n --ai-avatar-animation-play-state: running;\n --ai-avatar-orbitals-opacity: 1;\n --ai-avatar-orbitals-animation-play-state: running;\n}\n\n.core,\n.orbitals {\n mix-blend-mode: overlay;\n isolation: isolate;\n\n position: absolute;\n z-index: 10;\n inset: 0;\n margin: auto;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n aspect-ratio: 1;\n width: clamp(0.5rem, 20%, 3.5rem);\n\n border-radius: 50%;\n}\n\n.core {\n animation: breathe 3s ease infinite;\n animation-play-state: var(--ai-avatar-animation-play-state, paused);\n background-color: rgb(var(--color-glaucous-lighter));\n box-shadow: var(--shadow-depth-8);\n}\n\n.orbitals {\n animation: rotate 5s linear infinite;\n animation-play-state: var(--ai-avatar-animation-play-state, paused);\n\n transition: opacity 0.2s ease;\n opacity: var(--ai-avatar-orbitals-opacity, 0);\n\n &:after,\n &:before {\n animation-play-state: var(\n --ai-avatar-orbitals-animation-play-state,\n paused\n );\n content: '';\n display: block;\n position: absolute;\n inset: 0;\n margin: auto;\n\n width: clamp(0.125rem, 50%, 0.75rem);\n aspect-ratio: 1;\n border-radius: 50%;\n background-color: rgb(var(--color-glaucous-lighter));\n }\n &:before {\n animation: orbit 1s linear infinite;\n opacity: 0.6;\n transform-origin: -220% 0;\n margin-right: -70%;\n }\n &:after {\n animation: orbit 2s linear infinite;\n opacity: 0.8;\n scale: 0.7;\n transform-origin: 0% -250%;\n margin-bottom: -70%;\n }\n}\n\n@keyframes orbit {\n 0% {\n transform: rotateZ(0deg) translate3d(0, 0, 0);\n }\n 100% {\n transform: rotateZ(360deg) translate3d(0, 0, 0);\n }\n}\n\n@keyframes breathe {\n 1%,\n 100% {\n transform: scale(1);\n }\n 50% {\n transform: scale(0.7);\n }\n}\n\n@keyframes rotate {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\nsvg {\n position: absolute;\n margin: auto;\n mix-blend-mode: screen;\n\n animation-iteration-count: infinite;\n animation-play-state: var(--ai-avatar-animation-play-state, paused);\n}\n\n.red {\n rotate: 20deg;\n color: rgb(var(--color-red-default));\n animation-name: rotate, scale-circle-one;\n animation-duration: 5s;\n}\n\n.green {\n rotate: 36deg;\n color: rgb(var(--color-green-default));\n animation-name: rotate, scale-circle-two;\n animation-duration: 5.5s;\n}\n\n.blue {\n rotate: 100deg;\n color: rgb(var(--color-blue-default));\n animation-name: rotate, scale-circle-three;\n animation-duration: 4.5s;\n}\n\n.orange {\n rotate: 165deg;\n color: rgb(var(--color-orange-default));\n animation-name: rotate, scale-circle-four;\n animation-duration: 6.5s;\n}\n\n@keyframes scale-circle-one {\n 0%,\n 100% {\n transform: scaleX(1) scaleY(0.8);\n }\n 25%,\n 75% {\n transform: scaleX(0.8) scaleY(0.9);\n }\n 50% {\n transform: scaleX(1) scaleY(0.7);\n }\n}\n\n@keyframes scale-circle-two {\n 0%,\n 100% {\n transform: scaleX(0.8) scaleY(1);\n }\n 25%,\n 75% {\n transform: scaleX(0.9) scaleY(0.75);\n }\n 50% {\n transform: scaleX(0.72) scaleY(1);\n }\n}\n\n@keyframes scale-circle-three {\n 0%,\n 100% {\n transform: scaleX(0.9) scaleY(0.8);\n }\n 50% {\n transform: scaleX(0.75) scaleY(0.9);\n }\n}\n\n@keyframes scale-circle-four {\n 0%,\n 100% {\n transform: scaleX(0.8) scaleY(0.95);\n }\n 25%,\n 75% {\n transform: scaleX(0.95) scaleY(0.75);\n }\n 50% {\n transform: scaleX(0.75) scaleY(0.95);\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { Languages } from './../date-picker/date.types';\nimport translate from './../../global/translations';\n\n/**\n * This component displays an avatar, representing Lime AI assistants.\n *\n * :::warning\n * This is a private component used internally in the Lime's various applications,\n * which is the reason for having it in Lime Elements —to ease the distribution\n * of the component across all our apps.\n *\n * 3rd party developers are not allowed use this component directly.\n * :::\n *\n * @private\n * @exampleComponent limel-example-ai-avatar-basic\n * @exampleComponent limel-example-ai-avatar-colors\n */\n@Component({\n tag: 'limel-ai-avatar',\n shadow: true,\n styleUrl: 'ai-avatar.scss',\n})\nexport class AiAvatar {\n /**\n * Set to `true` to trigger animations that indicate that the AI is\n * \"thinking\" or processing something.\n */\n @Prop({ reflect: true })\n public isThinking = false;\n\n /**\n * Defines the language for translations.\n */\n @Prop({ reflect: true })\n public language: Languages = document.documentElement.lang as Languages;\n\n public render() {\n return (\n <Host role=\"img\" aria-label={this.getHostAriaLabel()}>\n {this.renderCircle('red')}\n {this.renderCircle('green')}\n {this.renderCircle('blue')}\n {this.renderCircle('orange')}\n <div class=\"core\" />\n <div class=\"orbitals\" />\n </Host>\n );\n }\n\n private getHostAriaLabel(): string {\n let thinkingText = '';\n if (this.isThinking) {\n thinkingText = ` (${this.getTranslation('ai-avatar.thinking')})`;\n }\n\n return `${this.getTranslation('ai-avatar.label')}${thinkingText}`;\n }\n\n private renderCircle(className: string) {\n return (\n <svg\n class={className}\n viewBox=\"0 0 100 100\"\n xmlns=\"http://www.w3.org/2000/svg\"\n role=\"presentation\"\n >\n <circle\n cx=\"50\"\n cy=\"50\"\n r=\"40\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"6\"\n />\n </svg>\n );\n }\n\n private getTranslation = (key: string) => {\n return translate.get(key, this.language);\n };\n}\n"],"version":3}
1
+ {"file":"limel-ai-avatar.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,WAAW,GAAG,m7FAAm7F;;MCwB17F,QAAQ;;;IAwDT,mBAAc,GAAG,CAAC,GAAW;MACjC,OAAOA,sBAAS,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;KAC5C,CAAC;sBApDkB,KAAK;oBAMI,QAAQ,CAAC,eAAe,CAAC,IAAiB;;EAEhE,MAAM;IACT,QACIC,QAACC,UAAI,IAAC,IAAI,EAAC,KAAK,gBAAa,IAAI,CAAC,gBAAgB,EAAE,IAC/C,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,EACxB,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,EAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,EACzB,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,EAC5BD,iBAAK,KAAK,EAAC,MAAM,GAAG,EACpBA,iBAAK,KAAK,EAAC,UAAU,GAAG,CACrB,EACT;GACL;EAEO,gBAAgB;IACpB,IAAI,YAAY,GAAG,EAAE,CAAC;IACtB,IAAI,IAAI,CAAC,UAAU,EAAE;MACjB,YAAY,GAAG,KAAK,IAAI,CAAC,cAAc,CAAC,oBAAoB,CAAC,GAAG,CAAC;KACpE;IAED,OAAO,GAAG,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,GAAG,YAAY,EAAE,CAAC;GACrE;EAEO,YAAY,CAAC,SAAiB;IAClC,QACIA,iBACI,KAAK,EAAE,SAAS,EAChB,OAAO,EAAC,aAAa,EACrB,KAAK,EAAC,4BAA4B,EAClC,IAAI,EAAC,cAAc,IAEnBA,oBACI,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,IAAI,EACP,CAAC,EAAC,IAAI,EACN,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,kBACR,GAAG,GAClB,CACA,EACR;GACL;;;;;;","names":["translate","h","Host"],"sources":["./src/components/ai-avatar/ai-avatar.scss?tag=limel-ai-avatar&encapsulation=shadow","./src/components/ai-avatar/ai-avatar.tsx"],"sourcesContent":["/**\n* @prop --ai-avatar-animation-play-state: Set it to `running` to start the animation.\n*/\n:host(limel-ai-avatar) {\n display: flex;\n justify-content: center;\n align-self: center;\n position: relative;\n\n aspect-ratio: 1;\n max-width: 10rem;\n max-height: 8rem;\n min-width: 1.75rem;\n min-height: 1.75rem;\n\n border-radius: 0.5rem;\n}\n\n* {\n box-sizing: border-box;\n}\n\n:host(limel-ai-avatar[is-thinking]:not([is-thinking='false'])) {\n --ai-avatar-animation-play-state: running;\n --ai-avatar-orbitals-opacity: 1;\n --ai-avatar-orbitals-animation-play-state: running;\n}\n\n.core,\n.orbitals {\n mix-blend-mode: overlay;\n\n position: absolute;\n z-index: 10;\n inset: 0;\n margin: auto;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n aspect-ratio: 1;\n width: clamp(0.375rem, 20%, 3.5rem);\n\n border-radius: 50%;\n}\n\n.core {\n animation: breathe 3s ease infinite;\n animation-play-state: var(--ai-avatar-animation-play-state, paused);\n background-color: rgb(var(--color-glaucous-lighter));\n box-shadow: var(--shadow-depth-8);\n}\n\n.orbitals {\n animation: rotate 5s linear infinite;\n animation-play-state: var(--ai-avatar-animation-play-state, paused);\n\n transition: opacity 0.2s ease;\n opacity: var(--ai-avatar-orbitals-opacity, 0);\n\n &:after,\n &:before {\n animation-play-state: var(\n --ai-avatar-orbitals-animation-play-state,\n paused\n );\n content: '';\n display: block;\n position: absolute;\n inset: 0;\n margin: auto;\n\n width: clamp(0.125rem, 50%, 0.75rem);\n aspect-ratio: 1;\n border-radius: 50%;\n background-color: rgb(var(--color-glaucous-lighter));\n }\n &:before {\n animation: orbit 1s linear infinite;\n opacity: 0.6;\n transform-origin: -220% 0;\n margin-right: -70%;\n }\n &:after {\n animation: orbit 2s linear infinite;\n opacity: 0.8;\n scale: 0.7;\n transform-origin: 0% -250%;\n margin-bottom: -70%;\n }\n}\n\n@keyframes orbit {\n 0% {\n transform: rotateZ(0deg) translate3d(0, 0, 0);\n }\n 100% {\n transform: rotateZ(360deg) translate3d(0, 0, 0);\n }\n}\n\n@keyframes breathe {\n 1%,\n 100% {\n transform: scale(1);\n }\n 50% {\n transform: scale(0.7);\n }\n}\n\n@keyframes rotate {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\nsvg {\n position: absolute;\n margin: auto;\n mix-blend-mode: screen;\n\n animation-iteration-count: infinite;\n animation-play-state: var(--ai-avatar-animation-play-state, paused);\n}\n\n.red {\n rotate: 20deg;\n color: rgb(var(--color-red-default));\n animation-name: rotate, scale-circle-one;\n animation-duration: 5s;\n}\n\n.green {\n rotate: 36deg;\n color: rgb(var(--color-green-default));\n animation-name: rotate, scale-circle-two;\n animation-duration: 5.5s;\n}\n\n.blue {\n rotate: 100deg;\n color: rgb(var(--color-blue-default));\n animation-name: rotate, scale-circle-three;\n animation-duration: 4.5s;\n}\n\n.orange {\n rotate: 165deg;\n color: rgb(var(--color-orange-default));\n animation-name: rotate, scale-circle-four;\n animation-duration: 6.5s;\n}\n\n@keyframes scale-circle-one {\n 0%,\n 100% {\n transform: scaleX(1) scaleY(0.8);\n }\n 25%,\n 75% {\n transform: scaleX(0.8) scaleY(0.9);\n }\n 50% {\n transform: scaleX(1) scaleY(0.7);\n }\n}\n\n@keyframes scale-circle-two {\n 0%,\n 100% {\n transform: scaleX(0.8) scaleY(1);\n }\n 25%,\n 75% {\n transform: scaleX(0.9) scaleY(0.75);\n }\n 50% {\n transform: scaleX(0.72) scaleY(1);\n }\n}\n\n@keyframes scale-circle-three {\n 0%,\n 100% {\n transform: scaleX(0.9) scaleY(0.8);\n }\n 50% {\n transform: scaleX(0.75) scaleY(0.9);\n }\n}\n\n@keyframes scale-circle-four {\n 0%,\n 100% {\n transform: scaleX(0.8) scaleY(0.95);\n }\n 25%,\n 75% {\n transform: scaleX(0.95) scaleY(0.75);\n }\n 50% {\n transform: scaleX(0.75) scaleY(0.95);\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { Languages } from './../date-picker/date.types';\nimport translate from './../../global/translations';\n\n/**\n * This component displays an avatar, representing Lime AI assistants.\n *\n * :::warning\n * This is a private component used internally in the Lime's various applications,\n * which is the reason for having it in Lime Elements —to ease the distribution\n * of the component across all our apps.\n *\n * 3rd party developers are not allowed use this component directly.\n * :::\n *\n * @private\n * @exampleComponent limel-example-ai-avatar-basic\n * @exampleComponent limel-example-ai-avatar-colors\n */\n@Component({\n tag: 'limel-ai-avatar',\n shadow: true,\n styleUrl: 'ai-avatar.scss',\n})\nexport class AiAvatar {\n /**\n * Set to `true` to trigger animations that indicate that the AI is\n * \"thinking\" or processing something.\n */\n @Prop({ reflect: true })\n public isThinking = false;\n\n /**\n * Defines the language for translations.\n */\n @Prop({ reflect: true })\n public language: Languages = document.documentElement.lang as Languages;\n\n public render() {\n return (\n <Host role=\"img\" aria-label={this.getHostAriaLabel()}>\n {this.renderCircle('red')}\n {this.renderCircle('green')}\n {this.renderCircle('blue')}\n {this.renderCircle('orange')}\n <div class=\"core\" />\n <div class=\"orbitals\" />\n </Host>\n );\n }\n\n private getHostAriaLabel(): string {\n let thinkingText = '';\n if (this.isThinking) {\n thinkingText = ` (${this.getTranslation('ai-avatar.thinking')})`;\n }\n\n return `${this.getTranslation('ai-avatar.label')}${thinkingText}`;\n }\n\n private renderCircle(className: string) {\n return (\n <svg\n class={className}\n viewBox=\"0 0 100 100\"\n xmlns=\"http://www.w3.org/2000/svg\"\n role=\"presentation\"\n >\n <circle\n cx=\"50\"\n cy=\"50\"\n r=\"40\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"6\"\n />\n </svg>\n );\n }\n\n private getTranslation = (key: string) => {\n return translate.get(key, this.language);\n };\n}\n"],"version":3}
@@ -4864,7 +4864,7 @@ const MenuSurface = class {
4864
4864
  };
4865
4865
  MenuSurface.style = menuSurfaceCss;
4866
4866
 
4867
- const notchedOutlineCss = "@charset \"UTF-8\";:host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--mdc-theme-error:var(\n --lime-error-background-color,\n rgb(var(--color-red-dark))\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n rgb(var(--contrast-1500))\n )}limel-notched-outline{--limel-notched-outline-border-color:rgba(var(--contrast-700), 0.65);--limel-notched-outline-background-color:rgba(var(--contrast-200), 0.5);display:block;width:100%;height:100%}limel-notched-outline *,limel-notched-outline *:before,limel-notched-outline *:after{box-sizing:border-box}.limel-notched-outline{position:relative;width:100%;height:100%}.limel-notched-outline [slot=content]{background-color:var(--limel-notched-outline-background-color);border-radius:var(--limel-notched-outline-border-radius, 0.25rem)}.limel-notched-outline--outlines{pointer-events:none;position:absolute;inset:0;z-index:var(--limel-notched-outline-z-index, 0);display:flex}.limel-notched-outline--leading-outline,.limel-notched-outline--notch,.limel-notched-outline--trailing-outline{transition:border-color 0.2s ease;border-width:1px;border-style:solid;border-color:var(--limel-notched-outline-border-color)}.limel-notched-outline--leading-outline{flex-shrink:0;width:0.75rem;border-right-width:0;border-top-left-radius:var(--limel-notched-outline-border-radius, 0.25rem);border-bottom-left-radius:var(--limel-notched-outline-border-radius, 0.25rem)}.limel-notched-outline--notch{flex-shrink:0;position:relative;z-index:2;border-top-color:var(--limel-notched-outline-notch-border-top-color, var(--limel-notched-outline-border-color));border-right-width:0;border-left-width:0;max-width:calc(100% - 1.5rem)}.limel-notched-outline--notch label{all:unset;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;position:relative;transition:color 0.2s ease, font-size 0.2s ease, transform 0.12s cubic-bezier(0.4, 0, 0.2, 1);transform:translate3d(var(--limel-notched-outline-label-transform-x, 0), var(--limel-notched-outline-label-transform-y, 0.62rem), 0);display:block;padding:0 0.25rem;color:var(--limel-notched-outline-label-color, rgba(var(--contrast-1200), 1));font-size:var(--limel-notched-outline-label-font-size, 0.875rem);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);line-height:normal}.limel-notched-outline--notch label:after{position:absolute;right:0;padding:0 0.25rem}.limel-notched-outline--trailing-outline{flex-grow:1;border-left-width:0;border-top-right-radius:var(--limel-notched-outline-border-radius, 0.25rem);border-bottom-right-radius:var(--limel-notched-outline-border-radius, 0.25rem)}.limel-notched-outline--empty-readonly-value{position:absolute;top:0.62rem;left:1rem}.limel-notched-outline--empty-readonly-value .lime-looks-like-input-value{line-height:1.75rem;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;color:rgba(var(--contrast-1400), 1);font-size:0.875rem;font-weight:400;letter-spacing:0.009375em}.mdc-text-field--disabled .limel-notched-outline--empty-readonly-value .lime-looks-like-input-value{cursor:not-allowed;opacity:0.4}limel-notched-outline:not([disabled]:not([disabled=false])):hover{--limel-notched-outline-border-color:rgba(var(--contrast-700), 1);--limel-notched-outline-background-color:rgba(var(--contrast-200), 1)}limel-notched-outline:not([disabled]:not([disabled=false])):has([slot=content]:focus-visible),limel-notched-outline:not([disabled]:not([disabled=false])):has([slot=content]:focus-within){--limel-notched-outline-border-color:var(--mdc-theme-primary);--limel-notched-outline-background-color:rgba(var(--contrast-100), 0.8)}limel-notched-outline[disabled]:not([disabled=false]){--limel-notched-outline-label-color:rgba(var(--contrast-1200), 0.5)}limel-notched-outline[required]:not([required=false]) .limel-notched-outline--notch label{padding-right:0.75rem}limel-notched-outline[required]:not([required=false]) .limel-notched-outline--notch label:after{content:\"*\";scale:1.3}limel-notched-outline[invalid]:not([invalid=false]):not([disabled]:not([disabled=false])){--limel-notched-outline-border-color:var(--lime-error-text-color)}limel-notched-outline[invalid]:not([invalid=false]):not([disabled]:not([disabled=false])):hover{--limel-notched-outline-border-color:var(\n --lime-error-text-color\n )}limel-notched-outline[invalid]:not([invalid=false]) .limel-notched-outline--notch label:after{color:var(--lime-error-text-color)}limel-notched-outline[readonly]:not([readonly=false]){--limel-notched-outline-border-color:transparent !important;--limel-notched-outline-background-color:transparent !important}limel-notched-outline[readonly]:not([readonly=false]) .limel-notched-outline--notch label{transition-duration:0s}limel-notched-outline[has-leading-icon]:not([has-leading-icon=false]):not([has-floating-label]):not([has-value]){--limel-notched-outline-label-transform-x:1.25rem}limel-notched-outline[has-leading-icon] .limel-notched-outline--empty-readonly-value{left:2.25rem}limel-notched-outline:not([disabled]:not([disabled=false])):hover label,limel-notched-outline:not([disabled]:not([disabled=false])):focus label,limel-notched-outline:not([disabled]:not([disabled=false])):focus-within label{will-change:color, transform, font-size}limel-notched-outline:not([disabled]:not([disabled=false])):has([slot=content]:focus-visible),limel-notched-outline:not([disabled]:not([disabled=false])):has([slot=content]:focus-within){--limel-notched-outline-label-font-size:0.65rem;--limel-notched-outline-label-transform-x:0;--limel-notched-outline-label-transform-y:calc(-50% - 0.09375rem);--limel-notched-outline-notch-border-top-color:transparent}limel-notched-outline[has-floating-label],limel-notched-outline[has-value]:not([has-value=false]),limel-notched-outline[readonly]:not([has-value]:not([has-value=true])){--limel-notched-outline-label-font-size:0.65rem;--limel-notched-outline-label-transform-x:0;--limel-notched-outline-label-transform-y:calc(-50% - 0.09375rem);--limel-notched-outline-notch-border-top-color:transparent}";
4867
+ const notchedOutlineCss = "@charset \"UTF-8\";:host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--mdc-theme-error:var(\n --lime-error-background-color,\n rgb(var(--color-red-dark))\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n rgb(var(--contrast-1500))\n )}*,*:before,*:after{box-sizing:border-box}limel-notched-outline{--limel-notched-outline-border-color:rgba(var(--contrast-700), 0.65);--limel-notched-outline-background-color:rgba(var(--contrast-200), 0.5);display:block;width:100%;height:fit-content}.limel-notched-outline{position:relative;width:100%}.limel-notched-outline [slot=content]{background-color:var(--limel-notched-outline-background-color);border-radius:var(--limel-notched-outline-border-radius, 0.25rem)}.limel-notched-outline--outlines{pointer-events:none;position:absolute;inset:0;z-index:var(--limel-notched-outline-z-index, 0);display:flex}.limel-notched-outline--leading-outline,.limel-notched-outline--notch,.limel-notched-outline--trailing-outline{transition:border-color 0.2s ease;border-width:1px;border-style:solid;border-color:var(--limel-notched-outline-border-color)}.limel-notched-outline--leading-outline{flex-shrink:0;width:0.75rem;border-right-width:0;border-top-left-radius:var(--limel-notched-outline-border-radius, 0.25rem);border-bottom-left-radius:var(--limel-notched-outline-border-radius, 0.25rem)}.limel-notched-outline--notch{flex-shrink:0;position:relative;z-index:2;border-top-color:var(--limel-notched-outline-notch-border-top-color, var(--limel-notched-outline-border-color));border-right-width:0;border-left-width:0;max-width:calc(100% - 1.5rem)}.limel-notched-outline--notch label{all:unset;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;position:relative;transition:color 0.2s ease, font-size 0.2s ease, transform 0.12s cubic-bezier(0.4, 0, 0.2, 1);transform:translate3d(var(--limel-notched-outline-label-transform-x, 0), var(--limel-notched-outline-label-transform-y, 0.62rem), 0);display:block;padding:0 0.25rem;color:var(--limel-notched-outline-label-color, rgba(var(--contrast-1200), 1));font-size:var(--limel-notched-outline-label-font-size, 0.875rem);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);line-height:normal}.limel-notched-outline--notch label:after{position:absolute;right:0;padding:0 0.25rem}.limel-notched-outline--trailing-outline{flex-grow:1;border-left-width:0;border-top-right-radius:var(--limel-notched-outline-border-radius, 0.25rem);border-bottom-right-radius:var(--limel-notched-outline-border-radius, 0.25rem)}.limel-notched-outline--empty-readonly-value{position:absolute;top:0.62rem;left:1rem}.limel-notched-outline--empty-readonly-value .lime-looks-like-input-value{line-height:1.75rem;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;color:rgba(var(--contrast-1400), 1);font-size:0.875rem;font-weight:400;letter-spacing:0.009375em}.mdc-text-field--disabled .limel-notched-outline--empty-readonly-value .lime-looks-like-input-value{cursor:not-allowed;opacity:0.4}limel-notched-outline:not([disabled]:not([disabled=false])):hover{--limel-notched-outline-border-color:rgba(var(--contrast-700), 1);--limel-notched-outline-background-color:rgba(var(--contrast-200), 1)}limel-notched-outline:not([disabled]:not([disabled=false])):has([slot=content]:focus-visible),limel-notched-outline:not([disabled]:not([disabled=false])):has([slot=content]:focus-within){--limel-notched-outline-border-color:var(--mdc-theme-primary);--limel-notched-outline-background-color:rgba(var(--contrast-100), 0.8)}limel-notched-outline[disabled]:not([disabled=false]){--limel-notched-outline-label-color:rgba(var(--contrast-1200), 0.5)}limel-notched-outline[required]:not([required=false]) .limel-notched-outline--notch label{padding-right:0.75rem}limel-notched-outline[required]:not([required=false]) .limel-notched-outline--notch label:after{content:\"*\";scale:1.3}limel-notched-outline[invalid]:not([invalid=false]):not([disabled]:not([disabled=false])){--limel-notched-outline-border-color:var(--lime-error-text-color)}limel-notched-outline[invalid]:not([invalid=false]):not([disabled]:not([disabled=false])):hover{--limel-notched-outline-border-color:var(\n --lime-error-text-color\n )}limel-notched-outline[invalid]:not([invalid=false]) .limel-notched-outline--notch label:after{color:var(--lime-error-text-color)}limel-notched-outline[readonly]:not([readonly=false]){--limel-notched-outline-border-color:transparent !important;--limel-notched-outline-background-color:transparent !important}limel-notched-outline[readonly]:not([readonly=false]) .limel-notched-outline--notch label{transition-duration:0s}limel-notched-outline[has-leading-icon]:not([has-leading-icon=false]):not([has-floating-label]):not([has-value]){--limel-notched-outline-label-transform-x:1.25rem}limel-notched-outline[has-leading-icon] .limel-notched-outline--empty-readonly-value{left:2.25rem}limel-notched-outline:not([disabled]:not([disabled=false])):hover label,limel-notched-outline:not([disabled]:not([disabled=false])):focus label,limel-notched-outline:not([disabled]:not([disabled=false])):focus-within label{will-change:color, transform, font-size}limel-notched-outline:not([disabled]:not([disabled=false])):has([slot=content]:focus-visible),limel-notched-outline:not([disabled]:not([disabled=false])):has([slot=content]:focus-within){--limel-notched-outline-label-font-size:0.65rem;--limel-notched-outline-label-transform-x:0;--limel-notched-outline-label-transform-y:calc(-50% - 0.09375rem);--limel-notched-outline-notch-border-top-color:transparent}limel-notched-outline[has-floating-label],limel-notched-outline[has-value]:not([has-value=false]),limel-notched-outline[readonly]:not([has-value]:not([has-value=true])){--limel-notched-outline-label-font-size:0.65rem;--limel-notched-outline-label-transform-x:0;--limel-notched-outline-label-transform-y:calc(-50% - 0.09375rem);--limel-notched-outline-notch-border-top-color:transparent}";
4868
4868
 
4869
4869
  const NotchedOutline = class {
4870
4870
  constructor(hostRef) {