@ndla/safelink 5.1.15 → 6.0.0-alpha.0

package/dist/panda.buildinfo.json

@@ -0,0 +1,7 @@
+{
+  "schemaVersion": "0.42.0",
+  "styles": {
+    "atomic": [],
+    "recipes": {}
+  }
+}

package/es/MissingRouterContext.js

@@ -7,5 +7,4 @@
  */
 
 import { createContext } from "react";
-const MissingRouterContext = /*#__PURE__*/createContext(false);
-export default MissingRouterContext;
+export const MissingRouterContext = /*#__PURE__*/createContext(false);

package/es/SafeLink.js

@@ -1,4 +1,3 @@
-import _styled from "@emotion/styled/base";
 /**
  * Copyright (c) 2019-present, NDLA.
  *
@@ -9,20 +8,19 @@ import _styled from "@emotion/styled/base";
 
 import { forwardRef, useContext } from "react";
 import { Link } from "react-router-dom";
-import { spacing } from "@ndla/core";
-import { Launch } from "@ndla/icons/common";
-import MissingRouterContext from "./MissingRouterContext";
-import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { styled } from "@ndla/styled-system/jsx";
+import { MissingRouterContext } from "./MissingRouterContext";
+import { jsx as _jsx } from "react/jsx-runtime";
 const oldNdlaRegex = /(.*)\/?node\/(\d+).*/;
 const isExternalLink = to => typeof to === "string" && (to.startsWith("https://") || to.startsWith("http://") || to.startsWith("mailto:") || to.endsWith(".xml"));
 export const isOldNdlaLink = to => typeof to === "string" && to.match(oldNdlaRegex) !== null;
