@luxonis/component-lib 1.0.6 → 1.0.8

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/dist/index.css CHANGED
@@ -1 +1 @@
1
- *,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.pointer-events-none{pointer-events:none}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-x-0{left:0;right:0}.-bottom-12{bottom:-3rem}.-left-12{left:-3rem}.-right-12{right:-3rem}.-right-4{right:-1rem}.-top-12{top:-3rem}.-top-2{top:-.5rem}.-top-7{top:-1.75rem}.bottom-0{bottom:0}.bottom-10{bottom:2.5rem}.bottom-4{bottom:1rem}.left-1\/2{left:50%}.left-12{left:3rem}.right-0{right:0}.right-12{right:3rem}.right-2{right:.5rem}.right-4{right:1rem}.top-1\/2{top:50%}.top-4{top:1rem}.z-10{z-index:10}.z-50{z-index:50}.z-\[1\]{z-index:1}.z-\[2\]{z-index:2}.-mx-1{margin-left:-.25rem;margin-right:-.25rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem;margin-bottom:.25rem}.-ml-4{margin-left:-1rem}.-mt-4{margin-top:-1rem}.mt-4{margin-top:1rem}.block{display:block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.hidden{display:none}.\!size-10{width:2.5rem!important;height:2.5rem!important}.\!size-12{width:3rem!important;height:3rem!important}.size-0{width:0;height:0}.size-14{width:3.5rem;height:3.5rem}.size-16{width:4rem;height:4rem}.size-3{width:.75rem;height:.75rem}.size-3\.5{width:.875rem;height:.875rem}.size-4{width:1rem;height:1rem}.size-5{width:1.25rem;height:1.25rem}.size-6{width:1.5rem;height:1.5rem}.size-\[32px\]{width:32px;height:32px}.size-full{width:100%;height:100%}.\!h-\[46px\]{height:46px!important}.h-10{height:2.5rem}.h-12{height:3rem}.h-2{height:.5rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-9{height:2.25rem}.h-\[38px\]{height:38px}.h-\[46px\]{height:46px}.h-\[810px\]{height:810px}.h-\[var\(--radix-select-trigger-height\)\]{height:var(--radix-select-trigger-height)}.h-full{height:100%}.h-px{height:1px}.h-screen{height:100vh}.max-h-96{max-height:24rem}.min-h-0{min-height:0}.min-h-10{min-height:2.5rem}.min-h-16{min-height:4rem}.min-h-\[60px\]{min-height:60px}.min-h-\[96px\]{min-height:96px}.w-10{width:2.5rem}.w-11{width:2.75rem}.w-5{width:1.25rem}.w-96{width:24rem}.w-\[32px\]{width:32px}.w-\[350px\]{width:350px}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.w-screen{width:100vw}.min-w-0{min-width:0}.min-w-10{min-width:2.5rem}.min-w-\[100px\]{min-width:100px}.min-w-\[8rem\]{min-width:8rem}.min-w-\[var\(--radix-select-trigger-width\)\]{min-width:var(--radix-select-trigger-width)}.max-w-100vw{max-width:100vw}.max-w-105{max-width:424px}.max-w-96{max-width:24rem}.max-w-\[75vw\]{max-width:75vw}.max-w-full{max-width:100%}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.caption-bottom{caption-side:bottom}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.-translate-y-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y:-50%}.translate-x-1\/2{--tw-translate-x:50%}.rotate-90,.translate-x-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-90{--tw-rotate:90deg}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes expand{0%{transform:scale(0);opacity:.5}to{transform:scale(2);opacity:.1;display:none}}.animate-circle{animation:expand .3s ease-out forwards}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize-none{resize:none}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-2{gap:.5rem}.gap-2\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.text-ellipsis{text-overflow:ellipsis}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.whitespace-break-spaces{white-space:break-spaces}.text-nowrap{text-wrap:nowrap}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.\!rounded-none{border-radius:0!important}.rounded{border-radius:.25rem}.rounded-\[4px\]{border-radius:4px}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-sm{border-radius:.125rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-solid{border-style:solid}.border-none{border-style:none}.border-muted{--tw-border-opacity:1;border-color:rgb(153 153 153/var(--tw-border-opacity,1))}.border-mutedborder{--tw-border-opacity:1;border-color:rgb(120 132 165/var(--tw-border-opacity,1))}.border-primary{--tw-border-opacity:1;border-color:rgb(87 36 232/var(--tw-border-opacity,1))}.border-primaryBorder{border-color:#5724e83d}.border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68/var(--tw-border-opacity,1))}.border-secondaryBorder{--tw-border-opacity:1;border-color:rgb(220 211 247/var(--tw-border-opacity,1))}.border-transparent{border-color:transparent}.border-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity,1))}.border-white\/30{border-color:hsla(0,0%,100%,.3)}.border-opacity-15{--tw-border-opacity:0.15}.border-opacity-25{--tw-border-opacity:0.25}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity,1))}.bg-muted{--tw-bg-opacity:1;background-color:rgb(153 153 153/var(--tw-bg-opacity,1))}.bg-muted\/50{background-color:hsla(0,0%,60%,.5)}.bg-primary{--tw-bg-opacity:1;background-color:rgb(87 36 232/var(--tw-bg-opacity,1))}.bg-secondary{--tw-bg-opacity:1;background-color:rgb(242 239 249/var(--tw-bg-opacity,1))}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-white\/10{background-color:hsla(0,0%,100%,.1)}.bg-cover{background-size:cover}.bg-center{background-position:50%}.bg-no-repeat{background-repeat:no-repeat}.fill-black{fill:#000}.fill-current{fill:currentColor}.stroke-black{stroke:#000}.stroke-white{stroke:#fff}.object-cover{-o-object-fit:cover;object-fit:cover}.\!p-2{padding:.5rem!important}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-3\.5{padding:.875rem}.p-4{padding:1rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-3\.5{padding-left:.875rem;padding-right:.875rem}.px-4{padding-left:1rem;padding-right:1rem}.px-7{padding-left:1.75rem;padding-right:1.75rem}.py-0{padding-top:0;padding-bottom:0}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.py-4{padding-top:1rem;padding-bottom:1rem}.pb-1{padding-bottom:.25rem}.pb-1\.5{padding-bottom:.375rem}.pb-4{padding-bottom:1rem}.pl-2{padding-left:.5rem}.pl-6{padding-left:1.5rem}.pr-12{padding-right:3rem}.pr-8{padding-right:2rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-1\.5{padding-top:.375rem}.pt-2{padding-top:.5rem}.\!text-left{text-align:left!important}.text-left{text-align:left}.\!text-center{text-align:center!important}.text-center{text-align:center}.text-right{text-align:right}.align-middle{vertical-align:middle}.text-2xl{font-size:1.5rem;line-height:2rem}.text-base{font-size:1rem;line-height:1.5rem}.text-captions-mobile{font-size:.875rem;letter-spacing:-.02em}.text-h1-mobile{font-size:2.75rem;letter-spacing:-.02em}.text-h2-mobile{font-size:2.5rem;letter-spacing:-.02em}.text-h3-mobile{font-size:2rem;letter-spacing:-.02em}.text-h4{font-size:2.5rem;letter-spacing:-.02em}.text-h4-mobile{font-size:1.75rem;letter-spacing:-.02em}.text-h5-mobile{font-size:1.5rem;letter-spacing:-.02em}.text-large-mobile,.text-medium-mobile{font-size:1rem;letter-spacing:-.02em}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.text-xxs{font-size:.625rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.italic{font-style:italic}.leading-110{line-height:110%}.leading-164{line-height:164%}.leading-8{line-height:2rem}.leading-none{line-height:1}.leading-normal{line-height:1.5}.text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.text-current{color:currentColor}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.text-muted{--tw-text-opacity:1;color:rgb(153 153 153/var(--tw-text-opacity,1))}.text-primary{--tw-text-opacity:1;color:rgb(87 36 232/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-semimuted{--tw-text-opacity:1;color:rgb(102 102 102/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.text-opacity-40{--tw-text-opacity:0.4}.underline{text-decoration-line:underline}.opacity-50{opacity:.5}.opacity-90{opacity:.9}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-lg,.shadow-md{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-sm{--tw-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-none{transition-property:none}.transition-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-150,.transition-transform{transition-duration:.15s}.duration-300{transition-duration:.3s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.chat-rich-text{line-height:1.75;.likefield{line-height:.5}a:hover{opacity:.8}a{color:#16bed7;font-weight:500}blockquote{border-left:4px solid #ddd;margin:1em 0;padding:.5em 1em;color:#555;background:#fafafa}pre code{background:#f4f4f4;border:1px solid #ddd;border-left:3px solid #f36d33;color:#666;page-break-inside:avoid;font-family:monospace;font-size:15px;line-height:1.6;margin-bottom:1.6em;max-width:100%;overflow:auto;padding:1em 1.5em;display:block;word-wrap:break-word;white-space:pre-wrap!important}p code{background-color:#f4f4f4;color:#f36d33;border:1px solid #ddd;border-radius:.3em;padding:4px 5px 6px;white-space:nowrap}ol,ul{padding-left:1rem}li{list-style-type:disc;margin:.5em 0}.boticon,.usericon{margin-right:1rem;border-radius:.1rem}h1,h2,h3{font-size:inherit}code{white-space:pre-wrap!important}}.placeholder\:text-muted::-moz-placeholder{--tw-text-opacity:1;color:rgb(153 153 153/var(--tw-text-opacity,1))}.placeholder\:text-muted::placeholder{--tw-text-opacity:1;color:rgb(153 153 153/var(--tw-text-opacity,1))}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:bg-muted\/50:hover{background-color:hsla(0,0%,60%,.5)}.hover\:bg-primary\/80:hover{background-color:rgba(87,36,232,.8)}.hover\:bg-secondary:hover{--tw-bg-opacity:1;background-color:rgb(242 239 249/var(--tw-bg-opacity,1))}.hover\:bg-secondary\/80:hover{background-color:rgba(242,239,249,.8)}.hover\:bg-gradient-to-l:hover{background-image:linear-gradient(to left,var(--tw-gradient-stops))}.hover\:from-white\/8:hover{--tw-gradient-from:hsla(0,0%,100%,.08) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.hover\:to-white\/8:hover{--tw-gradient-to:hsla(0,0%,100%,.08) var(--tw-gradient-to-position)}.hover\:stroke-primary:hover{stroke:#5724e8}.hover\:text-primary:hover{--tw-text-opacity:1;color:rgb(87 36 232/var(--tw-text-opacity,1))}.hover\:text-opacity-60:hover{--tw-text-opacity:0.6}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-1:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\:ring-1:focus,.focus\:ring-2:focus{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px}.focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\:ring-1:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-2:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-\[\#D0D0D0\]:disabled{--tw-bg-opacity:1;background-color:rgb(208 208 208/var(--tw-bg-opacity,1))}.disabled\:opacity-50:disabled{opacity:.5}.peer:disabled~.peer-disabled\:cursor-not-allowed{cursor:not-allowed}.peer:disabled~.peer-disabled\:opacity-70{opacity:.7}.aria-selected\:text-black[aria-selected=true]{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.aria-selected\:opacity-100[aria-selected=true]{opacity:1}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:0.25rem}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom],.data-\[side\=left\]\:-translate-x-1[data-side=left]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x:-0.25rem}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x:0.25rem}.data-\[side\=right\]\:translate-x-1[data-side=right],.data-\[side\=top\]\:-translate-y-1[data-side=top]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:-0.25rem}.data-\[state\=checked\]\:translate-x-5[data-state=checked]{--tw-translate-x:1.25rem}.data-\[state\=checked\]\:translate-x-5[data-state=checked],.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked]{--tw-translate-x:0px}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:accordion-up .2s ease-out}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:accordion-down .2s ease-out}.data-\[state\=checked\]\:border-primary[data-state=checked]{--tw-border-opacity:1;border-color:rgb(87 36 232/var(--tw-border-opacity,1))}.data-\[state\=checked\]\:bg-primary[data-state=checked]{--tw-bg-opacity:1;background-color:rgb(87 36 232/var(--tw-bg-opacity,1))}.data-\[state\=selected\]\:bg-muted[data-state=selected]{--tw-bg-opacity:1;background-color:rgb(153 153 153/var(--tw-bg-opacity,1))}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}@media (min-width:40rem){.sm\:bottom-6{bottom:1.5rem}.sm\:left-auto{left:auto}.sm\:right-6{right:1.5rem}.sm\:flex{display:flex}.sm\:h-\[650px\]{height:650px}.sm\:h-\[914px\]{height:914px}.sm\:max-h-\[90vh\]{max-height:90vh}.sm\:w-\[450px\]{width:450px}.sm\:max-w-95vw{max-width:95vw}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:gap-2{gap:.5rem}.sm\:gap-6{gap:1.5rem}.sm\:p-5{padding:1.25rem}.sm\:\!text-center{text-align:center!important}.sm\:text-2xl{font-size:1.5rem;line-height:2rem}.sm\:text-captions{font-size:.875rem;letter-spacing:-.02em}.sm\:text-h1{font-size:5rem}.sm\:text-h1,.sm\:text-h2{letter-spacing:-.02em}.sm\:text-h2{font-size:4.5rem}.sm\:text-h3{font-size:3rem}.sm\:text-h3,.sm\:text-h4{letter-spacing:-.02em}.sm\:text-h4{font-size:2.5rem}.sm\:text-h5{font-size:2rem;letter-spacing:-.02em}.sm\:text-large{font-size:1.125rem;letter-spacing:-.02em}.sm\:text-medium{font-size:1rem;letter-spacing:-.02em}.sm\:text-sm{font-size:.875rem;line-height:1.25rem}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width:48rem){.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:items-end{align-items:flex-end}.md\:justify-start{justify-content:flex-start}.md\:gap-6{gap:1.5rem}.md\:text-sm{font-size:.875rem;line-height:1.25rem}.md\:text-xs{font-size:.75rem;line-height:1rem}}@media (min-width:64rem){.lg\:max-w-\[350px\]{max-width:350px}.lg\:max-w-\[525px\]{max-width:525px}.lg\:items-start{align-items:flex-start}.lg\:\!text-left{text-align:left!important}}@media (min-width:80rem){.xl\:w-auto{width:auto}.xl\:text-h1{font-size:5rem;letter-spacing:-.02em}}@media (prefers-color-scheme:dark){.dark\:data-\[state\=checked\]\:bg-primary[data-state=checked]{--tw-bg-opacity:1;background-color:rgb(87 36 232/var(--tw-bg-opacity,1))}}.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]){padding-right:0}.\[\&\>div\>div\>svg\]\:hover\:border-transparent:hover>div>div>svg{border-color:transparent}.\[\&\>div\>div\]\:hover\:bg-primary:hover>div>div{--tw-bg-opacity:1;background-color:rgb(87 36 232/var(--tw-bg-opacity,1))}.\[\&\>div\>div\]\:hover\:text-white:hover>div>div{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}@media (min-width:40rem){.sm\:\[\&\>div\>div\]\:hover\:opacity-45:hover>div>div{opacity:.45}}.\[\&\>span\]\:line-clamp-1>span{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.\[\&\>tr\]\:last\:border-b-0:last-child>tr{border-bottom-width:0}.\[\&\[data-state\=open\]\>svg\]\:rotate-45[data-state=open]>svg{--tw-rotate:45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.\[\&\[data-state\=open\]\]\:border-b[data-state=open]{border-bottom-width:1px}.\[\&_tr\:last-child\]\:border-0 tr:last-child{border-width:0}.\[\&_tr\]\:border-b tr{border-bottom-width:1px}
1
+ *,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.pointer-events-none{pointer-events:none}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-x-0{left:0;right:0}.-bottom-12{bottom:-3rem}.-left-12{left:-3rem}.-right-12{right:-3rem}.-right-4{right:-1rem}.-top-12{top:-3rem}.-top-2{top:-.5rem}.-top-7{top:-1.75rem}.bottom-0{bottom:0}.bottom-10{bottom:2.5rem}.bottom-4{bottom:1rem}.left-1\/2{left:50%}.left-12{left:3rem}.right-0{right:0}.right-12{right:3rem}.right-2{right:.5rem}.right-4{right:1rem}.top-1\/2{top:50%}.top-4{top:1rem}.z-10{z-index:10}.z-50{z-index:50}.z-\[1\]{z-index:1}.z-\[2\]{z-index:2}.-mx-1{margin-left:-.25rem;margin-right:-.25rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem;margin-bottom:.25rem}.-ml-4{margin-left:-1rem}.-mt-4{margin-top:-1rem}.mt-4{margin-top:1rem}.block{display:block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.hidden{display:none}.\!size-10{width:2.5rem!important;height:2.5rem!important}.\!size-12{width:3rem!important;height:3rem!important}.size-0{width:0;height:0}.size-14{width:3.5rem;height:3.5rem}.size-16{width:4rem;height:4rem}.size-2{width:.5rem;height:.5rem}.size-2\.5{width:.625rem;height:.625rem}.size-3{width:.75rem;height:.75rem}.size-3\.5{width:.875rem;height:.875rem}.size-4{width:1rem;height:1rem}.size-5{width:1.25rem;height:1.25rem}.size-6{width:1.5rem;height:1.5rem}.size-\[32px\]{width:32px;height:32px}.size-full{width:100%;height:100%}.\!h-\[46px\]{height:46px!important}.h-10{height:2.5rem}.h-12{height:3rem}.h-2{height:.5rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-9{height:2.25rem}.h-\[38px\]{height:38px}.h-\[46px\]{height:46px}.h-\[810px\]{height:810px}.h-\[var\(--radix-select-trigger-height\)\]{height:var(--radix-select-trigger-height)}.h-fit{height:-moz-fit-content;height:fit-content}.h-full{height:100%}.h-px{height:1px}.h-screen{height:100vh}.max-h-96{max-height:24rem}.min-h-0{min-height:0}.min-h-10{min-height:2.5rem}.min-h-16{min-height:4rem}.min-h-\[60px\]{min-height:60px}.min-h-\[96px\]{min-height:96px}.w-10{width:2.5rem}.w-11{width:2.75rem}.w-5{width:1.25rem}.w-96{width:24rem}.w-\[32px\]{width:32px}.w-\[350px\]{width:350px}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.w-screen{width:100vw}.min-w-0{min-width:0}.min-w-10{min-width:2.5rem}.min-w-\[100px\]{min-width:100px}.min-w-\[8rem\]{min-width:8rem}.min-w-\[var\(--radix-select-trigger-width\)\]{min-width:var(--radix-select-trigger-width)}.max-w-100vw{max-width:100vw}.max-w-105{max-width:424px}.max-w-96{max-width:24rem}.max-w-\[75vw\]{max-width:75vw}.max-w-full{max-width:100%}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.caption-bottom{caption-side:bottom}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.-translate-y-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y:-50%}.translate-x-1\/2{--tw-translate-x:50%}.translate-x-1\/2,.translate-y-\[calc\(-50\%_-_2px\)\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-\[calc\(-50\%_-_2px\)\]{--tw-translate-y:calc(-50% - 2px)}.rotate-45{--tw-rotate:45deg}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-90{--tw-rotate:90deg}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes expand{0%{transform:scale(0);opacity:.5}to{transform:scale(2);opacity:.1;display:none}}.animate-circle{animation:expand .3s ease-out forwards}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize-none{resize:none}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-2{gap:.5rem}.gap-2\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-scroll{overflow-y:scroll}.text-ellipsis{text-overflow:ellipsis}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.whitespace-break-spaces{white-space:break-spaces}.text-nowrap{text-wrap:nowrap}.text-balance{text-wrap:balance}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.\!rounded-none{border-radius:0!important}.rounded{border-radius:.25rem}.rounded-\[2px\]{border-radius:2px}.rounded-\[4px\]{border-radius:4px}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-sm{border-radius:.125rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-solid{border-style:solid}.border-none{border-style:none}.border-muted{--tw-border-opacity:1;border-color:rgb(153 153 153/var(--tw-border-opacity,1))}.border-mutedborder{--tw-border-opacity:1;border-color:rgb(120 132 165/var(--tw-border-opacity,1))}.border-primary{--tw-border-opacity:1;border-color:rgb(87 36 232/var(--tw-border-opacity,1))}.border-primaryBorder{border-color:#5724e83d}.border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68/var(--tw-border-opacity,1))}.border-secondaryBorder{--tw-border-opacity:1;border-color:rgb(220 211 247/var(--tw-border-opacity,1))}.border-transparent{border-color:transparent}.border-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity,1))}.border-white\/30{border-color:hsla(0,0%,100%,.3)}.border-opacity-15{--tw-border-opacity:0.15}.border-opacity-25{--tw-border-opacity:0.25}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity,1))}.bg-muted{--tw-bg-opacity:1;background-color:rgb(153 153 153/var(--tw-bg-opacity,1))}.bg-muted\/50{background-color:hsla(0,0%,60%,.5)}.bg-primary{--tw-bg-opacity:1;background-color:rgb(87 36 232/var(--tw-bg-opacity,1))}.bg-secondary{--tw-bg-opacity:1;background-color:rgb(242 239 249/var(--tw-bg-opacity,1))}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-white\/10{background-color:hsla(0,0%,100%,.1)}.bg-cover{background-size:cover}.bg-center{background-position:50%}.bg-no-repeat{background-repeat:no-repeat}.fill-black{fill:#000}.fill-current{fill:currentColor}.fill-white{fill:#fff}.stroke-black{stroke:#000}.stroke-white{stroke:#fff}.object-cover{-o-object-fit:cover;object-fit:cover}.\!p-2{padding:.5rem!important}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-3\.5{padding:.875rem}.p-4{padding:1rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-3\.5{padding-left:.875rem;padding-right:.875rem}.px-4{padding-left:1rem;padding-right:1rem}.px-7{padding-left:1.75rem;padding-right:1.75rem}.py-0{padding-top:0;padding-bottom:0}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.py-4{padding-top:1rem;padding-bottom:1rem}.pb-1{padding-bottom:.25rem}.pb-1\.5{padding-bottom:.375rem}.pb-4{padding-bottom:1rem}.pl-2{padding-left:.5rem}.pl-6{padding-left:1.5rem}.pr-12{padding-right:3rem}.pr-8{padding-right:2rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-1\.5{padding-top:.375rem}.pt-2{padding-top:.5rem}.\!text-left{text-align:left!important}.text-left{text-align:left}.\!text-center{text-align:center!important}.text-center{text-align:center}.text-right{text-align:right}.align-middle{vertical-align:middle}.text-2xl{font-size:1.5rem;line-height:2rem}.text-base{font-size:1rem;line-height:1.5rem}.text-captions-mobile{font-size:.875rem;letter-spacing:-.02em}.text-h1-mobile{font-size:2.75rem;letter-spacing:-.02em}.text-h2-mobile{font-size:2.5rem;letter-spacing:-.02em}.text-h3-mobile{font-size:2rem;letter-spacing:-.02em}.text-h4{font-size:2.5rem;letter-spacing:-.02em}.text-h4-mobile{font-size:1.75rem;letter-spacing:-.02em}.text-h5-mobile{font-size:1.5rem;letter-spacing:-.02em}.text-large-mobile,.text-medium-mobile{font-size:1rem;letter-spacing:-.02em}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.text-xxs{font-size:.625rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.italic{font-style:italic}.leading-110{line-height:110%}.leading-164{line-height:164%}.leading-8{line-height:2rem}.leading-none{line-height:1}.leading-normal{line-height:1.5}.text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.text-current{color:currentColor}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.text-muted{--tw-text-opacity:1;color:rgb(153 153 153/var(--tw-text-opacity,1))}.text-primary{--tw-text-opacity:1;color:rgb(87 36 232/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-semimuted{--tw-text-opacity:1;color:rgb(102 102 102/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.text-opacity-40{--tw-text-opacity:0.4}.underline{text-decoration-line:underline}.opacity-50{opacity:.5}.opacity-90{opacity:.9}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-lg,.shadow-md{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-secondaryBorder{--tw-shadow-color:#dcd3f7;--tw-shadow:var(--tw-shadow-colored)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-sm{--tw-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-none{transition-property:none}.transition-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-150,.transition-transform{transition-duration:.15s}.duration-300{transition-duration:.3s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.chat-rich-text{line-height:1.75;.likefield{line-height:.5}a:hover{opacity:.8}a{color:#16bed7;font-weight:500}blockquote{border-left:4px solid #ddd;margin:1em 0;padding:.5em 1em;color:#555;background:#fafafa}pre code{background:#f4f4f4;border:1px solid #ddd;border-left:3px solid #f36d33;color:#666;page-break-inside:avoid;font-family:monospace;font-size:15px;line-height:1.6;margin-bottom:1.6em;max-width:100%;overflow:auto;padding:1em 1.5em;display:block;word-wrap:break-word;white-space:pre-wrap!important}p code{background-color:#f4f4f4;color:#f36d33;border:1px solid #ddd;border-radius:.3em;padding:4px 5px 6px;white-space:nowrap}ol,ul{padding-left:1rem}li{list-style-type:disc;margin:.5em 0}.boticon,.usericon{margin-right:1rem;border-radius:.1rem}h1,h2,h3{font-size:inherit}code{white-space:pre-wrap!important}}.placeholder\:text-muted::-moz-placeholder{--tw-text-opacity:1;color:rgb(153 153 153/var(--tw-text-opacity,1))}.placeholder\:text-muted::placeholder{--tw-text-opacity:1;color:rgb(153 153 153/var(--tw-text-opacity,1))}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:bg-muted\/50:hover{background-color:hsla(0,0%,60%,.5)}.hover\:bg-primary\/80:hover{background-color:rgba(87,36,232,.8)}.hover\:bg-secondary:hover{--tw-bg-opacity:1;background-color:rgb(242 239 249/var(--tw-bg-opacity,1))}.hover\:bg-secondary\/80:hover{background-color:rgba(242,239,249,.8)}.hover\:bg-gradient-to-l:hover{background-image:linear-gradient(to left,var(--tw-gradient-stops))}.hover\:from-white\/8:hover{--tw-gradient-from:hsla(0,0%,100%,.08) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.hover\:to-white\/8:hover{--tw-gradient-to:hsla(0,0%,100%,.08) var(--tw-gradient-to-position)}.hover\:stroke-primary:hover{stroke:#5724e8}.hover\:text-primary:hover{--tw-text-opacity:1;color:rgb(87 36 232/var(--tw-text-opacity,1))}.hover\:text-opacity-60:hover{--tw-text-opacity:0.6}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-1:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\:ring-1:focus,.focus\:ring-2:focus{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px}.focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\:ring-1:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-2:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-\[\#D0D0D0\]:disabled{--tw-bg-opacity:1;background-color:rgb(208 208 208/var(--tw-bg-opacity,1))}.disabled\:opacity-50:disabled{opacity:.5}.peer:disabled~.peer-disabled\:cursor-not-allowed{cursor:not-allowed}.peer:disabled~.peer-disabled\:opacity-70{opacity:.7}.aria-selected\:text-black[aria-selected=true]{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.aria-selected\:opacity-100[aria-selected=true]{opacity:1}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:0.25rem}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom],.data-\[side\=left\]\:-translate-x-1[data-side=left]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x:-0.25rem}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x:0.25rem}.data-\[side\=right\]\:translate-x-1[data-side=right],.data-\[side\=top\]\:-translate-y-1[data-side=top]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:-0.25rem}.data-\[state\=checked\]\:translate-x-5[data-state=checked]{--tw-translate-x:1.25rem}.data-\[state\=checked\]\:translate-x-5[data-state=checked],.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked]{--tw-translate-x:0px}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:accordion-up .2s ease-out}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:accordion-down .2s ease-out}.data-\[state\=checked\]\:border-primary[data-state=checked]{--tw-border-opacity:1;border-color:rgb(87 36 232/var(--tw-border-opacity,1))}.data-\[state\=checked\]\:bg-primary[data-state=checked]{--tw-bg-opacity:1;background-color:rgb(87 36 232/var(--tw-bg-opacity,1))}.data-\[state\=selected\]\:bg-muted[data-state=selected]{--tw-bg-opacity:1;background-color:rgb(153 153 153/var(--tw-bg-opacity,1))}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}@media (min-width:40rem){.sm\:bottom-6{bottom:1.5rem}.sm\:left-auto{left:auto}.sm\:right-6{right:1.5rem}.sm\:flex{display:flex}.sm\:h-\[650px\]{height:650px}.sm\:h-\[914px\]{height:914px}.sm\:max-h-\[90vh\]{max-height:90vh}.sm\:w-\[450px\]{width:450px}.sm\:max-w-95vw{max-width:95vw}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:gap-2{gap:.5rem}.sm\:gap-6{gap:1.5rem}.sm\:p-5{padding:1.25rem}.sm\:\!text-center{text-align:center!important}.sm\:text-2xl{font-size:1.5rem;line-height:2rem}.sm\:text-captions{font-size:.875rem;letter-spacing:-.02em}.sm\:text-h1{font-size:5rem}.sm\:text-h1,.sm\:text-h2{letter-spacing:-.02em}.sm\:text-h2{font-size:4.5rem}.sm\:text-h3{font-size:3rem}.sm\:text-h3,.sm\:text-h4{letter-spacing:-.02em}.sm\:text-h4{font-size:2.5rem}.sm\:text-h5{font-size:2rem;letter-spacing:-.02em}.sm\:text-large{font-size:1.125rem;letter-spacing:-.02em}.sm\:text-medium{font-size:1rem;letter-spacing:-.02em}.sm\:text-sm{font-size:.875rem;line-height:1.25rem}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width:48rem){.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:items-end{align-items:flex-end}.md\:justify-start{justify-content:flex-start}.md\:gap-6{gap:1.5rem}.md\:text-sm{font-size:.875rem;line-height:1.25rem}.md\:text-xs{font-size:.75rem;line-height:1rem}}@media (min-width:64rem){.lg\:max-w-\[350px\]{max-width:350px}.lg\:max-w-\[525px\]{max-width:525px}.lg\:items-start{align-items:flex-start}.lg\:\!text-left{text-align:left!important}}@media (min-width:80rem){.xl\:w-auto{width:auto}.xl\:text-h1{font-size:5rem;letter-spacing:-.02em}}@media (prefers-color-scheme:dark){.dark\:data-\[state\=checked\]\:bg-primary[data-state=checked]{--tw-bg-opacity:1;background-color:rgb(87 36 232/var(--tw-bg-opacity,1))}}.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]){padding-right:0}.\[\&\>div\>div\>svg\]\:hover\:border-transparent:hover>div>div>svg{border-color:transparent}.\[\&\>div\>div\]\:hover\:bg-primary:hover>div>div{--tw-bg-opacity:1;background-color:rgb(87 36 232/var(--tw-bg-opacity,1))}.\[\&\>div\>div\]\:hover\:text-white:hover>div>div{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}@media (min-width:40rem){.sm\:\[\&\>div\>div\]\:hover\:opacity-45:hover>div>div{opacity:.45}}.\[\&\>span\]\:line-clamp-1>span{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.\[\&\>tr\]\:last\:border-b-0:last-child>tr{border-bottom-width:0}.\[\&\[data-state\=open\]\>svg\]\:rotate-45[data-state=open]>svg{--tw-rotate:45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.\[\&\[data-state\=open\]\]\:border-b[data-state=open]{border-bottom-width:1px}.\[\&_tr\:last-child\]\:border-0 tr:last-child{border-width:0}.\[\&_tr\]\:border-b tr{border-bottom-width:1px}
package/dist/index.d.mts CHANGED
@@ -11,6 +11,7 @@ import * as SelectPrimitive from '@radix-ui/react-select';
11
11
  import * as SwitchPrimitives from '@radix-ui/react-switch';
12
12
  import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
13
13
  import * as SliderPrimitive from '@radix-ui/react-slider';
14
+ import * as TooltipPrimitive from '@radix-ui/react-tooltip';
14
15
 
15
16
  interface AccordionItemProps extends React$1.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item> {
16
17
  className?: string;
@@ -237,4 +238,9 @@ type ChatButtonProps = {
237
238
  };
238
239
  declare function ChatButton(props: ChatButtonProps): React.ReactElement;
239
240
 
240
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Badge, type BadgeProps, Button, Card, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChatButton, Checkbox, CodeBlock, Copyright, Description, type DescriptionType, DualRangeSlider, FrostedCard, Hero, HoverCard, HoverCardContent, HoverCardTrigger, Input, Label, SearchBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, type StyledDescriptionProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Text, Textarea, Video, badgeVariants, buttonVariants, parseNewLines };
241
+ declare function TooltipProvider({ delayDuration, ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Provider>): react_jsx_runtime.JSX.Element;
242
+ declare function Tooltip({ ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Root>): react_jsx_runtime.JSX.Element;
243
+ declare function TooltipTrigger({ ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
244
+ declare function TooltipContent({ className, sideOffset, children, ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Content>): react_jsx_runtime.JSX.Element;
245
+
246
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Badge, type BadgeProps, Button, Card, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChatButton, Checkbox, CodeBlock, Copyright, Description, type DescriptionType, DualRangeSlider, FrostedCard, Hero, HoverCard, HoverCardContent, HoverCardTrigger, Input, Label, SearchBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, type StyledDescriptionProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Text, Textarea, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Video, badgeVariants, buttonVariants, parseNewLines };
package/dist/index.d.ts CHANGED
@@ -11,6 +11,7 @@ import * as SelectPrimitive from '@radix-ui/react-select';
11
11
  import * as SwitchPrimitives from '@radix-ui/react-switch';
12
12
  import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
13
13
  import * as SliderPrimitive from '@radix-ui/react-slider';
14
+ import * as TooltipPrimitive from '@radix-ui/react-tooltip';
14
15
 
15
16
  interface AccordionItemProps extends React$1.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item> {
16
17
  className?: string;
@@ -237,4 +238,9 @@ type ChatButtonProps = {
237
238
  };
238
239
  declare function ChatButton(props: ChatButtonProps): React.ReactElement;
239
240
 
240
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Badge, type BadgeProps, Button, Card, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChatButton, Checkbox, CodeBlock, Copyright, Description, type DescriptionType, DualRangeSlider, FrostedCard, Hero, HoverCard, HoverCardContent, HoverCardTrigger, Input, Label, SearchBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, type StyledDescriptionProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Text, Textarea, Video, badgeVariants, buttonVariants, parseNewLines };
241
+ declare function TooltipProvider({ delayDuration, ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Provider>): react_jsx_runtime.JSX.Element;
242
+ declare function Tooltip({ ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Root>): react_jsx_runtime.JSX.Element;
243
+ declare function TooltipTrigger({ ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
244
+ declare function TooltipContent({ className, sideOffset, children, ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Content>): react_jsx_runtime.JSX.Element;
245
+
246
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Badge, type BadgeProps, Button, Card, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, ChatButton, Checkbox, CodeBlock, Copyright, Description, type DescriptionType, DualRangeSlider, FrostedCard, Hero, HoverCard, HoverCardContent, HoverCardTrigger, Input, Label, SearchBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, type StyledDescriptionProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Text, Textarea, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Video, badgeVariants, buttonVariants, parseNewLines };
package/dist/index.js CHANGED
@@ -77,6 +77,10 @@ __export(index_exports, {
77
77
  TableRow: () => TableRow,
78
78
  Text: () => Text,
79
79
  Textarea: () => Textarea,
80
+ Tooltip: () => Tooltip,
81
+ TooltipContent: () => TooltipContent,
82
+ TooltipProvider: () => TooltipProvider,
83
+ TooltipTrigger: () => TooltipTrigger,
80
84
  Video: () => Video,
81
85
  badgeVariants: () => badgeVariants,
82
86
  buttonVariants: () => buttonVariants,
@@ -1243,7 +1247,46 @@ DualRangeSlider.displayName = "DualRangeSlider";
1243
1247
  var import_react12 = require("react");
1244
1248
  var import_markdown_it = __toESM(require("markdown-it"));
1245
1249
  var import_react13 = require("@iconify/react");
1250
+
1251
+ // src/Tooltip.tsx
1252
+ var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"));
1253
+ var import_class_variance_authority20 = require("class-variance-authority");
1246
1254
  var import_jsx_runtime23 = require("react/jsx-runtime");
1255
+ function TooltipProvider({ delayDuration = 0, ...props }) {
1256
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipPrimitive.Provider, { "data-slot": "tooltip-provider", delayDuration, ...props });
1257
+ }
1258
+ function Tooltip({ ...props }) {
1259
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
1260
+ }
1261
+ function TooltipTrigger({ ...props }) {
1262
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
1263
+ }
1264
+ function TooltipContent({
1265
+ className,
1266
+ sideOffset = 0,
1267
+ children,
1268
+ ...props
1269
+ }) {
1270
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
1271
+ TooltipPrimitive.Content,
1272
+ {
1273
+ "data-slot": "tooltip-content",
1274
+ sideOffset,
1275
+ className: (0, import_class_variance_authority20.cx)(
1276
+ "bg-white text-black shadow-md shadow-secondaryBorder animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
1277
+ className
1278
+ ),
1279
+ ...props,
1280
+ children: [
1281
+ /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TooltipPrimitive.Arrow, { className: "size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-white fill-white" }),
1282
+ children
1283
+ ]
1284
+ }
1285
+ ) });
1286
+ }
1287
+
1288
+ // src/LuxonisChat.tsx
1289
+ var import_jsx_runtime24 = require("react/jsx-runtime");
1247
1290
  function ChatButton(props) {
1248
1291
  const { chatOpened, setChatOpened, messageFromSearch, setMessageFromSearch } = props;
1249
1292
  const [hold, setHold] = (0, import_react12.useState)(false);
@@ -1365,16 +1408,16 @@ function ChatButton(props) {
1365
1408
  void fetchSearchQuery();
1366
1409
  }
1367
1410
  }, [messageFromSearch, onSubmit, loading]);
1368
- return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1411
+ return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1369
1412
  "div",
1370
1413
  {
1371
1414
  className: `fixed z-50 ${chatOpened ? " bottom-0 right-0 sm:bottom-6 sm:left-auto sm:right-6" : " bottom-4 right-4 sm:bottom-6 sm:right-6"}`,
1372
- children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
1415
+ children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
1373
1416
  "div",
1374
1417
  {
1375
1418
  className: `relative flex max-w-100vw flex-col-reverse items-end gap-5 transition-all duration-300 sm:max-h-[90vh] sm:max-w-95vw ${chatOpened ? "h-screen min-h-[96px] w-screen min-w-[100px] sm:h-[650px] sm:w-[450px]" : "size-0 min-h-0 min-w-0"}`,
1376
1419
  children: [
1377
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1420
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1378
1421
  "button",
1379
1422
  {
1380
1423
  onClick: () => {
@@ -1387,8 +1430,8 @@ function ChatButton(props) {
1387
1430
  transform: `scale(${hold ? 0.9 : 1})`,
1388
1431
  transition: "transform 0.15s ease-in-out"
1389
1432
  },
1390
- className: `size-16 min-h-16 rounded-full bg-primary transition duration-150 ease-in-out hover:scale-110 hover:shadow-lg ${chatOpened && "hidden sm:flex"}`,
1391
- children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1433
+ className: `size-16 min-h-16 rounded-full bg-primary transition duration-150 ease-in-out hover:scale-110 hover:shadow-lg ${chatOpened && "hidden sm:flex"}`,
1434
+ children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1392
1435
  "div",
1393
1436
  {
1394
1437
  style: {
@@ -1396,39 +1439,59 @@ function ChatButton(props) {
1396
1439
  animationDuration: "150ms",
1397
1440
  animationTimingFunction: "ease-in"
1398
1441
  },
1399
- className: "flex w-full items-center justify-center",
1400
- children: chatOpened ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react13.Icon, { icon: "mdi:close", className: "size-[32px] text-white" }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("img", { src: "https://docs.luxonis.com/static/images/icons/chat-icon.svg", width: "32", height: "32", alt: "Chat" })
1442
+ className: "flex size-full items-center justify-center",
1443
+ children: chatOpened ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react13.Icon, { icon: "mdi:close", className: "size-[32px] text-white" }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("img", { src: "https://docs.luxonis.com/static/images/icons/chat-icon.svg", width: "32", height: "32", alt: "Chat" })
1401
1444
  },
1402
1445
  iconKey
1403
1446
  )
1404
1447
  }
1405
1448
  ),
1406
- chatOpened && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex size-full flex-col gap-3 overflow-hidden rounded-md bg-white p-3 shadow-lg sm:p-5", children: [
1407
- /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex h-8 flex-row items-center justify-between gap-2", children: [
1408
- /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("h2", { className: "relative text-2xl", children: [
1409
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("a", { target: "_blank", rel: "noopener noreferrer", href: "https://chat.luxonis.com", children: "Chat with Luxonis AI" }),
1410
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react13.Icon, { icon: "mingcute:ai-fill", className: "absolute -right-4 -top-2 size-5 text-primary" })
1449
+ chatOpened && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex size-full flex-col gap-3 overflow-x-hidden overflow-y-scroll rounded-md bg-white p-3 shadow-lg sm:p-5", children: [
1450
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex h-8 flex-row justify-between gap-2", children: [
1451
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("h2", { className: "relative text-2xl", children: [
1452
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("a", { target: "_blank", rel: "noopener noreferrer", href: "https://chat.luxonis.com", children: "Chat with Luxonis AI" }),
1453
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react13.Icon, { icon: "mingcute:ai-fill", className: "absolute -right-4 -top-2 size-5 text-primary" })
1411
1454
  ] }),
1412
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1413
- "button",
1414
- {
1415
- className: "flex !size-12 !p-2 text-black md:hidden",
1416
- onClick: () => {
1417
- setChatOpened(false);
1418
- setMessageFromSearch("");
1419
- },
1420
- children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react13.Icon, { icon: "mdi:close", className: "text-black", width: 32, height: 32 })
1421
- }
1422
- )
1455
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-row items-center justify-end ", children: [
1456
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
1457
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipContent, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "size-full bg-white", children: "New chat" }) }),
1458
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1459
+ "button",
1460
+ {
1461
+ className: "flex !size-12 !p-2",
1462
+ onClick: () => setMessages([
1463
+ {
1464
+ id: -1,
1465
+ user: "bot",
1466
+ message: "Welcome! I'm here to assist you by searching Luxonis documentation and past forum discussions for answers. How can I help you today?",
1467
+ loading: false
1468
+ }
1469
+ ]),
1470
+ children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react13.Icon, { icon: "fluent:chat-add-16-regular", className: "text-primary", width: 32, height: 32 })
1471
+ }
1472
+ ) })
1473
+ ] }),
1474
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1475
+ "button",
1476
+ {
1477
+ className: "flex !size-12 !p-2 text-black md:hidden",
1478
+ onClick: () => {
1479
+ setChatOpened(false);
1480
+ setMessageFromSearch("");
1481
+ },
1482
+ children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react13.Icon, { icon: "mdi:close", className: "text-black", width: 32, height: 32 })
1483
+ }
1484
+ )
1485
+ ] })
1423
1486
  ] }),
