@skybin-tech/nebula-ui 0.0.1

package/dist/cjs/components/Form/TextBox.cjs

@@ -0,0 +1,211 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const reactHookForm = require("react-hook-form");
+const index = require("../../node_modules/class-variance-authority/dist/index.cjs");
+const cn = require("../../utils/cn.cjs");
+const context = require("./context.cjs");
+const input = require("../ui/input.cjs");
+const label = require("../ui/label.cjs");
+const x = require("../../node_modules/lucide-react/dist/esm/icons/x.cjs");
+const textBoxVariants = index.cva(
+  "",
+  {
+    variants: {
+      size: {
+        sm: "h-8 text-xs px-2",
+        md: "h-10 text-sm px-3",
+        lg: "h-12 text-base px-4"
+      },
+      variant: {
+        default: "border-input focus-visible:ring-ring",
+        error: "border-destructive focus-visible:ring-destructive",
+        success: "border-green-500 focus-visible:ring-green-500"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      variant: "default"
+    }
+  }
+);
+const labelVariants = index.cva(
+  "block text-sm font-medium mb-1.5",
+  {
+    variants: {
+      required: {
+        true: "after:content-['*'] after:ml-0.5 after:text-destructive",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      required: false
+    }
+  }
+);
+function TextBoxInner({
+  name,
+  label: label$1,
+  helperText,
+  showError = true,
+  error: customError,
+  size,
+  variant,
+  fullWidth = true,
+  className,
+  disabled,
+  prefix,
+  suffix,
+  allowClear,
+  onClear,
+  id: providedId,
+  control: externalControl,
+  // Validation props
+  required,
+  minLength,
+  maxLength,
+  minValue,
+  maxValue,
+  pattern,
+  email,
+  url,
+  validate,
+  ...props
+}, ref) {
+  const generatedId = React.useId();
+  const inputId = providedId ?? generatedId;
+  const formConfigContext = React.useContext(context.FormConfigContext);
+  const formConfig = formConfigContext ?? {};
+  const rhfContext = reactHookForm.useFormContext();
+  const control = externalControl ?? rhfContext?.control;
+  React.useEffect(() => {
+    if (formConfigContext?.registerFieldValidation) {
+      const rules = {};
+      if (required !== void 0) rules.required = required;
+      if (minLength !== void 0) rules.minLength = minLength;
+      if (maxLength !== void 0) rules.maxLength = maxLength;
+      if (minValue !== void 0) rules.min = minValue;
+      if (maxValue !== void 0) rules.max = maxValue;
+      if (pattern !== void 0) rules.pattern = pattern;
+      if (email !== void 0) rules.email = email;
+      if (url !== void 0) rules.url = url;
+      if (validate !== void 0) rules.validate = validate;
+      const inputType = props.type ?? "text";
+      let fieldType = "string";
+      if (inputType === "number") {
+        fieldType = "number";
+      }
+      formConfigContext.registerFieldValidation({
+        name,
+        type: fieldType,
+        rules
+      });
+      return () => {
+        formConfigContext.unregisterFieldValidation(name);
+      };
+    }
+  }, [
+    formConfigContext,
+    name,
+    required,
+    minLength,
+    maxLength,
+    minValue,
+    maxValue,
+    pattern,
+    email,
+    url,
+    validate,
+    props.type
+  ]);
+  const { field, fieldState } = reactHookForm.useController({
+    name,
+    control
+  });
+  const fieldError = fieldState.error?.message;
+  const errorMessage = customError ?? fieldError;
+  const hasError = !!errorMessage;
+  const effectiveSize = size ?? formConfig.size ?? "md";
+  const effectiveDisabled = disabled ?? formConfig.disabled;
+  const effectiveVariant = hasError ? "error" : variant;
+  const handleClear = () => {
+    field.onChange("");
+    onClear?.();
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn.cn("space-y-1.5", fullWidth && "w-full"), children: [
+    label$1 && /* @__PURE__ */ jsxRuntime.jsxs(
+      label.Label,
+      {
+        htmlFor: inputId,
+        className: labelVariants({ required: !!required }),
+        children: [
+          label$1,
+          formConfig.colon && ":"
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      prefix && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground", children: prefix }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        input.Input,
+        {
+          ...props,
+          ...field,
+          ref: (node) => {
+            if (typeof ref === "function") {
+              ref(node);
+            } else if (ref) {
+              ref.current = node;
+            }
+            field.ref(node);
+          },
+          id: inputId,
+          disabled: effectiveDisabled,
+          "aria-invalid": hasError,
+          "aria-describedby": hasError ? `${inputId}-error` : helperText ? `${inputId}-helper` : void 0,
+          className: cn.cn(
+            textBoxVariants({ size: effectiveSize, variant: effectiveVariant }),
+            prefix && "pl-10",
+            (suffix || allowClear) && "pr-10",
+            className
+          )
+        }
+      ),
+      (suffix || allowClear && field.value) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center gap-1", children: [
+        allowClear && field.value && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: handleClear,
+            className: "text-muted-foreground hover:text-foreground transition-colors",
+            tabIndex: -1,
+            children: /* @__PURE__ */ jsxRuntime.jsx(x.default, { className: "h-4 w-4" })
+          }
+        ),
+        suffix && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: suffix })
+      ] })
+    ] }),
+    showError && hasError && /* @__PURE__ */ jsxRuntime.jsx(
+      "p",
+      {
+        id: `${inputId}-error`,
+        className: "text-sm text-destructive",
+        role: "alert",
+        children: errorMessage
+      }
+    ),
+    helperText && !hasError && /* @__PURE__ */ jsxRuntime.jsx(
+      "p",
+      {
+        id: `${inputId}-helper`,
+        className: "text-sm text-muted-foreground",
+        children: helperText
+      }
+    )
+  ] });
+}
+const TextBox = React.forwardRef(TextBoxInner);
+TextBox.displayName = "TextBox";
+exports.TextBox = TextBox;
+//# sourceMappingURL=TextBox.cjs.map

