R: React.PropsWithChildren
This commit is contained in:
parent
08634e396e
commit
02b07d2874
|
@ -23,7 +23,7 @@ const logError = (error: Error, info: { componentStack?: string | null | undefin
|
||||||
};
|
};
|
||||||
|
|
||||||
// prettier-ignore
|
// prettier-ignore
|
||||||
function GlobalProviders({ children }: { children: React.ReactNode }) {
|
function GlobalProviders({ children }: React.PropsWithChildren) {
|
||||||
return (
|
return (
|
||||||
<ErrorBoundary
|
<ErrorBoundary
|
||||||
FallbackComponent={ErrorFallback}
|
FallbackComponent={ErrorFallback}
|
||||||
|
|
|
@ -156,7 +156,6 @@ interface IconSVGProps {
|
||||||
size?: string;
|
size?: string;
|
||||||
className?: string;
|
className?: string;
|
||||||
props?: React.SVGProps<SVGSVGElement>;
|
props?: React.SVGProps<SVGSVGElement>;
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface IconProps {
|
export interface IconProps {
|
||||||
|
@ -164,7 +163,7 @@ export interface IconProps {
|
||||||
className?: string;
|
className?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
function MetaIconSVG({ viewBox, size = '1.5rem', className, props, children }: IconSVGProps) {
|
function MetaIconSVG({ viewBox, size = '1.5rem', className, props, children }: React.PropsWithChildren<IconSVGProps>) {
|
||||||
return (
|
return (
|
||||||
<svg
|
<svg
|
||||||
width={size}
|
width={size}
|
||||||
|
|
|
@ -14,15 +14,19 @@ interface DropdownProps extends CProps.Styling {
|
||||||
|
|
||||||
/** Indicates whether the dropdown is open. */
|
/** Indicates whether the dropdown is open. */
|
||||||
isOpen: boolean;
|
isOpen: boolean;
|
||||||
|
|
||||||
/** Children to render inside the component. */
|
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Dropdown animated component that displays a list of children with optional positioning and visibility control.
|
* Dropdown animated component that displays a list of children with optional positioning and visibility control.
|
||||||
*/
|
*/
|
||||||
function Dropdown({ isOpen, stretchLeft, stretchTop, className, children, ...restProps }: DropdownProps) {
|
function Dropdown({
|
||||||
|
isOpen,
|
||||||
|
stretchLeft,
|
||||||
|
stretchTop,
|
||||||
|
className,
|
||||||
|
children,
|
||||||
|
...restProps
|
||||||
|
}: React.PropsWithChildren<DropdownProps>) {
|
||||||
return (
|
return (
|
||||||
<div className='relative'>
|
<div className='relative'>
|
||||||
<motion.div
|
<motion.div
|
||||||
|
|
|
@ -27,8 +27,6 @@ export interface ModalProps extends CProps.Styling {
|
||||||
beforeSubmit?: () => boolean;
|
beforeSubmit?: () => boolean;
|
||||||
onSubmit?: () => void;
|
onSubmit?: () => void;
|
||||||
onCancel?: () => void;
|
onCancel?: () => void;
|
||||||
|
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function Modal({
|
function Modal({
|
||||||
|
@ -45,7 +43,7 @@ function Modal({
|
||||||
overflowVisible,
|
overflowVisible,
|
||||||
submitText = 'Продолжить',
|
submitText = 'Продолжить',
|
||||||
...restProps
|
...restProps
|
||||||
}: ModalProps) {
|
}: React.PropsWithChildren<ModalProps>) {
|
||||||
const ref = useRef(null);
|
const ref = useRef(null);
|
||||||
useEscapeKey(hideWindow);
|
useEscapeKey(hideWindow);
|
||||||
|
|
||||||
|
|
|
@ -4,12 +4,17 @@ import { CProps } from '../props';
|
||||||
|
|
||||||
interface OverlayProps extends CProps.Styling {
|
interface OverlayProps extends CProps.Styling {
|
||||||
id?: string;
|
id?: string;
|
||||||
children: React.ReactNode;
|
|
||||||
position?: string;
|
position?: string;
|
||||||
layer?: string;
|
layer?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
function Overlay({ children, className, position = 'top-0 right-0', layer = 'z-pop', ...restProps }: OverlayProps) {
|
function Overlay({
|
||||||
|
children,
|
||||||
|
className,
|
||||||
|
position = 'top-0 right-0',
|
||||||
|
layer = 'z-pop',
|
||||||
|
...restProps
|
||||||
|
}: React.PropsWithChildren<OverlayProps>) {
|
||||||
return (
|
return (
|
||||||
<div className='relative'>
|
<div className='relative'>
|
||||||
<div className={clsx('absolute', className, position, layer)} {...restProps}>
|
<div className={clsx('absolute', className, position, layer)} {...restProps}>
|
||||||
|
|
|
@ -11,11 +11,17 @@ interface DataLoaderProps extends CProps.AnimatedDiv {
|
||||||
isLoading?: boolean;
|
isLoading?: boolean;
|
||||||
error?: ErrorData;
|
error?: ErrorData;
|
||||||
hasNoData?: boolean;
|
hasNoData?: boolean;
|
||||||
|
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function DataLoader({ id, isLoading, hasNoData, error, className, children, ...restProps }: DataLoaderProps) {
|
function DataLoader({
|
||||||
|
id,
|
||||||
|
isLoading,
|
||||||
|
hasNoData,
|
||||||
|
error,
|
||||||
|
className,
|
||||||
|
children,
|
||||||
|
...restProps
|
||||||
|
}: React.PropsWithChildren<DataLoaderProps>) {
|
||||||
return (
|
return (
|
||||||
<AnimatePresence mode='wait'>
|
<AnimatePresence mode='wait'>
|
||||||
{!isLoading && !error && !hasNoData ? (
|
{!isLoading && !error && !hasNoData ? (
|
||||||
|
|
|
@ -8,11 +8,7 @@ import Loader from '../ui/Loader';
|
||||||
import TextURL from '../ui/TextURL';
|
import TextURL from '../ui/TextURL';
|
||||||
import AnimateFade from './AnimateFade';
|
import AnimateFade from './AnimateFade';
|
||||||
|
|
||||||
interface RequireAuthProps {
|
function RequireAuth({ children }: React.PropsWithChildren) {
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
function RequireAuth({ children }: RequireAuthProps) {
|
|
||||||
const { user, loading } = useAuth();
|
const { user, loading } = useAuth();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
|
@ -19,12 +19,7 @@ export const useAccessMode = () => {
|
||||||
return context;
|
return context;
|
||||||
};
|
};
|
||||||
|
|
||||||
interface AccessModeStateProps {
|
export const AccessModeState = ({ children }: React.PropsWithChildren) => {
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const AccessModeState = ({ children }: AccessModeStateProps) => {
|
|
||||||
const [accessLevel, setAccessLevel] = useState<UserLevel>(UserLevel.READER);
|
const [accessLevel, setAccessLevel] = useState<UserLevel>(UserLevel.READER);
|
||||||
|
|
||||||
return <AccessContext.Provider value={{ accessLevel, setAccessLevel }}>{children}</AccessContext.Provider>;
|
return <AccessContext.Provider value={{ accessLevel, setAccessLevel }}>{children}</AccessContext.Provider>;
|
||||||
};
|
};
|
||||||
|
|
|
@ -52,11 +52,7 @@ export const useAuth = () => {
|
||||||
return context;
|
return context;
|
||||||
};
|
};
|
||||||
|
|
||||||
interface AuthStateProps {
|
export const AuthState = ({ children }: React.PropsWithChildren) => {
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const AuthState = ({ children }: AuthStateProps) => {
|
|
||||||
const { users } = useUsers();
|
const { users } = useUsers();
|
||||||
const [user, setUser] = useState<ICurrentUser | undefined>(undefined);
|
const [user, setUser] = useState<ICurrentUser | undefined>(undefined);
|
||||||
const [loading, setLoading] = useState(true);
|
const [loading, setLoading] = useState(true);
|
||||||
|
|
|
@ -52,11 +52,7 @@ export const useConceptOptions = () => {
|
||||||
return context;
|
return context;
|
||||||
};
|
};
|
||||||
|
|
||||||
interface OptionsStateProps {
|
export const OptionsState = ({ children }: React.PropsWithChildren) => {
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const OptionsState = ({ children }: OptionsStateProps) => {
|
|
||||||
const [darkMode, setDarkMode] = useLocalStorage(storage.themeDark, false);
|
const [darkMode, setDarkMode] = useLocalStorage(storage.themeDark, false);
|
||||||
const [adminMode, setAdminMode] = useLocalStorage(storage.optionsAdmin, false);
|
const [adminMode, setAdminMode] = useLocalStorage(storage.optionsAdmin, false);
|
||||||
const [showHelp, setShowHelp] = useLocalStorage(storage.optionsHelp, true);
|
const [showHelp, setShowHelp] = useLocalStorage(storage.optionsHelp, true);
|
||||||
|
|
|
@ -32,11 +32,7 @@ export const useGlobalOss = (): IGlobalOssContext => {
|
||||||
return context;
|
return context;
|
||||||
};
|
};
|
||||||
|
|
||||||
interface GlobalOssStateProps {
|
export const GlobalOssState = ({ children }: React.PropsWithChildren) => {
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const GlobalOssState = ({ children }: GlobalOssStateProps) => {
|
|
||||||
const library = useLibrary();
|
const library = useLibrary();
|
||||||
const [isValid, setIsValid] = useState(false);
|
const [isValid, setIsValid] = useState(false);
|
||||||
const [ossID, setIdInternal] = useState<string | undefined>(undefined);
|
const [ossID, setIdInternal] = useState<string | undefined>(undefined);
|
||||||
|
|
|
@ -61,11 +61,7 @@ export const useLibrary = (): ILibraryContext => {
|
||||||
return context;
|
return context;
|
||||||
};
|
};
|
||||||
|
|
||||||
interface LibraryStateProps {
|
export const LibraryState = ({ children }: React.PropsWithChildren) => {
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const LibraryState = ({ children }: LibraryStateProps) => {
|
|
||||||
const { user, loading: userLoading } = useAuth();
|
const { user, loading: userLoading } = useAuth();
|
||||||
const { adminMode } = useConceptOptions();
|
const { adminMode } = useConceptOptions();
|
||||||
|
|
||||||
|
|
|
@ -27,11 +27,7 @@ export const useConceptNavigation = () => {
|
||||||
return context;
|
return context;
|
||||||
};
|
};
|
||||||
|
|
||||||
interface NavigationStateProps {
|
export const NavigationState = ({ children }: React.PropsWithChildren) => {
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const NavigationState = ({ children }: NavigationStateProps) => {
|
|
||||||
const router = useNavigate();
|
const router = useNavigate();
|
||||||
const { pathname } = useLocation();
|
const { pathname } = useLocation();
|
||||||
|
|
||||||
|
|
|
@ -78,10 +78,9 @@ export const useOSS = () => {
|
||||||
|
|
||||||
interface OssStateProps {
|
interface OssStateProps {
|
||||||
itemID: string;
|
itemID: string;
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const OssState = ({ itemID, children }: OssStateProps) => {
|
export const OssState = ({ itemID, children }: React.PropsWithChildren<OssStateProps>) => {
|
||||||
const library = useLibrary();
|
const library = useLibrary();
|
||||||
const oss = useGlobalOss();
|
const oss = useGlobalOss();
|
||||||
const model = oss.schema;
|
const model = oss.schema;
|
||||||
|
|
|
@ -107,10 +107,9 @@ export const useRSForm = () => {
|
||||||
interface RSFormStateProps {
|
interface RSFormStateProps {
|
||||||
itemID: string;
|
itemID: string;
|
||||||
versionID?: string;
|
versionID?: string;
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const RSFormState = ({ itemID, versionID, children }: RSFormStateProps) => {
|
export const RSFormState = ({ itemID, versionID, children }: React.PropsWithChildren<RSFormStateProps>) => {
|
||||||
const library = useLibrary();
|
const library = useLibrary();
|
||||||
const oss = useGlobalOss();
|
const oss = useGlobalOss();
|
||||||
const { user } = useAuth();
|
const { user } = useAuth();
|
||||||
|
|
|
@ -30,11 +30,7 @@ export const useUserProfile = () => {
|
||||||
return context;
|
return context;
|
||||||
};
|
};
|
||||||
|
|
||||||
interface UserProfileStateProps {
|
export const UserProfileState = ({ children }: React.PropsWithChildren) => {
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const UserProfileState = ({ children }: UserProfileStateProps) => {
|
|
||||||
const { users } = useUsers();
|
const { users } = useUsers();
|
||||||
const [user, setUser] = useState<IUserProfile | undefined>(undefined);
|
const [user, setUser] = useState<IUserProfile | undefined>(undefined);
|
||||||
const [loading, setLoading] = useState(true);
|
const [loading, setLoading] = useState(true);
|
||||||
|
|
|
@ -21,11 +21,7 @@ export const useUsers = (): IUsersContext => {
|
||||||
return context;
|
return context;
|
||||||
};
|
};
|
||||||
|
|
||||||
interface UsersStateProps {
|
export const UsersState = ({ children }: React.PropsWithChildren) => {
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const UsersState = ({ children }: UsersStateProps) => {
|
|
||||||
const [users, setUsers] = useState<IUserInfo[]>([]);
|
const [users, setUsers] = useState<IUserInfo[]>([]);
|
||||||
|
|
||||||
function getUserLabel(userID: number | null) {
|
function getUserLabel(userID: number | null) {
|
||||||
|
|
|
@ -86,13 +86,11 @@ export const useOssEdit = () => {
|
||||||
};
|
};
|
||||||
|
|
||||||
interface OssEditStateProps {
|
interface OssEditStateProps {
|
||||||
// isModified: boolean;
|
|
||||||
selected: OperationID[];
|
selected: OperationID[];
|
||||||
setSelected: React.Dispatch<React.SetStateAction<OperationID[]>>;
|
setSelected: React.Dispatch<React.SetStateAction<OperationID[]>>;
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const OssEditState = ({ selected, setSelected, children }: OssEditStateProps) => {
|
export const OssEditState = ({ selected, setSelected, children }: React.PropsWithChildren<OssEditStateProps>) => {
|
||||||
const router = useConceptNavigation();
|
const router = useConceptNavigation();
|
||||||
const { user } = useAuth();
|
const { user } = useAuth();
|
||||||
const { adminMode } = useConceptOptions();
|
const { adminMode } = useConceptOptions();
|
||||||
|
|
|
@ -126,7 +126,6 @@ interface RSEditStateProps {
|
||||||
|
|
||||||
onCreateCst?: (newCst: IConstituentaMeta) => void;
|
onCreateCst?: (newCst: IConstituentaMeta) => void;
|
||||||
onDeleteCst?: (newActive?: ConstituentaID) => void;
|
onDeleteCst?: (newActive?: ConstituentaID) => void;
|
||||||
children: React.ReactNode;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const RSEditState = ({
|
export const RSEditState = ({
|
||||||
|
@ -137,7 +136,7 @@ export const RSEditState = ({
|
||||||
onCreateCst,
|
onCreateCst,
|
||||||
onDeleteCst,
|
onDeleteCst,
|
||||||
children
|
children
|
||||||
}: RSEditStateProps) => {
|
}: React.PropsWithChildren<RSEditStateProps>) => {
|
||||||
const router = useConceptNavigation();
|
const router = useConceptNavigation();
|
||||||
const { user } = useAuth();
|
const { user } = useAuth();
|
||||||
const { adminMode } = useConceptOptions();
|
const { adminMode } = useConceptOptions();
|
||||||
|
|
Loading…
Reference in New Issue
Block a user