1424
- /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
1487
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
1425
1488
  "div",
1426
1489
  {
1427
1490
  ref: messageListRef,
1428
- className: " flex size-full max-w-full flex-col gap-4 overflow-auto rounded-md border border-secondaryBorder bg-white",
1491
+ className: " flex size-full max-w-full flex-col gap-4 overflow-y-auto overflow-x-hidden rounded-md border border-secondaryBorder bg-white",
1429
1492
  children: [
1430
- messages.map((message) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ChatMessage, { ...message }, message.id)),
1431
- loading && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1493
+ messages.map((message) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChatMessage, { ...message }, message.id)),
1494
+ loading && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1432
1495
  ChatMessage,
1433
1496
  {
1434
1497
  id: -2,
@@ -1440,14 +1503,14 @@ function ChatButton(props) {
1440
1503
  ]
1441
1504
  }
1442
1505
  ),
1443
- /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
1506
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
1444
1507
  "form",
1445
1508
  {
1446
1509
  ref: formRef,
1447
1510
  onSubmit: (e) => onSubmit(e),
1448
1511
  className: "relative flex items-center justify-between rounded-md border border-secondaryBorder p-0",
1449
1512
  children: [
1450
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1513
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1451
1514
  "textarea",
1452
1515
  {
1453
1516
  className: " w-full resize-none rounded-md border-none bg-white py-4 pl-6 pr-12 focus:outline-none",
@@ -1463,7 +1526,7 @@ function ChatButton(props) {
1463
1526
  placeholder: loading ? "Waiting for response..." : "Type your question..."
1464
1527
  }
1465
1528
  ),
1466
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "absolute right-2 flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1529
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "absolute right-2 flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1467
1530
  Button,
1468
1531
  {
1469
1532
  disabled: loading,
@@ -1471,7 +1534,7 @@ function ChatButton(props) {
1471
1534
  name: "sendButton",
1472
1535
  variant: "primary",
1473
1536
  className: "!size-10 bg-primary !p-2",
1474
- children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react13.Icon, { icon: "mdi:send", className: "text-white" })
1537
+ children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react13.Icon, { icon: "mdi:send", className: "text-white" })
1475
1538
  }
1476
1539
  ) })