package/dist/cjs/components/Form/TextBox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextBox.cjs","sources":["../../../../src/components/Form/TextBox.tsx"],"sourcesContent":["import { forwardRef, useId, useContext, useEffect } from \"react\";\r\nimport type { InputHTMLAttributes, ReactNode } from \"react\";\r\nimport { useController, useFormContext as useRHFFormContext, type FieldValues, type FieldPath, type Control } from \"react-hook-form\";\r\nimport { cva, type VariantProps } from \"class-variance-authority\";\r\nimport { cn } from \"../../utils/cn\";\r\nimport { FormConfigContext, type FormConfig, type FieldValidationRules } from \"../Form/context\";\r\nimport { Input } from \"../ui/input\";\r\nimport { Label } from \"../ui/label\";\r\nimport { X } from \"lucide-react\";\r\n\r\nconst textBoxVariants = cva(\r\n  \"\",\r\n  {\r\n    variants: {\r\n      size: {\r\n        sm: \"h-8 text-xs px-2\",\r\n        md: \"h-10 text-sm px-3\",\r\n        lg: \"h-12 text-base px-4\",\r\n      },\r\n      variant: {\r\n        default: \"border-input focus-visible:ring-ring\",\r\n        error: \"border-destructive focus-visible:ring-destructive\",\r\n        success: \"border-green-500 focus-visible:ring-green-500\",\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      size: \"md\",\r\n      variant: \"default\",\r\n    },\r\n  }\r\n);\r\n\r\nconst labelVariants = cva(\r\n  \"block text-sm font-medium mb-1.5\",\r\n  {\r\n    variants: {\r\n      required: {\r\n        true: \"after:content-['*'] after:ml-0.5 after:text-destructive\",\r\n        false: \"\",\r\n      },\r\n    },\r\n    defaultVariants: {\r\n      required: false,\r\n    },\r\n  }\r\n);\r\n\r\n/**\r\n * Validation rule with optional custom message\r\n */\r\ntype ValidationRule<T> = T | { value: T; message: string };\r\n\r\nexport interface TextBoxProps<\r\n  TFieldValues extends FieldValues = FieldValues,\r\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\r\n> extends Omit<InputHTMLAttributes<HTMLInputElement>, \"size\" | \"name\" | \"prefix\" | \"pattern\" | \"required\" | \"minLength\" | \"maxLength\">,\r\n    VariantProps<typeof textBoxVariants> {\r\n  /** Field name - required for form integration */\r\n  name: TName;\r\n  /** Label text for the input */\r\n  label?: string;\r\n  /** Helper text displayed below the input */\r\n  helperText?: string;\r\n  /** Whether to show the error message */\r\n  showError?: boolean;\r\n  /** Custom error message (overrides form error) */\r\n  error?: string;\r\n  /** Whether the input should take full width */\r\n  fullWidth?: boolean;\r\n  /** Prefix element */\r\n  prefix?: ReactNode;\r\n  /** Suffix element */\r\n  suffix?: ReactNode;\r\n  /** Allow clear button */\r\n  allowClear?: boolean;\r\n  /** Callback when clear is clicked */\r\n  onClear?: () => void;\r\n  /** External control (for use outside Form) */\r\n  control?: Control<TFieldValues>;\r\n  \r\n  // Validation props\r\n  /** Field is required */\r\n  required?: boolean | string;\r\n  /** Minimum length for strings */\r\n  minLength?: ValidationRule<number>;\r\n  /** Maximum length for strings */\r\n  maxLength?: ValidationRule<number>;\r\n  /** Minimum value for numbers */\r\n  minValue?: ValidationRule<number>;\r\n  /** Maximum value for numbers */\r\n  maxValue?: ValidationRule<number>;\r\n  /** Regex pattern for validation */\r\n  pattern?: ValidationRule<RegExp>;\r\n  /** Email validation */\r\n  email?: boolean | string;\r\n  /** URL validation */\r\n  url?: boolean | string;\r\n  /** Custom validation function */\r\n  validate?: (value: unknown) => boolean | string | Promise<boolean | string>;\r\n}\r\n\r\n/**\r\n * TextBox component with form integration and automatic validation registration\r\n * \r\n * This is a wrapper around the shadcn/ui Input primitive that adds:\r\n * - Form integration with react-hook-form\r\n * - Automatic validation registration\r\n * - Label, helper text, and error message support\r\n * - Prefix/suffix elements\r\n * - Clear button functionality\r\n * \r\n * @example\r\n * ```tsx\r\n * // Inside a Form component - validation is automatically registered\r\n * <Form onSubmit={handleSubmit} defaultValues={{ username: \"\", email: \"\" }}>\r\n *   <TextBox name=\"username\" label=\"Username\" required minLength={3} maxLength={50} />\r\n *   <TextBox name=\"email\" label=\"Email\" type=\"email\" required email />\r\n *   <TextBox name=\"website\" label=\"Website\" url />\r\n *   <Button type=\"submit\">Submit</Button>\r\n * </Form>\r\n * ```\r\n */\r\nfunction TextBoxInner<\r\n  TFieldValues extends FieldValues = FieldValues,\r\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\r\n>(\r\n  {\r\n    name,\r\n    label,\r\n    helperText,\r\n    showError = true,\r\n    error: customError,\r\n    size,\r\n    variant,\r\n    fullWidth = true,\r\n    className,\r\n    disabled,\r\n    prefix,\r\n    suffix,\r\n    allowClear,\r\n    onClear,\r\n    id: providedId,\r\n    control: externalControl,\r\n    // Validation props\r\n    required,\r\n    minLength,\r\n    maxLength,\r\n    minValue,\r\n    maxValue,\r\n    pattern,\r\n    email,\r\n    url,\r\n    validate,\r\n    ...props\r\n  }: TextBoxProps<TFieldValues, TName>,\r\n  ref: React.ForwardedRef<HTMLInputElement>\r\n) {\r\n  const generatedId = useId();\r\n  const inputId = providedId ?? generatedId;\r\n  \r\n  // Try to get form context\r\n  const formConfigContext = useContext(FormConfigContext);\r\n  const formConfig: FormConfig = formConfigContext ?? {};\r\n  \r\n  // Get form context from react-hook-form\r\n  const rhfContext = useRHFFormContext<TFieldValues>();\r\n  const control = externalControl ?? rhfContext?.control;\r\n\r\n  // Register validation rules with the form\r\n  useEffect(() => {\r\n    if (formConfigContext?.registerFieldValidation) {\r\n      const rules: FieldValidationRules = {};\r\n      \r\n      if (required !== undefined) rules.required = required;\r\n      if (minLength !== undefined) rules.minLength = minLength;\r\n      if (maxLength !== undefined) rules.maxLength = maxLength;\r\n      if (minValue !== undefined) rules.min = minValue;\r\n      if (maxValue !== undefined) rules.max = maxValue;\r\n      if (pattern !== undefined) rules.pattern = pattern;\r\n      if (email !== undefined) rules.email = email;\r\n      if (url !== undefined) rules.url = url;\r\n      if (validate !== undefined) rules.validate = validate;\r\n\r\n      // Determine field type based on input type\r\n      const inputType = props.type ?? \"text\";\r\n      let fieldType: \"string\" | \"number\" = \"string\";\r\n      if (inputType === \"number\") {\r\n        fieldType = \"number\";\r\n      }\r\n\r\n      formConfigContext.registerFieldValidation({\r\n        name: name as string,\r\n        type: fieldType,\r\n        rules,\r\n      });\r\n\r\n      return () => {\r\n        formConfigContext.unregisterFieldValidation(name as string);\r\n      };\r\n    }\r\n  }, [\r\n    formConfigContext,\r\n    name,\r\n    required,\r\n    minLength,\r\n    maxLength,\r\n    minValue,\r\n    maxValue,\r\n    pattern,\r\n    email,\r\n    url,\r\n    validate,\r\n    props.type,\r\n  ]);\r\n\r\n  // Use controller for form integration\r\n  const { field, fieldState } = useController<TFieldValues, TName>({\r\n    name,\r\n    control,\r\n  });\r\n\r\n  const fieldError = fieldState.error?.message;\r\n  const errorMessage = customError ?? fieldError;\r\n  const hasError = !!errorMessage;\r\n  \r\n  // Merge sizes - prop takes precedence over form config\r\n  const effectiveSize = size ?? formConfig.size ?? \"md\";\r\n  const effectiveDisabled = disabled ?? formConfig.disabled;\r\n  \r\n  // Determine variant based on error state\r\n  const effectiveVariant = hasError ? \"error\" : variant;\r\n\r\n  const handleClear = () => {\r\n    field.onChange(\"\");\r\n    onClear?.();\r\n  };\r\n\r\n  return (\r\n    <div className={cn(\"space-y-1.5\", fullWidth && \"w-full\")}>\r\n      {label && (\r\n        <Label\r\n          htmlFor={inputId}\r\n          className={labelVariants({ required: !!required })}\r\n        >\r\n          {label}\r\n          {formConfig.colon && \":\"}\r\n        </Label>\r\n      )}\r\n      \r\n      <div className=\"relative\">\r\n        {prefix && (\r\n          <div className=\"absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground\">\r\n            {prefix}\r\n          </div>\r\n        )}\r\n        \r\n        <Input\r\n          {...props}\r\n          {...field}\r\n          ref={(node) => {\r\n            // Handle both refs\r\n            if (typeof ref === \"function\") {\r\n              ref(node);\r\n            } else if (ref) {\r\n              ref.current = node;\r\n            }\r\n            field.ref(node);\r\n          }}\r\n          id={inputId}\r\n          disabled={effectiveDisabled}\r\n          aria-invalid={hasError}\r\n          aria-describedby={\r\n            hasError\r\n              ? `${inputId}-error`\r\n              : helperText\r\n              ? `${inputId}-helper`\r\n              : undefined\r\n          }\r\n          className={cn(\r\n            textBoxVariants({ size: effectiveSize, variant: effectiveVariant }),\r\n            prefix && \"pl-10\",\r\n            (suffix || allowClear) && \"pr-10\",\r\n            className\r\n          )}\r\n        />\r\n        \r\n        {(suffix || (allowClear && field.value)) && (\r\n          <div className=\"absolute right-3 top-1/2 -translate-y-1/2 flex items-center gap-1\">\r\n            {allowClear && field.value && (\r\n              <button\r\n                type=\"button\"\r\n                onClick={handleClear}\r\n                className=\"text-muted-foreground hover:text-foreground transition-colors\"\r\n                tabIndex={-1}\r\n              >\r\n                <X className=\"h-4 w-4\" />\r\n              </button>\r\n            )}\r\n            {suffix && (\r\n              <span className=\"text-muted-foreground\">{suffix}</span>\r\n            )}\r\n          </div>\r\n        )}\r\n      </div>\r\n\r\n      {showError && hasError && (\r\n        <p\r\n          id={`${inputId}-error`}\r\n          className=\"text-sm text-destructive\"\r\n          role=\"alert\"\r\n        >\r\n          {errorMessage}\r\n        </p>\r\n      )}\r\n      \r\n      {helperText && !hasError && (\r\n        <p\r\n          id={`${inputId}-helper`}\r\n          className=\"text-sm text-muted-foreground\"\r\n        >\r\n          {helperText}\r\n        </p>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n\r\n// Use forwardRef with generic support\r\nexport const TextBox = forwardRef(TextBoxInner) as <\r\n  TFieldValues extends FieldValues = FieldValues,\r\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\r\n>(\r\n  props: TextBoxProps<TFieldValues, TName> & { ref?: React.ForwardedRef<HTMLInputElement> }\r\n) => React.ReactElement;\r\n\r\n(TextBox as React.FC).displayName = \"TextBox\";\r\n"],"names":["cva","label","useId","useContext","FormConfigContext","useRHFFormContext","useEffect","useController","cn","jsxs","Label","jsx","Input","X","forwardRef"],"mappings":"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"}

