react-grab 0.0.59 → 0.0.60

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.
@@ -890,7 +890,7 @@ function cleanChildren(parent, current, marker, replacement) {
890
890
 
891
891
  // dist/styles.css
892
892
  var styles_default = `/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
893
- @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial;--tw-contain-size:initial;--tw-contain-layout:initial;--tw-contain-paint:initial;--tw-contain-style:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-black:#000;--color-white:#fff;--spacing:.25rem;--font-weight-medium:500;--radius-xs:.125rem;--ease-out:cubic-bezier(0,0,.2,1);--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-grab-pink:#b21c8e;--color-grab-purple:#d239c0;--color-label-tag-border:#730079;--color-label-gray-border:#b0b0b0}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.top-0{top:calc(var(--spacing)*0)}.left-0{left:calc(var(--spacing)*0)}.z-2147483645{z-index:2147483645}.z-2147483646{z-index:2147483646}.z-2147483647{z-index:2147483647}.z-\\[2147483645\\]{z-index:2147483645}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:calc(var(--spacing)*0)}.-ml-\\[2px\\]{margin-left:-2px}.ml-1{margin-left:calc(var(--spacing)*1)}.box-border{box-sizing:border-box}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-0{height:calc(var(--spacing)*0)}.h-4{height:calc(var(--spacing)*4)}.h-5{height:calc(var(--spacing)*5)}.h-5\\.5{height:calc(var(--spacing)*5.5)}.h-\\[9px\\]{height:9px}.h-\\[18px\\]{height:18px}.h-fit{height:fit-content}.min-h-0{min-height:calc(var(--spacing)*0)}.min-h-4{min-height:calc(var(--spacing)*4)}.w-0{width:calc(var(--spacing)*0)}.w-0\\.5{width:calc(var(--spacing)*.5)}.w-1{width:calc(var(--spacing)*1)}.w-2\\.5{width:calc(var(--spacing)*2.5)}.w-\\[18px\\]{width:18px}.w-auto{width:auto}.w-fit{width:fit-content}.w-full{width:100%}.flex-1{flex:1}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.-translate-x-1\\/2{--tw-translate-x:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.-translate-y-1\\/2{--tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.scale-75{--tw-scale-x:75%;--tw-scale-y:75%;--tw-scale-z:75%;scale:var(--tw-scale-x)var(--tw-scale-y)}.scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-pulse{animation:var(--animate-pulse)}.cursor-crosshair{cursor:crosshair}.cursor-pointer{cursor:pointer}.resize{resize:both}.resize-none{resize:none}.flex-col{flex-direction:column}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0\\.5{gap:calc(var(--spacing)*.5)}.gap-1{gap:calc(var(--spacing)*1)}.gap-\\[3px\\]{gap:3px}.gap-\\[5px\\]{gap:5px}.gap-px{gap:1px}.self-stretch{align-self:stretch}.overflow-hidden{overflow:hidden}.rounded-\\[1\\.5px\\]{border-radius:1.5px}.rounded-\\[1px\\]{border-radius:1px}.rounded-\\[3px\\]{border-radius:3px}.rounded-full{border-radius:3.40282e38px}.rounded-xs{border-radius:var(--radius-xs)}.rounded-t-none{border-top-left-radius:0;border-top-right-radius:0}.rounded-br-\\[3px\\]{border-bottom-right-radius:3px}.rounded-bl-\\[3px\\]{border-bottom-left-radius:3px}.border{border-style:var(--tw-border-style);border-width:1px}.border-\\[0\\.5px\\]{border-style:var(--tw-border-style);border-width:.5px}.\\[border-width\\:0\\.5px\\]{border-width:.5px}.\\[border-top-width\\:0\\.5px\\]{border-top-width:.5px}.border-none{--tw-border-style:none;border-style:none}.border-solid{--tw-border-style:solid;border-style:solid}.border-\\[\\#001D0E\\]{border-color:#001d0e}.border-\\[\\#00553269\\]{border-color:#00553269}.border-\\[\\#A3FFCA\\]{border-color:#a3ffca}.border-\\[\\#B3B3B3\\]{border-color:#b3b3b3}.border-grab-purple{border-color:var(--color-grab-purple)}.border-grab-purple\\/40{border-color:#d239c066}@supports (color:color-mix(in lab, red, red)){.border-grab-purple\\/40{border-color:color-mix(in oklab,var(--color-grab-purple)40%,transparent)}}.border-grab-purple\\/50{border-color:#d239c080}@supports (color:color-mix(in lab, red, red)){.border-grab-purple\\/50{border-color:color-mix(in oklab,var(--color-grab-purple)50%,transparent)}}.border-label-gray-border{border-color:var(--color-label-gray-border)}.border-label-tag-border{border-color:var(--color-label-tag-border)}.border-white{border-color:var(--color-white)}.border-t-\\[\\#B6B6B6\\]{border-top-color:#b6b6b6}.bg-\\[\\#A3FFCA\\]{background-color:#a3ffca}.bg-\\[\\#F2F2F2\\]{background-color:#f2f2f2}.bg-black{background-color:var(--color-black)}.bg-grab-pink{background-color:var(--color-grab-pink)}.bg-grab-purple\\/5{background-color:#d239c00d}@supports (color:color-mix(in lab, red, red)){.bg-grab-purple\\/5{background-color:color-mix(in oklab,var(--color-grab-purple)5%,transparent)}}.bg-grab-purple\\/8{background-color:#d239c014}@supports (color:color-mix(in lab, red, red)){.bg-grab-purple\\/8{background-color:color-mix(in oklab,var(--color-grab-purple)8%,transparent)}}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.bg-cover{background-size:cover}.bg-center{background-position:50%}.p-0{padding:calc(var(--spacing)*0)}.p-0\\.5{padding:calc(var(--spacing)*.5)}.px-0{padding-inline:calc(var(--spacing)*0)}.px-1\\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-\\[3px\\]{padding-inline:3px}.px-\\[5px\\]{padding-inline:5px}.py-0{padding-block:calc(var(--spacing)*0)}.py-1{padding-block:calc(var(--spacing)*1)}.py-\\[5px\\]{padding-block:5px}.py-px{padding-block:1px}.pt-1{padding-top:calc(var(--spacing)*1)}.pb-1\\.5{padding-bottom:calc(var(--spacing)*1.5)}.align-middle{vertical-align:middle}.font-\\[ui-monospace\\,\\'SFMono-Regular\\'\\,\\'SF_Mono\\'\\,\\'Menlo\\'\\,\\'Consolas\\'\\,\\'Liberation_Mono\\'\\,monospace\\]{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.text-\\[11\\.5px\\]{font-size:11.5px}.text-\\[12px\\]{font-size:12px}.leading-3\\.5{--tw-leading:calc(var(--spacing)*3.5);line-height:calc(var(--spacing)*3.5)}.leading-4{--tw-leading:calc(var(--spacing)*4);line-height:calc(var(--spacing)*4)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.tracking-\\[-0\\.04em\\]{--tw-tracking:-.04em;letter-spacing:-.04em}.tracking-\\[-0\\.08em\\]{--tw-tracking:-.08em;letter-spacing:-.08em}.text-\\[\\#0C0C0C\\]{color:#0c0c0c}.text-\\[\\#00381F\\]{color:#00381f}.text-\\[\\#47004A\\]{color:#47004a}.text-\\[\\#767676\\]{color:#767676}.text-\\[\\#A3FFCA\\]{color:#a3ffca}.text-black{color:var(--color-black)}.text-label-tag-border{color:var(--color-label-tag-border)}.text-white{color:var(--color-white)}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,)var(--tw-slashed-zero,)var(--tw-numeric-figure,)var(--tw-numeric-spacing,)var(--tw-numeric-fraction,)}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-100{opacity:1}.opacity-\\[0\\.99\\]{opacity:.99}.\\[box-shadow\\:\\#00000033_0px_2px_3px\\]{box-shadow:0 2px 3px #0003}.brightness-125{--tw-brightness:brightness(125%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\\[grid-template-rows\\]{transition-property:grid-template-rows;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\\[width\\,height\\]{transition-property:width,height;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-none{transition-property:none}.duration-30{--tw-duration:30ms;transition-duration:30ms}.duration-100{--tw-duration:.1s;transition-duration:.1s}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.will-change-\\[transform\\,width\\,height\\]{will-change:transform,width,height}.contain-layout{--tw-contain-layout:layout;contain:var(--tw-contain-size,)var(--tw-contain-layout,)var(--tw-contain-paint,)var(--tw-contain-style,)}.outline-none{--tw-outline-style:none;outline-style:none}.\\[font-synthesis\\:none\\]{font-synthesis:none}@media (hover:hover){.hover\\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x)var(--tw-scale-y)}.hover\\:opacity-80:hover{opacity:.8}.hover\\:opacity-100:hover{opacity:1}.hover\\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.react-grab-shimmer{position:relative;overflow:hidden}.react-grab-shimmer:after{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(90deg,#0000 0%,#fff6 50%,#0000 100%) 0 0/200% 100%;animation:1.5s ease-in-out infinite shimmer;position:absolute;inset:0}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-contain-size{syntax:"*";inherits:false}@property --tw-contain-layout{syntax:"*";inherits:false}@property --tw-contain-paint{syntax:"*";inherits:false}@property --tw-contain-style{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@keyframes pulse{50%{opacity:.5}}`;
893
+ @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial;--tw-contain-size:initial;--tw-contain-layout:initial;--tw-contain-paint:initial;--tw-contain-style:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-black:#000;--color-white:#fff;--spacing:.25rem;--font-weight-medium:500;--radius-xs:.125rem;--ease-out:cubic-bezier(0,0,.2,1);--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-grab-pink:#b21c8e;--color-grab-purple:#d239c0;--color-label-tag-border:#730079}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.top-0{top:calc(var(--spacing)*0)}.left-0{left:calc(var(--spacing)*0)}.z-2147483645{z-index:2147483645}.z-2147483646{z-index:2147483646}.z-2147483647{z-index:2147483647}.z-\\[2147483645\\]{z-index:2147483645}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:calc(var(--spacing)*0)}.-ml-\\[2px\\]{margin-left:-2px}.ml-1{margin-left:calc(var(--spacing)*1)}.box-border{box-sizing:border-box}.flex{display:flex}.grid{display:grid}.hidden{display:none}.size-fit{width:fit-content;height:fit-content}.h-0{height:calc(var(--spacing)*0)}.h-4{height:calc(var(--spacing)*4)}.h-5{height:calc(var(--spacing)*5)}.h-5\\.5{height:calc(var(--spacing)*5.5)}.h-\\[7px\\]{height:7px}.h-\\[9px\\]{height:9px}.h-\\[18px\\]{height:18px}.h-fit{height:fit-content}.min-h-0{min-height:calc(var(--spacing)*0)}.min-h-4{min-height:calc(var(--spacing)*4)}.w-0{width:calc(var(--spacing)*0)}.w-0\\.5{width:calc(var(--spacing)*.5)}.w-1{width:calc(var(--spacing)*1)}.w-2\\.5{width:calc(var(--spacing)*2.5)}.w-\\[7px\\]{width:7px}.w-auto{width:auto}.w-fit{width:fit-content}.w-full{width:100%}.max-w-\\[280px\\]{max-width:280px}.flex-1{flex:1}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.-translate-x-1\\/2{--tw-translate-x:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.-translate-y-1\\/2{--tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.scale-75{--tw-scale-x:75%;--tw-scale-y:75%;--tw-scale-z:75%;scale:var(--tw-scale-x)var(--tw-scale-y)}.scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-pulse{animation:var(--animate-pulse)}.cursor-crosshair{cursor:crosshair}.cursor-pointer{cursor:pointer}.resize{resize:both}.resize-none{resize:none}.flex-col{flex-direction:column}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0\\.5{gap:calc(var(--spacing)*.5)}.gap-1{gap:calc(var(--spacing)*1)}.gap-\\[3px\\]{gap:3px}.gap-\\[5px\\]{gap:5px}.gap-px{gap:1px}.self-stretch{align-self:stretch}.overflow-hidden{overflow:hidden}.rounded-\\[1\\.5px\\]{border-radius:1.5px}.rounded-\\[1px\\]{border-radius:1px}.rounded-full{border-radius:3.40282e38px}.rounded-xs{border-radius:var(--radius-xs)}.rounded-t-none{border-top-left-radius:0;border-top-right-radius:0}.rounded-b-xs{border-bottom-right-radius:var(--radius-xs);border-bottom-left-radius:var(--radius-xs)}.border{border-style:var(--tw-border-style);border-width:1px}.\\[border-width\\:0\\.5px\\]{border-width:.5px}.\\[border-top-width\\:0\\.5px\\]{border-top-width:.5px}.border-none{--tw-border-style:none;border-style:none}.border-solid{--tw-border-style:solid;border-style:solid}.border-\\[\\#B3B3B3\\]{border-color:#b3b3b3}.border-grab-purple{border-color:var(--color-grab-purple)}.border-grab-purple\\/40{border-color:#d239c066}@supports (color:color-mix(in lab, red, red)){.border-grab-purple\\/40{border-color:color-mix(in oklab,var(--color-grab-purple)40%,transparent)}}.border-grab-purple\\/50{border-color:#d239c080}@supports (color:color-mix(in lab, red, red)){.border-grab-purple\\/50{border-color:color-mix(in oklab,var(--color-grab-purple)50%,transparent)}}.border-label-tag-border{border-color:var(--color-label-tag-border)}.border-white{border-color:var(--color-white)}.border-t-\\[\\#D9D9D9\\]{border-top-color:#d9d9d9}.bg-\\[\\#F7F7F7\\]{background-color:#f7f7f7}.bg-black{background-color:var(--color-black)}.bg-grab-pink{background-color:var(--color-grab-pink)}.bg-grab-purple\\/5{background-color:#d239c00d}@supports (color:color-mix(in lab, red, red)){.bg-grab-purple\\/5{background-color:color-mix(in oklab,var(--color-grab-purple)5%,transparent)}}.bg-grab-purple\\/8{background-color:#d239c014}@supports (color:color-mix(in lab, red, red)){.bg-grab-purple\\/8{background-color:color-mix(in oklab,var(--color-grab-purple)8%,transparent)}}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.bg-cover{background-size:cover}.bg-center{background-position:50%}.p-0{padding:calc(var(--spacing)*0)}.p-1{padding:calc(var(--spacing)*1)}.px-0{padding-inline:calc(var(--spacing)*0)}.px-1\\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-\\[3px\\]{padding-inline:3px}.py-0{padding-block:calc(var(--spacing)*0)}.py-1{padding-block:calc(var(--spacing)*1)}.py-\\[3px\\]{padding-block:3px}.py-\\[5px\\]{padding-block:5px}.py-px{padding-block:1px}.pt-1{padding-top:calc(var(--spacing)*1)}.align-middle{vertical-align:middle}.font-\\[ui-monospace\\,\\'SFMono-Regular\\'\\,\\'SF_Mono\\'\\,\\'Menlo\\'\\,\\'Consolas\\'\\,\\'Liberation_Mono\\'\\,monospace\\]{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.text-\\[11\\.5px\\]{font-size:11.5px}.text-\\[12px\\]{font-size:12px}.leading-3\\.5{--tw-leading:calc(var(--spacing)*3.5);line-height:calc(var(--spacing)*3.5)}.leading-4{--tw-leading:calc(var(--spacing)*4);line-height:calc(var(--spacing)*4)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.tracking-\\[-0\\.04em\\]{--tw-tracking:-.04em;letter-spacing:-.04em}.tracking-\\[-0\\.08em\\]{--tw-tracking:-.08em;letter-spacing:-.08em}.whitespace-normal{white-space:normal}.text-\\[\\#0C0C0C\\]{color:#0c0c0c}.text-\\[\\#47004A\\]{color:#47004a}.text-\\[\\#767676\\]{color:#767676}.text-black{color:var(--color-black)}.text-label-tag-border{color:var(--color-label-tag-border)}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,)var(--tw-slashed-zero,)var(--tw-numeric-figure,)var(--tw-numeric-spacing,)var(--tw-numeric-fraction,)}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-100{opacity:1}.opacity-\\[0\\.99\\]{opacity:.99}.brightness-125{--tw-brightness:brightness(125%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.\\[filter\\:drop-shadow\\(0px_0px_4px_\\#51515180\\)\\]{filter:drop-shadow(0 0 4px #51515180)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\\[grid-template-rows\\]{transition-property:grid-template-rows;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\\[width\\,height\\]{transition-property:width,height;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-none{transition-property:none}.duration-30{--tw-duration:30ms;transition-duration:30ms}.duration-100{--tw-duration:.1s;transition-duration:.1s}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.will-change-\\[transform\\,width\\,height\\]{will-change:transform,width,height}.contain-layout{--tw-contain-layout:layout;contain:var(--tw-contain-size,)var(--tw-contain-layout,)var(--tw-contain-paint,)var(--tw-contain-style,)}.outline-none{--tw-outline-style:none;outline-style:none}.\\[font-synthesis\\:none\\]{font-synthesis:none}@media (hover:hover){.hover\\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x)var(--tw-scale-y)}.hover\\:opacity-100:hover{opacity:1}}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.react-grab-shimmer{position:relative;overflow:hidden}.react-grab-shimmer:after{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(90deg,#0000 0%,#fff6 50%,#0000 100%) 0 0/200% 100%;animation:1.5s ease-in-out infinite shimmer;position:absolute;inset:0}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-contain-size{syntax:"*";inherits:false}@property --tw-contain-layout{syntax:"*";inherits:false}@property --tw-contain-paint{syntax:"*";inherits:false}@property --tw-contain-style{syntax:"*";inherits:false}@keyframes pulse{50%{opacity:.5}}`;
894
894
 
895
895
  // src/utils/is-keyboard-event-triggered-by-input.ts
896
896
  var FORM_TAGS_AND_ROLES = [
@@ -3735,54 +3735,12 @@ var Crosshair = (props) => {
3735
3735
  });
3736
3736
  };
