@webstudio-is/sdk-components-react-remix 0.68.0

package/src/metas.ts

@@ -0,0 +1 @@
+export { meta as Form } from "./form.ws";

package/src/props.ts

@@ -0,0 +1 @@
+export { propsMeta as Form } from "./form.ws";

package/src/rich-text-link.tsx

@@ -0,0 +1,4 @@
+import { RichTextLink as BaseLink } from "@webstudio-is/react-sdk";
+import { wrapLinkComponent } from "./shared/remix-link";
+
+export const RichTextLink = wrapLinkComponent(BaseLink);

package/src/shared/remix-link.tsx

@@ -0,0 +1,30 @@
+import { forwardRef, type ComponentPropsWithoutRef } from "react";
+import { NavLink as RemixLink } from "@remix-run/react";
+import {
+  type Link,
+  usePropUrl,
+  getInstanceIdFromComponentProps,
+} from "@webstudio-is/react-sdk";
+
+type LinkComponent = typeof Link;
+type LinkProps = ComponentPropsWithoutRef<LinkComponent>;
+
+export const wrapLinkComponent = (BaseLink: LinkComponent) => {
+  const Component: LinkComponent = forwardRef((props: LinkProps, ref) => {
+    const href = usePropUrl(getInstanceIdFromComponentProps(props), "href");
+
+    if (href?.type === "page") {
+      let to = href.page.path === "" ? "/" : href.page.path;
+      if (href.hash !== undefined) {
+        to += `#${href.hash}`;
+      }
+      return <RemixLink {...props} to={to} ref={ref} />;
+    }
+
+    return <BaseLink {...props} ref={ref} />;
+  });
+
+  Component.displayName = BaseLink.displayName;
+
+  return Component;
+};