cx 26.0.1 → 26.0.3

package/build/widgets/form/ValidationError.d.ts

@@ -0,0 +1,27 @@
+/** @jsxImportSource react */
+import type { Instance } from "../../ui/Instance";
+import type { RenderingContext } from "../../ui/RenderingContext";
+import { Widget } from "../../ui/Widget";
+import type { FormRenderingContext } from "./ValidationGroup";
+interface ValidationErrorData {
+    visible?: boolean;
+    classNames?: string;
+    fieldId?: string;
+    errorMessage?: string;
+    style?: Record<string, string | number> | string;
+}
+interface ValidationErrorInstance extends Instance {
+    lastError?: {
+        fieldId: string;
+        message: string;
+        visited: boolean;
+        type: string;
+    };
+    data: ValidationErrorData;
+}
+export declare class ValidationError extends Widget {
+    checkVisible(context: FormRenderingContext, instance: ValidationErrorInstance, data: ValidationErrorData): boolean;
+    explore(context: FormRenderingContext, instance: ValidationErrorInstance): void;
+    render(context: RenderingContext, instance: ValidationErrorInstance, key: string): React.ReactElement;
+}
+export {};

package/build/widgets/form/ValidationError.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Widget } from "../../ui/Widget";
+export class ValidationError extends Widget {
+    checkVisible(context, instance, data) {
+        if (data.visible &&
+            context.lastFieldId &&
+            context.validation &&
+            context.validation.errors &&
+            context.validation.errors.length > 0) {
+            var lastError = (instance.lastError = context.validation.errors[context.validation.errors.length - 1]);
+            return lastError.fieldId == context.lastFieldId && lastError.visited;
+        }
+        return false;
+    }
+    explore(context, instance) {
+        var { data, lastError } = instance;
+        let c1 = instance.cache("lastErrorMessage", lastError?.message);
+        let c2 = instance.cache("lastErrorFieldId", lastError?.fieldId);
+        if (c1 || c2) {
+            data.errorMessage = lastError?.message;
+            data.fieldId = lastError?.fieldId;
+            instance.markShouldUpdate(context);
+        }
+        super.explore(context, instance);
+    }
+    render(context, instance, key) {
+        var { data } = instance;
+        return (_jsx("label", { className: data.classNames, htmlFor: data.fieldId, style: data.style, children: data.errorMessage }, key));
+    }
+}
+ValidationError.prototype.baseClass = "validationerror";
+ValidationError.prototype.styled = true;
+Widget.alias("validation-error", ValidationError);

package/build/widgets/form/ValidationGroup.d.ts

@@ -0,0 +1,63 @@
+import { RenderingContext } from "../../ui/RenderingContext";
+import type { Instance } from "../../ui/Instance";
+import { PureContainerBase, PureContainerConfig } from "../../ui/PureContainer";
+import { BooleanProp, Prop } from "../../ui/Prop";
+/** Typed context interface for form-related context properties */
+export interface FormRenderingContext extends RenderingContext {
+    parentDisabled?: boolean;
+    parentReadOnly?: boolean;
+    parentViewMode?: boolean | string;
+    parentTabOnEnterKey?: boolean;
+    parentVisited?: boolean;
+    parentStrict?: boolean;
+    parentAsterisk?: boolean;
+    validation?: {
+        errors: ValidationErrorData[];
+    };
+    lastFieldId?: string;
+}
+export interface ValidationErrorData {
+    fieldId: string;
+    message: string;
+    visited: boolean;
+    type: string;
+}
+export interface ValidationGroupInstance extends Instance {
+    validation: {
+        errors: ValidationErrorData[];
+    };
+    valid?: boolean;
+}
+export interface ValidationGroupConfig extends PureContainerConfig {
+    /** Binding used to store validation errors in the store. */
+    errors?: Prop<ValidationErrorData[]>;
+    /** Binding which will be set to true if all child form field are valid. */
+    valid?: BooleanProp;
+    /** Binding which will be set to true if any of child form field reports validation error. */
+    invalid?: BooleanProp;
+    /** Set to `false` to disable all inner elements that support `disabled` property. */
+    enabled?: BooleanProp;
+    /** Set to `true` to disable all inner elements that support `disabled` property. */
+    disabled?: BooleanProp;
+    /** Set to `true` to make read-only all inner elements that support `readOnly` property. */
+    readOnly?: BooleanProp;
+    /** Set to `true` to isolate children from participating in outer validation scopes. */
+    isolated?: BooleanProp;
+    /** Set to `true` to notify all children to report errors. */
+    visited?: BooleanProp;
+    /** Set to `true` to tab on Enter key for all children. */
+    tabOnEnterKey?: BooleanProp;
+    /** Set to `true` to set all child fields to view mode. */
+    viewMode?: BooleanProp;
+    /** Set to `true` to force children to respect disabled, readOnly, viewMode and visited flags set on the group level. */
+    strict?: BooleanProp;
+    /** Set to `true` to add red asterisk for all required fields inside the group. */
+    asterisk?: BooleanProp;
+}
+export declare class ValidationGroup<TConfig extends ValidationGroupConfig = ValidationGroupConfig> extends PureContainerBase<TConfig, ValidationGroupInstance> {
+    errors?: Prop<ValidationErrorData[]>;
+    isolated?: boolean;
+    declareData(...args: Record<string, unknown>[]): void;
+    explore(context: FormRenderingContext, instance: ValidationGroupInstance): void;
+    exploreCleanup(context: FormRenderingContext, instance: ValidationGroupInstance): void;
+}