package/dist/cjs/components/Form/context.cjs

@@ -0,0 +1,131 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const zod = require("zod");
+const defaultFormConfig = {
+  showInlineErrors: true,
+  validateOnBlur: true,
+  validateOnChange: false,
+  size: "md",
+  layout: "vertical",
+  disabled: false,
+  colon: true
+};
+const FormConfigContext = React.createContext(null);
+function buildZodSchemaFromRules(type, rules) {
+  const getValueAndMessage = (rule, defaultMessage) => {
+    if (rule === void 0) return null;
+    if (typeof rule === "object" && rule !== null && "value" in rule) {
+      return rule;
+    }
+    return { value: rule, message: defaultMessage };
+  };
+  if (type === "string") {
+    let schema = zod.z.string();
+    const minLengthRule = getValueAndMessage(
+      rules.minLength,
+      `Minimum ${typeof rules.minLength === "number" ? rules.minLength : rules.minLength?.value} characters required`
+    );
+    if (minLengthRule) {
+      schema = schema.min(minLengthRule.value, minLengthRule.message);
+    }
+    const maxLengthRule = getValueAndMessage(
+      rules.maxLength,
+      `Maximum ${typeof rules.maxLength === "number" ? rules.maxLength : rules.maxLength?.value} characters allowed`
+    );
+    if (maxLengthRule) {
+      schema = schema.max(maxLengthRule.value, maxLengthRule.message);
+    }
+    if (rules.pattern !== void 0) {
+      const patternRule = rules.pattern instanceof RegExp ? { value: rules.pattern, message: "Invalid format" } : rules.pattern;
+      schema = schema.regex(patternRule.value, patternRule.message);
+    }
+    if (rules.email) {
+      const message = typeof rules.email === "string" ? rules.email : "Invalid email address";
+      schema = schema.email(message);
+    }
+    if (rules.url) {
+      const message = typeof rules.url === "string" ? rules.url : "Invalid URL";
+      schema = schema.url(message);
+    }
+    if (rules.required) {
+      const message = typeof rules.required === "string" ? rules.required : "This field is required";
+      schema = schema.min(1, message);
+      return schema;
+    }
+    return schema.optional();
+  }
+  if (type === "number") {
+    let schema = zod.z.coerce.number();
+    const minRule = getValueAndMessage(
+      rules.min,
+      `Minimum value is ${typeof rules.min === "number" ? rules.min : rules.min?.value}`
+    );
+    if (minRule) {
+      schema = schema.min(minRule.value, minRule.message);
+    }
+    const maxRule = getValueAndMessage(
+      rules.max,
+      `Maximum value is ${typeof rules.max === "number" ? rules.max : rules.max?.value}`
+    );
+    if (maxRule) {
+      schema = schema.max(maxRule.value, maxRule.message);
+    }
+    if (!rules.required) {
+      return schema.optional();
+    }
+    return schema;
+  }
+  if (type === "boolean") {
+    const schema = zod.z.boolean();
+    if (rules.required) {
+      return schema.refine((val) => val === true, {
+        message: typeof rules.required === "string" ? rules.required : "This field is required"
+      });
+    }
+    return schema.optional();
+  }
+  if (type === "date") {
+    const schema = zod.z.coerce.date();
+    if (!rules.required) {
+      return schema.optional();
+    }
+    return schema;
+  }
+  if (type === "array") {
+    let schema = zod.z.array(zod.z.unknown());
+    if (rules.required) {
+      const message = typeof rules.required === "string" ? rules.required : "This field is required";
+      schema = schema.min(1, message);
+    }
+    return schema;
+  }
+  return zod.z.unknown();
+}
+function useFieldValidationRegistry() {
+  const fieldsRef = React.useRef(/* @__PURE__ */ new Map());
+  const registerFieldValidation = React.useCallback((field) => {
+    fieldsRef.current.set(field.name, field);
+  }, []);
+  const unregisterFieldValidation = React.useCallback((name) => {
+    fieldsRef.current.delete(name);
+  }, []);
+  const getValidationSchema = React.useCallback(() => {
+    const shape = {};
+    fieldsRef.current.forEach((field) => {
+      shape[field.name] = buildZodSchemaFromRules(field.type, field.rules);
+    });
+    return zod.z.object(shape);
+  }, []);
+  return {
+    registerFieldValidation,
+    unregisterFieldValidation,
+    getValidationSchema,
+    fieldsRef
+  };
+}
+exports.FormConfigContext = FormConfigContext;
+exports.buildZodSchemaFromRules = buildZodSchemaFromRules;
+exports.defaultFormConfig = defaultFormConfig;
+exports.useFieldValidationRegistry = useFieldValidationRegistry;
+//# sourceMappingURL=context.cjs.map

