anki/ts/editor/editor-toolbar/LatexButton.svelte

115 lines
3.6 KiB
Svelte
Raw Normal View History

<!--
Copyright: Ankitects Pty Ltd and contributors
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
-->
<script lang="ts">
import DropdownItem from "../../components/DropdownItem.svelte";
import IconButton from "../../components/IconButton.svelte";
import Popover from "../../components/Popover.svelte";
import Shortcut from "../../components/Shortcut.svelte";
import WithFloating from "../../components/WithFloating.svelte";
import { mathjaxConfig } from "../../editable/mathjax-element";
import * as tr from "../../lib/ftl";
import { getPlatformString } from "../../lib/shortcuts";
import { wrapInternal } from "../../lib/wrap";
Improved add-on extension API (#1626) * Add componentHook functionality * Register package NoteEditor * Rename OldEditorAdapter to NoteEditor * Expose instances in component-hook as well * Rename NoteTypeButtons to NotetypeButtons * Move PreviewButton initialization to BrowserEditor.svelte * Remove focusInRichText - Same thing can be done by inspecting activeInput * Satisfy formatter * Fix remaining rebase issues * Add .bazel to .prettierignore * Rename currentField and activeInput to focused{Field,Input} * Move identifier to lib and registration to sveltelib * Fix Dynamic component insertion * Simplify editingInputIsRichText * Give extra warning in svelte/svelte.ts - This was caused by doing a rename of a files, that only differed in case: NoteTypeButtons.svelte to NotetypeButtons.svelte - It was quite tough to figure out, and this console.log might make it easier if it ever happens again * Change signature of contextProperty * Add ts/typings for add-on definition files * Add Anki types in typings/common/index.d.ts * Export without .svelte suffix It conflicts with how Svelte types its packages * Fix left over .svelte import from editor.py * Rename NoteTypeButtons to unrelated to ensure case-only rename * Rename back to NotetypeButtons.svelte * Remove unused component-hook.ts, Fix typing in lifecycle-hooks * Merge runtime-require and register-package into one file + Give some preliminary types to require * Rename uiDidLoad to loaded * Fix eslint / svelte-check * Rename context imports to noteEditorContext * Fix import name mismatch - I wonder why these issues are not caught by svelte-check? * Rename two missed usages of uiDidLoad * Fix ButtonDropdown from having wrong border-radius * Uniformly rename libraries to packages - I don't have a strong opinion on whether to name them libraries or packages, I just think we should have a uniform name. - JS/TS only uses the terms "module" and "namespace", however `package` is a reserved keyword for future use, whereas `library` is not. * Refactor registration.ts into dynamic-slotting - This is part of an effort to refactor the dynamic slotting (extending buttons) functionality out of components like ButtonGroup. * Remove dynamically-slottable logic from ButtonToolbar * Use DynamicallySlottable in editor-toolbar * Fix no border radius on indentation button dropdown * Fix AddonButtons * Remove Item/ButtonGroupItem in deck-options, where it's not necessary * Remove unnecessary uses of Item and ButtonGroupItem * Fix remaining tests * Fix relative imports * Revert change return value of remapBinToSrcDir to ./bazel/out... * Remove typings directory * Adjust comments for dynamic-slottings
2022-02-03 05:52:11 +01:00
import { context as noteEditorContext } from "../NoteEditor.svelte";
import type { RichTextInputAPI } from "../rich-text-input";
Improved add-on extension API (#1626) * Add componentHook functionality * Register package NoteEditor * Rename OldEditorAdapter to NoteEditor * Expose instances in component-hook as well * Rename NoteTypeButtons to NotetypeButtons * Move PreviewButton initialization to BrowserEditor.svelte * Remove focusInRichText - Same thing can be done by inspecting activeInput * Satisfy formatter * Fix remaining rebase issues * Add .bazel to .prettierignore * Rename currentField and activeInput to focused{Field,Input} * Move identifier to lib and registration to sveltelib * Fix Dynamic component insertion * Simplify editingInputIsRichText * Give extra warning in svelte/svelte.ts - This was caused by doing a rename of a files, that only differed in case: NoteTypeButtons.svelte to NotetypeButtons.svelte - It was quite tough to figure out, and this console.log might make it easier if it ever happens again * Change signature of contextProperty * Add ts/typings for add-on definition files * Add Anki types in typings/common/index.d.ts * Export without .svelte suffix It conflicts with how Svelte types its packages * Fix left over .svelte import from editor.py * Rename NoteTypeButtons to unrelated to ensure case-only rename * Rename back to NotetypeButtons.svelte * Remove unused component-hook.ts, Fix typing in lifecycle-hooks * Merge runtime-require and register-package into one file + Give some preliminary types to require * Rename uiDidLoad to loaded * Fix eslint / svelte-check * Rename context imports to noteEditorContext * Fix import name mismatch - I wonder why these issues are not caught by svelte-check? * Rename two missed usages of uiDidLoad * Fix ButtonDropdown from having wrong border-radius * Uniformly rename libraries to packages - I don't have a strong opinion on whether to name them libraries or packages, I just think we should have a uniform name. - JS/TS only uses the terms "module" and "namespace", however `package` is a reserved keyword for future use, whereas `library` is not. * Refactor registration.ts into dynamic-slotting - This is part of an effort to refactor the dynamic slotting (extending buttons) functionality out of components like ButtonGroup. * Remove dynamically-slottable logic from ButtonToolbar * Use DynamicallySlottable in editor-toolbar * Fix no border radius on indentation button dropdown * Fix AddonButtons * Remove Item/ButtonGroupItem in deck-options, where it's not necessary * Remove unnecessary uses of Item and ButtonGroupItem * Fix remaining tests * Fix relative imports * Revert change return value of remapBinToSrcDir to ./bazel/out... * Remove typings directory * Adjust comments for dynamic-slottings
2022-02-03 05:52:11 +01:00
import { editingInputIsRichText } from "../rich-text-input";
import { functionIcon } from "./icons";
Improved add-on extension API (#1626) * Add componentHook functionality * Register package NoteEditor * Rename OldEditorAdapter to NoteEditor * Expose instances in component-hook as well * Rename NoteTypeButtons to NotetypeButtons * Move PreviewButton initialization to BrowserEditor.svelte * Remove focusInRichText - Same thing can be done by inspecting activeInput * Satisfy formatter * Fix remaining rebase issues * Add .bazel to .prettierignore * Rename currentField and activeInput to focused{Field,Input} * Move identifier to lib and registration to sveltelib * Fix Dynamic component insertion * Simplify editingInputIsRichText * Give extra warning in svelte/svelte.ts - This was caused by doing a rename of a files, that only differed in case: NoteTypeButtons.svelte to NotetypeButtons.svelte - It was quite tough to figure out, and this console.log might make it easier if it ever happens again * Change signature of contextProperty * Add ts/typings for add-on definition files * Add Anki types in typings/common/index.d.ts * Export without .svelte suffix It conflicts with how Svelte types its packages * Fix left over .svelte import from editor.py * Rename NoteTypeButtons to unrelated to ensure case-only rename * Rename back to NotetypeButtons.svelte * Remove unused component-hook.ts, Fix typing in lifecycle-hooks * Merge runtime-require and register-package into one file + Give some preliminary types to require * Rename uiDidLoad to loaded * Fix eslint / svelte-check * Rename context imports to noteEditorContext * Fix import name mismatch - I wonder why these issues are not caught by svelte-check? * Rename two missed usages of uiDidLoad * Fix ButtonDropdown from having wrong border-radius * Uniformly rename libraries to packages - I don't have a strong opinion on whether to name them libraries or packages, I just think we should have a uniform name. - JS/TS only uses the terms "module" and "namespace", however `package` is a reserved keyword for future use, whereas `library` is not. * Refactor registration.ts into dynamic-slotting - This is part of an effort to refactor the dynamic slotting (extending buttons) functionality out of components like ButtonGroup. * Remove dynamically-slottable logic from ButtonToolbar * Use DynamicallySlottable in editor-toolbar * Fix no border radius on indentation button dropdown * Fix AddonButtons * Remove Item/ButtonGroupItem in deck-options, where it's not necessary * Remove unnecessary uses of Item and ButtonGroupItem * Fix remaining tests * Fix relative imports * Revert change return value of remapBinToSrcDir to ./bazel/out... * Remove typings directory * Adjust comments for dynamic-slottings
2022-02-03 05:52:11 +01:00
const { focusedInput } = noteEditorContext.get();
$: richTextAPI = $focusedInput as RichTextInputAPI;
async function surround(front: string, back: string): Promise<void> {
const element = await richTextAPI.element;
wrapInternal(element, front, back, false);
}
function onMathjaxInline(): void {
if (mathjaxConfig.enabled) {
surround("<anki-mathjax focusonmount>", "</anki-mathjax>");
} else {
surround("\\(", "\\)");
}
}
function onMathjaxBlock(): void {
if (mathjaxConfig.enabled) {
surround('<anki-mathjax block="true" focusonmount>', "</anki-matjax>");
} else {
surround("\\[", "\\]");
}
}
function onMathjaxChemistry(): void {
if (mathjaxConfig.enabled) {
surround('<anki-mathjax focusonmount="0,4">\\ce{', "}</anki-mathjax>");
} else {
surround("\\(\\ce{", "}\\)");
}
}
function onLatex(): void {
surround("[latex]", "[/latex]");
}
function onLatexEquation(): void {
surround("[$]", "[/$]");
}
function onLatexMathEnv(): void {
surround("[$$]", "[/$$]");
}
type LatexItem = [() => void, string, string];
const dropdownItems: LatexItem[] = [
[onMathjaxInline, "Control+M, M", tr.editingMathjaxInline()],
[onMathjaxBlock, "Control+M, E", tr.editingMathjaxBlock()],
[onMathjaxChemistry, "Control+M, C", tr.editingMathjaxChemistry()],
[onLatex, "Control+T, T", tr.editingLatex()],
[onLatexEquation, "Control+T, E", tr.editingLatexEquation()],
[onLatexMathEnv, "Control+T, M", tr.editingLatexMathEnv()],
];
Improved add-on extension API (#1626) * Add componentHook functionality * Register package NoteEditor * Rename OldEditorAdapter to NoteEditor * Expose instances in component-hook as well * Rename NoteTypeButtons to NotetypeButtons * Move PreviewButton initialization to BrowserEditor.svelte * Remove focusInRichText - Same thing can be done by inspecting activeInput * Satisfy formatter * Fix remaining rebase issues * Add .bazel to .prettierignore * Rename currentField and activeInput to focused{Field,Input} * Move identifier to lib and registration to sveltelib * Fix Dynamic component insertion * Simplify editingInputIsRichText * Give extra warning in svelte/svelte.ts - This was caused by doing a rename of a files, that only differed in case: NoteTypeButtons.svelte to NotetypeButtons.svelte - It was quite tough to figure out, and this console.log might make it easier if it ever happens again * Change signature of contextProperty * Add ts/typings for add-on definition files * Add Anki types in typings/common/index.d.ts * Export without .svelte suffix It conflicts with how Svelte types its packages * Fix left over .svelte import from editor.py * Rename NoteTypeButtons to unrelated to ensure case-only rename * Rename back to NotetypeButtons.svelte * Remove unused component-hook.ts, Fix typing in lifecycle-hooks * Merge runtime-require and register-package into one file + Give some preliminary types to require * Rename uiDidLoad to loaded * Fix eslint / svelte-check * Rename context imports to noteEditorContext * Fix import name mismatch - I wonder why these issues are not caught by svelte-check? * Rename two missed usages of uiDidLoad * Fix ButtonDropdown from having wrong border-radius * Uniformly rename libraries to packages - I don't have a strong opinion on whether to name them libraries or packages, I just think we should have a uniform name. - JS/TS only uses the terms "module" and "namespace", however `package` is a reserved keyword for future use, whereas `library` is not. * Refactor registration.ts into dynamic-slotting - This is part of an effort to refactor the dynamic slotting (extending buttons) functionality out of components like ButtonGroup. * Remove dynamically-slottable logic from ButtonToolbar * Use DynamicallySlottable in editor-toolbar * Fix no border radius on indentation button dropdown * Fix AddonButtons * Remove Item/ButtonGroupItem in deck-options, where it's not necessary * Remove unnecessary uses of Item and ButtonGroupItem * Fix remaining tests * Fix relative imports * Revert change return value of remapBinToSrcDir to ./bazel/out... * Remove typings directory * Adjust comments for dynamic-slottings
2022-02-03 05:52:11 +01:00
$: disabled = !editingInputIsRichText($focusedInput);
Use WithFloating for MathjaxOverlay (#2011) * Allow passing in reference into WithFloating as prop * Fix WithAutocomplete * Fix WithFloating for MathjaxOverlay * Add resize-store * Allow passing debug=True to jest_test for debugger support (#2013) * Disable auto-closing of HTML tags https://forums.ankiweb.net/t/set-html-editor-as-a-default-editor-instead-of-visual-editor/20988/3 Closes #1963 * Add slight margin to MathjaxEditor * Enable passing offset and shift to WithFloating * Hide overflow of mathjax editor * Add automatic hide functionality to sveltelib/position * Last polishes for Surrounder class (#2017) * Make private properties in Surrounder truly private * Fix remove logic of Surrounder * No reason for toggleTriggerRemove to be async * Allow using alt-shift to set all remove formats but this one * modifyFormat => updateFormat * Fix formatting * Fix field descriptions blocking cursor from being set (#2018) - happens when focus is in HTML editor * Remove hiding functionality again until it's really useful * Add support for autoPlacement * Implement new WithFloating that supports manually calling position() * Implement hide mechanisms * Add option in math dropdown to toggle MathJax rendering (#2014) * Add option in math dropdown to toggle MathJax rendering Closes #1942 * Hackily redraw the page when toggling MathJax * Add Fluent string * Default input setting in fields dialog (#1987) (kleinerpirat) * Introduce field setting to use plain text editor by default (kleinerpirat) * Remove leftover function from #1476 * Use boolean instead of string * Simplify clear_other_field_duplicates * Convert plain text key to camelCase * Move HTML item below the existing checkbox, instead of to the right (dae) Showing it on the right is more space efficient, but feels a bit cluttered IMHO. * Fix not being able to scroll when mouse hovers PlainTextInput (#2019) * Remove overscroll-behavior: none for * (all elements) * Revert "Remove overscroll-behavior: none for * (all elements)" This reverts commit 189358908cecd03027e19d8fe47822735319ec17. * Use body instead of *, but keep CSS rule * Unify two CSS rules * Remove console.logs * Reposition mathjax menu on switching between inline/block * Implement WithOverlay * Implement FloatingArrow * Display overlay with padding and brighter background * Rename to MathjaxOverlay * Simplify MathjaxOverlay component overall * Rename ImageHandle to image overlay * Generally fix ImageOverlay again * Increase z-index of StickyContainer * Fix setting block or inline on mathjax * Add reasons in closing-{click,keyup} * Have both WithFloating and WithOverlay use a simple show flag instead of a store * Remove subscribe-trigger * Fix clicking from one mathjax element to another * Check before executing cleanup * Do not wait for elements to mount before slotting in With{Floating,Overlay} * Allow using reference slot for WithFloating and WithOveray * Add inline argument to options * Add support for inline slot in WithOvelay * Use WithFloating for RemoveFormatButton * Remove last uses of DropdownMenu and WithDropdown * Remove all of the bootstrap dropdown components * Fix closing behavior of several buttons and ImageOverlay * Increase popover padding to 6px * Find a different way to create some padding at the bottom of the fields ...before the tag editor @kleinerpirat I think is what this css what trying to achieve? * Satisfy tests * Use removeStyleProperties in ImageOverlay * Use notify function in WithOverlay and WithFloating * Do not use portal for WithFloating and WithOverlay Allows for scrolling * Set hidden to default false in Rich/Plain TextInput * Reset handle when changing mathjax elements via click * Restrict size of empty mathjax image * Prevent sticky labels from obscuring menus * Remove several overflow-hidden * Fix empty string being falsy bug when editing mathjax * Do not import portal anymore * Use { reason, originalEvent } instead of symbol as update to modified event store * Fix closing behavior of image overlay (do not close after resize) * Simplify Collapsible * Use removeStyleProperties in Collapsible * Satisfy eslint * Fix latex shortcuts being mounted * Fix mathjax overlay not focusable in first field * Neither hide image overlay on escaped * Fix Block ButtonDropdown wrapping * Bring back portal to fix tag editor
2022-09-05 09:20:00 +02:00
let showFloating = false;
</script>
Use WithFloating for MathjaxOverlay (#2011) * Allow passing in reference into WithFloating as prop * Fix WithAutocomplete * Fix WithFloating for MathjaxOverlay * Add resize-store * Allow passing debug=True to jest_test for debugger support (#2013) * Disable auto-closing of HTML tags https://forums.ankiweb.net/t/set-html-editor-as-a-default-editor-instead-of-visual-editor/20988/3 Closes #1963 * Add slight margin to MathjaxEditor * Enable passing offset and shift to WithFloating * Hide overflow of mathjax editor * Add automatic hide functionality to sveltelib/position * Last polishes for Surrounder class (#2017) * Make private properties in Surrounder truly private * Fix remove logic of Surrounder * No reason for toggleTriggerRemove to be async * Allow using alt-shift to set all remove formats but this one * modifyFormat => updateFormat * Fix formatting * Fix field descriptions blocking cursor from being set (#2018) - happens when focus is in HTML editor * Remove hiding functionality again until it's really useful * Add support for autoPlacement * Implement new WithFloating that supports manually calling position() * Implement hide mechanisms * Add option in math dropdown to toggle MathJax rendering (#2014) * Add option in math dropdown to toggle MathJax rendering Closes #1942 * Hackily redraw the page when toggling MathJax * Add Fluent string * Default input setting in fields dialog (#1987) (kleinerpirat) * Introduce field setting to use plain text editor by default (kleinerpirat) * Remove leftover function from #1476 * Use boolean instead of string * Simplify clear_other_field_duplicates * Convert plain text key to camelCase * Move HTML item below the existing checkbox, instead of to the right (dae) Showing it on the right is more space efficient, but feels a bit cluttered IMHO. * Fix not being able to scroll when mouse hovers PlainTextInput (#2019) * Remove overscroll-behavior: none for * (all elements) * Revert "Remove overscroll-behavior: none for * (all elements)" This reverts commit 189358908cecd03027e19d8fe47822735319ec17. * Use body instead of *, but keep CSS rule * Unify two CSS rules * Remove console.logs * Reposition mathjax menu on switching between inline/block * Implement WithOverlay * Implement FloatingArrow * Display overlay with padding and brighter background * Rename to MathjaxOverlay * Simplify MathjaxOverlay component overall * Rename ImageHandle to image overlay * Generally fix ImageOverlay again * Increase z-index of StickyContainer * Fix setting block or inline on mathjax * Add reasons in closing-{click,keyup} * Have both WithFloating and WithOverlay use a simple show flag instead of a store * Remove subscribe-trigger * Fix clicking from one mathjax element to another * Check before executing cleanup * Do not wait for elements to mount before slotting in With{Floating,Overlay} * Allow using reference slot for WithFloating and WithOveray * Add inline argument to options * Add support for inline slot in WithOvelay * Use WithFloating for RemoveFormatButton * Remove last uses of DropdownMenu and WithDropdown * Remove all of the bootstrap dropdown components * Fix closing behavior of several buttons and ImageOverlay * Increase popover padding to 6px * Find a different way to create some padding at the bottom of the fields ...before the tag editor @kleinerpirat I think is what this css what trying to achieve? * Satisfy tests * Use removeStyleProperties in ImageOverlay * Use notify function in WithOverlay and WithFloating * Do not use portal for WithFloating and WithOverlay Allows for scrolling * Set hidden to default false in Rich/Plain TextInput * Reset handle when changing mathjax elements via click * Restrict size of empty mathjax image * Prevent sticky labels from obscuring menus * Remove several overflow-hidden * Fix empty string being falsy bug when editing mathjax * Do not import portal anymore * Use { reason, originalEvent } instead of symbol as update to modified event store * Fix closing behavior of image overlay (do not close after resize) * Simplify Collapsible * Use removeStyleProperties in Collapsible * Satisfy eslint * Fix latex shortcuts being mounted * Fix mathjax overlay not focusable in first field * Neither hide image overlay on escaped * Fix Block ButtonDropdown wrapping * Bring back portal to fix tag editor
2022-09-05 09:20:00 +02:00
<WithFloating
show={showFloating && !disabled}
closeOnInsideClick
inline
on:close={() => (showFloating = false)}
>
<IconButton
slot="reference"
{disabled}
on:click={() => (showFloating = !showFloating)}
>
{@html functionIcon}
</IconButton>
Fuzzy search in symbol insertion overlay (#2059) * Add flag for enabling insert symbols feature * Add symbols overlay directory * Detect if :xy is inserted into editable * Allow naive updating of overlay, and special handling of ':' * First step towards better Virtual Element support * Update floating to reference range on insert text * Position SymbolsOverlay always on top or bottom * Add a data-provider to emulate API * Show correct suggestions in symbols overlay * Rename to replacementLength * Allow replacing via clicking in menu * Optionally remove inline padding of Popover * Hide Symbols overlay on blur of content editable * Add specialKey to inputHandler and generalize how arrow movement is detected - This way macOS users can use Ctrl-N to mean down, etc. * Detect special key from within SymbolsOverlay * Implement full backwards search while typing * Allow navigating symbol menu and accepting with enter * Add some entries to data-provider * Satisfy eslint * Generate symbolsTable from sources * Use other github source, allow multiple names In return, symbol must be unique * Automatically scroll in symbols dropdown * Use from npm packages rather than downloading from URL * Remove console.log * Remove print Co-authored-by: Damien Elmes <dae@users.noreply.github.com> * Add pointerDown event to input-handler - so that SymbolsOverlay can reset on field click * Make tab do the same as enter * Make font a bit smaller but increase relative icon size * Satisfy type requirement of handlerlist * Revert changing default size of DropdownItems * Remove some now unused code for bootstrap dropdowns * Use fuse to allow fuzzy searching of symbols * Remove unnecessary async handling in data-provider I did that because at first I was still expecting to fetch the symbols from the backend * Apply field font family in symbol preview * Remove inline padding from latex popover * Rename data-provier to symbols-table * Add some explaining comments to interface * Allow for auto insertion symbols * Use deleteData and after instead of replaceData * Allow using html in symbols * Show html symbols as html * Add SymbolsEntry component * Also include containshtml at low search precedence * Put character entities and gemoji into their own files * Factor out prepareInsertion method * Allow deletion while searching for correct symbol * Respect insertCompositionText * Delete data-provider * Restrict auto insert queries to max 5 characters * Satisfy svelte check * Fix the overlay sometimes not showing This will make sure to always normalize text nodes before searching. However it adjacent text is partially formatted, this will still not find the whole query. For example, currently, entering `<b>:for</b>al` and then inputting `l`, will not trigger a search for `forall`, because of the <b> formatting * Add empty line * Do not trigger overlay, when last character is whitespace or colon * Add missing fuse license
2022-09-13 06:19:19 +02:00
<Popover slot="floating" --popover-padding-inline="0">
{#each dropdownItems as [callback, keyCombination, label]}
<DropdownItem on:click={callback}>
Use WithFloating for MathjaxOverlay (#2011) * Allow passing in reference into WithFloating as prop * Fix WithAutocomplete * Fix WithFloating for MathjaxOverlay * Add resize-store * Allow passing debug=True to jest_test for debugger support (#2013) * Disable auto-closing of HTML tags https://forums.ankiweb.net/t/set-html-editor-as-a-default-editor-instead-of-visual-editor/20988/3 Closes #1963 * Add slight margin to MathjaxEditor * Enable passing offset and shift to WithFloating * Hide overflow of mathjax editor * Add automatic hide functionality to sveltelib/position * Last polishes for Surrounder class (#2017) * Make private properties in Surrounder truly private * Fix remove logic of Surrounder * No reason for toggleTriggerRemove to be async * Allow using alt-shift to set all remove formats but this one * modifyFormat => updateFormat * Fix formatting * Fix field descriptions blocking cursor from being set (#2018) - happens when focus is in HTML editor * Remove hiding functionality again until it's really useful * Add support for autoPlacement * Implement new WithFloating that supports manually calling position() * Implement hide mechanisms * Add option in math dropdown to toggle MathJax rendering (#2014) * Add option in math dropdown to toggle MathJax rendering Closes #1942 * Hackily redraw the page when toggling MathJax * Add Fluent string * Default input setting in fields dialog (#1987) (kleinerpirat) * Introduce field setting to use plain text editor by default (kleinerpirat) * Remove leftover function from #1476 * Use boolean instead of string * Simplify clear_other_field_duplicates * Convert plain text key to camelCase * Move HTML item below the existing checkbox, instead of to the right (dae) Showing it on the right is more space efficient, but feels a bit cluttered IMHO. * Fix not being able to scroll when mouse hovers PlainTextInput (#2019) * Remove overscroll-behavior: none for * (all elements) * Revert "Remove overscroll-behavior: none for * (all elements)" This reverts commit 189358908cecd03027e19d8fe47822735319ec17. * Use body instead of *, but keep CSS rule * Unify two CSS rules * Remove console.logs * Reposition mathjax menu on switching between inline/block * Implement WithOverlay * Implement FloatingArrow * Display overlay with padding and brighter background * Rename to MathjaxOverlay * Simplify MathjaxOverlay component overall * Rename ImageHandle to image overlay * Generally fix ImageOverlay again * Increase z-index of StickyContainer * Fix setting block or inline on mathjax * Add reasons in closing-{click,keyup} * Have both WithFloating and WithOverlay use a simple show flag instead of a store * Remove subscribe-trigger * Fix clicking from one mathjax element to another * Check before executing cleanup * Do not wait for elements to mount before slotting in With{Floating,Overlay} * Allow using reference slot for WithFloating and WithOveray * Add inline argument to options * Add support for inline slot in WithOvelay * Use WithFloating for RemoveFormatButton * Remove last uses of DropdownMenu and WithDropdown * Remove all of the bootstrap dropdown components * Fix closing behavior of several buttons and ImageOverlay * Increase popover padding to 6px * Find a different way to create some padding at the bottom of the fields ...before the tag editor @kleinerpirat I think is what this css what trying to achieve? * Satisfy tests * Use removeStyleProperties in ImageOverlay * Use notify function in WithOverlay and WithFloating * Do not use portal for WithFloating and WithOverlay Allows for scrolling * Set hidden to default false in Rich/Plain TextInput * Reset handle when changing mathjax elements via click * Restrict size of empty mathjax image * Prevent sticky labels from obscuring menus * Remove several overflow-hidden * Fix empty string being falsy bug when editing mathjax * Do not import portal anymore * Use { reason, originalEvent } instead of symbol as update to modified event store * Fix closing behavior of image overlay (do not close after resize) * Simplify Collapsible * Use removeStyleProperties in Collapsible * Satisfy eslint * Fix latex shortcuts being mounted * Fix mathjax overlay not focusable in first field * Neither hide image overlay on escaped * Fix Block ButtonDropdown wrapping * Bring back portal to fix tag editor
2022-09-05 09:20:00 +02:00
<span>{label}</span>
Move all buttons to our custom inline surrounding (#1682) * Clarify some comments * Don't destructure insertion trigger * Make superscript and subscript use domlib/surround * Create new {Text,Highlight}ColorButton * Use domlib/surround for textcolor - However there's still a crucial bug, when you're breaking existing colored span when unsurrounding, their color is not restored * Add underline format to removeFormats * Simplify type of ElementMatcher and ElementClearer for end users * Add some comments for normalize-insertion-ranges * Split normalize-insertion-ranges into remove-adjacent and remove-within * Factor out find-remove from unsurround.ts * Rename merge-mach, simplify remove-within * Clarify some comments * Refactor first reduce * Refactor reduceRight * Flatten functions in merge-ranges * Move some functionality to merge-ranges and do not export * Refactor merge-ranges * Remove createInitialMergeMatch * Finish refactoring of merge-ranges * Refactor merge-ranges to minimal-ranges and add some unit testing * Move more logic into text-node * Remove most most of the logic from remove-adjacent - remove-adjacent is still part of the "merging" logic, as it increases the scope of the child node ranges * Add some tests for edge cases * Merge remove-adjacent logic into minimal-ranges * Refactor unnecessary list destructuring * Add some TODOs * Put removing nodes and adding new nodes into sequence * Refactor MatchResult to MatchType and return clear from matcher * Inline surround/helpers * Shorten name of param * Add another edge case test * Add an example where commonAncestorContainer != normalization level * Fix bug in find-adjacent when find more than one nested nodes * Allow comments for Along type * Simplify find-adjacent by removing intermediate and/or curried functions * Remove extend-adjacent * Add more tests when find-adjacent finds by descension * Fix find-adjacent descending into block-level elements * Add clarifying comment to refusing to descend into block-level elements * Move shifting logic into find-adjacent * Rename file matcher to match-type * Give a first implemention of TreeVertex * Remove MatchType.ALONG - findAdjacent now directly modifies the range * Rename MatchType.MATCH into MatchType.REMOVE * Implement a version of find-within that utilizies match-tree * Turn child node range into a class * Fix bug in new find-adjacent function * Make all find-adjacent tests test for ranges * Surrounding within farthestMatchingAncestor when available * Fix an issue with negligable elements - also rename "along" elements to "negligable" * Add two TODOs to SurroundFormat interface * Have a messy first implementation of the new tree-node algorithm * Maintain whether formatting nodes are covered or within user selection * Move covered and insideRange into TreeNode superclass * Reimplement findAdjacent logic * Add extension logic * Add an evaluate method to nodes * Introduce BlockNode * Add a first evaluate implementation * Add left shift and inner shift logic * Implement SurroundFormatUser * Allow pass in formatter, ascender and merger from outside * Fix insideRange and covered switch-up * Fix MatchNode.prototype.isAscendable * Fix another switch-up of covered and insideRange... * Remove a lot of old code * Have surround functions only return the range - I still cannot think of a good reason why we should return addedNodes and removedNodes, except for testing. * Create formatting-tree directory * Create build-tree directory + Move find-above up to /domlib * Remove range-anchors * Move unsurround logic into no-splitting * Fix extend-merge * Fix inner shift being eroneusly returned as left shift * Fix oversight in SplitRange * Redefine how ranges are recreated * Rename covered to insideMatch and put as fourth parameter instead of third * Keep track of match holes and match leaves * Rename ChildNodeRange to FlatRange * Change signature of matcher * Fix bug in extend-merge * Improve Match class * Utilize cache in TextColorButton * Implement getBaseSurrounder for TextColorButton * Add matchAncestors field to FormattingNode * Introduce matchAncestors and getCache * Do clearing during parsing already - This way, you know whether elements will be removed before getting to Formatting nodes * Make HighlightColorButton use our surround mechanism * Fix a bug with calling .removeAttribute and .hasAttribute * Add side button to RemoveFormat button * Add disabled to remove format side button * Expose remove formats on RemoveFormat button * Reinvent editor/surround as Surrounder class * Fix split-text when working with insert trigger * Try counteracting the contenteditable's auto surrounding * Remove matching elements before normalizing * Rewrite match-type * Move setting match leaves into build * Change editing strings - So that color strings match bold/italic strings better * Fix border radius of List options menu * Implement extensions functionality * Remove some unnecessary code * Fix split range endOffset * Type MatchType * Reformat MatchType + add docs * Fix domlib/surround/apply * Satisfy last tests * Register Surrounder as package * Clarify some comments * Correctly implement reformat * Reformat with inactive eraser formats * Clear empty spans with RemoveFormatButton * Fix Super/Subscript button * Use ftl string for hardcoded tooltip * Adjust wording
2022-02-22 13:17:22 +01:00
<span class="ms-auto ps-2 shortcut"
>{getPlatformString(keyCombination)}</span
>
</DropdownItem>
{/each}
</Popover>
</WithFloating>
Move all buttons to our custom inline surrounding (#1682) * Clarify some comments * Don't destructure insertion trigger * Make superscript and subscript use domlib/surround * Create new {Text,Highlight}ColorButton * Use domlib/surround for textcolor - However there's still a crucial bug, when you're breaking existing colored span when unsurrounding, their color is not restored * Add underline format to removeFormats * Simplify type of ElementMatcher and ElementClearer for end users * Add some comments for normalize-insertion-ranges * Split normalize-insertion-ranges into remove-adjacent and remove-within * Factor out find-remove from unsurround.ts * Rename merge-mach, simplify remove-within * Clarify some comments * Refactor first reduce * Refactor reduceRight * Flatten functions in merge-ranges * Move some functionality to merge-ranges and do not export * Refactor merge-ranges * Remove createInitialMergeMatch * Finish refactoring of merge-ranges * Refactor merge-ranges to minimal-ranges and add some unit testing * Move more logic into text-node * Remove most most of the logic from remove-adjacent - remove-adjacent is still part of the "merging" logic, as it increases the scope of the child node ranges * Add some tests for edge cases * Merge remove-adjacent logic into minimal-ranges * Refactor unnecessary list destructuring * Add some TODOs * Put removing nodes and adding new nodes into sequence * Refactor MatchResult to MatchType and return clear from matcher * Inline surround/helpers * Shorten name of param * Add another edge case test * Add an example where commonAncestorContainer != normalization level * Fix bug in find-adjacent when find more than one nested nodes * Allow comments for Along type * Simplify find-adjacent by removing intermediate and/or curried functions * Remove extend-adjacent * Add more tests when find-adjacent finds by descension * Fix find-adjacent descending into block-level elements * Add clarifying comment to refusing to descend into block-level elements * Move shifting logic into find-adjacent * Rename file matcher to match-type * Give a first implemention of TreeVertex * Remove MatchType.ALONG - findAdjacent now directly modifies the range * Rename MatchType.MATCH into MatchType.REMOVE * Implement a version of find-within that utilizies match-tree * Turn child node range into a class * Fix bug in new find-adjacent function * Make all find-adjacent tests test for ranges * Surrounding within farthestMatchingAncestor when available * Fix an issue with negligable elements - also rename "along" elements to "negligable" * Add two TODOs to SurroundFormat interface * Have a messy first implementation of the new tree-node algorithm * Maintain whether formatting nodes are covered or within user selection * Move covered and insideRange into TreeNode superclass * Reimplement findAdjacent logic * Add extension logic * Add an evaluate method to nodes * Introduce BlockNode * Add a first evaluate implementation * Add left shift and inner shift logic * Implement SurroundFormatUser * Allow pass in formatter, ascender and merger from outside * Fix insideRange and covered switch-up * Fix MatchNode.prototype.isAscendable * Fix another switch-up of covered and insideRange... * Remove a lot of old code * Have surround functions only return the range - I still cannot think of a good reason why we should return addedNodes and removedNodes, except for testing. * Create formatting-tree directory * Create build-tree directory + Move find-above up to /domlib * Remove range-anchors * Move unsurround logic into no-splitting * Fix extend-merge * Fix inner shift being eroneusly returned as left shift * Fix oversight in SplitRange * Redefine how ranges are recreated * Rename covered to insideMatch and put as fourth parameter instead of third * Keep track of match holes and match leaves * Rename ChildNodeRange to FlatRange * Change signature of matcher * Fix bug in extend-merge * Improve Match class * Utilize cache in TextColorButton * Implement getBaseSurrounder for TextColorButton * Add matchAncestors field to FormattingNode * Introduce matchAncestors and getCache * Do clearing during parsing already - This way, you know whether elements will be removed before getting to Formatting nodes * Make HighlightColorButton use our surround mechanism * Fix a bug with calling .removeAttribute and .hasAttribute * Add side button to RemoveFormat button * Add disabled to remove format side button * Expose remove formats on RemoveFormat button * Reinvent editor/surround as Surrounder class * Fix split-text when working with insert trigger * Try counteracting the contenteditable's auto surrounding * Remove matching elements before normalizing * Rewrite match-type * Move setting match leaves into build * Change editing strings - So that color strings match bold/italic strings better * Fix border radius of List options menu * Implement extensions functionality * Remove some unnecessary code * Fix split range endOffset * Type MatchType * Reformat MatchType + add docs * Fix domlib/surround/apply * Satisfy last tests * Register Surrounder as package * Clarify some comments * Correctly implement reformat * Reformat with inactive eraser formats * Clear empty spans with RemoveFormatButton * Fix Super/Subscript button * Use ftl string for hardcoded tooltip * Adjust wording
2022-02-22 13:17:22 +01:00
Use WithFloating for MathjaxOverlay (#2011) * Allow passing in reference into WithFloating as prop * Fix WithAutocomplete * Fix WithFloating for MathjaxOverlay * Add resize-store * Allow passing debug=True to jest_test for debugger support (#2013) * Disable auto-closing of HTML tags https://forums.ankiweb.net/t/set-html-editor-as-a-default-editor-instead-of-visual-editor/20988/3 Closes #1963 * Add slight margin to MathjaxEditor * Enable passing offset and shift to WithFloating * Hide overflow of mathjax editor * Add automatic hide functionality to sveltelib/position * Last polishes for Surrounder class (#2017) * Make private properties in Surrounder truly private * Fix remove logic of Surrounder * No reason for toggleTriggerRemove to be async * Allow using alt-shift to set all remove formats but this one * modifyFormat => updateFormat * Fix formatting * Fix field descriptions blocking cursor from being set (#2018) - happens when focus is in HTML editor * Remove hiding functionality again until it's really useful * Add support for autoPlacement * Implement new WithFloating that supports manually calling position() * Implement hide mechanisms * Add option in math dropdown to toggle MathJax rendering (#2014) * Add option in math dropdown to toggle MathJax rendering Closes #1942 * Hackily redraw the page when toggling MathJax * Add Fluent string * Default input setting in fields dialog (#1987) (kleinerpirat) * Introduce field setting to use plain text editor by default (kleinerpirat) * Remove leftover function from #1476 * Use boolean instead of string * Simplify clear_other_field_duplicates * Convert plain text key to camelCase * Move HTML item below the existing checkbox, instead of to the right (dae) Showing it on the right is more space efficient, but feels a bit cluttered IMHO. * Fix not being able to scroll when mouse hovers PlainTextInput (#2019) * Remove overscroll-behavior: none for * (all elements) * Revert "Remove overscroll-behavior: none for * (all elements)" This reverts commit 189358908cecd03027e19d8fe47822735319ec17. * Use body instead of *, but keep CSS rule * Unify two CSS rules * Remove console.logs * Reposition mathjax menu on switching between inline/block * Implement WithOverlay * Implement FloatingArrow * Display overlay with padding and brighter background * Rename to MathjaxOverlay * Simplify MathjaxOverlay component overall * Rename ImageHandle to image overlay * Generally fix ImageOverlay again * Increase z-index of StickyContainer * Fix setting block or inline on mathjax * Add reasons in closing-{click,keyup} * Have both WithFloating and WithOverlay use a simple show flag instead of a store * Remove subscribe-trigger * Fix clicking from one mathjax element to another * Check before executing cleanup * Do not wait for elements to mount before slotting in With{Floating,Overlay} * Allow using reference slot for WithFloating and WithOveray * Add inline argument to options * Add support for inline slot in WithOvelay * Use WithFloating for RemoveFormatButton * Remove last uses of DropdownMenu and WithDropdown * Remove all of the bootstrap dropdown components * Fix closing behavior of several buttons and ImageOverlay * Increase popover padding to 6px * Find a different way to create some padding at the bottom of the fields ...before the tag editor @kleinerpirat I think is what this css what trying to achieve? * Satisfy tests * Use removeStyleProperties in ImageOverlay * Use notify function in WithOverlay and WithFloating * Do not use portal for WithFloating and WithOverlay Allows for scrolling * Set hidden to default false in Rich/Plain TextInput * Reset handle when changing mathjax elements via click * Restrict size of empty mathjax image * Prevent sticky labels from obscuring menus * Remove several overflow-hidden * Fix empty string being falsy bug when editing mathjax * Do not import portal anymore * Use { reason, originalEvent } instead of symbol as update to modified event store * Fix closing behavior of image overlay (do not close after resize) * Simplify Collapsible * Use removeStyleProperties in Collapsible * Satisfy eslint * Fix latex shortcuts being mounted * Fix mathjax overlay not focusable in first field * Neither hide image overlay on escaped * Fix Block ButtonDropdown wrapping * Bring back portal to fix tag editor
2022-09-05 09:20:00 +02:00
{#each dropdownItems as [callback, keyCombination]}
<Shortcut {keyCombination} on:action={callback} />
{/each}
Use WithFloating for MathjaxOverlay (#2011) * Allow passing in reference into WithFloating as prop * Fix WithAutocomplete * Fix WithFloating for MathjaxOverlay * Add resize-store * Allow passing debug=True to jest_test for debugger support (#2013) * Disable auto-closing of HTML tags https://forums.ankiweb.net/t/set-html-editor-as-a-default-editor-instead-of-visual-editor/20988/3 Closes #1963 * Add slight margin to MathjaxEditor * Enable passing offset and shift to WithFloating * Hide overflow of mathjax editor * Add automatic hide functionality to sveltelib/position * Last polishes for Surrounder class (#2017) * Make private properties in Surrounder truly private * Fix remove logic of Surrounder * No reason for toggleTriggerRemove to be async * Allow using alt-shift to set all remove formats but this one * modifyFormat => updateFormat * Fix formatting * Fix field descriptions blocking cursor from being set (#2018) - happens when focus is in HTML editor * Remove hiding functionality again until it's really useful * Add support for autoPlacement * Implement new WithFloating that supports manually calling position() * Implement hide mechanisms * Add option in math dropdown to toggle MathJax rendering (#2014) * Add option in math dropdown to toggle MathJax rendering Closes #1942 * Hackily redraw the page when toggling MathJax * Add Fluent string * Default input setting in fields dialog (#1987) (kleinerpirat) * Introduce field setting to use plain text editor by default (kleinerpirat) * Remove leftover function from #1476 * Use boolean instead of string * Simplify clear_other_field_duplicates * Convert plain text key to camelCase * Move HTML item below the existing checkbox, instead of to the right (dae) Showing it on the right is more space efficient, but feels a bit cluttered IMHO. * Fix not being able to scroll when mouse hovers PlainTextInput (#2019) * Remove overscroll-behavior: none for * (all elements) * Revert "Remove overscroll-behavior: none for * (all elements)" This reverts commit 189358908cecd03027e19d8fe47822735319ec17. * Use body instead of *, but keep CSS rule * Unify two CSS rules * Remove console.logs * Reposition mathjax menu on switching between inline/block * Implement WithOverlay * Implement FloatingArrow * Display overlay with padding and brighter background * Rename to MathjaxOverlay * Simplify MathjaxOverlay component overall * Rename ImageHandle to image overlay * Generally fix ImageOverlay again * Increase z-index of StickyContainer * Fix setting block or inline on mathjax * Add reasons in closing-{click,keyup} * Have both WithFloating and WithOverlay use a simple show flag instead of a store * Remove subscribe-trigger * Fix clicking from one mathjax element to another * Check before executing cleanup * Do not wait for elements to mount before slotting in With{Floating,Overlay} * Allow using reference slot for WithFloating and WithOveray * Add inline argument to options * Add support for inline slot in WithOvelay * Use WithFloating for RemoveFormatButton * Remove last uses of DropdownMenu and WithDropdown * Remove all of the bootstrap dropdown components * Fix closing behavior of several buttons and ImageOverlay * Increase popover padding to 6px * Find a different way to create some padding at the bottom of the fields ...before the tag editor @kleinerpirat I think is what this css what trying to achieve? * Satisfy tests * Use removeStyleProperties in ImageOverlay * Use notify function in WithOverlay and WithFloating * Do not use portal for WithFloating and WithOverlay Allows for scrolling * Set hidden to default false in Rich/Plain TextInput * Reset handle when changing mathjax elements via click * Restrict size of empty mathjax image * Prevent sticky labels from obscuring menus * Remove several overflow-hidden * Fix empty string being falsy bug when editing mathjax * Do not import portal anymore * Use { reason, originalEvent } instead of symbol as update to modified event store * Fix closing behavior of image overlay (do not close after resize) * Simplify Collapsible * Use removeStyleProperties in Collapsible * Satisfy eslint * Fix latex shortcuts being mounted * Fix mathjax overlay not focusable in first field * Neither hide image overlay on escaped * Fix Block ButtonDropdown wrapping * Bring back portal to fix tag editor
2022-09-05 09:20:00 +02:00
<style lang="scss">
Move all buttons to our custom inline surrounding (#1682) * Clarify some comments * Don't destructure insertion trigger * Make superscript and subscript use domlib/surround * Create new {Text,Highlight}ColorButton * Use domlib/surround for textcolor - However there's still a crucial bug, when you're breaking existing colored span when unsurrounding, their color is not restored * Add underline format to removeFormats * Simplify type of ElementMatcher and ElementClearer for end users * Add some comments for normalize-insertion-ranges * Split normalize-insertion-ranges into remove-adjacent and remove-within * Factor out find-remove from unsurround.ts * Rename merge-mach, simplify remove-within * Clarify some comments * Refactor first reduce * Refactor reduceRight * Flatten functions in merge-ranges * Move some functionality to merge-ranges and do not export * Refactor merge-ranges * Remove createInitialMergeMatch * Finish refactoring of merge-ranges * Refactor merge-ranges to minimal-ranges and add some unit testing * Move more logic into text-node * Remove most most of the logic from remove-adjacent - remove-adjacent is still part of the "merging" logic, as it increases the scope of the child node ranges * Add some tests for edge cases * Merge remove-adjacent logic into minimal-ranges * Refactor unnecessary list destructuring * Add some TODOs * Put removing nodes and adding new nodes into sequence * Refactor MatchResult to MatchType and return clear from matcher * Inline surround/helpers * Shorten name of param * Add another edge case test * Add an example where commonAncestorContainer != normalization level * Fix bug in find-adjacent when find more than one nested nodes * Allow comments for Along type * Simplify find-adjacent by removing intermediate and/or curried functions * Remove extend-adjacent * Add more tests when find-adjacent finds by descension * Fix find-adjacent descending into block-level elements * Add clarifying comment to refusing to descend into block-level elements * Move shifting logic into find-adjacent * Rename file matcher to match-type * Give a first implemention of TreeVertex * Remove MatchType.ALONG - findAdjacent now directly modifies the range * Rename MatchType.MATCH into MatchType.REMOVE * Implement a version of find-within that utilizies match-tree * Turn child node range into a class * Fix bug in new find-adjacent function * Make all find-adjacent tests test for ranges * Surrounding within farthestMatchingAncestor when available * Fix an issue with negligable elements - also rename "along" elements to "negligable" * Add two TODOs to SurroundFormat interface * Have a messy first implementation of the new tree-node algorithm * Maintain whether formatting nodes are covered or within user selection * Move covered and insideRange into TreeNode superclass * Reimplement findAdjacent logic * Add extension logic * Add an evaluate method to nodes * Introduce BlockNode * Add a first evaluate implementation * Add left shift and inner shift logic * Implement SurroundFormatUser * Allow pass in formatter, ascender and merger from outside * Fix insideRange and covered switch-up * Fix MatchNode.prototype.isAscendable * Fix another switch-up of covered and insideRange... * Remove a lot of old code * Have surround functions only return the range - I still cannot think of a good reason why we should return addedNodes and removedNodes, except for testing. * Create formatting-tree directory * Create build-tree directory + Move find-above up to /domlib * Remove range-anchors * Move unsurround logic into no-splitting * Fix extend-merge * Fix inner shift being eroneusly returned as left shift * Fix oversight in SplitRange * Redefine how ranges are recreated * Rename covered to insideMatch and put as fourth parameter instead of third * Keep track of match holes and match leaves * Rename ChildNodeRange to FlatRange * Change signature of matcher * Fix bug in extend-merge * Improve Match class * Utilize cache in TextColorButton * Implement getBaseSurrounder for TextColorButton * Add matchAncestors field to FormattingNode * Introduce matchAncestors and getCache * Do clearing during parsing already - This way, you know whether elements will be removed before getting to Formatting nodes * Make HighlightColorButton use our surround mechanism * Fix a bug with calling .removeAttribute and .hasAttribute * Add side button to RemoveFormat button * Add disabled to remove format side button * Expose remove formats on RemoveFormat button * Reinvent editor/surround as Surrounder class * Fix split-text when working with insert trigger * Try counteracting the contenteditable's auto surrounding * Remove matching elements before normalizing * Rewrite match-type * Move setting match leaves into build * Change editing strings - So that color strings match bold/italic strings better * Fix border radius of List options menu * Implement extensions functionality * Remove some unnecessary code * Fix split range endOffset * Type MatchType * Reformat MatchType + add docs * Fix domlib/surround/apply * Satisfy last tests * Register Surrounder as package * Clarify some comments * Correctly implement reformat * Reformat with inactive eraser formats * Clear empty spans with RemoveFormatButton * Fix Super/Subscript button * Use ftl string for hardcoded tooltip * Adjust wording
2022-02-22 13:17:22 +01:00
.shortcut {
font: Verdana;
}
</style>