package/build/widgets/form/ValidationGroup.js

@@ -0,0 +1,58 @@
+import { Widget } from "../../ui/Widget";
+import { PureContainerBase } from "../../ui/PureContainer";
+import { isDefined } from "../../util/isDefined";
+import { shallowEquals } from "../../util/shallowEquals";
+import { coalesce } from "../../util/coalesce";
+export class ValidationGroup extends PureContainerBase {
+    declareData(...args) {
+        super.declareData(...args, {
+            errors: undefined,
+            valid: undefined,
+            invalid: undefined,
+            disabled: undefined,
+            enabled: undefined,
+            readOnly: undefined,
+            viewMode: undefined,
+            tabOnEnterKey: undefined,
+            isolated: undefined,
+            visited: undefined,
+            strict: undefined,
+            asterisk: undefined,
+        });
+    }
+    explore(context, instance) {
+        if (isDefined(instance.data.enabled))
+            instance.data.disabled = !instance.data.enabled;
+        instance.validation = {
+            errors: [],
+        };
+        context.push("parentStrict", coalesce(instance.data.strict, context.parentStrict));
+        context.push("parentDisabled", coalesce(instance.data.disabled, context.parentDisabled));
+        context.push("parentReadOnly", coalesce(instance.data.readOnly, context.parentReadOnly));
+        context.push("parentViewMode", coalesce(instance.data.viewMode, context.parentViewMode));
+        context.push("parentTabOnEnterKey", coalesce(instance.data.tabOnEnterKey, context.parentTabOnEnterKey));
+        context.push("parentVisited", coalesce(instance.data.visited, context.parentVisited));
+        context.push("parentAsterisk", coalesce(instance.data.asterisk, context.parentAsterisk));
+        context.push("validation", instance.validation);
+        super.explore(context, instance);
+    }
+    exploreCleanup(context, instance) {
+        context.pop("validation");
+        context.pop("parentVisited");
+        context.pop("parentDisabled");
+        context.pop("parentReadOnly");
+        context.pop("parentViewMode");
+        context.pop("parentTabOnEnterKey");
+        context.pop("parentStrict");
+        context.pop("parentAsterisk");
+        instance.valid = instance.validation.errors.length == 0;
+        if (!instance.valid && !this.isolated && context.validation)
+            context.validation.errors.push(...instance.validation.errors);
+        instance.set("valid", instance.valid);
+        instance.set("invalid", !instance.valid);
+        if (this.errors && !shallowEquals(instance.data.errors, instance.validation.errors))
+            instance.set("errors", instance.validation.errors);
+    }
+}
+ValidationGroup.prototype.isolated = false;
+Widget.alias("validation-group", ValidationGroup);

