flikkui 0.1.0-beta.8 → 0.2.0-beta.1

package/dist/utils/streamingErrors.d.ts

@@ -0,0 +1,70 @@
+/**
+ * Streaming Error Classes
+ * Defines error types for SSE streaming with retryability flags
+ */
+/**
+ * Base streaming error interface
+ */
+export interface StreamingError {
+    type: 'network' | 'timeout' | 'parse' | 'abort' | 'server';
+    message: string;
+    details?: unknown;
+    retryable: boolean;
+}
+/**
+ * Network error - typically connection issues or fetch failures
+ * Retryable: Yes
+ */
+export declare class StreamingNetworkError extends Error implements StreamingError {
+    details?: unknown | undefined;
+    type: "network";
+    retryable: boolean;
+    constructor(message: string, details?: unknown | undefined);
+}
+/**
+ * Timeout error - request exceeded specified timeout duration
+ * Retryable: Yes
+ */
+export declare class StreamingTimeoutError extends Error implements StreamingError {
+    type: "timeout";
+    retryable: boolean;
+    constructor(timeout: number);
+}
+/**
+ * Parse error - invalid JSON or malformed SSE data
+ * Retryable: No (indicates server-side issue or format mismatch)
+ */
+export declare class StreamingParseError extends Error implements StreamingError {
+    chunk?: string | undefined;
+    type: "parse";
+    retryable: boolean;
+    constructor(message: string, chunk?: string | undefined);
+}
+/**
+ * Abort error - user manually cancelled the stream
+ * Retryable: No (user initiated)
+ */
+export declare class StreamingAbortError extends Error implements StreamingError {
+    type: "abort";
+    retryable: boolean;
+    constructor();
+}
+/**
+ * Server error - HTTP error response from server (4xx, 5xx)
+ * Retryable: No for 4xx, could be Yes for 5xx but defaulting to No
+ */
+export declare class StreamingServerError extends Error implements StreamingError {
+    status: number;
+    details?: unknown | undefined;
+    type: "server";
+    retryable: boolean;
+    constructor(status: number, statusText: string, details?: unknown | undefined);
+}
+/**
+ * Normalize any error into a StreamingError
+ * Used to convert unknown errors (from fetch, network, etc.) into typed streaming errors
+ *
+ * @param error - Any error object
+ * @returns Normalized StreamingError
+ */
+export declare const normalizeError: (error: unknown) => StreamingError;

package/dist/utils/streamingErrors.js

@@ -0,0 +1,93 @@
+/**
+ * Streaming Error Classes
+ * Defines error types for SSE streaming with retryability flags
+ */
+/**
+ * Network error - typically connection issues or fetch failures
+ * Retryable: Yes
+ */
+class StreamingNetworkError extends Error {
+    constructor(message, details) {
+        super(message);
+        this.details = details;
+        this.type = 'network';
+        this.retryable = true;
+        this.name = 'StreamingNetworkError';
+    }
+}
+/**
+ * Timeout error - request exceeded specified timeout duration
+ * Retryable: Yes
+ */
+class StreamingTimeoutError extends Error {
+    constructor(timeout) {
+        super(`Request timeout after ${timeout}ms`);
+        this.type = 'timeout';
+        this.retryable = true;
+        this.name = 'StreamingTimeoutError';
+    }
+}
+/**
+ * Parse error - invalid JSON or malformed SSE data
+ * Retryable: No (indicates server-side issue or format mismatch)
+ */
+class StreamingParseError extends Error {
+    constructor(message, chunk) {
+        super(message);
+        this.chunk = chunk;
+        this.type = 'parse';
+        this.retryable = false;
+        this.name = 'StreamingParseError';
+    }
+}
+/**
+ * Abort error - user manually cancelled the stream
+ * Retryable: No (user initiated)
+ */
+class StreamingAbortError extends Error {
+    constructor() {
+        super('Stream aborted by user');
+        this.type = 'abort';
+        this.retryable = false;
+        this.name = 'StreamingAbortError';
+    }
+}
+/**
+ * Server error - HTTP error response from server (4xx, 5xx)
+ * Retryable: No for 4xx, could be Yes for 5xx but defaulting to No
+ */
+class StreamingServerError extends Error {
+    constructor(status, statusText, details) {
+        super(`Server error: ${status} ${statusText}`);
+        this.status = status;
+        this.details = details;
+        this.type = 'server';
+        this.retryable = false;
+        this.name = 'StreamingServerError';
+    }
+}
+/**
+ * Normalize any error into a StreamingError
+ * Used to convert unknown errors (from fetch, network, etc.) into typed streaming errors
+ *
+ * @param error - Any error object
+ * @returns Normalized StreamingError
+ */
+const normalizeError = (error) => {
+    // Handle AbortController abortion
+    if (error instanceof DOMException && error.name === 'AbortError') {
+        return new StreamingAbortError();
+    }
+    // Already a streaming error - return as-is
+    if (error instanceof StreamingNetworkError ||
+        error instanceof StreamingTimeoutError ||
+        error instanceof StreamingParseError ||
+        error instanceof StreamingServerError ||
+        error instanceof StreamingAbortError) {
+        return error;
+    }
+    // Unknown error - treat as network error (retryable)
+    return new StreamingNetworkError(error instanceof Error ? error.message : 'Unknown streaming error', error);
+};
+
+export { StreamingAbortError, StreamingNetworkError, StreamingParseError, StreamingServerError, StreamingTimeoutError, normalizeError };

