@tessera-ui/core 0.4.0

package/dist/types/theme/tokens.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Tessera UI — Design Token Definitions
+ *
+ * These are the source-of-truth token definitions.
+ * They feed into Style Dictionary to generate platform-specific outputs
+ * (CSS custom properties, iOS, Android, etc.)
+ */
+export interface TesseraTokens {
+    color: {
+        primary: Record<string, string>;
+        neutral: Record<string, string>;
+        success: Record<string, string>;
+        warning: Record<string, string>;
+        danger: Record<string, string>;
+        info: Record<string, string>;
+    };
+    spacing: Record<string, string>;
+    radius: Record<string, string>;
+    shadow: Record<string, string>;
+    font: {
+        family: Record<string, string>;
+        size: Record<string, string>;
+        weight: Record<string, number>;
+        lineHeight: Record<string, number>;
+    };
+    transition: Record<string, string>;
+    zIndex: Record<string, number>;
+}
+export declare const tokens: TesseraTokens;

package/dist/types/types/index.d.ts

@@ -0,0 +1,36 @@
+/**
+ * Tessera UI — Shared Types
+ */
+/** Standard component sizes used across the library */
+export type TsSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+/** Semantic color variants */
+export type TsVariant = 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' | 'neutral';
+/** Button-style visual weight */
+export type TsAppearance = 'solid' | 'outline' | 'ghost' | 'link';
+/** Standard orientation */
+export type TsOrientation = 'horizontal' | 'vertical';
+/** Placement positions (for tooltips, popovers, etc.) */
+export type TsPlacement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+/** Shared event detail for value-change events */
+export interface TsChangeEventDetail<T = unknown> {
+    value: T;
+    previousValue: T;
+}
+/** Shared event detail for toggle events */
+export interface TsToggleEventDetail {
+    checked: boolean;
+}
+/** Shared event detail for checkbox/radio change events */
+export interface TsCheckboxChangeEventDetail {
+    checked: boolean;
+    value: string;
+}
+/** Shared event detail for select change events */
+export interface TsSelectChangeEventDetail {
+    value: string;
+}
+/** Shared event detail for form validation */
+export interface TsValidationEventDetail {
+    valid: boolean;
+    message: string;
+}

package/dist/types/utils/aria.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Tessera UI — Accessibility Utilities
+ *
+ * Helpers for consistent ARIA patterns across components.
+ */
+export declare function generateId(prefix?: string): string;
+/** Reset ID counter (for testing) */
+export declare function resetIdCounter(): void;
+/**
+ * Announce a message to screen readers via a live region.
+ * Creates a temporary `aria-live` element, inserts the message,
+ * and removes it after the AT has time to read it.
+ */
+export declare function announce(message: string, priority?: 'polite' | 'assertive'): void;
+/**
+ * Check if the user prefers reduced motion.
+ */
+export declare function prefersReducedMotion(): boolean;
+/**
+ * Trap focus within a container element.
+ * Returns a cleanup function to remove the trap.
+ */
+export declare function trapFocus(container: HTMLElement): () => void;

package/dist/types/utils/dom.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Tessera UI — DOM Utilities
+ */
+/**
+ * Get the closest Tessera UI host element from within a shadow tree.
+ */
+export declare function getHostElement(el: Element): HTMLElement | null;
+/**
+ * Check if a slot has assigned content.
+ */
+export declare function hasSlotContent(el: HTMLElement, slotName?: string): boolean;
+/**
+ * Debounce a function call.
+ */
+export declare function debounce<T extends (...args: unknown[]) => void>(fn: T, delay: number): (...args: Parameters<T>) => void;
+/**
+ * Clamp a number between min and max.
+ */
+export declare function clamp(value: number, min: number, max: number): number;

package/dist/types/utils/events.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Tessera UI — Event Utilities
+ *
+ * Helpers for consistent custom event dispatch across components.
+ * All Tessera UI events bubble and are composed (cross shadow boundaries).
+ */
+export interface TsEventOptions<T> {
+    detail: T;
+    bubbles?: boolean;
+    composed?: boolean;
+    cancelable?: boolean;
+}
+/**
+ * Create and dispatch a custom event from an element.
+ * Returns true if the event was NOT cancelled.
+ */
+export declare function emitEvent<T>(el: HTMLElement, eventName: string, options: TsEventOptions<T>): boolean;

package/loader/cdn.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.cjs.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.d.ts