package/build/widgets/form/ValidationGroup.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/build/widgets/form/ValidationGroup.spec.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx, jsxs as _jsxs } from "cx/jsx-runtime";
+import { Store } from "../../data/Store";
+import { ValidationGroup } from "./ValidationGroup";
+import { Validator } from "./Validator";
+import { bind } from "../../ui/bind";
+import { createTestRenderer } from "../../util/test/createTestRenderer";
+import assert from "assert";
+describe("ValidationGroup", () => {
+    it("performs validation and sets the flags", () => {
+        let widget = (_jsx("cx", { children: _jsxs(ValidationGroup, { invalid: bind("invalid"), valid: bind("valid"), children: [_jsx(Validator, { onValidate: () => "Something is wrong..." }), _jsx("div", { visible: bind("invalid"), children: "Invalid" })] }) }));
+        let store = new Store();
+        const component = createTestRenderer(store, widget);
+        let tree = component.toJSON();
+        assert(tree && !Array.isArray(tree));
+        assert.equal(tree.type, "div");
+        assert.equal(store.get("invalid"), true);
+        assert.equal(store.get("valid"), false);
+    });
+    it("nested validation works", () => {
+        let widget = (_jsx("cx", { children: _jsx("div", { children: _jsxs(ValidationGroup, { invalid: bind("invalid"), children: [_jsx(ValidationGroup, { invalid: bind("invalid1"), children: _jsx(Validator, { onValidate: () => "Something is wrong..." }) }), _jsx(ValidationGroup, { invalid: bind("invalid2"), children: _jsx(Validator, { onValidate: () => false }) })] }) }) }));
+        let store = new Store();
+        const component = createTestRenderer(store, widget);
+        let tree = component.toJSON();
+        assert.equal(store.get("invalid"), true);
+        assert.equal(store.get("invalid1"), true);
+        assert.equal(store.get("invalid2"), false);
+    });
+    it("isolated validation group does not affect the parent", () => {
+        let widget = (_jsx("cx", { children: _jsx("div", { children: _jsxs(ValidationGroup, { invalid: bind("invalid"), children: [_jsx(ValidationGroup, { invalid: bind("invalid1"), isolated: true, children: _jsx(Validator, { onValidate: () => "Something is wrong..." }) }), _jsx(ValidationGroup, { invalid: bind("invalid2"), children: _jsx(Validator, { onValidate: () => false }) })] }) }) }));
+        let store = new Store();
+        const component = createTestRenderer(store, widget);
+        let tree = component.toJSON();
+        assert.equal(store.get("invalid"), false);
+        assert.equal(store.get("invalid1"), true);
+        assert.equal(store.get("invalid2"), false);
+    });
+    it("visited flag is propagated into nested validation groups", () => {
+        let visited = false;
+        let widget = (_jsx("cx", { children: _jsx("div", { children: _jsx(ValidationGroup, { visited: true, children: _jsx(ValidationGroup, { children: _jsx("div", { onExplore: (context, instance) => {
+                                if (context.parentVisited)
+                                    visited = true;
+                            } }) }) }) }) }));
+        let store = new Store();
+        const component = createTestRenderer(store, widget);
+        let tree = component.toJSON();
+        assert(visited);
+    });
+    it("disabled flag can be overruled by the field props", () => {
+        let widget = (_jsx("cx", { children: _jsx("div", { children: _jsx(ValidationGroup, { invalid: bind("invalid"), disabled: true, children: _jsx(Validator, { onValidate: () => "Something is wrong...", disabled: false }) }) }) }));
+        let store = new Store();
+        const component = createTestRenderer(store, widget);
+        let tree = component.toJSON();
+        assert.equal(store.get("invalid"), true);
+    });
+    it("strict flag is used to enforce disabled flag", () => {
+        let widget = (_jsx("cx", { children: _jsx("div", { children: _jsx(ValidationGroup, { invalid: bind("invalid"), disabled: true, strict: true, children: _jsx(Validator, { onValidate: () => "Something is wrong...", disabled: false }) }) }) }));
+        let store = new Store();
+        const component = createTestRenderer(store, widget);
+        let tree = component.toJSON();
+        assert.equal(store.get("invalid"), false);
+    });
+});

package/build/widgets/form/Validator.d.ts

