@uipath/apollo-wind 0.7.2-pr188.4865fad

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 UiPath
+
+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,188 @@
+# UiPath Wind Design System
+
+A modern, accessible React component library with bundled Tailwind CSS.
+Zero-config for quick starts, full Tailwind JIT for advanced needs.
+
+```mermaid
+graph LR
+    A[Apollo Wind] --> B[Pre-compiled Styles<br/>Zero Config]
+    A --> C[Tailwind JIT<br/>Full Power]
+    B --> D[Fast Setup<br/>17KB CSS]
+    C --> E[All Features<br/>Custom Classes]
+```
+
+## Quick Start
+
+```bash
+npm install @uipath/apollo-wind
+```
+
+**Option 1: Zero Config** (Recommended for quick starts)
+
+```tsx
+import "@uipath/apollo-wind/tailwind.css";
+import { Button } from "@uipath/apollo-wind";
+
+<Button>Click me</Button>;
+```
+
+**Option 2: Full Tailwind JIT** (For advanced customization)
+
+```bash
+npm install @uipath/apollo-wind postcss
+```
+
+```js
+// postcss.config.js
+export { default } from "@uipath/apollo-wind/postcss";
+```
+
+```css
+/* src/app.css */
+@import "@uipath/apollo-wind/tailwind.css";
+
+/* Scan your source files for Tailwind classes */
+@source "./src/**/*.{js,jsx,ts,tsx}";
+
+/* Scan wind components to include their styles */
+@source "./node_modules/@uipath/apollo-wind/dist/**/*.js";
+```
+
+```tsx
+import "./app.css";
+import { Button } from "@uipath/apollo-wind";
+
+// ✅ All Tailwind utilities work!
+<Button className="bg-purple-500 hover:scale-105 w-[200px]">
+  Custom Tailwind
+</Button>;
+```
+
+## Comparison
+
+| Feature          | Pre-compiled            | Tailwind JIT                    |
+| ---------------- | ----------------------- | ------------------------------- |
+| Setup Time       | Instant                 | 5 minutes                       |
+| Bundle Size      | ~17KB CSS               | ~varies (JIT)                   |
+| Custom Classes   | ❌                      | ✅                              |
+| Arbitrary Values | ❌                      | ✅ (`w-[200px]`)                |
+| Tailwind Plugins | ❌                      | ✅                              |
+| Best For         | Prototypes, Simple Apps | Production, Heavy Customization |
+
+## Architecture
+
+```mermaid
+flowchart TD
+    A[Component Library] --> B[CVA Variants]
+    A --> C[TypeScript Types]
+    B --> D[Tailwind Utilities]
+    C --> E[React Components]
+
+    F[Consumer App] --> G{Choose Approach}
+    G -->|Option 1| H[Import styles.css]
+    G -->|Option 2| I[Import tailwind.css<br/>+ @source directive]
+
+    H --> J[Pre-compiled CSS<br/>34KB]
+    I --> K[JIT Compiled<br/>Only used utilities]
+
+    J --> L[Components Rendered]
+    K --> L
+```
+
+## Example
+
+```tsx
+import {
+  Button,
+  Card,
+  CardContent,
+  CardHeader,
+  CardTitle,
+  Input,
+  Label,
+} from "@uipath/apollo-wind";
+
+function LoginForm() {
+  return (
+    <Card className="w-full max-w-md">
+      <CardHeader>
+        <CardTitle>Welcome Back</CardTitle>
+      </CardHeader>
+      <CardContent className="space-y-4">
+        <div>
+          <Label htmlFor="email">Email</Label>
+          <Input id="email" type="email" placeholder="you@example.com" />
+        </div>
+        <Button className="w-full">Sign In</Button>
+      </CardContent>
+    </Card>
+  );
+}
+```
+
+## Utilities
+
+### cn() - Class Merger
+
+```tsx
+import { cn } from "@uipath/apollo-wind";
+
+<Button className={cn("base-class", isActive && "active-class")}>
+  Button
+</Button>;
+```
+
+## Development
+
+This package is part of a pnpm workspace. All commands should be run using `pnpm`.
+
+**From the root of the monorepo:**
+```bash
+pnpm install                                    # Install all dependencies
+pnpm build                                      # Build apollo packages
+pnpm storybook:wind                             # Run Storybook on http://localhost:6006
+pnpm test --filter=@uipath/apollo-wind          # Run tests
+pnpm lint --filter=@uipath/apollo-wind          # Run lint
+pnpm format --filter=@uipath/apollo-wind        # Run biome format
+```
+
+**From the `packages/apollo-wind` directory:**
+```bash
+pnpm install        # Install dependencies (from root)
+pnpm build          # Build apollo packages
+pnpm storybook      # Run Storybook on http://localhost:6006
+pnpm test           # Run tests
+pnpm lint           # Run lint
+pnpm format         # Run biome format
+```
+
+## Documentation
+
+- 📖 [Complete Usage Guide](./docs/USAGE.md) - Detailed consumption guide
+- ♿ [Accessibility Testing Guide](./docs/ACCESSIBILITY_TESTING_GUIDE.md) - WCAG
+  2.1 Level AA compliance and testing
+- 🌍 [Localization Guide](./docs/LOCALIZATION_GUIDE.md) - Internationalization
+  (i18n) implementation
+
+## Tech Stack
+
+- React 19 + TypeScript 5
+- Tailwind CSS 4 (bundled)
+- CVA (Class Variance Authority)
+- Vitest + Testing Library
+- Storybook 10
+- Vite 7
+
+## Browser Support
+
+Modern browsers: Chrome, Firefox, Safari, Edge (latest versions)
+
+## License
+
+MIT - see [LICENSE](./LICENSE)
+
+---
+
+**Peer Dependencies:** React ≥18.0.0
+
+Built with ❤️ by UiPath | Inspired by [shadcn/ui](https://ui.shadcn.com)

package/dist/components/forms/data-fetcher.cjs

@@ -0,0 +1,250 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    DataSourceBuilder: ()=>DataSourceBuilder,
+    DataFetcher: ()=>DataFetcher,
+    DataTransformers: ()=>DataTransformers,
+    FetchAdapter: ()=>FetchAdapter
+});
+const index_cjs_namespaceObject = require("../../lib/index.cjs");
+class FetchAdapter {
+    async fetch(request) {
+        const { url, method, params, body } = request;
+        const requestOptions = {
+            method,
+            headers: {
+                'Content-Type': 'application/json',
+                ...request.headers
+            }
+        };
+        if ('POST' === method && body) requestOptions.body = JSON.stringify(body);
+        let fullUrl = url;
+        if ('GET' === method && params) {
+            const queryParams = new URLSearchParams(params);
+            fullUrl = `${url}?${queryParams}`;
+        }
+        const response = await fetch(fullUrl, requestOptions);
+        return {
+            data: await response.json(),
+            status: response.status,
+            ok: response.ok
+        };
+    }
+}
+class DataFetcher {
+    static cache = new Map();
+    static cacheTTL = 300000;
+    static adapter = new FetchAdapter();
+    static setAdapter(adapter) {
+        DataFetcher.adapter = adapter;
+    }
+    static getAdapter() {
+        return DataFetcher.adapter;
+    }
+    static resetAdapter() {
+        DataFetcher.adapter = new FetchAdapter();
+    }
+    static async fetch(source, formValues) {
+        switch(source.type){
+            case 'static':
+                return DataFetcher.fetchStatic(source);
+            case 'fetch':
+                return DataFetcher.fetchRemote(source, formValues);
+            case 'computed':
+                return DataFetcher.fetchComputed(source, formValues);
+            case 'remote':
+                return DataFetcher.fetchRemote(source, formValues);
+            default:
+                throw new Error(`Unknown data source type: ${source.type}`);
+        }
+    }
+    static fetchStatic(source) {
+        return source.options;
+    }
+    static async fetchRemote(source, formValues) {
+        const url = 'url' in source ? source.url : source.endpoint;
+        const method = 'method' in source ? source.method || 'GET' : 'GET';
+        const params = 'params' in source ? DataFetcher.resolveParams(source.params || {}, formValues) : {};
+        const cacheKey = DataFetcher.buildCacheKey(url, method, source, formValues);
+        const cached = DataFetcher.getFromCache(cacheKey);
+        if (cached) return cached;
+        try {
+            const response = await DataFetcher.adapter.fetch({
+                url,
+                method,
+                params,
+                body: 'POST' === method ? params : void 0
+            });
+            if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
+            let data = response.data;
+            if ('transform' in source && source.transform) data = DataFetcher.applyTransform(source.transform, data, formValues);
+            DataFetcher.setCache(cacheKey, data);
+            return data;
+        } catch (error) {
+            console.error('Data fetch error:', error);
+            throw error;
+        }
+    }
+    static fetchComputed(source, formValues) {
+        const dependencyValues = source.dependency.map((dep)=>(0, index_cjs_namespaceObject.get)(formValues, dep));
+        try {
+            const computeFn = new Function(...source.dependency, `return ${source.compute}`);
+            return computeFn(...dependencyValues);
+        } catch (error) {
+            console.error('Computed value error:', error);
+            return;
+        }
+    }
+    static resolveParams(params, formValues) {
+        const resolved = {};
+        for (const [key, value] of Object.entries(params))if ('string' == typeof value && value.startsWith('$')) {
+            const fieldPath = value.slice(1);
+            resolved[key] = (0, index_cjs_namespaceObject.get)(formValues, fieldPath);
+        } else resolved[key] = value;
+        return resolved;
+    }
+    static applyTransform(transform, data, formValues) {
+        try {
+            const transformFn = new Function('data', 'formValues', `return ${transform}`);
+            return transformFn(data, formValues);
+        } catch (error) {
+            console.error('Transform error:', error);
+            return data;
+        }
+    }
+    static buildCacheKey(url, method, source, formValues) {
+        const params = 'params' in source ? source.params || {} : {};
+        const resolvedParams = DataFetcher.resolveParams(params, formValues);
+        return `${method}:${url}:${JSON.stringify(resolvedParams)}`;
+    }
+    static getFromCache(key) {
+        const cached = DataFetcher.cache.get(key);
+        if (!cached) return null;
+        if (Date.now() - cached.timestamp > DataFetcher.cacheTTL) {
+            DataFetcher.cache.delete(key);
+            return null;
+        }
+        return cached.data;
+    }
+    static setCache(key, data) {
+        DataFetcher.cache.set(key, {
+            data,
+            timestamp: Date.now()
+        });
+    }
+    static clearCache(pattern) {
+        if (!pattern) return void DataFetcher.cache.clear();
+        for (const key of DataFetcher.cache.keys())if (key.includes(pattern)) DataFetcher.cache.delete(key);
+    }
+    static setCacheTTL(ttl) {
+        DataFetcher.cacheTTL = ttl;
+    }
+}
+class DataSourceBuilder {
+    static static(options) {
+        return {
+            type: 'static',
+            options
+        };
+    }
+    static get(url, params) {
+        return {
+            type: 'remote',
+            endpoint: url,
+            params
+        };
+    }
+    static post(url, _params) {
+        return {
+            type: 'fetch',
+            url,
+            method: 'POST',
+            transform: 'data'
+        };
+    }
+    static computed(dependencies, computeExpression) {
+        return {
+            type: 'computed',
+            dependency: dependencies,
+            compute: computeExpression
+        };
+    }
+    static dependent(url, dependencyField, paramName = 'id') {
+        return {
+            type: 'remote',
+            endpoint: url,
+            params: {
+                [paramName]: `$${dependencyField}`
+            }
+        };
+    }
+    static searchable(url, searchParam = 'q') {
+        return {
+            type: 'remote',
+            endpoint: url,
+            params: {
+                [searchParam]: '$search'
+            }
+        };
+    }
+}
+class DataTransformers {
+    static toOptions(labelKey = 'name', valueKey = 'id') {
+        return `data.map(item => ({ label: item.${labelKey}, value: item.${valueKey} }))`;
+    }
+    static filter(predicate) {
+        return `data.filter(item => ${predicate})`;
+    }
+    static sort(key, order = 'asc') {
+        const comparator = 'asc' === order ? `(a, b) => a.${key} > b.${key} ? 1 : -1` : `(a, b) => a.${key} < b.${key} ? 1 : -1`;
+        return `data.sort(${comparator})`;
+    }
+    static map(expression) {
+        return `data.map(item => ${expression})`;
+    }
+    static extract(path) {
+        return `data.${path}`;
+    }
+    static pipe(...transforms) {
+        return transforms.reduce((acc, transform, index)=>{
+            if (0 === index) return transform;
+            return transform.replace('data', `(${acc})`);
+        });
+    }
+}
+exports.DataFetcher = __webpack_exports__.DataFetcher;
+exports.DataSourceBuilder = __webpack_exports__.DataSourceBuilder;
+exports.DataTransformers = __webpack_exports__.DataTransformers;
+exports.FetchAdapter = __webpack_exports__.FetchAdapter;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "DataFetcher",
+    "DataSourceBuilder",
+    "DataTransformers",
+    "FetchAdapter"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/forms/data-fetcher.d.ts

