@easy-editor/materials-dashboard-scroll-list 0.0.4 → 0.0.5

package/CHANGELOG.md

@@ -1,21 +1,27 @@
-# @easy-editor/materials-dashboard-scroll-list
-
-## 0.0.4
-
-### Patch Changes
-
-- perf: configure & datasource
-- Updated dependencies
-  - @easy-editor/materials-shared@0.0.1
-
-## 0.0.3
-
-### Patch Changes
-
-- fix: build error
-
-## 0.0.2
-
-### Patch Changes
-
-- feat: new setters
+# @easy-editor/materials-dashboard-scroll-list
+
+## 0.0.5
+
+### Patch Changes
+
+- fix: component export error
+
+## 0.0.4
+
+### Patch Changes
+
+- perf: configure & datasource
+- Updated dependencies
+  - @easy-editor/materials-shared@0.0.1
+
+## 0.0.3
+
+### Patch Changes
+
+- fix: build error
+
+## 0.0.2
+
+### Patch Changes
+
+- feat: new setters

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@easy-editor/materials-dashboard-scroll-list",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "Scroll List component for EasyEditor dashboard",
   "type": "module",
   "main": "dist/index.js",

package/src/component.tsx

@@ -1,219 +1,221 @@
-/**
- * Scroll List Component
- * 滚动列表组件 - 支持数据源绑定和事件交互
- */
-
-import { useMemo, type CSSProperties } from 'react'
-import { cn, useDataSource, type MaterialComponet } from '@easy-editor/materials-shared'
-import styles from './component.module.css'
-
-export interface ScrollListItem {
-  rank: number
-  name: string
-  value: number
-}
-
-export interface ScrollListProps extends MaterialComponet {
-  /** 最大显示条数 */
-  maxItems?: number
-  /** 是否显示排名 */
-  showRank?: boolean
-  /** 是否显示奖牌图标 */
-  showMedal?: boolean
-  /** 是否显示进度条 */
-  progressBarEnable?: boolean
-  /** 是否使用渐变进度条 */
-  progressBarGradient?: boolean
-  /** 进度条颜色 [起始色, 结束色] */
-  progressBarColors?: [string, string]
-  /** 数值格式化 */
-  valueFormat?: 'number' | 'currency' | 'percent'
-  /** 数值前缀 */
-  valuePrefix?: string
-  /** 数值后缀 */
-  valueSuffix?: string
-  /** 名称颜色 */
-  nameColor?: string
-  /** 数值颜色 */
-  valueColor?: string
-  /** 背景颜色 */
-  backgroundColor?: string
-  /** 边框颜色 */
-  borderColor?: string
-  /** 行背景颜色 */
-  itemBackgroundColor?: string
-  /** 行边框颜色 */
-  itemBorderColor?: string
-  /** 是否显示发光效果 */
-  glowEnable?: boolean
-  /** 点击事件 */
-  onClick?: (e: React.MouseEvent) => void
-  /** 双击事件 */
-  onDoubleClick?: (e: React.MouseEvent) => void
-  /** 鼠标进入 */
-  onMouseEnter?: (e: React.MouseEvent) => void
-  /** 鼠标离开 */
-  onMouseLeave?: (e: React.MouseEvent) => void
-  /** 行点击事件 */
-  onItemClick?: (item: ScrollListItem, index: number) => void
-}
-
-const DEFAULT_DATA: ScrollListItem[] = [
-  { rank: 1, name: '北京市', value: 9800 },
-  { rank: 2, name: '上海市', value: 8500 },
-  { rank: 3, name: '广州市', value: 7200 },
-  { rank: 4, name: '深圳市', value: 6100 },
-  { rank: 5, name: '杭州市', value: 4800 },
-]
-
-const MEDAL_EMOJI: Record<number, string> = {
-  1: '🥇',
-  2: '🥈',
-  3: '🥉',
-}
-
-const getRankClass = (rank: number): string => {
-  if (rank === 1) {
-    return styles.rankGold
-  }
-  if (rank === 2) {
-    return styles.rankSilver
-  }
-  if (rank === 3) {
-    return styles.rankBronze
-  }
-  return ''
-}
-
-const formatDisplayValue = (value: number, format: string, prefix: string, suffix: string): string => {
-  let formatted: string
-  switch (format) {
-    case 'currency':
-      formatted = value.toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })
-      break
-    case 'percent':
-      formatted = `${value}%`
-      break
-    default:
-      formatted = value.toLocaleString()
-  }
-  return `${prefix}${formatted}${suffix}`
-}
-
-export const ScrollList: React.FC<ScrollListProps> = ({
-  ref,
-  $data,
-  __dataSource,
-  maxItems = 5,
-  showRank = true,
-  showMedal = true,
-  progressBarEnable = true,
-  progressBarGradient = true,
-  progressBarColors = ['#00d4ff', '#9b59b6'],
-  valueFormat = 'number',
-  valuePrefix = '',
-  valueSuffix = '',
-  nameColor = '#e6e6e6',
-  valueColor = '#00d4ff',
-  backgroundColor = 'rgba(10, 10, 26, 0.95)',
-  borderColor = 'rgba(26, 26, 62, 0.8)',
-  itemBackgroundColor = 'rgba(15, 15, 42, 0.9)',
-  itemBorderColor = 'rgba(26, 26, 62, 0.6)',
-  glowEnable = false,
-  rotation = 0,
-  opacity = 100,
-  style: externalStyle,
-  onClick,
-  onDoubleClick,
-  onMouseEnter,
-  onMouseLeave,
-  onItemClick,
-}) => {
-  // 解析数据源
-  const dataSource = useDataSource($data, __dataSource)
-  const data = useMemo<ScrollListItem[]>(() => {
-    if (dataSource.length > 0) {
-      return dataSource as ScrollListItem[]
-    }
-    return DEFAULT_DATA
-  }, [dataSource])
-
-  const displayData = data.slice(0, maxItems)
-  const maxValue = Math.max(...displayData.map(item => item.value), 1)
-
-  const getProgressBarStyle = (value: number): CSSProperties => {
-    const percentage = (value / maxValue) * 100
-    return {
-      width: `${percentage}%`,
-      background: progressBarGradient
-        ? `linear-gradient(90deg, ${progressBarColors[0]}, ${progressBarColors[1]})`
-        : progressBarColors[0],
-      boxShadow: glowEnable ? `0 0 8px ${progressBarColors[0]}60` : undefined,
-    }
-  }
-
-  const containerStyle: CSSProperties = {
-    transform: rotation !== 0 ? `rotate(${rotation}deg)` : undefined,
-    opacity: opacity / 100,
-    backgroundColor,
-    borderColor,
-    ...externalStyle,
-  }
-
-  const itemStyle: CSSProperties = {
-    backgroundColor: itemBackgroundColor,
-    borderColor: itemBorderColor,
-  }
-
-  return (
-    <div
-      className={styles.container}
-      onClick={onClick}
-      onDoubleClick={onDoubleClick}
-      onMouseEnter={onMouseEnter}
-      onMouseLeave={onMouseLeave}
-      ref={ref}
-      style={containerStyle}
-    >
-      <div className={styles.list}>
-        {displayData.map((item, index) => {
-          const isTopThree = item.rank <= 3
-
-          return (
-            <div className={styles.item} key={item.rank} onClick={() => onItemClick?.(item, index)} style={itemStyle}>
-              {/* Rank Badge */}
-              {showRank ? (
-                <div
-                  className={cn(
-                    styles.rankBadge,
-                    isTopThree ? styles.rankBadgeTopThree : styles.rankBadgeNormal,
-                    getRankClass(item.rank),
-                  )}
-                >
-                  {showMedal && isTopThree ? MEDAL_EMOJI[item.rank] : item.rank}
-                </div>
-              ) : null}
-
-              {/* Name */}
-              <div className={styles.name} style={{ color: nameColor }}>
-                {item.name}
-              </div>
-
-              {/* Value and Progress */}
-              <div className={styles.valueContainer}>
-                <span className={styles.value} style={{ color: valueColor }}>
-                  {formatDisplayValue(item.value, valueFormat, valuePrefix, valueSuffix)}
-                </span>
-                {progressBarEnable ? (
-                  <div className={styles.progressBar}>
-                    <div className={styles.progressFill} style={getProgressBarStyle(item.value)} />
-                  </div>
-                ) : null}
-              </div>
-            </div>
-          )
-        })}
-      </div>
-    </div>
-  )
-}
+/**
+ * Scroll List Component
+ * 滚动列表组件 - 支持数据源绑定和事件交互
+ */
+
+import { useMemo, type CSSProperties } from 'react'
+import { cn, useDataSource, type MaterialComponet } from '@easy-editor/materials-shared'
+import styles from './component.module.css'
+
+export interface ScrollListItem {
+  rank: number
+  name: string
+  value: number
+}
+
+export interface ScrollListProps extends MaterialComponet {
+  /** 最大显示条数 */
+  maxItems?: number
+  /** 是否显示排名 */
+  showRank?: boolean
+  /** 是否显示奖牌图标 */
+  showMedal?: boolean
+  /** 是否显示进度条 */
+  progressBarEnable?: boolean
+  /** 是否使用渐变进度条 */
+  progressBarGradient?: boolean
+  /** 进度条颜色 [起始色, 结束色] */
+  progressBarColors?: [string, string]
+  /** 数值格式化 */
+  valueFormat?: 'number' | 'currency' | 'percent'
+  /** 数值前缀 */
+  valuePrefix?: string
+  /** 数值后缀 */
+  valueSuffix?: string
+  /** 名称颜色 */
+  nameColor?: string
+  /** 数值颜色 */
+  valueColor?: string
+  /** 背景颜色 */
+  backgroundColor?: string
+  /** 边框颜色 */
+  borderColor?: string
+  /** 行背景颜色 */
+  itemBackgroundColor?: string
+  /** 行边框颜色 */
+  itemBorderColor?: string
+  /** 是否显示发光效果 */
+  glowEnable?: boolean
+  /** 点击事件 */
+  onClick?: (e: React.MouseEvent) => void
+  /** 双击事件 */
+  onDoubleClick?: (e: React.MouseEvent) => void
+  /** 鼠标进入 */
+  onMouseEnter?: (e: React.MouseEvent) => void
+  /** 鼠标离开 */
+  onMouseLeave?: (e: React.MouseEvent) => void
+  /** 行点击事件 */
+  onItemClick?: (item: ScrollListItem, index: number) => void
+}
+
+const DEFAULT_DATA: ScrollListItem[] = [
+  { rank: 1, name: '北京市', value: 9800 },
+  { rank: 2, name: '上海市', value: 8500 },
+  { rank: 3, name: '广州市', value: 7200 },
+  { rank: 4, name: '深圳市', value: 6100 },
+  { rank: 5, name: '杭州市', value: 4800 },
+]
+
+const MEDAL_EMOJI: Record<number, string> = {
+  1: '🥇',
+  2: '🥈',
+  3: '🥉',
+}
+
+const getRankClass = (rank: number): string => {
+  if (rank === 1) {
+    return styles.rankGold
+  }
+  if (rank === 2) {
+    return styles.rankSilver
+  }
+  if (rank === 3) {
+    return styles.rankBronze
+  }
+  return ''
+}
+
+const formatDisplayValue = (value: number, format: string, prefix: string, suffix: string): string => {
+  let formatted: string
+  switch (format) {
+    case 'currency':
+      formatted = value.toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })
+      break
+    case 'percent':
+      formatted = `${value}%`
+      break
+    default:
+      formatted = value.toLocaleString()
+  }
+  return `${prefix}${formatted}${suffix}`
+}
+
+export const ScrollList: React.FC<ScrollListProps> = ({
+  ref,
+  $data,
+  __dataSource,
+  maxItems = 5,
+  showRank = true,
+  showMedal = true,
+  progressBarEnable = true,
+  progressBarGradient = true,
+  progressBarColors = ['#00d4ff', '#9b59b6'],
+  valueFormat = 'number',
+  valuePrefix = '',
+  valueSuffix = '',
+  nameColor = '#e6e6e6',
+  valueColor = '#00d4ff',
+  backgroundColor = 'rgba(10, 10, 26, 0.95)',
+  borderColor = 'rgba(26, 26, 62, 0.8)',
+  itemBackgroundColor = 'rgba(15, 15, 42, 0.9)',
+  itemBorderColor = 'rgba(26, 26, 62, 0.6)',
+  glowEnable = false,
+  rotation = 0,
+  opacity = 100,
+  style: externalStyle,
+  onClick,
+  onDoubleClick,
+  onMouseEnter,
+  onMouseLeave,
+  onItemClick,
+}) => {
+  // 解析数据源
+  const dataSource = useDataSource($data, __dataSource)
+  const data = useMemo<ScrollListItem[]>(() => {
+    if (dataSource.length > 0) {
+      return dataSource as ScrollListItem[]
+    }
+    return DEFAULT_DATA
+  }, [dataSource])
+
+  const displayData = data.slice(0, maxItems)
+  const maxValue = Math.max(...displayData.map(item => item.value), 1)
+
+  const getProgressBarStyle = (value: number): CSSProperties => {
+    const percentage = (value / maxValue) * 100
+    return {
+      width: `${percentage}%`,
+      background: progressBarGradient
+        ? `linear-gradient(90deg, ${progressBarColors[0]}, ${progressBarColors[1]})`
+        : progressBarColors[0],
+      boxShadow: glowEnable ? `0 0 8px ${progressBarColors[0]}60` : undefined,
+    }
+  }
+
+  const containerStyle: CSSProperties = {
+    transform: rotation !== 0 ? `rotate(${rotation}deg)` : undefined,
+    opacity: opacity / 100,
+    backgroundColor,
+    borderColor,
+    ...externalStyle,
+  }
+
+  const itemStyle: CSSProperties = {
+    backgroundColor: itemBackgroundColor,
+    borderColor: itemBorderColor,
+  }
+
+  return (
+    <div
+      className={styles.container}
+      onClick={onClick}
+      onDoubleClick={onDoubleClick}
+      onMouseEnter={onMouseEnter}
+      onMouseLeave={onMouseLeave}
+      ref={ref}
+      style={containerStyle}
+    >
+      <div className={styles.list}>
+        {displayData.map((item, index) => {
+          const isTopThree = item.rank <= 3
+
+          return (
+            <div className={styles.item} key={item.rank} onClick={() => onItemClick?.(item, index)} style={itemStyle}>
+              {/* Rank Badge */}
+              {showRank ? (
+                <div
+                  className={cn(
+                    styles.rankBadge,
+                    isTopThree ? styles.rankBadgeTopThree : styles.rankBadgeNormal,
+                    getRankClass(item.rank),
+                  )}
+                >
+                  {showMedal && isTopThree ? MEDAL_EMOJI[item.rank] : item.rank}
+                </div>
+              ) : null}
+
+              {/* Name */}
+              <div className={styles.name} style={{ color: nameColor }}>
+                {item.name}
+              </div>
+
+              {/* Value and Progress */}
+              <div className={styles.valueContainer}>
+                <span className={styles.value} style={{ color: valueColor }}>
+                  {formatDisplayValue(item.value, valueFormat, valuePrefix, valueSuffix)}
+                </span>
+                {progressBarEnable ? (
+                  <div className={styles.progressBar}>
+                    <div className={styles.progressFill} style={getProgressBarStyle(item.value)} />
+                  </div>
+                ) : null}
+              </div>
+            </div>
+          )
+        })}
+      </div>
+    </div>
+  )
+}
+
+export default ScrollList

