@jvs-milkdown/crepe 1.2.31 → 1.2.33

package/lib/types/feature/fixed-toolbar/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../../src/feature/fixed-toolbar/component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAA;AAChD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAGhE,OAAO,EAEL,KAAK,UAAU,EACf,KAAK,GAAG,EAMT,MAAM,KAAK,CAAA;AAEZ,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,GAAG,CAAA;AAalD,KAAK,iBAAiB,GAAG;IACvB,GAAG,EAAE,GAAG,CAAA;IACR,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IAClB,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,CAAA;IAC9B,MAAM,CAAC,EAAE,yBAAyB,CAAA;IAClC,OAAO,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACrB,OAAO,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,qBAAqB,oXAuPhC,CAAA"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../../src/feature/fixed-toolbar/component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAA;AAChD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAGhE,OAAO,EAEL,KAAK,UAAU,EACf,KAAK,GAAG,EAMT,MAAM,KAAK,CAAA;AAEZ,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,GAAG,CAAA;AAalD,KAAK,iBAAiB,GAAG;IACvB,GAAG,EAAE,GAAG,CAAA;IACR,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IAClB,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,CAAA;IAC9B,MAAM,CAAC,EAAE,yBAAyB,CAAA;IAClC,OAAO,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACrB,OAAO,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,qBAAqB,oXAsQhC,CAAA"}

