foliko 1.1.7 → 1.1.9

package/.agent/plugins/poster-plugin/src/components/imageFrame.js

@@ -1,155 +0,0 @@
-/**
- * 图片框组件 - 带装饰边框的图片
- */
-const createImageFrame = (ctx) => ({
-  /**
-   * @param {Object} params
-   * @param {string} params.src - 图片路径或URL
-   * @param {number} params.x - X坐标
-   * @param {number} params.y - Y坐标
-   * @param {number} params.width - 图片宽度
-   * @param {number} params.height - 图片高度
-   * @param {string} [params.borderColor='#ffffff'] - 边框颜色
-   * @param {number} [params.borderWidth=3] - 边框宽度
-   * @param {string} [params.outerColor='#1a1a2e'] - 外边框颜色
-   * @param {number} [params.outerWidth=6] - 外边框宽度
-   * @param {number} [params.shadowBlur=0] - 阴影模糊
-   * @param {number} [params.shadowOffsetX=0] - 阴影X偏移
-   * @param {number} [params.shadowOffsetY=0] - 阴影Y偏移
-   * @param {string} [params.shadowColor='rgba(0,0,0,0.3)'] - 阴影颜色
-   * @param {number} [params.radius=0] - 圆角半径
-   * @param {string} [params.overlayColor] - 叠加颜色
-   * @param {number} [params.overlayOpacity=0] - 叠加透明度
-   * @param {string} [params.fit='cover'] - 图片填充方式: cover, contain, fill
-   */
-  async draw({
-    src,
-    x,
-    y,
-    width,
-    height,
-    borderColor = '#ffffff',
-    borderWidth = 3,
-    outerColor = '#1a1a2e',
-    outerWidth = 6,
-    shadowBlur = 0,
-    shadowOffsetX = 0,
-    shadowOffsetY = 0,
-    shadowColor = 'rgba(0,0,0,0.3)',
-    radius = 0,
-    overlayColor,
-    overlayOpacity = 0,
-    fit = 'cover'
-  }) {
-    // 绘制外边框（装饰层）
-    if (outerWidth > 0) {
-      ctx.fillStyle = outerColor
-      await _roundRect(ctx, x - outerWidth, y - outerWidth, width + outerWidth * 2, height + outerWidth * 2, radius + outerWidth)
-      ctx.fill()
-    }
-
-    // 绘制内边框
-    if (borderWidth > 0) {
-      ctx.fillStyle = borderColor
-      await _roundRect(ctx, x - borderWidth, y - borderWidth, width + borderWidth * 2, height + borderWidth * 2, radius + borderWidth)
-      ctx.fill()
-    }
-
-    // 绘制阴影
-    if (shadowBlur > 0) {
-      ctx.shadowColor = shadowColor
-      ctx.shadowBlur = shadowBlur
-      ctx.shadowOffsetX = shadowOffsetX
-      ctx.shadowOffsetY = shadowOffsetY
-    }
-
-    // 加载并绘制图片
-    const image = await _loadImage(src)
-    const imgWidth = image.width
-    const imgHeight = image.height
-    const imgRatio = imgWidth / imgHeight
-    const boxRatio = width / height
-
-    let drawX = x, drawY = y, drawW = width, drawH = height
-
-    if (fit === 'cover') {
-      if (imgRatio > boxRatio) {
-        drawH = height
-        drawW = height * imgRatio
-        drawX = x - (drawW - width) / 2
-      } else {
-        drawW = width
-        drawH = width / imgRatio
-        drawY = y - (drawH - height) / 2
-      }
-    } else if (fit === 'contain') {
-      if (imgRatio > boxRatio) {
-        drawW = width
-        drawH = width / imgRatio
-        drawY = y + (height - drawH) / 2
-      } else {
-        drawH = height
-        drawW = height * imgRatio
-        drawX = x + (width - drawW) / 2
-      }
-    }
-
-    // 裁剪并绘制图片
-    ctx.save()
-    await _roundRect(ctx, x, y, width, height, radius)
-    ctx.clip()
-    ctx.drawImage(image, drawX, drawY, drawW, drawH)
-    ctx.restore()
-
-    // 重置阴影
-    ctx.shadowColor = 'transparent'
-    ctx.shadowBlur = 0
-    ctx.shadowOffsetX = 0
-    ctx.shadowOffsetY = 0
-
-    // 叠加颜色
-    if (overlayColor && overlayOpacity > 0) {
-      ctx.fillStyle = overlayColor
-      ctx.globalAlpha = overlayOpacity
-      await _roundRect(ctx, x, y, width, height, radius)
-      ctx.fill()
-      ctx.globalAlpha = 1
-    }
-  }
-})
-
-// 辅助函数：圆角矩形
-async function _roundRect(ctx, x, y, width, height, radius) {
-  const r = Math.min(radius, width / 2, height / 2)
-  ctx.beginPath()
-  ctx.moveTo(x + r, y)
-  ctx.lineTo(x + width - r, y)
-  ctx.quadraticCurveTo(x + width, y, x + width, y + r)
-  ctx.lineTo(x + width, y + height - r)
-  ctx.quadraticCurveTo(x + width, y + height, x + width - r, y + height)
-  ctx.lineTo(x + r, y + height)
-  ctx.quadraticCurveTo(x, y + height, x, y + height - r)
-  ctx.lineTo(x, y + r)
-  ctx.quadraticCurveTo(x, y, x + r, y)
-  ctx.closePath()
-}
-
-// 辅助函数：加载图片
-async function _loadImage(src) {
-  return new Promise((resolve, reject) => {
-    const img = new Image()
-    img.crossOrigin = 'anonymous'
-    img.onload = () => resolve(img)
-    img.onerror = (e) => {
-      // 尝试 data URL 格式
-      if (src.startsWith('data:')) {
-        img.src = src
-      } else {
-        reject(new Error(`Failed to load image: ${src}`))
-      }
-    }
-    img.src = src
-  })
-}
-
-module.exports = createImageFrame

