@causw/core 0.0.6 → 0.0.9

package/dist/index.d.mts

@@ -1,2 +1,207 @@
+import React from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ClassValue } from 'clsx';
 
-export {  }
+type Typography = 'caption-sm' | 'caption-sm-point' | 'caption-md' | 'caption-md-point' | 'body2-sm' | 'body2-sm-point' | 'body2-md' | 'body2-md-point' | 'body-sm' | 'body-sm-point' | 'body-md' | 'body-md-point' | 'subtitle-sm' | 'subtitle-sm-point' | 'subtitle-md' | 'subtitle-md-point' | 'title-sm' | 'title-md' | 'head-sm' | 'head-md' | 'fixed-12' | 'fixed-14' | 'fixed-15' | 'fixed-16' | 'fixed-18' | 'fixed-20' | 'fixed-24';
+type TextColor = 'gray-50' | 'gray-100' | 'gray-200' | 'gray-300' | 'gray-400' | 'gray-500' | 'gray-600' | 'gray-700' | 'gray-800' | 'gray-900' | 'blue-50' | 'blue-500' | 'blue-700' | 'red-100' | 'red-400' | 'white' | 'black';
+type TextAlign = 'left' | 'center' | 'right' | 'justify';
+
+/**
+ * Polymorphic component props (includes ref)
+ *
+ * @example
+ * ```tsx
+ * type ButtonProps<E extends React.ElementType = 'button'> =
+ *   PolymorphicProps<E, { variant?: 'primary' | 'secondary' }>;
+ * ```
+ */
+type PolymorphicProps<E extends React.ElementType = 'div', Props = object> = Props & {
+    as?: E;
+} & Omit<React.ComponentProps<E>, keyof Props | 'as'>;
+/**
+ * Polymorphic component props without ref
+ */
+type PolymorphicPropsWithoutRef<E extends React.ElementType = 'div', Props = object> = Props & {
+    as?: E;
+} & Omit<React.ComponentPropsWithoutRef<E>, keyof Props | 'as'>;
+
+/** Text element types that can be used with as prop */
+type TextElement = 'span' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div' | 'label' | 'a';
+/** Base text styling props - reusable for other components */
+interface TextStyleProps {
+    /** Typography preset - format: {variant}-{size}[-point] */
+    typography?: Typography;
+    /** Text color */
+    textColor?: TextColor;
+    /** Text alignment */
+    align?: TextAlign;
+}
+/** Full Text component props with polymorphic support */
+type TextProps<E extends TextElement = 'span'> = PolymorphicProps<E, TextStyleProps>;
+declare const Text: {
+    <E extends TextElement = "span">({ typography, textColor, align, as, children, className, ...props }: TextProps<E>): React.DetailedReactHTMLElement<{
+        className: string;
+    } & Omit<TextProps<E>, "as" | "typography" | "textColor" | "align" | "className" | "children">, HTMLSpanElement>;
+    displayName: string;
+};
+
+interface FieldProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    disabled?: boolean;
+    error?: boolean;
+}
+type FieldLabelProps<E extends TextElement = 'label'> = PolymorphicProps<E, TextStyleProps>;
+interface FieldDescriptionProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    className?: string;
+}
+interface FieldErrorDescriptionProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const Field: {
+    ({ children, disabled, error, className, ...props }: FieldProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    Label: {
+        <E extends TextElement = "label">({ children, className, typography, textColor, ...labelProps }: FieldLabelProps<E>): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+    Description: {
+        ({ children, className, ...props }: FieldDescriptionProps): react_jsx_runtime.JSX.Element | null;
+        displayName: string;
+    };
+    ErrorDescription: {
+        ({ children, className, ...props }: FieldErrorDescriptionProps): react_jsx_runtime.JSX.Element | null;
+        displayName: string;
+    };
+};
+
+type TextInputVariant = 'default' | 'underline';
+interface TextInputProps extends React.ComponentProps<'input'>, TextStyleProps {
+    /** Input variant style */
+    variant?: TextInputVariant;
+    /** Icon to display on the left side of input */
+    leftIcon?: React.ReactNode;
+    /** Icon to display on the right side of input */
+    rightIcon?: React.ReactNode;
+    /** Error state (overrides Field context) */
+    error?: boolean;
+}
+declare const TextInput: {
+    ({ id: idProp, disabled: disabledProp, error: errorProp, className, leftIcon, rightIcon, variant, typography, textColor, ...props }: TextInputProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface PrimitiveProps {
+    /**
+     * Whether the element should be rendered as a child of a slot.
+     * @default false
+     */
+    asChild?: boolean;
+}
+
+interface TextAreaProps extends React.HTMLAttributes<HTMLDivElement>, PrimitiveProps {
+    children: React.ReactNode;
+}
+interface TextAreaInputProps extends React.ComponentProps<'textarea'> {
+    /** Whether to allow vertical resizing @default true */
+    resize?: boolean;
+}
+interface TextAreaFooterProps extends React.HTMLAttributes<HTMLDivElement>, PrimitiveProps {
+    children: React.ReactNode;
+}
+declare const TextArea: {
+    ({ className, children, ...props }: TextAreaProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    Input: {
+        ({ resize, disabled: disabledProp, className, ...props }: TextAreaInputProps): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+    Footer: {
+        ({ className, children, ...props }: TextAreaFooterProps): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+};
+
+interface RadioGroupContextValue {
+    name: string;
+    value?: string;
+    onChange?: (value: string) => void;
+}
+declare const useRadioGroupContext: () => RadioGroupContextValue | null;
+interface RadioGroupProps extends React.HTMLAttributes<HTMLDivElement>, PrimitiveProps {
+    name: string;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    children: React.ReactNode;
+}
+declare const RadioGroup: {
+    ({ name, value, defaultValue, onValueChange, className, children, ...props }: RadioGroupProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+interface RadioProps extends Omit<React.ComponentProps<'input'>, 'type'> {
+    value: string;
+    children: React.ReactNode;
+}
+declare const Radio: {
+    ({ value, children, className, checked: checkedProp, onChange, ...props }: RadioProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+/**
+ * Combines class names with Tailwind CSS conflict resolution
+ *
+ * @example
+ * mergeStyles('px-2 py-1', 'px-4') // => 'py-1 px-4'
+ * mergeStyles('text-red-500', condition && 'text-blue-500')
+ */
+declare function mergeStyles(...inputs: ClassValue[]): string;
+
+interface ToggleRootProps extends Omit<React.ComponentProps<'label'>, 'onChange'> {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    children?: React.ReactNode;
+}
+type ToggleLabelProps<E extends TextElement = 'span'> = PolymorphicProps<E, TextStyleProps>;
+declare const Toggle: {
+    ({ checked: checkedProp, defaultChecked, onCheckedChange, disabled, children, className, ...props }: ToggleRootProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    Switch: {
+        (): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+    Label: {
+        <E extends TextElement = "span">({ children, typography, textColor, ...props }: ToggleLabelProps<E>): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+};
+
+interface CheckboxRootProps extends Omit<React.ComponentProps<'label'>, 'onChange'> {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    children?: React.ReactNode;
+}
+type CheckboxLabelProps<E extends TextElement = 'span'> = PolymorphicProps<E, TextStyleProps>;
+declare const Checkbox: {
+    ({ checked: checkedProp, defaultChecked, onCheckedChange, disabled, children, className, ...props }: CheckboxRootProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    Indicator: {
+        (): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+    Label: {
+        <E extends TextElement = "span">({ children, typography, textColor, ...props }: CheckboxLabelProps<E>): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+};
+
+export { Checkbox, type CheckboxLabelProps, type CheckboxRootProps, Field, type FieldDescriptionProps, type FieldErrorDescriptionProps, type FieldLabelProps, type FieldProps, type PolymorphicProps, type PolymorphicPropsWithoutRef, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Text, TextArea, type TextAreaFooterProps, type TextAreaInputProps, type TextAreaProps, type TextColor, TextInput, type TextInputProps, type TextInputVariant, type TextProps, type TextStyleProps, Toggle, type ToggleLabelProps, type ToggleRootProps, type Typography, mergeStyles, useRadioGroupContext };

package/dist/index.d.ts

@@ -1,2 +1,207 @@
+import React from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ClassValue } from 'clsx';
 
-export {  }
+type Typography = 'caption-sm' | 'caption-sm-point' | 'caption-md' | 'caption-md-point' | 'body2-sm' | 'body2-sm-point' | 'body2-md' | 'body2-md-point' | 'body-sm' | 'body-sm-point' | 'body-md' | 'body-md-point' | 'subtitle-sm' | 'subtitle-sm-point' | 'subtitle-md' | 'subtitle-md-point' | 'title-sm' | 'title-md' | 'head-sm' | 'head-md' | 'fixed-12' | 'fixed-14' | 'fixed-15' | 'fixed-16' | 'fixed-18' | 'fixed-20' | 'fixed-24';
+type TextColor = 'gray-50' | 'gray-100' | 'gray-200' | 'gray-300' | 'gray-400' | 'gray-500' | 'gray-600' | 'gray-700' | 'gray-800' | 'gray-900' | 'blue-50' | 'blue-500' | 'blue-700' | 'red-100' | 'red-400' | 'white' | 'black';
+type TextAlign = 'left' | 'center' | 'right' | 'justify';
+
+/**
+ * Polymorphic component props (includes ref)
+ *
+ * @example
+ * ```tsx
+ * type ButtonProps<E extends React.ElementType = 'button'> =
+ *   PolymorphicProps<E, { variant?: 'primary' | 'secondary' }>;
+ * ```
+ */
+type PolymorphicProps<E extends React.ElementType = 'div', Props = object> = Props & {
+    as?: E;
+} & Omit<React.ComponentProps<E>, keyof Props | 'as'>;
+/**
+ * Polymorphic component props without ref
+ */
+type PolymorphicPropsWithoutRef<E extends React.ElementType = 'div', Props = object> = Props & {
+    as?: E;
+} & Omit<React.ComponentPropsWithoutRef<E>, keyof Props | 'as'>;
+
+/** Text element types that can be used with as prop */
+type TextElement = 'span' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div' | 'label' | 'a';
+/** Base text styling props - reusable for other components */
+interface TextStyleProps {
+    /** Typography preset - format: {variant}-{size}[-point] */
+    typography?: Typography;
+    /** Text color */
+    textColor?: TextColor;
+    /** Text alignment */
+    align?: TextAlign;
+}
+/** Full Text component props with polymorphic support */
+type TextProps<E extends TextElement = 'span'> = PolymorphicProps<E, TextStyleProps>;
+declare const Text: {
+    <E extends TextElement = "span">({ typography, textColor, align, as, children, className, ...props }: TextProps<E>): React.DetailedReactHTMLElement<{
+        className: string;
+    } & Omit<TextProps<E>, "as" | "typography" | "textColor" | "align" | "className" | "children">, HTMLSpanElement>;
+    displayName: string;
+};
+
+interface FieldProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    disabled?: boolean;
+    error?: boolean;
+}
+type FieldLabelProps<E extends TextElement = 'label'> = PolymorphicProps<E, TextStyleProps>;
+interface FieldDescriptionProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    className?: string;
+}
+interface FieldErrorDescriptionProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const Field: {
+    ({ children, disabled, error, className, ...props }: FieldProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    Label: {
+        <E extends TextElement = "label">({ children, className, typography, textColor, ...labelProps }: FieldLabelProps<E>): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+    Description: {
+        ({ children, className, ...props }: FieldDescriptionProps): react_jsx_runtime.JSX.Element | null;
+        displayName: string;
+    };
+    ErrorDescription: {
+        ({ children, className, ...props }: FieldErrorDescriptionProps): react_jsx_runtime.JSX.Element | null;
+        displayName: string;
+    };
+};
+
+type TextInputVariant = 'default' | 'underline';
+interface TextInputProps extends React.ComponentProps<'input'>, TextStyleProps {
+    /** Input variant style */
+    variant?: TextInputVariant;
+    /** Icon to display on the left side of input */
+    leftIcon?: React.ReactNode;
+    /** Icon to display on the right side of input */
+    rightIcon?: React.ReactNode;
+    /** Error state (overrides Field context) */
+    error?: boolean;
+}
+declare const TextInput: {
+    ({ id: idProp, disabled: disabledProp, error: errorProp, className, leftIcon, rightIcon, variant, typography, textColor, ...props }: TextInputProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+interface PrimitiveProps {
+    /**
+     * Whether the element should be rendered as a child of a slot.
+     * @default false
+     */
+    asChild?: boolean;
+}
+
+interface TextAreaProps extends React.HTMLAttributes<HTMLDivElement>, PrimitiveProps {
+    children: React.ReactNode;
+}
+interface TextAreaInputProps extends React.ComponentProps<'textarea'> {
+    /** Whether to allow vertical resizing @default true */
+    resize?: boolean;
+}
+interface TextAreaFooterProps extends React.HTMLAttributes<HTMLDivElement>, PrimitiveProps {
+    children: React.ReactNode;
+}
+declare const TextArea: {
+    ({ className, children, ...props }: TextAreaProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    Input: {
+        ({ resize, disabled: disabledProp, className, ...props }: TextAreaInputProps): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+    Footer: {
+        ({ className, children, ...props }: TextAreaFooterProps): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+};
+
+interface RadioGroupContextValue {
+    name: string;
+    value?: string;
+    onChange?: (value: string) => void;
+}
+declare const useRadioGroupContext: () => RadioGroupContextValue | null;
+interface RadioGroupProps extends React.HTMLAttributes<HTMLDivElement>, PrimitiveProps {
+    name: string;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    children: React.ReactNode;
+}
+declare const RadioGroup: {
+    ({ name, value, defaultValue, onValueChange, className, children, ...props }: RadioGroupProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+interface RadioProps extends Omit<React.ComponentProps<'input'>, 'type'> {
+    value: string;
+    children: React.ReactNode;
+}
+declare const Radio: {
+    ({ value, children, className, checked: checkedProp, onChange, ...props }: RadioProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+/**
+ * Combines class names with Tailwind CSS conflict resolution
+ *
+ * @example
+ * mergeStyles('px-2 py-1', 'px-4') // => 'py-1 px-4'
+ * mergeStyles('text-red-500', condition && 'text-blue-500')
+ */
+declare function mergeStyles(...inputs: ClassValue[]): string;
+
+interface ToggleRootProps extends Omit<React.ComponentProps<'label'>, 'onChange'> {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    children?: React.ReactNode;
+}
+type ToggleLabelProps<E extends TextElement = 'span'> = PolymorphicProps<E, TextStyleProps>;
+declare const Toggle: {
+    ({ checked: checkedProp, defaultChecked, onCheckedChange, disabled, children, className, ...props }: ToggleRootProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    Switch: {
+        (): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+    Label: {
+        <E extends TextElement = "span">({ children, typography, textColor, ...props }: ToggleLabelProps<E>): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+};
+
+interface CheckboxRootProps extends Omit<React.ComponentProps<'label'>, 'onChange'> {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    children?: React.ReactNode;
+}
+type CheckboxLabelProps<E extends TextElement = 'span'> = PolymorphicProps<E, TextStyleProps>;
+declare const Checkbox: {
+    ({ checked: checkedProp, defaultChecked, onCheckedChange, disabled, children, className, ...props }: CheckboxRootProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+} & {
+    Indicator: {
+        (): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+    Label: {
+        <E extends TextElement = "span">({ children, typography, textColor, ...props }: CheckboxLabelProps<E>): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+};
+
+export { Checkbox, type CheckboxLabelProps, type CheckboxRootProps, Field, type FieldDescriptionProps, type FieldErrorDescriptionProps, type FieldLabelProps, type FieldProps, type PolymorphicProps, type PolymorphicPropsWithoutRef, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Text, TextArea, type TextAreaFooterProps, type TextAreaInputProps, type TextAreaProps, type TextColor, TextInput, type TextInputProps, type TextInputVariant, type TextProps, type TextStyleProps, Toggle, type ToggleLabelProps, type ToggleRootProps, type Typography, mergeStyles, useRadioGroupContext };