1477
1540
  ]
@@ -1485,19 +1548,25 @@ function ChatButton(props) {
1485
1548
  );
1486
1549
  }
1487
1550
  var ChatMessage = (props) => {
1488
- return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
1551
+ return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
1489
1552
  "div",
1490
1553
  {
1491
- className: `flex w-full gap-2 ${props.user === "bot" ? props.loading ? "bg-gray-100 transition-colors" : "bg-gray-100" : "bg-white"}`,
1554
+ className: `flex h-fit w-full gap-2 ${props.user === "bot" ? props.loading ? "bg-gray-100 transition-colors" : "bg-gray-100" : "bg-white"}`,
1492
1555
  children: [
1493
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex min-h-10 min-w-10 items-start pl-2 pt-1.5", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex items-center justify-center pb-1.5", children: props.user === "user" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react13.Icon, { icon: "mdi:account", className: "h-[38px] w-[32px]" }) : props.loading ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("img", { src: "https://static.luxonis.com/images/chatbot.webp", width: "32", height: "32", alt: "Chatbot Icon" }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("img", { src: "https://static.luxonis.com/images/chatbot.webp", width: "32", height: "32", alt: "Chatbot Icon" }) }) }),
1494
- /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex flex-col", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
1556
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex min-h-10 min-w-10 items-start overflow-x-auto pl-2 pt-1.5 ", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex items-center justify-center pb-1.5", children: props.user === "user" ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react13.Icon, { icon: "mdi:account", className: "h-[38px] w-[32px]" }) : props.loading ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("img", { src: "https://static.luxonis.com/images/chatbot.webp", width: "32", height: "32", alt: "Chatbot Icon" }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("img", { src: "https://static.luxonis.com/images/chatbot.webp", width: "32", height: "32", alt: "Chatbot Icon" }) }) }),
1557
+ /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1495
1558
  "div",
