@rogieking/figui3 8.9.10 → 8.9.12

package/dist/fig-editor.css

@@ -1 +1 @@
-fig-layer{--indent:var(--spacer-3);color:var(--figma-color-text);user-select:none;width:100%;padding:0 var(--spacer-3);border-radius:var(--radius-medium);display:block;position:relative}fig-layer:has(fig-layer)>.fig-layer-row>.fig-layer-chevron{visibility:visible}fig-layer>.fig-layer-row{align-items:center;gap:var(--spacer-1);padding:var(--spacer-1) var(--spacer-2);height:var(--spacer-4);border-radius:var(--radius-medium);display:flex;position:relative}fig-layer>.fig-layer-row .fig-layer-chevron{mask-image:var(--icon-16-chevron);visibility:hidden;background:var(--figma-color-text-tertiary);width:var(--spacer-3);height:var(--spacer-3);left:calc(var(--spacer-3) * -1);top:var(--spacer-1);flex-shrink:0;transition:transform .15s;display:flex;position:absolute;rotate:-90deg;mask-position:50%;mask-size:contain;mask-repeat:no-repeat}fig-layer>.fig-layer-row:hover{background:var(--figma-color-bg-secondary)}fig-layer>.fig-layer-row:hover .fig-layer-actions{opacity:1}fig-layer>.fig-layer-row .fig-layer-icon{width:var(--spacer-3);height:var(--spacer-3);color:var(--figma-color-icon-tertiary);margin-left:calc(var(--spacer-1) * -1);flex-shrink:0}fig-layer>.fig-layer-row>label{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--figma-color-text);flex:1;overflow:hidden}fig-layer .fig-layer-actions{margin-right:calc(-1 * var(--spacer-1));opacity:0;flex-shrink:0;gap:0;transition:opacity .15s;display:flex}fig-layer .fig-layer-actions>*{flex-shrink:0}fig-layer>fig-layer{margin-top:1px;padding:0}fig-layer>fig-layer .fig-layer-row{padding-left:var(--indent)}fig-layer:not([open])>fig-layer,fig-layer[open=false]>fig-layer{display:none}fig-layer[open]:not([open=false])>.fig-layer-row>.fig-layer-chevron{rotate:0deg}fig-layer[visible=false]>.fig-layer-row>label{color:var(--figma-color-text-tertiary)}fig-layer[selected]:not([selected=false])>.fig-layer-row{background:var(--figma-color-bg-selected)}fig-layer[selected]:not([selected=false])>.fig-layer-row>.fig-layer-icon{color:var(--figma-color-icon)}:root,:host{--icon-24-eyedropper:url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.1592 5.65801C16.0376 4.78045 17.4621 4.78055 18.3408 5.65899L18.4951 5.82989C19.1671 6.65442 19.168 7.84476 18.4951 8.66973L18.3408 8.84063L16.6455 10.533C17.1104 11.083 17.1181 11.889 16.6641 12.4461L16.5605 12.5604C16.0111 13.1097 15.1425 13.1428 14.5537 12.6629L14.5342 12.6453L10.0908 17.0916C9.6188 17.5633 8.98876 17.7764 8.375 17.742L7.56055 18.5574C6.97441 19.1432 6.02451 19.1422 5.43945 18.5584V18.5574C4.8538 17.9718 4.85405 17.0221 5.43945 16.4363L6.25586 15.618C6.22412 15.0058 6.44026 14.3794 6.90918 13.91L11.3516 9.46367C10.856 8.87434 10.885 7.99381 11.4395 7.43926L11.5537 7.33574C12.1094 6.88283 12.9136 6.88854 13.4639 7.35137L15.1592 5.65801ZM7.61621 14.617C7.33755 14.8961 7.21782 15.2747 7.25781 15.6385C7.27925 15.8351 7.24419 16.0445 7.10449 16.1844L6.14648 17.1434C5.9516 17.3387 5.95135 17.6553 6.14648 17.8504C6.34167 18.0449 6.65842 18.0451 6.85352 17.8504L7.80859 16.8943C7.94931 16.7536 8.16065 16.7184 8.3584 16.741C8.72329 16.7828 9.10374 16.6643 9.38379 16.3846L13.8223 11.9432L12.0547 10.1756L7.61621 14.617ZM17.6338 6.36602C17.1458 5.87828 16.3544 5.8783 15.8662 6.36602L14.084 8.14629L14.0186 8.20586C13.6767 8.48476 13.1722 8.46484 12.8535 8.14629C12.6583 7.95131 12.3417 7.95119 12.1465 8.14629C11.9514 8.34148 11.9515 8.65808 12.1465 8.85332L15.1465 11.8533C15.3175 12.024 15.5814 12.0451 15.7754 11.9168L15.8535 11.8533C16.0486 11.6582 16.0484 11.3416 15.8535 11.1463V11.1453C15.8524 11.1443 15.8507 11.1434 15.8496 11.1424C15.5128 10.8013 15.514 10.2513 15.8535 9.91192L17.6338 8.1336C18.1216 7.6457 18.1213 6.85425 17.6338 6.36602Z' fill='black' fill-opacity='0.9'/%3E%3C/svg%3E")}fig-interpolation-swatch{width:1.5rem;height:1.5rem;color:var(--figma-color-bordertranslucent);flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative;overflow:visible;&[size=large]{width:2rem;height:2rem;& .fig-interpolation-swatch-svg,& .fig-interpolation-swatch-fill{width:1.25rem;height:1.25rem}}& .fig-interpolation-swatch-svg{width:1rem;height:1rem;display:block;overflow:visible}& .fig-interpolation-swatch-fill{background:linear-gradient(90deg,red,#4f9eff);width:1rem;height:1rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}}dialog[is=fig-toast]{--fig-toast-bg-color:var(--figma-color-bg);--z-index:999999;contain:none;z-index:var(--z-index);box-shadow:var(--figma-elevation-100);border-radius:var(--radius-large);padding:var(--spacer-2) var(--spacer-3);align-items:center;gap:var(--spacer-2-5);min-width:0;height:2.5rem;color:var(--figma-color-text);background-color:var(--fig-toast-bg-color);flex-wrap:nowrap;justify-content:center;&[icon]{&>fig-icon:first-child{margin-inline:calc(var(--spacer-2) * -1)}}&>fig-spinner:first-child{margin-inline:calc(var(--spacer-2) * -1)}&[open]:not([open=false]){flex-direction:row;display:flex}& p{color:inherit;font-weight:var(--body-medium-strong-fontWeight);margin:0;padding:0}& hr[vertical]{margin:0}&>fig-separator[data-fig-toast-dismiss-separator]{--fig-separator-color:var(--figma-color-bordertranslucent);flex:none;align-self:stretch;margin:0}& fig-button:last-child{margin-inline:calc(var(--spacer-2) * -1);margin-left:calc(var(--spacer-1) * -1)}&>fig-icon[data-fig-toast-icon]{--size:var(--spacer-4);flex:none}&>fig-button[data-fig-toast-dismiss]{flex:none}&[theme=dark]{color-scheme:dark}&[theme=light]{color-scheme:light}&[theme=danger]{background-color:var(--figma-color-bg-danger);color-scheme:dark}&[theme=brand]{background-color:var(--figma-color-bg-brand);color-scheme:dark}&[theme=success]{background-color:var(--figma-color-bg-success);color-scheme:dark}}fig-fill-picker{display:contents;&>[slot^=mode-]{display:none}}.fig-fill-picker-dialog{contain:layout;width:240px;padding:0;& fig-tab{padding:var(--spacer-1) var(--spacer-1);font-size:.6875rem}&>fig-content{padding-bottom:var(--spacer-2-5)}& .fig-fill-picker-close{margin-left:auto}& .fig-fill-picker-tab{display:none;&:first-child{display:block}}& fig-preview{overflow:visible}& .fig-fill-picker-color-area{aspect-ratio:1;width:calc(100% - var(--spacer-3) * 2);margin:var(--spacer-2) var(--spacer-3);&>:not(fig-handle){border-radius:inherit;place-self:center;width:100%;height:100%}& canvas{border-radius:var(--radius-medium);width:100%;height:100%}}& .fig-fill-picker-color-area fig-handle{z-index:1}& .fig-fill-picker-sliders{grid-template-columns:calc(3.5rem + var(--spacer-3)) 1fr;padding-right:var(--spacer-3);align-items:center;gap:var(--spacer-2);padding-bottom:var(--spacer-1);grid-template-rows:1fr 1fr;display:grid;& .fig-fill-picker-eyedropper{margin-right:calc(var(--spacer-3) * -1);aspect-ratio:1;grid-area:1/1/3;place-self:center;width:3.5rem;height:3.5rem}& fig-slider{grid-column:2;min-width:0}&.is-hue-only{grid-template-rows:1fr;& .fig-fill-picker-eyedropper{width:auto;height:var(--spacer-4);aspect-ratio:auto;grid-row:1}}}& .fig-fill-picker-inputs{&:not([direction=vertical]):not(:has(>label)){grid-template-columns:var(--fig-field-left-padding) 3.5rem var(--spacer-2) minmax(0, 1fr) var(--fig-field-right-padding)}& .fig-fill-picker-input-mode{flex-shrink:0;align-self:center;width:3.5rem}& .fig-fill-picker-input-fields{width:100%;min-width:0;display:flex;& .input-combo{flex:1;min-width:0;& fig-input-number>input,& fig-input-text:not(.fig-fill-picker-ci-hex)>input{text-align:center;padding-inline:0}}& fig-input-text{flex:1;min-width:0}& .fig-fill-picker-ci-css{font-variant-numeric:tabular-nums}& .fig-fill-picker-ci-hex-row{& .fig-fill-picker-ci-hex{flex:auto;min-width:0}& .fig-fill-picker-ci-a{flex:0 0 3rem}}& .fig-fill-picker-ci-a{flex:0 0 2.75rem;min-width:2.75rem}}}& .fig-fill-picker-gradient-preview{aspect-ratio:auto;width:calc(100% - var(--spacer-3) * 2);margin:var(--spacer-2) var(--spacer-3);margin-top:calc(var(--spacer-4) + var(--spacer-1));background:0 0;margin-bottom:0;&:after{display:none}}& fig-field.fig-fill-picker-gradient-header{grid-template-columns:unset;grid-template-areas:unset;padding-right:var(--spacer-2);padding-left:var(--spacer-3);align-items:center;gap:var(--spacer-2);display:flex;&>:not(.fig-field-chevron):not(label){grid-area:unset}& .fig-fill-picker-gradient-type{flex:0 auto;width:auto;min-width:0;display:flex}& .fig-fill-picker-gradient-actions{align-items:center;gap:var(--spacer-1);flex-shrink:0;margin-left:auto;display:flex}}& .fig-fill-picker-gradient-stops{& .fig-fill-picker-gradient-stops-header{&>span{flex:1}}}& fig-field.fig-fill-picker-gradient-interpolation-field{grid-template-columns:unset;grid-template-areas:unset;padding-left:var(--spacer-3);padding-right:var(--spacer-2);align-items:center;gap:var(--spacer-1);display:flex;&>:not(.fig-field-chevron):not(label){grid-area:unset}}& .fig-fill-picker-gradient-interpolation-modes{flex:auto;min-width:0;& fig-interpolation-swatch{pointer-events:none}}& .fig-fill-picker-gradient-interpolation-more{flex:none;display:inline-flex;position:relative;&>fig-button{pointer-events:none}& .fig-fill-picker-gradient-space{opacity:0;width:100%;position:absolute;inset:0}&:has(.fig-fill-picker-gradient-space:hover)>fig-button,&:has(.fig-fill-picker-gradient-space[open])>fig-button{background-color:var(--figma-color-bg-transparent-hover)}&:has(.fig-fill-picker-gradient-space:focus-within)>fig-button{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}}& .fig-fill-picker-gradient-space{&::part(prepend){display:none}& fig-select-option{min-height:3rem;&:hover:before,&:focus-visible:before{background-color:var(--figma-color-bg-tertiary)}}& .fig-fill-picker-gradient-interpolation-label{flex-direction:column;justify-content:center;min-width:0;line-height:1.25;display:flex}& .fig-fill-picker-gradient-interpolation-title,& .fig-fill-picker-gradient-interpolation-subtitle{text-overflow:ellipsis;display:block;overflow:hidden}& .fig-fill-picker-gradient-interpolation-subtitle{color:var(--figma-color-text-tertiary)}& fig-select-options.fig-fill-picker-gradient-interpolation-collapsed{overflow:hidden}}& .fig-fill-picker-gradient-stops-list{gap:var(--spacer-1);flex-direction:column;display:flex;& fig-reorder{display:contents}}& .fig-fill-picker-gradient-stop-row{padding-right:var(--spacer-2);padding-left:var(--spacer-3);gap:var(--spacer-2);display:flex;&.dragging{background-color:var(--figma-color-bg-selected)}&>.fig-fill-picker-stop-position{flex:0 3rem;width:3rem;min-width:0}& .fig-fill-picker-stop-color{flex:1;min-width:0;& fig-input-text{min-width:0}}& .fig-fill-picker-stop-remove{flex-shrink:0}}& fig-field.fig-fill-picker-media-header{grid-template-columns:unset;grid-template-areas:unset;padding-left:var(--spacer-3);padding-right:var(--spacer-2);justify-content:space-between;align-items:center;gap:var(--spacer-2);display:flex;&>:not(.fig-field-chevron):not(label){grid-area:unset}& .fig-fill-picker-scale-mode{flex:none;width:4.5rem}& .fig-fill-picker-scale{flex:none;width:56px}& .fig-fill-picker-media-rotate{flex-shrink:0;margin-left:auto}}& .fig-fill-picker-media-preview{width:calc(100% - var(--spacer-3) * 2);margin:var(--spacer-2) var(--spacer-3) var(--spacer-1);border-radius:var(--radius-medium);position:relative;&.dragover{outline:2px dashed var(--figma-color-border-brand);outline-offset:-2px}&.has-media{& fig-button{visibility:hidden}&:hover{& fig-button{visibility:visible}}}}& fig-image.fig-fill-picker-media-preview{aspect-ratio:1;justify-content:center;align-items:center;display:flex;overflow:hidden}& .fig-fill-picker-checkerboard{background-image:linear-gradient(45deg, var(--figma-color-bg-tertiary) 25%, transparent 25%), linear-gradient(-45deg, var(--figma-color-bg-tertiary) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--figma-color-bg-tertiary) 75%), linear-gradient(-45deg, transparent 75%, var(--figma-color-bg-tertiary) 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;position:absolute;inset:0}& div.fig-fill-picker-image-preview{width:100%;height:100%;display:none;position:absolute;inset:0}& fig-image.fig-fill-picker-image-preview{width:auto;max-width:none;max-height:none}& video.fig-fill-picker-video-preview{object-fit:cover;width:100%;height:100%;display:none;position:absolute;inset:0}& fig-media.fig-fill-picker-video-preview{aspect-ratio:unset;max-width:none;max-height:none;width:calc(100% - var(--spacer-3) * 2);align-items:stretch;gap:var(--spacer-2);flex-direction:column;display:flex;overflow:visible;&>fig-preview{aspect-ratio:1;border-radius:var(--radius-medium);width:100%;max-width:none;overflow:hidden}}& .fig-fill-picker-upload{z-index:1;position:relative}& .fig-fill-picker-webcam-preview{aspect-ratio:1;width:calc(100% - var(--spacer-3) * 2);max-width:none;max-height:none;margin:0 var(--spacer-3);border-radius:var(--radius-medium);margin:var(--spacer-2) var(--spacer-3);display:flex;position:relative;overflow:hidden}& .fig-fill-picker-webcam-video{object-fit:cover;width:100%;height:100%}& .fig-fill-picker-webcam-status{background:var(--figma-color-bg-secondary);color:var(--figma-color-text-secondary);justify-content:center;align-items:center;font-size:.75rem;display:flex;position:absolute;inset:0}& .fig-fill-picker-webcam-controls{padding:0 var(--spacer-3);gap:var(--spacer-1);display:flex;& .fig-fill-picker-webcam-capture{width:100%}}}fig-select{min-width:0;height:var(--spacer-4);border-radius:var(--radius-medium);background-color:var(--figma-color-bg);color:var(--figma-color-text);box-shadow:inset 0 0 0 1px var(--figma-color-border);align-items:center;display:inline-flex;position:relative;&[full]:not([full=false]){width:100%;display:flex}&[disabled]:not([disabled=false]){pointer-events:none;color:var(--figma-color-text-tertiary);&:after{background-color:var(--figma-color-icon-disabled)}}&:after{content:"";width:1rem;height:1rem;mask-image:var(--icon-16-chevron);background-color:var(--figma-color-icon);pointer-events:none;z-index:1;position:absolute;top:50%;right:.25rem;transform:translateY(-50%);mask-position:50%;mask-size:contain;mask-repeat:no-repeat}}fig-select::part(listbox){--z-index:999999;--fig-popup-radius:var(--radius-large);--fig-popup-bg-color:var(--figma-color-bg-menu);z-index:var(--z-index);border-radius:var(--fig-popup-radius);background-color:var(--fig-popup-bg-color);color:var(--figma-color-text-menu);color-scheme:dark;box-shadow:var(--figma-elevation-400-menu-panel);border:0;outline:0;height:max-content;max-height:calc(100vh - 1rem);margin:0;padding:0;position:fixed;overflow:hidden}fig-select-options,.fig-menu-options{--fig-vertical-overflow-size:var(--spacer-4);box-sizing:border-box;scrollbar-width:none;flex-direction:column;gap:0;width:100%;max-width:100%;max-height:calc(100vh - 1rem);padding:0;display:flex;overflow:hidden auto;&::-webkit-scrollbar{display:none}&>:not(.fig-overflow){flex-shrink:0}&>:nth-child(1 of :not(.fig-overflow)){margin-top:var(--spacer-2)}&>:not(.fig-overflow):last-child,&>:not(.fig-overflow):has(+.fig-overflow-end){margin-bottom:var(--spacer-2)}&>.fig-overflow{flex:0 0 var(--fig-vertical-overflow-size);width:100%;height:var(--fig-vertical-overflow-size);z-index:3;color:var(--figma-color-text-menu);margin:0;position:sticky;left:0;background:var(--figma-color-bg-menu)!important;&:before{border-radius:0;inset:0;background:var(--figma-color-bg-menu)!important}&:hover:before{background:light-dark(#0000000f,#ffffff14)!important}&:hover{color:var(--figma-color-text-menu)}}&>.fig-overflow-start{order:-1;margin-block-end:calc(-1 * var(--fig-vertical-overflow-size));top:0;&:before{border-radius:var(--radius-large) var(--radius-large) 0 0}& .fig-overflow-chevron{rotate:180deg}}&>.fig-overflow-end{order:1;margin-block-start:calc(-1 * var(--fig-vertical-overflow-size));bottom:0;&:before{border-radius:0 0 var(--radius-large) var(--radius-large)}}}fig-select-options>:is(fig-separator,fig-menu-separator){&[label]:not([label=""]){--fig-menu-inline-padding:0 var(--spacer-2) 0 var(--spacer-5);&:before{margin-inline:unset;margin-left:calc(-1 * var(--spacer-5));margin-right:calc(-1 * var(--spacer-2))}}}fig-select-option{min-height:var(--spacer-4);height:auto;padding:var(--spacer-1) var(--spacer-2);padding-right:var(--spacer-3);border-radius:var(--radius-medium);color:var(--figma-color-text-menu);cursor:default;user-select:none;white-space:nowrap;align-items:center;gap:0;display:flex;position:relative;& h3{margin:0 0 var(--spacer-1) 0}&:before{content:"";inset:0 var(--spacer-2);border-radius:var(--radius-medium);z-index:-1;background-color:#0000;display:block;position:absolute}&:after{content:"";width:1rem;height:1rem;margin-left:var(--spacer-1);margin-right:var(--spacer-1);-webkit-mask-image:var(--icon-16-checkmark);mask-image:var(--icon-16-checkmark);visibility:hidden;background-color:currentColor;flex:0 0 1rem;order:-1;display:block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}&>[slot=prepend]{margin-top:calc(var(--spacer-1) * -1);margin-bottom:calc(var(--spacer-1) * -1);margin-right:var(--spacer-1)}&>:not([slot=prepend]):not([slot=append]){flex:auto;min-width:0}&>[slot=append]{color:var(--figma-color-text-tertiary);flex:none;margin-inline-start:auto}&:hover,&:focus-visible{outline:none;&:before{background-color:var(--figma-color-bg-menu-hover)}}&[selected]:not([selected=false]):after,&[aria-selected=true]:after{visibility:visible}&[disabled]:not([disabled=false]),&[aria-disabled=true]{opacity:.4;pointer-events:none}}
+fig-layer{--indent:var(--spacer-3);color:var(--figma-color-text);user-select:none;width:100%;padding:0 var(--spacer-3);border-radius:var(--radius-medium);display:block;position:relative}fig-layer:has(fig-layer)>.fig-layer-row>.fig-layer-chevron{visibility:visible}fig-layer>.fig-layer-row{align-items:center;gap:var(--spacer-1);padding:var(--spacer-1) var(--spacer-2);height:var(--spacer-4);border-radius:var(--radius-medium);display:flex;position:relative}fig-layer>.fig-layer-row .fig-layer-chevron{mask-image:var(--icon-16-chevron);visibility:hidden;background:var(--figma-color-text-tertiary);width:var(--spacer-3);height:var(--spacer-3);left:calc(var(--spacer-3) * -1);top:var(--spacer-1);flex-shrink:0;transition:transform .15s;display:flex;position:absolute;rotate:-90deg;mask-position:50%;mask-size:contain;mask-repeat:no-repeat}fig-layer>.fig-layer-row:hover{background:var(--figma-color-bg-secondary)}fig-layer>.fig-layer-row:hover .fig-layer-actions{opacity:1}fig-layer>.fig-layer-row .fig-layer-icon{width:var(--spacer-3);height:var(--spacer-3);color:var(--figma-color-icon-tertiary);margin-left:calc(var(--spacer-1) * -1);flex-shrink:0}fig-layer>.fig-layer-row>label{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--figma-color-text);flex:1;overflow:hidden}fig-layer .fig-layer-actions{margin-right:calc(-1 * var(--spacer-1));opacity:0;flex-shrink:0;gap:0;transition:opacity .15s;display:flex}fig-layer .fig-layer-actions>*{flex-shrink:0}fig-layer>fig-layer{margin-top:1px;padding:0}fig-layer>fig-layer .fig-layer-row{padding-left:var(--indent)}fig-layer:not([open])>fig-layer,fig-layer[open=false]>fig-layer{display:none}fig-layer[open]:not([open=false])>.fig-layer-row>.fig-layer-chevron{rotate:0deg}fig-layer[visible=false]>.fig-layer-row>label{color:var(--figma-color-text-tertiary)}fig-layer[selected]:not([selected=false])>.fig-layer-row{background:var(--figma-color-bg-selected)}fig-layer[selected]:not([selected=false])>.fig-layer-row>.fig-layer-icon{color:var(--figma-color-icon)}:root,:host{--icon-24-eyedropper:url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.1592 5.65801C16.0376 4.78045 17.4621 4.78055 18.3408 5.65899L18.4951 5.82989C19.1671 6.65442 19.168 7.84476 18.4951 8.66973L18.3408 8.84063L16.6455 10.533C17.1104 11.083 17.1181 11.889 16.6641 12.4461L16.5605 12.5604C16.0111 13.1097 15.1425 13.1428 14.5537 12.6629L14.5342 12.6453L10.0908 17.0916C9.6188 17.5633 8.98876 17.7764 8.375 17.742L7.56055 18.5574C6.97441 19.1432 6.02451 19.1422 5.43945 18.5584V18.5574C4.8538 17.9718 4.85405 17.0221 5.43945 16.4363L6.25586 15.618C6.22412 15.0058 6.44026 14.3794 6.90918 13.91L11.3516 9.46367C10.856 8.87434 10.885 7.99381 11.4395 7.43926L11.5537 7.33574C12.1094 6.88283 12.9136 6.88854 13.4639 7.35137L15.1592 5.65801ZM7.61621 14.617C7.33755 14.8961 7.21782 15.2747 7.25781 15.6385C7.27925 15.8351 7.24419 16.0445 7.10449 16.1844L6.14648 17.1434C5.9516 17.3387 5.95135 17.6553 6.14648 17.8504C6.34167 18.0449 6.65842 18.0451 6.85352 17.8504L7.80859 16.8943C7.94931 16.7536 8.16065 16.7184 8.3584 16.741C8.72329 16.7828 9.10374 16.6643 9.38379 16.3846L13.8223 11.9432L12.0547 10.1756L7.61621 14.617ZM17.6338 6.36602C17.1458 5.87828 16.3544 5.8783 15.8662 6.36602L14.084 8.14629L14.0186 8.20586C13.6767 8.48476 13.1722 8.46484 12.8535 8.14629C12.6583 7.95131 12.3417 7.95119 12.1465 8.14629C11.9514 8.34148 11.9515 8.65808 12.1465 8.85332L15.1465 11.8533C15.3175 12.024 15.5814 12.0451 15.7754 11.9168L15.8535 11.8533C16.0486 11.6582 16.0484 11.3416 15.8535 11.1463V11.1453C15.8524 11.1443 15.8507 11.1434 15.8496 11.1424C15.5128 10.8013 15.514 10.2513 15.8535 9.91192L17.6338 8.1336C18.1216 7.6457 18.1213 6.85425 17.6338 6.36602Z' fill='black' fill-opacity='0.9'/%3E%3C/svg%3E")}fig-interpolation-swatch{width:1.5rem;height:1.5rem;color:var(--figma-color-bordertranslucent);flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative;overflow:visible;&[size=large]{width:2rem;height:2rem;& .fig-interpolation-swatch-svg,& .fig-interpolation-swatch-fill{width:1.25rem;height:1.25rem}}& .fig-interpolation-swatch-svg{width:1rem;height:1rem;display:block;overflow:visible}& .fig-interpolation-swatch-fill{background:linear-gradient(90deg,red,#4f9eff);width:1rem;height:1rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}}dialog[is=fig-toast]{--fig-toast-bg-color:var(--figma-color-bg);--z-index:999999;contain:none;z-index:var(--z-index);box-shadow:var(--figma-elevation-100);border-radius:var(--radius-large);padding:var(--spacer-2) var(--spacer-3);align-items:center;gap:var(--spacer-2-5);min-width:0;height:2.5rem;color:var(--figma-color-text);background-color:var(--fig-toast-bg-color);flex-wrap:nowrap;justify-content:center;&[icon]{&>fig-icon:first-child{margin-inline:calc(var(--spacer-2) * -1)}}&>fig-spinner:first-child{margin-inline:calc(var(--spacer-2) * -1)}&[open]:not([open=false]){flex-direction:row;display:flex}& p{color:inherit;font-weight:var(--body-medium-strong-fontWeight);margin:0;padding:0}& hr[vertical]{margin:0}&>fig-separator[data-fig-toast-dismiss-separator]{--fig-separator-color:var(--figma-color-bordertranslucent);flex:none;align-self:stretch;margin:0}& fig-button:last-child{margin-inline:calc(var(--spacer-2) * -1);margin-left:calc(var(--spacer-1) * -1)}&>fig-icon[data-fig-toast-icon]{--size:var(--spacer-4);flex:none}&>fig-button[data-fig-toast-dismiss]{flex:none}&[theme=dark]{color-scheme:dark}&[theme=light]{color-scheme:light}&[theme=danger]{background-color:var(--figma-color-bg-danger);color-scheme:dark}&[theme=brand]{background-color:var(--figma-color-bg-brand);color-scheme:dark}&[theme=success]{background-color:var(--figma-color-bg-success);color-scheme:dark}}fig-fill-picker{display:contents;&>[slot^=mode-]{display:none}}.fig-fill-picker-dialog{contain:layout;width:240px;padding:0;& fig-tab{padding:var(--spacer-1) var(--spacer-1);font-size:.6875rem}&>fig-content{padding-bottom:var(--spacer-2-5)}& .fig-fill-picker-close{margin-left:auto}& .fig-fill-picker-tab{display:none;&:first-child{display:block}}& fig-preview{overflow:visible}& .fig-fill-picker-color-area{aspect-ratio:1;width:calc(100% - var(--spacer-3) * 2);margin:var(--spacer-2) var(--spacer-3);&>:not(fig-handle){border-radius:inherit;place-self:center;width:100%;height:100%}& canvas{border-radius:var(--radius-medium);width:100%;height:100%}}& .fig-fill-picker-color-area fig-handle{z-index:1}& .fig-fill-picker-sliders{grid-template-columns:calc(3.5rem + var(--spacer-3)) 1fr;padding-right:var(--spacer-3);align-items:center;gap:var(--spacer-2);padding-bottom:var(--spacer-1);grid-template-rows:1fr 1fr;display:grid;& .fig-fill-picker-eyedropper{margin-right:calc(var(--spacer-3) * -1);aspect-ratio:1;grid-area:1/1/3;place-self:center;width:3.5rem;height:3.5rem}& fig-slider{grid-column:2;min-width:0}&.is-hue-only{grid-template-rows:1fr;& .fig-fill-picker-eyedropper{width:auto;height:var(--spacer-4);aspect-ratio:auto;grid-row:1}}}& .fig-fill-picker-inputs{&:not([direction=vertical]):not(:has(>label)){grid-template-columns:var(--fig-field-left-padding) 3.5rem var(--spacer-2) minmax(0, 1fr) var(--fig-field-right-padding)}& .fig-fill-picker-input-mode{flex-shrink:0;align-self:center;width:3.5rem}& .fig-fill-picker-input-fields{width:100%;min-width:0;display:flex;& .input-combo{flex:1;min-width:0;& fig-input-number>input,& fig-input-text:not(.fig-fill-picker-ci-hex)>input{text-align:center;padding-inline:0}}& fig-input-text{flex:1;min-width:0}& .fig-fill-picker-ci-css{font-variant-numeric:tabular-nums}& .fig-fill-picker-ci-hex-row{& .fig-fill-picker-ci-hex{flex:auto;min-width:0}& .fig-fill-picker-ci-a{flex:0 0 3rem}}& .fig-fill-picker-ci-a{flex:0 0 2.75rem;min-width:2.75rem}}}& .fig-fill-picker-gradient-preview{aspect-ratio:auto;width:calc(100% - var(--spacer-3) * 2);margin:var(--spacer-2) var(--spacer-3);margin-top:calc(var(--spacer-4) + var(--spacer-1));background:0 0;margin-bottom:0;&:after{display:none}}& fig-field.fig-fill-picker-gradient-header{grid-template-columns:unset;grid-template-areas:unset;padding-right:var(--spacer-2);padding-left:var(--spacer-3);align-items:center;gap:var(--spacer-2);display:flex;&>:not(.fig-field-chevron):not(label){grid-area:unset}& .fig-fill-picker-gradient-type{flex:0 auto;width:auto;min-width:0;display:flex}& .fig-fill-picker-gradient-actions{align-items:center;gap:var(--spacer-1);flex-shrink:0;margin-left:auto;display:flex}}& .fig-fill-picker-gradient-stops{& .fig-fill-picker-gradient-stops-header{&>span{flex:1}}}& fig-field.fig-fill-picker-gradient-interpolation-field{grid-template-columns:unset;grid-template-areas:unset;padding-left:var(--spacer-3);padding-right:var(--spacer-2);align-items:center;gap:var(--spacer-1);display:flex;&>:not(.fig-field-chevron):not(label){grid-area:unset}}& .fig-fill-picker-gradient-interpolation-modes{flex:auto;min-width:0;& fig-interpolation-swatch{pointer-events:none}}& .fig-fill-picker-gradient-interpolation-more{flex:none;display:inline-flex;position:relative;&>fig-button{pointer-events:none}& .fig-fill-picker-gradient-space{opacity:0;width:100%;position:absolute;inset:0}&:has(.fig-fill-picker-gradient-space:hover)>fig-button,&:has(.fig-fill-picker-gradient-space[open])>fig-button{background-color:var(--figma-color-bg-transparent-hover)}&:has(.fig-fill-picker-gradient-space:focus-within)>fig-button{outline:var(--figma-focus-outline);outline-offset:var(--figma-focus-outline-offset)}}& .fig-fill-picker-gradient-space{&::part(prepend){display:none}& fig-select-option{min-height:3rem;&:hover:before,&:focus-visible:before{background-color:var(--figma-color-bg-tertiary)}}& .fig-fill-picker-gradient-interpolation-label{flex-direction:column;justify-content:center;min-width:0;line-height:1.25;display:flex}& .fig-fill-picker-gradient-interpolation-title,& .fig-fill-picker-gradient-interpolation-subtitle{text-overflow:ellipsis;display:block;overflow:hidden}& .fig-fill-picker-gradient-interpolation-subtitle{color:var(--figma-color-text-tertiary)}& fig-select-options.fig-fill-picker-gradient-interpolation-collapsed{overflow:hidden}}& .fig-fill-picker-gradient-stops-list{gap:var(--spacer-1);flex-direction:column;display:flex;& fig-reorder{display:contents}}& .fig-fill-picker-gradient-stop-row{padding-right:var(--spacer-2);padding-left:var(--spacer-3);gap:var(--spacer-2);display:flex;&.dragging{background-color:var(--figma-color-bg-selected)}&>.fig-fill-picker-stop-position{flex:0 3rem;width:3rem;min-width:0}& .fig-fill-picker-stop-color{flex:1;min-width:0;& fig-input-text{min-width:0}}& .fig-fill-picker-stop-remove{flex-shrink:0}}& fig-field.fig-fill-picker-media-header{grid-template-columns:unset;grid-template-areas:unset;padding-left:var(--spacer-3);padding-right:var(--spacer-2);justify-content:space-between;align-items:center;gap:var(--spacer-2);display:flex;&>:not(.fig-field-chevron):not(label){grid-area:unset}& .fig-fill-picker-scale-mode{flex:none;width:4.5rem}& .fig-fill-picker-scale{flex:none;width:56px}& .fig-fill-picker-media-rotate{flex-shrink:0;margin-left:auto}}& .fig-fill-picker-media-preview{width:calc(100% - var(--spacer-3) * 2);margin:var(--spacer-2) var(--spacer-3) var(--spacer-1);border-radius:var(--radius-medium);position:relative;&.dragover{outline:2px dashed var(--figma-color-border-brand);outline-offset:-2px}&.has-media{& fig-button{visibility:hidden}&:hover{& fig-button{visibility:visible}}}}& fig-image.fig-fill-picker-media-preview{aspect-ratio:1;justify-content:center;align-items:center;display:flex;overflow:hidden}& .fig-fill-picker-checkerboard{background-image:linear-gradient(45deg, var(--figma-color-bg-tertiary) 25%, transparent 25%), linear-gradient(-45deg, var(--figma-color-bg-tertiary) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--figma-color-bg-tertiary) 75%), linear-gradient(-45deg, transparent 75%, var(--figma-color-bg-tertiary) 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;position:absolute;inset:0}& div.fig-fill-picker-image-preview{width:100%;height:100%;display:none;position:absolute;inset:0}& fig-image.fig-fill-picker-image-preview{width:auto;max-width:none;max-height:none}& video.fig-fill-picker-video-preview{object-fit:cover;width:100%;height:100%;display:none;position:absolute;inset:0}& fig-media.fig-fill-picker-video-preview{aspect-ratio:unset;max-width:none;max-height:none;width:calc(100% - var(--spacer-3) * 2);align-items:stretch;gap:var(--spacer-2);flex-direction:column;display:flex;overflow:visible;&>fig-preview{aspect-ratio:1;border-radius:var(--radius-medium);width:100%;max-width:none;overflow:hidden}}& .fig-fill-picker-upload{z-index:1;position:relative}& .fig-fill-picker-webcam-preview{aspect-ratio:1;width:calc(100% - var(--spacer-3) * 2);max-width:none;max-height:none;margin:0 var(--spacer-3);border-radius:var(--radius-medium);margin:var(--spacer-2) var(--spacer-3);display:flex;position:relative;overflow:hidden}& .fig-fill-picker-webcam-video{object-fit:cover;width:100%;height:100%}& .fig-fill-picker-webcam-status{background:var(--figma-color-bg-secondary);color:var(--figma-color-text-secondary);justify-content:center;align-items:center;font-size:.75rem;display:flex;position:absolute;inset:0}& .fig-fill-picker-webcam-controls{padding:0 var(--spacer-3);gap:var(--spacer-1);display:flex;& .fig-fill-picker-webcam-capture{width:100%}}}fig-select{min-width:0;height:var(--spacer-4);border-radius:var(--radius-medium);background-color:var(--figma-color-bg);color:var(--figma-color-text);box-shadow:inset 0 0 0 1px var(--figma-color-border);align-items:center;display:inline-flex;position:relative;&[full]:not([full=false]){width:100%;display:flex}&[disabled]:not([disabled=false]){pointer-events:none;color:var(--figma-color-text-tertiary);&:after{background-color:var(--figma-color-icon-disabled)}}&[variant=ghost]{box-shadow:none;background-color:#0000;&:hover:not([disabled]):not([disabled=false]){background-color:var(--figma-color-bg-secondary)}}&:after{content:"";width:1rem;height:1rem;mask-image:var(--icon-16-chevron);background-color:var(--figma-color-icon);pointer-events:none;z-index:1;position:absolute;top:50%;right:.25rem;transform:translateY(-50%);mask-position:50%;mask-size:contain;mask-repeat:no-repeat}}fig-select::part(listbox){--z-index:999999;--fig-popup-radius:var(--radius-large);--fig-popup-bg-color:var(--figma-color-bg-menu);z-index:var(--z-index);border-radius:var(--fig-popup-radius);background-color:var(--fig-popup-bg-color);color:var(--figma-color-text-menu);color-scheme:dark;box-shadow:var(--figma-elevation-400-menu-panel);border:0;outline:0;height:max-content;max-height:calc(100vh - 1rem);margin:0;padding:0;position:fixed;overflow:hidden}fig-select-options>:is(fig-separator,fig-menu-separator){&[label]:not([label=""]){--fig-menu-inline-padding:0 var(--spacer-2) 0 var(--spacer-5);&:before{margin-inline:unset;margin-left:calc(-1 * var(--spacer-5));margin-right:calc(-1 * var(--spacer-2))}}}fig-select-option{min-height:var(--spacer-4);height:auto;padding:var(--spacer-1) var(--spacer-2);padding-right:var(--spacer-3);border-radius:var(--radius-medium);color:var(--figma-color-text-menu);cursor:default;user-select:none;white-space:nowrap;align-items:center;gap:0;display:flex;position:relative;& h3{margin:0 0 var(--spacer-1) 0}&:before{content:"";inset:0 var(--spacer-2);border-radius:var(--radius-medium);z-index:-1;background-color:#0000;display:block;position:absolute}&:after{content:"";width:1rem;height:1rem;margin-left:var(--spacer-1);margin-right:var(--spacer-1);-webkit-mask-image:var(--icon-16-checkmark);mask-image:var(--icon-16-checkmark);visibility:hidden;background-color:currentColor;flex:0 0 1rem;order:-1;display:block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}&>[slot=prepend]{margin-top:calc(var(--spacer-1) * -1);margin-bottom:calc(var(--spacer-1) * -1);margin-right:var(--spacer-1)}&>:not([slot=prepend]):not([slot=append]){flex:auto;min-width:0}&>[slot=append]{color:var(--figma-color-text-tertiary);flex:none;margin-inline-start:auto}&:hover,&:focus-visible{outline:none;&:before{background-color:var(--figma-color-bg-menu-hover)}}&[selected]:not([selected=false]):after,&[aria-selected=true]:after{visibility:visible}&[disabled]:not([disabled=false]),&[aria-disabled=true]{opacity:.4;pointer-events:none}}

package/dist/fig-editor.js

@@ -1,6 +1,6 @@
 import"./fig.js";import"./fig-lab.js";function A(j,J){if(!customElements.get(j))customElements.define(j,J)}function R(j,J){return j.hasAttribute(J)&&j.getAttribute(J)!=="false"}function m(){return Date.now().toString(36)+Math.random().toString(36).substring(2)}function F(j,J={}){let Q=document.createElement("fig-icon");if(j)Q.setAttribute("name",j);if(J.size)Q.setAttribute("size",J.size);if(J.className)Q.className=J.className;return Q}function v(j,J){let Q=(Z)=>{if(Z===null||Z===void 0||Z===!1)return;if(Array.isArray(Z)){Z.forEach(Q);return}j.append(Z instanceof Node?Z:String(Z))};return Q(J),j}function d(j,J={}){for(let[Q,Z]of Object.entries(J)){if(Z===null||Z===void 0||Z===!1)continue;if(Q==="className")j.className=String(Z);else if(Z===!0)j.setAttribute(Q,"");else j.setAttribute(Q,String(Z))}return j}function q(j,J,Q){let Z=document.createElement(j);return d(Z,J),v(Z,Q)}var c="http://www.w3.org/2000/svg";function u(j,J,Q){let Z=document.createElementNS(c,j);for(let[$,X]of Object.entries(J||{})){if(X===null||X===void 0||X===!1)continue;if($==="className")Z.setAttribute("class",String(X));else if(X===!0)Z.setAttribute($,"");else Z.setAttribute($,String(X))}return v(Z,Q)}function p(j){let J=String(j||"").replace(/^#/,"");return{r:parseInt(J.substring(0,2),16)||0,g:parseInt(J.substring(2,4),16)||0,b:parseInt(J.substring(4,6),16)||0}}function s(j,J,Q){let Z=j/255,$=J/255,X=Q/255,Y=Math.max(Z,$,X),W=Math.min(Z,$,X),U=(Y+W)/2;if(Y===W)return{h:0,s:0,l:U*100};let K=Y-W,O=U>0.5?K/(2-Y-W):K/(Y+W),z;switch(Y){case Z:z=(($-X)/K+($<X?6:0))/6;break;case $:z=((X-Z)/K+2)/6;break;default:z=((Z-$)/K+4)/6;break}return{h:z*360,s:O*100,l:U*100}}function S(j){let J=j/255;return J<=0.04045?J/12.92:Math.pow((J+0.055)/1.055,2.4)}function i(j,J,Q){let Z=S(j),$=S(J),X=S(Q),Y=Math.cbrt(0.4122214708*Z+0.5363325363*$+0.0514459929*X),W=Math.cbrt(0.2119034982*Z+0.6806995451*$+0.1073969566*X),U=Math.cbrt(0.0883024619*Z+0.2817188376*$+0.6299787005*X);return{l:0.2104542553*Y+0.793617785*W-0.0040720468*U,a:1.9779984951*Y-2.428592205*W+0.4505937099*U,b:0.0259040371*Y+0.7827717662*W-0.808675766*U}}function r(j,J,Q){return{l:j,c:Math.sqrt(J*J+Q*Q),h:Math.atan2(Q,J)*180/Math.PI}}function l({owner:j,onStart:J,onEnd:Q,startClass:Z="",endClass:$="",chevronClass:X="",startLabel:Y="Scroll back",endLabel:W="Scroll forward"}={}){let U=(K,O)=>{let z=document.createElement("button");if(z.type="button",z.className=["fig-overflow",`fig-overflow-${K}`,K==="start"?Z:$].filter(Boolean).join(" "),z.dataset.figOverflow=K,j)z.setAttribute(`data-fig-${j}-nav`,K);return z.setAttribute("tabindex","-1"),z.setAttribute("aria-label",K==="start"?Y:W),z.appendChild(F("chevron",{size:"small",className:["fig-overflow-chevron",X].filter(Boolean).join(" ")})),z.addEventListener("click",(f)=>{f.preventDefault(),f.stopPropagation(),O?.(f)}),z};return{start:U("start",J),end:U("end",Q)}}function x(j,J,Q="x",Z=2){if(!j||!J)return!1;let $=Q==="x",X=$?J.scrollWidth:J.scrollHeight,Y=$?J.clientWidth:J.clientHeight,W=$?J.scrollLeft:J.scrollTop,U=X-Y>Z,K=!U||W<=Z,O=!U||W+Y>=X-Z;return j.classList.toggle("overflow-start",!K),j.classList.toggle("overflow-end",!O),U}function w(j,J="x",Q=1){if(!j)return;let Z=J==="x",X=(Z?j.clientWidth:j.clientHeight)*0.8*Q;j.scrollBy({[Z?"left":"top"]:X,behavior:"smooth"})}function o(j,J,Q="y",Z="auto"){if(!j||!J||!j.contains(J))return;requestAnimationFrame(()=>{if(!j.isConnected||!J.isConnected)return;let $=Q==="x",X=$?j.scrollWidth:j.scrollHeight,Y=$?j.clientWidth:j.clientHeight;if(X<=Y+1){x(j,j,Q);return}let W=J.getBoundingClientRect(),U=j.getBoundingClientRect(),K=$?j.scrollLeft:j.scrollTop,O=($?W.left-U.left:W.top-U.top)+K,z=$?W.width:W.height,f=X-Y,L=Math.max(0,Math.min(O+z/2-Y/2,f));j.scrollTo({[$?"left":"top"]:L,behavior:Z}),x(j,j,Q)})}function n(j){let J=j||"";if(J.startsWith("["))try{let Z=JSON.parse(J);return Array.isArray(Z)?Z:[]}catch{}let Q=J.includes(`
 `)?`
-`:",";return J.split(Q).map((Z)=>Z.trim()).filter(Boolean)}function a(j){if(j&&typeof j==="object")return String(j.value??j.label??"");return String(j??"")}function t(j){if(j&&typeof j==="object")return String(j.label??j.value??"");return String(j??"")}class b extends HTMLElement{static get observedAttributes(){return["value","disabled","selected","label"]}get value(){let j=this.getAttribute("value");if(j!==null)return j;return(this.textContent||"").trim()}set value(j){if(j===null||j===void 0)this.removeAttribute("value");else this.setAttribute("value",String(j))}get disabled(){return R(this,"disabled")}set disabled(j){if(j)this.setAttribute("disabled","");else this.removeAttribute("disabled")}get selected(){return R(this,"selected")}set selected(j){if(j)this.setAttribute("selected","");else this.removeAttribute("selected")}connectedCallback(){if(!this.hasAttribute("role"))this.setAttribute("role","option");if(!this.hasAttribute("tabindex"))this.setAttribute("tabindex","-1");this.#Z()}attributeChangedCallback(j,J,Q){if(J===Q)return;if(j==="disabled")this.#Z()}#Z(){if(this.disabled)this.setAttribute("aria-disabled","true"),this.setAttribute("tabindex","-1");else if(this.removeAttribute("aria-disabled"),!this.hasAttribute("tabindex"))this.setAttribute("tabindex","-1")}}A("fig-select-option",b);class g extends HTMLElement{#Z=null;#$=null;#X=null;#Y=this.syncOverflow.bind(this);connectedCallback(){if(!this.hasAttribute("slot"))this.setAttribute("slot","panel");this.#j(),this.#_(),this.#k(),this.addEventListener("scroll",this.#Y,{passive:!0}),this.#X?.disconnect(),this.#X=new ResizeObserver(()=>this.syncOverflow()),this.#X.observe(this),requestAnimationFrame(()=>this.syncOverflow())}disconnectedCallback(){this.removeEventListener("scroll",this.#Y),this.#X?.disconnect(),this.#X=null,this.#K()}syncOverflow(){return this.#_(),x(this,this,"y")}scrollToOption(j,J="auto"){o(this,j,"y",J)}#j(){let j=this.querySelector(":scope > fig-chooser");if(!j)return;while(j.firstChild)this.insertBefore(j.firstChild,j);j.remove()}#_(){let j=Array.from(this.children).find((J)=>!J.hasAttribute("data-fig-select-nav"));if(j?.tagName==="FIG-SEPARATOR")j.setAttribute("borderless","")}#k(){if(this.#Z&&this.#$&&this.contains(this.#Z)&&this.contains(this.#$))return;this.#K();let j=l({owner:"select",startLabel:"Scroll up",endLabel:"Scroll down",onStart:()=>w(this,"y",-1),onEnd:()=>w(this,"y",1)});this.#Z=j.start,this.#$=j.end,this.prepend(this.#Z),this.append(this.#$)}#K(){this.#Z?.remove(),this.#$?.remove(),this.#Z=null,this.#$=null,this.classList.remove("overflow-start","overflow-end")}}A("fig-select-options",g);class h extends HTMLElement{#Z=null;#$=null;#X=null;#Y=null;#j=null;#_=null;#k=!1;#K=-1;#T=!1;#Q=!1;#f=null;#J=!1;#W=null;#O=null;#q=!1;#V=this.#kj.bind(this);#I=this.#Vj.bind(this);#L=this.#Nj.bind(this);#G=this.#b.bind(this);#M=this.#D.bind(this);#H=this.#Gj.bind(this);static get observedAttributes(){return["value","disabled","label","options","position","offset","closedby","open"]}get value(){return this.getAttribute("value")??""}set value(j){if(j===null||j===void 0)this.removeAttribute("value");else this.setAttribute("value",String(j))}get open(){return R(this,"open")}set open(j){if(j)this.setAttribute("open","");else this.removeAttribute("open")}connectedCallback(){if(!this.#k)this.#Jj();if(this.#B(),this.#C(),this.#Qj(),this.#zj(),this.#F(),this.#r(),this.#Lj(),this.open)this.#fj()}disconnectedCallback(){this.#E(),document.removeEventListener("keydown",this.#G,!0),this.#_?.disconnect(),this.#_=null}attributeChangedCallback(j,J,Q){if(J===Q||!this.#k)return;if(j==="options"){this.#C(),this.#F();return}if(j==="value"||j==="label"){this.#F();return}if(j==="disabled"){this.#Qj();return}if(j==="open"){if(Q===null||Q==="false")this.#Hj();else this.#fj();return}if(j==="position"||j==="offset"||j==="closedby")this.#zj()}focus(j){this.#Z?.focus(j)}blur(){this.#Z?.blur()}#N(j){return j?.nodeType===1&&(j.tagName==="FIG-SELECT-OPTION"||j.tagName==="FIG-SEPARATOR"||j.tagName==="FIG-SELECT-OPTIONS")}#B(){for(let j of this.querySelectorAll(":scope > fig-select-options"))if(!j.hasAttribute("slot"))j.setAttribute("slot","panel")}#R(){let J=(this.#j?.assignedElements({flatten:!0})??[]).find((Q)=>Q.tagName==="FIG-SELECT-OPTIONS");if(J)return J;return this.querySelector(":scope > fig-select-options")}#x(){return Boolean(this.querySelector(":scope > fig-select-option:not([data-fig-generated]), :scope > fig-select-options > fig-select-option:not([data-fig-generated])"))}#u(){let j=this.#R();if(j){if(!j.hasAttribute("slot"))j.setAttribute("slot","panel");return j}return j=document.createElement("fig-select-options"),j.setAttribute("slot","panel"),j.setAttribute("data-fig-generated",""),this.appendChild(j),j}#C(){if(this.#x())return;let j=this.hasAttribute("options"),J=j?this.#u():this.#R();if(!J)return;this.#q=!0;try{for(let $ of J.querySelectorAll(":scope > fig-select-option[data-fig-generated]"))$.remove();if(!j)return;let Q=n(this.getAttribute("options")),Z=J.querySelector(":scope > .fig-overflow-end");for(let $ of Q){let X=document.createElement("fig-select-option");if(X.setAttribute("data-fig-generated",""),X.setAttribute("value",a($)),X.textContent=t($),Z)J.insertBefore(X,Z);else J.appendChild(X)}}finally{this.#q=!1}}#Jj(){this.#k=!0;let j=this.attachShadow({mode:"open"}),J=document.createElement("style");J.textContent=`
+`:",";return J.split(Q).map((Z)=>Z.trim()).filter(Boolean)}function a(j){if(j&&typeof j==="object")return String(j.value??j.label??"");return String(j??"")}function t(j){if(j&&typeof j==="object")return String(j.label??j.value??"");return String(j??"")}class b extends HTMLElement{static get observedAttributes(){return["value","disabled","selected","label"]}get value(){let j=this.getAttribute("value");if(j!==null)return j;return(this.textContent||"").trim()}set value(j){if(j===null||j===void 0)this.removeAttribute("value");else this.setAttribute("value",String(j))}get disabled(){return R(this,"disabled")}set disabled(j){if(j)this.setAttribute("disabled","");else this.removeAttribute("disabled")}get selected(){return R(this,"selected")}set selected(j){if(j)this.setAttribute("selected","");else this.removeAttribute("selected")}connectedCallback(){if(!this.hasAttribute("role"))this.setAttribute("role","option");if(!this.hasAttribute("tabindex"))this.setAttribute("tabindex","-1");this.#Z()}attributeChangedCallback(j,J,Q){if(J===Q)return;if(j==="disabled")this.#Z()}#Z(){if(this.disabled)this.setAttribute("aria-disabled","true"),this.setAttribute("tabindex","-1");else if(this.removeAttribute("aria-disabled"),!this.hasAttribute("tabindex"))this.setAttribute("tabindex","-1")}}A("fig-select-option",b);class g extends HTMLElement{#Z=null;#$=null;#X=null;#Y=this.syncOverflow.bind(this);connectedCallback(){if(!this.hasAttribute("slot"))this.setAttribute("slot","panel");this.#j(),this.#_(),this.#k(),this.addEventListener("scroll",this.#Y,{passive:!0}),this.#X?.disconnect(),this.#X=new ResizeObserver(()=>this.syncOverflow()),this.#X.observe(this),requestAnimationFrame(()=>this.syncOverflow())}disconnectedCallback(){this.removeEventListener("scroll",this.#Y),this.#X?.disconnect(),this.#X=null,this.#K()}syncOverflow(){return this.#_(),x(this,this,"y")}scrollToOption(j,J="auto"){o(this,j,"y",J)}#j(){let j=this.querySelector(":scope > fig-chooser");if(!j)return;while(j.firstChild)this.insertBefore(j.firstChild,j);j.remove()}#_(){let j=Array.from(this.children).find((J)=>!J.hasAttribute("data-fig-select-nav"));if(j?.tagName==="FIG-SEPARATOR")j.setAttribute("borderless","")}#k(){if(this.#Z&&this.#$&&this.contains(this.#Z)&&this.contains(this.#$))return;this.#K();let j=l({owner:"select",startLabel:"Scroll up",endLabel:"Scroll down",onStart:()=>w(this,"y",-1),onEnd:()=>w(this,"y",1)});this.#Z=j.start,this.#$=j.end,this.prepend(this.#Z),this.append(this.#$)}#K(){this.#Z?.remove(),this.#$?.remove(),this.#Z=null,this.#$=null,this.classList.remove("overflow-start","overflow-end")}}A("fig-select-options",g);class h extends HTMLElement{#Z=null;#$=null;#X=null;#Y=null;#j=null;#_=null;#k=!1;#K=-1;#T=!1;#Q=!1;#f=null;#J=!1;#W=null;#O=null;#q=!1;#V=this.#kj.bind(this);#I=this.#Vj.bind(this);#L=this.#Nj.bind(this);#G=this.#b.bind(this);#M=this.#D.bind(this);#H=this.#Gj.bind(this);static get observedAttributes(){return["value","disabled","label","options","position","offset","closedby","open","variant"]}get value(){return this.getAttribute("value")??""}set value(j){if(j===null||j===void 0)this.removeAttribute("value");else this.setAttribute("value",String(j))}get open(){return R(this,"open")}set open(j){if(j)this.setAttribute("open","");else this.removeAttribute("open")}connectedCallback(){if(!this.#k)this.#Jj();if(this.#B(),this.#C(),this.#Qj(),this.#zj(),this.#F(),this.#r(),this.#Lj(),this.open)this.#fj()}disconnectedCallback(){this.#E(),document.removeEventListener("keydown",this.#G,!0),this.#_?.disconnect(),this.#_=null}attributeChangedCallback(j,J,Q){if(J===Q||!this.#k)return;if(j==="options"){this.#C(),this.#F();return}if(j==="value"||j==="label"){this.#F();return}if(j==="disabled"){this.#Qj();return}if(j==="open"){if(Q===null||Q==="false")this.#Hj();else this.#fj();return}if(j==="position"||j==="offset"||j==="closedby")this.#zj()}focus(j){this.#Z?.focus(j)}blur(){this.#Z?.blur()}#N(j){return j?.nodeType===1&&(j.tagName==="FIG-SELECT-OPTION"||j.tagName==="FIG-SEPARATOR"||j.tagName==="FIG-SELECT-OPTIONS")}#B(){for(let j of this.querySelectorAll(":scope > fig-select-options"))if(!j.hasAttribute("slot"))j.setAttribute("slot","panel")}#R(){let J=(this.#j?.assignedElements({flatten:!0})??[]).find((Q)=>Q.tagName==="FIG-SELECT-OPTIONS");if(J)return J;return this.querySelector(":scope > fig-select-options")}#x(){return Boolean(this.querySelector(":scope > fig-select-option:not([data-fig-generated]), :scope > fig-select-options > fig-select-option:not([data-fig-generated])"))}#u(){let j=this.#R();if(j){if(!j.hasAttribute("slot"))j.setAttribute("slot","panel");return j}return j=document.createElement("fig-select-options"),j.setAttribute("slot","panel"),j.setAttribute("data-fig-generated",""),this.appendChild(j),j}#C(){if(this.#x())return;let j=this.hasAttribute("options"),J=j?this.#u():this.#R();if(!J)return;this.#q=!0;try{for(let $ of J.querySelectorAll(":scope > fig-select-option[data-fig-generated]"))$.remove();if(!j)return;let Q=n(this.getAttribute("options")),Z=J.querySelector(":scope > .fig-overflow-end");for(let $ of Q){let X=document.createElement("fig-select-option");if(X.setAttribute("data-fig-generated",""),X.setAttribute("value",a($)),X.textContent=t($),Z)J.insertBefore(X,Z);else J.appendChild(X)}}finally{this.#q=!1}}#Jj(){this.#k=!0;let j=this.attachShadow({mode:"open"}),J=document.createElement("style");J.textContent=`
         :host {
           display: inline-flex;
           position: relative;