genesys-spark-components 4.180.2 → 4.182.0

package/dist/collection/components/stable/gux-icon/icons/brand/teams.svg

@@ -1,28 +1,28 @@
-<svg width="32" height="30" viewBox="0 0 32 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g clip-path="url(#clip0_32119_98)">
-<path d="M22.3205 11.0769H30.5862C31.3671 11.0769 32.0002 11.7051 32.0002 12.48V19.951C32.0002 22.799 29.6735 25.1077 26.8035 25.1077H26.7789C23.9089 25.1081 21.582 22.7997 21.5815 19.9517C21.5815 19.9515 21.5815 19.9512 21.5815 19.951V11.8102C21.5816 11.4052 21.9124 11.0769 22.3205 11.0769Z" fill="#5059C9"/>
-<path d="M27.9069 9.60001C29.7565 9.60001 31.2558 8.11222 31.2558 6.27694C31.2558 4.44165 29.7565 2.95386 27.9069 2.95386C26.0574 2.95386 24.5581 4.44165 24.5581 6.27694C24.5581 8.11222 26.0574 9.60001 27.9069 9.60001Z" fill="#5059C9"/>
-<path d="M17.4886 9.60001C20.1601 9.60001 22.3258 7.45098 22.3258 4.80001C22.3258 2.14904 20.1601 0 17.4886 0C14.8171 0 12.6514 2.14904 12.6514 4.80001C12.6514 7.45098 14.8171 9.60001 17.4886 9.60001Z" fill="#7B83EB"/>
-<path d="M23.9381 11.0769H10.2941C9.52253 11.0959 8.91215 11.7313 8.93005 12.497V21.0181C8.8223 25.613 12.4857 29.426 17.1161 29.5385C21.7465 29.426 25.4099 25.613 25.3022 21.0181V12.497C25.32 11.7313 24.7097 11.0959 23.9381 11.0769Z" fill="#7B83EB"/>
-<path opacity="0.1" d="M17.8603 11.0769V23.0178C17.8566 23.5654 17.5222 24.0573 17.0119 24.2658C16.8495 24.334 16.6749 24.3692 16.4985 24.3692H9.58496C9.48822 24.1255 9.39892 23.8818 9.32449 23.6308C9.064 22.7834 8.93108 21.9025 8.93007 21.0166V12.4948C8.91218 11.7303 9.52156 11.0959 10.2919 11.0769H17.8603Z" fill="black"/>
-<path opacity="0.2" d="M17.1161 11.0769V23.7563C17.1161 23.9313 17.0807 24.1046 17.0119 24.2658C16.8018 24.7722 16.3061 25.104 15.7543 25.1077H9.93474C9.80822 24.864 9.68915 24.6203 9.58496 24.3692C9.48077 24.1181 9.39892 23.8818 9.32449 23.6308C9.064 22.7834 8.93108 21.9025 8.93007 21.0166V12.4948C8.91218 11.7303 9.52156 11.0959 10.2919 11.0769H17.1161Z" fill="black"/>
-<path opacity="0.2" d="M17.1161 11.0769V22.2794C17.1105 23.0234 16.504 23.6251 15.7543 23.6308H9.32449C9.064 22.7834 8.93108 21.9025 8.93007 21.0166V12.4948C8.91218 11.7303 9.52156 11.0959 10.2919 11.0769H17.1161Z" fill="black"/>
-<path opacity="0.2" d="M16.3719 11.0769V22.2794C16.3663 23.0234 15.7598 23.6251 15.0101 23.6308H9.32449C9.064 22.7834 8.93108 21.9025 8.93007 21.0166V12.4948C8.91218 11.7303 9.52156 11.0959 10.2919 11.0769H16.3719Z" fill="black"/>
-<path opacity="0.1" d="M17.8605 7.25909V9.58524C17.734 9.59262 17.6149 9.60001 17.4884 9.60001C17.3619 9.60001 17.2428 9.59263 17.1163 9.58524C16.8651 9.5687 16.616 9.52915 16.3721 9.46709C14.8652 9.11296 13.6201 8.06422 13.0233 6.64617C12.9206 6.40804 12.8409 6.16077 12.7852 5.90771H16.4986C17.2496 5.91054 17.8577 6.5139 17.8605 7.25909Z" fill="black"/>
-<path opacity="0.2" d="M17.1165 7.99755V9.58525C16.8653 9.56871 16.6161 9.52916 16.3723 9.4671C14.8653 9.11296 13.6203 8.06423 13.0234 6.64618H15.7546C16.5055 6.649 17.1136 7.25238 17.1165 7.99755Z" fill="black"/>
-<path opacity="0.2" d="M17.1165 7.99755V9.58525C16.8653 9.56871 16.6161 9.52916 16.3723 9.4671C14.8653 9.11296 13.6203 8.06423 13.0234 6.64618H15.7546C16.5055 6.649 17.1136 7.25238 17.1165 7.99755Z" fill="black"/>
-<path opacity="0.2" d="M16.3723 7.99756V9.4671C14.8653 9.11296 13.6203 8.06422 13.0234 6.64618H15.0104C15.7614 6.64901 16.3694 7.2524 16.3723 7.99756Z" fill="black"/>
-<path d="M1.36409 6.64618H15.008C15.7614 6.64618 16.3721 7.25221 16.3721 7.99977V21.5387C16.3721 22.2863 15.7613 22.8923 15.008 22.8923H1.36409C0.610716 22.8923 0 22.2863 0 21.5387V7.99977C0 7.25221 0.61073 6.64618 1.36409 6.64618Z" fill="url(#paint0_linear_32119_98)"/>
-<path d="M11.7761 11.7992H9.04865V19.169H7.31098V11.7992H4.59619V10.3695H11.7761V11.7992Z" fill="white"/>
+<path d="M16.7403 9.25H22.9395C23.5252 9.25 24 9.71786 24 10.295V15.8593C24 17.9805 22.255 19.7 20.1025 19.7H20.0841C17.9316 19.7003 16.1863 17.981 16.186 15.8599C16.186 15.8597 16.186 15.8595 16.186 15.8593V9.79616C16.186 9.49452 16.4342 9.25 16.7403 9.25Z" fill="#5059C9"/>
+<path d="M20.9301 8.15001C22.3172 8.15001 23.4417 7.04192 23.4417 5.67501C23.4417 4.30811 22.3172 3.20001 20.9301 3.20001C19.543 3.20001 18.4185 4.30811 18.4185 5.67501C18.4185 7.04192 19.543 8.15001 20.9301 8.15001Z" fill="#5059C9"/>
+<path d="M13.1162 8.15001C15.1198 8.15001 16.7441 6.54943 16.7441 4.575C16.7441 2.60058 15.1198 1 13.1162 1C11.1126 1 9.48828 2.60058 9.48828 4.575C9.48828 6.54943 11.1126 8.15001 13.1162 8.15001Z" fill="#7B83EB"/>
+<path d="M17.9535 9.25H7.7206C7.1419 9.26411 6.68411 9.73737 6.69754 10.3077V16.6541C6.61673 20.0763 9.3643 22.9163 12.8371 23C16.3099 22.9163 19.0574 20.0763 18.9766 16.6541V10.3077C18.99 9.73737 18.5322 9.26411 17.9535 9.25Z" fill="#7B83EB"/>
+<path opacity="0.1" d="M13.3952 9.25V18.1435C13.3925 18.5513 13.1417 18.9177 12.759 19.073C12.6371 19.1238 12.5061 19.15 12.3738 19.15H7.18872C7.11617 18.9685 7.04919 18.787 6.99337 18.6C6.798 17.9689 6.69831 17.3128 6.69755 16.653V10.306C6.68414 9.73663 7.14117 9.26411 7.71895 9.25H13.3952Z" fill="black"/>
+<path opacity="0.2" d="M12.8371 9.25V18.6935C12.8371 18.8239 12.8105 18.9529 12.759 19.073C12.6014 19.4501 12.2296 19.6973 11.8157 19.7H7.45105C7.35617 19.5185 7.26687 19.337 7.18872 19.15C7.11058 18.963 7.04919 18.787 6.99337 18.6C6.798 17.9689 6.69831 17.3128 6.69755 16.653V10.306C6.68414 9.73663 7.14117 9.26411 7.71895 9.25H12.8371Z" fill="black"/>
+<path opacity="0.2" d="M12.8371 9.25V17.5935C12.8328 18.1476 12.378 18.5958 11.8157 18.6H6.99337C6.798 17.9689 6.69831 17.3128 6.69755 16.653V10.306C6.68414 9.73663 7.14117 9.26411 7.71895 9.25H12.8371Z" fill="black"/>
+<path opacity="0.2" d="M12.2789 9.25V17.5935C12.2747 18.1476 11.8199 18.5958 11.2576 18.6H6.99337C6.798 17.9689 6.69831 17.3128 6.69755 16.653V10.306C6.68414 9.73663 7.14117 9.26411 7.71895 9.25H12.2789Z" fill="black"/>
+<path opacity="0.1" d="M13.3954 6.40651V8.13901C13.3005 8.14451 13.2112 8.15002 13.1163 8.15002C13.0214 8.15002 12.9321 8.14452 12.8372 8.13901C12.6488 8.12669 12.462 8.09724 12.2791 8.05102C11.1489 7.78726 10.2151 7.00617 9.76748 5.95002C9.69045 5.77266 9.63066 5.5885 9.58887 5.40002H12.374C12.9372 5.40213 13.3932 5.85151 13.3954 6.40651Z" fill="black"/>
+<path opacity="0.2" d="M12.8373 6.9565V8.13901C12.6489 8.12669 12.4621 8.09723 12.2792 8.05101C11.149 7.78725 10.2152 7.00616 9.76758 5.95001H11.8159C12.3792 5.95211 12.8352 6.40151 12.8373 6.9565Z" fill="black"/>
+<path opacity="0.2" d="M12.8373 6.9565V8.13901C12.6489 8.12669 12.4621 8.09723 12.2792 8.05101C11.149 7.78725 10.2152 7.00616 9.76758 5.95001H11.8159C12.3792 5.95211 12.8352 6.40151 12.8373 6.9565Z" fill="black"/>
+<path opacity="0.2" d="M12.2792 6.95651V8.05101C11.149 7.78725 10.2152 7.00616 9.76758 5.95001H11.2578C11.821 5.95212 12.2771 6.40152 12.2792 6.95651Z" fill="black"/>
+<path d="M1.02306 5.95001H11.256C11.821 5.95001 12.2791 6.40138 12.2791 6.95816V17.0419C12.2791 17.5986 11.821 18.05 11.256 18.05H1.02306C0.458037 18.05 0 17.5986 0 17.0419V6.95816C0 6.40138 0.458048 5.95001 1.02306 5.95001Z" fill="url(#paint0_linear_32119_98)"/>
+<path d="M8.8322 9.78788H6.78661V15.2769H5.48336V9.78788H3.44727V8.72308H8.8322V9.78788Z" fill="white"/>
 </g>
 <defs>
-<linearGradient id="paint0_linear_32119_98" x1="2.84416" y1="5.5885" x2="13.4047" y2="24.0206" gradientUnits="userSpaceOnUse">
+<linearGradient id="paint0_linear_32119_98" x1="2.13312" y1="5.16226" x2="9.97068" y2="18.9375" gradientUnits="userSpaceOnUse">
 <stop stop-color="#5A62C3"/>
 <stop offset="0.5" stop-color="#4D55BD"/>
 <stop offset="1" stop-color="#3940AB"/>
 </linearGradient>
 <clipPath id="clip0_32119_98">
-<rect width="32" height="29.5385" fill="white"/>
+<rect width="24" height="22" fill="white" transform="translate(0 1)"/>
 </clipPath>
 </defs>
 </svg>

package/dist/collection/components/stable/gux-icon/icons/brand/zoom.svg

@@ -1,8 +1,8 @@
-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0 14C0 6.26801 6.26801 0 14 0H18C25.732 0 32 6.26801 32 14V18C32 25.732 25.732 32 18 32H14C6.26801 32 0 25.732 0 18V14Z" fill="url(#paint0_linear_32119_96)"/>
-<path d="M9.03495 17.9231H4.76573C4.48252 17.9231 4.22028 17.7885 4.08392 17.5577C3.93706 17.2885 3.98951 16.9712 4.22028 16.7692L7.1888 14.0481H5.05944C4.47203 14.0481 4 13.6058 4 13.0769H7.93355C8.21677 13.0769 8.479 13.2115 8.61537 13.4423C8.76222 13.7115 8.70977 14.0288 8.479 14.2308L5.51048 16.9519H7.97551C8.56292 16.9519 9.03495 17.3942 9.03495 17.9231ZM25.944 13C25.3356 13 24.7796 13.2404 24.402 13.6346C24.0244 13.25 23.4685 13 22.8601 13C21.7272 13 20.7936 13.8846 20.7936 14.9231V17.9231C21.3811 17.9231 21.8531 17.4904 21.8531 16.9519V14.9135C21.8531 14.4135 22.2727 13.9904 22.8181 13.9712C23.395 13.9519 23.8671 14.375 23.8671 14.8942V16.9519C23.8671 17.4904 24.3391 17.9231 24.9265 17.9231V14.9135C24.9265 14.4135 25.3461 13.9904 25.8915 13.9712C26.4684 13.9519 26.9405 14.375 26.9405 14.8942V16.9519C26.9405 17.4904 27.4125 17.9231 27.9999 17.9231V14.9231C28.0104 13.8846 27.0768 13 25.944 13ZM14.3846 15.5C14.3846 16.875 13.1573 18 11.6573 18C10.1468 18 8.93005 16.875 8.93005 15.5C8.93005 14.125 10.1573 13 11.6573 13C13.1573 13 14.3846 14.125 14.3846 15.5ZM13.3251 15.5C13.3251 14.6538 12.5804 13.9712 11.6573 13.9712C10.7342 13.9712 9.98949 14.6538 9.98949 15.5C9.98949 16.3462 10.7342 17.0288 11.6573 17.0288C12.5804 17.0288 13.3251 16.3462 13.3251 15.5ZM20.2692 15.5C20.2692 16.875 19.0419 18 17.5419 18C16.0314 18 14.8146 16.875 14.8146 15.5C14.8146 14.125 16.0419 13 17.5419 13C19.0419 13 20.2692 14.125 20.2692 15.5ZM19.2097 15.5C19.2097 14.6538 18.465 13.9712 17.5419 13.9712C16.6188 13.9712 15.8741 14.6538 15.8741 15.5C15.8741 16.3462 16.6188 17.0288 17.5419 17.0288C18.465 17.0288 19.2097 16.3462 19.2097 15.5Z" fill="white"/>
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 10.5C0 4.70101 4.70101 0 10.5 0H13.5C19.299 0 24 4.70101 24 10.5V13.5C24 19.299 19.299 24 13.5 24H10.5C4.70101 24 0 19.299 0 13.5V10.5Z" fill="url(#paint0_linear_32119_96)"/>
+<path d="M6.77621 13.4423H3.5743C3.36189 13.4423 3.16521 13.3413 3.06294 13.1683C2.9528 12.9663 2.99213 12.7284 3.16521 12.5769L5.3916 10.5361H3.79458C3.35402 10.5361 3 10.2043 3 9.80769H5.95016C6.16258 9.80769 6.35925 9.90865 6.46153 10.0817C6.57167 10.2837 6.53233 10.5216 6.35925 10.6731L4.13286 12.7139H5.98163C6.42219 12.7139 6.77621 13.0457 6.77621 13.4423ZM19.458 9.75C19.0017 9.75 18.5847 9.93029 18.3015 10.226C18.0183 9.9375 17.6013 9.75 17.1451 9.75C16.2954 9.75 15.5952 10.4135 15.5952 11.1923V13.4423C16.0358 13.4423 16.3898 13.1178 16.3898 12.7139V11.1851C16.3898 10.8101 16.7045 10.4928 17.1136 10.4784C17.5463 10.4639 17.9003 10.7813 17.9003 11.1707V12.7139C17.9003 13.1178 18.2543 13.4423 18.6949 13.4423V11.1851C18.6949 10.8101 19.0096 10.4928 19.4186 10.4784C19.8513 10.4639 20.2054 10.7813 20.2054 11.1707V12.7139C20.2054 13.1178 20.5594 13.4423 20.9999 13.4423V11.1923C21.0078 10.4135 20.3076 9.75 19.458 9.75ZM10.7884 11.625C10.7884 12.6562 9.86798 13.5 8.74299 13.5C7.61012 13.5 6.69754 12.6562 6.69754 11.625C6.69754 10.5938 7.61799 9.75 8.74299 9.75C9.86798 9.75 10.7884 10.5938 10.7884 11.625ZM9.99386 11.625C9.99386 10.9904 9.43529 10.4784 8.74299 10.4784C8.05068 10.4784 7.49212 10.9904 7.49212 11.625C7.49212 12.2596 8.05068 12.7716 8.74299 12.7716C9.43529 12.7716 9.99386 12.2596 9.99386 11.625ZM15.2019 11.625C15.2019 12.6562 14.2814 13.5 13.1564 13.5C12.0236 13.5 11.111 12.6562 11.111 11.625C11.111 10.5938 12.0314 9.75 13.1564 9.75C14.2814 9.75 15.2019 10.5938 15.2019 11.625ZM14.4073 11.625C14.4073 10.9904 13.8487 10.4784 13.1564 10.4784C12.4641 10.4784 11.9056 10.9904 11.9056 11.625C11.9056 12.2596 12.4641 12.7716 13.1564 12.7716C13.8487 12.7716 14.4073 12.2596 14.4073 11.625Z" fill="white"/>
 <defs>
-<linearGradient id="paint0_linear_32119_96" x1="6" y1="29" x2="26" y2="2.5" gradientUnits="userSpaceOnUse">
+<linearGradient id="paint0_linear_32119_96" x1="4.5" y1="21.75" x2="19.5" y2="1.875" gradientUnits="userSpaceOnUse">
 <stop stop-color="#084ACD"/>
 <stop offset="0.505" stop-color="#0B5CFF"/>
 <stop offset="1" stop-color="#236EF9"/>

package/dist/collection/components/stable/gux-icon/icons/fa/arrow-up-arrow-down-regular.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M6.97501 5.6275C7.21001 5.8625 7.59 5.8625 7.8225 5.6275C8.055 5.3925 8.0575 5.0125 7.8225 4.78L5.22501 2.1775C4.99001 1.9425 4.61001 1.9425 4.37751 2.1775L1.775 4.7775C1.54 5.0125 1.54 5.3925 1.775 5.625C2.01 5.8575 2.39 5.86 2.6225 5.625L4.1975 4.05V14.2025C4.1975 14.535 4.465 14.8025 4.7975 14.8025C5.13 14.8025 5.3975 14.535 5.3975 14.2025V4.05L6.97501 5.6275ZM13.375 11.1775L11.8 12.7525V2.6C11.8 2.2675 11.5325 2 11.2 2C10.8675 2 10.6 2.2675 10.6 2.6V12.7525L9.025 11.1775C8.79 10.9425 8.41 10.9425 8.1775 11.1775C7.945 11.4125 7.9425 11.7925 8.1775 12.025L10.7775 14.625C11.0125 14.86 11.3925 14.86 11.625 14.625L14.225 12.025C14.46 11.79 14.46 11.41 14.225 11.1775C13.99 10.945 13.61 10.9425 13.3775 11.1775H13.375Z"/></svg>

package/dist/collection/components/stable/gux-listbox/options/gux-option/gux-option.css

@@ -7,6 +7,7 @@
   place-content: stretch center;
   align-items: center;
   block-size: var(--gse-ui-menu-option-height);
+  min-block-size: var(--gse-ui-menu-option-height);
   padding: var(--gse-ui-menu-option-padding);
   font-family: var(--gse-ui-menu-option-label-default-text-fontFamily);
   font-size: var(--gse-ui-menu-option-label-default-text-fontSize);
@@ -53,8 +54,9 @@
 }
 
 :host(.gux-show-subtext) {
-  place-content: stretch flex-start;
+  align-items: flex-start;
   block-size: auto;
+  padding: var(--gse-ui-menu-option-subtext-padding);
 }
 :host(.gux-show-subtext) .gux-option-wrapper {
   display: flex;

package/dist/collection/components/stable/gux-listbox/options/gux-option/gux-option.js

@@ -1,7 +1,8 @@
 import { h, Host } from "@stencil/core";
 import { getClosestElement } from "../../../../../utils/dom/get-closest-element";
+import { booleanString } from "../../../../../utils/dom/boolean-string";
 import { randomHTMLId } from "../../../../../utils/dom/random-html-";
-import { hasSlot } from "../../../../../utils/dom/has-slot";
+import { getSlotTextContent } from "../../../../../utils/dom/get-slot-text-content";
 /**
  * @slot - text
  * @slot subtext - Optional slot for subtext
@@ -28,7 +29,8 @@ export class GuxOption {
         this.onSubtextChange();
     }
     onSubtextChange() {
-        this.hasSubtext = hasSlot(this.root, 'subtext');
+        const subtext = getSlotTextContent(this.root, 'subtext');
+        this.hasSubtext = !!(subtext === null || subtext === void 0 ? void 0 : subtext.trim());
     }
     getAriaSelected() {
         if (this.disabled) {
@@ -41,13 +43,13 @@ export class GuxOption {
         return parentListbox === null || parentListbox === void 0 ? void 0 : parentListbox.disabled;
     }
     render() {
-        return (h(Host, { key: 'fcbabeb653eee6400c32943a61256472779c2d73', role: "option", class: {
+        return (h(Host, { key: 'd5f34265c114817fbe44e2acd6ac7210facbb600', role: "option", class: {
                 'gux-active': this.active,
                 'gux-disabled': this.disabled || this.hasDisabledParent(),
                 'gux-filtered': this.filtered,
                 'gux-selected': this.selected,
                 'gux-show-subtext': this.hasSubtext
-            }, "aria-selected": this.getAriaSelected(), "aria-disabled": this.disabled.toString() }, h("div", { key: '5b61502b3802e77a1236c96b0a6c9d687be362c4', class: "gux-option-wrapper" }, h("gux-truncate", { key: 'bfb91e9672493d3d87bc8b97cc0c176a18d64065', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: '2d54d56e49b930962e68e517f8a0a7b3bd591b36' })), h("slot", { key: 'a4d49302ba33548ec2e62cd4a93c4d6bdcc47fa6', onSlotchange: () => this.onSubtextChange(), name: "subtext" }))));
+            }, "aria-selected": this.getAriaSelected(), "aria-disabled": booleanString(this.disabled || this.hasDisabledParent()) }, h("div", { key: '30bd78c10e9ff8fab4136c00e940210606b56133', class: "gux-option-wrapper" }, h("gux-truncate", { key: '3d56da75449c4db342f72d0c456a28c09eec7e80', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: '0b6e1f1d2043c77f8b844536337579c5a666a66d' })), h("slot", { key: 'c531948a74d1024d5e33507e0ac0709df9a7942d', onSlotchange: () => this.onSubtextChange(), name: "subtext" }))));
     }
     static get is() { return "gux-option"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-listbox/options/gux-option-icon/gux-option-icon.css

@@ -7,6 +7,7 @@
   place-content: stretch center;
   align-items: center;
   block-size: var(--gse-ui-menu-option-height);
+  min-block-size: var(--gse-ui-menu-option-height);
   padding: var(--gse-ui-menu-option-padding);
   font-family: var(--gse-ui-menu-option-label-default-text-fontFamily);
   font-size: var(--gse-ui-menu-option-label-default-text-fontSize);
@@ -53,8 +54,9 @@
 }
 
 :host(.gux-show-subtext) {
-  place-content: stretch flex-start;
+  align-items: flex-start;
   block-size: auto;
+  padding: var(--gse-ui-menu-option-subtext-padding);
 }
 :host(.gux-show-subtext) .gux-option-wrapper {
   display: flex;

package/dist/collection/components/stable/gux-listbox/options/gux-option-icon/gux-option-icon.js

@@ -1,7 +1,8 @@
 import { h, Host } from "@stencil/core";
+import { booleanString } from "../../../../../utils/dom/boolean-string";
 import { getClosestElement } from "../../../../../utils/dom/get-closest-element";
-import { randomHTMLId } from "../../../../../utils/dom/random-html-";
 import { hasSlot } from "../../../../../utils/dom/has-slot";
+import { randomHTMLId } from "../../../../../utils/dom/random-html-";
 /**
  * @slot - text
  * @slot subtext - Optional slot for subtext
@@ -61,14 +62,14 @@ export class GuxOptionIcon {
         return (h("gux-icon", { decorative: this.iconSrText == null, "screenreader-text": this.iconSrText, "icon-name": this.iconName, style: iconStyle, size: "small" }));
     }
     render() {
-        return (h(Host, { key: '126e49b34e02afe196f718e8ac98cdf6f6d3d209', role: "option", class: {
+        return (h(Host, { key: '4a5d562a9f36bc0fba3f0ef97098fac591229fd6', role: "option", class: {
                 'gux-active': this.active,
                 'gux-disabled': this.disabled || this.hasDisabledParent(),
                 'gux-filtered': this.filtered,
                 'gux-hovered': this.hovered,
                 'gux-selected': this.selected,
                 'gux-show-subtext': this.hasSubtext
-            }, "aria-selected": this.getAriaSelected(), "aria-disabled": this.disabled.toString() }, this.renderMaybeIcon('start'), h("div", { key: 'cef7fe46ae8a788deee355a4a30c062e0a419397', class: "gux-option-wrapper" }, h("gux-truncate", { key: 'b125d5827d6103068e8aa302bb37423addc70fa7', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: 'fea0d8f9bbff22e4cd76997d98697be4634bba93' })), h("slot", { key: 'b2541c861705afe8a860f1fa1e500d4bb800a31b', onSlotchange: () => this.onSubtextChange(), name: "subtext" })), this.renderMaybeIcon('end')));
+            }, "aria-selected": this.getAriaSelected(), "aria-disabled": booleanString(this.disabled || this.hasDisabledParent()) }, this.renderMaybeIcon('start'), h("div", { key: 'a46c3b0030de9e063c66bb8844c2b7cdedc041c6', class: "gux-option-wrapper" }, h("gux-truncate", { key: 'ab78233c510a13d72c886f32c67259ff2cc08d67', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: '8708858e3906a4a2f33770b6ccb553ebc8f32a47' })), h("slot", { key: '45b838f8a64fd95568a7d727f1579a67cdba87d1', onSlotchange: () => this.onSubtextChange(), name: "subtext" })), this.renderMaybeIcon('end')));
     }
     static get is() { return "gux-option-icon"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-listbox/tests/gux-listbox.common.js

@@ -0,0 +1,81 @@
+export const basicRenderConfig = {
+    description: 'should render basic gux-listbox',
+    html: `<gux-listbox id="listbox" aria-label="Listbox">
+    <gux-option value="option1">Option 1</gux-option>
+    <gux-option value="option2">Option 2</gux-option>
+    <gux-option value="option3">Option 3</gux-option>
+  </gux-listbox>`
+};
+export const withIconsRenderConfig = {
+    description: 'should render gux-listbox with icon options',
+    html: `<gux-listbox id="listbox-icons" aria-label="Listbox">
+    <gux-option-icon icon-name="user" value="user1">User 1</gux-option-icon>
+    <gux-option-icon icon-name="user" value="user2">User 2</gux-option-icon>
+    <gux-option-icon icon-name="user" value="user3">User 3</gux-option-icon>
+  </gux-listbox>`
+};
+export const withSubtextRenderConfig = {
+    description: 'should render gux-listbox with subtext options',
+    html: `<gux-listbox id="listbox-subtext" aria-label="Listbox">
+    <gux-option value="option1">
+      Primary Text 1
+      <span slot="subtext">Subtext 1</span>
+    </gux-option>
+    <gux-option-icon icon-name="user" value="option2">
+      Primary Text 2
+      <span slot="subtext">Subtext 2</span>
+    </gux-option-icon>
+  </gux-listbox>`
+};
+export const withGroupsRenderConfig = {
+    description: 'should render gux-listbox with option groups',
+    html: `<gux-listbox id="listbox-groups" aria-label="Listbox">
+    <gux-option-group label="Group 1">
+      <gux-option value="g1-option1">Group 1 Option 1</gux-option>
+      <gux-option value="g1-option2">Group 1 Option 2</gux-option>
+    </gux-option-group>
+    <gux-option-group label="Group 2">
+      <gux-option-icon icon-name="user" value="g2-option1">Group 2 Option 1</gux-option-icon>
+      <gux-option-icon icon-name="user" value="g2-option2">Group 2 Option 2</gux-option-icon>
+    </gux-option-group>
+  </gux-listbox>`
+};
+export const loadingRenderConfig = {
+    description: 'should render gux-listbox in loading state',
+    html: `<gux-listbox id="listbox-loading" loading="true" aria-label="Listbox">
+    <gux-option value="option1">Option 1</gux-option>
+    <gux-option value="option2">Option 2</gux-option>
+  </gux-listbox>`
+};
+export const disabledRenderConfig = {
+    description: 'should render gux-listbox in disabled state',
+    html: `<gux-listbox id="listbox-disabled" disabled="true" aria-label="Listbox">
+    <gux-option value="option1">Option 1</gux-option>
+    <gux-option value="option2">Option 2</gux-option>
+  </gux-listbox>`
+};
+export const selectedValueRenderConfig = {
+    description: 'should render gux-listbox with selected value',
+    html: `<gux-listbox id="listbox-selected" value="option2" aria-label="Listbox">
+    <gux-option value="option1">Option 1</gux-option>
+    <gux-option value="option2">Option 2</gux-option>
+    <gux-option value="option3">Option 3</gux-option>
+  </gux-listbox>`
+};
+export const emptyMessageRenderConfig = {
+    description: 'should render gux-listbox with empty message when all options filtered',
+    html: `<gux-listbox id="listbox-empty" filter="xyz" filter-type="starts-with" empty-message="No matches found" aria-label="Listbox">
+    <gux-option value="option1">Option 1</gux-option>
+    <gux-option value="option2">Option 2</gux-option>
+  </gux-listbox>`
+};
+export const renderConfigs = [
+    basicRenderConfig,
+    withIconsRenderConfig,
+    withSubtextRenderConfig,
+    withGroupsRenderConfig,
+    loadingRenderConfig,
+    disabledRenderConfig,
+    selectedValueRenderConfig,
+    emptyMessageRenderConfig
+];

package/dist/collection/components/stable/gux-listbox-multi/gux-option-multi/gux-option-multi.css

@@ -60,6 +60,7 @@
 :host:host(.gux-show-subtext) {
   place-content: stretch flex-start;
   block-size: auto;
+  padding: var(--gse-ui-menu-option-subtext-padding);
 }
 :host:host(.gux-show-subtext) .gux-option-wrapper {
   display: flex;

package/dist/collection/components/stable/gux-listbox-multi/gux-option-multi/gux-option-multi.js

@@ -1,9 +1,10 @@
 import { h, Host } from "@stencil/core";
+import { booleanString } from "../../../../utils/dom/boolean-string";
 import { getClosestElement } from "../../../../utils/dom/get-closest-element";
+import { getSlotTextContent } from "../../../../utils/dom/get-slot-text-content";
 import { randomHTMLId } from "../../../../utils/dom/random-html-";
 import { buildI18nForComponent } from "../../../../i18n";
 import translationResources from "./i18n/en.json";
-import { hasSlot } from "../../../../utils/dom/has-slot";
 /**
  * @slot - text
  * @slot subtext - Optional slot for subtext
@@ -40,7 +41,8 @@ export class GuxOptionMulti {
         this.onSubtextChange();
     }
     onSubtextChange() {
-        this.hasSubtext = hasSlot(this.root, 'subtext');
+        const subtext = getSlotTextContent(this.root, 'subtext');
+        this.hasSubtext = !!(subtext === null || subtext === void 0 ? void 0 : subtext.trim());
     }
     hasDisabledParent() {
         const parentListbox = getClosestElement('gux-listbox-multi', this.root);
@@ -58,13 +60,13 @@ export class GuxOptionMulti {
         }
     }
     render() {
-        return (h(Host, { key: '00ac5a7311f0e7452296be98a3345927e6201438', role: "option", class: {
+        return (h(Host, { key: 'c3c02424eb204b0c41d30f252df8a843bcd75a11', role: "option", class: {
                 'gux-active': this.active,
                 'gux-disabled': this.disabled || this.hasDisabledParent(),
                 'gux-filtered': this.filtered,
                 'gux-selected': this.selected,
                 'gux-show-subtext': this.hasSubtext
-            }, "aria-selected": this.selected.toString(), "aria-disabled": this.disabled.toString() }, this.renderSVGCheckbox(), h("div", { key: '4009dbcd5708793d73c871fd2a7818074eec68f3', class: "gux-option-wrapper" }, h("gux-truncate", { key: '2155dd174ee0fd6143b1bd50816fdb3734953441', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: '7ebcdd226c30ff6449fcdc4b66e49b168b2f98c4' })), h("slot", { key: '5e7993177bb47175f55131bdfac30c2ad998c05f', onSlotchange: () => this.onSubtextChange(), name: "subtext" })), this.renderCustomOptionInstructions()));
+            }, "aria-selected": this.selected.toString(), "aria-disabled": booleanString(this.disabled || this.hasDisabledParent()) }, this.renderSVGCheckbox(), h("div", { key: '90b28ff1d61e773b90c0f0341d27ff2b362af7d5', class: "gux-option-wrapper" }, h("gux-truncate", { key: '3582a2fdf9118acbebaea8ea9c52fde3cd64f8f3', "tooltip-placement": "right", ref: el => (this.truncateElement = el) }, h("slot", { key: '63fe83905cd4522bbb4b1ad996ad551061e34e58' })), h("slot", { key: 'e612fb5134f471adbb8fd2d5614b8389cac91236', onSlotchange: () => this.onSubtextChange(), name: "subtext" })), this.renderCustomOptionInstructions()));
     }
     static get is() { return "gux-option-multi"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-listbox-multi/gux-select-all/gux-select-all.js

@@ -21,14 +21,19 @@ export class GuxSelectAll {
         this.applyListboxScrollListener();
     }
     disconnectedCallback() {
-        this.listboxElement.removeEventListener('scroll', this.applyListboxScrollListener);
+        if (this.listboxElement && this.scrollHandler) {
+            this.listboxElement.removeEventListener('scroll', this.scrollHandler);
+        }
     }
     applyListboxScrollListener() {
         if (this.listboxElement) {
-            this.listboxElement.addEventListener('scroll', (event) => {
+            this.scrollHandler = (event) => {
                 event.stopPropagation();
                 const target = event.target;
                 this.hasScrolled = target.scrollTop > 0;
+            };
+            this.listboxElement.addEventListener('scroll', this.scrollHandler, {
+                passive: true
             });
         }
     }
@@ -55,13 +60,13 @@ export class GuxSelectAll {
         return (h("svg", { class: "gux-checkbox-container", xmlns: "http://www.w3.org/2000/svg", viewBox: viewBox }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: paths[pathKey] })));
     }
     render() {
-        return (h("div", { key: '4a6a746805180c5bf8093048580a64ede44f0998', role: "option", "aria-selected": this.selected.toString(), class: {
+        return (h("div", { key: '7ca8807a708c3203aabe0978ddbd5756e2264e35', role: "option", "aria-selected": this.selected.toString(), class: {
                 'gux-select-all-container': true,
                 'gux-active': this.active,
                 'gux-selected': this.selected,
                 'gux-indeterminate': this.indeterminate,
                 'gux-has-scrolled': this.hasScrolled
-            } }, h("div", { key: '2375e248ac4f43cf9b3c4d932731404476d02ff9', class: "gux-select-all-content" }, this.renderSVGCheckbox(), h("div", { key: '5867b43368beb088cb1661ab1eeba3e49d733c88', class: "gux-option-wrapper" }, h("gux-truncate", { key: 'bb958ea23cd64730b087ca13f2323be2f926644a', "max-lines": 1 }, h("span", { key: 'e61d6ee402098c797427d7b76740196e9d3fab6b' }, h("slot", { key: '0ca422e9d59ee9d8d7d3aed1efad49ffc98f1505' }, this.i18n('allOptions')))), h("gux-truncate", { key: '40510c5b0f3047556ae8d97111911310a767bde1', "tooltip-placement": "right", class: "gux-counter-label", "max-lines": 1 }, this.getCounterText())))));
+            } }, h("div", { key: 'b8e2ceb303a692f62e21816ae2bdaef477c32b0b', class: "gux-select-all-content" }, this.renderSVGCheckbox(), h("div", { key: 'aba1a103be114a1e973a14a8cbd1f6139124cf6c', class: "gux-option-wrapper" }, h("gux-truncate", { key: 'eff5cd71293a012c841b7dac3450abe114f0aa7f', "max-lines": 1 }, h("span", { key: 'f48a2c2eccc5014ff2250cf27774d390b16609a2' }, h("slot", { key: 'af1857139ad935c44559e5ed43eebaa369becb59' }, this.i18n('allOptions')))), h("gux-truncate", { key: 'e4c6506ba1b0319c852425ae192f7b3328bc4846', "tooltip-placement": "right", class: "gux-counter-label", "max-lines": 1 }, this.getCounterText())))));
     }
     static get is() { return "gux-select-all"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stable/gux-truncate/gux-truncate.js

@@ -21,6 +21,7 @@ export class GuxTruncate {
          * Lines to wrap before truncating
          */
         this.tooltipPlacement = 'bottom-start';
+        this.tooltipAccent = 'light';
     }
     async setShowTooltip() {
         var _a;
@@ -46,18 +47,18 @@ export class GuxTruncate {
     }
     renderTooltip() {
         if (this.needsTruncation()) {
-            return (h("gux-tooltip", { placement: this.tooltipPlacement, "aria-hidden": "true", ref: el => (this.tooltipElement = el) }, h("div", { slot: "content" }, this.getTooltipContent())));
+            return (h("gux-tooltip", { accent: this.tooltipAccent, placement: this.tooltipPlacement, "aria-hidden": "true", ref: el => (this.tooltipElement = el) }, h("div", { slot: "content" }, this.getTooltipContent())));
         }
         return null;
     }
     render() {
         var _a;
-        return (h("div", { key: '88be66765392fc4d639daa25d9d8a0ef722e06d6', class: {
+        return (h("div", { key: '3fc6df08f4e5b36071d4e18e6eacffecfc06b18d', class: {
                 'gux-truncate-multi-line': Boolean(this.maxLines)
-            } }, h("span", { key: '0ecce4c0385633d1fdf4246b5147117a8624b9cb', class: {
+            } }, h("span", { key: 'c2a8e7803b4f364e8ff21b8f728d38550a373240', class: {
                 'gux-overflow-hidden': this.needsTruncation(),
                 'gux-truncate-slot-container': true
-            }, style: { webkitLineClamp: (_a = this.maxLines) === null || _a === void 0 ? void 0 : _a.toString() } }, h("slot", { key: 'c25ce081a2a9624345a902006ef3716595653412' })), this.renderTooltip()));
+            }, style: { webkitLineClamp: (_a = this.maxLines) === null || _a === void 0 ? void 0 : _a.toString() } }, h("slot", { key: 'c19b5fb35613f3fd6a6b737e06e435ea16bda7b8' })), this.renderTooltip()));
     }
     static get is() { return "gux-truncate"; }
     static get encapsulation() { return "shadow"; }
@@ -117,6 +118,32 @@ export class GuxTruncate {
                 "setter": false,
                 "reflect": false,
                 "defaultValue": "'bottom-start'"
+            },
+            "tooltipAccent": {
+                "type": "string",
+                "attribute": "tooltip-accent",
+                "mutable": false,
+                "complexType": {
+                    "original": "GuxTooltipAccent",
+                    "resolved": "\"dark\" | \"light\"",
+                    "references": {
+                        "GuxTooltipAccent": {
+                            "location": "import",
+                            "path": "../gux-tooltip/gux-tooltip-types",
+                            "id": "src/components/stable/gux-tooltip/gux-tooltip-types.ts::GuxTooltipAccent"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "'light'"
             }
         };
     }

package/dist/collection/components/stable/gux-truncate/tests/gux-truncate.common.js

@@ -67,5 +67,9 @@ export const renderConfigs = [
         </table>
       </gux-table>
     `
+    },
+    {
+        description: 'should display dark tooltip accent when toolip-accent set to dark',
+        html: '<gux-truncate style="inline-size: 100px" tooltip-accent="dark">Some text to truncate with dark tooltip</gux-truncate>'
     }
 ];

package/dist/collection/utils/dom/boolean-string.js

@@ -0,0 +1,3 @@
+export function booleanString(boolean) {
+    return boolean ? 'true' : 'false';
+}

package/dist/esm/boolean-string-CK42c8Uy.js

@@ -0,0 +1,5 @@
+function booleanString(boolean) {
+    return boolean ? 'true' : 'false';
+}
+
+export { booleanString as b };