This commit is contained in:
Kismet Hasanaj
2026-05-02 20:07:02 +02:00
parent ce8672e283
commit 34dc9aec52
9428 changed files with 1733330 additions and 0 deletions
+3
View File
@@ -0,0 +1,3 @@
import { type FormProps } from '../form-shared';
export type { FormProps };
export default function Form({ replace, scroll, prefetch: prefetchProp, ref: externalRef, ...props }: FormProps): import("react/jsx-runtime").JSX.Element;
+158
View File
@@ -0,0 +1,158 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "default", {
enumerable: true,
get: function() {
return Form;
}
});
const _jsxruntime = require("react/jsx-runtime");
const _react = require("react");
const _addbasepath = require("../add-base-path");
const _usemergedref = require("../use-merged-ref");
const _approutercontextsharedruntime = require("../../shared/lib/app-router-context.shared-runtime");
const _formshared = require("../form-shared");
const _links = require("../components/links");
const _types = require("../components/segment-cache/types");
function Form({ replace, scroll, prefetch: prefetchProp, ref: externalRef, ...props }) {
const router = (0, _react.useContext)(_approutercontextsharedruntime.AppRouterContext);
const actionProp = props.action;
const isNavigatingForm = typeof actionProp === 'string';
// Validate `action`
if (process.env.NODE_ENV === 'development') {
if (isNavigatingForm) {
(0, _formshared.checkFormActionUrl)(actionProp, 'action');
}
}
// Validate `prefetch`
if (process.env.NODE_ENV === 'development') {
if (!(prefetchProp === undefined || prefetchProp === false || prefetchProp === null)) {
console.error('The `prefetch` prop of <Form> must be `false` or `null`');
}
if (prefetchProp !== undefined && !isNavigatingForm) {
console.error('Passing `prefetch` to a <Form> whose `action` is a function has no effect.');
}
}
// TODO(runtime-ppr): allow runtime prefetches in Form
const prefetch = prefetchProp === false || prefetchProp === null ? prefetchProp : null;
// Validate `scroll` and `replace`
if (process.env.NODE_ENV === 'development') {
if (!isNavigatingForm && (replace !== undefined || scroll !== undefined)) {
console.error('Passing `replace` or `scroll` to a <Form> whose `action` is a function has no effect.\n' + 'See the relevant docs to learn how to control this behavior for navigations triggered from actions:\n' + ' `redirect()` - https://nextjs.org/docs/app/api-reference/functions/redirect#parameters\n' + ' `router.replace()` - https://nextjs.org/docs/app/api-reference/functions/use-router#userouter\n');
}
}
// Clean up any unsupported form props (and warn if present)
for (const key of _formshared.DISALLOWED_FORM_PROPS){
if (key in props) {
if (process.env.NODE_ENV === 'development') {
console.error(`<Form> does not support changing \`${key}\`. ` + (isNavigatingForm ? `If you'd like to use it to perform a mutation, consider making \`action\` a function instead.\n` + `Learn more: https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions-and-mutations` : ''));
}
delete props[key];
}
}
const isPrefetchEnabled = // if we don't have an action path, we can't prefetch anything.
!!router && isNavigatingForm && prefetch === null;
const observeFormVisibilityOnMount = (0, _react.useCallback)((element)=>{
if (isPrefetchEnabled && router !== null) {
(0, _links.mountFormInstance)(element, actionProp, router, // We default to PPR. We'll discover whether or not the route supports it with the initial prefetch.
_types.FetchStrategy.PPR);
}
return ()=>{
(0, _links.unmountPrefetchableInstance)(element);
};
}, [
isPrefetchEnabled,
actionProp,
router
]);
const mergedRef = (0, _usemergedref.useMergedRef)(observeFormVisibilityOnMount, externalRef ?? null);
if (!isNavigatingForm) {
return /*#__PURE__*/ (0, _jsxruntime.jsx)("form", {
...props,
ref: mergedRef
});
}
const actionHref = (0, _addbasepath.addBasePath)(actionProp);
return /*#__PURE__*/ (0, _jsxruntime.jsx)("form", {
...props,
ref: mergedRef,
action: actionHref,
onSubmit: (event)=>onFormSubmit(event, {
router,
actionHref,
replace,
scroll,
onSubmit: props.onSubmit
})
});
}
function onFormSubmit(event, { actionHref, onSubmit, replace, scroll, router }) {
if (typeof onSubmit === 'function') {
onSubmit(event);
// if the user called event.preventDefault(), do nothing.
// (this matches what Link does for `onClick`)
if (event.defaultPrevented) {
return;
}
}
if (!router) {
// Form was somehow used outside of the router (but not in pages, the implementation is forked!).
// We can't perform a soft navigation, so let the native submit handling do its thing.
return;
}
const formElement = event.currentTarget;
const submitter = event.nativeEvent.submitter;
let action = actionHref;
if (submitter) {
if (process.env.NODE_ENV === 'development') {
// the way server actions are encoded (e.g. `formMethod="post")
// causes some unnecessary dev-mode warnings from `hasUnsupportedSubmitterAttributes`.
// we'd bail out anyway, but we just do it silently.
if (hasReactServerActionAttributes(submitter)) {
return;
}
}
if ((0, _formshared.hasUnsupportedSubmitterAttributes)(submitter)) {
return;
}
// client actions have `formAction="javascript:..."`. We obviously can't prefetch/navigate to that.
if ((0, _formshared.hasReactClientActionAttributes)(submitter)) {
return;
}
// If the submitter specified an alternate formAction,
// use that URL instead -- this is what a native form would do.
// NOTE: `submitter.formAction` is unreliable, because it will give us `location.href` if it *wasn't* set
// NOTE: this should not have `basePath` added, because we can't add it before hydration
const submitterFormAction = submitter.getAttribute('formAction');
if (submitterFormAction !== null) {
if (process.env.NODE_ENV === 'development') {
(0, _formshared.checkFormActionUrl)(submitterFormAction, 'formAction');
}
action = submitterFormAction;
}
}
const targetUrl = (0, _formshared.createFormSubmitDestinationUrl)(action, formElement);
// Finally, no more reasons for bailing out.
event.preventDefault();
const method = replace ? 'replace' : 'push';
const targetHref = targetUrl.href;
router[method](targetHref, {
scroll
});
}
function hasReactServerActionAttributes(submitter) {
// https://github.com/facebook/react/blob/942eb80381b96f8410eab1bef1c539bed1ab0eb1/packages/react-client/src/ReactFlightReplyClient.js#L931-L934
const name = submitter.getAttribute('name');
return name && (name.startsWith('$ACTION_ID_') || name.startsWith('$ACTION_REF_'));
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=form.js.map
File diff suppressed because one or more lines are too long
+205
View File
@@ -0,0 +1,205 @@
import React from 'react';
import type { UrlObject } from 'url';
type Url = string | UrlObject;
type OnNavigateEventHandler = (event: {
preventDefault: () => void;
}) => void;
type InternalLinkProps = {
/**
* **Required**. The path or URL to navigate to. It can also be an object (similar to `URL`).
*
* @example
* ```tsx
* // Navigate to /dashboard:
* <Link href="/dashboard">Dashboard</Link>
*
* // Navigate to /about?name=test:
* <Link href={{ pathname: '/about', query: { name: 'test' } }}>
* About
* </Link>
* ```
*
* @remarks
* - For external URLs, use a fully qualified URL such as `https://...`.
* - In the App Router, dynamic routes must not include bracketed segments in `href`.
*/
href: Url;
/**
* @deprecated v10.0.0: `href` props pointing to a dynamic route are
* automatically resolved and no longer require the `as` prop.
*/
as?: Url;
/**
* Replace the current `history` state instead of adding a new URL into the stack.
*
* @defaultValue `false`
*
* @example
* ```tsx
* <Link href="/about" replace>
* About (replaces the history state)
* </Link>
* ```
*/
replace?: boolean;
/**
* Whether to override the default scroll behavior. If `true`, Next.js attempts to maintain
* the scroll position if the newly navigated page is still visible. If not, it scrolls to the top.
*
* If `false`, Next.js will not modify the scroll behavior at all.
*
* @defaultValue `true`
*
* @example
* ```tsx
* <Link href="/dashboard" scroll={false}>
* No auto scroll
* </Link>
* ```
*/
scroll?: boolean;
/**
* Update the path of the current page without rerunning data fetching methods
* like `getStaticProps`, `getServerSideProps`, or `getInitialProps`.
*
* @remarks
* `shallow` only applies to the Pages Router. For the App Router, see the
* [following documentation](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#using-the-native-history-api).
*
* @defaultValue `false`
*
* @example
* ```tsx
* <Link href="/blog" shallow>
* Shallow navigation
* </Link>
* ```
*/
shallow?: boolean;
/**
* Forces `Link` to pass its `href` to the child component. Useful if the child is a custom
* component that wraps an `<a>` tag, or if you're using certain styling libraries.
*
* @defaultValue `false`
*
* @example
* ```tsx
* <Link href="/dashboard" passHref legacyBehavior>
* <MyStyledAnchor>Dashboard</MyStyledAnchor>
* </Link>
* ```
*/
passHref?: boolean;
/**
* Prefetch the page in the background.
* Any `<Link />` that is in the viewport (initially or through scroll) will be prefetched.
* Prefetch can be disabled by passing `prefetch={false}`.
*
* @remarks
* Prefetching is only enabled in production.
*
* - In the **App Router**:
* - `"auto"`, `null`, `undefined` (default): Prefetch behavior depends on static vs dynamic routes:
* - Static routes: fully prefetched
* - Dynamic routes: partial prefetch to the nearest segment with a `loading.js`
* - `true`: Always prefetch the full route and data.
* - `false`: Disable prefetching on both viewport and hover.
* - In the **Pages Router**:
* - `true` (default): Prefetches the route and data in the background on viewport or hover.
* - `false`: Prefetch only on hover, not on viewport.
*
* @defaultValue `true` (Pages Router) or `null` (App Router)
*
* @example
* ```tsx
* <Link href="/dashboard" prefetch={false}>
* Dashboard
* </Link>
* ```
*/
prefetch?: boolean | 'auto' | null;
/**
* (unstable) Switch to a full prefetch on hover. Effectively the same as
* updating the prefetch prop to `true` in a mouse event.
*/
unstable_dynamicOnHover?: boolean;
/**
* The active locale is automatically prepended in the Pages Router. `locale` allows for providing
* a different locale, or can be set to `false` to opt out of automatic locale behavior.
*
* @remarks
* Note: locale only applies in the Pages Router and is ignored in the App Router.
*
* @example
* ```tsx
* // Use the 'fr' locale:
* <Link href="/about" locale="fr">
* About (French)
* </Link>
*
* // Disable locale prefix:
* <Link href="/about" locale={false}>
* About (no locale prefix)
* </Link>
* ```
*/
locale?: string | false;
/**
* Enable legacy link behavior.
*
* @deprecated This will be removed in a future version
* @defaultValue `false`
* @see https://github.com/vercel/next.js/commit/489e65ed98544e69b0afd7e0cfc3f9f6c2b803b7
*/
legacyBehavior?: boolean;
/**
* Optional event handler for when the mouse pointer is moved onto the `<Link>`.
*/
onMouseEnter?: React.MouseEventHandler<HTMLAnchorElement>;
/**
* Optional event handler for when the `<Link>` is touched.
*/
onTouchStart?: React.TouchEventHandler<HTMLAnchorElement>;
/**
* Optional event handler for when the `<Link>` is clicked.
*/
onClick?: React.MouseEventHandler<HTMLAnchorElement>;
/**
* Optional event handler for when the `<Link>` is navigated.
*/
onNavigate?: OnNavigateEventHandler;
/**
* Transition types to apply when navigating. These types are passed to
* [`React.addTransitionType`](https://react.dev/reference/react/addTransitionType)
* inside the navigation transition, enabling
* [`<ViewTransition>`](https://react.dev/reference/react/ViewTransition) components
* to apply different animations based on the type of navigation.
*
* @example
* ```tsx
* <Link href="/about" transitionTypes={['slide-in']}>About</Link>
* ```
*/
transitionTypes?: string[];
};
export type LinkProps<RouteInferType = any> = InternalLinkProps;
/**
* A React component that extends the HTML `<a>` element to provide
* [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
* and client-side navigation. This is the primary way to navigate between routes in Next.js.
*
* @remarks
* - Prefetching is only enabled in production.
*
* @see https://nextjs.org/docs/app/api-reference/components/link
*/
export default function LinkComponent(props: LinkProps & {
children: React.ReactNode;
ref: React.Ref<HTMLAnchorElement>;
}): import("react/jsx-runtime").JSX.Element;
export declare const useLinkStatus: () => {
pending: boolean;
} | {
pending: boolean;
};
export {};
+408
View File
@@ -0,0 +1,408 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
0 && (module.exports = {
default: null,
useLinkStatus: null
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
/**
* A React component that extends the HTML `<a>` element to provide
* [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
* and client-side navigation. This is the primary way to navigate between routes in Next.js.
*
* @remarks
* - Prefetching is only enabled in production.
*
* @see https://nextjs.org/docs/app/api-reference/components/link
*/ default: function() {
return LinkComponent;
},
useLinkStatus: function() {
return useLinkStatus;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _jsxruntime = require("react/jsx-runtime");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _formaturl = require("../../shared/lib/router/utils/format-url");
const _approutercontextsharedruntime = require("../../shared/lib/app-router-context.shared-runtime");
const _usemergedref = require("../use-merged-ref");
const _utils = require("../../shared/lib/utils");
const _addbasepath = require("../add-base-path");
const _warnonce = require("../../shared/lib/utils/warn-once");
const _routerreducertypes = require("../components/router-reducer/router-reducer-types");
const _links = require("../components/links");
const _islocalurl = require("../../shared/lib/router/utils/is-local-url");
const _types = require("../components/segment-cache/types");
const _erroronce = require("../../shared/lib/utils/error-once");
function isModifiedEvent(event) {
const eventTarget = event.currentTarget;
const target = eventTarget.getAttribute('target');
return target && target !== '_self' || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || // triggers resource download
event.nativeEvent && event.nativeEvent.which === 2;
}
function linkClicked(e, href, linkInstanceRef, replace, scroll, onNavigate, transitionTypes) {
if (typeof window !== 'undefined') {
const { nodeName } = e.currentTarget;
// anchors inside an svg have a lowercase nodeName
const isAnchorNodeName = nodeName.toUpperCase() === 'A';
if (isAnchorNodeName && isModifiedEvent(e) || e.currentTarget.hasAttribute('download')) {
// ignore click for browsers default behavior
return;
}
if (!(0, _islocalurl.isLocalURL)(href)) {
if (replace) {
// browser default behavior does not replace the history state
// so we need to do it manually
e.preventDefault();
location.replace(href);
}
// ignore click for browsers default behavior
return;
}
e.preventDefault();
if (onNavigate) {
let isDefaultPrevented = false;
onNavigate({
preventDefault: ()=>{
isDefaultPrevented = true;
}
});
if (isDefaultPrevented) {
return;
}
}
const { dispatchNavigateAction } = require('../components/app-router-instance');
_react.default.startTransition(()=>{
dispatchNavigateAction(href, replace ? 'replace' : 'push', scroll === false ? _routerreducertypes.ScrollBehavior.NoScroll : _routerreducertypes.ScrollBehavior.Default, linkInstanceRef.current, transitionTypes);
});
}
}
function formatStringOrUrl(urlObjOrString) {
if (typeof urlObjOrString === 'string') {
return urlObjOrString;
}
return (0, _formaturl.formatUrl)(urlObjOrString);
}
function LinkComponent(props) {
const [linkStatus, setOptimisticLinkStatus] = (0, _react.useOptimistic)(_links.IDLE_LINK_STATUS);
let children;
const linkInstanceRef = (0, _react.useRef)(null);
const { href: hrefProp, as: asProp, children: childrenProp, prefetch: prefetchProp = null, passHref, replace, shallow, scroll, onClick, onMouseEnter: onMouseEnterProp, onTouchStart: onTouchStartProp, legacyBehavior = false, onNavigate, transitionTypes, ref: forwardedRef, unstable_dynamicOnHover, ...restProps } = props;
children = childrenProp;
if (legacyBehavior && (typeof children === 'string' || typeof children === 'number')) {
children = /*#__PURE__*/ (0, _jsxruntime.jsx)("a", {
children: children
});
}
const router = _react.default.useContext(_approutercontextsharedruntime.AppRouterContext);
const prefetchEnabled = prefetchProp !== false;
const fetchStrategy = prefetchProp !== false ? getFetchStrategyFromPrefetchProp(prefetchProp) : _types.FetchStrategy.PPR;
if (process.env.NODE_ENV !== 'production') {
function createPropError(args) {
return Object.defineProperty(new Error(`Failed prop type: The prop \`${args.key}\` expects a ${args.expected} in \`<Link>\`, but got \`${args.actual}\` instead.` + (typeof window !== 'undefined' ? "\nOpen your browser's console to view the Component stack trace." : '')), "__NEXT_ERROR_CODE", {
value: "E319",
enumerable: false,
configurable: true
});
}
// TypeScript trick for type-guarding:
const requiredPropsGuard = {
href: true
};
const requiredProps = Object.keys(requiredPropsGuard);
requiredProps.forEach((key)=>{
if (key === 'href') {
if (props[key] == null || typeof props[key] !== 'string' && typeof props[key] !== 'object') {
throw createPropError({
key,
expected: '`string` or `object`',
actual: props[key] === null ? 'null' : typeof props[key]
});
}
} else {
// TypeScript trick for type-guarding:
const _ = key;
}
});
// TypeScript trick for type-guarding:
const optionalPropsGuard = {
as: true,
replace: true,
scroll: true,
shallow: true,
passHref: true,
prefetch: true,
unstable_dynamicOnHover: true,
onClick: true,
onMouseEnter: true,
onTouchStart: true,
legacyBehavior: true,
onNavigate: true,
transitionTypes: true
};
const optionalProps = Object.keys(optionalPropsGuard);
optionalProps.forEach((key)=>{
const valType = typeof props[key];
if (key === 'as') {
if (props[key] && valType !== 'string' && valType !== 'object') {
throw createPropError({
key,
expected: '`string` or `object`',
actual: valType
});
}
} else if (key === 'onClick' || key === 'onMouseEnter' || key === 'onTouchStart' || key === 'onNavigate') {
if (props[key] && valType !== 'function') {
throw createPropError({
key,
expected: '`function`',
actual: valType
});
}
} else if (key === 'replace' || key === 'scroll' || key === 'shallow' || key === 'passHref' || key === 'legacyBehavior' || key === 'unstable_dynamicOnHover') {
if (props[key] != null && valType !== 'boolean') {
throw createPropError({
key,
expected: '`boolean`',
actual: valType
});
}
} else if (key === 'prefetch') {
if (props[key] != null && valType !== 'boolean' && props[key] !== 'auto') {
throw createPropError({
key,
expected: '`boolean | "auto"`',
actual: valType
});
}
} else if (key === 'transitionTypes') {
if (props[key] != null && !Array.isArray(props[key])) {
throw createPropError({
key,
expected: '`string[]`',
actual: valType
});
}
} else {
// TypeScript trick for type-guarding:
const _ = key;
}
});
}
const resolvedHref = asProp || hrefProp;
const formattedHref = formatStringOrUrl(resolvedHref);
if (process.env.NODE_ENV !== 'production') {
if (props.locale) {
(0, _warnonce.warnOnce)('The `locale` prop is not supported in `next/link` while using the `app` router. Read more about app router internalization: https://nextjs.org/docs/app/building-your-application/routing/internationalization');
}
if (!asProp) {
let href;
if (typeof resolvedHref === 'string') {
href = resolvedHref;
} else if (typeof resolvedHref === 'object' && typeof resolvedHref.pathname === 'string') {
href = resolvedHref.pathname;
}
if (href) {
const hasDynamicSegment = href.split('/').some((segment)=>segment.startsWith('[') && segment.endsWith(']'));
if (hasDynamicSegment) {
throw Object.defineProperty(new Error(`Dynamic href \`${href}\` found in <Link> while using the \`/app\` router, this is not supported. Read more: https://nextjs.org/docs/messages/app-dir-dynamic-href`), "__NEXT_ERROR_CODE", {
value: "E267",
enumerable: false,
configurable: true
});
}
}
}
}
// This will return the first child, if multiple are provided it will throw an error
let child;
if (legacyBehavior) {
if (children?.$$typeof === Symbol.for('react.lazy')) {
throw Object.defineProperty(new Error(`\`<Link legacyBehavior>\` received a direct child that is either a Server Component, or JSX that was loaded with React.lazy(). This is not supported. Either remove legacyBehavior, or make the direct child a Client Component that renders the Link's \`<a>\` tag.`), "__NEXT_ERROR_CODE", {
value: "E863",
enumerable: false,
configurable: true
});
}
if (process.env.NODE_ENV === 'development') {
if (onClick) {
console.warn(`"onClick" was passed to <Link> with \`href\` of \`${formattedHref}\` but "legacyBehavior" was set. The legacy behavior requires onClick be set on the child of next/link`);
}
if (onMouseEnterProp) {
console.warn(`"onMouseEnter" was passed to <Link> with \`href\` of \`${formattedHref}\` but "legacyBehavior" was set. The legacy behavior requires onMouseEnter be set on the child of next/link`);
}
try {
child = _react.default.Children.only(children);
} catch (err) {
if (!children) {
throw Object.defineProperty(new Error(`No children were passed to <Link> with \`href\` of \`${formattedHref}\` but one child is required https://nextjs.org/docs/messages/link-no-children`), "__NEXT_ERROR_CODE", {
value: "E320",
enumerable: false,
configurable: true
});
}
throw Object.defineProperty(new Error(`Multiple children were passed to <Link> with \`href\` of \`${formattedHref}\` but only one child is supported https://nextjs.org/docs/messages/link-multiple-children` + (typeof window !== 'undefined' ? " \nOpen your browser's console to view the Component stack trace." : '')), "__NEXT_ERROR_CODE", {
value: "E266",
enumerable: false,
configurable: true
});
}
} else {
child = _react.default.Children.only(children);
}
} else {
if (process.env.NODE_ENV === 'development') {
if (children?.type === 'a') {
throw Object.defineProperty(new Error('Invalid <Link> with <a> child. Please remove <a> or use <Link legacyBehavior>.\nLearn more: https://nextjs.org/docs/messages/invalid-new-link-with-extra-anchor'), "__NEXT_ERROR_CODE", {
value: "E209",
enumerable: false,
configurable: true
});
}
}
}
const childRef = legacyBehavior ? child && typeof child === 'object' && child.ref : forwardedRef;
// Use a callback ref to attach an IntersectionObserver to the anchor tag on
// mount. In the future we will also use this to keep track of all the
// currently mounted <Link> instances, e.g. so we can re-prefetch them after
// a revalidation or refresh.
const observeLinkVisibilityOnMount = _react.default.useCallback((element)=>{
if (router !== null) {
linkInstanceRef.current = (0, _links.mountLinkInstance)(element, formattedHref, router, fetchStrategy, prefetchEnabled, setOptimisticLinkStatus);
}
return ()=>{
if (linkInstanceRef.current) {
(0, _links.unmountLinkForCurrentNavigation)(linkInstanceRef.current);
linkInstanceRef.current = null;
}
(0, _links.unmountPrefetchableInstance)(element);
};
}, [
prefetchEnabled,
formattedHref,
router,
fetchStrategy,
setOptimisticLinkStatus
]);
const mergedRef = (0, _usemergedref.useMergedRef)(observeLinkVisibilityOnMount, childRef);
const childProps = {
ref: mergedRef,
onClick (e) {
if (process.env.NODE_ENV !== 'production') {
if (!e) {
throw Object.defineProperty(new Error(`Component rendered inside next/link has to pass click event to "onClick" prop.`), "__NEXT_ERROR_CODE", {
value: "E312",
enumerable: false,
configurable: true
});
}
}
if (!legacyBehavior && typeof onClick === 'function') {
onClick(e);
}
if (legacyBehavior && child.props && typeof child.props.onClick === 'function') {
child.props.onClick(e);
}
if (!router) {
return;
}
if (e.defaultPrevented) {
return;
}
linkClicked(e, formattedHref, linkInstanceRef, replace, scroll, onNavigate, transitionTypes);
},
onMouseEnter (e) {
if (!legacyBehavior && typeof onMouseEnterProp === 'function') {
onMouseEnterProp(e);
}
if (legacyBehavior && child.props && typeof child.props.onMouseEnter === 'function') {
child.props.onMouseEnter(e);
}
if (!router) {
return;
}
if (!prefetchEnabled || process.env.NODE_ENV === 'development') {
return;
}
const upgradeToDynamicPrefetch = unstable_dynamicOnHover === true;
(0, _links.onNavigationIntent)(e.currentTarget, upgradeToDynamicPrefetch);
},
onTouchStart: process.env.__NEXT_LINK_NO_TOUCH_START ? undefined : function onTouchStart(e) {
if (!legacyBehavior && typeof onTouchStartProp === 'function') {
onTouchStartProp(e);
}
if (legacyBehavior && child.props && typeof child.props.onTouchStart === 'function') {
child.props.onTouchStart(e);
}
if (!router) {
return;
}
if (!prefetchEnabled) {
return;
}
const upgradeToDynamicPrefetch = unstable_dynamicOnHover === true;
(0, _links.onNavigationIntent)(e.currentTarget, upgradeToDynamicPrefetch);
}
};
// If the url is absolute, we can bypass the logic to prepend the basePath.
if ((0, _utils.isAbsoluteUrl)(formattedHref)) {
childProps.href = formattedHref;
} else if (!legacyBehavior || passHref || child.type === 'a' && !('href' in child.props)) {
childProps.href = (0, _addbasepath.addBasePath)(formattedHref);
}
let link;
if (legacyBehavior) {
if (process.env.NODE_ENV === 'development') {
(0, _erroronce.errorOnce)('`legacyBehavior` is deprecated and will be removed in a future ' + 'release. A codemod is available to upgrade your components:\n\n' + 'npx @next/codemod@latest new-link .\n\n' + 'Learn more: https://nextjs.org/docs/app/building-your-application/upgrading/codemods#remove-a-tags-from-link-components');
}
link = /*#__PURE__*/ _react.default.cloneElement(child, childProps);
} else {
link = /*#__PURE__*/ (0, _jsxruntime.jsx)("a", {
...restProps,
...childProps,
children: children
});
}
return /*#__PURE__*/ (0, _jsxruntime.jsx)(LinkStatusContext.Provider, {
value: linkStatus,
children: link
});
}
const LinkStatusContext = /*#__PURE__*/ (0, _react.createContext)(_links.IDLE_LINK_STATUS);
const useLinkStatus = ()=>{
return (0, _react.useContext)(LinkStatusContext);
};
function getFetchStrategyFromPrefetchProp(prefetchProp) {
if (process.env.__NEXT_CACHE_COMPONENTS) {
if (prefetchProp === true) {
return _types.FetchStrategy.Full;
}
// `null` or `"auto"`: this is the default "auto" mode, where we will prefetch partially if the link is in the viewport.
// This will also include invalid prop values that don't match the types specified here.
// (although those should've been filtered out by prop validation in dev)
prefetchProp;
return _types.FetchStrategy.PPR;
} else {
return prefetchProp === null || prefetchProp === 'auto' ? _types.FetchStrategy.PPR : // To preserve backwards-compatibility, anything other than `false`, `null`, or `"auto"` results in a full prefetch.
// (although invalid values should've been filtered out by prop validation in dev)
_types.FetchStrategy.Full;
}
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=link.js.map
File diff suppressed because one or more lines are too long
+4
View File
@@ -0,0 +1,4 @@
import type { ComponentProps } from 'react';
import ClientLinkComponent, { type LinkProps, useLinkStatus } from './link';
export default function LinkComponent(props: ComponentProps<typeof ClientLinkComponent>): import("react/jsx-runtime").JSX.Element;
export { type LinkProps, useLinkStatus };
+48
View File
@@ -0,0 +1,48 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
0 && (module.exports = {
default: null,
useLinkStatus: null
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
default: function() {
return LinkComponent;
},
useLinkStatus: function() {
return _link.useLinkStatus;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _jsxruntime = require("react/jsx-runtime");
const _link = /*#__PURE__*/ _interop_require_wildcard._(require("./link"));
function LinkComponent(props) {
const isLegacyBehavior = props.legacyBehavior;
const childIsHostComponent = typeof props.children === 'string' || typeof props.children === 'number' || typeof props.children?.type === 'string';
const childIsClientComponent = props.children?.type?.$$typeof === Symbol.for('react.client.reference');
if (isLegacyBehavior && !childIsHostComponent && !childIsClientComponent) {
if (props.children?.type?.$$typeof === Symbol.for('react.lazy')) {
console.error(`Using a Lazy Component as a direct child of \`<Link legacyBehavior>\` from a Server Component is not supported. If you need legacyBehavior, wrap your Lazy Component in a Client Component that renders the Link's \`<a>\` tag.`);
} else {
console.error(`Using a Server Component as a direct child of \`<Link legacyBehavior>\` is not supported. If you need legacyBehavior, wrap your Server Component in a Client Component that renders the Link's \`<a>\` tag.`);
}
}
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_link.default, {
...props
});
}
if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
Object.defineProperty(exports.default, '__esModule', { value: true });
Object.assign(exports.default, exports);
module.exports = exports.default;
}
//# sourceMappingURL=link.react-server.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../../../src/client/app-dir/link.react-server.tsx"],"sourcesContent":["import type { ComponentProps } from 'react'\nimport ClientLinkComponent, { type LinkProps, useLinkStatus } from './link'\n\nexport default function LinkComponent(\n props: ComponentProps<typeof ClientLinkComponent>\n) {\n const isLegacyBehavior = props.legacyBehavior\n const childIsHostComponent =\n typeof props.children === 'string' ||\n typeof props.children === 'number' ||\n typeof (props.children as any)?.type === 'string'\n const childIsClientComponent =\n (props.children as any)?.type?.$$typeof ===\n Symbol.for('react.client.reference')\n\n if (isLegacyBehavior && !childIsHostComponent && !childIsClientComponent) {\n if ((props.children as any)?.type?.$$typeof === Symbol.for('react.lazy')) {\n console.error(\n `Using a Lazy Component as a direct child of \\`<Link legacyBehavior>\\` from a Server Component is not supported. If you need legacyBehavior, wrap your Lazy Component in a Client Component that renders the Link's \\`<a>\\` tag.`\n )\n } else {\n console.error(\n `Using a Server Component as a direct child of \\`<Link legacyBehavior>\\` is not supported. If you need legacyBehavior, wrap your Server Component in a Client Component that renders the Link's \\`<a>\\` tag.`\n )\n }\n }\n\n return <ClientLinkComponent {...props} />\n}\n\nexport { type LinkProps, useLinkStatus }\n"],"names":["LinkComponent","useLinkStatus","props","isLegacyBehavior","legacyBehavior","childIsHostComponent","children","type","childIsClientComponent","$$typeof","Symbol","for","console","error","ClientLinkComponent"],"mappings":";;;;;;;;;;;;;;;IAGA,OAyBC;eAzBuBA;;IA2BCC,aAAa;eAAbA,mBAAa;;;;;gEA7B6B;AAEpD,SAASD,cACtBE,KAAiD;IAEjD,MAAMC,mBAAmBD,MAAME,cAAc;IAC7C,MAAMC,uBACJ,OAAOH,MAAMI,QAAQ,KAAK,YAC1B,OAAOJ,MAAMI,QAAQ,KAAK,YAC1B,OAAQJ,MAAMI,QAAQ,EAAUC,SAAS;IAC3C,MAAMC,yBACJ,AAACN,MAAMI,QAAQ,EAAUC,MAAME,aAC/BC,OAAOC,GAAG,CAAC;IAEb,IAAIR,oBAAoB,CAACE,wBAAwB,CAACG,wBAAwB;QACxE,IAAI,AAACN,MAAMI,QAAQ,EAAUC,MAAME,aAAaC,OAAOC,GAAG,CAAC,eAAe;YACxEC,QAAQC,KAAK,CACX,CAAC,+NAA+N,CAAC;QAErO,OAAO;YACLD,QAAQC,KAAK,CACX,CAAC,2MAA2M,CAAC;QAEjN;IACF;IAEA,qBAAO,qBAACC,aAAmB;QAAE,GAAGZ,KAAK;;AACvC","ignoreList":[0]}