@windrun-huaiin/base-ui 3.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 D8ger
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE. 

package/README.md

@@ -0,0 +1,190 @@
+# Base UI Components
+
+A comprehensive set of UI components built with React, TypeScript, and Tailwind CSS.
+
+## 🚀 Features
+
+- **Built-in Icon System**: 28 commonly used icons are built-in as React components
+- **TypeScript Support**: Full type safety and IntelliSense
+- **Tailwind CSS**: Utility-first CSS framework integration
+- **Radix UI**: Accessible and unstyled UI primitives
+- **Tree Shaking**: Only import what you need
+
+## 📦 Installation
+
+```bash
+pnpm add @windrun-huaiin/base-ui
+```
+
+## TailwindCSS 4.x Config
+
+- Assume you have a project structure like this:
+
+```txt
+Your-project/
+├── src/
+│   └── app/
+│       └── globals.css
+├── node_modules/
+│   ├── @windrun-huaiin/
+│   │   ├── third-ui/
+│   │   │   └── src/        # This is third-ui src
+│   │   └── base-ui/
+│   │       └── src/        # This is base-ui src
+└── package.json
+```
+
+- Then, in your `globals.css` file, you have to configure Tailwind CSS 4.x like this:
+
+```css
+@import 'tailwindcss';
+
+@source "../node_modules/@windrun-huaiin/third-ui/src/**/*.{js,ts,jsx,tsx}";
+@source "../node_modules/@windrun-huaiin/base-ui/src/**/*.{js,ts,jsx,tsx}";
+@source "./src/**/*.{js,ts,jsx,tsx}";
+
+/* Import styles */
+@import '@windrun-huaiin/third-ui/styles/base-ui.css';
+```
+
+## 🎨 Built-in Icons
+
+This package includes 28 built-in icons as React components. All icons are accessible through the `globalLucideIcons` object.
+
+### Available Icons
+
+**Development Tools:**
+- GitHub, D8, Clerk, Iterm
+
+**File Types:** 
+- Markdown, MDX, Html, Json, XML, Yaml, CSV, Txt, Java, SQL, Log
+
+**Technologies:**
+- MAC, BTC, CSS, Mermaid
+
+**Documentation:**
+- LastUpdated, Snippets, Test, Diff
+
+**Business/Legal:**
+- DPA, SubP, T3P
+
+**Network:**
+- Http, Scheme
+
+## Usage
+
+### 1. Direct Icon Usage
+```tsx
+import { globalLucideIcons } from '@windrun-huaiin/base-ui';
+
+// Use any built-in icon
+<globalLucideIcons.GitHub className="h-6 w-6" />
+<globalLucideIcons.BTC className="h-4 w-4" />
+<globalLucideIcons.Mmd className="h-4 w-4" /> // Auto 16x16 size for Mermaid
+```
+
+### 2. Dynamic Icon Loading
+```tsx
+import { getGlobalIcon } from '@windrun-huaiin/base-ui';
+
+// Get icon component
+const GitHubIcon = getGlobalIcon('GitHub');
+<GitHubIcon className="h-6 w-6" />
+
+// Get icon element (for fumadocs)
+const iconElement = getGlobalIcon('GitHub', true);
+```
+
+### 3. Utility Components
+```tsx
+import { SiteIcon, NotFoundIcon } from '@windrun-huaiin/base-ui';
+
+// Pre-configured site icon
+<SiteIcon />
+
+// Pre-configured 404 icon  
+<NotFoundIcon />
+```
+
+## Benefits
+
+- ✅ **Zero Configuration**: No need to copy SVG files to your project
+- ✅ **Self-contained**: All icons are bundled as React components
+- ✅ **Consistent Styling**: Global icon color configuration
+- ✅ **Type Safety**: Full TypeScript support with auto-completion
+- ✅ **Performance**: No network requests for icon files
+- ✅ **Special Sizing**: Mermaid icon has optimized 16x16 default size
+
+## Environment Variables
+
+```bash
+# Optional: Set global icon color (defaults to text-purple-500)
+NEXT_PUBLIC_STYLE_ICON_COLOR=text-blue-600
+```
+
+## License
+
+MIT
+
+## Included Components
+
+### UI Components (ui/)
+- Radix UI base components
+- Unified styles and themes
+- Full TypeScript support
+
+### Base Components (components/)
+- 404-page: 404 error page component
+- cta: Call-to-Action component
+- features: Feature showcase component
+- footer: Footer component
+- gallery: Image gallery component
+- global-icon: Global icon management
+- go-to-top: Go to top button
+- LanguageDetector: Language detection component
+- LanguageSwitcher: Language switcher component
+- seo-content: SEO content component
+- tips: Tip component
+
+### Script Components (script/)
+- GoogleAnalyticsScript: Google Analytics script
+- MicrosoftClarityScript: Microsoft Clarity script
+
+## Usage Example
+
+```tsx
+import { Button, NotFoundPage, LanguageSwitcher } from '@windrun-huaiin/base-ui';
+
+// Use UI components
+<Button variant="default" size="lg">
+  Click me
+</Button>
+
+// Use base components
+<NotFoundPage />
+
+// Use language switcher component (need to pass in configuration)
+<LanguageSwitcher 
+  locales={['en', 'zh']}
+  localeLabels={{ en: 'English', zh: '中文' }}
+/>
+```
+
+## Dependencies
+
+- React 18+
+- Next.js 15+
+- TypeScript
+
+## Development
+
+```bash
+# Build
+pnpm build
+
+# Development mode
+pnpm dev
+
+# Type check
+pnpm type-check
+``` 

