@energinet/watt 0.0.1

package/fesm2022/energinet-watt-checkbox.mjs

@@ -0,0 +1,118 @@
+import * as i0 from '@angular/core';
+import { inject, ElementRef, signal, input, forwardRef, ViewEncapsulation, Component } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
+
+//#region License
+/**
+ * @license
+ * Copyright 2020 Energinet DataHub A/S
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License2");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+//#endregion
+class WattCheckboxComponent {
+    element = inject(ElementRef);
+    checked = null;
+    isdisabled = signal(false);
+    indeterminate = signal(false);
+    required = input(false);
+    onChange = () => {
+        //
+    };
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.element.nativeElement.addEventListener('focusout', fn);
+    }
+    writeValue(checked) {
+        this.indeterminate.set(checked === null ? true : false);
+        this.checked = checked;
+    }
+    onModelChange(e) {
+        this.indeterminate.set(false);
+        this.checked = e;
+        this.onChange(e);
+    }
+    setDisabledState(isDisabled) {
+        this.isdisabled.set(isDisabled);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.1", type: WattCheckboxComponent, isStandalone: true, selector: "watt-checkbox", inputs: { required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.watt-checkbox--disabled": "isdisabled()", "class.watt-checkbox--indeterminate": "indeterminate()" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => WattCheckboxComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: `<label>
+    <input
+      [ngModel]="checked"
+      [disabled]="isdisabled()"
+      [indeterminate]="indeterminate()"
+      [required]="required()"
+      (ngModelChange)="onModelChange($event)"
+      type="checkbox"
+    />
+    <ng-content />
+  </label>`, isInline: true, styles: ["form.ng-submitted watt-checkbox.ng-invalid label{color:var(--watt-checkbox-error-color)}form.ng-submitted watt-checkbox.ng-invalid input{border-color:var(--watt-checkbox-error-color)}form.ng-submitted watt-checkbox.watt-checkbox--indeterminate.ng-invalid input{background-color:var(--watt-checkbox-error-color)}watt-checkbox{--watt-checkbox-disabled-color: var(--watt-color-neutral-grey-400);--watt-checkbox-color: var(--watt-color-primary);--watt-checkbox-checkmark-color: var(--watt-on-dark-high-emphasis);--watt-checkbox-error-color: var(--watt-color-state-danger);display:block}watt-checkbox.ng-dirty.ng-invalid label{color:var(--watt-checkbox-error-color)}watt-checkbox.ng-dirty.ng-invalid input{border-color:var(--watt-checkbox-error-color)}watt-checkbox input{appearance:none;margin:0;padding:0;width:16px;height:16px;border:1px solid var(--watt-checkbox-color);border-radius:2px;display:grid;place-content:center;cursor:pointer}watt-checkbox input:before{content:\"\";width:.65em;height:.65em;transform:scale(0);transition:.12s transform ease-in-out;box-shadow:inset 1em 1em var(--watt-checkbox-checkmark-color);transform-origin:bottom left;clip-path:polygon(8.79% 46.33%,.66% 56%,40.8% 89.74%,99.73% 25.3%,91.52% 17.78%,40.8% 73.23%)}watt-checkbox.watt-checkbox--indeterminate input:before{clip-path:polygon(29% 44%,76.5% 44%,76.5% 56.25%,29% 56.25%);transform:scale(1)}watt-checkbox.watt-checkbox--indeterminate.ng-dirty.ng-invalid input:before{background-color:var(--watt-checkbox-error-color)}watt-checkbox input:checked:before{transform:scale(1)}watt-checkbox input:checked,watt-checkbox.watt-checkbox--indeterminate input{background-color:var(--watt-checkbox-color)}watt-checkbox input:disabled{border-color:var(--watt-checkbox-disabled-color);cursor:inherit}watt-checkbox input:disabled:checked{background-color:var(--watt-checkbox-disabled-color)}watt-checkbox.watt-checkbox--disabled label{color:var(--watt-checkbox-disabled-color);cursor:inherit}watt-checkbox label{display:grid;grid-template-columns:1em auto;gap:.5em;align-items:center;-webkit-user-select:none;user-select:none;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.CheckboxRequiredValidator, selector: "input[type=checkbox][required][formControlName],input[type=checkbox][required][formControl],input[type=checkbox][required][ngModel]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WattCheckboxComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'watt-checkbox', encapsulation: ViewEncapsulation.None, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => WattCheckboxComponent),
+                            multi: true,
+                        },
+                    ], host: {
+                        '[class.watt-checkbox--disabled]': 'isdisabled()',
+                        '[class.watt-checkbox--indeterminate]': 'indeterminate()',
+                    }, imports: [FormsModule], template: `<label>
+    <input
+      [ngModel]="checked"
+      [disabled]="isdisabled()"
+      [indeterminate]="indeterminate()"
+      [required]="required()"
+      (ngModelChange)="onModelChange($event)"
+      type="checkbox"
+    />
+    <ng-content />
+  </label>`, styles: ["form.ng-submitted watt-checkbox.ng-invalid label{color:var(--watt-checkbox-error-color)}form.ng-submitted watt-checkbox.ng-invalid input{border-color:var(--watt-checkbox-error-color)}form.ng-submitted watt-checkbox.watt-checkbox--indeterminate.ng-invalid input{background-color:var(--watt-checkbox-error-color)}watt-checkbox{--watt-checkbox-disabled-color: var(--watt-color-neutral-grey-400);--watt-checkbox-color: var(--watt-color-primary);--watt-checkbox-checkmark-color: var(--watt-on-dark-high-emphasis);--watt-checkbox-error-color: var(--watt-color-state-danger);display:block}watt-checkbox.ng-dirty.ng-invalid label{color:var(--watt-checkbox-error-color)}watt-checkbox.ng-dirty.ng-invalid input{border-color:var(--watt-checkbox-error-color)}watt-checkbox input{appearance:none;margin:0;padding:0;width:16px;height:16px;border:1px solid var(--watt-checkbox-color);border-radius:2px;display:grid;place-content:center;cursor:pointer}watt-checkbox input:before{content:\"\";width:.65em;height:.65em;transform:scale(0);transition:.12s transform ease-in-out;box-shadow:inset 1em 1em var(--watt-checkbox-checkmark-color);transform-origin:bottom left;clip-path:polygon(8.79% 46.33%,.66% 56%,40.8% 89.74%,99.73% 25.3%,91.52% 17.78%,40.8% 73.23%)}watt-checkbox.watt-checkbox--indeterminate input:before{clip-path:polygon(29% 44%,76.5% 44%,76.5% 56.25%,29% 56.25%);transform:scale(1)}watt-checkbox.watt-checkbox--indeterminate.ng-dirty.ng-invalid input:before{background-color:var(--watt-checkbox-error-color)}watt-checkbox input:checked:before{transform:scale(1)}watt-checkbox input:checked,watt-checkbox.watt-checkbox--indeterminate input{background-color:var(--watt-checkbox-color)}watt-checkbox input:disabled{border-color:var(--watt-checkbox-disabled-color);cursor:inherit}watt-checkbox input:disabled:checked{background-color:var(--watt-checkbox-disabled-color)}watt-checkbox.watt-checkbox--disabled label{color:var(--watt-checkbox-disabled-color);cursor:inherit}watt-checkbox label{display:grid;grid-template-columns:1em auto;gap:.5em;align-items:center;-webkit-user-select:none;user-select:none;cursor:pointer}\n"] }]
+        }] });
+
+//#region License
+/**
+ * @license
+ * Copyright 2020 Energinet DataHub A/S
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License2");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+//#endregion
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { WattCheckboxComponent };
+//# sourceMappingURL=energinet-watt-checkbox.mjs.map

package/fesm2022/energinet-watt-checkbox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"energinet-watt-checkbox.mjs","sources":["../../../libs/watt/package/checkbox/watt-checkbox.component.ts","../../../libs/watt/package/checkbox/index.ts","../../../libs/watt/package/checkbox/energinet-watt-checkbox.ts"],"sourcesContent":["//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nimport {\n  input,\n  signal,\n  inject,\n  Component,\n  ElementRef,\n  forwardRef,\n  ViewEncapsulation,\n} from '@angular/core';\n\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';\n\n@Component({\n  selector: 'watt-checkbox',\n  encapsulation: ViewEncapsulation.None,\n  styleUrls: ['./watt-checkbox.component.scss'],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => WattCheckboxComponent),\n      multi: true,\n    },\n  ],\n  host: {\n    '[class.watt-checkbox--disabled]': 'isdisabled()',\n    '[class.watt-checkbox--indeterminate]': 'indeterminate()',\n  },\n  imports: [FormsModule],\n  template: `<label>\n    <input\n      [ngModel]=\"checked\"\n      [disabled]=\"isdisabled()\"\n      [indeterminate]=\"indeterminate()\"\n      [required]=\"required()\"\n      (ngModelChange)=\"onModelChange($event)\"\n      type=\"checkbox\"\n    />\n    <ng-content />\n  </label>`,\n})\nexport class WattCheckboxComponent implements ControlValueAccessor {\n  private element = inject(ElementRef);\n\n  checked: boolean | null = null;\n\n  isdisabled = signal(false);\n  indeterminate = signal(false);\n  required = input(false);\n\n  onChange: (value: boolean) => void = () => {\n    //\n  };\n\n  registerOnChange(fn: (value: boolean) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: (value: boolean) => void): void {\n    this.element.nativeElement.addEventListener('focusout', fn);\n  }\n\n  writeValue(checked: boolean | null) {\n    this.indeterminate.set(checked === null ? true : false);\n    this.checked = checked;\n  }\n\n  onModelChange(e: boolean) {\n    this.indeterminate.set(false);\n    this.checked = e;\n    this.onChange(e);\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.isdisabled.set(isDisabled);\n  }\n}\n","//#region License\n/**\n * @license\n * Copyright 2020 Energinet DataHub A/S\n *\n * Licensed under the Apache License, Version 2.0 (the \"License2\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n//#endregion\nexport { WattCheckboxComponent } from './watt-checkbox.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}