@egose/shadcn-theme-ng 0.0.28 → 0.1.0

package/field/fesm2022/field.mjs

@@ -8,19 +8,19 @@ import * as i1$1 from '@egose/shadcn-theme-ng/label';
 import { HlmLabel } from '@egose/shadcn-theme-ng/label';
 import { HlmSeparator } from '@egose/shadcn-theme-ng/separator';
 
-const fieldVariants = cva('data-[matches-spartan-invalid=true]:text-destructive gap-3 group/field flex w-full', {
+const fieldVariants = cva("data-[matches-spartan-invalid=true]:text-destructive gap-3 group/field flex w-full", {
     variants: {
         orientation: {
-            vertical: 'flex-col *:w-full [&>.sr-only]:w-auto',
+            vertical: "flex-col *:w-full [&>.sr-only]:w-auto",
             horizontal: [
-                'flex-row items-center',
-                '*:data-[slot=field-label]:flex-auto',
-                'has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',
+                "flex-row items-center",
+                "*:data-[slot=field-label]:flex-auto",
+                "has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
             ],
             responsive: [
-                'flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto [&>.sr-only]:w-auto',
-                '@md/field-group:*:data-[slot=field-label]:flex-auto',
-                '@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',
+                "flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto [&>.sr-only]:w-auto",
+                "@md/field-group:*:data-[slot=field-label]:flex-auto",
+                "@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
             ],
         },
     },
@@ -34,10 +34,10 @@ class HlmField {
     constructor() {
         classes(() => fieldVariants({ orientation: this.orientation() }));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmField, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmField, isStandalone: true, selector: "[hlmField],hlm-field", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group", "data-slot": "field" }, properties: { "attr.data-orientation": "orientation()" } }, hostDirectives: [{ directive: i1.BrnField, inputs: ["data-invalid", "data-invalid", "forceInvalid", "forceInvalid"] }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmField, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmField, isStandalone: true, selector: "[hlmField],hlm-field", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group", "data-slot": "field" }, properties: { "attr.data-orientation": "orientation()" } }, hostDirectives: [{ directive: i1.BrnField, inputs: ["data-invalid", "data-invalid", "forceInvalid", "forceInvalid"] }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmField, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmField, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmField],hlm-field',
@@ -52,12 +52,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmFieldContent {
     constructor() {
-        classes(() => 'gap-1 group/field-content flex flex-1 flex-col leading-snug');
+        classes(() => "gap-1 group/field-content flex flex-1 flex-col leading-snug");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmFieldContent, isStandalone: true, selector: "[hlmFieldContent],hlm-field-content", host: { attributes: { "data-slot": "field-content" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmFieldContent, isStandalone: true, selector: "[hlmFieldContent],hlm-field-content", host: { attributes: { "data-slot": "field-content" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldContent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldContent, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmFieldContent],hlm-field-content',
@@ -88,9 +88,9 @@ class HlmFieldDescription {
         : null;
     constructor() {
         classes(() => [
-            'text-muted-foreground text-start text-sm [[data-variant=legend]+&]:-mt-1.5 leading-normal font-normal group-has-data-horizontal/field:text-balance',
-            'last:mt-0 nth-last-2:-mt-1',
-            '[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',
+            "text-muted-foreground text-start text-sm [[data-variant=legend]+&]:-mt-1.5 leading-normal font-normal group-has-data-horizontal/field:text-balance",
+            "last:mt-0 nth-last-2:-mt-1",
+            "[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4",
         ]);
     }
     ngOnDestroy() {
@@ -99,10 +99,10 @@ class HlmFieldDescription {
             this._a11y?.unregisterDescription(this._registeredId);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmFieldDescription, isStandalone: true, selector: "[hlmFieldDescription],hlm-field-description", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "field-description" }, properties: { "attr.id": "id()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmFieldDescription, isStandalone: true, selector: "[hlmFieldDescription],hlm-field-description", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "field-description" }, properties: { "attr.id": "id()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldDescription, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldDescription, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmFieldDescription],hlm-field-description',
@@ -161,7 +161,7 @@ class HlmFieldError {
         })
         : null;
     constructor() {
-        classes(() => 'text-destructive text-sm font-normal');
+        classes(() => "text-destructive text-sm font-normal");
     }
     ngOnDestroy() {
         this._cleanup?.destroy();
@@ -169,14 +169,14 @@ class HlmFieldError {
             this._a11y?.unregisterError(this._registeredId);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldError, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: HlmFieldError, isStandalone: true, selector: "hlm-field-error", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, validator: { classPropertyName: "validator", publicName: "validator", isSignal: true, isRequired: false, transformFunction: null }, forceShow: { classPropertyName: "forceShow", publicName: "forceShow", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "alert", "data-slot": "field-error" }, properties: { "attr.id": "id()", "hidden": "!_display()" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldError, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.3", type: HlmFieldError, isStandalone: true, selector: "hlm-field-error", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, validator: { classPropertyName: "validator", publicName: "validator", isSignal: true, isRequired: false, transformFunction: null }, forceShow: { classPropertyName: "forceShow", publicName: "forceShow", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "alert", "data-slot": "field-error" }, properties: { "attr.id": "id()", "hidden": "!_display()" } }, ngImport: i0, template: `
     @if (_display()) {
       <ng-content />
     }
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldError, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldError, decorators: [{
             type: Component,
             args: [{
                     selector: 'hlm-field-error',
@@ -197,12 +197,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmFieldGroup {
     constructor() {
-        classes(() => 'gap-7 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4 group/field-group @container/field-group flex w-full flex-col');
+        classes(() => "gap-7 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4 group/field-group @container/field-group flex w-full flex-col");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmFieldGroup, isStandalone: true, selector: "[hlmFieldGroup],hlm-field-group", host: { attributes: { "data-slot": "field-group" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmFieldGroup, isStandalone: true, selector: "[hlmFieldGroup],hlm-field-group", host: { attributes: { "data-slot": "field-group" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldGroup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmFieldGroup],hlm-field-group',
@@ -213,14 +213,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 class HlmFieldLabel {
     constructor() {
         classes(() => [
-            'has-data-checked:bg-primary/5 has-data-checked:border-primary/30 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10 gap-2 leading-snug group-data-[disabled=true]/field:opacity-50 has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border *:data-[slot=field]:p-3 group/field-label peer/field-label flex w-fit',
-            'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col',
+            "has-data-checked:bg-primary/5 has-data-checked:border-primary/30 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10 gap-2 leading-snug group-data-[disabled=true]/field:opacity-50 has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border *:data-[slot=field]:p-3 group/field-label peer/field-label flex w-fit",
+            "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col",
         ]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmFieldLabel, isStandalone: true, selector: "[hlmFieldLabel],hlm-field-label", host: { attributes: { "data-slot": "field-label" } }, hostDirectives: [{ directive: i1$1.HlmLabel }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmFieldLabel, isStandalone: true, selector: "[hlmFieldLabel],hlm-field-label", host: { attributes: { "data-slot": "field-label" } }, hostDirectives: [{ directive: i1$1.HlmLabel }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldLabel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldLabel, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmFieldLabel],hlm-field-label',
@@ -233,12 +233,12 @@ class HlmFieldLegend {
     variant = input('legend', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     constructor() {
-        classes(() => 'mb-3 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base');
+        classes(() => "mb-3 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldLegend, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmFieldLegend, isStandalone: true, selector: "legend[hlmFieldLegend]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "field-legend" }, properties: { "attr.data-variant": "variant()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldLegend, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmFieldLegend, isStandalone: true, selector: "legend[hlmFieldLegend]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "field-legend" }, properties: { "attr.data-variant": "variant()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldLegend, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldLegend, decorators: [{
             type: Directive,
             args: [{
                     selector: 'legend[hlmFieldLegend]',
@@ -251,46 +251,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmFieldSeparator {
     constructor() {
-        classes(() => '-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative');
+        classes(() => "-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldSeparator, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: HlmFieldSeparator, isStandalone: true, selector: "hlm-field-separator", host: { attributes: { "data-slot": "field-separator" } }, ngImport: i0, template: `
-    <hlm-separator class="absolute inset-0 top-1/2" />
-    <span
-      data-slot="field-separator-content"
-      class="text-muted-foreground px-2 bg-background relative mx-auto block w-fit"
-    >
-      <ng-content />
-    </span>
-  `, isInline: true, dependencies: [{ kind: "directive", type: HlmSeparator, selector: "[hlmSeparator],hlm-separator" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldSeparator, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.3", type: HlmFieldSeparator, isStandalone: true, selector: "hlm-field-separator", host: { attributes: { "data-slot": "field-separator" } }, ngImport: i0, template: "\n    <hlm-separator class=\"absolute inset-0 top-1/2\" />\n    <span\n      data-slot=\"field-separator-content\"\n      class=\"text-muted-foreground px-2 bg-background relative mx-auto block w-fit\"\n    >\n      <ng-content />\n    </span>\n  ", isInline: true, dependencies: [{ kind: "directive", type: HlmSeparator, selector: "[hlmSeparator],hlm-separator" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldSeparator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldSeparator, decorators: [{
             type: Component,
             args: [{
                     selector: 'hlm-field-separator',
                     imports: [HlmSeparator],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     host: { 'data-slot': 'field-separator' },
-                    template: `
-    <hlm-separator class="absolute inset-0 top-1/2" />
-    <span
-      data-slot="field-separator-content"
-      class="text-muted-foreground px-2 bg-background relative mx-auto block w-fit"
-    >
-      <ng-content />
-    </span>
-  `,
+                    template: "\n    <hlm-separator class=\"absolute inset-0 top-1/2\" />\n    <span\n      data-slot=\"field-separator-content\"\n      class=\"text-muted-foreground px-2 bg-background relative mx-auto block w-fit\"\n    >\n      <ng-content />\n    </span>\n  ",
                 }]
         }], ctorParameters: () => [] });
 
 class HlmFieldSet {
     constructor() {
-        classes(() => 'gap-6 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3 flex flex-col');
+        classes(() => "gap-6 has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3 flex flex-col");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldSet, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmFieldSet, isStandalone: true, selector: "fieldset[hlmFieldSet]", host: { attributes: { "data-slot": "field-set" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldSet, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmFieldSet, isStandalone: true, selector: "fieldset[hlmFieldSet]", host: { attributes: { "data-slot": "field-set" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldSet, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldSet, decorators: [{
             type: Directive,
             args: [{
                     selector: 'fieldset[hlmFieldSet]',
@@ -300,12 +284,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmFieldTitle {
     constructor() {
-        classes(() => 'gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50 flex w-fit items-center');
+        classes(() => "gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50 flex w-fit items-center");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmFieldTitle, isStandalone: true, selector: "[hlmFieldTitle],hlm-field-title", host: { attributes: { "data-slot": "field-label" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmFieldTitle, isStandalone: true, selector: "[hlmFieldTitle],hlm-field-title", host: { attributes: { "data-slot": "field-label" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldTitle, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldTitle, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmFieldTitle],hlm-field-title',
@@ -329,8 +313,8 @@ const HlmFieldImports = [
     HlmFieldTitle,
 ];
 class HlmFieldModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldModule, imports: [HlmField,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldModule, imports: [HlmField,
             HlmFieldContent,
             HlmFieldDescription,
             HlmFieldError,
@@ -349,9 +333,9 @@ class HlmFieldModule {
             HlmFieldSeparator,
             HlmFieldSet,
             HlmFieldTitle] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldModule });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldModule });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmFieldModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmFieldModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...HlmFieldImports],
@@ -364,4 +348,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
  */
 
 export { HlmField, HlmFieldContent, HlmFieldDescription, HlmFieldError, HlmFieldGroup, HlmFieldImports, HlmFieldLabel, HlmFieldLegend, HlmFieldModule, HlmFieldSeparator, HlmFieldSet, HlmFieldTitle };
-//# sourceMappingURL=field.mjs.map
+

package/form-checkbox/README.md

@@ -1,64 +1,3 @@
-# FormCheckbox
+# Form Checkbox Subpath
 
-This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 20.3.0.
-
-## Code scaffolding
-
-Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
-
-```bash
-ng generate component component-name
-```
-
-For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
-
-```bash
-ng generate --help
-```
-
-## Building
-
-To build the library, run:
-
-```bash
-ng build form-checkbox
-```
-
-This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
-
-### Publishing the Library
-
-Once the project is built, you can publish your library by following these steps:
-
-1. Navigate to the `dist` directory:
-
-   ```bash
-   cd dist/form-checkbox
-   ```
-
-2. Run the `npm publish` command to publish your library to the npm registry:
-   ```bash
-   npm publish
-   ```
-
-## Running unit tests
-
-To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
-
-```bash
-ng test
-```
-
-## Running end-to-end tests
-
-For end-to-end (e2e) testing, run:
-
-```bash
-ng e2e
-```
-
-Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
-
-## Additional Resources
-
-For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
+This project ships only as `@egose/shadcn-theme-ng/form-checkbox` or `@egose/shadcn-theme-ng-tw/form-checkbox`. See the [package README](../../README.md) for installation, compatibility, Tailwind variant, test, and release guidance. Do not publish this project directory independently.

package/form-checkbox/fesm2022/form-checkbox.mjs

@@ -1,14 +1,16 @@
 import * as i0 from '@angular/core';
-import { input, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+import { inject, input, computed, ChangeDetectionStrategy, Component } from '@angular/core';
 import * as i1 from '@angular/forms';
-import { ReactiveFormsModule, FormGroupDirective, ControlContainer } from '@angular/forms';
+import { FormGroupDirective, ReactiveFormsModule, ControlContainer } from '@angular/forms';
 import { HlmLabel } from '@egose/shadcn-theme-ng/label';
 import { HlmCheckbox } from '@egose/shadcn-theme-ng/checkbox';
-import { HlmError, HlmHint } from '@egose/shadcn-theme-ng/form-field';
+import { HlmFormIdGenerator, HlmError, HlmHint } from '@egose/shadcn-theme-ng/form-field';
 import { EgFormField } from '@egose/shadcn-theme-ng/form-field-simple';
 import { hlm } from '@egose/shadcn-theme-ng/utils';
 
 class EgFormCheckbox {
+    formGroupDirective = inject(FormGroupDirective);
+    generatedId = inject(HlmFormIdGenerator).generate('eg-form-checkbox');
     // Classes
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     _computedClass = computed(() => hlm('', this.userClass()), /* @ts-ignore */
@@ -24,7 +26,7 @@ class EgFormCheckbox {
     ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
     hint = input(undefined, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
-    id = input(crypto.randomUUID(), /* @ts-ignore */
+    id = input(undefined, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
     name = input(undefined, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
@@ -34,6 +36,20 @@ class EgFormCheckbox {
     ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
     disabled = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    effectiveId = computed(() => this.controlId() || this.id() || this.generatedId, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "effectiveId" }] : /* istanbul ignore next */ []));
+    errorId = computed(() => `${this.effectiveId()}-error`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "errorId" }] : /* istanbul ignore next */ []));
+    hintId = computed(() => `${this.effectiveId()}-hint`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hintId" }] : /* istanbul ignore next */ []));
+    describedBy() {
+        const control = this.formGroupDirective.form.get(this.controlName());
+        return this.error() && control?.invalid && (control.dirty || control.touched)
+            ? this.errorId()
+            : this.hint()
+                ? this.hintId()
+                : null;
+    }
     // Styling
     checkboxClass = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "checkboxClass" }] : /* istanbul ignore next */ []));
@@ -48,48 +64,10 @@ class EgFormCheckbox {
     ...(ngDevMode ? [{ debugName: "$errorClass" }] : /* istanbul ignore next */ []));
     $hintClass = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "$hintClass" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: EgFormCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: EgFormCheckbox, isStandalone: true, selector: "eg-form-checkbox", inputs: { userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, controlId: { classPropertyName: "controlId", publicName: "controlId", isSignal: true, isRequired: false, transformFunction: null }, controlName: { classPropertyName: "controlName", publicName: "controlName", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, checkboxClass: { classPropertyName: "checkboxClass", publicName: "checkboxClass", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, $errorClass: { classPropertyName: "$errorClass", publicName: "$errorClass", isSignal: true, isRequired: false, transformFunction: null }, $hintClass: { classPropertyName: "$hintClass", publicName: "$hintClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }], ngImport: i0, template: `
-    @let lbl = label();
-    @let cid = controlId();
-    @let cnm = controlName();
-    @let err = error();
-    @let hnt = hint();
-    @let rqrd = required();
-
-    <eg-form-field>
-      <div class="flex items-center gap-1">
-        <hlm-checkbox
-          [id]="cid || id()"
-          [name]="cnm || name() || null"
-          [formControlName]="cnm"
-          [class]="$checkboxClass()"
-          [checked]="checked()"
-          [required]="rqrd"
-        />
-        <label hlmLabel [for]="id()" [class]="$labelClass()">
-          {{ lbl }}
-          @if (rqrd) {
-            <span class="text-red-500">*</span>
-          }
-        </label>
-      </div>
-
-      @if (err) {
-        <hlm-error [class]="$errorClass()">
-          {{ err }}
-        </hlm-error>
-      }
-
-      @if (hnt) {
-        <hlm-hint [class]="$hintClass()">
-          {{ hnt }}
-        </hlm-hint>
-      }
-    </eg-form-field>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: HlmCheckbox, selector: "hlm-checkbox", inputs: ["class", "id", "aria-label", "aria-labelledby", "aria-describedby", "checked", "name", "required", "disabled"], outputs: ["checkedChange", "changed"] }, { kind: "directive", type: HlmLabel, selector: "[hlmLabel]", inputs: ["class"] }, { kind: "component", type: EgFormField, selector: "eg-form-field", inputs: ["class"] }, { kind: "directive", type: HlmError, selector: "hlm-error", inputs: ["class"] }, { kind: "directive", type: HlmHint, selector: "hlm-hint", inputs: ["class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: EgFormCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.3", type: EgFormCheckbox, isStandalone: true, selector: "eg-form-checkbox", inputs: { userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, controlId: { classPropertyName: "controlId", publicName: "controlId", isSignal: true, isRequired: false, transformFunction: null }, controlName: { classPropertyName: "controlName", publicName: "controlName", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, checkboxClass: { classPropertyName: "checkboxClass", publicName: "checkboxClass", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, $errorClass: { classPropertyName: "$errorClass", publicName: "$errorClass", isSignal: true, isRequired: false, transformFunction: null }, $hintClass: { classPropertyName: "$hintClass", publicName: "$hintClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }], ngImport: i0, template: "\n    @let lbl = label();\n    @let cnm = controlName();\n    @let err = error();\n    @let hnt = hint();\n    @let rqrd = required();\n\n    <eg-form-field>\n      <div class=\"flex items-center gap-1\">\n        <hlm-checkbox\n          [id]=\"effectiveId()\"\n          [name]=\"cnm || name() || null\"\n          [formControlName]=\"cnm\"\n          [class]=\"$checkboxClass()\"\n          [checked]=\"checked()\"\n          [required]=\"rqrd\"\n          [wrapperDisabled]=\"disabled()\"\n          [aria-describedby]=\"describedBy()\"\n        />\n        <label hlmLabel [for]=\"effectiveId()\" [class]=\"$labelClass()\">\n          {{ lbl }}\n          @if (rqrd) {\n            <span class=\"text-red-500\">*</span>\n          }\n        </label>\n      </div>\n\n      @if (err) {\n        <hlm-error [id]=\"errorId()\" [class]=\"$errorClass()\">\n          {{ err }}\n        </hlm-error>\n      }\n\n      @if (hnt) {\n        <hlm-hint [id]=\"hintId()\" [class]=\"$hintClass()\">\n          {{ hnt }}\n        </hlm-hint>\n      }\n    </eg-form-field>\n  ", isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: HlmCheckbox, selector: "hlm-checkbox", inputs: ["class", "id", "aria-label", "aria-labelledby", "aria-describedby", "checked", "name", "required", "disabled", "wrapperDisabled"], outputs: ["checkedChange", "changed"] }, { kind: "directive", type: HlmLabel, selector: "[hlmLabel]", inputs: ["class"] }, { kind: "component", type: EgFormField, selector: "eg-form-field", inputs: ["class"] }, { kind: "directive", type: HlmError, selector: "hlm-error", inputs: ["class"] }, { kind: "directive", type: HlmHint, selector: "hlm-hint", inputs: ["class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: EgFormCheckbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: EgFormCheckbox, decorators: [{
             type: Component,
             args: [{
                     selector: 'eg-form-checkbox',
@@ -100,45 +78,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     imports: [ReactiveFormsModule, HlmCheckbox, HlmLabel, EgFormField, HlmError, HlmHint],
                     providers: [{ provide: ControlContainer, useExisting: FormGroupDirective }],
-                    template: `
-    @let lbl = label();
-    @let cid = controlId();
-    @let cnm = controlName();
-    @let err = error();
-    @let hnt = hint();
-    @let rqrd = required();
-
-    <eg-form-field>
-      <div class="flex items-center gap-1">
-        <hlm-checkbox
-          [id]="cid || id()"
-          [name]="cnm || name() || null"
-          [formControlName]="cnm"
-          [class]="$checkboxClass()"
-          [checked]="checked()"
-          [required]="rqrd"
-        />
-        <label hlmLabel [for]="id()" [class]="$labelClass()">
-          {{ lbl }}
-          @if (rqrd) {
-            <span class="text-red-500">*</span>
-          }
-        </label>
-      </div>
-
-      @if (err) {
-        <hlm-error [class]="$errorClass()">
-          {{ err }}
-        </hlm-error>
-      }
-
-      @if (hnt) {
-        <hlm-hint [class]="$hintClass()">
-          {{ hnt }}
-        </hlm-hint>
-      }
-    </eg-form-field>
-  `,
+                    template: "\n    @let lbl = label();\n    @let cnm = controlName();\n    @let err = error();\n    @let hnt = hint();\n    @let rqrd = required();\n\n    <eg-form-field>\n      <div class=\"flex items-center gap-1\">\n        <hlm-checkbox\n          [id]=\"effectiveId()\"\n          [name]=\"cnm || name() || null\"\n          [formControlName]=\"cnm\"\n          [class]=\"$checkboxClass()\"\n          [checked]=\"checked()\"\n          [required]=\"rqrd\"\n          [wrapperDisabled]=\"disabled()\"\n          [aria-describedby]=\"describedBy()\"\n        />\n        <label hlmLabel [for]=\"effectiveId()\" [class]=\"$labelClass()\">\n          {{ lbl }}\n          @if (rqrd) {\n            <span class=\"text-red-500\">*</span>\n          }\n        </label>\n      </div>\n\n      @if (err) {\n        <hlm-error [id]=\"errorId()\" [class]=\"$errorClass()\">\n          {{ err }}\n        </hlm-error>\n      }\n\n      @if (hnt) {\n        <hlm-hint [id]=\"hintId()\" [class]=\"$hintClass()\">\n          {{ hnt }}\n        </hlm-hint>\n      }\n    </eg-form-field>\n  ",
                 }]
         }], propDecorators: { userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], controlId: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlId", required: false }] }], controlName: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlName", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], checkboxClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkboxClass", required: false }] }], labelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelClass", required: false }] }], $errorClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "$errorClass", required: false }] }], $hintClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "$hintClass", required: false }] }] } });
 
@@ -151,4 +91,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
  */
 
 export { EgFormCheckbox };
-//# sourceMappingURL=form-checkbox.mjs.map
+

package/form-checkbox/types/form-checkbox.d.ts

@@ -2,6 +2,8 @@ import * as _angular_core from '@angular/core';
 import { ClassValue } from 'clsx';
 
 declare class EgFormCheckbox {
+    private readonly formGroupDirective;
+    private readonly generatedId;
     readonly userClass: _angular_core.InputSignal<ClassValue>;
     protected readonly _computedClass: _angular_core.Signal<string>;
     label: _angular_core.InputSignal<string>;
@@ -9,11 +11,15 @@ declare class EgFormCheckbox {
     controlName: _angular_core.InputSignal<string>;
     error: _angular_core.InputSignal<string | undefined>;
     hint: _angular_core.InputSignal<string | undefined>;
-    id: _angular_core.InputSignal<string>;
+    id: _angular_core.InputSignal<string | undefined>;
     name: _angular_core.InputSignal<string | undefined>;
     checked: _angular_core.InputSignal<boolean>;
     required: _angular_core.InputSignal<boolean>;
     disabled: _angular_core.InputSignal<boolean>;
+    readonly effectiveId: _angular_core.Signal<string>;
+    readonly errorId: _angular_core.Signal<string>;
+    readonly hintId: _angular_core.Signal<string>;
+    describedBy(): string | null;
     checkboxClass: _angular_core.InputSignal<string>;
     labelClass: _angular_core.InputSignal<string>;
     $checkboxClass: _angular_core.Signal<string>;

package/form-date-picker/README.md

@@ -1,64 +1,3 @@
-# FormDatePicker
+# Form Date Picker Subpath
 
-This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 20.3.0.
-
-## Code scaffolding
-
-Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
-
-```bash
-ng generate component component-name
-```
-
-For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
-
-```bash
-ng generate --help
-```
-
-## Building
-
-To build the library, run:
-
-```bash
-ng build form-date-picker
-```
-
-This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
-
-### Publishing the Library
-
-Once the project is built, you can publish your library by following these steps:
-
-1. Navigate to the `dist` directory:
-
-   ```bash
-   cd dist/form-date-picker
-   ```
-
-2. Run the `npm publish` command to publish your library to the npm registry:
-   ```bash
-   npm publish
-   ```
-
-## Running unit tests
-
-To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
-
-```bash
-ng test
-```
-
-## Running end-to-end tests
-
-For end-to-end (e2e) testing, run:
-
-```bash
-ng e2e
-```
-
-Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
-
-## Additional Resources
-
-For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
+This project ships only as `@egose/shadcn-theme-ng/form-date-picker` or `@egose/shadcn-theme-ng-tw/form-date-picker`. See the [package README](../../README.md) for installation, compatibility, Tailwind variant, test, and release guidance. Do not publish this project directory independently.