@flikk/ui 1.0.0-beta.3 → 1.0.0-beta.30

package/dist/components/forms/CronInput/CronInput.theme.js

@@ -1,84 +0,0 @@
-import { formsBaseTheme } from '../forms.theme.js';
-
-/**
- * Default theme for the CronInput component
- * Uses flat structure with CSS variable design tokens
- */
-const cronInputTheme = {
-    // Outer wrapper
-    baseStyle: "relative w-full flex flex-col gap-3",
-    // Label
-    labelStyle: "text-sm font-medium text-[var(--color-text-primary)] dark:text-[var(--color-neutral-200)]",
-    // Visual builder grid
-    builderStyle: "grid grid-cols-5 gap-2",
-    // Individual field group
-    fieldGroupStyle: "flex flex-col gap-1",
-    // Field label
-    fieldLabelStyle: "text-xs font-medium text-[var(--color-text-secondary)] dark:text-[var(--color-neutral-400)]",
-    // Select dropdown
-    fieldSelectStyle: "w-full rounded-[var(--form-radius)] outline outline-1 outline-[var(--color-border)] " +
-        "bg-white text-[var(--color-text-primary)] cursor-pointer transition-all " +
-        "focus:outline-2 focus:outline-[var(--color-primary-600)] focus:-outline-offset-1 " +
-        "focus:ring-4 focus:ring-[var(--color-primary)]/10 " +
-        "disabled:cursor-not-allowed disabled:bg-[var(--color-background-disabled)] disabled:text-[var(--color-text-disabled)] " +
-        "dark:bg-[var(--color-neutral-900)] dark:outline-[var(--color-neutral-700)] dark:text-[var(--color-neutral-200)] " +
-        "dark:focus:outline-[var(--color-primary-500)] dark:focus:ring-[var(--color-primary-500)]/20",
-    // Size variants for field selects
-    fieldSelectSizes: {
-        sm: `${formsBaseTheme.sizes.sm.text} ${formsBaseTheme.sizes.sm.padding} ${formsBaseTheme.sizes.sm.height}`,
-        md: `${formsBaseTheme.sizes.md.text} ${formsBaseTheme.sizes.md.padding} ${formsBaseTheme.sizes.md.height}`,
-        lg: `${formsBaseTheme.sizes.lg.text} ${formsBaseTheme.sizes.lg.padding} ${formsBaseTheme.sizes.lg.height}`,
-    },
-    // Raw input field
-    rawInputStyle: "w-full rounded-[var(--form-radius)] outline outline-1 outline-[var(--color-border)] " +
-        "bg-white text-[var(--color-text-primary)] font-mono transition-all " +
-        "placeholder:text-[var(--color-text-placeholder)] focus:outline-none " +
-        "focus:outline-2 focus:outline-[var(--color-primary-600)] focus:-outline-offset-1 " +
-        "focus:ring-4 focus:ring-[var(--color-primary)]/10 " +
-        "disabled:cursor-not-allowed disabled:bg-[var(--color-background-disabled)] disabled:text-[var(--color-text-disabled)] " +
-        "dark:bg-[var(--color-neutral-900)] dark:outline-[var(--color-neutral-700)] dark:text-[var(--color-neutral-200)] " +
-        "dark:focus:outline-[var(--color-primary-500)] dark:focus:ring-[var(--color-primary-500)]/20",
-    // Size variants for raw input
-    rawInputSizes: {
-        sm: `${formsBaseTheme.sizes.sm.text} ${formsBaseTheme.sizes.sm.padding} ${formsBaseTheme.sizes.sm.height}`,
-        md: `${formsBaseTheme.sizes.md.text} ${formsBaseTheme.sizes.md.padding} ${formsBaseTheme.sizes.md.height}`,
-        lg: `${formsBaseTheme.sizes.lg.text} ${formsBaseTheme.sizes.lg.padding} ${formsBaseTheme.sizes.lg.height}`,
-    },
-    // Mode toggle button
-    modeToggleStyle: "inline-flex items-center justify-center rounded-[var(--form-radius)] px-3 py-1.5 text-xs font-medium " +
-        "cursor-pointer transition-all outline outline-1 outline-[var(--color-border)] " +
-        "text-[var(--color-text-secondary)] bg-white hover:bg-[var(--color-background-secondary)] " +
-        "dark:bg-[var(--color-neutral-900)] dark:outline-[var(--color-neutral-700)] dark:text-[var(--color-neutral-400)] " +
-        "dark:hover:bg-[var(--color-neutral-800)]",
-    // Active mode toggle
-    modeToggleActiveStyle: "outline-[var(--color-primary)] bg-[var(--color-primary-50)] text-[var(--color-primary)] " +
-        "hover:bg-[var(--color-primary-50)] " +
-        "dark:outline-[var(--color-primary-500)] dark:bg-[var(--color-primary-500)]/10 dark:text-[var(--color-primary-400)] " +
-        "dark:hover:bg-[var(--color-primary-500)]/15",
-    // Preset button
-    presetButtonStyle: "inline-flex items-center rounded-[var(--form-radius)] px-2.5 py-1 text-xs font-medium " +
-        "cursor-pointer transition-all outline outline-1 outline-[var(--color-border)] " +
-        "text-[var(--color-text-secondary)] bg-white hover:bg-[var(--color-background-secondary)] " +
-        "hover:text-[var(--color-text-primary)] " +
-        "dark:bg-[var(--color-neutral-900)] dark:outline-[var(--color-neutral-700)] dark:text-[var(--color-neutral-400)] " +
-        "dark:hover:bg-[var(--color-neutral-800)] dark:hover:text-[var(--color-neutral-200)]",
-    // Active preset button
-    presetButtonActiveStyle: "outline-[var(--color-primary)] bg-[var(--color-primary-50)] text-[var(--color-primary)] " +
-        "hover:bg-[var(--color-primary-100)] " +
-        "dark:outline-[var(--color-primary-500)] dark:bg-[var(--color-primary-500)]/10 dark:text-[var(--color-primary-400)]",
-    // Human-readable description
-    descriptionStyle: "flex items-center gap-2 text-sm text-[var(--color-text-muted)] " +
-        "dark:text-[var(--color-neutral-400)]",
-    // Next runs container
-    nextRunsStyle: "flex flex-col gap-1",
-    // Individual next run item
-    nextRunItemStyle: "flex items-center gap-2 text-xs text-[var(--color-text-muted)] " +
-        "dark:text-[var(--color-neutral-400)]",
-    // Section heading
-    sectionHeadingStyle: "text-xs font-medium text-[var(--color-text-secondary)] uppercase tracking-wide " +
-        "dark:text-[var(--color-neutral-400)]",
-    // Validation error
-    errorStyle: "text-xs text-[var(--color-danger)] dark:text-[var(--color-danger-400)]",
-};
-
-export { cronInputTheme };

