refactor(shared): ComboControl owns its NumericControl + ControlLabels contract
This commit is contained in:
@@ -4,7 +4,6 @@
|
||||
that opens a vertical slider popover.
|
||||
-->
|
||||
<script lang="ts">
|
||||
import type { TypographyControl } from '$shared/lib';
|
||||
import { cn } from '$shared/lib';
|
||||
import { Slider } from '$shared/ui';
|
||||
import { Button } from '$shared/ui/Button';
|
||||
@@ -12,12 +11,16 @@ import MinusIcon from '@lucide/svelte/icons/minus';
|
||||
import PlusIcon from '@lucide/svelte/icons/plus';
|
||||
import { Popover } from 'bits-ui';
|
||||
import TechText from '../TechText/TechText.svelte';
|
||||
import type {
|
||||
ControlLabels,
|
||||
NumericControl,
|
||||
} from './types';
|
||||
|
||||
interface Props {
|
||||
interface Props extends ControlLabels {
|
||||
/**
|
||||
* Typography control
|
||||
* Bounded numeric control to render
|
||||
*/
|
||||
control: TypographyControl;
|
||||
control: NumericControl;
|
||||
/**
|
||||
* Control label
|
||||
*/
|
||||
@@ -31,20 +34,6 @@ interface Props {
|
||||
* @default false
|
||||
*/
|
||||
reduced?: boolean;
|
||||
/**
|
||||
* Increase button label
|
||||
* @default 'Increase'
|
||||
*/
|
||||
increaseLabel?: string;
|
||||
/**
|
||||
* Decrease button label
|
||||
* @default 'Decrease'
|
||||
*/
|
||||
decreaseLabel?: string;
|
||||
/**
|
||||
* Control aria label
|
||||
*/
|
||||
controlLabel?: string;
|
||||
}
|
||||
|
||||
let {
|
||||
|
||||
@@ -0,0 +1,60 @@
|
||||
/**
|
||||
* Structural contract for the bounded numeric control ComboControl renders.
|
||||
*
|
||||
* ComboControl depends only on this shape — never on a concrete factory.
|
||||
* The typography control factory in features/AdjustTypography produces a value
|
||||
* conforming to it; any other conforming object works equally well.
|
||||
*/
|
||||
export interface NumericControl {
|
||||
/**
|
||||
* Current value. The setter is expected to clamp to [min, max] and round to step.
|
||||
*/
|
||||
value: number;
|
||||
/**
|
||||
* Lower inclusive bound
|
||||
*/
|
||||
readonly min: number;
|
||||
/**
|
||||
* Upper inclusive bound
|
||||
*/
|
||||
readonly max: number;
|
||||
/**
|
||||
* Increment/decrement precision
|
||||
*/
|
||||
readonly step: number;
|
||||
/**
|
||||
* True when the value is at or below min
|
||||
*/
|
||||
readonly isAtMin: boolean;
|
||||
/**
|
||||
* True when the value is at or above max
|
||||
*/
|
||||
readonly isAtMax: boolean;
|
||||
/**
|
||||
* Increase the value by one step (clamped to max)
|
||||
*/
|
||||
increase(): void;
|
||||
/**
|
||||
* Decrease the value by one step (clamped to min)
|
||||
*/
|
||||
decrease(): void;
|
||||
}
|
||||
|
||||
/**
|
||||
* Accessibility label fields. Single source of truth — composed by both
|
||||
* ComboControl.Props and the typography ControlModel so they never drift.
|
||||
*/
|
||||
export interface ControlLabels {
|
||||
/**
|
||||
* Screen-reader label for the increase button
|
||||
*/
|
||||
increaseLabel?: string;
|
||||
/**
|
||||
* Screen-reader label for the decrease button
|
||||
*/
|
||||
decreaseLabel?: string;
|
||||
/**
|
||||
* Overall label describing the control's purpose (also the aria fallback)
|
||||
*/
|
||||
controlLabel?: string;
|
||||
}
|
||||
@@ -28,6 +28,16 @@ export {
|
||||
*/
|
||||
default as ComboControl,
|
||||
} from './ComboControl/ComboControl.svelte';
|
||||
export type {
|
||||
/**
|
||||
* Accessibility label fields shared by ComboControl and control models
|
||||
*/
|
||||
ControlLabels,
|
||||
/**
|
||||
* Structural contract for the bounded numeric control ComboControl renders
|
||||
*/
|
||||
NumericControl,
|
||||
} from './ComboControl/types';
|
||||
export {
|
||||
/**
|
||||
* Rich text input using contenteditable attribute
|
||||
|
||||
Reference in New Issue
Block a user