package/dist/cjs/components/Form/context.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.cjs","sources":["../../../../src/components/Form/context.ts"],"sourcesContent":["import { createContext, useCallback, useRef } from \"react\";\r\nimport type { UseFormReturn, FieldValues } from \"react-hook-form\";\r\nimport { z } from \"zod\";\r\n\r\n/**\r\n * Validation rule types that can be applied to form fields\r\n */\r\nexport interface FieldValidationRules {\r\n  /** Field is required */\r\n  required?: boolean | string;\r\n  /** Minimum length for strings */\r\n  minLength?: number | { value: number; message: string };\r\n  /** Maximum length for strings */\r\n  maxLength?: number | { value: number; message: string };\r\n  /** Minimum value for numbers */\r\n  min?: number | { value: number; message: string };\r\n  /** Maximum value for numbers */\r\n  max?: number | { value: number; message: string };\r\n  /** Regex pattern for validation */\r\n  pattern?: RegExp | { value: RegExp; message: string };\r\n  /** Email validation */\r\n  email?: boolean | string;\r\n  /** URL validation */\r\n  url?: boolean | string;\r\n  /** Custom validation function */\r\n  validate?: (value: unknown) => boolean | string | Promise<boolean | string>;\r\n}\r\n\r\n/**\r\n * Form configuration options\r\n */\r\nexport interface FormConfig {\r\n  /** Show validation errors inline */\r\n  showInlineErrors?: boolean;\r\n  /** Validate on blur */\r\n  validateOnBlur?: boolean;\r\n  /** Validate on change */\r\n  validateOnChange?: boolean;\r\n  /** Size of form controls */\r\n  size?: \"sm\" | \"md\" | \"lg\";\r\n  /** Layout direction */\r\n  layout?: \"horizontal\" | \"vertical\" | \"inline\";\r\n  /** Label width for horizontal layout */\r\n  labelWidth?: string | number;\r\n  /** Whether form is disabled */\r\n  disabled?: boolean;\r\n  /** Colon after label */\r\n  colon?: boolean;\r\n}\r\n\r\n/**\r\n * Field registration info\r\n */\r\nexport interface FieldRegistration {\r\n  name: string;\r\n  type: \"string\" | \"number\" | \"boolean\" | \"date\" | \"array\";\r\n  rules: FieldValidationRules;\r\n}\r\n\r\n/**\r\n * Form context value\r\n */\r\nexport interface FormContextValue<TFieldValues extends FieldValues = FieldValues>\r\n  extends FormConfig {\r\n  form: UseFormReturn<TFieldValues>;\r\n  /** Register a field's validation rules */\r\n  registerFieldValidation: (field: FieldRegistration) => void;\r\n  /** Unregister a field's validation rules */\r\n  unregisterFieldValidation: (name: string) => void;\r\n  /** Get current validation schema */\r\n  getValidationSchema: () => z.ZodObject<Record<string, z.ZodTypeAny>>;\r\n  /** Trigger validation for a specific field */\r\n  triggerValidation: (name: string) => Promise<boolean>;\r\n}\r\n\r\n/**\r\n * Default form configuration\r\n */\r\nexport const defaultFormConfig: FormConfig = {\r\n  showInlineErrors: true,\r\n  validateOnBlur: true,\r\n  validateOnChange: false,\r\n  size: \"md\",\r\n  layout: \"vertical\",\r\n  disabled: false,\r\n  colon: true,\r\n};\r\n\r\n/**\r\n * Form context for sharing form state and configuration\r\n */\r\nexport const FormConfigContext = createContext<FormContextValue | null>(null);\r\n\r\n/**\r\n * Build a Zod schema from validation rules\r\n */\r\nexport function buildZodSchemaFromRules(\r\n  type: FieldRegistration[\"type\"],\r\n  rules: FieldValidationRules\r\n): z.ZodTypeAny {\r\n  // Helper to extract value and message\r\n  const getValueAndMessage = <T>(\r\n    rule: T | { value: T; message: string } | undefined,\r\n    defaultMessage: string\r\n  ): { value: T; message: string } | null => {\r\n    if (rule === undefined) return null;\r\n    if (typeof rule === \"object\" && rule !== null && \"value\" in rule) {\r\n      return rule as { value: T; message: string };\r\n    }\r\n    return { value: rule as T, message: defaultMessage };\r\n  };\r\n\r\n  // Build string schema\r\n  if (type === \"string\") {\r\n    let schema = z.string();\r\n\r\n    const minLengthRule = getValueAndMessage(\r\n      rules.minLength,\r\n      `Minimum ${typeof rules.minLength === \"number\" ? rules.minLength : (rules.minLength as { value: number })?.value} characters required`\r\n    );\r\n    if (minLengthRule) {\r\n      schema = schema.min(minLengthRule.value as number, minLengthRule.message);\r\n    }\r\n\r\n    const maxLengthRule = getValueAndMessage(\r\n      rules.maxLength,\r\n      `Maximum ${typeof rules.maxLength === \"number\" ? rules.maxLength : (rules.maxLength as { value: number })?.value} characters allowed`\r\n    );\r\n    if (maxLengthRule) {\r\n      schema = schema.max(maxLengthRule.value as number, maxLengthRule.message);\r\n    }\r\n\r\n    if (rules.pattern !== undefined) {\r\n      const patternRule = rules.pattern instanceof RegExp\r\n        ? { value: rules.pattern, message: \"Invalid format\" }\r\n        : rules.pattern;\r\n      schema = schema.regex(patternRule.value, patternRule.message);\r\n    }\r\n\r\n    if (rules.email) {\r\n      const message = typeof rules.email === \"string\" ? rules.email : \"Invalid email address\";\r\n      schema = schema.email(message);\r\n    }\r\n\r\n    if (rules.url) {\r\n      const message = typeof rules.url === \"string\" ? rules.url : \"Invalid URL\";\r\n      schema = schema.url(message);\r\n    }\r\n\r\n    // Handle required - for strings, require non-empty\r\n    if (rules.required) {\r\n      const message = typeof rules.required === \"string\" ? rules.required : \"This field is required\";\r\n      schema = schema.min(1, message);\r\n      return schema;\r\n    }\r\n\r\n    return schema.optional();\r\n  }\r\n\r\n  // Build number schema\r\n  if (type === \"number\") {\r\n    let schema = z.coerce.number();\r\n\r\n    const minRule = getValueAndMessage(\r\n      rules.min,\r\n      `Minimum value is ${typeof rules.min === \"number\" ? rules.min : (rules.min as { value: number })?.value}`\r\n    );\r\n    if (minRule) {\r\n      schema = schema.min(minRule.value as number, minRule.message);\r\n    }\r\n\r\n    const maxRule = getValueAndMessage(\r\n      rules.max,\r\n      `Maximum value is ${typeof rules.max === \"number\" ? rules.max : (rules.max as { value: number })?.value}`\r\n    );\r\n    if (maxRule) {\r\n      schema = schema.max(maxRule.value as number, maxRule.message);\r\n    }\r\n\r\n    if (!rules.required) {\r\n      return schema.optional();\r\n    }\r\n    return schema;\r\n  }\r\n\r\n  // Build boolean schema\r\n  if (type === \"boolean\") {\r\n    const schema = z.boolean();\r\n    if (rules.required) {\r\n      // For required boolean, must be true (like accepting terms)\r\n      return schema.refine((val) => val === true, {\r\n        message: typeof rules.required === \"string\" ? rules.required : \"This field is required\",\r\n      });\r\n    }\r\n    return schema.optional();\r\n  }\r\n\r\n  // Build date schema\r\n  if (type === \"date\") {\r\n    const schema = z.coerce.date();\r\n    if (!rules.required) {\r\n      return schema.optional();\r\n    }\r\n    return schema;\r\n  }\r\n\r\n  // Build array schema\r\n  if (type === \"array\") {\r\n    let schema = z.array(z.unknown());\r\n    if (rules.required) {\r\n      const message = typeof rules.required === \"string\" ? rules.required : \"This field is required\";\r\n      schema = schema.min(1, message);\r\n    }\r\n    return schema;\r\n  }\r\n\r\n  // Default fallback\r\n  return z.unknown();\r\n}\r\n\r\n/**\r\n * Hook to manage field validations\r\n */\r\nexport function useFieldValidationRegistry() {\r\n  const fieldsRef = useRef<Map<string, FieldRegistration>>(new Map());\r\n\r\n  const registerFieldValidation = useCallback((field: FieldRegistration) => {\r\n    fieldsRef.current.set(field.name, field);\r\n  }, []);\r\n\r\n  const unregisterFieldValidation = useCallback((name: string) => {\r\n    fieldsRef.current.delete(name);\r\n  }, []);\r\n\r\n  const getValidationSchema = useCallback(() => {\r\n    const shape: Record<string, z.ZodTypeAny> = {};\r\n    \r\n    fieldsRef.current.forEach((field) => {\r\n      shape[field.name] = buildZodSchemaFromRules(field.type, field.rules);\r\n    });\r\n\r\n    return z.object(shape);\r\n  }, []);\r\n\r\n  return {\r\n    registerFieldValidation,\r\n    unregisterFieldValidation,\r\n    getValidationSchema,\r\n    fieldsRef,\r\n  };\r\n}\r\n"],"names":["createContext","z","useRef","useCallback"],"mappings":";;;;AA8EO,MAAM,oBAAgC;AAAA,EAC3C,kBAAkB;AAAA,EAClB,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,OAAO;AACT;AAKO,MAAM,oBAAoBA,MAAAA,cAAuC,IAAI;AAKrE,SAAS,wBACd,MACA,OACc;AAEd,QAAM,qBAAqB,CACzB,MACA,mBACyC;AACzC,QAAI,SAAS,OAAW,QAAO;AAC/B,QAAI,OAAO,SAAS,YAAY,SAAS,QAAQ,WAAW,MAAM;AAChE,aAAO;AAAA,IACT;AACA,WAAO,EAAE,OAAO,MAAW,SAAS,eAAA;AAAA,EACtC;AAGA,MAAI,SAAS,UAAU;AACrB,QAAI,SAASC,IAAAA,EAAE,OAAA;AAEf,UAAM,gBAAgB;AAAA,MACpB,MAAM;AAAA,MACN,WAAW,OAAO,MAAM,cAAc,WAAW,MAAM,YAAa,MAAM,WAAiC,KAAK;AAAA,IAAA;AAElH,QAAI,eAAe;AACjB,eAAS,OAAO,IAAI,cAAc,OAAiB,cAAc,OAAO;AAAA,IAC1E;AAEA,UAAM,gBAAgB;AAAA,MACpB,MAAM;AAAA,MACN,WAAW,OAAO,MAAM,cAAc,WAAW,MAAM,YAAa,MAAM,WAAiC,KAAK;AAAA,IAAA;AAElH,QAAI,eAAe;AACjB,eAAS,OAAO,IAAI,cAAc,OAAiB,cAAc,OAAO;AAAA,IAC1E;AAEA,QAAI,MAAM,YAAY,QAAW;AAC/B,YAAM,cAAc,MAAM,mBAAmB,SACzC,EAAE,OAAO,MAAM,SAAS,SAAS,iBAAA,IACjC,MAAM;AACV,eAAS,OAAO,MAAM,YAAY,OAAO,YAAY,OAAO;AAAA,IAC9D;AAEA,QAAI,MAAM,OAAO;AACf,YAAM,UAAU,OAAO,MAAM,UAAU,WAAW,MAAM,QAAQ;AAChE,eAAS,OAAO,MAAM,OAAO;AAAA,IAC/B;AAEA,QAAI,MAAM,KAAK;AACb,YAAM,UAAU,OAAO,MAAM,QAAQ,WAAW,MAAM,MAAM;AAC5D,eAAS,OAAO,IAAI,OAAO;AAAA,IAC7B;AAGA,QAAI,MAAM,UAAU;AAClB,YAAM,UAAU,OAAO,MAAM,aAAa,WAAW,MAAM,WAAW;AACtE,eAAS,OAAO,IAAI,GAAG,OAAO;AAC9B,aAAO;AAAA,IACT;AAEA,WAAO,OAAO,SAAA;AAAA,EAChB;AAGA,MAAI,SAAS,UAAU;AACrB,QAAI,SAASA,IAAAA,EAAE,OAAO,OAAA;AAEtB,UAAM,UAAU;AAAA,MACd,MAAM;AAAA,MACN,oBAAoB,OAAO,MAAM,QAAQ,WAAW,MAAM,MAAO,MAAM,KAA2B,KAAK;AAAA,IAAA;AAEzG,QAAI,SAAS;AACX,eAAS,OAAO,IAAI,QAAQ,OAAiB,QAAQ,OAAO;AAAA,IAC9D;AAEA,UAAM,UAAU;AAAA,MACd,MAAM;AAAA,MACN,oBAAoB,OAAO,MAAM,QAAQ,WAAW,MAAM,MAAO,MAAM,KAA2B,KAAK;AAAA,IAAA;AAEzG,QAAI,SAAS;AACX,eAAS,OAAO,IAAI,QAAQ,OAAiB,QAAQ,OAAO;AAAA,IAC9D;AAEA,QAAI,CAAC,MAAM,UAAU;AACnB,aAAO,OAAO,SAAA;AAAA,IAChB;AACA,WAAO;AAAA,EACT;AAGA,MAAI,SAAS,WAAW;AACtB,UAAM,SAASA,IAAAA,EAAE,QAAA;AACjB,QAAI,MAAM,UAAU;AAElB,aAAO,OAAO,OAAO,CAAC,QAAQ,QAAQ,MAAM;AAAA,QAC1C,SAAS,OAAO,MAAM,aAAa,WAAW,MAAM,WAAW;AAAA,MAAA,CAChE;AAAA,IACH;AACA,WAAO,OAAO,SAAA;AAAA,EAChB;AAGA,MAAI,SAAS,QAAQ;AACnB,UAAM,SAASA,IAAAA,EAAE,OAAO,KAAA;AACxB,QAAI,CAAC,MAAM,UAAU;AACnB,aAAO,OAAO,SAAA;AAAA,IAChB;AACA,WAAO;AAAA,EACT;AAGA,MAAI,SAAS,SAAS;AACpB,QAAI,SAASA,IAAAA,EAAE,MAAMA,IAAAA,EAAE,SAAS;AAChC,QAAI,MAAM,UAAU;AAClB,YAAM,UAAU,OAAO,MAAM,aAAa,WAAW,MAAM,WAAW;AACtE,eAAS,OAAO,IAAI,GAAG,OAAO;AAAA,IAChC;AACA,WAAO;AAAA,EACT;AAGA,SAAOA,IAAAA,EAAE,QAAA;AACX;AAKO,SAAS,6BAA6B;AAC3C,QAAM,YAAYC,MAAAA,OAAuC,oBAAI,KAAK;AAElE,QAAM,0BAA0BC,kBAAY,CAAC,UAA6B;AACxE,cAAU,QAAQ,IAAI,MAAM,MAAM,KAAK;AAAA,EACzC,GAAG,CAAA,CAAE;AAEL,QAAM,4BAA4BA,kBAAY,CAAC,SAAiB;AAC9D,cAAU,QAAQ,OAAO,IAAI;AAAA,EAC/B,GAAG,CAAA,CAAE;AAEL,QAAM,sBAAsBA,MAAAA,YAAY,MAAM;AAC5C,UAAM,QAAsC,CAAA;AAE5C,cAAU,QAAQ,QAAQ,CAAC,UAAU;AACnC,YAAM,MAAM,IAAI,IAAI,wBAAwB,MAAM,MAAM,MAAM,KAAK;AAAA,IACrE,CAAC;AAED,WAAOF,IAAAA,EAAE,OAAO,KAAK;AAAA,EACvB,GAAG,CAAA,CAAE;AAEL,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;;;;;"}

