@egose/shadcn-theme-ng 0.0.28 → 0.1.0

package/searchable-multiselect/README.md

@@ -1,64 +1,3 @@
-# MultiselectAutocomplete
+# Searchable Multiselect 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 searchable-multiselect
-```
-
-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/searchable-multiselect
-   ```
-
-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/searchable-multiselect` or `@egose/shadcn-theme-ng-tw/searchable-multiselect`. See the [package README](../../README.md) for installation, compatibility, Tailwind variant, test, and release guidance. Do not publish this project directory independently.

package/searchable-multiselect/fesm2022/searchable-multiselect.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { input, output, signal, computed, forwardRef, ChangeDetectionStrategy, Component } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
-import { HlmPopover, HlmPopoverTrigger, HlmPopoverContent } from '@egose/shadcn-theme-ng/popover';
+import { HlmPopover, HlmPopoverTrigger, HlmPopoverContent, HlmPopoverPortal } from '@egose/shadcn-theme-ng/popover';
 import { HlmButton } from '@egose/shadcn-theme-ng/button';
 import { HlmCheckbox } from '@egose/shadcn-theme-ng/checkbox';
 import { hlm } from '@egose/shadcn-theme-ng/utils';
@@ -12,6 +12,16 @@ class EgSearchableMultiselect {
     ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
     placeholder = input('Start typing to add…', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+    id = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    disabled = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    wrapperDisabled = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "wrapperDisabled" }] : /* istanbul ignore next */ []));
+    ariaLabel = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    ariaDescribedby = input(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaDescribedby" }] : /* istanbul ignore next */ []));
     userClass = input('', { ...(ngDevMode ? { debugName: "userClass" } : /* istanbul ignore next */ {}), alias: 'class' });
     /** Value: array of selected values (string[]) */
     value = input([], /* @ts-ignore */
@@ -19,7 +29,10 @@ class EgSearchableMultiselect {
     valueChange = output();
     selectedItems = signal([], /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "selectedItems" }] : /* istanbul ignore next */ []));
-    isDisabled = false;
+    formDisabled = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "formDisabled" }] : /* istanbul ignore next */ []));
+    disabledState = computed(() => this.disabled() || this.wrapperDisabled() || this.formDisabled(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabledState" }] : /* istanbul ignore next */ []));
     isFormBound = false;
     _hostClass = computed(() => hlm(this.userClass()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "_hostClass" }] : /* istanbul ignore next */ []));
@@ -27,6 +40,8 @@ class EgSearchableMultiselect {
         return this.selectedItems().some((s) => s.value === value);
     }
     toggle(value, checked) {
+        if (this.disabledState())
+            return;
         if (checked) {
             this.addItem(value);
         }
@@ -44,6 +59,8 @@ class EgSearchableMultiselect {
         }
     }
     removeItem(value) {
+        if (this.disabledState())
+            return;
         const updated = this.selectedItems().filter((i) => i.value !== value);
         this.updateValueFromSelected(updated);
     }
@@ -75,76 +92,23 @@ class EgSearchableMultiselect {
         this.onTouched = fn;
     }
     setDisabledState(isDisabled) {
-        this.isDisabled = isDisabled;
+        this.formDisabled.set(isDisabled);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: EgSearchableMultiselect, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: EgSearchableMultiselect, isStandalone: true, selector: "eg-searchable-multiselect", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { properties: { "class": "_hostClass()" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: EgSearchableMultiselect, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.3", type: EgSearchableMultiselect, isStandalone: true, selector: "eg-searchable-multiselect", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, wrapperDisabled: { classPropertyName: "wrapperDisabled", publicName: "wrapperDisabled", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedby: { classPropertyName: "ariaDescribedby", publicName: "ariaDescribedby", isSignal: true, isRequired: false, transformFunction: null }, userClass: { classPropertyName: "userClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { properties: { "class": "_hostClass()" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => EgSearchableMultiselect),
                 multi: true,
             },
-        ], ngImport: i0, template: `
-    <div class="flex flex-col gap-2 w-full">
-      <!-- Selected chips -->
-      <div class="flex flex-wrap gap-2">
-        @if (selectedItems().length === 0) {
-          <span
-            class="bg-gray-100 text-gray-400 rounded-full
-                   px-2 py-1 inline-flex items-center text-xs"
-          >
-            {{ placeholder() }}
-          </span>
-        } @else {
-          @for (item of selectedItems(); track item.value) {
-            <span
-              class="bg-gray-200 rounded-full px-2 py-1
-                     inline-flex items-center gap-2 text-xs"
-            >
-              {{ item.label }}
-              <button
-                type="button"
-                (click)="removeItem(item.value)"
-                class="bg-transparent border-0 text-gray-600
-                       hover:text-red-500 cursor-pointer"
-              >
-                ✕
-              </button>
-            </span>
-          }
-        }
-      </div>
-
-      <!-- Trigger -->
-      <hlm-popover>
-        <button hlmPopoverTrigger hlmButton variant="secondary" appearance="outline" type="button">
-          {{ selectedItems().length }} selected
-        </button>
-
-        <hlm-popover-content class="w-64 p-2">
-          <div class="max-h-60 overflow-auto flex flex-col gap-1">
-            @for (option of options(); track option.value) {
-              <label
-                class="flex items-center gap-2 cursor-pointer px-2 py-1 rounded-sm hover:bg-secondary"
-              >
-                <hlm-checkbox [checked]="isSelected(option.value)" (changed)="toggle(option.value, $event)" />
-                <span class="text-sm">{{ option.label }}</span>
-              </label>
-            } @empty {
-              <span class="text-xs text-muted-foreground px-2 py-1">No options</span>
-            }
-          </div>
-        </hlm-popover-content>
-      </hlm-popover>
-    </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: HlmPopover, selector: "[hlmPopover],hlm-popover" }, { kind: "directive", type: HlmPopoverTrigger, selector: "button[hlmPopoverTrigger],button[hlmPopoverTriggerFor]" }, { kind: "directive", type: HlmPopoverContent, selector: "[hlmPopoverContent],hlm-popover-content" }, { kind: "component", type: HlmButton, selector: "button[hlmButton], a[hlmButton]", inputs: ["variant", "size", "appearance", "loading", "icon", "iconPosition", "class", "spinnerUserClass", "disabled", "type"] }, { kind: "component", type: HlmCheckbox, selector: "hlm-checkbox", inputs: ["class", "id", "aria-label", "aria-labelledby", "aria-describedby", "checked", "name", "required", "disabled"], outputs: ["checkedChange", "changed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], ngImport: i0, template: "\n    <div class=\"flex flex-col gap-2 w-full\">\n      <!-- Selected chips -->\n      <div class=\"flex flex-wrap gap-2\">\n        @if (selectedItems().length === 0) {\n          <span\n            class=\"bg-gray-100 text-gray-400 rounded-full\n                   px-2 py-1 inline-flex items-center text-xs\"\n          >\n            {{ placeholder() }}\n          </span>\n        } @else {\n          @for (item of selectedItems(); track item.value) {\n            <span\n              class=\"bg-gray-200 rounded-full px-2 py-1\n                     inline-flex items-center gap-2 text-xs\"\n            >\n              {{ item.label }}\n              <button\n                type=\"button\"\n                [disabled]=\"disabledState()\"\n                (click)=\"removeItem(item.value)\"\n                class=\"bg-transparent border-0 text-gray-600\n                       hover:text-red-500 cursor-pointer\"\n              >\n                ✕\n              </button>\n            </span>\n          }\n        }\n      </div>\n\n      <!-- Trigger -->\n      <hlm-popover>\n        <button\n          hlmPopoverTrigger\n          hlmButton\n          variant=\"secondary\"\n          appearance=\"outline\"\n          type=\"button\"\n          [id]=\"id()\"\n          [disabled]=\"disabledState()\"\n          [attr.aria-label]=\"ariaLabel()\"\n          [attr.aria-describedby]=\"ariaDescribedby()\"\n        >\n          {{ selectedItems().length }} selected\n        </button>\n\n        <hlm-popover-content class=\"w-64 p-2\" *hlmPopoverPortal=\"let ctx\">\n          <div class=\"max-h-60 overflow-auto flex flex-col gap-1\">\n            @for (option of options(); track option.value) {\n              <label\n                class=\"flex items-center gap-2 cursor-pointer px-2 py-1 rounded-sm hover:bg-secondary\"\n              >\n                <hlm-checkbox\n                  [checked]=\"isSelected(option.value)\"\n                  [disabled]=\"disabledState()\"\n                  (changed)=\"toggle(option.value, $event)\"\n                />\n                <span class=\"text-sm\">{{ option.label }}</span>\n              </label>\n            } @empty {\n              <span class=\"text-xs text-muted-foreground px-2 py-1\">No options</span>\n            }\n          </div>\n        </hlm-popover-content>\n      </hlm-popover>\n    </div>\n  ", isInline: true, dependencies: [{ kind: "directive", type: HlmPopover, selector: "[hlmPopover],hlm-popover" }, { kind: "directive", type: HlmPopoverTrigger, selector: "button[hlmPopoverTrigger],button[hlmPopoverTriggerFor]" }, { kind: "directive", type: HlmPopoverContent, selector: "[hlmPopoverContent],hlm-popover-content" }, { kind: "directive", type: HlmPopoverPortal, selector: "[hlmPopoverPortal]" }, { kind: "component", type: HlmButton, selector: "button[hlmButton], a[hlmButton]", inputs: ["variant", "size", "appearance", "loading", "icon", "iconPosition", "class", "spinnerUserClass", "disabled", "type"] }, { kind: "component", type: HlmCheckbox, selector: "hlm-checkbox", inputs: ["class", "id", "aria-label", "aria-labelledby", "aria-describedby", "checked", "name", "required", "disabled", "wrapperDisabled"], outputs: ["checkedChange", "changed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: EgSearchableMultiselect, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: EgSearchableMultiselect, decorators: [{
             type: Component,
             args: [{
                     selector: 'eg-searchable-multiselect',
                     standalone: true,
-                    imports: [HlmPopover, HlmPopoverTrigger, HlmPopoverContent, HlmButton, HlmCheckbox],
+                    imports: [HlmPopover, HlmPopoverTrigger, HlmPopoverContent, HlmPopoverPortal, HlmButton, HlmCheckbox],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     providers: [
                         {
@@ -156,62 +120,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                     host: {
                         '[class]': '_hostClass()',
                     },
-                    template: `
-    <div class="flex flex-col gap-2 w-full">
-      <!-- Selected chips -->
-      <div class="flex flex-wrap gap-2">
-        @if (selectedItems().length === 0) {
-          <span
-            class="bg-gray-100 text-gray-400 rounded-full
-                   px-2 py-1 inline-flex items-center text-xs"
-          >
-            {{ placeholder() }}
-          </span>
-        } @else {
-          @for (item of selectedItems(); track item.value) {
-            <span
-              class="bg-gray-200 rounded-full px-2 py-1
-                     inline-flex items-center gap-2 text-xs"
-            >
-              {{ item.label }}
-              <button
-                type="button"
-                (click)="removeItem(item.value)"
-                class="bg-transparent border-0 text-gray-600
-                       hover:text-red-500 cursor-pointer"
-              >
-                ✕
-              </button>
-            </span>
-          }
-        }
-      </div>
-
-      <!-- Trigger -->
-      <hlm-popover>
-        <button hlmPopoverTrigger hlmButton variant="secondary" appearance="outline" type="button">
-          {{ selectedItems().length }} selected
-        </button>
-
-        <hlm-popover-content class="w-64 p-2">
-          <div class="max-h-60 overflow-auto flex flex-col gap-1">
-            @for (option of options(); track option.value) {
-              <label
-                class="flex items-center gap-2 cursor-pointer px-2 py-1 rounded-sm hover:bg-secondary"
-              >
-                <hlm-checkbox [checked]="isSelected(option.value)" (changed)="toggle(option.value, $event)" />
-                <span class="text-sm">{{ option.label }}</span>
-              </label>
-            } @empty {
-              <span class="text-xs text-muted-foreground px-2 py-1">No options</span>
-            }
-          </div>
-        </hlm-popover-content>
-      </hlm-popover>
-    </div>
-  `,
+                    template: "\n    <div class=\"flex flex-col gap-2 w-full\">\n      <!-- Selected chips -->\n      <div class=\"flex flex-wrap gap-2\">\n        @if (selectedItems().length === 0) {\n          <span\n            class=\"bg-gray-100 text-gray-400 rounded-full\n                   px-2 py-1 inline-flex items-center text-xs\"\n          >\n            {{ placeholder() }}\n          </span>\n        } @else {\n          @for (item of selectedItems(); track item.value) {\n            <span\n              class=\"bg-gray-200 rounded-full px-2 py-1\n                     inline-flex items-center gap-2 text-xs\"\n            >\n              {{ item.label }}\n              <button\n                type=\"button\"\n                [disabled]=\"disabledState()\"\n                (click)=\"removeItem(item.value)\"\n                class=\"bg-transparent border-0 text-gray-600\n                       hover:text-red-500 cursor-pointer\"\n              >\n                ✕\n              </button>\n            </span>\n          }\n        }\n      </div>\n\n      <!-- Trigger -->\n      <hlm-popover>\n        <button\n          hlmPopoverTrigger\n          hlmButton\n          variant=\"secondary\"\n          appearance=\"outline\"\n          type=\"button\"\n          [id]=\"id()\"\n          [disabled]=\"disabledState()\"\n          [attr.aria-label]=\"ariaLabel()\"\n          [attr.aria-describedby]=\"ariaDescribedby()\"\n        >\n          {{ selectedItems().length }} selected\n        </button>\n\n        <hlm-popover-content class=\"w-64 p-2\" *hlmPopoverPortal=\"let ctx\">\n          <div class=\"max-h-60 overflow-auto flex flex-col gap-1\">\n            @for (option of options(); track option.value) {\n              <label\n                class=\"flex items-center gap-2 cursor-pointer px-2 py-1 rounded-sm hover:bg-secondary\"\n              >\n                <hlm-checkbox\n                  [checked]=\"isSelected(option.value)\"\n                  [disabled]=\"disabledState()\"\n                  (changed)=\"toggle(option.value, $event)\"\n                />\n                <span class=\"text-sm\">{{ option.label }}</span>\n              </label>\n            } @empty {\n              <span class=\"text-xs text-muted-foreground px-2 py-1\">No options</span>\n            }\n          </div>\n        </hlm-popover-content>\n      </hlm-popover>\n    </div>\n  ",
                 }]
-        }], ctorParameters: () => [], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
+        }], ctorParameters: () => [], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], wrapperDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrapperDisabled", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaDescribedby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedby", required: false }] }], userClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
 
 /*
  * Public API Surface of searchable-multiselect
@@ -222,4 +133,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
  */
 
 export { EgSearchableMultiselect };