@@ -0,0 +1,173 @@
+import type { DataSource, FieldOption } from './form-schema';
+/**
+ * Request configuration for the adapter
+ */
+export interface AdapterRequest {
+    url: string;
+    method: 'GET' | 'POST';
+    params?: Record<string, unknown>;
+    headers?: Record<string, string>;
+    body?: unknown;
+}
+/**
+ * Response from the adapter
+ */
+export interface AdapterResponse {
+    data: unknown;
+    status: number;
+    ok: boolean;
+}
+/**
+ * Data Adapter interface - implement this to customize how data is fetched
+ *
+ * @example
+ * // Custom adapter with authentication
+ * class AuthenticatedAdapter implements DataAdapter {
+ *   constructor(private token: string) {}
+ *   async fetch(request: AdapterRequest): Promise<AdapterResponse> {
+ *     const response = await fetch(request.url, {
+ *       headers: { Authorization: `Bearer ${this.token}` }
+ *     });
+ *     return { data: await response.json(), status: response.status, ok: response.ok };
+ *   }
+ * }
+ */
+export interface DataAdapter {
+    fetch(request: AdapterRequest): Promise<AdapterResponse>;
+}
+/**
+ * Default adapter using the Fetch API
+ */
+export declare class FetchAdapter implements DataAdapter {
+    fetch(request: AdapterRequest): Promise<AdapterResponse>;
+}
+/**
+ * Data Fetcher - Handles various data sources for form fields
+ * Supports static, remote, computed, and reactive data sources
+ *
+ * Uses an adapter pattern for customizable data fetching
+ */
+export declare class DataFetcher {
+    private static cache;
+    private static cacheTTL;
+    private static adapter;
+    /**
+     * Set the data adapter for fetching remote data
+     * Use this to customize how HTTP requests are made (e.g., add auth, use mocks)
+     */
+    static setAdapter(adapter: DataAdapter): void;
+    /**
+     * Get the current adapter
+     */
+    static getAdapter(): DataAdapter;
+    /**
+     * Reset to the default FetchAdapter
+     */
+    static resetAdapter(): void;
+    /**
+     * Main fetch method - routes to appropriate handler
+     */
+    static fetch(source: DataSource, formValues: Record<string, unknown>): Promise<unknown>;
+    /**
+     * Static data source - returns options directly
+     */
+    private static fetchStatic;
+    /**
+     * Remote data fetching with caching
+     */
+    private static fetchRemote;
+    /**
+     * Computed data source - derives data from other fields
+     *
+     * SECURITY NOTE: Uses new Function() for developer-defined computed expressions.
+     * This is intentional library design - expressions should only come from trusted
+     * configuration files, never from user input. The expressions are defined by
+     * developers at build time, not by end users at runtime.
+     */
+    private static fetchComputed;
+    /**
+     * Resolve parameter values from form values
+     */
+    private static resolveParams;
+    /**
+     * Apply transformation to fetched data
+     *
+     * SECURITY NOTE: Uses new Function() for developer-defined transform expressions.
+     * This is intentional library design - transforms should only come from trusted
+     * configuration files, never from user input. The transforms are defined by
+     * developers at build time, not by end users at runtime.
+     */
+    private static applyTransform;
+    /**
+     * Build cache key
+     */
+    private static buildCacheKey;
+    /**
+     * Get from cache
+     */
+    private static getFromCache;
+    /**
+     * Set cache
+     */
+    private static setCache;
+    /**
+     * Clear cache
+     */
+    static clearCache(pattern?: string): void;
+    /**
+     * Set cache TTL
+     */
+    static setCacheTTL(ttl: number): void;
+}
+export declare class DataSourceBuilder {
+    /**
+     * Create a static data source
+     */
+    static static(options: FieldOption[]): DataSource;
+    /**
+     * Create a remote data source with GET
+     */
+    static get(url: string, params?: Record<string, unknown>): DataSource;
+    /**
+     * Create a remote data source with POST
+     */
+    static post(url: string, _params?: Record<string, unknown>): DataSource;
+    /**
+     * Create a computed data source
+     */
+    static computed(dependencies: string[], computeExpression: string): DataSource;
+    /**
+     * Create a data source that depends on another field
+     */
+    static dependent(url: string, dependencyField: string, paramName?: string): DataSource;
+    /**
+     * Create a searchable data source
+     */
+    static searchable(url: string, searchParam?: string): DataSource;
+}
+export declare class DataTransformers {
+    /**
+     * Transform array to label/value options
+     */
+    static toOptions(labelKey?: string, valueKey?: string): string;
+    /**
+     * Filter data
+     */
+    static filter(predicate: string): string;
+    /**
+     * Sort data
+     */
+    static sort(key: string, order?: 'asc' | 'desc'): string;
+    /**
+     * Map data
+     */
+    static map(expression: string): string;
+    /**
+     * Extract nested property
+     */
+    static extract(path: string): string;
+    /**
+     * Combine transformations
+     */
+    static pipe(...transforms: string[]): string;
+}