reshaped 3.0.9 → 3.0.11-rc.0

package/dist/components/Text/Text.module.css

@@ -1 +1 @@
-.root{transition:color var(--rs-duration-fast) var(--rs-easing-standard)}.--clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--rs-text-lines);overflow:hidden}.--break-all{word-break:break-all}.--wrap-balance{text-wrap:balance}.--align-start{text-align:start}.--align-center{text-align:center}.--align-end{text-align:end}.--variant-title-1{font-family:var(--rs-font-family-title-1);font-size:var(--rs-font-size-title-1);font-weight:var(--rs-font-weight-title-1);line-height:var(--rs-line-height-title-1)}.--variant-title-2{font-family:var(--rs-font-family-title-2);font-size:var(--rs-font-size-title-2);font-weight:var(--rs-font-weight-title-2);line-height:var(--rs-line-height-title-2)}.--variant-title-3{font-family:var(--rs-font-family-title-3);font-size:var(--rs-font-size-title-3);font-weight:var(--rs-font-weight-title-3);line-height:var(--rs-line-height-title-3)}.--variant-title-4{font-family:var(--rs-font-family-title-4);font-size:var(--rs-font-size-title-4);font-weight:var(--rs-font-weight-title-4);line-height:var(--rs-line-height-title-4)}.--variant-title-5{font-family:var(--rs-font-family-title-5);font-size:var(--rs-font-size-title-5);font-weight:var(--rs-font-weight-title-5);line-height:var(--rs-line-height-title-5)}.--variant-title-6{font-family:var(--rs-font-family-title-6);font-size:var(--rs-font-size-title-6);font-weight:var(--rs-font-weight-title-6);line-height:var(--rs-line-height-title-6)}.--variant-featured-1{font-family:var(--rs-font-family-featured-1);font-size:var(--rs-font-size-featured-1);font-weight:var(--rs-font-weight-featured-1);line-height:var(--rs-line-height-featured-1)}.--variant-featured-2{font-family:var(--rs-font-family-featured-2);font-size:var(--rs-font-size-featured-2);font-weight:var(--rs-font-weight-featured-2);line-height:var(--rs-line-height-featured-2)}.--variant-featured-3{font-family:var(--rs-font-family-featured-3);font-size:var(--rs-font-size-featured-3);font-weight:var(--rs-font-weight-featured-3);line-height:var(--rs-line-height-featured-3)}.--variant-body-1{font-family:var(--rs-font-family-body-1);font-size:var(--rs-font-size-body-1);font-weight:var(--rs-font-weight-body-1);line-height:var(--rs-line-height-body-1)}.--variant-body-2{font-family:var(--rs-font-family-body-2);font-size:var(--rs-font-size-body-2);font-weight:var(--rs-font-weight-body-2);line-height:var(--rs-line-height-body-2)}.--variant-body-3{font-family:var(--rs-font-family-body-3);font-size:var(--rs-font-size-body-3);font-weight:var(--rs-font-weight-body-3);line-height:var(--rs-line-height-body-3)}.--variant-caption-1{font-family:var(--rs-font-family-caption-1);font-size:var(--rs-font-size-caption-1);font-weight:var(--rs-font-weight-caption-1);line-height:var(--rs-line-height-caption-1)}.--variant-caption-2{font-family:var(--rs-font-family-caption-2);font-size:var(--rs-font-size-caption-2);font-weight:var(--rs-font-weight-caption-2);line-height:var(--rs-line-height-caption-2)}.--weight-regular{font-weight:var(--rs-font-weight-regular)!important}.--weight-medium{font-weight:var(--rs-font-weight-medium)!important}.--weight-bold{font-weight:var(--rs-font-weight-bold)!important}.--color-neutral{color:var(--rs-color-foreground-neutral)}.--color-neutral-faded{color:var(--rs-color-foreground-neutral-faded)}.--color-primary{color:var(--rs-color-foreground-primary)}.--color-warning{color:var(--rs-color-foreground-warning)}.--color-positive{color:var(--rs-color-foreground-positive)}.--color-critical{color:var(--rs-color-foreground-critical)}.--color-disabled{color:var(--rs-color-foreground-disabled)}.--decoration-line-through{text-decoration:line-through}@media (--rs-viewport-m ){.--align-start--m{text-align:start}.--align-center--m{text-align:center}.--align-end--m{text-align:end}.--variant-title-1--m{font-family:var(--rs-font-family-title-1);font-size:var(--rs-font-size-title-1);font-weight:var(--rs-font-weight-title-1);line-height:var(--rs-line-height-title-1)}.--variant-title-2--m{font-family:var(--rs-font-family-title-2);font-size:var(--rs-font-size-title-2);font-weight:var(--rs-font-weight-title-2);line-height:var(--rs-line-height-title-2)}.--variant-title-3--m{font-family:var(--rs-font-family-title-3);font-size:var(--rs-font-size-title-3);font-weight:var(--rs-font-weight-title-3);line-height:var(--rs-line-height-title-3)}.--variant-title-4--m{font-family:var(--rs-font-family-title-4);font-size:var(--rs-font-size-title-4);font-weight:var(--rs-font-weight-title-4);line-height:var(--rs-line-height-title-4)}.--variant-title-5--m{font-family:var(--rs-font-family-title-5);font-size:var(--rs-font-size-title-5);font-weight:var(--rs-font-weight-title-5);line-height:var(--rs-line-height-title-5)}.--variant-title-6--m{font-family:var(--rs-font-family-title-6);font-size:var(--rs-font-size-title-6);font-weight:var(--rs-font-weight-title-6);line-height:var(--rs-line-height-title-6)}.--variant-featured-1--m{font-family:var(--rs-font-family-featured-1);font-size:var(--rs-font-size-featured-1);font-weight:var(--rs-font-weight-featured-1);line-height:var(--rs-line-height-featured-1)}.--variant-featured-2--m{font-family:var(--rs-font-family-featured-2);font-size:var(--rs-font-size-featured-2);font-weight:var(--rs-font-weight-featured-2);line-height:var(--rs-line-height-featured-2)}.--variant-featured-3--m{font-family:var(--rs-font-family-featured-3);font-size:var(--rs-font-size-featured-3);font-weight:var(--rs-font-weight-featured-3);line-height:var(--rs-line-height-featured-3)}.--variant-body-1--m{font-family:var(--rs-font-family-body-1);font-size:var(--rs-font-size-body-1);font-weight:var(--rs-font-weight-body-1);line-height:var(--rs-line-height-body-1)}.--variant-body-2--m{font-family:var(--rs-font-family-body-2);font-size:var(--rs-font-size-body-2);font-weight:var(--rs-font-weight-body-2);line-height:var(--rs-line-height-body-2)}.--variant-body-3--m{font-family:var(--rs-font-family-body-3);font-size:var(--rs-font-size-body-3);font-weight:var(--rs-font-weight-body-3);line-height:var(--rs-line-height-body-3)}.--variant-caption-1--m{font-family:var(--rs-font-family-caption-1);font-size:var(--rs-font-size-caption-1);font-weight:var(--rs-font-weight-caption-1);line-height:var(--rs-line-height-caption-1)}.--variant-caption-2--m{font-family:var(--rs-font-family-caption-2);font-size:var(--rs-font-size-caption-2);font-weight:var(--rs-font-weight-caption-2);line-height:var(--rs-line-height-caption-2)}.--weight-regular--m{font-weight:var(--rs-font-weight-regular)!important}.--weight-medium--m{font-weight:var(--rs-font-weight-medium)!important}.--weight-bold--m{font-weight:var(--rs-font-weight-bold)!important}}@media (--rs-viewport-l ){.--align-start--l{text-align:start}.--align-center--l{text-align:center}.--align-end--l{text-align:end}.--variant-title-1--l{font-family:var(--rs-font-family-title-1);font-size:var(--rs-font-size-title-1);font-weight:var(--rs-font-weight-title-1);line-height:var(--rs-line-height-title-1)}.--variant-title-2--l{font-family:var(--rs-font-family-title-2);font-size:var(--rs-font-size-title-2);font-weight:var(--rs-font-weight-title-2);line-height:var(--rs-line-height-title-2)}.--variant-title-3--l{font-family:var(--rs-font-family-title-3);font-size:var(--rs-font-size-title-3);font-weight:var(--rs-font-weight-title-3);line-height:var(--rs-line-height-title-3)}.--variant-title-4--l{font-family:var(--rs-font-family-title-4);font-size:var(--rs-font-size-title-4);font-weight:var(--rs-font-weight-title-4);line-height:var(--rs-line-height-title-4)}.--variant-title-5--l{font-family:var(--rs-font-family-title-5);font-size:var(--rs-font-size-title-5);font-weight:var(--rs-font-weight-title-5);line-height:var(--rs-line-height-title-5)}.--variant-title-6--l{font-family:var(--rs-font-family-title-6);font-size:var(--rs-font-size-title-6);font-weight:var(--rs-font-weight-title-6);line-height:var(--rs-line-height-title-6)}.--variant-featured-1--l{font-family:var(--rs-font-family-featured-1);font-size:var(--rs-font-size-featured-1);font-weight:var(--rs-font-weight-featured-1);line-height:var(--rs-line-height-featured-1)}.--variant-featured-2--l{font-family:var(--rs-font-family-featured-2);font-size:var(--rs-font-size-featured-2);font-weight:var(--rs-font-weight-featured-2);line-height:var(--rs-line-height-featured-2)}.--variant-featured-3--l{font-family:var(--rs-font-family-featured-3);font-size:var(--rs-font-size-featured-3);font-weight:var(--rs-font-weight-featured-3);line-height:var(--rs-line-height-featured-3)}.--variant-body-1--l{font-family:var(--rs-font-family-body-1);font-size:var(--rs-font-size-body-1);font-weight:var(--rs-font-weight-body-1);line-height:var(--rs-line-height-body-1)}.--variant-body-2--l{font-family:var(--rs-font-family-body-2);font-size:var(--rs-font-size-body-2);font-weight:var(--rs-font-weight-body-2);line-height:var(--rs-line-height-body-2)}.--variant-body-3--l{font-family:var(--rs-font-family-body-3);font-size:var(--rs-font-size-body-3);font-weight:var(--rs-font-weight-body-3);line-height:var(--rs-line-height-body-3)}.--variant-caption-1--l{font-family:var(--rs-font-family-caption-1);font-size:var(--rs-font-size-caption-1);font-weight:var(--rs-font-weight-caption-1);line-height:var(--rs-line-height-caption-1)}.--variant-caption-2--l{font-family:var(--rs-font-family-caption-2);font-size:var(--rs-font-size-caption-2);font-weight:var(--rs-font-weight-caption-2);line-height:var(--rs-line-height-caption-2)}.--weight-regular--l{font-weight:var(--rs-font-weight-regular)!important}.--weight-medium--l{font-weight:var(--rs-font-weight-medium)!important}.--weight-bold--l{font-weight:var(--rs-font-weight-bold)!important}}@media (--rs-viewport-xl ){.--align-start--xl{text-align:start}.--align-center--xl{text-align:center}.--align-end--xl{text-align:end}.--variant-title-1--xl{font-family:var(--rs-font-family-title-1);font-size:var(--rs-font-size-title-1);font-weight:var(--rs-font-weight-title-1);line-height:var(--rs-line-height-title-1)}.--variant-title-2--xl{font-family:var(--rs-font-family-title-2);font-size:var(--rs-font-size-title-2);font-weight:var(--rs-font-weight-title-2);line-height:var(--rs-line-height-title-2)}.--variant-title-3--xl{font-family:var(--rs-font-family-title-3);font-size:var(--rs-font-size-title-3);font-weight:var(--rs-font-weight-title-3);line-height:var(--rs-line-height-title-3)}.--variant-title-4--xl{font-family:var(--rs-font-family-title-4);font-size:var(--rs-font-size-title-4);font-weight:var(--rs-font-weight-title-4);line-height:var(--rs-line-height-title-4)}.--variant-title-5--xl{font-family:var(--rs-font-family-title-5);font-size:var(--rs-font-size-title-5);font-weight:var(--rs-font-weight-title-5);line-height:var(--rs-line-height-title-5)}.--variant-title-6--xl{font-family:var(--rs-font-family-title-6);font-size:var(--rs-font-size-title-6);font-weight:var(--rs-font-weight-title-6);line-height:var(--rs-line-height-title-6)}.--variant-featured-1--xl{font-family:var(--rs-font-family-featured-1);font-size:var(--rs-font-size-featured-1);font-weight:var(--rs-font-weight-featured-1);line-height:var(--rs-line-height-featured-1)}.--variant-featured-2--xl{font-family:var(--rs-font-family-featured-2);font-size:var(--rs-font-size-featured-2);font-weight:var(--rs-font-weight-featured-2);line-height:var(--rs-line-height-featured-2)}.--variant-featured-3--xl{font-family:var(--rs-font-family-featured-3);font-size:var(--rs-font-size-featured-3);font-weight:var(--rs-font-weight-featured-3);line-height:var(--rs-line-height-featured-3)}.--variant-body-1--xl{font-family:var(--rs-font-family-body-1);font-size:var(--rs-font-size-body-1);font-weight:var(--rs-font-weight-body-1);line-height:var(--rs-line-height-body-1)}.--variant-body-2--xl{font-family:var(--rs-font-family-body-2);font-size:var(--rs-font-size-body-2);font-weight:var(--rs-font-weight-body-2);line-height:var(--rs-line-height-body-2)}.--variant-body-3--xl{font-family:var(--rs-font-family-body-3);font-size:var(--rs-font-size-body-3);font-weight:var(--rs-font-weight-body-3);line-height:var(--rs-line-height-body-3)}.--variant-caption-1--xl{font-family:var(--rs-font-family-caption-1);font-size:var(--rs-font-size-caption-1);font-weight:var(--rs-font-weight-caption-1);line-height:var(--rs-line-height-caption-1)}.--variant-caption-2--xl{font-family:var(--rs-font-family-caption-2);font-size:var(--rs-font-size-caption-2);font-weight:var(--rs-font-weight-caption-2);line-height:var(--rs-line-height-caption-2)}.--weight-regular--xl{font-weight:var(--rs-font-weight-regular)!important}.--weight-medium--xl{font-weight:var(--rs-font-weight-medium)!important}.--weight-bold--xl{font-weight:var(--rs-font-weight-bold)!important}}
+.root{transition:color var(--rs-duration-fast) var(--rs-easing-standard)}.--clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--rs-text-lines);overflow:hidden}.--break-all{word-break:break-all}.--wrap-balance{text-wrap:balance}.--align-start{text-align:start}.--align-center{text-align:center}.--align-end{text-align:end}.--variant-title-1{font-family:var(--rs-font-family-title-1);font-size:var(--rs-font-size-title-1);font-weight:var(--rs-font-weight-title-1);letter-spacing:var(--rs-letter-spacing-title-1);line-height:var(--rs-line-height-title-1)}.--variant-title-2{font-family:var(--rs-font-family-title-2);font-size:var(--rs-font-size-title-2);font-weight:var(--rs-font-weight-title-2);letter-spacing:var(--rs-letter-spacing-title-2);line-height:var(--rs-line-height-title-2)}.--variant-title-3{font-family:var(--rs-font-family-title-3);font-size:var(--rs-font-size-title-3);font-weight:var(--rs-font-weight-title-3);letter-spacing:var(--rs-letter-spacing-title-3);line-height:var(--rs-line-height-title-3)}.--variant-title-4{font-family:var(--rs-font-family-title-4);font-size:var(--rs-font-size-title-4);font-weight:var(--rs-font-weight-title-4);letter-spacing:var(--rs-letter-spacing-title-4);line-height:var(--rs-line-height-title-4)}.--variant-title-5{font-family:var(--rs-font-family-title-5);font-size:var(--rs-font-size-title-5);font-weight:var(--rs-font-weight-title-5);letter-spacing:var(--rs-letter-spacing-title-5);line-height:var(--rs-line-height-title-5)}.--variant-title-6{font-family:var(--rs-font-family-title-6);font-size:var(--rs-font-size-title-6);font-weight:var(--rs-font-weight-title-6);letter-spacing:var(--rs-letter-spacing-title-6);line-height:var(--rs-line-height-title-6)}.--variant-featured-1{font-family:var(--rs-font-family-featured-1);font-size:var(--rs-font-size-featured-1);font-weight:var(--rs-font-weight-featured-1);letter-spacing:var(--rs-letter-spacing-featured-1);line-height:var(--rs-line-height-featured-1)}.--variant-featured-2{font-family:var(--rs-font-family-featured-2);font-size:var(--rs-font-size-featured-2);font-weight:var(--rs-font-weight-featured-2);letter-spacing:var(--rs-letter-spacing-featured-2);line-height:var(--rs-line-height-featured-2)}.--variant-featured-3{font-family:var(--rs-font-family-featured-3);font-size:var(--rs-font-size-featured-3);font-weight:var(--rs-font-weight-featured-3);letter-spacing:var(--rs-letter-spacing-featured-3);line-height:var(--rs-line-height-featured-3)}.--variant-body-1{font-family:var(--rs-font-family-body-1);font-size:var(--rs-font-size-body-1);font-weight:var(--rs-font-weight-body-1);letter-spacing:var(--rs-letter-spacing-body-1);line-height:var(--rs-line-height-body-1)}.--variant-body-2{font-family:var(--rs-font-family-body-2);font-size:var(--rs-font-size-body-2);font-weight:var(--rs-font-weight-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--variant-body-3{font-family:var(--rs-font-family-body-3);font-size:var(--rs-font-size-body-3);font-weight:var(--rs-font-weight-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--variant-caption-1{font-family:var(--rs-font-family-caption-1);font-size:var(--rs-font-size-caption-1);font-weight:var(--rs-font-weight-caption-1);letter-spacing:var(--rs-letter-spacing-caption-1);line-height:var(--rs-line-height-caption-1)}.--variant-caption-2{font-family:var(--rs-font-family-caption-2);font-size:var(--rs-font-size-caption-2);font-weight:var(--rs-font-weight-caption-2);letter-spacing:var(--rs-letter-spacing-caption-2);line-height:var(--rs-line-height-caption-2)}.--weight-regular{font-weight:var(--rs-font-weight-regular)!important}.--weight-medium{font-weight:var(--rs-font-weight-medium)!important}.--weight-bold{font-weight:var(--rs-font-weight-bold)!important}.--color-neutral{color:var(--rs-color-foreground-neutral)}.--color-neutral-faded{color:var(--rs-color-foreground-neutral-faded)}.--color-primary{color:var(--rs-color-foreground-primary)}.--color-warning{color:var(--rs-color-foreground-warning)}.--color-positive{color:var(--rs-color-foreground-positive)}.--color-critical{color:var(--rs-color-foreground-critical)}.--color-disabled{color:var(--rs-color-foreground-disabled)}.--decoration-line-through{text-decoration:line-through}@media (--rs-viewport-m ){.--align-start--m{text-align:start}.--align-center--m{text-align:center}.--align-end--m{text-align:end}.--variant-title-1--m{font-family:var(--rs-font-family-title-1);font-size:var(--rs-font-size-title-1);font-weight:var(--rs-font-weight-title-1);letter-spacing:var(--rs-letter-spacing-title-1);line-height:var(--rs-line-height-title-1)}.--variant-title-2--m{font-family:var(--rs-font-family-title-2);font-size:var(--rs-font-size-title-2);font-weight:var(--rs-font-weight-title-2);letter-spacing:var(--rs-letter-spacing-title-2);line-height:var(--rs-line-height-title-2)}.--variant-title-3--m{font-family:var(--rs-font-family-title-3);font-size:var(--rs-font-size-title-3);font-weight:var(--rs-font-weight-title-3);letter-spacing:var(--rs-letter-spacing-title-3);line-height:var(--rs-line-height-title-3)}.--variant-title-4--m{font-family:var(--rs-font-family-title-4);font-size:var(--rs-font-size-title-4);font-weight:var(--rs-font-weight-title-4);letter-spacing:var(--rs-letter-spacing-title-4);line-height:var(--rs-line-height-title-4)}.--variant-title-5--m{font-family:var(--rs-font-family-title-5);font-size:var(--rs-font-size-title-5);font-weight:var(--rs-font-weight-title-5);letter-spacing:var(--rs-letter-spacing-title-5);line-height:var(--rs-line-height-title-5)}.--variant-title-6--m{font-family:var(--rs-font-family-title-6);font-size:var(--rs-font-size-title-6);font-weight:var(--rs-font-weight-title-6);letter-spacing:var(--rs-letter-spacing-title-6);line-height:var(--rs-line-height-title-6)}.--variant-featured-1--m{font-family:var(--rs-font-family-featured-1);font-size:var(--rs-font-size-featured-1);font-weight:var(--rs-font-weight-featured-1);letter-spacing:var(--rs-letter-spacing-featured-1);line-height:var(--rs-line-height-featured-1)}.--variant-featured-2--m{font-family:var(--rs-font-family-featured-2);font-size:var(--rs-font-size-featured-2);font-weight:var(--rs-font-weight-featured-2);letter-spacing:var(--rs-letter-spacing-featured-2);line-height:var(--rs-line-height-featured-2)}.--variant-featured-3--m{font-family:var(--rs-font-family-featured-3);font-size:var(--rs-font-size-featured-3);font-weight:var(--rs-font-weight-featured-3);letter-spacing:var(--rs-letter-spacing-featured-3);line-height:var(--rs-line-height-featured-3)}.--variant-body-1--m{font-family:var(--rs-font-family-body-1);font-size:var(--rs-font-size-body-1);font-weight:var(--rs-font-weight-body-1);letter-spacing:var(--rs-letter-spacing-body-1);line-height:var(--rs-line-height-body-1)}.--variant-body-2--m{font-family:var(--rs-font-family-body-2);font-size:var(--rs-font-size-body-2);font-weight:var(--rs-font-weight-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--variant-body-3--m{font-family:var(--rs-font-family-body-3);font-size:var(--rs-font-size-body-3);font-weight:var(--rs-font-weight-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--variant-caption-1--m{font-family:var(--rs-font-family-caption-1);font-size:var(--rs-font-size-caption-1);font-weight:var(--rs-font-weight-caption-1);letter-spacing:var(--rs-letter-spacing-caption-1);line-height:var(--rs-line-height-caption-1)}.--variant-caption-2--m{font-family:var(--rs-font-family-caption-2);font-size:var(--rs-font-size-caption-2);font-weight:var(--rs-font-weight-caption-2);letter-spacing:var(--rs-letter-spacing-caption-2);line-height:var(--rs-line-height-caption-2)}.--weight-regular--m{font-weight:var(--rs-font-weight-regular)!important}.--weight-medium--m{font-weight:var(--rs-font-weight-medium)!important}.--weight-bold--m{font-weight:var(--rs-font-weight-bold)!important}}@media (--rs-viewport-l ){.--align-start--l{text-align:start}.--align-center--l{text-align:center}.--align-end--l{text-align:end}.--variant-title-1--l{font-family:var(--rs-font-family-title-1);font-size:var(--rs-font-size-title-1);font-weight:var(--rs-font-weight-title-1);letter-spacing:var(--rs-letter-spacing-title-1);line-height:var(--rs-line-height-title-1)}.--variant-title-2--l{font-family:var(--rs-font-family-title-2);font-size:var(--rs-font-size-title-2);font-weight:var(--rs-font-weight-title-2);letter-spacing:var(--rs-letter-spacing-title-2);line-height:var(--rs-line-height-title-2)}.--variant-title-3--l{font-family:var(--rs-font-family-title-3);font-size:var(--rs-font-size-title-3);font-weight:var(--rs-font-weight-title-3);letter-spacing:var(--rs-letter-spacing-title-3);line-height:var(--rs-line-height-title-3)}.--variant-title-4--l{font-family:var(--rs-font-family-title-4);font-size:var(--rs-font-size-title-4);font-weight:var(--rs-font-weight-title-4);letter-spacing:var(--rs-letter-spacing-title-4);line-height:var(--rs-line-height-title-4)}.--variant-title-5--l{font-family:var(--rs-font-family-title-5);font-size:var(--rs-font-size-title-5);font-weight:var(--rs-font-weight-title-5);letter-spacing:var(--rs-letter-spacing-title-5);line-height:var(--rs-line-height-title-5)}.--variant-title-6--l{font-family:var(--rs-font-family-title-6);font-size:var(--rs-font-size-title-6);font-weight:var(--rs-font-weight-title-6);letter-spacing:var(--rs-letter-spacing-title-6);line-height:var(--rs-line-height-title-6)}.--variant-featured-1--l{font-family:var(--rs-font-family-featured-1);font-size:var(--rs-font-size-featured-1);font-weight:var(--rs-font-weight-featured-1);letter-spacing:var(--rs-letter-spacing-featured-1);line-height:var(--rs-line-height-featured-1)}.--variant-featured-2--l{font-family:var(--rs-font-family-featured-2);font-size:var(--rs-font-size-featured-2);font-weight:var(--rs-font-weight-featured-2);letter-spacing:var(--rs-letter-spacing-featured-2);line-height:var(--rs-line-height-featured-2)}.--variant-featured-3--l{font-family:var(--rs-font-family-featured-3);font-size:var(--rs-font-size-featured-3);font-weight:var(--rs-font-weight-featured-3);letter-spacing:var(--rs-letter-spacing-featured-3);line-height:var(--rs-line-height-featured-3)}.--variant-body-1--l{font-family:var(--rs-font-family-body-1);font-size:var(--rs-font-size-body-1);font-weight:var(--rs-font-weight-body-1);letter-spacing:var(--rs-letter-spacing-body-1);line-height:var(--rs-line-height-body-1)}.--variant-body-2--l{font-family:var(--rs-font-family-body-2);font-size:var(--rs-font-size-body-2);font-weight:var(--rs-font-weight-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--variant-body-3--l{font-family:var(--rs-font-family-body-3);font-size:var(--rs-font-size-body-3);font-weight:var(--rs-font-weight-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--variant-caption-1--l{font-family:var(--rs-font-family-caption-1);font-size:var(--rs-font-size-caption-1);font-weight:var(--rs-font-weight-caption-1);letter-spacing:var(--rs-letter-spacing-caption-1);line-height:var(--rs-line-height-caption-1)}.--variant-caption-2--l{font-family:var(--rs-font-family-caption-2);font-size:var(--rs-font-size-caption-2);font-weight:var(--rs-font-weight-caption-2);letter-spacing:var(--rs-letter-spacing-caption-2);line-height:var(--rs-line-height-caption-2)}.--weight-regular--l{font-weight:var(--rs-font-weight-regular)!important}.--weight-medium--l{font-weight:var(--rs-font-weight-medium)!important}.--weight-bold--l{font-weight:var(--rs-font-weight-bold)!important}}@media (--rs-viewport-xl ){.--align-start--xl{text-align:start}.--align-center--xl{text-align:center}.--align-end--xl{text-align:end}.--variant-title-1--xl{font-family:var(--rs-font-family-title-1);font-size:var(--rs-font-size-title-1);font-weight:var(--rs-font-weight-title-1);letter-spacing:var(--rs-letter-spacing-title-1);line-height:var(--rs-line-height-title-1)}.--variant-title-2--xl{font-family:var(--rs-font-family-title-2);font-size:var(--rs-font-size-title-2);font-weight:var(--rs-font-weight-title-2);letter-spacing:var(--rs-letter-spacing-title-2);line-height:var(--rs-line-height-title-2)}.--variant-title-3--xl{font-family:var(--rs-font-family-title-3);font-size:var(--rs-font-size-title-3);font-weight:var(--rs-font-weight-title-3);letter-spacing:var(--rs-letter-spacing-title-3);line-height:var(--rs-line-height-title-3)}.--variant-title-4--xl{font-family:var(--rs-font-family-title-4);font-size:var(--rs-font-size-title-4);font-weight:var(--rs-font-weight-title-4);letter-spacing:var(--rs-letter-spacing-title-4);line-height:var(--rs-line-height-title-4)}.--variant-title-5--xl{font-family:var(--rs-font-family-title-5);font-size:var(--rs-font-size-title-5);font-weight:var(--rs-font-weight-title-5);letter-spacing:var(--rs-letter-spacing-title-5);line-height:var(--rs-line-height-title-5)}.--variant-title-6--xl{font-family:var(--rs-font-family-title-6);font-size:var(--rs-font-size-title-6);font-weight:var(--rs-font-weight-title-6);letter-spacing:var(--rs-letter-spacing-title-6);line-height:var(--rs-line-height-title-6)}.--variant-featured-1--xl{font-family:var(--rs-font-family-featured-1);font-size:var(--rs-font-size-featured-1);font-weight:var(--rs-font-weight-featured-1);letter-spacing:var(--rs-letter-spacing-featured-1);line-height:var(--rs-line-height-featured-1)}.--variant-featured-2--xl{font-family:var(--rs-font-family-featured-2);font-size:var(--rs-font-size-featured-2);font-weight:var(--rs-font-weight-featured-2);letter-spacing:var(--rs-letter-spacing-featured-2);line-height:var(--rs-line-height-featured-2)}.--variant-featured-3--xl{font-family:var(--rs-font-family-featured-3);font-size:var(--rs-font-size-featured-3);font-weight:var(--rs-font-weight-featured-3);letter-spacing:var(--rs-letter-spacing-featured-3);line-height:var(--rs-line-height-featured-3)}.--variant-body-1--xl{font-family:var(--rs-font-family-body-1);font-size:var(--rs-font-size-body-1);font-weight:var(--rs-font-weight-body-1);letter-spacing:var(--rs-letter-spacing-body-1);line-height:var(--rs-line-height-body-1)}.--variant-body-2--xl{font-family:var(--rs-font-family-body-2);font-size:var(--rs-font-size-body-2);font-weight:var(--rs-font-weight-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--variant-body-3--xl{font-family:var(--rs-font-family-body-3);font-size:var(--rs-font-size-body-3);font-weight:var(--rs-font-weight-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--variant-caption-1--xl{font-family:var(--rs-font-family-caption-1);font-size:var(--rs-font-size-caption-1);font-weight:var(--rs-font-weight-caption-1);letter-spacing:var(--rs-letter-spacing-caption-1);line-height:var(--rs-line-height-caption-1)}.--variant-caption-2--xl{font-family:var(--rs-font-family-caption-2);font-size:var(--rs-font-size-caption-2);font-weight:var(--rs-font-weight-caption-2);letter-spacing:var(--rs-letter-spacing-caption-2);line-height:var(--rs-line-height-caption-2)}.--weight-regular--xl{font-weight:var(--rs-font-weight-regular)!important}.--weight-medium--xl{font-weight:var(--rs-font-weight-medium)!important}.--weight-bold--xl{font-weight:var(--rs-font-weight-bold)!important}}

package/dist/components/TextArea/TextArea.module.css

@@ -1 +1 @@
-.root{display:grid;position:relative}.root:after{content:attr(data-rs-textarea-value) " ";visibility:hidden;white-space:pre-wrap}.input,.root:after{border:1px solid var(--rs-color-border-neutral);box-sizing:border-box;flex-grow:1;font-family:var(--rs-font-family-body);font-weight:var(--rs-font-weight-regular);grid-area:1/1/2/2;padding:calc(var(--rs-p) - 1px);width:100%;word-break:break-word}.input{background:var(--rs-color-background-elevation-base);border-radius:var(--rs-radius-small);color:var(--rs-color-foreground-neutral);outline:none;position:relative;z-index:1}.input:focus{border-color:var(--rs-color-border-primary);box-shadow:0 0 0 1px var(--rs-color-border-primary)}.input[disabled]{background:var(--rs-color-background-disabled-faded);border-color:var(--rs-color-border-disabled);color:var(--rs-color-foreground-disabled);cursor:not-allowed}.--size-medium{--rs-p:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large{--rs-p:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge{--rs-p:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.root.--variant-faded .input{background:var(--rs-color-background-neutral-faded);border-color:transparent}.root.--variant-faded .input:focus{border-color:var(--rs-color-border-primary)}.root.--variant-headless .input{background:transparent;border-color:transparent}.root.--variant-headless .input:focus,.root.--variant-headless.--status-error .input,.root.--variant-headless.--status-error .input:focus{border-color:transparent;box-shadow:none}.root.--status-error .input{border-color:var(--rs-color-border-critical)}.root.--status-error .input:active,.root.--status-error .input:focus{border-color:var(--rs-color-border-primary);box-shadow:0 0 0 1px var(--rs-color-border-primary)}.root.--resize-auto .input,.root.--resize-none .input{resize:none}@media (--rs-viewport-s ) and (hover:none){.input{font-size:var(--rs-font-size-body-2)!important}}@media (--rs-viewport-m ){.--size-medium--m{--rs-p:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--m .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--m{--rs-p:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--m .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--m{--rs-p:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--m .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-l ){.--size-medium--l{--rs-p:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--l .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--l{--rs-p:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--l .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--l{--rs-p:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--l .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-xl ){.--size-medium--xl{--rs-p:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--xl .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--xl{--rs-p:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--xl .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--xl{--rs-p:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--xl .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}}
+.root{display:grid;position:relative}.root:after{content:attr(data-rs-textarea-value) " ";visibility:hidden;white-space:pre-wrap}.input,.root:after{border:1px solid var(--rs-color-border-neutral);box-sizing:border-box;flex-grow:1;font-family:var(--rs-font-family-body);font-weight:var(--rs-font-weight-regular);grid-area:1/1/2/2;padding:calc(var(--rs-p) - 1px);width:100%;word-break:break-word}.input{background:var(--rs-color-background-elevation-base);border-radius:var(--rs-radius-small);color:var(--rs-color-foreground-neutral);outline:none;position:relative;z-index:1}.input:focus{border-color:var(--rs-color-border-primary);box-shadow:0 0 0 1px var(--rs-color-border-primary)}.input[disabled]{background:var(--rs-color-background-disabled-faded);border-color:var(--rs-color-border-disabled);color:var(--rs-color-foreground-disabled);cursor:not-allowed}.--size-medium{--rs-p:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium .input{font-size:var(--rs-font-size-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--size-large{--rs-p:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge{--rs-p:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.root.--variant-faded .input{background:var(--rs-color-background-neutral-faded);border-color:transparent}.root.--variant-faded .input:focus{border-color:var(--rs-color-border-primary)}.root.--variant-headless .input{background:transparent;border-color:transparent}.root.--variant-headless .input:focus,.root.--variant-headless.--status-error .input,.root.--variant-headless.--status-error .input:focus{border-color:transparent;box-shadow:none}.root.--status-error .input{border-color:var(--rs-color-border-critical)}.root.--status-error .input:active,.root.--status-error .input:focus{border-color:var(--rs-color-border-primary);box-shadow:0 0 0 1px var(--rs-color-border-primary)}.root.--resize-auto .input,.root.--resize-none .input{resize:none}@media (--rs-viewport-s ) and (hover:none){.input{font-size:var(--rs-font-size-body-2)!important}}@media (--rs-viewport-m ){.--size-medium--m{--rs-p:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--m .input{font-size:var(--rs-font-size-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--m{--rs-p:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--m .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--m{--rs-p:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--m .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-l ){.--size-medium--l{--rs-p:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--l .input{font-size:var(--rs-font-size-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--l{--rs-p:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--l .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--l{--rs-p:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--l .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-xl ){.--size-medium--xl{--rs-p:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--xl .input{font-size:var(--rs-font-size-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--xl{--rs-p:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--xl .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--xl{--rs-p:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--xl .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}}

package/dist/components/TextField/TextField.module.css

@@ -1 +1 @@
-.root{--rs-p-v:var(--rs-unit-x1);--rs-p-h:var(--rs-text-field-gap);background:var(--rs-color-background-elevation-base);border:1px solid var(--rs-color-border-neutral);display:flex;padding:calc(var(--rs-p-v) - 1px) 0;position:relative;z-index:0}.root:focus-within{border-color:var(--rs-color-border-primary);box-shadow:0 0 0 1px var(--rs-color-border-primary)}.root:focus-within:has(button:focus,a:focus){border-color:transparent;box-shadow:none}.input{background:none;border:none;box-sizing:border-box;color:var(--rs-color-foreground-neutral);flex-grow:1;font-family:var(--rs-font-family-body);font-weight:var(--rs-font-weight-regular);margin:calc(var(--rs-unit-x1) * -1) 0;outline:none;padding:0 var(--rs-text-field-gap);position:relative;width:100%;z-index:1}.input:-webkit-autofill{-webkit-background-clip:text;-webkit-text-fill-color:var(--rs-color-foreground-neutral)}.affix,.icon,.slot{align-items:center;display:flex;flex-shrink:0;position:relative;z-index:5}.icon{pointer-events:none}.affix{color:var(--rs-color-foreground-neutral-faded)}.attachment{align-items:center;display:flex;flex-shrink:0}.attachment--position-start{gap:var(--rs-text-field-gap);padding-inline-start:var(--rs-text-field-gap)}.attachment--position-start .affix{border-inline-end:1px solid var(--rs-color-border-neutral-faded);padding-inline-end:var(--rs-text-field-gap)}.attachment--position-end{gap:var(--rs-unit-x1);padding-inline-end:calc(var(--rs-unit-x1) - 1px)}.attachment--position-end .affix,.attachment--position-end .icon{padding-inline-end:calc(var(--rs-text-field-gap) - var(--rs-unit-x1))}.attachment--position-end .affix{border-inline-start:1px solid var(--rs-color-border-neutral-faded);padding-inline-start:var(--rs-text-field-gap)}.root.--disabled{background:var(--rs-color-background-disabled-faded);border-color:var(--rs-color-border-disabled)}.root.--disabled,.root.--disabled .input{color:var(--rs-color-foreground-disabled);cursor:not-allowed}.--size-medium{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium .affix,.--size-medium .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large .affix,.--size-large .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge .affix,.--size-xlarge .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.root.--variant-faded{background:var(--rs-color-background-neutral-faded);border-color:transparent}.root.--variant-faded:focus-within{border-color:var(--rs-color-border-primary)}.root.--variant-headless{background:transparent;border-color:transparent}.root.--variant-headless.--status-error,.root.--variant-headless.--status-error:focus-within,.root.--variant-headless:focus-within{border-color:transparent;box-shadow:none}.root.--status-error{border-color:var(--rs-color-border-critical)}.root.--status-error:focus-within{border-color:var(--rs-color-border-primary)}@media (--rs-viewport-s ) and (hover:none){.input{font-size:var(--rs-font-size-body-2)!important}}@media (--rs-viewport-m ){.--size-medium--m{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--m .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium--m .affix,.--size-medium--m .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--m{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--m .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large--m .affix,.--size-large--m .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--m{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--m .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge--m .affix,.--size-xlarge--m .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-l ){.--size-medium--l{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--l .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium--l .affix,.--size-medium--l .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--l{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--l .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large--l .affix,.--size-large--l .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--l{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--l .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge--l .affix,.--size-xlarge--l .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-xl ){.--size-medium--xl{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--xl .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium--xl .affix,.--size-medium--xl .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--xl{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--xl .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large--xl .affix,.--size-large--xl .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--xl{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--xl .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge--xl .affix,.--size-xlarge--xl .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}}
+.root{--rs-p-v:var(--rs-unit-x1);--rs-p-h:var(--rs-text-field-gap);background:var(--rs-color-background-elevation-base);border:1px solid var(--rs-color-border-neutral);display:flex;padding:calc(var(--rs-p-v) - 1px) 0;position:relative;z-index:0}.root:focus-within{border-color:var(--rs-color-border-primary);box-shadow:0 0 0 1px var(--rs-color-border-primary)}.root:focus-within:has(button:focus,a:focus){border-color:transparent;box-shadow:none}.input{background:none;border:none;box-sizing:border-box;color:var(--rs-color-foreground-neutral);flex-grow:1;font-family:var(--rs-font-family-body);font-weight:var(--rs-font-weight-regular);margin:calc(var(--rs-unit-x1) * -1) 0;outline:none;padding:0 var(--rs-text-field-gap);position:relative;width:100%;z-index:1}.input:-webkit-autofill{-webkit-background-clip:text;-webkit-text-fill-color:var(--rs-color-foreground-neutral)}.affix,.icon,.slot{align-items:center;display:flex;flex-shrink:0;position:relative;z-index:5}.icon{pointer-events:none}.affix{color:var(--rs-color-foreground-neutral-faded)}.attachment{align-items:center;display:flex;flex-shrink:0}.attachment--position-start{gap:var(--rs-text-field-gap);padding-inline-start:var(--rs-text-field-gap)}.attachment--position-start .affix{border-inline-end:1px solid var(--rs-color-border-neutral-faded);padding-inline-end:var(--rs-text-field-gap)}.attachment--position-end{gap:var(--rs-unit-x1);padding-inline-end:calc(var(--rs-unit-x1) - 1px)}.attachment--position-end .affix,.attachment--position-end .icon{padding-inline-end:calc(var(--rs-text-field-gap) - var(--rs-unit-x1))}.attachment--position-end .affix{border-inline-start:1px solid var(--rs-color-border-neutral-faded);padding-inline-start:var(--rs-text-field-gap)}.root.--disabled{background:var(--rs-color-background-disabled-faded);border-color:var(--rs-color-border-disabled)}.root.--disabled,.root.--disabled .input{color:var(--rs-color-foreground-disabled);cursor:not-allowed}.--size-medium{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium .affix,.--size-medium .input{font-size:var(--rs-font-size-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--size-large{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large .affix,.--size-large .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge .affix,.--size-xlarge .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.root.--variant-faded{background:var(--rs-color-background-neutral-faded);border-color:transparent}.root.--variant-faded:focus-within{border-color:var(--rs-color-border-primary)}.root.--variant-headless{background:transparent;border-color:transparent}.root.--variant-headless.--status-error,.root.--variant-headless.--status-error:focus-within,.root.--variant-headless:focus-within{border-color:transparent;box-shadow:none}.root.--status-error{border-color:var(--rs-color-border-critical)}.root.--status-error:focus-within{border-color:var(--rs-color-border-primary)}@media (--rs-viewport-s ) and (hover:none){.input{font-size:var(--rs-font-size-body-2)!important}}@media (--rs-viewport-m ){.--size-medium--m{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--m .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium--m .affix,.--size-medium--m .input{font-size:var(--rs-font-size-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--m{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--m .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large--m .affix,.--size-large--m .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--m{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--m .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge--m .affix,.--size-xlarge--m .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-l ){.--size-medium--l{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--l .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium--l .affix,.--size-medium--l .input{font-size:var(--rs-font-size-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--l{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--l .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large--l .affix,.--size-large--l .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--l{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--l .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge--l .affix,.--size-xlarge--l .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-xl ){.--size-medium--xl{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-radius-small)}.--size-medium--xl .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium--xl .affix,.--size-medium--xl .input{font-size:var(--rs-font-size-body-3);letter-spacing:var(--rs-letter-spacing-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--xl{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-radius-medium)}.--size-large--xl .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large--xl .affix,.--size-large--xl .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--xl{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-radius-medium)}.--size-xlarge--xl .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge--xl .affix,.--size-xlarge--xl .input{font-size:var(--rs-font-size-body-2);letter-spacing:var(--rs-letter-spacing-body-2);line-height:var(--rs-line-height-body-2)}}

package/dist/components/Toast/Toast.types.d.ts

@@ -37,23 +37,24 @@ export type ContainerProps = {
     status?: "entering" | "entered" | "exiting";
     inspected: boolean;
 };
+export type ShowOptions = {
+    timeout?: Timeout;
+    position?: Position;
+};
+export type ShowProps = Props & ShowOptions;
 export type Context = {
     options?: ProviderProps["options"];
     queues: Record<RegionProps["position"], Array<ContainerProps>>;
-    add: (toast: Props & ShowOptions) => string;
+    add: (toast: ShowProps) => string;
     show: (id: string) => void;
     hide: (id: string) => void;
     remove: (id: string) => void;
     id: string;
 };
-export type ShowOptions = {
-    timeout?: Timeout;
-    position?: Position;
-};
 type AddAction = {
     type: "add";
     payload: {
-        toastProps: Props & ShowOptions;
+        toastProps: ShowProps;
         id: string;
     };
 };

package/dist/components/Toast/index.d.ts

@@ -1,3 +1,3 @@
 export { default as useToast } from "./useToast";
 export { default as ToastProvider } from "./ToastProvider";
-export type { Props as ToastProps, ProviderProps as ToastProviderProps } from "./Toast.types";
+export type { Props as ToastProps, ProviderProps as ToastProviderProps, ShowProps as ToastShowProps, } from "./Toast.types";

package/dist/components/Toast/useToast.d.ts

@@ -1,5 +1,5 @@
 declare const useToast: () => {
-    show: (toast: import("./Toast.types").Props & import("./Toast.types").ShowOptions) => string;
+    show: (toast: import("./Toast.types").ShowProps) => string;
     hide: (id: string) => void;
     id: string;
 };

package/dist/components/Tooltip/tests/Tooltip.stories.js

@@ -121,4 +121,35 @@ export const edgeCases = () => (<Example>
 					</Actionable>)}
 			</Tooltip>
 		</Example.Item>
+
+		<Example.Item title="nested popovers inside a tooltip">
+			<Tooltip position="top" text="Hello">
+				{(tooltipAttributes) => (<Popover position="bottom">
+						<Popover.Trigger>
+							{(attributes) => (<Button color="primary" attributes={{
+                ...tooltipAttributes,
+                ...attributes,
+            }}>
+									Open
+								</Button>)}
+						</Popover.Trigger>
+						<Popover.Content>
+							<View gap={2} align="start">
+								Popover content
+								<Popover position="bottom">
+									<Popover.Trigger>
+										{(attributes) => <Button attributes={attributes}>Open</Button>}
+									</Popover.Trigger>
+									<Popover.Content>
+										<View gap={2} align="start">
+											Popover content
+											<Button onClick={() => { }}>Button</Button>
+										</View>
+									</Popover.Content>
+								</Popover>
+							</View>
+						</Popover.Content>
+					</Popover>)}
+			</Tooltip>
+		</Example.Item>
 	</Example>);

package/dist/components/_private/Flyout/Flyout.context.d.ts

@@ -3,7 +3,9 @@ import type * as T from "./Flyout.types";
 declare const FlyoutContext: React.Context<T.ContextProps>;
 declare const useFlyoutContext: () => T.ContextProps;
 declare const useFlyoutTriggerContext: () => T.TriggerContextProps;
+declare const useFlyoutContentContext: () => boolean;
 declare const Provider: React.Provider<T.ContextProps>;
 declare const TriggerProvider: React.Provider<T.TriggerContextProps>;
-export { Provider, TriggerProvider, useFlyoutContext, useFlyoutTriggerContext };
+declare const ContentProvider: React.Provider<boolean>;
+export { Provider, TriggerProvider, ContentProvider, useFlyoutContext, useFlyoutTriggerContext, useFlyoutContentContext, };
 export default FlyoutContext;

package/dist/components/_private/Flyout/Flyout.context.js

@@ -2,9 +2,12 @@
 import React from "react";
 const FlyoutContext = React.createContext({});
 const FlyoutTriggerContext = React.createContext({});
+const FlyoutContentContext = React.createContext(false);
 const useFlyoutContext = () => React.useContext(FlyoutContext);
 const useFlyoutTriggerContext = () => React.useContext(FlyoutTriggerContext);
+const useFlyoutContentContext = () => React.useContext(FlyoutContentContext);
 const Provider = FlyoutContext.Provider;
 const TriggerProvider = FlyoutTriggerContext.Provider;
-export { Provider, TriggerProvider, useFlyoutContext, useFlyoutTriggerContext };
+const ContentProvider = FlyoutContentContext.Provider;
+export { Provider, TriggerProvider, ContentProvider, useFlyoutContext, useFlyoutTriggerContext, useFlyoutContentContext, };
 export default FlyoutContext;

package/dist/components/_private/Flyout/Flyout.types.d.ts

@@ -68,6 +68,7 @@ type BaseProps = {
     disabled?: boolean;
     disableHideAnimation?: boolean;
     disableContentHover?: boolean;
+    disableCloseOnOutsideClick?: boolean;
     children?: React.ReactNode;
     onOpen?: () => void;
     onClose?: () => void;

package/dist/components/_private/Flyout/FlyoutContent.js

@@ -6,7 +6,7 @@ import useIsomorphicLayoutEffect from "../../../hooks/useIsomorphicLayoutEffect.
 import Portal from "../Portal/index.js";
 import { getClosestFlyoutTarget } from "../../../utilities/dom.js";
 import cooldown from "./utilities/cooldown.js";
-import { useFlyoutContext } from "./Flyout.context.js";
+import { useFlyoutContext, ContentProvider } from "./Flyout.context.js";
 import s from "./Flyout.module.css";
 const FlyoutContent = (props) => {
     const { children, className, attributes } = props;
@@ -48,12 +48,10 @@ const FlyoutContent = (props) => {
     else if (trapFocusMode === "action-menu") {
         role = "menu";
     }
-    const content = (
-    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-    _jsx("div", { className: contentClassNames, style: {
-            ...styles,
-            "--rs-flyout-gap": contentGap,
-        }, ref: flyoutElRef, onTransitionEnd: handleTransitionEnd, onMouseEnter: triggerType === "hover" ? handleMouseEnter : undefined, onMouseLeave: triggerType === "hover" ? handleMouseLeave : undefined, onMouseDown: handleContentMouseDown, onTouchStart: handleContentMouseDown, onMouseUp: handleContentMouseUp, onTouchEnd: handleContentMouseUp, children: _jsx("div", { role: role, ...attributes, id: id, "aria-modal": triggerType === "click", style: contentAttributes?.style, className: innerClassNames, children: children }) }));
+    const content = (_jsx(ContentProvider, { value: true, children: _jsx("div", { className: contentClassNames, style: {
+                ...styles,
+                "--rs-flyout-gap": contentGap,
+            }, ref: flyoutElRef, onTransitionEnd: handleTransitionEnd, onMouseEnter: triggerType === "hover" ? handleMouseEnter : undefined, onMouseLeave: triggerType === "hover" ? handleMouseLeave : undefined, onMouseDown: handleContentMouseDown, onTouchStart: handleContentMouseDown, onMouseUp: handleContentMouseUp, onTouchEnd: handleContentMouseUp, children: _jsx("div", { role: role, ...attributes, id: id, "aria-modal": triggerType === "click", style: contentAttributes?.style, className: innerClassNames, children: children }) }) }));
     const closestScrollable = getClosestFlyoutTarget(triggerElRef.current);
     const scrollableRef = closestScrollable === document.body ? undefined : { current: closestScrollable };
     return _jsx(Portal, { targetRef: containerRef || scrollableRef, children: content });

package/dist/components/_private/Flyout/FlyoutControlled.js

@@ -13,12 +13,16 @@ import { checkKeyboardMode } from "../../../utilities/a11y/keyboardMode.js";
 import useFlyout from "./useFlyout.js";
 import * as timeouts from "./Flyout.constants.js";
 import cooldown from "./utilities/cooldown.js";
-import { Provider, useFlyoutTriggerContext, useFlyoutContext } from "./Flyout.context.js";
+import { Provider, useFlyoutTriggerContext, useFlyoutContext, useFlyoutContentContext, } from "./Flyout.context.js";
+import useHandlerRef from "../../../hooks/useHandlerRef.js";
 const FlyoutRoot = (props) => {
-    const { triggerType = "click", onOpen, onClose, children, disabled, forcePosition, trapFocusMode, width, disableHideAnimation, disableContentHover, contentGap, contentClassName, contentAttributes, position: passedPosition, active: passedActive, id: passedId, instanceRef, containerRef, } = props;
+    const { triggerType = "click", onOpen, onClose, children, disabled, forcePosition, trapFocusMode, width, disableHideAnimation, disableContentHover, disableCloseOnOutsideClick, contentGap, contentClassName, contentAttributes, position: passedPosition, active: passedActive, id: passedId, instanceRef, containerRef, } = props;
+    const onOpenRef = useHandlerRef(onOpen);
+    const onCloseRef = useHandlerRef(onClose);
     const resolvedActive = disabled === true ? false : passedActive;
     const parentFlyoutContext = useFlyoutContext();
     const parentFlyoutTriggerContext = useFlyoutTriggerContext();
+    const parentFlyoutContentContext = useFlyoutContentContext();
     const isSubmenu = parentFlyoutContext.trapFocusMode === "action-menu" ||
         parentFlyoutContext.trapFocusMode === "content-menu";
     const [isRTL] = useRTL();
@@ -27,7 +31,8 @@ const FlyoutRoot = (props) => {
      * Reuse the parent trigger ref in case we render nested triggers
      * For example, when we apply tooltip and popover to the same button
      */
-    const triggerElRef = parentFlyoutTriggerContext?.triggerElRef || internalTriggerElRef;
+    const triggerElRef = (!parentFlyoutContentContext && parentFlyoutTriggerContext?.triggerElRef) ||
+        internalTriggerElRef;
     const flyoutElRef = React.useRef(null);
     const id = useElementId(passedId);
     const timerRef = React.useRef();
@@ -58,20 +63,17 @@ const FlyoutRoot = (props) => {
         const canOpen = !lockedRef.current && status === "idle";
         if (!canOpen)
             return;
-        onOpen?.();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [status]);
+        onOpenRef.current?.();
+    }, [status, onOpenRef]);
     const handleClose = React.useCallback((options) => {
         const isLocked = triggerType === "click" && !isDismissible();
         const canClose = !isLocked && (status !== "idle" || disabled);
         if (!canClose)
             return;
-        onClose?.();
+        onCloseRef.current?.();
         if (options?.closeParents)
             parentFlyoutContext?.handleClose?.();
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [status, isDismissible, triggerType]);
+    }, [status, isDismissible, triggerType, onCloseRef, disabled, parentFlyoutContext]);
     /**
      * Trigger event handlers
      */
@@ -174,15 +176,17 @@ const FlyoutRoot = (props) => {
     useIsomorphicLayoutEffect(() => {
         if (status !== "visible" || !flyoutElRef.current)
             return;
+        if (trapFocusRef.current?.trapped)
+            return;
         trapFocusRef.current = new TrapFocus(flyoutElRef.current);
         trapFocusRef.current.trap({
             mode: trapFocusMode,
-            includeTrigger: triggerType === "hover" && trapFocusMode === "content-menu",
+            includeTrigger: triggerType === "hover" && trapFocusMode !== "dialog" && !isSubmenu,
             onNavigateOutside: () => {
                 handleClose();
             },
         });
-    }, [status, triggerType, handleClose, trapFocusMode]);
+    }, [status, triggerType, trapFocusMode]);
     React.useEffect(() => {
         if (!disableHideAnimation && status !== "hidden")
             return;
@@ -229,6 +233,8 @@ const FlyoutRoot = (props) => {
     }), [handleOpen, handleClose, updatePosition]);
     useHotkeys({ Escape: () => handleClose() }, [handleClose]);
     useOnClickOutside([flyoutElRef, triggerElRef], () => {
+        if (disableCloseOnOutsideClick)
+            return;
         // Clicking outside changes focused element so we don't need to set it back ourselves
         shouldReturnFocusRef.current = false;
         handleClose();

package/dist/components/_private/Flyout/FlyoutTrigger.js

@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useFlyoutContext, TriggerProvider } from "./Flyout.context.js";
 const FlyoutTrigger = (props) => {
     const { children } = props;
-    const { id, triggerElRef, triggerType, flyout, handleFocus, handleBlur, handleMouseEnter, handleMouseLeave, handleClick, trapFocusMode, } = useFlyoutContext();
+    const { id, triggerElRef, triggerType, flyout, handleFocus, handleBlur, handleMouseEnter, handleMouseLeave, handleClick, trapFocusMode, isSubmenu, } = useFlyoutContext();
     let childrenAttributes = {
         onBlur: handleBlur,
         ref: triggerElRef,
@@ -15,7 +15,8 @@ const FlyoutTrigger = (props) => {
         childrenAttributes.onMouseEnter = handleMouseEnter;
         childrenAttributes.onMouseLeave = handleMouseLeave;
     }
-    if ((triggerType === "hover" && trapFocusMode !== "action-menu") || triggerType === "focus") {
+    // Submenus open on keypress instead of hover
+    if ((triggerType === "hover" && !isSubmenu) || triggerType === "focus") {
         childrenAttributes.onFocus = handleFocus;
         childrenAttributes["aria-describedby"] = id;
     }

package/dist/components/_private/Flyout/tests/Flyout.stories.d.ts

@@ -5,16 +5,10 @@ declare const _default: {
 export default _default;
 export declare const positions: () => React.JSX.Element;
 export declare const dynamicPosition: () => React.JSX.Element;
-export declare const modeDialogClick: () => React.JSX.Element;
-export declare const modeActionMenuClick: () => React.JSX.Element;
-export declare const modeContentMenuClick: () => React.JSX.Element;
-export declare const modeDialogHover: () => React.JSX.Element;
-export declare const modeActionMenuHover: () => React.JSX.Element;
-export declare const modeContentMenuHover: () => React.JSX.Element;
-export declare const disableContentHover: () => React.JSX.Element;
+export declare const modes: () => React.JSX.Element;
+export declare const disableFlags: () => React.JSX.Element;
 export declare const customPortalTarget: () => React.JSX.Element;
 export declare const testWidthOverflowOnMobile: () => React.JSX.Element;
-export declare const testInsideScrollArea: () => React.JSX.Element;
 export declare const testInsideFixed: () => React.JSX.Element;
 export declare const testDynamicBounds: () => React.JSX.Element;
 export declare const widthTrigger: () => React.JSX.Element;

package/dist/components/_private/Flyout/tests/Flyout.stories.js

@@ -50,39 +50,70 @@ export const positions = () => (<div style={{ paddingTop: 200 }}>
 export const dynamicPosition = () => (<div style={{ position: "absolute", top: 0, left: "50%" }}>
 		<Demo position="top"/>
 	</div>);
-export const modeDialogClick = () => (<Demo position="bottom-start" trapFocusMode="dialog">
-		<button type="button">Item 1</button>
-		<button type="button">Item 2</button>
-		<button type="button">Close</button>
-	</Demo>);
-export const modeActionMenuClick = () => (<Demo position="bottom-start" trapFocusMode="action-menu">
-		<button type="button">Item 1</button>
-		<button type="button">Item 2</button>
-		<button type="button">Close</button>
-	</Demo>);
-export const modeContentMenuClick = () => (<Demo position="bottom-start" trapFocusMode="content-menu">
-		<button type="button">Item 1</button>
-		<button type="button">Item 2</button>
-		<button type="button">Close</button>
-	</Demo>);
-export const modeDialogHover = () => (<Demo position="bottom-start" trapFocusMode="dialog" triggerType="hover">
-		<button type="button">Item 1</button>
-		<button type="button">Item 2</button>
-		<button type="button">Close</button>
-	</Demo>);
-export const modeActionMenuHover = () => (<Demo position="bottom-start" trapFocusMode="action-menu" triggerType="hover">
-		<button type="button">Item 1</button>
-		<button type="button">Item 2</button>
-		<button type="button">Close</button>
-	</Demo>);
-export const modeContentMenuHover = () => (<Demo position="bottom-start" trapFocusMode="content-menu" triggerType="hover">
-		<button type="button">Item 1</button>
-		<button type="button">Item 2</button>
-		<button type="button">Close</button>
-	</Demo>);
-export const disableContentHover = () => (<Demo triggerType="hover" disableContentHover>
-		Content
-	</Demo>);
+export const modes = () => (<Example>
+		<Example.Item title="dialog click">
+			<Demo position="bottom-start" trapFocusMode="dialog">
+				<button type="button">Item 1</button>
+				<button type="button">Item 2</button>
+				<button type="button">Close</button>
+			</Demo>
+		</Example.Item>
+
+		<Example.Item title="action-menu click">
+			<Demo position="bottom-start" trapFocusMode="action-menu">
+				<button type="button">Item 1</button>
+				<button type="button">Item 2</button>
+				<button type="button">Close</button>
+			</Demo>
+		</Example.Item>
+
+		<Example.Item title="content-menu click">
+			<Demo position="bottom-start" trapFocusMode="content-menu">
+				<button type="button">Item 1</button>
+				<button type="button">Item 2</button>
+				<button type="button">Close</button>
+			</Demo>
+		</Example.Item>
+
+		<Example.Item title="dialog hover">
+			<Demo position="bottom-start" trapFocusMode="dialog" triggerType="hover">
+				<button type="button">Item 1</button>
+				<button type="button">Item 2</button>
+				<button type="button">Close</button>
+			</Demo>
+		</Example.Item>
+
+		<Example.Item title="action-menu hover">
+			<Demo position="bottom-start" trapFocusMode="action-menu" triggerType="hover">
+				<button type="button">Item 1</button>
+				<button type="button">Item 2</button>
+				<button type="button">Close</button>
+			</Demo>
+		</Example.Item>
+
+		<Example.Item title="content-menu hover">
+			<Demo position="bottom-start" trapFocusMode="content-menu" triggerType="hover">
+				<button type="button">Item 1</button>
+				<button type="button">Item 2</button>
+				<button type="button">Close</button>
+			</Demo>
+		</Example.Item>
+	</Example>);
+export const disableFlags = () => (<Example>
+		<Example.Item title="disableContentHover">
+			<Demo triggerType="hover" disableContentHover>
+				Content
+			</Demo>
+		</Example.Item>
+
+		<Example.Item title="disableCloseOnOutsideClick">
+			<Demo disableCloseOnOutsideClick>Content</Demo>
+		</Example.Item>
+
+		<Example.Item title="disableHideAnimation">
+			<Demo disableHideAnimation>Content</Demo>
+		</Example.Item>
+	</Example>);
 class CustomElement extends window.HTMLElement {
     constructor() {
         super();
@@ -99,7 +130,9 @@ class CustomElement extends window.HTMLElement {
         root.render(node);
     }
 }
-window.customElements.define("custom-element", CustomElement);
+if (!window.customElements.get("custom-element")) {
+    window.customElements.define("custom-element", CustomElement);
+}
 export const customPortalTarget = () => {
     const portalRef = React.useRef(null);
     return (<Example>
@@ -136,30 +169,6 @@ export const testWidthOverflowOnMobile = () => (<Demo position="bottom-start" wi
 		<button type="button">Item 2</button>
 		<button type="button">Close</button>
 	</Demo>);
-export const testInsideScrollArea = () => (<Example>
-		<Example.Item title="should move the content on area scroll">
-			<div style={{ overflow: "scroll", height: 200, margin: 40, position: "relative" }}>
-				<Flyout triggerType="click" position="bottom-start">
-					<Flyout.Trigger>{(attributes) => <button {...attributes}>Foo</button>}</Flyout.Trigger>
-					<Flyout.Content>
-						<div style={{
-        background: "var(--rs-color-background-elevation-overlay)",
-        padding: "var(--rs-unit-x4)",
-        height: 100,
-        width: 160,
-        borderRadius: "var(--rs-radius-medium)",
-        border: "1px solid var(--rs-color-border-neutral-faded)",
-        boxSizing: "border-box",
-    }}>
-							{"Content"}
-						</div>
-					</Flyout.Content>
-				</Flyout>
-				<View height="300px" backgroundColor="neutral-faded"/>
-			</div>
-			<div style={{ height: 2000 }}/>
-		</Example.Item>
-	</Example>);
 export const testInsideFixed = () => (<Example>
 		<Example.Item title="should move the content on page scroll">
 			<View position="fixed" insetTop={20} insetStart={0} insetEnd={0} backgroundColor="neutral-faded" padding={4}>
@@ -186,16 +195,32 @@ export const testInsideFixed = () => (<Example>
 export const testDynamicBounds = () => {
     const [left, setLeft] = React.useState("50%");
     const [size, setSize] = React.useState("medium");
+    const flyoutRef = React.useRef();
+    React.useEffect(() => {
+        flyoutRef.current?.updatePosition();
+    }, [left]);
     return (<View gap={4}>
 			<View direction="row" gap={2}>
-				<Button onClick={() => setLeft("0%")}>Left</Button>
-				<Button onClick={() => setLeft("50%")}>Center</Button>
-				<Button onClick={() => setLeft("100%")}>Right</Button>
+				<Button onClick={() => {
+            setLeft("20%");
+        }}>
+					Left
+				</Button>
+				<Button onClick={() => {
+            setLeft("50%");
+        }}>
+					Center
+				</Button>
+				<Button onClick={() => {
+            setLeft("70%");
+        }}>
+					Right
+				</Button>
 				<Button onClick={() => setSize("large")}>Large button</Button>
 				<Button onClick={() => setSize("medium")}>Small button</Button>
 			</View>
 			<View height={100}>
-				<Flyout position="bottom" active>
+				<Flyout position="bottom" active instanceRef={flyoutRef}>
 					<Flyout.Trigger>
 						{(attributes) => (<div style={{ position: "absolute", left, top: "50%" }}>
 								<Button color="primary" attributes={attributes} size={size}>

package/dist/components/_private/Flyout/useFlyout.js

@@ -79,11 +79,20 @@ const flyout = (triggerEl, flyoutEl, options) => {
     }
     document.body.appendChild(targetClone);
     const flyoutBounds = targetClone.getBoundingClientRect();
+    const rootNode = triggerEl?.getRootNode();
+    const isShadowDom = rootNode instanceof ShadowRoot;
+    const shadowHostBounds = isShadowDom ? rootNode.host.getBoundingClientRect() : null;
     const scrollableParent = container || getClosestFlyoutTarget(triggerEl);
     const scopeBounds = scrollableParent.getBoundingClientRect();
     const scopeOffset = {
-        top: scopeBounds.top + document.documentElement.scrollTop - scrollableParent.scrollTop,
-        left: scopeBounds.left + document.documentElement.scrollLeft - scrollableParent.scrollLeft,
+        top: scopeBounds.top +
+            document.documentElement.scrollTop -
+            scrollableParent.scrollTop -
+            (shadowHostBounds?.top || 0),
+        left: scopeBounds.left +
+            document.documentElement.scrollLeft -
+            scrollableParent.scrollLeft -
+            (shadowHostBounds?.left || 0),
     };
     let calculated = calculatePosition({ triggerBounds, flyoutBounds, scopeOffset, ...options });
     if (!fullyVisible(calculated) && !forcePosition) {

package/dist/components/_private/Portal/Portal.module.css

@@ -1 +1 @@
-.root{display:contents}
+.root{display:none}