@rokkit/core 1.0.0-next.137 → 1.0.0-next.138

package/dist/theme.d.ts

@@ -31,7 +31,7 @@ export declare function themeRules(mapping?: {
  * @param {string} name - Color name (e.g., 'primary')
  * @returns {Array} Array of shortcut definitions
  */
-export declare function semanticShortcuts(name: any): {}[][];
+export declare function semanticShortcuts(name: any): (string[] | (RegExp | (([, variant, end]: [any, any, any]) => string))[] | (RegExp | (([, end]: [any, any]) => string))[])[];
 /**
  * Generates "on-color" text shortcuts for readable text on colored backgrounds.
  *
@@ -92,5 +92,5 @@ export declare class Theme {
     mapVariant(color: any, variant: any): {};
     getColorRules(mapping?: null): {};
     getPalette(mapping?: null): {};
-    getShortcuts(name: any): {}[][];
+    getShortcuts(name: any): (string[] | (RegExp | (([, variant, end]: [any, any, any]) => string))[] | (RegExp | (([, end]: [any, any]) => string))[])[];
 }

package/dist/utils.d.ts

@@ -77,21 +77,7 @@ export function getPathFromKey(key: string): string[];
  * @returns {Function|undefined}
  */
 export function getSnippet(obj: Object, key: string, defaultSnippet?: null | Function): Function | undefined;
-/**
- * Resolve which snippet to render for a proxy item.
- *
- * Checks proxy.snippet for a per-item named override first (e.g. item.snippet = 'highlighted').
- * Falls back to the component-level fallback snippet name (e.g. 'itemContent' / 'groupContent').
- * Returns null if neither is found.
- *
- * @param {Record<string, unknown>} snippets  - snippets passed to the component
- * @param {{ snippet?: string | null }} proxy  - any object with an optional .snippet property
- * @param {string} [fallback]                  - fallback snippet name; defaults to ITEM_SNIPPET ('itemContent')
- * @returns {Function | null}
- */
-export function resolveSnippet(snippets: Record<string, unknown>, proxy: {
-    snippet?: string | null;
-}, fallback?: string): Function | null;
+export function resolveSnippet(snippets: any, proxy: any, fallback?: string): Function | null;
 /**
  * convert hex string to `{r} {g} {b}`
  * @param {string} hex

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rokkit/core",
-  "version": "1.0.0-next.137",
+  "version": "1.0.0-next.138",
   "description": "Contains core utility functions and classes that can be used in various components.",
   "repository": {
     "type": "git",

package/src/theme.ts

@@ -66,56 +66,57 @@ export function themeRules(mapping = DEFAULT_THEME_MAPPING, colors = defaultColo
 	return rules
 }
 
+const SEMANTIC_PREFIXES = [
+	'bg',
+	'border',
+	'border-l',
+	'border-r',
+	'border-t',
+	'border-b',
+	'text',
+	'ring',
+	'outline',
+	'from',
+	'to',
+	'divide'
+]
+
+/**
+ * @param {{ prefix: string, name: string, toneName: string, lightValue: number, darkValue: number }} opts
+ * @returns {Array}
+ */
+function toneShortcuts({ prefix, name, toneName, lightValue, darkValue }) {
+	const variantPattern = new RegExp(`^(.+):${prefix}-${name}-${toneName}(\\/\\d+)?$`)
+	const opacityPattern = new RegExp(`^${prefix}-${name}-${toneName}(\\/\\d+)?$`)
+	const exactPattern = `${prefix}-${name}-${toneName}`
+	return [
+		[
+			variantPattern,
+			([, variant, end]) =>
+				`${variant}:${prefix}-${name}-${lightValue}${end || ''} ${variant}:dark:${prefix}-${name}-${darkValue}${end || ''}`
+		],
+		[
+			opacityPattern,
+			([, end]) =>
+				`${prefix}-${name}-${lightValue}${end || ''} dark:${prefix}-${name}-${darkValue}${end || ''}`
+		],
+		[exactPattern, `${prefix}-${name}-${lightValue} dark:${prefix}-${name}-${darkValue}`]
+	]
+}
+
 /**
  * Generates UnoCSS shortcut definitions for semantic tones with bg, border, text.
  * @param {string} name - Color name (e.g., 'primary')
  * @returns {Array} Array of shortcut definitions
  */
 export function semanticShortcuts(name) {
-	const prefixes = [
-		'bg',
-		'border',
-		'border-l',
-		'border-r',
-		'border-t',
-		'border-b',
-		'text',
-		'ring',
-		'outline',
-		'from',
-		'to',
-		'divide'
-	]
 	const shortcuts = []
-
 	for (const [toneName, lightValue] of Object.entries(TONE_MAP)) {
 		const darkValue = 1000 - lightValue
-
-		for (const prefix of prefixes) {
-			// Variant-prefixed regex (e.g., hover:bg-primary-base)
-			const variantPattern = new RegExp(`^(.+):${prefix}-${name}-${toneName}(\/\\d+)?$`)
-			shortcuts.push([
-				variantPattern,
-				([, variant, end]) =>
-					`${variant}:${prefix}-${name}-${lightValue}${end || ''} ${variant}:dark:${prefix}-${name}-${darkValue}${end || ''}`
-			])
-
-			const opacityPattern = new RegExp(`^${prefix}-${name}-${toneName}(\/\\d+)?$`)
-			shortcuts.push([
-				opacityPattern,
-				([, end]) =>
-					`${prefix}-${name}-${lightValue}${end || ''} dark:${prefix}-${name}-${darkValue}${end || ''}`
-			])
-
-			// Exact static shortcut (e.g., bg-primary-base)
-			const exactPattern = `${prefix}-${name}-${toneName}`
-			shortcuts.push([
-				exactPattern,
-				`${prefix}-${name}-${lightValue} dark:${prefix}-${name}-${darkValue}`
-			])
+		for (const prefix of SEMANTIC_PREFIXES) {
+			shortcuts.push(...toneShortcuts({ prefix, name, toneName, lightValue, darkValue }))
 		}
 	}
-
 	return shortcuts
 }
 

package/src/utils.js

@@ -21,25 +21,25 @@ const RTL_LANGUAGES = [
 ]
 
 /**
- * Detects text direction based on HTML lang attribute
+ * Checks dir/lang attributes of the html element for RTL
  * @returns {'ltr' | 'rtl'}
  */
-export function detectDirection() {
-	if (typeof document === 'undefined') return 'ltr'
-
-	// Check dir attribute first (explicit override)
+function dirFromHtmlElement() {
 	const htmlDir = document.documentElement.getAttribute('dir')
 	if (htmlDir === 'rtl' || htmlDir === 'ltr') return htmlDir
 
-	// Detect from lang attribute
 	const lang = document.documentElement.getAttribute('lang')
-	if (lang) {
-		// Extract primary language code (e.g., 'ar-SA' -> 'ar')
-		const primaryLang = lang.split('-')[0].toLowerCase()
-		if (RTL_LANGUAGES.includes(primaryLang)) return 'rtl'
-	}
+	const primaryLang = lang ? lang.split('-')[0].toLowerCase() : ''
+	return RTL_LANGUAGES.includes(primaryLang) ? 'rtl' : 'ltr'
+}
 
-	return 'ltr'
+/**
+ * Detects text direction based on HTML lang attribute
+ * @returns {'ltr' | 'rtl'}
+ */
+export function detectDirection() {
+	if (typeof document === 'undefined') return 'ltr'
+	return dirFromHtmlElement()
 }
 
 /**
@@ -181,11 +181,17 @@ export function getSnippet(obj, key, defaultSnippet = null) {
  * @param {string} [fallback]                  - fallback snippet name; defaults to ITEM_SNIPPET ('itemContent')
  * @returns {Function | null}
  */
+/**
+ * @param {unknown} value
+ * @returns {Function|null}
+ */
+function asSnippet(value) {
+	return typeof value === 'function' ? value : null
+}
+
 export function resolveSnippet(snippets, proxy, fallback = ITEM_SNIPPET) {
-	const name = proxy?.snippet
-	if (name && typeof snippets[name] === 'function') return snippets[name]
-	const fb = snippets[fallback]
-	return typeof fb === 'function' ? fb : null
+	const name = proxy && proxy.snippet
+	return asSnippet(name && snippets[name]) || asSnippet(snippets[fallback])
 }
 
 /**