@@ -0,0 +1,24 @@
+export * from '../dist/types/components';
+export interface CustomElementsDefineOptions {
+  exclude?: string[];
+  resourcesUrl?: string;
+  syncQueue?: boolean;
+  jmp?: (c: Function) => any;
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): void;
+/**
+ * @deprecated
+ */
+export declare function applyPolyfills(): Promise<void>;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare function setNonce(nonce: string): void;

package/loader/index.es2017.js

@@ -0,0 +1 @@
+export * from '../dist/esm/loader.js';

package/loader/index.js

@@ -0,0 +1,2 @@
+(function(){if("undefined"!==typeof window&&void 0!==window.Reflect&&void 0!==window.customElements){var a=HTMLElement;window.HTMLElement=function(){return Reflect.construct(a,[],this.constructor)};HTMLElement.prototype=a.prototype;HTMLElement.prototype.constructor=HTMLElement;Object.setPrototypeOf(HTMLElement,a)}})();
+export * from '../dist/esm/loader.js';

package/package.json

@@ -0,0 +1,79 @@
+{
+  "name": "@tessera-ui/core",
+  "version": "0.4.0",
+  "description": "Framework-agnostic web component library built with Stencil",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.js",
+  "types": "dist/types/index.d.ts",
+  "collection": "dist/collection/collection-manifest.json",
+  "collection:main": "dist/collection/index.js",
+  "unpkg": "dist/tessera-ui/tessera-ui.esm.js",
+  "files": [
+    "dist/",
+    "loader/"
+  ],
+  "dependencies": {
+    "lucide": "^0.511.0"
+  },
+  "devDependencies": {
+    "@stencil/angular-output-target": "^1.3.0",
+    "@stencil/core": "^4.43.3",
+    "@stencil/react-output-target": "^1.4.2",
+    "@stencil/sass": "^3.2.3",
+    "@stencil/vue-output-target": "^0.13.1",
+    "@storybook/addon-a11y": "^10.3.1",
+    "@storybook/html": "^10.3.1",
+    "@storybook/html-vite": "^10.3.1",
+    "@types/jest": "^29.5.14",
+    "@typescript-eslint/eslint-plugin": "^8.57.1",
+    "@typescript-eslint/parser": "^8.57.1",
+    "concurrently": "^9.2.1",
+    "eslint": "^10.1.0",
+    "jest": "^29.7.0",
+    "jest-cli": "^29.7.0",
+    "lerna": "^9.0.7",
+    "playwright": "^1.58.2",
+    "prettier": "^3.8.1",
+    "puppeteer": "^20.9.0",
+    "storybook": "^10.3.1",
+    "typescript": "^5.9.3",
+    "vite": "^8.0.1"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/jkguidaven/tessera-ui"
+  },
+  "keywords": [
+    "web-components",
+    "stencil",
+    "component-library",
+    "design-system",
+    "react",
+    "vue",
+    "angular",
+    "framework-agnostic"
+  ],
+  "scripts": {
+    "build": "stencil build && node -e \"const fs=require('fs');const p='dist/types/index.d.ts';fs.appendFileSync(p,'\\nexport * from \\\"./components\\\";\\n')\"",
+    "build.watch": "stencil build --watch",
+    "start": "stencil build && concurrently \"stencil build --watch\" \"storybook dev -p 6006 --ci\" --names stencil,storybook --prefix-colors blue,magenta",
+    "test": "stencil test --spec",
+    "test.watch": "stencil test --spec --watchAll",
+    "test.e2e": "stencil test --e2e",
+    "test.all": "stencil test --spec --e2e",
+    "generate": "stencil generate",
+    "generate:react": "stencil build --docs-json dist/components.json && node scripts/generate-react.js",
+    "generate:vue": "stencil build --docs-json dist/components.json && node scripts/generate-vue.js",
+    "generate:angular": "stencil build --docs-json dist/components.json && node scripts/generate-angular.js",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "docs": "stencil build && pnpm -C docs dev",
+    "docs:build": "stencil build && pnpm -C docs build",
+    "lint": "eslint src --ext .ts,.tsx",
+    "lint.fix": "eslint src --ext .ts,.tsx --fix",
+    "tokens:build": "node scripts/build-tokens.js",
+    "version:bump": "lerna version --no-push --yes",
+    "publish:packages": "pnpm build && pnpm -r --filter='!@tessera-ui/docs' run build && pnpm -r --filter='!@tessera-ui/docs' publish --access public --no-git-checks"
+  }
+}