@esportsplus/ui 0.57.0 → 0.58.0

package/build/components/dock/scss/index.scss

@@ -1,2 +1,2 @@
-@layer components{.dock{--background-default:var(--color-grey-400);--border-radius:999px;--border-width:0px;--box-shadow-default:0 0 0 var(--border-width-400) var(--color-border-300), var(--box-shadow-200);--hop-duration:.7s;--icon-ratio:.45;--inset:12px;--item-radius:999px;--light-color:var(--color-text-500);--light-delay:calc(var(--hop-duration) * .55);--light-size:4px;--magnify-duration:.3s;--magnify-timing-function:cubic-bezier(.23, 1, .32, 1);--padding-horizontal:calc(var(--inset) - var(--spacing) / 2);--padding-vertical:0px;--size-far:calc(var(--size-rest) + (var(--size-peak) - var(--size-rest)) / 3);--size-near:calc(var(--size-rest) + (var(--size-peak) - var(--size-rest)) * 2 / 3);--size-peak:54px;--size-rest:40px;--spacing:8px}.dock--square{--border-radius:var(--border-radius-700);--item-radius:var(--border-radius-600)}.dock-button{--background-default:var(--color-white-300);--border-radius:var(--item-radius);--box-shadow-default:0 0 0 var(--border-width-400) var(--color-border-300), var(--box-shadow-100);--color:var(--color-text-500)}.dock-item{--size:var(--size-rest)}@media (hover:hover) and (prefers-reduced-motion:no-preference){.dock-item:hover{--size:var(--size-peak)}.dock-item:hover+.dock-item{--size:var(--size-near)}.dock-item:has(+.dock-item:hover){--size:var(--size-near)}.dock-item:hover+.dock-item+.dock-item{--size:var(--size-far)}.dock-item:has(+.dock-item+.dock-item:hover){--size:var(--size-far)}}.dock-label.tooltip-message,.dock-label.tooltip-shared{--box-shadow:none;--font-weight:var(--font-weight-500);--spacer:calc(var(--size-peak) - var(--size-rest) - var(--inset) + 12px)}.dock-label.tooltip-message{--border-radius:var(--border-radius-300);--offset:4px;--padding-horizontal:8px;--padding-vertical:4px;--transition-duration:.15s;--transition-timing-function:ease-out}.dock-label.tooltip-shared{--padding:4px 8px;--radius:var(--border-radius-300)}@media (prefers-reduced-motion:reduce){.dock{--hop-duration:0s}}.dock{height:calc(var(--size-rest) + var(--inset) * 2);display:flex}.dock-button{color:var(--color);cursor:pointer;height:var(--size);transform-origin:50% 100%;transition:height var(--magnify-duration) var(--magnify-timing-function), scale .15s ease-out, width var(--magnify-duration) var(--magnify-timing-function);width:var(--size);border:0;outline:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.dock-button:active{scale:.96}.dock-button:focus-visible{outline:2px solid var(--color);outline-offset:2px}.dock-button--launching{animation:dock-hop var(--hop-duration), dock-squash var(--hop-duration) ease-in-out}.dock-button svg{height:calc(var(--icon-ratio) * 100%);width:calc(var(--icon-ratio) * 100%)}.dock-group{display:flex}.dock-item{cursor:default;padding:0 calc(var(--spacing) / 2) var(--inset);flex-shrink:0;align-items:flex-end;display:flex;position:relative}.dock-light{background:var(--light-color);height:var(--light-size);opacity:0;pointer-events:none;left:50%;top:calc(100% - var(--inset) + 4px);width:var(--light-size);border-radius:50%;margin-inline-start:calc(var(--light-size) / -2);transition:opacity .15s cubic-bezier(.23,1,.32,1),scale .15s cubic-bezier(.23,1,.32,1);position:absolute;scale:.5}.dock-light.--active{opacity:1;transition-delay:var(--light-delay);transition-duration:.2s;scale:1}@keyframes dock-hop{0%{animation-timing-function:ease-out;translate:0}30%{animation-timing-function:ease-in;translate:0 -22px}55%{animation-timing-function:ease-out;translate:0}78%{animation-timing-function:ease-in;translate:0 -9px}to{translate:0}}@keyframes dock-squash{0%{scale:1}30%{scale:.97 1.04}55%{scale:1.08 .9}70%{scale:.99 1.02}80%{scale:1.03 .96}to{scale:1}}}
+@layer components{.dock,.dock-button{--surface-shadow-weight:6;--surface-background-active:light-dark(oklch(from var(--surface-background-default) calc(l + .01) c h),oklch(from var(--surface-background-default) calc(l + .02) c h));--surface-background-default:light-dark(oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(var(--surface-level), 0) * .01 + min(var(--surface-level), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) calc(c * clamp(0, l + max(var(--surface-level), 0) * .02 + min(var(--surface-level), 0) * .02, l + .12) / max(l, .01)) h));--surface-background-hover:light-dark(oklch(from var(--surface-background-default) calc(l + .005) c h),oklch(from var(--surface-background-default) calc(l + .01) c h));--surface-background-pressed:light-dark(oklch(from var(--surface-background-default) calc(l - .02) c h),oklch(from var(--surface-background-default) calc(l - .04) c h));--surface-border-active:light-dark(oklch(from var(--surface-background-active) max(0, l - .04) c h),oklch(from var(--surface-background-active) min(1, l + .06) c h));--surface-border-default:light-dark(oklch(from var(--surface-background-default) max(0, l - .04) c h),oklch(from var(--surface-background-default) min(1, l + .06) c h));--surface-border-hover:light-dark(oklch(from var(--surface-background-hover) max(0, l - .04) c h),oklch(from var(--surface-background-hover) min(1, l + .06) c h));--surface-border-pressed:light-dark(oklch(from var(--surface-background-pressed) max(0, l - .04) c h),oklch(from var(--surface-background-pressed) min(1, l + .06) c h));--surface-shadow-active:var(--surface-shadow-hover);--surface-shadow-color:light-dark(oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .08),oklch(from var(--surface-background-default) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-cast:light-dark(oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .08),oklch(from light-dark(oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1) calc(c * (1 - clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .01 + min(calc(var(--surface-level) - 1), 0) * .01, 1)) / max(1 - l, .01)) h),oklch(from var(--color-surface) clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) calc(c * clamp(0, l + max(calc(var(--surface-level) - 1), 0) * .02 + min(calc(var(--surface-level) - 1), 0) * .02, l + .12) / max(l, .01)) h)) calc(l * .24) calc(c * .24) h / .16));--surface-shadow-default:0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 0, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 5 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 1, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 3 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 9 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 10 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 25 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -7 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, var(--surface-shadow-weight) - 0, 1) + .05 * clamp(0, var(--surface-shadow-weight) - 2, 1) + .15 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -8 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, var(--surface-shadow-weight) - 2, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 3, 1) + 2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + 4 * clamp(0, var(--surface-shadow-weight) - 5, 1) + -10 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -1 * clamp(0, var(--surface-shadow-weight) - 3, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 4, 1) + -2 * clamp(0, var(--surface-shadow-weight) - 5, 1) + 6 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, var(--surface-shadow-weight) - 2, 1) + -.1 * clamp(0, var(--surface-shadow-weight) - 6, 1)) * 10));--surface-shadow-hover:0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 5 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 1, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 3 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 9 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 25 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -7 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 0, 1) + .05 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + .15 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -8 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + 2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + 4 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + -10 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 3, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 4, 1) + -2 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 5, 1) + 6 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 2, 1) + -.1 * clamp(0, min(var(--surface-shadow-weight) + 1, 7) - 6, 1)) * 10));--surface-shadow-pressed:0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 5 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 1, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 3 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 9 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 25 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -7 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 0, 1) + .05 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + .15 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10)), 0 calc((0 + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -8 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + 2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + 4 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + -10 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) calc((0 + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 3, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 4, 1) + -2 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 5, 1) + 6 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 1px) oklch(from var(--surface-shadow-cast) l c h / calc(alpha * (0 + .1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 2, 1) + -.1 * clamp(0, max(var(--surface-shadow-weight) - 1, 0) - 6, 1)) * 10))}@container style(--surface-level:-3){.dock,.dock-button{--surface-level:-2;--surface-shadow-weight:0}}@container style(--surface-level:-2){.dock,.dock-button{--surface-level:-1;--surface-shadow-weight:0}}@container style(--surface-level:-1){.dock,.dock-button{--surface-level:0;--surface-shadow-weight:0}}@container style(--surface-level:0){.dock,.dock-button{--surface-level:1;--surface-shadow-weight:1}}@container style(--surface-level:1){.dock,.dock-button{--surface-level:2;--surface-shadow-weight:2}}@container style(--surface-level:2){.dock,.dock-button{--surface-level:3;--surface-shadow-weight:3}}@container style(--surface-level:3){.dock,.dock-button{--surface-level:4;--surface-shadow-weight:4}}@container style(--surface-level:4){.dock,.dock-button{--surface-level:5;--surface-shadow-weight:5}}@container style(--surface-level:5){.dock,.dock-button{--surface-level:6;--surface-shadow-weight:6}}.dock{--background-default:var(--surface-background-default);--border-radius:999px;--border-width:0px;--box-shadow-default:0 0 0 var(--border-width-400) var(--surface-border-default), var(--surface-shadow-default);--hop-duration:.7s;--icon-ratio:.45;--inset:12px;--item-radius:999px;--light-color:var(--color-primary-500);--light-delay:calc(var(--hop-duration) * .55);--light-size:4px;--magnify-duration:var(--duration-fast);--magnify-timing-function:var(--easing-spring);--padding-horizontal:calc(var(--inset) - var(--spacing) / 2);--padding-vertical:0px;--size-far:calc(var(--size-rest) + (var(--size-peak) - var(--size-rest)) / 3);--size-near:calc(var(--size-rest) + (var(--size-peak) - var(--size-rest)) * 2 / 3);--size-peak:54px;--size-rest:40px;--spacing:var(--size-100)}.dock--square{--border-radius:var(--border-radius-700);--item-radius:var(--border-radius-600)}.dock-button{--background-default:var(--surface-background-default);--border-radius:var(--item-radius);--box-shadow-default:0 0 0 var(--border-width-400) var(--surface-border-default), var(--surface-shadow-default);--color:var(--color-text-500)}.dock-item{--size:var(--size-rest)}@media (hover:hover) and (prefers-reduced-motion:no-preference){.dock-item:hover+.dock-item+.dock-item{--size:var(--size-far)}.dock-item:has(+.dock-item+.dock-item:hover){--size:var(--size-far)}.dock-item:hover+.dock-item{--size:var(--size-near)}.dock-item:has(+.dock-item:hover){--size:var(--size-near)}.dock-item:hover{--size:var(--size-peak)}}.dock-label.tooltip-message{--border-radius:var(--border-radius-300);--offset:calc(var(--size-100) / 2);--padding-horizontal:var(--size-100);--padding-vertical:calc(var(--size-100) / 2)}.dock-label.tooltip-message,.dock-label.tooltip-shared{--box-shadow-default:none;--font-weight:var(--font-weight-500);--spacer:calc(var(--size-peak) - var(--size-rest) - var(--inset) + 12px)}.dock-label.tooltip-shared{--padding:calc(var(--size-100) / 2) var(--size-100);--radius:var(--border-radius-300)}@media (prefers-reduced-motion:reduce){.dock{--hop-duration:0s}}.dock{height:calc(var(--size-rest) + var(--inset) * 2);display:flex}.dock-button{color:var(--color);cursor:pointer;height:var(--size);transform-origin:50% 100%;transition:height var(--magnify-duration) var(--magnify-timing-function), width var(--magnify-duration) var(--magnify-timing-function);width:var(--size);border:0;outline:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.dock-button--launching{animation:dock-hop var(--hop-duration), dock-squash var(--hop-duration) var(--easing-in-out)}.dock-button:focus-visible{outline:2px solid var(--color);outline-offset:calc(var(--size-100) / 4)}.dock-button svg{height:calc(var(--icon-ratio) * 100%);width:calc(var(--icon-ratio) * 100%)}.dock-group{display:flex}.dock-item{cursor:default;padding:0 calc(var(--spacing) / 2) var(--inset);flex-shrink:0;align-items:flex-end;display:flex;position:relative}.dock-light{background:var(--light-color);height:var(--light-size);opacity:0;pointer-events:none;left:50%;top:calc(100% - var(--inset) + 4px);transition:opacity var(--duration-fast-exit) var(--easing-spring), scale var(--duration-fast-exit) var(--easing-spring);width:var(--light-size);border-radius:50%;margin-inline-start:calc(var(--light-size) / -2);position:absolute;scale:.5}.dock-light.--active{opacity:1;transition-delay:var(--light-delay);transition-duration:var(--duration-fast);scale:1}@keyframes dock-hop{0%{animation-timing-function:var(--easing-out);translate:0}30%{animation-timing-function:ease-in;translate:0 -22px}55%{animation-timing-function:var(--easing-out);translate:0}78%{animation-timing-function:ease-in;translate:0 -9px}to{translate:0}}@keyframes dock-squash{0%{scale:1}30%{scale:.97 1.04}55%{scale:1.08 .9}70%{scale:.99 1.02}80%{scale:1.03 .96}to{scale:1}}}
 /*$vite$:1*/