package/dist/components/forms/CronInput/CronInput.types.d.ts

@@ -1,98 +0,0 @@
-import React from "react";
-/**
- * CronInput component props
- * A visual cron expression builder that outputs standard cron syntax
- */
-export interface CronInputProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
-    /** Controlled cron expression string, e.g. "0 9 * * 1" */
-    value?: string;
-    /** Default cron expression for uncontrolled usage */
-    defaultValue?: string;
-    /** Callback fired when the cron expression changes */
-    onChange?: (cronExpression: string) => void;
-    /** Whether to show preset schedule buttons */
-    showPresets?: boolean;
-    /** Whether to show the human-readable description */
-    showDescription?: boolean;
-    /** Whether to show upcoming execution times */
-    showNextRuns?: boolean;
-    /** Number of next run times to display (default: 3) */
-    nextRunCount?: number;
-    /** Size variant */
-    size?: CronInputSize;
-    /** Display mode: visual builder, raw string input, or both */
-    mode?: CronInputMode;
-    /** Additional class name (highest priority, shadcn pattern) */
-    className?: string;
-    /** Theme overrides for sub-component styling */
-    theme?: CronInputThemeOverrides;
-    /** Whether the input is disabled */
-    disabled?: boolean;
-    /** Label text for the component */
-    label?: string;
-}
-export type CronInputSize = "sm" | "md" | "lg";
-export type CronInputMode = "visual" | "raw" | "both";
-/**
- * Parsed cron fields
- */
-export interface CronFields {
-    minute: string;
-    hour: string;
-    dayOfMonth: string;
-    month: string;
-    dayOfWeek: string;
-}
-/**
- * Preset schedule definition
- */
-export interface CronPreset {
-    label: string;
-    value: string;
-    description: string;
-}
-/**
- * Theme structure for CronInput component
- */
-export interface CronInputTheme {
-    /** Outer wrapper */
-    baseStyle: string;
-    /** Label text */
-    labelStyle: string;
-    /** Visual builder section */
-    builderStyle: string;
-    /** Individual field group (label + select) */
-    fieldGroupStyle: string;
-    /** Field label */
-    fieldLabelStyle: string;
-    /** Select dropdown for each field */
-    fieldSelectStyle: string;
-    /** Size variants for the select dropdowns */
-    fieldSelectSizes: Record<CronInputSize, string>;
-    /** Raw input field */
-    rawInputStyle: string;
-    /** Size variants for the raw input */
-    rawInputSizes: Record<CronInputSize, string>;
-    /** Mode toggle button */
-    modeToggleStyle: string;
-    /** Active mode toggle button */
-    modeToggleActiveStyle: string;
-    /** Preset button */
-    presetButtonStyle: string;
-    /** Active preset button */
-    presetButtonActiveStyle: string;
-    /** Human-readable description */
-    descriptionStyle: string;
-    /** Next runs container */
-    nextRunsStyle: string;
-    /** Individual next run time */
-    nextRunItemStyle: string;
-    /** Section heading style */
-    sectionHeadingStyle: string;
-    /** Validation error style */
-    errorStyle: string;
-}
-/**
- * Theme overrides - all optional for partial customization
- */
-export type CronInputThemeOverrides = Partial<CronInputTheme>;

