@weeehaoooz/talos-ui 0.1.0

package/package.json

@@ -0,0 +1,203 @@
+{
+  "name": "@weeehaoooz/talos-ui",
+  "version": "0.1.0",
+  "description": "A modern, high-performance, and accessible UI component library for Angular 20+",
+  "license": "MIT",
+  "author": "weeehaoooz",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/weeehaoooz/talos-ui.git",
+    "directory": "projects/talos-ui"
+  },
+  "keywords": [
+    "angular",
+    "signals",
+    "components",
+    "ui",
+    "design-system",
+    "accessible",
+    "talos"
+  ],
+  "peerDependencies": {
+    "@angular/common": "^22.0.0",
+    "@angular/core": "^22.0.0",
+    "@angular/forms": "^22.0.0",
+    "@angular/router": "^22.0.0",
+    "@angular/cdk": "^22.0.0",
+    "@lucide/angular": "^1.31.0",
+    "date-fns": "^4.1.0",
+    "rxjs": "~7.8.0"
+  },
+  "schematics": "./schematics/collection.json",
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "module": "fesm2022/weeehaoooz-talos-ui.mjs",
+  "typings": "types/weeehaoooz-talos-ui.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./types/weeehaoooz-talos-ui.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui.mjs"
+    },
+    "./button/button": {
+      "types": "./types/weeehaoooz-talos-ui-button-button.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-button-button.mjs"
+    },
+    "./button/button-group": {
+      "types": "./types/weeehaoooz-talos-ui-button-button-group.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-button-button-group.mjs"
+    },
+    "./core": {
+      "types": "./types/weeehaoooz-talos-ui-core.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-core.mjs"
+    },
+    "./data-display/badge": {
+      "types": "./types/weeehaoooz-talos-ui-data-display-badge.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-data-display-badge.mjs"
+    },
+    "./data-display/status-tag": {
+      "types": "./types/weeehaoooz-talos-ui-data-display-status-tag.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-data-display-status-tag.mjs"
+    },
+    "./data-display/timeline": {
+      "types": "./types/weeehaoooz-talos-ui-data-display-timeline.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-data-display-timeline.mjs"
+    },
+    "./data-display/trend-indicator": {
+      "types": "./types/weeehaoooz-talos-ui-data-display-trend-indicator.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-data-display-trend-indicator.mjs"
+    },
+    "./data-viz/category-bar": {
+      "types": "./types/weeehaoooz-talos-ui-data-viz-category-bar.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-data-viz-category-bar.mjs"
+    },
+    "./data-viz/heatmap": {
+      "types": "./types/weeehaoooz-talos-ui-data-viz-heatmap.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-data-viz-heatmap.mjs"
+    },
+    "./data-viz/mini-donut": {
+      "types": "./types/weeehaoooz-talos-ui-data-viz-mini-donut.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-data-viz-mini-donut.mjs"
+    },
+    "./data-viz/mini-gauge": {
+      "types": "./types/weeehaoooz-talos-ui-data-viz-mini-gauge.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-data-viz-mini-gauge.mjs"
+    },
+    "./data-viz/sparkline": {
+      "types": "./types/weeehaoooz-talos-ui-data-viz-sparkline.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-data-viz-sparkline.mjs"
+    },
+    "./feedback/alert": {
+      "types": "./types/weeehaoooz-talos-ui-feedback-alert.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-feedback-alert.mjs"
+    },
+    "./feedback/dialog": {
+      "types": "./types/weeehaoooz-talos-ui-feedback-dialog.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-feedback-dialog.mjs"
+    },
+    "./feedback/snackbar": {
+      "types": "./types/weeehaoooz-talos-ui-feedback-snackbar.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-feedback-snackbar.mjs"
+    },
+    "./feedback/tooltip": {
+      "types": "./types/weeehaoooz-talos-ui-feedback-tooltip.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-feedback-tooltip.mjs"
+    },
+    "./form/affix": {
+      "types": "./types/weeehaoooz-talos-ui-form-affix.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-affix.mjs"
+    },
+    "./form/autocomplete": {
+      "types": "./types/weeehaoooz-talos-ui-form-autocomplete.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-autocomplete.mjs"
+    },
+    "./form/checkbox": {
+      "types": "./types/weeehaoooz-talos-ui-form-checkbox.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-checkbox.mjs"
+    },
+    "./form/chips": {
+      "types": "./types/weeehaoooz-talos-ui-form-chips.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-chips.mjs"
+    },
+    "./form/color-picker": {
+      "types": "./types/weeehaoooz-talos-ui-form-color-picker.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-color-picker.mjs"
+    },
+    "./form/date-picker": {
+      "types": "./types/weeehaoooz-talos-ui-form-date-picker.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-date-picker.mjs"
+    },
+    "./form/date-range-picker": {
+      "types": "./types/weeehaoooz-talos-ui-form-date-range-picker.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-date-range-picker.mjs"
+    },
+    "./form/date-time-picker": {
+      "types": "./types/weeehaoooz-talos-ui-form-date-time-picker.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-date-time-picker.mjs"
+    },
+    "./form/date-time-range-picker": {
+      "types": "./types/weeehaoooz-talos-ui-form-date-time-range-picker.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-date-time-range-picker.mjs"
+    },
+    "./form/drop-zone": {
+      "types": "./types/weeehaoooz-talos-ui-form-drop-zone.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-drop-zone.mjs"
+    },
+    "./form/form-field": {
+      "types": "./types/weeehaoooz-talos-ui-form-form-field.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-form-field.mjs"
+    },
+    "./form/input": {
+      "types": "./types/weeehaoooz-talos-ui-form-input.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-input.mjs"
+    },
+    "./form/otp": {
+      "types": "./types/weeehaoooz-talos-ui-form-otp.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-otp.mjs"
+    },
+    "./form/password-input": {
+      "types": "./types/weeehaoooz-talos-ui-form-password-input.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-password-input.mjs"
+    },
+    "./form/radio": {
+      "types": "./types/weeehaoooz-talos-ui-form-radio.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-radio.mjs"
+    },
+    "./form/range-input": {
+      "types": "./types/weeehaoooz-talos-ui-form-range-input.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-range-input.mjs"
+    },
+    "./form/rating": {
+      "types": "./types/weeehaoooz-talos-ui-form-rating.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-rating.mjs"
+    },
+    "./form/select-input": {
+      "types": "./types/weeehaoooz-talos-ui-form-select-input.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-select-input.mjs"
+    },
+    "./form/slide-toggle": {
+      "types": "./types/weeehaoooz-talos-ui-form-slide-toggle.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-slide-toggle.mjs"
+    },
+    "./form/transfer-list": {
+      "types": "./types/weeehaoooz-talos-ui-form-transfer-list.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-form-transfer-list.mjs"
+    },
+    "./layout": {
+      "types": "./types/weeehaoooz-talos-ui-layout.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-layout.mjs"
+    },
+    "./nav": {
+      "types": "./types/weeehaoooz-talos-ui-nav.d.ts",
+      "default": "./fesm2022/weeehaoooz-talos-ui-nav.mjs"
+    }
+  },
+  "sideEffects": false,
+  "type": "module"
+}

