import * as React from 'react';
import { SpinButton } from '@fluentui/react/lib/SpinButton';
import { Stack } from '@fluentui/react/lib/Stack';
var stackTokens = { childrenGap: 20 };
// By default the field grows to fit available width. Constrain the width instead.
var styles = { spinButtonWrapper: { width: 75 } };
export var SpinButtonBasicExample = function () {
    return (React.createElement(Stack, { tokens: stackTokens },
        React.createElement(SpinButton, { label: "Basic SpinButton", defaultValue: "0", min: 0, max: 100, step: 1, incrementButtonAriaLabel: "Increase value by 1", decrementButtonAriaLabel: "Decrease value by 1", styles: styles }),
        React.createElement(SpinButton, { label: "Decimal SpinButton", defaultValue: "0", min: 0, max: 10, step: 0.1, incrementButtonAriaLabel: "Increase value by 0.1", decrementButtonAriaLabel: "Decrease value by 0.1", styles: styles }),
        React.createElement(SpinButton, { label: "Disabled SpinButton", disabled: true, defaultValue: "25", min: 0, max: 100, step: 1, incrementButtonAriaLabel: "Increase value by 1", decrementButtonAriaLabel: "Decrease value by 1", styles: styles })));
};
//# sourceMappingURL=SpinButton.Basic.Example.js.map