package/src/meta.ts

@@ -1,26 +1,28 @@
-/**
- * Scroll List Meta
- * 滚动列表组件元数据
- */
-
-import type { ComponentMetadata } from '@easy-editor/core'
-import { MaterialGroup } from '@easy-editor/materials-shared'
-import { COMPONENT_NAME, PACKAGE_NAME } from './constants'
-import { configure } from './configure'
-import { snippets } from './snippets'
-import pkg from '../package.json'
-
-export const meta: ComponentMetadata = {
-  componentName: COMPONENT_NAME,
-  title: '滚动列表',
-  group: MaterialGroup.DISPLAY,
-  devMode: 'proCode',
-  npm: {
-    package: PACKAGE_NAME,
-    version: pkg.version,
-    globalName: COMPONENT_NAME,
-    componentName: COMPONENT_NAME,
-  },
-  snippets,
-  configure,
-}
+/**
+ * Scroll List Meta
+ * 滚动列表组件元数据
+ */
+
+import type { ComponentMetadata } from '@easy-editor/core'
+import { MaterialGroup } from '@easy-editor/materials-shared'
+import { COMPONENT_NAME, PACKAGE_NAME } from './constants'
+import { configure } from './configure'
+import { snippets } from './snippets'
+import pkg from '../package.json'
+
+export const meta: ComponentMetadata = {
+  componentName: COMPONENT_NAME,
+  title: '滚动列表',
+  group: MaterialGroup.DISPLAY,
+  devMode: 'proCode',
+  npm: {
+    package: PACKAGE_NAME,
+    version: pkg.version,
+    globalName: COMPONENT_NAME,
+    componentName: COMPONENT_NAME,
+  },
+  snippets,
+  configure,
+}
+
+export default meta

