@flowgram.ai/background-plugin 0.2.16 → 0.2.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/esm/index.js.map +1 -1
  2. package/dist/index.d.mts +5 -0
  3. package/dist/index.d.ts +5 -0
  4. package/dist/index.js.map +1 -1
  5. package/package.json +5 -5
package/dist/esm/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/background-layer.tsx","../../src/create-background-plugin.ts"],"sourcesContent":["import { domUtils } from '@flowgram.ai/utils';\nimport { Layer, observeEntity, PlaygroundConfigEntity, SCALE_WIDTH } from '@flowgram.ai/core';\n\ninterface BackgroundScaleUnit {\n realSize: number;\n renderSize: number;\n zoom: number;\n}\n\nconst PATTERN_PREFIX = 'gedit-background-pattern-';\nconst DEFAULT_RENDER_SIZE = 20;\nconst DEFAULT_DOT_SIZE = 1;\nlet id = 0;\n\nexport const BackgroundConfig = Symbol('BackgroundConfig');\nexport interface BackgroundLayerOptions {\n /** 网格间距，默认 20px */\n gridSize?: number;\n /** 点的大小，默认 1px */\n dotSize?: number;\n /** 点的颜色，默认 \"#eceeef\" */\n dotColor?: string;\n /** 点的透明度，默认 0.5 */\n dotOpacity?: number;\n /** 背景颜色，默认透明 */\n backgroundColor?: string;\n /** 点的填充颜色，默认与stroke颜色相同 */\n dotFillColor?: string;\n /** Logo 配置 */\n logo?: {\n /** Logo 文本内容 */\n text?: string;\n /** Logo 图片 URL */\n imageUrl?: string;\n /** Logo 位置，默认 'center' */\n position?: 'center' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';\n /** Logo 大小，默认 'medium' */\n size?: 'small' | 'medium' | 'large' | number;\n /** Logo 透明度，默认 0.1 */\n opacity?: number;\n /** Logo 颜色（仅文本），默认 \"#cccccc\" */\n color?: string;\n /** Logo 字体大小（仅文本），默认根据 size 计算 */\n fontSize?: number;\n /** Logo 字体家族（仅文本），默认 'Arial, sans-serif' */\n fontFamily?: string;\n /** Logo 字体粗细（仅文本），默认 'normal' */\n fontWeight?: 'normal' | 'bold' | 'lighter' | number;\n /** 自定义偏移 */\n offset?: { x: number; y: number };\n /** 新拟态（Neumorphism）效果配置 */\n neumorphism?: {\n /** 是否启用新拟态效果，默认 false */\n enabled?: boolean;\n /** 主要文字颜色，应该与背景色接近，默认自动计算 */\n textColor?: string;\n /** 亮色阴影颜色，默认自动计算（背景色的亮色版本） */\n lightShadowColor?: string;\n /** 暗色阴影颜色，默认自动计算（背景色的暗色版本） */\n darkShadowColor?: string;\n /** 阴影偏移距离，默认 6 */\n shadowOffset?: number;\n /** 阴影模糊半径，默认 12 */\n shadowBlur?: number;\n /** 效果强度（0-1），影响阴影的透明度，默认 0.3 */\n intensity?: number;\n /** 凸起效果（true）还是凹陷效果（false），默认 true */\n raised?: boolean;\n };\n };\n}\n\n/**\n * dot 网格背景\n */\nexport class BackgroundLayer extends Layer<BackgroundLayerOptions> {\n static type = 'WorkflowBackgroundLayer';\n\n @observeEntity(PlaygroundConfigEntity)\n protected playgroundConfigEntity: PlaygroundConfigEntity;\n\n private _patternId = `${PATTERN_PREFIX}${id++}`;\n\n node = domUtils.createDivWithClass('gedit-flow-background-layer');\n\n grid: HTMLElement = document.createElement('div');\n\n /**\n * 获取网格大小配置\n */\n private get gridSize(): number {\n return this.options.gridSize ?? DEFAULT_RENDER_SIZE;\n }\n\n /**\n * 获取点大小配置\n */\n private get dotSize(): number {\n return this.options.dotSize ?? DEFAULT_DOT_SIZE;\n }\n\n /**\n * 获取点颜色配置\n */\n private get dotColor(): string {\n return this.options.dotColor ?? '#eceeef';\n }\n\n /**\n * 获取点透明度配置\n */\n private get dotOpacity(): number {\n return this.options.dotOpacity ?? 0.5;\n }\n\n /**\n * 获取背景颜色配置\n */\n private get backgroundColor(): string {\n return this.options.backgroundColor ?? 'transparent';\n }\n\n /**\n * 获取点填充颜色配置\n */\n private get dotFillColor(): string {\n return this.options.dotFillColor ?? this.dotColor;\n }\n\n /**\n * 获取Logo配置\n */\n private get logoConfig() {\n return this.options.logo;\n }\n\n /**\n * 当前缩放比\n */\n get zoom(): number {\n return this.config.finalScale;\n }\n\n onReady() {\n const { firstChild } = this.pipelineNode;\n // 背景插入到最下边\n this.pipelineNode.insertBefore(this.node, firstChild);\n // 初始化设置最大 200% 最小 10% 缩放\n this.playgroundConfigEntity.updateConfig({\n minZoom: 0.1,\n maxZoom: 2,\n });\n // 确保点的位置在线条的下方\n this.grid.style.zIndex = '-1';\n this.grid.style.position = 'relative';\n this.node.appendChild(this.grid);\n this.grid.className = 'gedit-grid-svg';\n\n // 设置背景颜色\n if (this.backgroundColor !== 'transparent') {\n this.node.style.backgroundColor = this.backgroundColor;\n }\n }\n\n /**\n * 最小单元格大小\n */\n getScaleUnit(): BackgroundScaleUnit {\n const { zoom } = this;\n\n return {\n realSize: this.gridSize, // 使用配置的网格大小\n renderSize: Math.round(this.gridSize * zoom * 100) / 100, // 一个单元格渲染的大小值\n zoom, // 缩放比\n };\n }\n\n /**\n * 绘制\n */\n autorun(): void {\n const playgroundConfig = this.playgroundConfigEntity.config;\n const scaleUnit = this.getScaleUnit();\n const mod = scaleUnit.renderSize * 10;\n const viewBoxWidth = playgroundConfig.width + mod * 2;\n const viewBoxHeight = playgroundConfig.height + mod * 2;\n const { scrollX } = playgroundConfig;\n const { scrollY } = playgroundConfig;\n const scrollXDelta = this.getScrollDelta(scrollX, mod);\n const scrollYDelta = this.getScrollDelta(scrollY, mod);\n domUtils.setStyle(this.node, {\n left: scrollX - SCALE_WIDTH,\n top: scrollY - SCALE_WIDTH,\n });\n this.drawGrid(scaleUnit, viewBoxWidth, viewBoxHeight);\n // 设置网格\n this.setSVGStyle(this.grid, {\n width: viewBoxWidth,\n height: viewBoxHeight,\n left: SCALE_WIDTH - scrollXDelta - mod,\n top: SCALE_WIDTH - scrollYDelta - mod,\n });\n }\n\n /**\n * 计算Logo位置\n */\n private calculateLogoPosition(\n viewBoxWidth: number,\n viewBoxHeight: number\n ): { x: number; y: number } {\n if (!this.logoConfig) return { x: 0, y: 0 };\n\n const { position = 'center', offset = { x: 0, y: 0 } } = this.logoConfig;\n const playgroundConfig = this.playgroundConfigEntity.config;\n const scaleUnit = this.getScaleUnit();\n const mod = scaleUnit.renderSize * 10;\n\n // 计算SVG内的相对位置，使Logo相对于可视区域固定\n const { scrollX, scrollY } = playgroundConfig;\n const scrollXDelta = this.getScrollDelta(scrollX, mod);\n const scrollYDelta = this.getScrollDelta(scrollY, mod);\n\n // 可视区域的基准点（相对于SVG坐标系）\n const visibleLeft = mod + scrollXDelta;\n const visibleTop = mod + scrollYDelta;\n const visibleCenterX = visibleLeft + playgroundConfig.width / 2;\n const visibleCenterY = visibleTop + playgroundConfig.height / 2;\n\n let x = 0,\n y = 0;\n\n switch (position) {\n case 'center':\n x = visibleCenterX;\n y = visibleCenterY;\n break;\n case 'top-left':\n x = visibleLeft + 100;\n y = visibleTop + 100;\n break;\n case 'top-right':\n x = visibleLeft + playgroundConfig.width - 100;\n y = visibleTop + 100;\n break;\n case 'bottom-left':\n x = visibleLeft + 100;\n y = visibleTop + playgroundConfig.height - 100;\n break;\n case 'bottom-right':\n x = visibleLeft + playgroundConfig.width - 100;\n y = visibleTop + playgroundConfig.height - 100;\n break;\n }\n\n return { x: x + offset.x, y: y + offset.y };\n }\n\n /**\n * 获取Logo大小\n */\n private getLogoSize(): number {\n if (!this.logoConfig) return 0;\n\n const { size = 'medium' } = this.logoConfig;\n\n if (typeof size === 'number') {\n return size;\n }\n\n switch (size) {\n case 'small':\n return 24;\n case 'medium':\n return 48;\n case 'large':\n return 72;\n default:\n return 48;\n }\n }\n\n /**\n * 颜色工具函数：将十六进制颜色转换为RGB\n */\n private hexToRgb(hex: string): { r: number; g: number; b: number } | null {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result\n ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16),\n }\n : null;\n }\n\n /**\n * 颜色工具函数：调整颜色亮度\n */\n private adjustBrightness(hex: string, percent: number): string {\n const rgb = this.hexToRgb(hex);\n if (!rgb) return hex;\n\n const adjust = (value: number) => {\n const adjusted = Math.round(value + (255 - value) * percent);\n return Math.max(0, Math.min(255, adjusted));\n };\n\n return `#${adjust(rgb.r).toString(16).padStart(2, '0')}${adjust(rgb.g)\n .toString(16)\n .padStart(2, '0')}${adjust(rgb.b).toString(16).padStart(2, '0')}`;\n }\n\n /**\n * 生成新拟态阴影滤镜\n */\n private generateNeumorphismFilter(\n filterId: string,\n lightShadow: string,\n darkShadow: string,\n offset: number,\n blur: number,\n intensity: number,\n raised: boolean\n ): string {\n const lightOffset = raised ? -offset : offset;\n const darkOffset = raised ? offset : -offset;\n\n return `\n <defs>\n <filter id=\"${filterId}\" x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\">\n <feDropShadow dx=\"${lightOffset}\" dy=\"${lightOffset}\" stdDeviation=\"${blur}\" flood-color=\"${lightShadow}\" flood-opacity=\"${intensity}\"/>\n <feDropShadow dx=\"${darkOffset}\" dy=\"${darkOffset}\" stdDeviation=\"${blur}\" flood-color=\"${darkShadow}\" flood-opacity=\"${intensity}\"/>\n </filter>\n </defs>`;\n }\n\n /**\n * 绘制Logo SVG内容\n */\n private generateLogoSVG(viewBoxWidth: number, viewBoxHeight: number): string {\n if (!this.logoConfig) return '';\n\n const {\n text,\n imageUrl,\n opacity = 0.1,\n color = '#cccccc',\n fontSize,\n fontFamily = 'Arial, sans-serif',\n fontWeight = 'normal',\n neumorphism,\n } = this.logoConfig;\n const position = this.calculateLogoPosition(viewBoxWidth, viewBoxHeight);\n const logoSize = this.getLogoSize();\n\n let logoSVG = '';\n\n if (imageUrl) {\n // 图片Logo（暂不支持3D效果）\n logoSVG = `\n <image\n href=\"${imageUrl}\"\n x=\"${position.x - logoSize / 2}\"\n y=\"${position.y - logoSize / 2}\"\n width=\"${logoSize}\"\n height=\"${logoSize}\"\n opacity=\"${opacity}\"\n />`;\n } else if (text) {\n // 文本Logo\n const actualFontSize = fontSize ?? Math.max(logoSize / 2, 12);\n\n // 检查是否启用新拟态效果\n if (neumorphism?.enabled) {\n const {\n textColor,\n lightShadowColor,\n darkShadowColor,\n shadowOffset = 6,\n shadowBlur = 12,\n intensity = 0.3,\n raised = true,\n } = neumorphism;\n\n // 自动计算颜色（如果未提供）\n const bgColor = this.backgroundColor !== 'transparent' ? this.backgroundColor : '#f0f0f0';\n const finalTextColor = textColor || bgColor;\n const finalLightShadow = lightShadowColor || this.adjustBrightness(bgColor, 0.2);\n const finalDarkShadow = darkShadowColor || this.adjustBrightness(bgColor, -0.2);\n\n const filterId = `neumorphism-${this._patternId}`;\n\n // 添加新拟态滤镜定义\n logoSVG += this.generateNeumorphismFilter(\n filterId,\n finalLightShadow,\n finalDarkShadow,\n shadowOffset,\n shadowBlur,\n intensity,\n raised\n );\n\n // 创建新拟态文本\n logoSVG += `\n <text\n x=\"${position.x}\"\n y=\"${position.y}\"\n font-family=\"${fontFamily}\"\n font-size=\"${actualFontSize}\"\n font-weight=\"${fontWeight}\"\n fill=\"${finalTextColor}\"\n opacity=\"${opacity}\"\n text-anchor=\"middle\"\n dominant-baseline=\"middle\"\n filter=\"url(#${filterId})\"\n >${text}</text>`;\n } else {\n // 普通文本（无3D效果）\n logoSVG = `\n <text\n x=\"${position.x}\"\n y=\"${position.y}\"\n font-family=\"${fontFamily}\"\n font-size=\"${actualFontSize}\"\n font-weight=\"${fontWeight}\"\n fill=\"${color}\"\n opacity=\"${opacity}\"\n text-anchor=\"middle\"\n dominant-baseline=\"middle\"\n >${text}</text>`;\n }\n }\n\n return logoSVG;\n }\n\n /**\n * 绘制网格\n */\n protected drawGrid(unit: BackgroundScaleUnit, viewBoxWidth: number, viewBoxHeight: number): void {\n const minor = unit.renderSize;\n if (!this.grid) {\n return;\n }\n const patternSize = this.dotSize * this.zoom;\n\n // 构建SVG内容，根据是否有背景颜色决定是否添加背景矩形\n let svgContent = `<svg width=\"100%\" height=\"100%\">`;\n\n // 如果设置了背景颜色，先绘制背景矩形\n if (this.backgroundColor !== 'transparent') {\n svgContent += `<rect width=\"100%\" height=\"100%\" fill=\"${this.backgroundColor}\"/>`;\n }\n\n // 添加点阵图案\n // 构建圆圈属性，保持与原始实现的兼容性\n const circleAttributes = [\n `cx=\"${patternSize}\"`,\n `cy=\"${patternSize}\"`,\n `r=\"${patternSize}\"`,\n `stroke=\"${this.dotColor}\"`,\n // 只有当 dotFillColor 被明确设置且与 dotColor 不同时才添加 fill 属性\n this.options.dotFillColor && this.dotFillColor !== this.dotColor\n ? `fill=\"${this.dotFillColor}\"`\n : '',\n `fill-opacity=\"${this.dotOpacity}\"`,\n ]\n .filter(Boolean)\n .join(' ');\n\n svgContent += `\n <pattern id=\"${this._patternId}\" width=\"${minor}\" height=\"${minor}\" patternUnits=\"userSpaceOnUse\">\n <circle ${circleAttributes} />\n </pattern>\n <rect width=\"100%\" height=\"100%\" fill=\"url(#${this._patternId})\"/>`;\n\n // 添加Logo\n const logoSVG = this.generateLogoSVG(viewBoxWidth, viewBoxHeight);\n if (logoSVG) {\n svgContent += logoSVG;\n }\n\n svgContent += `</svg>`;\n\n this.grid.innerHTML = svgContent;\n }\n\n protected setSVGStyle(\n svgElement: HTMLElement | undefined,\n style: { width: number; height: number; left: number; top: number }\n ): void {\n if (!svgElement) {\n return;\n }\n\n svgElement.style.width = `${style.width}px`;\n svgElement.style.height = `${style.height}px`;\n svgElement.style.left = `${style.left}px`;\n svgElement.style.top = `${style.top}px`;\n }\n\n /**\n * 获取相对滚动距离\n * @param realScroll\n * @param mod\n */\n protected getScrollDelta(realScroll: number, mod: number): number {\n // 正向滚动不用补差\n if (realScroll >= 0) {\n return realScroll % mod;\n }\n return mod - (Math.abs(realScroll) % mod);\n }\n}\n","import { definePluginCreator } from '@flowgram.ai/core';\n\nimport { BackgroundConfig, BackgroundLayer, BackgroundLayerOptions } from './background-layer';\n\n/**\n * 点位背景插件\n */\nexport const createBackgroundPlugin = definePluginCreator<BackgroundLayerOptions>({\n onBind: (bindConfig, opts) => {\n bindConfig.bind(BackgroundConfig).toConstantValue(opts);\n },\n onInit: (ctx, opts) => {\n ctx.playground.registerLayer(BackgroundLayer, opts);\n },\n});\n"],"mappings":";;;;;;;;;;;;AAAA,SAAS,gBAAgB;AACzB,SAAS,OAAO,eAAe,wBAAwB,mBAAmB;AAQ1E,IAAM,iBAAiB;AACvB,IAAM,sBAAsB;AAC5B,IAAM,mBAAmB;AACzB,IAAI,KAAK;AAEF,IAAM,mBAAmB,OAAO,kBAAkB;AA6DlD,IAAM,kBAAN,cAA8B,MAA8B;AAAA,EAA5D;AAAA;AAML,SAAQ,aAAa,GAAG,cAAc,GAAG,IAAI;AAE7C,gBAAO,SAAS,mBAAmB,6BAA6B;AAEhE,gBAAoB,SAAS,cAAc,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,EAKhD,IAAY,WAAmB;AAC7B,WAAO,KAAK,QAAQ,YAAY;AAAA,EAClC;AAAA;AAAA;AAAA;AAAA,EAKA,IAAY,UAAkB;AAC5B,WAAO,KAAK,QAAQ,WAAW;AAAA,EACjC;AAAA;AAAA;AAAA;AAAA,EAKA,IAAY,WAAmB;AAC7B,WAAO,KAAK,QAAQ,YAAY;AAAA,EAClC;AAAA;AAAA;AAAA;AAAA,EAKA,IAAY,aAAqB;AAC/B,WAAO,KAAK,QAAQ,cAAc;AAAA,EACpC;AAAA;AAAA;AAAA;AAAA,EAKA,IAAY,kBAA0B;AACpC,WAAO,KAAK,QAAQ,mBAAmB;AAAA,EACzC;AAAA;AAAA;AAAA;AAAA,EAKA,IAAY,eAAuB;AACjC,WAAO,KAAK,QAAQ,gBAAgB,KAAK;AAAA,EAC3C;AAAA;AAAA;AAAA;AAAA,EAKA,IAAY,aAAa;AACvB,WAAO,KAAK,QAAQ;AAAA,EACtB;AAAA;AAAA;AAAA;AAAA,EAKA,IAAI,OAAe;AACjB,WAAO,KAAK,OAAO;AAAA,EACrB;AAAA,EAEA,UAAU;AACR,UAAM,EAAE,WAAW,IAAI,KAAK;AAE5B,SAAK,aAAa,aAAa,KAAK,MAAM,UAAU;AAEpD,SAAK,uBAAuB,aAAa;AAAA,MACvC,SAAS;AAAA,MACT,SAAS;AAAA,IACX,CAAC;AAED,SAAK,KAAK,MAAM,SAAS;AACzB,SAAK,KAAK,MAAM,WAAW;AAC3B,SAAK,KAAK,YAAY,KAAK,IAAI;AAC/B,SAAK,KAAK,YAAY;AAGtB,QAAI,KAAK,oBAAoB,eAAe;AAC1C,WAAK,KAAK,MAAM,kBAAkB,KAAK;AAAA,IACzC;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,eAAoC;AAClC,UAAM,EAAE,KAAK,IAAI;AAEjB,WAAO;AAAA,MACL,UAAU,KAAK;AAAA;AAAA,MACf,YAAY,KAAK,MAAM,KAAK,WAAW,OAAO,GAAG,IAAI;AAAA;AAAA,MACrD;AAAA;AAAA,IACF;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKA,UAAgB;AACd,UAAM,mBAAmB,KAAK,uBAAuB;AACrD,UAAM,YAAY,KAAK,aAAa;AACpC,UAAM,MAAM,UAAU,aAAa;AACnC,UAAM,eAAe,iBAAiB,QAAQ,MAAM;AACpD,UAAM,gBAAgB,iBAAiB,SAAS,MAAM;AACtD,UAAM,EAAE,QAAQ,IAAI;AACpB,UAAM,EAAE,QAAQ,IAAI;AACpB,UAAM,eAAe,KAAK,eAAe,SAAS,GAAG;AACrD,UAAM,eAAe,KAAK,eAAe,SAAS,GAAG;AACrD,aAAS,SAAS,KAAK,MAAM;AAAA,MAC3B,MAAM,UAAU;AAAA,MAChB,KAAK,UAAU;AAAA,IACjB,CAAC;AACD,SAAK,SAAS,WAAW,cAAc,aAAa;AAEpD,SAAK,YAAY,KAAK,MAAM;AAAA,MAC1B,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,MAAM,cAAc,eAAe;AAAA,MACnC,KAAK,cAAc,eAAe;AAAA,IACpC,CAAC;AAAA,EACH;AAAA;AAAA;AAAA;AAAA,EAKQ,sBACN,cACA,eAC0B;AAC1B,QAAI,CAAC,KAAK,WAAY,QAAO,EAAE,GAAG,GAAG,GAAG,EAAE;AAE1C,UAAM,EAAE,WAAW,UAAU,SAAS,EAAE,GAAG,GAAG,GAAG,EAAE,EAAE,IAAI,KAAK;AAC9D,UAAM,mBAAmB,KAAK,uBAAuB;AACrD,UAAM,YAAY,KAAK,aAAa;AACpC,UAAM,MAAM,UAAU,aAAa;AAGnC,UAAM,EAAE,SAAS,QAAQ,IAAI;AAC7B,UAAM,eAAe,KAAK,eAAe,SAAS,GAAG;AACrD,UAAM,eAAe,KAAK,eAAe,SAAS,GAAG;AAGrD,UAAM,cAAc,MAAM;AAC1B,UAAM,aAAa,MAAM;AACzB,UAAM,iBAAiB,cAAc,iBAAiB,QAAQ;AAC9D,UAAM,iBAAiB,aAAa,iBAAiB,SAAS;AAE9D,QAAI,IAAI,GACN,IAAI;AAEN,YAAQ,UAAU;AAAA,MAChB,KAAK;AACH,YAAI;AACJ,YAAI;AACJ;AAAA,MACF,KAAK;AACH,YAAI,cAAc;AAClB,YAAI,aAAa;AACjB;AAAA,MACF,KAAK;AACH,YAAI,cAAc,iBAAiB,QAAQ;AAC3C,YAAI,aAAa;AACjB;AAAA,MACF,KAAK;AACH,YAAI,cAAc;AAClB,YAAI,aAAa,iBAAiB,SAAS;AAC3C;AAAA,MACF,KAAK;AACH,YAAI,cAAc,iBAAiB,QAAQ;AAC3C,YAAI,aAAa,iBAAiB,SAAS;AAC3C;AAAA,IACJ;AAEA,WAAO,EAAE,GAAG,IAAI,OAAO,GAAG,GAAG,IAAI,OAAO,EAAE;AAAA,EAC5C;AAAA;AAAA;AAAA;AAAA,EAKQ,cAAsB;AAC5B,QAAI,CAAC,KAAK,WAAY,QAAO;AAE7B,UAAM,EAAE,OAAO,SAAS,IAAI,KAAK;AAEjC,QAAI,OAAO,SAAS,UAAU;AAC5B,aAAO;AAAA,IACT;AAEA,YAAQ,MAAM;AAAA,MACZ,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IACX;AAAA,EACF;AAAA;AAAA;AAAA;AAAA,EAKQ,SAAS,KAAyD;AACxE,UAAM,SAAS,4CAA4C,KAAK,GAAG;AACnE,WAAO,SACH;AAAA,MACE,GAAG,SAAS,OAAO,CAAC,GAAG,EAAE;AAAA,MACzB,GAAG,SAAS,OAAO,CAAC,GAAG,EAAE;AAAA,MACzB,GAAG,SAAS,OAAO,CAAC,GAAG,EAAE;AAAA,IAC3B,IACA;AAAA,EACN;AAAA;AAAA;AAAA;AAAA,EAKQ,iBAAiB,KAAa,SAAyB;AAC7D,UAAM,MAAM,KAAK,SAAS,GAAG;AAC7B,QAAI,CAAC,IAAK,QAAO;AAEjB,UAAM,SAAS,CAAC,UAAkB;AAChC,YAAM,WAAW,KAAK,MAAM,SAAS,MAAM,SAAS,OAAO;AAC3D,aAAO,KAAK,IAAI,GAAG,KAAK,IAAI,KAAK,QAAQ,CAAC;AAAA,IAC5C;AAEA,WAAO,IAAI,OAAO,IAAI,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,GAAG,CAAC,GAAG,OAAO,IAAI,CAAC,EAClE,SAAS,EAAE,EACX,SAAS,GAAG,GAAG,CAAC,GAAG,OAAO,IAAI,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG,GAAG,CAAC;AAAA,EACnE;AAAA;AAAA;AAAA;AAAA,EAKQ,0BACN,UACA,aACA,YACA,QACA,MACA,WACA,QACQ;AACR,UAAM,cAAc,SAAS,CAAC,SAAS;AACvC,UAAM,aAAa,SAAS,SAAS,CAAC;AAEtC,WAAO;AAAA;AAAA,sBAEW,QAAQ;AAAA,8BACA,WAAW,SAAS,WAAW,mBAAmB,IAAI,kBAAkB,WAAW,oBAAoB,SAAS;AAAA,8BAChH,UAAU,SAAS,UAAU,mBAAmB,IAAI,kBAAkB,UAAU,oBAAoB,SAAS;AAAA;AAAA;AAAA,EAGzI;AAAA;AAAA;AAAA;AAAA,EAKQ,gBAAgB,cAAsB,eAA+B;AAC3E,QAAI,CAAC,KAAK,WAAY,QAAO;AAE7B,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,QAAQ;AAAA,MACR;AAAA,MACA,aAAa;AAAA,MACb,aAAa;AAAA,MACb;AAAA,IACF,IAAI,KAAK;AACT,UAAM,WAAW,KAAK,sBAAsB,cAAc,aAAa;AACvE,UAAM,WAAW,KAAK,YAAY;AAElC,QAAI,UAAU;AAEd,QAAI,UAAU;AAEZ,gBAAU;AAAA;AAAA,kBAEE,QAAQ;AAAA,eACX,SAAS,IAAI,WAAW,CAAC;AAAA,eACzB,SAAS,IAAI,WAAW,CAAC;AAAA,mBACrB,QAAQ;AAAA,oBACP,QAAQ;AAAA,qBACP,OAAO;AAAA;AAAA,IAExB,WAAW,MAAM;AAEf,YAAM,iBAAiB,YAAY,KAAK,IAAI,WAAW,GAAG,EAAE;AAG5D,UAAI,aAAa,SAAS;AACxB,cAAM;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA,eAAe;AAAA,UACf,aAAa;AAAA,UACb,YAAY;AAAA,UACZ,SAAS;AAAA,QACX,IAAI;AAGJ,cAAM,UAAU,KAAK,oBAAoB,gBAAgB,KAAK,kBAAkB;AAChF,cAAM,iBAAiB,aAAa;AACpC,cAAM,mBAAmB,oBAAoB,KAAK,iBAAiB,SAAS,GAAG;AAC/E,cAAM,kBAAkB,mBAAmB,KAAK,iBAAiB,SAAS,IAAI;AAE9E,cAAM,WAAW,eAAe,KAAK,UAAU;AAG/C,mBAAW,KAAK;AAAA,UACd;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAGA,mBAAW;AAAA;AAAA,iBAEF,SAAS,CAAC;AAAA,iBACV,SAAS,CAAC;AAAA,2BACA,UAAU;AAAA,yBACZ,cAAc;AAAA,2BACZ,UAAU;AAAA,oBACjB,cAAc;AAAA,uBACX,OAAO;AAAA;AAAA;AAAA,2BAGH,QAAQ;AAAA,aACtB,IAAI;AAAA,MACX,OAAO;AAEL,kBAAU;AAAA;AAAA,iBAED,SAAS,CAAC;AAAA,iBACV,SAAS,CAAC;AAAA,2BACA,UAAU;AAAA,yBACZ,cAAc;AAAA,2BACZ,UAAU;AAAA,oBACjB,KAAK;AAAA,uBACF,OAAO;AAAA;AAAA;AAAA,aAGjB,IAAI;AAAA,MACX;AAAA,IACF;AAEA,WAAO;AAAA,EACT;AAAA;AAAA;AAAA;AAAA,EAKU,SAAS,MAA2B,cAAsB,eAA6B;AAC/F,UAAM,QAAQ,KAAK;AACnB,QAAI,CAAC,KAAK,MAAM;AACd;AAAA,IACF;AACA,UAAM,cAAc,KAAK,UAAU,KAAK;AAGxC,QAAI,aAAa;AAGjB,QAAI,KAAK,oBAAoB,eAAe;AAC1C,oBAAc,0CAA0C,KAAK,eAAe;AAAA,IAC9E;AAIA,UAAM,mBAAmB;AAAA,MACvB,OAAO,WAAW;AAAA,MAClB,OAAO,WAAW;AAAA,MAClB,MAAM,WAAW;AAAA,MACjB,WAAW,KAAK,QAAQ;AAAA;AAAA,MAExB,KAAK,QAAQ,gBAAgB,KAAK,iBAAiB,KAAK,WACpD,SAAS,KAAK,YAAY,MAC1B;AAAA,MACJ,iBAAiB,KAAK,UAAU;AAAA,IAClC,EACG,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,kBAAc;AAAA,qBACG,KAAK,UAAU,YAAY,KAAK,aAAa,KAAK;AAAA,kBACrD,gBAAgB;AAAA;AAAA,oDAEkB,KAAK,UAAU;AAG/D,UAAM,UAAU,KAAK,gBAAgB,cAAc,aAAa;AAChE,QAAI,SAAS;AACX,oBAAc;AAAA,IAChB;AAEA,kBAAc;AAEd,SAAK,KAAK,YAAY;AAAA,EACxB;AAAA,EAEU,YACR,YACA,OACM;AACN,QAAI,CAAC,YAAY;AACf;AAAA,IACF;AAEA,eAAW,MAAM,QAAQ,GAAG,MAAM,KAAK;AACvC,eAAW,MAAM,SAAS,GAAG,MAAM,MAAM;AACzC,eAAW,MAAM,OAAO,GAAG,MAAM,IAAI;AACrC,eAAW,MAAM,MAAM,GAAG,MAAM,GAAG;AAAA,EACrC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOU,eAAe,YAAoB,KAAqB;AAEhE,QAAI,cAAc,GAAG;AACnB,aAAO,aAAa;AAAA,IACtB;AACA,WAAO,MAAO,KAAK,IAAI,UAAU,IAAI;AAAA,EACvC;AACF;AAxba,gBACJ,OAAO;AAGJ;AAAA,EADT,cAAc,sBAAsB;AAAA,GAH1B,gBAID;;;AC/EZ,SAAS,2BAA2B;AAO7B,IAAM,yBAAyB,oBAA4C;AAAA,EAChF,QAAQ,CAAC,YAAY,SAAS;AAC5B,eAAW,KAAK,gBAAgB,EAAE,gBAAgB,IAAI;AAAA,EACxD;AAAA,EACA,QAAQ,CAAC,KAAK,SAAS;AACrB,QAAI,WAAW,cAAc,iBAAiB,IAAI;AAAA,EACpD;AACF,CAAC;","names":[]}
1
+ {"version":3,"sources":["../../src/background-layer.tsx","../../src/create-background-plugin.ts"],"sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { domUtils } from '@flowgram.ai/utils';\nimport { Layer, observeEntity, PlaygroundConfigEntity, SCALE_WIDTH } from '@flowgram.ai/core';\n\ninterface BackgroundScaleUnit {\n realSize: number;\n renderSize: number;\n zoom: number;\n}\n\nconst PATTERN_PREFIX = 'gedit-background-pattern-';\nconst DEFAULT_RENDER_SIZE = 20;\nconst DEFAULT_DOT_SIZE = 1;\nlet id = 0;\n\nexport const BackgroundConfig = Symbol('BackgroundConfig');\nexport interface BackgroundLayerOptions {\n /** 网格间距，默认 20px */\n gridSize?: number;\n /** 点的大小，默认 1px */\n dotSize?: number;\n /** 点的颜色，默认 \"#eceeef\" */\n dotColor?: string;\n /** 点的透明度，默认 0.5 */\n dotOpacity?: number;\n /** 背景颜色，默认透明 */\n backgroundColor?: string;\n /** 点的填充颜色，默认与stroke颜色相同 */\n dotFillColor?: string;\n /** Logo 配置 */\n logo?: {\n /** Logo 文本内容 */\n text?: string;\n /** Logo 图片 URL */\n imageUrl?: string;\n /** Logo 位置，默认 'center' */\n position?: 'center' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';\n /** Logo 大小，默认 'medium' */\n size?: 'small' | 'medium' | 'large' | number;\n /** Logo 透明度，默认 0.1 */\n opacity?: number;\n /** Logo 颜色（仅文本），默认 \"#cccccc\" */\n color?: string;\n /** Logo 字体大小（仅文本），默认根据 size 计算 */\n fontSize?: number;\n /** Logo 字体家族（仅文本），默认 'Arial, sans-serif' */\n fontFamily?: string;\n /** Logo 字体粗细（仅文本），默认 'normal' */\n fontWeight?: 'normal' | 'bold' | 'lighter' | number;\n /** 自定义偏移 */\n offset?: { x: number; y: number };\n /** 新拟态（Neumorphism）效果配置 */\n neumorphism?: {\n /** 是否启用新拟态效果，默认 false */\n enabled?: boolean;\n /** 主要文字颜色，应该与背景色接近，默认自动计算 */\n textColor?: string;\n /** 亮色阴影颜色，默认自动计算（背景色的亮色版本） */\n lightShadowColor?: string;\n /** 暗色阴影颜色，默认自动计算（背景色的暗色版本） */\n darkShadowColor?: string;\n /** 阴影偏移距离，默认 6 */\n shadowOffset?: number;\n /** 阴影模糊半径，默认 12 */\n shadowBlur?: number;\n /** 效果强度（0-1），影响阴影的透明度，默认 0.3 */\n intensity?: number;\n /** 凸起效果（true）还是凹陷效果（false），默认 true */\n raised?: boolean;\n };\n };\n}\n\n/**\n * dot 网格背景\n */\nexport class BackgroundLayer extends Layer<BackgroundLayerOptions> {\n static type = 'WorkflowBackgroundLayer';\n\n @observeEntity(PlaygroundConfigEntity)\n protected playgroundConfigEntity: PlaygroundConfigEntity;\n\n private _patternId = `${PATTERN_PREFIX}${id++}`;\n\n node = domUtils.createDivWithClass('gedit-flow-background-layer');\n\n grid: HTMLElement = document.createElement('div');\n\n /**\n * 获取网格大小配置\n */\n private get gridSize(): number {\n return this.options.gridSize ?? DEFAULT_RENDER_SIZE;\n }\n\n /**\n * 获取点大小配置\n */\n private get dotSize(): number {\n return this.options.dotSize ?? DEFAULT_DOT_SIZE;\n }\n\n /**\n * 获取点颜色配置\n */\n private get dotColor(): string {\n return this.options.dotColor ?? '#eceeef';\n }\n\n /**\n * 获取点透明度配置\n */\n private get dotOpacity(): number {\n return this.options.dotOpacity ?? 0.5;\n }\n\n /**\n * 获取背景颜色配置\n */\n private get backgroundColor(): string {\n return this.options.backgroundColor ?? 'transparent';\n }\n\n /**\n * 获取点填充颜色配置\n */\n private get dotFillColor(): string {\n return this.options.dotFillColor ?? this.dotColor;\n }\n\n /**\n * 获取Logo配置\n */\n private get logoConfig() {\n return this.options.logo;\n }\n\n /**\n * 当前缩放比\n */\n get zoom(): number {\n return this.config.finalScale;\n }\n\n onReady() {\n const { firstChild } = this.pipelineNode;\n // 背景插入到最下边\n this.pipelineNode.insertBefore(this.node, firstChild);\n // 初始化设置最大 200% 最小 10% 缩放\n this.playgroundConfigEntity.updateConfig({\n minZoom: 0.1,\n maxZoom: 2,\n });\n // 确保点的位置在线条的下方\n this.grid.style.zIndex = '-1';\n this.grid.style.position = 'relative';\n this.node.appendChild(this.grid);\n this.grid.className = 'gedit-grid-svg';\n\n // 设置背景颜色\n if (this.backgroundColor !== 'transparent') {\n this.node.style.backgroundColor = this.backgroundColor;\n }\n }\n\n /**\n * 最小单元格大小\n */\n getScaleUnit(): BackgroundScaleUnit {\n const { zoom } = this;\n\n return {\n realSize: this.gridSize, // 使用配置的网格大小\n renderSize: Math.round(this.gridSize * zoom * 100) / 100, // 一个单元格渲染的大小值\n zoom, // 缩放比\n };\n }\n\n /**\n * 绘制\n */\n autorun(): void {\n const playgroundConfig = this.playgroundConfigEntity.config;\n const scaleUnit = this.getScaleUnit();\n const mod = scaleUnit.renderSize * 10;\n const viewBoxWidth = playgroundConfig.width + mod * 2;\n const viewBoxHeight = playgroundConfig.height + mod * 2;\n const { scrollX } = playgroundConfig;\n const { scrollY } = playgroundConfig;\n const scrollXDelta = this.getScrollDelta(scrollX, mod);\n const scrollYDelta = this.getScrollDelta(scrollY, mod);\n domUtils.setStyle(this.node, {\n left: scrollX - SCALE_WIDTH,\n top: scrollY - SCALE_WIDTH,\n });\n this.drawGrid(scaleUnit, viewBoxWidth, viewBoxHeight);\n // 设置网格\n this.setSVGStyle(this.grid, {\n width: viewBoxWidth,\n height: viewBoxHeight,\n left: SCALE_WIDTH - scrollXDelta - mod,\n top: SCALE_WIDTH - scrollYDelta - mod,\n });\n }\n\n /**\n * 计算Logo位置\n */\n private calculateLogoPosition(\n viewBoxWidth: number,\n viewBoxHeight: number\n ): { x: number; y: number } {\n if (!this.logoConfig) return { x: 0, y: 0 };\n\n const { position = 'center', offset = { x: 0, y: 0 } } = this.logoConfig;\n const playgroundConfig = this.playgroundConfigEntity.config;\n const scaleUnit = this.getScaleUnit();\n const mod = scaleUnit.renderSize * 10;\n\n // 计算SVG内的相对位置，使Logo相对于可视区域固定\n const { scrollX, scrollY } = playgroundConfig;\n const scrollXDelta = this.getScrollDelta(scrollX, mod);\n const scrollYDelta = this.getScrollDelta(scrollY, mod);\n\n // 可视区域的基准点（相对于SVG坐标系）\n const visibleLeft = mod + scrollXDelta;\n const visibleTop = mod + scrollYDelta;\n const visibleCenterX = visibleLeft + playgroundConfig.width / 2;\n const visibleCenterY = visibleTop + playgroundConfig.height / 2;\n\n let x = 0,\n y = 0;\n\n switch (position) {\n case 'center':\n x = visibleCenterX;\n y = visibleCenterY;\n break;\n case 'top-left':\n x = visibleLeft + 100;\n y = visibleTop + 100;\n break;\n case 'top-right':\n x = visibleLeft + playgroundConfig.width - 100;\n y = visibleTop + 100;\n break;\n case 'bottom-left':\n x = visibleLeft + 100;\n y = visibleTop + playgroundConfig.height - 100;\n break;\n case 'bottom-right':\n x = visibleLeft + playgroundConfig.width - 100;\n y = visibleTop + playgroundConfig.height - 100;\n break;\n }\n\n return { x: x + offset.x, y: y + offset.y };\n }\n\n /**\n * 获取Logo大小\n */\n private getLogoSize(): number {\n if (!this.logoConfig) return 0;\n\n const { size = 'medium' } = this.logoConfig;\n\n if (typeof size === 'number') {\n return size;\n }\n\n switch (size) {\n case 'small':\n return 24;\n case 'medium':\n return 48;\n case 'large':\n return 72;\n default:\n return 48;\n }\n }\n\n /**\n * 颜色工具函数：将十六进制颜色转换为RGB\n */\n private hexToRgb(hex: string): { r: number; g: number; b: number } | null {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result\n ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16),\n }\n : null;\n }\n\n /**\n * 颜色工具函数：调整颜色亮度\n */\n private adjustBrightness(hex: string, percent: number): string {\n const rgb = this.hexToRgb(hex);\n if (!rgb) return hex;\n\n const adjust = (value: number) => {\n const adjusted = Math.round(value + (255 - value) * percent);\n return Math.max(0, Math.min(255, adjusted));\n };\n\n return `#${adjust(rgb.r).toString(16).padStart(2, '0')}${adjust(rgb.g)\n .toString(16)\n .padStart(2, '0')}${adjust(rgb.b).toString(16).padStart(2, '0')}`;\n }\n\n /**\n * 生成新拟态阴影滤镜\n */\n private generateNeumorphismFilter(\n filterId: string,\n lightShadow: string,\n darkShadow: string,\n offset: number,\n blur: number,\n intensity: number,\n raised: boolean\n ): string {\n const lightOffset = raised ? -offset : offset;\n const darkOffset = raised ? offset : -offset;\n\n return `\n <defs>\n <filter id=\"${filterId}\" x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\">\n <feDropShadow dx=\"${lightOffset}\" dy=\"${lightOffset}\" stdDeviation=\"${blur}\" flood-color=\"${lightShadow}\" flood-opacity=\"${intensity}\"/>\n <feDropShadow dx=\"${darkOffset}\" dy=\"${darkOffset}\" stdDeviation=\"${blur}\" flood-color=\"${darkShadow}\" flood-opacity=\"${intensity}\"/>\n </filter>\n </defs>`;\n }\n\n /**\n * 绘制Logo SVG内容\n */\n private generateLogoSVG(viewBoxWidth: number, viewBoxHeight: number): string {\n if (!this.logoConfig) return '';\n\n const {\n text,\n imageUrl,\n opacity = 0.1,\n color = '#cccccc',\n fontSize,\n fontFamily = 'Arial, sans-serif',\n fontWeight = 'normal',\n neumorphism,\n } = this.logoConfig;\n const position = this.calculateLogoPosition(viewBoxWidth, viewBoxHeight);\n const logoSize = this.getLogoSize();\n\n let logoSVG = '';\n\n if (imageUrl) {\n // 图片Logo（暂不支持3D效果）\n logoSVG = `\n <image\n href=\"${imageUrl}\"\n x=\"${position.x - logoSize / 2}\"\n y=\"${position.y - logoSize / 2}\"\n width=\"${logoSize}\"\n height=\"${logoSize}\"\n opacity=\"${opacity}\"\n />`;\n } else if (text) {\n // 文本Logo\n const actualFontSize = fontSize ?? Math.max(logoSize / 2, 12);\n\n // 检查是否启用新拟态效果\n if (neumorphism?.enabled) {\n const {\n textColor,\n lightShadowColor,\n darkShadowColor,\n shadowOffset = 6,\n shadowBlur = 12,\n intensity = 0.3,\n raised = true,\n } = neumorphism;\n\n // 自动计算颜色（如果未提供）\n const bgColor = this.backgroundColor !== 'transparent' ? this.backgroundColor : '#f0f0f0';\n const finalTextColor = textColor || bgColor;\n const finalLightShadow = lightShadowColor || this.adjustBrightness(bgColor, 0.2);\n const finalDarkShadow = darkShadowColor || this.adjustBrightness(bgColor, -0.2);\n\n const filterId = `neumorphism-${this._patternId}`;\n\n // 添加新拟态滤镜定义\n logoSVG += this.generateNeumorphismFilter(\n filterId,\n finalLightShadow,\n finalDarkShadow,\n shadowOffset,\n shadowBlur,\n intensity,\n raised\n );\n\n // 创建新拟态文本\n logoSVG += `\n <text\n x=\"${position.x}\"\n y=\"${position.y}\"\n font-family=\"${fontFamily}\"\n font-size=\"${actualFontSize}\"\n font-weight=\"${fontWeight}\"\n fill=\"${finalTextColor}\"\n opacity=\"${opacity}\"\n text-anchor=\"middle\"\n dominant-baseline=\"middle\"\n filter=\"url(#${filterId})\"\n >${text}</text>`;\n } else {\n // 普通文本（无3D效果）\n logoSVG = `\n <text\n x=\"${position.x}\"\n y=\"${position.y}\"\n font-family=\"${fontFamily}\"\n font-size=\"${actualFontSize}\"\n font-weight=\"${fontWeight}\"\n fill=\"${color}\"\n opacity=\"${opacity}\"\n text-anchor=\"middle\"\n dominant-baseline=\"middle\"\n >${text}</text>`;\n }\n }\n\n return logoSVG;\n }\n\n /**\n * 绘制网格\n */\n protected drawGrid(unit: BackgroundScaleUnit, viewBoxWidth: number, viewBoxHeight: number): void {\n const minor = unit.renderSize;\n if (!this.grid) {\n return;\n }\n const patternSize = this.dotSize * this.zoom;\n\n // 构建SVG内容，根据是否有背景颜色决定是否添加背景矩形\n let svgContent = `<svg width=\"100%\" height=\"100%\">`;\n\n // 如果设置了背景颜色，先绘制背景矩形\n if (this.backgroundColor !== 'transparent') {\n svgContent += `<rect width=\"100%\" height=\"100%\" fill=\"${this.backgroundColor}\"/>`;\n }\n\n // 添加点阵图案\n // 构建圆圈属性，保持与原始实现的兼容性\n const circleAttributes = [\n `cx=\"${patternSize}\"`,\n `cy=\"${patternSize}\"`,\n `r=\"${patternSize}\"`,\n `stroke=\"${this.dotColor}\"`,\n // 只有当 dotFillColor 被明确设置且与 dotColor 不同时才添加 fill 属性\n this.options.dotFillColor && this.dotFillColor !== this.dotColor\n ? `fill=\"${this.dotFillColor}\"`\n : '',\n `fill-opacity=\"${this.dotOpacity}\"`,\n ]\n .filter(Boolean)\n .join(' ');\n\n svgContent += `\n <pattern id=\"${this._patternId}\" width=\"${minor}\" height=\"${minor}\" patternUnits=\"userSpaceOnUse\">\n <circle ${circleAttributes} />\n </pattern>\n <rect width=\"100%\" height=\"100%\" fill=\"url(#${this._patternId})\"/>`;\n\n // 添加Logo\n const logoSVG = this.generateLogoSVG(viewBoxWidth, viewBoxHeight);\n if (logoSVG) {\n svgContent += logoSVG;\n }\n\n svgContent += `</svg>`;\n\n this.grid.innerHTML = svgContent;\n }\n\n protected setSVGStyle(\n svgElement: HTMLElement | undefined,\n style: { width: number; height: number; left: number; top: number }\n ): void {\n if (!svgElement) {\n return;\n }\n\n svgElement.style.width = `${style.width}px`;\n svgElement.style.height = `${style.height}px`;\n svgElement.style.left = `${style.left}px`;\n svgElement.style.top = `${style.top}px`;\n }\n\n /**\n * 获取相对滚动距离\n * @param realScroll\n * @param mod\n */\n protected getScrollDelta(realScroll: number, mod: number): number {\n // 正向滚动不用补差\n if (realScroll >= 0) {\n return realScroll % mod;\n }\n return mod - (Math.abs(realScroll) % mod);\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram.ai/core';\n\nimport { BackgroundConfig, BackgroundLayer, BackgroundLayerOptions } from './background-layer';\n\n/**\n * 点位背景插件\n */\nexport const createBackgroundPlugin = definePluginCreator<BackgroundLayerOptions>({\n onBind: (bindConfig, opts) => {\n bindConfig.bind(BackgroundConfig).toConstantValue(opts);\n },\n onInit: (ctx, opts) => {\n ctx.playground.registerLayer(BackgroundLayer, opts);\n },\n});\n"],"mappings":"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","names":[]}
package/dist/index.d.mts CHANGED
@@ -1,6 +1,11 @@
1
1
  import * as _flowgram_ai_core from '@flowgram.ai/core';
2
2
  import { Layer, PlaygroundConfigEntity } from '@flowgram.ai/core';
3
3
 
4
+ /**
5
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
6
+ * SPDX-License-Identifier: MIT
7
+ */
8
+
4
9
  interface BackgroundScaleUnit {
5
10
  realSize: number;
6
11
  renderSize: number;
package/dist/index.d.ts CHANGED
@@ -1,6 +1,11 @@
1
1
  import * as _flowgram_ai_core from '@flowgram.ai/core';
2
2
  import { Layer, PlaygroundConfigEntity } from '@flowgram.ai/core';
3
3
 
4
+ /**
5
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
6
+ * SPDX-License-Identifier: MIT
7
+ */
8
+
4
9
  interface BackgroundScaleUnit {
5
10
  realSize: number;
6
11
  renderSize: number;
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/background-layer.tsx","../src/create-background-plugin.ts"],"sourcesContent":["export * from './background-layer';\nexport * from './create-background-plugin';\n","import { domUtils } from '@flowgram.ai/utils';\nimport { Layer, observeEntity, PlaygroundConfigEntity, SCALE_WIDTH } from '@flowgram.ai/core';\n\ninterface BackgroundScaleUnit {\n realSize: number;\n renderSize: number;\n zoom: number;\n}\n\nconst PATTERN_PREFIX = 'gedit-background-pattern-';\nconst DEFAULT_RENDER_SIZE = 20;\nconst DEFAULT_DOT_SIZE = 1;\nlet id = 0;\n\nexport const BackgroundConfig = Symbol('BackgroundConfig');\nexport interface BackgroundLayerOptions {\n /** 网格间距，默认 20px */\n gridSize?: number;\n /** 点的大小，默认 1px */\n dotSize?: number;\n /** 点的颜色，默认 \"#eceeef\" */\n dotColor?: string;\n /** 点的透明度，默认 0.5 */\n dotOpacity?: number;\n /** 背景颜色，默认透明 */\n backgroundColor?: string;\n /** 点的填充颜色，默认与stroke颜色相同 */\n dotFillColor?: string;\n /** Logo 配置 */\n logo?: {\n /** Logo 文本内容 */\n text?: string;\n /** Logo 图片 URL */\n imageUrl?: string;\n /** Logo 位置，默认 'center' */\n position?: 'center' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';\n /** Logo 大小，默认 'medium' */\n size?: 'small' | 'medium' | 'large' | number;\n /** Logo 透明度，默认 0.1 */\n opacity?: number;\n /** Logo 颜色（仅文本），默认 \"#cccccc\" */\n color?: string;\n /** Logo 字体大小（仅文本），默认根据 size 计算 */\n fontSize?: number;\n /** Logo 字体家族（仅文本），默认 'Arial, sans-serif' */\n fontFamily?: string;\n /** Logo 字体粗细（仅文本），默认 'normal' */\n fontWeight?: 'normal' | 'bold' | 'lighter' | number;\n /** 自定义偏移 */\n offset?: { x: number; y: number };\n /** 新拟态（Neumorphism）效果配置 */\n neumorphism?: {\n /** 是否启用新拟态效果，默认 false */\n enabled?: boolean;\n /** 主要文字颜色，应该与背景色接近，默认自动计算 */\n textColor?: string;\n /** 亮色阴影颜色，默认自动计算（背景色的亮色版本） */\n lightShadowColor?: string;\n /** 暗色阴影颜色，默认自动计算（背景色的暗色版本） */\n darkShadowColor?: string;\n /** 阴影偏移距离，默认 6 */\n shadowOffset?: number;\n /** 阴影模糊半径，默认 12 */\n shadowBlur?: number;\n /** 效果强度（0-1），影响阴影的透明度，默认 0.3 */\n intensity?: number;\n /** 凸起效果（true）还是凹陷效果（false），默认 true */\n raised?: boolean;\n };\n };\n}\n\n/**\n * dot 网格背景\n */\nexport class BackgroundLayer extends Layer<BackgroundLayerOptions> {\n static type = 'WorkflowBackgroundLayer';\n\n @observeEntity(PlaygroundConfigEntity)\n protected playgroundConfigEntity: PlaygroundConfigEntity;\n\n private _patternId = `${PATTERN_PREFIX}${id++}`;\n\n node = domUtils.createDivWithClass('gedit-flow-background-layer');\n\n grid: HTMLElement = document.createElement('div');\n\n /**\n * 获取网格大小配置\n */\n private get gridSize(): number {\n return this.options.gridSize ?? DEFAULT_RENDER_SIZE;\n }\n\n /**\n * 获取点大小配置\n */\n private get dotSize(): number {\n return this.options.dotSize ?? DEFAULT_DOT_SIZE;\n }\n\n /**\n * 获取点颜色配置\n */\n private get dotColor(): string {\n return this.options.dotColor ?? '#eceeef';\n }\n\n /**\n * 获取点透明度配置\n */\n private get dotOpacity(): number {\n return this.options.dotOpacity ?? 0.5;\n }\n\n /**\n * 获取背景颜色配置\n */\n private get backgroundColor(): string {\n return this.options.backgroundColor ?? 'transparent';\n }\n\n /**\n * 获取点填充颜色配置\n */\n private get dotFillColor(): string {\n return this.options.dotFillColor ?? this.dotColor;\n }\n\n /**\n * 获取Logo配置\n */\n private get logoConfig() {\n return this.options.logo;\n }\n\n /**\n * 当前缩放比\n */\n get zoom(): number {\n return this.config.finalScale;\n }\n\n onReady() {\n const { firstChild } = this.pipelineNode;\n // 背景插入到最下边\n this.pipelineNode.insertBefore(this.node, firstChild);\n // 初始化设置最大 200% 最小 10% 缩放\n this.playgroundConfigEntity.updateConfig({\n minZoom: 0.1,\n maxZoom: 2,\n });\n // 确保点的位置在线条的下方\n this.grid.style.zIndex = '-1';\n this.grid.style.position = 'relative';\n this.node.appendChild(this.grid);\n this.grid.className = 'gedit-grid-svg';\n\n // 设置背景颜色\n if (this.backgroundColor !== 'transparent') {\n this.node.style.backgroundColor = this.backgroundColor;\n }\n }\n\n /**\n * 最小单元格大小\n */\n getScaleUnit(): BackgroundScaleUnit {\n const { zoom } = this;\n\n return {\n realSize: this.gridSize, // 使用配置的网格大小\n renderSize: Math.round(this.gridSize * zoom * 100) / 100, // 一个单元格渲染的大小值\n zoom, // 缩放比\n };\n }\n\n /**\n * 绘制\n */\n autorun(): void {\n const playgroundConfig = this.playgroundConfigEntity.config;\n const scaleUnit = this.getScaleUnit();\n const mod = scaleUnit.renderSize * 10;\n const viewBoxWidth = playgroundConfig.width + mod * 2;\n const viewBoxHeight = playgroundConfig.height + mod * 2;\n const { scrollX } = playgroundConfig;\n const { scrollY } = playgroundConfig;\n const scrollXDelta = this.getScrollDelta(scrollX, mod);\n const scrollYDelta = this.getScrollDelta(scrollY, mod);\n domUtils.setStyle(this.node, {\n left: scrollX - SCALE_WIDTH,\n top: scrollY - SCALE_WIDTH,\n });\n this.drawGrid(scaleUnit, viewBoxWidth, viewBoxHeight);\n // 设置网格\n this.setSVGStyle(this.grid, {\n width: viewBoxWidth,\n height: viewBoxHeight,\n left: SCALE_WIDTH - scrollXDelta - mod,\n top: SCALE_WIDTH - scrollYDelta - mod,\n });\n }\n\n /**\n * 计算Logo位置\n */\n private calculateLogoPosition(\n viewBoxWidth: number,\n viewBoxHeight: number\n ): { x: number; y: number } {\n if (!this.logoConfig) return { x: 0, y: 0 };\n\n const { position = 'center', offset = { x: 0, y: 0 } } = this.logoConfig;\n const playgroundConfig = this.playgroundConfigEntity.config;\n const scaleUnit = this.getScaleUnit();\n const mod = scaleUnit.renderSize * 10;\n\n // 计算SVG内的相对位置，使Logo相对于可视区域固定\n const { scrollX, scrollY } = playgroundConfig;\n const scrollXDelta = this.getScrollDelta(scrollX, mod);\n const scrollYDelta = this.getScrollDelta(scrollY, mod);\n\n // 可视区域的基准点（相对于SVG坐标系）\n const visibleLeft = mod + scrollXDelta;\n const visibleTop = mod + scrollYDelta;\n const visibleCenterX = visibleLeft + playgroundConfig.width / 2;\n const visibleCenterY = visibleTop + playgroundConfig.height / 2;\n\n let x = 0,\n y = 0;\n\n switch (position) {\n case 'center':\n x = visibleCenterX;\n y = visibleCenterY;\n break;\n case 'top-left':\n x = visibleLeft + 100;\n y = visibleTop + 100;\n break;\n case 'top-right':\n x = visibleLeft + playgroundConfig.width - 100;\n y = visibleTop + 100;\n break;\n case 'bottom-left':\n x = visibleLeft + 100;\n y = visibleTop + playgroundConfig.height - 100;\n break;\n case 'bottom-right':\n x = visibleLeft + playgroundConfig.width - 100;\n y = visibleTop + playgroundConfig.height - 100;\n break;\n }\n\n return { x: x + offset.x, y: y + offset.y };\n }\n\n /**\n * 获取Logo大小\n */\n private getLogoSize(): number {\n if (!this.logoConfig) return 0;\n\n const { size = 'medium' } = this.logoConfig;\n\n if (typeof size === 'number') {\n return size;\n }\n\n switch (size) {\n case 'small':\n return 24;\n case 'medium':\n return 48;\n case 'large':\n return 72;\n default:\n return 48;\n }\n }\n\n /**\n * 颜色工具函数：将十六进制颜色转换为RGB\n */\n private hexToRgb(hex: string): { r: number; g: number; b: number } | null {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result\n ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16),\n }\n : null;\n }\n\n /**\n * 颜色工具函数：调整颜色亮度\n */\n private adjustBrightness(hex: string, percent: number): string {\n const rgb = this.hexToRgb(hex);\n if (!rgb) return hex;\n\n const adjust = (value: number) => {\n const adjusted = Math.round(value + (255 - value) * percent);\n return Math.max(0, Math.min(255, adjusted));\n };\n\n return `#${adjust(rgb.r).toString(16).padStart(2, '0')}${adjust(rgb.g)\n .toString(16)\n .padStart(2, '0')}${adjust(rgb.b).toString(16).padStart(2, '0')}`;\n }\n\n /**\n * 生成新拟态阴影滤镜\n */\n private generateNeumorphismFilter(\n filterId: string,\n lightShadow: string,\n darkShadow: string,\n offset: number,\n blur: number,\n intensity: number,\n raised: boolean\n ): string {\n const lightOffset = raised ? -offset : offset;\n const darkOffset = raised ? offset : -offset;\n\n return `\n <defs>\n <filter id=\"${filterId}\" x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\">\n <feDropShadow dx=\"${lightOffset}\" dy=\"${lightOffset}\" stdDeviation=\"${blur}\" flood-color=\"${lightShadow}\" flood-opacity=\"${intensity}\"/>\n <feDropShadow dx=\"${darkOffset}\" dy=\"${darkOffset}\" stdDeviation=\"${blur}\" flood-color=\"${darkShadow}\" flood-opacity=\"${intensity}\"/>\n </filter>\n </defs>`;\n }\n\n /**\n * 绘制Logo SVG内容\n */\n private generateLogoSVG(viewBoxWidth: number, viewBoxHeight: number): string {\n if (!this.logoConfig) return '';\n\n const {\n text,\n imageUrl,\n opacity = 0.1,\n color = '#cccccc',\n fontSize,\n fontFamily = 'Arial, sans-serif',\n fontWeight = 'normal',\n neumorphism,\n } = this.logoConfig;\n const position = this.calculateLogoPosition(viewBoxWidth, viewBoxHeight);\n const logoSize = this.getLogoSize();\n\n let logoSVG = '';\n\n if (imageUrl) {\n // 图片Logo（暂不支持3D效果）\n logoSVG = `\n <image\n href=\"${imageUrl}\"\n x=\"${position.x - logoSize / 2}\"\n y=\"${position.y - logoSize / 2}\"\n width=\"${logoSize}\"\n height=\"${logoSize}\"\n opacity=\"${opacity}\"\n />`;\n } else if (text) {\n // 文本Logo\n const actualFontSize = fontSize ?? Math.max(logoSize / 2, 12);\n\n // 检查是否启用新拟态效果\n if (neumorphism?.enabled) {\n const {\n textColor,\n lightShadowColor,\n darkShadowColor,\n shadowOffset = 6,\n shadowBlur = 12,\n intensity = 0.3,\n raised = true,\n } = neumorphism;\n\n // 自动计算颜色（如果未提供）\n const bgColor = this.backgroundColor !== 'transparent' ? this.backgroundColor : '#f0f0f0';\n const finalTextColor = textColor || bgColor;\n const finalLightShadow = lightShadowColor || this.adjustBrightness(bgColor, 0.2);\n const finalDarkShadow = darkShadowColor || this.adjustBrightness(bgColor, -0.2);\n\n const filterId = `neumorphism-${this._patternId}`;\n\n // 添加新拟态滤镜定义\n logoSVG += this.generateNeumorphismFilter(\n filterId,\n finalLightShadow,\n finalDarkShadow,\n shadowOffset,\n shadowBlur,\n intensity,\n raised\n );\n\n // 创建新拟态文本\n logoSVG += `\n <text\n x=\"${position.x}\"\n y=\"${position.y}\"\n font-family=\"${fontFamily}\"\n font-size=\"${actualFontSize}\"\n font-weight=\"${fontWeight}\"\n fill=\"${finalTextColor}\"\n opacity=\"${opacity}\"\n text-anchor=\"middle\"\n dominant-baseline=\"middle\"\n filter=\"url(#${filterId})\"\n >${text}</text>`;\n } else {\n // 普通文本（无3D效果）\n logoSVG = `\n <text\n x=\"${position.x}\"\n y=\"${position.y}\"\n font-family=\"${fontFamily}\"\n font-size=\"${actualFontSize}\"\n font-weight=\"${fontWeight}\"\n fill=\"${color}\"\n opacity=\"${opacity}\"\n text-anchor=\"middle\"\n dominant-baseline=\"middle\"\n >${text}</text>`;\n }\n }\n\n return logoSVG;\n }\n\n /**\n * 绘制网格\n */\n protected drawGrid(unit: BackgroundScaleUnit, viewBoxWidth: number, viewBoxHeight: number): void {\n const minor = unit.renderSize;\n if (!this.grid) {\n return;\n }\n const patternSize = this.dotSize * this.zoom;\n\n // 构建SVG内容，根据是否有背景颜色决定是否添加背景矩形\n let svgContent = `<svg width=\"100%\" height=\"100%\">`;\n\n // 如果设置了背景颜色，先绘制背景矩形\n if (this.backgroundColor !== 'transparent') {\n svgContent += `<rect width=\"100%\" height=\"100%\" fill=\"${this.backgroundColor}\"/>`;\n }\n\n // 添加点阵图案\n // 构建圆圈属性，保持与原始实现的兼容性\n const circleAttributes = [\n `cx=\"${patternSize}\"`,\n `cy=\"${patternSize}\"`,\n `r=\"${patternSize}\"`,\n `stroke=\"${this.dotColor}\"`,\n // 只有当 dotFillColor 被明确设置且与 dotColor 不同时才添加 fill 属性\n this.options.dotFillColor && this.dotFillColor !== this.dotColor\n ? `fill=\"${this.dotFillColor}\"`\n : '',\n `fill-opacity=\"${this.dotOpacity}\"`,\n ]\n .filter(Boolean)\n .join(' ');\n\n svgContent += `\n <pattern id=\"${this._patternId}\" width=\"${minor}\" height=\"${minor}\" patternUnits=\"userSpaceOnUse\">\n <circle ${circleAttributes} />\n </pattern>\n <rect width=\"100%\" height=\"100%\" fill=\"url(#${this._patternId})\"/>`;\n\n // 添加Logo\n const logoSVG = this.generateLogoSVG(viewBoxWidth, viewBoxHeight);\n if (logoSVG) {\n svgContent += logoSVG;\n }\n\n svgContent += `</svg>`;\n\n this.grid.innerHTML = svgContent;\n }\n\n protected setSVGStyle(\n svgElement: HTMLElement | undefined,\n style: { width: number; height: number; left: number; top: number }\n ): void {\n if (!svgElement) {\n return;\n }\n\n svgElement.style.width = `${style.width}px`;\n svgElement.style.height = `${style.height}px`;\n svgElement.style.left = `${style.left}px`;\n svgElement.style.top = `${style.top}px`;\n }\n\n /**\n * 获取相对滚动距离\n * @param realScroll\n * @param mod\n */\n protected getScrollDelta(realScroll: number, mod: number): number {\n // 正向滚动不用补差\n if (realScroll >= 0) {\n return realScroll % mod;\n }\n return mod - (Math.abs(realScroll) % mod);\n }\n}\n","import { definePluginCreator } from '@flowgram.ai/core';\n\nimport { BackgroundConfig, BackgroundLayer, BackgroundLayerOptions } from './background-layer';\n\n/**\n * 点位背景插件\n */\nexport const createBackgroundPlugin = definePluginCreator<BackgroundLayerOptions>({\n onBind: (bindConfig, opts) => {\n bindConfig.bind(BackgroundConfig).toConstantValue(opts);\n },\n onInit: (ctx, opts) => {\n ctx.playground.registerLayer(BackgroundLayer, opts);\n },\n});\n"],"mappings":"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","names":["import_core"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/background-layer.tsx","../src/create-background-plugin.ts"],"sourcesContent":["/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nexport * from './background-layer';\nexport * from './create-background-plugin';\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { domUtils } from '@flowgram.ai/utils';\nimport { Layer, observeEntity, PlaygroundConfigEntity, SCALE_WIDTH } from '@flowgram.ai/core';\n\ninterface BackgroundScaleUnit {\n realSize: number;\n renderSize: number;\n zoom: number;\n}\n\nconst PATTERN_PREFIX = 'gedit-background-pattern-';\nconst DEFAULT_RENDER_SIZE = 20;\nconst DEFAULT_DOT_SIZE = 1;\nlet id = 0;\n\nexport const BackgroundConfig = Symbol('BackgroundConfig');\nexport interface BackgroundLayerOptions {\n /** 网格间距，默认 20px */\n gridSize?: number;\n /** 点的大小，默认 1px */\n dotSize?: number;\n /** 点的颜色，默认 \"#eceeef\" */\n dotColor?: string;\n /** 点的透明度，默认 0.5 */\n dotOpacity?: number;\n /** 背景颜色，默认透明 */\n backgroundColor?: string;\n /** 点的填充颜色，默认与stroke颜色相同 */\n dotFillColor?: string;\n /** Logo 配置 */\n logo?: {\n /** Logo 文本内容 */\n text?: string;\n /** Logo 图片 URL */\n imageUrl?: string;\n /** Logo 位置，默认 'center' */\n position?: 'center' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';\n /** Logo 大小，默认 'medium' */\n size?: 'small' | 'medium' | 'large' | number;\n /** Logo 透明度，默认 0.1 */\n opacity?: number;\n /** Logo 颜色（仅文本），默认 \"#cccccc\" */\n color?: string;\n /** Logo 字体大小（仅文本），默认根据 size 计算 */\n fontSize?: number;\n /** Logo 字体家族（仅文本），默认 'Arial, sans-serif' */\n fontFamily?: string;\n /** Logo 字体粗细（仅文本），默认 'normal' */\n fontWeight?: 'normal' | 'bold' | 'lighter' | number;\n /** 自定义偏移 */\n offset?: { x: number; y: number };\n /** 新拟态（Neumorphism）效果配置 */\n neumorphism?: {\n /** 是否启用新拟态效果，默认 false */\n enabled?: boolean;\n /** 主要文字颜色，应该与背景色接近，默认自动计算 */\n textColor?: string;\n /** 亮色阴影颜色，默认自动计算（背景色的亮色版本） */\n lightShadowColor?: string;\n /** 暗色阴影颜色，默认自动计算（背景色的暗色版本） */\n darkShadowColor?: string;\n /** 阴影偏移距离，默认 6 */\n shadowOffset?: number;\n /** 阴影模糊半径，默认 12 */\n shadowBlur?: number;\n /** 效果强度（0-1），影响阴影的透明度，默认 0.3 */\n intensity?: number;\n /** 凸起效果（true）还是凹陷效果（false），默认 true */\n raised?: boolean;\n };\n };\n}\n\n/**\n * dot 网格背景\n */\nexport class BackgroundLayer extends Layer<BackgroundLayerOptions> {\n static type = 'WorkflowBackgroundLayer';\n\n @observeEntity(PlaygroundConfigEntity)\n protected playgroundConfigEntity: PlaygroundConfigEntity;\n\n private _patternId = `${PATTERN_PREFIX}${id++}`;\n\n node = domUtils.createDivWithClass('gedit-flow-background-layer');\n\n grid: HTMLElement = document.createElement('div');\n\n /**\n * 获取网格大小配置\n */\n private get gridSize(): number {\n return this.options.gridSize ?? DEFAULT_RENDER_SIZE;\n }\n\n /**\n * 获取点大小配置\n */\n private get dotSize(): number {\n return this.options.dotSize ?? DEFAULT_DOT_SIZE;\n }\n\n /**\n * 获取点颜色配置\n */\n private get dotColor(): string {\n return this.options.dotColor ?? '#eceeef';\n }\n\n /**\n * 获取点透明度配置\n */\n private get dotOpacity(): number {\n return this.options.dotOpacity ?? 0.5;\n }\n\n /**\n * 获取背景颜色配置\n */\n private get backgroundColor(): string {\n return this.options.backgroundColor ?? 'transparent';\n }\n\n /**\n * 获取点填充颜色配置\n */\n private get dotFillColor(): string {\n return this.options.dotFillColor ?? this.dotColor;\n }\n\n /**\n * 获取Logo配置\n */\n private get logoConfig() {\n return this.options.logo;\n }\n\n /**\n * 当前缩放比\n */\n get zoom(): number {\n return this.config.finalScale;\n }\n\n onReady() {\n const { firstChild } = this.pipelineNode;\n // 背景插入到最下边\n this.pipelineNode.insertBefore(this.node, firstChild);\n // 初始化设置最大 200% 最小 10% 缩放\n this.playgroundConfigEntity.updateConfig({\n minZoom: 0.1,\n maxZoom: 2,\n });\n // 确保点的位置在线条的下方\n this.grid.style.zIndex = '-1';\n this.grid.style.position = 'relative';\n this.node.appendChild(this.grid);\n this.grid.className = 'gedit-grid-svg';\n\n // 设置背景颜色\n if (this.backgroundColor !== 'transparent') {\n this.node.style.backgroundColor = this.backgroundColor;\n }\n }\n\n /**\n * 最小单元格大小\n */\n getScaleUnit(): BackgroundScaleUnit {\n const { zoom } = this;\n\n return {\n realSize: this.gridSize, // 使用配置的网格大小\n renderSize: Math.round(this.gridSize * zoom * 100) / 100, // 一个单元格渲染的大小值\n zoom, // 缩放比\n };\n }\n\n /**\n * 绘制\n */\n autorun(): void {\n const playgroundConfig = this.playgroundConfigEntity.config;\n const scaleUnit = this.getScaleUnit();\n const mod = scaleUnit.renderSize * 10;\n const viewBoxWidth = playgroundConfig.width + mod * 2;\n const viewBoxHeight = playgroundConfig.height + mod * 2;\n const { scrollX } = playgroundConfig;\n const { scrollY } = playgroundConfig;\n const scrollXDelta = this.getScrollDelta(scrollX, mod);\n const scrollYDelta = this.getScrollDelta(scrollY, mod);\n domUtils.setStyle(this.node, {\n left: scrollX - SCALE_WIDTH,\n top: scrollY - SCALE_WIDTH,\n });\n this.drawGrid(scaleUnit, viewBoxWidth, viewBoxHeight);\n // 设置网格\n this.setSVGStyle(this.grid, {\n width: viewBoxWidth,\n height: viewBoxHeight,\n left: SCALE_WIDTH - scrollXDelta - mod,\n top: SCALE_WIDTH - scrollYDelta - mod,\n });\n }\n\n /**\n * 计算Logo位置\n */\n private calculateLogoPosition(\n viewBoxWidth: number,\n viewBoxHeight: number\n ): { x: number; y: number } {\n if (!this.logoConfig) return { x: 0, y: 0 };\n\n const { position = 'center', offset = { x: 0, y: 0 } } = this.logoConfig;\n const playgroundConfig = this.playgroundConfigEntity.config;\n const scaleUnit = this.getScaleUnit();\n const mod = scaleUnit.renderSize * 10;\n\n // 计算SVG内的相对位置，使Logo相对于可视区域固定\n const { scrollX, scrollY } = playgroundConfig;\n const scrollXDelta = this.getScrollDelta(scrollX, mod);\n const scrollYDelta = this.getScrollDelta(scrollY, mod);\n\n // 可视区域的基准点（相对于SVG坐标系）\n const visibleLeft = mod + scrollXDelta;\n const visibleTop = mod + scrollYDelta;\n const visibleCenterX = visibleLeft + playgroundConfig.width / 2;\n const visibleCenterY = visibleTop + playgroundConfig.height / 2;\n\n let x = 0,\n y = 0;\n\n switch (position) {\n case 'center':\n x = visibleCenterX;\n y = visibleCenterY;\n break;\n case 'top-left':\n x = visibleLeft + 100;\n y = visibleTop + 100;\n break;\n case 'top-right':\n x = visibleLeft + playgroundConfig.width - 100;\n y = visibleTop + 100;\n break;\n case 'bottom-left':\n x = visibleLeft + 100;\n y = visibleTop + playgroundConfig.height - 100;\n break;\n case 'bottom-right':\n x = visibleLeft + playgroundConfig.width - 100;\n y = visibleTop + playgroundConfig.height - 100;\n break;\n }\n\n return { x: x + offset.x, y: y + offset.y };\n }\n\n /**\n * 获取Logo大小\n */\n private getLogoSize(): number {\n if (!this.logoConfig) return 0;\n\n const { size = 'medium' } = this.logoConfig;\n\n if (typeof size === 'number') {\n return size;\n }\n\n switch (size) {\n case 'small':\n return 24;\n case 'medium':\n return 48;\n case 'large':\n return 72;\n default:\n return 48;\n }\n }\n\n /**\n * 颜色工具函数：将十六进制颜色转换为RGB\n */\n private hexToRgb(hex: string): { r: number; g: number; b: number } | null {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result\n ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16),\n }\n : null;\n }\n\n /**\n * 颜色工具函数：调整颜色亮度\n */\n private adjustBrightness(hex: string, percent: number): string {\n const rgb = this.hexToRgb(hex);\n if (!rgb) return hex;\n\n const adjust = (value: number) => {\n const adjusted = Math.round(value + (255 - value) * percent);\n return Math.max(0, Math.min(255, adjusted));\n };\n\n return `#${adjust(rgb.r).toString(16).padStart(2, '0')}${adjust(rgb.g)\n .toString(16)\n .padStart(2, '0')}${adjust(rgb.b).toString(16).padStart(2, '0')}`;\n }\n\n /**\n * 生成新拟态阴影滤镜\n */\n private generateNeumorphismFilter(\n filterId: string,\n lightShadow: string,\n darkShadow: string,\n offset: number,\n blur: number,\n intensity: number,\n raised: boolean\n ): string {\n const lightOffset = raised ? -offset : offset;\n const darkOffset = raised ? offset : -offset;\n\n return `\n <defs>\n <filter id=\"${filterId}\" x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\">\n <feDropShadow dx=\"${lightOffset}\" dy=\"${lightOffset}\" stdDeviation=\"${blur}\" flood-color=\"${lightShadow}\" flood-opacity=\"${intensity}\"/>\n <feDropShadow dx=\"${darkOffset}\" dy=\"${darkOffset}\" stdDeviation=\"${blur}\" flood-color=\"${darkShadow}\" flood-opacity=\"${intensity}\"/>\n </filter>\n </defs>`;\n }\n\n /**\n * 绘制Logo SVG内容\n */\n private generateLogoSVG(viewBoxWidth: number, viewBoxHeight: number): string {\n if (!this.logoConfig) return '';\n\n const {\n text,\n imageUrl,\n opacity = 0.1,\n color = '#cccccc',\n fontSize,\n fontFamily = 'Arial, sans-serif',\n fontWeight = 'normal',\n neumorphism,\n } = this.logoConfig;\n const position = this.calculateLogoPosition(viewBoxWidth, viewBoxHeight);\n const logoSize = this.getLogoSize();\n\n let logoSVG = '';\n\n if (imageUrl) {\n // 图片Logo（暂不支持3D效果）\n logoSVG = `\n <image\n href=\"${imageUrl}\"\n x=\"${position.x - logoSize / 2}\"\n y=\"${position.y - logoSize / 2}\"\n width=\"${logoSize}\"\n height=\"${logoSize}\"\n opacity=\"${opacity}\"\n />`;\n } else if (text) {\n // 文本Logo\n const actualFontSize = fontSize ?? Math.max(logoSize / 2, 12);\n\n // 检查是否启用新拟态效果\n if (neumorphism?.enabled) {\n const {\n textColor,\n lightShadowColor,\n darkShadowColor,\n shadowOffset = 6,\n shadowBlur = 12,\n intensity = 0.3,\n raised = true,\n } = neumorphism;\n\n // 自动计算颜色（如果未提供）\n const bgColor = this.backgroundColor !== 'transparent' ? this.backgroundColor : '#f0f0f0';\n const finalTextColor = textColor || bgColor;\n const finalLightShadow = lightShadowColor || this.adjustBrightness(bgColor, 0.2);\n const finalDarkShadow = darkShadowColor || this.adjustBrightness(bgColor, -0.2);\n\n const filterId = `neumorphism-${this._patternId}`;\n\n // 添加新拟态滤镜定义\n logoSVG += this.generateNeumorphismFilter(\n filterId,\n finalLightShadow,\n finalDarkShadow,\n shadowOffset,\n shadowBlur,\n intensity,\n raised\n );\n\n // 创建新拟态文本\n logoSVG += `\n <text\n x=\"${position.x}\"\n y=\"${position.y}\"\n font-family=\"${fontFamily}\"\n font-size=\"${actualFontSize}\"\n font-weight=\"${fontWeight}\"\n fill=\"${finalTextColor}\"\n opacity=\"${opacity}\"\n text-anchor=\"middle\"\n dominant-baseline=\"middle\"\n filter=\"url(#${filterId})\"\n >${text}</text>`;\n } else {\n // 普通文本（无3D效果）\n logoSVG = `\n <text\n x=\"${position.x}\"\n y=\"${position.y}\"\n font-family=\"${fontFamily}\"\n font-size=\"${actualFontSize}\"\n font-weight=\"${fontWeight}\"\n fill=\"${color}\"\n opacity=\"${opacity}\"\n text-anchor=\"middle\"\n dominant-baseline=\"middle\"\n >${text}</text>`;\n }\n }\n\n return logoSVG;\n }\n\n /**\n * 绘制网格\n */\n protected drawGrid(unit: BackgroundScaleUnit, viewBoxWidth: number, viewBoxHeight: number): void {\n const minor = unit.renderSize;\n if (!this.grid) {\n return;\n }\n const patternSize = this.dotSize * this.zoom;\n\n // 构建SVG内容，根据是否有背景颜色决定是否添加背景矩形\n let svgContent = `<svg width=\"100%\" height=\"100%\">`;\n\n // 如果设置了背景颜色，先绘制背景矩形\n if (this.backgroundColor !== 'transparent') {\n svgContent += `<rect width=\"100%\" height=\"100%\" fill=\"${this.backgroundColor}\"/>`;\n }\n\n // 添加点阵图案\n // 构建圆圈属性，保持与原始实现的兼容性\n const circleAttributes = [\n `cx=\"${patternSize}\"`,\n `cy=\"${patternSize}\"`,\n `r=\"${patternSize}\"`,\n `stroke=\"${this.dotColor}\"`,\n // 只有当 dotFillColor 被明确设置且与 dotColor 不同时才添加 fill 属性\n this.options.dotFillColor && this.dotFillColor !== this.dotColor\n ? `fill=\"${this.dotFillColor}\"`\n : '',\n `fill-opacity=\"${this.dotOpacity}\"`,\n ]\n .filter(Boolean)\n .join(' ');\n\n svgContent += `\n <pattern id=\"${this._patternId}\" width=\"${minor}\" height=\"${minor}\" patternUnits=\"userSpaceOnUse\">\n <circle ${circleAttributes} />\n </pattern>\n <rect width=\"100%\" height=\"100%\" fill=\"url(#${this._patternId})\"/>`;\n\n // 添加Logo\n const logoSVG = this.generateLogoSVG(viewBoxWidth, viewBoxHeight);\n if (logoSVG) {\n svgContent += logoSVG;\n }\n\n svgContent += `</svg>`;\n\n this.grid.innerHTML = svgContent;\n }\n\n protected setSVGStyle(\n svgElement: HTMLElement | undefined,\n style: { width: number; height: number; left: number; top: number }\n ): void {\n if (!svgElement) {\n return;\n }\n\n svgElement.style.width = `${style.width}px`;\n svgElement.style.height = `${style.height}px`;\n svgElement.style.left = `${style.left}px`;\n svgElement.style.top = `${style.top}px`;\n }\n\n /**\n * 获取相对滚动距离\n * @param realScroll\n * @param mod\n */\n protected getScrollDelta(realScroll: number, mod: number): number {\n // 正向滚动不用补差\n if (realScroll >= 0) {\n return realScroll % mod;\n }\n return mod - (Math.abs(realScroll) % mod);\n }\n}\n","/**\n * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates\n * SPDX-License-Identifier: MIT\n */\n\nimport { definePluginCreator } from '@flowgram.ai/core';\n\nimport { BackgroundConfig, BackgroundLayer, BackgroundLayerOptions } from './background-layer';\n\n/**\n * 点位背景插件\n */\nexport const createBackgroundPlugin = definePluginCreator<BackgroundLayerOptions>({\n onBind: (bindConfig, opts) => {\n bindConfig.bind(BackgroundConfig).toConstantValue(opts);\n },\n onInit: (ctx, opts) => {\n ctx.playground.registerLayer(BackgroundLayer, opts);\n },\n});\n"],"mappings":"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","names":["import_core"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flowgram.ai/background-plugin",
3
- "version": "0.2.16",
3
+ "version": "0.2.17",
4
4
  "homepage": "https://flowgram.ai/",
5
5
  "repository": "https://github.com/bytedance/flowgram.ai",
6
6
  "license": "MIT",
@@ -18,8 +18,8 @@
18
18
  "dependencies": {
19
19
  "inversify": "^6.0.1",
20
20
  "reflect-metadata": "~0.2.2",
21
- "@flowgram.ai/core": "0.2.16",
22
- "@flowgram.ai/utils": "0.2.16"
21
+ "@flowgram.ai/core": "0.2.17",
22
+ "@flowgram.ai/utils": "0.2.17"
23
23
  },
24
24
  "devDependencies": {
25
25
  "@types/react": "^18",
@@ -29,8 +29,8 @@
29
29
  "tsup": "^8.0.1",
30
30
  "typescript": "^5.0.4",
31
31
  "vitest": "^0.34.6",
32
- "@flowgram.ai/eslint-config": "0.2.16",
33
- "@flowgram.ai/ts-config": "0.2.16"
32
+ "@flowgram.ai/eslint-config": "0.2.17",
33
+ "@flowgram.ai/ts-config": "0.2.17"
34
34
  },
35
35
  "peerDependencies": {
36
36
  "react": ">=16.8",