Include Dropdown directly from bootstrap, required installing popperjs

This commit is contained in:
Henrik Giesel 2021-04-14 14:29:06 +02:00
parent 38cc0dfce5
commit 8f7c32fcf9
7 changed files with 30 additions and 2 deletions

View file

@ -20,6 +20,7 @@ compile_sass(
srcs = [
"color.scss",
"legacy.scss",
"dropdown.scss",
],
deps = [],
visibility = ["//visibility:public"],
@ -50,6 +51,8 @@ ts_library(
"//ts/sveltelib",
"//ts:image_module_support",
"@npm//svelte",
"@npm//bootstrap",
"@npm//@popperjs/core",
],
)

View file

@ -1,5 +1,6 @@
<script lang="typescript">
import type { ToolbarItem } from "./types";
import Dropdown from "bootstrap/js/dist/dropdown";
/* Bootstrap dropdown are normally declared alongside the associated button
* However we cannot do that, as the menus cannot be declared in sticky-positioned elements
@ -28,7 +29,7 @@
* Rendering the menu here would cause the menu to
* be displayed outside of the visible area
*/
const dropdown = new bootstrap.Dropdown(button);
const dropdown = new Dropdown(button);
const menu = button.getRootNode().getElementById(menuId);
if (!menu) {

View file

@ -0,0 +1,4 @@
@import "ts/node_modules/bootstrap/scss/functions";
@import "ts/node_modules/bootstrap/scss/variables";
@import "ts/node_modules/bootstrap/scss/mixins";
@import "ts/node_modules/bootstrap/scss/dropdown";

View file

@ -12,11 +12,12 @@ import EditorToolbarSvelte from "./EditorToolbar.svelte";
import { checkNightMode } from "anki/nightmode";
import { setupI18n, ModuleName } from "anki/i18n";
import "./dropdown.css";
import { getNotetypeGroup } from "./notetype";
import { getFormatGroup } from "./format";
import { getColorGroup } from "./color";
import { getTemplateGroup, getTemplateMenus } from "./template";
import { Identifiable, search, add, insert } from "./identifiable";
interface Hideable {

View file

@ -14,6 +14,14 @@
"path": "node_modules/@mdi/svg",
"licenseFile": "node_modules/@mdi/svg/LICENSE"
},
"@popperjs/core@2.9.2": {
"licenses": "MIT",
"repository": "https://github.com/popperjs/popper-core",
"publisher": "Federico Zivolo",
"email": "federico.zivolo@gmail.com",
"path": "node_modules/@popperjs/core",
"licenseFile": "node_modules/@popperjs/core/LICENSE.md"
},
"@protobufjs/aspromise@1.1.2": {
"licenses": "BSD-3-Clause",
"repository": "https://github.com/dcodeIO/protobuf.js",

View file

@ -55,6 +55,7 @@
"dependencies": {
"@fluent/bundle": "^0.15.1",
"@mdi/svg": "^5.9.55",
"@popperjs/core": "^2.9.2",
"bootstrap": "^5.0.0-beta2",
"bootstrap-icons": "^1.4.0",
"css-browser-selector": "^0.6.5",

View file

@ -519,6 +519,16 @@
"@types/yargs" "^16.0.0"
chalk "^4.0.0"
"@mdi/svg@^5.9.55":
version "5.9.55"
resolved "https://registry.yarnpkg.com/@mdi/svg/-/svg-5.9.55.tgz#7cba058135afd5d8a3da977f51b71ffc6a3a3699"
integrity sha512-gO0ZpKIeCn9vFg46QduK9MM+n1fuCNwSdcdlBTtbafnnuvwLveK2uj+byhdLtg/8VJGXDhp+DJ35QUMbeWeULA==
"@popperjs/core@^2.9.2":
version "2.9.2"
resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.9.2.tgz#adea7b6953cbb34651766b0548468e743c6a2353"
integrity sha512-VZMYa7+fXHdwIq1TDhSXoVmSPEGM/aa+6Aiq3nVVJ9bXr24zScr+NlKFKC3iPljA7ho/GAZr+d2jOf5GIRC30Q==
"@protobufjs/aspromise@^1.1.1", "@protobufjs/aspromise@^1.1.2":
version "1.1.2"
resolved "https://registry.yarnpkg.com/@protobufjs/aspromise/-/aspromise-1.1.2.tgz#9b8b0cc663d669a7d8f6f5d0893a14d348f30fbf"