package/dist/component.min.js

@@ -1 +0,0 @@
-!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("react"),require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react","react/jsx-runtime"],o):o((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsScrollListComponent={},e.React,e.jsxRuntime)}(this,function(e,o,t){"use strict";function r(...e){const o=[];for(const t of e)if(t)if("string"==typeof t||"number"==typeof t)o.push(String(t));else if(Array.isArray(t)){const e=r(...t);e&&o.push(e)}else if("object"==typeof t)for(const[e,r]of Object.entries(t))r&&o.push(e);return o.join(" ")}const n=(e,o)=>{if(!o)return e;const t=o.split(".");let r=e;for(const e of t){if(null==r)return;if("object"!=typeof r)return;r=r[e]}return r},a=e=>void 0===e?[]:Array.isArray(e)?e:e&&"object"==typeof e?[e]:[],l=(e,o)=>{const t=((e,o)=>{if(!e)return[];if("static"===e.sourceType)return Array.isArray(e.staticData)?e.staticData:[];if("global"===e.sourceType&&e.datasourceId){const t=o?.page?.[e.datasourceId];return a(t)}if("datasource"===e.sourceType&&e.datasourceId){const t=o?.component?.[e.datasourceId];return a(t)}return[]})(e,o);return((e,o)=>o&&0!==o.length?e.map(e=>{const t={};for(const{componentField:r,sourceField:a}of o)r&&a&&(t[r]=n(e,a));return t}):e)(t,e?.fieldMappings)};const i=(e,o,t)=>({type:"group",title:e,setter:{componentName:"CollapseSetter",props:{icon:!1,...t}},items:o});i("基础配置",[{name:"title",title:"标题",setter:"StringSetter",extraProps:{getValue:e=>e.getExtraPropValue("title"),setValue(e,o){e.setExtraPropValue("title",o)}}},{name:"rect",title:"位置尺寸",setter:"RectSetter",extraProps:{getValue:e=>e.getExtraPropValue("$dashboard.rect"),setValue(e,o){e.setExtraPropValue("$dashboard.rect",o)}}},{name:"rotation",title:"旋转角度",setter:{componentName:"SliderSetter",props:{min:0,max:360,suffix:"°"}},extraProps:{defaultValue:0}},{name:"opacity",title:"不透明度",setter:{componentName:"SliderSetter",props:{min:0,max:100,suffix:"%"}},extraProps:{defaultValue:100}},{name:"background",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"transparent"}}]);const s=[{title:"点击事件",children:[{label:"点击",value:"onClick",description:"鼠标点击时触发"},{label:"双击",value:"onDoubleClick",description:"鼠标双击时触发"}]},{title:"鼠标事件",children:[{label:"鼠标进入",value:"onMouseEnter",description:"鼠标进入时触发"},{label:"鼠标离开",value:"onMouseLeave",description:"鼠标离开时触发"}]}];((e=s)=>{i("事件绑定",[{name:"events",title:"事件",setter:{componentName:"EventSetter",props:{events:e}},extraProps:{label:!1}}])})(),i("高级配置",[{title:"条件渲染",setter:"SwitchSetter",extraProps:{supportVariable:!0,getValue:e=>e.getNode().getExtraPropValue("condition"),setValue(e,o){e.getNode().setExtraProp("condition",o)}}}]);var d="component-module__container___VbZSk",c="component-module__list___ZzqLO",_="component-module__item___-0hiq",p="component-module__rankBadge___qWXYW",m="component-module__rankBadgeTopThree___kYqJt",u="component-module__rankBadgeNormal___Fl3nh",f="component-module__rankGold___lLkRo",g="component-module__rankSilver___QUAyV",x="component-module__rankBronze___Wc-LC",b="component-module__name___6zmww",h="component-module__valueContainer___xBbFD",k="component-module__value___Fg70k",v="component-module__progressBar___wROZC",y="component-module__progressFill___F8n5d";!function(e,o){void 0===o&&(o={});var t=o.insertAt;if("undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===t&&r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}('.component-module__container___VbZSk{backdrop-filter:blur(10px);background:rgba(10,10,26,.95);border:1px solid rgba(26,26,62,.8);border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.3);box-sizing:border-box;height:100%;overflow:hidden;padding:16px;width:100%}.component-module__list___ZzqLO{display:flex;flex-direction:column;gap:10px;height:100%}.component-module__item___-0hiq{align-items:center;background:rgba(15,15,42,.9);border:1px solid rgba(26,26,62,.6);border-radius:8px;display:flex;gap:14px;overflow:hidden;padding:12px 16px;position:relative;transition:all .3s ease}.component-module__item___-0hiq:before{background:linear-gradient(180deg,transparent,rgba(0,212,255,.5),transparent);bottom:0;content:"";left:0;opacity:0;position:absolute;top:0;transition:opacity .3s ease;width:3px}.component-module__item___-0hiq:hover{background:rgba(20,20,52,.95);border-color:rgba(0,212,255,.3);transform:translateX(4px)}.component-module__item___-0hiq:hover:before{opacity:1}.component-module__rankBadge___qWXYW{align-items:center;border-radius:6px;display:flex;font-weight:700;height:32px;justify-content:center;min-width:32px;transition:transform .3s ease}.component-module__item___-0hiq:hover .component-module__rankBadge___qWXYW{transform:scale(1.1)}.component-module__rankBadgeTopThree___kYqJt{font-size:20px;text-shadow:0 2px 8px rgba(0,0,0,.5)}.component-module__rankBadgeNormal___Fl3nh{background:rgba(26,26,62,.8);border:1px solid rgba(136,146,176,.2);color:#8892b0;font-size:14px}.component-module__rankGold___lLkRo{color:gold;filter:drop-shadow(0 0 6px rgba(255,215,0,.6))}.component-module__rankSilver___QUAyV{color:#e8e8e8;filter:drop-shadow(0 0 6px rgba(192,192,192,.6))}.component-module__rankBronze___Wc-LC{color:#f96;filter:drop-shadow(0 0 6px rgba(205,127,50,.6))}.component-module__name___6zmww{color:#e6e6e6;flex:1;font-size:15px;font-weight:500;overflow:hidden;text-overflow:ellipsis;transition:color .3s ease;white-space:nowrap}.component-module__item___-0hiq:hover .component-module__name___6zmww{color:#fff}.component-module__valueContainer___xBbFD{align-items:flex-end;display:flex;flex-direction:column;gap:6px;min-width:120px}.component-module__value___Fg70k{color:#00d4ff;font-family:Courier New,Courier,monospace;font-size:15px;font-weight:700;text-shadow:0 0 10px rgba(0,212,255,.3);transition:all .3s ease}.component-module__item___-0hiq:hover .component-module__value___Fg70k{text-shadow:0 0 15px rgba(0,212,255,.5);transform:scale(1.05)}.component-module__progressBar___wROZC{background:rgba(26,26,62,.8);border-radius:3px;box-shadow:inset 0 1px 3px rgba(0,0,0,.3);height:5px;overflow:hidden;width:100%}.component-module__progressFill___F8n5d{border-radius:3px;height:100%;position:relative;transition:width .5s cubic-bezier(.4,0,.2,1)}.component-module__progressFill___F8n5d:after{animation:component-module__shimmer___7hQ6G 2s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);bottom:0;content:"";left:0;position:absolute;right:0;top:0}@keyframes component-module__shimmer___7hQ6G{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}');const w=[{rank:1,name:"北京市",value:9800},{rank:2,name:"上海市",value:8500},{rank:3,name:"广州市",value:7200},{rank:4,name:"深圳市",value:6100},{rank:5,name:"杭州市",value:4800}],C={1:"🥇",2:"🥈",3:"🥉"},S=(e,o,t,r)=>{let n;switch(o){case"currency":n=e.toLocaleString("zh-CN",{minimumFractionDigits:2,maximumFractionDigits:2});break;case"percent":n=`${e}%`;break;default:n=e.toLocaleString()}return`${t}${n}${r}`};e.ScrollList=({ref:e,$data:n,__dataSource:a,maxItems:i=5,showRank:s=!0,showMedal:N=!0,progressBarEnable:B=!0,progressBarGradient:j=!0,progressBarColors:V=["#00d4ff","#9b59b6"],valueFormat:F="number",valuePrefix:q="",valueSuffix:E="",nameColor:z="#e6e6e6",valueColor:P="#00d4ff",backgroundColor:L="rgba(10, 10, 26, 0.95)",borderColor:M="rgba(26, 26, 62, 0.8)",itemBackgroundColor:T="rgba(15, 15, 42, 0.9)",itemBorderColor:$="rgba(26, 26, 62, 0.6)",glowEnable:A=!1,rotation:D=0,opacity:R=100,style:W,onClick:I,onDoubleClick:X,onMouseEnter:Z,onMouseLeave:G,onItemClick:O})=>{const Y=function(e,t){return o.useMemo(()=>l(e,t),[e,t])}(n,a),Q=o.useMemo(()=>Y.length>0?Y:w,[Y]).slice(0,i),J=Math.max(...Q.map(e=>e.value),1),U={transform:0!==D?`rotate(${D}deg)`:void 0,opacity:R/100,backgroundColor:L,borderColor:M,...W},H={backgroundColor:T,borderColor:$};return t.jsx("div",{className:d,onClick:I,onDoubleClick:X,onMouseEnter:Z,onMouseLeave:G,ref:e,style:U,children:t.jsx("div",{className:c,children:Q.map((e,o)=>{const n=e.rank<=3;return t.jsxs("div",{className:_,onClick:()=>O?.(e,o),style:H,children:[s?t.jsx("div",{className:r(p,n?m:u,(l=e.rank,1===l?f:2===l?g:3===l?x:"")),children:N&&n?C[e.rank]:e.rank}):null,t.jsx("div",{className:b,style:{color:z},children:e.name}),t.jsxs("div",{className:h,children:[t.jsx("span",{className:k,style:{color:P},children:S(e.value,F,q,E)}),B?t.jsx("div",{className:v,children:t.jsx("div",{className:y,style:(a=e.value,{width:a/J*100+"%",background:j?`linear-gradient(90deg, ${V[0]}, ${V[1]})`:V[0],boxShadow:A?`0 0 8px ${V[0]}60`:void 0})})}):null]})]},e.rank);var a,l})})})}});

