openclaw-openagent 1.0.0

package/src/plugin-ui/modules/agent-book/travelcard/travel-styles.js

@@ -0,0 +1,251 @@
+// ── 1. CSS 注入 ──
+const _tripCSS = document.createElement('style');
+_tripCSS.textContent = `
+/* ── 行程文字：普通文字灰色，特殊标注(粗体/链接/标题)黑色 ── */
+.trip-styled li, .trip-styled p { color: #888 !important; }
+.trip-styled li strong, .trip-styled li b,
+.trip-styled p strong, .trip-styled p b,
+.trip-styled li a, .trip-styled p a { color: #111 !important; }
+.trip-styled h1, .trip-styled h2, .trip-styled h3,
+.trip-styled h4, .trip-styled h5, .trip-styled h6 { color: #111 !important; }
+.trip-styled ul { padding-left: 20px; }
+sh_card, tr_card, i_card, la_card, fr_card, bg_card, time_data_card {
+display: none !important;
+}
+
+/* ── TransportCard ── */
+.trip-transport-card {
+margin: 12px 0 12px 20px;
+border-radius: 12px;
+border: 1px solid rgb(229,229,229);
+background: #fff;
+overflow: hidden;
+cursor: pointer;
+transition: box-shadow 0.2s;
+max-width: 380px;
+}
+.trip-transport-card:hover { box-shadow: 0 2px 12px rgba(0,0,0,0.08); }
+.trip-tc-inner {
+display: flex; flex-direction: column; padding: 16px;
+}
+.trip-tc-station-row {
+display: flex; flex-direction: row; align-items: flex-start; width: 100%;
+}
+.trip-tc-left { display: flex; flex-direction: column; width: max(159px, 50%); }
+.trip-tc-left-top { display: flex; flex-direction: row; align-items: center; }
+.trip-tc-time {
+font-size: 20px; font-weight: 500; line-height: 28px;
+color: rgb(17,17,17); white-space: nowrap; flex-shrink: 0;
+}
+.trip-tc-arrow-area {
+display: flex; flex-direction: row; align-items: center;
+min-width: 90px; margin-left: 8px; position: relative; flex: 1;
+}
+.trip-tc-arrow-line { flex: 1; display: block; min-width: 40px; }
+.trip-tc-duration {
+display: flex; flex-direction: row; align-items: center;
+background: rgb(255,255,255); color: rgb(85,85,85);
+font-size: 12px; white-space: nowrap;
+position: absolute; left: 50%; transform: translateX(-50%);
+padding: 0 4px;
+}
+.trip-tc-station {
+font-size: 14px; line-height: 21px; font-weight: 400;
+color: rgb(17,17,17); margin-top: 2px; margin-right: 4px;
+overflow: hidden; text-overflow: ellipsis;
+display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
+}
+.trip-tc-right { display: flex; flex-direction: column; margin-left: 8px; }
+.trip-tc-superscript { color: #FF7D00; font-size: 10px; vertical-align: super; margin-left: 1px; }
+.trip-tc-desc {
+display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;
+margin-top: 4px;
+color: rgb(85,85,85); font-size: 14px; line-height: 21px;
+}
+.trip-tc-desc-tag { display: inline-flex; align-items: center; font-size: 14px; line-height: 21px; }
+.trip-tc-desc-tag-positive { color: rgb(6,135,90); flex-shrink: 0; }
+.trip-tc-desc-divider {
+color: rgb(213,213,213); font-size: 12px; line-height: 18px;
+margin: 0 8px; position: relative; top: -1px;
+}
+.trip-tc-icon { font-family: 'crn_font_xtaro_route'; margin-right: 2px; font-size: 14px; }
+
+/* ── ImageCard ── */
+.trip-img-card {
+display: flex; flex-direction: row; gap: 6px;
+overflow-x: auto; padding: 8px 0; margin-left: 20px;
+scrollbar-width: thin;
+}
+.trip-img-item {
+position: relative; width: 191px; height: 100px; border-radius: 8px;
+flex-shrink: 0; overflow: hidden;
+}
+.trip-img-fallback-item {
+width: 240px; height: auto; min-height: 88px;
+background: #fff; border: 1px solid #e5e8ef;
+box-shadow: 0 2px 8px rgba(17,24,39,0.04);
+padding: 10px 12px; display: flex; flex-direction: column; gap: 5px;
+}
+.trip-img-fallback-title {
+font-size: 14px; font-weight: 600; color: #1f2937; line-height: 20px;
+}
+.trip-img-fallback-desc {
+font-size: 13px; color: #6b7280; line-height: 19px;
+display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
+overflow: hidden;
+}
+.trip-img-fallback-score {
+align-self: flex-start; margin-top: 2px;
+font-size: 12px; color: #f97316; background: #fff7ed;
+border-radius: 999px; padding: 2px 7px;
+}
+.trip-img-item img {
+width: 191px; height: 100px; border-radius: 8px; object-fit: cover;
+display: block;
+}
+.trip-img-overlay {
+position: absolute; bottom: 0; left: 0; right: 0;
+background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.7));
+padding: 4px 8px;
+}
+.trip-img-name {
+color: #fff; font-size: 13px; font-weight: 500; line-height: 18px;
+overflow: hidden; text-overflow: ellipsis;
+display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
+}
+.trip-img-score {
+display: inline-flex; align-items: center; gap: 2px;
+background: rgba(0,0,0,0.4); border-radius: 4px; padding: 1px 4px;
+position: absolute; top: 4px; right: 4px;
+}
+.trip-img-score-icon { color: rgb(255,116,123); font-size: 10px; }
+.trip-img-score-text { color: rgb(255,116,123); font-size: 10px; }
+
+/* ── TimeDataCard ── */
+.trip-day-card {
+display: flex; align-items: center; gap: 8px;
+margin: 20px 0 8px 0; padding: 0;
+}
+.trip-day-badge {
+display: inline-flex; align-items: center; justify-content: center;
+background: linear-gradient(135deg, #006ff6 0%, #4d9eff 100%);
+color: #fff; font-size: 13px; font-weight: 600;
+padding: 4px 14px; border-radius: 16px;
+letter-spacing: 0.5px;
+}
+.trip-day-line { flex: 1; height: 1px; background: #e5e6eb; }
+
+/* ── ShoppingCard (线路概览表格) ── */
+.trip-sh-card { margin: 16px 0 16px 20px; }
+.trip-sh-title {
+font-size: 20px; font-weight: 500; color: #051a37;
+line-height: 26px; margin-bottom: 12px; display: block;
+}
+.trip-sh-table {
+width: 100%; max-width: 400px;
+border: 1px solid rgb(229,229,229); border-radius: 8px;
+overflow: hidden; background: #fff;
+}
+.trip-sh-row { display: flex; flex-direction: row; }
+.trip-sh-row + .trip-sh-row { border-top: 1px solid #d4d7de; }
+.trip-sh-day-cell {
+width: 72px; flex-shrink: 0; display: flex; flex-direction: column;
+align-items: center; justify-content: center; padding: 12px;
+border-right: 1px solid #d4d7de;
+}
+.trip-sh-day-title { font-size: 12px; color: rgb(133,146,166); }
+.trip-sh-day-num { font-size: 24px; font-weight: 700; color: rgb(17,17,17); }
+.trip-sh-detail {
+flex: 1; padding: 12px 16px; display: flex; flex-direction: column;
+justify-content: center;
+}
+.trip-sh-districts {
+display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;
+}
+.trip-sh-district { font-size: 16px; font-weight: 500; color: #0f294d; }
+.trip-sh-district-arrow { font-size: 16px; color: #8592a6; margin: 0 4px; }
+.trip-sh-pois {
+display: flex; flex-direction: row; flex-wrap: wrap;
+align-items: center; margin-top: 4px;
+}
+.trip-sh-poi { font-size: 14px; color: #4E5969; line-height: 22px; }
+.trip-sh-poi-arrow { font-size: 14px; color: #8592a6; margin: 0 6px; }
+
+/* ── HotelAreaCard ── */
+.trip-hotel-card {
+border-radius: 8px; border: 1px solid #f0f2f5;
+overflow: hidden; background: #fff; margin: 8px 0;
+}
+.trip-hotel-header {
+padding: 10px 12px; background: rgba(0,111,246,0.03);
+border-bottom: 1px solid #f0f2f5;
+display: flex; align-items: center; gap: 6px;
+}
+.trip-hotel-icon {
+font-family: 'crn_font_xtaro_route'; font-size: 14px; color: #006ff6;
+}
+.trip-hotel-title { font-size: 14px; font-weight: 600; color: #111; }
+.trip-hotel-desc {
+font-size: 13px; color: #6b7280; line-height: 20px;
+padding: 10px 12px 12px;
+}
+
+/* ── FoodCard ── */
+.trip-food-card { margin: 8px 0 8px 20px; }
+.trip-food-title {
+font-size: 18px; font-weight: 500; color: #111;
+line-height: 26px; display: block; margin-bottom: 8px;
+}
+.trip-food-item {
+display: flex; align-items: flex-start; gap: 8px;
+padding: 4px 0;
+}
+.trip-food-dot {
+width: 6px; height: 6px; border-radius: 50%; margin-top: 10px; flex-shrink: 0;
+}
+.trip-food-dot-food { background: #F77234; }
+.trip-food-dot-rest { background: #006ff6; }
+.trip-food-name { font-size: 16px; color: #111; line-height: 24px; }
+.trip-food-meta { font-size: 11px; color: #888; margin-left: 6px; }
+
+/* ── BudgetCard ── */
+.trip-budget-card { margin: 16px 0; }
+.trip-budget-title { font-size: 17px; font-weight: 700; color: #111; line-height: 22px; }
+.trip-budget-desc { font-size: 13px; color: #333; margin: 6px 0 0 0; line-height: 1.7; }
+.trip-budget-chart {
+margin-top: 12px; margin-left: 20px; background: #fff; max-width: 320px;
+border: 1px solid #e8e8e8; border-radius: 10px; padding: 14px 16px;
+}
+.trip-budget-header {
+display: flex; justify-content: space-between; align-items: center;
+}
+.trip-budget-person { font-size: 14px; font-weight: 600; color: #111; line-height: 20px; }
+.trip-budget-total { font-size: 15px; font-weight: 700; color: #111; line-height: 22px; }
+.trip-budget-parts { display: flex; flex-direction: column; gap: 12px; margin-top: 14px; }
+.trip-budget-part {
+display: flex; flex-direction: row; align-items: center;
+}
+.trip-budget-part-icon { width: 16px; height: 16px; margin-right: 4px; font-size: 14px; text-align: center; }
+.trip-budget-part-name { font-size: 13px; font-weight: 600; color: #111; line-height: 20px; white-space: nowrap; }
+.trip-budget-bar {
+flex: 1; height: 6px; border-radius: 3px; margin: 0 10px;
+overflow: hidden; min-width: 40px; max-width: 140px;
+}
+.trip-budget-bar-fill { height: 100%; border-radius: 3px; min-width: 4%; }
+.trip-budget-part-price {
+font-size: 13px; color: #111; line-height: 20px;
+min-width: 55px; text-align: right;
+}
+
+/* ── 暗色主题适配 ── */
+@media (prefers-color-scheme: dark) {
+.trip-transport-card, .trip-sh-table, .trip-hotel-card, .trip-img-fallback-item { background: #1e1e1e; border-color: #333; }
+.trip-tc-time, .trip-tc-station, .trip-sh-district, .trip-hotel-title,
+.trip-img-fallback-title, .trip-food-name, .trip-budget-title, .trip-budget-person, .trip-budget-total,
+.trip-budget-part-name, .trip-budget-part-price, .trip-sh-day-num { color: #e0e0e0; }
+.trip-img-fallback-desc, .trip-hotel-desc { color: #9ca3af; }
+.trip-sh-row + .trip-sh-row, .trip-sh-day-cell { border-color: #333; }
+.trip-hotel-header { background: rgba(0,111,246,0.08); border-color: #333; }
+}
+`;
+document.head.appendChild(_tripCSS);