package/dist/components/forms/CronInput/CronInput.utils.d.ts

@@ -1,67 +0,0 @@
-import { CronFields, CronPreset } from "./CronInput.types";
-export declare const MONTH_NAMES: readonly ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
-export declare const MONTH_SHORT_NAMES: readonly ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
-export declare const DAY_NAMES: readonly ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
-export declare const DAY_SHORT_NAMES: readonly ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
-/**
- * Preset cron schedules for common use cases
- */
-export declare const CRON_PRESETS: CronPreset[];
-export interface FieldOption {
-    value: string;
-    label: string;
-}
-/**
- * Generate minute options: every minute (*), specific minutes, and intervals
- */
-export declare function getMinuteOptions(): FieldOption[];
-/**
- * Generate hour options: every hour (*), specific hours, and intervals
- */
-export declare function getHourOptions(): FieldOption[];
-/**
- * Generate day-of-month options: every day (*), specific days
- */
-export declare function getDayOfMonthOptions(): FieldOption[];
-/**
- * Generate month options: every month (*), specific months
- */
-export declare function getMonthOptions(): FieldOption[];
-/**
- * Generate day-of-week options: every day (*), specific days, ranges
- */
-export declare function getDayOfWeekOptions(): FieldOption[];
-/**
- * Parse a cron expression string into individual fields
- */
-export declare function parseCron(expr: string): CronFields;
-/**
- * Convert CronFields back to a cron expression string
- */
-export declare function fieldsToCron(fields: CronFields): string;
-/**
- * Validate a complete cron expression
- */
-export declare function validateCron(expr: string): boolean;
-/**
- * Convert a cron expression to a human-readable description
- */
-export declare function cronToDescription(expr: string): string;
-/**
- * Calculate the next N run times for a cron expression.
- * Uses a brute-force minute-by-minute scan (simple approach for common cases).
- *
- * @param expr - Cron expression string
- * @param count - Number of next runs to find (default: 3)
- * @param from - Starting date (default: now)
- * @returns Array of Date objects for the next runs
- */
-export declare function getNextRuns(expr: string, count?: number, from?: Date): Date[];
-/**
- * Format a Date as a human-readable next run string
- */
-export declare function formatNextRun(date: Date): string;
-/**
- * Check if a field value represents a specific number (not a pattern)
- */
-export declare function isSpecificValue(value: string): boolean;