@idealyst/components 1.0.24 → 1.0.26

package/src/Card/Card.web.tsx

@@ -1,62 +1,62 @@
-import React from 'react';
-import { getWebProps } from 'react-native-unistyles/web';
-import { CardProps } from './types';
-import { cardStyles, cardHoverStyles } from './Card.styles';
-
-const Card: React.FC<CardProps> = ({
-  children,
-  variant = 'default',
-  padding = 'medium',
-  radius = 'medium',
-  intent = 'neutral',
-  clickable = false,
-  onPress,
-  disabled = false,
-  style,
-  testID,
-  accessibilityLabel,
-}) => {
-  const handleClick = () => {
-    if (!disabled && clickable && onPress) {
-      onPress();
-    }
-  };
-
-  // Apply variants
-  cardStyles.useVariants({
-    variant: variant as any,
-    padding,
-    radius,
-    intent,
-    clickable,
-    disabled,
-  });
-
-  // Create style arrays
-  const cardStyleArray = [
-    cardStyles.card,
-    clickable && !disabled && cardHoverStyles.clickableHover,
-    style,
-  ].filter(Boolean);
-
-  // Generate web props
-  const webProps = getWebProps(cardStyleArray);
-
-  // Use appropriate HTML element based on clickable state
-  const Component = clickable ? 'button' : 'div';
-
-  return (
-    <Component
-      {...webProps}
-      onClick={clickable ? handleClick : undefined}
-      disabled={clickable && disabled}
-      data-testid={testID}
-      aria-label={accessibilityLabel}
-      role={clickable ? 'button' : undefined}
-    >
-      {children}
-    </Component>
-  );
-};
-
+import React from 'react';
+import { getWebProps } from 'react-native-unistyles/web';
+import { CardProps } from './types';
+import { cardStyles, cardHoverStyles } from './Card.styles';
+
+const Card: React.FC<CardProps> = ({
+  children,
+  variant = 'default',
+  padding = 'medium',
+  radius = 'medium',
+  intent = 'neutral',
+  clickable = false,
+  onPress,
+  disabled = false,
+  style,
+  testID,
+  accessibilityLabel,
+}) => {
+  const handleClick = () => {
+    if (!disabled && clickable && onPress) {
+      onPress();
+    }
+  };
+
+  // Apply variants
+  cardStyles.useVariants({
+    variant: variant as any,
+    padding,
+    radius,
+    intent,
+    clickable,
+    disabled,
+  });
+
+  // Create style arrays
+  const cardStyleArray = [
+    cardStyles.card,
+    clickable && !disabled && cardHoverStyles.clickableHover,
+    style,
+  ].filter(Boolean);
+
+  // Generate web props
+  const webProps = getWebProps(cardStyleArray);
+
+  // Use appropriate HTML element based on clickable state
+  const Component = clickable ? 'button' : 'div';
+
+  return (
+    <Component
+      {...webProps}
+      onClick={clickable ? handleClick : undefined}
+      disabled={clickable && disabled}
+      data-testid={testID}
+      aria-label={accessibilityLabel}
+      role={clickable ? 'button' : undefined}
+    >
+      {children}
+    </Component>
+  );
+};
+
 export default Card; 

package/src/Card/index.native.ts

@@ -1,3 +1,3 @@
-// React Native-specific Card export
-export { default } from './Card.native';
+// React Native-specific Card export
+export { default } from './Card.native';
 export * from './types'; 

package/src/Card/index.ts

@@ -1,5 +1,5 @@
-// Platform-agnostic Card export
-// Metro will resolve to index.native.ts for React Native
-// This file serves as fallback for web environments
-export { default } from './Card.web';
+// Platform-agnostic Card export
+// Metro will resolve to index.native.ts for React Native
+// This file serves as fallback for web environments
+export { default } from './Card.web';
 export * from './types'; 

package/src/Card/index.web.ts

@@ -1,3 +1,3 @@
-// Web-specific Card export
-export { default } from './Card.web';
+// Web-specific Card export
+export { default } from './Card.web';
 export * from './types'; 