3737
3737
 
3738
- // src/components/icon-cursor-simple.tsx
3739
- var _tmpl$3 = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 12 12"fill=none><path fill-rule=evenodd clip-rule=evenodd d="M0.675576 0.0318497C0.491988 -0.0369956 0.285105 0.0078173 0.146461 0.146461C0.0078173 0.285105 -0.0369956 0.491988 0.0318497 0.675576L4.15685 11.6756C4.2337 11.8805 4.43492 12.0117 4.65345 11.9992C4.87197 11.9868 5.057 11.8336 5.11009 11.6213L6.41232 6.41232L11.6213 5.11009C11.8336 5.057 11.9868 4.87197 11.9992 4.65345C12.0117 4.43492 11.8805 4.2337 11.6756 4.15685L0.675576 0.0318497Z"fill=currentColor>`);
3740
- var IconCursorSimple = (props) => {
3741
- const size = () => props.size ?? 9;
3742
- return (() => {
3743
- var _el$ = _tmpl$3();
3744
- createRenderEffect((_p$) => {
3745
- var _v$ = size(), _v$2 = size(), _v$3 = props.class;
3746
- _v$ !== _p$.e && setAttribute(_el$, "width", _p$.e = _v$);
3747
- _v$2 !== _p$.t && setAttribute(_el$, "height", _p$.t = _v$2);
3748
- _v$3 !== _p$.a && setAttribute(_el$, "class", _p$.a = _v$3);
3749
- return _p$;
3750
- }, {
3751
- e: void 0,
3752
- t: void 0,
3753
- a: void 0
3754
- });
3755
- return _el$;
3756
- })();
3757
- };
3758
-
3759
3738
  // src/components/icon-open.tsx
