@admin-layout/gluestack-ui-mobile 12.0.16-alpha.93 → 12.2.1-alpha.0

package/src/components/ui/fab/index.web.tsx

@@ -1,201 +0,0 @@
-'use client';
-import React from 'react';
-import { createFab } from '@gluestack-ui/fab';
-import { tva } from '@gluestack-ui/nativewind-utils/tva';
-import { withStyleContext, useStyleContext } from '@gluestack-ui/nativewind-utils/withStyleContext';
-import { cssInterop } from 'nativewind';
-import type { VariantProps } from '@gluestack-ui/nativewind-utils';
-import { PrimitiveIcon, UIIcon } from '@gluestack-ui/icon';
-
-const SCOPE = 'FAB';
-
-// Create styled components for web
-const StyledButton = React.forwardRef<HTMLButtonElement, React.ButtonHTMLAttributes<HTMLButtonElement>>(
-    (props, ref) => <button ref={ref} {...props} />,
-);
-StyledButton.displayName = 'StyledButton';
-
-const StyledSpan = React.forwardRef<HTMLSpanElement, React.HTMLAttributes<HTMLSpanElement>>((props, ref) => (
-    <span ref={ref} {...props} />
-));
-StyledSpan.displayName = 'StyledSpan';
-
-const Root = withStyleContext(StyledButton, SCOPE);
-const UIFab = createFab({
-    Root: Root,
-    Label: StyledSpan,
-    Icon: UIIcon,
-});
-
-cssInterop(PrimitiveIcon, {
-    className: {
-        target: 'style',
-        nativeStyleToProp: {
-            height: true,
-            width: true,
-            fill: true,
-            color: 'classNameColor',
-            stroke: true,
-        },
-    },
-});
-
-const fabStyle = tva({
-    base: 'group/fab bg-primary-500 rounded-full z-20 p-4 flex-row items-center justify-center absolute hover:bg-primary-600 active:bg-primary-700 disabled:opacity-40 disabled:pointer-events-all disabled:cursor-not-allowed data-[focus=true]:web:outline-none data-[focus-visible=true]:web:ring-2 data-[focus-visible=true]:web:ring-indicator-info shadow-hard-2 border-0',
-    variants: {
-        size: {
-            sm: 'px-2.5 py-2.5',
-            md: 'px-3 py-3',
-            lg: 'px-4 py-4',
-        },
-        placement: {
-            'top right': 'top-4 right-4',
-            'top left': 'top-4 left-4',
-            'bottom right': 'bottom-4 right-4',
-            'bottom left': 'bottom-4 left-4',
-            'top center': 'top-4 self-center',
-            'bottom center': 'bottom-4 self-center',
-        },
-    },
-});
-
-const fabLabelStyle = tva({
-    base: 'text-typography-50 font-normal font-body tracking-md text-left mx-2',
-    variants: {
-        isTruncated: {
-            true: 'truncate',
-        },
-        bold: {
-            true: 'font-bold',
-        },
-        underline: {
-            true: 'underline',
-        },
-        strikeThrough: {
-            true: 'line-through',
-        },
-        size: {
-            '2xs': 'text-2xs',
-            xs: 'text-xs',
-            sm: 'text-sm',
-            md: 'text-base',
-            lg: 'text-lg',
-            xl: 'text-xl',
-            '2xl': 'text-2xl',
-            '3xl': 'text-3xl',
-            '4xl': 'text-4xl',
-            '5xl': 'text-5xl',
-            '6xl': 'text-6xl',
-        },
-        sub: {
-            true: 'text-xs',
-        },
-        italic: {
-            true: 'italic',
-        },
-        highlight: {
-            true: 'bg-yellow-500',
-        },
-    },
-    parentVariants: {
-        size: {
-            sm: 'text-sm',
-            md: 'text-base',
-            lg: 'text-lg',
-        },
-    },
-});
-
-const fabIconStyle = tva({
-    base: 'text-typography-50 fill-none',
-    variants: {
-        size: {
-            '2xs': 'h-3 w-3',
-            xs: 'h-3.5 w-3.5',
-            sm: 'h-4 w-4',
-            md: 'w-[18px] h-[18px]',
-            lg: 'h-5 w-5',
-            xl: 'h-6 w-6',
-        },
-    },
-});
-
-type IFabProps = Omit<React.ComponentPropsWithoutRef<typeof UIFab>, 'context'> & VariantProps<typeof fabStyle>;
-
-const Fab = React.forwardRef<React.ElementRef<typeof UIFab>, IFabProps>(
-    ({ size = 'md', placement = 'bottom right', className, ...props }, ref) => {
-        return (
-            <UIFab
-                ref={ref}
-                {...props}
-                className={fabStyle({ size, placement, class: className })}
-                context={{ size }}
-            />
-        );
-    },
-);
-
-type IFabLabelProps = React.ComponentPropsWithoutRef<typeof UIFab.Label> & VariantProps<typeof fabLabelStyle>;
-
-const FabLabel = React.forwardRef<React.ElementRef<typeof UIFab.Label>, IFabLabelProps>(
-    (
-        { size, isTruncated = false, bold = false, underline = false, strikeThrough = false, className, ...props },
-        ref,
-    ) => {
-        const { size: parentSize } = useStyleContext(SCOPE);
-        return (
-            <UIFab.Label
-                ref={ref}
-                {...props}
-                className={fabLabelStyle({
-                    parentVariants: {
-                        size: parentSize,
-                    },
-                    size,
-                    isTruncated,
-                    bold,
-                    underline,
-                    strikeThrough,
-                    class: className,
-                })}
-            />
-        );
-    },
-);
-
-type IFabIconProps = React.ComponentPropsWithoutRef<typeof UIFab.Icon> &
-    VariantProps<typeof fabIconStyle> & {
-        height?: number;
-        width?: number;
-    };
-
-const FabIcon = React.forwardRef<React.ElementRef<typeof UIFab.Icon>, IFabIconProps>(
-    ({ size, className, ...props }, ref) => {
-        const { size: parentSize } = useStyleContext(SCOPE);
-
-        if (typeof size === 'number') {
-            return <UIFab.Icon ref={ref} {...props} className={fabIconStyle({ class: className })} size={size} />;
-        } else if ((props.height !== undefined || props.width !== undefined) && size === undefined) {
-            return <UIFab.Icon ref={ref} {...props} className={fabIconStyle({ class: className })} />;
-        }
-        return (
-            <UIFab.Icon
-                ref={ref}
-                {...props}
-                className={fabIconStyle({
-                    parentVariants: {
-                        size: parentSize,
-                    },
-                    size,
-                    class: className,
-                })}
-            />
-        );
-    },
-);
-
-Fab.displayName = 'Fab';
-FabLabel.displayName = 'FabLabel';
-FabIcon.displayName = 'FabIcon';
-
-export { Fab, FabLabel, FabIcon };

