From 131cb4fc1b21062ac69ebf42aac39f344ba57101 Mon Sep 17 00:00:00 2001 From: dev Date: Fri, 15 May 2026 02:55:57 +0200 Subject: [PATCH] Consolidate Soma field runtimes --- .../color-field-provider.svelte.ts | 86 ++++++++++--------- .../date-field/date-field-provider.svelte.ts | 76 ++++++++-------- 2 files changed, 85 insertions(+), 77 deletions(-) diff --git a/src/uix/soma/components/color-field/color-field-provider.svelte.ts b/src/uix/soma/components/color-field/color-field-provider.svelte.ts index c2aa80bd9..bf1f430a2 100644 --- a/src/uix/soma/components/color-field/color-field-provider.svelte.ts +++ b/src/uix/soma/components/color-field/color-field-provider.svelte.ts @@ -120,6 +120,8 @@ export interface ColorFieldOpts export class ColorFieldProvider { readonly opts: ColorFieldOpts; readonly runtimePart: SomaRuntimePart; + readonly soma: Soma; + readonly runtime: SomaRuntime; static readonly ctx = context('ColorField'); static get(): ColorFieldProvider | undefined { return this.ctx.getOr(undefined) as ColorFieldProvider | undefined; @@ -131,7 +133,6 @@ export class ColorFieldProvider { return new ColorFieldProvider(opts); } - readonly soma = Soma.get(); readonly field = FieldProvider.get(); segmentValues = $state(initializeColorSegmentValues()); @@ -142,14 +143,14 @@ export class ColorFieldProvider { private constructor(opts: ColorFieldOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(colorFieldMorfo, {}) - .part('provider', { - id: opts.id, - ref: opts.ref, - owner: this, - context: ColorFieldProvider.ctx - }); + this.soma = Soma.require(); + this.runtime = this.soma.runtime(colorFieldMorfo, {}); + this.runtimePart = this.runtime.part('provider', { + id: opts.id, + ref: opts.ref, + owner: this, + context: ColorFieldProvider.ctx + }); // Seed segments from initial value. if (this.opts.value.current) { @@ -423,17 +424,15 @@ export class ColorFieldLabelProvider { private constructor(opts: ColorFieldLabelOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(colorFieldMorfo, {}) - .part('label', { - id: opts.id, - ref: opts.ref, - owner: this, - onRefChange: (v) => { - this.provider.setLabelNode(v); - } - }); this.provider = ColorFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('label', { + id: opts.id, + ref: opts.ref, + owner: this, + onRefChange: (v) => { + this.provider.setLabelNode(v); + } + }); } readonly onclick = () => { @@ -473,15 +472,13 @@ export class ColorFieldInputProvider { private constructor(opts: ColorFieldInputOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(colorFieldMorfo, {}) - .part('input', { - id: opts.id, - ref: opts.ref, - owner: this, - onRefChange: (v) => this.provider.setFieldNode(v) - }); this.provider = ColorFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('input', { + id: opts.id, + ref: opts.ref, + owner: this, + onRefChange: (v) => this.provider.setFieldNode(v) + }); this.provider.setFieldNode(opts.ref.current); watch( @@ -525,11 +522,13 @@ abstract class BaseColorSegmentProvider { protected constructor(opts: WithRefOpts, part: EditableColorSegmentPart) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(colorFieldMorfo, {}) - .part('segment', { id: opts.id, ref: opts.ref, owner: this }); this.part = part; this.provider = ColorFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('segment', { + id: opts.id, + ref: opts.ref, + owner: this + }); } protected get config(): ChannelConfig { @@ -776,9 +775,12 @@ export class ColorLiteralSegmentProvider { private constructor(opts: WithRefOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(colorFieldMorfo, {}) - .part('segment', { id: opts.id, ref: opts.ref, owner: this }); + const provider = ColorFieldProvider.require(); + this.runtimePart = provider.runtime.part('segment', { + id: opts.id, + ref: opts.ref, + owner: this + }); } readonly props = $derived.by(() => @@ -798,7 +800,7 @@ export class ColorLiteralSegmentProvider { // ── Dispatcher ────────────────────────────────────────────────────────────── import type { ColorSegmentPart } from '../../external/colors'; -import type { SomaRuntimePart } from '../../runtime.svelte'; +import type { SomaRuntime, SomaRuntimePart } from '../../runtime.svelte'; export function createColorSegmentProvider(part: ColorSegmentPart, opts: WithRefOpts) { switch (part) { @@ -840,10 +842,12 @@ export class ColorFieldFormatSelectProvider { private constructor(opts: ColorFieldFormatSelectOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(colorFieldMorfo, {}) - .part('format-select', { id: opts.id, ref: opts.ref, owner: this }); this.provider = ColorFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('format-select', { + id: opts.id, + ref: opts.ref, + owner: this + }); } readonly options: ColorFormat[] = $derived.by(() => this.provider.resolvedAllowedFormats); @@ -884,10 +888,12 @@ export class ColorFieldHiddenInputProvider { private constructor(opts: ColorFieldHiddenInputOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(colorFieldMorfo, {}) - .part('input', { id: opts.id, ref: opts.ref, owner: this }); this.provider = ColorFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('input', { + id: opts.id, + ref: opts.ref, + owner: this + }); } readonly props = $derived.by(() => { diff --git a/src/uix/soma/components/date-field/date-field-provider.svelte.ts b/src/uix/soma/components/date-field/date-field-provider.svelte.ts index f18c795b5..1e6c7e80d 100644 --- a/src/uix/soma/components/date-field/date-field-provider.svelte.ts +++ b/src/uix/soma/components/date-field/date-field-provider.svelte.ts @@ -70,7 +70,7 @@ import { DATE_FIELD_LANGS } from './langs'; // ── Contract ───────────────────────────────────────────────────────────────── import { dateFieldMorfo } from '../../../morfo/components/date-field'; -import type { SomaRuntimePart } from '../../runtime.svelte'; +import type { SomaRuntime, SomaRuntimePart } from '../../runtime.svelte'; const attrs = createAttrs(dateFieldMorfo); @@ -170,6 +170,7 @@ export interface DateFieldOpts export class DateFieldProvider { readonly opts: DateFieldOpts; readonly runtimePart: SomaRuntimePart; + readonly runtime: SomaRuntime; static readonly ctx = context('DateField'); static get(): DateFieldProvider | undefined { return this.ctx.getOr(undefined) as DateFieldProvider | undefined; @@ -225,7 +226,8 @@ export class DateFieldProvider { private constructor(opts: DateFieldOpts) { this.opts = opts; - this.runtimePart = this.soma.runtime(dateFieldMorfo, {}).part('provider', { + this.runtime = this.soma.runtime(dateFieldMorfo, {}); + this.runtimePart = this.runtime.part('provider', { id: opts.id, ref: opts.ref, owner: this, @@ -734,15 +736,13 @@ export class DateFieldInputProvider { private constructor(opts: DateFieldInputOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(dateFieldMorfo, {}) - .part('input', { - id: opts.id, - ref: opts.ref, - owner: this, - onRefChange: (v) => this.provider.setFieldNode(v) - }); this.provider = DateFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('input', { + id: opts.id, + ref: opts.ref, + owner: this, + onRefChange: (v) => this.provider.setFieldNode(v) + }); this.provider.setFieldNode(opts.ref.current); watch( @@ -797,15 +797,13 @@ export class DateFieldLabelProvider { private constructor(opts: WithRefOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(dateFieldMorfo, {}) - .part('label', { - id: opts.id, - ref: opts.ref, - owner: this, - onRefChange: (v) => this.provider.setLabelNode(v) - }); this.provider = DateFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('label', { + id: opts.id, + ref: opts.ref, + owner: this, + onRefChange: (v) => this.provider.setLabelNode(v) + }); this.provider.setLabelNode(opts.ref.current); } @@ -883,10 +881,12 @@ abstract class BaseNumericSegmentProvider { config: SegmentConfig ) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(dateFieldMorfo, {}) - .part('segment', { id: opts.id, ref: opts.ref, owner: this }); this.provider = DateFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('segment', { + id: opts.id, + ref: opts.ref, + owner: this + }); this.part = part; this.config = config; } @@ -1346,17 +1346,15 @@ class DateFieldDayPeriodSegmentProvider { constructor(opts: WithRefOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(dateFieldMorfo, {}) - .part('segment', { - id: opts.id, - ref: opts.ref, - owner: this, - onRefChange: (v) => { - this.provider.dayPeriodNode = v; - } - }); this.provider = DateFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('segment', { + id: opts.id, + ref: opts.ref, + owner: this, + onRefChange: (v) => { + this.provider.dayPeriodNode = v; + } + }); } get announcer(): Announcer { @@ -1441,10 +1439,12 @@ class DateFieldLiteralSegmentProvider { constructor(opts: WithRefOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(dateFieldMorfo, {}) - .part('segment', { id: opts.id, ref: opts.ref, owner: this }); this.provider = DateFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('segment', { + id: opts.id, + ref: opts.ref, + owner: this + }); } readonly props = $derived.by(() => @@ -1467,10 +1467,12 @@ class DateFieldTimeZoneSegmentProvider { constructor(opts: WithRefOpts) { this.opts = opts; - this.runtimePart = Soma.require() - .runtime(dateFieldMorfo, {}) - .part('segment', { id: opts.id, ref: opts.ref, owner: this }); this.provider = DateFieldProvider.require(); + this.runtimePart = this.provider.runtime.part('segment', { + id: opts.id, + ref: opts.ref, + owner: this + }); } get directionalKeys() {