@fountain-ui/core 2.0.0-beta.98 → 3.0.0-alpha.10

package/build/typescript/Tab/TabIndicator.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import type { TabIndicatorColor, TabIndicatorSize } from './LegacyTabProps';
-declare const _default: React.MemoExoticComponent<({ indicatorSize, color, }: {
-    indicatorSize: TabIndicatorSize;
-    color: TabIndicatorColor;
-}) => JSX.Element>;
-export default _default;

package/build/typescript/TabBase/LegacyTabBase.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import type TabBaseProps from './TabBaseProps';
-export default function TabBase(props: TabBaseProps): JSX.Element;

package/build/typescript/Tabs/LegacyTabIndicator.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import type TabIndicatorProps from './LegacyTabIndicatorProps';
-export default function TabIndicator(props: TabIndicatorProps): JSX.Element;

package/build/typescript/Tabs/LegacyTabIndicatorProps.d.ts

@@ -1,32 +0,0 @@
-import type { ViewProps } from 'react-native';
-import type { OverridableComponentProps } from '../types';
-import type TabCoordinate from './TabCoordinate';
-export declare type TabIndicatorColor = 'primary' | 'secondary';
-export default interface TabIndicatorProps extends OverridableComponentProps<ViewProps, {
-    /**
-     * If `true`, tab shifting animation will be disabled
-     */
-    animationDisabled?: boolean;
-    /**
-     * Tab item coordinates.
-     */
-    coordinates: TabCoordinate[];
-    /**
-     * Indicator color.
-     * @default: 'primary'
-     */
-    color?: TabIndicatorColor;
-    /**
-     * If `true`, the indicator is disabled.
-     */
-    disabled: boolean;
-    /**
-     * Initial index.
-     */
-    initialIndex: number;
-    /**
-     * If `true`, the tab will be able to scroll.
-     */
-    scrollable: boolean;
-}> {
-}

package/build/typescript/Tabs/LegacyTabs.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import type TabsProps from './LegacyTabsProps';
-import type { TabsInstance } from './types';
-declare const Tabs: React.ForwardRefExoticComponent<Pick<TabsProps, "testID" | "style" | "onLayout" | "keyboardDismissMode" | "children" | "pointerEvents" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "accessibilityLabel" | "accessible" | "hitSlop" | "removeClippedSubviews" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessibilityActions" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLabelledBy" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityLanguage" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "onChange" | "variant" | "keyboardShouldPersistTaps" | "indicatorColor" | "indicatorSize" | "initialIndex" | "scrollable" | "disableIndicator" | "indicatorAnimationDisabled" | "scrollViewContentContainerStyle" | "UNSTABLE_sharedIndex" | "onTabSelected"> & React.RefAttributes<TabsInstance>>;
-export default Tabs;

package/build/typescript/Tabs/LegacyTabsProps.d.ts

