grassroot
Install

DocsAPI referenceUI machinesquantity-stepper

quantity-stepper machine

The public state machine contract for @grassroot/ui-machines/quantity-stepper. The machine owns behaviour; the matching headless layer owns composition.

@grassroot/ui-machines/quantity-stepper

Package

10 exports
View source packages/ui-machines/src/quantity-stepper/index.ts

Service example

quantity-stepper.tsts
import { createService } from "@grassroot/statechart";
import { quantityStepperMachine } from "@grassroot/ui-machines/quantity-stepper";
 
const service = createService(quantityStepperMachine, { input: {} });
service.start();
service.send({ type: "…" });
service.stop();

Exports

QuantityStepperCommand

type
DeclarationView source
QuantityStepperCommandts
type QuantityStepperCommand = CommandObject & {
  readonly type: "VALUE_CHANGE_REQUEST";
  readonly value: number;
  readonly reason: QuantityStepperReason;
};
Name
Kind
Type
Requirement
reason
property
QuantityStepperReason
required
type
property
string
required
value
property
number
required
Name
reason
Kind
property
Type
QuantityStepperReason
Requirement
required
Name
type
Kind
property
Type
string
Requirement
required
Name
value
Kind
property
Type
number
Requirement
required

QuantityStepperContext

type
DeclarationView source
QuantityStepperContextts
type QuantityStepperContext = {
  readonly value: number;
  readonly mode: BindingMode;
};
Name
Kind
Type
Requirement
mode
property
BindingMode
required
value
property
number
required
Name
mode
Kind
property
Type
BindingMode
Requirement
required
Name
value
Kind
property
Type
number
Requirement
required

QuantityStepperDiagnosticCodes

value
DeclarationView source
QuantityStepperDiagnosticCodests
export declare const QuantityStepperDiagnosticCodes: readonly DiagnosticCatalogueEntry[];

QuantityStepperEvent

type
DeclarationView source
QuantityStepperEventts
type QuantityStepperEvent = {
  readonly type: "SET";
  readonly value: number;
  readonly reason: QuantityStepperReason;
} | {
  readonly type: "INCREMENT";
  readonly reason: QuantityStepperReason;
} | {
  readonly type: "DECREMENT";
  readonly reason: QuantityStepperReason;
} | {
  readonly type: "RESET";
};

QuantityStepperInput

type
DeclarationView source
QuantityStepperInputts
type QuantityStepperInput = {
  readonly min?: number;
  readonly max?: number;
  readonly step?: number;
  readonly value?: number;
  readonly defaultValue?: number;
  readonly disabled?: boolean;
};
Name
Kind
Type
Requirement
defaultValue
property
number
optional
disabled
property
boolean
optional
max
property
number
optional
min
property
number
optional
step
property
number
optional
value
property
number
optional
Name
defaultValue
Kind
property
Type
number
Requirement
optional
Name
disabled
Kind
property
Type
boolean
Requirement
optional
Name
max
Kind
property
Type
number
Requirement
optional
Name
min
Kind
property
Type
number
Requirement
optional
Name
step
Kind
property
Type
number
Requirement
optional
Name
value
Kind
property
Type
number
Requirement
optional

quantityStepperMachine

value
DeclarationView source
quantityStepperMachinets
export declare const quantityStepperMachine: Machine<QuantityStepperInput, "ready", QuantityStepperContext, QuantityStepperEvent, QuantityStepperCommand>;

QuantityStepperReason

type
DeclarationView source
QuantityStepperReasonts
type QuantityStepperReason = "pointer" | "keyboard" | "programmatic";

quantityStepperReplaySequence

value
DeclarationView source
quantityStepperReplaySequencets
export declare const quantityStepperReplaySequence: readonly QuantityStepperEvent[];

quantityStepperSelectors

value
DeclarationView source
quantityStepperSelectorsts
export declare const quantityStepperSelectors: {
  value: (snapshot: QuantityStepperSnapshot) => number;
};
Name
Kind
Type
Requirement
value
property
(snapshot: QuantityStepperSnapshot) => number
required
Name
value
Kind
property
Type
(snapshot: QuantityStepperSnapshot) => number
Requirement
required

QuantityStepperSnapshot

type
DeclarationView source
QuantityStepperSnapshotts
type QuantityStepperSnapshot = Snapshot<"ready", QuantityStepperContext>;