@@ -0,0 +1,8 @@
+import { Field } from "./Field";
+import type { RenderingContext } from "../../ui/RenderingContext";
+import type { Instance } from "../../ui/Instance";
+export declare class Validator extends Field {
+    declareData(...args: Record<string, unknown>[]): void;
+    isEmpty(data: Record<string, unknown>): boolean;
+    render(context: RenderingContext, instance: Instance, key: string): any;
+}

package/build/widgets/form/Validator.js

@@ -0,0 +1,19 @@
+import { Field } from "./Field";
+export class Validator extends Field {
+    declareData(...args) {
+        return super.declareData(...args, {
+            value: {
+                structured: true,
+            },
+            disabled: undefined,
+        });
+    }
+    isEmpty(data) {
+        return false;
+    }
+    render(context, instance, key) {
+        if (!instance.state?.visited || !instance.data.error)
+            return null;
+        return this.renderChildren(context, instance, key);
+    }
+}

package/build/widgets/form/Wheel.d.ts

@@ -0,0 +1,61 @@
+/** @jsxImportSource react */
+import { VDOM } from "../../ui/Widget";
+import { PureContainerBase, PureContainerConfig } from "../../ui/PureContainer";
+import type { RenderingContext } from "../../ui/RenderingContext";
+import type { Instance } from "../../ui/Instance";
+import type { CSS } from "../../ui/CSS";
+import * as React from "react";
+import { Prop, StructuredProp } from "../../ui/Prop";
+export interface WheelConfig extends PureContainerConfig {
+    /** The selected value. */
+    value?: Prop<any>;
+    /** Array of available options. */
+    options?: StructuredProp;
+    /** Number of visible options in the wheel. Default is 3. */
+    size?: number;
+}
+export declare class Wheel extends PureContainerBase<WheelConfig> {
+    size: number;
+    baseClass: string;
+    declareData(...args: Record<string, unknown>[]): void;
+    render(context: RenderingContext, instance: Instance, key: string): React.ReactNode;
+}
+export interface WheelComponentProps {
+    size: number;
+    children: React.ReactNode[];
+    CSS: typeof CSS;
+    baseClass: string;
+    active?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    index?: number;
+    onChange: (newIndex: number) => void;
+    onPipeKeyDown?: (fn: (e: React.KeyboardEvent) => void) => void;
+    onMouseDown?: () => void;
+    focusable?: boolean;
+}
+interface WheelComponentState {
+    wheelHeight?: number;
+    wheelWidth?: number;
+}
+export declare class WheelComponent extends VDOM.Component<WheelComponentProps, WheelComponentState> {
+    index: number;
+    wheelEl: HTMLDivElement;
+    scrollEl: HTMLDivElement;
+    unsubscribeOnWheel: () => void;
+    scrolling?: boolean;
+    constructor(props: WheelComponentProps);
+    wheelRef: (el: HTMLDivElement | null) => void;
+    scrollRef: (el: HTMLDivElement | null) => void;
+    render(): React.ReactNode;
+    componentDidMount(): void;
+    UNSAFE_componentWillReceiveProps(props: WheelComponentProps): void;
+    componentWillUnmount(): void;
+    onKeyDown(e: React.KeyboardEvent): void;
+    onWheel(e: WheelEvent): void;
+    onTouchStart(e: React.TouchEvent): void;
+    onTouchEnd(e: React.TouchEvent): void;
+    select(newIndex: number): void;
+    scrollTo(): void;
+}
+export {};

package/build/widgets/form/Wheel.js