@@ -1,79 +0,0 @@
-import type { ReactNode, Ref } from 'react';
-import type { ViewProps } from 'react-native';
-import type { TabVariant, TabIndicatorSize } from '../Tab';
-import type { ExtendedStyle, OverridableComponentProps, SyncAnimatedValue } from '../types';
-import type { TabIndicatorColor } from './LegacyTabIndicatorProps';
-import type { KeyboardDismissMode, KeyboardShouldPersistTaps, TabsInstance } from './types';
-export default interface TabsProps extends OverridableComponentProps<ViewProps, {
-    ref?: Ref<TabsInstance>;
-    /**
-     * Collection of Tab components.
-     */
-    children: ReactNode;
-    /**
-     * If `true`, the indicator is disabled.
-     * @default false
-     */
-    disableIndicator?: boolean;
-    /**
-     * The color of tab indicator
-     * @default 'primary'
-     */
-    indicatorColor?: TabIndicatorColor;
-    /**
-     * The size of tab indicator.
-     * 'full' adjusts the indicator to the size of the Tab,
-     * while 'fit-content' adjusts the indicator to the size of the content inside the Tab.
-     * @default 'full'
-     */
-    indicatorSize?: TabIndicatorSize;
-    /**
-     * If `true`, tab indicator selection animation disabled.
-     * @default 'false'
-     */
-    indicatorAnimationDisabled?: boolean;
-    /**
-     * Index of initial tab that should be selected.
-     * @default 0
-     */
-    initialIndex?: number;
-    /**
-     * keyboard dismissing condition of dragging.
-     * @default 'none'
-     */
-    keyboardDismissMode?: KeyboardDismissMode;
-    /**
-     * keyboard persisting condition of tapping.
-     * @default 'never'
-     */
-    keyboardShouldPersistTaps?: KeyboardShouldPersistTaps;
-    /**
-     * Callback fired when a tab is selected.
-     */
-    onChange?: (newIndex: number) => void;
-    /**
-     * If `true`, the component will be able to scroll.
-     * @default false
-     */
-    scrollable?: boolean;
-    /**
-     * These styles will be applied to the scroll view content container which wraps all of the child views.
-     */
-    scrollViewContentContainerStyle?: ExtendedStyle | ExtendedStyle[];
-    /**
-     * Unstable API.
-     */
-    UNSTABLE_sharedIndex?: SyncAnimatedValue;
-    /**
-     * The variant to use.
-     * @default 'primary'
-     */
-    variant?: TabVariant;
-    /**
-     * Callback function executed when a Tab is selected.
-     * Executed even if the index does not change when a Tab is pressed.
-     * Receives the next tab index and the current tab index as parameters.
-     */
-    onTabSelected?: (newIndex: number, currentIndex: number) => void;
-}> {
-}

package/build/typescript/TextField/InputLabel.d.ts

@@ -1,33 +0,0 @@
-/// <reference types="react" />
-import { Animated, LayoutChangeEvent } from 'react-native';
-interface LabelProps {
-    activeColor: string;
-    animatedError: Animated.Value;
-    animatedLabel: Animated.Value;
-    error?: boolean;
-    errorColor?: string;
-    focused?: boolean;
-    fontSize?: number;
-    hasActiveOutline?: boolean;
-    label?: string;
-    labelLayout: {
-        measured: boolean;
-        width: number;
-        height: number;
-    };
-    labelScale: number;
-    labelTranslateX: number;
-    labelTranslateY: number;
-    onLayoutAnimatedText: (event: LayoutChangeEvent) => void;
-    paddingOffset?: {
-        paddingLeft: number;
-        paddingRight: number;
-    };
-    placeholder?: string;
-    placeholderColor?: string;
-    placeholderOpacity: number | Animated.AnimatedInterpolation;
-    topPosition: number;
-    value?: string;
-}
-declare const InputLabel: (props: LabelProps) => JSX.Element | null;
-export default InputLabel;

package/build/typescript/TextField/LegacyTextField.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { TextInput } from 'react-native';
-import TextFieldProps from './LegacyTextFieldProps';
-declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<TextInput>>;
-export default TextField;

package/build/typescript/TextField/LegacyTextFieldProps.d.ts

