@sincpro/mobile-ui 0.1.2 → 0.1.3

package/sincpro_mobile_ui/views/FormViewV2.tsx

@@ -1,248 +0,0 @@
-import React, { ReactNode } from "react";
-import { RefreshControl, View } from "react-native";
-import { KeyboardAwareScrollView } from "react-native-keyboard-controller";
-
-import { ErrorBoundary, Feedback } from "../Feedback";
-import Container from "../layouts/Container";
-import { theme } from "../theme";
-import ScreenHeader, { EVariantScreenHeader } from "../widgets/ScreenHeader";
-import { FormViewProvider, useFormView } from "./FormViewV2.context";
-
-interface FormViewProps<T> {
-  name: string;
-  description?: string;
-  item: T | null;
-  isLoading?: boolean;
-  isEmpty?: boolean;
-  hasError?: boolean;
-  errorMessage?: string;
-  readonly?: boolean;
-  onRefresh?: () => Promise<void>;
-  onRetry?: () => void;
-  onBack?: () => void;
-  withContainer?: boolean;
-  children: ReactNode;
-}
-
-function FormViewRoot<T>({
-  name,
-  description,
-  item,
-  isLoading = false,
-  isEmpty = false,
-  hasError = false,
-  errorMessage,
-  readonly = false,
-  onRefresh,
-  onRetry,
-  onBack,
-  withContainer = true,
-  children,
-}: FormViewProps<T>) {
-  const Wrapper = withContainer ? Container : View;
-  const wrapperProps = withContainer ? {} : { style: { flex: 1 } };
-
-  return (
-    <FormViewProvider
-      description={description}
-      errorMessage={errorMessage}
-      hasError={hasError}
-      isEmpty={isEmpty}
-      isLoading={isLoading}
-      item={item}
-      name={name}
-      onBack={onBack}
-      onRefresh={onRefresh}
-      onRetry={onRetry}
-      readonly={readonly}
-    >
-      <ErrorBoundary>
-        <Wrapper {...wrapperProps}>{children}</Wrapper>
-      </ErrorBoundary>
-    </FormViewProvider>
-  );
-}
-
-function Header({
-  variant = EVariantScreenHeader.FLAT_HEADER,
-  children,
-}: {
-  variant?: EVariantScreenHeader;
-  children?: ReactNode;
-}) {
-  const { name, description, onBack } = useFormView();
-
-  return (
-    <>
-      <ScreenHeader
-        onBack={onBack}
-        subtitle={description ? description : `Seleccionar ${name}`}
-        title={name}
-        variant={variant}
-      >
-        {children}
-      </ScreenHeader>
-    </>
-  );
-}
-
-function HeaderActions({ children }: { children: ReactNode }) {
-  return (
-    <View className="flex-row px-4 my-4 items-center justify-between flex-1 gap-2">
-      {children}
-    </View>
-  );
-}
-
-function HeaderActionsBar({ children }: { children: ReactNode }) {
-  return (
-    <View className="bg-bg-card px-4 py-3 border-b border-border-default flex-row gap-2">
-      {children}
-    </View>
-  );
-}
-
-function Content({
-  withMargin = false,
-  children,
-}: {
-  withMargin?: boolean;
-  children: ReactNode;
-}) {
-  const {
-    name,
-    isLoading,
-    isEmpty,
-    hasError,
-    errorMessage,
-    item,
-    onRefresh,
-    onRetry,
-    onBack,
-    showRefreshing,
-    setShowRefreshing,
-  } = useFormView();
-
-  const handleRefresh = React.useCallback(async () => {
-    setShowRefreshing(true);
-    if (onRefresh) {
-      await onRefresh();
-    }
-    setShowRefreshing(false);
-  }, [onRefresh, setShowRefreshing]);
-
-  const isCenteredContent = isLoading || isEmpty || !item || hasError;
-
-  return (
-    <KeyboardAwareScrollView
-      bottomOffset={20}
-      contentContainerStyle={{
-        flexGrow: 1,
-        justifyContent: isCenteredContent ? "center" : "flex-start",
-        alignItems: isCenteredContent ? "center" : "stretch",
-      }}
-      keyboardShouldPersistTaps="handled"
-      refreshControl={
-        <RefreshControl
-          colors={[theme.primary]}
-          onRefresh={handleRefresh}
-          refreshing={showRefreshing}
-        />
-      }
-      style={{ flex: 1 }}
-    >
-      {isCenteredContent ? (
-        <>
-          {isLoading ? (
-            <Feedback.Loading message={`Cargando ${name}...`} />
-          ) : hasError ? (
-            <Feedback.Error message={errorMessage} onBack={onBack} onRetry={onRetry} />
-          ) : (
-            <Feedback.Empty />
-          )}
-        </>
-      ) : (
-        <View style={withMargin ? { paddingHorizontal: 16 } : undefined}>{children}</View>
-      )}
-    </KeyboardAwareScrollView>
-  );
-}
-
-function Form({ children }: { children: ReactNode }) {
-  const { isEmpty, item } = useFormView();
-
-  if (isEmpty || !item) {
-    return <Feedback.Empty />;
-  }
-
-  return <>{children}</>;
-}
-
-function Groups({ children }: { children: ReactNode }) {
-  const { isEmpty } = useFormView();
-
-  if (isEmpty) {
-    return null;
-  }
-
-  return <>{children}</>;
-}
-
-function Group({
-  children,
-  withMargin = true,
-  elevation = "md",
-}: {
-  children: ReactNode;
-  withMargin?: boolean;
-  elevation?: "sm" | "md" | "lg";
-}) {
-  const groupClass = withMargin
-    ? "bg-bg-card mx-4 my-1 p-1 rounded-lg border border-border-light"
-    : "bg-bg-card p-1 rounded-lg border border-border-light";
-
-  return (
-    <View className={groupClass} style={theme.shadow[elevation]}>
-      {children}
-    </View>
-  );
-}
-
-function Footer({ children }: { children: ReactNode }) {
-  const { isEmpty, isLoading } = useFormView();
-
-  if (isEmpty || isLoading) {
-    return null;
-  }
-
-  return (
-    <View
-      className="bg-bg-card px-4 py-3 border-t border-border-default"
-      style={theme.shadow.sm}
-    >
-      {children}
-    </View>
-  );
-}
-
-// Nested Header components
-const HeaderWithSubComponents = Object.assign(Header, {
-  Actions: HeaderActions,
-  ActionsBar: HeaderActionsBar,
-});
-
-// Nested Content components
-const ContentWithSubComponents = Object.assign(Content, {
-  Form,
-  Groups,
-  Group,
-});
-
-export const FormViewV2 = {
-  Root: FormViewRoot,
-  Header: HeaderWithSubComponents,
-  Content: ContentWithSubComponents,
-  Footer,
-};
-
-export default FormViewV2;

