@baseline-ui/core 0.15.0 → 0.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.css CHANGED
@@ -7,4 +7,4 @@
7
7
  * This notice may not be removed from this file.
8
8
  *
9
9
  */
10
- @layer reset;.z9nup81{display:flex;flex-direction:column}.z9nup82{display:flex;flex-direction:row}.z9nup83{pointer-events:none;cursor:not-allowed}.z9nup84{background-image:repeating-conic-gradient(transparent 0% 25%,var(--bui-color-background-secondary-medium) 25% 50%)}.z9nup85{background-size:4px 4px}.z9nup86{background-size:6px 6px}@layer reset{.z9nup80{display:contents}.z9nup87{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@layer base;@layer variants;._6n12k90{list-style:none}@layer base{._6n12k91{list-style:none;height:36px}._6n12k9a{list-style:none;transition-property:outline-color;z-index:9}}@layer variants{._6n12k95{border-top-width:1px}._6n12k96{border-bottom-width:1px}}@layer base;@layer variants;@layer base{.gukncs0{background-color:var(--bui-color-border-subtle);width:100%;height:1px;flex-shrink:0}}@layer variants{.gukncs1{width:1px;height:100%}.gukncs2{background-color:var(--bui-color-border-medium)}}@layer reset;@layer variants;.uf19bsg{transition-property:rotate}.uf19bse[aria-expanded=true] .uf19bsg{rotate:180deg}@layer reset{.uf19bs0{all:unset;height:fit-content}}@layer variants{.uf19bs1{min-height:16px;min-width:16px}.uf19bs2{min-height:24px;min-width:24px}.uf19bs3{min-height:32px;min-width:32px}.uf19bs4{min-height:40px;min-width:40px}.uf19bs5{min-height:48px;min-width:48px}.uf19bs7{cursor:not-allowed}.uf19bs8{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}.uf19bse{min-height:unset;width:fit-content;min-width:unset}.uf19bse[aria-expanded=true]{outline:1px solid var(--bui-color-border-medium);outline-offset:-1px}}@layer base;@layer variants;@layer compoundVariants;.oom8bs0 svg{pointer-events:none}.oom8bs5[aria-expanded=true] .uf19bsg{rotate:180deg}@layer base{.oom8bs0{border:none;transition-property:all;width:fit-content;white-space:nowrap;box-sizing:border-box}}@layer variants{.oom8bs1{background-color:var(--bui-color-interactive-primary);color:var(--bui-color-text-inverse)}.oom8bs1:disabled{background-color:var(--bui-color-interactive-disabled)}.oom8bs2{box-shadow:inset 0 0 0 1px var(--bui-color-border-medium);background-color:var(--bui-color-background-secondary-subtle);color:var(--bui-color-text-primary)}.oom8bs2:disabled{color:var(--bui-color-text-disabled)}.oom8bs3{background-color:transparent;box-shadow:inset 0 0 0 1px var(--bui-color-interactive-primary);color:var(--bui-color-interactive-primary)}.oom8bs3:disabled{box-shadow:inset 0 0 0 1px var(--bui-color-interactive-disabled);color:var(--bui-color-interactive-disabled)}.oom8bs4{background-color:transparent;color:var(--bui-color-interactive-primary)}.oom8bs4:disabled{color:var(--bui-color-interactive-disabled)}.oom8bs5{background-color:transparent;color:var(--bui-color-text-primary);transition-property:none}.oom8bs5:disabled{color:var(--bui-color-text-disabled)}.oom8bs5[aria-expanded=true]{outline:1px solid var(--bui-color-border-medium);outline-offset:-1px}.oom8bs6{cursor:not-allowed}.oom8bs7{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}.oom8bs9{min-height:32px;padding:var(--bui-spacing-md)}.oom8bsa{min-height:40px;padding:var(--bui-spacing-md) var(--bui-spacing-lg)}}@layer compoundVariants{.oom8bsb{background-color:var(--bui-color-interactive-hovered)}.oom8bsc{background-color:var(--bui-color-background-secondary-medium)}.oom8bsd{background-color:var(--bui-color-interactive-primary);color:var(--bui-color-text-inverse)}.oom8bse{outline:1px solid var(--bui-color-border-medium);outline-offset:-1px}.oom8bsf{color:var(--bui-color-interactive-hovered)}.oom8bsg{border:none;box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary),inset 0 0 0 3px var(--bui-color-focused-inset)}.oom8bsh{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary),inset 0 0 0 3px var(--bui-color-focused-inset);background-color:var(--bui-color-interactive-primary);color:var(--bui-color-text-inverse)}}._14uvjig0{width:100%}._14uvjig1{background-color:var(--bui-color-background-inverse-strong)}._14uvjig2{background-color:var(--bui-color-interactive-primary)}._14uvjig3{display:flex;justify-content:space-between;align-items:center}._14uvjig4{font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing);color:var(--bui-color-text-secondary)}._14uvjig5{color:var(--bui-color-text-disabled)}._14uvjig6{padding-bottom:var(--bui-spacing-md)}._14uvjig7{display:flex;height:24px;align-items:center;gap:var(--bui-spacing-md)}._14uvjig8{height:2px;background-color:var(--bui-color-background-primary-strong);width:100%}._14uvjig9{position:absolute;height:100%}._14uvjigb{transition:width .2s}._14uvjigc{background-color:var(--bui-color-interactive-disabled)}._14uvjige{height:8px;width:8px;border-radius:50%;margin-top:1px;cursor:pointer;transition-property:height,width;transition-duration:.2s}._14uvjigf{height:12px;width:12px;border:0;outline:0}._14uvjigg{background-color:var(--bui-color-interactive-disabled);cursor:not-allowed}._14uvjigh{display:none}._14uvjigi{box-shadow:0 0 0 1px var(--bui-color-focused-inset),0 0 0 3px var(--bui-color-interactive-primary);transition-property:left;transition-duration:.2s}._14uvjigj{height:12px;width:12px}.nrh1eh0{width:100%}.nrh1eh2{justify-content:space-between;gap:var(--bui-spacing-md)}.nrh1eh3{font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing);color:var(--bui-color-text-secondary)}.nrh1eh4{display:inline-flex}.nrh1eh5{margin-bottom:var(--bui-spacing-md)}.nrh1eh6{padding-top:0;flex-direction:column}.nrh1eh8{justify-content:center}.nrh1eh9{border:1px solid var(--bui-color-border-medium);border-radius:var(--bui-rounded-xs);overflow:hidden;align-items:center;height:32px}.nrh1ehb{border-color:var(--bui-color-support-error-medium)}.nrh1ehe{border-radius:var(--bui-rounded-xs);border:1px solid var(--bui-color-focused-primary);outline:1px solid var(--bui-color-focused-primary);outline-offset:-2px}.nrh1ehf{cursor:not-allowed}.nrh1ehi{border-radius:0;outline:none}.nrh1ehj{border:1px solid var(--bui-color-border-medium)}.nrh1ehk{border-color:transparent}.nrh1ehl,.nrh1ehm{border-color:var(--bui-color-border-strong)}.nrh1ehn{border-color:transparent;border-bottom:1px solid var(--bui-color-border-medium)}.nrh1eho{color:var(--bui-color-text-primary);width:100%;background-color:transparent;padding:var(--bui-spacing-md);border:none;outline:none;height:inherit;text-align:inherit;font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}.nrh1eho::placeholder{color:var(--bui-color-text-placeholder)}.nrh1ehp{cursor:inherit;color:var(--bui-color-text-disabled)}.nrh1ehp::placeholder{color:var(--bui-color-text-disabled)}.nrh1ehr{text-align:right}.nrh1ehs{margin-right:var(--bui-spacing-md);display:inline-flex;flex-shrink:0}.nrh1ehu{color:var(--bui-color-support-error-medium)}.nrh1ehv{color:var(--bui-color-support-warning-medium)}.nrh1ehw{color:var(--bui-color-icon-primary)}.nrh1ehx{color:var(--bui-color-text-helper);padding-top:var(--bui-spacing-sm);font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}.nrh1ehy{color:var(--bui-color-text-disabled)}.nrh1ehz{color:var(--bui-color-support-error-medium)}.nrh1eh10{width:max-content;max-width:100px}._1lnwne0{max-width:140px}._1lnwne1{display:flex;align-items:center;gap:var(--bui-spacing-sm);padding:0 var(--bui-spacing-sm);height:inherit;transition:background-color .2s ease-in}._1lnwne4{background-color:var(--bui-color-background-primary-medium)}.bpklwa0{display:inline-flex}.bpklwa1{flex-direction:column;gap:var(--bui-spacing-md);width:fit-content}.bpklwa2{flex-direction:row;justify-content:space-between;align-items:center;width:100%}.bpklwa3{display:inline-flex;flex-direction:row;gap:var(--bui-spacing-md);align-items:center}.bpklwa4{flex-direction:row-reverse}.bpklwa6{color:var(--bui-color-text-primary);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}.bpklwa7{border-radius:9px;width:36px;height:18px;background-color:var(--bui-color-background-inverse-subtle);padding:2px;box-sizing:border-box;cursor:pointer}.bpklwa8{border:1px solid var(--bui-color-icon-disabled);padding:1px;background-color:transparent;cursor:default}.bpklwa9{background-color:var(--bui-color-background-secondary-medium);cursor:not-allowed}.bpklwab{outline-offset:1px;outline:var(--bui-color-focused-primary) 2px solid}.bpklwac{background-color:var(--bui-color-icon-interactive)}.bpklwad{color:var(--bui-color-text-secondary);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}.bpklwae{width:14px;height:14px;background-color:var(--bui-color-icon-inverse);border-radius:var(--bui-rounded-full);transition:transform .2s}.bpklwaf{background-color:var(--bui-color-icon-disabled)}.bpklwag{transform:translate(18px)}.bpklwah{background-color:var(--bui-color-icon-primary)}._19n40yy0{display:flex;align-items:center;position:relative;flex-direction:row;padding:0 var(--bui-spacing-md);gap:var(--bui-spacing-md);background-color:var(--bui-color-background-primary-subtle);border-radius:var(--bui-rounded-xs);border:1px solid transparent;color:var(--bui-color-icon-primary);width:100%;font:var(--bui-typography-body-md-regular-font);letter-spacing:var(--bui-typography-body-md-regular-letter-spacing)}._19n40yy1{height:48px}._19n40yy2{height:40px}._19n40yy3{height:32px;font:var(--bui-typography-body-sm-regular-font);letter-spacing:var(--bui-typography-body-sm-regular-letter-spacing)}._19n40yy4{border-color:var(--bui-color-border-medium)}._19n40yy6{border-color:transparent;box-shadow:0 0 0 2px var(--bui-color-focused-primary)}._19n40yy7{padding-right:0}._19n40yy8{color:var(--bui-color-text-disabled);cursor:not-allowed}._19n40yy9{border:none;outline:none;background-color:transparent;font:inherit;display:flex;cursor:inherit;flex:1;color:var(--bui-color-text-primary)}._19n40yy9::placeholder{font:inherit;color:var(--bui-color-text-placeholder)}._19n40yy9::-webkit-search-cancel-button{-webkit-appearance:none}._19n40yy9::-webkit-search-decoration{-webkit-appearance:none}._1mdhlqv1{cursor:pointer;background-color:transparent}._1mdhlqv2{outline:none}._1mdhlqv4{transition:transform .2s ease-in-out}._1mdhlqv5{transform:rotate(180deg)}._1mdhlqv6{flex:1}._1mdhlqv7{overflow:hidden}._1mdhlqv8{width:var(--_1mdhlqv0);min-width:64px;overflow:hidden;outline:1px solid var(--bui-color-border-subtle);outline-offset:-1px;position:relative;overflow-y:auto;max-height:inherit}._1mdhlqv8 .BaselineUI-ListBox-Section{padding-block:var(--bui-spacing-md)}._1mdhlqv8.BaselineUI-ListBox:not(:has(.BaselineUI-ListBox-Section)){padding-block:var(--bui-spacing-md)}@layer base;._1gzftth2{transform:rotate(180deg) translate(-50%,8px);transform-origin:left}._1gzftth3{bottom:0;transform:translate(-50%,8px)}._1gzftth4{transform:rotate(90deg) translate(-50%,11px)}._1gzftth5{right:0;transform:rotate(-90deg) translate(50%,11px);transform-origin:center}@layer base{._1gzftth1{min-width:max-content}._1gzftth1[data-placement=top],._1gzftth1[data-placement=bottom]{width:var(--_1gzftth0)}}.xyd2ss0{list-style:none}.xyd2ss1{list-style:none;overflow-y:auto;max-height:inherit;min-width:150px;width:fit-content}.xyd2ss1:not(:has(.xyd2ss0)){padding-block:var(--bui-spacing-md)}._13f0naj0{cursor:pointer;color:var(--bui-color-interactive-primary);transition:color .2s;outline:none}._13f0naj0:visited:not([aria-disabled=true]){color:var(--bui-color-interactive-visited)}._13f0naj1{text-decoration:none}._13f0naj2{text-decoration:underline}._13f0naj3{color:var(--bui-color-interactive-hovered)}._13f0naj4{outline:2px solid var(--bui-color-focused-primary)}._13f0naj5{color:var(--bui-color-text-disabled);cursor:not-allowed}._13f0najc{color:var(--bui-color-text-primary);outline:2px solid var(--bui-color-focused-primary)}._13f0najd{font:var(--bui-typography-body-sm-regular-font);letter-spacing:var(--bui-typography-body-sm-regular-letter-spacing)}._13f0naje{font:var(--bui-typography-body-md-regular-font);letter-spacing:var(--bui-typography-body-md-regular-letter-spacing)}._13f0najf{font:var(--bui-typography-body-lg-regular-font);letter-spacing:var(--bui-typography-body-lg-regular-letter-spacing)}._13f0najg{font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}._13f0najh{font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._13f0naji{font:var(--bui-typography-label-lg-medium-font);letter-spacing:var(--bui-typography-label-lg-medium-letter-spacing)}._180w5ed0{text-align:center;height:100px;display:flex;justify-content:center;align-items:center;flex-direction:column;cursor:pointer;padding:var(--bui-spacing-xl);gap:var(--bui-spacing-md)}._180w5ed1{width:100%;background-color:var(--bui-color-background-secondary-subtle)}._180w5ed2{border:1px dashed var(--bui-color-border-medium);border-radius:var(--bui-rounded-sm)}._180w5ed3{outline:none}._180w5ed4{pointer-events:none;background-color:unset}._180w5ed5{border-color:var(--bui-color-border-interactive)}._180w5ed6{border:2px solid var(--bui-color-border-interactive)}._180w5ed7{border:1px solid var(--bui-color-border-disabled)}._180w5ed8{border:1px dashed var(--bui-color-border-disabled)}._180w5ed9{color:var(--bui-color-icon-secondary)}._180w5eda{color:var(--bui-color-icon-disabled)}._180w5edb{cursor:inherit;color:var(--bui-color-interactive-primary);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._180w5edc{color:var(--bui-color-text-disabled)}._180w5edd{text-decoration:underline}._180w5ede{color:var(--bui-color-text-helper);font:var(--bui-typography-label-md-regular-font);letter-spacing:var(--bui-typography-label-md-regular-letter-spacing)}._180w5edf{color:var(--bui-color-text-disabled)}._12vfhl40{width:100%}._12vfhl41{justify-content:space-between}._12vfhl42{color:var(--bui-color-text-secondary);padding-bottom:var(--bui-spacing-sm);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._12vfhl43{color:var(--bui-color-text-primary)}._12vfhl44{padding-bottom:0}._12vfhl45{padding:var(--bui-spacing-md) 0}._12vfhl46{height:16px;align-items:center;gap:var(--bui-spacing-md)}._12vfhl47{height:4px;background-color:var(--bui-color-background-primary-strong);width:100%}._12vfhl48{height:4px}._12vfhl49{background-color:var(--bui-color-support-success-medium)}._12vfhl4a{background-color:var(--bui-color-support-error-medium)}._12vfhl4b{background-color:var(--bui-color-support-info-medium)}._9b1tml0{display:inline-flex;flex-direction:row;align-self:flex-start;padding:var(--bui-spacing-xs);gap:var(--bui-spacing-xs);border-radius:var(--bui-rounded-sm);align-items:center;cursor:pointer;transition:background-color .2s ease;outline:none;border:none;background-color:var(--bui-color-background-secondary-subtle)}._9b1tml1{background-color:var(--bui-color-icon-interactive)}._9b1tml2{background-color:var(--bui-color-background-secondary-subtle)}._9b1tml5{outline:2px solid var(--bui-color-focused-primary)}._9b1tml6{cursor:default;box-shadow:inset 0 0 0 1px var(--bui-color-icon-disabled);background-color:var(--bui-color-background-primary-subtle)}._9b1tml7{padding:1px;border:1px solid var(--bui-color-focused-inset)}._9b1tml8{background-color:var(--bui-color-interactive-hovered)}._9b1tml9{background-color:var(--bui-color-background-secondary-medium)}._9b1tmla{background-color:var(--bui-color-interactive-disabled);color:var(--bui-color-text-inverse)}._9b1tmlb{background-color:var(--bui-color-interactive-disabled);box-shadow:inset 0 0 0 1px var(--bui-color-border-inverse)}._9b1tmlc{padding:var(--bui-spacing-xs);background-color:var(--bui-color-background-primary-subtle);color:var(--bui-color-icon-primary);border-radius:var(--bui-rounded-xs);display:flex}._9b1tmld{color:var(--bui-color-icon-disabled)}._9b1tmle{color:var(--bui-color-icon-inverse);background-color:var(--bui-color-icon-primary)}._9b1tmlf{display:flex;align-items:center;padding:0 var(--bui-spacing-md);color:var(--bui-color-text-primary);transition:color .2s ease;font:var(--bui-typography-body-lg-regular-font);letter-spacing:var(--bui-typography-body-lg-regular-letter-spacing);font-variant-numeric:tabular-nums}._9b1tmlh{height:20px}._9b1tmli{height:24px}._9b1tmlk{color:var(--bui-color-text-primary)}._9b1tmll,._9b1tmlm{color:var(--bui-color-text-inverse)}._9b1tmln{color:var(--bui-color-text-disabled)}@layer base;._1jwycy80{width:0;height:0;border-right:7px solid transparent;border-bottom:8px solid;border-left:7px solid transparent;position:absolute}._1jwycy81{transform:translate(-50%,-7px)}._1jwycy82{transform:translate(10px,-50%) rotate(90deg);right:0}._1jwycy83{transform:translate(-10px,-50%) rotate(270deg);left:0}._1jwycy84{transform:translate(-50%,7px) rotate(180deg);bottom:0}._1jwycy85{border-bottom-color:var(--bui-color-background-inverse-strong)}._1jwycy86{border-bottom-color:var(--bui-color-background-primary-subtle)}@layer base{._1jwycy87{max-inline-size:35ch}}@keyframes _1azy5683{0%{stroke-dasharray:1px calc(var(--_1azy5680) - 1px);stroke-dashoffset:0}50%{stroke-dasharray:calc(var(--_1azy5680) * .75) calc(var(--_1azy5680) * .25);stroke-dashoffset:calc(var(--_1azy5680) * -.25)}to{stroke-dasharray:1px calc(var(--_1azy5680) - 1px);stroke-dashoffset:calc(-1 * var(--_1azy5680))}}@keyframes _1azy5684{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._1azy5681{gap:var(--bui-spacing-md);align-items:center}._1azy5682{display:flex;align-items:center}._1azy5685{fill:none;stroke-width:3;stroke:var(--bui-color-interactive-primary);transform-origin:center;animation:1.5s ease-in-out infinite _1azy5683,2s linear infinite _1azy5684}._1azy5686{position:absolute;fill:none;stroke-width:3;stroke:var(--bui-color-border-medium)}._1azy5687{color:var(--bui-color-support-success-medium)}._1azy5688{color:var(--bui-color-support-error-medium)}._1azy5689{color:var(--bui-color-text-secondary);font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}._5uw3kp0{background-color:var(--bui-color-background-primary-subtle);border-radius:0;align-items:center;gap:var(--bui-spacing-md);color:var(--bui-color-text-primary);outline:none;cursor:pointer}._5uw3kp0:active,._5uw3kp1{background-color:var(--bui-color-background-primary-medium)}._5uw3kp2{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}._5uw3kp3{color:var(--bui-color-text-disabled);cursor:not-allowed}._5uw3kp4{color:var(--bui-color-text-inverse);background-color:var(--bui-color-interactive-primary)}._5uw3kp5{min-height:40px;font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing);padding:var(--bui-spacing-md) var(--bui-spacing-lg)}._5uw3kp6{min-height:48px;font:var(--bui-typography-label-lg-medium-font);letter-spacing:var(--bui-typography-label-lg-medium-letter-spacing);padding:var(--bui-spacing-lg)}._5uw3kp7{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary),inset 0 0 0 3px var(--bui-color-focused-inset)}._16vugd04{border:none;background-color:var(--_16vugd00)}._16vugd05{--_16vugd00: var(--bui-color-icon-primary);border-radius:var(--bui-rounded-xs);border:1px solid var(--_16vugd00);height:16px;width:16px;color:var(--bui-color-icon-inverse);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s ease-in-out}._16vugd08{box-shadow:0 0 0 1px var(--bui-color-focused-inset),0 0 0 3px var(--bui-color-focused-primary)}._16vugd09{--_16vugd00: var(--bui-color-icon-interactive)}._16vugd0a{--_16vugd00: var(--bui-color-icon-disabled);cursor:not-allowed;pointer-events:none}._16vugd0b{--_16vugd00: var(--bui-color-icon-disabled);cursor:not-allowed;pointer-events:none;color:var(--bui-color-icon-primary);border:1px solid var(--bui-color-icon-disabled);background-color:transparent}._16vugd0c{border:1px solid var(--bui-color-support-error-medium)}._16vugd0d{border:none}._16vugd0e{color:var(--bui-color-text-secondary);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._16vugd0f{color:var(--bui-color-text-disabled)}._1nsi9h10{display:inline-flex;flex-direction:row;align-items:center;border-radius:var(--bui-rounded-sm);background-color:var(--bui-color-background-primary-subtle);font:var(--bui-typography-label-lg-medium-font);letter-spacing:var(--bui-typography-label-lg-medium-letter-spacing)}._1nsi9h11{height:24px;border-radius:var(--bui-rounded-xs);font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}._1nsi9h12{height:32px;font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._1nsi9h13{height:40px}._1nsi9h14{height:48px}._1nsi9h15{box-shadow:var(--bui-elevation-medium);border:1px solid var(--bui-color-border-subtle)}._1nsi9h16{width:250px}._1nsi9h17{padding:0 var(--bui-spacing-md);display:flex;gap:var(--bui-spacing-sm);height:inherit;align-items:center}._1nsi9h18{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}._1nsi9h19{justify-content:center;flex:1}._1nsi9h1b{border:none;outline:none;font:inherit;line-height:inherit;font-variant-numeric:tabular-nums;background-color:transparent;color:var(--bui-color-text-primary)}._1nsi9h1c{color:var(--bui-color-text-placeholder)}@layer base;@layer variants;@layer compoundVariants;._1f789qj0{display:flex;gap:var(--bui-spacing-md)}._1f789qjj{display:flex;align-items:center;gap:var(--bui-spacing-sm)}._1f789qjk{all:unset;display:inline-flex;padding:var(--bui-spacing-sm);border-radius:var(--bui-rounded-full);cursor:pointer;transition:background-color .2s ease-in-out}._1f789qjr{background-color:var(--bui-color-background-secondary-subtle)}._1f789qjs{background-color:var(--bui-color-support-error-subtler)}._1f789qjt{background-color:var(--bui-color-support-info-subtler)}._1f789qju{background-color:var(--bui-color-support-success-subtler)}._1f789qjv{background-color:var(--bui-color-background-inverse-medium)}@layer base{._1f789qj1{padding:var(--bui-spacing-sm) var(--bui-spacing-md);border-radius:24px;width:fit-content;transition:background-color .2s ease-in-out;outline:none;font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}}@layer variants{._1f789qj2{outline:2px solid var(--bui-color-focused-primary);outline-offset:1px}._1f789qj3{color:var(--bui-color-text-primary);background-color:var(--bui-color-background-secondary-medium)}._1f789qj4{color:var(--bui-color-support-error-strong);background-color:var(--bui-color-support-error-subtle)}._1f789qj5{color:var(--bui-color-support-success-strong);background-color:var(--bui-color-support-success-subtle)}._1f789qj6{color:var(--bui-color-support-info-strong);background-color:var(--bui-color-support-info-subtle)}._1f789qj7{color:var(--bui-color-text-inverse);background-color:var(--bui-color-background-inverse-strong)}._1f789qj8{color:var(--bui-color-text-disabled);background-color:var(--bui-color-background-secondary-subtle);cursor:not-allowed}._1f789qj9{padding:var(--bui-spacing-xs);padding-left:var(--bui-spacing-md)}._1f789qja{color:var(--bui-color-text-inverse);background-color:var(--bui-color-interactive-primary)}._1f789qjb{cursor:pointer}}@layer compoundVariants{._1f789qjd{background-color:var(--bui-color-background-secondary-subtle)}._1f789qje{background-color:var(--bui-color-support-error-subtler)}._1f789qjf{background-color:var(--bui-color-support-info-subtler)}._1f789qjg{background-color:var(--bui-color-support-success-subtler)}._1f789qjh{background-color:var(--bui-color-background-inverse-medium)}._1f789qji{background-color:var(--bui-color-interactive-hovered)}}@layer reset;._1kvz17d1{transform:rotate(90deg)}._1kvz17d2{cursor:pointer;box-shadow:inset 0 1px 0 var(--bui-color-border-medium);outline:none;height:40px}._1kvz17d3{outline-offset:-2px;outline:2px solid var(--bui-color-focused-primary)}._1kvz17dc{opacity:0}._1kvz17dd{opacity:1}@layer reset{._1kvz17da{all:unset}}._1017q4c0{border-radius:var(--bui-rounded-full);color:var(--bui-color-icon-inverse);display:flex;position:relative;align-items:center;justify-content:center;background-color:var(--bui-color-icon-secondary);font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}._1017q4c1{height:24px;width:24px}._1017q4c2{height:16px;width:16px}._1017q4c3{opacity:var(--bui-opacity-medium)}._1017q4c4{height:100%;width:100%;border-radius:var(--bui-rounded-full);overflow:hidden;object-fit:cover}._1017q4c5{position:absolute;height:12px;width:12px;background-color:var(--bui-color-support-error-medium);border:2px solid var(--bui-color-border-subtle);border-radius:var(--bui-rounded-full);bottom:-4px;right:-4px}@layer base;@layer variants;@layer compoundVariants;._1x62fhbf{border-left:1px solid var(--bui-color-border-medium);flex-shrink:0}._1x62fhbf:first-of-type{border-left:none}@layer base{._1x62fhb0{overflow-x:auto;height:40px}._1x62fhb6{text-wrap:nowrap}}@layer variants{._1x62fhb9{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}._1x62fhba{pointer-events:none;cursor:not-allowed}._1x62fhbb{border-right:1px solid var(--bui-color-border-medium)}}@layer compoundVariants{._1x62fhbd{box-shadow:inset 0 -2px 0 0 var(--bui-color-interactive-primary)}._1x62fhbe{box-shadow:inset 0 -2px 0 0 var(--bui-color-interactive-disabled)}}.kfun6y0{width:100%;padding:0 var(--bui-spacing-lg);gap:var(--bui-spacing-lg);padding-right:0}.kfun6y1{background-color:var(--bui-color-support-info-subtler)}.kfun6y2{background-color:var(--bui-color-support-warning-subtler)}.kfun6y3{background-color:var(--bui-color-support-error-subtler)}.kfun6y4{background-color:var(--bui-color-support-success-subtler)}.kfun6y5{min-height:44px;justify-content:space-between;align-items:center}.kfun6y6{justify-content:space-between}.kfun6y7{padding:var(--bui-spacing-lg);width:240px;flex-direction:column-reverse;gap:0}.kfun6ya,.kfun6yb{padding:var(--bui-spacing-lg)}.kfun6yc{padding-top:0;padding-right:0}.kfun6yd{gap:var(--bui-spacing-lg)}.kfun6ye{align-items:center}.kfun6yf{margin:var(--bui-spacing-lg) 0}.kfun6yg{flex-direction:column}.kfun6yh{color:var(--bui-color-text-primary)}.kfun6yi{font:var(--bui-typography-body-sm-semibold-font);letter-spacing:var(--bui-typography-body-sm-semibold-letter-spacing)}.kfun6yj{font:var(--bui-typography-body-md-semibold-font);letter-spacing:var(--bui-typography-body-md-semibold-letter-spacing)}.kfun6yk{flex-shrink:0}.kfun6yl{color:var(--bui-color-support-info-medium)}.kfun6ym{color:var(--bui-color-support-warning-medium)}.kfun6yn{color:var(--bui-color-support-error-medium)}.kfun6yo{color:var(--bui-color-support-success-medium)}.kfun6yp{padding:var(--bui-spacing-sm) 0;display:flex;align-items:center}.kfun6yr{align-items:flex-start}.kfun6ys{padding:0;align-self:flex-end}.kfun6yt{color:var(--bui-color-text-primary)}.kfun6yu{font:var(--bui-typography-body-sm-regular-font);letter-spacing:var(--bui-typography-body-sm-regular-letter-spacing)}.kfun6yv{font:var(--bui-typography-body-md-regular-font);letter-spacing:var(--bui-typography-body-md-regular-letter-spacing)}.kfun6yw{display:flex;flex-direction:row;gap:0}.kfun6yx{gap:var(--bui-spacing-sm)}.kfun6yy,.kfun6yz{flex-direction:column}@layer variants;@layer variants;@layer base;.siobe23{min-height:48px}@layer base{.siobe20{max-height:80vh;overflow:hidden}}@layer base;@layer variants;@layer base{.aml2vl0{position:fixed;inset:0;z-index:1000}}@layer variants{.aml2vl2{align-items:flex-end}}@layer base;@layer variants;@layer base{.cjv3et0{outline:none;overflow:hidden;width:calc(100vw - 2 * var(--bui-spacing-xl))}@media screen and (min-width: 768px){.cjv3et0{width:calc(100vw - 2 * var(--bui-spacing-2-xl))}}@media screen and (min-width: 1280px){.cjv3et0{width:100vw}}}@layer variants{.cjv3et1{max-width:240px}.cjv3et2{max-width:480px}.cjv3et3{max-width:720px}.cjv3et4{width:unset}.cjv3et7{max-width:100vw}}@keyframes _1dbkl515{0%{transform:translate(0)}20%{transform:translate(-2px)}40%{transform:translate(2px)}60%{transform:translate(-2px)}80%{transform:translate(2px)}to{transform:translate(0)}}@layer variants;@layer base;@layer reset;._1dbkl53{height:120px;border-top-left-radius:var(--bui-rounded-sm);border-top-right-radius:var(--bui-rounded-sm)}._1dbkl5e{width:100%;height:4px}._1dbkl5f{font-variant-numeric:tabular-nums}._1dbkl5g{outline:2px solid var(--bui-color-focused-primary);outline-offset:1px}._1dbkl5n:before{content:"";position:absolute;inset:0;border-radius:var(--bui-rounded-full);border:1px solid var(--bui-color-border-medium);mix-blend-mode:multiply}._1dbkl5o{max-width:240px}._1dbkl5r{min-width:max-content}._1dbkl5s{list-style:none}._1dbkl5t{grid-template-columns:repeat(6,1fr)}._1dbkl5u{height:12px}._1dbkl5v{width:100%}._1dbkl513{margin-inline-start:-1px}._1dbkl513[data-hovered],._1dbkl513[data-focus-visible]{z-index:9}._1dbkl514 .BaselineUI-NumberInput:not(:first-of-type){margin-inline-start:-1px}._1dbkl514 .BaselineUI-NumberInput:not(:first-of-type):not(:last-of-type) .BaselineUI-NumberInput-Container{border-radius:0}._1dbkl514:not(:has(._1dbkl5z)) .BaselineUI-NumberInput:first-of-type .BaselineUI-NumberInput-Container{border-top-right-radius:0;border-bottom-right-radius:0}._1dbkl514 .BaselineUI-NumberInput:last-of-type .BaselineUI-NumberInput-Container{border-top-left-radius:0;border-bottom-left-radius:0}._1dbkl516{animation-name:_1dbkl515;animation-duration:.2s}@layer variants{._1dbkl55{box-shadow:inset 0 0 0 1px var(--bui-color-border-medium)}._1dbkl56{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}._1dbkl58{width:fit-content}._1dbkl5i{box-shadow:0 0 0 4px var(--bui-color-focused-inset),0 0 0 6px var(--bui-color-focused-primary)}._1dbkl5k:before{mix-blend-mode:normal}._1dbkl5x{outline-offset:-2px;border-width:3px}._1dbkl510{box-shadow:inset 0 0 0 1px var(--bui-color-focused-primary);z-index:99}._1dbkl511{z-index:9}}@layer reset{._1dbkl5a{all:unset}}@layer base{._1dbkl54{background-color:transparent}._1dbkl5a{min-width:32px;min-height:32px;box-sizing:border-box}._1dbkl5h{width:16px;height:16px}._1dbkl5p{max-width:240px;max-height:inherit;overflow-y:auto}._1dbkl5w{border-color:var(--bui-color-positive-subtle);width:12px;height:12px;top:6px;box-shadow:0 0 4px #0006;overflow:hidden}._1dbkl5z{background-color:transparent;border-width:1px;height:32px;width:154px}}@layer base;@layer variants;@layer compoundVariants;.mnnh5s0{background:repeating-conic-gradient(transparent 0% 25%,var(--bui-color-background-secondary-medium) 25% 50%);background-size:16px 16px}.mnnh5sa{height:100%;width:100%;object-fit:contain}.mnnh5sd{opacity:.5}@layer base{.mnnh5s1{min-height:100px;overflow:hidden}.mnnh5s1:after{content:"";background-color:transparent}}@layer variants{.mnnh5s2{min-width:208px}.mnnh5s8{pointer-events:none;cursor:not-allowed}}@layer compoundVariants{.mnnh5s9:after{content:"";position:absolute;transition:background-color .2s;inset:0;background:var(--bui-color-background-overlay-medium)}}@layer base;@layer variants;@layer compoundVariants;._1i0ytqa0{display:flex;flex-direction:column;align-items:center}@layer base{._1i0ytqa1{height:40px}._1i0ytqa3{touch-action:none}}@layer variants{._1i0ytqa7{pointer-events:none;cursor:not-allowed}._1i0ytqa8{cursor:crosshair}._1i0ytqad{pointer-events:none;cursor:not-allowed}}@layer compoundVariants{._1i0ytqa9{box-shadow:inset 0 0 0 1px var(--bui-color-focused-primary)}._1i0ytqaa{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}}._1vac7ws0{cursor:move}._1vac7ws1 ._1vac7ws2 .moveable-control,._1vac7ws1 ._1vac7ws2 .moveable-rotation{display:none}@layer base;@layer variants;@layer reset;._1vm2oh49{top:var(--bui-spacing-sm);right:var(--bui-spacing-sm)}@layer base{._1vm2oh40{transition-property:outline-color,background-color}}@layer variants;@layer reset{._1vm2oh48{all:unset}}.cw3m0n3{border-radius:var(--bui-rounded-full);color:var(--bui-color-icon-primary)}.cw3m0n3:hover{color:var(--bui-color-icon-interactive);border-color:var(--bui-color-border-interactive)}.cw3m0n7{width:8px;height:8px;background-color:currentColor;border-radius:var(--bui-rounded-full)}.xvr3wn0{overflow-x:auto}.xvr3wn1{overflow-y:auto}@layer reset;@layer base;@layer variants;@layer compoundVariants;@layer reset{._1j5skr70{all:unset}}@layer base{._1j5skr71{aspect-ratio:1 / 1;height:fit-content}}@layer variants{._1j5skr72{min-height:16px}._1j5skr73{min-height:24px}._1j5skr74{min-height:32px}._1j5skr75{min-height:40px}._1j5skr76{min-height:48px}._1j5skr7b{background-color:var(--bui-color-interactive-disabled)}}@layer compoundVariants{._1j5skr7c{background-color:var(--bui-color-interactive-primary)}._1j5skr7e{outline-offset:-3px}._1j5skr7k{background-color:var(--bui-color-interactive-primary);outline-offset:-3px}}@layer base;@layer variants;@layer reset;.f6jv6b9{height:40px;overflow-x:auto;scrollbar-width:thin}.f6jv6ba{white-space:pre-wrap;word-wrap:break-word;box-sizing:border-box;resize:none;overflow:hidden;z-index:9}.f6jv6ba::placeholder{color:var(--bui-color-text-placeholder);font:var(--bui-typography-body-sm-regular-font);letter-spacing:var(--bui-typography-body-sm-regular-letter-spacing)}.f6jv6ba:disabled{color:var(--bui-color-text-disabled)}.f6jv6be{overflow:scroll;min-height:40px;box-sizing:border-box;padding-block:12px}.f6jv6bi{overflow:auto;min-width:250px}.f6jv6b4 span[data-user-id]{color:var(--bui-color-interactive-primary);cursor:pointer;display:inline-block;background-color:var(--bui-color-background-primary-strong);border-radius:var(--bui-rounded-sm);padding:0 var(--bui-spacing-xs)}.f6jv6b4 a{text-decoration:underline}@layer base{.f6jv6b0[aria-disabled=true]{pointer-events:none;cursor:not-allowed}.f6jv6b4{cursor:text}.f6jv6b6:hover{z-index:9}.f6jv6b6:focus-visible:not([data-mention-open=true]){outline:2px solid var(--bui-color-focused-primary);z-index:9;outline-offset:-1px}.f6jv6bb:has([data-focused]){outline:2px solid var(--bui-color-focused-primary);outline-offset:-1px}.f6jv6bf{min-height:48px}}@layer variants{.f6jv6b5{pointer-events:none;cursor:not-allowed}.f6jv6b7:hover:not(:focus){outline:1px solid var(--bui-color-border-strong)}.f6jv6b8:hover:not(:focus){box-shadow:0 -1px 1px -1px var(--bui-color-border-strong),0 1px 1px -1px var(--bui-color-border-strong)}}@layer reset{.f6jv6ba{all:unset}}@layer reset;@layer variants;._8kqf970{height:fit-content;bottom:var(--bui-spacing-lg);margin-left:50%;text-align:center;white-space:nowrap;position:absolute}@layer reset{._8kqf970{all:unset}}@layer variants{._8kqf970{overflow:unset}}._1v0p2z10{min-height:48px}@keyframes _1t55bp72{0%{opacity:0}}._1t55bp70 a{color:var(--bui-color-interactive-primary)}._1t55bp71>:not(ol,ul,pre):last-child:after,._1t55bp71>pre:last-child code:after,._1t55bp71>:is(ul,ol):last-child>li:last-child:not(:has(*>li)):after{content:"\2502";animation:_1t55bp72 1s infinite steps(2);color:var(--bui-color-interactive-primary)}.rta2n90 .BaselineUI-Slider-Thumb{transition:background-color .2s ease-in;margin-top:1.5px;background-color:transparent;width:12px;height:12px}.rta2n90:hover .BaselineUI-Slider-Thumb,.rta2n90:focus-within .BaselineUI-Slider-Thumb{background-color:var(--bui-color-interactive-primary)}.rta2n90:not(:hover):not(:focus-within) .BaselineUI-Slider-Thumb{background-color:transparent}.rta2n90 .BaselineUI-Slider-Track{height:4px;border-radius:0}.rta2n90 .BaselineUI-Slider-TrackHighlight{height:100%;border-radius:0;background-color:var(--bui-color-interactive-primary)}.rta2n91{font-variant-numeric:tabular-nums}
10
+ @layer reset;.z9nup81{display:flex;flex-direction:column}.z9nup82{display:flex;flex-direction:row}.z9nup83{pointer-events:none;cursor:not-allowed}.z9nup84{background-image:repeating-conic-gradient(transparent 0% 25%,var(--bui-color-background-secondary-medium) 25% 50%)}.z9nup85{background-size:4px 4px}.z9nup86{background-size:6px 6px}@layer reset{.z9nup80{display:contents}.z9nup87{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@layer base;@layer variants;._6n12k90{list-style:none}@layer base{._6n12k91{list-style:none;height:36px}._6n12k9a{list-style:none;transition-property:outline-color;z-index:9}}@layer variants{._6n12k95{border-top-width:1px}._6n12k96{border-bottom-width:1px}}@layer base;@layer variants;@layer base{.gukncs0{background-color:var(--bui-color-border-subtle);width:100%;height:1px;flex-shrink:0}}@layer variants{.gukncs1{width:1px;height:100%}.gukncs2{background-color:var(--bui-color-border-medium)}}@layer reset;@layer variants;.uf19bsg{transition-property:rotate}.uf19bse[aria-expanded=true] .uf19bsg{rotate:180deg}@layer reset{.uf19bs0{all:unset;height:fit-content}}@layer variants{.uf19bs1{min-height:16px;min-width:16px}.uf19bs2{min-height:24px;min-width:24px}.uf19bs3{min-height:32px;min-width:32px}.uf19bs4{min-height:40px;min-width:40px}.uf19bs5{min-height:48px;min-width:48px}.uf19bs7{cursor:not-allowed}.uf19bs8{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}.uf19bse{min-height:unset;width:fit-content;min-width:unset}.uf19bse[aria-expanded=true]{outline:1px solid var(--bui-color-border-medium);outline-offset:-1px}}@layer base;@layer variants;@layer compoundVariants;.oom8bs0 svg{pointer-events:none}.oom8bs5[aria-expanded=true] .uf19bsg{rotate:180deg}@layer base{.oom8bs0{border:none;transition-property:all;width:fit-content;white-space:nowrap;box-sizing:border-box}}@layer variants{.oom8bs1{background-color:var(--bui-color-interactive-primary);color:var(--bui-color-text-inverse)}.oom8bs1:disabled{background-color:var(--bui-color-interactive-disabled)}.oom8bs2{box-shadow:inset 0 0 0 1px var(--bui-color-border-medium);background-color:var(--bui-color-background-secondary-subtle);color:var(--bui-color-text-primary)}.oom8bs2:disabled{color:var(--bui-color-text-disabled)}.oom8bs3{background-color:transparent;box-shadow:inset 0 0 0 1px var(--bui-color-interactive-primary);color:var(--bui-color-interactive-primary)}.oom8bs3:disabled{box-shadow:inset 0 0 0 1px var(--bui-color-interactive-disabled);color:var(--bui-color-interactive-disabled)}.oom8bs4{background-color:transparent;color:var(--bui-color-interactive-primary)}.oom8bs4:disabled{color:var(--bui-color-interactive-disabled)}.oom8bs5{background-color:transparent;color:var(--bui-color-text-primary);transition-property:none}.oom8bs5:disabled{color:var(--bui-color-text-disabled)}.oom8bs5[aria-expanded=true]{outline:1px solid var(--bui-color-border-medium);outline-offset:-1px}.oom8bs6{cursor:not-allowed}.oom8bs7{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}.oom8bs9{min-height:32px;padding:var(--bui-spacing-md)}.oom8bsa{min-height:40px;padding:var(--bui-spacing-md) var(--bui-spacing-lg)}}@layer compoundVariants{.oom8bsb{background-color:var(--bui-color-interactive-hovered)}.oom8bsc{background-color:var(--bui-color-background-secondary-medium)}.oom8bsd{background-color:var(--bui-color-interactive-primary);color:var(--bui-color-text-inverse)}.oom8bse{outline:1px solid var(--bui-color-border-medium);outline-offset:-1px}.oom8bsf{color:var(--bui-color-interactive-hovered)}.oom8bsg{border:none;box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary),inset 0 0 0 3px var(--bui-color-focused-inset)}.oom8bsh{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary),inset 0 0 0 3px var(--bui-color-focused-inset);background-color:var(--bui-color-interactive-primary);color:var(--bui-color-text-inverse)}}._14uvjig0{width:100%}._14uvjig1{background-color:var(--bui-color-background-inverse-strong)}._14uvjig2{background-color:var(--bui-color-interactive-primary)}._14uvjig3{display:flex;justify-content:space-between;align-items:center}._14uvjig4{font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing);color:var(--bui-color-text-secondary)}._14uvjig5{color:var(--bui-color-text-disabled)}._14uvjig6{padding-bottom:var(--bui-spacing-md)}._14uvjig7{display:flex;height:24px;align-items:center;gap:var(--bui-spacing-md)}._14uvjig8{height:2px;background-color:var(--bui-color-background-primary-strong);width:100%}._14uvjig9{position:absolute;height:100%}._14uvjigb{transition:width .2s}._14uvjigc{background-color:var(--bui-color-interactive-disabled)}._14uvjige{height:8px;width:8px;border-radius:50%;margin-top:1px;cursor:pointer;transition-property:height,width;transition-duration:.2s}._14uvjigf{height:12px;width:12px;border:0;outline:0}._14uvjigg{background-color:var(--bui-color-interactive-disabled);cursor:not-allowed}._14uvjigh{display:none}._14uvjigi{box-shadow:0 0 0 1px var(--bui-color-focused-inset),0 0 0 3px var(--bui-color-interactive-primary);transition-property:left;transition-duration:.2s}._14uvjigj{height:12px;width:12px}.nrh1eh0{width:100%}.nrh1eh2{justify-content:space-between;gap:var(--bui-spacing-md)}.nrh1eh3{font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing);color:var(--bui-color-text-secondary)}.nrh1eh4{display:inline-flex}.nrh1eh5{margin-bottom:var(--bui-spacing-md)}.nrh1eh6{padding-top:0;flex-direction:column}.nrh1eh8{justify-content:center}.nrh1eh9{border:1px solid var(--bui-color-border-medium);border-radius:var(--bui-rounded-xs);overflow:hidden;align-items:center;height:32px}.nrh1ehb{border-color:var(--bui-color-support-error-medium)}.nrh1ehe{border-radius:var(--bui-rounded-xs);border:1px solid var(--bui-color-focused-primary);outline:1px solid var(--bui-color-focused-primary);outline-offset:-2px}.nrh1ehf{cursor:not-allowed}.nrh1ehi{border-radius:0;outline:none}.nrh1ehj{border:1px solid var(--bui-color-border-medium)}.nrh1ehk{border-color:transparent}.nrh1ehl,.nrh1ehm{border-color:var(--bui-color-border-strong)}.nrh1ehn{border-color:transparent;border-bottom:1px solid var(--bui-color-border-medium)}.nrh1eho{color:var(--bui-color-text-primary);width:100%;background-color:transparent;padding:var(--bui-spacing-md);border:none;outline:none;height:inherit;text-align:inherit;font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}.nrh1eho::placeholder{color:var(--bui-color-text-placeholder)}.nrh1ehp{cursor:inherit;color:var(--bui-color-text-disabled)}.nrh1ehp::placeholder{color:var(--bui-color-text-disabled)}.nrh1ehr{text-align:right}.nrh1ehs{margin-right:var(--bui-spacing-md);display:inline-flex;flex-shrink:0}.nrh1ehu{color:var(--bui-color-support-error-medium)}.nrh1ehv{color:var(--bui-color-support-warning-medium)}.nrh1ehw{color:var(--bui-color-icon-primary)}.nrh1ehx{color:var(--bui-color-text-helper);padding-top:var(--bui-spacing-sm);font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}.nrh1ehy{color:var(--bui-color-text-disabled)}.nrh1ehz{color:var(--bui-color-support-error-medium)}.nrh1eh10{width:max-content;max-width:100px}._1lnwne0{max-width:140px}._1lnwne1{display:flex;align-items:center;gap:var(--bui-spacing-sm);padding:0 var(--bui-spacing-sm);height:inherit;transition:background-color .2s ease-in}._1lnwne4{background-color:var(--bui-color-background-primary-medium)}.bpklwa0{display:inline-flex}.bpklwa1{flex-direction:column;gap:var(--bui-spacing-md);width:fit-content}.bpklwa2{flex-direction:row;justify-content:space-between;align-items:center;width:100%}.bpklwa3{display:inline-flex;flex-direction:row;gap:var(--bui-spacing-md);align-items:center}.bpklwa4{flex-direction:row-reverse}.bpklwa6{color:var(--bui-color-text-primary);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}.bpklwa7{border-radius:9px;width:36px;height:18px;background-color:var(--bui-color-background-inverse-subtle);padding:2px;box-sizing:border-box;cursor:pointer}.bpklwa8{border:1px solid var(--bui-color-icon-disabled);padding:1px;background-color:transparent;cursor:default}.bpklwa9{background-color:var(--bui-color-background-secondary-medium);cursor:not-allowed}.bpklwab{outline-offset:1px;outline:var(--bui-color-focused-primary) 2px solid}.bpklwac{background-color:var(--bui-color-icon-interactive)}.bpklwad{color:var(--bui-color-text-secondary);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}.bpklwae{width:14px;height:14px;background-color:var(--bui-color-icon-inverse);border-radius:var(--bui-rounded-full);transition:transform .2s}.bpklwaf{background-color:var(--bui-color-icon-disabled)}.bpklwag{transform:translate(18px)}.bpklwah{background-color:var(--bui-color-icon-primary)}._19n40yy0{display:flex;align-items:center;position:relative;flex-direction:row;padding:0 var(--bui-spacing-md);gap:var(--bui-spacing-md);background-color:var(--bui-color-background-primary-subtle);border-radius:var(--bui-rounded-xs);border:1px solid transparent;color:var(--bui-color-icon-primary);width:100%;font:var(--bui-typography-body-md-regular-font);letter-spacing:var(--bui-typography-body-md-regular-letter-spacing)}._19n40yy1{height:48px}._19n40yy2{height:40px}._19n40yy3{height:32px;font:var(--bui-typography-body-sm-regular-font);letter-spacing:var(--bui-typography-body-sm-regular-letter-spacing)}._19n40yy4{border-color:var(--bui-color-border-medium)}._19n40yy6{border-color:transparent;box-shadow:0 0 0 2px var(--bui-color-focused-primary)}._19n40yy7{padding-right:0}._19n40yy8{color:var(--bui-color-text-disabled);cursor:not-allowed}._19n40yy9{border:none;outline:none;background-color:transparent;font:inherit;display:flex;cursor:inherit;flex:1;color:var(--bui-color-text-primary)}._19n40yy9::placeholder{font:inherit;color:var(--bui-color-text-placeholder)}._19n40yy9::-webkit-search-cancel-button{-webkit-appearance:none}._19n40yy9::-webkit-search-decoration{-webkit-appearance:none}._1mdhlqv1{cursor:pointer;background-color:transparent}._1mdhlqv2{outline:none}._1mdhlqv4{transition:transform .2s ease-in-out}._1mdhlqv5{transform:rotate(180deg)}._1mdhlqv6{flex:1}._1mdhlqv7{overflow:hidden}._1mdhlqv8{width:var(--_1mdhlqv0);min-width:64px;overflow:hidden;outline:1px solid var(--bui-color-border-subtle);outline-offset:-1px;position:relative;overflow-y:auto;max-height:inherit}._1mdhlqv8 .BaselineUI-ListBox-Section{padding-block:var(--bui-spacing-md)}._1mdhlqv8.BaselineUI-ListBox:not(:has(.BaselineUI-ListBox-Section)){padding-block:var(--bui-spacing-md)}@layer base;._1gzftth2{transform:rotate(180deg) translate(-50%,8px);transform-origin:left}._1gzftth3{bottom:0;transform:translate(-50%,8px)}._1gzftth4{transform:rotate(90deg) translate(-50%,11px)}._1gzftth5{right:0;transform:rotate(-90deg) translate(50%,11px);transform-origin:center}._1gzftth6{overflow-y:auto;max-height:inherit;display:flex;flex:1}@layer base{._1gzftth1{min-width:max-content}._1gzftth1[data-placement=top],._1gzftth1[data-placement=bottom]{width:var(--_1gzftth0)}}.xyd2ss0{list-style:none}.xyd2ss1{list-style:none;overflow-y:auto;max-height:inherit;min-width:150px;width:fit-content}.xyd2ss1:not(:has(.xyd2ss0)){padding-block:var(--bui-spacing-md)}._13f0naj0{cursor:pointer;color:var(--bui-color-interactive-primary);transition:color .2s;outline:none}._13f0naj0:visited:not([aria-disabled=true]){color:var(--bui-color-interactive-visited)}._13f0naj1{text-decoration:none}._13f0naj2{text-decoration:underline}._13f0naj3{color:var(--bui-color-interactive-hovered)}._13f0naj4{outline:2px solid var(--bui-color-focused-primary)}._13f0naj5{color:var(--bui-color-text-disabled);cursor:not-allowed}._13f0najc{color:var(--bui-color-text-primary);outline:2px solid var(--bui-color-focused-primary)}._13f0najd{font:var(--bui-typography-body-sm-regular-font);letter-spacing:var(--bui-typography-body-sm-regular-letter-spacing)}._13f0naje{font:var(--bui-typography-body-md-regular-font);letter-spacing:var(--bui-typography-body-md-regular-letter-spacing)}._13f0najf{font:var(--bui-typography-body-lg-regular-font);letter-spacing:var(--bui-typography-body-lg-regular-letter-spacing)}._13f0najg{font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}._13f0najh{font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._13f0naji{font:var(--bui-typography-label-lg-medium-font);letter-spacing:var(--bui-typography-label-lg-medium-letter-spacing)}._180w5ed0{text-align:center;height:100px;display:flex;justify-content:center;align-items:center;flex-direction:column;cursor:pointer;padding:var(--bui-spacing-xl);gap:var(--bui-spacing-md)}._180w5ed1{width:100%;background-color:var(--bui-color-background-secondary-subtle)}._180w5ed2{border:1px dashed var(--bui-color-border-medium);border-radius:var(--bui-rounded-sm)}._180w5ed3{outline:none}._180w5ed4{pointer-events:none;background-color:unset}._180w5ed5{border-color:var(--bui-color-border-interactive)}._180w5ed6{border:2px solid var(--bui-color-border-interactive)}._180w5ed7{border:1px solid var(--bui-color-border-disabled)}._180w5ed8{border:1px dashed var(--bui-color-border-disabled)}._180w5ed9{color:var(--bui-color-icon-secondary)}._180w5eda{color:var(--bui-color-icon-disabled)}._180w5edb{cursor:inherit;color:var(--bui-color-interactive-primary);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._180w5edc{color:var(--bui-color-text-disabled)}._180w5edd{text-decoration:underline}._180w5ede{color:var(--bui-color-text-helper);font:var(--bui-typography-label-md-regular-font);letter-spacing:var(--bui-typography-label-md-regular-letter-spacing)}._180w5edf{color:var(--bui-color-text-disabled)}._12vfhl40{width:100%}._12vfhl41{justify-content:space-between}._12vfhl42{color:var(--bui-color-text-secondary);padding-bottom:var(--bui-spacing-sm);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._12vfhl43{color:var(--bui-color-text-primary)}._12vfhl44{padding-bottom:0}._12vfhl45{padding:var(--bui-spacing-md) 0}._12vfhl46{height:16px;align-items:center;gap:var(--bui-spacing-md)}._12vfhl47{height:4px;background-color:var(--bui-color-background-primary-strong);width:100%}._12vfhl48{height:4px}._12vfhl49{background-color:var(--bui-color-support-success-medium)}._12vfhl4a{background-color:var(--bui-color-support-error-medium)}._12vfhl4b{background-color:var(--bui-color-support-info-medium)}._9b1tml0{display:inline-flex;flex-direction:row;align-self:flex-start;padding:var(--bui-spacing-xs);gap:var(--bui-spacing-xs);border-radius:var(--bui-rounded-sm);align-items:center;cursor:pointer;transition:background-color .2s ease;outline:none;border:none;background-color:var(--bui-color-background-secondary-subtle)}._9b1tml1{background-color:var(--bui-color-icon-interactive)}._9b1tml2{background-color:var(--bui-color-background-secondary-subtle)}._9b1tml5{outline:2px solid var(--bui-color-focused-primary)}._9b1tml6{cursor:default;box-shadow:inset 0 0 0 1px var(--bui-color-icon-disabled);background-color:var(--bui-color-background-primary-subtle)}._9b1tml7{padding:1px;border:1px solid var(--bui-color-focused-inset)}._9b1tml8{background-color:var(--bui-color-interactive-hovered)}._9b1tml9{background-color:var(--bui-color-background-secondary-medium)}._9b1tmla{background-color:var(--bui-color-interactive-disabled);color:var(--bui-color-text-inverse)}._9b1tmlb{background-color:var(--bui-color-interactive-disabled);box-shadow:inset 0 0 0 1px var(--bui-color-border-inverse)}._9b1tmlc{padding:var(--bui-spacing-xs);background-color:var(--bui-color-background-primary-subtle);color:var(--bui-color-icon-primary);border-radius:var(--bui-rounded-xs);display:flex}._9b1tmld{color:var(--bui-color-icon-disabled)}._9b1tmle{color:var(--bui-color-icon-inverse);background-color:var(--bui-color-icon-primary)}._9b1tmlf{display:flex;align-items:center;padding:0 var(--bui-spacing-md);color:var(--bui-color-text-primary);transition:color .2s ease;font:var(--bui-typography-body-lg-regular-font);letter-spacing:var(--bui-typography-body-lg-regular-letter-spacing);font-variant-numeric:tabular-nums}._9b1tmlh{height:20px}._9b1tmli{height:24px}._9b1tmlk{color:var(--bui-color-text-primary)}._9b1tmll,._9b1tmlm{color:var(--bui-color-text-inverse)}._9b1tmln{color:var(--bui-color-text-disabled)}@layer base;._1jwycy80{width:0;height:0;border-right:7px solid transparent;border-bottom:8px solid;border-left:7px solid transparent;position:absolute}._1jwycy81{transform:translate(-50%,-7px)}._1jwycy82{transform:translate(10px,-50%) rotate(90deg);right:0}._1jwycy83{transform:translate(-10px,-50%) rotate(270deg);left:0}._1jwycy84{transform:translate(-50%,7px) rotate(180deg);bottom:0}._1jwycy85{border-bottom-color:var(--bui-color-background-inverse-strong)}._1jwycy86{border-bottom-color:var(--bui-color-background-primary-subtle)}@layer base{._1jwycy87{max-inline-size:35ch}}@keyframes _1azy5683{0%{stroke-dasharray:1px calc(var(--_1azy5680) - 1px);stroke-dashoffset:0}50%{stroke-dasharray:calc(var(--_1azy5680) * .75) calc(var(--_1azy5680) * .25);stroke-dashoffset:calc(var(--_1azy5680) * -.25)}to{stroke-dasharray:1px calc(var(--_1azy5680) - 1px);stroke-dashoffset:calc(-1 * var(--_1azy5680))}}@keyframes _1azy5684{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._1azy5681{gap:var(--bui-spacing-md);align-items:center}._1azy5682{display:flex;align-items:center}._1azy5685{fill:none;stroke-width:3;stroke:var(--bui-color-interactive-primary);transform-origin:center;animation:1.5s ease-in-out infinite _1azy5683,2s linear infinite _1azy5684}._1azy5686{position:absolute;fill:none;stroke-width:3;stroke:var(--bui-color-border-medium)}._1azy5687{color:var(--bui-color-support-success-medium)}._1azy5688{color:var(--bui-color-support-error-medium)}._1azy5689{color:var(--bui-color-text-secondary);font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}._5uw3kp0{background-color:var(--bui-color-background-primary-subtle);border-radius:0;align-items:center;gap:var(--bui-spacing-md);color:var(--bui-color-text-primary);outline:none;cursor:pointer}._5uw3kp0:active,._5uw3kp1{background-color:var(--bui-color-background-primary-medium)}._5uw3kp2{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}._5uw3kp3{color:var(--bui-color-text-disabled);cursor:not-allowed}._5uw3kp4{color:var(--bui-color-text-inverse);background-color:var(--bui-color-interactive-primary)}._5uw3kp5{min-height:40px;font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing);padding:var(--bui-spacing-md) var(--bui-spacing-lg)}._5uw3kp6{min-height:48px;font:var(--bui-typography-label-lg-medium-font);letter-spacing:var(--bui-typography-label-lg-medium-letter-spacing);padding:var(--bui-spacing-lg)}._5uw3kp7{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary),inset 0 0 0 3px var(--bui-color-focused-inset)}._16vugd04{border:none;background-color:var(--_16vugd00)}._16vugd05{--_16vugd00: var(--bui-color-icon-primary);border-radius:var(--bui-rounded-xs);border:1px solid var(--_16vugd00);height:16px;width:16px;color:var(--bui-color-icon-inverse);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s ease-in-out}._16vugd08{box-shadow:0 0 0 1px var(--bui-color-focused-inset),0 0 0 3px var(--bui-color-focused-primary)}._16vugd09{--_16vugd00: var(--bui-color-icon-interactive)}._16vugd0a{--_16vugd00: var(--bui-color-icon-disabled);cursor:not-allowed;pointer-events:none}._16vugd0b{--_16vugd00: var(--bui-color-icon-disabled);cursor:not-allowed;pointer-events:none;color:var(--bui-color-icon-primary);border:1px solid var(--bui-color-icon-disabled);background-color:transparent}._16vugd0c{border:1px solid var(--bui-color-support-error-medium)}._16vugd0d{border:none}._16vugd0e{color:var(--bui-color-text-secondary);font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._16vugd0f{color:var(--bui-color-text-disabled)}._1nsi9h10{display:inline-flex;flex-direction:row;align-items:center;border-radius:var(--bui-rounded-sm);background-color:var(--bui-color-background-primary-subtle);font:var(--bui-typography-label-lg-medium-font);letter-spacing:var(--bui-typography-label-lg-medium-letter-spacing)}._1nsi9h11{height:24px;border-radius:var(--bui-rounded-xs);font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}._1nsi9h12{height:32px;font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}._1nsi9h13{height:40px}._1nsi9h14{height:48px}._1nsi9h15{box-shadow:var(--bui-elevation-medium);border:1px solid var(--bui-color-border-subtle)}._1nsi9h16{width:250px}._1nsi9h17{padding:0 var(--bui-spacing-md);display:flex;gap:var(--bui-spacing-sm);height:inherit;align-items:center}._1nsi9h18{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}._1nsi9h19{justify-content:center;flex:1}._1nsi9h1b{border:none;outline:none;font:inherit;line-height:inherit;font-variant-numeric:tabular-nums;background-color:transparent;color:var(--bui-color-text-primary)}._1nsi9h1c{color:var(--bui-color-text-placeholder)}@layer base;@layer variants;@layer compoundVariants;._1f789qj0{display:flex;gap:var(--bui-spacing-md)}._1f789qjj{display:flex;align-items:center;gap:var(--bui-spacing-sm)}._1f789qjk{all:unset;display:inline-flex;padding:var(--bui-spacing-sm);border-radius:var(--bui-rounded-full);cursor:pointer;transition:background-color .2s ease-in-out}._1f789qjr{background-color:var(--bui-color-background-secondary-subtle)}._1f789qjs{background-color:var(--bui-color-support-error-subtler)}._1f789qjt{background-color:var(--bui-color-support-info-subtler)}._1f789qju{background-color:var(--bui-color-support-success-subtler)}._1f789qjv{background-color:var(--bui-color-background-inverse-medium)}@layer base{._1f789qj1{padding:var(--bui-spacing-sm) var(--bui-spacing-md);border-radius:24px;width:fit-content;transition:background-color .2s ease-in-out;outline:none;font:var(--bui-typography-label-md-medium-font);letter-spacing:var(--bui-typography-label-md-medium-letter-spacing)}}@layer variants{._1f789qj2{outline:2px solid var(--bui-color-focused-primary);outline-offset:1px}._1f789qj3{color:var(--bui-color-text-primary);background-color:var(--bui-color-background-secondary-medium)}._1f789qj4{color:var(--bui-color-support-error-strong);background-color:var(--bui-color-support-error-subtle)}._1f789qj5{color:var(--bui-color-support-success-strong);background-color:var(--bui-color-support-success-subtle)}._1f789qj6{color:var(--bui-color-support-info-strong);background-color:var(--bui-color-support-info-subtle)}._1f789qj7{color:var(--bui-color-text-inverse);background-color:var(--bui-color-background-inverse-strong)}._1f789qj8{color:var(--bui-color-text-disabled);background-color:var(--bui-color-background-secondary-subtle);cursor:not-allowed}._1f789qj9{padding:var(--bui-spacing-xs);padding-left:var(--bui-spacing-md)}._1f789qja{color:var(--bui-color-text-inverse);background-color:var(--bui-color-interactive-primary)}._1f789qjb{cursor:pointer}}@layer compoundVariants{._1f789qjd{background-color:var(--bui-color-background-secondary-subtle)}._1f789qje{background-color:var(--bui-color-support-error-subtler)}._1f789qjf{background-color:var(--bui-color-support-info-subtler)}._1f789qjg{background-color:var(--bui-color-support-success-subtler)}._1f789qjh{background-color:var(--bui-color-background-inverse-medium)}._1f789qji{background-color:var(--bui-color-interactive-hovered)}}@layer reset;._1kvz17d1{transform:rotate(90deg)}._1kvz17d2{cursor:pointer;box-shadow:inset 0 1px 0 var(--bui-color-border-medium);outline:none;height:40px}._1kvz17d3{outline-offset:-2px;outline:2px solid var(--bui-color-focused-primary)}._1kvz17dc{opacity:0}._1kvz17dd{opacity:1}@layer reset{._1kvz17da{all:unset}}._1017q4c0{border-radius:var(--bui-rounded-full);color:var(--bui-color-icon-inverse);display:flex;position:relative;align-items:center;justify-content:center;background-color:var(--bui-color-icon-secondary);font:var(--bui-typography-label-sm-medium-font);letter-spacing:var(--bui-typography-label-sm-medium-letter-spacing)}._1017q4c1{height:24px;width:24px}._1017q4c2{height:16px;width:16px}._1017q4c3{opacity:var(--bui-opacity-medium)}._1017q4c4{height:100%;width:100%;border-radius:var(--bui-rounded-full);overflow:hidden;object-fit:cover}._1017q4c5{position:absolute;height:12px;width:12px;background-color:var(--bui-color-support-error-medium);border:2px solid var(--bui-color-border-subtle);border-radius:var(--bui-rounded-full);bottom:-4px;right:-4px}@layer base;@layer variants;@layer compoundVariants;._1x62fhbf{border-left:1px solid var(--bui-color-border-medium);flex-shrink:0}._1x62fhbf:first-of-type{border-left:none}@layer base{._1x62fhb0{overflow-x:auto;height:40px}._1x62fhb6{text-wrap:nowrap}}@layer variants{._1x62fhb9{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}._1x62fhba{pointer-events:none;cursor:not-allowed}._1x62fhbb{border-right:1px solid var(--bui-color-border-medium)}}@layer compoundVariants{._1x62fhbd{box-shadow:inset 0 -2px 0 0 var(--bui-color-interactive-primary)}._1x62fhbe{box-shadow:inset 0 -2px 0 0 var(--bui-color-interactive-disabled)}}.kfun6y0{width:100%;padding:0 var(--bui-spacing-lg);gap:var(--bui-spacing-lg);padding-right:0}.kfun6y1{background-color:var(--bui-color-support-info-subtler)}.kfun6y2{background-color:var(--bui-color-support-warning-subtler)}.kfun6y3{background-color:var(--bui-color-support-error-subtler)}.kfun6y4{background-color:var(--bui-color-support-success-subtler)}.kfun6y5{min-height:44px;justify-content:space-between;align-items:center}.kfun6y6{justify-content:space-between}.kfun6y7{padding:var(--bui-spacing-lg);width:240px;flex-direction:column-reverse;gap:0}.kfun6ya,.kfun6yb{padding:var(--bui-spacing-lg)}.kfun6yc{padding-top:0;padding-right:0}.kfun6yd{gap:var(--bui-spacing-lg)}.kfun6ye{align-items:center}.kfun6yf{margin:var(--bui-spacing-lg) 0}.kfun6yg{flex-direction:column}.kfun6yh{color:var(--bui-color-text-primary)}.kfun6yi{font:var(--bui-typography-body-sm-semibold-font);letter-spacing:var(--bui-typography-body-sm-semibold-letter-spacing)}.kfun6yj{font:var(--bui-typography-body-md-semibold-font);letter-spacing:var(--bui-typography-body-md-semibold-letter-spacing)}.kfun6yk{flex-shrink:0}.kfun6yl{color:var(--bui-color-support-info-medium)}.kfun6ym{color:var(--bui-color-support-warning-medium)}.kfun6yn{color:var(--bui-color-support-error-medium)}.kfun6yo{color:var(--bui-color-support-success-medium)}.kfun6yp{padding:var(--bui-spacing-sm) 0;display:flex;align-items:center}.kfun6yr{align-items:flex-start}.kfun6ys{padding:0;align-self:flex-end}.kfun6yt{color:var(--bui-color-text-primary)}.kfun6yu{font:var(--bui-typography-body-sm-regular-font);letter-spacing:var(--bui-typography-body-sm-regular-letter-spacing)}.kfun6yv{font:var(--bui-typography-body-md-regular-font);letter-spacing:var(--bui-typography-body-md-regular-letter-spacing)}.kfun6yw{display:flex;flex-direction:row;gap:0}.kfun6yx{gap:var(--bui-spacing-sm)}.kfun6yy,.kfun6yz{flex-direction:column}@layer variants;@layer variants;@layer base;.siobe23{min-height:48px}@layer base{.siobe20{max-height:80vh;overflow:hidden}}@layer base;@layer variants;@layer base{.aml2vl0{position:fixed;inset:0;z-index:1000}}@layer variants{.aml2vl2{align-items:flex-end}}@layer base;@layer variants;@layer base{.cjv3et0{outline:none;overflow:hidden;width:calc(100vw - 2 * var(--bui-spacing-xl))}@media screen and (min-width: 768px){.cjv3et0{width:calc(100vw - 2 * var(--bui-spacing-2-xl))}}@media screen and (min-width: 1280px){.cjv3et0{width:100vw}}}@layer variants{.cjv3et1{max-width:240px}.cjv3et2{max-width:480px}.cjv3et3{max-width:720px}.cjv3et4{width:unset}.cjv3et7{max-width:100vw}}@keyframes _1dbkl515{0%{transform:translate(0)}20%{transform:translate(-2px)}40%{transform:translate(2px)}60%{transform:translate(-2px)}80%{transform:translate(2px)}to{transform:translate(0)}}@layer variants;@layer base;@layer reset;._1dbkl53{height:120px;border-top-left-radius:var(--bui-rounded-sm);border-top-right-radius:var(--bui-rounded-sm)}._1dbkl5e{width:100%;height:4px}._1dbkl5f{font-variant-numeric:tabular-nums}._1dbkl5g{outline:2px solid var(--bui-color-focused-primary);outline-offset:1px}._1dbkl5n:before{content:"";position:absolute;inset:0;border-radius:var(--bui-rounded-full);border:1px solid var(--bui-color-border-medium);mix-blend-mode:multiply}._1dbkl5o{max-width:240px}._1dbkl5r{min-width:max-content}._1dbkl5s{list-style:none}._1dbkl5t{grid-template-columns:repeat(6,1fr)}._1dbkl5u{height:12px}._1dbkl5v{width:100%}._1dbkl513{margin-inline-start:-1px}._1dbkl513[data-hovered],._1dbkl513[data-focus-visible]{z-index:9}._1dbkl514 .BaselineUI-NumberInput:not(:first-of-type){margin-inline-start:-1px}._1dbkl514 .BaselineUI-NumberInput:not(:first-of-type):not(:last-of-type) .BaselineUI-NumberInput-Container{border-radius:0}._1dbkl514:not(:has(._1dbkl5z)) .BaselineUI-NumberInput:first-of-type .BaselineUI-NumberInput-Container{border-top-right-radius:0;border-bottom-right-radius:0}._1dbkl514 .BaselineUI-NumberInput:last-of-type .BaselineUI-NumberInput-Container{border-top-left-radius:0;border-bottom-left-radius:0}._1dbkl516{animation-name:_1dbkl515;animation-duration:.2s}@layer variants{._1dbkl55{box-shadow:inset 0 0 0 1px var(--bui-color-border-medium)}._1dbkl56{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}._1dbkl58{width:fit-content}._1dbkl5i{box-shadow:0 0 0 4px var(--bui-color-focused-inset),0 0 0 6px var(--bui-color-focused-primary)}._1dbkl5k:before{mix-blend-mode:normal}._1dbkl5x{outline-offset:-2px;border-width:3px}._1dbkl510{box-shadow:inset 0 0 0 1px var(--bui-color-focused-primary);z-index:99}._1dbkl511{z-index:9}}@layer reset{._1dbkl5a{all:unset}}@layer base{._1dbkl54{background-color:transparent}._1dbkl5a{min-width:32px;min-height:32px;box-sizing:border-box}._1dbkl5h{width:16px;height:16px}._1dbkl5p{max-width:240px;max-height:inherit;overflow-y:auto}._1dbkl5w{border-color:var(--bui-color-positive-subtle);width:12px;height:12px;top:6px;box-shadow:0 0 4px #0006;overflow:hidden}._1dbkl5z{background-color:transparent;border-width:1px;height:32px;width:154px}}@layer base;@layer variants;@layer compoundVariants;.mnnh5s0{background:repeating-conic-gradient(transparent 0% 25%,var(--bui-color-background-secondary-medium) 25% 50%);background-size:16px 16px}.mnnh5sa{height:100%;width:100%;object-fit:contain}.mnnh5sd{opacity:.5}@layer base{.mnnh5s1{min-height:100px;overflow:hidden}.mnnh5s1:after{content:"";background-color:transparent}}@layer variants{.mnnh5s2{min-width:208px}.mnnh5s8{pointer-events:none;cursor:not-allowed}}@layer compoundVariants{.mnnh5s9:after{content:"";position:absolute;transition:background-color .2s;inset:0;background:var(--bui-color-background-overlay-medium)}}@layer base;@layer variants;@layer compoundVariants;._1i0ytqa0{display:flex;flex-direction:column;align-items:center}@layer base{._1i0ytqa1{height:40px}._1i0ytqa3{touch-action:none}}@layer variants{._1i0ytqa7{pointer-events:none;cursor:not-allowed}._1i0ytqa8{cursor:crosshair}._1i0ytqad{pointer-events:none;cursor:not-allowed}}@layer compoundVariants{._1i0ytqa9{box-shadow:inset 0 0 0 1px var(--bui-color-focused-primary)}._1i0ytqaa{box-shadow:inset 0 0 0 2px var(--bui-color-focused-primary)}}._1vac7ws0{cursor:move}._1vac7ws1 ._1vac7ws2 .moveable-control,._1vac7ws1 ._1vac7ws2 .moveable-rotation{display:none}@layer base;@layer variants;@layer reset;._1vm2oh49{top:var(--bui-spacing-sm);right:var(--bui-spacing-sm)}@layer base{._1vm2oh40{transition-property:outline-color,background-color}}@layer variants;@layer reset{._1vm2oh48{all:unset}}.cw3m0n3{border-radius:var(--bui-rounded-full);color:var(--bui-color-icon-primary)}.cw3m0n3:hover{color:var(--bui-color-icon-interactive);border-color:var(--bui-color-border-interactive)}.cw3m0n7{width:8px;height:8px;background-color:currentColor;border-radius:var(--bui-rounded-full)}.xvr3wn0{overflow-x:auto}.xvr3wn1{overflow-y:auto}@layer reset;@layer base;@layer variants;@layer compoundVariants;@layer reset{._1j5skr70{all:unset}}@layer base{._1j5skr71{aspect-ratio:1 / 1;height:fit-content}}@layer variants{._1j5skr72{min-height:16px}._1j5skr73{min-height:24px}._1j5skr74{min-height:32px}._1j5skr75{min-height:40px}._1j5skr76{min-height:48px}._1j5skr7b{background-color:var(--bui-color-interactive-disabled)}}@layer compoundVariants{._1j5skr7c{background-color:var(--bui-color-interactive-primary)}._1j5skr7e{outline-offset:-3px}._1j5skr7k{background-color:var(--bui-color-interactive-primary);outline-offset:-3px}}@layer base;@layer variants;@layer reset;.f6jv6b9{height:40px;overflow-x:auto;scrollbar-width:thin}.f6jv6ba{white-space:pre-wrap;word-wrap:break-word;box-sizing:border-box;resize:none;overflow:hidden;z-index:9}.f6jv6ba::placeholder{color:var(--bui-color-text-placeholder);font:var(--bui-typography-body-sm-regular-font);letter-spacing:var(--bui-typography-body-sm-regular-letter-spacing)}.f6jv6ba:disabled{color:var(--bui-color-text-disabled)}.f6jv6be{overflow:scroll;min-height:40px;box-sizing:border-box;padding-block:12px}.f6jv6bi{overflow:auto;min-width:250px}.f6jv6b4 span[data-user-id]{color:var(--bui-color-interactive-primary);cursor:pointer;display:inline-block;background-color:var(--bui-color-background-primary-strong);border-radius:var(--bui-rounded-sm);padding:0 var(--bui-spacing-xs)}.f6jv6b4 a{text-decoration:underline}.f6jv6bk{min-height:48px}.f6jv6bj[data-drawer=true] .f6jv6bk,.f6jv6bj[data-drawer=true] .f6jv6bl{display:none}.f6jv6bm{border-top:1px solid var(--bui-color-border-subtle)}@layer base{.f6jv6b0[aria-disabled=true]{pointer-events:none;cursor:not-allowed}.f6jv6b4{cursor:text}.f6jv6b6:hover{z-index:9}.f6jv6b6:focus-visible:not([data-mention-open=true]){outline:2px solid var(--bui-color-focused-primary);z-index:9;outline-offset:-1px}.f6jv6bb:has([data-focused]){outline:2px solid var(--bui-color-focused-primary);outline-offset:-1px}.f6jv6bf{min-height:48px}}@layer variants{.f6jv6b5{pointer-events:none;cursor:not-allowed}.f6jv6b7:hover:not(:focus){outline:1px solid var(--bui-color-border-strong)}.f6jv6b8:hover:not(:focus){box-shadow:0 -1px 1px -1px var(--bui-color-border-strong),0 1px 1px -1px var(--bui-color-border-strong)}}@layer reset{.f6jv6ba{all:unset}}@layer reset;@layer variants;._8kqf970{height:fit-content;bottom:var(--bui-spacing-lg);margin-left:50%;text-align:center;white-space:nowrap;position:absolute}@layer reset{._8kqf970{all:unset}}@layer variants{._8kqf970{overflow:unset}}._1v0p2z10{min-height:48px}@keyframes _1t55bp72{0%{opacity:0}}._1t55bp70 a{color:var(--bui-color-interactive-primary)}._1t55bp71>:not(ol,ul,pre):last-child:after,._1t55bp71>pre:last-child code:after,._1t55bp71>:is(ul,ol):last-child>li:last-child:not(:has(*>li)):after{content:"\2502";animation:_1t55bp72 1s infinite steps(2);color:var(--bui-color-interactive-primary)}.rta2n90 .BaselineUI-Slider-Thumb{transition:background-color .2s ease-in;margin-top:1.5px;background-color:transparent;width:12px;height:12px}.rta2n90:hover .BaselineUI-Slider-Thumb,.rta2n90:focus-within .BaselineUI-Slider-Thumb{background-color:var(--bui-color-interactive-primary)}.rta2n90:not(:hover):not(:focus-within) .BaselineUI-Slider-Thumb{background-color:transparent}.rta2n90 .BaselineUI-Slider-Track{height:4px;border-radius:0}.rta2n90 .BaselineUI-Slider-TrackHighlight{height:100%;border-radius:0;background-color:var(--bui-color-interactive-primary)}.rta2n91{font-variant-numeric:tabular-nums}
package/dist/index.d.mts CHANGED
@@ -124,6 +124,14 @@ interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & A
124
124
  dropIndicatorClassName?: string;
125
125
  /** The style of the drop indicator used in a component. */
126
126
  dropIndicatorStyle?: React.CSSProperties;
127
+ /** The CSS class name for the option. */
128
+ optionClassName?: string | ((item: ListOption) => string);
129
+ /** The CSS class name for the section. */
130
+ sectionClassName?: string | ((item: ListSection) => string);
131
+ /** The style of the option. */
132
+ optionStyle?: React.CSSProperties | ((item: ListOption) => React.CSSProperties);
133
+ /** The style of the section. */
134
+ sectionStyle?: React.CSSProperties | ((item: ListSection) => React.CSSProperties);
127
135
  }
128
136
 
129
137
  declare const ListBox: React.ForwardRefExoticComponent<ListBoxProps & React.RefAttributes<HTMLUListElement>>;
@@ -263,12 +271,26 @@ declare function useUserPreferences(ownerWindow?: Window & typeof globalThis): {
263
271
  transparency: boolean;
264
272
  };
265
273
 
274
+ interface PortalContainerProviderProps {
275
+ /**
276
+ * The container element for the popover. By default, the modal is rendered as
277
+ * a child of the body element.
278
+ *
279
+ * @default undefined
280
+ */
281
+ portalContainer: HTMLElement | undefined;
282
+ /** The children to render. */
283
+ children: React.ReactNode;
284
+ }
285
+
286
+ declare const PortalContainerProvider: React.FC<PortalContainerProviderProps>;
287
+
266
288
  declare type OverlayTriggerProps_ = Parameters<typeof useOverlayTrigger>[0];
267
289
  interface PopoverProps extends OverlayTriggerProps, OverlayTriggerProps_ {
268
290
  /** The children of the popover. */
269
291
  children: React.ReactNode | ((state: OverlayTriggerState) => React.ReactNode);
270
292
  }
271
- interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "triggerRef">, StylingProps {
293
+ interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "triggerRef" | "arrowSize" | "arrowBoundaryOffset">, StylingProps {
272
294
  /**
273
295
  * The reference element for the popover position. By default, the popover is
274
296
  * positioned relative to the trigger element.
@@ -279,8 +301,8 @@ interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "tri
279
301
  /** The contents of the popover. */
280
302
  children: React.ReactNode;
281
303
  /**
282
- * The container element for the modal. By default, the modal is rendered as a
283
- * child of the body element.
304
+ * The container element for the popover. By default, the modal is rendered as
305
+ * a child of the body element.
284
306
  *
285
307
  * @default document.body
286
308
  */
@@ -291,6 +313,10 @@ interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "tri
291
313
  * @default false
292
314
  */
293
315
  includeArrow?: boolean;
316
+ /** The class name for the content container element. */
317
+ contentContainerClassName?: string;
318
+ /** The style for the content container element. */
319
+ contentContainerStyle?: React.CSSProperties;
294
320
  }
295
321
  interface PopoverTriggerProps {
296
322
  /** The contents of the popover trigger. */
@@ -314,7 +340,7 @@ declare type MenuSection = Omit<ListSection, "children"> & {
314
340
  children: MenuOption[];
315
341
  };
316
342
  declare type MenuItem = MenuOption | MenuSection;
317
- declare type MenuPopoverProps = Pick<PopoverContentProps, "isNonModal" | "placement" | "shouldUpdatePosition" | "shouldFlip" | "boundaryElement" | "crossOffset" | "offset">;
343
+ declare type MenuPopoverProps = Pick<PopoverContentProps, "isNonModal" | "placement" | "shouldUpdatePosition" | "shouldFlip" | "boundaryElement" | "crossOffset" | "offset" | "portalContainer">;
318
344
  interface MenuProps extends MenuPopoverProps, MenuTriggerProps, Omit<AriaMenuProps<MenuItem>, "children">, Omit<AriaMenuTriggerProps, "type"> {
319
345
  /** The `className` property assigned to the root element of the component. */
320
346
  className?: string;
@@ -749,7 +775,7 @@ declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.
749
775
 
750
776
  declare const AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLHeadingElement>>;
751
777
 
752
- interface SelectProps extends Omit<AriaSelectOptions<ListItem> & SelectStateOptions<ListItem> & PopoverContentProps, "validationState" | "items" | "children" | "isRequired" | "className" | "style" | "triggerRef" | "validate" | "validationBehavior" | "keyboardDelegate">, Pick<ListBoxProps, "items" | "showSelectedIcon">, StylingProps {
778
+ interface SelectProps extends Omit<AriaSelectOptions<ListItem> & SelectStateOptions<ListItem> & PopoverContentProps, "validationState" | "items" | "children" | "isRequired" | "className" | "style" | "triggerRef" | "validate" | "validationBehavior" | "keyboardDelegate">, Pick<ListBoxProps, "items" | "showSelectedIcon" | "optionStyle" | "optionClassName">, StylingProps {
753
779
  /**
754
780
  * The position of the label.
755
781
  *
@@ -944,6 +970,25 @@ interface NumberInputProps extends StylingProps, Omit<AriaNumberFieldProps, "val
944
970
 
945
971
  declare const NumberInput: React.ForwardRefExoticComponent<NumberInputProps & React.RefAttributes<HTMLDivElement>>;
946
972
 
973
+ interface DrawerProps extends StylingProps, AriaDialogProps {
974
+ /** The children to render. */
975
+ children: React.ReactNode;
976
+ /**
977
+ * The valid values for the background type are "medium" and "subtle".
978
+ *
979
+ * @default "medium"
980
+ */
981
+ background?: "medium" | "subtle";
982
+ /** The title to display in the drawer. */
983
+ title: string;
984
+ /** The props of additional `ActionIconButton` to display in the drawer header. */
985
+ action?: ActionIconButtonProps;
986
+ /** The callback to call when the drawer is requested to be closed. */
987
+ onCloseRequest?: () => void;
988
+ }
989
+
990
+ declare const Drawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLDivElement>>;
991
+
947
992
  interface DialogProps extends AriaDialogProps, StylingProps {
948
993
  /** The children to render. */
949
994
  children: React.ReactNode;
@@ -959,6 +1004,19 @@ interface DialogProps extends AriaDialogProps, StylingProps {
959
1004
  * @default "primary"
960
1005
  */
961
1006
  variant?: "primary" | "ghost";
1007
+ /**
1008
+ * The background color of the drawer.
1009
+ *
1010
+ * @default "medium"
1011
+ */
1012
+ drawerBackground?: DrawerProps["background"];
1013
+ /**
1014
+ * When used inside a modal, this prop will decide whether the dialog should
1015
+ * inherit the drawer styles.
1016
+ *
1017
+ * @default false
1018
+ */
1019
+ inheritDrawer?: boolean;
962
1020
  }
963
1021
  interface DialogTitleProps extends StylingProps {
964
1022
  /** The children to render. */
@@ -973,7 +1031,7 @@ interface ColorPreset {
973
1031
  label: string;
974
1032
  color: string;
975
1033
  }
976
- interface ColorInputProps extends OverlayTriggerProps, StylingProps, Pick<ColorFieldProps, "onChange" | "defaultValue" | "value" | "label" | "isDisabled">, Pick<AriaLabelingProps, "aria-label">, Pick<PopoverContentProps, "isNonModal" | "placement" | "shouldUpdatePosition" | "shouldFlip" | "boundaryElement" | "crossOffset" | "offset"> {
1034
+ interface ColorInputProps extends OverlayTriggerProps, StylingProps, Pick<ColorFieldProps, "onChange" | "defaultValue" | "value" | "label" | "isDisabled">, Pick<AriaLabelingProps, "aria-label">, Pick<PopoverContentProps, "isNonModal" | "placement" | "shouldUpdatePosition" | "shouldFlip" | "boundaryElement" | "crossOffset" | "offset" | "portalContainer"> {
977
1035
  /**
978
1036
  * The list of color presets to show in the color picker. The signature of the
979
1037
  * color presets is:
@@ -1673,8 +1731,10 @@ interface EditorProps extends StylingProps, AriaLabelingProps {
1673
1731
  * @param value
1674
1732
  */
1675
1733
  onChange?: (value: string) => void;
1676
- /** Whether the editor is disabled. */
1734
+ /** Whether the editor is disabled. This includes both input and save button. */
1677
1735
  isDisabled?: boolean;
1736
+ /** Whether saving it disabled. Ths disables only save button. */
1737
+ isSaveDisabled?: boolean;
1678
1738
  /**
1679
1739
  * Indicates whether rich text is enabled or not.
1680
1740
  *
@@ -1776,6 +1836,15 @@ interface ScrollControlButtonProps extends StylingProps, Pick<ActionButtonProps,
1776
1836
 
1777
1837
  declare const ScrollControlButton: React.ForwardRefExoticComponent<ScrollControlButtonProps & React.RefAttributes<HTMLButtonElement>>;
1778
1838
 
1839
+ interface TransitionProps extends StylingProps {
1840
+ isMounted: boolean;
1841
+ transitions: UseTransitionProps;
1842
+ elementType?: keyof React.ReactHTML;
1843
+ children: React.ReactNode;
1844
+ }
1845
+
1846
+ declare const Transition: React.ForwardRefExoticComponent<TransitionProps & React.RefAttributes<HTMLElement>>;
1847
+
1779
1848
  interface AlertDialogProps extends StylingProps {
1780
1849
  /**
1781
1850
  * The title of the dialog. This is the main heading of the dialog and is
@@ -1844,25 +1913,6 @@ interface MarkdownProps extends StylingProps {
1844
1913
 
1845
1914
  declare const Markdown: React.ForwardRefExoticComponent<MarkdownProps & React.RefAttributes<HTMLDivElement>>;
1846
1915
 
1847
- interface DrawerProps extends StylingProps, AriaDialogProps {
1848
- /** The children to render. */
1849
- children: React.ReactNode;
1850
- /**
1851
- * The valid values for the background type are "medium" and "subtle".
1852
- *
1853
- * @default "medium"
1854
- */
1855
- background?: "medium" | "subtle";
1856
- /** The title to display in the drawer. */
1857
- title: string;
1858
- /** The props of additional `ActionIconButton` to display in the drawer header. */
1859
- action?: ActionIconButtonProps;
1860
- /** The callback to call when the drawer is requested to be closed. */
1861
- onCloseRequest?: () => void;
1862
- }
1863
-
1864
- declare const Drawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLDivElement>>;
1865
-
1866
1916
  interface AudioPlayerProps extends StylingProps, AriaLabelingProps {
1867
1917
  /**
1868
1918
  * The sources of the audio file. The `url` is the URL of the audio file, and
@@ -1891,15 +1941,6 @@ interface AudioPlayerProps extends StylingProps, AriaLabelingProps {
1891
1941
 
1892
1942
  declare const AudioPlayer: React.ForwardRefExoticComponent<AudioPlayerProps & React.RefAttributes<HTMLDivElement>>;
1893
1943
 
1894
- interface TransitionProps extends StylingProps {
1895
- isMounted: boolean;
1896
- transitions: UseTransitionProps;
1897
- elementType?: keyof React.ReactHTML;
1898
- children: React.ReactNode;
1899
- }
1900
-
1901
- declare const Transition: React.ForwardRefExoticComponent<TransitionProps & React.RefAttributes<HTMLElement>>;
1902
-
1903
1944
  /**
1904
1945
  * A hook that creates an IntersectionObserver and observes a target element.
1905
1946
  *
@@ -2230,4 +2271,16 @@ interface TextSelectionProps {
2230
2271
  */
2231
2272
  declare function useDevice(element?: Element | null | undefined): "tablet" | "desktop" | "mobile";
2232
2273
 
2233
- export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionIconButton, type ActionIconButtonProps, AlertDialog, type AlertDialogProps, AudioPlayer, type AudioPlayerProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorPresetInlineInput, type ColorPresetInlineInputProps, ColorSwatch, type ColorSwatchProps, DateFormat, type DateFormatProps, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, Drawer, type DrawerProps, Editor, type EditorHandle, type EditorProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInputButton, ImageDropZone, type ImageDropZoneProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Markdown, type MarkdownProps, Menu, type MenuItem, type MenuProps, type MessageDescriptor, MessageFormat, type MessageFormatProps, Modal, ModalClose, ModalContent, type ModalContentProps, type ModalProps, ModalTrigger, NumberFormat, type NumberFormatProps, NumberInput, type NumberInputProps, Pagination, type PaginationProps, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, type PopoverTriggerProps, Portal, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, ScrollControlButton, type ScrollControlButtonProps, SearchInput, type SearchInputProps, Select, type SelectProps, Separator, type SeparatorProps, Slider, type SliderProps, type StylingProps, Switch, type SwitchProps, TabItem, type TabItemProps, Tabs, type TabsProps, TagGroup, type TagGroupProps, Text, TextInput, type TextInputProps, type TextProps, ThemeProvider, type ThemeProviderProps, ToggleButton, type ToggleButtonProps, ToggleIconButton, type ToggleIconButtonProps, Toolbar, type ToolbarProps, Tooltip, type TooltipProps, Transform, type TransformProps, Transition, type TransitionProps, defineMessages, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };
2274
+ /**
2275
+ * Custom hook for accessing PortalContainerProviderContext. This hook allows
2276
+ * components to either use a specified portal container or fallback to a
2277
+ * default provided via context.
2278
+ *
2279
+ * @param _portalContainer - An optional HTML element that can be specified as
2280
+ * an override.
2281
+ * @returns The portal container element where components should be rendered,
2282
+ * either the overridden container, one from context or undefined.
2283
+ */
2284
+ declare function usePortalContainer(_portalContainer?: HTMLElement): HTMLElement | undefined;
2285
+
2286
+ export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionIconButton, type ActionIconButtonProps, AlertDialog, type AlertDialogProps, AudioPlayer, type AudioPlayerProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorPresetInlineInput, type ColorPresetInlineInputProps, ColorSwatch, type ColorSwatchProps, DateFormat, type DateFormatProps, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, Drawer, type DrawerProps, Editor, type EditorHandle, type EditorProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInputButton, ImageDropZone, type ImageDropZoneProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Markdown, type MarkdownProps, Menu, type MenuItem, type MenuProps, type MessageDescriptor, MessageFormat, type MessageFormatProps, Modal, ModalClose, ModalContent, type ModalContentProps, type ModalProps, ModalTrigger, NumberFormat, type NumberFormatProps, NumberInput, type NumberInputProps, Pagination, type PaginationProps, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, type PopoverTriggerProps, Portal, PortalContainerProvider, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, ScrollControlButton, type ScrollControlButtonProps, SearchInput, type SearchInputProps, Select, type SelectProps, Separator, type SeparatorProps, Slider, type SliderProps, type StylingProps, Switch, type SwitchProps, TabItem, type TabItemProps, Tabs, type TabsProps, TagGroup, type TagGroupProps, Text, TextInput, type TextInputProps, type TextProps, ThemeProvider, type ThemeProviderProps, ToggleButton, type ToggleButtonProps, ToggleIconButton, type ToggleIconButtonProps, Toolbar, type ToolbarProps, Tooltip, type TooltipProps, Transform, type TransformProps, Transition, type TransitionProps, defineMessages, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, usePortalContainer, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };
package/dist/index.d.ts CHANGED
@@ -124,6 +124,14 @@ interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & A
124
124
  dropIndicatorClassName?: string;
125
125
  /** The style of the drop indicator used in a component. */
126
126
  dropIndicatorStyle?: React.CSSProperties;
127
+ /** The CSS class name for the option. */
128
+ optionClassName?: string | ((item: ListOption) => string);
129
+ /** The CSS class name for the section. */
130
+ sectionClassName?: string | ((item: ListSection) => string);
131
+ /** The style of the option. */
132
+ optionStyle?: React.CSSProperties | ((item: ListOption) => React.CSSProperties);
133
+ /** The style of the section. */
134
+ sectionStyle?: React.CSSProperties | ((item: ListSection) => React.CSSProperties);
127
135
  }
128
136
 
129
137
  declare const ListBox: React.ForwardRefExoticComponent<ListBoxProps & React.RefAttributes<HTMLUListElement>>;
@@ -263,12 +271,26 @@ declare function useUserPreferences(ownerWindow?: Window & typeof globalThis): {
263
271
  transparency: boolean;
264
272
  };
265
273
 
274
+ interface PortalContainerProviderProps {
275
+ /**
276
+ * The container element for the popover. By default, the modal is rendered as
277
+ * a child of the body element.
278
+ *
279
+ * @default undefined
280
+ */
281
+ portalContainer: HTMLElement | undefined;
282
+ /** The children to render. */
283
+ children: React.ReactNode;
284
+ }
285
+
286
+ declare const PortalContainerProvider: React.FC<PortalContainerProviderProps>;
287
+
266
288
  declare type OverlayTriggerProps_ = Parameters<typeof useOverlayTrigger>[0];
267
289
  interface PopoverProps extends OverlayTriggerProps, OverlayTriggerProps_ {
268
290
  /** The children of the popover. */
269
291
  children: React.ReactNode | ((state: OverlayTriggerState) => React.ReactNode);
270
292
  }
271
- interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "triggerRef">, StylingProps {
293
+ interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "triggerRef" | "arrowSize" | "arrowBoundaryOffset">, StylingProps {
272
294
  /**
273
295
  * The reference element for the popover position. By default, the popover is
274
296
  * positioned relative to the trigger element.
@@ -279,8 +301,8 @@ interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "tri
279
301
  /** The contents of the popover. */
280
302
  children: React.ReactNode;
281
303
  /**
282
- * The container element for the modal. By default, the modal is rendered as a
283
- * child of the body element.
304
+ * The container element for the popover. By default, the modal is rendered as
305
+ * a child of the body element.
284
306
  *
285
307
  * @default document.body
286
308
  */
@@ -291,6 +313,10 @@ interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "tri
291
313
  * @default false
292
314
  */
293
315
  includeArrow?: boolean;
316
+ /** The class name for the content container element. */
317
+ contentContainerClassName?: string;
318
+ /** The style for the content container element. */
319
+ contentContainerStyle?: React.CSSProperties;
294
320
  }
295
321
  interface PopoverTriggerProps {
296
322
  /** The contents of the popover trigger. */
@@ -314,7 +340,7 @@ declare type MenuSection = Omit<ListSection, "children"> & {
314
340
  children: MenuOption[];
315
341
  };
316
342
  declare type MenuItem = MenuOption | MenuSection;
317
- declare type MenuPopoverProps = Pick<PopoverContentProps, "isNonModal" | "placement" | "shouldUpdatePosition" | "shouldFlip" | "boundaryElement" | "crossOffset" | "offset">;
343
+ declare type MenuPopoverProps = Pick<PopoverContentProps, "isNonModal" | "placement" | "shouldUpdatePosition" | "shouldFlip" | "boundaryElement" | "crossOffset" | "offset" | "portalContainer">;
318
344
  interface MenuProps extends MenuPopoverProps, MenuTriggerProps, Omit<AriaMenuProps<MenuItem>, "children">, Omit<AriaMenuTriggerProps, "type"> {
319
345
  /** The `className` property assigned to the root element of the component. */
320
346
  className?: string;
@@ -749,7 +775,7 @@ declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.
749
775
 
750
776
  declare const AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLHeadingElement>>;
751
777
 
752
- interface SelectProps extends Omit<AriaSelectOptions<ListItem> & SelectStateOptions<ListItem> & PopoverContentProps, "validationState" | "items" | "children" | "isRequired" | "className" | "style" | "triggerRef" | "validate" | "validationBehavior" | "keyboardDelegate">, Pick<ListBoxProps, "items" | "showSelectedIcon">, StylingProps {
778
+ interface SelectProps extends Omit<AriaSelectOptions<ListItem> & SelectStateOptions<ListItem> & PopoverContentProps, "validationState" | "items" | "children" | "isRequired" | "className" | "style" | "triggerRef" | "validate" | "validationBehavior" | "keyboardDelegate">, Pick<ListBoxProps, "items" | "showSelectedIcon" | "optionStyle" | "optionClassName">, StylingProps {
753
779
  /**
754
780
  * The position of the label.
755
781
  *
@@ -944,6 +970,25 @@ interface NumberInputProps extends StylingProps, Omit<AriaNumberFieldProps, "val
944
970
 
945
971
  declare const NumberInput: React.ForwardRefExoticComponent<NumberInputProps & React.RefAttributes<HTMLDivElement>>;
946
972
 
973
+ interface DrawerProps extends StylingProps, AriaDialogProps {
974
+ /** The children to render. */
975
+ children: React.ReactNode;
976
+ /**
977
+ * The valid values for the background type are "medium" and "subtle".
978
+ *
979
+ * @default "medium"
980
+ */
981
+ background?: "medium" | "subtle";
982
+ /** The title to display in the drawer. */
983
+ title: string;
984
+ /** The props of additional `ActionIconButton` to display in the drawer header. */
985
+ action?: ActionIconButtonProps;
986
+ /** The callback to call when the drawer is requested to be closed. */
987
+ onCloseRequest?: () => void;
988
+ }
989
+
990
+ declare const Drawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLDivElement>>;
991
+
947
992
  interface DialogProps extends AriaDialogProps, StylingProps {
948
993
  /** The children to render. */
949
994
  children: React.ReactNode;
@@ -959,6 +1004,19 @@ interface DialogProps extends AriaDialogProps, StylingProps {
959
1004
  * @default "primary"
960
1005
  */
961
1006
  variant?: "primary" | "ghost";
1007
+ /**
1008
+ * The background color of the drawer.
1009
+ *
1010
+ * @default "medium"
1011
+ */
1012
+ drawerBackground?: DrawerProps["background"];
1013
+ /**
1014
+ * When used inside a modal, this prop will decide whether the dialog should
1015
+ * inherit the drawer styles.
1016
+ *
1017
+ * @default false
1018
+ */
1019
+ inheritDrawer?: boolean;
962
1020
  }
963
1021
  interface DialogTitleProps extends StylingProps {
964
1022
  /** The children to render. */
@@ -973,7 +1031,7 @@ interface ColorPreset {
973
1031
  label: string;
974
1032
  color: string;
975
1033
  }
976
- interface ColorInputProps extends OverlayTriggerProps, StylingProps, Pick<ColorFieldProps, "onChange" | "defaultValue" | "value" | "label" | "isDisabled">, Pick<AriaLabelingProps, "aria-label">, Pick<PopoverContentProps, "isNonModal" | "placement" | "shouldUpdatePosition" | "shouldFlip" | "boundaryElement" | "crossOffset" | "offset"> {
1034
+ interface ColorInputProps extends OverlayTriggerProps, StylingProps, Pick<ColorFieldProps, "onChange" | "defaultValue" | "value" | "label" | "isDisabled">, Pick<AriaLabelingProps, "aria-label">, Pick<PopoverContentProps, "isNonModal" | "placement" | "shouldUpdatePosition" | "shouldFlip" | "boundaryElement" | "crossOffset" | "offset" | "portalContainer"> {
977
1035
  /**
978
1036
  * The list of color presets to show in the color picker. The signature of the
979
1037
  * color presets is:
@@ -1673,8 +1731,10 @@ interface EditorProps extends StylingProps, AriaLabelingProps {
1673
1731
  * @param value
1674
1732
  */
1675
1733
  onChange?: (value: string) => void;
1676
- /** Whether the editor is disabled. */
1734
+ /** Whether the editor is disabled. This includes both input and save button. */
1677
1735
  isDisabled?: boolean;
1736
+ /** Whether saving it disabled. Ths disables only save button. */
1737
+ isSaveDisabled?: boolean;
1678
1738
  /**
1679
1739
  * Indicates whether rich text is enabled or not.
1680
1740
  *
@@ -1776,6 +1836,15 @@ interface ScrollControlButtonProps extends StylingProps, Pick<ActionButtonProps,
1776
1836
 
1777
1837
  declare const ScrollControlButton: React.ForwardRefExoticComponent<ScrollControlButtonProps & React.RefAttributes<HTMLButtonElement>>;
1778
1838
 
1839
+ interface TransitionProps extends StylingProps {
1840
+ isMounted: boolean;
1841
+ transitions: UseTransitionProps;
1842
+ elementType?: keyof React.ReactHTML;
1843
+ children: React.ReactNode;
1844
+ }
1845
+
1846
+ declare const Transition: React.ForwardRefExoticComponent<TransitionProps & React.RefAttributes<HTMLElement>>;
1847
+
1779
1848
  interface AlertDialogProps extends StylingProps {
1780
1849
  /**
1781
1850
  * The title of the dialog. This is the main heading of the dialog and is
@@ -1844,25 +1913,6 @@ interface MarkdownProps extends StylingProps {
1844
1913
 
1845
1914
  declare const Markdown: React.ForwardRefExoticComponent<MarkdownProps & React.RefAttributes<HTMLDivElement>>;
1846
1915
 
1847
- interface DrawerProps extends StylingProps, AriaDialogProps {
1848
- /** The children to render. */
1849
- children: React.ReactNode;
1850
- /**
1851
- * The valid values for the background type are "medium" and "subtle".
1852
- *
1853
- * @default "medium"
1854
- */
1855
- background?: "medium" | "subtle";
1856
- /** The title to display in the drawer. */
1857
- title: string;
1858
- /** The props of additional `ActionIconButton` to display in the drawer header. */
1859
- action?: ActionIconButtonProps;
1860
- /** The callback to call when the drawer is requested to be closed. */
1861
- onCloseRequest?: () => void;
1862
- }
1863
-
1864
- declare const Drawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLDivElement>>;
1865
-
1866
1916
  interface AudioPlayerProps extends StylingProps, AriaLabelingProps {
1867
1917
  /**
1868
1918
  * The sources of the audio file. The `url` is the URL of the audio file, and
@@ -1891,15 +1941,6 @@ interface AudioPlayerProps extends StylingProps, AriaLabelingProps {
1891
1941
 
1892
1942
  declare const AudioPlayer: React.ForwardRefExoticComponent<AudioPlayerProps & React.RefAttributes<HTMLDivElement>>;
1893
1943
 
1894
- interface TransitionProps extends StylingProps {
1895
- isMounted: boolean;
1896
- transitions: UseTransitionProps;
1897
- elementType?: keyof React.ReactHTML;
1898
- children: React.ReactNode;
1899
- }
1900
-
1901
- declare const Transition: React.ForwardRefExoticComponent<TransitionProps & React.RefAttributes<HTMLElement>>;
1902
-
1903
1944
  /**
1904
1945
  * A hook that creates an IntersectionObserver and observes a target element.
1905
1946
  *
@@ -2230,4 +2271,16 @@ interface TextSelectionProps {
2230
2271
  */
2231
2272
  declare function useDevice(element?: Element | null | undefined): "tablet" | "desktop" | "mobile";
2232
2273
 
2233
- export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionIconButton, type ActionIconButtonProps, AlertDialog, type AlertDialogProps, AudioPlayer, type AudioPlayerProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorPresetInlineInput, type ColorPresetInlineInputProps, ColorSwatch, type ColorSwatchProps, DateFormat, type DateFormatProps, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, Drawer, type DrawerProps, Editor, type EditorHandle, type EditorProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInputButton, ImageDropZone, type ImageDropZoneProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Markdown, type MarkdownProps, Menu, type MenuItem, type MenuProps, type MessageDescriptor, MessageFormat, type MessageFormatProps, Modal, ModalClose, ModalContent, type ModalContentProps, type ModalProps, ModalTrigger, NumberFormat, type NumberFormatProps, NumberInput, type NumberInputProps, Pagination, type PaginationProps, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, type PopoverTriggerProps, Portal, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, ScrollControlButton, type ScrollControlButtonProps, SearchInput, type SearchInputProps, Select, type SelectProps, Separator, type SeparatorProps, Slider, type SliderProps, type StylingProps, Switch, type SwitchProps, TabItem, type TabItemProps, Tabs, type TabsProps, TagGroup, type TagGroupProps, Text, TextInput, type TextInputProps, type TextProps, ThemeProvider, type ThemeProviderProps, ToggleButton, type ToggleButtonProps, ToggleIconButton, type ToggleIconButtonProps, Toolbar, type ToolbarProps, Tooltip, type TooltipProps, Transform, type TransformProps, Transition, type TransitionProps, defineMessages, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };
2274
+ /**
2275
+ * Custom hook for accessing PortalContainerProviderContext. This hook allows
2276
+ * components to either use a specified portal container or fallback to a
2277
+ * default provided via context.
2278
+ *
2279
+ * @param _portalContainer - An optional HTML element that can be specified as
2280
+ * an override.
2281
+ * @returns The portal container element where components should be rendered,
2282
+ * either the overridden container, one from context or undefined.
2283
+ */
2284
+ declare function usePortalContainer(_portalContainer?: HTMLElement): HTMLElement | undefined;
2285
+
2286
+ export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionIconButton, type ActionIconButtonProps, AlertDialog, type AlertDialogProps, AudioPlayer, type AudioPlayerProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorPresetInlineInput, type ColorPresetInlineInputProps, ColorSwatch, type ColorSwatchProps, DateFormat, type DateFormatProps, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, Drawer, type DrawerProps, Editor, type EditorHandle, type EditorProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInputButton, ImageDropZone, type ImageDropZoneProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Markdown, type MarkdownProps, Menu, type MenuItem, type MenuProps, type MessageDescriptor, MessageFormat, type MessageFormatProps, Modal, ModalClose, ModalContent, type ModalContentProps, type ModalProps, ModalTrigger, NumberFormat, type NumberFormatProps, NumberInput, type NumberInputProps, Pagination, type PaginationProps, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, type PopoverTriggerProps, Portal, PortalContainerProvider, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, ScrollControlButton, type ScrollControlButtonProps, SearchInput, type SearchInputProps, Select, type SelectProps, Separator, type SeparatorProps, Slider, type SliderProps, type StylingProps, Switch, type SwitchProps, TabItem, type TabItemProps, Tabs, type TabsProps, TagGroup, type TagGroupProps, Text, TextInput, type TextInputProps, type TextProps, ThemeProvider, type ThemeProviderProps, ToggleButton, type ToggleButtonProps, ToggleIconButton, type ToggleIconButtonProps, Toolbar, type ToolbarProps, Tooltip, type TooltipProps, Transform, type TransformProps, Transition, type TransitionProps, defineMessages, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, usePortalContainer, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };