@pnp/spfx-controls-react 3.26.0-beta.3602956 → 4.0.0-beta.3798679

package/lib-commonjs/controls/adaptiveCardHost/fluentUI/Elements.js

@@ -1,723 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FluentUIToggleInput = exports.FluentUITimeInput = exports.FluentUITextInput = exports.FluentUINumberInput = exports.FluentUIDateInput = exports.FluentUIChoiceSetInput = void 0;
-exports.registerFluentUIElements = registerFluentUIElements;
-var tslib_1 = require("tslib");
-var react_theme_provider_1 = require("@fluentui/react-theme-provider");
-var card_elements_1 = require("adaptivecards/lib/card-elements");
-var enums_1 = require("adaptivecards/lib/enums");
-var serialization_1 = require("adaptivecards/lib/serialization");
-var strings_1 = require("adaptivecards/lib/strings");
-var Button_1 = require("@fluentui/react/lib/Button");
-var Checkbox_1 = require("@fluentui/react/lib/Checkbox");
-var ChoiceGroup_1 = require("@fluentui/react/lib/ChoiceGroup");
-var ComboBox_1 = require("@fluentui/react/lib/ComboBox");
-var DatePicker_1 = require("@fluentui/react/lib/DatePicker");
-var Icons_1 = require("@fluentui/react/lib/Icons");
-var SpinButton_1 = require("@fluentui/react/lib/SpinButton");
-var Stack_1 = require("@fluentui/react/lib/Stack");
-var TextField_1 = require("@fluentui/react/lib/TextField");
-var Toggle_1 = require("@fluentui/react/lib/Toggle");
-var React = tslib_1.__importStar(require("react"));
-var ReactDOM = tslib_1.__importStar(require("react-dom"));
-var HostCapability_1 = require("./HostCapability");
-var internalRender = function (renderReact) {
-    var div = document.createElement("div");
-    ReactDOM.render(renderReact(), div); // eslint-disable-line @rushstack/pair-react-dom-render-unmount
-    return div;
-};
-var inlineButtonRootStyle = {
-    marginLeft: 8,
-};
-var FluentUIChoiceSetInput = /** @class */ (function (_super) {
-    tslib_1.__extends(FluentUIChoiceSetInput, _super);
-    function FluentUIChoiceSetInput() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.isMultiSelect = false;
-        _this.wrap = false;
-        _this.choices = [];
-        _this.selectedValues = [];
-        _this.defaultSelectedValues = [];
-        _this.updateSelectedValues = function (key, isMultiSelect, selected) {
-            if (isMultiSelect) {
-                if (selected) {
-                    _this.selectedValues.push(key);
-                }
-                else {
-                    _this.removeItemFromArray(_this.selectedValues, key);
-                }
-            }
-            else {
-                _this.selectedValues = [];
-                _this.selectedValues.push(key);
-            }
-        };
-        _this.removeItemFromArray = function (arr, item) {
-            var index = arr.indexOf(item);
-            arr.splice(index, 1);
-        };
-        return _this;
-    }
-    Object.defineProperty(FluentUIChoiceSetInput.prototype, "isCompact", {
-        get: function () {
-            return !this.style || this.style === "compact";
-        },
-        set: function (value) {
-            this.style = value ? undefined : "expanded";
-        },
-        enumerable: false,
-        configurable: true
-    });
-    FluentUIChoiceSetInput.prototype.internalRender = function () {
-        var _this = this;
-        var theme = (0, HostCapability_1.getFluentUIThemeFromHostCapability)(this.hostConfig);
-        if (this.defaultValue) {
-            this.defaultSelectedValues = this.defaultValue.split(this.hostConfig.choiceSetInputValueSeparator);
-            this.selectedValues = this.defaultSelectedValues;
-        }
-        var optionsChoiceGroup = (this.choices) ?
-            this.choices.map(function (x, index) {
-                return {
-                    key: x.value, text: x.title,
-                    styles: { root: { marginTop: index > 0 ? _this.hostConfig.spacing.default : 0 } }
-                };
-            })
-            : [];
-        var options = (this.choices) ?
-            this.choices.map(function (x) { return { key: x.value, text: x.title }; })
-            : [];
-        var control = function () {
-            return React.createElement(React.Fragment, null,
-                _this.isMultiSelect === false && _this.style === "expanded" &&
-                    React.createElement(react_theme_provider_1.ThemeProvider, { theme: theme, style: { backgroundColor: "transparent" } },
-                        React.createElement(ChoiceGroup_1.ChoiceGroup, { defaultSelectedKey: _this.defaultValue, options: optionsChoiceGroup, onChange: function (ev, option) {
-                                _this.updateSelectedValues(option.key, _this.isMultiSelect, true);
-                                _this.valueChanged();
-                            }, componentRef: function (input) { _this.refControl = input; } })),
-                _this.isMultiSelect === true && _this.style === "expanded" &&
-                    React.createElement(Stack_1.Stack, { tokens: { childrenGap: _this.hostConfig.spacing.default } }, _this.choices.map(function (x, index) {
-                        var defaultChecked = _this.defaultSelectedValues.indexOf(x.value) > -1;
-                        return React.createElement(react_theme_provider_1.ThemeProvider, { key: x.value, theme: theme, style: { backgroundColor: "transparent" } },
-                            React.createElement(Checkbox_1.Checkbox, { title: x.title, key: x.value, defaultChecked: defaultChecked, label: x.title, onChange: function (ev, checked) {
-                                    _this.updateSelectedValues(x.value, _this.isMultiSelect, checked);
-                                    _this.valueChanged();
-                                }, componentRef: function (input) {
-                                    if (index === 0)
-                                        _this.refControl = input;
-                                } }));
-                    })),
-                (_this.style === "compact" || _this.style === "filtered") &&
-                    React.createElement(react_theme_provider_1.ThemeProvider, { theme: theme, style: { backgroundColor: "transparent" } },
-                        React.createElement(ComboBox_1.ComboBox, { placeholder: _this.placeholder, multiSelect: _this.isMultiSelect, defaultSelectedKey: _this.defaultSelectedValues, allowFreeform: false, autoComplete: (_this.style === "filtered") ? "on" : "off", options: options, onChange: function (ev, option, index, value) {
-                                _this.updateSelectedValues(option.key.toString(), _this.isMultiSelect, (_this.isMultiSelect) ? option.selected : true);
-                                _this.valueChanged();
-                            }, componentRef: function (input) { _this.refControl = input; } })));
-        };
-        this.element = internalRender(control);
-        this.element.style.width = "100%";
-        return this.element;
-    };
-    FluentUIChoiceSetInput.prototype.getJsonTypeName = function () {
-        return "Input.ChoiceSet";
-    };
-    FluentUIChoiceSetInput.prototype.focus = function () {
-        if (this.refControl)
-            this.refControl.focus();
-    };
-    FluentUIChoiceSetInput.prototype.internalValidateProperties = function (context) {
-        _super.prototype.internalValidateProperties.call(this, context);
-        if (this.choices.length === 0) {
-            context.addFailure(this, enums_1.ValidationEvent.CollectionCantBeEmpty, strings_1.Strings.errors.choiceSetMustHaveAtLeastOneChoice());
-        }
-        for (var _i = 0, _a = this.choices; _i < _a.length; _i++) {
-            var choice = _a[_i];
-            if (!choice.title || !choice.value) {
-                context.addFailure(this, enums_1.ValidationEvent.PropertyCantBeNull, strings_1.Strings.errors.choiceSetChoicesMustHaveTitleAndValue());
-            }
-        }
-    };
-    FluentUIChoiceSetInput.prototype.isSet = function () {
-        return this.value ? true : false;
-    };
-    FluentUIChoiceSetInput.prototype.isValid = function () {
-        if (!this.value) {
-            return !this.isRequired;
-        }
-        return true;
-    };
-    Object.defineProperty(FluentUIChoiceSetInput.prototype, "value", {
-        get: function () {
-            var _this = this;
-            if (this.selectedValues) {
-                var result_1 = "";
-                this.selectedValues.map(function (x) {
-                    if (result_1 !== "") {
-                        result_1 += _this.hostConfig.choiceSetInputValueSeparator;
-                    }
-                    result_1 += x;
-                });
-                return result_1;
-            }
-            else {
-                return undefined;
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    FluentUIChoiceSetInput.valueProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "value");
-    FluentUIChoiceSetInput.choicesProperty = new serialization_1.SerializableObjectCollectionProperty(serialization_1.Versions.v1_0, "choices", card_elements_1.Choice);
-    FluentUIChoiceSetInput.styleProperty = new serialization_1.ValueSetProperty(serialization_1.Versions.v1_0, "style", [
-        { value: "compact" },
-        { value: "expanded" },
-        { value: "filtered", targetVersion: serialization_1.Versions.v1_5 }
-    ], "compact");
-    FluentUIChoiceSetInput.isMultiSelectProperty = new serialization_1.BoolProperty(serialization_1.Versions.v1_0, "isMultiSelect", false);
-    FluentUIChoiceSetInput.placeholderProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "placeholder");
-    FluentUIChoiceSetInput.wrapProperty = new serialization_1.BoolProperty(serialization_1.Versions.v1_2, "wrap", false);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIChoiceSetInput.valueProperty)
-    ], FluentUIChoiceSetInput.prototype, "defaultValue", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIChoiceSetInput.styleProperty)
-    ], FluentUIChoiceSetInput.prototype, "style", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIChoiceSetInput.isMultiSelectProperty)
-    ], FluentUIChoiceSetInput.prototype, "isMultiSelect", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIChoiceSetInput.placeholderProperty)
-    ], FluentUIChoiceSetInput.prototype, "placeholder", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIChoiceSetInput.wrapProperty)
-    ], FluentUIChoiceSetInput.prototype, "wrap", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIChoiceSetInput.choicesProperty)
-    ], FluentUIChoiceSetInput.prototype, "choices", void 0);
-    return FluentUIChoiceSetInput;
-}(card_elements_1.Input));
-exports.FluentUIChoiceSetInput = FluentUIChoiceSetInput;
-var FluentUIDateInput = /** @class */ (function (_super) {
-    tslib_1.__extends(FluentUIDateInput, _super);
-    function FluentUIDateInput() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    FluentUIDateInput.prototype.internalRender = function () {
-        var _this = this;
-        var theme = (0, HostCapability_1.getFluentUIThemeFromHostCapability)(this.hostConfig);
-        var control = function () {
-            return React.createElement(react_theme_provider_1.ThemeProvider, { theme: theme },
-                React.createElement(DatePicker_1.DatePicker, { id: _this.id, placeholder: _this.placeholder, minDate: _this.convertStringToDate(_this.min), maxDate: _this.convertStringToDate(_this.max), onSelectDate: function (date) {
-                        _this._value = date;
-                        _this.valueChanged();
-                    }, theme: theme, value: _this.defaultValue ? _this.convertStringToDate(_this.defaultValue) : undefined, componentRef: function (input) { _this.refControl = input; } }));
-        };
-        this.element = internalRender(control);
-        this.element.style.width = "100%";
-        return this.element;
-    };
-    FluentUIDateInput.prototype.convertStringToDate = function (value) {
-        if (value) {
-            try {
-                return new Date(value);
-            }
-            catch (_a) {
-                return null;
-            }
-        }
-        else {
-            return null;
-        }
-    };
-    FluentUIDateInput.prototype.getJsonTypeName = function () {
-        return "Input.Date";
-    };
-    FluentUIDateInput.prototype.focus = function () {
-        if (this.refControl)
-            this.refControl.focus();
-    };
-    FluentUIDateInput.prototype.updateInputControlAriaLabelledBy = function () {
-        if (this.element) {
-            var joinedLabelIds = this.getAllLabelIds().join(" ");
-            if (joinedLabelIds) {
-                this.element.setAttribute("aria-labelledby", joinedLabelIds);
-            }
-            else {
-                this.element.removeAttribute("aria-labelledby");
-            }
-        }
-    };
-    FluentUIDateInput.prototype.isSet = function () {
-        return this.value ? true : false;
-    };
-    FluentUIDateInput.prototype.isValid = function () {
-        if (!this.value) {
-            return !this.isRequired;
-        }
-        var valueAsDate = new Date(this.value);
-        var result = true;
-        if (this.min) {
-            var minDate = new Date(this.min);
-            result = result && valueAsDate >= minDate;
-        }
-        if (this.max) {
-            var maxDate = new Date(this.max);
-            result = result && valueAsDate <= maxDate;
-        }
-        return result;
-    };
-    Object.defineProperty(FluentUIDateInput.prototype, "value", {
-        get: function () {
-            if (this._value) {
-                var offset = this._value.getTimezoneOffset();
-                var value = new Date(this._value.getTime() - (offset * 60 * 1000));
-                return value.toISOString().split('T')[0];
-            }
-            else if (this.defaultValue) {
-                var date = this.convertStringToDate(this.defaultValue);
-                var offset = date.getTimezoneOffset();
-                var value = new Date(date.getTime() - (offset * 60 * 1000));
-                return value.toISOString().split('T')[0];
-            }
-            else {
-                return undefined;
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    FluentUIDateInput.valueProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "value");
-    FluentUIDateInput.placeholderProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "placeholder");
-    FluentUIDateInput.minProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "min");
-    FluentUIDateInput.maxProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "max");
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIDateInput.valueProperty)
-    ], FluentUIDateInput.prototype, "defaultValue", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIDateInput.minProperty)
-    ], FluentUIDateInput.prototype, "min", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIDateInput.maxProperty)
-    ], FluentUIDateInput.prototype, "max", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIDateInput.placeholderProperty)
-    ], FluentUIDateInput.prototype, "placeholder", void 0);
-    return FluentUIDateInput;
-}(card_elements_1.Input));
-exports.FluentUIDateInput = FluentUIDateInput;
-var FluentUINumberInput = /** @class */ (function (_super) {
-    tslib_1.__extends(FluentUINumberInput, _super);
-    function FluentUINumberInput() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    FluentUINumberInput.prototype.internalRender = function () {
-        var _this = this;
-        var theme = (0, HostCapability_1.getFluentUIThemeFromHostCapability)(this.hostConfig);
-        var control = function () {
-            return React.createElement(SpinButton_1.SpinButton, { id: _this.id, defaultValue: "".concat(_this.defaultValue), placeholder: _this.placeholder, min: _this.min, max: _this.max, onChange: function () { return _this.valueChanged(); }, theme: theme, componentRef: function (input) { _this.refControl = input; } });
-        };
-        this.element = internalRender(control);
-        this.element.style.width = "100%";
-        return this.element;
-    };
-    FluentUINumberInput.prototype.getJsonTypeName = function () {
-        return "Input.Number";
-    };
-    FluentUINumberInput.prototype.focus = function () {
-        if (this.refControl)
-            this.refControl.focus();
-    };
-    FluentUINumberInput.prototype.updateInputControlAriaLabelledBy = function () {
-        if (this.element) {
-            var joinedLabelIds = this.getAllLabelIds().join(" ");
-            if (joinedLabelIds) {
-                this.element.setAttribute("aria-labelledby", joinedLabelIds);
-            }
-            else {
-                this.element.removeAttribute("aria-labelledby");
-            }
-        }
-    };
-    FluentUINumberInput.prototype.isSet = function () {
-        return this.value !== undefined && !isNaN(this.value);
-    };
-    FluentUINumberInput.prototype.isValid = function () {
-        if (!this.value) {
-            return !this.isRequired;
-        }
-        var result = true;
-        if (this.min !== undefined) {
-            result = result && this.value >= this.min;
-        }
-        if (this.max !== undefined) {
-            result = result && this.value <= this.max;
-        }
-        return result;
-    };
-    Object.defineProperty(FluentUINumberInput.prototype, "value", {
-        get: function () {
-            if (this.refControl) {
-                return Number(this.refControl.value);
-            }
-            else {
-                return undefined;
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    FluentUINumberInput.valueProperty = new serialization_1.NumProperty(serialization_1.Versions.v1_0, "value");
-    FluentUINumberInput.placeholderProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "placeholder");
-    FluentUINumberInput.minProperty = new serialization_1.NumProperty(serialization_1.Versions.v1_0, "min");
-    FluentUINumberInput.maxProperty = new serialization_1.NumProperty(serialization_1.Versions.v1_0, "max");
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUINumberInput.valueProperty)
-    ], FluentUINumberInput.prototype, "defaultValue", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUINumberInput.minProperty)
-    ], FluentUINumberInput.prototype, "min", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUINumberInput.maxProperty)
-    ], FluentUINumberInput.prototype, "max", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUINumberInput.placeholderProperty)
-    ], FluentUINumberInput.prototype, "placeholder", void 0);
-    return FluentUINumberInput;
-}(card_elements_1.Input));
-exports.FluentUINumberInput = FluentUINumberInput;
-var FluentUITextInput = /** @class */ (function (_super) {
-    tslib_1.__extends(FluentUITextInput, _super);
-    function FluentUITextInput() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.isMultiline = false;
-        _this.style = enums_1.InputTextStyle.Text;
-        _this.handleKeyDown = function (e) {
-            // Enter pressed
-            if (e.key === 'Enter' && _this.inlineAction) {
-                _this.inlineAction.execute();
-            }
-        };
-        _this.buildInlineActionButton = function () {
-            return internalRender((_this.inlineAction.iconUrl) ?
-                _this.inlineIconActionButton :
-                _this.buildTextOnlyInlineActionActionButton);
-        };
-        _this.inlineActionClickHandler = function (e) {
-            e.stopPropagation();
-            e.preventDefault();
-            _this.inlineAction.execute();
-        };
-        _this.inlineIconActionButton = function () {
-            var theme = _this.hostConfig.hostCapabilities.getCustomProperty(HostCapability_1.hostCapabilitiesFluentUIThemeKey);
-            return React.createElement(Button_1.IconButton, { default: true, text: _this.inlineAction.title, ariaDescription: _this.inlineAction.title, className: _this.hostConfig.makeCssClassName("ac-inlineActionButton", "iconOnly"), theme: theme, styles: {
-                    icon: {
-                        height: "100%",
-                    },
-                    root: inlineButtonRootStyle,
-                }, iconProps: {
-                    imageProps: {
-                        height: "100%",
-                        src: _this.inlineAction.iconUrl,
-                    },
-                }, onClick: _this.inlineActionClickHandler });
-        };
-        _this.buildTextOnlyInlineActionActionButton = function () {
-            var theme = _this.hostConfig.hostCapabilities.getCustomProperty(HostCapability_1.hostCapabilitiesFluentUIThemeKey);
-            return React.createElement(Button_1.DefaultButton, { className: _this.hostConfig.makeCssClassName("ac-inlineActionButton", "textOnly"), text: _this.inlineAction.title, ariaDescription: _this.inlineAction.title, onClick: _this.inlineActionClickHandler, styles: {
-                    root: inlineButtonRootStyle,
-                }, theme: theme });
-        };
-        return _this;
-    }
-    FluentUITextInput.prototype.internalRender = function () {
-        var _this = this;
-        var theme = (0, HostCapability_1.getFluentUIThemeFromHostCapability)(this.hostConfig);
-        var control = function () {
-            return React.createElement(TextField_1.TextField, { id: _this.id, type: enums_1.InputTextStyle[_this.style].toLowerCase(), defaultValue: _this.defaultValue, multiline: _this.isMultiline, maxLength: _this.maxLength, placeholder: _this.placeholder, pattern: _this.regex, onChange: function () { return _this.valueChanged(); }, onKeyDown: _this.handleKeyDown, theme: theme, componentRef: function (input) { _this.refControl = input; } });
-        };
-        this.element = internalRender(control);
-        this.element.style.width = "100%";
-        return this.element;
-    };
-    FluentUITextInput.prototype.overrideInternalRender = function () {
-        var inputControl = _super.prototype.overrideInternalRender.call(this);
-        if (this.inlineAction) {
-            this.inputControlContainerElement.appendChild(this.buildInlineActionButton());
-        }
-        return inputControl;
-    };
-    FluentUITextInput.prototype.getJsonTypeName = function () {
-        return "Input.Text";
-    };
-    FluentUITextInput.prototype.focus = function () {
-        if (this.refControl)
-            this.refControl.focus();
-    };
-    FluentUITextInput.prototype.updateInputControlAriaLabelledBy = function () {
-        if (this.element) {
-            var joinedLabelIds = this.getAllLabelIds().join(" ");
-            if (joinedLabelIds) {
-                this.element.setAttribute("aria-labelledby", joinedLabelIds);
-            }
-            else {
-                this.element.removeAttribute("aria-labelledby");
-            }
-        }
-    };
-    FluentUITextInput.prototype.getActionById = function (id) {
-        var result = _super.prototype.getActionById.call(this, id);
-        if (!result && this.inlineAction) {
-            result = this.inlineAction.getActionById(id);
-        }
-        return result;
-    };
-    FluentUITextInput.prototype.isSet = function () {
-        return this.value ? true : false;
-    };
-    FluentUITextInput.prototype.isValid = function () {
-        if (!this.value) {
-            return !this.isRequired;
-        }
-        if (this.regex) {
-            return new RegExp(this.regex, "g").test(this.value); // eslint-disable-line @rushstack/security/no-unsafe-regexp
-        }
-        return true;
-    };
-    Object.defineProperty(FluentUITextInput.prototype, "value", {
-        get: function () {
-            var _a;
-            if (this.renderedInputControlElement) {
-                return (_a = this.refControl) === null || _a === void 0 ? void 0 : _a.value;
-            }
-            else {
-                return undefined;
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    FluentUITextInput.valueProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "value");
-    FluentUITextInput.maxLengthProperty = new serialization_1.NumProperty(serialization_1.Versions.v1_0, "maxLength");
-    FluentUITextInput.isMultilineProperty = new serialization_1.BoolProperty(serialization_1.Versions.v1_0, "isMultiline", false);
-    FluentUITextInput.placeholderProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "placeholder");
-    FluentUITextInput.styleProperty = new serialization_1.EnumProperty(serialization_1.Versions.v1_0, "style", enums_1.InputTextStyle, enums_1.InputTextStyle.Text);
-    FluentUITextInput.inlineActionProperty = new card_elements_1.ActionProperty(serialization_1.Versions.v1_0, "inlineAction", ["Action.ShowCard"]);
-    FluentUITextInput.regexProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_3, "regex", true);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITextInput.valueProperty)
-    ], FluentUITextInput.prototype, "defaultValue", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITextInput.maxLengthProperty)
-    ], FluentUITextInput.prototype, "maxLength", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITextInput.isMultilineProperty)
-    ], FluentUITextInput.prototype, "isMultiline", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITextInput.placeholderProperty)
-    ], FluentUITextInput.prototype, "placeholder", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITextInput.styleProperty)
-    ], FluentUITextInput.prototype, "style", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITextInput.inlineActionProperty)
-    ], FluentUITextInput.prototype, "inlineAction", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITextInput.regexProperty)
-    ], FluentUITextInput.prototype, "regex", void 0);
-    return FluentUITextInput;
-}(card_elements_1.Input));
-exports.FluentUITextInput = FluentUITextInput;
-var FluentUITimeInput = /** @class */ (function (_super) {
-    tslib_1.__extends(FluentUITimeInput, _super);
-    function FluentUITimeInput() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    FluentUITimeInput.convertTimeStringToDate = function (timeString) {
-        return new Date("1973-09-04T" + timeString + ":00Z");
-    };
-    FluentUITimeInput.prototype.internalRender = function () {
-        var _this = this;
-        var theme = (0, HostCapability_1.getFluentUIThemeFromHostCapability)(this.hostConfig);
-        var control = function () {
-            return React.createElement(TextField_1.TextField, { id: _this.id, type: "time", defaultValue: _this.defaultValue, min: _this.min, max: _this.max, placeholder: _this.placeholder, onChange: function () { return _this.valueChanged(); }, theme: theme, componentRef: function (input) { _this.refControl = input; } });
-        };
-        this.element = internalRender(control);
-        this.element.style.width = "100%";
-        return this.element;
-    };
-    FluentUITimeInput.prototype.getJsonTypeName = function () {
-        return "Input.Time";
-    };
-    FluentUITimeInput.prototype.focus = function () {
-        if (this.refControl)
-            this.refControl.focus();
-    };
-    FluentUITimeInput.prototype.updateInputControlAriaLabelledBy = function () {
-        if (this.element) {
-            var joinedLabelIds = this.getAllLabelIds().join(" ");
-            if (joinedLabelIds) {
-                this.element.setAttribute("aria-labelledby", joinedLabelIds);
-            }
-            else {
-                this.element.removeAttribute("aria-labelledby");
-            }
-        }
-    };
-    FluentUITimeInput.prototype.isSet = function () {
-        return this.value ? true : false;
-    };
-    FluentUITimeInput.prototype.isValid = function () {
-        if (!this.value) {
-            return !this.isRequired;
-        }
-        var valueAsDate = FluentUITimeInput.convertTimeStringToDate(this.value);
-        var result = true;
-        if (this.min) {
-            var minDate = FluentUITimeInput.convertTimeStringToDate(this.min);
-            result = result && valueAsDate >= minDate;
-        }
-        if (this.max) {
-            var maxDate = FluentUITimeInput.convertTimeStringToDate(this.max);
-            result = result && valueAsDate <= maxDate;
-        }
-        return result;
-    };
-    Object.defineProperty(FluentUITimeInput.prototype, "value", {
-        get: function () {
-            var _a;
-            if (this.renderedInputControlElement) {
-                return (_a = this.refControl) === null || _a === void 0 ? void 0 : _a.value;
-            }
-            else {
-                return undefined;
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    FluentUITimeInput.valueProperty = new card_elements_1.TimeProperty(serialization_1.Versions.v1_0, "value");
-    FluentUITimeInput.placeholderProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "placeholder");
-    FluentUITimeInput.minProperty = new card_elements_1.TimeProperty(serialization_1.Versions.v1_0, "min");
-    FluentUITimeInput.maxProperty = new card_elements_1.TimeProperty(serialization_1.Versions.v1_0, "max");
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITimeInput.valueProperty)
-    ], FluentUITimeInput.prototype, "defaultValue", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITimeInput.minProperty)
-    ], FluentUITimeInput.prototype, "min", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITimeInput.maxProperty)
-    ], FluentUITimeInput.prototype, "max", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUITimeInput.placeholderProperty)
-    ], FluentUITimeInput.prototype, "placeholder", void 0);
-    return FluentUITimeInput;
-}(card_elements_1.Input));
-exports.FluentUITimeInput = FluentUITimeInput;
-var FluentUIToggleInput = /** @class */ (function (_super) {
-    tslib_1.__extends(FluentUIToggleInput, _super);
-    function FluentUIToggleInput() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.valueOn = "true";
-        _this.valueOff = "false";
-        _this.wrap = false;
-        return _this;
-    }
-    FluentUIToggleInput.prototype.internalRender = function () {
-        var _this = this;
-        var theme = (0, HostCapability_1.getFluentUIThemeFromHostCapability)(this.hostConfig);
-        var control = function () {
-            return React.createElement(react_theme_provider_1.ThemeProvider, { theme: theme, style: { backgroundColor: "transparent" } },
-                React.createElement(Toggle_1.Toggle, { id: _this.id, inlineLabel: true, onText: _this.title, offText: _this.title, onChange: function (event, checked) {
-                        _this._value = checked;
-                        _this.valueChanged();
-                    }, defaultChecked: _this.defaultValue === _this.valueOn, styles: { root: { marginBottom: 0, marginTop: 0 } }, componentRef: function (input) { _this.refControl = input; } }));
-        };
-        this.element = internalRender(control);
-        this.element.style.width = "100%";
-        return this.element;
-    };
-    Object.defineProperty(FluentUIToggleInput.prototype, "isNullable", {
-        get: function () {
-            return false;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    FluentUIToggleInput.prototype.getJsonTypeName = function () {
-        return "Input.Toggle";
-    };
-    FluentUIToggleInput.prototype.focus = function () {
-        if (this.refControl)
-            this.refControl.focus();
-    };
-    FluentUIToggleInput.prototype.updateInputControlAriaLabelledBy = function () {
-        if (this.element) {
-            var joinedLabelIds = this.getAllLabelIds().join(" ");
-            if (joinedLabelIds) {
-                this.element.setAttribute("aria-labelledby", joinedLabelIds);
-            }
-            else {
-                this.element.removeAttribute("aria-labelledby");
-            }
-        }
-    };
-    FluentUIToggleInput.prototype.isSet = function () {
-        if (this.isRequired) {
-            return this.value === this.valueOn;
-        }
-        return this.value ? true : false;
-    };
-    Object.defineProperty(FluentUIToggleInput.prototype, "value", {
-        get: function () {
-            if (this._value !== null && this._value !== undefined) {
-                return this._value ? this.valueOn : this.valueOff;
-            }
-            else {
-                if (this.isRequired) {
-                    return undefined;
-                }
-                else {
-                    return this.valueOff;
-                }
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    FluentUIToggleInput.valueProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "value");
-    FluentUIToggleInput.titleProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "title");
-    FluentUIToggleInput.valueOnProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "valueOn", true, undefined, "true", function (_sender) {
-        return "true";
-    });
-    FluentUIToggleInput.valueOffProperty = new serialization_1.StringProperty(serialization_1.Versions.v1_0, "valueOff", true, undefined, "false", function (_sender) {
-        return "false";
-    });
-    FluentUIToggleInput.wrapProperty = new serialization_1.BoolProperty(serialization_1.Versions.v1_2, "wrap", false);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIToggleInput.valueProperty)
-    ], FluentUIToggleInput.prototype, "defaultValue", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIToggleInput.titleProperty)
-    ], FluentUIToggleInput.prototype, "title", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIToggleInput.valueOnProperty)
-    ], FluentUIToggleInput.prototype, "valueOn", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIToggleInput.valueOffProperty)
-    ], FluentUIToggleInput.prototype, "valueOff", void 0);
-    tslib_1.__decorate([
-        (0, serialization_1.property)(FluentUIToggleInput.wrapProperty)
-    ], FluentUIToggleInput.prototype, "wrap", void 0);
-    return FluentUIToggleInput;
-}(card_elements_1.Input));
-exports.FluentUIToggleInput = FluentUIToggleInput;
-function registerFluentUIElements(registry) {
-    (0, Icons_1.initializeIcons)();
-    registry.register("Input.Text", FluentUITextInput);
-    registry.register("Input.Number", FluentUINumberInput);
-    registry.register("Input.Time", FluentUITimeInput);
-    registry.register("Input.Date", FluentUIDateInput);
-    registry.register("Input.Toggle", FluentUIToggleInput);
-    registry.register("Input.ChoiceSet", FluentUIChoiceSetInput);
-}
-//# sourceMappingURL=Elements.js.map