package/dist/base-ui.css

@@ -0,0 +1,3 @@
+
+ 
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9zdHlsZXMvYmFzZS11aS5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEiLCJmaWxlIjoiYmFzZS11aS5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyJcbiAiXX0= */

package/dist/components/index.d.mts

@@ -0,0 +1,144 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { LucideProps } from 'lucide-react';
+import React__default from 'react';
+
+declare function NotFoundPage(): react_jsx_runtime.JSX.Element;
+
+type StyledLucideIconComponent = (props: LucideProps) => React__default.ReactElement;
+type IconComponent = StyledLucideIconComponent | React__default.ComponentType<LucideProps>;
+declare const globalLucideIcons: {
+    GitHub: StyledLucideIconComponent;
+    D8: StyledLucideIconComponent;
+    Clerk: StyledLucideIconComponent;
+    Iterm: StyledLucideIconComponent;
+    Markdown: StyledLucideIconComponent;
+    MDX: StyledLucideIconComponent;
+    Html: StyledLucideIconComponent;
+    Json: StyledLucideIconComponent;
+    XML: StyledLucideIconComponent;
+    Yaml: StyledLucideIconComponent;
+    CSV: StyledLucideIconComponent;
+    Txt: StyledLucideIconComponent;
+    Java: StyledLucideIconComponent;
+    SQL: StyledLucideIconComponent;
+    Log: StyledLucideIconComponent;
+    MAC: StyledLucideIconComponent;
+    BTC: StyledLucideIconComponent;
+    CSS: StyledLucideIconComponent;
+    Mmd: StyledLucideIconComponent;
+    LastUpdated: StyledLucideIconComponent;
+    Snippets: StyledLucideIconComponent;
+    Test: StyledLucideIconComponent;
+    Diff: StyledLucideIconComponent;
+    DPA: StyledLucideIconComponent;
+    SubP: StyledLucideIconComponent;
+    T3P: StyledLucideIconComponent;
+    Http: StyledLucideIconComponent;
+    Scheme: StyledLucideIconComponent;
+    AlbumIcon: StyledLucideIconComponent;
+    AlignHorizontalJustifyEnd: StyledLucideIconComponent;
+    ArrowLeft: StyledLucideIconComponent;
+    ArrowRight: StyledLucideIconComponent;
+    ArrowUp: StyledLucideIconComponent;
+    Binary: StyledLucideIconComponent;
+    Blocks: StyledLucideIconComponent;
+    BookX: StyledLucideIconComponent;
+    BringToFront: StyledLucideIconComponent;
+    Building2: StyledLucideIconComponent;
+    Bug: StyledLucideIconComponent;
+    Car: StyledLucideIconComponent;
+    Circle: StyledLucideIconComponent;
+    CircleAlert: StyledLucideIconComponent;
+    CircleSmall: StyledLucideIconComponent;
+    Check: StyledLucideIconComponent;
+    ChevronDown: StyledLucideIconComponent;
+    ChevronLeft: StyledLucideIconComponent;
+    ChevronRight: StyledLucideIconComponent;
+    ChevronUp: StyledLucideIconComponent;
+    Cpu: StyledLucideIconComponent;
+    ComponentIcon: StyledLucideIconComponent;
+    DatabaseZap: StyledLucideIconComponent;
+    Dot: StyledLucideIconComponent;
+    Download: StyledLucideIconComponent;
+    Eye: StyledLucideIconComponent;
+    ExternalLink: StyledLucideIconComponent;
+    Facebook: StyledLucideIconComponent;
+    FileLock2: StyledLucideIconComponent;
+    Fingerprint: StyledLucideIconComponent;
+    Gift: StyledLucideIconComponent;
+    GitPullRequestArrow: StyledLucideIconComponent;
+    Globe: StyledLucideIconComponent;
+    GlobeLock: StyledLucideIconComponent;
+    GripVertical: StyledLucideIconComponent;
+    HandHeart: StyledLucideIconComponent;
+    Handshake: StyledLucideIconComponent;
+    Highlighter: StyledLucideIconComponent;
+    HousePlus: StyledLucideIconComponent;
+    Info: StyledLucideIconComponent;
+    ImageDown: StyledLucideIconComponent;
+    ImageOff: StyledLucideIconComponent;
+    ImageUp: StyledLucideIconComponent;
+    Keyboard: StyledLucideIconComponent;
+    LandPlot: StyledLucideIconComponent;
+    Layout: StyledLucideIconComponent;
+    LayoutTemplate: StyledLucideIconComponent;
+    LibraryIcon: StyledLucideIconComponent;
+    Link: StyledLucideIconComponent;
+    Loader2: StyledLucideIconComponent;
+    LogIn: StyledLucideIconComponent;
+    LogOut: StyledLucideIconComponent;
+    MoreHorizontal: StyledLucideIconComponent;
+    MousePointerClick: StyledLucideIconComponent;
+    PanelLeft: StyledLucideIconComponent;
+    PanelsTopLeft: StyledLucideIconComponent;
+    Pencil: StyledLucideIconComponent;
+    Pi: StyledLucideIconComponent;
+    Palette: StyledLucideIconComponent;
+    ReceiptText: StyledLucideIconComponent;
+    Regex: StyledLucideIconComponent;
+    Replace: StyledLucideIconComponent;
+    Rss: StyledLucideIconComponent;
+    Scale: StyledLucideIconComponent;
+    Search: StyledLucideIconComponent;
+    Share: StyledLucideIconComponent;
+    ShieldUser: StyledLucideIconComponent;
+    SquareDashedBottomCode: StyledLucideIconComponent;
+    SquareTerminal: StyledLucideIconComponent;
+    Server: StyledLucideIconComponent;
+    SplinePointer: StyledLucideIconComponent;
+    Sparkles: StyledLucideIconComponent;
+    Star: StyledLucideIconComponent;
+    Tablets: StyledLucideIconComponent;
+    Terminal: StyledLucideIconComponent;
+    Twitter: StyledLucideIconComponent;
+    X: StyledLucideIconComponent;
+    Zap: StyledLucideIconComponent;
+};
+/**
+ * use iconKey to load icon safely
+ * @param iconKey translation or configuration
+ * @param createElement whether to return a React element instead of component
+ */
+declare function getGlobalIcon(iconKey: string | undefined): IconComponent;
+declare function getGlobalIcon(iconKey: string | undefined, createElement: true): React__default.ReactElement | undefined;
+/**
+ * Get icon element (for fumadocs source compatibility)
+ * This is a wrapper around getGlobalIcon for backwards compatibility
+ * @param icon icon key from frontmatter
+ */
+declare function getIconElement(icon: string | undefined): React__default.ReactElement | undefined;
+declare const DefaultSiteIcon: () => react_jsx_runtime.JSX.Element;
+declare const NotFoundIcon: () => react_jsx_runtime.JSX.Element;
+
+declare function GoogleAnalyticsScript(): react_jsx_runtime.JSX.Element | null;
+declare function useGoogleAnalytics(): {
+    trackEvent: (event: string, data?: Record<string, unknown>) => void;
+};
+declare global {
+    interface Window {
+        dataLayer: any[];
+        gtag: (...args: any[]) => void;
+    }
+}
+
+export { DefaultSiteIcon, GoogleAnalyticsScript, NotFoundIcon, NotFoundPage, getGlobalIcon, getIconElement, globalLucideIcons, useGoogleAnalytics };