@@ -1,67 +0,0 @@
-import React from 'react';
-import { NativeSyntheticEvent, TargetedEvent } from 'react-native';
-import { ComponentProps } from '../types';
-declare type TextFieldKeyboardType = 'default' | 'numeric' | 'email-address';
-export interface setStyleProp {
-    fontFamily: string;
-}
-export default interface TextFieldProps extends ComponentProps<{
-    /**
-     * If true, user won't be able to interact with the component.
-     * @default false
-     */
-    disabled?: boolean;
-    /**
-     * Whether to style the TextField with error style.
-     * @default false
-     */
-    error?: boolean;
-    /**
-     * It is an icon placed to the right of the TextField.
-     */
-    icon?: React.ReactElement;
-    /**
-     * User can specify the keyboard type.
-     * @default 'default'
-     */
-    keyboardType?: TextFieldKeyboardType;
-    /**
-     * The text to use for the floating label.
-     */
-    label?: string;
-    /**
-     * Callback that is called when the textField is blurred.
-     */
-    onBlur?: (event: NativeSyntheticEvent<TargetedEvent>) => void;
-    /**
-     * Callback that is called when the textField's text changes.
-     */
-    onChangeText?: (value: string) => void;
-    /**
-     * Callback that is called when the textField is focused.
-     */
-    onFocus?: (event: NativeSyntheticEvent<TargetedEvent>) => void;
-    /**
-     * Callback that is called when icon pressed.
-     */
-    onIconPress?: () => void;
-    /**
-     * Callback that is called when enter or submit key pressed.
-     */
-    onSubmitEditing?: () => void;
-    /**
-     * Placeholder for textField.
-     */
-    placeholder?: string;
-    /**
-     * If true, the text input obscures the text entered so that sensitive text like passwords stay secure.
-     * @default false
-     */
-    secureTextEntry?: boolean;
-    /**
-     * Value of the textField.
-     */
-    value?: string;
-}> {
-}
-export {};

package/build/typescript/TextField/OutlinedTextField.d.ts

@@ -1,17 +0,0 @@
-import React from 'react';
-import { Animated, LayoutChangeEvent, TextInput } from 'react-native';
-import TextFieldProps from './LegacyTextFieldProps';
-interface OutlinedTextFieldProps extends TextFieldProps {
-    animatedError: Animated.Value;
-    animatedLabel: Animated.Value;
-    focused: boolean;
-    forceFocus: () => void;
-    labelLayout: {
-        measured: boolean;
-        width: number;
-        height: number;
-    };
-    onLayoutAnimatedText: (event: LayoutChangeEvent) => void;
-}
-declare const OutlinedTextField: React.ForwardRefExoticComponent<OutlinedTextFieldProps & React.RefAttributes<TextInput>>;
-export default OutlinedTextField;

package/build/typescript/Tooltip/LegacyTooltip.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import type TooltipProps from './LegacyTooltipProps';
-export default function Tooltip(props: TooltipProps): JSX.Element;

package/build/typescript/Tooltip/LegacyTooltipProps.d.ts

@@ -1,72 +0,0 @@
-import React from 'react';
-import type { TextProps, ViewProps } from 'react-native';
-import type { ComponentProps } from '../types';
-import type { ButtonProps } from '../Button';
-export declare type TooltipPlacement = 'top' | 'bottom';
-export declare type TooltipArrowPlacement = 'left' | 'right';
-export declare type TooltipInitialLayout = {
-    height: number;
-    width: number;
-    x: number;
-    y: number;
-};
-export default interface TooltipProps extends ComponentProps<{
-    /**
-     * Tooltip reference element.
-     */
-    children: React.ReactNode;
-    /**
-     * Left position relative to reference element.
-     */
-    left?: number;
-    /**
-     * Callback fired when the component requests to be closed.
-     */
-    onClose?: () => void;
-    /**
-     * Tooltip placement.
-     * @default 'top'
-     */
-    placement?: TooltipPlacement;
-    /**
-     * Right position relative to reference element.
-     */
-    right?: number;
-    /**
-     * Tooltip title.
-     */
-    title: ButtonProps['children'];
-    /**
-     * Additional style for tooltip wrapper.
-     */
-    tooltipStyle?: ViewProps['style'];
-    /**
-     * The additional amount to vertically shift.
-     * @default 4
-     */
-    verticalOffset?: number;
-    /**
-     * If `true`, the tooltip is shown.
-     * @default false
-     */
-    visible?: boolean;
-    /**
-     * Tooltip arrow layout.
-     * If 'undefined', the arrow will be centered on tooltip.
-     */
-    arrowLayout?: {
-        placement: TooltipArrowPlacement;
-        offset: number;
-    };
-    /**
-     * number of tooltip's title lines
-     * @default 1
-     */
-    numberOfTitleLines?: TextProps['numberOfLines'];
-    /**
-     * position of tooltip before onLayout call
-     * @default  { height: 0, width: 0 , x: 0, y: 0}
-     */
-    initialLayout?: TooltipInitialLayout;
-}> {
-}