package/schematics/collection.json

@@ -0,0 +1,10 @@
+{
+  "$schema": "../../../node_modules/@angular-devkit/schematics/collection-schema.json",
+  "schematics": {
+    "ng-add": {
+      "description": "Add @weeehaoooz/talos-ui to your Angular project, configure styles and install dependencies.",
+      "factory": "./ng-add/index",
+      "schema": "./ng-add/schema.json"
+    }
+  }
+}

package/schematics/ng-add/index.d.ts

@@ -0,0 +1,3 @@
+import { Rule } from '@angular-devkit/schematics';
+import { Schema } from './schema';
+export default function (options: Schema): Rule;

package/schematics/ng-add/index.js

@@ -0,0 +1,99 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = default_1;
+const schematics_1 = require("@angular-devkit/schematics");
+const tasks_1 = require("@angular-devkit/schematics/tasks");
+const dependencies_1 = require("@schematics/angular/utility/dependencies");
+const TALOS_PEER_DEPENDENCIES = [
+    { name: '@angular/cdk', version: '^22.1.1', type: dependencies_1.NodeDependencyType.Default },
+    { name: '@lucide/angular', version: '^1.31.0', type: dependencies_1.NodeDependencyType.Default },
+    { name: 'date-fns', version: '^4.1.0', type: dependencies_1.NodeDependencyType.Default },
+    { name: 'rxjs', version: '~7.8.0', type: dependencies_1.NodeDependencyType.Default }
+];
+function addDependencies(options) {
+    return (tree, context) => {
+        if (options.skipPackageJson) {
+            return tree;
+        }
+        let hasAddedDependency = false;
+        for (const dep of TALOS_PEER_DEPENDENCIES) {
+            const existing = (0, dependencies_1.getPackageJsonDependency)(tree, dep.name);
+            if (!existing) {
+                (0, dependencies_1.addPackageJsonDependency)(tree, {
+                    type: dep.type,
+                    name: dep.name,
+                    version: dep.version,
+                    overwrite: false
+                });
+                hasAddedDependency = true;
+                context.logger.info(`  ✔ Added dependency: ${dep.name} (${dep.version})`);
+            }
+        }
+        if (hasAddedDependency) {
+            context.addTask(new tasks_1.NodePackageInstallTask());
+            context.logger.info('  📦 Scheduling package manager installation...');
+        }
+        return tree;
+    };
+}
+function addStyles(options) {
+    return (tree, context) => {
+        if (options.addStyles === false) {
+            return tree;
+        }
+        const scssPath = 'src/styles.scss';
+        const cssPath = 'src/styles.css';
+        const scssImport = "@use '@weeehaoooz/talos-ui/styles/index';\n";
+        const cssImport = "@import '@weeehaoooz/talos-ui/styles/index.scss';\n";
+        if (tree.exists(scssPath)) {
+            const content = tree.readText(scssPath);
+            if (!content.includes('@weeehaoooz/talos-ui/styles') && !content.includes('@talos/components/styles')) {
+                tree.overwrite(scssPath, `${scssImport}${content}`);
+                context.logger.info(`  ✔ Added Talos SCSS import to ${scssPath}`);
+            }
+        }
+        else if (tree.exists(cssPath)) {
+            const content = tree.readText(cssPath);
+            if (!content.includes('@weeehaoooz/talos-ui/styles') && !content.includes('@talos/components/styles')) {
+                tree.overwrite(cssPath, `${cssImport}${content}`);
+                context.logger.info(`  ✔ Added Talos styles import to ${cssPath}`);
+            }
+        }
+        return tree;
+    };
+}
+function applyTheme(options) {
+    return (tree, context) => {
+        if (options.theme !== 'dark') {
+            return tree;
+        }
+        const indexPath = 'src/index.html';
+        if (tree.exists(indexPath)) {
+            let content = tree.readText(indexPath);
+            if (!content.includes('data-theme=')) {
+                content = content.replace('<html', '<html data-theme="dark"');
+                tree.overwrite(indexPath, content);
+                context.logger.info(`  ✔ Enabled dark theme (data-theme="dark") in ${indexPath}`);
+            }
+        }
+        return tree;
+    };
+}
+function logSummary() {
+    return (tree, context) => {
+        context.logger.info('');
+        context.logger.info('✨ @weeehaoooz/talos-ui has been successfully configured!');
+        context.logger.info('   You can now import any component from @weeehaoooz/talos-ui (e.g. TalosButtonDirective).');
+        context.logger.info('   For documentation & AI tooling, run: npm run mcp:build');
+        context.logger.info('');
+        return tree;
+    };
+}
+function default_1(options) {
+    return (0, schematics_1.chain)([
+        addDependencies(options),
+        addStyles(options),
+        applyTheme(options),
+        logSummary()
+    ]);
+}