-const LaunchIcon = /*#__PURE__*/_styled(Launch, {
-  target: "e2rl38a0",
-  label: "LaunchIcon"
-})("margin-left:", spacing.xsmall, ";vertical-align:text-top;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNhZmVMaW5rLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1QmlDIiwiZmlsZSI6IlNhZmVMaW5rLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDE5LXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IHsgZm9yd2FyZFJlZiwgSFRNTEF0dHJpYnV0ZXMsIE11dGFibGVSZWZPYmplY3QsIFJlYWN0Tm9kZSwgdXNlQ29udGV4dCB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgTGluaywgTGlua1Byb3BzIH0gZnJvbSBcInJlYWN0LXJvdXRlci1kb21cIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgc3BhY2luZyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5pbXBvcnQgeyBMYXVuY2ggfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5pbXBvcnQgTWlzc2luZ1JvdXRlckNvbnRleHQgZnJvbSBcIi4vTWlzc2luZ1JvdXRlckNvbnRleHRcIjtcblxuY29uc3Qgb2xkTmRsYVJlZ2V4ID0gLyguKilcXC8/bm9kZVxcLyhcXGQrKS4qLztcblxuY29uc3QgaXNFeHRlcm5hbExpbmsgPSAodG8/OiBMaW5rUHJvcHNbXCJ0b1wiXSkgPT5cbiAgdHlwZW9mIHRvID09PSBcInN0cmluZ1wiICYmXG4gICh0by5zdGFydHNXaXRoKFwiaHR0cHM6Ly9cIikgfHwgdG8uc3RhcnRzV2l0aChcImh0dHA6Ly9cIikgfHwgdG8uc3RhcnRzV2l0aChcIm1haWx0bzpcIikgfHwgdG8uZW5kc1dpdGgoXCIueG1sXCIpKTtcblxuZXhwb3J0IGNvbnN0IGlzT2xkTmRsYUxpbmsgPSAodG8/OiBMaW5rUHJvcHNbXCJ0b1wiXSkgPT4gdHlwZW9mIHRvID09PSBcInN0cmluZ1wiICYmIHRvLm1hdGNoKG9sZE5kbGFSZWdleCkgIT09IG51bGw7XG5cbmNvbnN0IExhdW5jaEljb24gPSBzdHlsZWQoTGF1bmNoKWBcbiAgbWFyZ2luLWxlZnQ6ICR7c3BhY2luZy54c21hbGx9O1xuICB2ZXJ0aWNhbC1hbGlnbjogdGV4dC10b3A7XG5gO1xuXG50eXBlIFByb3BzID0ge1xuICBzaG93TmV3V2luZG93SWNvbj86IGJvb2xlYW47XG4gIHJlZj86IE11dGFibGVSZWZPYmplY3Q8SFRNTEFuY2hvckVsZW1lbnQgfCBudWxsPjtcbiAgYXNBbmNob3I/OiBib29sZWFuO1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZTtcbiAgZGlzYWJsZWQ/OiBib29sZWFuO1xufTtcblxuZXhwb3J0IHR5cGUgU2FmZUxpbmtQcm9wcyA9IFByb3BzICYgTGlua1Byb3BzICYgSFRNTEF0dHJpYnV0ZXM8SFRNTEVsZW1lbnQ+O1xuXG4vLyBGYWxsYmFjayB0byBub3JtYWwgbGluayBpZiBhcHAgaXMgbWlzc2luZyBSb3V0ZXJDb250ZXh0LCBsaW5rIGlzIGV4dGVybmFsIG9yIGlzIG9sZCBuZGxhIGxpbmtcblxuY29uc3QgU2FmZUxpbmsgPSBmb3J3YXJkUmVmPEhUTUxBbmNob3JFbGVtZW50LCBTYWZlTGlua1Byb3BzPihcbiAgKHsgdG8sIHJlcGxhY2UsIGRpc2FibGVkLCBjaGlsZHJlbiwgc2hvd05ld1dpbmRvd0ljb24sIHRhYkluZGV4LCBhc0FuY2hvciwgLi4ucmVzdCB9LCByZWYpID0+IHtcbiAgICBjb25zdCBpc01pc3NpbmdSb3V0ZXJDb250ZXh0ID0gdXNlQ29udGV4dChNaXNzaW5nUm91dGVyQ29udGV4dCk7XG5cbiAgICBpZiAoaXNNaXNzaW5nUm91dGVyQ29udGV4dCB8fCBpc0V4dGVybmFsTGluayh0bykgfHwgaXNPbGROZGxhTGluayh0bykgfHwgYXNBbmNob3IgfHwgZGlzYWJsZWQpIHtcbiAgICAgIGNvbnN0IGhyZWYgPSB0eXBlb2YgdG8gPT09IFwic3RyaW5nXCIgPyB0byA6IFwiI1wiO1xuICAgICAgcmV0dXJuIChcbiAgICAgICAgPGFcbiAgICAgICAgICBocmVmPXtkaXNhYmxlZCA/IHVuZGVmaW5lZCA6IGhyZWZ9XG4gICAgICAgICAgcm9sZT17ZGlzYWJsZWQgPyBcImxpbmtcIiA6IHVuZGVmaW5lZH1cbiAgICAgICAgICBhcmlhLWRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgICByZWY9e3JlZn1cbiAgICAgICAgICB0YWJJbmRleD17dGFiSW5kZXh9XG4gICAgICAgICAgey4uLnJlc3R9XG4gICAgICAgID5cbiAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgICAge3Nob3dOZXdXaW5kb3dJY29uICYmIDxMYXVuY2hJY29uIHNpemU9XCJtZWRpdW1cIiAvPn1cbiAgICAgICAgPC9hPlxuICAgICAgKTtcbiAgICB9XG5cbiAgICByZXR1cm4gKFxuICAgICAgLy8gUlI2IGxpbmsgaW1tZWRpYXRlbHkgZmFpbHMgaWYgdG8gaXMgc29tZWhvdyB1bmRlZmluZWQsIHNvIHdlIHByb3ZpZGUgYW4gZW1wdHkgZmFsbGJhY2sgdG8gcmVjb3Zlci5cbiAgICAgIDxMaW5rIHJlZj17cmVmfSB0YWJJbmRleD17dGFiSW5kZXggPz8gMH0gdG89e3RvID8/IFwiXCJ9IHJlcGxhY2U9e3JlcGxhY2V9IHsuLi5yZXN0fT5cbiAgICAgICAge2NoaWxkcmVufVxuICAgICAgICB7c2hvd05ld1dpbmRvd0ljb24gJiYgPExhdW5jaEljb24gLz59XG4gICAgICA8L0xpbms+XG4gICAgKTtcbiAgfSxcbik7XG5cbmV4cG9ydCBkZWZhdWx0IFNhZmVMaW5rO1xuIl19 */"));
+const StyledLink = styled(Link, {}, {
+  baseComponent: true
+});
+
 // Fallback to normal link if app is missing RouterContext, link is external or is old ndla link
 
