@mhmo91/schmancy 0.10.36 → 0.10.38

package/src/form/fields/checkbox/checkbox.ts

@@ -49,14 +49,14 @@ class SchmancyCheckboxElement extends SchmancyFormField() {
 	@property({ type: String })
 	size: 'xxs' | 'xs' | 'sm' | 'md' | 'lg' = 'md'
 
-	private get _trueValue(): string {
+	private get trueValue(): string {
 		return this.getAttribute('true-value') ?? 'on'
 	}
 
 	override willUpdate(changed: PropertyValues): void {
 		super.willUpdate(changed)
 		if (changed.has('value') || changed.has('name')) {
-			this.internals?.setFormValue(this.value ? this._trueValue : null)
+			this.internals?.setFormValue(this.value ? this.trueValue : null)
 			if (this.value) this.internals?.states.add('checked')
 			else this.internals?.states.delete('checked')
 			this.checkValidity()
@@ -80,7 +80,7 @@ class SchmancyCheckboxElement extends SchmancyFormField() {
 			isValid ? undefined : message,
 		)
 
-		if (this._shouldShowError()) {
+		if (this.shouldShowError()) {
 			this.error = !isValid
 			this.validationMessage = message
 		}
@@ -90,7 +90,7 @@ class SchmancyCheckboxElement extends SchmancyFormField() {
 	/** Emit only when checked. */
 	override toFormEntries(): Array<[string, FormDataEntryValue]> {
 		if (!this.name || this.disabled || !this.value) return []
-		return [[this.name, this._trueValue]]
+		return [[this.name, this.trueValue]]
 	}
 
 	render() {

package/src/form/fields/chips/chips.ts

@@ -178,8 +178,8 @@ export default class SchmancyChips extends SchmancyFormField(css`
 		this.values$.next([])
 	}
 
-	protected firstUpdated(_changedProperties: PropertyValues): void {
-		super.firstUpdated(_changedProperties)
+	protected firstUpdated(changedProperties: PropertyValues): void {
+		super.firstUpdated(changedProperties)
 		this.updateChipStates(this.value$.value, this.values$.value)
 	}
 

package/src/form/fields/chips/filter-chip.ts

@@ -52,15 +52,15 @@ export class SchmancyFilterChip extends SchmancyElement {
 	value: string = ''
 
 	/** Whether the filter chip is selected (active filter) */
-	private _selected: boolean = false
+	#selected: boolean = false
 
 	@property({ type: Boolean, reflect: true })
 	get selected(): boolean {
-		return this._selected
+		return this.#selected
 	}
 	set selected(value: boolean) {
-		const oldValue = this._selected
-		this._selected = value
+		const oldValue = this.#selected
+		this.#selected = value
 		this.requestUpdate('selected', oldValue)
 	}
 
@@ -104,12 +104,12 @@ export class SchmancyFilterChip extends SchmancyElement {
 	protected updated(changed: Map<string, unknown>) {
 		super.updated?.(changed)
 		if (changed.has('value') || changed.has('selected')) {
-			this.internals?.setFormValue(this._selected ? (this.value || 'on') : null)
+			this.internals?.setFormValue(this.#selected ? (this.value || 'on') : null)
 		}
 	}
 
 	formResetCallback(): void {
-		this._selected = this.hasAttribute('selected')
+		this.#selected = this.hasAttribute('selected')
 	}
 
 	formDisabledCallback(disabled: boolean): void {
@@ -121,7 +121,7 @@ export class SchmancyFilterChip extends SchmancyElement {
 
 		this.dispatchEvent(
 			new CustomEvent('change', {
-				detail: { value: this.value, selected: !this._selected },
+				detail: { value: this.value, selected: !this.#selected },
 				bubbles: true,
 				composed: true,
 			}),
@@ -149,7 +149,7 @@ export class SchmancyFilterChip extends SchmancyElement {
 			e.preventDefault()
 			this.dispatchEvent(
 				new CustomEvent('change', {
-					detail: { value: this.value, selected: !this._selected },
+					detail: { value: this.value, selected: !this.#selected },
 					bubbles: true,
 					composed: true,
 				}),
@@ -175,14 +175,14 @@ export class SchmancyFilterChip extends SchmancyElement {
 			'min-h-[32px]': true,
 
 			// Background and text colors based on selection state
-			'bg-secondary-container': this._selected,
-			'text-secondary-onContainer': this._selected,
-			'bg-surface-container': !this._selected,
-			'text-surface-on': !this._selected,
+			'bg-secondary-container': this.#selected,
+			'text-secondary-onContainer': this.#selected,
+			'bg-surface-container': !this.#selected,
+			'text-surface-on': !this.#selected,
 
 			// Hover states
-			'hover:brightness-95': this._selected && !this.disabled,
-			'hover:bg-surface-containerHigh': !this._selected && !this.disabled,
+			'hover:brightness-95': this.#selected && !this.disabled,
+			'hover:bg-surface-containerHigh': !this.#selected && !this.disabled,
 
 			// Pressed state
 			'active:brightness-90': !this.disabled,
@@ -209,7 +209,7 @@ export class SchmancyFilterChip extends SchmancyElement {
 				@click=${this.handleClick}
 				@keydown=${this.handleKeyDown}
 				?disabled=${this.disabled}
-				aria-pressed=${this._selected ? 'true' : 'false'}
+				aria-pressed=${this.#selected ? 'true' : 'false'}
 				role="checkbox"
 				tabindex="0"
 			>

package/src/form/fields/date-range/date-range.ts

@@ -221,7 +221,7 @@ export class SchmancyDateRange extends SchmancyFormField() {
 			isValid ? undefined : message,
 		)
 
-		if (this._shouldShowError()) {
+		if (this.shouldShowError()) {
 			this.error = !isValid
 			this.validationMessage = message
 		}
@@ -528,7 +528,7 @@ export class SchmancyDateRange extends SchmancyFormField() {
 
 	render() {
 		// Step 6 — validity is two surfaces: when checkValidity() has flipped
-		// `error` (gated by `_shouldShowError`), the control must visibly carry
+		// `error` (gated by `shouldShowError`), the control must visibly carry
 		// the invalid treatment AND render the message. Platform validity is
 		// set in checkValidity(); this paints the user-facing half.
 		const showError = this.error && !!this.validationMessage

package/src/form/fields/input/input.ts

@@ -65,7 +65,7 @@ export default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {
 	// ----------------------------
 
 	/** Auto-incrementing counter for generating unique IDs */
-	static _idCounter = 0
+	static idCounter = 0
 
 	/** Override value to be string only for input element */
 	@property({ type: String, reflect: true })
@@ -171,7 +171,7 @@ export default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {
 	private isAutofilled = false
 
 	// `touched`, `dirty`, `submitted`, and `validateOn` come from FormFieldMixin.
-	// `_defaultValue` (mixin) replaces the old `defaultValue` field.
+	// `defaultValue` (mixin) replaces the old `defaultValue` field.
 
 	// ----------------------------
 	//  D) Form-associated logic
@@ -187,18 +187,18 @@ export default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {
 	 */
 	protected override willUpdate(changedProps: Map<PropertyKey, unknown>) {
 		if (!this.id) {
-			this.id = `sch-input-${SchmancyInput._idCounter++}`
+			this.id = `sch-input-${SchmancyInput.idCounter++}`
 		}
 		super.willUpdate(changedProps as never)
 	}
 
 
 	// `updated()` removed — FormFieldMixin's `willUpdate` recomputes `dirty`,
-	// triggers `checkValidity()` when `_shouldShowError()` is true, and updates
+	// triggers `checkValidity()` when `shouldShowError()` is true, and updates
 	// `:state(dirty)` automatically.
 	//
 	// Default value capture is also handled by the mixin (`firstUpdated` sets
-	// `_defaultValue` from `value`).
+	// `defaultValue` from `value`).
 
 	connectedCallback() {
 		super.connectedCallback()
@@ -250,7 +250,7 @@ export default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {
 	 * via `internals.setValidity` so consumers can target specific flags via
 	 * `field.validity.<flag>` and `:state(value-missing|type-mismatch|…)`.
 	 *
-	 * The visual `error` flag is still gated by the mixin's `_shouldShowError()`.
+	 * The visual `error` flag is still gated by the mixin's `shouldShowError()`.
 	 */
 	/**
 	 * Re-run checkValidity AFTER render so the native inner input's `.value`
@@ -278,7 +278,7 @@ export default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {
 	 * Order matches the natural priority of validity flags (valueMissing
 	 * before more specific ones — empty trumps malformed).
 	 */
-	private _firstMatchingErrorMessage(v: ValidityState): string | undefined {
+	private firstMatchingErrorMessage(v: ValidityState): string | undefined {
 		const m = this.errorMessages
 		if (!m) return undefined
 		if (v.valueMissing && m.valueMissing) return m.valueMissing
@@ -314,12 +314,12 @@ export default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {
 			}
 			// errorMessages override: pick the first matching flag and use the
 			// consumer-provided copy. Falls back to the native browser message.
-			const overrideMessage = this._firstMatchingErrorMessage(v)
+			const overrideMessage = this.firstMatchingErrorMessage(v)
 			this.internals?.setValidity(
 				flags,
 				overrideMessage || native.validationMessage || this.validationMessage || 'Invalid value',
 			)
-			if (this._shouldShowError()) {
+			if (this.shouldShowError()) {
 				this.error = true
 				// Always reflect the current flag's message — previous
 				// validationMessage may be stale (different flag).
@@ -440,7 +440,7 @@ export default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {
 				// Update component value
 				this.value = eventData.value
 
-				// `dirty` is a getter on the mixin (value vs _defaultValue) — no manual set.
+				// `dirty` is a getter on the mixin (value vs defaultValue) — no manual set.
 
 				// Fire custom 'input' event with extended details
 				const customEvent = new CustomEvent<EventDetails>('input', {
@@ -459,7 +459,7 @@ export default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {
 				this.dispatchEvent(customEvent)
 
 				// Mixin's willUpdate runs checkValidity() on value-change when
-				// _shouldShowError() is true — no manual validateInput() call.
+				// shouldShowError() is true — no manual validateInput() call.
 			})
 
 		// Subscribe to native change events (usually on blur)
@@ -539,7 +539,7 @@ export default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {
 				const { value } = ev.target as HTMLInputElement
 				this.value = value
 				this.isAutofilled = true
-				// `dirty` is a getter on the mixin — recomputes from value vs _defaultValue.
+				// `dirty` is a getter on the mixin — recomputes from value vs defaultValue.
 
 				// Dispatch autofill event for integration with autofill systems
 				this.dispatchEvent(

package/src/form/fields/radio-group/radio-button.ts

@@ -22,10 +22,10 @@ export class RadioButton extends SchmancyElement {
 		super.connectedCallback()
 		fromEvent<MouseEvent>(this, 'click')
 			.pipe(takeUntil(this.disconnecting))
-			.subscribe(this._handleClick)
+			.subscribe(this.handleClick)
 	}
 
-	private _handleClick = () => {
+	private handleClick = () => {
 		if (this.disabled) return
 		this.dispatchEvent(new CustomEvent('radio-button-click', {
 			detail: { value: this.value },

package/src/form/fields/radio-group/radio-group.ts

@@ -24,16 +24,16 @@ export class RadioGroup extends FormFieldMixin(SchmancyElement) {
 			.subscribe((e: CustomEvent<{ value: string }>) => {
 				this.value = e.detail.value
 				this.emitChange({ value: e.detail.value })
-				this._syncChildren()
+				this.syncChildren()
 			})
 	}
 
 	updated(changed: Map<string, unknown>) {
 		super.updated(changed)
-		if (changed.has('value')) this._syncChildren()
+		if (changed.has('value')) this.syncChildren()
 	}
 
-	private _syncChildren() {
+	private syncChildren() {
 		this.querySelectorAll<RadioButton>('schmancy-radio-button').forEach(btn => {
 			btn.checked = btn.value === this.value
 		})

package/src/form/fields/select/select.ts

@@ -52,28 +52,28 @@ export class SchmancySelect extends SchmancyFormField() {
 	@property({ type: String, reflect: true })
 	override get value(): string | string[] {
 		return this.multi
-			? (this._selectedValues$?.value ?? [])
-			: (this._selectedValue$?.value ?? '')
+			? (this.selectedValues$?.value ?? [])
+			: (this.selectedValue$?.value ?? '')
 	}
 	override set value(val: string | string[]) {
-		if (!this._selectedValue$ || !this._selectedValues$) return
+		if (!this.selectedValue$ || !this.selectedValues$) return
 		if (this.multi) {
 			const values = Array.isArray(val)
 				? val
 				: val ? String(val).split(',').map(v => v.trim()).filter(Boolean) : []
-			this._selectedValues$.next(values)
+			this.selectedValues$.next(values)
 		} else {
-			this._selectedValue$.next(val == null ? '' : String(val))
+			this.selectedValue$.next(val == null ? '' : String(val))
 		}
 	}
 
 	// Values property for multi-select mode
 	@property({ type: Array })
 	get values() {
-		return [...this._selectedValues$.value]
+		return [...this.selectedValues$.value]
 	}
 	set values(vals: string[]) {
-		this._selectedValues$.next(Array.isArray(vals) ? [...vals] : [])
+		this.selectedValues$.next(Array.isArray(vals) ? [...vals] : [])
 	}
 
 	@property({ type: Boolean }) multi = false
@@ -87,7 +87,7 @@ export class SchmancySelect extends SchmancyFormField() {
 	@state() private isValid = true
 
 	// Store the initial/default value for reset behavior. Distinct from the
-	// mixin's `_defaultValue` (which is `string` only); select needs the wider
+	// mixin's `defaultValue` (which is `string` only); select needs the wider
 	// shape so resetForm can restore arrays for multi-select.
 	@state() private selectDefaultValue: string | string[] = ''
 
@@ -97,10 +97,10 @@ export class SchmancySelect extends SchmancyFormField() {
 	private cleanupPositioner?: () => void
 
 	// Reactive state management
-	private _options$ = new BehaviorSubject<SchmancyOption[]>([])
-	private _selectedValue$ = new BehaviorSubject<string>('')
-	private _selectedValues$ = new BehaviorSubject<string[]>([])
-	private _optionSelect$ = new Subject<SchmancyOption>()
+	private options$ = new BehaviorSubject<SchmancyOption[]>([])
+	private selectedValue$ = new BehaviorSubject<string>('')
+	private selectedValues$ = new BehaviorSubject<string[]>([])
+	private optionSelect$ = new Subject<SchmancyOption>()
 
 	/**
 	 * Tracks whether the user has actively interacted (clicked/typed/keyed
@@ -108,10 +108,10 @@ export class SchmancySelect extends SchmancyFormField() {
 	 * blur). Used to gate dropdown-positioning side-effects on user-driven
 	 * actions versus programmatic state changes.
 	 */
-	@state() _userInteracted = false
+	@state() userInteracted = false
 
 	// Reference to current focused option (for keyboard navigation)
-	@state() private _focusedOptionId = ''
+	@state() private focusedOptionId = ''
 
 	override connectedCallback() {
 		super.connectedCallback()
@@ -126,7 +126,7 @@ export class SchmancySelect extends SchmancyFormField() {
 		fromEvent<KeyboardEvent>(this, 'keydown').pipe(takeUntil(this.disconnecting)).subscribe(this.handleKeyDown)
 
 		// Setup reactive pipelines
-		this._setupReactivePipelines()
+		this.setupReactivePipelines()
 	}
 
 	override disconnectedCallback() {
@@ -153,12 +153,12 @@ export class SchmancySelect extends SchmancyFormField() {
 			// mixin's willUpdate already called setFormValue with the raw
 			// value, override here for the joined-string shape.
 			const formValue = this.multi
-				? this._selectedValues$.value.join(',')
-				: this._selectedValue$.value
+				? this.selectedValues$.value.join(',')
+				: this.selectedValue$.value
 			this.internals?.setFormValue(formValue)
 
-			// `dirty` is a mixin getter (value !== _defaultValue); no manual flag.
-			// Mixin's willUpdate already calls checkValidity when _shouldShowError().
+			// `dirty` is a mixin getter (value !== defaultValue); no manual flag.
+			// Mixin's willUpdate already calls checkValidity when shouldShowError().
 		}
 
 		// When open state changes, setup or cleanup the dropdown positioner
@@ -171,12 +171,12 @@ export class SchmancySelect extends SchmancyFormField() {
 		}
 	}
 
-	// `shouldShowValidation` removed — replaced by mixin's `_shouldShowError()`.
+	// `shouldShowValidation` removed — replaced by mixin's `shouldShowError()`.
 
 	private syncSelection() {
 		if (this.multi) {
 			// Read directly from the BehaviorSubject to avoid string conversion issues
-			const selectedValues = this._selectedValues$.value
+			const selectedValues = this.selectedValues$.value
 			this.options?.forEach(o => (o.selected = selectedValues.includes(o.value))) // Update option selected state
 			this.valueLabel =
 				selectedValues.length > 0
@@ -187,7 +187,7 @@ export class SchmancySelect extends SchmancyFormField() {
 					: this.placeholder
 		} else {
 			// Single select - read from BehaviorSubject
-			const currentValue = this._selectedValue$.value
+			const currentValue = this.selectedValue$.value
 			this.options?.forEach(o => {
 				// Set selected property on each option based on matching value
 				o.selected = o.value === currentValue
@@ -209,7 +209,7 @@ export class SchmancySelect extends SchmancyFormField() {
 
 			option.setAttribute(
 				'aria-selected',
-				String(this.multi ? this._selectedValues$.value.includes(option.value) : option.value === this._selectedValue$.value),
+				String(this.multi ? this.selectedValues$.value.includes(option.value) : option.value === this.selectedValue$.value),
 			)
 		})
 	}
@@ -266,7 +266,7 @@ export class SchmancySelect extends SchmancyFormField() {
 
 		// Find current focused option
 		const options = Array.from(this.options || [])
-		const current = options.findIndex(o => o.id === this._focusedOptionId) ?? -1
+		const current = options.findIndex(o => o.id === this.focusedOptionId) ?? -1
 
 		switch (e.key) {
 			case 'Escape':
@@ -292,8 +292,8 @@ export class SchmancySelect extends SchmancyFormField() {
 			case 'Enter':
 			case ' ':
 				e.preventDefault()
-				if (this._focusedOptionId) {
-					const focusedOption = options.find(opt => opt.id === this._focusedOptionId)
+				if (this.focusedOptionId) {
+					const focusedOption = options.find(opt => opt.id === this.focusedOptionId)
 					if (focusedOption) {
 						this.handleOptionSelect(focusedOption.value)
 					}
@@ -309,7 +309,7 @@ export class SchmancySelect extends SchmancyFormField() {
 		const option = options[index]
 		if (option) {
 			option.focus()
-			this._focusedOptionId = option.id
+			this.focusedOptionId = option.id
 
 			// Update aria-activedescendant on the combobox
 			const combobox = this.renderRoot.querySelector('.trigger')
@@ -349,7 +349,7 @@ export class SchmancySelect extends SchmancyFormField() {
 
 		// Focus first or selected option
 		const options = Array.from(this.options || [])
-		const selectedIndex = this.multi ? 0 : options.findIndex(o => o.value === this._selectedValue$.value)
+		const selectedIndex = this.multi ? 0 : options.findIndex(o => o.value === this.selectedValue$.value)
 
 		this.focusOption(options, Math.max(selectedIndex, 0))
 
@@ -361,12 +361,12 @@ export class SchmancySelect extends SchmancyFormField() {
 	private closeDropdown() {
 		// Only mark as touched if the user actually interacted with the component
 		// and made a selection or explicitly closed it without selecting
-		if (this._userInteracted) {
+		if (this.userInteracted) {
 			this.touched = true
 		}
 
 		this.isOpen = false
-		this._focusedOptionId = ''
+		this.focusedOptionId = ''
 
 		// Update combobox to remove aria-activedescendant
 		const combobox = this.renderRoot.querySelector<HTMLElement>('.trigger')
@@ -377,12 +377,12 @@ export class SchmancySelect extends SchmancyFormField() {
 
 		// Only check validity when closing if the user has actually interacted
 		// with the component and validation should be shown
-		if (this._userInteracted && this._shouldShowError()) {
+		if (this.userInteracted && this.shouldShowError()) {
 			this.checkValidity()
 		}
 	}
 
-	private _setupReactivePipelines() {
+	private setupReactivePipelines() {
 		// Listen for option-select events from child options
 		fromEvent<CustomEvent>(this, 'option-select')
 			.pipe(
@@ -390,7 +390,7 @@ export class SchmancySelect extends SchmancyFormField() {
 					e.stopPropagation() // Prevent event from bubbling further
 					const option = this.options.find(o => o.value === e.detail.value)
 					if (option) {
-						this._optionSelect$.next(option)
+						this.optionSelect$.next(option)
 					}
 				}),
 				takeUntil(this.disconnecting)
@@ -398,11 +398,11 @@ export class SchmancySelect extends SchmancyFormField() {
 			.subscribe()
 
 		// Handle option selection through reactive pipeline
-		this._optionSelect$
+		this.optionSelect$
 			.pipe(
-				withLatestFrom(this._selectedValue$, this._selectedValues$),
+				withLatestFrom(this.selectedValue$, this.selectedValues$),
 				tap(([option, _, currentValues]) => {
-					this._userInteracted = true
+					this.userInteracted = true
 					this.markTouched()
 					// `dirty` is a mixin getter; setting `value` below triggers it
 
@@ -411,7 +411,7 @@ export class SchmancySelect extends SchmancyFormField() {
 						const newValues = index > -1
 							? [...currentValues.slice(0, index), ...currentValues.slice(index + 1)]
 							: [...currentValues, option.value]
-						this._selectedValues$.next(newValues)
+						this.selectedValues$.next(newValues)
 
 						// Update form value
 						this.internals?.setFormValue(newValues.join(','))
@@ -425,7 +425,7 @@ export class SchmancySelect extends SchmancyFormField() {
 							: this.placeholder
 					} else {
 						// Single select
-						this._selectedValue$.next(option.value)
+						this.selectedValue$.next(option.value)
 
 						// Update form value
 						this.internals?.setFormValue(option.value)
@@ -438,14 +438,14 @@ export class SchmancySelect extends SchmancyFormField() {
 					this.setupOptionsAccessibility()
 
 					// Dispatch change event
-					this._fireChangeEvent()
+					this.fireChangeEvent()
 				}),
 				takeUntil(this.disconnecting)
 			)
 			.subscribe()
 
 		// Options management pipeline - bind pointerdown events exactly like autocomplete
-		this._options$
+		this.options$
 			.pipe(
 				tap((options) => {
 					options.forEach((option, index) => {
@@ -463,7 +463,7 @@ export class SchmancySelect extends SchmancyFormField() {
 									e.stopPropagation()
 								}),
 								takeUntil(this.disconnecting)
-							).subscribe(() => this._optionSelect$.next(option))
+							).subscribe(() => this.optionSelect$.next(option))
 							option.setAttribute('data-event-bound', 'true')
 						}
 					})
@@ -473,7 +473,7 @@ export class SchmancySelect extends SchmancyFormField() {
 			.subscribe()
 
 		// Selection sync pipeline - sync selected states with value changes
-		combineLatest([this._selectedValue$, this._selectedValues$, this._options$])
+		combineLatest([this.selectedValue$, this.selectedValues$, this.options$])
 			.pipe(
 				tap(([singleValue, multiValues, options]) => {
 					if (options.length === 0) return
@@ -497,13 +497,13 @@ export class SchmancySelect extends SchmancyFormField() {
 		// This method is now called from keyboard navigation only
 		const option = this.options.find(o => o.value === value)
 		if (option) {
-			this._optionSelect$.next(option)
+			this.optionSelect$.next(option)
 		}
 	}
 
-	private _fireChangeEvent() {
+	private fireChangeEvent() {
 		// Get the current value based on multi/single mode
-		const value = this.multi ? this._selectedValues$.value : this._selectedValue$.value
+		const value = this.multi ? this.selectedValues$.value : this.selectedValue$.value
 
 		// Dispatch only one change event with the value in detail
 		this.dispatchEvent(
@@ -526,8 +526,8 @@ export class SchmancySelect extends SchmancyFormField() {
 
 		// Determine if the select is empty based on whether it's multi-select or single-select
 		const isEmpty = this.multi
-			? this._selectedValues$.value.length === 0
-			: !this._selectedValue$.value
+			? this.selectedValues$.value.length === 0
+			: !this.selectedValue$.value
 
 		// Check if the value is valid (not empty when required)
 		const isValid = !(this.required && isEmpty)
@@ -546,7 +546,7 @@ export class SchmancySelect extends SchmancyFormField() {
 
 		// Update the input component to reflect our validation state
 		if (this.inputRef && this.hasUpdated) {
-			const showError = !this.isValid && this._shouldShowError()
+			const showError = !this.isValid && this.shouldShowError()
 			this.inputRef.error = showError
 			this.inputRef.hint = showError ? this.validationMessage : this.hint
 		}
@@ -582,7 +582,7 @@ export class SchmancySelect extends SchmancyFormField() {
 
 	// `markTouched`, `markSubmitted`, `touched`, `dirty`, `pristine`, `submitted`,
 	// `error` (storage) — all from the mixin. Select's `error` semantics
-	// (errors-while-open suppression) live in render() via _shouldShowError() +
+	// (errors-while-open suppression) live in render() via shouldShowError() +
 	// !isOpen, not as a separate getter.
 
 	/**
@@ -610,7 +610,7 @@ export class SchmancySelect extends SchmancyFormField() {
 		}
 
 		// Update input if needed
-		if (this.inputRef && this._shouldShowError()) {
+		if (this.inputRef && this.shouldShowError()) {
 			this.inputRef.error = !this.isValid
 			this.inputRef.hint = !this.isValid ? this.validationMessage : this.hint
 		}
@@ -622,12 +622,12 @@ export class SchmancySelect extends SchmancyFormField() {
 	 * select-specific cleanup (value subjects, label, validity).
 	 */
 	override resetForm(): void {
-		// Restore value (multi-aware) before super so the mixin's _defaultValue
+		// Restore value (multi-aware) before super so the mixin's defaultValue
 		// reset doesn't clobber the array-shape we need.
 		this.value = this.selectDefaultValue
 		this.valueLabel = this.placeholder
 		this.isValid = true
-		this._userInteracted = false
+		this.userInteracted = false
 		this.internals?.setValidity({})
 		super.resetForm()
 		if (this.inputRef) {
@@ -644,7 +644,7 @@ export class SchmancySelect extends SchmancyFormField() {
 	render(): TemplateResult {
 		// Determine if we should show errors based on the validation strategy and interaction
 		// Never show errors on initial render or if the dropdown is open
-		const showErrors = !this.isValid && this._shouldShowError() && !this.isOpen
+		const showErrors = !this.isValid && this.shouldShowError() && !this.isOpen
 
 		// Add caret icon based on open state
 		const caretIcon = this.isOpen
@@ -663,7 +663,7 @@ export class SchmancySelect extends SchmancyFormField() {
 					aria-controls="options"
 					aria-autocomplete="none"
 					aria-required=${this.required}
-					aria-activedescendant=${ifDefined(this._focusedOptionId || undefined)}
+					aria-activedescendant=${ifDefined(this.focusedOptionId || undefined)}
 					aria-disabled=${this.disabled}
 					.label=${this.label}
 					.placeholder=${this.placeholder}
@@ -690,7 +690,7 @@ export class SchmancySelect extends SchmancyFormField() {
 							this.openDropdown(false)
 						} else {
 							// Mark as interacted when they close the dropdown
-							this._userInteracted = true
+							this.userInteracted = true
 							this.closeDropdown()
 						}
 					}}
@@ -718,7 +718,7 @@ export class SchmancySelect extends SchmancyFormField() {
 				>
 					<slot
 						@slotchange=${() => {
-							this._options$.next(this.options)
+							this.options$.next(this.options)
 							// Sync selection state when options re-render
 							this.syncSelection()
 						}}