@constructor-io/constructorio-ui-asa 1.2.0 → 1.3.0

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.
Files changed (44) hide show
  1. package/dist/constructorio-ui-asa-bundled.js +1 -1
  2. package/lib/cjs/components/Chat/AiMessage.js +2 -2
  3. package/lib/cjs/components/Chat/Chat.js +26 -4
  4. package/lib/cjs/components/Chat/ChatHeader.js +1 -1
  5. package/lib/cjs/components/Chat/ChatMessageList.js +1 -1
  6. package/lib/cjs/components/Chat/TypingIndicator.js +4 -3
  7. package/lib/cjs/components/Chat/WelcomeScreen.js +4 -4
  8. package/lib/cjs/components/ResultsBlock/ResultsBlock.css +16 -0
  9. package/lib/cjs/components/ResultsBlock/renderProductCard.js +8 -1
  10. package/lib/cjs/components/icons/ArrowRightIcon.js +1 -1
  11. package/lib/cjs/components/icons/ChatBubbleDarkIcon.js +1 -1
  12. package/lib/cjs/components/icons/ChatBubbleLightIcon.js +1 -1
  13. package/lib/cjs/components/icons/SendArrowIcon.js +1 -1
  14. package/lib/cjs/components/icons/SendPlaneIcon.js +1 -1
  15. package/lib/cjs/hooks/useAsaResults.js +4 -4
  16. package/lib/cjs/hooks/useFocusTrap.js +3 -3
  17. package/lib/cjs/styles.css +1 -1
  18. package/lib/cjs/utils/translate.js +1 -1
  19. package/lib/cjs/version.js +1 -1
  20. package/lib/mjs/components/Chat/AiMessage.js +2 -2
  21. package/lib/mjs/components/Chat/Chat.js +25 -4
  22. package/lib/mjs/components/Chat/ChatHeader.js +1 -1
  23. package/lib/mjs/components/Chat/ChatMessageList.js +1 -1
  24. package/lib/mjs/components/Chat/TypingIndicator.js +4 -3
  25. package/lib/mjs/components/Chat/WelcomeScreen.js +2 -2
  26. package/lib/mjs/components/ResultsBlock/ResultsBlock.css +16 -0
  27. package/lib/mjs/components/ResultsBlock/renderProductCard.js +7 -1
  28. package/lib/mjs/components/icons/ArrowRightIcon.js +1 -1
  29. package/lib/mjs/components/icons/ChatBubbleDarkIcon.js +1 -1
  30. package/lib/mjs/components/icons/ChatBubbleLightIcon.js +1 -1
  31. package/lib/mjs/components/icons/SendArrowIcon.js +1 -1
  32. package/lib/mjs/components/icons/SendPlaneIcon.js +1 -1
  33. package/lib/mjs/hooks/useAsaResults.js +2 -2
  34. package/lib/mjs/hooks/useFocusTrap.js +3 -3
  35. package/lib/mjs/styles.css +1 -1
  36. package/lib/mjs/utils/translate.js +1 -1
  37. package/lib/mjs/version.js +1 -1
  38. package/lib/types/components/Chat/Chat.d.ts +2 -0
  39. package/lib/types/hooks/useAsaResults.d.ts +2 -2
  40. package/lib/types/hooks/useFocusTrap.d.ts +3 -1
  41. package/lib/types/index.d.ts +1 -1
  42. package/lib/types/types.d.ts +6 -0
  43. package/lib/types/version.d.ts +1 -1
  44. package/package.json +4 -5