-const SafeLink = /*#__PURE__*/forwardRef((_ref, ref) => {
+export const SafeLink = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
     to,
     replace,
@@ -36,28 +34,26 @@ const SafeLink = /*#__PURE__*/forwardRef((_ref, ref) => {
   const isMissingRouterContext = useContext(MissingRouterContext);
   if (isMissingRouterContext || isExternalLink(to) || isOldNdlaLink(to) || asAnchor || disabled) {
     const href = typeof to === "string" ? to : "#";
-    return _jsxs("a", {
+    return /*#__PURE__*/_jsx(styled.a, {
       href: disabled ? undefined : href,
       role: disabled ? "link" : undefined,
       "aria-disabled": disabled,
       ref: ref,
       tabIndex: tabIndex,
       ...rest,
-      children: [children, showNewWindowIcon && _jsx(LaunchIcon, {
-        size: "medium"
-      })]
+      children: children
     });
   }
   return (
+    /*#__PURE__*/
     // RR6 link immediately fails if to is somehow undefined, so we provide an empty fallback to recover.
-    _jsxs(Link, {
+    _jsx(StyledLink, {
       ref: ref,
-      tabIndex: tabIndex !== null && tabIndex !== void 0 ? tabIndex : 0,
-      to: to !== null && to !== void 0 ? to : "",
+      tabIndex: tabIndex ?? 0,
+      to: to ?? "",
       replace: replace,
       ...rest,
-      children: [children, showNewWindowIcon && _jsx(LaunchIcon, {})]
+      children: children
     })
   );
-});
-export default SafeLink;
+});

package/es/SafeLinkButton.js

@@ -6,36 +6,25 @@
  *
  */
 
-/** @jsxImportSource @emotion/react */
 import { forwardRef } from "react";
-import { buttonStyleV2 } from "@ndla/button";
-import SafeLink from "./SafeLink";
-import { jsx as _jsx } from "@emotion/react/jsx-runtime";
-const SafeLinkButton = /*#__PURE__*/forwardRef((_ref, ref) => {
+import { buttonBaseRecipe, buttonRecipe } from "@ndla/primitives";
+import { css } from "@ndla/styled-system/css";
+import { SafeLink } from "./SafeLink";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const SafeLinkButton = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
-    children,
-    inverted,
-    to,
-    size,
-    colorTheme,
     variant,
-    shape,
-    fontWeight,
-    ...rest
+    size,
+    css: cssProp,
+    ...props
   } = _ref;
-  return _jsx(SafeLink, {
-    to: to,
-    ref: ref,
-    css: buttonStyleV2({
-      colorTheme,
-      size,
-      variant,
-      inverted,
-      shape,
-      fontWeight
-    }),
-    ...rest,
-    children: children
+  return /*#__PURE__*/_jsx(SafeLink, {
+    ...props,
+    css: css.raw(buttonBaseRecipe.raw({
+      variant
+    }), buttonRecipe.raw({
+      size
+    }), cssProp),
+    ref: ref
   });
-});
-export default SafeLinkButton;
+});

package/es/SafeLinkIconButton.js

@@ -6,30 +6,22 @@
  *
  */
 
-/** @jsxImportSource @emotion/react */
 import { forwardRef } from "react";
-import { iconButtonStyle } from "@ndla/button";
-import SafeLink from "./SafeLink";
-import { jsx as _jsx } from "@emotion/react/jsx-runtime";
-const SafeLinkIconButton = /*#__PURE__*/forwardRef((_ref, ref) => {
+import { buttonBaseRecipe, iconButtonRecipe } from "@ndla/primitives";
+import { css } from "@ndla/styled-system/css";
+import { SafeLink } from "./SafeLink";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const SafeLinkIconButton = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
-    inverted,
-    size,
-    colorTheme,
     variant,
-    fontWeight,
-    ...rest
+    css: cssProp,
+    ...props
   } = _ref;
-  return _jsx(SafeLink, {
-    css: iconButtonStyle({
-      colorTheme,
-      size,
-      variant,
-      inverted,
-      fontWeight
-    }),
-    ...rest,
+  return /*#__PURE__*/_jsx(SafeLink, {
+    ...props,
+    css: css.raw(buttonBaseRecipe.raw({
+      variant
+    }), iconButtonRecipe.raw(), cssProp),
     ref: ref
   });
-});
-export default SafeLinkIconButton;
+});

package/es/index.js

@@ -6,7 +6,7 @@
  *
  */
 
-export { default as MissingRouterContext } from "./MissingRouterContext";
-export { default as SafeLinkButton } from "./SafeLinkButton";
-export { default as SafeLinkIconButton } from "./SafeLinkIconButton";
-export { default as SafeLink } from "./SafeLink";
+export { MissingRouterContext } from "./MissingRouterContext";
+export { SafeLinkButton } from "./SafeLinkButton";
+export { SafeLinkIconButton } from "./SafeLinkIconButton";
+export { SafeLink } from "./SafeLink";

package/lib/MissingRouterContext.d.ts

@@ -6,5 +6,4 @@
  *
  */
 /// <reference types="react" />
-declare const MissingRouterContext: import("react").Context<boolean>;
-export default MissingRouterContext;
+export declare const MissingRouterContext: import("react").Context<boolean>;

package/lib/MissingRouterContext.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.MissingRouterContext = void 0;
 var _react = require("react");
 /**
  * Copyright (c) 2019-present, NDLA.
@@ -13,5 +13,4 @@ var _react = require("react");
  *
  */
 
-const MissingRouterContext = /*#__PURE__*/(0, _react.createContext)(false);
-var _default = exports.default = MissingRouterContext;
+const MissingRouterContext = exports.MissingRouterContext = /*#__PURE__*/(0, _react.createContext)(false);

package/lib/SafeLink.d.ts

@@ -7,6 +7,7 @@
  */
 import { HTMLAttributes, MutableRefObject, ReactNode } from "react";
 import { LinkProps } from "react-router-dom";
+import { JsxStyleProps } from "@ndla/styled-system/types";
 export declare const isOldNdlaLink: (to?: LinkProps["to"]) => boolean;
 type Props = {
     showNewWindowIcon?: boolean;
@@ -15,6 +16,6 @@ type Props = {
     children?: ReactNode;
     disabled?: boolean;
 };
-export type SafeLinkProps = Props & LinkProps & HTMLAttributes<HTMLElement>;
-declare const SafeLink: import("react").ForwardRefExoticComponent<Omit<SafeLinkProps, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
-export default SafeLink;
+export type SafeLinkProps = Props & LinkProps & JsxStyleProps & HTMLAttributes<HTMLElement>;
+export declare const SafeLink: import("react").ForwardRefExoticComponent<Omit<SafeLinkProps, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
+export {};

package/lib/SafeLink.js

@@ -3,15 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isOldNdlaLink = exports.default = void 0;
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
+exports.isOldNdlaLink = exports.SafeLink = void 0;
 var _react = require("react");
 var _reactRouterDom = require("react-router-dom");
-var _core = require("@ndla/core");
-var _common = require("@ndla/icons/common");
-var _MissingRouterContext = _interopRequireDefault(require("./MissingRouterContext"));
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _jsx2 = require("@ndla/styled-system/jsx");
+var _MissingRouterContext = require("./MissingRouterContext");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Copyright (c) 2019-present, NDLA.
  *
@@ -24,13 +21,13 @@ const oldNdlaRegex = /(.*)\/?node\/(\d+).*/;
 const isExternalLink = to => typeof to === "string" && (to.startsWith("https://") || to.startsWith("http://") || to.startsWith("mailto:") || to.endsWith(".xml"));
 const isOldNdlaLink = to => typeof to === "string" && to.match(oldNdlaRegex) !== null;
 exports.isOldNdlaLink = isOldNdlaLink;
-const LaunchIcon = /*#__PURE__*/(0, _base.default)(_common.Launch, {
-  target: "e2rl38a0",
-  label: "LaunchIcon"
-})("margin-left:", _core.spacing.xsmall, ";vertical-align:text-top;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNhZmVMaW5rLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1QmlDIiwiZmlsZSI6IlNhZmVMaW5rLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDE5LXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS5cbiAqXG4gKi9cblxuaW1wb3J0IHsgZm9yd2FyZFJlZiwgSFRNTEF0dHJpYnV0ZXMsIE11dGFibGVSZWZPYmplY3QsIFJlYWN0Tm9kZSwgdXNlQ29udGV4dCB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgTGluaywgTGlua1Byb3BzIH0gZnJvbSBcInJlYWN0LXJvdXRlci1kb21cIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgc3BhY2luZyB9IGZyb20gXCJAbmRsYS9jb3JlXCI7XG5pbXBvcnQgeyBMYXVuY2ggfSBmcm9tIFwiQG5kbGEvaWNvbnMvY29tbW9uXCI7XG5pbXBvcnQgTWlzc2luZ1JvdXRlckNvbnRleHQgZnJvbSBcIi4vTWlzc2luZ1JvdXRlckNvbnRleHRcIjtcblxuY29uc3Qgb2xkTmRsYVJlZ2V4ID0gLyguKilcXC8/bm9kZVxcLyhcXGQrKS4qLztcblxuY29uc3QgaXNFeHRlcm5hbExpbmsgPSAodG8/OiBMaW5rUHJvcHNbXCJ0b1wiXSkgPT5cbiAgdHlwZW9mIHRvID09PSBcInN0cmluZ1wiICYmXG4gICh0by5zdGFydHNXaXRoKFwiaHR0cHM6Ly9cIikgfHwgdG8uc3RhcnRzV2l0aChcImh0dHA6Ly9cIikgfHwgdG8uc3RhcnRzV2l0aChcIm1haWx0bzpcIikgfHwgdG8uZW5kc1dpdGgoXCIueG1sXCIpKTtcblxuZXhwb3J0IGNvbnN0IGlzT2xkTmRsYUxpbmsgPSAodG8/OiBMaW5rUHJvcHNbXCJ0b1wiXSkgPT4gdHlwZW9mIHRvID09PSBcInN0cmluZ1wiICYmIHRvLm1hdGNoKG9sZE5kbGFSZWdleCkgIT09IG51bGw7XG5cbmNvbnN0IExhdW5jaEljb24gPSBzdHlsZWQoTGF1bmNoKWBcbiAgbWFyZ2luLWxlZnQ6ICR7c3BhY2luZy54c21hbGx9O1xuICB2ZXJ0aWNhbC1hbGlnbjogdGV4dC10b3A7XG5gO1xuXG50eXBlIFByb3BzID0ge1xuICBzaG93TmV3V2luZG93SWNvbj86IGJvb2xlYW47XG4gIHJlZj86IE11dGFibGVSZWZPYmplY3Q8SFRNTEFuY2hvckVsZW1lbnQgfCBudWxsPjtcbiAgYXNBbmNob3I/OiBib29sZWFuO1xuICBjaGlsZHJlbj86IFJlYWN0Tm9kZTtcbiAgZGlzYWJsZWQ/OiBib29sZWFuO1xufTtcblxuZXhwb3J0IHR5cGUgU2FmZUxpbmtQcm9wcyA9IFByb3BzICYgTGlua1Byb3BzICYgSFRNTEF0dHJpYnV0ZXM8SFRNTEVsZW1lbnQ+O1xuXG4vLyBGYWxsYmFjayB0byBub3JtYWwgbGluayBpZiBhcHAgaXMgbWlzc2luZyBSb3V0ZXJDb250ZXh0LCBsaW5rIGlzIGV4dGVybmFsIG9yIGlzIG9sZCBuZGxhIGxpbmtcblxuY29uc3QgU2FmZUxpbmsgPSBmb3J3YXJkUmVmPEhUTUxBbmNob3JFbGVtZW50LCBTYWZlTGlua1Byb3BzPihcbiAgKHsgdG8sIHJlcGxhY2UsIGRpc2FibGVkLCBjaGlsZHJlbiwgc2hvd05ld1dpbmRvd0ljb24sIHRhYkluZGV4LCBhc0FuY2hvciwgLi4ucmVzdCB9LCByZWYpID0+IHtcbiAgICBjb25zdCBpc01pc3NpbmdSb3V0ZXJDb250ZXh0ID0gdXNlQ29udGV4dChNaXNzaW5nUm91dGVyQ29udGV4dCk7XG5cbiAgICBpZiAoaXNNaXNzaW5nUm91dGVyQ29udGV4dCB8fCBpc0V4dGVybmFsTGluayh0bykgfHwgaXNPbGROZGxhTGluayh0bykgfHwgYXNBbmNob3IgfHwgZGlzYWJsZWQpIHtcbiAgICAgIGNvbnN0IGhyZWYgPSB0eXBlb2YgdG8gPT09IFwic3RyaW5nXCIgPyB0byA6IFwiI1wiO1xuICAgICAgcmV0dXJuIChcbiAgICAgICAgPGFcbiAgICAgICAgICBocmVmPXtkaXNhYmxlZCA/IHVuZGVmaW5lZCA6IGhyZWZ9XG4gICAgICAgICAgcm9sZT17ZGlzYWJsZWQgPyBcImxpbmtcIiA6IHVuZGVmaW5lZH1cbiAgICAgICAgICBhcmlhLWRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgICByZWY9e3JlZn1cbiAgICAgICAgICB0YWJJbmRleD17dGFiSW5kZXh9XG4gICAgICAgICAgey4uLnJlc3R9XG4gICAgICAgID5cbiAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgICAge3Nob3dOZXdXaW5kb3dJY29uICYmIDxMYXVuY2hJY29uIHNpemU9XCJtZWRpdW1cIiAvPn1cbiAgICAgICAgPC9hPlxuICAgICAgKTtcbiAgICB9XG5cbiAgICByZXR1cm4gKFxuICAgICAgLy8gUlI2IGxpbmsgaW1tZWRpYXRlbHkgZmFpbHMgaWYgdG8gaXMgc29tZWhvdyB1bmRlZmluZWQsIHNvIHdlIHByb3ZpZGUgYW4gZW1wdHkgZmFsbGJhY2sgdG8gcmVjb3Zlci5cbiAgICAgIDxMaW5rIHJlZj17cmVmfSB0YWJJbmRleD17dGFiSW5kZXggPz8gMH0gdG89e3RvID8/IFwiXCJ9IHJlcGxhY2U9e3JlcGxhY2V9IHsuLi5yZXN0fT5cbiAgICAgICAge2NoaWxkcmVufVxuICAgICAgICB7c2hvd05ld1dpbmRvd0ljb24gJiYgPExhdW5jaEljb24gLz59XG4gICAgICA8L0xpbms+XG4gICAgKTtcbiAgfSxcbik7XG5cbmV4cG9ydCBkZWZhdWx0IFNhZmVMaW5rO1xuIl19 */"));
+const StyledLink = (0, _jsx2.styled)(_reactRouterDom.Link, {}, {
+  baseComponent: true
+});
+
 // Fallback to normal link if app is missing RouterContext, link is external or is old ndla link
 
-const SafeLink = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const SafeLink = exports.SafeLink = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     to,
     replace,
@@ -41,31 +38,29 @@ const SafeLink = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     asAnchor,
     ...rest
   } = _ref;
-  const isMissingRouterContext = (0, _react.useContext)(_MissingRouterContext.default);
+  const isMissingRouterContext = (0, _react.useContext)(_MissingRouterContext.MissingRouterContext);
   if (isMissingRouterContext || isExternalLink(to) || isOldNdlaLink(to) || asAnchor || disabled) {
     const href = typeof to === "string" ? to : "#";
-    return (0, _jsxRuntime.jsxs)("a", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsx2.styled.a, {
       href: disabled ? undefined : href,
       role: disabled ? "link" : undefined,
       "aria-disabled": disabled,
       ref: ref,
       tabIndex: tabIndex,
       ...rest,
-      children: [children, showNewWindowIcon && (0, _jsxRuntime.jsx)(LaunchIcon, {
-        size: "medium"
-      })]
+      children: children
     });
   }
   return (
+    /*#__PURE__*/
     // RR6 link immediately fails if to is somehow undefined, so we provide an empty fallback to recover.
-    (0, _jsxRuntime.jsxs)(_reactRouterDom.Link, {
+    (0, _jsxRuntime.jsx)(StyledLink, {
       ref: ref,
-      tabIndex: tabIndex !== null && tabIndex !== void 0 ? tabIndex : 0,
-      to: to !== null && to !== void 0 ? to : "",
+      tabIndex: tabIndex ?? 0,
+      to: to ?? "",
       replace: replace,
       ...rest,
-      children: [children, showNewWindowIcon && (0, _jsxRuntime.jsx)(LaunchIcon, {})]
+      children: children
     })
   );
-});
-var _default = exports.default = SafeLink;
+});