@@ -0,0 +1,178 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/** @jsxImportSource react */
+import { VDOM } from "../../ui/Widget";
+import { PureContainerBase } from "../../ui/PureContainer";
+import { KeyCode } from "../../util/KeyCode";
+import { Icon } from "../Icon";
+import { addEventListenerWithOptions } from "../../util";
+export class Wheel extends PureContainerBase {
+    declareData(...args) {
+        return super.declareData(...args, {
+            value: undefined,
+            options: undefined,
+        });
+    }
+    render(context, instance, key) {
+        let { data } = instance;
+        let { value, options } = data;
+        let index = options.findIndex((a) => a.id === value);
+        if (index === -1)
+            index = Math.floor(options.length / 2);
+        return (_jsx(WheelComponent, { size: this.size, focusable: true, CSS: this.CSS, baseClass: this.baseClass, className: data.classNames, style: data.style, index: index, onChange: (newIndex) => {
+                let option = options[newIndex];
+                instance.set("value", option.id);
+            }, children: options.map((o, i) => (_jsx("span", { children: o.text }, 0))) }, key));
+    }
+}
+Wheel.prototype.baseClass = "wheel";
+Wheel.prototype.size = 3;
+Wheel.prototype.styled = true;
+export class WheelComponent extends VDOM.Component {
+    index;
+    wheelEl;
+    scrollEl;
+    unsubscribeOnWheel;
+    constructor(props) {
+        super(props);
+        this.state = {};
+        this.index = props.index || 0;
+        this.wheelRef = (el) => {
+            if (el)
+                this.wheelEl = el;
+        };
+        this.scrollRef = (el) => {
+            if (el)
+                this.scrollEl = el;
+        };
+        this.onWheel = this.onWheel.bind(this);
+        this.onKeyDown = this.onKeyDown.bind(this);
+    }
+    wheelRef;
+    scrollRef;
+    render() {
+        let { size, children, CSS, baseClass, active, className, style, onMouseDown } = this.props;
+        let optionClass = CSS.element(baseClass, "option");
+        let dummyClass = CSS.element(baseClass, "option", { dummy: true });
+        let tpad = [], bpad = [], padSize = 0;
+        for (let i = 0; i < (size - 1) / 2; i++) {
+            tpad.push({ key: -1 - i, child: children[0], cls: dummyClass });
+            bpad.push({ key: -100 - i, child: children[0], cls: dummyClass });
+            padSize++;
+        }
+        let displayedOptions = [
+            ...tpad,
+            ...children.map((c, i) => ({
+                key: i,
+                child: c,
+                cls: optionClass,
+            })),
+            ...bpad,
+        ];
+        if (!this.state.wheelHeight)
+            displayedOptions = displayedOptions.slice(this.index, this.index + size);
+        return (_jsxs("div", { tabIndex: this.props.focusable ? 0 : undefined, className: className || CSS.element(baseClass, "container", { active }), style: style, onKeyDown: this.onKeyDown, children: [_jsxs("div", { className: CSS.element(baseClass, "clip"), style: {
+                        width: this.state.wheelWidth,
+                    }, onMouseDown: onMouseDown, children: [_jsx("div", { className: CSS.element(baseClass, "vscroll"), ref: this.scrollRef, onTouchStart: this.onTouchStart.bind(this), onTouchEnd: this.onTouchEnd.bind(this), children: _jsx("div", { className: CSS.element(baseClass, "wheel"), style: {
+                                    height: this.state.wheelHeight,
+                                }, ref: this.wheelRef, children: displayedOptions.map((opt) => (_jsx("div", { className: opt.cls, children: opt.child }, opt.key))) }) }), _jsx("div", { className: CSS.element(baseClass, "mask"), style: {
+                                top: `0`,
+                                bottom: `${(50 + 50 / size).toFixed(3)}%`,
+                            } }), _jsx("div", { className: CSS.element(baseClass, "mask"), style: {
+                                top: `${(50 + 50 / size).toFixed(3)}%`,
+                                bottom: `0`,
+                            } }), _jsx("div", { className: CSS.element(baseClass, "selection"), style: {
+                                height: `${(100 / size).toFixed(3)}%`,
+                                top: `${(50 - 50 / size).toFixed(3)}%`,
+                            } })] }), _jsx("div", { className: CSS.element(baseClass, "arrow-up"), onClick: (e) => {
+                        e.preventDefault();
+                        this.select(this.index - 1);
+                    }, children: Icon.render("drop-down", { className: CSS.element(baseClass, "arrow-icon") }) }), _jsx("div", { className: CSS.element(baseClass, "arrow-down"), onClick: (e) => {
+                        e.preventDefault();
+                        this.select(this.index + 1);
+                    }, children: Icon.render("drop-down", { className: CSS.element(baseClass, "arrow-icon") }) })] }));
+    }
+    componentDidMount() {
+        this.unsubscribeOnWheel = addEventListenerWithOptions(this.wheelEl, "wheel", this.onWheel, { passive: false });
+        this.setState({
+            wheelHeight: this.wheelEl.offsetHeight,
+            wheelWidth: this.wheelEl.offsetWidth,
+        }, () => {
+            if (this.state.wheelHeight !== undefined) {
+                this.scrollEl.scrollTop = (this.index * this.state.wheelHeight) / this.props.size;
+            }
+        });
+        if (this.props.onPipeKeyDown)
+            this.props.onPipeKeyDown(this.onKeyDown);
+    }
+    UNSAFE_componentWillReceiveProps(props) {
+        this.index = props.index || 0;
+        this.scrollTo();
+    }
+    componentWillUnmount() {
+        this.scrolling = false;
+        this.unsubscribeOnWheel();
+    }
+    onKeyDown(e) {
+        switch (e.keyCode) {
+            case KeyCode.up:
+                e.preventDefault();
+                this.select(this.index - 1);
+                break;
+            case KeyCode.down:
+                e.preventDefault();
+                this.select(this.index + 1);
+                break;
+        }
+    }
+    onWheel(e) {
+        e.preventDefault();
+        let index = this.index;
+        if (e.deltaY > 0)
+            index++;
+        else
+            index--;
+        this.select(index);
+    }
+    onTouchStart(e) {
+        this.scrolling = false;
+    }
+    onTouchEnd(e) {
+        let { size } = this.props;
+        if (this.state.wheelHeight !== undefined) {
+            let index = Math.round(this.scrollEl.scrollTop / (this.state.wheelHeight / size));
+            this.select(index);
+        }
+    }
+    select(newIndex) {
+        let { children } = this.props;
+        newIndex = Math.max(0, Math.min(children.length - 1, newIndex));
+        if (this.index !== newIndex) {
+            this.index = newIndex;
+            this.props.onChange(newIndex);
+        }
+        this.scrollTo();
+    }
+    scrollTo() {
+        let { size } = this.props;
+        let callback = () => {
+            if (!this.scrolling || this.state.wheelHeight === undefined)
+                return;
+            let x = (this.index * this.state.wheelHeight) / size;
+            let delta = Math.round(x - this.scrollEl.scrollTop);
+            if (delta === 0) {
+                this.scrolling = false;
+                return;
+            }
+            let sign = delta > 0 ? 1 : -1;
+            delta = Math.abs(delta) / 10;
+            if (delta < 1)
+                delta = 1;
+            this.scrollEl.scrollTop += sign * delta;
+            requestAnimationFrame(callback);
+        };
+        if (!this.scrolling) {
+            this.scrolling = true;
+            requestAnimationFrame(callback);
+        }
+    }
+}