package/schematics/ng-add/schema.d.ts

@@ -0,0 +1,10 @@
+export interface Schema {
+    /** Name of the project to configure. */
+    project?: string;
+    /** Automatically configure Talos global styles and design tokens. */
+    addStyles?: boolean;
+    /** Color theme mode. */
+    theme?: 'light' | 'dark' | 'system';
+    /** Skip adding peer dependencies to package.json. */
+    skipPackageJson?: boolean;
+}

package/schematics/ng-add/schema.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/schematics/ng-add/schema.json

@@ -0,0 +1,52 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "$id": "TalosNgAddSchema",
+  "title": "Talos ng-add Schema",
+  "type": "object",
+  "properties": {
+    "project": {
+      "type": "string",
+      "description": "The name of the project."
+    },
+    "addStyles": {
+      "type": "boolean",
+      "default": true,
+      "description": "Automatically configure Talos global SCSS styles and design tokens.",
+      "x-prompt": "Would you like to automatically add Talos global styles and design tokens to your project?"
+    },
+    "theme": {
+      "type": "string",
+      "enum": [
+        "light",
+        "dark",
+        "system"
+      ],
+      "default": "light",
+      "description": "Default theme mode for the application.",
+      "x-prompt": {
+        "message": "Which default color theme would you like to configure?",
+        "type": "list",
+        "items": [
+          {
+            "value": "light",
+            "label": "Light Theme (Default)"
+          },
+          {
+            "value": "dark",
+            "label": "Dark Theme (data-theme=\"dark\")"
+          },
+          {
+            "value": "system",
+            "label": "System / Custom"
+          }
+        ]
+      }
+    },
+    "skipPackageJson": {
+      "type": "boolean",
+      "default": false,
+      "description": "Do not automatically add peer dependencies to package.json."
+    }
+  },
+  "additionalProperties": false
+}