package/lib/SafeLinkButton.d.ts

@@ -5,14 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-/** @jsxImportSource @emotion/react */
 import { ReactNode } from "react";
-import { ButtonStyleProps } from "@ndla/button";
+import { ButtonVariantProps } from "@ndla/primitives";
 import { SafeLinkProps } from "./SafeLink";
-interface Props extends SafeLinkProps, ButtonStyleProps {
+export interface SafeLinkButtonProps extends SafeLinkProps, ButtonVariantProps {
     children: ReactNode;
     to: string;
-    className?: string;
 }
-declare const SafeLinkButton: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
-export default SafeLinkButton;
+export declare const SafeLinkButton: import("react").ForwardRefExoticComponent<Omit<SafeLinkButtonProps, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;

package/lib/SafeLinkButton.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.SafeLinkButton = void 0;
 var _react = require("react");
-var _button = require("@ndla/button");
-var _SafeLink = _interopRequireDefault(require("./SafeLink"));
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _primitives = require("@ndla/primitives");
+var _css = require("@ndla/styled-system/css");
+var _SafeLink = require("./SafeLink");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Copyright (c) 2019-present, NDLA.
  *
@@ -17,33 +17,20 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  *
  */
 
-/** @jsxImportSource @emotion/react */
-
-const SafeLinkButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const SafeLinkButton = exports.SafeLinkButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
-    children,
-    inverted,
-    to,
-    size,
-    colorTheme,
     variant,
-    shape,
-    fontWeight,
-    ...rest
+    size,
+    css: cssProp,
+    ...props
   } = _ref;
