@tachui/core 0.7.0-alpha1

package/dist/compiler/types.d.ts

@@ -0,0 +1,149 @@
+/**
+ * TypeScript definitions for the TachUI compiler system
+ */
+export interface TachUIPluginOptions {
+    /**
+     * File extensions to transform (default: ['.tsx', '.ts'])
+     */
+    include?: string[];
+    /**
+     * File patterns to exclude from transformation
+     */
+    exclude?: string[];
+    /**
+     * Enable development mode optimizations
+     */
+    dev?: boolean;
+    /**
+     * Custom transformer options
+     */
+    transform?: TransformOptions;
+}
+export interface TransformOptions {
+    /**
+     * Enable tree-shaking optimizations
+     */
+    treeShaking?: boolean;
+    /**
+     * Enable compile-time constant folding
+     */
+    constantFolding?: boolean;
+    /**
+     * Generate source maps
+     */
+    sourceMaps?: boolean;
+    /**
+     * Target output format
+     */
+    target?: 'es2020' | 'es2022' | 'esnext';
+}
+/**
+ * AST Node types for SwiftUI syntax parsing
+ */
+export interface ASTNode {
+    type: string;
+    loc?: SourceLocation;
+}
+export interface SourceLocation {
+    start: Position;
+    end: Position;
+    source?: string;
+}
+export interface Position {
+    line: number;
+    column: number;
+    offset: number;
+}
+/**
+ * SwiftUI Component AST Nodes
+ */
+export interface ComponentNode extends ASTNode {
+    type: 'Component';
+    name: string;
+    children: ASTNode[];
+    modifiers: ModifierNode[];
+}
+export interface ModifierNode extends ASTNode {
+    type: 'Modifier';
+    name: string;
+    arguments: Expression[];
+}
+export interface Expression extends ASTNode {
+    type: 'Literal' | 'Identifier' | 'CallExpression' | 'ArrowFunction' | 'MemberExpression' | 'ArrayExpression';
+}
+/**
+ * Advanced AST Node Types (Phase 2.1.2)
+ */
+export interface ConditionalNode extends ASTNode {
+    type: 'Conditional';
+    condition: Expression;
+    thenBody: ASTNode[];
+    elseBody?: ASTNode[] | undefined;
+}
+export interface ForEachNode extends ASTNode {
+    type: 'ForEach';
+    iterable: Expression;
+    itemIdentifier: string;
+    body: ASTNode[];
+}
+export interface StateBindingNode extends ASTNode {
+    type: 'StateBinding';
+    identifier: string;
+    initialValue?: Expression;
+}
+export interface PropertyWrapperNode extends ASTNode {
+    type: 'PropertyWrapper';
+    wrapper: 'State' | 'Computed' | 'Effect';
+    identifier: string;
+    initialValue?: Expression | undefined;
+}
+export interface CallExpressionNode extends Expression {
+    type: 'CallExpression';
+    callee: Expression;
+    arguments: Expression[];
+}
+export interface MemberExpressionNode extends Expression {
+    type: 'MemberExpression';
+    object: string;
+    property: string;
+}
+export interface ArrayExpressionNode extends Expression {
+    type: 'ArrayExpression';
+    elements: Expression[];
+}
+export interface LiteralExpression extends Expression {
+    type: 'Literal';
+    value: string | number | boolean;
+    raw: string;
+}
+export interface IdentifierExpression extends Expression {
+    type: 'Identifier';
+    name: string;
+}
+/**
+ * Layout component types
+ */
+export type LayoutComponent = 'VStack' | 'HStack' | 'ZStack' | 'List' | 'Form';
+/**
+ * UI component types
+ */
+export type UIComponent = 'Text' | 'Button' | 'Image' | 'TextField' | 'Toggle';
+/**
+ * Modifier types
+ */
+export interface ModifierMapping {
+    padding: (value?: number | string) => string;
+    background: (color: string) => string;
+    foregroundColor: (color: string) => string;
+    font: (size: string | number) => string;
+    border: (width: number, color: string) => string;
+    cornerRadius: (radius: number) => string;
+    shadow: (radius: number, offset?: {
+        x: number;
+        y: number;
+    }) => string;
+    opacity: (value: number) => string;
+    frame: (width?: number, height?: number) => string;
+    onTapGesture: (handler: () => void) => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/compiler/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/compiler/types.ts"],"names":[],"mappings":"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"}

package/dist/components/BasicInput.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../reactive/cleanup.cjs");require("../reactive/unified-scheduler.cjs");const h=require("../reactive/effect.cjs"),r=require("../reactive/signal.cjs");require("../reactive/scheduler.cjs");require("../reactive/theme.cjs");require("../runtime/component.cjs");require("../runtime/context.cjs");require("../runtime/dev-tools.cjs");require("../runtime/dom-bridge.cjs");require("../runtime/error-boundary.cjs");require("../runtime/error-reporting.cjs");require("../runtime/performance.cjs");const b=require("../runtime/renderer.cjs");require("../runtime/element-override.cjs");require("../runtime/semantic-role-manager.cjs");require("../runtime/development-warnings.cjs");const g=require("./wrapper.cjs");require("../css-classes/css-class-manager.cjs");const f=require("../css-classes/component-base.cjs");var y=Object.defineProperty,S=(t,e,s)=>e in t?y(t,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[e]=s,i=(t,e,s)=>S(t,typeof e!="symbol"?e+"":e,s);const o={colors:{background:"#FFFFFF",border:"#D1D1D6",text:"#000000",placeholder:"#8E8E93",focusBorder:"#007AFF",disabledBackground:"#F2F2F7",disabledText:"#8E8E93"},spacing:{padding:8,borderWidth:1},borderRadius:4,fontSize:16,fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',transition:"border-color 0.2s ease, background-color 0.2s ease"};class u extends f.ComponentWithCSSClasses{constructor(e){super(),i(this,"type","component"),i(this,"id"),i(this,"props"),i(this,"theme",o),i(this,"inputElement",null),i(this,"handleInput",s=>{const n=s.target.value;this.setText(n),this.props.onChange&&this.props.onChange(n)}),i(this,"handleKeyDown",s=>{s.key==="Enter"&&this.props.onSubmit&&(s.preventDefault(),this.props.onSubmit(this.getText()))}),i(this,"handleFocus",()=>{this.props.onFocus&&this.props.onFocus(),this.inputElement&&(this.inputElement.style.borderColor=this.theme.colors.focusBorder)}),i(this,"handleBlur",()=>{this.props.onBlur&&this.props.onBlur(),this.inputElement&&(this.inputElement.style.borderColor=this.theme.colors.border)}),this.props=e,this.id=`basicinput-${Date.now()}-${Math.random().toString(36).substr(2,9)}`}resolveValue(e){return r.isSignal(e)?e():e}getText(){return this.resolveValue(this.props.text)}setText(e){this.props.setText&&this.props.setText(e)}getPlaceholder(){return this.resolveValue(this.props.placeholder||"")}getInputType(){return this.resolveValue(this.props.inputType||"text")}isDisabled(){return this.resolveValue(this.props.disabled||!1)}isReadonly(){return this.resolveValue(this.props.readonly||!1)}getInputStyles(){const e=this.isDisabled();return{width:"100%",padding:`${this.theme.spacing.padding}px`,border:`${this.theme.spacing.borderWidth}px solid ${this.theme.colors.border}`,borderRadius:`${this.theme.borderRadius}px`,backgroundColor:e?this.theme.colors.disabledBackground:this.theme.colors.background,color:e?this.theme.colors.disabledText:this.theme.colors.text,fontSize:`${this.theme.fontSize}px`,fontFamily:this.theme.fontFamily,outline:"none",transition:this.theme.transition,cursor:e?"not-allowed":"text"}}render(){const e=this.getText(),s=this.getPlaceholder(),l=this.getInputType(),n=this.isDisabled(),d=this.isReadonly(),c=["tachui-basic-input"],m=this.createClassString(this.props,c),p=b.h("input",{id:this.id,className:m,type:l,value:e,placeholder:s,disabled:n,readonly:d,"aria-label":this.props.accessibilityLabel,"aria-describedby":this.props.accessibilityHint?`${this.id}-hint`:void 0,style:this.getInputStyles(),oninput:this.handleInput,onkeydown:this.handleKeyDown,onfocus:this.handleFocus,onblur:this.handleBlur});return this.inputElement=p.element,h.createEffect(()=>{if(this.inputElement&&r.isSignal(this.props.text)){const a=this.getText();this.inputElement.value!==a&&(this.inputElement.value=a)}}),h.createEffect(()=>{this.inputElement&&(r.isSignal(this.props.placeholder)||r.isSignal(this.props.inputType)||r.isSignal(this.props.disabled))&&(r.isSignal(this.props.placeholder)&&(this.inputElement.placeholder=this.getPlaceholder()),r.isSignal(this.props.inputType)&&(this.inputElement.type=this.getInputType()),r.isSignal(this.props.disabled)&&(this.inputElement.disabled=this.isDisabled()))}),[p]}}function T(t){return g.withModifiers(new u(t))}const E={search(t,e,s){return{text:t,setText:e,inputType:"search",placeholder:"Search...",onSubmit:s}},email(t,e){return{text:t,setText:e,inputType:"email",placeholder:"Enter email address"}},password(t,e){return{text:t,setText:e,inputType:"password",placeholder:"Enter password"}},phone(t,e){return{text:t,setText:e,inputType:"tel",placeholder:"Enter phone number"}}},x={theme:o,createTheme(t){return{...o,...t}}};exports.BasicInput=T;exports.BasicInputComponent=u;exports.BasicInputStyles=x;exports.BasicInputUtils=E;
+//# sourceMappingURL=BasicInput.cjs.map

package/dist/components/BasicInput.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasicInput.cjs","sources":["../../src/components/BasicInput.ts"],"sourcesContent":["/**\n * BasicInput Component (Phase 1)\n *\n * Lightweight text input component for Core-only applications.\n * Provides SwiftUI-style reactive binding without the complexity\n * of the Forms plugin validation and formatting system.\n */\n\nimport type { ModifiableComponent, ModifierBuilder } from '../modifiers/types'\nimport { createEffect, isSignal } from '../reactive'\nimport type { Signal } from '../reactive/types'\nimport { h } from '../runtime'\nimport type { ComponentInstance, ComponentProps, DOMNode } from '../runtime/types'\nimport { withModifiers } from './wrapper'\nimport {\n  ComponentWithCSSClasses,\n  type CSSClassesProps\n} from '../css-classes'\n\n/**\n * BasicInput supported input types\n */\nexport type BasicInputType = 'text' | 'email' | 'password' | 'search' | 'tel' | 'url'\n\n/**\n * BasicInput component properties with CSS classes support\n */\nexport interface BasicInputProps extends ComponentProps, CSSClassesProps {\n  // Core reactive binding\n  text: Signal<string>\n  setText?: (value: string) => void\n\n  // Input configuration\n  placeholder?: string | Signal<string>\n  inputType?: BasicInputType | Signal<BasicInputType>\n  disabled?: boolean | Signal<boolean>\n  readonly?: boolean | Signal<boolean>\n\n  // Behavior\n  onChange?: (text: string) => void\n  onSubmit?: (text: string) => void\n  onFocus?: () => void\n  onBlur?: () => void\n\n  // Accessibility\n  accessibilityLabel?: string\n  accessibilityHint?: string\n}\n\n/**\n * BasicInput theme configuration\n */\nexport interface BasicInputTheme {\n  colors: {\n    background: string\n    border: string\n    text: string\n    placeholder: string\n    focusBorder: string\n    disabledBackground: string\n    disabledText: string\n  }\n  spacing: {\n    padding: number\n    borderWidth: number\n  }\n  borderRadius: number\n  fontSize: number\n  fontFamily: string\n  transition: string\n}\n\n/**\n * Default BasicInput theme\n */\nconst defaultBasicInputTheme: BasicInputTheme = {\n  colors: {\n    background: '#FFFFFF',\n    border: '#D1D1D6',\n    text: '#000000',\n    placeholder: '#8E8E93',\n    focusBorder: '#007AFF',\n    disabledBackground: '#F2F2F7',\n    disabledText: '#8E8E93',\n  },\n  spacing: {\n    padding: 8,\n    borderWidth: 1,\n  },\n  borderRadius: 4,\n  fontSize: 16,\n  fontFamily: '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif',\n  transition: 'border-color 0.2s ease, background-color 0.2s ease',\n}\n\n/**\n * BasicInput component implementation with CSS classes support\n */\nexport class BasicInputComponent extends ComponentWithCSSClasses implements ComponentInstance<BasicInputProps> {\n  public readonly type = 'component' as const\n  public readonly id: string\n  public readonly props: BasicInputProps\n  private theme: BasicInputTheme = defaultBasicInputTheme\n  private inputElement: HTMLInputElement | null = null\n\n  constructor(props: BasicInputProps) {\n    super()\n    this.props = props\n    this.id = `basicinput-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`\n  }\n\n  private resolveValue<T>(value: T | Signal<T>): T {\n    return isSignal(value) ? value() : value\n  }\n\n  private getText(): string {\n    return this.resolveValue(this.props.text)\n  }\n\n  private setText(value: string): void {\n    if (this.props.setText) {\n      this.props.setText(value)\n    }\n  }\n\n  private getPlaceholder(): string {\n    return this.resolveValue(this.props.placeholder || '')\n  }\n\n  private getInputType(): BasicInputType {\n    return this.resolveValue(this.props.inputType || 'text')\n  }\n\n  private isDisabled(): boolean {\n    return this.resolveValue(this.props.disabled || false)\n  }\n\n  private isReadonly(): boolean {\n    return this.resolveValue(this.props.readonly || false)\n  }\n\n  private handleInput = (e: Event): void => {\n    const target = e.target as HTMLInputElement\n    const value = target.value\n\n    // Update reactive signal\n    this.setText(value)\n\n    // Call onChange callback\n    if (this.props.onChange) {\n      this.props.onChange(value)\n    }\n  }\n\n  private handleKeyDown = (e: KeyboardEvent): void => {\n    if (e.key === 'Enter' && this.props.onSubmit) {\n      e.preventDefault()\n      this.props.onSubmit(this.getText())\n    }\n  }\n\n  private handleFocus = (): void => {\n    if (this.props.onFocus) {\n      this.props.onFocus()\n    }\n\n    // Update focus border color\n    if (this.inputElement) {\n      this.inputElement.style.borderColor = this.theme.colors.focusBorder\n    }\n  }\n\n  private handleBlur = (): void => {\n    if (this.props.onBlur) {\n      this.props.onBlur()\n    }\n\n    // Reset border color\n    if (this.inputElement) {\n      this.inputElement.style.borderColor = this.theme.colors.border\n    }\n  }\n\n  private getInputStyles(): Record<string, string> {\n    const disabled = this.isDisabled()\n\n    return {\n      width: '100%',\n      padding: `${this.theme.spacing.padding}px`,\n      border: `${this.theme.spacing.borderWidth}px solid ${this.theme.colors.border}`,\n      borderRadius: `${this.theme.borderRadius}px`,\n      backgroundColor: disabled\n        ? this.theme.colors.disabledBackground\n        : this.theme.colors.background,\n      color: disabled ? this.theme.colors.disabledText : this.theme.colors.text,\n      fontSize: `${this.theme.fontSize}px`,\n      fontFamily: this.theme.fontFamily,\n      outline: 'none',\n      transition: this.theme.transition,\n      cursor: disabled ? 'not-allowed' : 'text',\n    }\n  }\n\n  render(): DOMNode[] {\n    const currentText = this.getText()\n    const placeholder = this.getPlaceholder()\n    const inputType = this.getInputType()\n    const disabled = this.isDisabled()\n    const readonly = this.isReadonly()\n\n    // Process CSS classes for this component\n    const baseClasses = ['tachui-basic-input']\n    const classString = this.createClassString(this.props, baseClasses)\n    \n    const input = h('input', {\n      id: this.id,\n      className: classString,\n      type: inputType,\n      value: currentText,\n      placeholder: placeholder,\n      disabled: disabled,\n      readonly: readonly,\n      'aria-label': this.props.accessibilityLabel,\n      'aria-describedby': this.props.accessibilityHint ? `${this.id}-hint` : undefined,\n      style: this.getInputStyles(),\n      oninput: this.handleInput,\n      onkeydown: this.handleKeyDown,\n      onfocus: this.handleFocus,\n      onblur: this.handleBlur,\n    })\n\n    // Store reference to input element\n    this.inputElement = input.element as HTMLInputElement\n\n    // Set up reactive effects for dynamic updates\n    createEffect(() => {\n      if (this.inputElement && isSignal(this.props.text)) {\n        const newValue = this.getText()\n        if (this.inputElement.value !== newValue) {\n          this.inputElement.value = newValue\n        }\n      }\n    })\n\n    createEffect(() => {\n      if (\n        this.inputElement &&\n        (isSignal(this.props.placeholder) ||\n          isSignal(this.props.inputType) ||\n          isSignal(this.props.disabled))\n      ) {\n        // Update placeholder\n        if (isSignal(this.props.placeholder)) {\n          this.inputElement.placeholder = this.getPlaceholder()\n        }\n\n        // Update input type\n        if (isSignal(this.props.inputType)) {\n          this.inputElement.type = this.getInputType()\n        }\n\n        // Update disabled state\n        if (isSignal(this.props.disabled)) {\n          this.inputElement.disabled = this.isDisabled()\n        }\n      }\n    })\n\n    return [input]\n  }\n}\n\n/**\n * Create a BasicInput component\n */\nexport function BasicInput(props: BasicInputProps): ModifiableComponent<BasicInputProps> & {\n  modifier: ModifierBuilder<ModifiableComponent<BasicInputProps>>\n} {\n  return withModifiers(new BasicInputComponent(props))\n}\n\n/**\n * BasicInput utility functions and presets\n */\nexport const BasicInputUtils = {\n  /**\n   * Create a search input\n   */\n  search(\n    text: Signal<string>,\n    setText: (value: string) => void,\n    onSearch?: (query: string) => void\n  ): BasicInputProps {\n    return {\n      text,\n      setText,\n      inputType: 'search',\n      placeholder: 'Search...',\n      onSubmit: onSearch,\n    }\n  },\n\n  /**\n   * Create an email input\n   */\n  email(text: Signal<string>, setText: (value: string) => void): BasicInputProps {\n    return {\n      text,\n      setText,\n      inputType: 'email',\n      placeholder: 'Enter email address',\n    }\n  },\n\n  /**\n   * Create a password input\n   */\n  password(text: Signal<string>, setText: (value: string) => void): BasicInputProps {\n    return {\n      text,\n      setText,\n      inputType: 'password',\n      placeholder: 'Enter password',\n    }\n  },\n\n  /**\n   * Create a phone number input\n   */\n  phone(text: Signal<string>, setText: (value: string) => void): BasicInputProps {\n    return {\n      text,\n      setText,\n      inputType: 'tel',\n      placeholder: 'Enter phone number',\n    }\n  },\n}\n\n/**\n * BasicInput styles and theming\n */\nexport const BasicInputStyles = {\n  theme: defaultBasicInputTheme,\n\n  /**\n   * Create a custom theme\n   */\n  createTheme(overrides: Partial<BasicInputTheme>): BasicInputTheme {\n    return { ...defaultBasicInputTheme, ...overrides }\n  },\n}\n"],"names":["defaultBasicInputTheme","BasicInputComponent","ComponentWithCSSClasses","props","__publicField","e","value","isSignal","disabled","currentText","placeholder","inputType","readonly","baseClasses","classString","input","h","createEffect","newValue","BasicInput","withModifiers","BasicInputUtils","text","setText","onSearch","BasicInputStyles","overrides"],"mappings":"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"}

package/dist/components/BasicInput.d.ts

@@ -0,0 +1,116 @@
+/**
+ * BasicInput Component (Phase 1)
+ *
+ * Lightweight text input component for Core-only applications.
+ * Provides SwiftUI-style reactive binding without the complexity
+ * of the Forms plugin validation and formatting system.
+ */
+import type { ModifiableComponent, ModifierBuilder } from '../modifiers/types';
+import type { Signal } from '../reactive/types';
+import type { ComponentInstance, ComponentProps, DOMNode } from '../runtime/types';
+import { ComponentWithCSSClasses, type CSSClassesProps } from '../css-classes';
+/**
+ * BasicInput supported input types
+ */
+export type BasicInputType = 'text' | 'email' | 'password' | 'search' | 'tel' | 'url';
+/**
+ * BasicInput component properties with CSS classes support
+ */
+export interface BasicInputProps extends ComponentProps, CSSClassesProps {
+    text: Signal<string>;
+    setText?: (value: string) => void;
+    placeholder?: string | Signal<string>;
+    inputType?: BasicInputType | Signal<BasicInputType>;
+    disabled?: boolean | Signal<boolean>;
+    readonly?: boolean | Signal<boolean>;
+    onChange?: (text: string) => void;
+    onSubmit?: (text: string) => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    accessibilityLabel?: string;
+    accessibilityHint?: string;
+}
+/**
+ * BasicInput theme configuration
+ */
+export interface BasicInputTheme {
+    colors: {
+        background: string;
+        border: string;
+        text: string;
+        placeholder: string;
+        focusBorder: string;
+        disabledBackground: string;
+        disabledText: string;
+    };
+    spacing: {
+        padding: number;
+        borderWidth: number;
+    };
+    borderRadius: number;
+    fontSize: number;
+    fontFamily: string;
+    transition: string;
+}
+/**
+ * BasicInput component implementation with CSS classes support
+ */
+export declare class BasicInputComponent extends ComponentWithCSSClasses implements ComponentInstance<BasicInputProps> {
+    readonly type: "component";
+    readonly id: string;
+    readonly props: BasicInputProps;
+    private theme;
+    private inputElement;
+    constructor(props: BasicInputProps);
+    private resolveValue;
+    private getText;
+    private setText;
+    private getPlaceholder;
+    private getInputType;
+    private isDisabled;
+    private isReadonly;
+    private handleInput;
+    private handleKeyDown;
+    private handleFocus;
+    private handleBlur;
+    private getInputStyles;
+    render(): DOMNode[];
+}
+/**
+ * Create a BasicInput component
+ */
+export declare function BasicInput(props: BasicInputProps): ModifiableComponent<BasicInputProps> & {
+    modifier: ModifierBuilder<ModifiableComponent<BasicInputProps>>;
+};
+/**
+ * BasicInput utility functions and presets
+ */
+export declare const BasicInputUtils: {
+    /**
+     * Create a search input
+     */
+    search(text: Signal<string>, setText: (value: string) => void, onSearch?: (query: string) => void): BasicInputProps;
+    /**
+     * Create an email input
+     */
+    email(text: Signal<string>, setText: (value: string) => void): BasicInputProps;
+    /**
+     * Create a password input
+     */
+    password(text: Signal<string>, setText: (value: string) => void): BasicInputProps;
+    /**
+     * Create a phone number input
+     */
+    phone(text: Signal<string>, setText: (value: string) => void): BasicInputProps;
+};
+/**
+ * BasicInput styles and theming
+ */
+export declare const BasicInputStyles: {
+    theme: BasicInputTheme;
+    /**
+     * Create a custom theme
+     */
+    createTheme(overrides: Partial<BasicInputTheme>): BasicInputTheme;
+};
+//# sourceMappingURL=BasicInput.d.ts.map

package/dist/components/BasicInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasicInput.d.ts","sourceRoot":"","sources":["../../src/components/BasicInput.ts"],"names":[],"mappings":"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"}

package/dist/components/BasicInput.js

@@ -0,0 +1,182 @@
+import "../reactive/cleanup.js";
+import "../reactive/unified-scheduler.js";
+import { createEffect as a } from "../reactive/effect.js";
+import { isSignal as r } from "../reactive/signal.js";
+import "../reactive/scheduler.js";
+import "../reactive/theme.js";
+import "../runtime/component.js";
+import "../runtime/context.js";
+import "../runtime/dev-tools.js";
+import "../runtime/dom-bridge.js";
+import "../runtime/error-boundary.js";
+import "../runtime/error-reporting.js";
+import "../runtime/performance.js";
+import { h as m } from "../runtime/renderer.js";
+import "../runtime/element-override.js";
+import "../runtime/semantic-role-manager.js";
+import "../runtime/development-warnings.js";
+import { withModifiers as b } from "./wrapper.js";
+import "../css-classes/css-class-manager.js";
+import { ComponentWithCSSClasses as f } from "../css-classes/component-base.js";
+var g = Object.defineProperty, y = (e, t, s) => t in e ? g(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s, i = (e, t, s) => y(e, typeof t != "symbol" ? t + "" : t, s);
+const n = {
+  colors: {
+    background: "#FFFFFF",
+    border: "#D1D1D6",
+    text: "#000000",
+    placeholder: "#8E8E93",
+    focusBorder: "#007AFF",
+    disabledBackground: "#F2F2F7",
+    disabledText: "#8E8E93"
+  },
+  spacing: {
+    padding: 8,
+    borderWidth: 1
+  },
+  borderRadius: 4,
+  fontSize: 16,
+  fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+  transition: "border-color 0.2s ease, background-color 0.2s ease"
+};
+class T extends f {
+  constructor(t) {
+    super(), i(this, "type", "component"), i(this, "id"), i(this, "props"), i(this, "theme", n), i(this, "inputElement", null), i(this, "handleInput", (s) => {
+      const o = s.target.value;
+      this.setText(o), this.props.onChange && this.props.onChange(o);
+    }), i(this, "handleKeyDown", (s) => {
+      s.key === "Enter" && this.props.onSubmit && (s.preventDefault(), this.props.onSubmit(this.getText()));
+    }), i(this, "handleFocus", () => {
+      this.props.onFocus && this.props.onFocus(), this.inputElement && (this.inputElement.style.borderColor = this.theme.colors.focusBorder);
+    }), i(this, "handleBlur", () => {
+      this.props.onBlur && this.props.onBlur(), this.inputElement && (this.inputElement.style.borderColor = this.theme.colors.border);
+    }), this.props = t, this.id = `basicinput-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
+  }
+  resolveValue(t) {
+    return r(t) ? t() : t;
+  }
+  getText() {
+    return this.resolveValue(this.props.text);
+  }
+  setText(t) {
+    this.props.setText && this.props.setText(t);
+  }
+  getPlaceholder() {
+    return this.resolveValue(this.props.placeholder || "");
+  }
+  getInputType() {
+    return this.resolveValue(this.props.inputType || "text");
+  }
+  isDisabled() {
+    return this.resolveValue(this.props.disabled || !1);
+  }
+  isReadonly() {
+    return this.resolveValue(this.props.readonly || !1);
+  }
+  getInputStyles() {
+    const t = this.isDisabled();
+    return {
+      width: "100%",
+      padding: `${this.theme.spacing.padding}px`,
+      border: `${this.theme.spacing.borderWidth}px solid ${this.theme.colors.border}`,
+      borderRadius: `${this.theme.borderRadius}px`,
+      backgroundColor: t ? this.theme.colors.disabledBackground : this.theme.colors.background,
+      color: t ? this.theme.colors.disabledText : this.theme.colors.text,
+      fontSize: `${this.theme.fontSize}px`,
+      fontFamily: this.theme.fontFamily,
+      outline: "none",
+      transition: this.theme.transition,
+      cursor: t ? "not-allowed" : "text"
+    };
+  }
+  render() {
+    const t = this.getText(), s = this.getPlaceholder(), p = this.getInputType(), o = this.isDisabled(), d = this.isReadonly(), u = ["tachui-basic-input"], c = this.createClassString(this.props, u), l = m("input", {
+      id: this.id,
+      className: c,
+      type: p,
+      value: t,
+      placeholder: s,
+      disabled: o,
+      readonly: d,
+      "aria-label": this.props.accessibilityLabel,
+      "aria-describedby": this.props.accessibilityHint ? `${this.id}-hint` : void 0,
+      style: this.getInputStyles(),
+      oninput: this.handleInput,
+      onkeydown: this.handleKeyDown,
+      onfocus: this.handleFocus,
+      onblur: this.handleBlur
+    });
+    return this.inputElement = l.element, a(() => {
+      if (this.inputElement && r(this.props.text)) {
+        const h = this.getText();
+        this.inputElement.value !== h && (this.inputElement.value = h);
+      }
+    }), a(() => {
+      this.inputElement && (r(this.props.placeholder) || r(this.props.inputType) || r(this.props.disabled)) && (r(this.props.placeholder) && (this.inputElement.placeholder = this.getPlaceholder()), r(this.props.inputType) && (this.inputElement.type = this.getInputType()), r(this.props.disabled) && (this.inputElement.disabled = this.isDisabled()));
+    }), [l];
+  }
+}
+function N(e) {
+  return b(new T(e));
+}
+const U = {
+  /**
+   * Create a search input
+   */
+  search(e, t, s) {
+    return {
+      text: e,
+      setText: t,
+      inputType: "search",
+      placeholder: "Search...",
+      onSubmit: s
+    };
+  },
+  /**
+   * Create an email input
+   */
+  email(e, t) {
+    return {
+      text: e,
+      setText: t,
+      inputType: "email",
+      placeholder: "Enter email address"
+    };
+  },
+  /**
+   * Create a password input
+   */
+  password(e, t) {
+    return {
+      text: e,
+      setText: t,
+      inputType: "password",
+      placeholder: "Enter password"
+    };
+  },
+  /**
+   * Create a phone number input
+   */
+  phone(e, t) {
+    return {
+      text: e,
+      setText: t,
+      inputType: "tel",
+      placeholder: "Enter phone number"
+    };
+  }
+}, A = {
+  theme: n,
+  /**
+   * Create a custom theme
+   */
+  createTheme(e) {
+    return { ...n, ...e };
+  }
+};
+export {
+  N as BasicInput,
+  T as BasicInputComponent,
+  A as BasicInputStyles,
+  U as BasicInputUtils
+};
+//# sourceMappingURL=BasicInput.js.map

package/dist/components/BasicInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasicInput.js","sources":["../../src/components/BasicInput.ts"],"sourcesContent":["/**\n * BasicInput Component (Phase 1)\n *\n * Lightweight text input component for Core-only applications.\n * Provides SwiftUI-style reactive binding without the complexity\n * of the Forms plugin validation and formatting system.\n */\n\nimport type { ModifiableComponent, ModifierBuilder } from '../modifiers/types'\nimport { createEffect, isSignal } from '../reactive'\nimport type { Signal } from '../reactive/types'\nimport { h } from '../runtime'\nimport type { ComponentInstance, ComponentProps, DOMNode } from '../runtime/types'\nimport { withModifiers } from './wrapper'\nimport {\n  ComponentWithCSSClasses,\n  type CSSClassesProps\n} from '../css-classes'\n\n/**\n * BasicInput supported input types\n */\nexport type BasicInputType = 'text' | 'email' | 'password' | 'search' | 'tel' | 'url'\n\n/**\n * BasicInput component properties with CSS classes support\n */\nexport interface BasicInputProps extends ComponentProps, CSSClassesProps {\n  // Core reactive binding\n  text: Signal<string>\n  setText?: (value: string) => void\n\n  // Input configuration\n  placeholder?: string | Signal<string>\n  inputType?: BasicInputType | Signal<BasicInputType>\n  disabled?: boolean | Signal<boolean>\n  readonly?: boolean | Signal<boolean>\n\n  // Behavior\n  onChange?: (text: string) => void\n  onSubmit?: (text: string) => void\n  onFocus?: () => void\n  onBlur?: () => void\n\n  // Accessibility\n  accessibilityLabel?: string\n  accessibilityHint?: string\n}\n\n/**\n * BasicInput theme configuration\n */\nexport interface BasicInputTheme {\n  colors: {\n    background: string\n    border: string\n    text: string\n    placeholder: string\n    focusBorder: string\n    disabledBackground: string\n    disabledText: string\n  }\n  spacing: {\n    padding: number\n    borderWidth: number\n  }\n  borderRadius: number\n  fontSize: number\n  fontFamily: string\n  transition: string\n}\n\n/**\n * Default BasicInput theme\n */\nconst defaultBasicInputTheme: BasicInputTheme = {\n  colors: {\n    background: '#FFFFFF',\n    border: '#D1D1D6',\n    text: '#000000',\n    placeholder: '#8E8E93',\n    focusBorder: '#007AFF',\n    disabledBackground: '#F2F2F7',\n    disabledText: '#8E8E93',\n  },\n  spacing: {\n    padding: 8,\n    borderWidth: 1,\n  },\n  borderRadius: 4,\n  fontSize: 16,\n  fontFamily: '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif',\n  transition: 'border-color 0.2s ease, background-color 0.2s ease',\n}\n\n/**\n * BasicInput component implementation with CSS classes support\n */\nexport class BasicInputComponent extends ComponentWithCSSClasses implements ComponentInstance<BasicInputProps> {\n  public readonly type = 'component' as const\n  public readonly id: string\n  public readonly props: BasicInputProps\n  private theme: BasicInputTheme = defaultBasicInputTheme\n  private inputElement: HTMLInputElement | null = null\n\n  constructor(props: BasicInputProps) {\n    super()\n    this.props = props\n    this.id = `basicinput-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`\n  }\n\n  private resolveValue<T>(value: T | Signal<T>): T {\n    return isSignal(value) ? value() : value\n  }\n\n  private getText(): string {\n    return this.resolveValue(this.props.text)\n  }\n\n  private setText(value: string): void {\n    if (this.props.setText) {\n      this.props.setText(value)\n    }\n  }\n\n  private getPlaceholder(): string {\n    return this.resolveValue(this.props.placeholder || '')\n  }\n\n  private getInputType(): BasicInputType {\n    return this.resolveValue(this.props.inputType || 'text')\n  }\n\n  private isDisabled(): boolean {\n    return this.resolveValue(this.props.disabled || false)\n  }\n\n  private isReadonly(): boolean {\n    return this.resolveValue(this.props.readonly || false)\n  }\n\n  private handleInput = (e: Event): void => {\n    const target = e.target as HTMLInputElement\n    const value = target.value\n\n    // Update reactive signal\n    this.setText(value)\n\n    // Call onChange callback\n    if (this.props.onChange) {\n      this.props.onChange(value)\n    }\n  }\n\n  private handleKeyDown = (e: KeyboardEvent): void => {\n    if (e.key === 'Enter' && this.props.onSubmit) {\n      e.preventDefault()\n      this.props.onSubmit(this.getText())\n    }\n  }\n\n  private handleFocus = (): void => {\n    if (this.props.onFocus) {\n      this.props.onFocus()\n    }\n\n    // Update focus border color\n    if (this.inputElement) {\n      this.inputElement.style.borderColor = this.theme.colors.focusBorder\n    }\n  }\n\n  private handleBlur = (): void => {\n    if (this.props.onBlur) {\n      this.props.onBlur()\n    }\n\n    // Reset border color\n    if (this.inputElement) {\n      this.inputElement.style.borderColor = this.theme.colors.border\n    }\n  }\n\n  private getInputStyles(): Record<string, string> {\n    const disabled = this.isDisabled()\n\n    return {\n      width: '100%',\n      padding: `${this.theme.spacing.padding}px`,\n      border: `${this.theme.spacing.borderWidth}px solid ${this.theme.colors.border}`,\n      borderRadius: `${this.theme.borderRadius}px`,\n      backgroundColor: disabled\n        ? this.theme.colors.disabledBackground\n        : this.theme.colors.background,\n      color: disabled ? this.theme.colors.disabledText : this.theme.colors.text,\n      fontSize: `${this.theme.fontSize}px`,\n      fontFamily: this.theme.fontFamily,\n      outline: 'none',\n      transition: this.theme.transition,\n      cursor: disabled ? 'not-allowed' : 'text',\n    }\n  }\n\n  render(): DOMNode[] {\n    const currentText = this.getText()\n    const placeholder = this.getPlaceholder()\n    const inputType = this.getInputType()\n    const disabled = this.isDisabled()\n    const readonly = this.isReadonly()\n\n    // Process CSS classes for this component\n    const baseClasses = ['tachui-basic-input']\n    const classString = this.createClassString(this.props, baseClasses)\n    \n    const input = h('input', {\n      id: this.id,\n      className: classString,\n      type: inputType,\n      value: currentText,\n      placeholder: placeholder,\n      disabled: disabled,\n      readonly: readonly,\n      'aria-label': this.props.accessibilityLabel,\n      'aria-describedby': this.props.accessibilityHint ? `${this.id}-hint` : undefined,\n      style: this.getInputStyles(),\n      oninput: this.handleInput,\n      onkeydown: this.handleKeyDown,\n      onfocus: this.handleFocus,\n      onblur: this.handleBlur,\n    })\n\n    // Store reference to input element\n    this.inputElement = input.element as HTMLInputElement\n\n    // Set up reactive effects for dynamic updates\n    createEffect(() => {\n      if (this.inputElement && isSignal(this.props.text)) {\n        const newValue = this.getText()\n        if (this.inputElement.value !== newValue) {\n          this.inputElement.value = newValue\n        }\n      }\n    })\n\n    createEffect(() => {\n      if (\n        this.inputElement &&\n        (isSignal(this.props.placeholder) ||\n          isSignal(this.props.inputType) ||\n          isSignal(this.props.disabled))\n      ) {\n        // Update placeholder\n        if (isSignal(this.props.placeholder)) {\n          this.inputElement.placeholder = this.getPlaceholder()\n        }\n\n        // Update input type\n        if (isSignal(this.props.inputType)) {\n          this.inputElement.type = this.getInputType()\n        }\n\n        // Update disabled state\n        if (isSignal(this.props.disabled)) {\n          this.inputElement.disabled = this.isDisabled()\n        }\n      }\n    })\n\n    return [input]\n  }\n}\n\n/**\n * Create a BasicInput component\n */\nexport function BasicInput(props: BasicInputProps): ModifiableComponent<BasicInputProps> & {\n  modifier: ModifierBuilder<ModifiableComponent<BasicInputProps>>\n} {\n  return withModifiers(new BasicInputComponent(props))\n}\n\n/**\n * BasicInput utility functions and presets\n */\nexport const BasicInputUtils = {\n  /**\n   * Create a search input\n   */\n  search(\n    text: Signal<string>,\n    setText: (value: string) => void,\n    onSearch?: (query: string) => void\n  ): BasicInputProps {\n    return {\n      text,\n      setText,\n      inputType: 'search',\n      placeholder: 'Search...',\n      onSubmit: onSearch,\n    }\n  },\n\n  /**\n   * Create an email input\n   */\n  email(text: Signal<string>, setText: (value: string) => void): BasicInputProps {\n    return {\n      text,\n      setText,\n      inputType: 'email',\n      placeholder: 'Enter email address',\n    }\n  },\n\n  /**\n   * Create a password input\n   */\n  password(text: Signal<string>, setText: (value: string) => void): BasicInputProps {\n    return {\n      text,\n      setText,\n      inputType: 'password',\n      placeholder: 'Enter password',\n    }\n  },\n\n  /**\n   * Create a phone number input\n   */\n  phone(text: Signal<string>, setText: (value: string) => void): BasicInputProps {\n    return {\n      text,\n      setText,\n      inputType: 'tel',\n      placeholder: 'Enter phone number',\n    }\n  },\n}\n\n/**\n * BasicInput styles and theming\n */\nexport const BasicInputStyles = {\n  theme: defaultBasicInputTheme,\n\n  /**\n   * Create a custom theme\n   */\n  createTheme(overrides: Partial<BasicInputTheme>): BasicInputTheme {\n    return { ...defaultBasicInputTheme, ...overrides }\n  },\n}\n"],"names":["defaultBasicInputTheme","BasicInputComponent","ComponentWithCSSClasses","props","__publicField","e","value","isSignal","disabled","currentText","placeholder","inputType","readonly","baseClasses","classString","input","h","createEffect","newValue","BasicInput","withModifiers","BasicInputUtils","text","setText","onSearch","BasicInputStyles","overrides"],"mappings":"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"}

package/dist/components/Button.cjs

@@ -0,0 +1,7 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../reactive/cleanup.cjs");require("../reactive/unified-scheduler.cjs");const $=require("../reactive/effect.cjs"),u=require("../reactive/signal.cjs");require("../reactive/scheduler.cjs");require("../reactive/theme.cjs");const L=require("../runtime/renderer.cjs"),z=require("./wrapper.cjs"),O=require("../lifecycle/hooks.cjs"),F=require("../assets/ColorAsset.cjs"),k=require("../concatenation/concatenated-component.cjs");require("../css-classes/css-class-manager.cjs");const V=require("../css-classes/component-base.cjs");var H=Object.defineProperty,I=(i,e,t)=>e in i?H(i,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):i[e]=t,p=(i,e,t)=>I(i,typeof e!="symbol"?e+"":e,t);const P={colors:{primary:"#007AFF",secondary:"#5856D6",destructive:"#FF3B30",background:"#F2F2F7",surface:"#FFFFFF",onPrimary:"#FFFFFF",onSecondary:"#FFFFFF",onSurface:"#000000",border:"#C7C7CC",disabled:"#8E8E93"},spacing:{small:8,medium:12,large:16},borderRadius:{small:6,medium:8,large:12},typography:{small:{size:14,weight:"500"},medium:{size:16,weight:"500"},large:{size:18,weight:"600"}}};class R extends V.ComponentWithCSSClasses{constructor(e,t=P){super(),this.props=e,p(this,"type","component"),p(this,"id"),p(this,"mounted",!1),p(this,"cleanup",[]),p(this,"stateSignal"),p(this,"setState"),p(this,"theme"),this.id=`button-${Date.now()}-${Math.random().toString(36).substr(2,9)}`,this.theme=t;const[s,o]=u.createSignal("normal");this.stateSignal=s,this.setState=o,this.setupDOMEventListeners()}setupDOMEventListeners(){O.useLifecycle(this,{onDOMReady:(e,t)=>{t instanceof HTMLButtonElement&&(this.attachInteractionEvents(t),this.setupReactiveStyles(t))}})}setupReactiveStyles(e){const t=$.createEffect(()=>{this.stateSignal(),this.isEnabled(),this.isLoading();const{tint:s,backgroundColor:o,foregroundColor:r}=this.props;s&&u.isSignal(s)?s():s instanceof F.ColorAsset&&s.resolve(),o&&u.isSignal(o)?o():o instanceof F.ColorAsset&&o.resolve(),r&&u.isSignal(r)?r():r instanceof F.ColorAsset&&r.resolve();const n=this.getButtonStyles();this.applyStylesToElement(e,n)});this.cleanup.push(()=>{t&&typeof t.dispose=="function"&&t.dispose()})}applyStylesToElement(e,t){Object.entries(t).forEach(([s,o])=>{const r=this.camelToKebabCase(s);if(typeof o=="string"||typeof o=="number"){const n=e.style.getPropertyValue(r);r==="transform"?e.style.setProperty(r,String(o)):n&&n!==""&&n!=="inherit"||e.style.setProperty(r,String(o))}})}camelToKebabCase(e){return e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()}resolveColorValue(e){if(e){if(typeof e=="string")return e;if(u.isSignal(e))return e();if(e instanceof F.ColorAsset)return e.resolve()}}attachInteractionEvents(e){const t=()=>{const a=this.isEnabled();return typeof a=="boolean"?a:a()};let s=null;const o=a=>{t()&&a.button===0&&(this.setState("pressed"),s=()=>{this.stateSignal()==="pressed"&&this.setState("normal"),s&&(document.removeEventListener("mouseup",s),s=null)},document.addEventListener("mouseup",s))},r=()=>{t()&&this.stateSignal()==="pressed"&&(this.setState("normal"),s&&(document.removeEventListener("mouseup",s),s=null))},n=()=>{t()&&(this.setState("normal"),s&&(document.removeEventListener("mouseup",s),s=null))},d=()=>{t()&&this.stateSignal()!=="pressed"&&this.setState("focused")},v=()=>{t()&&this.stateSignal()==="focused"&&this.setState("normal")},b=a=>{t()&&(a.key===" "||a.key==="Enter")&&(a.preventDefault(),this.setState("pressed"))},S=a=>{t()&&(a.key===" "||a.key==="Enter")&&(a.preventDefault(),this.setState("normal"),this.props.action?.())};e.addEventListener("mousedown",o),e.addEventListener("mouseup",r),e.addEventListener("mouseleave",n),e.addEventListener("focus",d),e.addEventListener("blur",v),e.addEventListener("keydown",b),e.addEventListener("keyup",S),this.cleanup.push(()=>{e.removeEventListener("mousedown",o),e.removeEventListener("mouseup",r),e.removeEventListener("mouseleave",n),e.removeEventListener("focus",d),e.removeEventListener("blur",v),e.removeEventListener("keydown",b),e.removeEventListener("keyup",S),s&&(document.removeEventListener("mouseup",s),s=null)})}isEnabled(){const{isEnabled:e}=this.props;return e===void 0?!0:typeof e=="boolean"||u.isSignal(e)?e:!0}render(){const e=this.isEnabled(),t=[];this.props.systemImage&&t.push(L.h("span",{class:"button-icon",style:{marginRight:"8px",fontSize:"1.2em"}},L.text(this.props.systemImage))),t.push(L.h("span",{class:"button-title"},L.text(this.props.title||"")));const s=["tachui-button"];return[{type:"element",tag:"button",props:{className:this.createClassString(this.props,s),type:"button",disabled:typeof e=="boolean"?!e:()=>!e(),onClick:this.props.action?()=>{try{this.props.action?.()}catch(n){console.error("Button action error:",n)}}:void 0,...this.props.debugLabel&&{debugLabel:this.props.debugLabel}},children:t,componentMetadata:{id:this.id,type:"Button"}}]}isLoading(){const{isLoading:e}=this.props;return e===void 0?!1:typeof e=="boolean"?e:u.isSignal(e)?e():!1}hasColorModifiers(){let e=this.modifiers;return!e&&this.modifierBuilder&&(e=this.modifierBuilder.modifiers),!e&&this.modifiableComponent&&(e=this.modifiableComponent.modifiers),!e||!Array.isArray(e)?!1:e.some(t=>t.type==="appearance"||t.constructor?.name==="AppearanceModifier"?t.properties&&(t.properties.foregroundColor!==void 0||t.properties.color!==void 0):t.properties?["foregroundColor","color","textColor"].some(o=>t.properties[o]!==void 0):!1)}hasTypographyModifiers(){let e=this.modifiers;return!e&&this.modifierBuilder&&(e=this.modifierBuilder.modifiers),!e&&this.modifiableComponent&&(e=this.modifiableComponent.modifiers),!e||!Array.isArray(e)?!1:e.some(s=>s.type==="typography"||s.constructor?.name==="TypographyModifier"?s.properties&&(s.properties.transform!==void 0||s.properties.textTransform!==void 0):!1)}getButtonStyles(){const{variant:e,size:t,role:s="none",tint:o,backgroundColor:r,foregroundColor:n}=this.props,d=this.stateSignal(),v=this.isLoading(),b=this.isEnabled(),S=this.hasColorModifiers(),a=this.hasTypographyModifiers(),m={...!S&&!n&&!e&&{color:"inherit"},...!a&&{fontStyle:"inherit",lineHeight:"inherit",textTransform:"inherit",textDecoration:"inherit",textIndent:"inherit",textShadow:"inherit",wordSpacing:"inherit",textOrientation:"inherit",writingMode:"inherit",direction:"inherit"}};if(t){const y=this.theme.spacing[t]||this.theme.spacing.medium,D=this.theme.borderRadius[t]||this.theme.borderRadius.medium,A=this.theme.typography[t]||this.theme.typography.medium,_={small:"32px",medium:"40px",large:"48px"};m.padding=`${y}px ${y*2}px`,m.borderRadius=`${D}px`,m.fontSize=`${A.size}px`,m.fontWeight=A.weight,m.minHeight=_[t]}let c="transparent",h="transparent",B="1px",g;const q=this.resolveColorValue(o),C=this.resolveColorValue(r),E=this.resolveColorValue(n);if(e){const y=q||this.theme.colors.primary;switch(e){case"filled":s==="destructive"?c=this.theme.colors.destructive:s==="cancel"?c=this.theme.colors.secondary:c=y,g=this.theme.colors.onPrimary;break;case"outlined":h=s==="destructive"?this.theme.colors.destructive:y,g=s==="destructive"?this.theme.colors.destructive:y;break;case"bordered":c=this.theme.colors.background,h=this.theme.colors.border;break;case"borderedProminent":c=this.theme.colors.surface,h=this.theme.colors.primary,B="2px";break}}C&&(c=C),E&&(g=E);let w="1",x="auto",M,T="none";b?v?(w="0.6",x="none"):d==="pressed"?(c=this.darkenColor(c,.1),h=this.darkenColor(h,.1),M="scale(0.95)"):d==="focused"&&(T="0 0 0 3px #007AFF40"):(c=this.theme.colors.disabled,h=this.theme.colors.disabled,g=this.theme.colors.disabled,w="0.6",x="none");const l={...m};return e&&(l.backgroundColor=c,l.borderColor=h,l.borderWidth=B,g!==void 0&&(l.color=g)),C&&(l.backgroundColor=C),E&&(l.color=E),l.cursor=b?"pointer":"not-allowed",l.opacity=w,l.pointerEvents=x,l.transform=M!==void 0?M:"none",l.boxShadow=T,l.transition="all 0.2s ease",l}async handlePress(){if(!(!this.isEnabled()||this.isLoading())&&(this.triggerHapticFeedback(),this.setState("pressed"),setTimeout(()=>{this.isEnabled()&&this.setState("normal")},150),this.props.action))try{const e=this.props.action();e&&typeof e.then=="function"&&await e}catch(e){console.error("Button action failed:",e)}}triggerHapticFeedback(){if(this.props.hapticFeedback!==!1&&typeof window<"u"&&"navigator"in window){const e=window.navigator;e.vibrate&&e.vibrate(10)}}darkenColor(e,t){if(e==="transparent")return e;if(e.startsWith("#")){const s=e.slice(1),o=parseInt(s,16),r=Math.max(0,Math.floor((o>>16)*(1-t))),n=Math.max(0,Math.floor((o>>8&255)*(1-t))),d=Math.max(0,Math.floor((o&255)*(1-t)));return`#${(r<<16|n<<8|d).toString(16).padStart(6,"0")}`}return e}concat(e){const t=this.toSegment(),s=e.toSegment(),o={totalSegments:e instanceof k.ConcatenatedComponent?e.segments.length+1:2,accessibilityRole:e instanceof k.ConcatenatedComponent?this.mergeAccessibilityRoles("composite",e.metadata.accessibilityRole):this.determineAccessibilityRole(e),semanticStructure:"inline"};return new k.ConcatenatedComponent([t,s],o)}toSegment(){return{id:this.id,component:this,modifiers:[],render:()=>{const e=this.render();return Array.isArray(e)?e[0]:e}}}isConcatenatable(){return!0}determineAccessibilityRole(e){switch(e.constructor.name){case"EnhancedText":return"composite";case"EnhancedImage":return"composite";case"EnhancedButton":case"EnhancedLink":return"composite";default:return"composite"}}mergeAccessibilityRoles(e,t){return"composite"}}function f(i,e,t={}){const s={...t,title:i,...e&&{action:e}},o=new R(s);return z.withModifiers(o)}const W={Filled:(i,e,t={})=>f(i,e,{...t,variant:"filled"}),Outlined:(i,e,t={})=>f(i,e,{...t,variant:"outlined"}),Plain:(i,e,t={})=>f(i,e,{...t,variant:"plain"}),Bordered:(i,e,t={})=>f(i,e,{...t,variant:"bordered"}),Destructive:(i,e,t={})=>f(i,e,{...t,role:"destructive"}),Cancel:(i,e,t={})=>f(i,e,{...t,role:"cancel"})},K=`
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+`;if(typeof document<"u"){const i=document.createElement("style");i.textContent=K,document.head.appendChild(i)}exports.Button=f;exports.ButtonStyles=W;exports.EnhancedButton=R;exports.defaultButtonTheme=P;
+//# sourceMappingURL=Button.cjs.map