@octane-xplat/ui 0.11.0 → 0.11.1

package/dist/native/octane-client-build.json

@@ -1,6 +1,6 @@
 {
   "version": 1,
-  "buildId": "34e7eb98-53f0-4d28-9246-10c4851ef1b3",
+  "buildId": "75ddb2ef-c36e-4fe9-a527-366022e49e35",
   "mode": "production",
   "capabilities": {
     "independentHydration": false

package/dist/web/octane-client-build.json

@@ -1,6 +1,6 @@
 {
   "version": 1,
-  "buildId": "1c2dd44a-dfca-4434-aea5-573ac6a80e5f",
+  "buildId": "f3b36f26-7df9-403d-af4d-d1c9ae0de882",
   "mode": "production",
   "capabilities": {
     "independentHydration": false

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@octane-xplat/ui",
-  "version": "0.11.0",
+  "version": "0.11.1",
   "description": "Cross-platform UI for Octane xplat — shared primitives, stacks, routes and theming across web (DOM), iOS and Android (NativeScript)",
   "keywords": [
     "android",
@@ -69,8 +69,8 @@
     "@nativescript-community/octane": "0.2.4",
     "@nativescript-community/ui-drawer": "0.1.32",
     "@nativescript/core": "9.1.2",
-    "@nativescript/types": "9.0.0",
-    "@octane-xplat/macos-renderer": "0.11.0",
+    "@nativescript/types": "9.1.4",
+    "@octane-xplat/macos-renderer": "0.11.1",
     "@octanejs/vite-plugin": "0.1.61",
     "@tsrx/typescript-plugin": "0.4.11",
     "jsdom": "30.1.1",
@@ -98,7 +98,7 @@
   "scripts": {
     "build": "node ../../scripts/sync-ui-barrels.mjs --check && vite build && vite build --mode native && pnpm typegen && node ../../scripts/check-native-dist.mjs",
     "test:packed": "node tests/packed-consumer.mjs",
-    "test:native": "node --test tests/animated-value.test.mjs tests/tap-to-blur.ios.test.mjs tests/bottom-sheet-service.macos.test.mjs && vitest run --config vitest.native.config.mts",
+    "test:native": "node --test tests/animated-value.test.mjs tests/tap-to-blur.ios.test.mjs tests/bottom-sheet-service.macos.test.mjs tests/color-scheme.macos.test.mjs && vitest run --config vitest.native.config.mts",
     "typegen": "tsrx-typegen --target ui",
     "pack:check": "tsrx-typegen --pack-check",
     "test:layer:web": "node --test tests/layer-position.web.mjs",

package/src/colorScheme.macos.ts

@@ -1,7 +1,7 @@
 import { useSyncExternalStore } from 'octane'
 import type { ColorScheme } from './props'
 
-let appearanceListener: (() => void) | undefined
+let unsubscribeAppearance: (() => void) | undefined
 const listeners = new Set<() => void>()
 const host = () => (globalThis as any).__xplatAppKit
 
@@ -15,12 +15,25 @@ export function getColorScheme(): ColorScheme {
 
 export function subscribeSystemScheme(callback: () => void): () => void {
 	listeners.add(callback)
-	if (!appearanceListener) {
-		appearanceListener = () => listeners.forEach((listener) => listener())
-		host()?.onAppearanceChange?.(appearanceListener)
+	if (!unsubscribeAppearance) {
+		unsubscribeAppearance = host()?.onAppearanceChange?.(() => {
+			listeners.forEach((listener) => listener())
+		})
 	}
 
-	return () => listeners.delete(callback)
+	let active = true
+	return () => {
+		if (!active) {
+			return
+		}
+
+		active = false
+		listeners.delete(callback)
+		if (listeners.size === 0) {
+			unsubscribeAppearance?.()
+			unsubscribeAppearance = undefined
+		}
+	}
 }
 
 export function useColorScheme(): ColorScheme {

package/src/text-controls.macos.tsrx

@@ -18,7 +18,9 @@ export function TextInput(inputProps: TextInputProps) @{
 			style={props.style}
 			isEnabled={!props.isDisabled}
 			editable={!isBlocked}
+			secure={props.secure}
 			onTextChange={props.onChange}
+			onSubmit={props.onSubmit}
 			accessibilityLabel={props.accessibilityLabel ?? props.ariaLabel ?? props.fieldLabel ?? props.label}
 			accessibilityHint={props.accessibilityHint}
 			accessibilityState={{ disabled: props.isDisabled, readonly: props.isReadOnly, busy: props.isLoading, required: props.isRequired && !props.isOptional, invalid: props.status?.type === 'error' }}
@@ -33,5 +35,5 @@ export function TextArea(inputProps: TextAreaProps) @{
 	const props = useFieldControlProps(inputProps)
 	const isBlocked = props.isDisabled || props.isReadOnly
 
-	<textview id={props.id} value={props.value} placeholder={props.placeholder} rows={props.autoGrow ? undefined : props.rows ?? 3} className={cx('vx-textarea', props.isDisabled && 'vx-textarea--disabled', props.isReadOnly && 'vx-textarea--readonly', props.isLoading && 'vx-textarea--loading', props.status && `vx-textarea--status-${props.status.type}`, props.size && `vx-textarea--size-${props.size}`, props.className)} style={props.style} isEnabled={!props.isDisabled} editable={!isBlocked} onTextChange={props.onChange} accessibilityLabel={props.accessibilityLabel ?? props.ariaLabel ?? props.fieldLabel ?? props.label} accessibilityHint={props.accessibilityHint} accessibilityState={{ disabled: props.isDisabled, readonly: props.isReadOnly, busy: props.isLoading, required: props.isRequired && !props.isOptional, invalid: props.status?.type === 'error' }} />
+	<textview id={props.id} value={props.value} placeholder={props.placeholder} rows={props.autoGrow ? undefined : props.rows ?? 3} className={cx('vx-textarea', props.isDisabled && 'vx-textarea--disabled', props.isReadOnly && 'vx-textarea--readonly', props.isLoading && 'vx-textarea--loading', props.status && `vx-textarea--status-${props.status.type}`, props.size && `vx-textarea--size-${props.size}`, props.className)} style={props.style} isEnabled={!props.isDisabled} editable={!isBlocked} secure={props.secure} onTextChange={props.onChange} onSubmit={props.onSubmit} accessibilityLabel={props.accessibilityLabel ?? props.ariaLabel ?? props.fieldLabel ?? props.label} accessibilityHint={props.accessibilityHint} accessibilityState={{ disabled: props.isDisabled, readonly: props.isReadOnly, busy: props.isLoading, required: props.isRequired && !props.isOptional, invalid: props.status?.type === 'error' }} />
 }