@lanrenbang/basecoat-ultra 0.1.6 → 0.2.0

package/dist/js/toast.js

@@ -83,48 +83,30 @@
     element.addEventListener("transitionend", () => element.remove(), { once: true });
   }
   function createToast(config) {
-    const {
-      category = "info",
-      title,
-      description,
-      action,
-      cancel,
-      duration,
-      icon
-    } = config;
+    const { category = "info", title, description, action, cancel, duration, icon } = config;
     const iconHtml = icon || category && ICONS[category] || "";
-    const titleHtml = title ? `<h2>${title}</h2>` : "";
-    const descriptionHtml = description ? `<p>${description}</p>` : "";
-    const actionHtml = action?.href ? `<a href="${action.href}" class="btn" data-toast-action>${action.label}</a>` : action?.onclick ? `<button type="button" class="btn" data-toast-action onclick="${action.onclick}">${action.label}</button>` : "";
-    const cancelHtml = cancel ? `<button type="button" class="btn-outline h-6 text-xs px-2.5 rounded-sm" data-toast-cancel onclick="${cancel?.onclick}">${cancel.label}</button>` : "";
-    const footerHtml = actionHtml || cancelHtml ? `<footer>${actionHtml}${cancelHtml}</footer>` : "";
-    const html = `
-      <div
-        class="toast"
-        role="${category === "error" ? "alert" : "status"}"
-        aria-atomic="true"
-        ${category ? `data-category="${category}"` : ""}
-        ${duration !== void 0 ? `data-duration="${duration}"` : ""}
-      >
-        <div class="toast-content">
-          ${iconHtml}
-          <section>
-            ${titleHtml}
-            ${descriptionHtml}
-          </section>
-          ${footerHtml}
-          </div>
-        </div>
-      </div>
-    `;
+    const titleHtml = title ? "<h2>" + title + "</h2>" : "";
+    const descriptionHtml = description ? "<p>" + description + "</p>" : "";
+    const actionHtml = action?.href ? '<a href="' + action.href + '" class="btn" data-toast-action>' + action.label + "</a>" : action?.onclick ? '<button type="button" class="btn" data-toast-action onclick="' + action.onclick + '">' + action.label + "</button>" : "";
+    const cancelHtml = cancel ? '<button type="button" class="btn-outline h-6 text-xs px-2.5 rounded-sm" data-toast-cancel onclick="' + (cancel?.onclick || "") + '">' + cancel.label + "</button>" : "";
+    const footerHtml = actionHtml || cancelHtml ? "<footer>" + actionHtml + cancelHtml + "</footer>" : "";
+    const html = '<div class="toast" role="' + (category === "error" ? "alert" : "status") + '" aria-atomic="true"' + (category ? ' data-category="' + category + '"' : "") + (duration !== void 0 ? ' data-duration="' + duration + '"' : "") + '><div class="toast-content">' + iconHtml + "<section>" + titleHtml + descriptionHtml + "</section>" + footerHtml + "</div></div>";
     const template = document.createElement("template");
     template.innerHTML = html.trim();
     return template.content.firstChild;
   }
   document.addEventListener("basecoat:toast", (event) => {
     if (!toaster) {
-      console.error("Cannot create toast: toaster container not found on page.");
-      return;
+      const existingToaster = document.getElementById("toaster") || document.querySelector(".toaster");
+      if (existingToaster) {
+        initToaster(existingToaster);
+      } else {
+        const newToaster = document.createElement("section");
+        newToaster.id = "toaster";
+        newToaster.className = "toaster";
+        document.body.appendChild(newToaster);
+        initToaster(newToaster);
+      }
     }
     const config = event.detail?.config || {};
     const toastElement = createToast(config);

package/dist/js/toast.min.js

@@ -1,83 +1,62 @@
 (() => {
-  let o;
-  const n = /* @__PURE__ */ new WeakMap();
-  let s = !1;
-  const g = {
+  let i;
+  const s = /* @__PURE__ */ new WeakMap();
+  let r = !1;
+  const w = {
     success: '<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="m9 12 2 2 4-4"/></svg>',
     error: '<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="m15 9-6 6"/><path d="m9 9 6 6"/></svg>',
     info: '<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/></svg>',
     warning: '<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>'
   };
-  function w(t) {
-    t.dataset.toasterInitialized || (o = t, o.addEventListener("mouseenter", p), o.addEventListener("mouseleave", v), o.addEventListener("click", (e) => {
-      const i = e.target.closest(".toast footer a"), a = e.target.closest(".toast footer button");
-      (i || a) && c(e.target.closest(".toast"));
-    }), o.querySelectorAll(".toast:not([data-toast-initialized])").forEach(l), o.dataset.toasterInitialized = "true", o.dispatchEvent(new CustomEvent("basecoat:initialized")));
+  function d(t) {
+    t.dataset.toasterInitialized || (i = t, i.addEventListener("mouseenter", p), i.addEventListener("mouseleave", v), i.addEventListener("click", (e) => {
+      const n = e.target.closest(".toast footer a"), o = e.target.closest(".toast footer button");
+      (n || o) && c(e.target.closest(".toast"));
+    }), i.querySelectorAll(".toast:not([data-toast-initialized])").forEach(u), i.dataset.toasterInitialized = "true", i.dispatchEvent(new CustomEvent("basecoat:initialized")));
   }
-  function l(t) {
+  function u(t) {
     if (t.dataset.toastInitialized) return;
-    const e = parseInt(t.dataset.duration), i = e !== -1 ? e || (t.dataset.category === "error" ? 5e3 : 3e3) : -1, a = {
-      remainingTime: i,
+    const e = parseInt(t.dataset.duration), n = e !== -1 ? e || (t.dataset.category === "error" ? 5e3 : 3e3) : -1, o = {
+      remainingTime: n,
       timeoutId: null,
       startTime: null
     };
-    i !== -1 && (s ? a.timeoutId = null : (a.startTime = Date.now(), a.timeoutId = setTimeout(() => c(t), i))), n.set(t, a), t.dataset.toastInitialized = "true";
+    n !== -1 && (r ? o.timeoutId = null : (o.startTime = Date.now(), o.timeoutId = setTimeout(() => c(t), n))), s.set(t, o), t.dataset.toastInitialized = "true";
   }
   function p() {
-    s || (s = !0, o.querySelectorAll('.toast:not([aria-hidden="true"])').forEach((t) => {
-      if (!n.has(t)) return;
-      const e = n.get(t);
+    r || (r = !0, i.querySelectorAll('.toast:not([aria-hidden="true"])').forEach((t) => {
+      if (!s.has(t)) return;
+      const e = s.get(t);
       e.timeoutId && (clearTimeout(e.timeoutId), e.timeoutId = null, e.remainingTime -= Date.now() - e.startTime);
     }));
   }
   function v() {
-    s && (s = !1, o.querySelectorAll('.toast:not([aria-hidden="true"])').forEach((t) => {
-      if (!n.has(t)) return;
-      const e = n.get(t);
+    r && (r = !1, i.querySelectorAll('.toast:not([aria-hidden="true"])').forEach((t) => {
+      if (!s.has(t)) return;
+      const e = s.get(t);
       e.remainingTime !== -1 && !e.timeoutId && (e.remainingTime > 0 ? (e.startTime = Date.now(), e.timeoutId = setTimeout(() => c(t), e.remainingTime)) : c(t));
     }));
   }
   function c(t) {
-    if (!n.has(t)) return;
-    const e = n.get(t);
-    clearTimeout(e.timeoutId), n.delete(t), t.contains(document.activeElement) && document.activeElement.blur(), t.setAttribute("aria-hidden", "true"), t.addEventListener("transitionend", () => t.remove(), { once: !0 });
+    if (!s.has(t)) return;
+    const e = s.get(t);
+    clearTimeout(e.timeoutId), s.delete(t), t.contains(document.activeElement) && document.activeElement.blur(), t.setAttribute("aria-hidden", "true"), t.addEventListener("transitionend", () => t.remove(), { once: !0 });
   }
   function k(t) {
-    const {
-      category: e = "info",
-      title: i,
-      description: a,
-      action: r,
-      cancel: d,
-      duration: u,
-      icon: b
-    } = t, T = b || e && g[e] || "", $ = i ? `<h2>${i}</h2>` : "", I = a ? `<p>${a}</p>` : "", h = r?.href ? `<a href="${r.href}" class="btn" data-toast-action>${r.label}</a>` : r?.onclick ? `<button type="button" class="btn" data-toast-action onclick="${r.onclick}">${r.label}</button>` : "", m = d ? `<button type="button" class="btn-outline h-6 text-xs px-2.5 rounded-sm" data-toast-cancel onclick="${d?.onclick}">${d.label}</button>` : "", x = h || m ? `<footer>${h}${m}</footer>` : "", E = `
-      <div
-        class="toast"
-        role="${e === "error" ? "alert" : "status"}"
-        aria-atomic="true"
-        ${e ? `data-category="${e}"` : ""}
-        ${u !== void 0 ? `data-duration="${u}"` : ""}
-      >
-        <div class="toast-content">
-          ${T}
-          <section>
-            ${$}
-            ${I}
-          </section>
-          ${x}
-          </div>
-        </div>
-      </div>
-    `, f = document.createElement("template");
-    return f.innerHTML = E.trim(), f.content.firstChild;
+    const { category: e = "info", title: n, description: o, action: a, cancel: l, duration: h, icon: T } = t, b = T || e && w[e] || "", I = n ? "<h2>" + n + "</h2>" : "", x = o ? "<p>" + o + "</p>" : "", m = a?.href ? '<a href="' + a.href + '" class="btn" data-toast-action>' + a.label + "</a>" : a?.onclick ? '<button type="button" class="btn" data-toast-action onclick="' + a.onclick + '">' + a.label + "</button>" : "", f = l ? '<button type="button" class="btn-outline h-6 text-xs px-2.5 rounded-sm" data-toast-cancel onclick="' + (l?.onclick || "") + '">' + l.label + "</button>" : "", E = m || f ? "<footer>" + m + f + "</footer>" : "", y = '<div class="toast" role="' + (e === "error" ? "alert" : "status") + '" aria-atomic="true"' + (e ? ' data-category="' + e + '"' : "") + (h !== void 0 ? ' data-duration="' + h + '"' : "") + '><div class="toast-content">' + b + "<section>" + I + x + "</section>" + E + "</div></div>", g = document.createElement("template");
+    return g.innerHTML = y.trim(), g.content.firstChild;
   }
   document.addEventListener("basecoat:toast", (t) => {
-    if (!o) {
-      console.error("Cannot create toast: toaster container not found on page.");
-      return;
+    if (!i) {
+      const o = document.getElementById("toaster") || document.querySelector(".toaster");
+      if (o)
+        d(o);
+      else {
+        const a = document.createElement("section");
+        a.id = "toaster", a.className = "toaster", document.body.appendChild(a), d(a);
+      }
     }
-    const e = t.detail?.config || {}, i = k(e);
-    o.appendChild(i);
-  }), window.basecoat && (window.basecoat.register("toaster", "#toaster:not([data-toaster-initialized])", w), window.basecoat.register("toast", ".toast:not([data-toast-initialized])", l));
+    const e = t.detail?.config || {}, n = k(e);
+    i.appendChild(n);
+  }), window.basecoat && (window.basecoat.register("toaster", "#toaster:not([data-toaster-initialized])", d), window.basecoat.register("toast", ".toast:not([data-toast-initialized])", u));
 })();

package/dist/js/toggle.js

@@ -26,6 +26,11 @@
       } else {
         toggle.setAttribute("aria-pressed", !isPressed);
       }
+      const selected = Array.from(group.querySelectorAll('.toggle[aria-pressed="true"]')).map((t) => t.dataset.value || t.innerText.trim());
+      group.dispatchEvent(new CustomEvent("change", {
+        bubbles: true,
+        detail: { value: type === "single" ? selected[0] || null : selected }
+      }));
     });
     group.dataset.toggleGroupInitialized = true;
   };

package/dist/js/toggle.min.js

@@ -2,19 +2,24 @@
   const d = (e) => {
     e.addEventListener("click", (s) => {
       if (e.disabled || e.getAttribute("aria-disabled") === "true") return;
-      const i = e.getAttribute("aria-pressed") === "true";
-      e.setAttribute("aria-pressed", !i);
+      const r = e.getAttribute("aria-pressed") === "true";
+      e.setAttribute("aria-pressed", !r);
     }), e.dataset.toggleInitialized = !0;
-  }, o = (e) => {
+  }, n = (e) => {
     const s = e.dataset.type || "single";
-    e.addEventListener("click", (i) => {
-      const t = i.target.closest(".toggle");
+    e.addEventListener("click", (r) => {
+      const t = r.target.closest(".toggle");
       if (!t || !e.contains(t) || t.disabled || t.getAttribute("aria-disabled") === "true") return;
-      const r = t.getAttribute("aria-pressed") === "true";
-      s === "single" ? r ? t.setAttribute("aria-pressed", "false") : (e.querySelectorAll(".toggle").forEach((a) => {
-        a !== t && a.setAttribute("aria-pressed", "false");
-      }), t.setAttribute("aria-pressed", "true")) : t.setAttribute("aria-pressed", !r);
+      const a = t.getAttribute("aria-pressed") === "true";
+      s === "single" ? a ? t.setAttribute("aria-pressed", "false") : (e.querySelectorAll(".toggle").forEach((i) => {
+        i !== t && i.setAttribute("aria-pressed", "false");
+      }), t.setAttribute("aria-pressed", "true")) : t.setAttribute("aria-pressed", !a);
+      const l = Array.from(e.querySelectorAll('.toggle[aria-pressed="true"]')).map((i) => i.dataset.value || i.innerText.trim());
+      e.dispatchEvent(new CustomEvent("change", {
+        bubbles: !0,
+        detail: { value: s === "single" ? l[0] || null : l }
+      }));
     }), e.dataset.toggleGroupInitialized = !0;
   };
-  window.basecoat && (window.basecoat.register("toggle", ".toggle:not(.toggle-group .toggle):not([data-toggle-initialized])", d), window.basecoat.register("toggle-group", ".toggle-group:not([data-toggle-group-initialized])", o));
+  window.basecoat && (window.basecoat.register("toggle", ".toggle:not(.toggle-group .toggle):not([data-toggle-initialized])", d), window.basecoat.register("toggle-group", ".toggle-group:not([data-toggle-group-initialized])", n));
 })();

package/package.json

@@ -1,16 +1,33 @@
 {
   "name": "@lanrenbang/basecoat-ultra",
-  "version": "0.1.6",
-  "description": "Basecoat UI - Ultra edition. A Tailwind-first component library.",
+  "version": "0.2.0",
+  "description": "Basecoat UI - Ultra edition. A Tailwind-first component library for any web stack.",
   "type": "module",
+  "license": "MIT",
+  "author": "Lanrenbang",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Lanrenbang/basecoat-ultra.git",
+    "directory": "packages/ultra"
+  },
+  "homepage": "https://lanrenbang.github.io/basecoat-ultra",
+  "bugs": {
+    "url": "https://github.com/Lanrenbang/basecoat-ultra/issues"
+  },
+  "keywords": [
+    "tailwind",
+    "ui",
+    "components",
+    "css",
+    "basecoat",
+    "shadcn",
+    "catppuccin"
+  ],
   "main": "./dist/js/all.js",
   "style": "./dist/css/basecoat.css",
   "files": [
     "dist",
     "README.md",
-    "README-cn.md",
-    "CHANGELOG.md",
-    "CHANGELOG-cn.md",
     "LICENSE.md"
   ],
   "exports": {
@@ -39,23 +56,21 @@
     "./slider": "./dist/js/slider.js",
     "./tabs": "./dist/js/tabs.js",
     "./toast": "./dist/js/toast.js",
-    "./toggle": "./dist/js/toggle.js"
+    "./toggle": "./dist/js/toggle.js",
+    "./utils/*": "./dist/js/utils/*.js"
   },
   "scripts": {
-    "dev": "vite",
     "build": "vite build && vite build --mode minify && bun run build.ts",
-    "preview": "vite preview",
-    "verify": "vite --mode verify",
-    "diff": "bun run build.ts diff",
-    "split": "bun run build.ts split",
-    "check": "bun run build.ts check"
+    "upstream:diff": "bun run scripts/upstream-diff.ts analyze",
+    "upstream:sync": "bun run scripts/upstream-diff.ts sync",
+    "upstream:css": "bun run scripts/upstream-diff.ts css",
+    "upstream:js": "bun run scripts/upstream-diff.ts js"
   },
   "dependencies": {
     "flatpickr": "^4.6.13",
     "split.js": "^1.6.5"
   },
   "devDependencies": {
-    "@lanrenbang/basecoat-ultra": "^0.1.5",
     "@tailwindcss/cli": "^4.1.18",
     "@tailwindcss/vite": "^4.1.18",
     "@types/bun": "latest",

package/CHANGELOG-cn.md

@@ -1,54 +0,0 @@
-# Basecoat Ultra 更新日志 (Changelog)
-
-[English](./CHANGELOG.md) | **中文**
-
-本文档记录了 `basecoat-ultra` 相对于上游 Basecoat 的所有主要变更。
-
-## 🚀 核心架构与构建 (Architecture & Build)
-
-*   **模块化重构**: 将原版单体 `basecoat.css` 拆分为 `src/css/parts/` 下的独立模块，便于维护和按需引用。
-*   **Tailwind v4 适配**: 修复了在 CSS 中使用复杂 `@apply` 选择器（如 `[&_svg:not(...)]`）时的转义与语法错误，改用原生 CSS 嵌套写法。
-*   **依赖精简**: 移除了 Nunjucks/Jinja 模板支持，专注于 HTML/JS 组件实现。
-
-## ✨ 组件改进 (Component Improvements)
-
-### 核心组件修复
-*   **Button**:
-    *   修复 Ghost/Link 变体在某些上下文中的背景残留问题。
-    *   增强 Outline 变体的文字对比度。
-*   **Dialog**:
-    *   重构动画曲线，引入 `cubic-bezier` 回弹效果。
-    *   优化居中定位逻辑。
-*   **Dropdown Menu**:
-    *   修复初始化时的可见性闪烁问题（确保初始 `aria-hidden="true"`）。
-    *   支持更灵活的 DOM 结构（直接在 popover 内容上定义 `role="menu"`）。
-*   **Sidebar**:
-    *   优化 `aria-current` 自动高亮逻辑，自动忽略 `href="#"` 空链接。
-*   **Form Elements**:
-    *   修复 Checkbox/Radio/Switch/Sidebar 中 `content` 属性转义符丢失导致的构建错误。
-    *   调整 Select 和 Checkbox 图标颜色 (`oklch`) 以提升对比度。
-    *   Range 滑块增加 hover 阴影与手型光标。
-
-### 新增自定义组件 (New Components)
-*   **Accordion**: 上游仅做文档演示，本项目已将其标准化封装为正式组件。基于 `<details>`/`<summary>` 的纯 CSS 动画手风琴。
-*   **Sheet**: 侧边抽屉组件，支持从屏幕边缘滑出。
-*   **Carousel**: 基础轮播图组件。
-*   **Input OTP**: 验证码/一次性密码输入组件。
-*   **Toggle / Toggle Group**: 独立的开关与开关组组件。
-
-### 外部集成 (External Integrations)
-*   **Date Picker**: 集成 `flatpickr`，并提供深度定制的主题样式。
-*   **Resizable**: 集成 `split.js`，提供可拖拽布局支持。
-
-## 🎨 视觉与主题 (Visuals & Theming)
-
-*   **Catppuccin 主题**: 
-    *   完整集成 Latte, Frappé, Macchiato, Mocha 四款主题。
-    *   提供配套的 `Theme Switcher` 逻辑 (`src/js/catppuccin-theme-switcher.js`)。
-*   **Neumorphism 扩展**:
-    *   新增 `lighting.js`: 实现基于鼠标位置的全局拟态光照效果（灵感来源于 `puikinsh/login-forms`）。
-    *   支持 CSS 3D Transform 翻转效果。
-
----
-
-*注意：以上变更基于与 Basecoat 原版 (`references/basecoat`) 的对比。*

package/CHANGELOG.md

@@ -1,54 +0,0 @@
-# Basecoat Ultra Changelog
-
-**English** | [中文](./CHANGELOG-cn.md)
-
-This document records all major changes in `basecoat-ultra` relative to the upstream Basecoat.
-
-## 🚀 Architecture & Build
-
-*   **Modular Refactoring**: Split the monolithic `basecoat.css` into independent modules under `src/css/parts/` for easier maintenance and on-demand usage.
-*   **Tailwind v4 Adaptation**: Fixed escaping and syntax errors when using complex `@apply` selectors (e.g., `[&_svg:not(...)]`) in CSS, replacing them with native CSS nesting syntax.
-*   **Dependency Slimming**: Removed Nunjucks/Jinja template support to focus on HTML/JS component implementation.
-
-## ✨ Component Improvements
-
-### Core Fixes
-*   **Button**:
-    *   Fixed background residue issues for Ghost/Link variants in specific contexts.
-    *   Enhanced text contrast for Outline variants.
-*   **Dialog**:
-    *   Refactored animation curves, introducing `cubic-bezier` bounce effects.
-    *   Optimized centering logic.
-*   **Dropdown Menu**:
-    *   Fixed visibility flicker on initialization (ensured initial `aria-hidden="true"`).
-    *   Supported more flexible DOM structures (defining `role="menu"` directly on popover content).
-*   **Sidebar**:
-    *   Optimized `aria-current` auto-highlighting logic to ignore `href="#"` empty links.
-*   **Form Elements**:
-    *   Fixed build errors caused by missing escape characters in `content` properties for Checkbox/Radio/Switch/Sidebar.
-    *   Adjusted Select and Checkbox icon colors (`oklch`) to improve contrast.
-    *   Added hover shadows and pointer cursor to Range sliders.
-
-### New Custom Components
-*   **Accordion**: Standardized and internalized (upstream only had it as a demo). Pure CSS animation based on `<details>`/`<summary>`.
-*   **Sheet**: Side drawer component supporting slide-in from screen edges.
-*   **Carousel**: Basic carousel component.
-*   **Input OTP**: Verification code/One-Time Password input component.
-*   **Toggle / Toggle Group**: Independent toggle and toggle group components.
-
-### External Integrations
-*   **Date Picker**: Integrated `flatpickr` with deeply customized theme styles.
-*   **Resizable**: Integrated `split.js` providing draggable layout support.
-
-## 🎨 Visuals & Theming
-
-*   **Catppuccin Themes**:
-    *   Fully integrated Latte, Frappé, Macchiato, and Mocha themes.
-    *   Provided matching `Theme Switcher` logic (`src/js/catppuccin-theme-switcher.js`).
-*   **Neumorphism Extension**:
-    *   Added `lighting.js`: Implements global neumorphic lighting effects based on mouse position (Inspired by `puikinsh/login-forms`).
-    *   Supported CSS 3D Transform flip effects.
-
----
-
-*Note: The above changes are based on comparison with the original Basecoat (`references/basecoat`).*

package/README-cn.md

@@ -1,199 +0,0 @@
-# Basecoat Ultra
-
-**中文** | [English](./README.md)
-
-Basecoat 是一套基于 Tailwind CSS 构建的组件库。它旨在用于任何传统的 Web 技术栈。
-Basecoat 将 shadcn/ui 的设计魔法带到了传统 Web 开发中：无需 React。
-
-**Basecoat Ultra** 是基于 [Basecoat](https://basecoatui.com) 的增强版 UI 库。它保留了“Tailwind 优先、框架无关”的核心理念，同时提供了针对现代审美和轻量级需求的深度定制。我们移除了对 Nunjucks/Jinja 的原生支持，转而专注于提供更丰富的交互组件、开箱即用的主题系统以及精细的视觉增强。
-
-## ✨ 特性
-
-### 🛠️ 核心改进
-我们对 Basecoat 核心进行了大量细节打磨和错误修复（详见 CHANGELOG），包括但不限于：
-- **CSS 模块化**：将单体 CSS 重构为模块化结构，支持按需加载。
-- **构建修复**：解决了 Tailwind v4 中复杂选择器的转义问题。
-- **组件优化**：
-    - `Button`：修复了特定背景下 Ghost/Link 变体的显示问题。
-    - `Dialog`：引入了更自然的缩放和回弹动画。
-    - `Dropdown Menu`：修复了初始化时的闪烁问题。
-    - `Sidebar`：智能识别并高亮当前页面的逻辑。
-
-### 🧩 新增组件
-引入了一系列受 shadcn/ui 启发的高频组件，完全独立于 React/Vue：
-- **Accordion (手风琴)**：原版仅存在于演示中，现已标准化并内置。基于原生 `<details>`，零 JS 动画。
-- **Sheet (侧边栏/抽屉)**：优雅的侧滑面板。
-- **Carousel (轮播)**：轻量级轮播组件。
-- **Input OTP (验证码输入)**：专用的单次密码输入框。
-- **Toggle Group (切换组)**：类似 Radio Group 的按钮式交互。
-- **Toggle (切换按钮)**：独立的切换按钮样式。
-
-### 🔌 外部集成
-集成了优秀的第三方库以填补纯 CSS/Vanilla JS 的空白（需单独引入）：
-- **Date Picker (日期选择器)**：基于 [Flatpickr](https://flatpickr.js.org/) 的深度定制版，完美适配主题。
-- **Resizable (拖拽分割)**：基于 [Split.js](https://split.js.org/) 的可拖拽分割面板。
-
-### 🎨 视觉增强
-- **Catppuccin 主题**：内置支持完整的 [Catppuccin](https://github.com/catppuccin/catppuccin) 配色方案 (Latte, Frappé, Macchiato, Mocha)。
-- **拟态设计 (Neumorphism) 扩展**：
-    - **全局光照系统**：独特的小鼠跟随光照效果 (`lighting.js`)，赋予 `.neu-panel`、`.neu-btn` 元素拟态质感。
-    - **3D 翻转**：支持基于 CSS 3D Transform 的卡片翻转效果。
-
-## 📦 安装
-
-推荐使用 `bun`，当然也支持 `npm` 或 `pnpm`：
-
-```bash
-bun add @lanrenbang/basecoat-ultra
-# 或
-npm install @lanrenbang/basecoat-ultra
-```
-
-## 🚀 配置 (构建工具)
-
-如果您使用 Vite、Webpack 等构建工具，并已配置 Tailwind CSS v4，请按照以下步骤操作。
-
-### 1. 引入 CSS
-
-在您的 CSS 入口文件（例如 `style.css`）中引入。
-
-**注意**：请引入不带编译的源码版本，让您的 Tailwind 配置来处理样式。切勿引入 `.cdn.css` 版本。
-
-```css
-@import "tailwindcss";
-
-/* 1. Basecoat 核心样式 (必须) */
-@import "@lanrenbang/basecoat-ultra";
-
-/* 2. 外部扩展组件样式 (可选，仅当您使用这些组件时必须显式引入) */
-@import "@lanrenbang/basecoat-ultra/datepicker.css";
-@import "@lanrenbang/basecoat-ultra/resizable.css";
-
-/* 3. 主题样式 (可选，必须显式引入) */
-/* 我们提供了一套 Catppuccin 主题，您也可以参考源码实现自己的主题 */
-@import "@lanrenbang/basecoat-ultra/theme/catppuccin";
-```
-
-### 2. 引入 JavaScript
-
-在您的应用入口文件（例如 `main.js` 或 `app.ts`）中引入。
-
-**方式一：全量引入 (推荐)**
-包含核心逻辑及大部分常用组件（不含 Datepicker/Resizable）。
-
-```javascript
-import '@lanrenbang/basecoat-ultra/all';
-```
-
-**方式二：特定组件引入**
-```javascript
-// 1. 先引入核心
-import '@lanrenbang/basecoat-ultra/basecoat';
-
-// 2. 再引入具体组件
-import '@lanrenbang/basecoat-ultra/tabs';
-import '@lanrenbang/basecoat-ultra/select';
-import '@lanrenbang/basecoat-ultra/popover';
-```
-
-**外部扩展组件 (必须单独引入)**
-无论使用哪种方式，以下组件因为体积较大或依赖外部库，**不会**包含在默认入口中，必须显式引入：
-
-```javascript
-import '@lanrenbang/basecoat-ultra/datepicker'; // 基于 flatpickr
-import '@lanrenbang/basecoat-ultra/resizable';  // 基于 split.js
-```
-
----
-
-## 🌐 CDN 用法 (无构建工具)
-
-如果您不使用打包工具，可以直接通过 CDN (jsDelivr) 引入。这里我们使用编译好的 `.cdn.css` 版本（已包含 Tailwind 样式）。
-
-### CSS
-
-```html
-<!-- Basecoat 核心 (包含 Tailwind 样式) -->
-<link href="https://cdn.jsdelivr.net/npm/@lanrenbang/basecoat-ultra@latest/dist/css/basecoat.cdn.min.css" rel="stylesheet">
-
-<!-- 外部扩展 (可选) -->
-<link href="https://cdn.jsdelivr.net/npm/@lanrenbang/basecoat-ultra@latest/dist/css/datepicker.min.css" rel="stylesheet">
-<link href="https://cdn.jsdelivr.net/npm/@lanrenbang/basecoat-ultra@latest/dist/css/resizable.min.css" rel="stylesheet">
-
-<!-- 主题 (可选) -->
-<link href="https://cdn.jsdelivr.net/npm/@lanrenbang/basecoat-ultra@latest/dist/theme/catppuccin/index.min.css" rel="stylesheet">
-```
-
-### JavaScript
-
-```html
-<!-- 核心与常用组件 -->
-<script src="https://cdn.jsdelivr.net/npm/@lanrenbang/basecoat-ultra@latest/dist/js/all.min.js" defer></script>
-
-<!-- 外部扩展 (可选) -->
-<script src="https://cdn.jsdelivr.net/npm/@lanrenbang/basecoat-ultra@latest/dist/js/datepicker.min.js" defer></script>
-<script src="https://cdn.jsdelivr.net/npm/@lanrenbang/basecoat-ultra@latest/dist/js/resizable.min.js" defer></script>
-```
-
-## 🛠️ 开发指南
-
-本项目使用 [Bun](https://bun.sh) 作为包管理器和运行时，使用 [Vite](https://vitejs.dev) 进行构建。
-
-### 启动项目
-
-```bash
-# 1. 克隆项目
-git clone https://github.com/your-username/basecoat-ultra.git
-cd basecoat-ultra
-
-# 2. 安装依赖
-bun install
-
-# 3. 启动开发服务器
-bun run dev
-```
-
-### 防闪烁脚本 (Anti-flash)
-
-为了防止在使用 Catppuccin 主题切换器时刷新页面出现闪烁 (FOUC)，请将以下脚本放在 HTML `<head>` 标签的顶部：
-
-```html
-<script>
-(function() {
-  try {
-    const t = localStorage.getItem('catppuccin-theme');
-    const a = localStorage.getItem('catppuccin-accent');
-    const m = localStorage.getItem('basecoat-mode');
-    const r = document.documentElement;
-    // 优先使用主题配置
-    if (t && a) {
-      r.classList.add(`theme-${t}`, `accent-${a}`);
-      if(['frappe','macchiato','mocha'].includes(t)) r.classList.add('dark');
-    } else if (m) {
-      // 仅夜间/日间模式偏好
-      r.classList.toggle('dark', m === 'dark');
-    } else {
-      // 跟随系统
-      r.classList.toggle('dark', window.matchMedia('(prefers-color-scheme: dark)').matches);
-    }
-  } catch(e) {}
-})();
-</script>
-```
-
-## ❤️ 致谢
-
-本项目站在巨人的肩膀上：
-
-*   **[Basecoat](https://basecoatui.com)**: 原作者 [hunvreus](https://github.com/hunvreus)。大部分基础代码归原作者所有。
-*   **[Catppuccin](https://github.com/catppuccin/palette)**: 提供了精美的配色方案。
-*   **[puikinsh/login-forms](https://github.com/puikinsh/login-forms/tree/main/forms/neumorphism)**: 拟态光照和 3D 效果的灵感来源。
-*   **[Flatpickr](https://flatpickr.js.org/)** & **[Split.js](https://split.js.org/)**: 优秀的第三方库支持。
-
-## 通过捐赠支持我
-[![BuyMeACoffee](https://img.shields.io/badge/Buy%20Me%20a%20Coffee-ffdd00?style=for-the-badge&logo=buy-me-a-coffee&logoColor=black)](https://buymeacoffee.com/bobbynona) [![Ko-Fi](https://img.shields.io/badge/Ko--fi-F16061?style=for-the-badge&logo=ko-fi&logoColor=white)](https://ko-fi.com/bobbynona) [![USDT(TRC20)/Tether](https://img.shields.io/badge/Tether-168363?style=for-the-badge&logo=tether&logoColor=white)](https://github.com/Lanrenbang/.github/blob/5b06b0b2d0b8e4ce532c1c37c72115dd98d7d849/custom/USDT-TRC20.md) [![Litecoin](https://img.shields.io/badge/Litecoin-A6A9AA?style=for-the-badge&logo=litecoin&logoColor=white)](https://github.com/Lanrenbang/.github/blob/5b06b0b2d0b8e4ce532c1c37c72115dd98d7d849/custom/Litecoin.md)
-
-## 📄 许可证
-
-本项目基于 [MIT License](LICENSE.md) 开源。
-原 Basecoat 内容版权归 hunvreus 所有。