@milkdown/crepe 7.8.0 → 7.9.1

package/src/icons/confirm.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const confirmIcon = html`
+export const confirmIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/copy.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const copyIcon = html`
+export const copyIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     height="24px"

package/src/icons/divider.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const dividerIcon = html`
+export const dividerIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/drag-handle.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const dragHandleIcon = html`
+export const dragHandleIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="16"

package/src/icons/edit.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const editIcon = html`
+export const editIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/functions.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const functionsIcon = html`
+export const functionsIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="32"

package/src/icons/h1.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const h1Icon = html`
+export const h1Icon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/h2.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const h2Icon = html`
+export const h2Icon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/h3.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const h3Icon = html`
+export const h3Icon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/h4.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const h4Icon = html`
+export const h4Icon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/h5.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const h5Icon = html`
+export const h5Icon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/h6.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const h6Icon = html`
+export const h6Icon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/image.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const imageIcon = html`
+export const imageIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/italic.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const italicIcon = html`
+export const italicIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/link.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const linkIcon = html`
+export const linkIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/menu.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const menuIcon = html`
+export const menuIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/ordered-list.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const orderedListIcon = html`
+export const orderedListIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/plus.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const plusIcon = html`
+export const plusIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/quote.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const quoteIcon = html`
+export const quoteIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/remove.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const removeIcon = html`
+export const removeIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/search.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const searchIcon = html`
+export const searchIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     fill="none"

package/src/icons/strikethrough.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const strikethroughIcon = html`
+export const strikethroughIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/table.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const tableIcon = html`
+export const tableIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/text.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const textIcon = html`
+export const textIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/todo-list.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const todoListIcon = html`
+export const todoListIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width="24"

package/src/icons/visibility-off.ts

@@ -1,6 +1,4 @@
-import { html } from 'atomico'
-
-export const visibilityOffIcon = html`
+export const visibilityOffIcon = `
   <svg
     xmlns="http://www.w3.org/2000/svg"
     height="24px"

package/src/theme/_internal/classic-common.css

@@ -25,6 +25,12 @@
   color: var(--crepe-color-on-background);
   background: var(--crepe-color-background);
 
+  .milkdown-icon {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+  }
+
   .ProseMirror-focused {
     outline: none;
   }

package/src/theme/common/block-edit.css

@@ -1,5 +1,5 @@
 .milkdown {
-  milkdown-block-handle {
+  .milkdown-block-handle {
     &[data-show='false'] {
       opacity: 0;
       pointer-events: none;
@@ -34,7 +34,7 @@
     }
   }
 
-  milkdown-slash-menu {
+  .milkdown-slash-menu {
     &[data-show='false'] {
       display: none;
     }

package/src/theme/common/code-mirror.css

@@ -1,5 +1,5 @@
 .milkdown {
-  milkdown-code-block {
+  .milkdown-code-block {
     display: block;
     position: relative;
     padding: 8px 20px 20px;
@@ -11,11 +11,6 @@
       width: max-content;
       position: absolute;
       z-index: 1;
-      display: none;
-
-      &.show {
-        display: block;
-      }
     }
 
     .hidden {
@@ -41,6 +36,10 @@
       justify-content: space-between;
       align-items: center;
 
+      input {
+        caret-color: var(--crepe-color-outline);
+      }
+
       .preview-toggle-button {
         background: var(--crepe-color-secondary);
         color: var(--crepe-color-on-surface-variant);

package/src/theme/common/image-block.css

@@ -1,16 +1,14 @@
 .milkdown {
-  milkdown-image-inline {
+  .milkdown-image-inline {
     outline: none;
-    display: inline;
+    display: inline-flex;
+    vertical-align: text-bottom;
 
     & input {
       background: transparent;
       outline: none;
       border: 0;
-    }
-
-    &.empty {
-      vertical-align: bottom;
+      caret-color: var(--crepe-color-outline);
     }
 
     & > .empty-image-inline {
@@ -29,6 +27,7 @@
     & > .empty-image-inline .link-importer > .link-input-area {
       width: 208px;
       color: var(--crepe-color-on-background);
+      display: flex;
     }
 
     & > .empty-image-inline .link-importer .placeholder {
@@ -66,10 +65,6 @@
       }
     }
 
-    img.image-inline {
-      vertical-align: text-bottom;
-    }
-
     .empty-image-inline {
       align-items: center;
       padding: 4px 10px;
@@ -77,6 +72,7 @@
       background: var(--crepe-color-surface);
       font-family: var(--crepe-font-default);
       border-radius: 8px;
+      font-size: 16px;
     }
 
     .empty-image-inline .image-icon {
@@ -134,6 +130,7 @@
         width: 18px;
         height: 18px;
       }
+      display: flex;
       width: 24px;
       height: 24px;
       padding: 3px;
@@ -145,7 +142,7 @@
     }
   }
 
-  milkdown-image-block {
+  .milkdown-image-block {
     outline: none;
     margin: 4px 0;
     display: block;
@@ -187,6 +184,7 @@
       background: transparent;
       outline: none;
       border: 0;
+      caret-color: var(--crepe-color-outline);
     }
 
     & > .caption-input {

package/src/theme/common/latex.css

@@ -8,7 +8,7 @@
     color: var(--crepe-color-primary);
   }
 
-  milkdown-latex-inline-edit {
+  .milkdown-latex-inline-edit {
     &[data-show='false'] {
       display: none;
     }

package/src/theme/common/link-tooltip.css

@@ -1,5 +1,5 @@
 .milkdown {
-  milkdown-link-preview {
+  .milkdown-link-preview {
     position: absolute;
     z-index: 10;
     &[data-show='false'] {
@@ -69,7 +69,7 @@
     }
   }
 
-  milkdown-link-edit {
+  .milkdown-link-edit {
     position: absolute;
     z-index: 10;
     &[data-show='false'] {

package/src/theme/common/list-item.css

@@ -1,5 +1,5 @@
 .milkdown {
-  milkdown-list-item-block {
+  .milkdown-list-item-block {
     display: block;
     padding: 0;
 
@@ -31,7 +31,8 @@
           width: 24px;
           text-align: right;
         }
-        .checkbox {
+        .checked,
+        .unchecked {
           cursor: pointer;
         }
         .readonly {

package/src/theme/common/table.css

@@ -1,7 +1,7 @@
 @import '@milkdown/kit/prose/tables/style/tables.css';
 
 .milkdown {
-  milkdown-table-block {
+  .milkdown-table-block {
     display: block;
     margin: 4px 0;
 
@@ -159,7 +159,7 @@
         box-shadow: var(--crepe-shadow-1);
         transition: background-color 0.2s ease-in-out;
 
-        & > svg {
+        svg {
           width: 16px;
           height: 16px;
         }

package/src/theme/common/toolbar.css

@@ -1,5 +1,5 @@
 .milkdown {
-  milkdown-toolbar {
+  .milkdown-toolbar {
     &[data-show='false'] {
       display: none;
     }