package/.agent/plugins/poster-plugin/src/components/index.js

@@ -1,81 +0,0 @@
-/**
- * 高级组件模块导出
- */
-
-const createCard = require('./card')
-const createBadge = require('./badge')
-const createCTA = require('./cta')
-const createFeature = require('./feature')
-const createFeatureGrid = require('./featureGrid')
-const createDivider = require('./divider')
-const createAvatar = require('./avatar')
-const createProgress = require('./progress')
-const createRating = require('./rating')
-const createQuote = require('./quote')
-const createStatCard = require('./statCard')
-const createTagCloud = require('./tagCloud')
-const createStepper = require('./stepper')
-const createTimeline = require('./timeline')
-const { createListItem, createList } = require('./listItem')
-const createNotification = require('./notification')
-const createImageFrame = require('./imageFrame')
-const createColumns = require('./columns')
-const createGrid = require('./grid')
-const createStar = require('./star')
-const createArrow = require('./arrow')
-const createProgressCircle = require('./progressCircle')
-const createChip = require('./chip')
-const createChart = require('./chart')
-const createWatermark = require('./watermark')
-const createTable = require('./table')
-const createButton = require('./button')
-const createIcon = require('./icon')
-const createQRCode = require('./qrcode')
-const createFrame = require('./frame')
-const createBubble = require('./bubble')
-const createRibbon = require('./ribbon')
-const createSeal = require('./seal')
-const createHighlightText = require('./highlightText')
-const createBarcode = require('./barcode')
-
-module.exports = {
-  // 原有组件
-  createCard,
-  createBadge,
-  createCTA,
-  createFeature,
-  createFeatureGrid,
-  createDivider,
-  createAvatar,
-  createProgress,
-  createRating,
-  createQuote,
-  createStatCard,
-  createTagCloud,
-  createStepper,
-  createTimeline,
-  createListItem,
-  createList,
-  createNotification,
-  createImageFrame,
-  createColumns,
-  createGrid,
-  // 新增组件
-  createStar,
-  createArrow,
-  createProgressCircle,
-  createChip,
-  createChart,
-  createWatermark,
-  createTable,
-  // 新增设计组件
-  createButton,
-  createIcon,
-  createQRCode,
-  createFrame,
-  createBubble,
-  createRibbon,
-  createSeal,
-  createHighlightText,
-  createBarcode,
-}

package/.agent/plugins/poster-plugin/src/components/listItem.js