package/dist/constructorio-ui-asa-bundled.js CHANGED
@@ -1,4 +1,4 @@
1
- (function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.id="cio-asa-styles",o.appendChild(document.createTextNode(`@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap";/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;@layer theme{:root,:host{--cio-color-red-200: oklch(88.5% .062 18.334);--cio-color-red-500: oklch(63.7% .237 25.331);--cio-color-red-600: oklch(57.7% .245 27.325);--cio-color-orange-500: oklch(70.5% .213 47.604);--cio-color-yellow-500: oklch(79.5% .184 86.047);--cio-color-green-600: oklch(62.7% .194 149.214);--cio-color-emerald-50: oklch(97.9% .021 166.113);--cio-color-emerald-100: oklch(95% .052 163.051);--cio-color-emerald-200: oklch(90.5% .093 164.15);--cio-color-emerald-300: oklch(84.5% .143 164.978);--cio-color-emerald-600: oklch(59.6% .145 163.225);--cio-color-emerald-800: oklch(43.2% .095 166.913);--cio-color-teal-50: oklch(98.4% .014 180.72);--cio-color-blue-50: oklch(97% .014 254.604);--cio-color-blue-100: oklch(93.2% .032 255.585);--cio-color-blue-200: oklch(88.2% .059 254.128);--cio-color-blue-500: oklch(62.3% .214 259.815);--cio-color-blue-600: oklch(54.6% .245 262.881);--cio-color-blue-700: oklch(48.8% .243 264.376);--cio-color-blue-800: oklch(42.4% .199 265.638);--cio-color-indigo-50: oklch(96.2% .018 272.314);--cio-color-indigo-100: oklch(93% .034 272.788);--cio-color-indigo-600: oklch(51.1% .262 276.966);--cio-color-indigo-700: oklch(45.7% .24 277.023);--cio-color-purple-50: oklch(97.7% .014 308.299);--cio-color-purple-100: oklch(94.6% .033 307.174);--cio-color-purple-500: oklch(62.7% .265 303.9);--cio-color-purple-600: oklch(55.8% .288 302.321);--cio-color-purple-700: oklch(49.6% .265 301.924);--cio-color-purple-800: oklch(43.8% .218 303.724);--cio-color-pink-500: oklch(65.6% .241 354.308);--cio-color-pink-600: oklch(59.2% .249 .584);--cio-color-slate-50: oklch(98.4% .003 247.858);--cio-color-slate-100: oklch(96.8% .007 247.896);--cio-color-slate-200: oklch(92.9% .013 255.508);--cio-color-slate-300: oklch(86.9% .022 252.894);--cio-color-slate-500: oklch(55.4% .046 257.417);--cio-color-slate-700: oklch(37.2% .044 257.287);--cio-color-slate-900: oklch(20.8% .042 265.755);--cio-color-slate-950: oklch(12.9% .042 264.695);--cio-color-gray-50: oklch(98.5% .002 247.839);--cio-color-gray-100: oklch(96.7% .003 264.542);--cio-color-gray-200: oklch(92.8% .006 264.531);--cio-color-gray-400: oklch(70.7% .022 261.325);--cio-color-gray-500: oklch(55.1% .027 264.364);--cio-color-gray-600: oklch(44.6% .03 256.802);--cio-color-gray-700: oklch(37.3% .034 259.733);--cio-color-gray-800: oklch(27.8% .033 256.848);--cio-color-neutral-100: oklch(97% 0 0);--cio-color-black: #000;--cio-color-white: #fff;--cio-spacing: .25rem;--cio-container-sm: 24rem;--cio-container-lg: 32rem;--cio-text-xs: .75rem;--cio-text-xs--line-height: calc(1 / .75);--cio-text-sm: .875rem;--cio-text-sm--line-height: calc(1.25 / .875);--cio-text-base: 1rem;--cio-text-base--line-height: 1.5 ;--cio-text-lg: 1.125rem;--cio-text-lg--line-height: calc(1.75 / 1.125);--cio-text-xl: 1.25rem;--cio-text-xl--line-height: calc(1.75 / 1.25);--cio-text-2xl: 1.5rem;--cio-text-2xl--line-height: calc(2 / 1.5);--cio-font-weight-medium: 500;--cio-font-weight-semibold: 600;--cio-font-weight-bold: 700;--cio-tracking-tighter: -.05em;--cio-tracking-wide: .025em;--cio-radius-2xl: 1rem;--cio-radius-3xl: 1.5rem;--cio-default-transition-duration: .15s;--cio-default-transition-timing-function: cubic-bezier(.4, 0, .2, 1)}}@layer utilities{.cio\\:\\@container\\/card-header{container-type:inline-size;container-name:card-header}.cio\\:pointer-events-none{pointer-events:none}.cio\\:invisible{visibility:hidden}.cio\\:sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0}.cio\\:absolute{position:absolute}.cio\\:relative{position:relative}.cio\\:top-2{top:calc(var(--cio-spacing) * 2)}.cio\\:top-3{top:calc(var(--cio-spacing) * 3)}.cio\\:right-2{right:calc(var(--cio-spacing) * 2)}.cio\\:right-3{right:calc(var(--cio-spacing) * 3)}.cio\\:left-2{left:calc(var(--cio-spacing) * 2)}.cio\\:col-start-2{grid-column-start:2}.cio\\:row-span-2{grid-row:span 2 / span 2}.cio\\:row-start-1{grid-row-start:1}.cio\\:m-0{margin:calc(var(--cio-spacing) * 0)}.cio\\:mx-2{margin-inline:calc(var(--cio-spacing) * 2)}.cio\\:my-2{margin-block:calc(var(--cio-spacing) * 2)}.cio\\:mt-1{margin-top:calc(var(--cio-spacing) * 1)}.cio\\:mt-2{margin-top:calc(var(--cio-spacing) * 2)}.cio\\:mt-3{margin-top:calc(var(--cio-spacing) * 3)}.cio\\:mt-auto{margin-top:auto}.cio\\:mr-2{margin-right:calc(var(--cio-spacing) * 2)}.cio\\:mr-4{margin-right:calc(var(--cio-spacing) * 4)}.cio\\:mb-2{margin-bottom:calc(var(--cio-spacing) * 2)}.cio\\:mb-3{margin-bottom:calc(var(--cio-spacing) * 3)}.cio\\:mb-4{margin-bottom:calc(var(--cio-spacing) * 4)}.cio\\:ml-1{margin-left:calc(var(--cio-spacing) * 1)}.cio\\:ml-2{margin-left:calc(var(--cio-spacing) * 2)}.cio\\:ml-4{margin-left:calc(var(--cio-spacing) * 4)}.cio\\:line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.cio\\:line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.cio\\:flex{display:flex}.cio\\:grid{display:grid}.cio\\:hidden{display:none}.cio\\:inline-flex{display:inline-flex}.cio\\:size-6{width:calc(var(--cio-spacing) * 6);height:calc(var(--cio-spacing) * 6)}.cio\\:size-9{width:calc(var(--cio-spacing) * 9);height:calc(var(--cio-spacing) * 9)}.cio\\:h-3{height:calc(var(--cio-spacing) * 3)}.cio\\:h-4{height:calc(var(--cio-spacing) * 4)}.cio\\:h-5{height:calc(var(--cio-spacing) * 5)}.cio\\:h-6{height:calc(var(--cio-spacing) * 6)}.cio\\:h-8{height:calc(var(--cio-spacing) * 8)}.cio\\:h-10{height:calc(var(--cio-spacing) * 10)}.cio\\:h-12{height:calc(var(--cio-spacing) * 12)}.cio\\:h-14{height:calc(var(--cio-spacing) * 14)}.cio\\:h-16{height:calc(var(--cio-spacing) * 16)}.cio\\:h-24{height:calc(var(--cio-spacing) * 24)}.cio\\:h-32{height:calc(var(--cio-spacing) * 32)}.cio\\:h-\\[400px\\]{height:400px}.cio\\:h-full{height:100%}.cio\\:min-h-5{min-height:calc(var(--cio-spacing) * 5)}.cio\\:min-h-\\[224px\\]{min-height:224px}.cio\\:w-3{width:calc(var(--cio-spacing) * 3)}.cio\\:w-4{width:calc(var(--cio-spacing) * 4)}.cio\\:w-5{width:calc(var(--cio-spacing) * 5)}.cio\\:w-6{width:calc(var(--cio-spacing) * 6)}.cio\\:w-8{width:calc(var(--cio-spacing) * 8)}.cio\\:w-14{width:calc(var(--cio-spacing) * 14)}.cio\\:w-16{width:calc(var(--cio-spacing) * 16)}.cio\\:w-24{width:calc(var(--cio-spacing) * 24)}.cio\\:w-\\[200px\\]{width:200px}.cio\\:w-\\[220px\\]{width:220px}.cio\\:w-\\[240px\\]{width:240px}.cio\\:w-\\[260px\\]{width:260px}.cio\\:w-full{width:100%}.cio\\:max-w-\\[256px\\]{max-width:256px}.cio\\:max-w-lg{max-width:var(--cio-container-lg)}.cio\\:max-w-sm{max-width:var(--cio-container-sm)}.cio\\:min-w-4{min-width:calc(var(--cio-spacing) * 4)}.cio\\:min-w-5{min-width:calc(var(--cio-spacing) * 5)}.cio\\:min-w-6{min-width:calc(var(--cio-spacing) * 6)}.cio\\:min-w-\\[176px\\]{min-width:176px}.cio\\:flex-1{flex:1}.cio\\:flex-shrink-0,.cio\\:shrink-0{flex-shrink:0}.cio\\:grow{flex-grow:1}.cio\\:grow-0{flex-grow:0}.cio\\:basis-full{flex-basis:100%}.cio\\:rotate-90{rotate:90deg}.cio\\:transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.cio\\:cursor-pointer{cursor:pointer}.cio\\:list-none{list-style-type:none}.cio\\:auto-rows-min{grid-auto-rows:min-content}.cio\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.cio\\:grid-rows-\\[auto_auto\\]{grid-template-rows:auto auto}.cio\\:flex-col{flex-direction:column}.cio\\:flex-row{flex-direction:row}.cio\\:flex-wrap{flex-wrap:wrap}.cio\\:items-baseline{align-items:baseline}.cio\\:items-center{align-items:center}.cio\\:items-end{align-items:flex-end}.cio\\:items-start{align-items:flex-start}.cio\\:items-stretch{align-items:stretch}.cio\\:justify-between{justify-content:space-between}.cio\\:justify-center{justify-content:center}.cio\\:gap-1{gap:calc(var(--cio-spacing) * 1)}.cio\\:gap-1\\.5{gap:calc(var(--cio-spacing) * 1.5)}.cio\\:gap-2{gap:calc(var(--cio-spacing) * 2)}.cio\\:gap-3{gap:calc(var(--cio-spacing) * 3)}.cio\\:gap-4{gap:calc(var(--cio-spacing) * 4)}:where(.cio\\:space-y-1>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--cio-spacing) * 1) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--cio-spacing) * 1) * calc(1 - var(--tw-space-y-reverse)))}:where(.cio\\:space-y-2>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--cio-spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--cio-spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.cio\\:space-y-3>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--cio-spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--cio-spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}.cio\\:self-center{align-self:center}.cio\\:self-start{align-self:flex-start}.cio\\:justify-self-end{justify-self:flex-end}.cio\\:overflow-hidden{overflow:hidden}.cio\\:rounded{border-radius:.25rem}.cio\\:rounded-2xl{border-radius:var(--cio-radius-2xl)}.cio\\:rounded-3xl{border-radius:var(--cio-radius-3xl)}.cio\\:rounded-full{border-radius:calc(infinity * 1px)}.cio\\:rounded-lg{border-radius:var(--cio-radius)}.cio\\:rounded-md{border-radius:calc(var(--cio-radius) - 2px)}.cio\\:rounded-none{border-radius:0}.cio\\:rounded-sm{border-radius:calc(var(--cio-radius) - 4px)}.cio\\:rounded-xl{border-radius:calc(var(--cio-radius) + 4px)}.cio\\:border{border-style:var(--tw-border-style);border-width:1px}.cio\\:border-0{border-style:var(--tw-border-style);border-width:0px}.cio\\:border-2{border-style:var(--tw-border-style);border-width:2px}.cio\\:border-4{border-style:var(--tw-border-style);border-width:4px}.cio\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.cio\\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.cio\\:border-black\\/20{border-color:var(--cio-color-black)}@supports (color: color-mix(in lab,red,red)){.cio\\:border-black\\/20{border-color:color-mix(in oklab,var(--cio-color-black) 20%,transparent)}}.cio\\:border-blue-200{border-color:var(--cio-color-blue-200)}.cio\\:border-blue-600{border-color:var(--cio-color-blue-600)}.cio\\:border-emerald-200{border-color:var(--cio-color-emerald-200)}.cio\\:border-gray-200{border-color:var(--cio-color-gray-200)}.cio\\:border-slate-200{border-color:var(--cio-color-slate-200)}.cio\\:border-slate-500{border-color:var(--cio-color-slate-500)}.cio\\:border-slate-700{border-color:var(--cio-color-slate-700)}.cio\\:border-transparent{border-color:transparent}.cio\\:border-white{border-color:var(--cio-color-white)}.cio\\:bg-background{background-color:var(--cio-background)}.cio\\:bg-black{background-color:var(--cio-color-black)}.cio\\:bg-blue-100{background-color:var(--cio-color-blue-100)}.cio\\:bg-blue-500{background-color:var(--cio-color-blue-500)}.cio\\:bg-blue-600{background-color:var(--cio-color-blue-600)}.cio\\:bg-card{background-color:var(--cio-card)}.cio\\:bg-destructive{background-color:var(--cio-destructive)}.cio\\:bg-emerald-100{background-color:var(--cio-color-emerald-100)}.cio\\:bg-gray-100{background-color:var(--cio-color-gray-100)}.cio\\:bg-gray-200{background-color:var(--cio-color-gray-200)}.cio\\:bg-indigo-600{background-color:var(--cio-color-indigo-600)}.cio\\:bg-primary{background-color:var(--cio-primary)}.cio\\:bg-purple-100{background-color:var(--cio-color-purple-100)}.cio\\:bg-purple-600{background-color:var(--cio-color-purple-600)}.cio\\:bg-red-500{background-color:var(--cio-color-red-500)}.cio\\:bg-secondary{background-color:var(--cio-secondary)}.cio\\:bg-slate-50{background-color:var(--cio-color-slate-50)}.cio\\:bg-slate-100{background-color:var(--cio-color-slate-100)}.cio\\:bg-slate-900{background-color:var(--cio-color-slate-900)}.cio\\:bg-slate-950\\/90{background-color:var(--cio-color-slate-950)}@supports (color: color-mix(in lab,red,red)){.cio\\:bg-slate-950\\/90{background-color:color-mix(in oklab,var(--cio-color-slate-950) 90%,transparent)}}.cio\\:bg-transparent{background-color:transparent}.cio\\:bg-white{background-color:var(--cio-color-white)}.cio\\:bg-gradient-to-br{--tw-gradient-position: to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.cio\\:bg-gradient-to-r{--tw-gradient-position: to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.cio\\:from-blue-50{--tw-gradient-from: var(--cio-color-blue-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-blue-500{--tw-gradient-from: var(--cio-color-blue-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-emerald-50{--tw-gradient-from: var(--cio-color-emerald-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-orange-500{--tw-gradient-from: var(--cio-color-orange-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-purple-50{--tw-gradient-from: var(--cio-color-purple-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-purple-500{--tw-gradient-from: var(--cio-color-purple-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-blue-50{--tw-gradient-to: var(--cio-color-blue-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-indigo-50{--tw-gradient-to: var(--cio-color-indigo-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-indigo-100{--tw-gradient-to: var(--cio-color-indigo-100);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-pink-500{--tw-gradient-to: var(--cio-color-pink-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-purple-50{--tw-gradient-to: var(--cio-color-purple-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-purple-600{--tw-gradient-to: var(--cio-color-purple-600);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-red-500{--tw-gradient-to: var(--cio-color-red-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-teal-50{--tw-gradient-to: var(--cio-color-teal-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:object-cover{object-fit:cover}.cio\\:p-0\\.5{padding:calc(var(--cio-spacing) * .5)}.cio\\:p-1{padding:calc(var(--cio-spacing) * 1)}.cio\\:p-2{padding:calc(var(--cio-spacing) * 2)}.cio\\:p-3{padding:calc(var(--cio-spacing) * 3)}.cio\\:p-4{padding:calc(var(--cio-spacing) * 4)}.cio\\:p-6{padding:calc(var(--cio-spacing) * 6)}.cio\\:px-0{padding-inline:calc(var(--cio-spacing) * 0)}.cio\\:px-1{padding-inline:calc(var(--cio-spacing) * 1)}.cio\\:px-2{padding-inline:calc(var(--cio-spacing) * 2)}.cio\\:px-3{padding-inline:calc(var(--cio-spacing) * 3)}.cio\\:px-4{padding-inline:calc(var(--cio-spacing) * 4)}.cio\\:px-6{padding-inline:calc(var(--cio-spacing) * 6)}.cio\\:py-1{padding-block:calc(var(--cio-spacing) * 1)}.cio\\:py-2{padding-block:calc(var(--cio-spacing) * 2)}.cio\\:pt-2{padding-top:calc(var(--cio-spacing) * 2)}.cio\\:text-center{text-align:center}.cio\\:text-2xl{font-size:var(--cio-text-2xl);line-height:var(--tw-leading, var(--cio-text-2xl--line-height))}.cio\\:text-base{font-size:var(--cio-text-base);line-height:var(--tw-leading, var(--cio-text-base--line-height))}.cio\\:text-lg{font-size:var(--cio-text-lg);line-height:var(--tw-leading, var(--cio-text-lg--line-height))}.cio\\:text-sm{font-size:var(--cio-text-sm);line-height:var(--tw-leading, var(--cio-text-sm--line-height))}.cio\\:text-xl{font-size:var(--cio-text-xl);line-height:var(--tw-leading, var(--cio-text-xl--line-height))}.cio\\:text-xs{font-size:var(--cio-text-xs);line-height:var(--tw-leading, var(--cio-text-xs--line-height))}.cio\\:text-\\[11px\\]{font-size:11px}.cio\\:text-\\[13px\\]{font-size:13px}.cio\\:leading-3{--tw-leading: calc(var(--cio-spacing) * 3);line-height:calc(var(--cio-spacing) * 3)}.cio\\:leading-4{--tw-leading: calc(var(--cio-spacing) * 4);line-height:calc(var(--cio-spacing) * 4)}.cio\\:leading-none{--tw-leading: 1;line-height:1}.cio\\:font-bold{--tw-font-weight: var(--cio-font-weight-bold);font-weight:var(--cio-font-weight-bold)}.cio\\:font-medium{--tw-font-weight: var(--cio-font-weight-medium);font-weight:var(--cio-font-weight-medium)}.cio\\:font-semibold{--tw-font-weight: var(--cio-font-weight-semibold);font-weight:var(--cio-font-weight-semibold)}.cio\\:tracking-tighter{--tw-tracking: var(--cio-tracking-tighter);letter-spacing:var(--cio-tracking-tighter)}.cio\\:tracking-wide{--tw-tracking: var(--cio-tracking-wide);letter-spacing:var(--cio-tracking-wide)}.cio\\:break-words{overflow-wrap:break-word}.cio\\:whitespace-nowrap{white-space:nowrap}.cio\\:text-\\[\\#0A0F2940\\]{color:#0a0f2940}.cio\\:text-blue-600{color:var(--cio-color-blue-600)}.cio\\:text-blue-800{color:var(--cio-color-blue-800)}.cio\\:text-card-foreground{color:var(--cio-card-foreground)}.cio\\:text-emerald-300{color:var(--cio-color-emerald-300)}.cio\\:text-emerald-600{color:var(--cio-color-emerald-600)}.cio\\:text-emerald-800{color:var(--cio-color-emerald-800)}.cio\\:text-gray-400{color:var(--cio-color-gray-400)}.cio\\:text-gray-500{color:var(--cio-color-gray-500)}.cio\\:text-gray-600{color:var(--cio-color-gray-600)}.cio\\:text-gray-700{color:var(--cio-color-gray-700)}.cio\\:text-gray-800{color:var(--cio-color-gray-800)}.cio\\:text-green-600{color:var(--cio-color-green-600)}.cio\\:text-muted-foreground{color:var(--cio-muted-foreground)}.cio\\:text-primary{color:var(--cio-primary)}.cio\\:text-primary-foreground{color:var(--cio-primary-foreground)}.cio\\:text-purple-600{color:var(--cio-color-purple-600)}.cio\\:text-purple-700{color:var(--cio-color-purple-700)}.cio\\:text-purple-800{color:var(--cio-color-purple-800)}.cio\\:text-red-600{color:var(--cio-color-red-600)}.cio\\:text-secondary-foreground{color:var(--cio-secondary-foreground)}.cio\\:text-slate-300{color:var(--cio-color-slate-300)}.cio\\:text-slate-500{color:var(--cio-color-slate-500)}.cio\\:text-white{color:var(--cio-color-white)}.cio\\:text-yellow-500{color:var(--cio-color-yellow-500)}.cio\\:uppercase{text-transform:uppercase}.cio\\:line-through{text-decoration-line:line-through}.cio\\:underline{text-decoration-line:underline}.cio\\:underline-offset-4{text-underline-offset:4px}.cio\\:opacity-0{opacity:0%}.cio\\:opacity-90{opacity:90%}.cio\\:shadow-lg{--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-md{--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-none{--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-sm{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-xl{--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-xs{--tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:transition-all{transition-property:all;transition-timing-function:var(--tw-ease, var(--cio-default-transition-timing-function));transition-duration:var(--tw-duration, var(--cio-default-transition-duration))}.cio\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--cio-default-transition-timing-function));transition-duration:var(--tw-duration, var(--cio-default-transition-duration))}.cio\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease, var(--cio-default-transition-timing-function));transition-duration:var(--tw-duration, var(--cio-default-transition-duration))}.cio\\:duration-200{--tw-duration: .2s;transition-duration:.2s}.cio\\:duration-250{--tw-duration: .25s;transition-duration:.25s}.cio\\:outline-none{--tw-outline-style: none;outline-style:none}.cio\\:group-has-\\[input\\:checked\\]\\:opacity-100:is(:where(.cio\\:group):has(*:is(input:checked)) *){opacity:100%}.cio\\:group-has-\\[input\\:checked\\]\\:shadow-\\[inset_0_0_0_32px_\\#000\\]:is(:where(.cio\\:group):has(*:is(input:checked)) *){--tw-shadow: inset 0 0 0 32px var(--tw-shadow-color, #000);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}@media (hover: hover){.cio\\:hover\\:scale-105:hover{--tw-scale-x: 105%;--tw-scale-y: 105%;--tw-scale-z: 105%;scale:var(--tw-scale-x) var(--tw-scale-y)}}@media (hover: hover){.cio\\:hover\\:rounded:hover{border-radius:.25rem}}@media (hover: hover){.cio\\:hover\\:bg-accent:hover{background-color:var(--cio-accent)}}@media (hover: hover){.cio\\:hover\\:bg-blue-600:hover{background-color:var(--cio-color-blue-600)}}@media (hover: hover){.cio\\:hover\\:bg-blue-700:hover{background-color:var(--cio-color-blue-700)}}@media (hover: hover){.cio\\:hover\\:bg-destructive\\/90:hover{background-color:var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:hover\\:bg-destructive\\/90:hover{background-color:color-mix(in oklab,var(--cio-destructive) 90%,transparent)}}}@media (hover: hover){.cio\\:hover\\:bg-gray-50:hover{background-color:var(--cio-color-gray-50)}}@media (hover: hover){.cio\\:hover\\:bg-gray-200:hover{background-color:var(--cio-color-gray-200)}}@media (hover: hover){.cio\\:hover\\:bg-gray-800:hover{background-color:var(--cio-color-gray-800)}}@media (hover: hover){.cio\\:hover\\:bg-indigo-700:hover{background-color:var(--cio-color-indigo-700)}}@media (hover: hover){.cio\\:hover\\:bg-neutral-100:hover{background-color:var(--cio-color-neutral-100)}}@media (hover: hover){.cio\\:hover\\:bg-primary\\/90:hover{background-color:var(--cio-primary)}@supports (color: color-mix(in lab,red,red)){.cio\\:hover\\:bg-primary\\/90:hover{background-color:color-mix(in oklab,var(--cio-primary) 90%,transparent)}}}@media (hover: hover){.cio\\:hover\\:bg-purple-700:hover{background-color:var(--cio-color-purple-700)}}@media (hover: hover){.cio\\:hover\\:bg-red-200:hover{background-color:var(--cio-color-red-200)}}@media (hover: hover){.cio\\:hover\\:bg-secondary\\/80:hover{background-color:var(--cio-secondary)}@supports (color: color-mix(in lab,red,red)){.cio\\:hover\\:bg-secondary\\/80:hover{background-color:color-mix(in oklab,var(--cio-secondary) 80%,transparent)}}}@media (hover: hover){.cio\\:hover\\:bg-secondary\\/90:hover{background-color:var(--cio-secondary)}@supports (color: color-mix(in lab,red,red)){.cio\\:hover\\:bg-secondary\\/90:hover{background-color:color-mix(in oklab,var(--cio-secondary) 90%,transparent)}}}@media (hover: hover){.cio\\:hover\\:from-purple-600:hover{--tw-gradient-from: var(--cio-color-purple-600);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}}@media (hover: hover){.cio\\:hover\\:to-pink-600:hover{--tw-gradient-to: var(--cio-color-pink-600);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}}@media (hover: hover){.cio\\:hover\\:text-accent-foreground:hover{color:var(--cio-accent-foreground)}}@media (hover: hover){.cio\\:hover\\:underline:hover{text-decoration-line:underline}}.cio\\:focus-visible\\:border-ring:focus-visible{border-color:var(--cio-ring)}.cio\\:focus-visible\\:ring-\\[3px\\]:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:focus-visible\\:ring-destructive\\/20:focus-visible{--tw-ring-color: var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:focus-visible\\:ring-destructive\\/20:focus-visible{--tw-ring-color: color-mix(in oklab, var(--cio-destructive) 20%, transparent)}}.cio\\:focus-visible\\:ring-ring\\/50:focus-visible{--tw-ring-color: var(--cio-ring)}@supports (color: color-mix(in lab,red,red)){.cio\\:focus-visible\\:ring-ring\\/50:focus-visible{--tw-ring-color: color-mix(in oklab, var(--cio-ring) 50%, transparent)}}.cio\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.cio\\:disabled\\:opacity-40:disabled{opacity:40%}.cio\\:disabled\\:opacity-50:disabled{opacity:50%}.cio\\:has-data-\\[slot\\=card-action\\]\\:grid-cols-\\[1fr_auto\\]:has(*[data-slot=card-action]){grid-template-columns:1fr auto}.cio\\:has-\\[\\>svg\\]\\:px-2\\.5:has(>svg){padding-inline:calc(var(--cio-spacing) * 2.5)}.cio\\:has-\\[\\>svg\\]\\:px-3:has(>svg){padding-inline:calc(var(--cio-spacing) * 3)}.cio\\:has-\\[\\>svg\\]\\:px-4:has(>svg){padding-inline:calc(var(--cio-spacing) * 4)}.cio\\:aria-invalid\\:border-destructive[aria-invalid=true]{border-color:var(--cio-destructive)}.cio\\:aria-invalid\\:ring-destructive\\/20[aria-invalid=true]{--tw-ring-color: var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:aria-invalid\\:ring-destructive\\/20[aria-invalid=true]{--tw-ring-color: color-mix(in oklab, var(--cio-destructive) 20%, transparent)}}@media (width >= 40rem){.cio\\:sm\\:top-4{top:calc(var(--cio-spacing) * 4)}}@media (width >= 40rem){.cio\\:sm\\:right-\\[22px\\]{right:22px}}@media (width >= 40rem){.cio\\:sm\\:left-\\[22px\\]{left:22px}}@media (width >= 40rem){.cio\\:sm\\:size-\\[18px\\]{width:18px;height:18px}}@media (width >= 40rem){.cio\\:sm\\:h-\\[8px\\]{height:8px}}@media (width >= 40rem){.cio\\:sm\\:w-\\[8px\\]{width:8px}}@media (width >= 40rem){.cio\\:sm\\:p-4{padding:calc(var(--cio-spacing) * 4)}}@media (width >= 64rem){.cio\\:lg\\:p-6{padding:calc(var(--cio-spacing) * 6)}}.cio\\:dark\\:border-input:is(.dark *){border-color:var(--cio-input)}.cio\\:dark\\:bg-destructive\\/60:is(.dark *){background-color:var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:bg-destructive\\/60:is(.dark *){background-color:color-mix(in oklab,var(--cio-destructive) 60%,transparent)}}.cio\\:dark\\:bg-input\\/30:is(.dark *){background-color:var(--cio-input)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:bg-input\\/30:is(.dark *){background-color:color-mix(in oklab,var(--cio-input) 30%,transparent)}}@media (hover: hover){.cio\\:dark\\:hover\\:bg-accent\\/50:is(.dark *):hover{background-color:var(--cio-accent)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:hover\\:bg-accent\\/50:is(.dark *):hover{background-color:color-mix(in oklab,var(--cio-accent) 50%,transparent)}}}@media (hover: hover){.cio\\:dark\\:hover\\:bg-input\\/50:is(.dark *):hover{background-color:var(--cio-input)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:hover\\:bg-input\\/50:is(.dark *):hover{background-color:color-mix(in oklab,var(--cio-input) 50%,transparent)}}}.cio\\:dark\\:focus-visible\\:ring-destructive\\/40:is(.dark *):focus-visible{--tw-ring-color: var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:focus-visible\\:ring-destructive\\/40:is(.dark *):focus-visible{--tw-ring-color: color-mix(in oklab, var(--cio-destructive) 40%, transparent)}}.cio\\:dark\\:aria-invalid\\:ring-destructive\\/40:is(.dark *)[aria-invalid=true]{--tw-ring-color: var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:aria-invalid\\:ring-destructive\\/40:is(.dark *)[aria-invalid=true]{--tw-ring-color: color-mix(in oklab, var(--cio-destructive) 40%, transparent)}}.cio\\:\\[\\&_svg\\]\\:pointer-events-none svg{pointer-events:none}.cio\\:\\[\\&_svg\\]\\:size-4 svg{width:calc(var(--cio-spacing) * 4);height:calc(var(--cio-spacing) * 4)}.cio\\:\\[\\&_svg\\]\\:shrink-0 svg{flex-shrink:0}.cio\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'cio\\:size-\\'\\]\\)\\]\\:size-3 svg:not([class*="cio:size-"]){width:calc(var(--cio-spacing) * 3);height:calc(var(--cio-spacing) * 3)}.cio\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'cio\\:size-\\'\\]\\)\\]\\:size-4 svg:not([class*="cio:size-"]){width:calc(var(--cio-spacing) * 4);height:calc(var(--cio-spacing) * 4)}}@property --tw-animation-delay{syntax: "*"; inherits: false; initial-value: 0s;}@property --tw-animation-direction{syntax: "*"; inherits: false; initial-value: normal;}@property --tw-animation-duration{syntax: "*"; inherits: false;}@property --tw-animation-fill-mode{syntax: "*"; inherits: false; initial-value: none;}@property --tw-animation-iteration-count{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-enter-blur{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-enter-opacity{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-enter-rotate{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-enter-scale{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-enter-translate-x{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-enter-translate-y{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-exit-blur{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-exit-opacity{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-exit-rotate{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-exit-scale{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-exit-translate-x{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-exit-translate-y{syntax: "*"; inherits: false; initial-value: 0;}.cio-components{font-family:Inter,sans-serif;box-sizing:border-box}.cio-components p,.cio-components h3{margin:0}[data-slot=card-header].cio\\:border-b{padding-bottom:calc(var(--cio-spacing) * 6)}[data-slot=card-footer].cio\\:border-t{padding-top:calc(var(--cio-spacing) * 6)}@layer base{:root{--cio-radius: .625rem;--cio-background: oklch(1 0 0);--cio-foreground: oklch(.145 0 0);--cio-card: oklch(1 0 0);--cio-card-foreground: oklch(.145 0 0);--cio-popover: oklch(1 0 0);--cio-popover-foreground: oklch(.145 0 0);--cio-primary: oklch(.1969 .0101 276.49);--cio-primary-foreground: oklch(.985 0 0);--cio-secondary: oklch(.949 .007 268.55);--cio-secondary-foreground: oklch(.205 0 0);--cio-muted: oklch(.97 0 0);--cio-muted-foreground: oklch(.556 0 0);--cio-accent: oklch(.97 0 0);--cio-accent-foreground: oklch(.205 0 0);--cio-destructive: oklch(.577 .245 27.325);--cio-border: oklch(.922 0 0);--cio-input: oklch(.922 0 0);--cio-ring: oklch(.708 0 0);--cio-chart-1: oklch(.646 .222 41.116);--cio-chart-2: oklch(.6 .118 184.704);--cio-chart-3: oklch(.398 .07 227.392);--cio-chart-4: oklch(.828 .189 84.429);--cio-chart-5: oklch(.769 .188 70.08);--cio-sidebar: oklch(.985 0 0);--cio-sidebar-foreground: oklch(.145 0 0);--cio-sidebar-primary: oklch(.205 0 0);--cio-sidebar-primary-foreground: oklch(.985 0 0);--cio-sidebar-accent: oklch(.97 0 0);--cio-sidebar-accent-foreground: oklch(.205 0 0);--cio-sidebar-border: oklch(.922 0 0);--cio-sidebar-ring: oklch(.708 0 0)}.dark{--cio-background: oklch(.145 0 0);--cio-foreground: oklch(.985 0 0);--cio-card: oklch(.205 0 0);--cio-card-foreground: oklch(.985 0 0);--cio-popover: oklch(.205 0 0);--cio-popover-foreground: oklch(.985 0 0);--cio-primary: oklch(.922 0 0);--cio-primary-foreground: oklch(.205 0 0);--cio-secondary: oklch(.269 0 0);--cio-secondary-foreground: oklch(.985 0 0);--cio-muted: oklch(.269 0 0);--cio-muted-foreground: oklch(.708 0 0);--cio-accent: oklch(.269 0 0);--cio-accent-foreground: oklch(.985 0 0);--cio-destructive: oklch(.704 .191 22.216);--cio-border: oklch(1 0 0 / 10%);--cio-input: oklch(1 0 0 / 15%);--cio-ring: oklch(.556 0 0);--cio-chart-1: oklch(.488 .243 264.376);--cio-chart-2: oklch(.696 .17 162.48);--cio-chart-3: oklch(.769 .188 70.08);--cio-chart-4: oklch(.627 .265 303.9);--cio-chart-5: oklch(.645 .246 16.439);--cio-sidebar: oklch(.205 0 0);--cio-sidebar-foreground: oklch(.985 0 0);--cio-sidebar-primary: oklch(.488 .243 264.376);--cio-sidebar-primary-foreground: oklch(.985 0 0);--cio-sidebar-accent: oklch(.269 0 0);--cio-sidebar-accent-foreground: oklch(.985 0 0);--cio-sidebar-border: oklch(1 0 0 / 10%);--cio-sidebar-ring: oklch(.556 0 0)}}@property --tw-rotate-x{syntax: "*"; inherits: false;}@property --tw-rotate-y{syntax: "*"; inherits: false;}@property --tw-rotate-z{syntax: "*"; inherits: false;}@property --tw-skew-x{syntax: "*"; inherits: false;}@property --tw-skew-y{syntax: "*"; inherits: false;}@property --tw-space-y-reverse{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-border-style{syntax: "*"; inherits: false; initial-value: solid;}@property --tw-gradient-position{syntax: "*"; inherits: false;}@property --tw-gradient-from{syntax: "<color>"; inherits: false; initial-value: #0000;}@property --tw-gradient-via{syntax: "<color>"; inherits: false; initial-value: #0000;}@property --tw-gradient-to{syntax: "<color>"; inherits: false; initial-value: #0000;}@property --tw-gradient-stops{syntax: "*"; inherits: false;}@property --tw-gradient-via-stops{syntax: "*"; inherits: false;}@property --tw-gradient-from-position{syntax: "<length-percentage>"; inherits: false; initial-value: 0%;}@property --tw-gradient-via-position{syntax: "<length-percentage>"; inherits: false; initial-value: 50%;}@property --tw-gradient-to-position{syntax: "<length-percentage>"; inherits: false; initial-value: 100%;}@property --tw-leading{syntax: "*"; inherits: false;}@property --tw-font-weight{syntax: "*"; inherits: false;}@property --tw-tracking{syntax: "*"; inherits: false;}@property --tw-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: "*"; inherits: false;}@property --tw-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: "*"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: "*"; inherits: false;}@property --tw-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: "*"; inherits: false;}@property --tw-inset-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: "*"; inherits: false;}@property --tw-ring-offset-width{syntax: "<length>"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: "*"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-duration{syntax: "*"; inherits: false;}@property --tw-scale-x{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-scale-y{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-scale-z{syntax: "*"; inherits: false; initial-value: 1;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x: initial;--tw-rotate-y: initial;--tw-rotate-z: initial;--tw-skew-x: initial;--tw-skew-y: initial;--tw-space-y-reverse: 0;--tw-border-style: solid;--tw-gradient-position: initial;--tw-gradient-from: #0000;--tw-gradient-via: #0000;--tw-gradient-to: #0000;--tw-gradient-stops: initial;--tw-gradient-via-stops: initial;--tw-gradient-from-position: 0%;--tw-gradient-via-position: 50%;--tw-gradient-to-position: 100%;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-duration: initial;--tw-scale-x: 1;--tw-scale-y: 1;--tw-scale-z: 1;--tw-animation-delay: 0s;--tw-animation-direction: normal;--tw-animation-duration: initial;--tw-animation-fill-mode: none;--tw-animation-iteration-count: 1;--tw-enter-blur: 0;--tw-enter-opacity: 1;--tw-enter-rotate: 0;--tw-enter-scale: 1;--tw-enter-translate-x: 0;--tw-enter-translate-y: 0;--tw-exit-blur: 0;--tw-exit-opacity: 1;--tw-exit-rotate: 0;--tw-exit-scale: 1;--tw-exit-translate-x: 0;--tw-exit-translate-y: 0}}}.cio-asa-button.cio-button{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:4px;border:none;border-radius:6px;cursor:pointer;box-shadow:0 6px 14px #1212691c,0 2px 4px #12126912,0 1px 2px #1212690e;transition:opacity .2s}.cio-asa-button.cio-button:hover{opacity:.9}.cio-asa-button.cio-button:active{opacity:.8}.cio-asa-button--dark.cio-button{background:#14151a;color:#fff}.cio-asa-button--light.cio-button{background:#fff;color:#14151a}.cio-asa-button--sm.cio-button{height:32px;padding:8px 12px 8px 8px}.cio-asa-button--lg.cio-button{height:40px;padding:10px 16px 10px 12px}.cio-asa-button__icon{width:16px;height:16px;flex:none}.cio-asa-button__label{font-weight:600;font-size:13px;line-height:16px;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;white-space:nowrap}.cio-asa-chat{display:flex;flex-direction:column;width:100%;height:100%;background:#f8f9fc;overflow:hidden;position:relative;animation:cio-asa-fade-in .4s ease}.cio-asa-chat-body{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.cio-asa-chat-view{display:flex;flex-direction:column;flex:1;overflow:hidden}.cio-asa-chat-view--welcome{animation:cio-asa-fade-in .3s ease}.cio-asa-chat-view--chat{animation:cio-asa-fade-in .3s ease;position:relative}.cio-asa-chat-overlay{position:fixed;top:0;right:0;bottom:0;left:0;border:none;padding:0;margin:0;cursor:pointer;background:#0006;z-index:999;animation:cio-asa-fade-in .2s ease}.cio-asa-chat-panel{position:fixed;top:0;right:0;bottom:0;width:420px;z-index:1000;animation:cio-asa-slide-in-right .3s ease}.cio-asa-chat-panel .cio-asa-chat{height:100%}@keyframes cio-asa-fade-in{0%{opacity:0}to{opacity:1}}@keyframes cio-asa-slide-in-right{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes cio-asa-slide-in-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.cio-asa-chat-fullscreen{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1000;overflow:hidden;animation:cio-asa-fade-in .4s ease}.cio-asa-chat-fullscreen--right{inset:0 0 0 auto;width:504px;animation:cio-asa-slide-in-right .4s ease .2s both}.cio-asa-chat-header{display:flex;align-items:center;justify-content:flex-end;padding:16px 20px;position:relative;flex-shrink:0;border-bottom:1px solid rgba(222,224,227,1);background:#fff}.cio-asa-chat-header__title{position:absolute;left:50%;transform:translate(-50%);font-weight:600;font-size:16px;line-height:1;color:#0f1324}.cio-asa-chat-header__close{background:none;border:none;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;color:#1a1a1a;font-size:20px;line-height:1}.cio-asa-chat-header__close:before{content:"✕"}.cio-asa-chat-header__close:hover{opacity:.7}.cio-asa-welcome-screen{display:flex;flex-direction:column;flex:1;padding:20px;position:relative}.cio-asa-welcome-screen__close{position:absolute;top:16px;right:20px;background:none;border:none;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;color:#1a1a1a;font-size:20px;line-height:1;z-index:1}.cio-asa-welcome-screen__close:hover{opacity:.7}.cio-asa-welcome-screen__content{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;width:100%;max-width:504px;margin:0 auto}@media (max-width: 768px){.cio-asa-welcome-screen__content{max-width:366px}}.cio-asa-welcome-screen__title{font-weight:400;font-size:26px;line-height:32px;text-align:center;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;color:#000;margin:0;align-self:stretch}.cio-asa-welcome-screen__input-row{display:flex;flex-direction:row;align-items:center;padding:8px 8px 8px 12px;gap:12px;width:100%;height:40px;margin-top:32px;background:#fff;border:1px solid #DEE0E3;box-shadow:inset 1px 1px 2px #1212691a,inset 0 1px 4px #1212690d,inset 1px 1px 1px #1212690d;border-radius:4px;box-sizing:border-box}.cio-asa-welcome-screen__input{flex:1;padding:0;border:none;font-weight:400;font-size:14px;line-height:16px;letter-spacing:-.005em;color:#0f1324;outline:none;background:transparent}.cio-asa-welcome-screen__input::placeholder{color:#0f1324b3}.cio-asa-welcome-screen__input-row:hover{border-color:#c8cad0}.cio-asa-welcome-screen__input-row:focus-within{border-color:#a980ff;box-shadow:0 0 0 2px #c9b0feb3}.cio-asa-welcome-screen__input-row:active{border-color:#000;box-shadow:inset 0 1px 4px #12126924,inset 2.1px 2px 2px #1212691a,inset 0 1.5px 3px #1212690d}.cio-asa-welcome-screen__input-row--disabled{border-color:#e9eaec;box-shadow:none;pointer-events:none}.cio-asa-welcome-screen__input-row--disabled .cio-asa-welcome-screen__send-btn{background:#e9eaec;box-shadow:none;color:#0a0f2940;cursor:default}.cio-asa-welcome-screen__input-row--disabled .cio-asa-welcome-screen__send-btn svg path{fill:#0a0f2940}.cio-asa-welcome-screen__send-btn{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0 8px;gap:6px;height:24px;background:#14151a;box-shadow:0 .4px 1px #12126921,0 .9px 6px #1212690d,0 1px 3px #1212690d;border-radius:4px;border:none;cursor:pointer;font-weight:500;font-size:13px;line-height:16px;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;color:#fff;white-space:nowrap;flex-shrink:0}.cio-asa-welcome-screen__send-btn:hover{background:#333}.cio-asa-welcome-screen__suggestions{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));column-gap:16px;row-gap:11px;width:100%;margin-top:20px;animation:cio-asa-fade-in .5s ease .5s both}.cio-asa-welcome-screen__suggestion-chip{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:18px 16px;background:#fff;box-shadow:0 .4px 1px #12126921,0 .9px 6px #1212690d,0 1px 3px #1212690d;border-radius:12px;border:1px solid transparent;cursor:pointer;font-weight:400;font-size:12px;line-height:20px;text-align:center;color:#343434;box-sizing:border-box;transition:background-color .2s,box-shadow .2s,border-color .2s}.cio-asa-welcome-screen__suggestion-chip:hover{background:#fff;border-color:#fff;box-shadow:0 6px 14px #1212691c,0 2px 4px #12126912,0 1px 2px #1212690e}.cio-asa-welcome-screen__suggestion-chip:active{background:#e0e3eb;border-color:#dee0e3;box-shadow:inset 1px 1px 2px #1212691a,inset 0 1px 4px #1212690d,inset 1px 1px 1px #1212690d}.cio-asa-welcome-screen__terms{font-size:11px;color:#999;text-align:center;padding-top:16px;max-width:504px;margin:0 auto}.cio-asa-welcome-screen__terms a{color:#666;text-decoration:underline}.cio-asa-chat-message-list{flex:1;overflow-y:auto;padding:32px 12px 80px;display:flex;flex-direction:column;gap:16px;max-width:508px;width:100%;margin:0 auto;box-sizing:border-box;scrollbar-width:none}.cio-asa-chat-message-list::-webkit-scrollbar{display:none}.cio-asa-ai-message-group{display:flex;flex-direction:column;gap:12px}.cio-asa-user-message{display:flex;justify-content:flex-end;padding-left:12px}.cio-asa-user-message__bubble{display:inline-flex;flex-direction:row;justify-content:flex-end;align-items:center;padding:13px 12px;gap:8px;background:#09090ce6;border-radius:8px 0 8px 8px;font-weight:400;font-size:14px;line-height:16px;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;color:#fff;max-width:100%;word-wrap:break-word;text-align:left}.cio-asa-ai-message{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding-right:12px}.cio-asa-ai-message__bubble{display:flex;flex-direction:column;align-items:flex-start;padding:12px;gap:8px;background:#eceef3;border-radius:6px;width:100%;box-sizing:border-box}.cio-asa-ai-message__bubble--error{background:#fdecec}.cio-asa-ai-message__text{font-weight:400;font-size:14px;line-height:20px;letter-spacing:-.005em;color:#0f1324}.cio-asa-ai-message__bubble--error .cio-asa-ai-message__text{color:#b42318}.cio-asa-typing-indicator{display:flex;flex-direction:column;align-items:flex-start;padding:12px;gap:8px;background:#eceef3;border-radius:6px}.cio-asa-typing-indicator__dots{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:6px}.cio-asa-typing-indicator__dot{width:8px;height:8px;background:#c8cad0;border-radius:50%;animation:cio-asa-typing-bounce 1.4s infinite ease-in-out both}.cio-asa-typing-indicator__dot:nth-child(1){background:#0f132499;animation-delay:-.32s}.cio-asa-typing-indicator__dot:nth-child(2){animation-delay:-.16s}.cio-asa-typing-indicator__dot:nth-child(3){animation-delay:0s}@keyframes cio-asa-typing-bounce{0%,80%,to{transform:scale(.8);opacity:.5}40%{transform:scale(1);opacity:1}}.cio-asa-chat-input-wrapper{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;padding:24px 12px 16px;background:linear-gradient(to bottom,#f8f9fc00,#f8f9fc 40%);pointer-events:none;z-index:10}.cio-asa-chat-input{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:4px 12px;gap:12px;height:40px;max-width:508px;width:100%;background:#fff;border:1px solid #DEE0E3;box-shadow:0 6px 14px #1212691c,0 2px 4px #12126912,0 1px 2px #1212690e;border-radius:4px;box-sizing:border-box;pointer-events:all}.cio-asa-chat-input:hover{border-color:#c8cad0}.cio-asa-chat-input:focus-within{border-color:#000}.cio-asa-chat-input__field{flex:1;padding:0;border:none;font-weight:400;font-size:14px;line-height:16px;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;color:#0f1324;outline:none;background:transparent}.cio-asa-chat-input__field::placeholder{color:#0f1324b3}.cio-asa-chat-input__field:disabled{cursor:not-allowed}.cio-asa-chat-input__send{display:flex;justify-content:center;align-items:center;width:16px;height:16px;background:none;border:none;cursor:pointer;flex-shrink:0;padding:0}.cio-asa-chat-input__send:hover:not(:disabled) svg path{stroke:#0f1324;stroke-opacity:1}.cio-asa-chat-input__send:disabled{cursor:default;opacity:.3}.cio-asa-results-block{display:flex;flex-direction:column;gap:20px;width:100%}.cio-asa-results-group{display:flex;flex-direction:column;gap:12px}.cio-asa-results-group__label{font-size:14px;font-weight:600;color:#1a1a1a;margin:0}.cio-asa-product-card.cio-product-card{display:flex;flex-direction:column;gap:6px;cursor:pointer;width:100%;height:100%;min-width:unset;max-width:unset;border:none;border-radius:0;box-shadow:none;padding:0;background:transparent}.cio-asa-product-card .cio-asa-product-card__image-wrapper.cio-product-card-image-section{position:relative;width:100%;aspect-ratio:var(--cio-asa-image-ratio, 3 / 4);border-radius:6px;overflow:hidden;background-color:#f3f4f6;flex-shrink:0}.cio-asa-product-card .cio-asa-product-card__image-wrapper .cio-product-card-image{width:100%;height:100%;object-fit:cover;display:block;min-height:unset;border-radius:0}.cio-asa-product-card .cio-asa-product-card__badge{position:absolute;top:8px;left:8px;display:flex;justify-content:center;align-items:center;padding:0 4px;min-width:35px;max-width:120px;height:20px;background:#dc2626;color:#fff;font-size:13px;font-weight:500;line-height:16px;text-align:center;letter-spacing:-.005em;border-radius:4px;border:none;z-index:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cio-asa-product-card .cio-asa-product-card__info.cio-product-card-content{display:flex;flex-direction:column;gap:2px;flex:1;padding:0}.cio-asa-product-card .cio-asa-product-card__name.cio-product-card-title-section{font-size:12px;line-height:1.3;color:#1a1a1a;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0;min-height:calc(2 * 12px * 1.3)}.cio-asa-product-card__description{font-size:11px;line-height:1.3;color:#6b7280;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section{display:flex;align-items:baseline;gap:4px}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section span{word-spacing:-1ch}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section span:first-child{font-size:14px;font-weight:700;color:#1a1a1a}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section span:first-child:not(:only-child){color:#dc2626;order:2}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section span:last-child:not(:first-child){font-size:12px;color:#9ca3af;text-decoration:line-through;font-weight:400;order:1}.cio-asa-results-group [data-slot=carousel-content]{padding:0!important}.cio-asa-results-group [data-slot=carousel-item]{min-width:0!important;align-self:stretch}.cio-asa-results-group [data-slot=carousel-track]{padding-left:0!important}.cio-asa-product-card .cio-asa-product-card__add-to-cart.cio-product-card-add-to-cart-btn{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px;padding:4px 12px 6px;font-size:14px;font-weight:500;line-height:16px;letter-spacing:-.005em;color:#14151a;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;width:100%;margin-top:auto;transition:background-color .15s}.cio-asa-product-card .cio-asa-product-card__add-to-cart.cio-product-card-add-to-cart-btn:before{content:"";display:inline-block;width:16px;height:16px;flex-shrink:0;background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.0311 8.66659C11.5311 8.66659 11.9711 8.39325 12.1977 7.97992L14.5844 3.65325C14.8311 3.21325 14.5111 2.66659 14.0044 2.66659H4.13772L3.51105 1.33325H1.33105V2.66659H2.66439L5.06439 7.72659L4.16439 9.35325C3.67772 10.2466 4.31772 11.3333 5.33105 11.3333H13.3311V9.99992H5.33105L6.06439 8.66659H11.0311ZM4.77105 3.99992H12.8711L11.0311 7.33325H6.35105L4.77105 3.99992ZM5.33105 11.9999C4.59772 11.9999 4.00439 12.5999 4.00439 13.3333C4.00439 14.0666 4.59772 14.6666 5.33105 14.6666C6.06439 14.6666 6.66439 14.0666 6.66439 13.3333C6.66439 12.5999 6.06439 11.9999 5.33105 11.9999ZM11.9977 11.9999C11.2644 11.9999 10.6711 12.5999 10.6711 13.3333C10.6711 14.0666 11.2644 14.6666 11.9977 14.6666C12.7311 14.6666 13.3311 14.0666 13.3311 13.3333C13.3311 12.5999 12.7311 11.9999 11.9977 11.9999Z' fill='%230F1324' fill-opacity='0.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:16px 16px}.cio-asa-product-card .cio-asa-product-card__add-to-cart.cio-product-card-add-to-cart-btn:hover{background:#e5e7eb;color:#14151a}.cio-asa-results-group__view-more{display:inline-flex;align-items:center;gap:11px;font-size:13px;color:#1a1a1a;text-decoration:none;cursor:pointer;background:none;border:none;padding:0;font-family:inherit;width:fit-content}.cio-asa-results-group__view-more-text{text-decoration:none;border-bottom:1px solid currentColor;line-height:1.2}.cio-asa,.cio-asa *{font-family:var(--cio-asa-font-family, "Inter", sans-serif)}.cio-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cio-asa button:focus-visible,.cio-asa [role=button]:focus-visible{outline:2px solid #A980FF;outline-offset:2px}`)),document.head.appendChild(o)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
1
+ (function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.id="cio-asa-styles",o.appendChild(document.createTextNode(`@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap";/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;@layer theme{:root,:host{--cio-color-red-200: oklch(88.5% .062 18.334);--cio-color-red-500: oklch(63.7% .237 25.331);--cio-color-red-600: oklch(57.7% .245 27.325);--cio-color-orange-500: oklch(70.5% .213 47.604);--cio-color-yellow-500: oklch(79.5% .184 86.047);--cio-color-green-600: oklch(62.7% .194 149.214);--cio-color-emerald-50: oklch(97.9% .021 166.113);--cio-color-emerald-100: oklch(95% .052 163.051);--cio-color-emerald-200: oklch(90.5% .093 164.15);--cio-color-emerald-300: oklch(84.5% .143 164.978);--cio-color-emerald-600: oklch(59.6% .145 163.225);--cio-color-emerald-800: oklch(43.2% .095 166.913);--cio-color-teal-50: oklch(98.4% .014 180.72);--cio-color-blue-50: oklch(97% .014 254.604);--cio-color-blue-100: oklch(93.2% .032 255.585);--cio-color-blue-200: oklch(88.2% .059 254.128);--cio-color-blue-500: oklch(62.3% .214 259.815);--cio-color-blue-600: oklch(54.6% .245 262.881);--cio-color-blue-700: oklch(48.8% .243 264.376);--cio-color-blue-800: oklch(42.4% .199 265.638);--cio-color-indigo-50: oklch(96.2% .018 272.314);--cio-color-indigo-100: oklch(93% .034 272.788);--cio-color-indigo-600: oklch(51.1% .262 276.966);--cio-color-indigo-700: oklch(45.7% .24 277.023);--cio-color-purple-50: oklch(97.7% .014 308.299);--cio-color-purple-100: oklch(94.6% .033 307.174);--cio-color-purple-500: oklch(62.7% .265 303.9);--cio-color-purple-600: oklch(55.8% .288 302.321);--cio-color-purple-700: oklch(49.6% .265 301.924);--cio-color-purple-800: oklch(43.8% .218 303.724);--cio-color-pink-500: oklch(65.6% .241 354.308);--cio-color-pink-600: oklch(59.2% .249 .584);--cio-color-slate-50: oklch(98.4% .003 247.858);--cio-color-slate-100: oklch(96.8% .007 247.896);--cio-color-slate-200: oklch(92.9% .013 255.508);--cio-color-slate-300: oklch(86.9% .022 252.894);--cio-color-slate-500: oklch(55.4% .046 257.417);--cio-color-slate-700: oklch(37.2% .044 257.287);--cio-color-slate-900: oklch(20.8% .042 265.755);--cio-color-slate-950: oklch(12.9% .042 264.695);--cio-color-gray-50: oklch(98.5% .002 247.839);--cio-color-gray-100: oklch(96.7% .003 264.542);--cio-color-gray-200: oklch(92.8% .006 264.531);--cio-color-gray-400: oklch(70.7% .022 261.325);--cio-color-gray-500: oklch(55.1% .027 264.364);--cio-color-gray-600: oklch(44.6% .03 256.802);--cio-color-gray-700: oklch(37.3% .034 259.733);--cio-color-gray-800: oklch(27.8% .033 256.848);--cio-color-neutral-100: oklch(97% 0 0);--cio-color-black: #000;--cio-color-white: #fff;--cio-spacing: .25rem;--cio-container-sm: 24rem;--cio-container-lg: 32rem;--cio-text-xs: .75rem;--cio-text-xs--line-height: calc(1 / .75);--cio-text-sm: .875rem;--cio-text-sm--line-height: calc(1.25 / .875);--cio-text-base: 1rem;--cio-text-base--line-height: 1.5 ;--cio-text-lg: 1.125rem;--cio-text-lg--line-height: calc(1.75 / 1.125);--cio-text-xl: 1.25rem;--cio-text-xl--line-height: calc(1.75 / 1.25);--cio-text-2xl: 1.5rem;--cio-text-2xl--line-height: calc(2 / 1.5);--cio-font-weight-medium: 500;--cio-font-weight-semibold: 600;--cio-font-weight-bold: 700;--cio-tracking-tighter: -.05em;--cio-tracking-wide: .025em;--cio-radius-2xl: 1rem;--cio-radius-3xl: 1.5rem;--cio-default-transition-duration: .15s;--cio-default-transition-timing-function: cubic-bezier(.4, 0, .2, 1)}}@layer utilities{.cio\\:\\@container\\/card-header{container-type:inline-size;container-name:card-header}.cio\\:pointer-events-none{pointer-events:none}.cio\\:invisible{visibility:hidden}.cio\\:sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0}.cio\\:absolute{position:absolute}.cio\\:relative{position:relative}.cio\\:top-2{top:calc(var(--cio-spacing) * 2)}.cio\\:top-3{top:calc(var(--cio-spacing) * 3)}.cio\\:right-2{right:calc(var(--cio-spacing) * 2)}.cio\\:right-3{right:calc(var(--cio-spacing) * 3)}.cio\\:left-2{left:calc(var(--cio-spacing) * 2)}.cio\\:col-start-2{grid-column-start:2}.cio\\:row-span-2{grid-row:span 2 / span 2}.cio\\:row-start-1{grid-row-start:1}.cio\\:m-0{margin:calc(var(--cio-spacing) * 0)}.cio\\:mx-2{margin-inline:calc(var(--cio-spacing) * 2)}.cio\\:my-2{margin-block:calc(var(--cio-spacing) * 2)}.cio\\:mt-1{margin-top:calc(var(--cio-spacing) * 1)}.cio\\:mt-2{margin-top:calc(var(--cio-spacing) * 2)}.cio\\:mt-3{margin-top:calc(var(--cio-spacing) * 3)}.cio\\:mt-auto{margin-top:auto}.cio\\:mr-2{margin-right:calc(var(--cio-spacing) * 2)}.cio\\:mr-4{margin-right:calc(var(--cio-spacing) * 4)}.cio\\:mb-2{margin-bottom:calc(var(--cio-spacing) * 2)}.cio\\:mb-3{margin-bottom:calc(var(--cio-spacing) * 3)}.cio\\:mb-4{margin-bottom:calc(var(--cio-spacing) * 4)}.cio\\:ml-1{margin-left:calc(var(--cio-spacing) * 1)}.cio\\:ml-2{margin-left:calc(var(--cio-spacing) * 2)}.cio\\:ml-4{margin-left:calc(var(--cio-spacing) * 4)}.cio\\:line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.cio\\:line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.cio\\:flex{display:flex}.cio\\:grid{display:grid}.cio\\:hidden{display:none}.cio\\:inline-flex{display:inline-flex}.cio\\:size-6{width:calc(var(--cio-spacing) * 6);height:calc(var(--cio-spacing) * 6)}.cio\\:size-9{width:calc(var(--cio-spacing) * 9);height:calc(var(--cio-spacing) * 9)}.cio\\:h-3{height:calc(var(--cio-spacing) * 3)}.cio\\:h-4{height:calc(var(--cio-spacing) * 4)}.cio\\:h-5{height:calc(var(--cio-spacing) * 5)}.cio\\:h-6{height:calc(var(--cio-spacing) * 6)}.cio\\:h-8{height:calc(var(--cio-spacing) * 8)}.cio\\:h-10{height:calc(var(--cio-spacing) * 10)}.cio\\:h-12{height:calc(var(--cio-spacing) * 12)}.cio\\:h-14{height:calc(var(--cio-spacing) * 14)}.cio\\:h-16{height:calc(var(--cio-spacing) * 16)}.cio\\:h-24{height:calc(var(--cio-spacing) * 24)}.cio\\:h-32{height:calc(var(--cio-spacing) * 32)}.cio\\:h-\\[400px\\]{height:400px}.cio\\:h-full{height:100%}.cio\\:min-h-5{min-height:calc(var(--cio-spacing) * 5)}.cio\\:min-h-\\[224px\\]{min-height:224px}.cio\\:w-3{width:calc(var(--cio-spacing) * 3)}.cio\\:w-4{width:calc(var(--cio-spacing) * 4)}.cio\\:w-5{width:calc(var(--cio-spacing) * 5)}.cio\\:w-6{width:calc(var(--cio-spacing) * 6)}.cio\\:w-8{width:calc(var(--cio-spacing) * 8)}.cio\\:w-14{width:calc(var(--cio-spacing) * 14)}.cio\\:w-16{width:calc(var(--cio-spacing) * 16)}.cio\\:w-24{width:calc(var(--cio-spacing) * 24)}.cio\\:w-\\[200px\\]{width:200px}.cio\\:w-\\[220px\\]{width:220px}.cio\\:w-\\[240px\\]{width:240px}.cio\\:w-\\[260px\\]{width:260px}.cio\\:w-full{width:100%}.cio\\:max-w-\\[256px\\]{max-width:256px}.cio\\:max-w-lg{max-width:var(--cio-container-lg)}.cio\\:max-w-sm{max-width:var(--cio-container-sm)}.cio\\:min-w-4{min-width:calc(var(--cio-spacing) * 4)}.cio\\:min-w-5{min-width:calc(var(--cio-spacing) * 5)}.cio\\:min-w-6{min-width:calc(var(--cio-spacing) * 6)}.cio\\:min-w-\\[176px\\]{min-width:176px}.cio\\:flex-1{flex:1}.cio\\:flex-shrink-0,.cio\\:shrink-0{flex-shrink:0}.cio\\:grow{flex-grow:1}.cio\\:grow-0{flex-grow:0}.cio\\:basis-full{flex-basis:100%}.cio\\:rotate-90{rotate:90deg}.cio\\:transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.cio\\:cursor-pointer{cursor:pointer}.cio\\:list-none{list-style-type:none}.cio\\:auto-rows-min{grid-auto-rows:min-content}.cio\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.cio\\:grid-rows-\\[auto_auto\\]{grid-template-rows:auto auto}.cio\\:flex-col{flex-direction:column}.cio\\:flex-row{flex-direction:row}.cio\\:flex-wrap{flex-wrap:wrap}.cio\\:items-baseline{align-items:baseline}.cio\\:items-center{align-items:center}.cio\\:items-end{align-items:flex-end}.cio\\:items-start{align-items:flex-start}.cio\\:items-stretch{align-items:stretch}.cio\\:justify-between{justify-content:space-between}.cio\\:justify-center{justify-content:center}.cio\\:gap-1{gap:calc(var(--cio-spacing) * 1)}.cio\\:gap-1\\.5{gap:calc(var(--cio-spacing) * 1.5)}.cio\\:gap-2{gap:calc(var(--cio-spacing) * 2)}.cio\\:gap-3{gap:calc(var(--cio-spacing) * 3)}.cio\\:gap-4{gap:calc(var(--cio-spacing) * 4)}:where(.cio\\:space-y-1>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--cio-spacing) * 1) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--cio-spacing) * 1) * calc(1 - var(--tw-space-y-reverse)))}:where(.cio\\:space-y-2>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--cio-spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--cio-spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.cio\\:space-y-3>:not(:last-child)){--tw-space-y-reverse: 0;margin-block-start:calc(calc(var(--cio-spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--cio-spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}.cio\\:self-center{align-self:center}.cio\\:self-start{align-self:flex-start}.cio\\:justify-self-end{justify-self:flex-end}.cio\\:overflow-hidden{overflow:hidden}.cio\\:rounded{border-radius:.25rem}.cio\\:rounded-2xl{border-radius:var(--cio-radius-2xl)}.cio\\:rounded-3xl{border-radius:var(--cio-radius-3xl)}.cio\\:rounded-full{border-radius:calc(infinity * 1px)}.cio\\:rounded-lg{border-radius:var(--cio-radius)}.cio\\:rounded-md{border-radius:calc(var(--cio-radius) - 2px)}.cio\\:rounded-none{border-radius:0}.cio\\:rounded-sm{border-radius:calc(var(--cio-radius) - 4px)}.cio\\:rounded-xl{border-radius:calc(var(--cio-radius) + 4px)}.cio\\:border{border-style:var(--tw-border-style);border-width:1px}.cio\\:border-0{border-style:var(--tw-border-style);border-width:0px}.cio\\:border-2{border-style:var(--tw-border-style);border-width:2px}.cio\\:border-4{border-style:var(--tw-border-style);border-width:4px}.cio\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.cio\\:border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.cio\\:border-black\\/20{border-color:var(--cio-color-black)}@supports (color: color-mix(in lab,red,red)){.cio\\:border-black\\/20{border-color:color-mix(in oklab,var(--cio-color-black) 20%,transparent)}}.cio\\:border-blue-200{border-color:var(--cio-color-blue-200)}.cio\\:border-blue-600{border-color:var(--cio-color-blue-600)}.cio\\:border-emerald-200{border-color:var(--cio-color-emerald-200)}.cio\\:border-gray-200{border-color:var(--cio-color-gray-200)}.cio\\:border-slate-200{border-color:var(--cio-color-slate-200)}.cio\\:border-slate-500{border-color:var(--cio-color-slate-500)}.cio\\:border-slate-700{border-color:var(--cio-color-slate-700)}.cio\\:border-transparent{border-color:transparent}.cio\\:border-white{border-color:var(--cio-color-white)}.cio\\:bg-background{background-color:var(--cio-background)}.cio\\:bg-black{background-color:var(--cio-color-black)}.cio\\:bg-blue-100{background-color:var(--cio-color-blue-100)}.cio\\:bg-blue-500{background-color:var(--cio-color-blue-500)}.cio\\:bg-blue-600{background-color:var(--cio-color-blue-600)}.cio\\:bg-card{background-color:var(--cio-card)}.cio\\:bg-destructive{background-color:var(--cio-destructive)}.cio\\:bg-emerald-100{background-color:var(--cio-color-emerald-100)}.cio\\:bg-gray-100{background-color:var(--cio-color-gray-100)}.cio\\:bg-gray-200{background-color:var(--cio-color-gray-200)}.cio\\:bg-indigo-600{background-color:var(--cio-color-indigo-600)}.cio\\:bg-primary{background-color:var(--cio-primary)}.cio\\:bg-purple-100{background-color:var(--cio-color-purple-100)}.cio\\:bg-purple-600{background-color:var(--cio-color-purple-600)}.cio\\:bg-red-500{background-color:var(--cio-color-red-500)}.cio\\:bg-secondary{background-color:var(--cio-secondary)}.cio\\:bg-slate-50{background-color:var(--cio-color-slate-50)}.cio\\:bg-slate-100{background-color:var(--cio-color-slate-100)}.cio\\:bg-slate-900{background-color:var(--cio-color-slate-900)}.cio\\:bg-slate-950\\/90{background-color:var(--cio-color-slate-950)}@supports (color: color-mix(in lab,red,red)){.cio\\:bg-slate-950\\/90{background-color:color-mix(in oklab,var(--cio-color-slate-950) 90%,transparent)}}.cio\\:bg-transparent{background-color:transparent}.cio\\:bg-white{background-color:var(--cio-color-white)}.cio\\:bg-gradient-to-br{--tw-gradient-position: to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.cio\\:bg-gradient-to-r{--tw-gradient-position: to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.cio\\:from-blue-50{--tw-gradient-from: var(--cio-color-blue-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-blue-500{--tw-gradient-from: var(--cio-color-blue-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-emerald-50{--tw-gradient-from: var(--cio-color-emerald-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-orange-500{--tw-gradient-from: var(--cio-color-orange-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-purple-50{--tw-gradient-from: var(--cio-color-purple-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:from-purple-500{--tw-gradient-from: var(--cio-color-purple-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-blue-50{--tw-gradient-to: var(--cio-color-blue-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-indigo-50{--tw-gradient-to: var(--cio-color-indigo-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-indigo-100{--tw-gradient-to: var(--cio-color-indigo-100);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-pink-500{--tw-gradient-to: var(--cio-color-pink-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-purple-50{--tw-gradient-to: var(--cio-color-purple-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-purple-600{--tw-gradient-to: var(--cio-color-purple-600);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-red-500{--tw-gradient-to: var(--cio-color-red-500);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:to-teal-50{--tw-gradient-to: var(--cio-color-teal-50);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.cio\\:object-cover{object-fit:cover}.cio\\:p-0\\.5{padding:calc(var(--cio-spacing) * .5)}.cio\\:p-1{padding:calc(var(--cio-spacing) * 1)}.cio\\:p-2{padding:calc(var(--cio-spacing) * 2)}.cio\\:p-3{padding:calc(var(--cio-spacing) * 3)}.cio\\:p-4{padding:calc(var(--cio-spacing) * 4)}.cio\\:p-6{padding:calc(var(--cio-spacing) * 6)}.cio\\:px-0{padding-inline:calc(var(--cio-spacing) * 0)}.cio\\:px-1{padding-inline:calc(var(--cio-spacing) * 1)}.cio\\:px-2{padding-inline:calc(var(--cio-spacing) * 2)}.cio\\:px-3{padding-inline:calc(var(--cio-spacing) * 3)}.cio\\:px-4{padding-inline:calc(var(--cio-spacing) * 4)}.cio\\:px-6{padding-inline:calc(var(--cio-spacing) * 6)}.cio\\:py-1{padding-block:calc(var(--cio-spacing) * 1)}.cio\\:py-2{padding-block:calc(var(--cio-spacing) * 2)}.cio\\:pt-2{padding-top:calc(var(--cio-spacing) * 2)}.cio\\:text-center{text-align:center}.cio\\:text-2xl{font-size:var(--cio-text-2xl);line-height:var(--tw-leading, var(--cio-text-2xl--line-height))}.cio\\:text-base{font-size:var(--cio-text-base);line-height:var(--tw-leading, var(--cio-text-base--line-height))}.cio\\:text-lg{font-size:var(--cio-text-lg);line-height:var(--tw-leading, var(--cio-text-lg--line-height))}.cio\\:text-sm{font-size:var(--cio-text-sm);line-height:var(--tw-leading, var(--cio-text-sm--line-height))}.cio\\:text-xl{font-size:var(--cio-text-xl);line-height:var(--tw-leading, var(--cio-text-xl--line-height))}.cio\\:text-xs{font-size:var(--cio-text-xs);line-height:var(--tw-leading, var(--cio-text-xs--line-height))}.cio\\:text-\\[11px\\]{font-size:11px}.cio\\:text-\\[13px\\]{font-size:13px}.cio\\:leading-3{--tw-leading: calc(var(--cio-spacing) * 3);line-height:calc(var(--cio-spacing) * 3)}.cio\\:leading-4{--tw-leading: calc(var(--cio-spacing) * 4);line-height:calc(var(--cio-spacing) * 4)}.cio\\:leading-none{--tw-leading: 1;line-height:1}.cio\\:font-bold{--tw-font-weight: var(--cio-font-weight-bold);font-weight:var(--cio-font-weight-bold)}.cio\\:font-medium{--tw-font-weight: var(--cio-font-weight-medium);font-weight:var(--cio-font-weight-medium)}.cio\\:font-semibold{--tw-font-weight: var(--cio-font-weight-semibold);font-weight:var(--cio-font-weight-semibold)}.cio\\:tracking-tighter{--tw-tracking: var(--cio-tracking-tighter);letter-spacing:var(--cio-tracking-tighter)}.cio\\:tracking-wide{--tw-tracking: var(--cio-tracking-wide);letter-spacing:var(--cio-tracking-wide)}.cio\\:break-words{overflow-wrap:break-word}.cio\\:whitespace-nowrap{white-space:nowrap}.cio\\:text-\\[\\#0A0F2940\\]{color:#0a0f2940}.cio\\:text-blue-600{color:var(--cio-color-blue-600)}.cio\\:text-blue-800{color:var(--cio-color-blue-800)}.cio\\:text-card-foreground{color:var(--cio-card-foreground)}.cio\\:text-emerald-300{color:var(--cio-color-emerald-300)}.cio\\:text-emerald-600{color:var(--cio-color-emerald-600)}.cio\\:text-emerald-800{color:var(--cio-color-emerald-800)}.cio\\:text-gray-400{color:var(--cio-color-gray-400)}.cio\\:text-gray-500{color:var(--cio-color-gray-500)}.cio\\:text-gray-600{color:var(--cio-color-gray-600)}.cio\\:text-gray-700{color:var(--cio-color-gray-700)}.cio\\:text-gray-800{color:var(--cio-color-gray-800)}.cio\\:text-green-600{color:var(--cio-color-green-600)}.cio\\:text-muted-foreground{color:var(--cio-muted-foreground)}.cio\\:text-primary{color:var(--cio-primary)}.cio\\:text-primary-foreground{color:var(--cio-primary-foreground)}.cio\\:text-purple-600{color:var(--cio-color-purple-600)}.cio\\:text-purple-700{color:var(--cio-color-purple-700)}.cio\\:text-purple-800{color:var(--cio-color-purple-800)}.cio\\:text-red-600{color:var(--cio-color-red-600)}.cio\\:text-secondary-foreground{color:var(--cio-secondary-foreground)}.cio\\:text-slate-300{color:var(--cio-color-slate-300)}.cio\\:text-slate-500{color:var(--cio-color-slate-500)}.cio\\:text-white{color:var(--cio-color-white)}.cio\\:text-yellow-500{color:var(--cio-color-yellow-500)}.cio\\:uppercase{text-transform:uppercase}.cio\\:line-through{text-decoration-line:line-through}.cio\\:underline{text-decoration-line:underline}.cio\\:underline-offset-4{text-underline-offset:4px}.cio\\:opacity-0{opacity:0%}.cio\\:opacity-90{opacity:90%}.cio\\:shadow-lg{--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-md{--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-none{--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-sm{--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-xl{--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:shadow-xs{--tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / .05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:transition-all{transition-property:all;transition-timing-function:var(--tw-ease, var(--cio-default-transition-timing-function));transition-duration:var(--tw-duration, var(--cio-default-transition-duration))}.cio\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--cio-default-transition-timing-function));transition-duration:var(--tw-duration, var(--cio-default-transition-duration))}.cio\\:transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease, var(--cio-default-transition-timing-function));transition-duration:var(--tw-duration, var(--cio-default-transition-duration))}.cio\\:duration-200{--tw-duration: .2s;transition-duration:.2s}.cio\\:duration-250{--tw-duration: .25s;transition-duration:.25s}.cio\\:outline-none{--tw-outline-style: none;outline-style:none}.cio\\:group-has-\\[input\\:checked\\]\\:opacity-100:is(:where(.cio\\:group):has(*:is(input:checked)) *){opacity:100%}.cio\\:group-has-\\[input\\:checked\\]\\:shadow-\\[inset_0_0_0_32px_\\#000\\]:is(:where(.cio\\:group):has(*:is(input:checked)) *){--tw-shadow: inset 0 0 0 32px var(--tw-shadow-color, #000);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}@media (hover: hover){.cio\\:hover\\:scale-105:hover{--tw-scale-x: 105%;--tw-scale-y: 105%;--tw-scale-z: 105%;scale:var(--tw-scale-x) var(--tw-scale-y)}}@media (hover: hover){.cio\\:hover\\:rounded:hover{border-radius:.25rem}}@media (hover: hover){.cio\\:hover\\:bg-accent:hover{background-color:var(--cio-accent)}}@media (hover: hover){.cio\\:hover\\:bg-blue-600:hover{background-color:var(--cio-color-blue-600)}}@media (hover: hover){.cio\\:hover\\:bg-blue-700:hover{background-color:var(--cio-color-blue-700)}}@media (hover: hover){.cio\\:hover\\:bg-destructive\\/90:hover{background-color:var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:hover\\:bg-destructive\\/90:hover{background-color:color-mix(in oklab,var(--cio-destructive) 90%,transparent)}}}@media (hover: hover){.cio\\:hover\\:bg-gray-50:hover{background-color:var(--cio-color-gray-50)}}@media (hover: hover){.cio\\:hover\\:bg-gray-200:hover{background-color:var(--cio-color-gray-200)}}@media (hover: hover){.cio\\:hover\\:bg-gray-800:hover{background-color:var(--cio-color-gray-800)}}@media (hover: hover){.cio\\:hover\\:bg-indigo-700:hover{background-color:var(--cio-color-indigo-700)}}@media (hover: hover){.cio\\:hover\\:bg-neutral-100:hover{background-color:var(--cio-color-neutral-100)}}@media (hover: hover){.cio\\:hover\\:bg-primary\\/90:hover{background-color:var(--cio-primary)}@supports (color: color-mix(in lab,red,red)){.cio\\:hover\\:bg-primary\\/90:hover{background-color:color-mix(in oklab,var(--cio-primary) 90%,transparent)}}}@media (hover: hover){.cio\\:hover\\:bg-purple-700:hover{background-color:var(--cio-color-purple-700)}}@media (hover: hover){.cio\\:hover\\:bg-red-200:hover{background-color:var(--cio-color-red-200)}}@media (hover: hover){.cio\\:hover\\:bg-secondary\\/80:hover{background-color:var(--cio-secondary)}@supports (color: color-mix(in lab,red,red)){.cio\\:hover\\:bg-secondary\\/80:hover{background-color:color-mix(in oklab,var(--cio-secondary) 80%,transparent)}}}@media (hover: hover){.cio\\:hover\\:bg-secondary\\/90:hover{background-color:var(--cio-secondary)}@supports (color: color-mix(in lab,red,red)){.cio\\:hover\\:bg-secondary\\/90:hover{background-color:color-mix(in oklab,var(--cio-secondary) 90%,transparent)}}}@media (hover: hover){.cio\\:hover\\:from-purple-600:hover{--tw-gradient-from: var(--cio-color-purple-600);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}}@media (hover: hover){.cio\\:hover\\:to-pink-600:hover{--tw-gradient-to: var(--cio-color-pink-600);--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}}@media (hover: hover){.cio\\:hover\\:text-accent-foreground:hover{color:var(--cio-accent-foreground)}}@media (hover: hover){.cio\\:hover\\:underline:hover{text-decoration-line:underline}}.cio\\:focus-visible\\:border-ring:focus-visible{border-color:var(--cio-ring)}.cio\\:focus-visible\\:ring-\\[3px\\]:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.cio\\:focus-visible\\:ring-destructive\\/20:focus-visible{--tw-ring-color: var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:focus-visible\\:ring-destructive\\/20:focus-visible{--tw-ring-color: color-mix(in oklab, var(--cio-destructive) 20%, transparent)}}.cio\\:focus-visible\\:ring-ring\\/50:focus-visible{--tw-ring-color: var(--cio-ring)}@supports (color: color-mix(in lab,red,red)){.cio\\:focus-visible\\:ring-ring\\/50:focus-visible{--tw-ring-color: color-mix(in oklab, var(--cio-ring) 50%, transparent)}}.cio\\:disabled\\:pointer-events-none:disabled{pointer-events:none}.cio\\:disabled\\:opacity-40:disabled{opacity:40%}.cio\\:disabled\\:opacity-50:disabled{opacity:50%}.cio\\:has-data-\\[slot\\=card-action\\]\\:grid-cols-\\[1fr_auto\\]:has(*[data-slot=card-action]){grid-template-columns:1fr auto}.cio\\:has-\\[\\>svg\\]\\:px-2\\.5:has(>svg){padding-inline:calc(var(--cio-spacing) * 2.5)}.cio\\:has-\\[\\>svg\\]\\:px-3:has(>svg){padding-inline:calc(var(--cio-spacing) * 3)}.cio\\:has-\\[\\>svg\\]\\:px-4:has(>svg){padding-inline:calc(var(--cio-spacing) * 4)}.cio\\:aria-invalid\\:border-destructive[aria-invalid=true]{border-color:var(--cio-destructive)}.cio\\:aria-invalid\\:ring-destructive\\/20[aria-invalid=true]{--tw-ring-color: var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:aria-invalid\\:ring-destructive\\/20[aria-invalid=true]{--tw-ring-color: color-mix(in oklab, var(--cio-destructive) 20%, transparent)}}@media (width >= 40rem){.cio\\:sm\\:top-4{top:calc(var(--cio-spacing) * 4)}}@media (width >= 40rem){.cio\\:sm\\:right-\\[22px\\]{right:22px}}@media (width >= 40rem){.cio\\:sm\\:left-\\[22px\\]{left:22px}}@media (width >= 40rem){.cio\\:sm\\:size-\\[18px\\]{width:18px;height:18px}}@media (width >= 40rem){.cio\\:sm\\:h-\\[8px\\]{height:8px}}@media (width >= 40rem){.cio\\:sm\\:w-\\[8px\\]{width:8px}}@media (width >= 40rem){.cio\\:sm\\:p-4{padding:calc(var(--cio-spacing) * 4)}}@media (width >= 64rem){.cio\\:lg\\:p-6{padding:calc(var(--cio-spacing) * 6)}}.cio\\:dark\\:border-input:is(.dark *){border-color:var(--cio-input)}.cio\\:dark\\:bg-destructive\\/60:is(.dark *){background-color:var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:bg-destructive\\/60:is(.dark *){background-color:color-mix(in oklab,var(--cio-destructive) 60%,transparent)}}.cio\\:dark\\:bg-input\\/30:is(.dark *){background-color:var(--cio-input)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:bg-input\\/30:is(.dark *){background-color:color-mix(in oklab,var(--cio-input) 30%,transparent)}}@media (hover: hover){.cio\\:dark\\:hover\\:bg-accent\\/50:is(.dark *):hover{background-color:var(--cio-accent)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:hover\\:bg-accent\\/50:is(.dark *):hover{background-color:color-mix(in oklab,var(--cio-accent) 50%,transparent)}}}@media (hover: hover){.cio\\:dark\\:hover\\:bg-input\\/50:is(.dark *):hover{background-color:var(--cio-input)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:hover\\:bg-input\\/50:is(.dark *):hover{background-color:color-mix(in oklab,var(--cio-input) 50%,transparent)}}}.cio\\:dark\\:focus-visible\\:ring-destructive\\/40:is(.dark *):focus-visible{--tw-ring-color: var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:focus-visible\\:ring-destructive\\/40:is(.dark *):focus-visible{--tw-ring-color: color-mix(in oklab, var(--cio-destructive) 40%, transparent)}}.cio\\:dark\\:aria-invalid\\:ring-destructive\\/40:is(.dark *)[aria-invalid=true]{--tw-ring-color: var(--cio-destructive)}@supports (color: color-mix(in lab,red,red)){.cio\\:dark\\:aria-invalid\\:ring-destructive\\/40:is(.dark *)[aria-invalid=true]{--tw-ring-color: color-mix(in oklab, var(--cio-destructive) 40%, transparent)}}.cio\\:\\[\\&_svg\\]\\:pointer-events-none svg{pointer-events:none}.cio\\:\\[\\&_svg\\]\\:size-4 svg{width:calc(var(--cio-spacing) * 4);height:calc(var(--cio-spacing) * 4)}.cio\\:\\[\\&_svg\\]\\:shrink-0 svg{flex-shrink:0}.cio\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'cio\\:size-\\'\\]\\)\\]\\:size-3 svg:not([class*="cio:size-"]){width:calc(var(--cio-spacing) * 3);height:calc(var(--cio-spacing) * 3)}.cio\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'cio\\:size-\\'\\]\\)\\]\\:size-4 svg:not([class*="cio:size-"]){width:calc(var(--cio-spacing) * 4);height:calc(var(--cio-spacing) * 4)}}@property --tw-animation-delay{syntax: "*"; inherits: false; initial-value: 0s;}@property --tw-animation-direction{syntax: "*"; inherits: false; initial-value: normal;}@property --tw-animation-duration{syntax: "*"; inherits: false;}@property --tw-animation-fill-mode{syntax: "*"; inherits: false; initial-value: none;}@property --tw-animation-iteration-count{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-enter-blur{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-enter-opacity{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-enter-rotate{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-enter-scale{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-enter-translate-x{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-enter-translate-y{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-exit-blur{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-exit-opacity{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-exit-rotate{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-exit-scale{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-exit-translate-x{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-exit-translate-y{syntax: "*"; inherits: false; initial-value: 0;}.cio-components{font-family:Inter,sans-serif;box-sizing:border-box}.cio-components p,.cio-components h3{margin:0}[data-slot=card-header].cio\\:border-b{padding-bottom:calc(var(--cio-spacing) * 6)}[data-slot=card-footer].cio\\:border-t{padding-top:calc(var(--cio-spacing) * 6)}@layer base{:root{--cio-radius: .625rem;--cio-background: oklch(1 0 0);--cio-foreground: oklch(.145 0 0);--cio-card: oklch(1 0 0);--cio-card-foreground: oklch(.145 0 0);--cio-popover: oklch(1 0 0);--cio-popover-foreground: oklch(.145 0 0);--cio-primary: oklch(.1969 .0101 276.49);--cio-primary-foreground: oklch(.985 0 0);--cio-secondary: oklch(.949 .007 268.55);--cio-secondary-foreground: oklch(.205 0 0);--cio-muted: oklch(.97 0 0);--cio-muted-foreground: oklch(.556 0 0);--cio-accent: oklch(.97 0 0);--cio-accent-foreground: oklch(.205 0 0);--cio-destructive: oklch(.577 .245 27.325);--cio-border: oklch(.922 0 0);--cio-input: oklch(.922 0 0);--cio-ring: oklch(.708 0 0);--cio-chart-1: oklch(.646 .222 41.116);--cio-chart-2: oklch(.6 .118 184.704);--cio-chart-3: oklch(.398 .07 227.392);--cio-chart-4: oklch(.828 .189 84.429);--cio-chart-5: oklch(.769 .188 70.08);--cio-sidebar: oklch(.985 0 0);--cio-sidebar-foreground: oklch(.145 0 0);--cio-sidebar-primary: oklch(.205 0 0);--cio-sidebar-primary-foreground: oklch(.985 0 0);--cio-sidebar-accent: oklch(.97 0 0);--cio-sidebar-accent-foreground: oklch(.205 0 0);--cio-sidebar-border: oklch(.922 0 0);--cio-sidebar-ring: oklch(.708 0 0)}.dark{--cio-background: oklch(.145 0 0);--cio-foreground: oklch(.985 0 0);--cio-card: oklch(.205 0 0);--cio-card-foreground: oklch(.985 0 0);--cio-popover: oklch(.205 0 0);--cio-popover-foreground: oklch(.985 0 0);--cio-primary: oklch(.922 0 0);--cio-primary-foreground: oklch(.205 0 0);--cio-secondary: oklch(.269 0 0);--cio-secondary-foreground: oklch(.985 0 0);--cio-muted: oklch(.269 0 0);--cio-muted-foreground: oklch(.708 0 0);--cio-accent: oklch(.269 0 0);--cio-accent-foreground: oklch(.985 0 0);--cio-destructive: oklch(.704 .191 22.216);--cio-border: oklch(1 0 0 / 10%);--cio-input: oklch(1 0 0 / 15%);--cio-ring: oklch(.556 0 0);--cio-chart-1: oklch(.488 .243 264.376);--cio-chart-2: oklch(.696 .17 162.48);--cio-chart-3: oklch(.769 .188 70.08);--cio-chart-4: oklch(.627 .265 303.9);--cio-chart-5: oklch(.645 .246 16.439);--cio-sidebar: oklch(.205 0 0);--cio-sidebar-foreground: oklch(.985 0 0);--cio-sidebar-primary: oklch(.488 .243 264.376);--cio-sidebar-primary-foreground: oklch(.985 0 0);--cio-sidebar-accent: oklch(.269 0 0);--cio-sidebar-accent-foreground: oklch(.985 0 0);--cio-sidebar-border: oklch(1 0 0 / 10%);--cio-sidebar-ring: oklch(.556 0 0)}}@property --tw-rotate-x{syntax: "*"; inherits: false;}@property --tw-rotate-y{syntax: "*"; inherits: false;}@property --tw-rotate-z{syntax: "*"; inherits: false;}@property --tw-skew-x{syntax: "*"; inherits: false;}@property --tw-skew-y{syntax: "*"; inherits: false;}@property --tw-space-y-reverse{syntax: "*"; inherits: false; initial-value: 0;}@property --tw-border-style{syntax: "*"; inherits: false; initial-value: solid;}@property --tw-gradient-position{syntax: "*"; inherits: false;}@property --tw-gradient-from{syntax: "<color>"; inherits: false; initial-value: #0000;}@property --tw-gradient-via{syntax: "<color>"; inherits: false; initial-value: #0000;}@property --tw-gradient-to{syntax: "<color>"; inherits: false; initial-value: #0000;}@property --tw-gradient-stops{syntax: "*"; inherits: false;}@property --tw-gradient-via-stops{syntax: "*"; inherits: false;}@property --tw-gradient-from-position{syntax: "<length-percentage>"; inherits: false; initial-value: 0%;}@property --tw-gradient-via-position{syntax: "<length-percentage>"; inherits: false; initial-value: 50%;}@property --tw-gradient-to-position{syntax: "<length-percentage>"; inherits: false; initial-value: 100%;}@property --tw-leading{syntax: "*"; inherits: false;}@property --tw-font-weight{syntax: "*"; inherits: false;}@property --tw-tracking{syntax: "*"; inherits: false;}@property --tw-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: "*"; inherits: false;}@property --tw-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: "*"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: "<percentage>"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: "*"; inherits: false;}@property --tw-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: "*"; inherits: false;}@property --tw-inset-ring-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: "*"; inherits: false;}@property --tw-ring-offset-width{syntax: "<length>"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: "*"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: "*"; inherits: false; initial-value: 0 0 #0000;}@property --tw-duration{syntax: "*"; inherits: false;}@property --tw-scale-x{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-scale-y{syntax: "*"; inherits: false; initial-value: 1;}@property --tw-scale-z{syntax: "*"; inherits: false; initial-value: 1;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x: initial;--tw-rotate-y: initial;--tw-rotate-z: initial;--tw-skew-x: initial;--tw-skew-y: initial;--tw-space-y-reverse: 0;--tw-border-style: solid;--tw-gradient-position: initial;--tw-gradient-from: #0000;--tw-gradient-via: #0000;--tw-gradient-to: #0000;--tw-gradient-stops: initial;--tw-gradient-via-stops: initial;--tw-gradient-from-position: 0%;--tw-gradient-via-position: 50%;--tw-gradient-to-position: 100%;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-duration: initial;--tw-scale-x: 1;--tw-scale-y: 1;--tw-scale-z: 1;--tw-animation-delay: 0s;--tw-animation-direction: normal;--tw-animation-duration: initial;--tw-animation-fill-mode: none;--tw-animation-iteration-count: 1;--tw-enter-blur: 0;--tw-enter-opacity: 1;--tw-enter-rotate: 0;--tw-enter-scale: 1;--tw-enter-translate-x: 0;--tw-enter-translate-y: 0;--tw-exit-blur: 0;--tw-exit-opacity: 1;--tw-exit-rotate: 0;--tw-exit-scale: 1;--tw-exit-translate-x: 0;--tw-exit-translate-y: 0}}}.cio-asa-button.cio-button{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:4px;border:none;border-radius:6px;cursor:pointer;box-shadow:0 6px 14px #1212691c,0 2px 4px #12126912,0 1px 2px #1212690e;transition:opacity .2s}.cio-asa-button.cio-button:hover{opacity:.9}.cio-asa-button.cio-button:active{opacity:.8}.cio-asa-button--dark.cio-button{background:#14151a;color:#fff}.cio-asa-button--light.cio-button{background:#fff;color:#14151a}.cio-asa-button--sm.cio-button{height:32px;padding:8px 12px 8px 8px}.cio-asa-button--lg.cio-button{height:40px;padding:10px 16px 10px 12px}.cio-asa-button__icon{width:16px;height:16px;flex:none}.cio-asa-button__label{font-weight:600;font-size:13px;line-height:16px;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;white-space:nowrap}.cio-asa-chat{display:flex;flex-direction:column;width:100%;height:100%;background:#f8f9fc;overflow:hidden;position:relative;animation:cio-asa-fade-in .4s ease}.cio-asa-chat-body{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.cio-asa-chat-view{display:flex;flex-direction:column;flex:1;overflow:hidden}.cio-asa-chat-view--welcome{animation:cio-asa-fade-in .3s ease}.cio-asa-chat-view--chat{animation:cio-asa-fade-in .3s ease;position:relative}.cio-asa-chat-overlay{position:fixed;top:0;right:0;bottom:0;left:0;border:none;padding:0;margin:0;cursor:pointer;background:#0006;z-index:999;animation:cio-asa-fade-in .2s ease}.cio-asa-chat-panel{position:fixed;top:0;right:0;bottom:0;width:420px;z-index:1000;animation:cio-asa-slide-in-right .3s ease}.cio-asa-chat-panel .cio-asa-chat{height:100%}@keyframes cio-asa-fade-in{0%{opacity:0}to{opacity:1}}@keyframes cio-asa-slide-in-right{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes cio-asa-slide-in-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.cio-asa-chat-fullscreen{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1000;overflow:hidden;animation:cio-asa-fade-in .4s ease}.cio-asa-chat-fullscreen--right{inset:0 0 0 auto;width:504px;animation:cio-asa-slide-in-right .4s ease .2s both}.cio-asa-chat-header{display:flex;align-items:center;justify-content:flex-end;padding:16px 20px;position:relative;flex-shrink:0;border-bottom:1px solid rgba(222,224,227,1);background:#fff}.cio-asa-chat-header__title{position:absolute;left:50%;transform:translate(-50%);font-weight:600;font-size:16px;line-height:1;color:#0f1324}.cio-asa-chat-header__close{background:none;border:none;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;color:#1a1a1a;font-size:20px;line-height:1}.cio-asa-chat-header__close:before{content:"✕"}.cio-asa-chat-header__close:hover{opacity:.7}.cio-asa-welcome-screen{display:flex;flex-direction:column;flex:1;padding:20px;position:relative}.cio-asa-welcome-screen__close{position:absolute;top:16px;right:20px;background:none;border:none;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;color:#1a1a1a;font-size:20px;line-height:1;z-index:1}.cio-asa-welcome-screen__close:hover{opacity:.7}.cio-asa-welcome-screen__content{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;width:100%;max-width:504px;margin:0 auto}@media (max-width: 768px){.cio-asa-welcome-screen__content{max-width:366px}}.cio-asa-welcome-screen__title{font-weight:400;font-size:26px;line-height:32px;text-align:center;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;color:#000;margin:0;align-self:stretch}.cio-asa-welcome-screen__input-row{display:flex;flex-direction:row;align-items:center;padding:8px 8px 8px 12px;gap:12px;width:100%;height:40px;margin-top:32px;background:#fff;border:1px solid #DEE0E3;box-shadow:inset 1px 1px 2px #1212691a,inset 0 1px 4px #1212690d,inset 1px 1px 1px #1212690d;border-radius:4px;box-sizing:border-box}.cio-asa-welcome-screen__input{flex:1;padding:0;border:none;font-weight:400;font-size:14px;line-height:16px;letter-spacing:-.005em;color:#0f1324;outline:none;background:transparent}.cio-asa-welcome-screen__input::placeholder{color:#0f1324b3}.cio-asa-welcome-screen__input-row:hover{border-color:#c8cad0}.cio-asa-welcome-screen__input-row:focus-within{border-color:#a980ff;box-shadow:0 0 0 2px #c9b0feb3}.cio-asa-welcome-screen__input-row:active{border-color:#000;box-shadow:inset 0 1px 4px #12126924,inset 2.1px 2px 2px #1212691a,inset 0 1.5px 3px #1212690d}.cio-asa-welcome-screen__input-row--disabled{border-color:#e9eaec;box-shadow:none;pointer-events:none}.cio-asa-welcome-screen__input-row--disabled .cio-asa-welcome-screen__send-btn{background:#e9eaec;box-shadow:none;color:#0a0f2940;cursor:default}.cio-asa-welcome-screen__input-row--disabled .cio-asa-welcome-screen__send-btn svg path{fill:#0a0f2940}.cio-asa-welcome-screen__send-btn{display:flex;flex-direction:row;justify-content:center;align-items:center;padding:0 8px;gap:6px;height:24px;background:#14151a;box-shadow:0 .4px 1px #12126921,0 .9px 6px #1212690d,0 1px 3px #1212690d;border-radius:4px;border:none;cursor:pointer;font-weight:500;font-size:13px;line-height:16px;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;color:#fff;white-space:nowrap;flex-shrink:0}.cio-asa-welcome-screen__send-btn:hover{background:#333}.cio-asa-welcome-screen__suggestions{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));column-gap:16px;row-gap:11px;width:100%;margin-top:20px;animation:cio-asa-fade-in .5s ease .5s both}.cio-asa-welcome-screen__suggestion-chip{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:18px 16px;background:#fff;box-shadow:0 .4px 1px #12126921,0 .9px 6px #1212690d,0 1px 3px #1212690d;border-radius:12px;border:1px solid transparent;cursor:pointer;font-weight:400;font-size:12px;line-height:20px;text-align:center;color:#343434;box-sizing:border-box;transition:background-color .2s,box-shadow .2s,border-color .2s}.cio-asa-welcome-screen__suggestion-chip:hover{background:#fff;border-color:#fff;box-shadow:0 6px 14px #1212691c,0 2px 4px #12126912,0 1px 2px #1212690e}.cio-asa-welcome-screen__suggestion-chip:active{background:#e0e3eb;border-color:#dee0e3;box-shadow:inset 1px 1px 2px #1212691a,inset 0 1px 4px #1212690d,inset 1px 1px 1px #1212690d}.cio-asa-welcome-screen__terms{font-size:11px;color:#999;text-align:center;padding-top:16px;max-width:504px;margin:0 auto}.cio-asa-welcome-screen__terms a{color:#666;text-decoration:underline}.cio-asa-chat-message-list{flex:1;overflow-y:auto;padding:32px 12px 80px;display:flex;flex-direction:column;gap:16px;max-width:508px;width:100%;margin:0 auto;box-sizing:border-box;scrollbar-width:none}.cio-asa-chat-message-list::-webkit-scrollbar{display:none}.cio-asa-ai-message-group{display:flex;flex-direction:column;gap:12px}.cio-asa-user-message{display:flex;justify-content:flex-end;padding-left:12px}.cio-asa-user-message__bubble{display:inline-flex;flex-direction:row;justify-content:flex-end;align-items:center;padding:13px 12px;gap:8px;background:#09090ce6;border-radius:8px 0 8px 8px;font-weight:400;font-size:14px;line-height:16px;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;color:#fff;max-width:100%;word-wrap:break-word;text-align:left}.cio-asa-ai-message{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding-right:12px}.cio-asa-ai-message__bubble{display:flex;flex-direction:column;align-items:flex-start;padding:12px;gap:8px;background:#eceef3;border-radius:6px;width:100%;box-sizing:border-box}.cio-asa-ai-message__bubble--error{background:#fdecec}.cio-asa-ai-message__text{font-weight:400;font-size:14px;line-height:20px;letter-spacing:-.005em;color:#0f1324}.cio-asa-ai-message__bubble--error .cio-asa-ai-message__text{color:#b42318}.cio-asa-typing-indicator{display:flex;flex-direction:column;align-items:flex-start;padding:12px;gap:8px;background:#eceef3;border-radius:6px}.cio-asa-typing-indicator__dots{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:6px}.cio-asa-typing-indicator__dot{width:8px;height:8px;background:#c8cad0;border-radius:50%;animation:cio-asa-typing-bounce 1.4s infinite ease-in-out both}.cio-asa-typing-indicator__dot:nth-child(1){background:#0f132499;animation-delay:-.32s}.cio-asa-typing-indicator__dot:nth-child(2){animation-delay:-.16s}.cio-asa-typing-indicator__dot:nth-child(3){animation-delay:0s}@keyframes cio-asa-typing-bounce{0%,80%,to{transform:scale(.8);opacity:.5}40%{transform:scale(1);opacity:1}}.cio-asa-chat-input-wrapper{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;padding:24px 12px 16px;background:linear-gradient(to bottom,#f8f9fc00,#f8f9fc 40%);pointer-events:none;z-index:10}.cio-asa-chat-input{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:4px 12px;gap:12px;height:40px;max-width:508px;width:100%;background:#fff;border:1px solid #DEE0E3;box-shadow:0 6px 14px #1212691c,0 2px 4px #12126912,0 1px 2px #1212690e;border-radius:4px;box-sizing:border-box;pointer-events:all}.cio-asa-chat-input:hover{border-color:#c8cad0}.cio-asa-chat-input:focus-within{border-color:#000}.cio-asa-chat-input__field{flex:1;padding:0;border:none;font-weight:400;font-size:14px;line-height:16px;letter-spacing:-.005em;font-feature-settings:"tnum" on,"lnum" on;color:#0f1324;outline:none;background:transparent}.cio-asa-chat-input__field::placeholder{color:#0f1324b3}.cio-asa-chat-input__field:disabled{cursor:not-allowed}.cio-asa-chat-input__send{display:flex;justify-content:center;align-items:center;width:16px;height:16px;background:none;border:none;cursor:pointer;flex-shrink:0;padding:0}.cio-asa-chat-input__send:hover:not(:disabled) svg path{stroke:#0f1324;stroke-opacity:1}.cio-asa-chat-input__send:disabled{cursor:default;opacity:.3}.cio-asa-results-block{display:flex;flex-direction:column;gap:20px;width:100%}.cio-asa-results-group{display:flex;flex-direction:column;gap:12px}.cio-asa-results-group__label{font-size:14px;font-weight:600;color:#1a1a1a;margin:0}.cio-asa-product-card.cio-product-card{display:flex;flex-direction:column;gap:6px;cursor:pointer;width:100%;height:100%;min-width:unset;max-width:unset;border:none;border-radius:0;box-shadow:none;padding:0;background:transparent}.cio-asa-product-card .cio-asa-product-card__image-wrapper.cio-product-card-image-section{position:relative;width:100%;aspect-ratio:var(--cio-asa-image-ratio, 3 / 4);border-radius:6px;overflow:hidden;background-color:#f3f4f6;flex-shrink:0}.cio-asa-product-card .cio-asa-product-card__image-wrapper .cio-product-card-image{width:100%;height:100%;object-fit:cover;display:block;min-height:unset;border-radius:0}.cio-asa-product-card .cio-asa-product-card__badge{position:absolute;top:8px;left:8px;display:flex;justify-content:center;align-items:center;padding:0 4px;min-width:35px;max-width:120px;height:20px;background:#dc2626;color:#fff;font-size:13px;font-weight:500;line-height:16px;text-align:center;letter-spacing:-.005em;border-radius:4px;border:none;z-index:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cio-asa-product-card .cio-asa-product-card__info.cio-product-card-content{display:flex;flex-direction:column;gap:2px;flex:1;padding:0}.cio-asa-product-card .cio-asa-product-card__name.cio-product-card-title-section{font-size:12px;line-height:1.3;color:#1a1a1a;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0;min-height:calc(2 * 12px * 1.3)}.cio-asa-product-card .cio-asa-product-card__name-btn{background:none;border:0;padding:0;font:inherit;font-size:12px;color:inherit;text-align:left;cursor:pointer}.cio-asa-product-card .cio-asa-product-card__name-btn:focus-visible{outline:2px solid var(--cio-asa-focus-color, #0F1324);outline-offset:2px}.cio-asa-product-card__description{font-size:11px;line-height:1.3;color:#6b7280;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section{display:flex;align-items:baseline;gap:4px}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section span{word-spacing:-1ch}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section span:first-child{font-size:14px;font-weight:700;color:#1a1a1a}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section span:first-child:not(:only-child){color:#dc2626;order:2}.cio-asa-product-card .cio-asa-product-card__price.cio-product-card-price-section span:last-child:not(:first-child){font-size:12px;color:#9ca3af;text-decoration:line-through;font-weight:400;order:1}.cio-asa-results-group [data-slot=carousel-content]{padding:0!important}.cio-asa-results-group [data-slot=carousel-item]{min-width:0!important;align-self:stretch}.cio-asa-results-group [data-slot=carousel-track]{padding-left:0!important}.cio-asa-product-card .cio-asa-product-card__add-to-cart.cio-product-card-add-to-cart-btn{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px;padding:4px 12px 6px;font-size:14px;font-weight:500;line-height:16px;letter-spacing:-.005em;color:#14151a;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;width:100%;margin-top:auto;transition:background-color .15s}.cio-asa-product-card .cio-asa-product-card__add-to-cart.cio-product-card-add-to-cart-btn:before{content:"";display:inline-block;width:16px;height:16px;flex-shrink:0;background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.0311 8.66659C11.5311 8.66659 11.9711 8.39325 12.1977 7.97992L14.5844 3.65325C14.8311 3.21325 14.5111 2.66659 14.0044 2.66659H4.13772L3.51105 1.33325H1.33105V2.66659H2.66439L5.06439 7.72659L4.16439 9.35325C3.67772 10.2466 4.31772 11.3333 5.33105 11.3333H13.3311V9.99992H5.33105L6.06439 8.66659H11.0311ZM4.77105 3.99992H12.8711L11.0311 7.33325H6.35105L4.77105 3.99992ZM5.33105 11.9999C4.59772 11.9999 4.00439 12.5999 4.00439 13.3333C4.00439 14.0666 4.59772 14.6666 5.33105 14.6666C6.06439 14.6666 6.66439 14.0666 6.66439 13.3333C6.66439 12.5999 6.06439 11.9999 5.33105 11.9999ZM11.9977 11.9999C11.2644 11.9999 10.6711 12.5999 10.6711 13.3333C10.6711 14.0666 11.2644 14.6666 11.9977 14.6666C12.7311 14.6666 13.3311 14.0666 13.3311 13.3333C13.3311 12.5999 12.7311 11.9999 11.9977 11.9999Z' fill='%230F1324' fill-opacity='0.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:16px 16px}.cio-asa-product-card .cio-asa-product-card__add-to-cart.cio-product-card-add-to-cart-btn:hover{background:#e5e7eb;color:#14151a}.cio-asa-results-group__view-more{display:inline-flex;align-items:center;gap:11px;font-size:13px;color:#1a1a1a;text-decoration:none;cursor:pointer;background:none;border:none;padding:0;font-family:inherit;width:fit-content}.cio-asa-results-group__view-more-text{text-decoration:none;border-bottom:1px solid currentColor;line-height:1.2}.cio-asa,.cio-asa *{font-family:var(--cio-asa-font-family, "Inter", sans-serif)}.cio-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cio-asa button:focus-visible,.cio-asa [role=button]:focus-visible{outline:2px solid var(--cio-asa-focus-color, #0F1324);outline-offset:2px}`)),document.head.appendChild(o)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
2
2
  function Na(L){return L&&L.__esModule&&Object.prototype.hasOwnProperty.call(L,"default")?L.default:L}var Si={exports:{}},D={};/**
3
3
  * @license React
4
4
  * react.production.min.js
package/lib/cjs/components/Chat/AiMessage.js CHANGED
@@ -22,12 +22,12 @@ function AiMessage({ message, componentOverrides, translations }) {
22
22
  isLoading && !hasText && !hasGroups && (react_1.default.createElement(constructorio_ui_components_1.RenderPropsWrapper, { override: (_b = componentOverrides === null || componentOverrides === void 0 ? void 0 : componentOverrides.loader) === null || _b === void 0 ? void 0 : _b.reactNode, props: loaderRenderProps },
23
23
  react_1.default.createElement(TypingIndicator_1.default, { translations: translations }))),
24
24
  hasText && (react_1.default.createElement(constructorio_ui_components_1.RenderPropsWrapper, { override: (_c = componentOverrides === null || componentOverrides === void 0 ? void 0 : componentOverrides.text) === null || _c === void 0 ? void 0 : _c.reactNode, props: textRenderProps },
25
- react_1.default.createElement("div", { className: [
25
+ react_1.default.createElement("div", { key: isError ? 'error' : 'text', className: [
26
26
  'cio-asa-ai-message__bubble',
27
27
  isError && 'cio-asa-ai-message__bubble--error',
28
28
  ]
29
29
  .filter(Boolean)
30
- .join(' ') },
30
+ .join(' '), role: isError ? 'alert' : undefined },
31
31
  react_1.default.createElement("div", { className: 'cio-asa-ai-message__text' }, text))))));
32
32
  }
33
33
  exports.default = AiMessage;
package/lib/cjs/components/Chat/Chat.js CHANGED
@@ -9,11 +9,32 @@ const ChatHeader_1 = tslib_1.__importDefault(require("./ChatHeader"));
9
9
  const WelcomeScreen_1 = tslib_1.__importDefault(require("./WelcomeScreen"));
10
10
  const ChatMessageList_1 = tslib_1.__importDefault(require("./ChatMessageList"));
11
11
  const ChatInput_1 = tslib_1.__importDefault(require("./ChatInput"));
12
- const Chat = (0, react_1.forwardRef)(({ onClose, className, initialSuggestions, termsText, onProductClick, onViewMore, onAddToCart, aspectRatio, currency, normalizeItem, componentOverrides, translations, }, ref) => {
13
- const { messages, sendMessage, isStreaming, clearHistory } = (0, useAsaResults_1.default)();
12
+ // a11y: text for the screen-reader live region that voices the conversation
13
+ function getAnnouncement(messages, translations) {
14
+ var _a, _b;
15
+ const lastMessage = messages[messages.length - 1];
16
+ if ((lastMessage === null || lastMessage === void 0 ? void 0 : lastMessage.role) !== 'assistant')
17
+ return '';
18
+ if (lastMessage.status === 'loading' || lastMessage.status === 'streaming') {
19
+ const userText = (_b = (_a = messages[messages.length - 2]) === null || _a === void 0 ? void 0 : _a.text) !== null && _b !== void 0 ? _b : '';
20
+ const youSaid = (0, translate_1.default)('CioAsa.userMessage.ariaLabel', translations);
21
+ const typing = (0, translate_1.default)('CioAsa.typingIndicator.ariaLabel', translations);
22
+ return `${youSaid}: ${userText}. ${typing}`;
23
+ }
24
+ if (lastMessage.status === 'done' && lastMessage.text) {
25
+ return `${(0, translate_1.default)('CioAsa.aiMessage.ariaLabel', translations)}: ${lastMessage.text}`;
26
+ }
27
+ return '';
28
+ }
29
+ const Chat = (0, react_1.forwardRef)(({ onClose, className, initialSuggestions, termsText, onProductClick, onViewMore, onAddToCart, aspectRatio, currency, normalizeItem, componentOverrides, translations, initialThreadId, }, ref) => {
30
+ const { messages, sendMessage, isStreaming, clearHistory } = (0, useAsaResults_1.default)({
31
+ initialThreadId,
32
+ });
14
33
  const chatViewRef = (0, react_1.useRef)(null);
15
34
  const containerRef = (0, react_1.useRef)(null);
16
35
  const isWelcome = messages.length === 0;
36
+ const isModal = typeof onClose === 'function';
37
+ const announcement = getAnnouncement(messages, translations);
17
38
  (0, react_1.useImperativeHandle)(ref, () => ({
18
39
  clearHistory,
19
40
  }));
@@ -31,8 +52,9 @@ const Chat = (0, react_1.forwardRef)(({ onClose, className, initialSuggestions,
31
52
  }
32
53
  }
33
54
  }, [isWelcome]);
34
- (0, useFocusTrap_1.default)(containerRef, { onEscape: onClose });
35
- return (react_1.default.createElement("div", { className: ['cio-asa', 'cio-asa-chat', className].filter(Boolean).join(' '), ref: containerRef, role: 'dialog', "aria-labelledby": 'cio-asa-chat-title' },
55
+ (0, useFocusTrap_1.default)(containerRef, { onEscape: onClose, trapFocus: isModal });
56
+ return (react_1.default.createElement("div", { className: ['cio-asa', 'cio-asa-chat', className].filter(Boolean).join(' '), ref: containerRef, role: 'dialog', "aria-modal": isModal ? 'true' : undefined, "aria-label": (0, translate_1.default)(isWelcome ? 'CioAsa.welcome.title' : 'CioAsa.header.title', translations) },
57
+ react_1.default.createElement("div", { className: 'cio-sr-only', role: 'status' }, announcement),
36
58
  react_1.default.createElement("div", { className: 'cio-asa-chat-body' }, isWelcome ? (react_1.default.createElement("div", { className: 'cio-asa-chat-view cio-asa-chat-view--welcome' },
37
59
  react_1.default.createElement(WelcomeScreen_1.default, { suggestions: initialSuggestions, onSend: sendMessage, onClose: onClose, termsText: termsText, translations: translations, componentOverrides: componentOverrides === null || componentOverrides === void 0 ? void 0 : componentOverrides.welcomeScreen }))) : (react_1.default.createElement("div", { className: 'cio-asa-chat-view cio-asa-chat-view--chat', ref: chatViewRef },
38
60
  react_1.default.createElement(ChatHeader_1.default, { onClose: onClose, translations: translations, componentOverrides: componentOverrides === null || componentOverrides === void 0 ? void 0 : componentOverrides.header }),
package/lib/cjs/components/Chat/ChatHeader.js CHANGED
@@ -11,7 +11,7 @@ function ChatHeader({ onClose, translations, componentOverrides }) {
11
11
  };
12
12
  return (react_1.default.createElement(constructorio_ui_components_1.RenderPropsWrapper, { override: componentOverrides === null || componentOverrides === void 0 ? void 0 : componentOverrides.reactNode, props: renderProps },
13
13
  react_1.default.createElement("div", { className: 'cio-asa-chat-header' },
14
- react_1.default.createElement("span", { id: 'cio-asa-chat-title', className: 'cio-asa-chat-header__title' }, renderProps.title),
14
+ react_1.default.createElement("span", { id: 'cio-asa-chat-title', className: 'cio-asa-chat-header__title', role: 'heading', "aria-level": 2 }, renderProps.title),
15
15
  onClose && (react_1.default.createElement("button", { type: 'button', className: 'cio-asa-chat-header__close', onClick: onClose, "aria-label": (0, translate_1.default)('CioAsa.header.close', translations) })))));
16
16
  }
17
17
  exports.default = ChatHeader;
package/lib/cjs/components/Chat/ChatMessageList.js CHANGED
@@ -31,7 +31,7 @@ function ChatMessageList({ messages, onProductClick, onViewMore, onAddToCart, as
31
31
  el.scrollTo({ top: el.scrollHeight, behavior: isNewMessage ? 'smooth' : 'auto' });
32
32
  });
33
33
  }, [messages]);
34
- return (react_1.default.createElement("div", { className: 'cio-asa-chat-message-list', ref: listRef, onScroll: handleScroll, role: 'log', "aria-live": 'polite', "aria-label": (0, translate_1.default)('CioAsa.messageList.ariaLabel', translations) }, messages.map((message) => {
34
+ return (react_1.default.createElement("div", { className: 'cio-asa-chat-message-list', ref: listRef, onScroll: handleScroll, role: 'log', "aria-live": 'off', tabIndex: 0, "aria-label": (0, translate_1.default)('CioAsa.messageList.ariaLabel', translations) }, messages.map((message) => {
35
35
  var _a;
36
36
  if (message.role === 'user') {
37
37
  return (react_1.default.createElement(UserMessage_1.default, { key: message.id, text: message.text, translations: translations, componentOverrides: userMessageOverrides }));
package/lib/cjs/components/Chat/TypingIndicator.js CHANGED
@@ -4,11 +4,12 @@ const tslib_1 = require("tslib");
4
4
  const react_1 = tslib_1.__importDefault(require("react"));
5
5
  const translate_1 = tslib_1.__importDefault(require("../../utils/translate"));
6
6
  function TypingIndicator({ translations }) {
7
- return (react_1.default.createElement("div", { className: 'cio-asa-typing-indicator', role: 'status', "aria-label": (0, translate_1.default)('CioAsa.typingIndicator.ariaLabel', translations) },
8
- react_1.default.createElement("div", { className: 'cio-asa-typing-indicator__dots' },
7
+ return (react_1.default.createElement("div", { className: 'cio-asa-typing-indicator', role: 'status' },
8
+ react_1.default.createElement("div", { className: 'cio-asa-typing-indicator__dots', "aria-hidden": 'true' },
9
9
  react_1.default.createElement("span", { className: 'cio-asa-typing-indicator__dot' }),
10
10
  react_1.default.createElement("span", { className: 'cio-asa-typing-indicator__dot' }),
11
- react_1.default.createElement("span", { className: 'cio-asa-typing-indicator__dot' }))));
11
+ react_1.default.createElement("span", { className: 'cio-asa-typing-indicator__dot' })),
12
+ react_1.default.createElement("span", { className: 'cio-sr-only' }, (0, translate_1.default)('CioAsa.typingIndicator.ariaLabel', translations))));
12
13
  }
13
14
  exports.default = TypingIndicator;
14
15
  TypingIndicator.displayName = 'TypingIndicator';
package/lib/cjs/components/Chat/WelcomeScreen.js CHANGED
@@ -8,7 +8,7 @@ const translate_1 = tslib_1.__importDefault(require("../../utils/translate"));
8
8
  const useMessageInput_1 = tslib_1.__importDefault(require("../../hooks/useMessageInput"));
9
9
  const DEFAULT_SUGGESTIONS = [];
10
10
  function WelcomeScreen({ suggestions = DEFAULT_SUGGESTIONS, onSend, onClose, termsText, disabled = false, translations, componentOverrides, }) {
11
- var _a, _b, _c;
11
+ var _a, _b, _c, _d;
12
12
  const { value: inputValue, setValue: setInputValue, handleSubmit, handleKeyDown, } = (0, useMessageInput_1.default)({ onSend, isDisabled: disabled });
13
13
  const titleRenderProps = {
14
14
  text: (0, translate_1.default)('CioAsa.welcome.title', translations),
@@ -33,11 +33,11 @@ function WelcomeScreen({ suggestions = DEFAULT_SUGGESTIONS, onSend, onClose, ter
33
33
  react_1.default.createElement(constructorio_ui_components_1.RenderPropsWrapper, { override: (_b = componentOverrides === null || componentOverrides === void 0 ? void 0 : componentOverrides.input) === null || _b === void 0 ? void 0 : _b.reactNode, props: inputRenderProps },
34
34
  react_1.default.createElement("div", { className: `cio-asa-welcome-screen__input-row${disabled ? ' cio-asa-welcome-screen__input-row--disabled' : ''}` },
35
35
  react_1.default.createElement("input", { type: 'text', className: 'cio-asa-welcome-screen__input', value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyDown: handleKeyDown, placeholder: inputRenderProps.placeholder, disabled: disabled, "aria-label": (0, translate_1.default)('CioAsa.welcome.inputAriaLabel', translations) }),
36
- react_1.default.createElement("button", { type: 'button', className: 'cio-asa-welcome-screen__send-btn', onClick: handleSubmit, disabled: disabled || !inputValue.trim(), "aria-label": (0, translate_1.default)('CioAsa.welcome.sendAriaLabel', translations) },
36
+ react_1.default.createElement("button", { type: 'button', className: 'cio-asa-welcome-screen__send-btn', onClick: handleSubmit, disabled: disabled || !inputValue.trim(), "aria-label": ((_c = translations === null || translations === void 0 ? void 0 : translations['CioAsa.welcome.sendAriaLabel']) === null || _c === void 0 ? void 0 : _c.trim()) || undefined },
37
37
  (0, translate_1.default)('CioAsa.welcome.sendButton', translations),
38
38
  react_1.default.createElement(icons_1.SendPlaneIcon, null)))),
39
- suggestions.length > 0 && (react_1.default.createElement(constructorio_ui_components_1.RenderPropsWrapper, { override: (_c = componentOverrides === null || componentOverrides === void 0 ? void 0 : componentOverrides.suggestedQuestions) === null || _c === void 0 ? void 0 : _c.reactNode, props: suggestionsRenderProps },
40
- react_1.default.createElement("nav", { className: 'cio-asa-welcome-screen__suggestions', "aria-label": (0, translate_1.default)('CioAsa.welcome.suggestionsAriaLabel', translations) }, suggestions.map((suggestion) => (react_1.default.createElement("button", { key: suggestion, type: 'button', className: 'cio-asa-welcome-screen__suggestion-chip', disabled: disabled, onClick: () => handleSuggestionClick(suggestion) }, suggestion))))))),
39
+ suggestions.length > 0 && (react_1.default.createElement(constructorio_ui_components_1.RenderPropsWrapper, { override: (_d = componentOverrides === null || componentOverrides === void 0 ? void 0 : componentOverrides.suggestedQuestions) === null || _d === void 0 ? void 0 : _d.reactNode, props: suggestionsRenderProps },
40
+ react_1.default.createElement("div", { className: 'cio-asa-welcome-screen__suggestions', role: 'group', "aria-label": (0, translate_1.default)('CioAsa.welcome.suggestionsAriaLabel', translations) }, suggestions.map((suggestion) => (react_1.default.createElement("button", { key: suggestion, type: 'button', className: 'cio-asa-welcome-screen__suggestion-chip', disabled: disabled, onClick: () => handleSuggestionClick(suggestion) }, suggestion))))))),
41
41
  termsText && react_1.default.createElement("div", { className: 'cio-asa-welcome-screen__terms' }, termsText)));
42
42
  }
43
43
  exports.default = WelcomeScreen;
package/lib/cjs/components/ResultsBlock/ResultsBlock.css CHANGED
@@ -100,6 +100,22 @@
100
100
  min-height: calc(2 * 12px * 1.3);
101
101
  }
102
102
 
103
+ .cio-asa-product-card .cio-asa-product-card__name-btn {
104
+ background: none;
105
+ border: 0;
106
+ padding: 0;
107
+ font: inherit;
108
+ font-size: 12px;
109
+ color: inherit;
110
+ text-align: left;
111
+ cursor: pointer;
112
+ }
113
+
114
+ .cio-asa-product-card .cio-asa-product-card__name-btn:focus-visible {
115
+ outline: 2px solid var(--cio-asa-focus-color, #0F1324);
116
+ outline-offset: 2px;
117
+ }
118
+
103
119
  .cio-asa-product-card__description {
104
120
  font-size: 11px;
105
121
  line-height: 1.3;
package/lib/cjs/components/ResultsBlock/renderProductCard.js CHANGED
@@ -9,11 +9,18 @@ function createProductCardRenderer({ currency, addToCartText, onProductClick, on
9
9
  ? (_e, product) => onAddToCart(product)
10
10
  : undefined;
11
11
  return function renderProductCard(renderProps) {
12
+ var _a, _b, _c;
12
13
  const product = renderProps.product;
14
+ const hasTitleOverride = Boolean((_b = (_a = componentOverrides === null || componentOverrides === void 0 ? void 0 : componentOverrides.content) === null || _a === void 0 ? void 0 : _a.title) === null || _b === void 0 ? void 0 : _b.reactNode);
15
+ const shownPrice = (_c = product.salePrice) !== null && _c !== void 0 ? _c : product.price;
16
+ const titleAriaLabel = currency && shownPrice != null ? `${product.name}, ${currency} ${shownPrice}` : undefined;
17
+ const renderTitleButton = onProductClick && !hasTitleOverride
18
+ ? () => (react_1.default.createElement("button", { type: 'button', className: 'cio-product-card-title-section cio-asa-product-card__name cio-asa-product-card__name-btn', "aria-label": titleAriaLabel }, product.name))
19
+ : undefined;
13
20
  return (react_1.default.createElement(constructorio_ui_components_1.ProductCard, { product: product, className: 'cio-asa-product-card', onProductClick: onProductClick, onAddToCart: handleAddToCart, addToCartText: addToCartText, componentOverrides: componentOverrides },
14
21
  react_1.default.createElement(constructorio_ui_components_1.ProductCard.ImageSection, { className: 'cio-asa-product-card__image-wrapper', imageUrl: product.imageUrl || constants_1.PLACEHOLDER_IMAGE }, product.badge && react_1.default.createElement("span", { className: 'cio-asa-product-card__badge' }, product.badge)),
15
22
  react_1.default.createElement(constructorio_ui_components_1.ProductCard.Content, { className: 'cio-asa-product-card__info' },
16
- react_1.default.createElement(constructorio_ui_components_1.ProductCard.TitleSection, { className: 'cio-asa-product-card__name' }),
23
+ react_1.default.createElement(constructorio_ui_components_1.ProductCard.TitleSection, { className: 'cio-asa-product-card__name' }, renderTitleButton),
17
24
  currency && (react_1.default.createElement(constructorio_ui_components_1.ProductCard.PriceSection, { className: 'cio-asa-product-card__price', priceCurrency: currency })),
18
25
  onAddToCart && (react_1.default.createElement(constructorio_ui_components_1.ProductCard.AddToCartButton, { className: 'cio-asa-product-card__add-to-cart' })))));
19
26
  };
package/lib/cjs/components/icons/ArrowRightIcon.js CHANGED
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const react_1 = tslib_1.__importDefault(require("react"));
5
5
  function ArrowRightIcon() {
6
- return (react_1.default.createElement("svg", { width: '10', height: '10', viewBox: '0 0 10 10', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' },
6
+ return (react_1.default.createElement("svg", { width: '10', height: '10', viewBox: '0 0 10 10', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
7
7
  react_1.default.createElement("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M8.25979 4.20698L4.63903 0.72032L5.33267 -1.97313e-07L9.84668 4.34682L9.84668 5.06714L5.33267 9.41396L4.63903 8.69364L8.25979 5.20698L-0.000141371 5.20698L-0.000141328 4.20698L8.25979 4.20698Z', fill: 'currentColor' })));
8
8
  }
9
9
  exports.default = ArrowRightIcon;
package/lib/cjs/components/icons/ChatBubbleDarkIcon.js CHANGED
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const react_1 = tslib_1.__importDefault(require("react"));
5
5
  function ChatBubbleDarkIcon() {
6
- return (react_1.default.createElement("svg", { className: 'cio-asa-button__icon', width: '14', height: '14', viewBox: '0 0 14 14', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true' },
6
+ return (react_1.default.createElement("svg", { className: 'cio-asa-button__icon', width: '14', height: '14', viewBox: '0 0 14 14', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
7
7
  react_1.default.createElement("path", { d: 'M12.667 3.16699C12.7573 3.16717 12.8328 3.24274 12.833 3.33301V12.126L10.874 10.167H3.33301C3.24263 10.1668 3.16699 10.0904 3.16699 10V9.16699H11.833V3.16699H12.667ZM0.666992 0.5H9.33301C9.42353 0.5 9.5 0.576467 9.5 0.666992V6.66699C9.49982 6.75737 9.42342 6.83301 9.33301 6.83301H2.45996L0.5 8.79297V0.666992C0.5 0.576468 0.576468 0.5 0.666992 0.5ZM0.833008 7.9873L2.32031 6.5H9.16699V0.833008H0.833008V7.9873Z', fill: 'white', stroke: 'white' })));
8
8
  }
9
9
  exports.default = ChatBubbleDarkIcon;
package/lib/cjs/components/icons/ChatBubbleLightIcon.js CHANGED
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const react_1 = tslib_1.__importDefault(require("react"));
5
5
  function ChatBubbleLightIcon() {
6
- return (react_1.default.createElement("svg", { className: 'cio-asa-button__icon', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true' },
6
+ return (react_1.default.createElement("svg", { className: 'cio-asa-button__icon', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
7
7
  react_1.default.createElement("path", { d: 'M14 4.50024C14.0903 4.50043 14.1658 4.57599 14.166 4.66626V13.4592L12.207 11.5002H4.66602C4.57563 11.5001 4.5 11.4237 4.5 11.3333V10.5002H13.166V4.50024H14ZM2 1.83325H10.666C10.7565 1.83325 10.833 1.90972 10.833 2.00024V8.00024C10.8328 8.09063 10.7564 8.16626 10.666 8.16626H3.79297L1.83301 10.1262V2.00024C1.83301 1.90972 1.90948 1.83325 2 1.83325ZM2.16602 9.32056L3.65332 7.83325H10.5V2.16626H2.16602V9.32056Z', fill: 'black', stroke: 'black' })));
8
8
  }
9
9
  exports.default = ChatBubbleLightIcon;
package/lib/cjs/components/icons/SendArrowIcon.js CHANGED
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const react_1 = tslib_1.__importDefault(require("react"));
5
5
  function SendArrowIcon() {
6
- return (react_1.default.createElement("svg", { width: '10', height: '11', viewBox: '0 0 10 11', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true' },
6
+ return (react_1.default.createElement("svg", { width: '10', height: '11', viewBox: '0 0 10 11', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
7
7
  react_1.default.createElement("path", { d: 'M0.5 5L5 0.5L9.5 5M5 1.125V10.25', stroke: '#0F1324', strokeOpacity: '0.7', strokeLinecap: 'round', strokeLinejoin: 'round' })));
8
8
  }
9
9
  exports.default = SendArrowIcon;
package/lib/cjs/components/icons/SendPlaneIcon.js CHANGED
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const tslib_1 = require("tslib");
4
4
  const react_1 = tslib_1.__importDefault(require("react"));
5
5
  function SendPlaneIcon() {
6
- return (react_1.default.createElement("svg", { width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true' },
6
+ return (react_1.default.createElement("svg", { width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
7
7
  react_1.default.createElement("path", { d: 'M14.8934 7.09539L14.8884 7.0932L1.54219 1.55758C1.42993 1.51059 1.30778 1.49217 1.18666 1.50395C1.06554 1.51573 0.949225 1.55734 0.848125 1.62508C0.741311 1.69507 0.653573 1.79052 0.592805 1.90283C0.532037 2.01515 0.500145 2.14081 0.5 2.26852V5.80883C0.50006 5.98341 0.561019 6.15249 0.67237 6.28695C0.783722 6.4214 0.938491 6.5128 1.11 6.54539L8.38906 7.89133C8.41767 7.89675 8.44348 7.91199 8.46205 7.93441C8.48062 7.95683 8.49078 7.98503 8.49078 8.01414C8.49078 8.04325 8.48062 8.07145 8.46205 8.09387C8.44348 8.11629 8.41767 8.13153 8.38906 8.13695L1.11031 9.48289C0.938851 9.51539 0.784092 9.60667 0.67269 9.741C0.561288 9.87534 0.500219 10.0443 0.5 10.2188V13.7598C0.499917 13.8817 0.530111 14.0018 0.587871 14.1092C0.645632 14.2166 0.729152 14.3079 0.830938 14.3751C0.953375 14.4564 1.09706 14.4999 1.24406 14.5001C1.34626 14.5 1.4474 14.4795 1.54156 14.4398L14.8875 8.9357L14.8934 8.93289C15.0731 8.85569 15.2262 8.72751 15.3337 8.56421C15.4413 8.40092 15.4986 8.20968 15.4986 8.01414C15.4986 7.81861 15.4413 7.62736 15.3337 7.46407C15.2262 7.30077 15.0731 7.1726 14.8934 7.09539Z', fill: 'white' })));
8
8
  }
9
9
  exports.default = SendPlaneIcon;
package/lib/cjs/hooks/useAsaResults.js CHANGED
@@ -5,14 +5,14 @@ const react_1 = require("react");
5
5
  const useCioAsaContext_1 = require("./useCioAsaContext");
6
6
  const asaStreamHandlers_1 = require("./asaStreamHandlers");
7
7
  const useAsaTracking_1 = tslib_1.__importDefault(require("./useAsaTracking"));
8
- function useAsaResults() {
9
- var _a;
8
+ function useAsaResults(options) {
9
+ var _a, _b;
10
10
  const [messages, setMessages] = (0, react_1.useState)([]);
11
11
  const [isStreaming, setIsStreaming] = (0, react_1.useState)(false);
12
12
  const isStreamingRef = (0, react_1.useRef)(false);
13
13
  const killSwitchRef = (0, react_1.useRef)(false);
14
14
  const readerRef = (0, react_1.useRef)(null);
15
- const threadIdRef = (0, react_1.useRef)(null);
15
+ const threadIdRef = (0, react_1.useRef)((_a = options === null || options === void 0 ? void 0 : options.initialThreadId) !== null && _a !== void 0 ? _a : null);
16
16
  const idCounterRef = (0, react_1.useRef)(0);
17
17
  const contextValue = (0, useCioAsaContext_1.useCioAsaContext)();
18
18
  if (!contextValue) {
@@ -26,7 +26,7 @@ function useAsaResults() {
26
26
  const tracking = (0, useAsaTracking_1.default)({
27
27
  tracker: cioClient.tracker,
28
28
  section,
29
- threadId: (_a = threadIdRef.current) !== null && _a !== void 0 ? _a : undefined,
29
+ threadId: (_b = threadIdRef.current) !== null && _b !== void 0 ? _b : undefined,
30
30
  });
31
31
  const trackingRef = (0, react_1.useRef)(tracking);
32
32
  trackingRef.current = tracking;
package/lib/cjs/hooks/useFocusTrap.js CHANGED
@@ -6,7 +6,7 @@ const FOCUSABLE_SELECTOR = 'a[href], button:not([disabled]), textarea:not([disab
6
6
  * Traps Tab/Shift+Tab focus within the referenced container and invokes
7
7
  * onEscape when Escape is pressed.
8
8
  */
9
- function useFocusTrap(containerRef, { onEscape } = {}) {
9
+ function useFocusTrap(containerRef, { onEscape, trapFocus = true } = {}) {
10
10
  (0, react_1.useEffect)(() => {
11
11
  const container = containerRef.current;
12
12
  if (!container)
@@ -15,7 +15,7 @@ function useFocusTrap(containerRef, { onEscape } = {}) {
15
15
  if (e.key === 'Escape' && onEscape) {
16
16
  onEscape();
17
17
  }
18
- if (e.key === 'Tab') {
18
+ if (e.key === 'Tab' && trapFocus) {
19
19
  const focusableElements = container.querySelectorAll(FOCUSABLE_SELECTOR);
20
20
  if (focusableElements.length === 0)
21
21
  return;
@@ -33,6 +33,6 @@ function useFocusTrap(containerRef, { onEscape } = {}) {
33
33
  };
34
34
  container.addEventListener('keydown', handleKeyDown);
35
35
  return () => container.removeEventListener('keydown', handleKeyDown);
36
- }, [containerRef, onEscape]);
36
+ }, [containerRef, onEscape, trapFocus]);
37
37
  }
38
38
  exports.default = useFocusTrap;
package/lib/cjs/styles.css CHANGED
@@ -29,6 +29,6 @@
29
29
 
30
30
  .cio-asa button:focus-visible,
31
31
  .cio-asa [role='button']:focus-visible {
32
- outline: 2px solid #A980FF;
32
+ outline: 2px solid var(--cio-asa-focus-color, #0F1324);
33
33
  outline-offset: 2px;
34
34
  }
package/lib/cjs/utils/translate.js CHANGED
@@ -10,11 +10,11 @@ const defaultTranslations = {
10
10
  'CioAsa.welcome.placeholder': 'Ask anything',
11
11
  'CioAsa.welcome.sendButton': 'Chat',
12
12
  'CioAsa.welcome.inputAriaLabel': 'Type your question',
13
- 'CioAsa.welcome.sendAriaLabel': 'Send message',
14
13
  'CioAsa.welcome.suggestionsAriaLabel': 'Suggested questions',
15
14
  'CioAsa.messageList.ariaLabel': 'Chat messages',
16
15
  'CioAsa.typingIndicator.ariaLabel': 'Assistant is typing',
17
16
  'CioAsa.userMessage.ariaLabel': 'You said',
17
+ 'CioAsa.aiMessage.ariaLabel': 'Assistant said',
18
18
  'CioAsa.results.viewMore': 'View more products',
19
19
  'CioAsa.results.addToCart': 'Add to cart',
20
20
  'CioAsa.results.saleBadge': 'Sale',
package/lib/cjs/version.js CHANGED
@@ -1,3 +1,3 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.default = '1.2.0';
3
+ exports.default = '1.3.0';
package/lib/mjs/components/Chat/AiMessage.js CHANGED
@@ -18,12 +18,12 @@ export default function AiMessage({ message, componentOverrides, translations })
18
18
  isLoading && !hasText && !hasGroups && (React.createElement(RenderPropsWrapper, { override: componentOverrides?.loader?.reactNode, props: loaderRenderProps },
19
19
  React.createElement(TypingIndicator, { translations: translations }))),
20
20
  hasText && (React.createElement(RenderPropsWrapper, { override: componentOverrides?.text?.reactNode, props: textRenderProps },
21
- React.createElement("div", { className: [
21
+ React.createElement("div", { key: isError ? 'error' : 'text', className: [
22
22
  'cio-asa-ai-message__bubble',
23
23
  isError && 'cio-asa-ai-message__bubble--error',
24
24
  ]
25
25
  .filter(Boolean)
26
- .join(' ') },
26
+ .join(' '), role: isError ? 'alert' : undefined },
27
27
  React.createElement("div", { className: 'cio-asa-ai-message__text' }, text))))));
28
28
  }
29
29
  AiMessage.displayName = 'AiMessage';
package/lib/mjs/components/Chat/Chat.js CHANGED
@@ -6,11 +6,31 @@ import ChatHeader from './ChatHeader';
6
6
  import WelcomeScreen from './WelcomeScreen';
7
7
  import ChatMessageList from './ChatMessageList';
8
8
  import ChatInput from './ChatInput';
9
- const Chat = forwardRef(({ onClose, className, initialSuggestions, termsText, onProductClick, onViewMore, onAddToCart, aspectRatio, currency, normalizeItem, componentOverrides, translations, }, ref) => {
10
- const { messages, sendMessage, isStreaming, clearHistory } = useAsaResults();
9
+ // a11y: text for the screen-reader live region that voices the conversation
10
+ function getAnnouncement(messages, translations) {
11
+ const lastMessage = messages[messages.length - 1];
12
+ if (lastMessage?.role !== 'assistant')
13
+ return '';
14
+ if (lastMessage.status === 'loading' || lastMessage.status === 'streaming') {
15
+ const userText = messages[messages.length - 2]?.text ?? '';
16
+ const youSaid = translate('CioAsa.userMessage.ariaLabel', translations);
17
+ const typing = translate('CioAsa.typingIndicator.ariaLabel', translations);
18
+ return `${youSaid}: ${userText}. ${typing}`;
19
+ }
20
+ if (lastMessage.status === 'done' && lastMessage.text) {
21
+ return `${translate('CioAsa.aiMessage.ariaLabel', translations)}: ${lastMessage.text}`;
22
+ }
23
+ return '';
24
+ }
25
+ const Chat = forwardRef(({ onClose, className, initialSuggestions, termsText, onProductClick, onViewMore, onAddToCart, aspectRatio, currency, normalizeItem, componentOverrides, translations, initialThreadId, }, ref) => {
26
+ const { messages, sendMessage, isStreaming, clearHistory } = useAsaResults({
27
+ initialThreadId,
28
+ });
11
29
  const chatViewRef = useRef(null);
12
30
  const containerRef = useRef(null);
13
31
  const isWelcome = messages.length === 0;
32
+ const isModal = typeof onClose === 'function';
33
+ const announcement = getAnnouncement(messages, translations);
14
34
  useImperativeHandle(ref, () => ({
15
35
  clearHistory,
16
36
  }));
@@ -28,8 +48,9 @@ const Chat = forwardRef(({ onClose, className, initialSuggestions, termsText, on
28
48
  }
29
49
  }
30
50
  }, [isWelcome]);
31
- useFocusTrap(containerRef, { onEscape: onClose });
32
- return (React.createElement("div", { className: ['cio-asa', 'cio-asa-chat', className].filter(Boolean).join(' '), ref: containerRef, role: 'dialog', "aria-labelledby": 'cio-asa-chat-title' },
51
+ useFocusTrap(containerRef, { onEscape: onClose, trapFocus: isModal });
52
+ return (React.createElement("div", { className: ['cio-asa', 'cio-asa-chat', className].filter(Boolean).join(' '), ref: containerRef, role: 'dialog', "aria-modal": isModal ? 'true' : undefined, "aria-label": translate(isWelcome ? 'CioAsa.welcome.title' : 'CioAsa.header.title', translations) },
53
+ React.createElement("div", { className: 'cio-sr-only', role: 'status' }, announcement),
33
54
  React.createElement("div", { className: 'cio-asa-chat-body' }, isWelcome ? (React.createElement("div", { className: 'cio-asa-chat-view cio-asa-chat-view--welcome' },
34
55
  React.createElement(WelcomeScreen, { suggestions: initialSuggestions, onSend: sendMessage, onClose: onClose, termsText: termsText, translations: translations, componentOverrides: componentOverrides?.welcomeScreen }))) : (React.createElement("div", { className: 'cio-asa-chat-view cio-asa-chat-view--chat', ref: chatViewRef },
35
56
  React.createElement(ChatHeader, { onClose: onClose, translations: translations, componentOverrides: componentOverrides?.header }),
package/lib/mjs/components/Chat/ChatHeader.js CHANGED
@@ -8,7 +8,7 @@ export default function ChatHeader({ onClose, translations, componentOverrides }
8
8
  };
9
9
  return (React.createElement(RenderPropsWrapper, { override: componentOverrides?.reactNode, props: renderProps },
10
10
  React.createElement("div", { className: 'cio-asa-chat-header' },
11
- React.createElement("span", { id: 'cio-asa-chat-title', className: 'cio-asa-chat-header__title' }, renderProps.title),
11
+ React.createElement("span", { id: 'cio-asa-chat-title', className: 'cio-asa-chat-header__title', role: 'heading', "aria-level": 2 }, renderProps.title),
12
12
  onClose && (React.createElement("button", { type: 'button', className: 'cio-asa-chat-header__close', onClick: onClose, "aria-label": translate('CioAsa.header.close', translations) })))));
13
13
  }
14
14
  ChatHeader.displayName = 'ChatHeader';
package/lib/mjs/components/Chat/ChatMessageList.js CHANGED
@@ -28,7 +28,7 @@ export default function ChatMessageList({ messages, onProductClick, onViewMore,
28
28
  el.scrollTo({ top: el.scrollHeight, behavior: isNewMessage ? 'smooth' : 'auto' });
29
29
  });
30
30
  }, [messages]);
31
- return (React.createElement("div", { className: 'cio-asa-chat-message-list', ref: listRef, onScroll: handleScroll, role: 'log', "aria-live": 'polite', "aria-label": translate('CioAsa.messageList.ariaLabel', translations) }, messages.map((message) => {
31
+ return (React.createElement("div", { className: 'cio-asa-chat-message-list', ref: listRef, onScroll: handleScroll, role: 'log', "aria-live": 'off', tabIndex: 0, "aria-label": translate('CioAsa.messageList.ariaLabel', translations) }, messages.map((message) => {
32
32
  if (message.role === 'user') {
33
33
  return (React.createElement(UserMessage, { key: message.id, text: message.text, translations: translations, componentOverrides: userMessageOverrides }));
34
34
  }
package/lib/mjs/components/Chat/TypingIndicator.js CHANGED
@@ -1,10 +1,11 @@
1
1
  import React from 'react';
2
2
  import translate from '../../utils/translate';
3
3
  export default function TypingIndicator({ translations }) {
4
- return (React.createElement("div", { className: 'cio-asa-typing-indicator', role: 'status', "aria-label": translate('CioAsa.typingIndicator.ariaLabel', translations) },
5
- React.createElement("div", { className: 'cio-asa-typing-indicator__dots' },
4
+ return (React.createElement("div", { className: 'cio-asa-typing-indicator', role: 'status' },
5
+ React.createElement("div", { className: 'cio-asa-typing-indicator__dots', "aria-hidden": 'true' },
6
6
  React.createElement("span", { className: 'cio-asa-typing-indicator__dot' }),
7
7
  React.createElement("span", { className: 'cio-asa-typing-indicator__dot' }),
8
- React.createElement("span", { className: 'cio-asa-typing-indicator__dot' }))));
8
+ React.createElement("span", { className: 'cio-asa-typing-indicator__dot' })),
9
+ React.createElement("span", { className: 'cio-sr-only' }, translate('CioAsa.typingIndicator.ariaLabel', translations))));
9
10
  }
10
11
  TypingIndicator.displayName = 'TypingIndicator';
package/lib/mjs/components/Chat/WelcomeScreen.js CHANGED
@@ -29,11 +29,11 @@ export default function WelcomeScreen({ suggestions = DEFAULT_SUGGESTIONS, onSen
29
29
  React.createElement(RenderPropsWrapper, { override: componentOverrides?.input?.reactNode, props: inputRenderProps },
30
30
  React.createElement("div", { className: `cio-asa-welcome-screen__input-row${disabled ? ' cio-asa-welcome-screen__input-row--disabled' : ''}` },
31
31
  React.createElement("input", { type: 'text', className: 'cio-asa-welcome-screen__input', value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyDown: handleKeyDown, placeholder: inputRenderProps.placeholder, disabled: disabled, "aria-label": translate('CioAsa.welcome.inputAriaLabel', translations) }),
32
- React.createElement("button", { type: 'button', className: 'cio-asa-welcome-screen__send-btn', onClick: handleSubmit, disabled: disabled || !inputValue.trim(), "aria-label": translate('CioAsa.welcome.sendAriaLabel', translations) },
32
+ React.createElement("button", { type: 'button', className: 'cio-asa-welcome-screen__send-btn', onClick: handleSubmit, disabled: disabled || !inputValue.trim(), "aria-label": translations?.['CioAsa.welcome.sendAriaLabel']?.trim() || undefined },
33
33
  translate('CioAsa.welcome.sendButton', translations),
34
34
  React.createElement(SendPlaneIcon, null)))),
35
35
  suggestions.length > 0 && (React.createElement(RenderPropsWrapper, { override: componentOverrides?.suggestedQuestions?.reactNode, props: suggestionsRenderProps },
36
- React.createElement("nav", { className: 'cio-asa-welcome-screen__suggestions', "aria-label": translate('CioAsa.welcome.suggestionsAriaLabel', translations) }, suggestions.map((suggestion) => (React.createElement("button", { key: suggestion, type: 'button', className: 'cio-asa-welcome-screen__suggestion-chip', disabled: disabled, onClick: () => handleSuggestionClick(suggestion) }, suggestion))))))),
36
+ React.createElement("div", { className: 'cio-asa-welcome-screen__suggestions', role: 'group', "aria-label": translate('CioAsa.welcome.suggestionsAriaLabel', translations) }, suggestions.map((suggestion) => (React.createElement("button", { key: suggestion, type: 'button', className: 'cio-asa-welcome-screen__suggestion-chip', disabled: disabled, onClick: () => handleSuggestionClick(suggestion) }, suggestion))))))),
37
37
  termsText && React.createElement("div", { className: 'cio-asa-welcome-screen__terms' }, termsText)));
38
38
  }
39
39
  WelcomeScreen.displayName = 'WelcomeScreen';
package/lib/mjs/components/ResultsBlock/ResultsBlock.css CHANGED
@@ -100,6 +100,22 @@
100
100
  min-height: calc(2 * 12px * 1.3);
101
101
  }
102
102
 
103
+ .cio-asa-product-card .cio-asa-product-card__name-btn {
104
+ background: none;
105
+ border: 0;
106
+ padding: 0;
107
+ font: inherit;
108
+ font-size: 12px;
109
+ color: inherit;
110
+ text-align: left;
111
+ cursor: pointer;
112
+ }
113
+
114
+ .cio-asa-product-card .cio-asa-product-card__name-btn:focus-visible {
115
+ outline: 2px solid var(--cio-asa-focus-color, #0F1324);
116
+ outline-offset: 2px;
117
+ }
118
+
103
119
  .cio-asa-product-card__description {
104
120
  font-size: 11px;
105
121
  line-height: 1.3;
package/lib/mjs/components/ResultsBlock/renderProductCard.js CHANGED
@@ -7,10 +7,16 @@ export default function createProductCardRenderer({ currency, addToCartText, onP
7
7
  : undefined;
8
8
  return function renderProductCard(renderProps) {
9
9
  const product = renderProps.product;
10
+ const hasTitleOverride = Boolean(componentOverrides?.content?.title?.reactNode);
11
+ const shownPrice = product.salePrice ?? product.price;
12
+ const titleAriaLabel = currency && shownPrice != null ? `${product.name}, ${currency} ${shownPrice}` : undefined;
13
+ const renderTitleButton = onProductClick && !hasTitleOverride
14
+ ? () => (React.createElement("button", { type: 'button', className: 'cio-product-card-title-section cio-asa-product-card__name cio-asa-product-card__name-btn', "aria-label": titleAriaLabel }, product.name))
15
+ : undefined;
10
16
  return (React.createElement(ProductCard, { product: product, className: 'cio-asa-product-card', onProductClick: onProductClick, onAddToCart: handleAddToCart, addToCartText: addToCartText, componentOverrides: componentOverrides },
11
17
  React.createElement(ProductCard.ImageSection, { className: 'cio-asa-product-card__image-wrapper', imageUrl: product.imageUrl || PLACEHOLDER_IMAGE }, product.badge && React.createElement("span", { className: 'cio-asa-product-card__badge' }, product.badge)),
12
18
  React.createElement(ProductCard.Content, { className: 'cio-asa-product-card__info' },
13
- React.createElement(ProductCard.TitleSection, { className: 'cio-asa-product-card__name' }),
19
+ React.createElement(ProductCard.TitleSection, { className: 'cio-asa-product-card__name' }, renderTitleButton),
14
20
  currency && (React.createElement(ProductCard.PriceSection, { className: 'cio-asa-product-card__price', priceCurrency: currency })),
15
21
  onAddToCart && (React.createElement(ProductCard.AddToCartButton, { className: 'cio-asa-product-card__add-to-cart' })))));
16
22
  };
package/lib/mjs/components/icons/ArrowRightIcon.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  export default function ArrowRightIcon() {
3
- return (React.createElement("svg", { width: '10', height: '10', viewBox: '0 0 10 10', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' },
3
+ return (React.createElement("svg", { width: '10', height: '10', viewBox: '0 0 10 10', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
4
4
  React.createElement("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M8.25979 4.20698L4.63903 0.72032L5.33267 -1.97313e-07L9.84668 4.34682L9.84668 5.06714L5.33267 9.41396L4.63903 8.69364L8.25979 5.20698L-0.000141371 5.20698L-0.000141328 4.20698L8.25979 4.20698Z', fill: 'currentColor' })));
5
5
  }
package/lib/mjs/components/icons/ChatBubbleDarkIcon.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  export default function ChatBubbleDarkIcon() {
3
- return (React.createElement("svg", { className: 'cio-asa-button__icon', width: '14', height: '14', viewBox: '0 0 14 14', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true' },
3
+ return (React.createElement("svg", { className: 'cio-asa-button__icon', width: '14', height: '14', viewBox: '0 0 14 14', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
4
4
  React.createElement("path", { d: 'M12.667 3.16699C12.7573 3.16717 12.8328 3.24274 12.833 3.33301V12.126L10.874 10.167H3.33301C3.24263 10.1668 3.16699 10.0904 3.16699 10V9.16699H11.833V3.16699H12.667ZM0.666992 0.5H9.33301C9.42353 0.5 9.5 0.576467 9.5 0.666992V6.66699C9.49982 6.75737 9.42342 6.83301 9.33301 6.83301H2.45996L0.5 8.79297V0.666992C0.5 0.576468 0.576468 0.5 0.666992 0.5ZM0.833008 7.9873L2.32031 6.5H9.16699V0.833008H0.833008V7.9873Z', fill: 'white', stroke: 'white' })));
5
5
  }
package/lib/mjs/components/icons/ChatBubbleLightIcon.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  export default function ChatBubbleLightIcon() {
3
- return (React.createElement("svg", { className: 'cio-asa-button__icon', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true' },
3
+ return (React.createElement("svg", { className: 'cio-asa-button__icon', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
4
4
  React.createElement("path", { d: 'M14 4.50024C14.0903 4.50043 14.1658 4.57599 14.166 4.66626V13.4592L12.207 11.5002H4.66602C4.57563 11.5001 4.5 11.4237 4.5 11.3333V10.5002H13.166V4.50024H14ZM2 1.83325H10.666C10.7565 1.83325 10.833 1.90972 10.833 2.00024V8.00024C10.8328 8.09063 10.7564 8.16626 10.666 8.16626H3.79297L1.83301 10.1262V2.00024C1.83301 1.90972 1.90948 1.83325 2 1.83325ZM2.16602 9.32056L3.65332 7.83325H10.5V2.16626H2.16602V9.32056Z', fill: 'black', stroke: 'black' })));
5
5
  }
package/lib/mjs/components/icons/SendArrowIcon.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  export default function SendArrowIcon() {
3
- return (React.createElement("svg", { width: '10', height: '11', viewBox: '0 0 10 11', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true' },
3
+ return (React.createElement("svg", { width: '10', height: '11', viewBox: '0 0 10 11', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
4
4
  React.createElement("path", { d: 'M0.5 5L5 0.5L9.5 5M5 1.125V10.25', stroke: '#0F1324', strokeOpacity: '0.7', strokeLinecap: 'round', strokeLinejoin: 'round' })));
5
5
  }
package/lib/mjs/components/icons/SendPlaneIcon.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
2
  export default function SendPlaneIcon() {
3
- return (React.createElement("svg", { width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true' },
3
+ return (React.createElement("svg", { width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', focusable: 'false' },
4
4
  React.createElement("path", { d: 'M14.8934 7.09539L14.8884 7.0932L1.54219 1.55758C1.42993 1.51059 1.30778 1.49217 1.18666 1.50395C1.06554 1.51573 0.949225 1.55734 0.848125 1.62508C0.741311 1.69507 0.653573 1.79052 0.592805 1.90283C0.532037 2.01515 0.500145 2.14081 0.5 2.26852V5.80883C0.50006 5.98341 0.561019 6.15249 0.67237 6.28695C0.783722 6.4214 0.938491 6.5128 1.11 6.54539L8.38906 7.89133C8.41767 7.89675 8.44348 7.91199 8.46205 7.93441C8.48062 7.95683 8.49078 7.98503 8.49078 8.01414C8.49078 8.04325 8.48062 8.07145 8.46205 8.09387C8.44348 8.11629 8.41767 8.13153 8.38906 8.13695L1.11031 9.48289C0.938851 9.51539 0.784092 9.60667 0.67269 9.741C0.561288 9.87534 0.500219 10.0443 0.5 10.2188V13.7598C0.499917 13.8817 0.530111 14.0018 0.587871 14.1092C0.645632 14.2166 0.729152 14.3079 0.830938 14.3751C0.953375 14.4564 1.09706 14.4999 1.24406 14.5001C1.34626 14.5 1.4474 14.4795 1.54156 14.4398L14.8875 8.9357L14.8934 8.93289C15.0731 8.85569 15.2262 8.72751 15.3337 8.56421C15.4413 8.40092 15.4986 8.20968 15.4986 8.01414C15.4986 7.81861 15.4413 7.62736 15.3337 7.46407C15.2262 7.30077 15.0731 7.1726 14.8934 7.09539Z', fill: 'white' })));
5
5
  }
package/lib/mjs/hooks/useAsaResults.js CHANGED
@@ -2,13 +2,13 @@ import { useCallback, useEffect, useRef, useState } from 'react';
2
2
  import { useCioAsaContext } from './useCioAsaContext';
3
3
  import { handleSearchResult, handleMessage, handleServerError, handleStreamEnd, handleStreamError, } from './asaStreamHandlers';
4
4
  import useAsaTracking from './useAsaTracking';
5
- export default function useAsaResults() {
5
+ export default function useAsaResults(options) {
6
6
  const [messages, setMessages] = useState([]);
7
7
  const [isStreaming, setIsStreaming] = useState(false);
8
8
  const isStreamingRef = useRef(false);
9
9
  const killSwitchRef = useRef(false);
10
10
  const readerRef = useRef(null);
11
- const threadIdRef = useRef(null);
11
+ const threadIdRef = useRef(options?.initialThreadId ?? null);
12
12
  const idCounterRef = useRef(0);
13
13
  const contextValue = useCioAsaContext();
14
14
  if (!contextValue) {
package/lib/mjs/hooks/useFocusTrap.js CHANGED
@@ -4,7 +4,7 @@ const FOCUSABLE_SELECTOR = 'a[href], button:not([disabled]), textarea:not([disab
4
4
  * Traps Tab/Shift+Tab focus within the referenced container and invokes
5
5
  * onEscape when Escape is pressed.
6
6
  */
7
- export default function useFocusTrap(containerRef, { onEscape } = {}) {
7
+ export default function useFocusTrap(containerRef, { onEscape, trapFocus = true } = {}) {
8
8
  useEffect(() => {
9
9
  const container = containerRef.current;
10
10
  if (!container)
@@ -13,7 +13,7 @@ export default function useFocusTrap(containerRef, { onEscape } = {}) {
13
13
  if (e.key === 'Escape' && onEscape) {
14
14
  onEscape();
15
15
  }
16
- if (e.key === 'Tab') {
16
+ if (e.key === 'Tab' && trapFocus) {
17
17
  const focusableElements = container.querySelectorAll(FOCUSABLE_SELECTOR);
18
18
  if (focusableElements.length === 0)
19
19
  return;
@@ -31,5 +31,5 @@ export default function useFocusTrap(containerRef, { onEscape } = {}) {
31
31
  };
32
32
  container.addEventListener('keydown', handleKeyDown);
33
33
  return () => container.removeEventListener('keydown', handleKeyDown);
34
- }, [containerRef, onEscape]);
34
+ }, [containerRef, onEscape, trapFocus]);
35
35
  }
package/lib/mjs/styles.css CHANGED
@@ -29,6 +29,6 @@
29
29
 
30
30
  .cio-asa button:focus-visible,
31
31
  .cio-asa [role='button']:focus-visible {
32
- outline: 2px solid #A980FF;
32
+ outline: 2px solid var(--cio-asa-focus-color, #0F1324);
33
33
  outline-offset: 2px;
34
34
  }
package/lib/mjs/utils/translate.js CHANGED
@@ -8,11 +8,11 @@ const defaultTranslations = {
8
8
  'CioAsa.welcome.placeholder': 'Ask anything',
9
9
  'CioAsa.welcome.sendButton': 'Chat',
10
10
  'CioAsa.welcome.inputAriaLabel': 'Type your question',
11
- 'CioAsa.welcome.sendAriaLabel': 'Send message',
12
11
  'CioAsa.welcome.suggestionsAriaLabel': 'Suggested questions',
13
12
  'CioAsa.messageList.ariaLabel': 'Chat messages',
14
13
  'CioAsa.typingIndicator.ariaLabel': 'Assistant is typing',
15
14
  'CioAsa.userMessage.ariaLabel': 'You said',
15
+ 'CioAsa.aiMessage.ariaLabel': 'Assistant said',
16
16
  'CioAsa.results.viewMore': 'View more products',
17
17
  'CioAsa.results.addToCart': 'Add to cart',
18
18
  'CioAsa.results.saleBadge': 'Sale',
package/lib/mjs/version.js CHANGED
@@ -1 +1 @@
1
- export default '1.2.0';
1
+ export default '1.3.0';
package/lib/types/components/Chat/Chat.d.ts CHANGED
@@ -33,6 +33,8 @@ interface ChatProps {
33
33
  componentOverrides?: ChatComponentOverrides;
34
34
  /** Translation overrides for internationalizing UI strings */
35
35
  translations?: Translations;
36
+ /** Seed the thread id (e.g. loaded from browser storage) to resume a prior conversation. Read once on mount. */
37
+ initialThreadId?: string;
36
38
  }
37
39
  declare const Chat: React.ForwardRefExoticComponent<ChatProps & React.RefAttributes<ChatHandle>>;
38
40
  export default Chat;
package/lib/types/hooks/useAsaResults.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- import { UseChatReturn } from '../types';
2
- export default function useAsaResults(): UseChatReturn;
1
+ import { UseAsaResultsOptions, UseChatReturn } from '../types';
2
+ export default function useAsaResults(options?: UseAsaResultsOptions): UseChatReturn;
package/lib/types/hooks/useFocusTrap.d.ts CHANGED
@@ -2,10 +2,12 @@ import { RefObject } from 'react';
2
2
  interface UseFocusTrapOptions {
3
3
  /** Called when the Escape key is pressed while focus is inside the container. */
4
4
  onEscape?: () => void;
5
+ /** Cycle Tab/Shift+Tab inside the container. Defaults to true. */
6
+ trapFocus?: boolean;
5
7
  }
6
8
  /**
7
9
  * Traps Tab/Shift+Tab focus within the referenced container and invokes
8
10
  * onEscape when Escape is pressed.
9
11
  */
10
- export default function useFocusTrap(containerRef: RefObject<HTMLElement>, { onEscape }?: UseFocusTrapOptions): void;
12
+ export default function useFocusTrap(containerRef: RefObject<HTMLElement>, { onEscape, trapFocus }?: UseFocusTrapOptions): void;
11
13
  export {};
package/lib/types/index.d.ts CHANGED
@@ -12,4 +12,4 @@ export type { UseAsaTrackingProps, UseAsaTrackingReturn } from './hooks/useAsaTr
12
12
  export { normalizeItemToProduct } from './utils/productNormalizer';
13
13
  export type { Product, NormalizeOptions } from './utils/productNormalizer';
14
14
  export { ConstructorIOClient } from './types';
15
- export type { Nullable, CioAsaProviderProps, AsaContextValue, CioClientOptions, RequestConfigs, Formatters, UrlHelpers, QueryParamEncodingOptions, DefaultQueryStringMap, Translations, ChatMessage, ChatMessageStatus, ResultGroup, ResultGroupMeta, UseChatReturn, AsaCallbacks, AssistantSubmitSource, AssistantTrackedItem, ChatComponentOverrides, WelcomeScreenOverrides, ChatInputOverrides, AiMessageOverrides, ResultsBlockOverrides, ComponentOverrideProps, IncludeComponentOverrides, ChatHeaderRenderProps, ChatInputRenderProps, WelcomeScreenTitleRenderProps, WelcomeScreenInputRenderProps, SuggestedQuestionsRenderProps, UserMessageRenderProps, AiMessageLoaderRenderProps, AiMessageTextRenderProps, ResultsGroupTitleRenderProps, ResultsViewMoreRenderProps, } from './types';
15
+ export type { Nullable, CioAsaProviderProps, AsaContextValue, CioClientOptions, RequestConfigs, Formatters, UrlHelpers, QueryParamEncodingOptions, DefaultQueryStringMap, Translations, ChatMessage, ChatMessageStatus, ResultGroup, ResultGroupMeta, UseAsaResultsOptions, UseChatReturn, AsaCallbacks, AssistantSubmitSource, AssistantTrackedItem, ChatComponentOverrides, WelcomeScreenOverrides, ChatInputOverrides, AiMessageOverrides, ResultsBlockOverrides, ComponentOverrideProps, IncludeComponentOverrides, ChatHeaderRenderProps, ChatInputRenderProps, WelcomeScreenTitleRenderProps, WelcomeScreenInputRenderProps, SuggestedQuestionsRenderProps, UserMessageRenderProps, AiMessageLoaderRenderProps, AiMessageTextRenderProps, ResultsGroupTitleRenderProps, ResultsViewMoreRenderProps, } from './types';
package/lib/types/types.d.ts CHANGED
@@ -92,6 +92,10 @@ export interface UseChatReturn {
92
92
  isStreaming: boolean;
93
93
  clearHistory: () => void;
94
94
  }
95
+ export interface UseAsaResultsOptions {
96
+ /** Seed the thread id (e.g. loaded from browser storage) to resume a prior conversation. Read once on mount. */
97
+ initialThreadId?: string;
98
+ }
95
99
  /** How an intent was submitted: typed into the input, or a suggestion chip clicked. */
96
100
  export type AssistantSubmitSource = 'input' | 'suggestion';
97
101
  /** An item within a viewed/clicked search_result pod. */
@@ -161,11 +165,13 @@ export type Translations = {
161
165
  'CioAsa.welcome.placeholder'?: string;
162
166
  'CioAsa.welcome.sendButton'?: string;
163
167
  'CioAsa.welcome.inputAriaLabel'?: string;
168
+ /** @deprecated No default; the send button is named by its visible label. */
164
169
  'CioAsa.welcome.sendAriaLabel'?: string;
165
170
  'CioAsa.welcome.suggestionsAriaLabel'?: string;
166
171
  'CioAsa.messageList.ariaLabel'?: string;
167
172
  'CioAsa.typingIndicator.ariaLabel'?: string;
168
173
  'CioAsa.userMessage.ariaLabel'?: string;
174
+ 'CioAsa.aiMessage.ariaLabel'?: string;
169
175
  'CioAsa.results.viewMore'?: string;
170
176
  'CioAsa.results.addToCart'?: string;
171
177
  'CioAsa.results.saleBadge'?: string;
package/lib/types/version.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- declare const _default: "1.2.0";
1
+ declare const _default: "1.3.0";
2
2
  export default _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@constructor-io/constructorio-ui-asa",
3
- "version": "1.2.0",
3
+ "version": "1.3.0",
4
4
  "description": "Constructor.io AI Shopping Agent UI library for web applications",
5
5
  "author": "constructor.io",
6
6
  "license": "MIT",
@@ -76,12 +76,11 @@
76
76
  "tslib": "^2.4.0"
77
77
  },
78
78
  "devDependencies": {
79
- "@axe-core/react": "^4.7.0",
80
- "@constructor-io/constructorio-client-javascript": "^2.91.0",
81
- "@constructor-io/constructorio-ui-components": "^1.6.0",
82
79
  "@babel/preset-env": "^7.28.3",
83
80
  "@babel/preset-react": "^7.27.1",
84
81
  "@babel/preset-typescript": "^7.27.1",
82
+ "@constructor-io/constructorio-client-javascript": "^2.91.0",
83
+ "@constructor-io/constructorio-ui-components": "^1.6.0",
85
84
  "@cspell/eslint-plugin": "^6.18.1",
86
85
  "@storybook/addon-a11y": "^8.6.14",
87
86
  "@storybook/addon-actions": "^8.6.14",
@@ -104,6 +103,7 @@
104
103
  "@types/react-dom": "^18.0.9",
105
104
  "@typescript-eslint/eslint-plugin": "^5.47.0",
106
105
  "@typescript-eslint/parser": "^5.47.0",
106
+ "axe-playwright": "^2.2.2",
107
107
  "chromatic": "^10.0.0",
108
108
  "eslint": "^8.30.0",
109
109
  "eslint-config-airbnb": "^19.0.4",
@@ -130,7 +130,6 @@
130
130
  "vite-plugin-css-injected-by-js": "^3.1.0",
131
131
  "webpack": "^5.105.4"
132
132
  },
133
- "dependencies": {},
134
133
  "overrides": {
135
134
  "brace-expansion@1": "1.1.18",
136
135
  "brace-expansion@2": "2.1.4",