package/dist/utils/typeaheadUtils.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Typeahead utilities for dropdown components
+ * Provides functions to search and navigate through options by typing
+ */
+export interface TypeaheadOption {
+    /** Display label for the option */
+    label: string;
+    /** Whether the option is disabled */
+    disabled?: boolean;
+}
+export interface FindNextMatchingOptionParams<T extends TypeaheadOption> {
+    /** Array of options to search through */
+    options: T[];
+    /** The character or string to search for */
+    searchChar: string;
+    /** Current highlighted index (to start searching from next item) */
+    currentIndex: number;
+    /** Previous search string (for multi-character matching) */
+    previousSearch?: string;
+}
+/**
+ * Finds the next matching option based on typeahead input
+ * Supports cycling through multiple matches and multi-character search
+ */
+export declare function findNextMatchingOption<T extends TypeaheadOption>({ options, searchChar, currentIndex, previousSearch, }: FindNextMatchingOptionParams<T>): number;
+/**
+ * Checks if a character is valid for typeahead search
+ * Excludes control keys and special navigation keys
+ */
+export declare function isValidTypeaheadChar(key: string): boolean;
+/**
+ * Debounce timeout for resetting typeahead search
+ * After this timeout, the next character starts a new search
+ */
+export declare const TYPEAHEAD_TIMEOUT_MS = 1000;

package/dist/utils/typeaheadUtils.js