package/build/widgets/form/index.d.ts

@@ -0,0 +1,28 @@
+export * from './Field';
+export * from './TextField';
+export * from './Checkbox';
+export * from './Radio';
+export * from './Select';
+export * from './Calendar';
+export * from './LookupField';
+export * from './NumberField';
+export * from './TextArea';
+export * from './LabeledContainer';
+export * from './ValidationError';
+export * from './ValidationGroup';
+export * from './FieldGroup';
+export * from './MonthPicker';
+export * from './ColorPicker';
+export * from './MonthField';
+export * from './ColorField';
+export * from './UploadButton';
+export * from './Slider';
+export * from './Switch';
+export * from './HelpText';
+export * from './Wheel';
+export * from './DateTimePicker';
+export * from './DateTimeField';
+export * from './DateField';
+export * from './TimeField';
+export * from './Validator';
+export * from './Label';

package/build/widgets/form/index.js

@@ -0,0 +1,28 @@
+export * from './Field';
+export * from './TextField';
+export * from './Checkbox';
+export * from './Radio';
+export * from './Select';
+export * from './Calendar';
+export * from './LookupField';
+export * from './NumberField';
+export * from './TextArea';
+export * from './LabeledContainer';
+export * from './ValidationError';
+export * from './ValidationGroup';
+export * from './FieldGroup';
+export * from './MonthPicker';
+export * from './ColorPicker';
+export * from './MonthField';
+export * from './ColorField';
+export * from './UploadButton';
+export * from './Slider';
+export * from './Switch';
+export * from './HelpText';
+export * from './Wheel';
+export * from './DateTimePicker';
+export * from './DateTimeField';
+export * from './DateField';
+export * from './TimeField';
+export * from './Validator';
+export * from './Label';