-  return (0, _jsxRuntime.jsx)(_SafeLink.default, {
-    to: to,
-    ref: ref,
-    css: (0, _button.buttonStyleV2)({
-      colorTheme,
-      size,
-      variant,
-      inverted,
-      shape,
-      fontWeight
-    }),
-    ...rest,
-    children: children
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SafeLink.SafeLink, {
+    ...props,
+    css: _css.css.raw(_primitives.buttonBaseRecipe.raw({
+      variant
+    }), _primitives.buttonRecipe.raw({
+      size
+    }), cssProp),
+    ref: ref
   });
-});
-var _default = exports.default = SafeLinkButton;
+});

package/lib/SafeLinkIconButton.d.ts

@@ -5,12 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-/** @jsxImportSource @emotion/react */
 import { ReactNode } from "react";
-import { ButtonStyleProps } from "@ndla/button";
+import { IconButtonVariantProps } from "@ndla/primitives";
 import { SafeLinkProps } from "./SafeLink";
-interface Props extends SafeLinkProps, ButtonStyleProps {
+export interface SafeLinkIconButtonProps extends SafeLinkProps, IconButtonVariantProps {
     children: ReactNode;
+    to: string;
 }
-declare const SafeLinkIconButton: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
-export default SafeLinkIconButton;
+export declare const SafeLinkIconButton: import("react").ForwardRefExoticComponent<Omit<SafeLinkIconButtonProps, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;

package/lib/SafeLinkIconButton.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.SafeLinkIconButton = void 0;
 var _react = require("react");
-var _button = require("@ndla/button");
-var _SafeLink = _interopRequireDefault(require("./SafeLink"));
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _primitives = require("@ndla/primitives");
+var _css = require("@ndla/styled-system/css");
+var _SafeLink = require("./SafeLink");
+var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Copyright (c) 2022-present, NDLA.
  *
@@ -17,27 +17,17 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  *
  */
 
-/** @jsxImportSource @emotion/react */
-
-const SafeLinkIconButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const SafeLinkIconButton = exports.SafeLinkIconButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
-    inverted,
-    size,
-    colorTheme,
     variant,
-    fontWeight,
-    ...rest
+    css: cssProp,
+    ...props
   } = _ref;