@@ -0,0 +1,59 @@
+/**
+ * Typeahead utilities for dropdown components
+ * Provides functions to search and navigate through options by typing
+ */
+/**
+ * Finds the next matching option based on typeahead input
+ * Supports cycling through multiple matches and multi-character search
+ */
+function findNextMatchingOption({ options, searchChar, currentIndex, previousSearch = '', }) {
+    if (!searchChar || options.length === 0) {
+        return -1;
+    }
+    // Build the search string (either new character or continuation)
+    const searchString = searchChar.toLowerCase();
+    const isNewSearch = previousSearch === '' || !searchString.startsWith(previousSearch.toLowerCase());
+    // For single character searches, we want to cycle through matches
+    // For multi-character, we want to find the best match
+    const searchTerm = isNewSearch ? searchString : searchString;
+    // Find all matching options (not disabled)
+    const matchingIndices = [];
+    options.forEach((option, index) => {
+        if (!option.disabled && option.label.toLowerCase().startsWith(searchTerm)) {
+            matchingIndices.push(index);
+        }
+    });
+    if (matchingIndices.length === 0) {
+        return -1;
+    }
+    // If it's a single character and we're repeating the same character,
+    // cycle to the next match after current position
+    if (searchString.length === 1 && searchString === previousSearch.toLowerCase()) {
+        const currentMatchIndex = matchingIndices.findIndex(index => index > currentIndex);
+        return currentMatchIndex >= 0
+            ? matchingIndices[currentMatchIndex]
+            : matchingIndices[0]; // Wrap to first match
+    }
+    // For new searches or multi-character, find the first match after current position
+    // or wrap to the first match if none found after current
+    const nextMatch = matchingIndices.find(index => index > currentIndex);
+    return nextMatch !== undefined ? nextMatch : matchingIndices[0];
+}
+/**
+ * Checks if a character is valid for typeahead search
+ * Excludes control keys and special navigation keys
+ */
+function isValidTypeaheadChar(key) {
+    // Allow letters, numbers, and some symbols
+    if (key.length === 1) {
+        return /[a-zA-Z0-9\s]/.test(key);
+    }
+    return false;
+}
+/**
+ * Debounce timeout for resetting typeahead search
+ * After this timeout, the next character starts a new search
+ */
+const TYPEAHEAD_TIMEOUT_MS = 1000;
+
+export { TYPEAHEAD_TIMEOUT_MS, findNextMatchingOption, isValidTypeaheadChar };

package/dist/utils/useClickOutside.js

@@ -5,10 +5,10 @@ import { useEffect } from 'react';
  * @param ref The reference to the element to detect clicks outside of
  * @param handler The callback function to execute when a click outside is detected
  */
