@mk-kit/ui 0.50.0 → 0.52.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/mk-kit-ui-block-editor.mjs +2 -1
- package/fesm2022/mk-kit-ui-block-editor.mjs.map +1 -1
- package/fesm2022/mk-kit-ui-checkbox.mjs +2 -1
- package/fesm2022/mk-kit-ui-checkbox.mjs.map +1 -1
- package/fesm2022/mk-kit-ui-core-signal-forms.mjs +56 -0
- package/fesm2022/mk-kit-ui-core-signal-forms.mjs.map +1 -0
- package/fesm2022/mk-kit-ui-core.mjs +1 -43
- package/fesm2022/mk-kit-ui-core.mjs.map +1 -1
- package/fesm2022/mk-kit-ui-data.mjs +2 -1
- package/fesm2022/mk-kit-ui-data.mjs.map +1 -1
- package/fesm2022/mk-kit-ui-datetime.mjs +2 -1
- package/fesm2022/mk-kit-ui-datetime.mjs.map +1 -1
- package/fesm2022/mk-kit-ui-feedback-prompt-dialog-DnxQ7M0h.mjs +49 -0
- package/fesm2022/mk-kit-ui-feedback-prompt-dialog-DnxQ7M0h.mjs.map +1 -0
- package/fesm2022/mk-kit-ui-feedback.mjs +7 -43
- package/fesm2022/mk-kit-ui-feedback.mjs.map +1 -1
- package/fesm2022/mk-kit-ui-forms.mjs +2 -1
- package/fesm2022/mk-kit-ui-forms.mjs.map +1 -1
- package/fesm2022/mk-kit-ui-rich-text.mjs +2 -1
- package/fesm2022/mk-kit-ui-rich-text.mjs.map +1 -1
- package/fesm2022/mk-kit-ui-testing.mjs +13 -2
- package/fesm2022/mk-kit-ui-testing.mjs.map +1 -1
- package/fesm2022/mk-kit-ui.mjs +1 -0
- package/fesm2022/mk-kit-ui.mjs.map +1 -1
- package/package.json +5 -1
- package/types/mk-kit-ui-core-signal-forms.d.ts +31 -0
- package/types/mk-kit-ui-core.d.ts +1 -29
- package/types/mk-kit-ui-feedback.d.ts +1 -22
- package/types/mk-kit-ui-testing.d.ts +6 -1
- package/types/mk-kit-ui.d.ts +1 -0
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { inject, model, input, booleanAttribute, signal, computed, forwardRef, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
|
|
4
|
-
import { MkFieldContext,
|
|
4
|
+
import { MkFieldContext, mkUniqueId, mkValidatorChange } from '@mk-kit/ui/core';
|
|
5
|
+
import { mkInjectFieldTouched } from '@mk-kit/ui/core/signal-forms';
|
|
5
6
|
|
|
6
7
|
/**
|
|
7
8
|
* Checkbox — a themed checkbox built on a visually-hidden native
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mk-kit-ui-checkbox.mjs","sources":["../../../projects/mk-kit/checkbox/checkbox.ts","../../../projects/mk-kit/checkbox/checkbox.html","../../../projects/mk-kit/checkbox/mk-kit-ui-checkbox.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n booleanAttribute,\n computed,\n forwardRef,\n inject,\n input,\n model,\n signal,\n} from '@angular/core';\nimport {\n ControlValueAccessor,\n NG_VALIDATORS,\n NG_VALUE_ACCESSOR,\n type AbstractControl,\n type ValidationErrors,\n type Validator,\n} from '@angular/forms';\nimport type { MkSize, MkTone } from '@mk-kit/ui/core';\nimport { MkFieldContext } from '@mk-kit/ui/core';\nimport { mkUniqueId } from '@mk-kit/ui/core';\nimport { mkValidatorChange } from '@mk-kit/ui/core';\nimport { mkInjectFieldTouched } from '@mk-kit/ui/core';\n\n/**\n * Checkbox — a themed checkbox built on a visually-hidden native\n * `input[type=checkbox]` (so keyboard + form semantics are native) with a\n * custom box. Supports an `indeterminate` state and projects its label.\n *\n * Implements `ControlValueAccessor` with a two-way `checked` model, so it works\n * with `[(ngModel)]`, reactive forms and `[(checked)]`.\n *\n * ```html\n * <mk-checkbox [(ngModel)]=\"accepted\">Accept terms</mk-checkbox>\n * <mk-checkbox [(checked)]=\"all\" [indeterminate]=\"some()\" tone=\"success\">\n * Select all\n * </mk-checkbox>\n * ```\n */\n@Component({\n selector: 'mk-checkbox',\n templateUrl: './checkbox.html',\n styleUrl: './checkbox.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'mk-checkbox',\n '[class.mk-checkbox--sm]': \"size() === 'sm'\",\n '[class.mk-checkbox--md]': \"size() === 'md'\",\n '[class.mk-checkbox--lg]': \"size() === 'lg'\",\n '[class.mk-checkbox--checked]': 'checked()',\n '[class.mk-checkbox--indeterminate]': 'indeterminate()',\n '[class.mk-checkbox--disabled]': 'isDisabled()',\n '[class.mk-checkbox--invalid]': 'isInvalid()',\n '[attr.data-tone]': 'tone()',\n },\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => MkCheckbox),\n multi: true,\n },\n {\n provide: NG_VALIDATORS,\n useExisting: forwardRef(() => MkCheckbox),\n multi: true,\n },\n ],\n})\nexport class MkCheckbox implements ControlValueAccessor, Validator {\n private readonly field = inject(MkFieldContext, { optional: true });\n /** Signal Forms: gates `invalid` until the bound field is touched or dirty. */\n private readonly fieldTouched = mkInjectFieldTouched();\n\n /** Two-way checked state. */\n readonly checked = model(false);\n /** Two-way indeterminate (\"mixed\") state; cleared when the user toggles. */\n readonly indeterminate = model(false);\n /** Disable the control. */\n readonly disabled = input(false, { transform: booleanAttribute });\n /** Force the invalid visual + `aria-invalid` when used standalone. */\n readonly invalid = input(false, { transform: booleanAttribute });\n /** Mark required (adds `aria-required`). */\n readonly required = input(false, { transform: booleanAttribute });\n /** Control size. */\n readonly size = input<MkSize>('md');\n /** Semantic color tone for the checked box. */\n readonly tone = input<MkTone>('primary');\n /** Accessible label when no text content is projected. */\n readonly ariaLabel = input<string>('', { alias: 'aria-label' });\n\n private readonly cvaDisabled = signal(false);\n private onChange: (value: boolean) => void = () => {};\n protected onTouched: () => void = () => {};\n\n readonly inputId = this.field?.controlId ?? mkUniqueId('mk-checkbox');\n\n protected readonly isDisabled = computed(\n () => this.disabled() || this.cvaDisabled(),\n );\n protected readonly isRequired = computed(\n () => this.required() || (this.field?.isRequired() ?? false),\n );\n protected readonly isInvalid = computed(\n () => (this.invalid() && this.fieldTouched()) || (this.field?.hasError() ?? false),\n );\n protected readonly describedBy = computed(\n () => this.field?.describedBy() ?? null,\n );\n\n protected onNativeChange(event: Event): void {\n const target = event.target as HTMLInputElement;\n this.indeterminate.set(false);\n this.checked.set(target.checked);\n this.onChange(target.checked);\n }\n\n // --- ControlValueAccessor -------------------------------------------------\n writeValue(value: unknown): void {\n this.checked.set(!!value);\n }\n registerOnChange(fn: (value: boolean) => void): void {\n this.onChange = fn;\n }\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n setDisabledState(isDisabled: boolean): void {\n this.cvaDisabled.set(isDisabled);\n }\n\n // --- Validator ------------------------------------------------------------\n private readonly validatorChange = mkValidatorChange(() => {\n this.required();\n });\n\n /**\n * Reports `required` for an unchecked box when `[required]` is set, so\n * `required` on the element behaves like `Validators.requiredTrue`.\n */\n validate(control: AbstractControl): ValidationErrors | null {\n if (!this.required()) return null;\n return control.value === true ? null : { required: true };\n }\n\n registerOnValidatorChange(fn: () => void): void {\n this.validatorChange.register(fn);\n }\n}\n","<label class=\"mk-checkbox__root\">\n <span class=\"mk-checkbox__control\">\n <input\n class=\"mk-checkbox__native\"\n type=\"checkbox\"\n [id]=\"inputId\"\n [checked]=\"checked()\"\n [indeterminate]=\"indeterminate()\"\n [disabled]=\"isDisabled()\"\n [required]=\"isRequired()\"\n [attr.aria-label]=\"ariaLabel() || null\"\n [attr.aria-required]=\"isRequired() || null\"\n [attr.aria-invalid]=\"isInvalid() || null\"\n [attr.aria-describedby]=\"describedBy()\"\n (change)=\"onNativeChange($event)\"\n (blur)=\"onTouched()\"\n />\n <span class=\"mk-checkbox__box\" aria-hidden=\"true\">\n <span class=\"mk-checkbox__check\"></span>\n <span class=\"mk-checkbox__dash\"></span>\n </span>\n </span>\n <span class=\"mk-checkbox__text\"><ng-content /></span>\n</label>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAyBA;;;;;;;;;;;;;;AAcG;MA8BU,UAAU,CAAA;IACJ,KAAK,GAAG,MAAM,CAAC,cAAc,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;;IAElD,YAAY,GAAG,oBAAoB,EAAE;;IAG7C,OAAO,GAAG,KAAK,CAAC,KAAK;gFAAC;;IAEtB,aAAa,GAAG,KAAK,CAAC,KAAK;sFAAC;;IAE5B,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;;IAExD,OAAO,GAAG,KAAK,CAAC,KAAK,+EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;;IAEvD,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;;IAExD,IAAI,GAAG,KAAK,CAAS,IAAI;6EAAC;;IAE1B,IAAI,GAAG,KAAK,CAAS,SAAS;6EAAC;;IAE/B,SAAS,GAAG,KAAK,CAAS,EAAE,iFAAI,KAAK,EAAE,YAAY,EAAA,CAAG;IAE9C,WAAW,GAAG,MAAM,CAAC,KAAK;oFAAC;AACpC,IAAA,QAAQ,GAA6B,MAAK,EAAE,CAAC;AAC3C,IAAA,SAAS,GAAe,MAAK,EAAE,CAAC;IAEjC,OAAO,GAAG,IAAI,CAAC,KAAK,EAAE,SAAS,IAAI,UAAU,CAAC,aAAa,CAAC;AAElD,IAAA,UAAU,GAAG,QAAQ,CACtC,MAAM,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,WAAW,EAAE;mFAC5C;IACkB,UAAU,GAAG,QAAQ,CACtC,MAAM,IAAI,CAAC,QAAQ,EAAE,KAAK,IAAI,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,KAAK,CAAC;mFAC7D;IACkB,SAAS,GAAG,QAAQ,CACrC,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,IAAI,CAAC,YAAY,EAAE,MAAM,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,KAAK,CAAC;kFACnF;AACkB,IAAA,WAAW,GAAG,QAAQ,CACvC,MAAM,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,IAAI,IAAI;oFACxC;AAES,IAAA,cAAc,CAAC,KAAY,EAAA;AACnC,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B;AAC/C,QAAA,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC;QAC7B,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC;AAChC,QAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC;IAC/B;;AAGA,IAAA,UAAU,CAAC,KAAc,EAAA;QACvB,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC;IAC3B;AACA,IAAA,gBAAgB,CAAC,EAA4B,EAAA;AAC3C,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;IACpB;AACA,IAAA,iBAAiB,CAAC,EAAc,EAAA;AAC9B,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AACA,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AAClC,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,UAAU,CAAC;IAClC;;AAGiB,IAAA,eAAe,GAAG,iBAAiB,CAAC,MAAK;QACxD,IAAI,CAAC,QAAQ,EAAE;AACjB,IAAA,CAAC,CAAC;AAEF;;;AAGG;AACH,IAAA,QAAQ,CAAC,OAAwB,EAAA;AAC/B,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAAE,YAAA,OAAO,IAAI;AACjC,QAAA,OAAO,OAAO,CAAC,KAAK,KAAK,IAAI,GAAG,IAAI,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE;IAC3D;AAEA,IAAA,yBAAyB,CAAC,EAAc,EAAA;AACtC,QAAA,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,EAAE,CAAC;IACnC;uGA9EW,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAV,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAU,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,eAAA,EAAA,aAAA,EAAA,qBAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,uBAAA,EAAA,iBAAA,EAAA,4BAAA,EAAA,WAAA,EAAA,kCAAA,EAAA,iBAAA,EAAA,6BAAA,EAAA,cAAA,EAAA,4BAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,EAAA,cAAA,EAAA,aAAA,EAAA,EAAA,SAAA,EAbV;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,UAAU,CAAC;AACzC,gBAAA,KAAK,EAAE,IAAI;AACZ,aAAA;AACD,YAAA;AACE,gBAAA,OAAO,EAAE,aAAa;AACtB,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,UAAU,CAAC;AACzC,gBAAA,KAAK,EAAE,IAAI;AACZ,aAAA;AACF,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnEH,y1BAwBA,EAAA,MAAA,EAAA,CAAA,06FAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FD6Ca,UAAU,EAAA,UAAA,EAAA,CAAA;kBA7BtB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,EAAA,eAAA,EAGN,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,KAAK,EAAE,aAAa;AACpB,wBAAA,yBAAyB,EAAE,iBAAiB;AAC5C,wBAAA,yBAAyB,EAAE,iBAAiB;AAC5C,wBAAA,yBAAyB,EAAE,iBAAiB;AAC5C,wBAAA,8BAA8B,EAAE,WAAW;AAC3C,wBAAA,oCAAoC,EAAE,iBAAiB;AACvD,wBAAA,+BAA+B,EAAE,cAAc;AAC/C,wBAAA,8BAA8B,EAAE,aAAa;AAC7C,wBAAA,kBAAkB,EAAE,QAAQ;qBAC7B,EAAA,SAAA,EACU;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,gBAAgB,CAAC;AACzC,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;AACD,wBAAA;AACE,4BAAA,OAAO,EAAE,aAAa;AACtB,4BAAA,WAAW,EAAE,UAAU,CAAC,gBAAgB,CAAC;AACzC,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;AACF,qBAAA,EAAA,QAAA,EAAA,y1BAAA,EAAA,MAAA,EAAA,CAAA,06FAAA,CAAA,EAAA;;;AEnEH;;AAEG;;;;"}
|
|
1
|
+
{"version":3,"file":"mk-kit-ui-checkbox.mjs","sources":["../../../projects/mk-kit/checkbox/checkbox.ts","../../../projects/mk-kit/checkbox/checkbox.html","../../../projects/mk-kit/checkbox/mk-kit-ui-checkbox.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n booleanAttribute,\n computed,\n forwardRef,\n inject,\n input,\n model,\n signal,\n} from '@angular/core';\nimport {\n ControlValueAccessor,\n NG_VALIDATORS,\n NG_VALUE_ACCESSOR,\n type AbstractControl,\n type ValidationErrors,\n type Validator,\n} from '@angular/forms';\nimport type { MkSize, MkTone } from '@mk-kit/ui/core';\nimport { MkFieldContext } from '@mk-kit/ui/core';\nimport { mkUniqueId } from '@mk-kit/ui/core';\nimport { mkValidatorChange } from '@mk-kit/ui/core';\nimport { mkInjectFieldTouched } from '@mk-kit/ui/core/signal-forms';\n\n/**\n * Checkbox — a themed checkbox built on a visually-hidden native\n * `input[type=checkbox]` (so keyboard + form semantics are native) with a\n * custom box. Supports an `indeterminate` state and projects its label.\n *\n * Implements `ControlValueAccessor` with a two-way `checked` model, so it works\n * with `[(ngModel)]`, reactive forms and `[(checked)]`.\n *\n * ```html\n * <mk-checkbox [(ngModel)]=\"accepted\">Accept terms</mk-checkbox>\n * <mk-checkbox [(checked)]=\"all\" [indeterminate]=\"some()\" tone=\"success\">\n * Select all\n * </mk-checkbox>\n * ```\n */\n@Component({\n selector: 'mk-checkbox',\n templateUrl: './checkbox.html',\n styleUrl: './checkbox.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'mk-checkbox',\n '[class.mk-checkbox--sm]': \"size() === 'sm'\",\n '[class.mk-checkbox--md]': \"size() === 'md'\",\n '[class.mk-checkbox--lg]': \"size() === 'lg'\",\n '[class.mk-checkbox--checked]': 'checked()',\n '[class.mk-checkbox--indeterminate]': 'indeterminate()',\n '[class.mk-checkbox--disabled]': 'isDisabled()',\n '[class.mk-checkbox--invalid]': 'isInvalid()',\n '[attr.data-tone]': 'tone()',\n },\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => MkCheckbox),\n multi: true,\n },\n {\n provide: NG_VALIDATORS,\n useExisting: forwardRef(() => MkCheckbox),\n multi: true,\n },\n ],\n})\nexport class MkCheckbox implements ControlValueAccessor, Validator {\n private readonly field = inject(MkFieldContext, { optional: true });\n /** Signal Forms: gates `invalid` until the bound field is touched or dirty. */\n private readonly fieldTouched = mkInjectFieldTouched();\n\n /** Two-way checked state. */\n readonly checked = model(false);\n /** Two-way indeterminate (\"mixed\") state; cleared when the user toggles. */\n readonly indeterminate = model(false);\n /** Disable the control. */\n readonly disabled = input(false, { transform: booleanAttribute });\n /** Force the invalid visual + `aria-invalid` when used standalone. */\n readonly invalid = input(false, { transform: booleanAttribute });\n /** Mark required (adds `aria-required`). */\n readonly required = input(false, { transform: booleanAttribute });\n /** Control size. */\n readonly size = input<MkSize>('md');\n /** Semantic color tone for the checked box. */\n readonly tone = input<MkTone>('primary');\n /** Accessible label when no text content is projected. */\n readonly ariaLabel = input<string>('', { alias: 'aria-label' });\n\n private readonly cvaDisabled = signal(false);\n private onChange: (value: boolean) => void = () => {};\n protected onTouched: () => void = () => {};\n\n readonly inputId = this.field?.controlId ?? mkUniqueId('mk-checkbox');\n\n protected readonly isDisabled = computed(\n () => this.disabled() || this.cvaDisabled(),\n );\n protected readonly isRequired = computed(\n () => this.required() || (this.field?.isRequired() ?? false),\n );\n protected readonly isInvalid = computed(\n () => (this.invalid() && this.fieldTouched()) || (this.field?.hasError() ?? false),\n );\n protected readonly describedBy = computed(\n () => this.field?.describedBy() ?? null,\n );\n\n protected onNativeChange(event: Event): void {\n const target = event.target as HTMLInputElement;\n this.indeterminate.set(false);\n this.checked.set(target.checked);\n this.onChange(target.checked);\n }\n\n // --- ControlValueAccessor -------------------------------------------------\n writeValue(value: unknown): void {\n this.checked.set(!!value);\n }\n registerOnChange(fn: (value: boolean) => void): void {\n this.onChange = fn;\n }\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n setDisabledState(isDisabled: boolean): void {\n this.cvaDisabled.set(isDisabled);\n }\n\n // --- Validator ------------------------------------------------------------\n private readonly validatorChange = mkValidatorChange(() => {\n this.required();\n });\n\n /**\n * Reports `required` for an unchecked box when `[required]` is set, so\n * `required` on the element behaves like `Validators.requiredTrue`.\n */\n validate(control: AbstractControl): ValidationErrors | null {\n if (!this.required()) return null;\n return control.value === true ? null : { required: true };\n }\n\n registerOnValidatorChange(fn: () => void): void {\n this.validatorChange.register(fn);\n }\n}\n","<label class=\"mk-checkbox__root\">\n <span class=\"mk-checkbox__control\">\n <input\n class=\"mk-checkbox__native\"\n type=\"checkbox\"\n [id]=\"inputId\"\n [checked]=\"checked()\"\n [indeterminate]=\"indeterminate()\"\n [disabled]=\"isDisabled()\"\n [required]=\"isRequired()\"\n [attr.aria-label]=\"ariaLabel() || null\"\n [attr.aria-required]=\"isRequired() || null\"\n [attr.aria-invalid]=\"isInvalid() || null\"\n [attr.aria-describedby]=\"describedBy()\"\n (change)=\"onNativeChange($event)\"\n (blur)=\"onTouched()\"\n />\n <span class=\"mk-checkbox__box\" aria-hidden=\"true\">\n <span class=\"mk-checkbox__check\"></span>\n <span class=\"mk-checkbox__dash\"></span>\n </span>\n </span>\n <span class=\"mk-checkbox__text\"><ng-content /></span>\n</label>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import { inject, Injector, computed } from '@angular/core';
|
|
2
|
+
import { FORM_FIELD } from '@angular/forms/signals';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Touched-gate for a control's `invalid` input under Signal Forms.
|
|
6
|
+
*
|
|
7
|
+
* When a control is bound with the `[formField]` directive, Angular writes the
|
|
8
|
+
* field's `invalid()` state straight into the control's `invalid` input — from
|
|
9
|
+
* the first render, before the user has reached the field. mk-kit controls
|
|
10
|
+
* pass that input through this gate so the invalid visual (and `aria-invalid`)
|
|
11
|
+
* only shows once the field is touched or dirty, matching how `mk-form-field`
|
|
12
|
+
* reveals its message and how `submit()` (which marks every field touched)
|
|
13
|
+
* surfaces the remaining problems.
|
|
14
|
+
*
|
|
15
|
+
* Returns a signal that is always `true` for a control that is not bound with
|
|
16
|
+
* `[formField]`, so a standalone `[invalid]="true"` keeps working as before.
|
|
17
|
+
* Call it in a field initializer (an injection context):
|
|
18
|
+
*
|
|
19
|
+
* ```ts
|
|
20
|
+
* private readonly fieldTouched = mkInjectFieldTouched();
|
|
21
|
+
* protected readonly isInvalid = computed(
|
|
22
|
+
* () => (this.invalid() && this.fieldTouched()) || (this.field?.hasError() ?? false),
|
|
23
|
+
* );
|
|
24
|
+
* ```
|
|
25
|
+
*
|
|
26
|
+
* The binding is looked up lazily, on first read: the `FormField` directive
|
|
27
|
+
* itself injects the element's `NG_VALUE_ACCESSOR` (the control) while it is
|
|
28
|
+
* created, so resolving it from the control's constructor would be circular.
|
|
29
|
+
*/
|
|
30
|
+
function mkInjectFieldTouched() {
|
|
31
|
+
const injector = inject(Injector);
|
|
32
|
+
let formField;
|
|
33
|
+
const resolve = () => formField === undefined
|
|
34
|
+
? (formField = injector.get(FORM_FIELD, null, { self: true, optional: true }))
|
|
35
|
+
: formField;
|
|
36
|
+
return computed(() => {
|
|
37
|
+
const field = resolve();
|
|
38
|
+
if (!field)
|
|
39
|
+
return true;
|
|
40
|
+
const state = field.state();
|
|
41
|
+
return state.touched() || state.dirty();
|
|
42
|
+
});
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
// The Signal Forms bridge for mk-kit controls. Its own entry point because it
|
|
46
|
+
// is the one thing in `core` that imports a VALUE from `@angular/forms/signals`
|
|
47
|
+
// (the FORM_FIELD token), which drags `@angular/forms` into every app that
|
|
48
|
+
// touches `@mk-kit/ui/core` — including pages with no form on them. Form
|
|
49
|
+
// controls import it from here; apps rarely need it directly.
|
|
50
|
+
|
|
51
|
+
/**
|
|
52
|
+
* Generated bundle index. Do not edit.
|
|
53
|
+
*/
|
|
54
|
+
|
|
55
|
+
export { mkInjectFieldTouched };
|
|
56
|
+
//# sourceMappingURL=mk-kit-ui-core-signal-forms.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mk-kit-ui-core-signal-forms.mjs","sources":["../../../projects/mk-kit/core/signal-forms/signal-field.ts","../../../projects/mk-kit/core/signal-forms/index.ts","../../../projects/mk-kit/core/signal-forms/mk-kit-ui-core-signal-forms.ts"],"sourcesContent":["import { Injector, type Signal, computed, inject } from '@angular/core';\nimport { FORM_FIELD, type FormField } from '@angular/forms/signals';\n\n/**\n * Touched-gate for a control's `invalid` input under Signal Forms.\n *\n * When a control is bound with the `[formField]` directive, Angular writes the\n * field's `invalid()` state straight into the control's `invalid` input — from\n * the first render, before the user has reached the field. mk-kit controls\n * pass that input through this gate so the invalid visual (and `aria-invalid`)\n * only shows once the field is touched or dirty, matching how `mk-form-field`\n * reveals its message and how `submit()` (which marks every field touched)\n * surfaces the remaining problems.\n *\n * Returns a signal that is always `true` for a control that is not bound with\n * `[formField]`, so a standalone `[invalid]=\"true\"` keeps working as before.\n * Call it in a field initializer (an injection context):\n *\n * ```ts\n * private readonly fieldTouched = mkInjectFieldTouched();\n * protected readonly isInvalid = computed(\n * () => (this.invalid() && this.fieldTouched()) || (this.field?.hasError() ?? false),\n * );\n * ```\n *\n * The binding is looked up lazily, on first read: the `FormField` directive\n * itself injects the element's `NG_VALUE_ACCESSOR` (the control) while it is\n * created, so resolving it from the control's constructor would be circular.\n */\nexport function mkInjectFieldTouched(): Signal<boolean> {\n const injector = inject(Injector);\n let formField: FormField<unknown> | null | undefined;\n const resolve = () =>\n formField === undefined\n ? (formField = injector.get(FORM_FIELD, null, { self: true, optional: true }))\n : formField;\n return computed(() => {\n const field = resolve();\n if (!field) return true;\n const state = field.state();\n return state.touched() || state.dirty();\n });\n}\n","// The Signal Forms bridge for mk-kit controls. Its own entry point because it\n// is the one thing in `core` that imports a VALUE from `@angular/forms/signals`\n// (the FORM_FIELD token), which drags `@angular/forms` into every app that\n// touches `@mk-kit/ui/core` — including pages with no form on them. Form\n// controls import it from here; apps rarely need it directly.\nexport * from './signal-field';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAGA;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;SACa,oBAAoB,GAAA;AAClC,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;AACjC,IAAA,IAAI,SAAgD;AACpD,IAAA,MAAM,OAAO,GAAG,MACd,SAAS,KAAK;WACT,SAAS,GAAG,QAAQ,CAAC,GAAG,CAAC,UAAU,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;UAC3E,SAAS;IACf,OAAO,QAAQ,CAAC,MAAK;AACnB,QAAA,MAAM,KAAK,GAAG,OAAO,EAAE;AACvB,QAAA,IAAI,CAAC,KAAK;AAAE,YAAA,OAAO,IAAI;AACvB,QAAA,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,EAAE;QAC3B,OAAO,KAAK,CAAC,OAAO,EAAE,IAAI,KAAK,CAAC,KAAK,EAAE;AACzC,IAAA,CAAC,CAAC;AACJ;;AC1CA;AACA;AACA;AACA;AACA;;ACJA;;AAEG;;;;"}
|
|
@@ -4,7 +4,6 @@ import { isPlatformBrowser } from '@angular/common';
|
|
|
4
4
|
import { mkComputeAnchoredPosition } from '@mk-kit/core';
|
|
5
5
|
export { MK_QUERY_OPERATORS, MK_QUERY_TEXT_EN, MK_QUERY_UNARY, mkComputeAnchoredPosition, mkCreateQueryGroup, mkCreateQueryRule, mkHighlight, mkHighlightJson, mkIsQueryGroup, mkQueryCompact, mkQueryIsEmpty, mkQueryOperatorLabel, mkQueryOperatorsFor, mkQueryRuleCount, mkQueryRuleIsComplete, mkQueryRuleMatches, mkQueryToPredicate, mkQueryToText, mkUniqueId } from '@mk-kit/core';
|
|
6
6
|
import { Observable } from 'rxjs';
|
|
7
|
-
import { FORM_FIELD } from '@angular/forms/signals';
|
|
8
7
|
|
|
9
8
|
/** Shared primitive types used across mk-kit components. */
|
|
10
9
|
|
|
@@ -1897,47 +1896,6 @@ function mkSignalErrorMessage(errors, strings, overrides) {
|
|
|
1897
1896
|
return mkFirstErrorMessage({ [key]: payload }, strings);
|
|
1898
1897
|
}
|
|
1899
1898
|
|
|
1900
|
-
/**
|
|
1901
|
-
* Touched-gate for a control's `invalid` input under Signal Forms.
|
|
1902
|
-
*
|
|
1903
|
-
* When a control is bound with the `[formField]` directive, Angular writes the
|
|
1904
|
-
* field's `invalid()` state straight into the control's `invalid` input — from
|
|
1905
|
-
* the first render, before the user has reached the field. mk-kit controls
|
|
1906
|
-
* pass that input through this gate so the invalid visual (and `aria-invalid`)
|
|
1907
|
-
* only shows once the field is touched or dirty, matching how `mk-form-field`
|
|
1908
|
-
* reveals its message and how `submit()` (which marks every field touched)
|
|
1909
|
-
* surfaces the remaining problems.
|
|
1910
|
-
*
|
|
1911
|
-
* Returns a signal that is always `true` for a control that is not bound with
|
|
1912
|
-
* `[formField]`, so a standalone `[invalid]="true"` keeps working as before.
|
|
1913
|
-
* Call it in a field initializer (an injection context):
|
|
1914
|
-
*
|
|
1915
|
-
* ```ts
|
|
1916
|
-
* private readonly fieldTouched = mkInjectFieldTouched();
|
|
1917
|
-
* protected readonly isInvalid = computed(
|
|
1918
|
-
* () => (this.invalid() && this.fieldTouched()) || (this.field?.hasError() ?? false),
|
|
1919
|
-
* );
|
|
1920
|
-
* ```
|
|
1921
|
-
*
|
|
1922
|
-
* The binding is looked up lazily, on first read: the `FormField` directive
|
|
1923
|
-
* itself injects the element's `NG_VALUE_ACCESSOR` (the control) while it is
|
|
1924
|
-
* created, so resolving it from the control's constructor would be circular.
|
|
1925
|
-
*/
|
|
1926
|
-
function mkInjectFieldTouched() {
|
|
1927
|
-
const injector = inject(Injector);
|
|
1928
|
-
let formField;
|
|
1929
|
-
const resolve = () => formField === undefined
|
|
1930
|
-
? (formField = injector.get(FORM_FIELD, null, { self: true, optional: true }))
|
|
1931
|
-
: formField;
|
|
1932
|
-
return computed(() => {
|
|
1933
|
-
const field = resolve();
|
|
1934
|
-
if (!field)
|
|
1935
|
-
return true;
|
|
1936
|
-
const state = field.state();
|
|
1937
|
-
return state.touched() || state.dirty();
|
|
1938
|
-
});
|
|
1939
|
-
}
|
|
1940
|
-
|
|
1941
1899
|
/**
|
|
1942
1900
|
* Delegates to `@mk-kit/core` — the exported names and behaviour are
|
|
1943
1901
|
* unchanged. `mkQueryOperatorLabel` / `mkQueryToText` accept the full
|
|
@@ -1949,5 +1907,5 @@ function mkInjectFieldTouched() {
|
|
|
1949
1907
|
* Generated bundle index. Do not edit.
|
|
1950
1908
|
*/
|
|
1951
1909
|
|
|
1952
|
-
export { MK_BREAKPOINTS, MK_DEFAULT_BREAKPOINTS, MK_DEFAULT_DATE_NAMES, MK_DEFAULT_I18N, MK_DEFAULT_VALIDATION, MK_I18N, MK_OVERLAY_DATA, MK_OVERLAY_ROOT, MkAnchoredPanel, MkBreakpointService, MkFieldContext, MkFocusTrap, MkLiveAnnouncer, MkOverlayRef, MkOverlayService, MkThemeService, mkBodyLevelAncestor, mkFirstErrorMessage, mkGetFocusable,
|
|
1910
|
+
export { MK_BREAKPOINTS, MK_DEFAULT_BREAKPOINTS, MK_DEFAULT_DATE_NAMES, MK_DEFAULT_I18N, MK_DEFAULT_VALIDATION, MK_I18N, MK_OVERLAY_DATA, MK_OVERLAY_ROOT, MkAnchoredPanel, MkBreakpointService, MkFieldContext, MkFocusTrap, MkLiveAnnouncer, MkOverlayRef, MkOverlayService, MkThemeService, mkBodyLevelAncestor, mkFirstErrorMessage, mkGetFocusable, mkIsResponsive, mkMergeI18n, mkSignalErrorMessage, mkSignalErrorsToValidationErrors, mkValidatorChange, provideMkI18n };
|
|
1953
1911
|
//# sourceMappingURL=mk-kit-ui-core.mjs.map
|