rune-lab 0.3.0 → 0.4.0

package/dist/ui/layout/connection-factory.js

@@ -0,0 +1,58 @@
+// sdk/ui/src/lib/layout/connection-factory.ts
+// Connection functions that generate reactive prop bindings from LayoutStore.
+// Svelte 5 doesn't support React-style HOCs — this is the idiomatic alternative.
+/**
+ * Creates reactive prop bindings for connecting NavigationPanel to LayoutStore.
+ * Returns an object with getter properties that track LayoutStore state.
+ *
+ * @param layoutStore - The LayoutStore instance from context
+ * @returns Prop bindings compatible with NavigationPanel
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   const layoutStore = getLayoutStore();
+ *   const nav = createNavigationConnection(layoutStore);
+ * </script>
+ * <NavigationPanel {sections} activeId={nav.activeId} collapsedIds={nav.collapsedIds}
+ *   onSelect={nav.onSelect} onToggle={nav.onToggle} />
+ * ```
+ */
+export function createNavigationConnection(layoutStore) {
+    return {
+        get activeId() {
+            return layoutStore.activeNavItemId;
+        },
+        get collapsedIds() {
+            return layoutStore.collapsedSections;
+        },
+        onSelect(item) {
+            if (item.id)
+                layoutStore.navigate(item.id);
+        },
+        onToggle(id, isOpen) {
+            if (isOpen) {
+                layoutStore.expandSection(id);
+            }
+            else {
+                layoutStore.collapseSection(id);
+            }
+        },
+    };
+}
+/**
+ * Creates reactive prop bindings for connecting WorkspaceStrip to LayoutStore.
+ *
+ * @param layoutStore - The LayoutStore instance from context
+ * @returns Prop bindings compatible with WorkspaceStrip
+ */
+export function createWorkspaceConnection(layoutStore) {
+    return {
+        get activeId() {
+            return layoutStore.activeWorkspaceId;
+        },
+        onSelect(id) {
+            layoutStore.activateWorkspace(id);
+        },
+    };
+}

package/dist/ui/layout/index.d.ts

@@ -3,5 +3,5 @@ export { default as WorkspaceStrip } from "./WorkspaceStrip.svelte";
 export { default as NavigationPanel } from "./NavigationPanel.svelte";
 export { default as ContentArea } from "./ContentArea.svelte";
 export { default as DetailPanel } from "./DetailPanel.svelte";
-export { createLayoutStore, getLayoutStore } from "rune-lab/state";
-export type { NavigationItem, NavigationSection, WorkspaceItem, } from "rune-lab/state";
+export { createLayoutStore, getLayoutStore } from "@internal/state";
+export type { NavigationItem, NavigationSection, WorkspaceItem, } from "@internal/state";

package/dist/ui/layout/index.js

@@ -4,4 +4,4 @@ export { default as WorkspaceStrip } from "./WorkspaceStrip.svelte";
 export { default as NavigationPanel } from "./NavigationPanel.svelte";
 export { default as ContentArea } from "./ContentArea.svelte";
 export { default as DetailPanel } from "./DetailPanel.svelte";
-export { createLayoutStore, getLayoutStore } from "rune-lab/state";
+export { createLayoutStore, getLayoutStore } from "@internal/state";

package/dist/ui/paraglide/README.md