@@ -1,147 +0,0 @@
-/**
- * 列表项组件
- */
-
-const paper = require('paper')
-
-/**
- * 创建列表项
- * 
- * @param {Object} project - Paper.js 项目
- * @param {Object} canvas - 画布对象
- * @param {Object} args - 组件参数
- * @param {number} args.x - X坐标
- * @param {number} args.y - Y坐标
- * @param {number} args.width - 宽度
- * @param {string} args.icon - 图标
- * @param {string} args.title - 标题
- * @param {string} args.description - 描述
- * @param {string} args.badge - 徽章文字
- * @param {string} args.badgeColor - 徽章颜色
- * @param {string} args.iconColor - 图标颜色
- * @param {string} args.background - 背景色
- * @param {string} args.borderColor - 边框颜色
- * @param {number} args.height - 高度
- * @param {number} args.radius - 圆角半径
- */
-function createListItem(project, canvas, args) {
-  const {
-    x = 0,
-    y = 0,
-    width = 400,
-    icon = '→',
-    title,
-    description,
-    badge,
-    badgeColor = '#6366f1',
-    iconColor = '#6366f1',
-    background = '#ffffff',
-    borderColor = '#e5e7eb',
-    height = 60,
-    radius = 8,
-  } = args
-
-  const elements = []
-
-  // 绘制背景
-  const bg = new paper.Path.Rectangle({
-    point: [x, y],
-    size: [width, height],
-    radius: radius,
-  })
-  bg.fillColor = new paper.Color(background)
-  bg.strokeColor = new paper.Color(borderColor)
-  bg.strokeWidth = 1
-  elements.push({ type: 'rectangle', id: bg.id })
-
-  // 绘制图标
-  const iconText = new paper.PointText({
-    point: [x + 15, y + height / 2 + 6],
-    content: icon,
-    fontSize: 20,
-    fillColor: new paper.Color(iconColor),
-    justification: 'center',
-  })
-  elements.push({ type: 'text', id: iconText.id })
-
-  // 绘制标题
-  const titleText = new paper.PointText({
-    point: [x + 50, y + height / 2 - 5],
-    content: title || 'List Item',
-    fontSize: 16,
-    fillColor: new paper.Color('#1e293b'),
-    justification: 'left',
-  })
-  elements.push({ type: 'text', id: titleText.id })
-
-  // 绘制描述
-  if (description) {
-    const descText = new paper.PointText({
-      point: [x + 50, y + height / 2 + 15],
-      content: description,
-      fontSize: 12,
-      fillColor: new paper.Color('#64748b'),
-      justification: 'left',
-    })
-    elements.push({ type: 'text', id: descText.id })
-  }
-
-  // 绘制徽章
-  if (badge) {
-    const badgeWidth = badge.length * 10 + 20
-    const badgeX = x + width - badgeWidth - 15
-    const badgeY = y + (height - 24) / 2
-
-    const badgeBg = new paper.Path.Rectangle({
-      point: [badgeX, badgeY],
-      size: [badgeWidth, 24],
-      radius: 12,
-    })
-    badgeBg.fillColor = new paper.Color(badgeColor)
-    elements.push({ type: 'rectangle', id: badgeBg.id })
-
-    const badgeText = new paper.PointText({
-      point: [badgeX + badgeWidth / 2, badgeY + 16],
-      content: badge,
-      fontSize: 12,
-      fillColor: new paper.Color('#ffffff'),
-      justification: 'center',
-    })
-    elements.push({ type: 'text', id: badgeText.id })
-  }
-
-  return { success: true, elements, type: 'listItem' }
-}
-
-/**
- * 创建列表（多个列表项）
- */
-function createList(project, canvas, args) {
-  const {
-    x = 0, y = 0,
-    items = [],
-    gap = 10,
-    width = 400,
-    ...rest
-  } = args
-
-  const elements = []
-  let currentY = y
-
-  for (const item of items) {
-    const result = createListItem(project, canvas, {
-      x, y: currentY, width, ...item, ...rest,
-    })
-    elements.push(...result.elements)
-    currentY += 60 + gap
-  }
-
-  return {
-    success: true,
-    elements,
-    height: currentY - y,
-    type: 'list',
-  }
-}
-
-module.exports = { createListItem, createList }

package/.agent/plugins/poster-plugin/src/components/notification.js