package/dist/cjs/components/Form/hooks.cjs

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const reactHookForm = require("react-hook-form");
+const context = require("./context.cjs");
+function useFormConfig() {
+  const context$1 = React.useContext(context.FormConfigContext);
+  if (!context$1) {
+    throw new Error("useFormConfig must be used within a Form component");
+  }
+  return context$1;
+}
+function useForm() {
+  return reactHookForm.useFormContext();
+}
+function useFormField(props) {
+  const { form, ...config } = useFormConfig();
+  const controller = reactHookForm.useController({
+    ...props,
+    control: form.control
+  });
+  return {
+    ...controller,
+    config
+  };
+}
+function useFieldError(name) {
+  const { form } = useFormConfig();
+  const error = form.formState.errors[name];
+  return error?.message;
+}
+exports.useFieldError = useFieldError;
+exports.useForm = useForm;
+exports.useFormConfig = useFormConfig;
+exports.useFormField = useFormField;
+//# sourceMappingURL=hooks.cjs.map

package/dist/cjs/components/Form/hooks.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.cjs","sources":["../../../../src/components/Form/hooks.ts"],"sourcesContent":["import { useContext } from \"react\";\r\nimport {\r\n  useFormContext as useRHFFormContext,\r\n  useController,\r\n  type FieldValues,\r\n  type FieldPath,\r\n  type UseControllerProps,\r\n  type UseControllerReturn,\r\n} from \"react-hook-form\";\r\nimport { FormConfigContext, type FormContextValue, type FormConfig } from \"./context\";\r\n\r\n/**\r\n * Hook to access form configuration context\r\n */\r\nexport function useFormConfig<TFieldValues extends FieldValues = FieldValues>(): FormContextValue<TFieldValues> {\r\n  const context = useContext(FormConfigContext) as FormContextValue<TFieldValues> | null;\r\n  if (!context) {\r\n    throw new Error(\"useFormConfig must be used within a Form component\");\r\n  }\r\n  return context;\r\n}\r\n\r\n/**\r\n * Hook to access react-hook-form context directly\r\n */\r\nexport function useForm<TFieldValues extends FieldValues = FieldValues>() {\r\n  return useRHFFormContext<TFieldValues>();\r\n}\r\n\r\n/**\r\n * Hook to create a controlled field with form context awareness\r\n */\r\nexport function useFormField<\r\n  TFieldValues extends FieldValues = FieldValues,\r\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\r\n>(\r\n  props: UseControllerProps<TFieldValues, TName>\r\n): UseControllerReturn<TFieldValues, TName> & { config: FormConfig } {\r\n  const { form, ...config } = useFormConfig<TFieldValues>();\r\n  const controller = useController<TFieldValues, TName>({\r\n    ...props,\r\n    control: form.control,\r\n  });\r\n\r\n  return {\r\n    ...controller,\r\n    config,\r\n  };\r\n}\r\n\r\n/**\r\n * Hook to get field error\r\n */\r\nexport function useFieldError<\r\n  TFieldValues extends FieldValues = FieldValues,\r\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\r\n>(name: TName): string | undefined {\r\n  const { form } = useFormConfig<TFieldValues>();\r\n  const error = form.formState.errors[name];\r\n  return error?.message as string | undefined;\r\n}\r\n"],"names":["context","useContext","FormConfigContext","useRHFFormContext","useController"],"mappings":";;;;;AAcO,SAAS,gBAAgG;AAC9G,QAAMA,YAAUC,MAAAA,WAAWC,yBAAiB;AAC5C,MAAI,CAACF,WAAS;AACZ,UAAM,IAAI,MAAM,oDAAoD;AAAA,EACtE;AACA,SAAOA;AACT;AAKO,SAAS,UAA0D;AACxE,SAAOG,6BAAA;AACT;AAKO,SAAS,aAId,OACmE;AACnE,QAAM,EAAE,MAAM,GAAG,OAAA,IAAW,cAAA;AAC5B,QAAM,aAAaC,cAAAA,cAAmC;AAAA,IACpD,GAAG;AAAA,IACH,SAAS,KAAK;AAAA,EAAA,CACf;AAED,SAAO;AAAA,IACL,GAAG;AAAA,IACH;AAAA,EAAA;AAEJ;AAKO,SAAS,cAGd,MAAiC;AACjC,QAAM,EAAE,KAAA,IAAS,cAAA;AACjB,QAAM,QAAQ,KAAK,UAAU,OAAO,IAAI;AACxC,SAAO,OAAO;AAChB;;;;;"}