@@ -81,6 +81,59 @@ await compile({
 
 See the [strategy documentation](https://inlang.com/m/gerre34r/library-inlang-paraglideJs/strategy) for details.
 
+## Markup (Rich Text)
+
+Messages can contain markup tags for bold, links, and other inline elements. Translators control where tags appear; developers control how they render.
+
+### Message syntax
+
+```json
+{
+  "cta": "{#link to=|/docs|}Read the docs{/link}",
+  "bold_text": "This is {#bold}important{/bold}"
+}
+```
+
+- `{#tagName}` opens a tag, `{/tagName}` closes it.
+- Options: `to=|/docs|` (accessed via `options.to`).
+- Attributes: `@track` (boolean, accessed via `attributes.track`).
+
+This is the default inlang message syntax. Paraglide's message format is plugin-based — you can use [ICU MessageFormat 1](https://inlang.com/m/p7c8m1d2/plugin-inlang-icu-messageformat-1), [i18next](https://inlang.com/m/3i8bor92/plugin-inlang-i18next), or other [plugins](https://inlang.com/c/plugins) instead.
+
+### Rendering markup
+
+Calling `m.cta()` returns **plain text** (markup stripped). To render markup, use the framework adapter or the low-level `parts()` API:
+
+```js
+const parts = m.cta.parts({});
+// [
+//   { type: "markup-start", name: "link", options: { to: "/docs" }, attributes: {} },
+//   { type: "text", value: "Read the docs" },
+//   { type: "markup-end", name: "link" }
+// ]
+```
+
+Framework adapters provide a `<ParaglideMessage>` component that accepts markup renderers:
+
+- `@inlang/paraglide-js-react`
+- `@inlang/paraglide-js-vue`
+- `@inlang/paraglide-js-svelte`
+- `@inlang/paraglide-js-solid`
+
+```jsx
+import { ParaglideMessage } from "@inlang/paraglide-js-react"; // or -vue, -svelte, -solid
+
+<ParaglideMessage
+  message={m.cta}
+  inputs={{}}
+  markup={{
+    link: ({ children, options }) => <a href={options.to}>{children}</a>,
+  }}
+/>
+```
+
+See the [markup documentation](https://inlang.com/m/gerre34r/library-inlang-paraglideJs/markup) for details.
+
 ## Key concepts
 
 - **Tree-shakeable**: Each message is a function, enabling [up to 70% smaller i18n bundle sizes](https://inlang.com/m/gerre34r/library-inlang-paraglideJs/benchmark) than traditional i18n libraries.

package/dist/ui/paraglide/runtime.d.ts

@@ -49,7 +49,14 @@ export function getLocaleForUrl(url: string | URL): Locale;
  */
 export function getTextDirection(locale?: string): "ltr" | "rtl";
 /**
- * Check if something is an available locale.
+ * Coerces a locale-like string to the canonical locale value used by the runtime.
+ *
+ * @param {unknown} value
+ * @returns {Locale | undefined}
+ */
+export function toLocale(value: unknown): Locale | undefined;
+/**
+ * Check if something is an available locale with the canonical project casing.
  *
  * @example
  *   if (isLocale(params.locale)) {
@@ -58,32 +65,61 @@ export function getTextDirection(locale?: string): "ltr" | "rtl";
  *     setLocale('en');
  *   }
  *
- * @param {any} locale
+ * Use `toLocale()` when you want case-insensitive matching and canonicalization.
+ *
+ * @param {unknown} locale
  * @returns {locale is Locale}
  */
-export function isLocale(locale: any): locale is Locale;
+export function isLocale(locale: unknown): locale is Locale;
 /**
- * Asserts that the input is a locale.
+ * Asserts that the input can be normalized to a locale.
  *
- * @param {any} input - The input to check.
- * @returns {Locale} The input if it is a locale.
+ * @param {unknown} input - The input to check.
+ * @returns {Locale} The input normalized to a Locale.
  * @throws {Error} If the input is not a locale.
  */
-export function assertIsLocale(input: any): Locale;
+export function assertIsLocale(input: unknown): Locale;
 /**
  * Extracts a cookie from the document.
  *
  * Will return undefined if the document is not available or if the cookie is not set.
  * The `document` object is not available in server-side rendering, so this function should not be called in that context.
  *
- * @returns {string | undefined}
+ * @returns {Locale | undefined}
+ */
+export function extractLocaleFromCookie(): Locale | undefined;
+/**
+ * Extracts a locale from the accept-language header.
+ *
+ * Use the function on the server to extract the locale
+ * from the accept-language header that is sent by the client.
+ *
+ * @example
+ *   const locale = extractLocaleFromHeader(request);
+ *
+ * @param {Request} request - The request object to extract the locale from.
+ * @returns {Locale | undefined} The negotiated preferred language.
+ */
+export function extractLocaleFromHeader(request: Request): Locale | undefined;
+/**
+ * Negotiates a preferred language from navigator.languages.
+ *
+ * Use the function on the client to extract the locale
+ * from the navigator.languages array.
+ *
+ * @example
+ *   const locale = extractLocaleFromNavigator();
+ *
+ * @returns {Locale | undefined}
  */
-export function extractLocaleFromCookie(): string | undefined;
-export function extractLocaleFromHeader(request: Request): Locale;
 export function extractLocaleFromNavigator(): Locale | undefined;
 /**
  * Extracts the locale from a given URL using native URLPattern.
  *
+ * The built-in default `/:locale/...` routing is case-insensitive because it
+ * canonicalizes the first path segment with `toLocale()`. Custom `urlPatterns`
+ * keep URLPattern's normal exact matching semantics for path segments.
+ *
  * @param {URL|string} url - The full URL from which to extract the locale.
  * @returns {Locale|undefined} The extracted locale, or undefined if no locale is found.
  */
@@ -128,12 +164,12 @@ export function extractLocaleFromUrl(url: URL | string): Locale | undefined;
  * ```
  *
  * @param {string | URL} url - The URL to localize. If string, must be absolute.
- * @param {Object} [options] - Options for localization
- * @param {string} [options.locale] - Target locale. If not provided, uses getLocale()
+ * @param {object} [options] - Options for localization
+ * @param {Locale} [options.locale] - Target locale. If not provided, uses getLocale()
  * @returns {URL} The localized URL, always absolute
  */
 export function localizeUrl(url: string | URL, options?: {
-    locale?: string | undefined;
+    locale?: "es" | "fr" | "it" | "pt" | "en" | "de" | "ru" | "hi" | "ar" | "zh" | "ja" | "ko" | "vi" | undefined;
 }): URL;
 /**
  * Low-level URL de-localization function, primarily used in server contexts.
@@ -175,23 +211,30 @@ export function localizeUrl(url: string | URL, options?: {
  * @returns {URL} The de-localized URL, always absolute
  */
 export function deLocalizeUrl(url: string | URL): URL;
+/**
+ * Aggregates named groups from various parts of the URLPattern match result.
+ *
+ *
+ * @param {any} match - The URLPattern match result object.
+ * @returns {Record<string, string | null | undefined>} An object containing all named groups from the match.
+ */
 export function aggregateGroups(match: any): Record<string, string | null | undefined>;
 /**
  * @typedef {object} ShouldRedirectServerInput
  * @property {Request} request
  * @property {string | URL} [url]
- * @property {ReturnType<typeof assertIsLocale>} [locale]
+ * @property {Locale} [locale]
  *
  * @typedef {object} ShouldRedirectClientInput
  * @property {undefined} [request]
  * @property {string | URL} [url]
- * @property {ReturnType<typeof assertIsLocale>} [locale]
+ * @property {Locale} [locale]
  *
  * @typedef {ShouldRedirectServerInput | ShouldRedirectClientInput} ShouldRedirectInput
  *
  * @typedef {object} ShouldRedirectResult
  * @property {boolean} shouldRedirect - Indicates whether the consumer should perform a redirect.
- * @property {ReturnType<typeof assertIsLocale>} locale - Locale resolved using the configured strategies.
+ * @property {Locale} locale - Locale resolved using the configured strategies.
  * @property {URL | undefined} redirectUrl - Destination URL when a redirect is required.
  */
 /**
@@ -267,12 +310,12 @@ export function shouldRedirect(input?: ShouldRedirectInput): Promise<ShouldRedir
  * which provides more precise control over URL handling.
  *
  * @param {string} href - The href to localize (can be relative or absolute)
- * @param {Object} [options] - Options for localization
- * @param {string} [options.locale] - Target locale. If not provided, uses `getLocale()`
+ * @param {object} [options] - Options for localization
+ * @param {Locale} [options.locale] - Target locale. If not provided, uses `getLocale()`
  * @returns {string} The localized href, relative if input was relative
  */
 export function localizeHref(href: string, options?: {
-    locale?: string | undefined;
+    locale?: "es" | "fr" | "it" | "pt" | "en" | "de" | "ru" | "hi" | "ar" | "zh" | "ja" | "ko" | "vi" | undefined;
 }): string;
 /**
  * High-level URL de-localization function optimized for client-side UI usage.
@@ -367,33 +410,33 @@ export function generateStaticLocalizedUrls(urls: (string | URL)[]): URL[];
 /**
  * Checks if the given strategy is a custom strategy.
  *
- * @param {any} strategy The name of the custom strategy to validate.
+ * @param {unknown} strategy The name of the custom strategy to validate.
  * Must be a string that starts with "custom-" followed by alphanumeric characters, hyphens, or underscores.
  * @returns {boolean} Returns true if it is a custom strategy, false otherwise.
  */
-export function isCustomStrategy(strategy: any): boolean;
+export function isCustomStrategy(strategy: unknown): boolean;
 /**
  * Defines a custom strategy that is executed on the server.
  *
  * @see https://inlang.com/m/gerre34r/library-inlang-paraglideJs/strategy#write-your-own-strategy
  *
- * @param {any} strategy The name of the custom strategy to define. Must follow the pattern custom-name with alphanumeric characters, hyphens, or underscores.
+ * @param {string} strategy The name of the custom strategy to define. Must follow the pattern custom-name with alphanumeric characters, hyphens, or underscores.
  * @param {CustomServerStrategyHandler} handler The handler for the custom strategy, which should implement
  * the method getLocale.
  * @returns {void}
  */
-export function defineCustomServerStrategy(strategy: any, handler: CustomServerStrategyHandler): void;
+export function defineCustomServerStrategy(strategy: string, handler: CustomServerStrategyHandler): void;
 /**
  * Defines a custom strategy that is executed on the client.
  *
  * @see https://inlang.com/m/gerre34r/library-inlang-paraglideJs/strategy#write-your-own-strategy
  *
- * @param {any} strategy The name of the custom strategy to define. Must follow the pattern custom-name with alphanumeric characters, hyphens, or underscores.
+ * @param {string} strategy The name of the custom strategy to define. Must follow the pattern custom-name with alphanumeric characters, hyphens, or underscores.
  * @param {CustomClientStrategyHandler} handler The handler for the custom strategy, which should implement the
  * methods getLocale and setLocale.
  * @returns {void}
  */
-export function defineCustomClientStrategy(strategy: any, handler: CustomClientStrategyHandler): void;
+export function defineCustomClientStrategy(strategy: string, handler: CustomClientStrategyHandler): void;
 /**
  * The project's base locale.
  *
@@ -443,7 +486,7 @@ export const routeStrategies: Array<{
 /**
  * The used URL patterns.
  *
- * @type {Array<{ pattern: string, localized: Array<[Locale, string]> }> }
+ * @type {Array<{ pattern: string, localized: Array<[Locale, string]> }>}
  */
 export const urlPatterns: Array<{
     pattern: string;
@@ -474,41 +517,8 @@ export const experimentalMiddlewareLocaleSplitting: false;
 export const isServer: boolean;
 /** @type {Locale | undefined} */
 export const experimentalStaticLocale: Locale | undefined;
-/**
- * Get the current locale.
- *
- * The locale is resolved using your configured strategies (URL, cookie, localStorage, etc.)
- * in the order they are defined. In SSR contexts, the locale is retrieved from AsyncLocalStorage
- * which is set by the `paraglideMiddleware()`.
- *
- * @see https://inlang.com/m/gerre34r/library-inlang-paraglideJs/strategy - Configure locale detection strategies
- *
- * @example
- *   if (getLocale() === 'de') {
- *     console.log('Germany 🇩🇪');
- *   } else if (getLocale() === 'nl') {
- *     console.log('Netherlands 🇳🇱');
- *   }
- *
- * @type {() => Locale}
- */
-export let getLocale: () => Locale;
-/**
- * Overwrite the `getLocale()` function.
- *
- * Use this function to overwrite how the locale is resolved. This is useful
- * for custom locale resolution or advanced use cases like SSG with concurrent rendering.
- *
- * @see https://inlang.com/m/gerre34r/library-inlang-paraglideJs/strategy
- *
- * @example
- *   overwriteGetLocale(() => {
- *     return Cookies.get('locale') ?? baseLocale
- *   });
- *
- * @type {(fn: () => Locale) => void}
- */
-export const overwriteGetLocale: (fn: () => Locale) => void;
+export function getLocale(): Locale;
+export function overwriteGetLocale(fn: () => Locale): void;
 /**
  * @typedef {(newLocale: Locale, options?: { reload?: boolean }) => void | Promise<void>} SetLocaleFn
  */
@@ -545,65 +555,10 @@ export function overwriteSetLocale(fn: SetLocaleFn): void;
  * @type {() => string}
  */
 export let getUrlOrigin: () => string;
-/**
- * Overwrite the getUrlOrigin function.
- *
- * Use this function in server environments to
- * define how the URL origin is resolved.
- *
- * @type {(fn: () => string) => void}
- */
-export let overwriteGetUrlOrigin: (fn: () => string) => void;
-/**
- * Extracts a locale from a request.
- *
- * Use the function on the server to extract the locale
- * from a request.
- *
- * The function goes through the strategies in the order
- * they are defined. If a strategy returns an invalid locale,
- * it will fall back to the next strategy.
- *
- * Note: Custom server strategies are not supported in this synchronous version.
- * Use `extractLocaleFromRequestAsync` if you need custom server strategies with async getLocale methods.
- *
- * @example
- *   const locale = extractLocaleFromRequest(request);
- *
- * @type {(request: Request) => Locale}
- */
-export const extractLocaleFromRequest: (request: Request) => Locale;
+export function overwriteGetUrlOrigin(fn: () => string): void;
+export function extractLocaleFromRequest(request: Request): Locale;
 export function extractLocaleFromRequestWithStrategies(request: Request, strategies: typeof strategy): Locale;
-/**
- * Asynchronously extracts a locale from a request.
- *
- * This function supports async custom server strategies, unlike the synchronous
- * `extractLocaleFromRequest`. Use this function when you have custom server strategies
- * that need to perform asynchronous operations (like database calls) in their getLocale method.
- *
- * The function first processes any custom server strategies asynchronously, then falls back
- * to the synchronous `extractLocaleFromRequest` for all other strategies.
- *
- * @see {@link https://github.com/opral/inlang-paraglide-js/issues/527#issuecomment-2978151022}
- *
- * @example
- *   // Basic usage
- *   const locale = await extractLocaleFromRequestAsync(request);
- *
- * @example
- *   // With custom async server strategy
- *   defineCustomServerStrategy("custom-database", {
- *     getLocale: async (request) => {
- *       const userId = extractUserIdFromRequest(request);
- *       return await getUserLocaleFromDatabase(userId);
- *     }
- *   });
- *
- *   const locale = await extractLocaleFromRequestAsync(request);
- *
- * @type {(request: Request) => Promise<Locale>}
- */
-export const extractLocaleFromRequestAsync: (request: Request) => Promise<Locale>;
+export function extractLocaleFromRequestAsync(request: Request): Promise<Locale>;
 /**
  * @typedef {"cookie" | "baseLocale" | "globalVariable" | "url" | "preferredLanguage" | "localStorage"} BuiltInStrategy
  */
@@ -645,7 +600,7 @@ export type ShouldRedirectResult = {
     /**
      * - Locale resolved using the configured strategies.
      */
-    locale: ReturnType<typeof assertIsLocale>;
+    locale: Locale;
     /**
      * - Destination URL when a redirect is required.
      */
@@ -684,17 +639,31 @@ export type Locale = (typeof locales)[number];
 /**
  * A branded type representing a localized string.
  *
- * Message functions return this type instead of `string`, enabling TypeScript
+ * Message functions return this type instead of \`string\`, enabling TypeScript
  * to distinguish translated strings from regular strings at compile time.
  * This allows you to enforce that only properly localized content is used
  * in your UI components.
  *
- * Since `LocalizedString` is a branded subtype of `string`, it remains fully
- * backward compatible—you can pass it anywhere a `string` is expected.
+ * Since \`LocalizedString\` is a branded subtype of \`string\`, it remains fully
+ * backward compatible—you can pass it anywhere a \`string\` is expected.
  */
 export type LocalizedString = string & {
     readonly __brand: "LocalizedString";
 };
+/**
+ * A single markup option passed to a tag instance.
+ */
+export type MessageMarkupOption = {
+    name: string;
+    value: unknown;
+};
+/**
+ * A single static markup attribute attached to a tag instance.
+ */
+export type MessageMarkupAttribute = {
+    name: string;
+    value: string | true;
+};
 /**
  * Record of markup options for a tag instance.
  */
@@ -718,7 +687,7 @@ export type MessageMarkupSchema = Record<string, MessageMarkupTag>;
 /**
  * Type-only metadata attached to compiled message functions.
  */
-export type MessageMetadata<Inputs, Options, Markup extends MessageMarkupSchema> = {
+export type MessageMetadata<Inputs, Options, Markup extends MessageMarkupSchema = MessageMarkupSchema> = {
     readonly __paraglide?: {
         inputs: Inputs;
         options: Options;
@@ -747,3 +716,15 @@ export type MessagePart = {
     options: MessageMarkupOptions;
     attributes: MessageMarkupAttributes;
 };
+/**
+ * A message function is a message for a specific locale.
+ */
+export type MessageFunction = (inputs?: Record<string, never>) => LocalizedString;
+/**
+ * A message bundle function that selects the message to be returned.
+ *
+ * Uses `getLocale()` under the hood to determine the locale with an option.
+ */
+export type MessageBundleFunction<T extends string> = (params: Record<string, never>, options: {
+    locale: T;
+}) => LocalizedString;