1496
1559
  {
1497
- className: `chat-rich-text w-[350px] max-w-[75vw] ${props.user === "bot" ? "bg-gray-100" : "bg-white"} break-words pb-1.5 pt-2`,
1498
- dangerouslySetInnerHTML: { __html: props.message }
1560
+ className: `flex flex-col overflow-x-auto ${props.user === "bot" ? props.loading ? "bg-gray-100 transition-colors" : "bg-gray-100" : "bg-white"}`,
1561
+ children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
1562
+ "div",
1563
+ {
1564
+ className: `chat-rich-text w-[350px] max-w-[75vw] ${props.user === "bot" ? "bg-gray-100" : "bg-white"} break-words pb-1.5 pt-2`,
1565
+ dangerouslySetInnerHTML: { __html: props.message }
1566
+ }
1567
+ )
1499
1568
  }
1500
- ) })
1569
+ )
1501
1570
  ]
1502
1571
  }
1503
1572
  );
@@ -1551,6 +1620,10 @@ var ChatMessage = (props) => {
1551
1620
  TableRow,
1552
1621
  Text,
1553
1622
  Textarea,
1623
+ Tooltip,
1624
+ TooltipContent,
1625
+ TooltipProvider,
1626
+ TooltipTrigger,
1554
1627
  Video,
1555
1628
  badgeVariants,
1556
1629
  buttonVariants,
package/dist/index.mjs CHANGED
@@ -1157,7 +1157,46 @@ DualRangeSlider.displayName = "DualRangeSlider";
1157
1157
  import { useCallback, useEffect as useEffect2, useRef as useRef4, useState as useState5 } from "react";
1158
1158
  import markdownit from "markdown-it";
1159
1159
  import { Icon as Icon7 } from "@iconify/react";
1160
+
1161
+ // src/Tooltip.tsx
1162
+ import * as TooltipPrimitive from "@radix-ui/react-tooltip";
1163
+ import { cx as cx20 } from "class-variance-authority";
1160
1164
  import { jsx as jsx23, jsxs as jsxs12 } from "react/jsx-runtime";
1165
+ function TooltipProvider({ delayDuration = 0, ...props }) {
1166
+ return /* @__PURE__ */ jsx23(TooltipPrimitive.Provider, { "data-slot": "tooltip-provider", delayDuration, ...props });
1167
+ }
1168
+ function Tooltip({ ...props }) {
1169
+ return /* @__PURE__ */ jsx23(TooltipProvider, { children: /* @__PURE__ */ jsx23(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
1170
+ }
1171
+ function TooltipTrigger({ ...props }) {
1172
+ return /* @__PURE__ */ jsx23(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
1173
+ }
1174
+ function TooltipContent({
1175
+ className,
1176
+ sideOffset = 0,
1177
+ children,
1178
+ ...props
1179
+ }) {
1180
+ return /* @__PURE__ */ jsx23(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs12(
1181
+ TooltipPrimitive.Content,
1182
+ {
1183
+ "data-slot": "tooltip-content",
1184
+ sideOffset,
1185
+ className: cx20(
1186
+ "bg-white text-black shadow-md shadow-secondaryBorder animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
1187
+ className
1188
+ ),
1189
+ ...props,
1190
+ children: [
1191
+ /* @__PURE__ */ jsx23(TooltipPrimitive.Arrow, { className: "size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-white fill-white" }),
1192
+ children
1193
+ ]
1194
+ }
1195
+ ) });
1196
+ }
1197
+
1198
+ // src/LuxonisChat.tsx
1199
+ import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
1161
1200
  function ChatButton(props) {
1162
1201
  const { chatOpened, setChatOpened, messageFromSearch, setMessageFromSearch } = props;
1163
1202
  const [hold, setHold] = useState5(false);
@@ -1279,16 +1318,16 @@ function ChatButton(props) {
1279
1318
  void fetchSearchQuery();
1280
1319
  }
1281
1320
  }, [messageFromSearch, onSubmit, loading]);
1282
- return /* @__PURE__ */ jsx23(
1321
+ return /* @__PURE__ */ jsx24(
1283
1322
  "div",
1284
1323
  {
1285
1324
  className: `fixed z-50 ${chatOpened ? " bottom-0 right-0 sm:bottom-6 sm:left-auto sm:right-6" : " bottom-4 right-4 sm:bottom-6 sm:right-6"}`,
1286
- children: /* @__PURE__ */ jsxs12(
1325
+ children: /* @__PURE__ */ jsxs13(
1287
1326
  "div",
1288
1327
  {
1289
1328
  className: `relative flex max-w-100vw flex-col-reverse items-end gap-5 transition-all duration-300 sm:max-h-[90vh] sm:max-w-95vw ${chatOpened ? "h-screen min-h-[96px] w-screen min-w-[100px] sm:h-[650px] sm:w-[450px]" : "size-0 min-h-0 min-w-0"}`,
1290
1329
  children: [
1291
- /* @__PURE__ */ jsx23(
1330
+ /* @__PURE__ */ jsx24(
1292
1331
  "button",
1293
1332
  {
1294
1333
  onClick: () => {
@@ -1301,8 +1340,8 @@ function ChatButton(props) {
1301
1340
  transform: `scale(${hold ? 0.9 : 1})`,
1302
1341
  transition: "transform 0.15s ease-in-out"
1303
1342
  },
1304
- className: `size-16 min-h-16 rounded-full bg-primary transition duration-150 ease-in-out hover:scale-110 hover:shadow-lg ${chatOpened && "hidden sm:flex"}`,
1305
- children: /* @__PURE__ */ jsx23(
1343
+ className: `size-16 min-h-16 rounded-full bg-primary transition duration-150 ease-in-out hover:scale-110 hover:shadow-lg ${chatOpened && "hidden sm:flex"}`,
1344
+ children: /* @__PURE__ */ jsx24(
1306
1345
  "div",
1307
1346
  {
1308
1347
  style: {
@@ -1310,39 +1349,59 @@ function ChatButton(props) {
1310
1349
  animationDuration: "150ms",
1311
1350
  animationTimingFunction: "ease-in"
1312
1351
  },
1313
- className: "flex w-full items-center justify-center",
1314
- children: chatOpened ? /* @__PURE__ */ jsx23(Icon7, { icon: "mdi:close", className: "size-[32px] text-white" }) : /* @__PURE__ */ jsx23("img", { src: "https://docs.luxonis.com/static/images/icons/chat-icon.svg", width: "32", height: "32", alt: "Chat" })
1352
+ className: "flex size-full items-center justify-center",
1353
+ children: chatOpened ? /* @__PURE__ */ jsx24(Icon7, { icon: "mdi:close", className: "size-[32px] text-white" }) : /* @__PURE__ */ jsx24("img", { src: "https://docs.luxonis.com/static/images/icons/chat-icon.svg", width: "32", height: "32", alt: "Chat" })
1315
1354
  },
1316
1355
  iconKey
1317
1356
  )
1318
1357
  }
1319
1358
  ),
1320
- chatOpened && /* @__PURE__ */ jsxs12("div", { className: "flex size-full flex-col gap-3 overflow-hidden rounded-md bg-white p-3 shadow-lg sm:p-5", children: [
1321
- /* @__PURE__ */ jsxs12("div", { className: "flex h-8 flex-row items-center justify-between gap-2", children: [
1322
- /* @__PURE__ */ jsxs12("h2", { className: "relative text-2xl", children: [
1323
- /* @__PURE__ */ jsx23("a", { target: "_blank", rel: "noopener noreferrer", href: "https://chat.luxonis.com", children: "Chat with Luxonis AI" }),
1324
- /* @__PURE__ */ jsx23(Icon7, { icon: "mingcute:ai-fill", className: "absolute -right-4 -top-2 size-5 text-primary" })
1359
+ chatOpened && /* @__PURE__ */ jsxs13("div", { className: "flex size-full flex-col gap-3 overflow-x-hidden overflow-y-scroll rounded-md bg-white p-3 shadow-lg sm:p-5", children: [
1360
+ /* @__PURE__ */ jsxs13("div", { className: "flex h-8 flex-row justify-between gap-2", children: [
1361
+ /* @__PURE__ */ jsxs13("h2", { className: "relative text-2xl", children: [
1362
+ /* @__PURE__ */ jsx24("a", { target: "_blank", rel: "noopener noreferrer", href: "https://chat.luxonis.com", children: "Chat with Luxonis AI" }),
1363
+ /* @__PURE__ */ jsx24(Icon7, { icon: "mingcute:ai-fill", className: "absolute -right-4 -top-2 size-5 text-primary" })
1325
1364
  ] }),
1326
- /* @__PURE__ */ jsx23(
1327
- "button",
1328
- {
1329
- className: "flex !size-12 !p-2 text-black md:hidden",
1330
- onClick: () => {
1331
- setChatOpened(false);
1332
- setMessageFromSearch("");
1333
- },
1334
- children: /* @__PURE__ */ jsx23(Icon7, { icon: "mdi:close", className: "text-black", width: 32, height: 32 })
1335
- }
1336
- )
1365
+ /* @__PURE__ */ jsxs13("div", { className: "flex flex-row items-center justify-end ", children: [
1366
+ /* @__PURE__ */ jsxs13(Tooltip, { children: [
1367
+ /* @__PURE__ */ jsx24(TooltipContent, { children: /* @__PURE__ */ jsx24("div", { className: "size-full bg-white", children: "New chat" }) }),
1368
+ /* @__PURE__ */ jsx24(TooltipTrigger, { children: /* @__PURE__ */ jsx24(
1369
+ "button",
1370
+ {
1371
+ className: "flex !size-12 !p-2",
1372
+ onClick: () => setMessages([
1373
+ {
1374
+ id: -1,
1375
+ user: "bot",
1376
+ message: "Welcome! I'm here to assist you by searching Luxonis documentation and past forum discussions for answers. How can I help you today?",
1377
+ loading: false
1378
+ }
1379
+ ]),
1380
+ children: /* @__PURE__ */ jsx24(Icon7, { icon: "fluent:chat-add-16-regular", className: "text-primary", width: 32, height: 32 })
1381
+ }
1382
+ ) })
1383
+ ] }),
1384
+ /* @__PURE__ */ jsx24(
1385
+ "button",
1386
+ {
1387
+ className: "flex !size-12 !p-2 text-black md:hidden",
1388
+ onClick: () => {
1389
+ setChatOpened(false);
1390
+ setMessageFromSearch("");
1391
+ },
1392
+ children: /* @__PURE__ */ jsx24(Icon7, { icon: "mdi:close", className: "text-black", width: 32, height: 32 })
1393
+ }
1394
+ )
1395
+ ] })
1337
1396
  ] }),
1338
- /* @__PURE__ */ jsxs12(
1397
+ /* @__PURE__ */ jsxs13(
1339
1398
  "div",
1340
1399
  {
1341
1400
  ref: messageListRef,
1342
- className: " flex size-full max-w-full flex-col gap-4 overflow-auto rounded-md border border-secondaryBorder bg-white",
1401
+ className: " flex size-full max-w-full flex-col gap-4 overflow-y-auto overflow-x-hidden rounded-md border border-secondaryBorder bg-white",
1343
1402
  children: [
1344
- messages.map((message) => /* @__PURE__ */ jsx23(ChatMessage, { ...message }, message.id)),
1345
- loading && /* @__PURE__ */ jsx23(
1403
+ messages.map((message) => /* @__PURE__ */ jsx24(ChatMessage, { ...message }, message.id)),
1404
+ loading && /* @__PURE__ */ jsx24(
1346
1405
  ChatMessage,
1347
1406
  {
1348
1407
  id: -2,
@@ -1354,14 +1413,14 @@ function ChatButton(props) {
1354
1413
  ]
1355
1414
  }
1356
1415
  ),
1357
- /* @__PURE__ */ jsxs12(
1416
+ /* @__PURE__ */ jsxs13(
1358
1417
  "form",
1359
1418
  {
1360
1419
  ref: formRef,
1361
1420
  onSubmit: (e) => onSubmit(e),
1362
1421
  className: "relative flex items-center justify-between rounded-md border border-secondaryBorder p-0",
1363
1422
  children: [
1364
- /* @__PURE__ */ jsx23(
1423
+ /* @__PURE__ */ jsx24(
1365
1424
  "textarea",
1366
1425
  {
1367
1426
  className: " w-full resize-none rounded-md border-none bg-white py-4 pl-6 pr-12 focus:outline-none",
@@ -1377,7 +1436,7 @@ function ChatButton(props) {
1377
1436
  placeholder: loading ? "Waiting for response..." : "Type your question..."
1378
1437
  }
1379
1438
  ),
1380
- /* @__PURE__ */ jsx23("div", { className: "absolute right-2 flex items-center", children: /* @__PURE__ */ jsx23(
1439
+ /* @__PURE__ */ jsx24("div", { className: "absolute right-2 flex items-center", children: /* @__PURE__ */ jsx24(
1381
1440
  Button,
1382
1441
  {
1383
1442
  disabled: loading,
@@ -1385,7 +1444,7 @@ function ChatButton(props) {
1385
1444
  name: "sendButton",
1386
1445
  variant: "primary",
1387
1446
  className: "!size-10 bg-primary !p-2",
1388
- children: /* @__PURE__ */ jsx23(Icon7, { icon: "mdi:send", className: "text-white" })
1447
+ children: /* @__PURE__ */ jsx24(Icon7, { icon: "mdi:send", className: "text-white" })
1389
1448
  }
1390
1449
  ) })
1391
1450
  ]
@@ -1399,19 +1458,25 @@ function ChatButton(props) {
1399
1458
  );
1400
1459
  }
1401
1460
  var ChatMessage = (props) => {
1402
- return /* @__PURE__ */ jsxs12(
1461
+ return /* @__PURE__ */ jsxs13(
1403
1462
  "div",
1404
1463
  {
1405
- className: `flex w-full gap-2 ${props.user === "bot" ? props.loading ? "bg-gray-100 transition-colors" : "bg-gray-100" : "bg-white"}`,
1464
+ className: `flex h-fit w-full gap-2 ${props.user === "bot" ? props.loading ? "bg-gray-100 transition-colors" : "bg-gray-100" : "bg-white"}`,
1406
1465
  children: [
1407
- /* @__PURE__ */ jsx23("div", { className: "flex min-h-10 min-w-10 items-start pl-2 pt-1.5", children: /* @__PURE__ */ jsx23("div", { className: "flex items-center justify-center pb-1.5", children: props.user === "user" ? /* @__PURE__ */ jsx23(Icon7, { icon: "mdi:account", className: "h-[38px] w-[32px]" }) : props.loading ? /* @__PURE__ */ jsx23("img", { src: "https://static.luxonis.com/images/chatbot.webp", width: "32", height: "32", alt: "Chatbot Icon" }) : /* @__PURE__ */ jsx23("img", { src: "https://static.luxonis.com/images/chatbot.webp", width: "32", height: "32", alt: "Chatbot Icon" }) }) }),
1408
- /* @__PURE__ */ jsx23("div", { className: "flex flex-col", children: /* @__PURE__ */ jsx23(
1466
+ /* @__PURE__ */ jsx24("div", { className: "flex min-h-10 min-w-10 items-start overflow-x-auto pl-2 pt-1.5 ", children: /* @__PURE__ */ jsx24("div", { className: "flex items-center justify-center pb-1.5", children: props.user === "user" ? /* @__PURE__ */ jsx24(Icon7, { icon: "mdi:account", className: "h-[38px] w-[32px]" }) : props.loading ? /* @__PURE__ */ jsx24("img", { src: "https://static.luxonis.com/images/chatbot.webp", width: "32", height: "32", alt: "Chatbot Icon" }) : /* @__PURE__ */ jsx24("img", { src: "https://static.luxonis.com/images/chatbot.webp", width: "32", height: "32", alt: "Chatbot Icon" }) }) }),
1467
+ /* @__PURE__ */ jsx24(
1409
1468
  "div",
1410
1469
  {
1411
- className: `chat-rich-text w-[350px] max-w-[75vw] ${props.user === "bot" ? "bg-gray-100" : "bg-white"} break-words pb-1.5 pt-2`,
1412
- dangerouslySetInnerHTML: { __html: props.message }
1470
+ className: `flex flex-col overflow-x-auto ${props.user === "bot" ? props.loading ? "bg-gray-100 transition-colors" : "bg-gray-100" : "bg-white"}`,
1471
+ children: /* @__PURE__ */ jsx24(
1472
+ "div",
1473
+ {
1474
+ className: `chat-rich-text w-[350px] max-w-[75vw] ${props.user === "bot" ? "bg-gray-100" : "bg-white"} break-words pb-1.5 pt-2`,
1475
+ dangerouslySetInnerHTML: { __html: props.message }
1476
+ }
1477
+ )
1413
1478
  }
1414
- ) })
1479
+ )
1415
1480
  ]
1416
1481
  }
1417
1482
  );
@@ -1464,6 +1529,10 @@ export {
1464
1529
  TableRow,
1465
1530
  Text,
1466
1531
  Textarea,
1532
+ Tooltip,
1533
+ TooltipContent,
1534
+ TooltipProvider,
1535
+ TooltipTrigger,
1467
1536
  Video,
1468
1537
  badgeVariants,
1469
1538
  buttonVariants,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@luxonis/component-lib",
3
- "version": "1.0.6",
3
+ "version": "1.0.8",
4
4
  "description": "Luxonis website-component-lib",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -45,6 +45,7 @@
45
45
  "@radix-ui/react-slider": "^1.3.5",
46
46
  "@radix-ui/react-switch": "^1.2.5",
47
47
  "@radix-ui/react-tabs": "^1.1.12",
48
+ "@radix-ui/react-tooltip": "^1.2.7",
48
49
  "@rudderstack/analytics-js": "^3.18.1",
49
50
  "animated-tailwindcss": "^4.0.0",
50
51
  "class-variance-authority": "^0.7.1",