-  return (0, _jsxRuntime.jsx)(_SafeLink.default, {
-    css: (0, _button.iconButtonStyle)({
-      colorTheme,
-      size,
-      variant,
-      inverted,
-      fontWeight
-    }),
-    ...rest,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SafeLink.SafeLink, {
+    ...props,
+    css: _css.css.raw(_primitives.buttonBaseRecipe.raw({
+      variant
+    }), _primitives.iconButtonRecipe.raw(), cssProp),
     ref: ref
   });
-});
-var _default = exports.default = SafeLinkIconButton;
+});

package/lib/index.d.ts

@@ -5,8 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-export { default as MissingRouterContext } from "./MissingRouterContext";
-export { default as SafeLinkButton } from "./SafeLinkButton";
-export { default as SafeLinkIconButton } from "./SafeLinkIconButton";
-export { default as SafeLink } from "./SafeLink";
+export { MissingRouterContext } from "./MissingRouterContext";
+export { SafeLinkButton } from "./SafeLinkButton";
+export type { SafeLinkIconButtonProps } from "./SafeLinkIconButton";
+export { SafeLinkIconButton } from "./SafeLinkIconButton";
+export type { SafeLinkButtonProps } from "./SafeLinkButton";
+export { SafeLink } from "./SafeLink";
 export type { SafeLinkProps } from "./SafeLink";

