@open-feishu-card/renderer 0.2.15 → 0.2.16

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/all.css +5 -3
  2. package/dist/index.cjs +5 -3
  3. package/dist/index.js +5 -3
  4. package/dist/styles.css +5 -3
  5. package/package.json +1 -1
package/dist/all.css CHANGED
@@ -531,6 +531,7 @@
531
531
  box-sizing: border-box; overflow: hidden;
532
532
  }
533
533
  /* header（<summary>）：可点击整行；去掉浏览器默认三角标记。
534
+ 真机 color:var(--text-caption) → N600；标题/箭头继承此色。
534
535
  默认 title flex:1 把箭头推到右侧（icon_position=right）；
535
536
  icon_position=left 时靠 DOM 顺序在左。 */
536
537
  .universal-card-collapsible-panel__header {
@@ -538,11 +539,12 @@
538
539
  padding: 8px 12px;
539
540
  cursor: pointer; box-sizing: border-box;
540
541
  list-style: none; user-select: none;
542
+ color: var(--N600);
541
543
  }
542
544
  .universal-card-collapsible-panel__header::-webkit-details-marker { display: none; }
543
545
  .universal-card-collapsible-panel__header::marker { content: ''; }
544
546
  .universal-card-collapsible-panel__title {
545
- flex: 1; min-width: 0; font-size: 14px; line-height: 22px; color: #1f2329;
547
+ flex: 1; min-width: 0; font-size: 14px; line-height: 22px;
546
548
  word-break: break-word;
547
549
  }
548
550
  /* follow_text：箭头紧贴文字（真机 __header-content--icon-follow），不拉满整行 */
@@ -554,10 +556,10 @@
554
556
  width: auto;
555
557
  }
556
558
  /* 箭头图标包裹：收起态角度 0；展开态（details[open]）旋转到 --panel-icon-angle（内联给出，默认 -180deg）。
557
- 由用户点击 <summary> 切换 [open]，箭头方向随之自动更新，无需 JS。 */
559
+ 由用户点击 <summary> 切换 [open]，箭头方向随之自动更新，无需 JS。颜色继承 header caption。 */
558
560
  .universal-card-collapsible-panel__icon {
559
561
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
560
- transition: transform .2s; color: #646a73; transform: rotate(0deg);
562
+ transition: transform .2s; transform: rotate(0deg);
561
563
  }