package/sincpro_mobile_ui/views/ListViewV2.context.tsx

@@ -1,87 +0,0 @@
-import { createContext, ReactNode, useContext, useState } from "react";
-
-interface ListViewContextValue<T> {
-  name: string;
-  description?: string;
-  items: T[];
-  isLoading: boolean;
-  hasError: boolean;
-  errorMessage?: string;
-  readonly: boolean;
-  showRefreshing: boolean;
-  setShowRefreshing: (value: boolean) => void;
-  onRefresh?: () => Promise<void>;
-  onRetry?: () => void;
-  onPressItem?: (item: T) => void;
-  onDeleteItem?: (item: T) => void;
-  onSearch?: (query: string) => void;
-  onBack?: () => void;
-}
-
-const Context = createContext<ListViewContextValue<any> | null>(null);
-
-export function ListViewProvider<T>({
-  name,
-  description,
-  items,
-  isLoading = false,
-  hasError = false,
-  errorMessage,
-  readonly = false,
-  onRefresh,
-  onRetry,
-  onPressItem,
-  onDeleteItem,
-  onSearch,
-  onBack,
-  children,
-}: {
-  name: string;
-  description?: string;
-  items: T[];
-  isLoading?: boolean;
-  hasError?: boolean;
-  errorMessage?: string;
-  readonly?: boolean;
-  onRefresh?: () => Promise<void>;
-  onRetry?: () => void;
-  onPressItem?: (item: T) => void;
-  onDeleteItem?: (item: T) => void;
-  onSearch?: (query: string) => void;
-  onBack?: () => void;
-  children: ReactNode;
-}) {
-  const [showRefreshing, setShowRefreshing] = useState(false);
-
-  return (
-    <Context.Provider
-      value={{
-        name,
-        description,
-        items,
-        isLoading,
-        hasError,
-        errorMessage,
-        readonly,
-        showRefreshing,
-        setShowRefreshing,
-        onRefresh,
-        onRetry,
-        onPressItem,
-        onDeleteItem,
-        onSearch,
-        onBack,
-      }}
-    >
-      {children}
-    </Context.Provider>
-  );
-}
-
-export function useListView<T>() {
-  const context = useContext(Context);
-  if (!context) {
-    throw new Error("useListView must be used within ListViewV2");
-  }
-  return context as ListViewContextValue<T>;
-}