package/src/components/ui/flat-list/index.tsx

@@ -1,2 +0,0 @@
-'use client';
-export { FlatList } from 'react-native';

package/src/components/ui/flat-list/index.web.tsx

@@ -1,89 +0,0 @@
-'use client';
-import React, { forwardRef } from 'react';
-import { tva } from '@gluestack-ui/nativewind-utils/tva';
-import { withStyleContext } from '@gluestack-ui/nativewind-utils/withStyleContext';
-import { cssInterop } from 'nativewind';
-import type { VariantProps } from '@gluestack-ui/nativewind-utils';
-import { ScrollView } from '../scroll-view/index.web';
-
-const flatListStyle = tva({
-    base: 'flex flex-col',
-    variants: {
-        horizontal: {
-            true: 'flex-row',
-            false: 'flex-col',
-        },
-    },
-    defaultVariants: {
-        horizontal: false,
-    },
-});
-
-interface FlatListProps<T> {
-    data: ReadonlyArray<T>;
-    renderItem: ({ item, index }: { item: T; index: number }) => React.ReactElement;
-    keyExtractor?: (item: T, index: number) => string;
-    horizontal?: boolean;
-    className?: string;
-    contentContainerStyle?: React.CSSProperties;
-    ListHeaderComponent?: React.ReactElement | null;
-    ListFooterComponent?: React.ReactElement | null;
-    ListEmptyComponent?: React.ReactElement | null;
-    onEndReached?: () => void;
-    onEndReachedThreshold?: number;
-}
-
-function FlatListComponent<T>(
-    {
-        data,
-        renderItem,
-        keyExtractor,
-        horizontal = false,
-        className,
-        contentContainerStyle,
-        ListHeaderComponent,
-        ListFooterComponent,
-        ListEmptyComponent,
-        onEndReached,
-        onEndReachedThreshold = 0.5,
-        ...props
-    }: FlatListProps<T>,
-    ref: React.Ref<HTMLDivElement>,
-) {
-    const handleScroll = (event: React.UIEvent<HTMLDivElement>) => {
-        if (!onEndReached) return;
-
-        const target = event.target as HTMLDivElement;
-        const scrollPosition = horizontal
-            ? target.scrollLeft + target.clientWidth
-            : target.scrollTop + target.clientHeight;
-        const scrollSize = horizontal ? target.scrollWidth : target.scrollHeight;
-        const threshold = scrollSize * onEndReachedThreshold;
-
-        if (scrollSize - scrollPosition <= threshold) {
-            onEndReached();
-        }
-    };
-
-    return (
-        <ScrollView ref={ref} horizontal={horizontal} className={className} onScroll={handleScroll} {...props}>
-            <div className={flatListStyle({ horizontal })} style={contentContainerStyle}>
-                {ListHeaderComponent}
-                {data.length === 0 && ListEmptyComponent
-                    ? ListEmptyComponent
-                    : data.map((item, index) => (
-                          <React.Fragment key={keyExtractor ? keyExtractor(item, index) : index}>
-                              {renderItem({ item, index })}
-                          </React.Fragment>
-                      ))}
-                {ListFooterComponent}
-            </div>
-        </ScrollView>
-    );
-}
-
-const FlatList = React.forwardRef(FlatListComponent) as <T>(
-    props: FlatListProps<T> & { ref?: React.Ref<HTMLDivElement> },
-) => React.ReactElement;
-
-export { FlatList };