@rokkit/states 1.0.0-next.151 → 1.0.0-next.152

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rokkit/states",
-  "version": "1.0.0-next.151",
+  "version": "1.0.0-next.152",
   "description": "Contains generic data manipulation functions that can be used in various components.",
   "repository": {
     "type": "git",

package/src/alerts.svelte.js

@@ -15,12 +15,21 @@ class AlertsStore {
 	 */
 	#scheduleTimer(id, timeout) {
 		if (timeout > 0) {
-			this.#timers.set(id, setTimeout(() => this.dismiss(id), timeout))
+			this.#timers.set(
+				id,
+				setTimeout(() => this.dismiss(id), timeout)
+			)
 		}
 	}
 
-	// eslint-disable-next-line complexity
-	push({ type = 'info', text, dismissible = false, timeout = dismissible ? 0 : 4000, actions } = {}) {
+	 
+	push({
+		type = 'info',
+		text,
+		dismissible = false,
+		timeout = dismissible ? 0 : 4000,
+		actions
+	} = {}) {
 		const id = crypto.randomUUID()
 		this.#items = [...this.#items, { id, type, text, dismissible, timeout, actions }]
 		this.#scheduleTimer(id, timeout)

package/src/derive.svelte.js

@@ -47,7 +47,7 @@ function collectVisibleNodes(items, fields, path, expandedKeys) {
 	return data
 }
 
-// eslint-disable-next-line complexity
+ 
 export function flatVisibleNodes(items, fields = DEFAULT_FIELDS, path = [], expandedKeys = null) {
 	if (!items || !Array.isArray(items)) return []
 	return collectVisibleNodes(items, fields, path, expandedKeys)
@@ -84,7 +84,7 @@ function makeLookupEntry(item, norm, fields) {
  * @param {SvelteMap} lookup  Accumulator map
  * @param {{ item: *, index: number, fields: *, path: Array<number> }} ctx
  */
-// eslint-disable-next-line complexity
+ 
 function visitLookupNode(lookup, ctx) {
 	const { item, index, fields, path } = ctx
 	const itemPath = [...path, index]

package/src/list-controller.svelte.js

@@ -44,7 +44,7 @@ export class ListController {
 	 * Process a single item for expanded key initialization.
 	 * @private
 	 */
-	// eslint-disable-next-line complexity
+	 
 	#initExpandedItem(item, index, fields, path) {
 		if (item === null || item === undefined || typeof item !== 'object') return
 		const children = item[fields.children]

package/src/messages.svelte.js

@@ -1,5 +1,5 @@
 /**
- * Default messages for UI components
+ * Default (English) messages for all UI components.
  * @type {import('./types').Messages}
  */
 const defaultMessages = {
@@ -29,7 +29,8 @@ const defaultMessages = {
 		next: 'Next slide',
 		slides: 'Slide navigation'
 	},
-	tabs: { add: 'Add tab', remove: 'Remove tab' },
+	tabs: { add: 'Add tab', remove: 'Remove tab', placeholder: 'Select a tab to view its content.' },
+	table: { empty: 'No data', sortAscending: 'Sort ascending', sortDescending: 'Sort descending' },
 	code: { copy: 'Copy code', copied: 'Copied!' },
 	range: { lower: 'Lower bound', upper: 'Upper bound', value: 'Value' },
 	search_: { clear: 'Clear search' },
@@ -47,53 +48,118 @@ const defaultMessages = {
 }
 
 /**
- * Messages store for localized UI strings
+ * Deep-merge `overrides` onto `base`. One level deep for nested objects.
+ * @param {Record<string, unknown>} base
+ * @param {Record<string, unknown>} overrides
+ * @returns {Record<string, unknown>}
  */
+function deepMerge(base, overrides) {
+	const result = { ...base }
+	for (const key of Object.keys(overrides)) {
+		const isObj = (v) => typeof v === 'object' && v !== null
+		result[key] =
+			isObj(overrides[key]) && isObj(result[key])
+				? { ...result[key], ...overrides[key] }
+				: overrides[key]
+	}
+	return result
+}
+
 class MessagesStore {
-	/** @type {import('./types').Messages} */
-	#messages = $state({ ...defaultMessages })
+	#registry = {}
+	#locale = 'en'
+
+	// ─── Flat string keys ─────────────────────────────────────────────────────
+
+	emptyList = $state(defaultMessages.emptyList)
+	emptyTree = $state(defaultMessages.emptyTree)
+	loading = $state(defaultMessages.loading)
+	noResults = $state(defaultMessages.noResults)
+	select = $state(defaultMessages.select)
+	search = $state(defaultMessages.search)
+
+	// ─── Nested component namespaces ──────────────────────────────────────────
+
+	list = $state({ ...defaultMessages.list })
+	tree = $state({ ...defaultMessages.tree })
+	toolbar = $state({ ...defaultMessages.toolbar })
+	menu = $state({ ...defaultMessages.menu })
+	toggle = $state({ ...defaultMessages.toggle })
+	rating = $state({ ...defaultMessages.rating })
+	stepper = $state({ ...defaultMessages.stepper })
+	breadcrumbs = $state({ ...defaultMessages.breadcrumbs })
+	carousel = $state({ ...defaultMessages.carousel })
+	tabs = $state({ ...defaultMessages.tabs })
+	table = $state({ ...defaultMessages.table })
+	code = $state({ ...defaultMessages.code })
+	range = $state({ ...defaultMessages.range })
+	search_ = $state({ ...defaultMessages.search_ })
+	filter = $state({ ...defaultMessages.filter })
+	grid = $state({ ...defaultMessages.grid })
+	uploadProgress = $state({ ...defaultMessages.uploadProgress })
+	floatingNav = $state({ ...defaultMessages.floatingNav })
+	mode = $state({ ...defaultMessages.mode })
+
+	// ─── Active locale ─────────────────────────────────────────────────────────
+
+	/** Currently active locale tag (read-only). */
+	get locale() {
+		return this.#locale
+	}
+
+	// ─── Internals ─────────────────────────────────────────────────────────────
+
+	#apply() {
+		const overrides = this.#registry[this.#locale]
+		const computed = overrides
+			? /** @type {import('./types').Messages} */ (deepMerge(defaultMessages, overrides))
+			: structuredClone(defaultMessages)
+		Object.assign(this, computed)
+	}
+
+	// ─── Public API ────────────────────────────────────────────────────────────
 
 	/**
-	 * Get the current messages
-	 * @returns {import('./types').Messages}
+	 * Register translation overrides for a locale. Unspecified keys fall back to English defaults.
+	 * @param {string} locale — BCP 47 tag or any identifier (e.g. 'de', 'fr-CA')
+	 * @param {Partial<import('./types').Messages>} overrides
 	 */
-	get current() {
-		return this.#messages
+	register(locale, overrides) {
+		this.#registry = { ...this.#registry, [locale]: overrides }
+		this.#apply()
 	}
 
 	/**
-	 * Merge a single key from custom into merged target.
-	 * @param {Record<string, unknown>} merged
-	 * @param {Record<string, unknown>} custom
-	 * @param {string} key
+	 * Switch to a previously registered locale. Use 'en' to restore English defaults.
+	 * @param {string} locale
 	 */
-	#mergeKey(merged, custom, key) {
-		const isObject = (v) => typeof v === 'object' && v !== null
-		if (isObject(custom[key]) && isObject(merged[key])) {
-			merged[key] = { ...merged[key], ...custom[key] }
-		} else {
-			merged[key] = custom[key]
-		}
+	setLocale(locale) {
+		this.#locale = locale
+		this.#apply()
 	}
 
 	/**
-	 * Set custom messages (merges with defaults)
-	 * @param {Partial<import('./types').Messages>} custom
+	 * Apply one-off overrides without naming a locale (convenience / backward compat).
+	 * @param {Partial<import('./types').Messages>} overrides
 	 */
-	set(custom) {
-		const merged = { ...defaultMessages }
-		for (const key of Object.keys(custom)) {
-			this.#mergeKey(merged, custom, key)
-		}
-		this.#messages = merged
+	set(overrides) {
+		this.#registry = { ...this.#registry, _custom: overrides }
+		this.#locale = '_custom'
+		this.#apply()
 	}
 
 	/**
-	 * Reset to default messages
+	 * Reset to English defaults and clear all registered locales.
 	 */
 	reset() {
-		this.#messages = { ...defaultMessages }
+		this.#registry = {}
+		this.#locale = 'en'
+		this.#apply()
 	}
 }
 
+/**
+ * Reactive messages store. Access strings directly: `messages.select`, `messages.tree.expand`.
+ * Configure locale: `messages.register('de', {...})` + `messages.setLocale('de')`.
+ */
 export const messages = new MessagesStore()

package/src/wrapper.svelte.js

@@ -125,7 +125,7 @@ export class Wrapper {
 	 * At root level with no parent: no-op.
 	 * When collapsible=false, skips closing the group but still moves focus to parent.
 	 */
-	// eslint-disable-next-line complexity
+	 
 	collapse(_path) {
 		if (!this.#focusedKey) return
 		const node = this.flatView.find((n) => n.key === this.#focusedKey)
@@ -177,7 +177,7 @@ export class Wrapper {
 	 * Unlike select(), this only applies to groups and never fires onselect.
 	 * No-op when collapsible=false.
 	 */
-	// eslint-disable-next-line complexity
+	 
 	toggle(path) {
 		if (!this.#collapsible) return
 		const key = path ?? this.#focusedKey