@mk-kit/ui 0.51.0 → 0.52.0

package/fesm2022/mk-kit-ui-checkbox.mjs

@@ -1,7 +1,8 @@
 import * as i0 from '@angular/core';
 import { inject, model, input, booleanAttribute, signal, computed, forwardRef, ChangeDetectionStrategy, Component } from '@angular/core';
 import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
-import { MkFieldContext, mkInjectFieldTouched, mkUniqueId, mkValidatorChange } from '@mk-kit/ui/core';
+import { MkFieldContext, mkUniqueId, mkValidatorChange } from '@mk-kit/ui/core';
+import { mkInjectFieldTouched } from '@mk-kit/ui/core/signal-forms';
 
 /**
  * Checkbox — a themed checkbox built on a visually-hidden native

package/fesm2022/mk-kit-ui-checkbox.mjs.map

@@ -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":"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"}
+{"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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"}

package/fesm2022/mk-kit-ui-core-signal-forms.mjs

@@ -0,0 +1,56 @@
+import { inject, Injector, computed } from '@angular/core';
+import { FORM_FIELD } from '@angular/forms/signals';
+
+/**
+ * Touched-gate for a control's `invalid` input under Signal Forms.
+ *
+ * When a control is bound with the `[formField]` directive, Angular writes the
+ * field's `invalid()` state straight into the control's `invalid` input — from
+ * the first render, before the user has reached the field. mk-kit controls
+ * pass that input through this gate so the invalid visual (and `aria-invalid`)
+ * only shows once the field is touched or dirty, matching how `mk-form-field`
+ * reveals its message and how `submit()` (which marks every field touched)
+ * surfaces the remaining problems.
+ *
+ * Returns a signal that is always `true` for a control that is not bound with
+ * `[formField]`, so a standalone `[invalid]="true"` keeps working as before.
+ * Call it in a field initializer (an injection context):
+ *
+ * ```ts
+ * private readonly fieldTouched = mkInjectFieldTouched();
+ * protected readonly isInvalid = computed(
+ *   () => (this.invalid() && this.fieldTouched()) || (this.field?.hasError() ?? false),
+ * );
+ * ```
+ *
+ * The binding is looked up lazily, on first read: the `FormField` directive
+ * itself injects the element's `NG_VALUE_ACCESSOR` (the control) while it is
+ * created, so resolving it from the control's constructor would be circular.
+ */
+function mkInjectFieldTouched() {
+    const injector = inject(Injector);
+    let formField;
+    const resolve = () => formField === undefined
+        ? (formField = injector.get(FORM_FIELD, null, { self: true, optional: true }))
+        : formField;
+    return computed(() => {
+        const field = resolve();
+        if (!field)
+            return true;
+        const state = field.state();
+        return state.touched() || state.dirty();
+    });
+}
+
+// The Signal Forms bridge for mk-kit controls. Its own entry point because it
+// is the one thing in `core` that imports a VALUE from `@angular/forms/signals`
+// (the FORM_FIELD token), which drags `@angular/forms` into every app that
+// touches `@mk-kit/ui/core` — including pages with no form on them. Form
+// controls import it from here; apps rarely need it directly.
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { mkInjectFieldTouched };
+//# sourceMappingURL=mk-kit-ui-core-signal-forms.mjs.map

package/fesm2022/mk-kit-ui-core-signal-forms.mjs.map

@@ -0,0 +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;;;;"}

package/fesm2022/mk-kit-ui-core.mjs

@@ -4,7 +4,6 @@ import { isPlatformBrowser } from '@angular/common';
 import { mkComputeAnchoredPosition } from '@mk-kit/core';
 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';
 import { Observable } from 'rxjs';
-import { FORM_FIELD } from '@angular/forms/signals';
 
 /** Shared primitive types used across mk-kit components. */
 
@@ -1897,47 +1896,6 @@ function mkSignalErrorMessage(errors, strings, overrides) {
     return mkFirstErrorMessage({ [key]: payload }, strings);
 }
 
-/**
- * Touched-gate for a control's `invalid` input under Signal Forms.
- *
- * When a control is bound with the `[formField]` directive, Angular writes the
- * field's `invalid()` state straight into the control's `invalid` input — from
- * the first render, before the user has reached the field. mk-kit controls
- * pass that input through this gate so the invalid visual (and `aria-invalid`)
- * only shows once the field is touched or dirty, matching how `mk-form-field`
- * reveals its message and how `submit()` (which marks every field touched)
- * surfaces the remaining problems.
- *
- * Returns a signal that is always `true` for a control that is not bound with
- * `[formField]`, so a standalone `[invalid]="true"` keeps working as before.
- * Call it in a field initializer (an injection context):
- *
- * ```ts
- * private readonly fieldTouched = mkInjectFieldTouched();
- * protected readonly isInvalid = computed(
- *   () => (this.invalid() && this.fieldTouched()) || (this.field?.hasError() ?? false),
- * );
- * ```
- *
- * The binding is looked up lazily, on first read: the `FormField` directive
- * itself injects the element's `NG_VALUE_ACCESSOR` (the control) while it is
- * created, so resolving it from the control's constructor would be circular.
- */
-function mkInjectFieldTouched() {
-    const injector = inject(Injector);
-    let formField;
-    const resolve = () => formField === undefined
-        ? (formField = injector.get(FORM_FIELD, null, { self: true, optional: true }))
-        : formField;
-    return computed(() => {
-        const field = resolve();
-        if (!field)
-            return true;
-        const state = field.state();
-        return state.touched() || state.dirty();
-    });
-}
-
 /**
  * Delegates to `@mk-kit/core` — the exported names and behaviour are
  * unchanged. `mkQueryOperatorLabel` / `mkQueryToText` accept the full
@@ -1949,5 +1907,5 @@ function mkInjectFieldTouched() {
  * Generated bundle index. Do not edit.
  */
 
-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, mkInjectFieldTouched, mkIsResponsive, mkMergeI18n, mkSignalErrorMessage, mkSignalErrorsToValidationErrors, mkValidatorChange, provideMkI18n };
+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 };
 //# sourceMappingURL=mk-kit-ui-core.mjs.map