package/dist/cjs/components/Input/Input.cjs

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const cn = require("../../utils/cn.cjs");
+;/* empty css            */
+const Input = React.forwardRef(
+  ({
+    label,
+    helperText,
+    error,
+    inputSize = "md",
+    fullWidth = false,
+    className,
+    id,
+    ...props
+  }, ref) => {
+    const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn.cn("skybin-input-wrapper", fullWidth && "skybin-input-wrapper--full-width"), children: [
+      label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: inputId, className: "skybin-input__label", children: label }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ref,
+          id: inputId,
+          className: cn.cn(
+            "skybin-input",
+            `skybin-input--${inputSize}`,
+            error && "skybin-input--error",
+            className
+          ),
+          "aria-invalid": !!error,
+          "aria-describedby": error ? `${inputId}-error` : helperText ? `${inputId}-helper` : void 0,
+          ...props
+        }
+      ),
+      error && /* @__PURE__ */ jsxRuntime.jsx("span", { id: `${inputId}-error`, className: "skybin-input__error", role: "alert", children: error }),
+      helperText && !error && /* @__PURE__ */ jsxRuntime.jsx("span", { id: `${inputId}-helper`, className: "skybin-input__helper", children: helperText })
+    ] });
+  }
+);
+Input.displayName = "Input";
+exports.Input = Input;
+//# sourceMappingURL=Input.cjs.map