package/dist/components/index.d.ts

@@ -0,0 +1,144 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { LucideProps } from 'lucide-react';
+import React__default from 'react';
+
+declare function NotFoundPage(): react_jsx_runtime.JSX.Element;
+
+type StyledLucideIconComponent = (props: LucideProps) => React__default.ReactElement;
+type IconComponent = StyledLucideIconComponent | React__default.ComponentType<LucideProps>;
+declare const globalLucideIcons: {
+    GitHub: StyledLucideIconComponent;
+    D8: StyledLucideIconComponent;
+    Clerk: StyledLucideIconComponent;
+    Iterm: StyledLucideIconComponent;
+    Markdown: StyledLucideIconComponent;
+    MDX: StyledLucideIconComponent;
+    Html: StyledLucideIconComponent;
+    Json: StyledLucideIconComponent;
+    XML: StyledLucideIconComponent;
+    Yaml: StyledLucideIconComponent;
+    CSV: StyledLucideIconComponent;
+    Txt: StyledLucideIconComponent;
+    Java: StyledLucideIconComponent;
+    SQL: StyledLucideIconComponent;
+    Log: StyledLucideIconComponent;
+    MAC: StyledLucideIconComponent;
+    BTC: StyledLucideIconComponent;
+    CSS: StyledLucideIconComponent;
+    Mmd: StyledLucideIconComponent;
+    LastUpdated: StyledLucideIconComponent;
+    Snippets: StyledLucideIconComponent;
+    Test: StyledLucideIconComponent;
+    Diff: StyledLucideIconComponent;
+    DPA: StyledLucideIconComponent;
+    SubP: StyledLucideIconComponent;
+    T3P: StyledLucideIconComponent;
+    Http: StyledLucideIconComponent;
+    Scheme: StyledLucideIconComponent;
+    AlbumIcon: StyledLucideIconComponent;
+    AlignHorizontalJustifyEnd: StyledLucideIconComponent;
+    ArrowLeft: StyledLucideIconComponent;
+    ArrowRight: StyledLucideIconComponent;
+    ArrowUp: StyledLucideIconComponent;
+    Binary: StyledLucideIconComponent;
+    Blocks: StyledLucideIconComponent;
+    BookX: StyledLucideIconComponent;
+    BringToFront: StyledLucideIconComponent;
+    Building2: StyledLucideIconComponent;
+    Bug: StyledLucideIconComponent;
+    Car: StyledLucideIconComponent;
+    Circle: StyledLucideIconComponent;
+    CircleAlert: StyledLucideIconComponent;
+    CircleSmall: StyledLucideIconComponent;
+    Check: StyledLucideIconComponent;
+    ChevronDown: StyledLucideIconComponent;
+    ChevronLeft: StyledLucideIconComponent;
+    ChevronRight: StyledLucideIconComponent;
+    ChevronUp: StyledLucideIconComponent;
+    Cpu: StyledLucideIconComponent;
+    ComponentIcon: StyledLucideIconComponent;
+    DatabaseZap: StyledLucideIconComponent;
+    Dot: StyledLucideIconComponent;
+    Download: StyledLucideIconComponent;
+    Eye: StyledLucideIconComponent;
+    ExternalLink: StyledLucideIconComponent;
+    Facebook: StyledLucideIconComponent;
+    FileLock2: StyledLucideIconComponent;
+    Fingerprint: StyledLucideIconComponent;
+    Gift: StyledLucideIconComponent;
+    GitPullRequestArrow: StyledLucideIconComponent;
+    Globe: StyledLucideIconComponent;
+    GlobeLock: StyledLucideIconComponent;
+    GripVertical: StyledLucideIconComponent;
+    HandHeart: StyledLucideIconComponent;
+    Handshake: StyledLucideIconComponent;
+    Highlighter: StyledLucideIconComponent;
+    HousePlus: StyledLucideIconComponent;
+    Info: StyledLucideIconComponent;
+    ImageDown: StyledLucideIconComponent;
+    ImageOff: StyledLucideIconComponent;
+    ImageUp: StyledLucideIconComponent;
+    Keyboard: StyledLucideIconComponent;
+    LandPlot: StyledLucideIconComponent;
+    Layout: StyledLucideIconComponent;
+    LayoutTemplate: StyledLucideIconComponent;
+    LibraryIcon: StyledLucideIconComponent;
+    Link: StyledLucideIconComponent;
+    Loader2: StyledLucideIconComponent;
+    LogIn: StyledLucideIconComponent;
+    LogOut: StyledLucideIconComponent;
+    MoreHorizontal: StyledLucideIconComponent;
+    MousePointerClick: StyledLucideIconComponent;
+    PanelLeft: StyledLucideIconComponent;
+    PanelsTopLeft: StyledLucideIconComponent;
+    Pencil: StyledLucideIconComponent;
+    Pi: StyledLucideIconComponent;
+    Palette: StyledLucideIconComponent;
+    ReceiptText: StyledLucideIconComponent;
+    Regex: StyledLucideIconComponent;
+    Replace: StyledLucideIconComponent;
+    Rss: StyledLucideIconComponent;
+    Scale: StyledLucideIconComponent;
+    Search: StyledLucideIconComponent;
+    Share: StyledLucideIconComponent;
+    ShieldUser: StyledLucideIconComponent;
+    SquareDashedBottomCode: StyledLucideIconComponent;
+    SquareTerminal: StyledLucideIconComponent;
+    Server: StyledLucideIconComponent;
+    SplinePointer: StyledLucideIconComponent;
+    Sparkles: StyledLucideIconComponent;
+    Star: StyledLucideIconComponent;
+    Tablets: StyledLucideIconComponent;
+    Terminal: StyledLucideIconComponent;
+    Twitter: StyledLucideIconComponent;
+    X: StyledLucideIconComponent;
+    Zap: StyledLucideIconComponent;
+};
+/**
+ * use iconKey to load icon safely
+ * @param iconKey translation or configuration
+ * @param createElement whether to return a React element instead of component
+ */
+declare function getGlobalIcon(iconKey: string | undefined): IconComponent;
+declare function getGlobalIcon(iconKey: string | undefined, createElement: true): React__default.ReactElement | undefined;
+/**
+ * Get icon element (for fumadocs source compatibility)
+ * This is a wrapper around getGlobalIcon for backwards compatibility
+ * @param icon icon key from frontmatter
+ */
+declare function getIconElement(icon: string | undefined): React__default.ReactElement | undefined;
+declare const DefaultSiteIcon: () => react_jsx_runtime.JSX.Element;
+declare const NotFoundIcon: () => react_jsx_runtime.JSX.Element;
+
+declare function GoogleAnalyticsScript(): react_jsx_runtime.JSX.Element | null;
+declare function useGoogleAnalytics(): {
+    trackEvent: (event: string, data?: Record<string, unknown>) => void;
+};
+declare global {
+    interface Window {
+        dataLayer: any[];
+        gtag: (...args: any[]) => void;
+    }
+}
+
+export { DefaultSiteIcon, GoogleAnalyticsScript, NotFoundIcon, NotFoundPage, getGlobalIcon, getIconElement, globalLucideIcons, useGoogleAnalytics };