package/dist/index.min.js

@@ -1 +0,0 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react","react/jsx-runtime"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsScrollList={},e.React,e.jsxRuntime)}(this,function(e,t,o){"use strict";function r(...e){const t=[];for(const o of e)if(o)if("string"==typeof o||"number"==typeof o)t.push(String(o));else if(Array.isArray(o)){const e=r(...o);e&&t.push(e)}else if("object"==typeof o)for(const[e,r]of Object.entries(o))r&&t.push(e);return t.join(" ")}const a=(e,t)=>{if(!t)return e;const o=t.split(".");let r=e;for(const e of o){if(null==r)return;if("object"!=typeof r)return;r=r[e]}return r},n=e=>void 0===e?[]:Array.isArray(e)?e:e&&"object"==typeof e?[e]:[],l=(e,t)=>{const o=((e,t)=>{if(!e)return[];if("static"===e.sourceType)return Array.isArray(e.staticData)?e.staticData:[];if("global"===e.sourceType&&e.datasourceId){const o=t?.page?.[e.datasourceId];return n(o)}if("datasource"===e.sourceType&&e.datasourceId){const o=t?.component?.[e.datasourceId];return n(o)}return[]})(e,t);return((e,t)=>t&&0!==t.length?e.map(e=>{const o={};for(const{componentField:r,sourceField:n}of t)r&&n&&(o[r]=a(e,n));return o}):e)(o,e?.fieldMappings)};const s=(e,t)=>{const o=Array.isArray(e)?e:[e],r=o[0]||{};return{sourceType:"static",staticData:o,fieldMappings:Object.keys(r).map(e=>({componentField:e,sourceField:e}))}},i=(e,t,o)=>({type:"group",title:e,setter:{componentName:"CollapseSetter",props:{icon:!1,...o}},items:t}),p={name:"nodeInfo",title:"节点信息",setter:"NodeInfoSetter",extraProps:{label:!1}},d=i("基础配置",[{name:"title",title:"标题",setter:"StringSetter",extraProps:{getValue:e=>e.getExtraPropValue("title"),setValue(e,t){e.setExtraPropValue("title",t)}}},{name:"rect",title:"位置尺寸",setter:"RectSetter",extraProps:{getValue:e=>e.getExtraPropValue("$dashboard.rect"),setValue(e,t){e.setExtraPropValue("$dashboard.rect",t)}}},{name:"rotation",title:"旋转角度",setter:{componentName:"SliderSetter",props:{min:0,max:360,suffix:"°"}},extraProps:{defaultValue:0}},{name:"opacity",title:"不透明度",setter:{componentName:"SliderSetter",props:{min:0,max:100,suffix:"%"}},extraProps:{defaultValue:100}},{name:"background",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"transparent"}}]),m=[{title:"点击事件",children:[{label:"点击",value:"onClick",description:"鼠标点击时触发"},{label:"双击",value:"onDoubleClick",description:"鼠标双击时触发"}]},{title:"鼠标事件",children:[{label:"鼠标进入",value:"onMouseEnter",description:"鼠标进入时触发"},{label:"鼠标离开",value:"onMouseLeave",description:"鼠标离开时触发"}]}],c=((e=m)=>i("事件绑定",[{name:"events",title:"事件",setter:{componentName:"EventSetter",props:{events:e}},extraProps:{label:!1}}]))(),u=i("高级配置",[{title:"条件渲染",setter:"SwitchSetter",extraProps:{supportVariable:!0,getValue:e=>e.getNode().getExtraPropValue("condition"),setValue(e,t){e.getNode().setExtraProp("condition",t)}}}]);var _="component-module__container___VbZSk",f="component-module__list___ZzqLO",g="component-module__item___-0hiq",b="component-module__rankBadge___qWXYW",x="component-module__rankBadgeTopThree___kYqJt",h="component-module__rankBadgeNormal___Fl3nh",k="component-module__rankGold___lLkRo",v="component-module__rankSilver___QUAyV",y="component-module__rankBronze___Wc-LC",S="component-module__name___6zmww",w="component-module__valueContainer___xBbFD",C="component-module__value___Fg70k",V="component-module__progressBar___wROZC",N="component-module__progressFill___F8n5d";!function(e,t){void 0===t&&(t={});var o=t.insertAt;if("undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===o&&r.firstChild?r.insertBefore(a,r.firstChild):r.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}('.component-module__container___VbZSk{backdrop-filter:blur(10px);background:rgba(10,10,26,.95);border:1px solid rgba(26,26,62,.8);border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.3);box-sizing:border-box;height:100%;overflow:hidden;padding:16px;width:100%}.component-module__list___ZzqLO{display:flex;flex-direction:column;gap:10px;height:100%}.component-module__item___-0hiq{align-items:center;background:rgba(15,15,42,.9);border:1px solid rgba(26,26,62,.6);border-radius:8px;display:flex;gap:14px;overflow:hidden;padding:12px 16px;position:relative;transition:all .3s ease}.component-module__item___-0hiq:before{background:linear-gradient(180deg,transparent,rgba(0,212,255,.5),transparent);bottom:0;content:"";left:0;opacity:0;position:absolute;top:0;transition:opacity .3s ease;width:3px}.component-module__item___-0hiq:hover{background:rgba(20,20,52,.95);border-color:rgba(0,212,255,.3);transform:translateX(4px)}.component-module__item___-0hiq:hover:before{opacity:1}.component-module__rankBadge___qWXYW{align-items:center;border-radius:6px;display:flex;font-weight:700;height:32px;justify-content:center;min-width:32px;transition:transform .3s ease}.component-module__item___-0hiq:hover .component-module__rankBadge___qWXYW{transform:scale(1.1)}.component-module__rankBadgeTopThree___kYqJt{font-size:20px;text-shadow:0 2px 8px rgba(0,0,0,.5)}.component-module__rankBadgeNormal___Fl3nh{background:rgba(26,26,62,.8);border:1px solid rgba(136,146,176,.2);color:#8892b0;font-size:14px}.component-module__rankGold___lLkRo{color:gold;filter:drop-shadow(0 0 6px rgba(255,215,0,.6))}.component-module__rankSilver___QUAyV{color:#e8e8e8;filter:drop-shadow(0 0 6px rgba(192,192,192,.6))}.component-module__rankBronze___Wc-LC{color:#f96;filter:drop-shadow(0 0 6px rgba(205,127,50,.6))}.component-module__name___6zmww{color:#e6e6e6;flex:1;font-size:15px;font-weight:500;overflow:hidden;text-overflow:ellipsis;transition:color .3s ease;white-space:nowrap}.component-module__item___-0hiq:hover .component-module__name___6zmww{color:#fff}.component-module__valueContainer___xBbFD{align-items:flex-end;display:flex;flex-direction:column;gap:6px;min-width:120px}.component-module__value___Fg70k{color:#00d4ff;font-family:Courier New,Courier,monospace;font-size:15px;font-weight:700;text-shadow:0 0 10px rgba(0,212,255,.3);transition:all .3s ease}.component-module__item___-0hiq:hover .component-module__value___Fg70k{text-shadow:0 0 15px rgba(0,212,255,.5);transform:scale(1.05)}.component-module__progressBar___wROZC{background:rgba(26,26,62,.8);border-radius:3px;box-shadow:inset 0 1px 3px rgba(0,0,0,.3);height:5px;overflow:hidden;width:100%}.component-module__progressFill___F8n5d{border-radius:3px;height:100%;position:relative;transition:width .5s cubic-bezier(.4,0,.2,1)}.component-module__progressFill___F8n5d:after{animation:component-module__shimmer___7hQ6G 2s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);bottom:0;content:"";left:0;position:absolute;right:0;top:0}@keyframes component-module__shimmer___7hQ6G{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}');const P=[{rank:1,name:"北京市",value:9800},{rank:2,name:"上海市",value:8500},{rank:3,name:"广州市",value:7200},{rank:4,name:"深圳市",value:6100},{rank:5,name:"杭州市",value:4800}],B={1:"🥇",2:"🥈",3:"🥉"},E=(e,t,o,r)=>{let a;switch(t){case"currency":a=e.toLocaleString("zh-CN",{minimumFractionDigits:2,maximumFractionDigits:2});break;case"percent":a=`${e}%`;break;default:a=e.toLocaleString()}return`${o}${a}${r}`},F="EasyEditorMaterialsScrollList";const j=((e,t)=>({props:[{type:"group",title:"属性",setter:"TabSetter",items:[{type:"group",key:"config",title:"配置",items:[p,d,e]},{type:"group",key:"data",title:"数据",items:[p,t]},{type:"group",key:"advanced",title:"高级",items:[p,c,u]}]}],component:{},supports:{},advanced:{}}))(i("组件配置",[{type:"group",title:"组件配置",setter:"SubTabSetter",items:[{type:"group",key:"display",title:"显示",items:[{name:"maxItems",title:"最大显示数",setter:{componentName:"NumberSetter",props:{min:1,max:20}},extraProps:{defaultValue:5}},{name:"showRank",title:"显示排名",setter:"SwitchSetter",extraProps:{defaultValue:!0}},{name:"showMedal",title:"显示奖牌",setter:"SwitchSetter",extraProps:{defaultValue:!0}},{name:"progressBarEnable",title:"显示进度条",setter:"SwitchSetter",extraProps:{defaultValue:!0}},{name:"progressBarGradient",title:"渐变效果",setter:"SwitchSetter",extraProps:{defaultValue:!0}},{name:"glowEnable",title:"发光效果",setter:"SwitchSetter",extraProps:{defaultValue:!1}}]},{type:"group",key:"format",title:"格式",items:[{name:"valueFormat",title:"格式类型",setter:{componentName:"SelectSetter",props:{options:[{label:"数字",value:"number"},{label:"货币",value:"currency"},{label:"百分比",value:"percent"}]}},extraProps:{defaultValue:"number"}},{name:"valuePrefix",title:"数值前缀",setter:"StringSetter",extraProps:{defaultValue:""}},{name:"valueSuffix",title:"数值后缀",setter:"StringSetter",extraProps:{defaultValue:""}}]},{type:"group",key:"colors",title:"颜色",items:[{name:"progressBarColors",title:"进度条颜色",setter:{componentName:"ArraySetter",props:{itemSetter:"ColorSetter"}},extraProps:{defaultValue:["#00d4ff","#9b59b6"]}},{name:"nameColor",title:"名称颜色",setter:"ColorSetter",extraProps:{defaultValue:"#e6e6e6"}},{name:"valueColor",title:"数值颜色",setter:"ColorSetter",extraProps:{defaultValue:"#00d4ff"}},{name:"backgroundColor",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"rgba(10, 10, 26, 0.95)"}},{name:"itemBackgroundColor",title:"行背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"rgba(15, 15, 42, 0.9)"}}]}]}],{padding:"6px 16px 12px"}),{name:"$data",title:"数据配置",setter:{componentName:"DataSetter",props:{expectedFields:[{name:"rank",label:"rank",type:"number",required:!0,description:"排名"},{name:"name",label:"name",type:"string",required:!0,description:"名称"},{name:"value",label:"value",type:"number",required:!0,description:"数值"}],showPreview:!0,previewLimit:10}},extraProps:{label:!1}});const q={componentName:F,title:"滚动列表",group:"display",devMode:"proCode",npm:{package:"@easy-editor/materials-dashboard-scroll-list",version:"0.0.4",globalName:F,componentName:F},snippets:[{title:"排行榜",screenshot:"",schema:{componentName:F,title:"排行榜",props:{$data:s([{rank:1,name:"北京",value:9800},{rank:2,name:"上海",value:8500},{rank:3,name:"广州",value:7200},{rank:4,name:"深圳",value:6100},{rank:5,name:"杭州",value:4800}]),maxItems:5,showMedal:!0,progressBarEnable:!0,progressBarGradient:!0,progressBarColors:["#00d4ff","#9b59b6"],rotation:0,opacity:100,background:"transparent"},$dashboard:{rect:{width:320,height:280}}}},{title:"简单列表",screenshot:"",schema:{componentName:F,title:"简单列表",props:{$data:s([{rank:1,name:"产品A",value:1250},{rank:2,name:"产品B",value:980},{rank:3,name:"产品C",value:750}]),maxItems:3,showMedal:!1,progressBarEnable:!0,progressBarGradient:!1,progressBarColors:["#00ff88","#00ff88"],rotation:0,opacity:100,background:"transparent"},$dashboard:{rect:{width:280,height:180}}}}],configure:j};e.component=({ref:e,$data:a,__dataSource:n,maxItems:s=5,showRank:i=!0,showMedal:p=!0,progressBarEnable:d=!0,progressBarGradient:m=!0,progressBarColors:c=["#00d4ff","#9b59b6"],valueFormat:u="number",valuePrefix:F="",valueSuffix:j="",nameColor:q="#e6e6e6",valueColor:M="#00d4ff",backgroundColor:$="rgba(10, 10, 26, 0.95)",borderColor:T="rgba(26, 26, 62, 0.8)",itemBackgroundColor:z="rgba(15, 15, 42, 0.9)",itemBorderColor:L="rgba(26, 26, 62, 0.6)",glowEnable:A=!1,rotation:D=0,opacity:I=100,style:R,onClick:G,onDoubleClick:W,onMouseEnter:O,onMouseLeave:X,onItemClick:Z})=>{const Y=function(e,o){return t.useMemo(()=>l(e,o),[e,o])}(a,n),Q=t.useMemo(()=>Y.length>0?Y:P,[Y]).slice(0,s),J=Math.max(...Q.map(e=>e.value),1),U={transform:0!==D?`rotate(${D}deg)`:void 0,opacity:I/100,backgroundColor:$,borderColor:T,...R},H={backgroundColor:z,borderColor:L};return o.jsx("div",{className:_,onClick:G,onDoubleClick:W,onMouseEnter:O,onMouseLeave:X,ref:e,style:U,children:o.jsx("div",{className:f,children:Q.map((e,t)=>{const a=e.rank<=3;return o.jsxs("div",{className:g,onClick:()=>Z?.(e,t),style:H,children:[i?o.jsx("div",{className:r(b,a?x:h,(l=e.rank,1===l?k:2===l?v:3===l?y:"")),children:p&&a?B[e.rank]:e.rank}):null,o.jsx("div",{className:S,style:{color:q},children:e.name}),o.jsxs("div",{className:w,children:[o.jsx("span",{className:C,style:{color:M},children:E(e.value,u,F,j)}),d?o.jsx("div",{className:V,children:o.jsx("div",{className:N,style:(n=e.value,{width:n/J*100+"%",background:m?`linear-gradient(90deg, ${c[0]}, ${c[1]})`:c[0],boxShadow:A?`0 0 8px ${c[0]}60`:void 0})})}):null]})]},e.rank);var n,l})})})},e.meta=q});

package/dist/meta.min.js

@@ -1 +0,0 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).EasyEditorMaterialsScrollListMeta={})}(this,function(e){"use strict";const t=(e,t)=>{const r=Array.isArray(e)?e:[e],a=r[0]||{};return{sourceType:"static",staticData:r,fieldMappings:Object.keys(a).map(e=>({componentField:e,sourceField:e}))}},r=(e,t,r)=>({type:"group",title:e,setter:{componentName:"CollapseSetter",props:{icon:!1,...r}},items:t}),a={name:"nodeInfo",title:"节点信息",setter:"NodeInfoSetter",extraProps:{label:!1}},o=r("基础配置",[{name:"title",title:"标题",setter:"StringSetter",extraProps:{getValue:e=>e.getExtraPropValue("title"),setValue(e,t){e.setExtraPropValue("title",t)}}},{name:"rect",title:"位置尺寸",setter:"RectSetter",extraProps:{getValue:e=>e.getExtraPropValue("$dashboard.rect"),setValue(e,t){e.setExtraPropValue("$dashboard.rect",t)}}},{name:"rotation",title:"旋转角度",setter:{componentName:"SliderSetter",props:{min:0,max:360,suffix:"°"}},extraProps:{defaultValue:0}},{name:"opacity",title:"不透明度",setter:{componentName:"SliderSetter",props:{min:0,max:100,suffix:"%"}},extraProps:{defaultValue:100}},{name:"background",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"transparent"}}]),l=[{title:"点击事件",children:[{label:"点击",value:"onClick",description:"鼠标点击时触发"},{label:"双击",value:"onDoubleClick",description:"鼠标双击时触发"}]},{title:"鼠标事件",children:[{label:"鼠标进入",value:"onMouseEnter",description:"鼠标进入时触发"},{label:"鼠标离开",value:"onMouseLeave",description:"鼠标离开时触发"}]}],s=((e=l)=>r("事件绑定",[{name:"events",title:"事件",setter:{componentName:"EventSetter",props:{events:e}},extraProps:{label:!1}}]))(),n=r("高级配置",[{title:"条件渲染",setter:"SwitchSetter",extraProps:{supportVariable:!0,getValue:e=>e.getNode().getExtraPropValue("condition"),setValue(e,t){e.getNode().setExtraProp("condition",t)}}}]),i="EasyEditorMaterialsScrollList";const p=((e,t)=>({props:[{type:"group",title:"属性",setter:"TabSetter",items:[{type:"group",key:"config",title:"配置",items:[a,o,e]},{type:"group",key:"data",title:"数据",items:[a,t]},{type:"group",key:"advanced",title:"高级",items:[a,s,n]}]}],component:{},supports:{},advanced:{}}))(r("组件配置",[{type:"group",title:"组件配置",setter:"SubTabSetter",items:[{type:"group",key:"display",title:"显示",items:[{name:"maxItems",title:"最大显示数",setter:{componentName:"NumberSetter",props:{min:1,max:20}},extraProps:{defaultValue:5}},{name:"showRank",title:"显示排名",setter:"SwitchSetter",extraProps:{defaultValue:!0}},{name:"showMedal",title:"显示奖牌",setter:"SwitchSetter",extraProps:{defaultValue:!0}},{name:"progressBarEnable",title:"显示进度条",setter:"SwitchSetter",extraProps:{defaultValue:!0}},{name:"progressBarGradient",title:"渐变效果",setter:"SwitchSetter",extraProps:{defaultValue:!0}},{name:"glowEnable",title:"发光效果",setter:"SwitchSetter",extraProps:{defaultValue:!1}}]},{type:"group",key:"format",title:"格式",items:[{name:"valueFormat",title:"格式类型",setter:{componentName:"SelectSetter",props:{options:[{label:"数字",value:"number"},{label:"货币",value:"currency"},{label:"百分比",value:"percent"}]}},extraProps:{defaultValue:"number"}},{name:"valuePrefix",title:"数值前缀",setter:"StringSetter",extraProps:{defaultValue:""}},{name:"valueSuffix",title:"数值后缀",setter:"StringSetter",extraProps:{defaultValue:""}}]},{type:"group",key:"colors",title:"颜色",items:[{name:"progressBarColors",title:"进度条颜色",setter:{componentName:"ArraySetter",props:{itemSetter:"ColorSetter"}},extraProps:{defaultValue:["#00d4ff","#9b59b6"]}},{name:"nameColor",title:"名称颜色",setter:"ColorSetter",extraProps:{defaultValue:"#e6e6e6"}},{name:"valueColor",title:"数值颜色",setter:"ColorSetter",extraProps:{defaultValue:"#00d4ff"}},{name:"backgroundColor",title:"背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"rgba(10, 10, 26, 0.95)"}},{name:"itemBackgroundColor",title:"行背景颜色",setter:"ColorSetter",extraProps:{defaultValue:"rgba(15, 15, 42, 0.9)"}}]}]}],{padding:"6px 16px 12px"}),{name:"$data",title:"数据配置",setter:{componentName:"DataSetter",props:{expectedFields:[{name:"rank",label:"rank",type:"number",required:!0,description:"排名"},{name:"name",label:"name",type:"string",required:!0,description:"名称"},{name:"value",label:"value",type:"number",required:!0,description:"数值"}],showPreview:!0,previewLimit:10}},extraProps:{label:!1}});const u={componentName:i,title:"滚动列表",group:"display",devMode:"proCode",npm:{package:"@easy-editor/materials-dashboard-scroll-list",version:"0.0.4",globalName:i,componentName:i},snippets:[{title:"排行榜",screenshot:"",schema:{componentName:i,title:"排行榜",props:{$data:t([{rank:1,name:"北京",value:9800},{rank:2,name:"上海",value:8500},{rank:3,name:"广州",value:7200},{rank:4,name:"深圳",value:6100},{rank:5,name:"杭州",value:4800}]),maxItems:5,showMedal:!0,progressBarEnable:!0,progressBarGradient:!0,progressBarColors:["#00d4ff","#9b59b6"],rotation:0,opacity:100,background:"transparent"},$dashboard:{rect:{width:320,height:280}}}},{title:"简单列表",screenshot:"",schema:{componentName:i,title:"简单列表",props:{$data:t([{rank:1,name:"产品A",value:1250},{rank:2,name:"产品B",value:980},{rank:3,name:"产品C",value:750}]),maxItems:3,showMedal:!1,progressBarEnable:!0,progressBarGradient:!1,progressBarColors:["#00ff88","#00ff88"],rotation:0,opacity:100,background:"transparent"},$dashboard:{rect:{width:280,height:180}}}}],configure:p};e.meta=u});