package/lib/types/feature/toolbar/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../../src/feature/toolbar/component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAA;AAEhD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAyBhE,OAAO,EAEL,KAAK,GAAG,EACR,KAAK,UAAU,EAQhB,MAAM,KAAK,CAAA;AAEZ,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,GAAG,CAAA;AAmG7C,KAAK,YAAY,GAAG;IAClB,GAAG,EAAE,GAAG,CAAA;IACR,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IAClB,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,CAAA;IAC9B,MAAM,CAAC,EAAE,oBAAoB,CAAA;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAeD,eAAO,MAAM,OAAO,0WA+iFlB,CAAA"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../../src/feature/toolbar/component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAA;AAEhD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAyBhE,OAAO,EAEL,KAAK,GAAG,EACR,KAAK,UAAU,EAQhB,MAAM,KAAK,CAAA;AAEZ,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,GAAG,CAAA;AAmG7C,KAAK,YAAY,GAAG;IAClB,GAAG,EAAE,GAAG,CAAA;IACR,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IAClB,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,CAAA;IAC9B,MAAM,CAAC,EAAE,oBAAoB,CAAA;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAeD,eAAO,MAAM,OAAO,0WA8iFlB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jvs-milkdown/crepe",
-  "version": "1.2.31",
+  "version": "1.2.33",
   "keywords": [
     "crepe",
     "editor",
@@ -107,9 +107,9 @@
     "@codemirror/theme-one-dark": "^6.1.2",
     "@codemirror/view": "^6.26.0",
     "@floating-ui/dom": "^1.7.6",
-    "@jvs-milkdown/kit": "^1.2.31",
-    "@jvs-milkdown/prose": "^1.2.31",
-    "@jvs-milkdown/utils": "^1.2.31",
+    "@jvs-milkdown/kit": "^1.2.33",
+    "@jvs-milkdown/prose": "^1.2.33",
+    "@jvs-milkdown/utils": "^1.2.33",
     "@types/lodash-es": "^4.17.12",
     "clsx": "^2.0.0",
     "codemirror": "^6.0.1",

package/src/feature/fixed-toolbar/component.tsx

@@ -78,46 +78,59 @@ export const FixedToolbarComponent = defineComponent<FixedToolbarProps>({
           : props.canRedo?.value) || false
 
       const viewState = props.ctx.get(viewMenuStateCtx.key)
-      const maxWidth = computed(() => editorWidthMap[viewState.editorWidth as EditorWidth])
+      const maxWidth = computed(
+        () => editorWidthMap[viewState.editorWidth as EditorWidth]
+      )
       const isFull = computed(() => maxWidth.value === 'none')
 
       if (!viewState.fixedToolbarVisible) {
         return (
-          <button
-            type="button"
-            class="fixed-toolbar-expand-btn"
-            title="展开工具栏"
-            onClick={(e: MouseEvent) => {
-              e.preventDefault()
-              e.stopPropagation()
-              viewState.fixedToolbarVisible = true
-            }}
+          <div
             style={{
-              position: 'absolute',
-              top: '0',
-              right: '32px',
+              position: 'relative',
+              width: '100%',
+              height: '100%',
               display: 'flex',
               alignItems: 'center',
               justifyContent: 'center',
-              width: '32px',
-              height: '24px',
-              border:
-                '1px solid var(--crepe-color-outline-variant, color-mix(in srgb, var(--crepe-color-outline), transparent 85%))',
-              borderTop: 'none',
-              background: 'var(--crepe-color-surface, #ffffff)',
-              cursor: 'pointer',
-              borderRadius: '0 0 6px 6px',
-              boxShadow: '0 4px 8px rgba(0, 0, 0, 0.06)',
-              color: 'var(--crepe-color-on-surface, #363b4c)',
-              pointerEvents: 'auto',
-              zIndex: 200,
             }}
           >
-            <span
-              style={{ display: 'inline-flex', alignItems: 'center' }}
-              innerHTML={chevronDownIcon}
-            />
-          </button>
+            <button
+              type="button"
+              class="fixed-toolbar-expand-btn"
+              title="展开工具栏"
+              onClick={(e: MouseEvent) => {
+                e.preventDefault()
+                e.stopPropagation()
+                viewState.fixedToolbarVisible = true
+              }}
+              style={{
+                position: 'absolute',
+                top: '0',
+                right: '40px',
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                width: '28px',
+                height: '24px',
+                border:
+                  '1px solid var(--crepe-color-outline-variant, color-mix(in srgb, var(--crepe-color-outline), transparent 85%))',
+                borderTop: 'none',
+                background: 'var(--crepe-color-surface, #ffffff)',
+                cursor: 'pointer',
+                borderRadius: '0 0 6px 6px',
+                boxShadow: '0 4px 8px rgba(0, 0, 0, 0.06)',
+                color: 'var(--crepe-color-on-surface, #363b4c)',
+                pointerEvents: 'auto',
+                zIndex: 200,
+              }}
+            >
+              <span
+                style={{ display: 'inline-flex', alignItems: 'center' }}
+                innerHTML={chevronDownIcon}
+              />
+            </button>
+          </div>
         )
       }
 
@@ -134,12 +147,14 @@ export const FixedToolbarComponent = defineComponent<FixedToolbarProps>({
         >
           <div
             style={{
+              position: 'relative',
               display: 'flex',
               alignItems: 'center',
-              justifyContent: 'center',
+              justifyContent: 'flex-start',
               width: '100%',
               maxWidth: isFull.value ? '100%' : maxWidth.value,
               margin: isFull.value ? '0' : '0 auto',
+              // paddingRight: '40px',
               gap: '0px',
               minWidth: '0',
               overflow: 'hidden',
@@ -261,7 +276,7 @@ export const FixedToolbarComponent = defineComponent<FixedToolbarProps>({
             style={{
               position: 'absolute',
               top: '6px',
-              right: '32px',
+              right: '40px',
               margin: '0',
               display: 'flex',
               alignItems: 'center',

package/src/feature/fixed-toolbar/index.ts

@@ -198,7 +198,7 @@ class FixedToolbarView implements PluginView {
 
     const app = createApp(FixedToolbarComponent, {
       ctx,
-      hide: () => { }, // No-op for fixed toolbar
+      hide: () => {}, // No-op for fixed toolbar
       config,
       state: this.#state,
       show: this.#show,

package/src/feature/toolbar/component.tsx

@@ -635,7 +635,6 @@ export const Toolbar = defineComponent<ToolbarProps>({
       overflowVisibleCount.value = visibleCount
       totalSectionCount.value = toolbarChildren.length
     }
-
     const handleTableEnter = (e: MouseEvent) => {
       if (hideTableTimer) clearTimeout(hideTableTimer)
       const rect = (e.currentTarget as HTMLElement).getBoundingClientRect()
@@ -1337,7 +1336,7 @@ export const Toolbar = defineComponent<ToolbarProps>({
                 'var(--crepe-color-hover)'
           }}
           onMouseleave={(e: MouseEvent) => {
-            ;(e.currentTarget as HTMLElement).style.backgroundColor =
+            ; (e.currentTarget as HTMLElement).style.backgroundColor =
               'transparent'
           }}
         >
@@ -1536,9 +1535,9 @@ export const Toolbar = defineComponent<ToolbarProps>({
                 const fontFamily = fontState?.fontFamily
                 return fontFamily && fontFamily !== 'mixed'
                   ? fontFamily.split(',')[0]!.replace(/['"]/g, '') ||
-                      (ctx
-                        ? i18n(ctx, 'customMenu.fontDefault' as any)
-                        : '默认')
+                  (ctx
+                    ? i18n(ctx, 'customMenu.fontDefault' as any)
+                    : '默认')
                   : ctx
                     ? i18n(ctx, 'customMenu.fontDefault' as any)
                     : '默认'
@@ -1649,12 +1648,12 @@ export const Toolbar = defineComponent<ToolbarProps>({
                 display: 'inline-flex',
                 color:
                   currentColorState.value.textColor &&
-                  currentColorState.value.textColor !== 'mixed'
+                    currentColorState.value.textColor !== 'mixed'
                     ? currentColorState.value.textColor
                     : '#363B4C',
                 backgroundColor:
                   currentColorState.value.bgColor &&
-                  currentColorState.value.bgColor !== 'mixed'
+                    currentColorState.value.bgColor !== 'mixed'
                     ? currentColorState.value.bgColor
                     : undefined,
                 borderRadius: '4px',
@@ -1744,7 +1743,7 @@ export const Toolbar = defineComponent<ToolbarProps>({
                 <Fragment key={(group as any).key}>
                   {items}
                   {groupIndex < nonHeadingGroups.length - 1 &&
-                  group.items.length > 0 ? (
+                    group.items.length > 0 ? (
                     <div
                       class="divider"
                       style={{
@@ -1982,7 +1981,7 @@ export const Toolbar = defineComponent<ToolbarProps>({
                       mergeCellIcon,
                       ctx
                         ? i18n(ctx, 'customMenu.mergeCells' as any) ||
-                            '合并单元格'
+                        '合并单元格'
                         : '合并单元格',
                       false,
                       onMergeCells
@@ -1992,7 +1991,7 @@ export const Toolbar = defineComponent<ToolbarProps>({
                       splitCellIcon,
                       ctx
                         ? i18n(ctx, 'customMenu.splitCell' as any) ||
-                            '拆分单元格'
+                        '拆分单元格'
                         : '拆分单元格',
                       false,
                       onSplitCell
@@ -2120,9 +2119,9 @@ export const Toolbar = defineComponent<ToolbarProps>({
                       boxSizing: 'border-box',
                       border:
                         currentColorState.value.bgColor === color ||
-                        (color === 'transparent' &&
-                          !currentColorState.value.bgColor &&
-                          currentColorState.value.bgColor !== 'mixed')
+                          (color === 'transparent' &&
+                            !currentColorState.value.bgColor &&
+                            currentColorState.value.bgColor !== 'mixed')
                           ? '2px solid var(--crepe-color-primary)'
                           : '1px solid var(--crepe-color-outline-variant)',
                       backgroundColor:
@@ -2311,13 +2310,13 @@ export const Toolbar = defineComponent<ToolbarProps>({
                     }}
                     onMouseenter={(e: MouseEvent) => {
                       if (supported) {
-                        ;(
+                        ; (
                           e.currentTarget as HTMLElement
                         ).style.backgroundColor = 'var(--crepe-color-hover)'
                       }
                     }}
                     onMouseleave={(e: MouseEvent) => {
-                      ;(e.currentTarget as HTMLElement).style.backgroundColor =
+                      ; (e.currentTarget as HTMLElement).style.backgroundColor =
                         'transparent'
                     }}
                   >
@@ -2420,11 +2419,11 @@ export const Toolbar = defineComponent<ToolbarProps>({
                     setFontSize(size.value)
                   }}
                   onMouseenter={(e: MouseEvent) => {
-                    ;(e.currentTarget as HTMLElement).style.backgroundColor =
+                    ; (e.currentTarget as HTMLElement).style.backgroundColor =
                       'var(--crepe-color-hover)'
                   }}
                   onMouseleave={(e: MouseEvent) => {
-                    ;(e.currentTarget as HTMLElement).style.backgroundColor =
+                    ; (e.currentTarget as HTMLElement).style.backgroundColor =
                       'transparent'
                   }}
                 >
@@ -2745,9 +2744,9 @@ export const Toolbar = defineComponent<ToolbarProps>({
                           isTable
                             ? undefined
                             : (_e: MouseEvent) => {
-                                item.onRun(ctx)
-                                showOverflowMenu.value = false
-                              },
+                              item.onRun(ctx)
+                              showOverflowMenu.value = false
+                            },
                           isTable,
                           isTable ? handleTableEnter : undefined,
                           isTable ? handleTableLeave : undefined,