3760
- var _tmpl$4 = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2><path d="M12 6H6a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-6"></path><path d="M11 13l9-9"></path><path d="M15 4h5v5">`);
3739
+ var _tmpl$3 = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2><path d="M12 6H6a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-6"></path><path d="M11 13l9-9"></path><path d="M15 4h5v5">`);
3761
3740
  var IconOpen = (props) => {
3762
3741
  const size = () => props.size ?? 12;
3763
3742
  return (() => {
3764
- var _el$ = _tmpl$4();
3765
- createRenderEffect((_p$) => {
3766
- var _v$ = size(), _v$2 = size(), _v$3 = props.class;
3767
- _v$ !== _p$.e && setAttribute(_el$, "width", _p$.e = _v$);
3768
- _v$2 !== _p$.t && setAttribute(_el$, "height", _p$.t = _v$2);
3769
- _v$3 !== _p$.a && setAttribute(_el$, "class", _p$.a = _v$3);
3770
- return _p$;
3771
- }, {
3772
- e: void 0,
3773
- t: void 0,
3774
- a: void 0
3775
- });
3776
- return _el$;
3777
- })();
3778
- };
3779
-
3780
- // src/components/icon-stop.tsx
3781
- var _tmpl$5 = /* @__PURE__ */ template(`<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 9 9"fill=none><rect x=1 y=1 width=7 height=7 rx=1 fill=currentColor>`);
3782
- var IconStop = (props) => {
3783
- const size = () => props.size ?? 9;
3784
- return (() => {
3785
- var _el$ = _tmpl$5();
3743
+ var _el$ = _tmpl$3();
3786
3744
  createRenderEffect((_p$) => {
3787
3745
  var _v$ = size(), _v$2 = size(), _v$3 = props.class;
3788
3746
  _v$ !== _p$.e && setAttribute(_el$, "width", _p$.e = _v$);
@@ -3799,27 +3757,22 @@ var IconStop = (props) => {
3799
3757
  };
3800
3758
 
3801
3759
  // src/components/selection-label.tsx
3802
- var _tmpl$6 = /* @__PURE__ */ template(`<div style="background-image:linear-gradient(in oklab 180deg, oklab(88.7% 0.086 -0.058) 0%, oklab(83.2% 0.132 -0.089) 100%)"><span>`);
3803
- var _tmpl$22 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center w-fit h-4 rounded-[1px] gap-1 px-[3px] [border-width:0.5px] border-solid border-[#B3B3B3] py-0"><span class="text-[#0C0C0C] text-[11.5px] leading-3.5 shrink-0 tracking-[-0.08em] font-[ui-monospace,'SFMono-Regular','SF_Mono','Menlo','Consolas','Liberation_Mono',monospace] w-fit h-fit">`);
3804
- var _tmpl$32 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center w-fit h-4 rounded-[1px] gap-1 px-[3px] [border-width:0.5px] border-solid border-[#00553269] py-0"><span class="text-[#00381F] text-[11.5px] leading-3.5 shrink-0 tracking-[-0.08em] font-[ui-monospace,'SFMono-Regular','SF_Mono','Menlo','Consolas','Liberation_Mono',monospace] w-fit h-fit">`);
3805
- var _tmpl$42 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center w-fit h-4 rounded-[1px] gap-1 px-[3px] [border-width:0.5px] border-solid border-white py-0"><span class="text-[#0C0C0C] text-[11.5px] leading-3.5 shrink-0 tracking-[-0.08em] font-[ui-monospace,'SFMono-Regular','SF_Mono','Menlo','Consolas','Liberation_Mono',monospace] w-fit h-fit">&gt;`);
3806
- var _tmpl$52 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center w-fit h-4 rounded-[1px] gap-1 px-[3px] [border-width:0.5px] border-solid border-[#A3FFCA] py-0"><span class="text-[#00381F] text-[11.5px] leading-3.5 shrink-0 tracking-[-0.08em] font-[ui-monospace,'SFMono-Regular','SF_Mono','Menlo','Consolas','Liberation_Mono',monospace] w-fit h-fit">&gt;`);
3807
- var _tmpl$62 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center w-fit h-4 rounded-[1px] gap-0.5 px-[3px] [border-width:0.5px] border-solid border-[#001D0E] py-0"style="background-image:linear-gradient(in oklab 180deg, oklab(39.6% -0.086 0.036) 0%, oklab(33.9% -0.074 0.031) 100%)"><span class="text-[#A3FFCA] text-[11.5px] leading-3.5 shrink-0 tracking-[-0.08em] font-[ui-monospace,'SFMono-Regular','SF_Mono','Menlo','Consolas','Liberation_Mono',monospace] w-fit h-fit">`);
3808
- var _tmpl$7 = /* @__PURE__ */ template(`<span>`);
3809
- var _tmpl$8 = /* @__PURE__ */ template(`<button>`);
3810
- var _tmpl$9 = /* @__PURE__ */ template(`<div>`);
3811
- var _tmpl$0 = /* @__PURE__ */ template(`<div class="absolute w-0 h-0"style="border-left:8px solid transparent;border-right:8px solid transparent">`);
3812
- var _tmpl$1 = /* @__PURE__ */ template(`<div role=button><div class="text-black text-[12px] leading-4 shrink-0 tracking-[-0.04em] font-sans font-medium w-fit h-fit">Copy`);
3813
- var _tmpl$10 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex flex-col items-start px-2 py-[5px] w-auto h-fit rounded-bl-[3px] rounded-br-[3px] self-stretch bg-[#F2F2F2] [border-top-width:0.5px] border-t-solid border-t-[#B6B6B6] rounded-t-none">`);
3814
- var _tmpl$11 = /* @__PURE__ */ template(`<div class="[font-synthesis:none] contain-layout shrink-0 flex items-center gap-1 rounded-xs bg-[#A3FFCA] antialiased w-fit h-fit py-1 px-1.5"><div class="contain-layout shrink-0 flex items-center px-0 py-px w-fit h-[18px] rounded-[1.5px] gap-[3px]"><div class="text-[#00381F] text-[12px] leading-4 shrink-0 tracking-[-0.04em] font-sans font-medium w-fit h-fit"></div></div><div class="contain-layout shrink-0 flex items-center gap-px w-fit h-fit">`);
3815
- var _tmpl$12 = /* @__PURE__ */ template(`<button class="flex items-center justify-center w-[18px] h-[18px] rounded-full cursor-pointer bg-black border-none transition-opacity hover:opacity-80"title=Stop>`);
3816
- var _tmpl$13 = /* @__PURE__ */ template(`<div class="flex items-center gap-[3px] react-grab-shimmer rounded-[3px] pt-1 pb-1.5 px-1.5">`);
3817
- var _tmpl$14 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center gap-px w-fit h-fit">`);
3818
- var _tmpl$15 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center gap-1 w-fit h-fit"><span class="text-[#767676] text-[12px] leading-4 shrink-0 tracking-[-0.04em] font-sans font-medium w-fit h-fit">Press</span><div class="contain-layout shrink-0 flex flex-col items-start rounded-xs bg-white [border-width:0.5px] border-solid border-white p-0.5 w-fit h-fit"style="box-shadow:#0000008C 0px 0px 2px"><div class="w-2.5 h-[9px] shrink-0 opacity-[0.99] bg-cover bg-center"style=background-image:url(https://workers.paper.design/file-assets/01K8D51Q7E2ESJTN18XN2MT96X/01KBEJ7N5GQ0ZZ7K456R42AP4V.svg)></div></div><span class="text-[#767676] text-[12px] leading-4 shrink-0 tracking-[-0.04em] font-sans font-medium w-fit h-fit">to Edit`);
3819
- var _tmpl$16 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex flex-col justify-center items-start gap-1 w-fit h-fit"><div class="contain-layout shrink-0 flex items-center gap-1 pt-1 w-fit h-fit px-1.5"></div><div class="grid w-full transition-[grid-template-rows] duration-30 ease-out"><div class="overflow-hidden min-h-0">`);
3820
- var _tmpl$17 = /* @__PURE__ */ template(`<div class="shrink-0 flex justify-between items-end w-full min-h-4"><textarea class="text-black text-[12px] leading-4 tracking-[-0.04em] font-medium bg-transparent border-none outline-none resize-none flex-1 p-0 m-0"placeholder="type to edit"rows=1 style=field-sizing:content;min-height:16px></textarea><button class="contain-layout shrink-0 flex flex-col items-start p-0.5 rounded-xs bg-white [border-width:0.5px] border-solid border-white w-fit h-fit cursor-pointer ml-1 transition-none hover:scale-105 hover:shadow-md"style="box-shadow:#0000008C 0px 0px 2px"><div style=background-image:url(https://workers.paper.design/file-assets/01K8D51Q7E2ESJTN18XN2MT96X/01KBEJ7N5GQ0ZZ7K456R42AP4V.svg)>`);
3821
- var _tmpl$18 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex flex-col justify-center items-start gap-1 w-fit h-fit"><div class="contain-layout shrink-0 flex items-center gap-1 pt-1 px-1.5 w-fit h-fit">`);
3822
- var _tmpl$19 = /* @__PURE__ */ template(`<div data-react-grab-ignore-events class="fixed font-sans antialiased transition-opacity duration-300 ease-out"style=z-index:2147483647><div class="[font-synthesis:none] contain-layout flex items-center gap-[5px] rounded-xs bg-white [box-shadow:#00000033_0px_2px_3px] antialiased w-fit h-fit p-0">`);
3760
+ var _tmpl$4 = /* @__PURE__ */ template(`<div style="background-image:linear-gradient(in oklab 180deg, oklab(88.7% 0.086 -0.058) 0%, oklab(83.2% 0.132 -0.089) 100%)"><span>`);
3761
+ var _tmpl$22 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center w-fit h-4 rounded-[1px] gap-1 px-[3px] [border-width:0.5px] border-solid border-[#B3B3B3] py-0 bg-[#F7F7F7]"><span class="text-[#0C0C0C] text-[11.5px] leading-3.5 shrink-0 tracking-[-0.08em] font-[ui-monospace,'SFMono-Regular','SF_Mono','Menlo','Consolas','Liberation_Mono',monospace] w-fit h-fit">`);
3762
+ var _tmpl$32 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center w-fit h-4 rounded-[1px] gap-1 px-[3px] [border-width:0.5px] border-solid border-white py-0"><span class="text-[#0C0C0C] text-[11.5px] leading-3.5 shrink-0 tracking-[-0.08em] font-[ui-monospace,'SFMono-Regular','SF_Mono','Menlo','Consolas','Liberation_Mono',monospace] w-fit h-fit">&gt;`);
3763
+ var _tmpl$42 = /* @__PURE__ */ template(`<div class="absolute w-0 h-0"style="border-left:8px solid transparent;border-right:8px solid transparent">`);
3764
+ var _tmpl$5 = /* @__PURE__ */ template(`<div role=button><div class="text-black text-[12px] leading-4 shrink-0 tracking-[-0.04em] font-sans font-medium w-fit h-fit">`);
3765
+ var _tmpl$6 = /* @__PURE__ */ template(`<div class="[font-synthesis:none] contain-layout shrink-0 flex flex-col items-start px-2 py-[5px] w-auto h-fit self-stretch [border-top-width:0.5px] border-t-solid border-t-[#D9D9D9] antialiased rounded-t-none rounded-b-xs"style="background-image:linear-gradient(in oklab 180deg, oklab(100% 0 0) 0%, oklab(96.1% 0 0) 5.92%)">`);
3766
+ var _tmpl$7 = /* @__PURE__ */ template(`<div class="[font-synthesis:none] contain-layout shrink-0 flex items-center gap-1 rounded-xs bg-white antialiased w-fit h-fit py-1 px-1.5"><div class="contain-layout shrink-0 flex items-center px-0 py-px w-fit h-[18px] rounded-[1.5px] gap-[3px]"><div class="text-black text-[12px] leading-4 shrink-0 tracking-[-0.04em] font-sans font-medium w-fit h-fit">`);
3767
+ var _tmpl$8 = /* @__PURE__ */ template(`<button class="contain-layout shrink-0 flex flex-col items-start rounded-xs bg-white [border-width:0.5px] border-solid border-[#B3B3B3] p-1 size-fit cursor-pointer ml-1 transition-none hover:scale-105"><div class="shrink-0 w-[7px] h-[7px] rounded-[1px] bg-black">`);
3768
+ var _tmpl$9 = /* @__PURE__ */ template(`<div class="shrink-0 flex justify-between items-end w-full min-h-4"><textarea class="text-black text-[12px] leading-4 tracking-[-0.04em] font-medium bg-transparent border-none outline-none resize-none flex-1 p-0 m-0 opacity-50"placeholder="type to edit"rows=1 disabled style=field-sizing:content;min-height:16px>`);
3769
+ var _tmpl$0 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex flex-col justify-center items-start gap-1 w-fit h-fit max-w-[280px]"><div class="contain-layout shrink-0 flex items-center gap-1 pt-1 px-1.5 w-auto h-fit"><div class="contain-layout flex items-center px-0 py-px w-auto h-fit rounded-[1.5px] gap-[3px]"><div class="text-black text-[12px] leading-4 tracking-[-0.04em] font-sans font-medium w-auto h-fit whitespace-normal react-grab-shimmer">`);
3770
+ var _tmpl$1 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center gap-px w-fit h-fit">`);
3771
+ var _tmpl$10 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex items-center gap-1 w-fit h-fit"><span class="text-[#767676] text-[12px] leading-4 shrink-0 tracking-[-0.04em] font-sans font-medium w-fit h-fit">Press</span><div class="contain-layout shrink-0 flex flex-col items-start px-[3px] py-[3px] rounded-xs bg-white [border-width:0.5px] border-solid border-[#B3B3B3] size-fit"><div class="w-2.5 h-[9px] shrink-0 opacity-[0.99] bg-cover bg-center"style=background-image:url(https://workers.paper.design/file-assets/01K8D51Q7E2ESJTN18XN2MT96X/01KBEJ7N5GQ0ZZ7K456R42AP4V.svg)></div></div><span class="text-[#767676] text-[12px] leading-4 shrink-0 tracking-[-0.04em] font-sans font-medium w-fit h-fit">to edit`);
3772
+ var _tmpl$11 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex flex-col justify-center items-start gap-1 w-fit h-fit"><div class="contain-layout shrink-0 flex items-center gap-1 pt-1 w-fit h-fit px-1.5"></div><div class="grid w-full transition-[grid-template-rows] duration-30 ease-out"><div class="overflow-hidden min-h-0">`);
3773
+ var _tmpl$12 = /* @__PURE__ */ template(`<div class="shrink-0 flex justify-between items-end w-full min-h-4"><textarea class="text-black text-[12px] leading-4 tracking-[-0.04em] font-medium bg-transparent border-none outline-none resize-none flex-1 p-0 m-0"placeholder="type to edit"rows=1 style=field-sizing:content;min-height:16px></textarea><button class="contain-layout shrink-0 flex flex-col items-start px-[3px] py-[3px] rounded-xs bg-white [border-width:0.5px] border-solid border-[#B3B3B3] size-fit cursor-pointer ml-1 transition-none hover:scale-105"><div style=background-image:url(https://workers.paper.design/file-assets/01K8D51Q7E2ESJTN18XN2MT96X/01KBEJ7N5GQ0ZZ7K456R42AP4V.svg)>`);
3774
+ var _tmpl$13 = /* @__PURE__ */ template(`<div class="contain-layout shrink-0 flex flex-col justify-center items-start gap-1 w-fit h-fit"><div class="contain-layout shrink-0 flex items-center gap-1 pt-1 px-1.5 w-fit h-fit">`);
3775
+ var _tmpl$14 = /* @__PURE__ */ template(`<div data-react-grab-ignore-events class="fixed font-sans antialiased transition-opacity duration-300 ease-out [filter:drop-shadow(0px_0px_4px_#51515180)]"style=z-index:2147483647><div class="[font-synthesis:none] contain-layout flex items-center gap-[5px] rounded-xs bg-white antialiased w-fit h-fit p-0">`);
3823
3776
  var ARROW_HEIGHT = 8;
3824
3777
  var LABEL_GAP = 4;
3825
3778
  var IDLE_TIMEOUT_MS = 400;
@@ -3834,7 +3787,7 @@ var TagBadge = (props) => {
3834
3787
  props.onHoverChange?.(false);
3835
3788
  };
3836
3789
  return (() => {
3837
- var _el$ = _tmpl$6(), _el$2 = _el$.firstChild;
3790
+ var _el$ = _tmpl$4(), _el$2 = _el$.firstChild;
3838
3791
  addEventListener(_el$, "click", props.onClick);
3839
3792
  _el$.addEventListener("mouseleave", handleMouseLeave);
3840
3793
  _el$.addEventListener("mouseenter", handleMouseEnter);
@@ -3869,46 +3822,12 @@ var ParentBadge = (props) => (() => {
3869
3822
  insert(_el$4, () => props.name);
3870
3823
  return _el$3;
3871
3824
  })();
3872
- var CopiedParentBadge = (props) => (() => {
3873
- var _el$5 = _tmpl$32(), _el$6 = _el$5.firstChild;
3874
- insert(_el$6, () => props.name);
3875
- return _el$5;
3876
- })();
3877
- var ChevronSeparator = () => _tmpl$42();
3878
- var CopiedChevronSeparator = () => _tmpl$52();
3879
- var CopiedTagBadge = (props) => (() => {
3880
- var _el$9 = _tmpl$62(), _el$0 = _el$9.firstChild;
3881
- insert(_el$0, () => props.tagName);
3882
- return _el$9;
3883
- })();
3884
- var ActionPill = (props) => {
3885
- const baseClass = cn("flex items-center h-[18px] rounded-[1.5px] gap-[3px] px-[5px] py-px border-[0.5px] border-solid border-label-gray-border", props.shrink && "shrink-0 w-fit", props.asButton && "cursor-pointer bg-transparent", props.dimmed && "opacity-50 hover:opacity-100 transition-opacity");
3886
- const content = [memo(() => props.icon), (() => {
3887
- var _el$1 = _tmpl$7();
3888
- insert(_el$1, () => props.label);
3889
- createRenderEffect(() => className(_el$1, cn("text-black text-[12px] leading-4 font-medium tracking-[-0.04em]", props.shrink && "shrink-0 w-fit h-fit")));
3890
- return _el$1;
3891
- })()];
3892
- return props.asButton ? (() => {
3893
- var _el$10 = _tmpl$8();
3894
- addEventListener(_el$10, "click", props.onClick);
3895
- className(_el$10, baseClass);
3896
- insert(_el$10, content);
3897
- return _el$10;
3898
- })() : (() => {
3899
- var _el$11 = _tmpl$9();
3900
- addEventListener(_el$11, "click", props.onClick);
3901
- className(_el$11, baseClass);
3902
- insert(_el$11, content);
3903
- createRenderEffect(() => setAttribute(_el$11, "role", props.onClick ? "button" : void 0));
3904
- return _el$11;
3905
- })();
3906
- };
3825
+ var ChevronSeparator = () => _tmpl$32();
3907
3826
  var Arrow = (props) => {
3908
3827
  const arrowColor = () => props.color ?? "white";
3909
3828
  return (() => {
3910
- var _el$12 = _tmpl$0();
3911
- createRenderEffect((_$p) => style(_el$12, {
3829
+ var _el$6 = _tmpl$42();
3830
+ createRenderEffect((_$p) => style(_el$6, {
3912
3831
  left: `${props.leftPx}px`,
3913
3832
  ...props.position === "bottom" ? {
3914
3833
  top: "0",
@@ -3923,19 +3842,20 @@ var Arrow = (props) => {
3923
3842
  "border-top": `8px solid ${arrowColor()}`
3924
3843
  }
3925
3844
  }, _$p));
3926
- return _el$12;
3845
+ return _el$6;
3927
3846
  })();
3928
3847
  };
3929
3848
  var ClickToCopyPill = (props) => (() => {
3930
- var _el$13 = _tmpl$1();
3931
- addEventListener(_el$13, "click", props.onClick);
3932
- createRenderEffect(() => className(_el$13, cn("contain-layout shrink-0 flex items-center px-0 py-px w-fit h-[18px] rounded-[1.5px] gap-[3px]", props.asButton && "cursor-pointer", props.dimmed && "opacity-50 hover:opacity-100 transition-opacity")));
3933
- return _el$13;
3849
+ var _el$7 = _tmpl$5(), _el$8 = _el$7.firstChild;
3850
+ addEventListener(_el$7, "click", props.onClick);
3851
+ insert(_el$8, () => props.hasParent ? "Copy" : "Click to copy");
3852
+ createRenderEffect(() => className(_el$7, cn("contain-layout shrink-0 flex items-center px-0 py-px w-fit h-[18px] rounded-[1.5px] gap-[3px]", props.asButton && "cursor-pointer", props.dimmed && "opacity-50 hover:opacity-100 transition-opacity")));
3853
+ return _el$7;
3934
3854
  })();
3935
3855
  var BottomSection = (props) => (() => {
3936
- var _el$14 = _tmpl$10();
3937
- insert(_el$14, () => props.children);
3938
- return _el$14;
3856
+ var _el$9 = _tmpl$6();
3857
+ insert(_el$9, () => props.children);
3858
+ return _el$9;
3939
3859
  })();
3940
3860
  var SelectionLabel = (props) => {
3941
3861
  let containerRef;
@@ -4031,9 +3951,10 @@ var SelectionLabel = (props) => {
4031
3951
  const viewportWidth = window.innerWidth;
4032
3952
  const viewportHeight = window.innerHeight;
4033
3953
  const selectionCenterX = bounds.x + bounds.width / 2;
3954
+ const cursorX = props.mouseX ?? selectionCenterX;
4034
3955
  const selectionBottom = bounds.y + bounds.height;
4035
3956
  const selectionTop = bounds.y;
4036
- let positionLeft = selectionCenterX - labelWidth / 2;
3957
+ let positionLeft = cursorX - labelWidth / 2;
4037
3958
  let positionTop = selectionBottom + ARROW_HEIGHT + LABEL_GAP;
4038
3959
  if (positionLeft + labelWidth > viewportWidth - VIEWPORT_MARGIN_PX) {
4039
3960
  positionLeft = viewportWidth - labelWidth - VIEWPORT_MARGIN_PX;
@@ -4052,7 +3973,7 @@ var SelectionLabel = (props) => {
4052
3973
  if (positionTop < VIEWPORT_MARGIN_PX) {
4053
3974
  positionTop = VIEWPORT_MARGIN_PX;
4054
3975
  }
4055
- const arrowLeft = Math.max(12, Math.min(selectionCenterX - positionLeft, labelWidth - 12));
3976
+ const arrowLeft = Math.max(12, Math.min(cursorX - positionLeft, labelWidth - 12));
4056
3977
  return {
4057
3978
  left: positionLeft,
4058
3979
  top: positionTop,
@@ -4092,128 +4013,84 @@ var SelectionLabel = (props) => {
4092
4013
  return memo(() => props.visible !== false)() && props.selectionBounds;
4093
4014
  },
4094
4015
  get children() {
4095
- var _el$15 = _tmpl$19(), _el$20 = _el$15.firstChild;
4096
- _el$15.$$click = stopPropagation;
4097
- _el$15.$$mousedown = stopPropagation;
4016
+ var _el$0 = _tmpl$14(), _el$12 = _el$0.firstChild;
4017
+ _el$0.$$click = stopPropagation;
4018
+ _el$0.$$mousedown = stopPropagation;
4098
4019
  var _ref$ = containerRef;
4099
- typeof _ref$ === "function" ? use(_ref$, _el$15) : containerRef = _el$15;
4100
- insert(_el$15, createComponent(Arrow, {
4020
+ typeof _ref$ === "function" ? use(_ref$, _el$0) : containerRef = _el$0;
4021
+ insert(_el$0, createComponent(Arrow, {
4101
4022
  get position() {
4102
4023
  return arrowPosition();
4103
4024
  },
4104
4025
  get leftPx() {
4105
4026
  return computedPosition().arrowLeft;
4106
- },
4107
- get color() {
4108
- return props.status === "copied" || props.status === "fading" ? "#A3FFCA" : void 0;
4109
4027
  }
4110
- }), _el$20);
4111
- insert(_el$15, createComponent(Show, {
4028
+ }), _el$12);
4029
+ insert(_el$0, createComponent(Show, {
4112
4030
  get when() {
4113
4031
  return props.status === "copied" || props.status === "fading";
4114
4032
  },
4115
4033
  get children() {
4116
- var _el$16 = _tmpl$11(), _el$17 = _el$16.firstChild, _el$18 = _el$17.firstChild, _el$19 = _el$17.nextSibling;
4117
- insert(_el$18, () => props.hasAgent ? "Completed" : "Copied");
4118
- insert(_el$19, createComponent(Show, {
4119
- get when() {
4120
- return props.componentName;
4121
- },
4122
- get children() {
4123
- return [createComponent(CopiedParentBadge, {
4124
- get name() {
4125
- return props.componentName;
4126
- }
4127
- }), createComponent(CopiedChevronSeparator, {})];
4128
- }
4129
- }), null);
4130
- insert(_el$19, createComponent(CopiedTagBadge, {
4131
- get tagName() {
4132
- return tagDisplay();
4133
- }
4134
- }), null);
4135
- return _el$16;
4034
+ var _el$1 = _tmpl$7(), _el$10 = _el$1.firstChild, _el$11 = _el$10.firstChild;
4035
+ insert(_el$11, () => props.hasAgent ? "Completed" : "Copied");
4036
+ return _el$1;
4136
4037
  }
4137
- }), _el$20);
4138
- insert(_el$20, createComponent(Show, {
4038
+ }), _el$12);
4039
+ insert(_el$12, createComponent(Show, {
4139
4040
  get when() {
4140
4041
  return props.status === "copying";
4141
4042
  },
4142
4043
  get children() {
4143
- var _el$21 = _tmpl$13();
4144
- insert(_el$21, createComponent(TagBadge, {
4145
- get tagName() {
4146
- return tagDisplay();
4147
- },
4148
- get isClickable() {
4149
- return isTagClickable();
4150
- },
4151
- onClick: handleTagClick,
4152
- onHoverChange: handleTagHoverChange,
4153
- showMono: true,
4154
- shrink: true
4155
- }), null);
4156
- insert(_el$21, createComponent(ActionPill, {
4157
- get icon() {
4158
- return createComponent(IconCursorSimple, {
4159
- size: 9,
4160
- "class": "text-black shrink-0"
4161
- });
4162
- },
4163
- get label() {
4164
- return props.statusText ?? "Grabbing\u2026";
4165
- }
4166
- }), null);
4167
- insert(_el$21, createComponent(Show, {
4168
- get when() {
4169
- return memo(() => !!props.hasAgent)() && props.onAbort;
4170
- },
4044
+ var _el$13 = _tmpl$0(), _el$14 = _el$13.firstChild, _el$15 = _el$14.firstChild, _el$16 = _el$15.firstChild;
4045
+ insert(_el$16, () => props.statusText ?? "Grabbing\u2026");
4046
+ insert(_el$13, createComponent(BottomSection, {
4171
4047
  get children() {
4172
- var _el$22 = _tmpl$12();
4173
- _el$22.$$click = (event) => {
4174
- event.preventDefault();
4175
- event.stopPropagation();
4176
- event.stopImmediatePropagation();
4177
- props.onAbort?.();
4178
- };
4179
- _el$22.$$mousedown = (event) => {
4180
- event.preventDefault();
4181
- event.stopPropagation();
4182
- event.stopImmediatePropagation();
4183
- };
4184
- insert(_el$22, createComponent(IconStop, {
4185
- size: 8,
4186
- "class": "text-white"
4187
- }));
4188
- return _el$22;
4048
+ var _el$17 = _tmpl$9(), _el$18 = _el$17.firstChild;
4049
+ var _ref$2 = inputRef;
4050
+ typeof _ref$2 === "function" ? use(_ref$2, _el$18) : inputRef = _el$18;
4051
+ insert(_el$17, createComponent(Show, {
4052
+ get when() {
4053
+ return props.onAbort;
4054
+ },
4055
+ get children() {
4056
+ var _el$19 = _tmpl$8();
4057
+ addEventListener(_el$19, "click", props.onAbort);
4058
+ return _el$19;
4059
+ }
4060
+ }), null);
4061
+ createRenderEffect(() => _el$18.value = props.inputValue ?? "");
4062
+ return _el$17;
4189
4063
  }
4190
4064
  }), null);
4191
- return _el$21;
4065
+ return _el$13;
4192
4066
  }
4193
4067
  }), null);
4194
- insert(_el$20, createComponent(Show, {
4068
+ insert(_el$12, createComponent(Show, {
4195
4069
  get when() {
4196
4070
  return memo(() => !!isNotProcessing())() && !props.isInputExpanded;
4197
4071
  },
4198
4072
  get children() {
4199
- var _el$23 = _tmpl$16(), _el$24 = _el$23.firstChild, _el$26 = _el$24.nextSibling, _el$27 = _el$26.firstChild;
4200
- insert(_el$24, createComponent(ClickToCopyPill, {
4073
+ var _el$20 = _tmpl$11(), _el$21 = _el$20.firstChild, _el$23 = _el$21.nextSibling, _el$24 = _el$23.firstChild;
4074
+ insert(_el$21, createComponent(ClickToCopyPill, {
4201
4075
  onClick: handleSubmit,
4202
- shrink: true
4076
+ shrink: true,
4077
+ get hasParent() {
4078
+ return !!props.componentName;
4079
+ }
4203
4080
  }), null);
4204
- insert(_el$24, createComponent(Show, {
4081
+ insert(_el$21, createComponent(Show, {
4205
4082
  get when() {
4206
4083
  return props.componentName;
4207
4084
  },
4208
4085
  get children() {
4209
- var _el$25 = _tmpl$14();
4210
- insert(_el$25, createComponent(ParentBadge, {
4086
+ var _el$22 = _tmpl$1();
4087
+ insert(_el$22, createComponent(ParentBadge, {
4211
4088
  get name() {
4212
4089
  return props.componentName;
4213
4090
  }
4214
4091
  }), null);
4215
- insert(_el$25, createComponent(ChevronSeparator, {}), null);
4216
- insert(_el$25, createComponent(TagBadge, {
4092
+ insert(_el$22, createComponent(ChevronSeparator, {}), null);
4093
+ insert(_el$22, createComponent(TagBadge, {
4217
4094
  get tagName() {
4218
4095
  return tagDisplay();
4219
4096
  },
@@ -4225,10 +4102,10 @@ var SelectionLabel = (props) => {
4225
4102
  showMono: true,
4226
4103
  shrink: true
4227
4104
  }), null);
4228
- return _el$25;
4105
+ return _el$22;
4229
4106
  }
4230
4107
  }), null);
4231
- insert(_el$24, createComponent(Show, {
4108
+ insert(_el$21, createComponent(Show, {
4232
4109
  get when() {
4233
4110
  return !props.componentName;
4234
4111
  },
@@ -4247,40 +4124,43 @@ var SelectionLabel = (props) => {
4247
4124
  });
4248
4125
  }
4249
4126
  }), null);
4250
- insert(_el$27, createComponent(BottomSection, {
4127
+ insert(_el$24, createComponent(BottomSection, {
4251
4128
  get children() {
4252
- var _el$28 = _tmpl$15(), _el$29 = _el$28.firstChild, _el$30 = _el$29.nextSibling; _el$30.firstChild;
4253
- return _el$28;
4129
+ var _el$25 = _tmpl$10(), _el$26 = _el$25.firstChild, _el$27 = _el$26.nextSibling; _el$27.firstChild;
4130
+ return _el$25;
4254
4131
  }
4255
4132
  }));
4256
- createRenderEffect((_$p) => setStyleProperty(_el$26, "grid-template-rows", isIdle() ? "1fr" : "0fr"));
4257
- return _el$23;
4133
+ createRenderEffect((_$p) => setStyleProperty(_el$23, "grid-template-rows", isIdle() ? "1fr" : "0fr"));
4134
+ return _el$20;
4258
4135
  }
4259
4136
  }), null);
4260
- insert(_el$20, createComponent(Show, {
4137
+ insert(_el$12, createComponent(Show, {
4261
4138
  get when() {
4262
4139
  return memo(() => !!isNotProcessing())() && props.isInputExpanded;
4263
4140
  },
4264
4141
  get children() {
4265
- var _el$32 = _tmpl$18(), _el$33 = _el$32.firstChild;
4266
- insert(_el$33, createComponent(ClickToCopyPill, {
4142
+ var _el$29 = _tmpl$13(), _el$30 = _el$29.firstChild;
4143
+ insert(_el$30, createComponent(ClickToCopyPill, {
4267
4144
  onClick: handleSubmit,
4268
4145
  dimmed: true,
4269
- shrink: true
4146
+ shrink: true,
4147
+ get hasParent() {
4148
+ return !!props.componentName;
4149
+ }
4270
4150
  }), null);
4271
- insert(_el$33, createComponent(Show, {
4151
+ insert(_el$30, createComponent(Show, {
4272
4152
  get when() {
4273
4153
  return props.componentName;
4274
4154
  },
4275
4155
  get children() {
4276
- var _el$34 = _tmpl$14();
4277
- insert(_el$34, createComponent(ParentBadge, {
4156
+ var _el$31 = _tmpl$1();
4157
+ insert(_el$31, createComponent(ParentBadge, {
4278
4158
  get name() {
4279
4159
  return props.componentName;
4280
4160
  }
4281
4161
  }), null);
4282
- insert(_el$34, createComponent(ChevronSeparator, {}), null);
4283
- insert(_el$34, createComponent(TagBadge, {
4162
+ insert(_el$31, createComponent(ChevronSeparator, {}), null);
4163
+ insert(_el$31, createComponent(TagBadge, {
4284
4164
  get tagName() {
4285
4165
  return tagDisplay();
4286
4166
  },
@@ -4293,10 +4173,10 @@ var SelectionLabel = (props) => {
4293
4173
  shrink: true,
4294
4174
  forceShowIcon: true
4295
4175
  }), null);
4296
- return _el$34;
4176
+ return _el$31;
4297
4177
  }
4298
4178
  }), null);
4299
- insert(_el$33, createComponent(Show, {
4179
+ insert(_el$30, createComponent(Show, {
4300
4180
  get when() {
4301
4181
  return !props.componentName;
4302
4182
  },
@@ -4316,29 +4196,29 @@ var SelectionLabel = (props) => {
4316
4196
  });
4317
4197
  }
4318
4198
  }), null);
4319
- insert(_el$32, createComponent(BottomSection, {
4199
+ insert(_el$29, createComponent(BottomSection, {
4320
4200
  get children() {
4321
- var _el$35 = _tmpl$17(), _el$36 = _el$35.firstChild, _el$37 = _el$36.nextSibling, _el$38 = _el$37.firstChild;
4322
- _el$36.$$keydown = handleKeyDown;
4323
- _el$36.$$input = handleInput;
4324
- var _ref$2 = inputRef;
4325
- typeof _ref$2 === "function" ? use(_ref$2, _el$36) : inputRef = _el$36;
4326
- _el$37.$$click = handleSubmit;
4327
- createRenderEffect(() => className(_el$38, cn("w-2.5 h-[9px] shrink-0 bg-cover bg-center transition-opacity duration-100", props.inputValue ? "opacity-[0.99]" : "opacity-50")));
4328
- createRenderEffect(() => _el$36.value = props.inputValue ?? "");
4329
- return _el$35;
4201
+ var _el$32 = _tmpl$12(), _el$33 = _el$32.firstChild, _el$34 = _el$33.nextSibling, _el$35 = _el$34.firstChild;
4202
+ _el$33.$$keydown = handleKeyDown;
4203
+ _el$33.$$input = handleInput;
4204
+ var _ref$3 = inputRef;
4205
+ typeof _ref$3 === "function" ? use(_ref$3, _el$33) : inputRef = _el$33;
4206
+ _el$34.$$click = handleSubmit;
4207
+ createRenderEffect(() => className(_el$35, cn("w-2.5 h-[9px] shrink-0 bg-cover bg-center transition-opacity duration-100", props.inputValue ? "opacity-[0.99]" : "opacity-50")));
4208
+ createRenderEffect(() => _el$33.value = props.inputValue ?? "");
4209
+ return _el$32;
4330
4210
  }
4331
4211
  }), null);
4332
- return _el$32;
4212
+ return _el$29;
4333
4213
  }
4334
4214
  }), null);
4335
4215
  createRenderEffect((_p$) => {
4336
4216
  var _v$3 = `${computedPosition().top}px`, _v$4 = `${computedPosition().left}px`, _v$5 = props.visible ? "auto" : "none", _v$6 = props.status === "fading" ? 0 : 1, _v$7 = props.status === "copied" || props.status === "fading" ? "none" : void 0;
4337
- _v$3 !== _p$.e && setStyleProperty(_el$15, "top", _p$.e = _v$3);
4338
- _v$4 !== _p$.t && setStyleProperty(_el$15, "left", _p$.t = _v$4);
4339
- _v$5 !== _p$.a && setStyleProperty(_el$15, "pointer-events", _p$.a = _v$5);
4340
- _v$6 !== _p$.o && setStyleProperty(_el$15, "opacity", _p$.o = _v$6);
4341
- _v$7 !== _p$.i && setStyleProperty(_el$20, "display", _p$.i = _v$7);
4217
+ _v$3 !== _p$.e && setStyleProperty(_el$0, "top", _p$.e = _v$3);
4218
+ _v$4 !== _p$.t && setStyleProperty(_el$0, "left", _p$.t = _v$4);
4219
+ _v$5 !== _p$.a && setStyleProperty(_el$0, "pointer-events", _p$.a = _v$5);
4220
+ _v$6 !== _p$.o && setStyleProperty(_el$0, "opacity", _p$.o = _v$6);
4221
+ _v$7 !== _p$.i && setStyleProperty(_el$12, "display", _p$.i = _v$7);
4342
4222
  return _p$;
4343
4223
  }, {
4344
4224
  e: void 0,
@@ -4347,14 +4227,14 @@ var SelectionLabel = (props) => {
4347
4227
  o: void 0,
4348
4228
  i: void 0
4349
4229
  });
4350
- return _el$15;
4230
+ return _el$0;
4351
4231
  }
4352
4232
  });
4353
4233
  };
4354
4234
  delegateEvents(["click", "mousedown", "input", "keydown"]);
4355
4235
 
4356
4236
  // src/components/selection-cursor.tsx
4357
- var _tmpl$20 = /* @__PURE__ */ template(`<div class="fixed z-2147483647"><button data-react-grab-selection-cursor>`);
4237
+ var _tmpl$15 = /* @__PURE__ */ template(`<div class="fixed z-2147483647"><button data-react-grab-selection-cursor>`);
4358
4238
  var SelectionCursor = (props) => {
4359
4239
  const [isHovered, setIsHovered] = createSignal(false);
4360
4240
  const [debouncedVisible, setDebouncedVisible] = createSignal(false);
@@ -4391,7 +4271,7 @@ var SelectionCursor = (props) => {
4391
4271
  });
4392
4272
  }
4393
4273
  }), (() => {
4394
- var _el$ = _tmpl$20(), _el$2 = _el$.firstChild;
4274
+ var _el$ = _tmpl$15(), _el$2 = _el$.firstChild;
4395
4275
  _el$.addEventListener("mouseleave", () => setIsHovered(false));
4396
4276
  _el$.addEventListener("mouseenter", () => setIsHovered(true));
4397
4277
  _el$2.$$click = handleClick;
@@ -4432,10 +4312,6 @@ var SelectionCursor = (props) => {
4432
4312
  delegateEvents(["click"]);
4433
4313
 
4434
4314
  // src/components/renderer.tsx
4435
- var truncateStatus = (status, maxLength = 30) => {
4436
- if (status.length <= maxLength) return status;
4437
- return `${status.slice(0, maxLength)}\u2026`;
4438
- };
4439
4315
  var ReactGrabRenderer = (props) => {
4440
4316
  return [createComponent(Show, {
4441
4317
  get when() {
@@ -4525,13 +4401,19 @@ var ReactGrabRenderer = (props) => {
4525
4401
  get selectionBounds() {
4526
4402
  return session.selectionBounds;
4527
4403
  },
4404
+ get mouseX() {
4405
+ return session.position.x;
4406
+ },
4528
4407
  visible: true,
4529
4408
  hasAgent: true,
4530
4409
  get status() {
4531
4410
  return session.isStreaming ? "copying" : "copied";
4532
4411
  },
4533
4412
  get statusText() {
4534
- return truncateStatus(session.lastStatus || "Please wait\u2026");
4413
+ return session.lastStatus || "Please wait\u2026";
4414
+ },
4415
+ get inputValue() {
4416
+ return session.context.prompt;
4535
4417
  },
4536
4418
  onAbort: () => props.onAbortSession?.(session.id)
4537
4419
  })]
@@ -4550,6 +4432,9 @@ var ReactGrabRenderer = (props) => {
4550
4432
  get selectionBounds() {
4551
4433
  return props.selectionBounds;
4552
4434
  },
4435
+ get mouseX() {
4436
+ return props.mouseX;
4437
+ },
4553
4438
  get visible() {
4554
4439
  return props.selectionLabelVisible;
4555
4440
  },
@@ -6313,7 +6198,7 @@ var createAgentManager = (initialAgentOptions) => {
6313
6198
  const content = await generateSnippet(elements);
6314
6199
  const context = { content, prompt, options: agentOptions?.getOptions?.() };
6315
6200
  const tagName = (element.tagName || "").toLowerCase() || void 0;
6316
- const componentName = getNearestComponentName(element) || void 0;
6201
+ const componentName = await getNearestComponentName(element) || void 0;
6317
6202
  const session = createSession(context, position, selectionBounds, tagName, componentName);
6318
6203
  session.lastStatus = "Please wait\u2026";
6319
6204
  sessionElements.set(session.id, element);
@@ -6381,7 +6266,7 @@ var createAgentManager = (initialAgentOptions) => {
6381
6266
  };
6382
6267
 
6383
6268
  // src/core.tsx
6384
- var _tmpl$21 = /* @__PURE__ */ template(`<span class="tabular-nums align-middle">`);
6269
+ var _tmpl$16 = /* @__PURE__ */ template(`<span class="tabular-nums align-middle">`);
6385
6270
  var _tmpl$23 = /* @__PURE__ */ template(`<span class="font-mono tabular-nums align-middle">&lt;<!>>`);
6386
6271
  var _tmpl$33 = /* @__PURE__ */ template(`<span class="tabular-nums ml-1 align-middle"> in `);
6387
6272
  var hasInited = false;
@@ -6463,7 +6348,7 @@ var init = (rawOptions) => {
6463
6348
  hasInited = true;
6464
6349
  const logIntro = () => {
6465
6350
  try {
6466
- const version = "0.0.59";
6351
+ const version = "0.0.60";
6467
6352
  const logoDataUri = `data:image/svg+xml;base64,${btoa(LOGO_SVG)}`;
6468
6353
  console.log(`%cReact Grab${version ? ` v${version}` : ""}%c
6469
6354
  https://react-grab.com`, `background: #330039; color: #ffffff; border: 1px solid #d75fcb; padding: 4px 4px 4px 24px; border-radius: 4px; background-image: url("${logoDataUri}"); background-size: 16px 16px; background-repeat: no-repeat; background-position: 4px center; display: inline-block; margin-bottom: 4px;`, "");
@@ -6821,7 +6706,7 @@ ${plainTextContentOnly}` : plainTextContentOnly;
6821
6706
  const copying = isCopying();
6822
6707
  if (!element) {
6823
6708
  return (() => {
6824
- var _el$ = _tmpl$21();
6709
+ var _el$ = _tmpl$16();
6825
6710
  insert(_el$, copying ? "Please wait\u2026" : "1 element");
6826
6711
  return _el$;
6827
6712
  })();
@@ -6847,7 +6732,7 @@ ${plainTextContentOnly}` : plainTextContentOnly;
6847
6732
  })();
6848
6733
  }
6849
6734
  return (() => {
6850
- var _el$10 = _tmpl$21();
6735
+ var _el$10 = _tmpl$16();
6851
6736
  insert(_el$10, copying ? "Please wait\u2026" : "1 element");
6852
6737
  return _el$10;
6853
6738
  })();
@@ -6961,7 +6846,7 @@ ${plainTextContentOnly}` : plainTextContentOnly;
6961
6846
  } else if (activated && dragging) {
6962
6847
  setCursorOverride("crosshair");
6963
6848
  } else if (activated && target) {
6964
- setCursorOverride("copy");
6849
+ setCursorOverride("default");
6965
6850
  } else if (activated) {
6966
6851
  setCursorOverride("crosshair");
6967
6852
  } else {
@@ -7056,9 +6941,8 @@ ${plainTextContentOnly}` : plainTextContentOnly;
7056
6941
  options.agent?.onAbort?.(session, element);
7057
6942
  if (element && document.contains(element)) {
7058
6943
  const rect = element.getBoundingClientRect();
7059
- const centerX = rect.left + rect.width / 2;
7060
6944
  const centerY = rect.top + rect.height / 2;
7061
- setMouseX(centerX);
6945
+ setMouseX(session.position.x);
7062
6946
  setMouseY(centerY);
7063
6947
  setFrozenElement(element);
7064
6948
  setInputText(session.context.prompt);
@@ -7084,6 +6968,7 @@ ${plainTextContentOnly}` : plainTextContentOnly;
7084
6968
  return;
7085
6969
  }
7086
6970
  const bounds = createElementBounds(element);
6971
+ const labelPositionX = mouseX();
7087
6972
  const currentX = bounds.x + bounds.width / 2;
7088
6973
  const currentY = bounds.y + bounds.height / 2;
7089
6974
  setMouseX(currentX);
@@ -7094,7 +6979,7 @@ ${plainTextContentOnly}` : plainTextContentOnly;
7094
6979
  element,
7095
6980
  prompt,
7096
6981
  position: {
7097
- x: currentX,
6982
+ x: labelPositionX,
7098
6983
  y: currentY
7099
6984
  },
7100
6985
  selectionBounds: bounds
@@ -7761,9 +7646,8 @@ ${plainTextContentOnly}` : plainTextContentOnly;
7761
7646
  newAgentOptions?.onAbort?.(session, element);
7762
7647
  if (element && document.contains(element)) {
7763
7648
  const rect = element.getBoundingClientRect();
7764
- const centerX = rect.left + rect.width / 2;
7765
7649
  const centerY = rect.top + rect.height / 2;
7766
- setMouseX(centerX);
7650
+ setMouseX(session.position.x);
7767
7651
  setMouseY(centerY);
7768
7652
  setFrozenElement(element);
7769
7653
  setInputText(session.context.prompt);