package/build/components/editor/code/index.d.ts

@@ -1,5 +1,4 @@
 import editor from './editor.js';
-import '../../../css-utilities/scrollbar/scss/index.scss';
 import './scss/index.scss';
 export default editor;
 export { EditorDocument } from './document.js';

package/build/components/editor/code/index.js

@@ -1,5 +1,4 @@
 import editor from './editor.js';
-import '../../../css-utilities/scrollbar/scss/index.scss';
 import './scss/index.scss';
 export default editor;
 export { EditorDocument } from './document.js';

package/build/components/editor/code/minimap.d.ts

@@ -33,8 +33,9 @@ declare const minimapMetrics: (height: number, scrollHeight: number, clientHeigh
     travel: number;
 };
 declare const minimapScroll: (y: number, grab: number, height: number, scrollHeight: number, clientHeight: number) => number;
-declare const minimap: ({ focus, scroll }: {
+declare const minimap: ({ focus, name, scroll }: {
     focus: VoidFunction;
+    name?: string;
     scroll: (top: number, relative: boolean) => void;
 }) => {
     invalidate: (first?: number | null, last?: number) => void;

package/build/components/editor/code/minimap.js

@@ -1,7 +1,7 @@
 import * as reactivity_u0 from '@esportsplus/reactivity';
 import * as template_u1 from '@esportsplus/template';
 import { clamp } from '../../../shared/clamp.js';
-const template_0bg9uqd2 = template_u1.template(`<div aria-hidden='true' class='code-editor-minimap'><canvas class='code-editor-minimap-canvas'></canvas><div class='code-editor-minimap-slider'>`);
+const template_0bg9uqd2 = template_u1.template(`<div aria-hidden='true'><canvas></canvas><div>`);
 class ReactiveObject_0bg9uqd0 extends reactivity_u0.ReactiveObject {
     #height = this[reactivity_u0.SIGNAL](24);
     #top = this[reactivity_u0.SIGNAL](0);
@@ -43,7 +43,7 @@ const minimapScroll = (y, grab, height, scrollHeight, clientHeight) => {
     let metrics = minimapMetrics(height, scrollHeight, clientHeight, 0);
     return metrics.travel ? (clamp(y - grab, 0, metrics.travel) / metrics.travel) * metrics.scroll : 0;
 };
-const minimap = ({ focus, scroll }) => {
+const minimap = ({ focus, name = 'code-editor', scroll }) => {
     let canvas, colors = {}, content = 0, dirty = null, full = true, grab = null, lineHeight = 20, pixels = '', state = new ReactiveObject_0bg9uqd0(), style = '', viewport = { clientHeight: 0, scrollHeight: 0, scrollTop: 0 }, width = 0;
     function draw(context, source, scale, index) {
         let text = source.text(index), top = source.top(index), pitch = Math.max(1, Math.min(3, source.lineHeight * scale));
@@ -161,8 +161,11 @@ const minimap = ({ focus, scroll }) => {
         state,
         template: (attributes) => {
             let root_0bg9uqd1 = template_0bg9uqd2(), element_0bg9uqd3 = root_0bg9uqd1.firstChild, element_0bg9uqd4 = element_0bg9uqd3.firstElementChild, element_0bg9uqd5 = element_0bg9uqd4.nextElementSibling;
+            template_u1.setList(element_0bg9uqd5, 'class', template_u1.interpolate([(name), "-minimap-slider"]));
             template_u1.setList(element_0bg9uqd5, 'style', () => `--slider-height: ${state.height}px; --slider-top: ${state.top}px;`);
+            template_u1.setList(element_0bg9uqd4, 'class', template_u1.interpolate([(name), "-minimap-canvas"]));
             template_u1.onconnect(element_0bg9uqd4, (element) => { canvas = element; });
+            template_u1.setList(element_0bg9uqd3, 'class', template_u1.interpolate([(name), "-minimap"]));
             template_u1.setProperties(element_0bg9uqd3, handlers);
             template_u1.setProperties(element_0bg9uqd3, attributes);
             return root_0bg9uqd1;

package/build/components/editor/code/view.d.ts

@@ -17,7 +17,9 @@ type Callbacks = {
 };
 type CodeController = Omit<Controller, 'state'> & {
     readonly state: State;
+    readonly textarea: HTMLTextAreaElement;
     conflicts(): Conflict[];
+    folds(): number[];
     nextChange(): boolean;
     nextConflict(): boolean;
     nextProblem(): boolean;
@@ -32,7 +34,6 @@ type Controller = {
     readonly host: HTMLElement;
     readonly scroller: HTMLElement;
     readonly state: Snapshot;
-    readonly textarea: HTMLTextAreaElement;
     addNextOccurrence(all?: boolean): boolean;
     closeFind(): void;
     dispose(): void;
@@ -86,6 +87,7 @@ type Options = {
     lineComment?: string | false;
     lineNumbers?: boolean;
     links?: boolean | ((url: string) => void);
+    minHeight?: number | string;
     minimap?: boolean;
     name?: string;
     onAutocomplete?: (controller: CodeController | Controller, explicit: boolean) => void;

package/build/components/editor/code/view.js

@@ -1,6 +1,7 @@
 import * as reactivity_u0 from '@esportsplus/reactivity';
 import { flush } from '@esportsplus/reactivity';
 import * as template_u1 from '@esportsplus/template';
+import scrollbar from '../../../modifiers/scrollbar/index.js';
 import { clamp } from '../../../shared/clamp.js';
 import { mac } from '../../../shared/platform.js';
 import { observeSize } from '../../../shared/resize.js';
@@ -23,7 +24,7 @@ import { markup, marks, pool, rowBreaks, rowOffset, rowRect, tokens } from './ro
 import { search as scan } from './search.js';
 import { services } from './services/index.js';
 import { commentSyntax, languageFor, syntaxCache } from './syntax.js';
-const template_0psre1t3 = template_u1.template(`<div class='code-editor'><!--$--><!--$--><div class='code-editor-surface'><div aria-hidden='true' class='code-editor-overlay'><div class='code-editor-rulers'></div><div class='code-editor-lines'></div><div class='code-editor-decorations'><!--$--></div></div><div aria-hidden='true' class='code-editor-gutter'><div class='code-editor-numbers'></div></div><!--$--><!--$--><!--$--><textarea autocapitalize='off' autocomplete='off' autocorrect='off' class='code-editor-input --scrollbar' dir='ltr' spellcheck='false'></textarea><span aria-hidden='true' class='code-editor-ruler'>0000000000000000000000000000000000000000000000000000000000000000</span></div><!--$--><span class='code-editor-help'>Press Escape then Tab to move focus out of the editor.`);
+const template_0psre1t3 = template_u1.template(`<div class='code-editor'><!--$--><!--$--><div class='code-editor-surface'><div aria-hidden='true' class='code-editor-overlay'><div class='code-editor-rulers'></div><div class='code-editor-lines'></div><div class='code-editor-decorations'><!--$--></div></div><div aria-hidden='true' class='code-editor-gutter'><div class='code-editor-numbers'></div></div><!--$--><!--$--><!--$--><textarea autocapitalize='off' autocomplete='off' autocorrect='off' class='code-editor-input' dir='ltr' spellcheck='false'></textarea><span aria-hidden='true' class='code-editor-ruler'>0000000000000000000000000000000000000000000000000000000000000000</span></div><!--$--><span class='code-editor-help'>Press Escape then Tab to move focus out of the editor.`);
 const template_0psre1tl = template_u1.template(`<div>`);
 class ReactiveObject_0psre1t0 extends reactivity_u0.ReactiveObject {
     #digits;
@@ -31,6 +32,7 @@ class ReactiveObject_0psre1t0 extends reactivity_u0.ReactiveObject {
     #highlight = this[reactivity_u0.SIGNAL](true);
     #label = this[reactivity_u0.SIGNAL]('Code editor');
     #lineNumbers = this[reactivity_u0.SIGNAL](true);
+    #minHeight = this[reactivity_u0.SIGNAL]('');
     #minimap = this[reactivity_u0.SIGNAL](false);
     #name = this[reactivity_u0.SIGNAL]('');
     #placeholder = this[reactivity_u0.SIGNAL]('');
@@ -77,77 +79,83 @@ class ReactiveObject_0psre1t0 extends reactivity_u0.ReactiveObject {
     set lineNumbers(_v4) {
         reactivity_u0.write(this.#lineNumbers, _v4);
     }
+    get minHeight() {
+        return reactivity_u0.read(this.#minHeight);
+    }
+    set minHeight(_v5) {
+        reactivity_u0.write(this.#minHeight, _v5);
+    }
     get minimap() {
         return reactivity_u0.read(this.#minimap);
     }
-    set minimap(_v5) {
-        reactivity_u0.write(this.#minimap, _v5);
+    set minimap(_v6) {
+        reactivity_u0.write(this.#minimap, _v6);
     }
     get name() {
         return reactivity_u0.read(this.#name);
     }
-    set name(_v6) {
-        reactivity_u0.write(this.#name, _v6);
+    set name(_v7) {
+        reactivity_u0.write(this.#name, _v7);
     }
     get placeholder() {
         return reactivity_u0.read(this.#placeholder);
     }
-    set placeholder(_v7) {
-        reactivity_u0.write(this.#placeholder, _v7);
+    set placeholder(_v8) {
+        reactivity_u0.write(this.#placeholder, _v8);
     }
     get readonly() {
         return reactivity_u0.read(this.#readonly);
     }
-    set readonly(_v8) {
-        reactivity_u0.write(this.#readonly, _v8);
+    set readonly(_v9) {
+        reactivity_u0.write(this.#readonly, _v9);
     }
     get tabSize() {
         return reactivity_u0.read(this.#tabSize);
     }
-    set tabSize(_v9) {
-        reactivity_u0.write(this.#tabSize, _v9);
+    set tabSize(_v10) {
+        reactivity_u0.write(this.#tabSize, _v10);
     }
     get trackHeight() {
         return reactivity_u0.read(this.#trackHeight);
     }
-    set trackHeight(_v10) {
-        reactivity_u0.write(this.#trackHeight, _v10);
+    set trackHeight(_v11) {
+        reactivity_u0.write(this.#trackHeight, _v11);
     }
     get trackWidth() {
         return reactivity_u0.read(this.#trackWidth);
     }
-    set trackWidth(_v11) {
-        reactivity_u0.write(this.#trackWidth, _v11);
+    set trackWidth(_v12) {
+        reactivity_u0.write(this.#trackWidth, _v12);
     }
     get whitespace() {
         return reactivity_u0.read(this.#whitespace);
     }
-    set whitespace(_v12) {
-        reactivity_u0.write(this.#whitespace, _v12);
+    set whitespace(_v13) {
+        reactivity_u0.write(this.#whitespace, _v13);
     }
     get width() {
         return reactivity_u0.read(this.#width);
     }
-    set width(_v13) {
-        reactivity_u0.write(this.#width, _v13);
+    set width(_v14) {
+        reactivity_u0.write(this.#width, _v14);
     }
     get wrap() {
         return reactivity_u0.read(this.#wrap);
     }
-    set wrap(_v14) {
-        reactivity_u0.write(this.#wrap, _v14);
+    set wrap(_v15) {
+        reactivity_u0.write(this.#wrap, _v15);
     }
     get x() {
         return reactivity_u0.read(this.#x);
     }
-    set x(_v15) {
-        reactivity_u0.write(this.#x, _v15);
+    set x(_v16) {
+        reactivity_u0.write(this.#x, _v16);
     }
     get y() {
         return reactivity_u0.read(this.#y);
     }
-    set y(_v16) {
-        reactivity_u0.write(this.#y, _v16);
+    set y(_v17) {
+        reactivity_u0.write(this.#y, _v17);
     }
 }
 class ReactiveObject_0psre1t1 extends reactivity_u0.ReactiveObject {
@@ -1000,6 +1008,7 @@ const view = (model, callbacks, receive) => {
             model.select({ start: 0 });
             rebuild();
         },
+        folds: () => folded.map((fold) => fold.line),
         goToLine: (line, column = 1) => {
             if (disposed || ime.busy()) {
                 return;
@@ -1147,6 +1156,7 @@ const view = (model, callbacks, receive) => {
             ui.highlight = options.highlight !== false;
             ui.label = options.label ?? 'Code editor';
             ui.lineNumbers = options.lineNumbers !== false;
+            ui.minHeight = typeof options.minHeight === 'number' ? `${options.minHeight}px` : options.minHeight ?? '';
             ui.minimap = !!options.minimap;
             ui.name = options.name ?? '';
             ui.placeholder = options.placeholder ?? '';
@@ -1515,6 +1525,7 @@ const view = (model, callbacks, receive) => {
         template_u1.onconnect(element_0psre1th, (element) => {
             ruler = element;
         });
+        template_u1.setProperties(element_0psre1tg, scrollbar());
         template_u1.setProperties(element_0psre1tg, field);
         template_u1.setProperties(element_0psre1tg, lsp.aria);
         template_u1.onconnect(element_0psre1tg, (element) => {
@@ -1552,7 +1563,7 @@ const view = (model, callbacks, receive) => {
             receive?.(controller);
         });
         template_u1.ondisconnect(element_0psre1t4, () => controller.dispose());
-        template_u1.setList(element_0psre1t4, 'style', () => `--content-width: ${ui.width}px; --digits: ${ui.digits}; --tab-size: ${ui.tabSize}; --track-height: ${ui.trackHeight}px; --track-width: ${ui.trackWidth}px;`);
+        template_u1.setList(element_0psre1t4, 'style', () => `--content-width: ${ui.width}px; --digits: ${ui.digits}; --tab-size: ${ui.tabSize}; --track-height: ${ui.trackHeight}px; --track-width: ${ui.trackWidth}px;${ui.minHeight && ` --min-height: ${ui.minHeight};`}`);
         return root_0psre1t2;
     };
     return { controller, template };

package/build/components/editor/diffs/index.d.ts

@@ -1,6 +1,5 @@
 import merge from './merge.js';
 import view from './view.js';
-import '../../../css-utilities/scrollbar/scss/index.scss';
 import './scss/index.scss';
 declare const diffs: typeof view & {
     merge: typeof merge;

package/build/components/editor/diffs/index.js

@@ -1,6 +1,5 @@
 import merge from './merge.js';
 import view from './view.js';
-import '../../../css-utilities/scrollbar/scss/index.scss';
 import './scss/index.scss';
 const diffs = Object.assign(view, { merge });
 export default diffs;

package/build/components/editor/diffs/merge.js

@@ -3,6 +3,7 @@ import { untrack } from '@esportsplus/reactivity';
 import * as template_u1 from '@esportsplus/template';
 import { component } from '@esportsplus/template';
 import icon from '../../icon/index.js';
+import scrollbar from '../../../modifiers/scrollbar/index.js';
 import codeEditor from '../code/index.js';
 import { EditorDocument } from '../code/document.js';
 import { languageFor } from '../code/syntax.js';
@@ -17,9 +18,9 @@ const template_0td7se96 = template_u1.template(`<button class='diffs-action' typ
 const template_0td7se9a = template_u1.template(`<button class='diffs-action' type='button'> Accept incoming </button><button class='diffs-action' type='button'> Accept both `);
 const template_0td7se9e = template_u1.template(`<button class='diffs-action' type='button'></button><button class='diffs-action' type='button'> Accept both `);
 const template_0td7se9i = template_u1.template(`<div class='diffs-merge-line '><span class='diffs-number'></span><code class='diffs-code'>`);
-const template_0td7se9n = template_u1.template(`<div class='diffs-merge-pane diffs-merge-pane--current'><div class='diffs-merge-title'>Current</div><div class='diffs-merge-scroller --scrollbar' tabindex='0'>`);
-const template_0td7se9q = template_u1.template(`<div class='diffs-merge-pane diffs-merge-pane--incoming'><div class='diffs-merge-title'>Incoming</div><div class='diffs-merge-scroller --scrollbar' tabindex='0'>`);
-const template_0td7se9t = template_u1.template(`<div class='diffs-merge-pane '><div class='diffs-merge-title'></div><div class='diffs-merge-scroller --scrollbar' tabindex='0'>`);
+const template_0td7se9n = template_u1.template(`<div class='diffs-merge-pane diffs-merge-pane--current'><div class='diffs-merge-title'>Current</div><div class='diffs-merge-scroller' tabindex='0'>`);
+const template_0td7se9q = template_u1.template(`<div class='diffs-merge-pane diffs-merge-pane--incoming'><div class='diffs-merge-title'>Incoming</div><div class='diffs-merge-scroller' tabindex='0'>`);
+const template_0td7se9t = template_u1.template(`<div class='diffs-merge-pane '><div class='diffs-merge-title'></div><div class='diffs-merge-scroller' tabindex='0'>`);
 const template_0td7se9y = template_u1.template(`<div class='diffs-merge'><div class='diffs-merge-header'><!--$--><span aria-live='polite' class='diffs-position'></span><div class='diffs-controls'><!--$--><button aria-label='Previous conflict (Shift+Alt+F8)' class='diffs-button' title='Previous conflict (Shift+Alt+F8)' type='button'></button><button aria-label='Next conflict (Alt+F8)' class='diffs-button' title='Next conflict (Alt+F8)' type='button'></button><button class='diffs-button diffs-button--primary diffs-button--text' type='button'><!--$--> Complete merge </button></div></div><div class='diffs-merge-sides'><!--$--></div><div class='diffs-merge-result'><div class='diffs-merge-title'>Result`);
 const template_0td7se91b = template_u1.template(`<span class='diffs-filename'>`);
 const template_0td7se91e = template_u1.template(`<button class='diffs-button diffs-button--text' type='button'> Accept both `);
@@ -210,15 +211,18 @@ export default component(function (input) {
         return (side === "current" ? (() => {
             let root_0td7se9m = template_0td7se9n(), element_0td7se9o = root_0td7se9m.firstChild.firstElementChild.nextElementSibling;
             template_u1.slot(element_0td7se9o, panes[side].slot.fragment, 1);
+            template_u1.setProperties(element_0td7se9o, scrollbar());
             return root_0td7se9m;
         })() : side === "incoming" ? (() => {
             let root_0td7se9p = template_0td7se9q(), element_0td7se9r = root_0td7se9p.firstChild.firstElementChild.nextElementSibling;
             template_u1.slot(element_0td7se9r, panes[side].slot.fragment, 1);
+            template_u1.setProperties(element_0td7se9r, scrollbar());
             return root_0td7se9p;
         })() : (() => {
             let root_0td7se9s = template_0td7se9t(), element_0td7se9u = root_0td7se9s.firstChild, element_0td7se9v = element_0td7se9u.firstElementChild, element_0td7se9w = element_0td7se9v.nextElementSibling;
             element_0td7se9v.appendChild(template_u1.text(side === 'current' ? 'Current' : 'Incoming'));
             template_u1.slot(element_0td7se9w, panes[side].slot.fragment, 1);
+            template_u1.setProperties(element_0td7se9w, scrollbar());
             template_u1.setList(element_0td7se9u, 'class', template_u1.interpolate(["diffs-merge-pane--", (side)]));
             return root_0td7se9s;
         })());

package/build/components/editor/diffs/view.js

@@ -3,6 +3,7 @@ import { untrack } from '@esportsplus/reactivity';
 import * as template_u1 from '@esportsplus/template';
 import { component } from '@esportsplus/template';
 import icon from '../../icon/index.js';
+import scrollbar from '../../../modifiers/scrollbar/index.js';
 import { languageFor } from '../code/syntax.js';
 import { diffTexts, hunks } from './hunks.js';
 import { highlighter, markup } from './render.js';
@@ -18,7 +19,7 @@ const template_1uiklwmd = template_u1.template(`<div class='diffs-cell '><span c
 const template_1uiklwmi = template_u1.template(`<div class='diffs-row diffs-row--gap'><button class='diffs-gap' type='button'><!--$-->`);
 const template_1uiklwmm = template_u1.template(`<div class='diffs-row diffs-row--split  '><!--$--><!--$-->`);
 const template_1uiklwmr = template_u1.template(`<div class='diffs-row diffs-row--unified  '><span class='diffs-number'></span><span class='diffs-number'></span><span aria-hidden='true' class='diffs-sign'></span><code class='diffs-code'>`);
-const template_1uiklwmy = template_u1.template(`<div class='diffs'><div class='diffs-header'><!--$--><span class='diffs-stats'><span class='diffs-stat diffs-stat--additions'></span><span class='diffs-stat diffs-stat--deletions'></span></span><span aria-live='polite' class='diffs-position'></span><div class='diffs-controls'><div aria-label='View' class='diffs-modes' role='group'></div><button aria-label='Previous change (Shift+Alt+F5)' class='diffs-button' title='Previous change (Shift+Alt+F5)' type='button'></button><button aria-label='Next change (Alt+F5)' class='diffs-button' title='Next change (Alt+F5)' type='button'></button></div></div><div class='diffs-scroller --scrollbar' tabindex='0'>`);
+const template_1uiklwmy = template_u1.template(`<div class='diffs'><div class='diffs-header'><!--$--><span class='diffs-stats'><span class='diffs-stat diffs-stat--additions'></span><span class='diffs-stat diffs-stat--deletions'></span></span><span aria-live='polite' class='diffs-position'></span><div class='diffs-controls'><div aria-label='View' class='diffs-modes' role='group'></div><button aria-label='Previous change (Shift+Alt+F5)' class='diffs-button' title='Previous change (Shift+Alt+F5)' type='button'></button><button aria-label='Next change (Alt+F5)' class='diffs-button' title='Next change (Alt+F5)' type='button'></button></div></div><div class='diffs-scroller' tabindex='0'>`);
 const template_1uiklwm19 = template_u1.template(`<span class='diffs-filename'>`);
 const template_1uiklwm1c = template_u1.template(`<button class='diffs-button diffs-button--text' type='button'> Split `);
 const template_1uiklwm1f = template_u1.template(`<button class='diffs-button diffs-button--text' type='button'> Unified `);
@@ -343,6 +344,7 @@ export default component(function (input) {
         template_u1.slot(element_1uiklwm15, icon({ 'aria-hidden': 'true', class: 'diffs-button-icon' }, up), 1);
         template_u1.slot(element_1uiklwm16, icon({ 'aria-hidden': 'true', class: 'diffs-button-icon' }, down), 1);
         template_u1.slot(element_1uiklwm17, slot.fragment, 1);
+        template_u1.setProperties(element_1uiklwm17, scrollbar());
         template_u1.setProperty(element_1uiklwm16, 'disabled', () => !ui.changes);
         template_u1.delegate(element_1uiklwm16, 'click', () => move(1));
         template_u1.setProperty(element_1uiklwm15, 'disabled', () => !ui.changes);

package/build/components/editor/index.d.ts

@@ -2,12 +2,14 @@ import code from './code/index.js';
 import diffs from './diffs/index.js';
 import markdown from './markdown/index.js';
 import tree from './tree/index.js';
+import viewer from './viewer/index.js';
 import workspace from './workspace/index.js';
 declare const editor: {
     code: typeof code;
     diffs: typeof diffs;
     markdown: typeof markdown;
     tree: typeof tree;
+    viewer: typeof viewer;
     workspace: typeof workspace;
 };
 export default editor;
@@ -18,4 +20,5 @@ export { EditorWorkspaceModel, isWorkspaceCodeEditor } from './workspace/index.j
 export type { ConflictMarker, DiffChange, DiffsAttributes, DiffsController, DiffsState, Hunk, MergeAttributes, MergeChoice, MergeRegion, MergeResult } from './diffs/index.js';
 export type { MarkdownController, MarkdownEditorAttributes, MarkdownOptions } from './markdown/index.js';
 export type * from './tree/index.js';
-export type { CodeEditorWorkspaceAttributes, CodeEditorWorkspaceController, WorkspaceAction, WorkspaceConfirmation, WorkspaceDecision, WorkspaceEditor, WorkspaceEditorAttributes, WorkspaceEditorContext, WorkspaceEditorController, WorkspaceEntry, WorkspaceHost, WorkspacePreferences, WorkspaceTab, WorkspaceTarget } from './workspace/index.js';
+export type { CodeViewerAttributes } from './viewer/index.js';
+export type { CodeEditorWorkspaceAttributes, CodeEditorWorkspaceController, WorkspaceAction, WorkspaceCompare, WorkspaceConfirmation, WorkspaceDecision, WorkspaceEditor, WorkspaceEditorAttributes, WorkspaceEditorContext, WorkspaceEditorController, WorkspaceEntry, WorkspaceHost, WorkspacePreferences, WorkspaceSession, WorkspaceSessionTab, WorkspaceTab, WorkspaceTarget } from './workspace/index.js';

package/build/components/editor/index.js

@@ -2,8 +2,9 @@ import code from './code/index.js';
 import diffs from './diffs/index.js';
 import markdown from './markdown/index.js';
 import tree from './tree/index.js';
+import viewer from './viewer/index.js';
 import workspace from './workspace/index.js';
-const editor = { code, diffs, markdown, tree, workspace };
+const editor = { code, diffs, markdown, tree, viewer, workspace };
 export default editor;
 export * from './code/index.js';
 export { acceptChange, conflictMarkers, diff3, diffTexts, hunks, resolveMarker, revertChange, words } from './diffs/index.js';

package/build/components/editor/markdown/editing.js

@@ -1,6 +1,24 @@
 import { deleteCharacter } from '../code/commands.js';
 import { EditorDocument } from '../code/document.js';
 import { markdownBackspace, markdownEnter, toggleMarkdown } from './model.js';
+const FENCE = /^((?: {0,3}>[ \t]?)*) {0,3}(`{3,}|~{3,})[^`]*$/;
+function fence(document) {
+    let { end, start } = document.selection, index = document.lineAt(start), line = document.lineText(index), open = FENCE.exec(line);
+    if (!open || start !== end || start !== document.lineStart(index) + line.length) {
+        return false;
+    }
+    let marker = open[2], close = new RegExp(`^${open[1]} {0,3}${marker[0] === '`' ? '`' : '~'}{${marker.length},}[ \\t]*$`);
+    for (let i = index + 1, n = document.lineCount; i < n; i++) {
+        if (close.test(document.lineText(i))) {
+            return false;
+        }
+    }
+    let eol = document.eol;
+    return document.replace(start, start, eol + open[1] + eol + open[1] + marker, {
+        selection: { start: start + eol.length + open[1].length },
+        source: 'markdown-enter'
+    });
+}
 function run(document, command, kind) {
     if (command === 'bold' || command === 'italic') {
         return toggleMarkdown(document, command === 'bold' ? '**' : '*');
@@ -8,11 +26,12 @@ function run(document, command, kind) {
     if (command === 'backspace') {
         return markdownBackspace(document) || deleteCharacter(document, true);
     }
-    if (markdownEnter(document, kind?.(document.selection.start))) {
+    let at = kind?.(document.selection.start);
+    if (markdownEnter(document, at) || fence(document)) {
         return true;
     }
-    let { end, start } = document.selection, eol = document.eol;
-    return document.replace(start, end, eol, { selection: { start: start + eol.length }, source: 'markdown-enter' });
+    let { end, start } = document.selection, eol = document.eol, insert = at === 'paragraph' && document.lineText(document.lineAt(start)).trim() ? eol + eol : eol;
+    return document.replace(start, end, insert, { selection: { start: start + insert.length }, source: 'markdown-enter' });
 }
 const markdownCommand = (document, command, kind) => {
     let ranges = document.selections;

package/build/components/editor/markdown/erase.d.ts

@@ -0,0 +1,9 @@
+import type { Inline } from './inline.js';
+type Span = {
+    from: number;
+    to: number;
+};
+declare const reach: (text: string, spans: readonly Span[], offset: number, backward: boolean) => Span | null;
+declare const widen: (text: string, tokens: readonly Inline[], base: number, span: Span) => Span;
+export { reach, widen };
+export type { Span };

package/build/components/editor/markdown/erase.js

@@ -0,0 +1,78 @@
+const LINE_BREAK = /[\r\n]/;
+const WIDTHS = { em: 1, strike: 2, strong: 2 };
+let graphemes;
+function grapheme(text, offset, limit, backward) {
+    graphemes ??= new Intl.Segmenter(undefined, { granularity: 'grapheme' });
+    let window = backward ? text.slice(Math.max(limit, offset - 16), offset) : text.slice(offset, Math.min(limit, offset + 16)), length = 0;
+    for (let { segment } of graphemes.segment(window)) {
+        if (!backward) {
+            return segment.length;
+        }
+        length = segment.length;
+    }
+    return length;
+}
+const reach = (text, spans, offset, backward) => {
+    let next = null, previous = null;
+    for (let i = 0, n = spans.length; i < n; i++) {
+        let span = spans[i];
+        if (span.from === span.to) {
+            continue;
+        }
+        if (backward ? span.from < offset && offset <= span.to : span.from <= offset && offset < span.to) {
+            return backward
+                ? { from: offset - grapheme(text, offset, span.from, true), to: offset }
+                : { from: offset, to: offset + grapheme(text, offset, span.to, false) };
+        }
+        if (span.to <= offset) {
+            previous = span;
+        }
+        else if (!next && span.from >= offset) {
+            next = span;
+        }
+    }
+    if (backward) {
+        if (!previous) {
+            return null;
+        }
+        return LINE_BREAK.test(text.slice(previous.to, offset))
+            ? { from: previous.to, to: offset }
+            : { from: previous.to - grapheme(text, previous.to, previous.from, true), to: previous.to };
+    }
+    if (!next) {
+        return null;
+    }
+    return LINE_BREAK.test(text.slice(offset, next.from))
+        ? { from: offset, to: next.from }
+        : { from: next.from, to: next.from + grapheme(text, next.from, next.to, false) };
+};
+const widen = (text, tokens, base, span) => {
+    let found = true;
+    while (found) {
+        found = false;
+        let visit = (list) => {
+            for (let i = 0, n = list.length; i < n && !found; i++) {
+                let token = list[i];
+                if (base + token.from === span.from && base + token.to === span.to) {
+                    let width = WIDTHS[token.kind] ?? 0;
+                    if (token.kind === 'code') {
+                        while (text[span.from - width - 1] === '`') {
+                            width++;
+                        }
+                    }
+                    if (width && span.from - width >= 0) {
+                        span = { from: span.from - width, to: span.to + width };
+                        found = true;
+                    }
+                    return;
+                }
+                if (token.children && base + token.from <= span.from && span.to <= base + token.to) {
+                    visit(token.children);
+                }
+            }
+        };
+        visit(tokens);
+    }
+    return span;
+};
+export { reach, widen };

package/build/components/editor/markdown/index.d.ts

@@ -2,7 +2,6 @@ import { type Attributes } from '@esportsplus/template';
 import { EditorDocument } from '../code/document.js';
 import { type MarkdownController, type MarkdownOptions } from './view.js';
 import type { Callbacks } from '../code/view.js';
-import '../../../css-utilities/scrollbar/scss/index.scss';
 import '../code/scss/index.scss';
 import './scss/index.scss';
 type MarkdownEditorAttributes = Attributes & Callbacks & {

package/build/components/editor/markdown/index.js

@@ -2,7 +2,6 @@ import { effect, untrack } from '@esportsplus/reactivity';
 import { component } from '@esportsplus/template';
 import { EditorDocument } from '../code/document.js';
 import { view } from './view.js';
-import '../../../css-utilities/scrollbar/scss/index.scss';
 import '../code/scss/index.scss';
 import './scss/index.scss';
 export default component(function (input) {

package/build/components/editor/markdown/layout.d.ts

@@ -13,7 +13,6 @@ type Metrics = {
     width: number;
 };
 type Unit = {
-    active?: boolean;
     block: MarkdownBlock;
     continuation: boolean;
     continues: boolean;
@@ -29,16 +28,10 @@ type Window = {
     end: number;
     start: number;
 };
-declare const SCALED_LINE = 1.3;
 declare const SLICE_LINES = 32;
 declare const WINDOW_LIMIT = 120;
-declare const arrange: (blocks: readonly MarkdownBlock[], text: string, folds: readonly FoldRange[], cache: Cache, active: {
-    first: number;
-    last: number;
-    unit: Unit;
-} | null, raw: ((index: number) => boolean) | null) => Unit[];
+declare const arrange: (blocks: readonly MarkdownBlock[], text: string, folds: readonly FoldRange[], cache: Cache, raw: ((index: number) => boolean) | null) => Unit[];
 declare const cache: () => Cache;
-declare const headingScale: (level?: number) => number;
 declare const unitStart: (unit: Unit) => number;
 declare class MarkdownLayout {
     units: Unit[];
@@ -59,5 +52,5 @@ declare class MarkdownLayout {
     top(index: number): number;
     window(y: number, height: number, overscan?: number): Window;
 }
-export { arrange, cache, headingScale, MarkdownLayout, SCALED_LINE, SLICE_LINES, unitStart, WINDOW_LIMIT };
+export { arrange, cache, MarkdownLayout, SLICE_LINES, unitStart, WINDOW_LIMIT };
 export type { Unit };

package/build/components/editor/markdown/layout.js

@@ -74,14 +74,9 @@ function slice(block, text, raw) {
     }
     return out;
 }
-const arrange = (blocks, text, folds, cache, active, raw) => {
+const arrange = (blocks, text, folds, cache, raw) => {
     let f = 0, out = [];
     for (let i = 0, n = blocks.length; i < n; i++) {
-        if (active && i === active.first) {
-            out.push(active.unit);
-            i = active.last - 1;
-            continue;
-        }
         let block = blocks[i];
         while (f < folds.length && folds[f].to <= block.from) {
             f++;
@@ -249,4 +244,4 @@ class MarkdownLayout {
         return { end, start };
     }
 }
-export { arrange, cache, headingScale, MarkdownLayout, SCALED_LINE, SLICE_LINES, unitStart, WINDOW_LIMIT };
+export { arrange, cache, MarkdownLayout, SLICE_LINES, unitStart, WINDOW_LIMIT };

package/build/components/editor/markdown/render.d.ts

@@ -10,7 +10,6 @@ type Host = {
     fold: (unit: Unit) => void;
     foldable: (unit: Unit) => boolean;
     inline: (block: MarkdownBlock) => readonly Inline[];
-    press: (e: MouseEvent, unit: Unit) => void;
     readonly: () => boolean;
     shown: (element: HTMLElement, unit: Unit | null) => void;
     task: (block: MarkdownBlock) => void;