package/src/plugin-ui/modules/loader/bootstrap.js

@@ -0,0 +1,38 @@
+// MutationObserver for faster trigger — with debounce to prevent infinite loops.
+// Without debounce, _clScan modifies DOM → triggers observer → _clScan → ...
+var _clDebounceTimer = null;
+var _clObserverTarget = null;
+
+const _clObserver = new MutationObserver(() => {
+  if (_clDebounceTimer) clearTimeout(_clDebounceTimer);
+  _clDebounceTimer = setTimeout(_debouncedClScan, 50); // Reduced from 500ms to 50ms to fix UI flash
+});
+
+function _debouncedClScan() {
+  // Disconnect observer during scan to prevent feedback loop
+  _clObserver.disconnect();
+  try {
+    _clScan();
+  } catch (err) {
+    console.warn('[openagent] scanner error:', err.message);
+  }
+  // Reconnect observer after scan completes
+  if (_clObserverTarget) {
+    _clObserver.observe(_clObserverTarget, { childList: true, subtree: true });
+  }
+}
+
+function _startClObserver() {
+  _clObserverTarget = document.querySelector('openclaw-app') || document.body;
+  _clObserver.observe(_clObserverTarget, { childList: true, subtree: true });
+  setTimeout(_debouncedClScan, 2000);
+  /* muted */ void 0;
+}
+
+if (document.readyState === 'loading') {
+  document.addEventListener('DOMContentLoaded', _startClObserver);
+} else {
+  setTimeout(_startClObserver, 500);
+}
+
+/* muted */ void 0;