-//# sourceMappingURL=searchable-multiselect.mjs.map
+

package/searchable-multiselect/types/searchable-multiselect.d.ts

@@ -10,12 +10,18 @@ declare class EgSearchableMultiselect implements ControlValueAccessor {
     /** Full option list with labels/values */
     options: _angular_core.InputSignal<SelectOption[]>;
     placeholder: _angular_core.InputSignal<string>;
+    id: _angular_core.InputSignal<string>;
+    disabled: _angular_core.InputSignal<boolean>;
+    wrapperDisabled: _angular_core.InputSignal<boolean>;
+    ariaLabel: _angular_core.InputSignal<string | undefined>;
+    ariaDescribedby: _angular_core.InputSignal<string | null>;
     userClass: _angular_core.InputSignal<ClassValue>;
     /** Value: array of selected values (string[]) */
     value: _angular_core.InputSignal<string[]>;
     valueChange: _angular_core.OutputEmitterRef<string[]>;
     protected readonly selectedItems: _angular_core.WritableSignal<SelectOption[]>;
-    protected isDisabled: boolean;
+    protected readonly formDisabled: _angular_core.WritableSignal<boolean>;
+    protected readonly disabledState: _angular_core.Signal<boolean>;
     private isFormBound;
     protected readonly _hostClass: _angular_core.Signal<string>;
     protected isSelected(value: string): boolean;
@@ -32,7 +38,7 @@ declare class EgSearchableMultiselect implements ControlValueAccessor {
     registerOnTouched(fn: () => void): void;
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<EgSearchableMultiselect, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgSearchableMultiselect, "eg-searchable-multiselect", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EgSearchableMultiselect, "eg-searchable-multiselect", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "wrapperDisabled": { "alias": "wrapperDisabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; "isSignal": true; }; "userClass": { "alias": "class"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
 }
 
 export { EgSearchableMultiselect };

package/select/README.md

@@ -1,64 +1,3 @@
-# Select
+# Select Subpath
 
-This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 20.2.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 select
-```
-
-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/select
-   ```
-
-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/select` or `@egose/shadcn-theme-ng-tw/select`. See the [package README](../../README.md) for installation, compatibility, Tailwind variant, test, and release guidance. Do not publish this project directory independently.