@seniorsistemas/angular-components 17.0.0 → 17.1.0

package/bundles/seniorsistemas-angular-components.umd.js

@@ -14402,6 +14402,102 @@
         return SplitButtonModule;
     }());
 
+    var SwitchComponent = /** @class */ (function () {
+        function SwitchComponent() {
+            this.readonly = false;
+            this.disabled = false;
+            this.valueChanged = new core.EventEmitter();
+            this.value = false;
+        }
+        SwitchComponent_1 = SwitchComponent;
+        SwitchComponent.prototype.onFocusIn = function () {
+            var switchElement = this.switchRef.nativeElement;
+            switchElement.classList.add("switch--focus");
+        };
+        SwitchComponent.prototype.onFocusOut = function () {
+            var switchElement = this.switchRef.nativeElement;
+            switchElement.classList.remove("switch--focus");
+        };
+        SwitchComponent.prototype.writeValue = function (value) {
+            if (!this.disabled) {
+                this.value = value;
+            }
+        };
+        SwitchComponent.prototype.registerOnChange = function (onChange) {
+            this._onChange = onChange;
+        };
+        SwitchComponent.prototype.registerOnTouched = function (onTouched) {
+            this._onTouched = onTouched;
+        };
+        SwitchComponent.prototype.setDisabledState = function (disabled) {
+            this.disabled = disabled;
+        };
+        SwitchComponent.prototype.toggleCheck = function () {
+            this.value = !this.value;
+            this.valueChanged.emit(this.value);
+            if (this._onChange) {
+                this._onChange(this.value);
+            }
+        };
+        var SwitchComponent_1;
+        __decorate([
+            core.Input()
+        ], SwitchComponent.prototype, "readonly", void 0);
+        __decorate([
+            core.Input()
+        ], SwitchComponent.prototype, "trueLabel", void 0);
+        __decorate([
+            core.Input()
+        ], SwitchComponent.prototype, "falseLabel", void 0);
+        __decorate([
+            core.Input()
+        ], SwitchComponent.prototype, "inputId", void 0);
+        __decorate([
+            core.Input()
+        ], SwitchComponent.prototype, "disabled", void 0);
+        __decorate([
+            core.Output()
+        ], SwitchComponent.prototype, "valueChanged", void 0);
+        __decorate([
+            core.Input()
+        ], SwitchComponent.prototype, "value", void 0);
+        __decorate([
+            core.ViewChild("switch", { static: true })
+        ], SwitchComponent.prototype, "switchRef", void 0);
+        __decorate([
+            core.HostListener('focusin')
+        ], SwitchComponent.prototype, "onFocusIn", null);
+        __decorate([
+            core.HostListener('focusout')
+        ], SwitchComponent.prototype, "onFocusOut", null);
+        SwitchComponent = SwitchComponent_1 = __decorate([
+            core.Component({
+                selector: 's-switch',
+                template: "<div #switch class=\"switch\" [ngClass]=\"{ 'switch--disabled': disabled }\">\n    <label class=\"switch-toggle\">\n        <input\n            #input\n            [id]=\"inputId\"\n            type=\"checkbox\"\n            [checked]=\"value\"\n            [disabled]=\"readonly || disabled\"\n            (change)=\"toggleCheck()\">\n        <span class=\"slider\"></span>\n    </label>\n    <span class=\"label\">\n        {{ value ? trueLabel : falseLabel }}\n    </span>\n</div>",
+                providers: [{
+                        provide: forms.NG_VALUE_ACCESSOR,
+                        useExisting: core.forwardRef(function () { return SwitchComponent_1; }),
+                        multi: true,
+                    }],
+                styles: [".switch{display:-ms-inline-flexbox;display:inline-flex}.switch .switch-toggle{display:inline-block;height:24px;position:relative;width:40px}.switch .switch-toggle input{height:0;opacity:0;width:0}.switch .switch-toggle input:checked+.slider{background-color:#428bca;border-radius:15px}.switch .switch-toggle input:checked+.slider:before{transform:translateX(16px)}.switch .switch-toggle .slider{background-color:#a5a5b2;border-radius:15px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:.4s}.switch .switch-toggle .slider:before{background-color:#fff;border-radius:50%;bottom:4px;content:\"\";height:16px;left:4px;position:absolute;transition:.4s;width:16px}.switch .label{color:#212533;font-family:\"Open Sans\" sans-serif;font-size:.875rem;font-weight:400;line-height:150%;margin-left:12px}.switch--disabled{opacity:.5}.switch--focus .switch-toggle .slider{box-shadow:0 0 0 2px #428BCA80}"]
+            })
+        ], SwitchComponent);
+        return SwitchComponent;
+    }());
+
+    var SwitchModule = /** @class */ (function () {
+        function SwitchModule() {
+        }
+        SwitchModule = __decorate([
+            core.NgModule({
+                imports: [common.CommonModule],
+                declarations: [SwitchComponent],
+                exports: [SwitchComponent],
+            })
+        ], SwitchModule);
+        return SwitchModule;
+    }());
+
     var PanelComponent = /** @class */ (function () {
         function PanelComponent() {
             this.toggleable = true;
@@ -14820,6 +14916,8 @@
     exports.StepsComponent = StepsComponent;
     exports.StepsModule = StepsModule;
     exports.Structure = Structure;
+    exports.SwitchComponent = SwitchComponent;
+    exports.SwitchModule = SwitchModule;
     exports.TableFrozenPositionDirective = TableFrozenPositionDirective;
     exports.TableHeaderCheckboxComponent = TableHeaderCheckboxComponent;
     exports.TableHeaderCheckboxModule = TableHeaderCheckboxModule;