@@ -1,123 +0,0 @@
-/**
- * 通知/提示组件
- */
-
-const paper = require('paper')
-
-/**
- * 创建通知提示
- * 
- * @param {Object} project - Paper.js 项目
- * @param {Object} canvas - 画布对象
- * @param {Object} args - 组件参数
- * @param {number} args.x - X坐标
- * @param {number} args.y - Y坐标
- * @param {number} args.width - 宽度
- * @param {string} args.type - 类型: success, warning, error, info
- * @param {string} args.title - 标题
- * @param {string} args.message - 消息内容
- * @param {boolean} args.showIcon - 是否显示图标
- * @param {number} args.radius - 圆角半径
- */
-function createNotification(project, canvas, args) {
-  const {
-    x, y,
-    width = 360,
-    type = 'info',
-    title,
-    message,
-    showIcon = true,
-    radius = 12,
-  } = args
-
-  // 类型配置
-  const config = {
-    success: {
-      icon: '✓',
-      bgColor: '#dcfce7',
-      iconColor: '#22c55e',
-      borderColor: '#22c55e',
-    },
-    warning: {
-      icon: '⚠',
-      bgColor: '#fef9c3',
-      iconColor: '#eab308',
-      borderColor: '#eab308',
-    },
-    error: {
-      icon: '✕',
-      bgColor: '#fee2e2',
-      iconColor: '#ef4444',
-      borderColor: '#ef4444',
-    },
-    info: {
-      icon: 'ℹ',
-      bgColor: '#dbeafe',
-      iconColor: '#3b82f6',
-      borderColor: '#3b82f6',
-    },
-  }
-
-  const c = config[type] || config.info
-  const padding = 16
-  const lineHeight = 22
-  const iconSize = 24
-  const height = padding * 2 + (title ? lineHeight + 8 : 0) + (message ? lineHeight : 0)
-
-  const elements = []
-
-  // 绘制背景
-  const bg = new paper.Path.Rectangle({
-    point: [x, y],
-    size: [width, height],
-    radius: radius,
-  })
-  bg.fillColor = new paper.Color(c.bgColor)
-  bg.strokeColor = new paper.Color(c.borderColor)
-  bg.strokeWidth = 1
-  elements.push({ type: 'rectangle', id: bg.id })
-
-  // 绘制图标
-  if (showIcon) {
-    const iconText = new paper.PointText({
-      point: [x + padding + iconSize / 2, y + padding + iconSize / 2 + 6],
-      content: c.icon,
-      fontSize: iconSize,
-      fillColor: new paper.Color(c.iconColor),
-      justification: 'center',
-    })
-    elements.push({ type: 'text', id: iconText.id })
-  }
-
-  const textX = showIcon ? x + padding + iconSize + 12 : x + padding
-  let currentY = y + padding
-
-  // 绘制标题
-  if (title) {
-    const titleText = new paper.PointText({
-      point: [textX, currentY + 18],
-      content: title,
-      fontSize: 16,
-      fillColor: new paper.Color('#1e293b'),
-      justification: 'left',
-    })
-    elements.push({ type: 'text', id: titleText.id })
-    currentY += lineHeight + 8
-  }
-
-  // 绘制消息
-  if (message) {
-    const msgText = new paper.PointText({
-      point: [textX, currentY + 16],
-      content: message,
-      fontSize: 14,
-      fillColor: new paper.Color('#475569'),
-      justification: 'left',
-    })
-    elements.push({ type: 'text', id: msgText.id })
-  }
-
-  return { success: true, elements }
-}
-
-module.exports = createNotification

package/.agent/plugins/poster-plugin/src/components/progress.js

@@ -1,79 +0,0 @@
-/**
- * 进度条组件
- */
-
-const paper = require('paper')
-
-/**
- * 创建进度条
- * 
- * @param {Object} project - Paper.js 项目
- * @param {Object} canvas - 画布对象
- * @param {Object} args - 组件参数
- * @param {number} args.x - X坐标
- * @param {number} args.y - Y坐标
- * @param {number} args.width - 进度条宽度
- * @param {number} args.height - 进度条高度
- * @param {number} args.value - 进度值 0-100
- * @param {string} args.trackColor - 轨道颜色
- * @param {string} args.fillColor - 填充颜色
- * @param {number} args.radius - 圆角半径
- * @param {boolean} args.showLabel - 是否显示标签
- * @param {string} args.label - 标签文字
- */
-function createProgress(project, canvas, args) {
-  const {
-    x, y,
-    width = 300,
-    height = 20,
-    value = 50,
-    trackColor = '#e0e0e0',
-    fillColor = '#6366f1',
-    radius = 10,
-    showLabel = false,
-    label,
-  } = args
-
-  const elements = []
-
-  // 绘制轨道
-  const track = new paper.Path.Rectangle({
-    point: [x, y],
-    size: [width, height],
-    radius: radius,
-  })
-  track.fillColor = new paper.Color(trackColor)
-  elements.push({ type: 'rectangle', id: track.id })
-
-  // 绘制进度
-  const progressWidth = (value / 100) * width
-  if (progressWidth > 0) {
-    const fill = new paper.Path.Rectangle({
-      point: [x, y],
-      size: [progressWidth, height],
-      radius: radius,
-    })
-    fill.fillColor = new paper.Color(fillColor)
-    elements.push({ type: 'rectangle', id: fill.id })
-  }
-
-  // 显示标签
-  if (showLabel && label) {
-    const labelText = new paper.PointText({
-      point: [x + width / 2, y - 8],
-      content: label,
-      fontSize: 14,
-      fillColor: new paper.Color('#666666'),
-      justification: 'center',
-    })
-    elements.push({ type: 'text', id: labelText.id })
-  }
-
-  return {
-    success: true,
-    elements,
-    value,
-  }
-}
-
-module.exports = createProgress

