Rename and reorganize several widgets (#1462)

* Rename SwatchPairInput -> WorkingColorsButton

* Remove unnecessary Svelte each-loop keys

* Rename (and migrate) MenuBarInput -> MenuListButton

* Rename PivotAssist -> PivotInput

* Rename PersistentScrollbar -> ScrollbarInput and CanvasRuler -> RulerInput

* Rename DIalogModal -> Dialog

* Rename WidgetRow -> WidgetSpan
This commit is contained in:
Keavon Chambers
2023-11-18 04:34:30 -08:00
committed by GitHub
parent e3f5e7001f
commit 719c96ecd8
38 changed files with 375 additions and 389 deletions
@@ -319,7 +319,7 @@
<TextLabel tooltip="Red/Green/Blue channels of the color, integers 0–255">RGB</TextLabel>
<Separator />
<LayoutRow>
{#each rgbChannels as [channel, strength], index (channel)}
{#each rgbChannels as [channel, strength], index}
{#if index > 0}
<Separator type="Related" />
{/if}
@@ -343,7 +343,7 @@
>
<Separator />
<LayoutRow>
{#each hsvChannels as [channel, strength], index (channel)}
{#each hsvChannels as [channel, strength], index}
{#if index > 0}
<Separator type="Related" />
{/if}
@@ -26,7 +26,7 @@
</script>
<!-- TODO: Use https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog for improved accessibility -->
<FloatingMenu open={true} class="dialog-modal" type="Dialog" direction="Center" bind:this={self} data-dialog-modal>
<FloatingMenu open={true} class="dialog" type="Dialog" direction="Center" bind:this={self} data-dialog>
<LayoutRow class="header-area">
<!-- `$dialog.icon` class exists to provide special sizing in CSS to specific icons -->
<IconLabel icon={$dialog.icon} class={$dialog.icon.toLowerCase()} />
@@ -39,11 +39,11 @@
{/if}
{#if $dialog.panicDetails}
<div class="widget-layout details">
<div class="widget-row"><TextLabel bold={true}>The editor crashed — sorry about that</TextLabel></div>
<div class="widget-row"><TextLabel>Please report this by filing an issue on GitHub:</TextLabel></div>
<div class="widget-row"><TextButton label="Report Bug" icon="Warning" noBackground={true} action={() => window.open(githubUrl($dialog.panicDetails), "_blank")} /></div>
<div class="widget-row"><TextLabel multiline={true}>Reload the editor to continue. If this occurs<br />immediately on repeated reloads, clear storage:</TextLabel></div>
<div class="widget-row">
<div class="widget-span row"><TextLabel bold={true}>The editor crashed — sorry about that</TextLabel></div>
<div class="widget-span row"><TextLabel>Please report this by filing an issue on GitHub:</TextLabel></div>
<div class="widget-span row"><TextButton label="Report Bug" icon="Warning" noBackground={true} action={() => window.open(githubUrl($dialog.panicDetails), "_blank")} /></div>
<div class="widget-span row"><TextLabel multiline={true}>Reload the editor to continue. If this occurs<br />immediately on repeated reloads, clear storage:</TextLabel></div>
<div class="widget-span row">
<TextButton
label="Clear Saved Documents"
icon="Trash"
@@ -75,7 +75,7 @@
</FloatingMenu>
<style lang="scss" global>
.dialog-modal {
.dialog {
position: absolute;
pointer-events: none;
width: 100%;
@@ -103,7 +103,7 @@
const menuOpen = open;
const flatEntries = entries.flat().filter((entry) => !entry.disabled);
const openChild = flatEntries.findIndex((entry) => entry.children?.length && entry.ref?.open);
const openChild = flatEntries.findIndex((entry) => (entry.children?.length ?? 0) > 0 && entry.ref?.open);
const openSubmenu = (highlightedEntry: MenuListEntry) => {
if (highlightedEntry.ref && highlightedEntry.children?.length) {