package/build/typescript/Tooltip/UpArrow.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import type UpArrowProps from './UpArrowProps';
-declare function UpArrow({ upsideDown, fill, opacity }: UpArrowProps): JSX.Element;
-declare const _default: React.MemoExoticComponent<typeof UpArrow>;
-export default _default;

package/build/typescript/Tooltip/UpArrowProps.d.ts

@@ -1,17 +0,0 @@
-import type { ComponentProps } from '../types';
-export default interface UpArrowProps extends ComponentProps<{
-    /**
-     * If `true`, arrow is rotating 180.
-     * @default false
-     */
-    upsideDown?: boolean;
-    /**
-     * Fill color for arrow icon.
-     */
-    fill?: string;
-    /**
-     * opacity for arrow icon
-     */
-    opacity?: number;
-}> {
-}

package/build/typescript/Typography/LegacyTypography.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { Text } from 'react-native';
-import TypographyProps from './LegacyTypographyProps';
-declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<TypographyProps & React.RefAttributes<Text>>>;
-export default _default;

package/build/typescript/Typography/LegacyTypographyProps.d.ts

@@ -1,81 +0,0 @@
-import React from 'react';
-import type { AccessibilityProps, TextProps } from 'react-native';
-import type { ComponentProps } from '../types';
-export declare type TypographyAlign = 'inherit' | 'left' | 'center' | 'right' | 'justify';
-export declare type TypographyColor = 'inherit' | 'primary' | 'secondary' | 'tertiary' | 'warning' | 'error' | 'accent' | 'textPrimary' | 'textSecondary' | 'textAccent' | 'textHint';
-export declare type TypographyVariant = 'h1' | 'h2' | 'h3' | 'subtitle1' | 'subtitle2' | 'body1' | 'body2' | 'caption1' | 'caption2' | 'flag' | 'button1' | 'button2';
-export interface Accessibility {
-    accessibilityRole: AccessibilityProps['accessibilityRole'];
-    'area-level'?: number;
-}
-export interface AccessibilityMap extends Partial<{
-    [key: string]: Accessibility;
-}> {
-}
-export default interface TypographyProps extends ComponentProps<{
-    /**
-     * Applies HTML tag at web and communicates purpose of component at app
-     */
-    accessibilityRole?: AccessibilityProps['accessibilityRole'];
-    /**
-     * Set the text-align on the component.
-     * The value 'justify' is not supported on Android and fallbacks to left.
-     * @default 'inherit'
-     */
-    align?: TypographyAlign;
-    /**
-     * Applies HTML heading level
-     */
-    ariaLevel?: number;
-    /**
-     * Specifies whether fonts should scale to respect Text Size accessibility settings.
-     * @default false
-     */
-    disableFontScaling?: boolean;
-    /**
-     * The content of the component.
-     */
-    children?: React.ReactNode;
-    /**
-     * The color of the component. It supports those theme colors that make sense for this component.
-     * @default 'inherit'
-     */
-    color?: TypographyColor;
-    /**
-     * The text ellipsis mode.
-     * @default 'tail'
-     */
-    ellipsizeMode?: TextProps['ellipsizeMode'];
-    /**
-     * Internal use only. The hyperlink of the text.
-     */
-    href?: string;
-    /**
-     * Used to truncate the text with an ellipsis after computing the text
-     * layout, including line wrapping, such that the total number of lines
-     * does not exceed this number.
-     */
-    numberOfLines?: TextProps['numberOfLines'];
-    /**
-     * Lets the user select text, to use the native copy and paste functionality.
-     */
-    onPress?: TextProps['onPress'];
-    /**
-     * Lets the user select text, to use the native copy and paste functionality.
-     */
-    selectable?: boolean;
-    /**
-     * Applies the theme typography styles.
-     * @default 'body1'
-     */
-    variant?: TypographyVariant;
-    /**
-     * Callback that is called when the text layout has been calculated.
-     */
-    onTextLayout?: TextProps['onTextLayout'];
-    /**
-     * Callback that is called when the layout of the Text component changes.
-     */
-    onLayout?: TextProps['onLayout'];
-}> {
-}