package/dist/cjs/components/Input/Input.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.cjs","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\r\nimport type { InputHTMLAttributes } from \"react\";\r\nimport { cn } from \"../../utils/cn\";\r\nimport \"./Input.css\";\r\n\r\nexport interface InputProps extends InputHTMLAttributes<HTMLInputElement> {\r\n  /** Label text for the input */\r\n  label?: string;\r\n  /** Helper text displayed below the input */\r\n  helperText?: string;\r\n  /** Error message to display */\r\n  error?: string;\r\n  /** The size of the input */\r\n  inputSize?: \"sm\" | \"md\" | \"lg\";\r\n  /** Whether the input should take full width */\r\n  fullWidth?: boolean;\r\n}\r\n\r\n/**\r\n * A customizable input component with label, helper text, and error states\r\n */\r\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\r\n  (\r\n    {\r\n      label,\r\n      helperText,\r\n      error,\r\n      inputSize = \"md\",\r\n      fullWidth = false,\r\n      className,\r\n      id,\r\n      ...props\r\n    },\r\n    ref\r\n  ) => {\r\n    const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;\r\n\r\n    return (\r\n      <div className={cn(\"skybin-input-wrapper\", fullWidth && \"skybin-input-wrapper--full-width\")}>\r\n        {label && (\r\n          <label htmlFor={inputId} className=\"skybin-input__label\">\r\n            {label}\r\n          </label>\r\n        )}\r\n        <input\r\n          ref={ref}\r\n          id={inputId}\r\n          className={cn(\r\n            \"skybin-input\",\r\n            `skybin-input--${inputSize}`,\r\n            error && \"skybin-input--error\",\r\n            className\r\n          )}\r\n          aria-invalid={!!error}\r\n          aria-describedby={error ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined}\r\n          {...props}\r\n        />\r\n        {error && (\r\n          <span id={`${inputId}-error`} className=\"skybin-input__error\" role=\"alert\">\r\n            {error}\r\n          </span>\r\n        )}\r\n        {helperText && !error && (\r\n          <span id={`${inputId}-helper`} className=\"skybin-input__helper\">\r\n            {helperText}\r\n          </span>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n);\r\n\r\nInput.displayName = \"Input\";\r\n"],"names":["forwardRef","cn","jsx"],"mappings":";;;;;;AAqBO,MAAM,QAAQA,MAAAA;AAAAA,EACnB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,QACG;AACH,UAAM,UAAU,MAAM,SAAS,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,OAAO,GAAG,CAAC,CAAC;AAEtE,2CACG,OAAA,EAAI,WAAWC,GAAAA,GAAG,wBAAwB,aAAa,kCAAkC,GACvF,UAAA;AAAA,MAAA,wCACE,SAAA,EAAM,SAAS,SAAS,WAAU,uBAChC,UAAA,OACH;AAAA,MAEFC,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA,IAAI;AAAA,UACJ,WAAWD,GAAAA;AAAAA,YACT;AAAA,YACA,iBAAiB,SAAS;AAAA,YAC1B,SAAS;AAAA,YACT;AAAA,UAAA;AAAA,UAEF,gBAAc,CAAC,CAAC;AAAA,UAChB,oBAAkB,QAAQ,GAAG,OAAO,WAAW,aAAa,GAAG,OAAO,YAAY;AAAA,UACjF,GAAG;AAAA,QAAA;AAAA,MAAA;AAAA,MAEL,SACCC,2BAAAA,IAAC,QAAA,EAAK,IAAI,GAAG,OAAO,UAAU,WAAU,uBAAsB,MAAK,SAChE,UAAA,MAAA,CACH;AAAA,MAED,cAAc,CAAC,SACdA,2BAAAA,IAAC,QAAA,EAAK,IAAI,GAAG,OAAO,WAAW,WAAU,wBACtC,UAAA,WAAA,CACH;AAAA,IAAA,GAEJ;AAAA,EAEJ;AACF;AAEA,MAAM,cAAc;;"}