package/src/Card/types.ts

@@ -1,59 +1,59 @@
-import { ReactNode } from 'react';
-import type { IntentVariant } from '../theme/variants';
-
-export interface CardProps {
-  /**
-   * The content to display inside the card
-   */
-  children?: ReactNode;
-  
-  /**
-   * The visual style variant of the card
-   */
-  variant?: 'default' | 'outlined' | 'elevated' | 'filled';
-  
-  /**
-   * The padding size inside the card
-   */
-  padding?: 'none' | 'small' | 'medium' | 'large';
-  
-  /**
-   * The border radius of the card
-   */
-  radius?: 'none' | 'small' | 'medium' | 'large';
-  
-  /**
-   * The intent/color scheme of the card
-   */
-  intent?: IntentVariant;
-  
-  /**
-   * Whether the card is clickable
-   */
-  clickable?: boolean;
-  
-  /**
-   * Called when the card is pressed (if clickable)
-   */
-  onPress?: () => void;
-  
-  /**
-   * Whether the card is disabled
-   */
-  disabled?: boolean;
-  
-  /**
-   * Additional styles (platform-specific)
-   */
-  style?: any;
-  
-  /**
-   * Test ID for testing
-   */
-  testID?: string;
-  
-  /**
-   * Accessibility label
-   */
-  accessibilityLabel?: string;
+import { ReactNode } from 'react';
+import type { IntentVariant } from '../theme/variants';
+
+export interface CardProps {
+  /**
+   * The content to display inside the card
+   */
+  children?: ReactNode;
+  
+  /**
+   * The visual style variant of the card
+   */
+  variant?: 'default' | 'outlined' | 'elevated' | 'filled';
+  
+  /**
+   * The padding size inside the card
+   */
+  padding?: 'none' | 'small' | 'medium' | 'large';
+  
+  /**
+   * The border radius of the card
+   */
+  radius?: 'none' | 'small' | 'medium' | 'large';
+  
+  /**
+   * The intent/color scheme of the card
+   */
+  intent?: IntentVariant;
+  
+  /**
+   * Whether the card is clickable
+   */
+  clickable?: boolean;
+  
+  /**
+   * Called when the card is pressed (if clickable)
+   */
+  onPress?: () => void;
+  
+  /**
+   * Whether the card is disabled
+   */
+  disabled?: boolean;
+  
+  /**
+   * Additional styles (platform-specific)
+   */
+  style?: any;
+  
+  /**
+   * Test ID for testing
+   */
+  testID?: string;
+  
+  /**
+   * Accessibility label
+   */
+  accessibilityLabel?: string;
 } 

package/src/Checkbox/Checkbox.native.tsx

@@ -1,99 +1,99 @@
-import React, { useState, useEffect } from 'react';
-import { View, Text, Pressable } from 'react-native';
-import { CheckboxProps } from './types';
-import { checkboxStyles, checkboxLabelStyles, checkboxCheckmarkStyles, checkboxHelperStyles } from './Checkbox.styles';
-
-const Checkbox: React.FC<CheckboxProps> = ({
-  checked = false,
-  indeterminate = false,
-  disabled = false,
-  onCheckedChange,
-  size = 'medium',
-  intent = 'primary',
-  variant = 'default',
-  label,
-  children,
-  style,
-  testID,
-  accessibilityLabel,
-  required = false,
-  error,
-  helperText,
-}) => {
-  const [internalChecked, setInternalChecked] = useState(checked);
-  
-  useEffect(() => {
-    setInternalChecked(checked);
-  }, [checked]);
-
-  const handlePress = () => {
-    if (disabled) return;
-    
-    const newChecked = !internalChecked;
-    setInternalChecked(newChecked);
-    onCheckedChange?.(newChecked);
-  };
-
-  // Apply variants for main checkbox
-  checkboxStyles.useVariants({
-    size,
-    intent,
-    variant: variant as any,
-    checked: internalChecked,
-    disabled,
-  });
-
-  // Apply variants for label
-  checkboxLabelStyles.useVariants({
-    size,
-    disabled,
-  });
-
-  // Apply variants for checkmark
-  checkboxCheckmarkStyles.useVariants({
-    size,
-    visible: internalChecked,
-  });
-
-  // Apply variants for helper text
-  checkboxHelperStyles.useVariants({
-    error: !!error,
-  });
-
-  const labelContent = children || label;
-  const displayHelperText = error || helperText;
-
-  return (
-    <View style={[checkboxStyles.wrapper, style]}>
-      <Pressable
-        onPress={handlePress}
-        disabled={disabled}
-        testID={testID}
-        accessibilityLabel={accessibilityLabel}
-        accessibilityRole="checkbox"
-        accessibilityState={{ checked: internalChecked }}
-        style={checkboxStyles.container}
-      >
-        <View style={checkboxStyles.checkbox}>
-          {(internalChecked || indeterminate) && (
-            <Text style={checkboxCheckmarkStyles.checkmark}>
-              {indeterminate ? '−' : '✓'}
-            </Text>
-          )}
-        </View>
-        {labelContent && (
-          <Text style={checkboxLabelStyles.label}>
-            {labelContent}
-          </Text>
-        )}
-      </Pressable>
-      {displayHelperText && (
-        <Text style={checkboxHelperStyles.helperText}>
-          {error || helperText}
-        </Text>
-      )}
-    </View>
-  );
-};
-
+import React, { useState, useEffect } from 'react';
+import { View, Text, Pressable } from 'react-native';
+import { CheckboxProps } from './types';
+import { checkboxStyles, checkboxLabelStyles, checkboxCheckmarkStyles, checkboxHelperStyles } from './Checkbox.styles';
+
+const Checkbox: React.FC<CheckboxProps> = ({
+  checked = false,
+  indeterminate = false,
+  disabled = false,
+  onCheckedChange,
+  size = 'medium',
+  intent = 'primary',
+  variant = 'default',
+  label,
+  children,
+  style,
+  testID,
+  accessibilityLabel,
+  required = false,
+  error,
+  helperText,
+}) => {
+  const [internalChecked, setInternalChecked] = useState(checked);
+  
+  useEffect(() => {
+    setInternalChecked(checked);
+  }, [checked]);
+
+  const handlePress = () => {
+    if (disabled) return;
+    
+    const newChecked = !internalChecked;
+    setInternalChecked(newChecked);
+    onCheckedChange?.(newChecked);
+  };
+
+  // Apply variants for main checkbox
+  checkboxStyles.useVariants({
+    size,
+    intent,
+    variant: variant as any,
+    checked: internalChecked,
+    disabled,
+  });
+
+  // Apply variants for label
+  checkboxLabelStyles.useVariants({
+    size,
+    disabled,
+  });
+
+  // Apply variants for checkmark
+  checkboxCheckmarkStyles.useVariants({
+    size,
+    visible: internalChecked,
+  });
+
+  // Apply variants for helper text
+  checkboxHelperStyles.useVariants({
+    error: !!error,
+  });
+
+  const labelContent = children || label;
+  const displayHelperText = error || helperText;
+
+  return (
+    <View style={[checkboxStyles.wrapper, style]}>
+      <Pressable
+        onPress={handlePress}
+        disabled={disabled}
+        testID={testID}
+        accessibilityLabel={accessibilityLabel}
+        accessibilityRole="checkbox"
+        accessibilityState={{ checked: internalChecked }}
+        style={checkboxStyles.container}
+      >
+        <View style={checkboxStyles.checkbox}>
+          {(internalChecked || indeterminate) && (
+            <Text style={checkboxCheckmarkStyles.checkmark}>
+              {indeterminate ? '−' : '✓'}
+            </Text>
+          )}
+        </View>
+        {labelContent && (
+          <Text style={checkboxLabelStyles.label}>
+            {labelContent}
+          </Text>
+        )}
+      </Pressable>
+      {displayHelperText && (
+        <Text style={checkboxHelperStyles.helperText}>
+          {error || helperText}
+        </Text>
+      )}
+    </View>
+  );
+};
+
 export default Checkbox;