html2pptx-local-mcp 1.1.36 → 1.1.37

package/local-editor-app/components/studio/edit-property-panel.jsx

@@ -687,36 +687,6 @@ function ImageAssetSection({ element, ui, assetTools, onChange }) {
             </div>
           ) : null}
 
-          <div style={{ display: 'flex', alignItems: 'center', gap: 6, marginBottom: 8 }}>
-            <span style={{ fontSize: 11, color: '#9a9a9a' }}>{ui.saveTo}</span>
-            {[
-              ['project', ui.assetScopeProject],
-              ['global', ui.assetScopeGlobal],
-            ].map(([value, label]) => (
-              <button
-                key={value}
-                type="button"
-                onClick={() => assetTools.setScope?.(value)}
-                style={{
-                  flex: 1,
-                  height: 26,
-                  fontSize: 11.5,
-                  fontWeight: 600,
-                  cursor: 'pointer',
-                  borderRadius: 6,
-                  border: '1px solid ' + (scope === value ? '#0D99FF' : '#e0e0e0'),
-                  background: scope === value ? 'rgba(13,153,255,0.12)' : '#fff',
-                  color: scope === value ? '#0D78CC' : '#666',
-                }}
-              >
-                {label}
-              </button>
-            ))}
-          </div>
-
-          <button type="button" className="ppt-lumina-add" disabled={busy} onClick={() => fileInputRef.current?.click()}>
-            {busy ? ui.uploading : isImg ? ui.replaceImage : isVideo ? ui.replaceVideo : ui.insertImage}
-          </button>
           <input
             ref={fileInputRef}
             type="file"
@@ -732,67 +702,94 @@ function ImageAssetSection({ element, ui, assetTools, onChange }) {
             <p style={{ margin: '6px 0 0', fontSize: 11, color: '#d23' }}>{error}</p>
           ) : null}
 
-          <div style={{ marginTop: 12 }}>
+          <div style={{ marginTop: 4 }}>
             <h4 style={{ margin: '0 0 6px', fontSize: 11, fontWeight: 600, color: '#9a9a9a' }}>{ui.savedAssets}</h4>
-            {assets.length === 0 ? (
-              <p style={{ margin: 0, fontSize: 11.5, color: '#b0b0b0' }}>{ui.noSavedAssets}</p>
-            ) : (
-              <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: 6 }}>
-                {assets.map((asset) => {
-                  const kind = asset.kind || assetKindFromName(asset.src || asset.name);
-                  const preview = assetTools.resolveAssetUrl?.(asset.src) || '';
-                  const payload = JSON.stringify({ src: asset.src, name: asset.name, kind });
-                  return (
-                    <div key={asset.src} style={{ display: 'flex', flexDirection: 'column', gap: 4, minWidth: 0 }}>
-                      <button
-                        type="button"
-                        title={`${asset.name} - ${ui.dragAssetHint}`}
-                        draggable
-                        onDragStart={(event) => {
-                          event.dataTransfer.effectAllowed = 'copy';
-                          event.dataTransfer.setData('application/x-edit-slide-asset', payload);
-                          event.dataTransfer.setData('text/plain', asset.src);
-                        }}
-                        onClick={() => applyAssetSrc(asset.src, kind)}
-                        style={{
-                          padding: 0,
-                          aspectRatio: '1 / 1',
-                          cursor: 'grab',
-                          borderRadius: 6,
-                          border: '1px solid #e6e6e6',
-                          background: '#fafafa',
-                          overflow: 'hidden',
-                        }}
-                      >
-                        {kind === 'video' ? (
-                          <video src={preview} muted playsInline style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
-                        ) : (
-                          <img src={preview} alt={asset.name} style={{ width: '100%', height: '100%', objectFit: 'contain' }} />
-                        )}
-                      </button>
+            <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: 6 }}>
+              <button
+                type="button"
+                disabled={busy}
+                onClick={() => fileInputRef.current?.click()}
+                title={ui.insertImage}
+                style={{
+                  aspectRatio: '1 / 1',
+                  display: 'flex',
+                  alignItems: 'center',
+                  justifyContent: 'center',
+                  cursor: busy ? 'wait' : 'pointer',
+                  borderRadius: 6,
+                  border: '1px dashed #c8c8c8',
+                  background: '#fafafa',
+                  color: '#9a9a9a',
+                  fontSize: 22,
+                  lineHeight: 1,
+                }}
+              >
+                {busy ? '…' : '+'}
+              </button>
+              {assets.map((asset) => {
+                const kind = asset.kind || assetKindFromName(asset.src || asset.name);
+                const preview = assetTools.resolveAssetUrl?.(asset.src) || '';
+                const payload = JSON.stringify({ src: asset.src, name: asset.name, kind });
+                return (
+                  <div key={asset.src} style={{ position: 'relative', minWidth: 0 }}>
+                    <button
+                      type="button"
+                      title={`${asset.name} - ${ui.dragAssetHint}`}
+                      draggable
+                      onDragStart={(event) => {
+                        event.dataTransfer.effectAllowed = 'copy';
+                        event.dataTransfer.setData('application/x-edit-slide-asset', payload);
+                        event.dataTransfer.setData('text/plain', asset.src);
+                      }}
+                      onClick={() => applyAssetSrc(asset.src, kind)}
+                      style={{
+                        padding: 0,
+                        width: '100%',
+                        aspectRatio: '1 / 1',
+                        cursor: 'grab',
+                        borderRadius: 6,
+                        border: '1px solid #e6e6e6',
+                        background: '#fafafa',
+                        overflow: 'hidden',
+                        display: 'block',
+                      }}
+                    >
+                      {kind === 'video' ? (
+                        <video src={preview} muted playsInline style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
+                      ) : (
+                        <img src={preview} alt={asset.name} style={{ width: '100%', height: '100%', objectFit: 'contain' }} />
+                      )}
+                    </button>
+                    {kind === 'image' ? (
                       <button
                         type="button"
                         onClick={() => applyAssetBackground(asset.src, kind)}
-                        disabled={kind !== 'image'}
-                        title={kind === 'image' ? ui.applyBackground : 'Video cannot be used as a CSS background'}
+                        title={ui.applyBackground}
                         style={{
-                          border: '1px solid #e6e6e6',
-                          borderRadius: 5,
-                          background: '#fff',
-                          color: kind === 'image' ? '#444' : '#aaa',
-                          cursor: kind === 'image' ? 'pointer' : 'not-allowed',
-                          fontSize: 9,
-                          padding: '3px 2px',
-                          lineHeight: 1.1,
+                          position: 'absolute',
+                          right: 3,
+                          bottom: 3,
+                          padding: '1px 4px',
+                          fontSize: 8,
+                          fontWeight: 700,
+                          lineHeight: 1.2,
+                          color: '#fff',
+                          background: 'rgba(0,0,0,0.55)',
+                          border: 'none',
+                          borderRadius: 4,
+                          cursor: 'pointer',
                         }}
                       >
-                        {ui.applyBackground}
+                        BG
                       </button>
-                    </div>
-                  );
-                })}
-              </div>
-            )}
+                    ) : null}
+                  </div>
+                );
+              })}
+            </div>
+            {assets.length === 0 ? (
+              <p style={{ margin: '6px 0 0', fontSize: 11, color: '#b0b0b0' }}>{ui.noSavedAssets}</p>
+            ) : null}
           </div>
         </>
       )}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "html2pptx-local-mcp",
-  "version": "1.1.36",
+  "version": "1.1.37",
   "type": "module",
   "description": "Local stdio MCP server for opening html2pptx slide HTML in the local edit-slide editor.",
   "bin": {