lakelib 0.1.16 → 0.1.18

package/README.md

@@ -27,18 +27,23 @@ You can now view all the demos by visiting `http://localhost:8080/examples/`.
 
 ## Running tests
 
-Lake depends on a lot of browser APIs and ao needs a real browser environment for running the test cases. You can run all tests visibly by visiting `http://localhost:8080/tests/`, or execute the `pnpm test` command to run the tests in headless mode.
+Lake depends on a lot of browser APIs and so needs a real browser environment for running the test cases. You can run all tests visibly by visiting `http://localhost:8080/tests/`, or execute the `pnpm test` command to run the tests in headless mode.
 
 ## License
 
-Lake is released under the [MIT](https://github.com/lakejs/lake/blob/main/LICENSE) license. For the licenses of its dependencies, see the following table:
-
-| Package  | License |
-| ------------- | ------------- |
-| [codemirror](https://github.com/codemirror/dev)  | MIT  |
-| [debounce](https://github.com/sindresorhus/debounce)  | MIT  |
-| [eventemitter3](https://github.com/primus/eventemitter3)  | MIT  |
-| [fast-deep-equal](https://github.com/epoberezkin/fast-deep-equal)  | MIT  |
-| [photoswipe](https://github.com/dimsemenov/Photoswipe)  | MIT  |
-| [tinykeys](https://github.com/jamiebuilds/tinykeys)  | MIT  |
-| [typesafe-i18n](https://github.com/ivanhofer/typesafe-i18n)  | MIT  |
+Lake is released under the [MIT](https://github.com/lakejs/lake/blob/main/LICENSE) license. The licenses of its dependencies are:
+
+| Dependency | License |
+| -------------  | ------------- |
+| [Phosphor Icons](https://phosphoricons.com/) | MIT |
+| [Fluent Icons](https://fluenticons.co/) | MIT |
+| [CodeMirror](https://codemirror.net/) | MIT |
+| [debounce](https://github.com/sindresorhus/debounce) | MIT |
+| [EventEmitter3](https://github.com/primus/eventemitter3) | MIT |
+| [fast-deep-equal](https://github.com/epoberezkin/fast-deep-equal) | MIT |
+| [Idiomorph](https://github.com/bigskysoftware/idiomorph) | BSD 2-Clause |
+| [is-hotkey](https://github.com/ianstormtaylor/is-hotkey) | MIT |
+| [KaTeX](https://katex.org/) | MIT |
+| [rc-upload](https://github.com/react-component/upload) | MIT |
+| [PhotoSwipe](https://photoswipe.com/) | MIT |
+| [typesafe-i18n](https://github.com/ivanhofer/typesafe-i18n) | MIT |

package/dist/lake.css

@@ -60,7 +60,7 @@
   color: inherit;
   background: var(--selection-background-color);
 }
-.lake-container.lake-show-placeholder::before {
+.lake-container.lake-placeholder::before {
   position: absolute;
   top: 8px;
   left: 12px;
@@ -231,6 +231,7 @@ button.lake-button {
   padding: 0;
   margin: 0 1px;
   line-height: 0;
+  white-space: nowrap;
   cursor: pointer;
   user-select: none;
 }
@@ -1151,6 +1152,9 @@ lake-box[name="video"] .lake-box-hovered .lake-resizer {
   cursor: pointer;
   user-select: auto;
 }
+lake-box[name="file"] .lake-box-strip {
+  align-self: center;
+}
 .lake-file .lake-file-info {
   display: flex;
   align-items: center;
@@ -1216,6 +1220,69 @@ lake-box[name="emoji"] .lake-box-focused .lake-emoji {
   background-color: var(--selection-background-color);
 }
 
+.lake-equation {
+  position: relative;
+  font-weight: normal;
+  border: 1px solid transparent;
+  border-radius: 4px;
+}
+.lake-container[contenteditable="true"] .lake-equation {
+  user-select: none;
+}
+lake-box[name="equation"] .lake-box-strip {
+  align-self: center;
+}
+lake-box[name="equation"] .lake-box-selected .lake-equation {
+  background-color: var(--selection-background-color);
+}
+lake-box[name="equation"] .lake-box-focused .lake-equation {
+  background-color: var(--selection-background-color);
+}
+.lake-equation .lake-equation-view {
+  padding: 0 6px;
+}
+.lake-equation .lake-equation-form {
+  position: absolute;
+  top: 28px;
+  left: 0;
+  z-index: 1;
+  box-sizing: content-box;
+  border: 1px solid var(--border-color);
+  border-radius: 5px;
+  padding: 16px;
+  width: fit-content;
+  background-color: #fff;
+  box-shadow: var(--popup-shadow);
+  display: none;
+}
+lake-box[name="equation"] .lake-box-focused .lake-equation-form,
+lake-box[name="equation"] .lake-box-activated .lake-equation-form {
+  display: flex;
+}
+.lake-equation .lake-equation-form textarea {
+  border: 0;
+  box-sizing: border-box;
+  font-family: Consolas, Courier, monospace;
+  font-size: 14px;
+  color: var(--text-color);
+  padding: 0;
+  margin-right: 8px;
+  width: 300px;
+  height: 80px;
+  resize: none;
+  scrollbar-width: thin;
+}
+.lake-equation .lake-equation-form textarea:focus-visible {
+  outline: 0;
+}
+/* error status */
+.lake-equation-error {
+  padding: 0 6px;
+  font-size: 14px;
+  color: var(--error-color);
+  background-color: var(--box-background-color);
+}
+
 .lake-toolbar {
   font-family: var(--font-family);
   font-size: 14px;
@@ -1241,6 +1308,59 @@ lake-box[name="emoji"] .lake-box-focused .lake-emoji {
   display: none;
 }
 
+.lake-commands-popup {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1;
+  box-sizing: content-box;
+  border: 1px solid var(--border-color);
+  border-radius: 5px;
+  padding: 4px 8px;
+  width: fit-content;
+  font-family: var(--font-family);
+  font-size: 14px;
+  color: var(--text-color);
+  background-color: #fff;
+  box-shadow: var(--popup-shadow);
+  display: none;
+  height: 380px;
+  overflow-y: scroll;
+  scrollbar-width: thin;
+}
+.lake-commands-popup .lake-commands-item {
+  display: flex;
+  cursor: pointer;
+  padding: 4px 8px;
+  border-radius: 5px;
+}
+.lake-commands-popup .lake-commands-item-selected {
+  background-color: var(--background-active-color);
+}
+.lake-commands-popup .lake-commands-icon {
+  margin-right: 8px;
+  border-radius: 5px;
+  border: 1px solid var(--border-color);
+  background-color: #fff;
+}
+.lake-commands-popup .lake-commands-icon svg {
+  width: 32px;
+  height: 32px;
+  margin: 6px;
+}
+.lake-commands-popup .lake-commands-text {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+.lake-commands-popup .lake-commands-title {
+  font-weight: 500;
+  color: var(--text-color);
+}
+.lake-commands-popup .lake-commands-description {
+  color: var(--secondary-text-color);
+}
+
 /*! PhotoSwipe main CSS by Dmytro Semenov | photoswipe.com */
 
 .pswp {