@vit-foundation/ui 0.17.0 → 0.18.0

package/dist/components/timeline/TimelineMilestone.svelte

@@ -30,6 +30,7 @@
 	import EditPanel from '../../edit/chrome/EditPanel.svelte';
 	import Editable from '../../edit/Editable.svelte';
 	import { MILESTONE_CATEGORY_COLOR, milestoneCategoryLabel } from '../../utils/milestones.js';
+	import { isExternalUrl } from '../../utils/paths.js';
 	import CardMedia from '../ui/CardMedia.svelte';
 	import DraftBadge from '../../edit/chrome/DraftBadge.svelte';
 	import DateText from '../ui/DateText.svelte';
@@ -96,7 +97,13 @@
 	 * predicate — they never route the value through Link, so nothing splices a
 	 * locale into it.
 	 */
-	const isExternal = $derived(/^(?:[a-z][a-z0-9+.-]*:)?\/\//i.test(milestone.linkUrl ?? ''));
+	// An ALLOW-LIST, not "does it look absolute". The predicate here used to be
+	// /^(?:[a-z][a-z0-9+.-]*:)?\/\//i — it asks for '//', so any scheme
+	// without one ('javascript:alert(1)') read as INTERNAL and went to Link,
+	// which handed it to the locale resolver and got it back unchanged. A
+	// destination that is neither a path nor an http(s) URL now renders no
+	// link at all rather than choosing between two wrong branches.
+	const isExternal = $derived(isExternalUrl(milestone.linkUrl ?? ''));
 </script>
 
 <article style={`--milestone-color: ${color}`}>

package/dist/components/ui/Link.svelte

@@ -3,6 +3,7 @@
 	import type { HTMLAnchorAttributes } from 'svelte/elements';
 	import type { Locale } from '../../config/types.js';
 	import { getUiConfig } from '../../config/context.js';
+	import { isInternalPath } from '../../utils/paths.js';
 
 	interface Props extends HTMLAnchorAttributes {
 		/**
@@ -13,6 +14,13 @@
 		 * path can come back mangled, and no `rel` is emitted. A content column that may hold
 		 * either (a milestone's `link_url`) branches at the call site and
 		 * renders a bare anchor for the external case.
+		 *
+		 * This is ENFORCED, not assumed. The sentence above was here while the
+		 * component handed anything at all to `config.href` — and a resolver
+		 * that localizes paths returns 'javascript:alert(1)' unchanged, so an
+		 * editor-written destination reached an <a href> intact. Anything that
+		 * is not a root-relative path renders as plain text now: dropping a
+		 * link is a visible bug someone reports, emitting a hostile one is not.
 		 */
 		href: string;
 		/** Target locale; defaults to the current request/page locale. */
@@ -24,7 +32,11 @@
 
 	const config = getUiConfig();
 
-	const resolvedHref = $derived(config.href(href, { locale }));
+	const internal = $derived(isInternalPath(href));
+	const resolvedHref = $derived(internal ? config.href(href, { locale }) : undefined);
 </script>
 
+<!-- No href rather than no element: an anchor without one is not a link and
+     navigates nowhere, while the surrounding CSS (which selects `a`) keeps
+     applying, so a refused destination costs the layout nothing. -->
 <a href={resolvedHref} {...rest}>{@render children()}</a>

package/dist/components/ui/Link.svelte.d.ts

@@ -10,6 +10,13 @@ interface Props extends HTMLAnchorAttributes {
      * path can come back mangled, and no `rel` is emitted. A content column that may hold
      * either (a milestone's `link_url`) branches at the call site and
      * renders a bare anchor for the external case.
+     *
+     * This is ENFORCED, not assumed. The sentence above was here while the
+     * component handed anything at all to `config.href` — and a resolver
+     * that localizes paths returns 'javascript:alert(1)' unchanged, so an
+     * editor-written destination reached an <a href> intact. Anything that
+     * is not a root-relative path renders as plain text now: dropping a
+     * link is a visible bug someone reports, emitting a hostile one is not.
      */
     href: string;
     /** Target locale; defaults to the current request/page locale. */

package/dist/index.d.ts

@@ -6,4 +6,4 @@ export * from './admin.js';
 export * from './forms/index.js';
 export * from './config/index.js';
 export * from './edit/index.js';
-export { buildQueryString, isPathUnder } from './utils/paths.js';
+export { buildQueryString, isExternalUrl, isInternalPath, isPathUnder } from './utils/paths.js';

package/dist/index.js

@@ -13,4 +13,4 @@ export * from './forms/index.js';
 export * from './config/index.js';
 export * from './edit/index.js';
 // Path utilities shared with host apps.
-export { buildQueryString, isPathUnder } from './utils/paths.js';
+export { buildQueryString, isExternalUrl, isInternalPath, isPathUnder } from './utils/paths.js';

package/dist/utils/paths.d.ts

@@ -6,3 +6,27 @@ export declare function isPathUnder(pathname: string, prefix: string): boolean;
  * mirrors and the hrefs it renders are spelled by the same function.
  */
 export declare function buildQueryString(params: Record<string, string | null | undefined>): string;
+/**
+ * Whether a destination is a ROOT-RELATIVE path — the only shape `Link` will
+ * resolve, and what "internal" means everywhere in this package.
+ *
+ * One leading slash, and the second character must not be another slash:
+ * '//evil.example' is protocol-relative and leaves the site. A bare scheme is
+ * not a path either, so 'javascript:alert(1)' fails here — which is the point.
+ */
+export declare function isInternalPath(href: string): boolean;
+/**
+ * Whether a destination is an EXTERNAL URL this package is willing to emit.
+ *
+ * An allow-list, not a deny-list, and it is the reason this function exists
+ * rather than a `!isInternalPath` at each call site: the classifier it
+ * replaced accepted ANY scheme followed by '//', so a scheme WITHOUT one —
+ * 'javascript:alert(1)' — fell through to the internal branch and reached the
+ * locale resolver, which returns it verbatim into an <a href>.
+ *
+ * Protocol-relative ('//host/path') stays external on purpose: it is another
+ * origin, so localizing it would splice a locale segment into someone else's
+ * URL, and it carries the page's own scheme rather than a new one. What is
+ * excluded is every scheme that is not http(s) — which is where the harm was.
+ */
+export declare function isExternalUrl(href: string): boolean;

package/dist/utils/paths.js

@@ -16,3 +16,31 @@ export function buildQueryString(params) {
     const encoded = search.toString();
     return encoded ? `?${encoded}` : '';
 }
+/**
+ * Whether a destination is a ROOT-RELATIVE path — the only shape `Link` will
+ * resolve, and what "internal" means everywhere in this package.
+ *
+ * One leading slash, and the second character must not be another slash:
+ * '//evil.example' is protocol-relative and leaves the site. A bare scheme is
+ * not a path either, so 'javascript:alert(1)' fails here — which is the point.
+ */
+export function isInternalPath(href) {
+    return /^\/([^/]|$)/.test(href);
+}
+/**
+ * Whether a destination is an EXTERNAL URL this package is willing to emit.
+ *
+ * An allow-list, not a deny-list, and it is the reason this function exists
+ * rather than a `!isInternalPath` at each call site: the classifier it
+ * replaced accepted ANY scheme followed by '//', so a scheme WITHOUT one —
+ * 'javascript:alert(1)' — fell through to the internal branch and reached the
+ * locale resolver, which returns it verbatim into an <a href>.
+ *
+ * Protocol-relative ('//host/path') stays external on purpose: it is another
+ * origin, so localizing it would splice a locale segment into someone else's
+ * URL, and it carries the page's own scheme rather than a new one. What is
+ * excluded is every scheme that is not http(s) — which is where the harm was.
+ */
+export function isExternalUrl(href) {
+    return /^(?:https?:)?\/\/[^/]/i.test(href);
+}

package/package.json

@@ -1,12 +1,14 @@
 {
 	"name": "@vit-foundation/ui",
-	"version": "0.17.0",
+	"version": "0.18.0",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build && npm run prepack",
 		"preview": "vite preview",
 		"prepare": "svelte-kit sync || echo ''",
 		"prepack": "svelte-kit sync && svelte-package && publint",
+		"_comment:prepublishOnly": "Publishing is MANUAL (the release workflow has no NPM_TOKEN and fails on every tag), so the gate belongs on the command that actually publishes. npm runs this before prepack.",
+		"prepublishOnly": "npm run lint && npm run check && npm run test:unit -- --run",
 		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
 		"format": "prettier --write .",