562
564
  .universal-card-collapsible-panel[open] .universal-card-collapsible-panel__icon {
563
565
  transform: rotate(var(--panel-icon-angle, -180deg));
package/dist/index.cjs CHANGED
@@ -1453,6 +1453,7 @@ var BASE_STYLES_CSS = `/**
1453
1453
  box-sizing: border-box; overflow: hidden;
1454
1454
  }
1455
1455
  /* header\uFF08<summary>\uFF09\uFF1A\u53EF\u70B9\u51FB\u6574\u884C\uFF1B\u53BB\u6389\u6D4F\u89C8\u5668\u9ED8\u8BA4\u4E09\u89D2\u6807\u8BB0\u3002
1456
+ \u771F\u673A color:var(--text-caption) \u2192 N600\uFF1B\u6807\u9898/\u7BAD\u5934\u7EE7\u627F\u6B64\u8272\u3002
1456
1457
  \u9ED8\u8BA4 title flex:1 \u628A\u7BAD\u5934\u63A8\u5230\u53F3\u4FA7\uFF08icon_position=right\uFF09\uFF1B
1457
1458
  icon_position=left \u65F6\u9760 DOM \u987A\u5E8F\u5728\u5DE6\u3002 */
1458
1459
  .universal-card-collapsible-panel__header {
@@ -1460,11 +1461,12 @@ var BASE_STYLES_CSS = `/**
1460
1461
  padding: 8px 12px;
1461
1462
  cursor: pointer; box-sizing: border-box;
1462
1463
  list-style: none; user-select: none;
1464
+ color: var(--N600);
1463
1465
  }
1464
1466
  .universal-card-collapsible-panel__header::-webkit-details-marker { display: none; }
1465
1467
  .universal-card-collapsible-panel__header::marker { content: ''; }
1466
1468
  .universal-card-collapsible-panel__title {
1467
- flex: 1; min-width: 0; font-size: 14px; line-height: 22px; color: #1f2329;
1469
+ flex: 1; min-width: 0; font-size: 14px; line-height: 22px;
1468
1470
  word-break: break-word;
1469
1471
  }
1470
1472
  /* follow_text\uFF1A\u7BAD\u5934\u7D27\u8D34\u6587\u5B57\uFF08\u771F\u673A __header-content--icon-follow\uFF09\uFF0C\u4E0D\u62C9\u6EE1\u6574\u884C */
@@ -1476,10 +1478,10 @@ var BASE_STYLES_CSS = `/**
1476
1478
  width: auto;
1477
1479
  }
1478
1480
  /* \u7BAD\u5934\u56FE\u6807\u5305\u88F9\uFF1A\u6536\u8D77\u6001\u89D2\u5EA6 0\uFF1B\u5C55\u5F00\u6001\uFF08details[open]\uFF09\u65CB\u8F6C\u5230 --panel-icon-angle\uFF08\u5185\u8054\u7ED9\u51FA\uFF0C\u9ED8\u8BA4 -180deg\uFF09\u3002
1479
- \u7531\u7528\u6237\u70B9\u51FB <summary> \u5207\u6362 [open]\uFF0C\u7BAD\u5934\u65B9\u5411\u968F\u4E4B\u81EA\u52A8\u66F4\u65B0\uFF0C\u65E0\u9700 JS\u3002 */
1481
+ \u7531\u7528\u6237\u70B9\u51FB <summary> \u5207\u6362 [open]\uFF0C\u7BAD\u5934\u65B9\u5411\u968F\u4E4B\u81EA\u52A8\u66F4\u65B0\uFF0C\u65E0\u9700 JS\u3002\u989C\u8272\u7EE7\u627F header caption\u3002 */
1480
1482
  .universal-card-collapsible-panel__icon {
1481
1483
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
1482
- transition: transform .2s; color: #646a73; transform: rotate(0deg);
1484
+ transition: transform .2s; transform: rotate(0deg);
1483
1485
  }
1484
1486
  .universal-card-collapsible-panel[open] .universal-card-collapsible-panel__icon {
1485
1487
  transform: rotate(var(--panel-icon-angle, -180deg));
package/dist/index.js CHANGED
@@ -1452,6 +1452,7 @@ var BASE_STYLES_CSS = `/**
1452
1452
  box-sizing: border-box; overflow: hidden;
1453
1453
  }
1454
1454
  /* header\uFF08<summary>\uFF09\uFF1A\u53EF\u70B9\u51FB\u6574\u884C\uFF1B\u53BB\u6389\u6D4F\u89C8\u5668\u9ED8\u8BA4\u4E09\u89D2\u6807\u8BB0\u3002
1455
+ \u771F\u673A color:var(--text-caption) \u2192 N600\uFF1B\u6807\u9898/\u7BAD\u5934\u7EE7\u627F\u6B64\u8272\u3002
1455
1456
  \u9ED8\u8BA4 title flex:1 \u628A\u7BAD\u5934\u63A8\u5230\u53F3\u4FA7\uFF08icon_position=right\uFF09\uFF1B
1456
1457
  icon_position=left \u65F6\u9760 DOM \u987A\u5E8F\u5728\u5DE6\u3002 */
1457
1458
  .universal-card-collapsible-panel__header {
@@ -1459,11 +1460,12 @@ var BASE_STYLES_CSS = `/**
1459
1460
  padding: 8px 12px;
1460
1461
  cursor: pointer; box-sizing: border-box;
1461
1462
  list-style: none; user-select: none;
1463
+ color: var(--N600);
1462
1464
  }
1463
1465
  .universal-card-collapsible-panel__header::-webkit-details-marker { display: none; }
1464
1466
  .universal-card-collapsible-panel__header::marker { content: ''; }
1465
1467
  .universal-card-collapsible-panel__title {
1466
- flex: 1; min-width: 0; font-size: 14px; line-height: 22px; color: #1f2329;
1468
+ flex: 1; min-width: 0; font-size: 14px; line-height: 22px;
1467
1469
  word-break: break-word;
1468
1470
  }
1469
1471
  /* follow_text\uFF1A\u7BAD\u5934\u7D27\u8D34\u6587\u5B57\uFF08\u771F\u673A __header-content--icon-follow\uFF09\uFF0C\u4E0D\u62C9\u6EE1\u6574\u884C */
@@ -1475,10 +1477,10 @@ var BASE_STYLES_CSS = `/**
1475
1477
  width: auto;
1476
1478
  }
1477
1479
  /* \u7BAD\u5934\u56FE\u6807\u5305\u88F9\uFF1A\u6536\u8D77\u6001\u89D2\u5EA6 0\uFF1B\u5C55\u5F00\u6001\uFF08details[open]\uFF09\u65CB\u8F6C\u5230 --panel-icon-angle\uFF08\u5185\u8054\u7ED9\u51FA\uFF0C\u9ED8\u8BA4 -180deg\uFF09\u3002
1478
- \u7531\u7528\u6237\u70B9\u51FB <summary> \u5207\u6362 [open]\uFF0C\u7BAD\u5934\u65B9\u5411\u968F\u4E4B\u81EA\u52A8\u66F4\u65B0\uFF0C\u65E0\u9700 JS\u3002 */
1480
+ \u7531\u7528\u6237\u70B9\u51FB <summary> \u5207\u6362 [open]\uFF0C\u7BAD\u5934\u65B9\u5411\u968F\u4E4B\u81EA\u52A8\u66F4\u65B0\uFF0C\u65E0\u9700 JS\u3002\u989C\u8272\u7EE7\u627F header caption\u3002 */
1479
1481
  .universal-card-collapsible-panel__icon {
1480
1482
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
1481
- transition: transform .2s; color: #646a73; transform: rotate(0deg);
1483
+ transition: transform .2s; transform: rotate(0deg);
1482
1484
  }
1483
1485
  .universal-card-collapsible-panel[open] .universal-card-collapsible-panel__icon {
1484
1486
  transform: rotate(var(--panel-icon-angle, -180deg));
package/dist/styles.css CHANGED
@@ -531,6 +531,7 @@
531
531
  box-sizing: border-box; overflow: hidden;
532
532
  }
533
533
  /* header（<summary>）：可点击整行；去掉浏览器默认三角标记。
534
+ 真机 color:var(--text-caption) → N600；标题/箭头继承此色。
534
535
  默认 title flex:1 把箭头推到右侧（icon_position=right）；
535
536
  icon_position=left 时靠 DOM 顺序在左。 */
536
537
  .universal-card-collapsible-panel__header {
@@ -538,11 +539,12 @@
538
539
  padding: 8px 12px;
539
540
  cursor: pointer; box-sizing: border-box;
540
541
  list-style: none; user-select: none;
542
+ color: var(--N600);
541
543
  }
542
544
  .universal-card-collapsible-panel__header::-webkit-details-marker { display: none; }
543
545
  .universal-card-collapsible-panel__header::marker { content: ''; }
544
546
  .universal-card-collapsible-panel__title {
545
- flex: 1; min-width: 0; font-size: 14px; line-height: 22px; color: #1f2329;
547
+ flex: 1; min-width: 0; font-size: 14px; line-height: 22px;
546
548
  word-break: break-word;
547
549
  }
548
550
  /* follow_text：箭头紧贴文字（真机 __header-content--icon-follow），不拉满整行 */
@@ -554,10 +556,10 @@
554
556
  width: auto;
555
557
  }
556
558
  /* 箭头图标包裹：收起态角度 0；展开态（details[open]）旋转到 --panel-icon-angle（内联给出，默认 -180deg）。
557
- 由用户点击 <summary> 切换 [open]，箭头方向随之自动更新，无需 JS。 */
559
+ 由用户点击 <summary> 切换 [open]，箭头方向随之自动更新，无需 JS。颜色继承 header caption。 */
558
560
  .universal-card-collapsible-panel__icon {
559
561
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
560
- transition: transform .2s; color: #646a73; transform: rotate(0deg);
562
+ transition: transform .2s; transform: rotate(0deg);
561
563
  }
562
564
  .universal-card-collapsible-panel[open] .universal-card-collapsible-panel__icon {
563
565
  transform: rotate(var(--panel-icon-angle, -180deg));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@open-feishu-card/renderer",
3
- "version": "0.2.15",
3
+ "version": "0.2.16",
4
4
  "description": "零框架依赖的飞书卡片渲染引擎：Web / DOM / SSR，输入 RAW 或公开 DSL，输出真实 DOM 或 HTML 字符串",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",