goobs-frontend
Version:
A comprehensive React-based libary for building modern web applications
103 lines • 4.6 kB
TypeScript
import { default as React } from 'react';
import { FieldStyleOverrides } from '../../Shell';
/**
* Props for the internal mask-stepper field that SubnetField composes.
* Renamed from `InternalIncrementNumberFieldProps`, which collided with the
* barrel-exported interface of `Field/Number/InternalIncrement` (a different
* shape). Internal to this module — SubnetField callers use SubnetFieldProps.
*/
export interface SubnetMaskIncrementFieldProps {
/** Seed CIDR for the internal mask state (default '16'), clamped to min/max. */
initialValue?: string;
/**
* Emits the new mask CIDR as a number. Was previously polymorphic
* `(event | number) => void` — collapsed to `(value: number) => void`
* during the FieldShell migration.
*/
onChange?: (value: number) => void;
label?: string;
required?: boolean;
disabled?: boolean;
min?: number;
max?: number;
initialDelay?: number;
repeatInterval?: number;
maskType?: 'subnet' | 'supernet';
style?: React.CSSProperties;
helperText?: string;
/** Error message rendered below the input; sets aria-invalid. */
error?: string | boolean;
/** Stable test selector — emitted as `data-field` on the wrapper. */
dataField?: string;
/** Stable test selector — emitted as `data-field-name` on the wrapper. */
dataFieldName?: string;
styles?: FieldStyleOverrides;
onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
onClick?: (event: React.MouseEvent<HTMLInputElement>) => void;
placeholder?: string;
id?: string;
name?: string;
autoComplete?: string;
}
/** The structural value of a SubnetField: an IPv4 address plus a CIDR mask length. */
export interface SubnetFieldValue {
address: string;
mask: number;
}
export interface SubnetFieldProps {
/**
* Object payload — `{ address, mask }` is the value of a SubnetField.
* Kept structural rather than primitive because address + mask are
* jointly meaningful (a /24 with no address is meaningless, etc.).
*/
value: SubnetFieldValue;
/**
* Emits the updated `{ address, mask }` object — the plain value, not a
* DOM event — on every mask change.
*/
onChange: (value: SubnetFieldValue) => void;
/** Field label on the mask stepper (default 'Subnet'). */
label?: string;
required?: boolean;
/** Mask (CIDR) lower clamp. Defaults 16 for maskType 'subnet', 8 for 'supernet'. */
min?: number;
/** Mask (CIDR) upper clamp. Defaults 32 for maskType 'subnet', 23 for 'supernet'. */
max?: number;
/** Selects the default mask bracket: 'subnet' (/16–/32, default) or 'supernet' (/8–/23). */
maskType?: 'subnet' | 'supernet';
/** Inline style on the outer wrapper div. */
style?: React.CSSProperties;
/** Parent supernet address. With `supernetMask`, the subnet is validated to sit inside its range and the available range is displayed. */
supernetAddress?: string;
/** Parent supernet mask — a CIDR number-string or dotted-decimal — paired with `supernetAddress`. */
supernetMask?: string;
disabled?: boolean;
helperText?: string;
/** Error message rendered below the input; sets aria-invalid. */
error?: string | boolean;
/** Stable test selector — emitted as `data-field` on the wrapper. */
dataField?: string;
/** Stable test selector — emitted as `data-field-name` on the wrapper. */
dataFieldName?: string;
/**
* Form-engine binding key. Inside a `<Form>` with `name` set and no explicit
* `value`, the `{ address, mask }` object is read from / written to the form
* engine. Outside a form (every existing callsite passes an explicit
* `value`) this is inert and behaviour is byte-for-byte unchanged.
*/
name?: string;
styles?: FieldStyleOverrides;
}
/**
* Subnet editor: a dotted-decimal mask display with press-and-hold +/- CIDR
* stepper buttons (built on FieldShell) plus a live CIDR/host-count summary,
* and an out-of-range error when the subnet falls outside the optional
* supernet. `onChange` emits the plain `{ address, mask }` object — not a DOM
* event. Auto-binds that object by `name` inside a goobs `<Form>` when no
* explicit `value` is passed; otherwise controlled via `value`.
*/
declare const SubnetField: React.FC<SubnetFieldProps>;
export default SubnetField;
//# sourceMappingURL=index.d.ts.map