-var useClickOutside = function (ref, handler) {
-    useEffect(function () {
-        var listener = function (event) {
-            var el = ref.current;
+const useClickOutside = (ref, handler) => {
+    useEffect(() => {
+        const listener = (event) => {
+            const el = ref.current;
             if (!el || el.contains(event.target)) {
                 return;
             }
@@ -16,7 +16,7 @@ var useClickOutside = function (ref, handler) {
         };
         document.addEventListener('mousedown', listener);
         document.addEventListener('touchstart', listener);
-        return function () {
+        return () => {
             document.removeEventListener('mousedown', listener);
             document.removeEventListener('touchstart', listener);
         };

package/package.json

@@ -1,16 +1,45 @@
 {
   "name": "flikkui",
-  "version": "0.1.0-beta.8",
+  "version": "0.2.0-beta.1",
   "description": "A modern React component library built with TypeScript, Tailwind CSS v4, and Framer Motion. Follows the shadcn philosophy with complete className override support.",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
+  "bin": {
+    "flikkui": "./dist/cli/index.js"
+  },
+  "sideEffects": [
+    "*.css",
+    "*.scss",
+    "./dist/styles.css",
+    "./src/global.scss"
+  ],
   "exports": {
     ".": {
       "import": "./dist/index.js",
       "types": "./dist/index.d.ts"
     },
+    "./core": {
+      "import": "./dist/components/core/index.js",
+      "types": "./dist/components/core/index.d.ts"
+    },
+    "./forms": {
+      "import": "./dist/components/forms/index.js",
+      "types": "./dist/components/forms/index.d.ts"
+    },
+    "./charts": {
+      "import": "./dist/components/charts/index.js",
+      "types": "./dist/components/charts/index.d.ts"
+    },
+    "./effects": {
+      "import": "./dist/components/effects/index.js",
+      "types": "./dist/components/effects/index.d.ts"
+    },
+    "./ai": {
+      "import": "./dist/components/ai/index.js",
+      "types": "./dist/components/ai/index.d.ts"
+    },
     "./components/*": {
       "import": "./dist/components/*.js",
       "types": "./dist/components/*.d.ts"
@@ -29,15 +58,18 @@
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "build": "rollup -c && npm run build:css",
-    "build:css": "tailwindcss -m -i ./src/global.scss -o ./dist/styles.css",
+    "build:css": "tailwindcss -m -i ./src/tailwind-config.css -o ./dist/styles.css",
     "watch": "rollup -c -w",
     "typecheck": "tsc --noEmit",
     "lint": "eslint src --ext .ts,.tsx",
     "clean": "rimraf dist",
-    "storybook": "concurrently \"npm run storybook:css\" \"storybook dev -p 6006\"",
-    "storybook:css": "tailwindcss -w -i ./src/global.scss -o ./src/index.css",
-    "build-storybook": "concurrently \"npm run build-storybook:css\" \"storybook build\"",
-    "build-storybook:css": "tailwindcss -m -i ./src/global.scss -o ./src/index.css",
+    "storybook": "concurrently \"npm run watch:css:dev\" \"storybook dev -p 6006\"",
+    "watch:css:dev": "tailwindcss --watch -i ./src/tailwind-config.css -o ./src/index.css",
+    "build:css:dev": "tailwindcss -i ./src/tailwind-config.css -o ./src/index.css",
+    "storybook:clean": "rm -rf storybook-static node_modules/.cache",
+    "storybook:fresh": "npm run storybook:clean && npm run storybook",
+    "build-storybook": "npm run build-storybook:css && storybook build",
+    "build-storybook:css": "tailwindcss -m -i ./src/tailwind-config.css -o ./src/index.css",
     "prepublishOnly": "npm run build"
   },
   "keywords": [
@@ -53,40 +85,64 @@
   ],
   "author": "Espranza Innovations <g.singh@espranza.net>",
   "license": "MIT",
+  "engines": {
+    "node": ">=20.19.0",
+    "npm": ">=10.0.0"
+  },
   "peerDependencies": {
+    "@heroicons/react": "^2.2.0",
+    "clsx": "^2.1.1",
     "motion": "^12.19.1",
     "react": ">=17.0.0",
     "react-dom": ">=17.0.0",
-    "tailwindcss": "^4.0.9"
-  },
-  "dependencies": {
-    "@heroicons/react": "^2.2.0",
-    "clsx": "^2.1.1",
-    "tailwind-merge": "^3.0.2"
+    "react-markdown": "^9.0.1",
+    "react-syntax-highlighter": "^15.5.0",
+    "remark-gfm": "^4.0.0",
+    "tailwind-merge": "^3.0.2",
+    "tailwindcss": "^4.0.9",
+    "three": "^0.170.0"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^4.0.0",
     "@emotion/is-prop-valid": "^1.3.1",
+    "@heroicons/react": "^2.2.0",
     "@rollup/plugin-commonjs": "^28.0.2",
     "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-typescript": "^12.1.2",
-    "@storybook/addon-a11y": "^9.0.13",
-    "@storybook/addon-docs": "^9.0.13",
-    "@storybook/addon-links": "^9.0.13",
-    "@storybook/addon-onboarding": "^9.0.13",
-    "@storybook/addon-themes": "^9.0.13",
+    "@storybook/addon-a11y": "^10.1.11",
+    "@storybook/addon-docs": "^10.1.11",
+    "@storybook/addon-links": "^10.1.11",
+    "@storybook/addon-onboarding": "^10.1.11",
+    "@storybook/addon-themes": "^10.1.11",
     "@storybook/addon-webpack5-compiler-swc": "^3.0.0",
-    "@storybook/react-webpack5": "^9.0.13",
+    "@storybook/react-webpack5": "^10.1.11",
     "@tailwindcss/cli": "^4.0.9",
     "@types/react": "^19.0.10",
     "@types/react-dom": "^19.0.4",
+    "@types/react-syntax-highlighter": "^15.5.11",
     "autoprefixer": "^10.4.20",
+    "clsx": "^2.1.1",
     "concurrently": "^9.1.2",
-    "motion": "^12.19.1",
+    "motion": "^12.24.0",
     "postcss": "^8.5.3",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "react-markdown": "^10.1.0",
+    "react-syntax-highlighter": "^16.1.0",
+    "remark-gfm": "^4.0.1",
     "rollup": "^4.34.8",
-    "storybook": "^9.0.13",
+    "storybook": "^10.1.11",
+    "@types/three": "^0.170.0",
+    "tailwind-merge": "^3.4.0",
+    "three": "^0.170.0",
     "tslib": "^2.8.1",
     "typescript": "^5.7.3"
+  },
+  "dependencies": {
+    "mathjs": "^15.1.0",
+    "commander": "^12.1.0",
+    "@inquirer/prompts": "^7.2.1",
+    "chalk": "^5.3.0",
+    "ora": "^8.1.1"
   }
 }

package/dist/_virtual/jsx-runtime.js

@@ -1,5 +0,0 @@
-import { __require as requireJsxRuntime } from '../node_modules/react/jsx-runtime.js';
-
-var jsxRuntimeExports = requireJsxRuntime();
-
-export { jsxRuntimeExports as j };

package/dist/_virtual/jsx-runtime2.js

@@ -1,3 +0,0 @@
-var jsxRuntime = {exports: {}};
-
-export { jsxRuntime as __module };

package/dist/_virtual/react-jsx-runtime.development.js

@@ -1,3 +0,0 @@
-var reactJsxRuntime_development = {};
-
-export { reactJsxRuntime_development as __exports };

package/dist/_virtual/react-jsx-runtime.production.js

@@ -1,3 +0,0 @@
-var reactJsxRuntime_production = {};
-
-export { reactJsxRuntime_production as __exports };

package/dist/components/core/Accordion/index.js

@@ -1,5 +0,0 @@
-import Accordion from './Accordion.js';
-
-
-
-export { Accordion, Accordion as default };

package/dist/components/core/Button/Button.animations.js

@@ -1,20 +0,0 @@
-/**
- * Get button animation variants based on reduced motion preference
- */
-var getButtonVariants = function (shouldReduceMotion) {
-    return (shouldReduceMotion !== null && shouldReduceMotion !== void 0 ? shouldReduceMotion : false)
-        ? undefined
-        : {
-            tap: {
-                scale: 0.95,
-                transition: {
-                    duration: 0.1,
-                    type: "spring",
-                    stiffness: 400,
-                    damping: 10,
-                },
-            },
-        };
-};
-
-export { getButtonVariants };

package/dist/components/core/Calendar/DayView/DayViewCell.d.ts

@@ -1,20 +0,0 @@
-import React from "react";
-interface DayViewCellProps {
-    time?: string;
-    events?: Array<{
-        id: string;
-        title: string;
-        startTime: string;
-        endTime: string;
-        description?: string;
-        attendees?: Array<{
-            name: string;
-            src: string;
-            alt: string;
-            showTooltip?: boolean;
-        }>;
-        color?: string;
-    }>;
-}
-export default function DayViewCell({ time, events }: DayViewCellProps): React.JSX.Element;
-export {};

package/dist/components/core/Calendar/MonthView/MonthView.d.ts

@@ -1,2 +0,0 @@
-import React from "react";
-export default function Example(): React.JSX.Element;

package/dist/components/core/Calendar/MonthView/components/CalendarCell/CalendarCell.d.ts

@@ -1,4 +0,0 @@
-import React from "react";
-import { CalendarCellProps } from "./CalendarCell.types";
-declare const CalendarCell: React.FC<CalendarCellProps>;
-export default CalendarCell;

package/dist/components/core/Calendar/MonthView/components/CalendarCell/CalendarCell.theme.d.ts

@@ -1,29 +0,0 @@
-export declare const calendarCellTheme: {
-    baseStyle: string;
-    states: {
-        currentMonth: string;
-        otherMonth: string;
-        today: string;
-        selected: string;
-        mobileSelectedToday: string;
-        mobileSelectedCurrent: string;
-        mobileSelectedOther: string;
-    };
-    dateNumber: {
-        base: string;
-        today: string;
-        selected: string;
-        selectedToday: string;
-        selectedNotToday: string;
-    };
-    events: {
-        container: string;
-        mobileContainer: string;
-        item: string;
-        name: string;
-        time: string;
-        moreIndicator: string;
-        mobileDot: string;
-        screenReader: string;
-    };
-};

package/dist/components/core/Calendar/MonthView/components/CalendarCell/CalendarCell.types.d.ts

@@ -1,41 +0,0 @@
-import React from 'react';
-export interface CalendarEvent {
-    id: number;
-    name: string;
-    time: string;
-    datetime: string;
-    href: string;
-}
-export interface CalendarCellProps extends React.HTMLAttributes<HTMLButtonElement> {
-    date: string;
-    dayNumber: string;
-    isCurrentMonth?: boolean;
-    isToday?: boolean;
-    isSelected?: boolean;
-    events?: CalendarEvent[];
-    onDateClick?: (date: string) => void;
-    className?: string;
-}
-export interface CalendarCellThemeOverrides {
-    baseStyle?: string;
-    states?: {
-        currentMonth?: string;
-        otherMonth?: string;
-        today?: string;
-        selected?: string;
-        withEvents?: string;
-    };
-    dateNumber?: {
-        base?: string;
-        today?: string;
-        selected?: string;
-    };
-    events?: {
-        container?: string;
-        mobileContainer?: string;
-        item?: string;
-        name?: string;
-        time?: string;
-        mobileDot?: string;
-    };
-}

package/dist/components/core/Calendar/MonthView/components/CalendarCell/index.d.ts

@@ -1,3 +0,0 @@
-export { default as CalendarCell } from './CalendarCell';
-export type { CalendarCellProps, CalendarEvent, CalendarCellThemeOverrides } from './CalendarCell.types';
-export { calendarCellTheme } from './CalendarCell.theme';

package/dist/components/core/Calendar/MonthView/components/MontViewHeader/MonthViewHeader.d.ts

@@ -1,2 +0,0 @@
-import React from "react";
-export default function MonthViewHeader(): React.JSX.Element;

package/dist/components/core/Carousel/Carousel.animations.d.ts

@@ -1,33 +0,0 @@
-import { Variants } from 'motion/react';
-export declare const slideSlideVariants: Variants;
-export declare const slideCardStackVariants: Variants;
-export declare const slideFadeVariants: Variants;
-export declare const slideVariants: Variants;
-export declare const slideSlideImageVariants: Variants;
-export declare const slideCardStackImageVariants: Variants;
-export declare const slideFadeImageVariants: Variants;
-export declare const slideImageVariants: Variants;
-export declare const slideSlideContentVariants: Variants;
-export declare const slideCardStackContentVariants: Variants;
-export declare const slideFadeContentVariants: Variants;
-export declare const slideContentVariants: Variants;
-export declare const slideSlideOverlayVariants: Variants;
-export declare const slideCardStackOverlayVariants: Variants;
-export declare const slideFadeOverlayVariants: Variants;
-export declare const slideOverlayVariants: Variants;
-export declare const controlButtonVariants: Variants;
-export declare const mouseTrackingSpring: {
-    stiffness: number;
-    damping: number;
-    mass: number;
-};
-export declare const slideContainerVariants: Variants;
-export declare const calculateMouseTransform: (mouseX: number, mouseY: number, elementRect: DOMRect, intensity?: number) => {
-    x: number;
-    y: number;
-};
-export declare const getSlideVariants: (animationType: "slide" | "card-stack" | "fade") => Variants;
-export declare const getSlideImageVariants: (animationType: "slide" | "card-stack" | "fade") => Variants;
-export declare const getSlideContentVariants: (animationType: "slide" | "card-stack" | "fade") => Variants;
-export declare const getSlideOverlayVariants: (animationType: "slide" | "card-stack" | "fade") => Variants;
-export declare const getSlideAnimationState: (animationType: "slide" | "card-stack" | "fade", currentSlide: number, slideIndex: number) => "previous" | "active" | "inactive";