package/.agent/plugins/poster-plugin/src/components/progressCircle.js

@@ -1,117 +0,0 @@
-/**
- * 环形进度条组件
- */
-
-const paper = require('paper')
-
-/**
- * 创建环形进度条组件
- */
-function createProgressCircle(project, canvas, params) {
-  const {
-    cx,
-    cy,
-    radius,
-    value,
-    strokeWidth = 10,
-    trackColor = '#e5e7eb',
-    fillColor = '#3b82f6',
-    backgroundColor,
-    showLabel = true,
-    labelColor,
-    startAngle = -90
-  } = params
-
-  const elements = []
-
-  // 绘制背景圆（可选）
-  if (backgroundColor) {
-    const bgCircle = new paper.Path.Circle({
-      center: [cx, cy],
-      radius: radius + strokeWidth / 2
-    })
-    bgCircle.fillColor = new paper.Color(backgroundColor)
-    if (project && project.activeLayer) {
-      project.activeLayer.addChild(bgCircle)
-    }
-    elements.push({ type: 'path', id: bgCircle.id })
-  }
-
-  // 绘制轨道（背景环）
-  const trackCircle = new paper.Path.Circle({
-    center: [cx, cy],
-    radius: radius
-  })
-  trackCircle.fillColor = null
-  trackCircle.strokeColor = new paper.Color(trackColor)
-  trackCircle.strokeWidth = strokeWidth
-  if (project && project.activeLayer) {
-    project.activeLayer.addChild(trackCircle)
-  }
-  elements.push({ type: 'path', id: trackCircle.id })
-
-  // 绘制进度弧线
-  if (value > 0 && value <= 100) {
-    const percentage = value / 100
-    const arcAngle = percentage * 360
-    
-    // 转换为弧度
-    const startRad = startAngle * Math.PI / 180
-    const endRad = (startAngle + arcAngle) * Math.PI / 180
-
-    // 创建进度弧线路径
-    const progressArc = new paper.Path()
-    
-    // 添加起点
-    progressArc.moveTo(
-      cx + radius * Math.cos(startRad),
-      cy + radius * Math.sin(startRad)
-    )
-    
-    // 添加弧线上的点（用多个点模拟圆弧）
-    const segments = 36
-    const angleStep = (endRad - startRad) / segments
-    for (let i = 1; i <= segments; i++) {
-      const angle = startRad + angleStep * i
-      progressArc.lineTo(
-        cx + radius * Math.cos(angle),
-        cy + radius * Math.sin(angle)
-      )
-    }
-
-    progressArc.strokeColor = new paper.Color(fillColor)
-    progressArc.strokeWidth = strokeWidth
-    progressArc.strokeCap = 'round'
-
-    if (project && project.activeLayer) {
-      project.activeLayer.addChild(progressArc)
-    }
-    elements.push({ type: 'path', id: progressArc.id })
-  }
-
-  // 绘制标签文字
-  if (showLabel) {
-    const textColor = labelColor || fillColor
-    const fontSize = Math.min(Math.max(Math.round(radius * 0.35), 12), 48)
-    const label = new paper.PointText({
-      point: [cx, cy + fontSize * 0.35],
-      content: `${Math.round(value)}%`,
-      fontSize: fontSize,
-      fillColor: new paper.Color(textColor),
-      justification: 'center',
-      fontWeight: 'bold'
-    })
-    if (project && project.activeLayer) {
-      project.activeLayer.addChild(label)
-    }
-    elements.push({ type: 'text', id: label.id })
-  }
-
-  return {
-    success: true,
-    elements,
-    type: 'progressCircle'
-  }
-}
-
-module.exports = createProgressCircle