package/lib/index.js

@@ -6,29 +6,28 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "MissingRouterContext", {
   enumerable: true,
   get: function () {
-    return _MissingRouterContext.default;
+    return _MissingRouterContext.MissingRouterContext;
   }
 });
 Object.defineProperty(exports, "SafeLink", {
   enumerable: true,
   get: function () {
-    return _SafeLink.default;
+    return _SafeLink.SafeLink;
   }
 });
 Object.defineProperty(exports, "SafeLinkButton", {
   enumerable: true,
   get: function () {
-    return _SafeLinkButton.default;
+    return _SafeLinkButton.SafeLinkButton;
   }
 });
 Object.defineProperty(exports, "SafeLinkIconButton", {
   enumerable: true,
   get: function () {
-    return _SafeLinkIconButton.default;
+    return _SafeLinkIconButton.SafeLinkIconButton;
   }
 });
-var _MissingRouterContext = _interopRequireDefault(require("./MissingRouterContext"));
-var _SafeLinkButton = _interopRequireDefault(require("./SafeLinkButton"));
-var _SafeLinkIconButton = _interopRequireDefault(require("./SafeLinkIconButton"));
-var _SafeLink = _interopRequireDefault(require("./SafeLink"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _MissingRouterContext = require("./MissingRouterContext");
+var _SafeLinkButton = require("./SafeLinkButton");
+var _SafeLinkIconButton = require("./SafeLinkIconButton");
+var _SafeLink = require("./SafeLink");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/safelink",
-  "version": "5.1.15",
+  "version": "6.0.0-alpha.0",
   "description": "SafeLink component for NDLA",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -9,7 +9,8 @@
   "scripts": {
     "build": "node ../../scripts/build.js package",
     "build:types": "tsc -p tsconfig.build.json",
-    "prepublish": "yarn build:types"
+    "build:panda": "mkdir -p dist && concurrently 'panda cssgen --minimal --outfile dist/styles.css' 'panda ship --outfile dist/panda.buildinfo.json'",
+    "prepublish": "concurrently 'yarn build:types' 'yarn build:panda'"
   },
   "repository": {
     "type": "git",
@@ -21,22 +22,25 @@
   ],
   "author": "ndla@knowit.no",
   "files": [
-    "scss",
+    "dist",
     "lib",
     "es"
   ],
   "dependencies": {
-    "@ndla/button": "^14.0.5-alpha.0",
-    "@ndla/icons": "^7.0.6-alpha.0"
+    "@ndla/primitives": "^0.0.17",
+    "@ndla/styled-system": "^0.0.8"
+  },
+  "devDependencies": {
+    "@ndla/preset-panda": "^0.0.10",
+    "@pandacss/dev": "^0.42.0"
   },
   "peerDependencies": {
-    "@emotion/react": "^11.10.4",
-    "@emotion/styled": "^11.10.4",
-    "react": ">= 16.8.0",
+    "react": ">= 18",
+    "react-dom": ">= 18",
     "react-router-dom": "^6.3.0"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "8c3254246b993068a867ab9ec9594347d5ebf439"
+  "gitHead": "93dde6fe4aaca52642f8fa0a27f4acad359207cb"
 }