package/src/Accordion/LegacyAccordion.tsx

@@ -1,188 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { LayoutChangeEvent, View } from 'react-native';
-import Animated, {
-    useAnimatedStyle,
-    useSharedValue,
-    withDelay,
-    withTiming,
-    WithTimingConfig,
-} from 'react-native-reanimated';
-import { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';
-import { useTheme } from '../styles';
-import { ChevronDown } from '../internal/icons';
-import ButtonBase from '../ButtonBase';
-import Column from '../Column';
-import Row from '../Row';
-import Spacer from '../Spacer';
-import Typography from '../Typography';
-
-import AccordionProps from './LegacyAccordionProps';
-
-type AccordionStyles = NamedStylesStringUnion<'root'
-    | 'title'
-    | 'titleColumn'
-    | 'subtitle'
-    | 'contentView'>;
-
-const ROTATE_HIDE_DEGREE = 0;
-const ROTATE_SHOW_DEGREE = 180;
-const ANIMATION_CONFIG: Readonly<WithTimingConfig> = { duration: 200 };
-const INITIAL_EXPANDED_DELAY_MILLIS = 100;
-const CONTENT_OPACITY_DELAY_MILLIS = 200;
-
-const useStyles: UseStyles<AccordionStyles> = function (): AccordionStyles {
-    const theme = useTheme();
-
-    return {
-        root: { marginBottom: theme.spacing(2) },
-        title: {
-            borderRadius: theme.spacing(4),
-            backgroundColor: theme.palette.paper.grey,
-            paddingHorizontal: theme.spacing(4),
-            paddingVertical: theme.spacing(3.5),
-            alignItems: 'center',
-            height: 64,
-        },
-        titleColumn: { flexShrink: 1 },
-        subtitle: {
-            fontSize: 11,
-            lineHeight: 12,
-            fontFamily: 'Inter-Regular',
-        },
-        contentView: {
-            position: 'absolute',
-            width: '100%',
-            borderRadius: theme.spacing(4),
-            backgroundColor: theme.palette.paper.grey,
-            paddingHorizontal: theme.spacing(4),
-            paddingVertical: theme.spacing(6),
-            marginTop: theme.spacing(1),
-        },
-    };
-};
-
-export default function Accordion(props: AccordionProps) {
-    const {
-        title,
-        subTitle,
-        content,
-        RightIcon,
-        LeftComponent,
-        isInitialExpanded = false,
-    } = props;
-
-    const styles = useStyles();
-    const theme = useTheme();
-    const CONTENT_MARGIN_HEIGHT = theme.spacing(2);
-
-    const [isExpanded, setIsExpanded] = useState(false);
-    const shouldInitialExpandedRef = useRef<boolean>(isInitialExpanded);
-
-    const rotate = useSharedValue(ROTATE_HIDE_DEGREE);
-    const animatedOpacity = useSharedValue(0);
-
-    const animatedHeight = useSharedValue(0);
-    const [contentHeight, setContentHeight] = useState(0);
-
-    const animatedChevronDownStyles = useAnimatedStyle(() => ({
-        transform: [{ rotate: `${rotate.value}deg` }],
-    }), []);
-
-    const animatedContentBackgroundStyles = useAnimatedStyle(() => ({
-        height: animatedHeight.value,
-        overflow: 'hidden',
-    }), []);
-
-    const animatedContentStyle = useAnimatedStyle(() => ({
-        opacity: animatedOpacity.value,
-    }), []);
-
-    const onPress = () => {
-        setIsExpanded(prev => !prev);
-    };
-
-    const onLayout = (event: LayoutChangeEvent) => {
-        const height = event.nativeEvent.layout.height + CONTENT_MARGIN_HEIGHT;
-        setContentHeight(height);
-
-        if (shouldInitialExpandedRef.current) {
-            shouldInitialExpandedRef.current = false;
-            setTimeout(() => setIsExpanded(true), INITIAL_EXPANDED_DELAY_MILLIS);
-        }
-    };
-
-    useEffect(() => {
-        rotate.value = withTiming(isExpanded ? ROTATE_SHOW_DEGREE : ROTATE_HIDE_DEGREE, ANIMATION_CONFIG);
-
-        animatedHeight.value = withTiming(isExpanded ? contentHeight : 0, ANIMATION_CONFIG);
-
-        animatedOpacity.value = isExpanded
-            ? withDelay(CONTENT_OPACITY_DELAY_MILLIS, withTiming(1, ANIMATION_CONFIG))
-            : withTiming(0, ANIMATION_CONFIG);
-    }, [isExpanded, contentHeight]);
-
-    return (
-        <Column style={styles.root}>
-            <ButtonBase onPress={onPress}>
-                <Row style={styles.title}>
-                    {LeftComponent ? LeftComponent : null}
-
-                    <Column style={styles.titleColumn}>
-                        <Typography
-                            variant={'subtitle2'}
-                            children={title}
-                            color={'textPrimary'}
-                            numberOfLines={1}
-                            disableFontScaling={true}
-                        />
-
-                        {subTitle ? (
-                            <React.Fragment>
-                                <Spacer size={0.5}/>
-
-                                <Typography
-                                    style={styles.subtitle}
-                                    color={'tertiary'}
-                                    children={subTitle}
-                                    numberOfLines={1}
-                                    disableFontScaling={true}
-                                />
-                            </React.Fragment>
-                        ) : null}
-                    </Column>
-
-                    <Spacer flex={1}/>
-
-                    <Spacer size={3}/>
-
-                    <Animated.View style={animatedChevronDownStyles}>
-                        {RightIcon ? RightIcon : (
-                            <ChevronDown
-                                width={20}
-                                height={20}
-                                color={'tertiary'}
-                            />
-                        )}
-                    </Animated.View>
-                </Row>
-            </ButtonBase>
-
-            <Animated.View style={animatedContentBackgroundStyles}>
-                <View
-                    onLayout={onLayout}
-                    style={styles.contentView}
-                >
-                    <Animated.View style={animatedContentStyle}>
-                        {typeof content === 'string' ? (
-                            <Typography
-                                variant={'subtitle2'}
-                                color={'tertiary'}
-                                children={content}
-                            />
-                        ) : (content)}
-                    </Animated.View>
-                </View>
-            </Animated.View>
-        </Column>
-    );
-}

package/src/Accordion/LegacyAccordionProps.ts

@@ -1,34 +0,0 @@
-import React from 'react';
-
-export default interface AccordionProps {
-    /**
-     * The title of the component.
-     */
-    title: string | React.ReactNode;
-
-    /**
-     * The subtitle of the component.
-     */
-    subTitle?: string | React.ReactNode;
-
-    /**
-     * The component to the left of the title.
-     */
-    LeftComponent?: React.ReactNode;
-
-    /**
-     * The icon to the right of the title.
-     */
-    RightIcon?: React.ReactElement;
-
-    /**
-     * The content of the component.
-     */
-    content: string | React.ReactNode;
-
-    /**
-     * The initial state of expanding
-     * @default false
-     */
-    isInitialExpanded?: boolean;
-}