package/styles/_alert.scss

@@ -0,0 +1,56 @@
+/* ==========================================================================
+   Talos UI Alert Tokens & Styles
+   ========================================================================== */
+
+:root {
+  --talos-alert-radius: var(--talos-radius-lg);
+  --talos-alert-shadow: var(--talos-shadow-xs);
+
+  /* Alert Sizing */
+  --talos-alert-padding-sm: 0.5rem 0.75rem;
+  --talos-alert-padding-md: 0.75rem 1rem;
+  --talos-alert-padding-lg: 1rem 1.25rem;
+  --talos-alert-gap: 0.75rem;
+
+  /* Default Variant (Neutral) */
+  --talos-alert-default-bg: var(--talos-neutral-subtle-bg);
+  --talos-alert-default-border: var(--talos-neutral-subtle-border);
+  --talos-alert-default-text: var(--talos-neutral-text);
+  --talos-alert-default-icon: var(--talos-neutral);
+
+  /* Info Variant */
+  --talos-alert-info-bg: var(--talos-info-subtle-bg);
+  --talos-alert-info-border: var(--talos-info-subtle-border);
+  --talos-alert-info-text: var(--talos-info-text);
+  --talos-alert-info-icon: var(--talos-info);
+
+  /* Success Variant */
+  --talos-alert-success-bg: var(--talos-success-subtle-bg);
+  --talos-alert-success-border: var(--talos-success-subtle-border);
+  --talos-alert-success-text: var(--talos-success-text);
+  --talos-alert-success-icon: var(--talos-success);
+
+  /* Warning Variant */
+  --talos-alert-warning-bg: var(--talos-warning-subtle-bg);
+  --talos-alert-warning-border: var(--talos-warning-subtle-border);
+  --talos-alert-warning-text: var(--talos-warning-text);
+  --talos-alert-warning-icon: var(--talos-warning);
+
+  /* Error / High Variant */
+  --talos-alert-error-bg: var(--talos-danger-subtle-bg);
+  --talos-alert-error-border: var(--talos-danger-subtle-border);
+  --talos-alert-error-text: var(--talos-danger-text);
+  --talos-alert-error-icon: var(--talos-danger);
+
+  /* Critical Variant */
+  --talos-alert-critical-bg: var(--talos-danger-solid-bg);
+  --talos-alert-critical-border: var(--talos-danger-hover);
+  --talos-alert-critical-text: var(--talos-danger-solid-text);
+  --talos-alert-critical-icon: var(--talos-danger-solid-text);
+
+  /* Primary Variant */
+  --talos-alert-primary-bg: var(--talos-primary-subtle-bg);
+  --talos-alert-primary-border: var(--talos-primary-subtle-border);
+  --talos-alert-primary-text: var(--talos-primary-text);
+  --talos-alert-primary-icon: var(--talos-primary);
+}