package/dist/cjs/components/ui/checkbox.cjs

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const index = require("../../node_modules/@radix-ui/react-checkbox/dist/index.cjs");
+const cn = require("../../utils/cn.cjs");
+const check = require("../../node_modules/lucide-react/dist/esm/icons/check.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const Checkbox = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  index.Checkbox,
+  {
+    ref,
+    className: cn.cn(
+      "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx(
+      index.CheckboxIndicator,
+      {
+        className: cn.cn("flex items-center justify-center text-current"),
+        children: /* @__PURE__ */ jsxRuntime.jsx(check.default, { className: "h-4 w-4" })
+      }
+    )
+  }
+));
+Checkbox.displayName = index.Checkbox.displayName;
+exports.Checkbox = Checkbox;
+//# sourceMappingURL=checkbox.cjs.map

package/dist/cjs/components/ui/checkbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.cjs","sources":["../../../../src/components/ui/checkbox.tsx"],"sourcesContent":["/**\r\n * shadcn/ui Checkbox component\r\n * @see https://ui.shadcn.com/docs/components/checkbox\r\n * \r\n * DO NOT MODIFY THIS FILE - It is generated from shadcn/ui\r\n * For customizations, create wrapper components instead.\r\n */\r\n\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as CheckboxPrimitive from \"@radix-ui/react-checkbox\"\r\nimport { Check } from \"lucide-react\"\r\n\r\nimport { cn } from \"../../utils/cn\"\r\n\r\nconst Checkbox = React.forwardRef<\r\n  React.ElementRef<typeof CheckboxPrimitive.Root>,\r\n  React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>\r\n>(({ className, ...props }, ref) => (\r\n  <CheckboxPrimitive.Root\r\n    ref={ref}\r\n    className={cn(\r\n      \"peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground\",\r\n      className\r\n    )}\r\n    {...props}\r\n  >\r\n    <CheckboxPrimitive.Indicator\r\n      className={cn(\"flex items-center justify-center text-current\")}\r\n    >\r\n      <Check className=\"h-4 w-4\" />\r\n    </CheckboxPrimitive.Indicator>\r\n  </CheckboxPrimitive.Root>\r\n))\r\nCheckbox.displayName = CheckboxPrimitive.Root.displayName\r\n\r\nexport { Checkbox }\r\n"],"names":["React","jsx","CheckboxPrimitive.Root","cn","CheckboxPrimitive.Indicator","Check"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,WAAWA,iBAAM,WAGrB,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAC1BC,2BAAAA;AAAAA,EAACC,MAAAA;AAAAA,EAAA;AAAA,IACC;AAAA,IACA,WAAWC,GAAAA;AAAAA,MACT;AAAA,MACA;AAAA,IAAA;AAAA,IAED,GAAG;AAAA,IAEJ,UAAAF,2BAAAA;AAAAA,MAACG,MAAAA;AAAAA,MAAA;AAAA,QACC,WAAWD,GAAAA,GAAG,+CAA+C;AAAA,QAE7D,UAAAF,2BAAAA,IAACI,MAAAA,SAAA,EAAM,WAAU,UAAA,CAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EAC7B;AACF,CACD;AACD,SAAS,cAAcH,MAAAA,SAAuB;;"}

package/dist/cjs/components/ui/input.cjs

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const cn = require("../../utils/cn.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const Input = React__namespace.forwardRef(
+  ({ className, type, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "input",
+      {
+        type,
+        className: cn.cn(
+          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+exports.Input = Input;
+//# sourceMappingURL=input.cjs.map

package/dist/cjs/components/ui/input.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.cjs","sources":["../../../../src/components/ui/input.tsx"],"sourcesContent":["/**\r\n * shadcn/ui Input component\r\n * @see https://ui.shadcn.com/docs/components/input\r\n * \r\n * DO NOT MODIFY THIS FILE - It is generated from shadcn/ui\r\n * For customizations, create wrapper components instead.\r\n */\r\nimport * as React from \"react\"\r\n\r\nimport { cn } from \"../../utils/cn\"\r\n\r\nconst Input = React.forwardRef<HTMLInputElement, React.ComponentProps<\"input\">>(\r\n  ({ className, type, ...props }, ref) => {\r\n    return (\r\n      <input\r\n        type={type}\r\n        className={cn(\r\n          \"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\r\n          className\r\n        )}\r\n        ref={ref}\r\n        {...props}\r\n      />\r\n    )\r\n  }\r\n)\r\nInput.displayName = \"Input\"\r\n\r\nexport { Input }\r\n"],"names":["React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,QAAQA,iBAAM;AAAA,EAClB,CAAC,EAAE,WAAW,MAAM,GAAG,MAAA,GAAS,QAAQ;AACtC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAWC,GAAAA;AAAAA,UACT;AAAA,UACA;AAAA,QAAA;AAAA,QAEF;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;AACA,MAAM,cAAc;;"}

package/dist/cjs/components/ui/label.cjs

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const index = require("../../node_modules/@radix-ui/react-label/dist/index.cjs");
+const index$1 = require("../../node_modules/class-variance-authority/dist/index.cjs");
+const cn = require("../../utils/cn.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const labelVariants = index$1.cva(
+  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+);
+const Label = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  index.Root,
+  {
+    ref,
+    className: cn.cn(labelVariants(), className),
+    ...props
+  }
+));
+Label.displayName = index.Root.displayName;
+exports.Label = Label;
+//# sourceMappingURL=label.cjs.map

package/dist/cjs/components/ui/label.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.cjs","sources":["../../../../src/components/ui/label.tsx"],"sourcesContent":["/**\r\n * shadcn/ui Label component\r\n * @see https://ui.shadcn.com/docs/components/label\r\n * \r\n * DO NOT MODIFY THIS FILE - It is generated from shadcn/ui\r\n * For customizations, create wrapper components instead.\r\n */\r\n\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\r\nimport { cva, type VariantProps } from \"class-variance-authority\"\r\n\r\nimport { cn } from \"../../utils/cn\"\r\n\r\nconst labelVariants = cva(\r\n  \"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\"\r\n)\r\n\r\nconst Label = React.forwardRef<\r\n  React.ElementRef<typeof LabelPrimitive.Root>,\r\n  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &\r\n    VariantProps<typeof labelVariants>\r\n>(({ className, ...props }, ref) => (\r\n  <LabelPrimitive.Root\r\n    ref={ref}\r\n    className={cn(labelVariants(), className)}\r\n    {...props}\r\n  />\r\n))\r\nLabel.displayName = LabelPrimitive.Root.displayName\r\n\r\nexport { Label }\r\n"],"names":["cva","React","jsx","LabelPrimitive.Root","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,gBAAgBA,QAAAA;AAAAA,EACpB;AACF;AAEA,MAAM,QAAQC,iBAAM,WAIlB,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAC1BC,2BAAAA;AAAAA,EAACC,MAAAA;AAAAA,EAAA;AAAA,IACC;AAAA,IACA,WAAWC,GAAAA,GAAG,cAAA,GAAiB,SAAS;AAAA,IACvC,GAAG;AAAA,EAAA;AACN,CACD;AACD,MAAM,cAAcD,MAAAA,KAAoB;;"}