@zhannam85/ui-kit 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Zhanna Myshkovskaya
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,381 @@
+# Angular UI Kit
+
+A modern, reusable Angular 21 UI component library featuring Button, Dropdown, and Checkbox components. Built with standalone components and designed for easy integration into Angular applications.
+
+## Features
+
+- 🎨 **Modern Design**: Clean, polished UI components with smooth animations
+- 📦 **Standalone Components**: Built with Angular 21 standalone components (no NgModules required)
+- 🎯 **Type-Safe**: Full TypeScript support with proper typing
+- ♿ **Accessible**: Built with accessibility in mind
+- 🎨 **Customizable**: Multiple variants and sizes for each component
+- 📱 **Responsive**: Works seamlessly across different screen sizes
+
+## Installation
+
+```bash
+npm install @zhannam85/ui-kit
+```
+
+**Note**: Replace `@zhannam85` with your npm username or organization name before publishing.
+
+## Components
+
+### Button Component
+
+A versatile button component with multiple variants and sizes.
+
+#### Usage
+
+```typescript
+import { ButtonComponent } from '@zhannam85/ui-kit';
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-example',
+  standalone: true,
+  imports: [ButtonComponent],
+  template: `
+    <kit-button
+      label="Click Me"
+      variant="primary"
+      size="medium"
+      (buttonClicked)="handleClick($event)">
+    </kit-button>
+  `
+})
+export class ExampleComponent {
+  handleClick(event: MouseEvent) {
+    console.log('Button clicked!', event);
+  }
+}
+```
+
+#### Inputs
+
+| Property | Type | Default | Description |
+|----------|------|---------|-------------|
+| `label` | `string` | `''` | Button text label |
+| `variant` | `'primary' \| 'secondary' \| 'danger'` | `'primary'` | Button style variant |
+| `disabled` | `boolean` | `false` | Disabled state |
+| `type` | `'button' \| 'submit' \| 'reset'` | `'button'` | HTML button type |
+| `size` | `'small' \| 'medium' \| 'large'` | `'medium'` | Button size |
+
+#### Outputs
+
+| Event | Type | Description |
+|-------|------|-------------|
+| `click` | `EventEmitter<MouseEvent>` | Emitted when button is clicked |
+
+### Dropdown Component
+
+A dropdown/select component with customizable options.
+
+#### Usage
+
+```typescript
+import { DropdownComponent, DropdownOption } from '@zhannam85/ui-kit';
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-example',
+  standalone: true,
+  imports: [DropdownComponent],
+  template: `
+    <kit-dropdown
+      [options]="options"
+      placeholder="Select an option"
+      [selectedValue]="selectedValue"
+      (selectionChange)="onSelectionChange($event)">
+    </kit-dropdown>
+  `
+})
+export class ExampleComponent {
+  options: DropdownOption[] = [
+    { label: 'Option 1', value: 'opt1' },
+    { label: 'Option 2', value: 'opt2' },
+    { label: 'Option 3', value: 'opt3' }
+  ];
+  
+  selectedValue: any = null;
+
+  onSelectionChange(value: any) {
+    this.selectedValue = value;
+    console.log('Selected:', value);
+  }
+}
+```
+
+#### Inputs
+
+| Property | Type | Default | Description |
+|----------|------|---------|-------------|
+| `options` | `DropdownOption[]` | `[]` | Array of dropdown options |
+| `placeholder` | `string` | `'Select an option'` | Placeholder text |
+| `selectedValue` | `any` | `null` | Currently selected value |
+| `disabled` | `boolean` | `false` | Disabled state |
+
+#### Outputs
+
+| Event | Type | Description |
+|-------|------|-------------|
+| `selectionChange` | `EventEmitter<any>` | Emitted when selection changes |
+
+#### Types
+
+```typescript
+interface DropdownOption {
+  label: string;
+  value: any;
+}
+```
+
+### Checkbox Component
+
+A checkbox component with label support and indeterminate state.
+
+#### Usage
+
+```typescript
+import { CheckboxComponent } from '@zhannam85/ui-kit';
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-example',
+  standalone: true,
+  imports: [CheckboxComponent],
+  template: `
+    <kit-checkbox
+      label="Accept terms and conditions"
+      [checked]="isChecked"
+      (checkedChange)="onCheckedChange($event)">
+    </kit-checkbox>
+  `
+})
+export class ExampleComponent {
+  isChecked: boolean = false;
+
+  onCheckedChange(checked: boolean) {
+    this.isChecked = checked;
+    console.log('Checked:', checked);
+  }
+}
+```
+
+#### Inputs
+
+| Property | Type | Default | Description |
+|----------|------|---------|-------------|
+| `label` | `string` | `''` | Checkbox label text |
+| `checked` | `boolean` | `false` | Checked state |
+| `disabled` | `boolean` | `false` | Disabled state |
+| `indeterminate` | `boolean` | `false` | Indeterminate state (shows dash) |
+
+#### Outputs
+
+| Event | Type | Description |
+|-------|------|-------------|
+| `checkedChange` | `EventEmitter<boolean>` | Emitted when checked state changes |
+
+### Icon Components
+
+Reusable SVG icon components with customizable size and color.
+
+#### Available icons
+
+| Component | Selector | Default size | Description |
+|-----------|----------|-------------|-------------|
+| `IconCopyComponent` | `kit-icon-copy` | 16 | Clipboard / copy |
+| `IconCheckComponent` | `kit-icon-check` | 16 | Checkmark |
+| `IconChevronDownComponent` | `kit-icon-chevron-down` | 12 | Chevron arrow |
+
+#### Usage
+
+```typescript
+import { IconModule } from '@zhannam85/ui-kit';
+```
+
+```html
+<kit-icon-copy [size]="16" color="#333"></kit-icon-copy>
+<kit-icon-check [size]="20"></kit-icon-check>
+<kit-icon-chevron-down [size]="12"></kit-icon-chevron-down>
+```
+
+#### Inputs (shared by all icons)
+
+| Property | Type | Default | Description |
+|----------|------|---------|-------------|
+| `size` | `number` | varies per icon | Width and height in pixels |
+| `color` | `string` | `'currentColor'` | Stroke/fill color (inherits text color by default) |
+
+#### Adding a new icon
+
+1. Create a new file in `src/components/icon/`, e.g. `icon-arrow-right.component.ts`:
+
+```typescript
+import { Component } from '@angular/core';
+import { BaseIconComponent } from './base-icon.component';
+
+@Component({
+    selector: 'kit-icon-arrow-right',
+    standalone: false,
+    template: `
+        <svg
+            [attr.width]="size"
+            [attr.height]="size"
+            viewBox="0 0 24 24"
+            fill="none"
+            [attr.stroke]="color"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round">
+            <path d="M5 12h14M12 5l7 7-7 7"/>
+        </svg>
+    `,
+})
+export class IconArrowRightComponent extends BaseIconComponent {
+    override size = 16;
+}
+```
+
+2. Register the component in `src/components/icon/icon.module.ts`:
+
+```typescript
+import { IconArrowRightComponent } from './icon-arrow-right.component';
+
+const ICON_COMPONENTS = [
+    // ...existing icons
+    IconArrowRightComponent,
+];
+```
+
+3. Export it from `src/public-api.ts`:
+
+```typescript
+export * from './components/icon/icon-arrow-right.component';
+```
+
+4. Rebuild the library (`npm run build`) and use it:
+
+```html
+<kit-icon-arrow-right [size]="20" color="blue"></kit-icon-arrow-right>
+```
+
+## Development
+
+### Prerequisites
+
+- Node.js (v18.19.1, v20.11.1, or v22+)
+- npm (v9 or higher)
+- Angular CLI 21
+
+### Setup
+
+1. Clone the repository:
+```bash
+git clone <repository-url>
+cd ui-kit
+```
+
+2. Install dependencies:
+```bash
+npm install
+```
+
+3. Build the library:
+```bash
+npm run build
+```
+
+The built library will be in the `dist/ui-kit` directory.
+
+### Sandbox (local preview)
+
+Run the sandbox app to preview components in the browser:
+
+```bash
+npm start
+```
+
+This builds the library, clears the Angular cache, and serves the sandbox at **http://localhost:4200**. The sandbox has a left sidebar listing components (with a filter) and a main area showing each component’s showcase.
+
+**Proxy:** API requests to `/api` are proxied to `http://localhost:3000` by default. Edit `proxy.conf.json` to change the `target` (e.g. to your backend URL).
+
+### Running Tests
+
+```bash
+npm test
+```
+
+### Building for Production
+
+```bash
+npm run build
+```
+
+## Publishing to npm
+
+1. Update the package name in `package.json` with your npm username/organization
+2. Build the library:
+```bash
+npm run build
+```
+
+3. Navigate to the dist directory:
+```bash
+cd dist/ui-kit
+```
+
+4. Publish to npm:
+```bash
+npm publish
+```
+
+For scoped packages (starting with `@`), use:
+```bash
+npm publish --access public
+```
+
+## Using in Your Application
+
+After installing the package:
+
+1. Import the components in your Angular component:
+```typescript
+import { ButtonComponent, DropdownComponent, CheckboxComponent } from '@zhannam85/ui-kit';
+```
+
+2. Add them to your component's `imports` array (standalone components):
+```typescript
+@Component({
+  standalone: true,
+  imports: [ButtonComponent, DropdownComponent, CheckboxComponent],
+  // ...
+})
+```
+
+3. Use them in your template:
+```html
+<kit-button label="Submit" variant="primary" (buttonClicked)="onSubmit()"></kit-button>
+<kit-dropdown [options]="myOptions" (selectionChange)="onChange($event)"></kit-dropdown>
+<kit-checkbox label="I agree" [checked]="agreed" (checkedChange)="onAgreeChange($event)"></kit-checkbox>
+```
+
+## Browser Support
+
+- Chrome (latest)
+- Firefox (latest)
+- Safari (latest)
+- Edge (latest)
+
+## License
+
+MIT
+
+## Contributing
+
+Contributions are welcome! Please feel free to submit a Pull Request.
+
+## Version
+
+Current version: 0.1.0

package/fesm2022/zhannam85-ui-kit.mjs

@@ -0,0 +1,384 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Output, Input, Component, NgModule, HostBinding, HostListener } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class ButtonComponent {
+    label = '';
+    variant = 'primary';
+    disabled = false;
+    type = 'button';
+    size = 'medium';
+    buttonClicked = new EventEmitter();
+    onClick(event) {
+        if (!this.disabled) {
+            this.buttonClicked.emit(event);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.4", type: ButtonComponent, isStandalone: false, selector: "kit-button", inputs: { label: "label", variant: "variant", disabled: "disabled", type: "type", size: "size" }, outputs: { buttonClicked: "buttonClicked" }, ngImport: i0, template: "<button\r\n  [type]=\"type\"\r\n  [disabled]=\"disabled\"\r\n  [class]=\"'lib-button lib-button--' + variant + ' lib-button--' + size\"\r\n  (click)=\"onClick($event)\">\r\n  {{ label }}\r\n</button>\r\n", styles: [".lib-button{font-family:inherit;font-weight:500;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease-in-out;outline:none;display:inline-flex;align-items:center;justify-content:center;text-align:center;white-space:nowrap;-webkit-user-select:none;user-select:none}.lib-button:focus-visible{outline:2px solid #4a90e2;outline-offset:2px}.lib-button:disabled{opacity:.6;cursor:not-allowed;pointer-events:none}.lib-button--small{padding:6px 12px;font-size:14px;min-height:32px}.lib-button--medium{padding:10px 20px;font-size:16px;min-height:40px}.lib-button--large{padding:14px 28px;font-size:18px;min-height:48px}.lib-button--primary{background-color:#4a90e2;color:#fff}.lib-button--primary:hover:not(:disabled){background-color:#357abd;transform:translateY(-1px);box-shadow:0 4px 8px #4a90e24d}.lib-button--primary:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px #4a90e233}.lib-button--secondary{background-color:#6c757d;color:#fff}.lib-button--secondary:hover:not(:disabled){background-color:#5a6268;transform:translateY(-1px);box-shadow:0 4px 8px #6c757d4d}.lib-button--secondary:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px #6c757d33}.lib-button--danger{background-color:#dc3545;color:#fff}.lib-button--danger:hover:not(:disabled){background-color:#c82333;transform:translateY(-1px);box-shadow:0 4px 8px #dc35454d}.lib-button--danger:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px #dc354533}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'kit-button', standalone: false, template: "<button\r\n  [type]=\"type\"\r\n  [disabled]=\"disabled\"\r\n  [class]=\"'lib-button lib-button--' + variant + ' lib-button--' + size\"\r\n  (click)=\"onClick($event)\">\r\n  {{ label }}\r\n</button>\r\n", styles: [".lib-button{font-family:inherit;font-weight:500;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease-in-out;outline:none;display:inline-flex;align-items:center;justify-content:center;text-align:center;white-space:nowrap;-webkit-user-select:none;user-select:none}.lib-button:focus-visible{outline:2px solid #4a90e2;outline-offset:2px}.lib-button:disabled{opacity:.6;cursor:not-allowed;pointer-events:none}.lib-button--small{padding:6px 12px;font-size:14px;min-height:32px}.lib-button--medium{padding:10px 20px;font-size:16px;min-height:40px}.lib-button--large{padding:14px 28px;font-size:18px;min-height:48px}.lib-button--primary{background-color:#4a90e2;color:#fff}.lib-button--primary:hover:not(:disabled){background-color:#357abd;transform:translateY(-1px);box-shadow:0 4px 8px #4a90e24d}.lib-button--primary:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px #4a90e233}.lib-button--secondary{background-color:#6c757d;color:#fff}.lib-button--secondary:hover:not(:disabled){background-color:#5a6268;transform:translateY(-1px);box-shadow:0 4px 8px #6c757d4d}.lib-button--secondary:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px #6c757d33}.lib-button--danger{background-color:#dc3545;color:#fff}.lib-button--danger:hover:not(:disabled){background-color:#c82333;transform:translateY(-1px);box-shadow:0 4px 8px #dc35454d}.lib-button--danger:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px #dc354533}\n"] }]
+        }], propDecorators: { label: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], buttonClicked: [{
+                type: Output
+            }] } });
+
+class ButtonModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.4", ngImport: i0, type: ButtonModule, declarations: [ButtonComponent], imports: [CommonModule], exports: [ButtonComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ButtonModule, imports: [CommonModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ButtonModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [ButtonComponent],
+                    imports: [CommonModule],
+                    exports: [ButtonComponent],
+                }]
+        }] });
+
+class BaseIconComponent {
+    size = 24;
+    color = 'currentColor';
+    get hostWidth() {
+        return this.size;
+    }
+    get hostHeight() {
+        return this.size;
+    }
+    display = 'inline-flex';
+    get hostColor() {
+        return this.color;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: BaseIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.4", type: BaseIconComponent, isStandalone: true, selector: "ng-component", inputs: { size: "size", color: "color" }, host: { properties: { "style.width.px": "this.hostWidth", "style.height.px": "this.hostHeight", "style.display": "this.display", "style.color": "this.hostColor" } }, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: BaseIconComponent, decorators: [{
+            type: Component,
+            args: [{ template: '' }]
+        }], propDecorators: { size: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], hostWidth: [{
+                type: HostBinding,
+                args: ['style.width.px']
+            }], hostHeight: [{
+                type: HostBinding,
+                args: ['style.height.px']
+            }], display: [{
+                type: HostBinding,
+                args: ['style.display']
+            }], hostColor: [{
+                type: HostBinding,
+                args: ['style.color']
+            }] } });
+
+class IconChevronDownComponent extends BaseIconComponent {
+    size = 12;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: IconChevronDownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.4", type: IconChevronDownComponent, isStandalone: false, selector: "kit-icon-chevron-down", usesInheritance: true, ngImport: i0, template: `
+        <svg
+            [attr.width]="size"
+            [attr.height]="size"
+            viewBox="0 0 12 12"
+            fill="none"
+            [attr.stroke]="color"
+            stroke-width="1.5"
+            stroke-linecap="round"
+            stroke-linejoin="round">
+            <path d="M3 4.5L6 7.5L9 4.5"/>
+        </svg>
+    `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: IconChevronDownComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kit-icon-chevron-down',
+                    standalone: false,
+                    template: `
+        <svg
+            [attr.width]="size"
+            [attr.height]="size"
+            viewBox="0 0 12 12"
+            fill="none"
+            [attr.stroke]="color"
+            stroke-width="1.5"
+            stroke-linecap="round"
+            stroke-linejoin="round">
+            <path d="M3 4.5L6 7.5L9 4.5"/>
+        </svg>
+    `,
+                }]
+        }] });
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+class DropdownComponent {
+    _options = [];
+    _selectedValue = null;
+    set options(value) {
+        this._options = value ?? [];
+        this.updateSelectedOption();
+    }
+    get options() {
+        return this._options;
+    }
+    placeholder = 'Select an option';
+    set selectedValue(value) {
+        this._selectedValue = value;
+        this.updateSelectedOption();
+    }
+    get selectedValue() {
+        return this._selectedValue;
+    }
+    disabled = false;
+    selectionChange = new EventEmitter();
+    isOpen = false;
+    selectedOption = null;
+    ngOnInit() {
+        this.updateSelectedOption();
+    }
+    updateSelectedOption() {
+        if (this._selectedValue !== null && this._selectedValue !== undefined) {
+            this.selectedOption = this._options.find(opt => opt.value === this._selectedValue) || null;
+        }
+        else {
+            this.selectedOption = null;
+        }
+    }
+    toggleDropdown() {
+        if (!this.disabled) {
+            this.isOpen = !this.isOpen;
+        }
+    }
+    onTriggerKeydown(event) {
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            this.toggleDropdown();
+        }
+    }
+    onOptionKeydown(event, option) {
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            this.selectOption(option);
+        }
+    }
+    selectOption(option) {
+        if (!this.disabled) {
+            this.selectedOption = option;
+            this._selectedValue = option.value;
+            this.isOpen = false;
+            this.selectionChange.emit(option.value);
+        }
+    }
+    onClickOutside(event) {
+        const target = event.target;
+        if (!target.closest('.lib-dropdown')) {
+            this.isOpen = false;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.4", type: DropdownComponent, isStandalone: false, selector: "kit-dropdown", inputs: { options: "options", placeholder: "placeholder", selectedValue: "selectedValue", disabled: "disabled" }, outputs: { selectionChange: "selectionChange" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, ngImport: i0, template: "<div class=\"lib-dropdown\" [class.lib-dropdown--disabled]=\"disabled\">\r\n  <div\r\n    class=\"lib-dropdown__trigger\"\r\n    [class.lib-dropdown__trigger--open]=\"isOpen\"\r\n    role=\"button\"\r\n    tabindex=\"0\"\r\n    (click)=\"toggleDropdown()\"\r\n    (keydown)=\"onTriggerKeydown($event)\">\r\n    <span class=\"lib-dropdown__value\">\r\n      {{ selectedOption ? selectedOption.label : placeholder }}\r\n    </span>\r\n    <kit-icon-chevron-down\r\n      class=\"lib-dropdown__arrow\"\r\n      [class.lib-dropdown__arrow--open]=\"isOpen\"\r\n      [size]=\"12\">\r\n    </kit-icon-chevron-down>\r\n  </div>\r\n  <div class=\"lib-dropdown__menu\" *ngIf=\"isOpen && !disabled\">\r\n    <div\r\n      *ngFor=\"let option of options\"\r\n      class=\"lib-dropdown__option\"\r\n      [class.lib-dropdown__option--selected]=\"selectedOption?.value === option.value\"\r\n      role=\"option\"\r\n      [attr.aria-selected]=\"selectedOption?.value === option.value\"\r\n      tabindex=\"0\"\r\n      (click)=\"selectOption(option)\"\r\n      (keydown)=\"onOptionKeydown($event, option)\">\r\n      {{ option.label }}\r\n    </div>\r\n    <div *ngIf=\"options.length === 0\" class=\"lib-dropdown__option lib-dropdown__option--empty\">\r\n      No options available\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".lib-dropdown{position:relative;display:inline-block;width:100%;min-width:200px}.lib-dropdown--disabled{opacity:.6;pointer-events:none}.lib-dropdown__trigger{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background-color:#fff;border:2px solid #e0e0e0;border-radius:6px;cursor:pointer;transition:all .2s ease-in-out;min-height:40px;-webkit-user-select:none;user-select:none}.lib-dropdown__trigger:hover:not(.lib-dropdown__trigger--disabled){border-color:#4a90e2}.lib-dropdown__trigger:focus-within{outline:none;border-color:#4a90e2;box-shadow:0 0 0 3px #4a90e21a}.lib-dropdown__trigger--open{border-color:#4a90e2;box-shadow:0 0 0 3px #4a90e21a}.lib-dropdown__value{flex:1;text-align:left;color:#333;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lib-dropdown__arrow{flex-shrink:0;margin-left:12px;color:#666;transition:transform .2s ease-in-out}.lib-dropdown__arrow--open{transform:rotate(180deg)}.lib-dropdown__menu{position:absolute;top:calc(100% + 4px);left:0;right:0;background-color:#fff;border:2px solid #e0e0e0;border-radius:6px;box-shadow:0 4px 12px #00000026;z-index:1000;max-height:300px;overflow-y:auto;animation:dropdownFadeIn .2s ease-out}.lib-dropdown__option{padding:12px 16px;cursor:pointer;transition:background-color .15s ease-in-out;color:#333;font-size:16px;border-bottom:1px solid #f0f0f0}.lib-dropdown__option:last-child{border-bottom:none}.lib-dropdown__option:hover{background-color:#f5f5f5}.lib-dropdown__option--selected{background-color:#e8f4fd;color:#4a90e2;font-weight:500}.lib-dropdown__option--empty{color:#999;cursor:default;font-style:italic}.lib-dropdown__option--empty:hover{background-color:#fff}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconChevronDownComponent, selector: "kit-icon-chevron-down" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: DropdownComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'kit-dropdown', standalone: false, template: "<div class=\"lib-dropdown\" [class.lib-dropdown--disabled]=\"disabled\">\r\n  <div\r\n    class=\"lib-dropdown__trigger\"\r\n    [class.lib-dropdown__trigger--open]=\"isOpen\"\r\n    role=\"button\"\r\n    tabindex=\"0\"\r\n    (click)=\"toggleDropdown()\"\r\n    (keydown)=\"onTriggerKeydown($event)\">\r\n    <span class=\"lib-dropdown__value\">\r\n      {{ selectedOption ? selectedOption.label : placeholder }}\r\n    </span>\r\n    <kit-icon-chevron-down\r\n      class=\"lib-dropdown__arrow\"\r\n      [class.lib-dropdown__arrow--open]=\"isOpen\"\r\n      [size]=\"12\">\r\n    </kit-icon-chevron-down>\r\n  </div>\r\n  <div class=\"lib-dropdown__menu\" *ngIf=\"isOpen && !disabled\">\r\n    <div\r\n      *ngFor=\"let option of options\"\r\n      class=\"lib-dropdown__option\"\r\n      [class.lib-dropdown__option--selected]=\"selectedOption?.value === option.value\"\r\n      role=\"option\"\r\n      [attr.aria-selected]=\"selectedOption?.value === option.value\"\r\n      tabindex=\"0\"\r\n      (click)=\"selectOption(option)\"\r\n      (keydown)=\"onOptionKeydown($event, option)\">\r\n      {{ option.label }}\r\n    </div>\r\n    <div *ngIf=\"options.length === 0\" class=\"lib-dropdown__option lib-dropdown__option--empty\">\r\n      No options available\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".lib-dropdown{position:relative;display:inline-block;width:100%;min-width:200px}.lib-dropdown--disabled{opacity:.6;pointer-events:none}.lib-dropdown__trigger{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background-color:#fff;border:2px solid #e0e0e0;border-radius:6px;cursor:pointer;transition:all .2s ease-in-out;min-height:40px;-webkit-user-select:none;user-select:none}.lib-dropdown__trigger:hover:not(.lib-dropdown__trigger--disabled){border-color:#4a90e2}.lib-dropdown__trigger:focus-within{outline:none;border-color:#4a90e2;box-shadow:0 0 0 3px #4a90e21a}.lib-dropdown__trigger--open{border-color:#4a90e2;box-shadow:0 0 0 3px #4a90e21a}.lib-dropdown__value{flex:1;text-align:left;color:#333;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lib-dropdown__arrow{flex-shrink:0;margin-left:12px;color:#666;transition:transform .2s ease-in-out}.lib-dropdown__arrow--open{transform:rotate(180deg)}.lib-dropdown__menu{position:absolute;top:calc(100% + 4px);left:0;right:0;background-color:#fff;border:2px solid #e0e0e0;border-radius:6px;box-shadow:0 4px 12px #00000026;z-index:1000;max-height:300px;overflow-y:auto;animation:dropdownFadeIn .2s ease-out}.lib-dropdown__option{padding:12px 16px;cursor:pointer;transition:background-color .15s ease-in-out;color:#333;font-size:16px;border-bottom:1px solid #f0f0f0}.lib-dropdown__option:last-child{border-bottom:none}.lib-dropdown__option:hover{background-color:#f5f5f5}.lib-dropdown__option--selected{background-color:#e8f4fd;color:#4a90e2;font-weight:500}.lib-dropdown__option--empty{color:#999;cursor:default;font-style:italic}.lib-dropdown__option--empty:hover{background-color:#fff}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}\n"] }]
+        }], propDecorators: { options: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], selectedValue: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], selectionChange: [{
+                type: Output
+            }], onClickOutside: [{
+                type: HostListener,
+                args: ['document:click', ['$event']]
+            }] } });
+
+class IconCopyComponent extends BaseIconComponent {
+    size = 16;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: IconCopyComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.4", type: IconCopyComponent, isStandalone: false, selector: "kit-icon-copy", usesInheritance: true, ngImport: i0, template: `
+        <svg
+            [attr.width]="size"
+            [attr.height]="size"
+            viewBox="0 0 24 24"
+            fill="none"
+            [attr.stroke]="color"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round">
+            <rect x="9" y="9" width="13" height="13" rx="2"/>
+            <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
+        </svg>
+    `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: IconCopyComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kit-icon-copy',
+                    standalone: false,
+                    template: `
+        <svg
+            [attr.width]="size"
+            [attr.height]="size"
+            viewBox="0 0 24 24"
+            fill="none"
+            [attr.stroke]="color"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round">
+            <rect x="9" y="9" width="13" height="13" rx="2"/>
+            <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
+        </svg>
+    `,
+                }]
+        }] });
+
+class IconCheckComponent extends BaseIconComponent {
+    size = 16;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: IconCheckComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.4", type: IconCheckComponent, isStandalone: false, selector: "kit-icon-check", usesInheritance: true, ngImport: i0, template: `
+        <svg
+            [attr.width]="size"
+            [attr.height]="size"
+            viewBox="0 0 24 24"
+            fill="none"
+            [attr.stroke]="color"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round">
+            <path d="M20 6L9 17l-5-5"/>
+        </svg>
+    `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: IconCheckComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kit-icon-check',
+                    standalone: false,
+                    template: `
+        <svg
+            [attr.width]="size"
+            [attr.height]="size"
+            viewBox="0 0 24 24"
+            fill="none"
+            [attr.stroke]="color"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round">
+            <path d="M20 6L9 17l-5-5"/>
+        </svg>
+    `,
+                }]
+        }] });
+
+const ICON_COMPONENTS = [
+    IconCopyComponent,
+    IconCheckComponent,
+    IconChevronDownComponent,
+];
+class IconModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: IconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.4", ngImport: i0, type: IconModule, declarations: [IconCopyComponent,
+            IconCheckComponent,
+            IconChevronDownComponent], exports: [IconCopyComponent,
+            IconCheckComponent,
+            IconChevronDownComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: IconModule });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: IconModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: ICON_COMPONENTS,
+                    exports: ICON_COMPONENTS,
+                }]
+        }] });
+
+class DropdownModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: DropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.4", ngImport: i0, type: DropdownModule, declarations: [DropdownComponent], imports: [CommonModule, IconModule], exports: [DropdownComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: DropdownModule, imports: [CommonModule, IconModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: DropdownModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [DropdownComponent],
+                    imports: [CommonModule, IconModule],
+                    exports: [DropdownComponent],
+                }]
+        }] });
+
+class CheckboxComponent {
+    label = '';
+    checked = false;
+    disabled = false;
+    indeterminate = false;
+    checkedChange = new EventEmitter();
+    /** Stable id for the input (generated once per component instance to avoid NG0100). */
+    checkboxId = `kit-checkbox-${Math.random().toString(36).substring(2, 11)}`;
+    onCheckboxChange(event) {
+        if (!this.disabled) {
+            const target = event.target;
+            this.checked = target.checked;
+            this.indeterminate = false; // Clear indeterminate state when user interacts
+            this.checkedChange.emit(this.checked);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.4", type: CheckboxComponent, isStandalone: false, selector: "kit-checkbox", inputs: { label: "label", checked: "checked", disabled: "disabled", indeterminate: "indeterminate" }, outputs: { checkedChange: "checkedChange" }, ngImport: i0, template: "<label\r\n    class=\"lib-checkbox\"\r\n    [class.lib-checkbox--disabled]=\"disabled\"\r\n    [attr.for]=\"checkboxId\">\r\n    <input\r\n        type=\"checkbox\"\r\n        [id]=\"checkboxId\"\r\n        class=\"lib-checkbox__input\"\r\n        [checked]=\"checked\"\r\n        [indeterminate]=\"indeterminate\"\r\n        [disabled]=\"disabled\"\r\n        (change)=\"onCheckboxChange($event)\">\r\n    <span class=\"lib-checkbox__checkmark\"></span>\r\n    <span class=\"lib-checkbox__label\" *ngIf=\"label\">{{ label }}</span>\r\n</label>\r\n", styles: [".lib-checkbox{display:inline-flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;font-size:16px;line-height:1.5}.lib-checkbox--disabled{opacity:.6;cursor:not-allowed}.lib-checkbox__input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.lib-checkbox__input:focus-visible+.lib-checkbox__checkmark{outline:2px solid #4a90e2;outline-offset:2px}.lib-checkbox__input:checked~.lib-checkbox__checkmark{background-color:#4a90e2;border-color:#4a90e2}.lib-checkbox__input:checked~.lib-checkbox__checkmark:after{display:block}.lib-checkbox__input:indeterminate~.lib-checkbox__checkmark{background-color:#4a90e2;border-color:#4a90e2}.lib-checkbox__input:indeterminate~.lib-checkbox__checkmark:after{display:block;width:10px;height:2px;border:none;background-color:#fff;transform:translate(-50%,-50%) rotate(0);left:50%;top:50%}.lib-checkbox__input:disabled{cursor:not-allowed}.lib-checkbox__checkmark{position:relative;display:inline-block;width:20px;height:20px;min-width:20px;min-height:20px;background-color:#fff;border:2px solid #ccc;border-radius:4px;margin-right:10px;transition:all .2s ease-in-out;flex-shrink:0}.lib-checkbox__checkmark:hover{border-color:#4a90e2}.lib-checkbox__checkmark:after{content:\"\";position:absolute;display:none;left:6px;top:2px;width:5px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.lib-checkbox__label{color:#333;font-weight:400}.lib-checkbox:hover:not(.lib-checkbox--disabled) .lib-checkbox__checkmark{border-color:#4a90e2}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: CheckboxComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'kit-checkbox', standalone: false, template: "<label\r\n    class=\"lib-checkbox\"\r\n    [class.lib-checkbox--disabled]=\"disabled\"\r\n    [attr.for]=\"checkboxId\">\r\n    <input\r\n        type=\"checkbox\"\r\n        [id]=\"checkboxId\"\r\n        class=\"lib-checkbox__input\"\r\n        [checked]=\"checked\"\r\n        [indeterminate]=\"indeterminate\"\r\n        [disabled]=\"disabled\"\r\n        (change)=\"onCheckboxChange($event)\">\r\n    <span class=\"lib-checkbox__checkmark\"></span>\r\n    <span class=\"lib-checkbox__label\" *ngIf=\"label\">{{ label }}</span>\r\n</label>\r\n", styles: [".lib-checkbox{display:inline-flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;font-size:16px;line-height:1.5}.lib-checkbox--disabled{opacity:.6;cursor:not-allowed}.lib-checkbox__input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.lib-checkbox__input:focus-visible+.lib-checkbox__checkmark{outline:2px solid #4a90e2;outline-offset:2px}.lib-checkbox__input:checked~.lib-checkbox__checkmark{background-color:#4a90e2;border-color:#4a90e2}.lib-checkbox__input:checked~.lib-checkbox__checkmark:after{display:block}.lib-checkbox__input:indeterminate~.lib-checkbox__checkmark{background-color:#4a90e2;border-color:#4a90e2}.lib-checkbox__input:indeterminate~.lib-checkbox__checkmark:after{display:block;width:10px;height:2px;border:none;background-color:#fff;transform:translate(-50%,-50%) rotate(0);left:50%;top:50%}.lib-checkbox__input:disabled{cursor:not-allowed}.lib-checkbox__checkmark{position:relative;display:inline-block;width:20px;height:20px;min-width:20px;min-height:20px;background-color:#fff;border:2px solid #ccc;border-radius:4px;margin-right:10px;transition:all .2s ease-in-out;flex-shrink:0}.lib-checkbox__checkmark:hover{border-color:#4a90e2}.lib-checkbox__checkmark:after{content:\"\";position:absolute;display:none;left:6px;top:2px;width:5px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.lib-checkbox__label{color:#333;font-weight:400}.lib-checkbox:hover:not(.lib-checkbox--disabled) .lib-checkbox__checkmark{border-color:#4a90e2}\n"] }]
+        }], propDecorators: { label: [{
+                type: Input
+            }], checked: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], indeterminate: [{
+                type: Input
+            }], checkedChange: [{
+                type: Output
+            }] } });
+
+class CheckboxModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: CheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.4", ngImport: i0, type: CheckboxModule, declarations: [CheckboxComponent], imports: [CommonModule], exports: [CheckboxComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: CheckboxModule, imports: [CommonModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: CheckboxModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [CheckboxComponent],
+                    imports: [CommonModule],
+                    exports: [CheckboxComponent],
+                }]
+        }] });
+
+/*
+ * Public API Surface of ui-kit
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { BaseIconComponent, ButtonComponent, ButtonModule, CheckboxComponent, CheckboxModule, DropdownComponent, DropdownModule, IconCheckComponent, IconChevronDownComponent, IconCopyComponent, IconModule };
+//# sourceMappingURL=zhannam85-ui-kit.mjs.map

package/fesm2022/zhannam85-ui-kit.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"zhannam85-ui-kit.mjs","sources":["../../../src/components/button/button.component.ts","../../../src/components/button/button.component.html","../../../src/components/button/button.module.ts","../../../src/components/icon/base-icon.component.ts","../../../src/components/icon/icon-chevron-down.component.ts","../../../src/components/dropdown/dropdown.component.ts","../../../src/components/dropdown/dropdown.component.html","../../../src/components/icon/icon-copy.component.ts","../../../src/components/icon/icon-check.component.ts","../../../src/components/icon/icon.module.ts","../../../src/components/dropdown/dropdown.module.ts","../../../src/components/checkbox/checkbox.component.ts","../../../src/components/checkbox/checkbox.component.html","../../../src/components/checkbox/checkbox.module.ts","../../../src/public-api.ts","../../../src/zhannam85-ui-kit.ts"],"sourcesContent":["import { Component, EventEmitter, Input, Output } from '@angular/core';\r\n\r\n@Component({\r\n    selector: 'kit-button',\r\n    standalone: false,\r\n    templateUrl: './button.component.html',\r\n    styleUrls: ['./button.component.scss']\r\n})\r\nexport class ButtonComponent {\r\n  @Input() public label = '';\r\n\r\n  @Input() public variant: 'primary' | 'secondary' | 'danger' = 'primary';\r\n\r\n  @Input() public disabled = false;\r\n\r\n  @Input() public type: 'button' | 'submit' | 'reset' = 'button';\r\n\r\n  @Input() public size: 'small' | 'medium' | 'large' = 'medium';\r\n\r\n  @Output() public buttonClicked = new EventEmitter<MouseEvent>();\r\n\r\n  public onClick(event: MouseEvent): void {\r\n      if (!this.disabled) {\r\n          this.buttonClicked.emit(event);\r\n      }\r\n  }\r\n}\r\n","<button\r\n  [type]=\"type\"\r\n  [disabled]=\"disabled\"\r\n  [class]=\"'lib-button lib-button--' + variant + ' lib-button--' + size\"\r\n  (click)=\"onClick($event)\">\r\n  {{ label }}\r\n</button>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\nimport { ButtonComponent } from './button.component';\r\n\r\n@NgModule({\r\n    declarations: [ButtonComponent],\r\n    imports: [CommonModule],\r\n    exports: [ButtonComponent],\r\n})\r\nexport class ButtonModule {}\r\n","import { Component, HostBinding, Input } from '@angular/core';\r\n\r\n@Component({ template: '' })\r\nexport abstract class BaseIconComponent {\r\n    @Input() public size = 24;\r\n\r\n    @Input() public color = 'currentColor';\r\n\r\n    @HostBinding('style.width.px')\r\n    public get hostWidth(): number {\r\n        return this.size;\r\n    }\r\n\r\n    @HostBinding('style.height.px')\r\n    public get hostHeight(): number {\r\n        return this.size;\r\n    }\r\n\r\n    @HostBinding('style.display')\r\n    public readonly display = 'inline-flex';\r\n\r\n    @HostBinding('style.color')\r\n    public get hostColor(): string {\r\n        return this.color;\r\n    }\r\n}\r\n","import { Component } from '@angular/core';\r\nimport { BaseIconComponent } from './base-icon.component';\r\n\r\n@Component({\r\n    selector: 'kit-icon-chevron-down',\r\n    standalone: false,\r\n    template: `\r\n        <svg\r\n            [attr.width]=\"size\"\r\n            [attr.height]=\"size\"\r\n            viewBox=\"0 0 12 12\"\r\n            fill=\"none\"\r\n            [attr.stroke]=\"color\"\r\n            stroke-width=\"1.5\"\r\n            stroke-linecap=\"round\"\r\n            stroke-linejoin=\"round\">\r\n            <path d=\"M3 4.5L6 7.5L9 4.5\"/>\r\n        </svg>\r\n    `,\r\n})\r\nexport class IconChevronDownComponent extends BaseIconComponent {\r\n    override size = 12;\r\n}\r\n","/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport { Component, EventEmitter, HostListener, Input, Output, OnInit } from '@angular/core';\r\n\r\nexport interface DropdownOption {\r\n    label: string;\r\n    value: any;\r\n}\r\n\r\n@Component({\r\n    selector: 'kit-dropdown',\r\n    standalone: false,\r\n    templateUrl: './dropdown.component.html',\r\n    styleUrls: ['./dropdown.component.scss']\r\n})\r\nexport class DropdownComponent implements OnInit {\r\n    private _options: DropdownOption[] = [];\r\n    private _selectedValue: any = null;\r\n\r\n    @Input() public set options(value: DropdownOption[]) {\r\n        this._options = value ?? [];\r\n        this.updateSelectedOption();\r\n    }\r\n\r\n    public get options(): DropdownOption[] {\r\n        return this._options;\r\n    }\r\n\r\n    @Input() public placeholder = 'Select an option';\r\n\r\n    @Input() public set selectedValue(value: any) {\r\n        this._selectedValue = value;\r\n        this.updateSelectedOption();\r\n    }\r\n\r\n    public get selectedValue(): any {\r\n        return this._selectedValue;\r\n    }\r\n\r\n    @Input() public disabled = false;\r\n\r\n    @Output() public selectionChange = new EventEmitter<any>();\r\n\r\n    public isOpen = false;\r\n\r\n    public selectedOption: DropdownOption | null = null;\r\n\r\n    public ngOnInit(): void {\r\n        this.updateSelectedOption();\r\n    }\r\n\r\n    private updateSelectedOption(): void {\r\n        if (this._selectedValue !== null && this._selectedValue !== undefined) {\r\n            this.selectedOption = this._options.find(opt => opt.value === this._selectedValue) || null;\r\n        } else {\r\n            this.selectedOption = null;\r\n        }\r\n    }\r\n\r\n    public toggleDropdown(): void {\r\n        if (!this.disabled) {\r\n            this.isOpen = !this.isOpen;\r\n        }\r\n    }\r\n\r\n    public onTriggerKeydown(event: KeyboardEvent): void {\r\n        if (event.key === 'Enter' || event.key === ' ') {\r\n            event.preventDefault();\r\n            this.toggleDropdown();\r\n        }\r\n    }\r\n\r\n    public onOptionKeydown(event: KeyboardEvent, option: DropdownOption): void {\r\n        if (event.key === 'Enter' || event.key === ' ') {\r\n            event.preventDefault();\r\n            this.selectOption(option);\r\n        }\r\n    }\r\n\r\n    public selectOption(option: DropdownOption): void {\r\n        if (!this.disabled) {\r\n            this.selectedOption = option;\r\n            this._selectedValue = option.value;\r\n            this.isOpen = false;\r\n            this.selectionChange.emit(option.value);\r\n        }\r\n    }\r\n\r\n  @HostListener('document:click', ['$event'])\r\n    public onClickOutside(event: Event): void {\r\n        const target = event.target as HTMLElement;\r\n        if (!target.closest('.lib-dropdown')) {\r\n            this.isOpen = false;\r\n        }\r\n    }\r\n}\r\n","<div class=\"lib-dropdown\" [class.lib-dropdown--disabled]=\"disabled\">\r\n  <div\r\n    class=\"lib-dropdown__trigger\"\r\n    [class.lib-dropdown__trigger--open]=\"isOpen\"\r\n    role=\"button\"\r\n    tabindex=\"0\"\r\n    (click)=\"toggleDropdown()\"\r\n    (keydown)=\"onTriggerKeydown($event)\">\r\n    <span class=\"lib-dropdown__value\">\r\n      {{ selectedOption ? selectedOption.label : placeholder }}\r\n    </span>\r\n    <kit-icon-chevron-down\r\n      class=\"lib-dropdown__arrow\"\r\n      [class.lib-dropdown__arrow--open]=\"isOpen\"\r\n      [size]=\"12\">\r\n    </kit-icon-chevron-down>\r\n  </div>\r\n  <div class=\"lib-dropdown__menu\" *ngIf=\"isOpen && !disabled\">\r\n    <div\r\n      *ngFor=\"let option of options\"\r\n      class=\"lib-dropdown__option\"\r\n      [class.lib-dropdown__option--selected]=\"selectedOption?.value === option.value\"\r\n      role=\"option\"\r\n      [attr.aria-selected]=\"selectedOption?.value === option.value\"\r\n      tabindex=\"0\"\r\n      (click)=\"selectOption(option)\"\r\n      (keydown)=\"onOptionKeydown($event, option)\">\r\n      {{ option.label }}\r\n    </div>\r\n    <div *ngIf=\"options.length === 0\" class=\"lib-dropdown__option lib-dropdown__option--empty\">\r\n      No options available\r\n    </div>\r\n  </div>\r\n</div>\r\n","import { Component } from '@angular/core';\r\nimport { BaseIconComponent } from './base-icon.component';\r\n\r\n@Component({\r\n    selector: 'kit-icon-copy',\r\n    standalone: false,\r\n    template: `\r\n        <svg\r\n            [attr.width]=\"size\"\r\n            [attr.height]=\"size\"\r\n            viewBox=\"0 0 24 24\"\r\n            fill=\"none\"\r\n            [attr.stroke]=\"color\"\r\n            stroke-width=\"2\"\r\n            stroke-linecap=\"round\"\r\n            stroke-linejoin=\"round\">\r\n            <rect x=\"9\" y=\"9\" width=\"13\" height=\"13\" rx=\"2\"/>\r\n            <path d=\"M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1\"/>\r\n        </svg>\r\n    `,\r\n})\r\nexport class IconCopyComponent extends BaseIconComponent {\r\n    override size = 16;\r\n}\r\n","import { Component } from '@angular/core';\r\nimport { BaseIconComponent } from './base-icon.component';\r\n\r\n@Component({\r\n    selector: 'kit-icon-check',\r\n    standalone: false,\r\n    template: `\r\n        <svg\r\n            [attr.width]=\"size\"\r\n            [attr.height]=\"size\"\r\n            viewBox=\"0 0 24 24\"\r\n            fill=\"none\"\r\n            [attr.stroke]=\"color\"\r\n            stroke-width=\"2\"\r\n            stroke-linecap=\"round\"\r\n            stroke-linejoin=\"round\">\r\n            <path d=\"M20 6L9 17l-5-5\"/>\r\n        </svg>\r\n    `,\r\n})\r\nexport class IconCheckComponent extends BaseIconComponent {\r\n    override size = 16;\r\n}\r\n","import { NgModule } from '@angular/core';\r\n\r\nimport { IconCopyComponent } from './icon-copy.component';\r\nimport { IconCheckComponent } from './icon-check.component';\r\nimport { IconChevronDownComponent } from './icon-chevron-down.component';\r\n\r\nconst ICON_COMPONENTS = [\r\n    IconCopyComponent,\r\n    IconCheckComponent,\r\n    IconChevronDownComponent,\r\n];\r\n\r\n@NgModule({\r\n    declarations: ICON_COMPONENTS,\r\n    exports: ICON_COMPONENTS,\r\n})\r\nexport class IconModule {}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\nimport { DropdownComponent } from './dropdown.component';\r\nimport { IconModule } from '../icon/icon.module';\r\n\r\n@NgModule({\r\n    declarations: [DropdownComponent],\r\n    imports: [CommonModule, IconModule],\r\n    exports: [DropdownComponent],\r\n})\r\nexport class DropdownModule {}\r\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\r\n\r\n@Component({\r\n    selector: 'kit-checkbox',\r\n    standalone: false,\r\n    templateUrl: './checkbox.component.html',\r\n    styleUrls: ['./checkbox.component.scss']\r\n})\r\nexport class CheckboxComponent {\r\n  @Input() public label = '';\r\n\r\n  @Input() public checked = false;\r\n\r\n  @Input() public disabled = false;\r\n\r\n  @Input() public indeterminate = false;\r\n\r\n  @Output() public checkedChange = new EventEmitter<boolean>();\r\n\r\n  /** Stable id for the input (generated once per component instance to avoid NG0100). */\r\n  public readonly checkboxId = `kit-checkbox-${Math.random().toString(36).substring(2, 11)}`;\r\n\r\n  public onCheckboxChange(event: Event): void {\r\n      if (!this.disabled) {\r\n          const target = event.target as HTMLInputElement;\r\n          this.checked = target.checked;\r\n          this.indeterminate = false; // Clear indeterminate state when user interacts\r\n          this.checkedChange.emit(this.checked);\r\n      }\r\n  }\r\n}\r\n","<label\r\n    class=\"lib-checkbox\"\r\n    [class.lib-checkbox--disabled]=\"disabled\"\r\n    [attr.for]=\"checkboxId\">\r\n    <input\r\n        type=\"checkbox\"\r\n        [id]=\"checkboxId\"\r\n        class=\"lib-checkbox__input\"\r\n        [checked]=\"checked\"\r\n        [indeterminate]=\"indeterminate\"\r\n        [disabled]=\"disabled\"\r\n        (change)=\"onCheckboxChange($event)\">\r\n    <span class=\"lib-checkbox__checkmark\"></span>\r\n    <span class=\"lib-checkbox__label\" *ngIf=\"label\">{{ label }}</span>\r\n</label>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\nimport { CheckboxComponent } from './checkbox.component';\r\n\r\n@NgModule({\r\n    declarations: [CheckboxComponent],\r\n    imports: [CommonModule],\r\n    exports: [CheckboxComponent],\r\n})\r\nexport class CheckboxModule {}\r\n","/*\r\n * Public API Surface of ui-kit\r\n */\r\n\r\nexport * from './components/button/button.component';\r\nexport * from './components/button/button.module';\r\nexport * from './components/dropdown/dropdown.component';\r\nexport * from './components/dropdown/dropdown.module';\r\nexport * from './components/checkbox/checkbox.component';\r\nexport * from './components/checkbox/checkbox.module';\r\nexport * from './components/icon/base-icon.component';\r\nexport * from './components/icon/icon-copy.component';\r\nexport * from './components/icon/icon-check.component';\r\nexport * from './components/icon/icon-chevron-down.component';\r\nexport * from './components/icon/icon.module';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i2.IconChevronDownComponent"],"mappings":";;;;;MAQa,eAAe,CAAA;IACV,KAAK,GAAG,EAAE;IAEV,OAAO,GAAuC,SAAS;IAEvD,QAAQ,GAAG,KAAK;IAEhB,IAAI,GAAkC,QAAQ;IAE9C,IAAI,GAAiC,QAAQ;AAE5C,IAAA,aAAa,GAAG,IAAI,YAAY,EAAc;AAExD,IAAA,OAAO,CAAC,KAAiB,EAAA;AAC5B,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAChB,YAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC;QAClC;IACJ;uGAjBW,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAf,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAe,sNCR5B,6MAOA,EAAA,MAAA,EAAA,CAAA,+7CAAA,CAAA,EAAA,CAAA;;2FDCa,eAAe,EAAA,UAAA,EAAA,CAAA;kBAN3B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,cACV,KAAK,EAAA,QAAA,EAAA,6MAAA,EAAA,MAAA,EAAA,CAAA,+7CAAA,CAAA,EAAA;;sBAKlB;;sBAEA;;sBAEA;;sBAEA;;sBAEA;;sBAEA;;;METU,YAAY,CAAA;uGAAZ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAZ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,YAAY,EAAA,YAAA,EAAA,CAJN,eAAe,CAAA,EAAA,OAAA,EAAA,CACpB,YAAY,aACZ,eAAe,CAAA,EAAA,CAAA;AAEhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,YAAY,YAHX,YAAY,CAAA,EAAA,CAAA;;2FAGb,YAAY,EAAA,UAAA,EAAA,CAAA;kBALxB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,YAAY,EAAE,CAAC,eAAe,CAAC;oBAC/B,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,eAAe,CAAC;AAC7B,iBAAA;;;MCNqB,iBAAiB,CAAA;IACnB,IAAI,GAAG,EAAE;IAET,KAAK,GAAG,cAAc;AAEtC,IAAA,IACW,SAAS,GAAA;QAChB,OAAO,IAAI,CAAC,IAAI;IACpB;AAEA,IAAA,IACW,UAAU,GAAA;QACjB,OAAO,IAAI,CAAC,IAAI;IACpB;IAGgB,OAAO,GAAG,aAAa;AAEvC,IAAA,IACW,SAAS,GAAA;QAChB,OAAO,IAAI,CAAC,KAAK;IACrB;uGArBkB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,wRADhB,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FACH,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBADtC,SAAS;mBAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;;sBAEtB;;sBAEA;;sBAEA,WAAW;uBAAC,gBAAgB;;sBAK5B,WAAW;uBAAC,iBAAiB;;sBAK7B,WAAW;uBAAC,eAAe;;sBAG3B,WAAW;uBAAC,aAAa;;;ACDxB,MAAO,wBAAyB,SAAQ,iBAAiB,CAAA;IAClD,IAAI,GAAG,EAAE;uGADT,wBAAwB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAxB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,EAAA,YAAA,EAAA,KAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAdvB,CAAA;;;;;;;;;;;;AAYT,IAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAEQ,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAjBpC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,uBAAuB;AACjC,oBAAA,UAAU,EAAE,KAAK;AACjB,oBAAA,QAAQ,EAAE,CAAA;;;;;;;;;;;;AAYT,IAAA,CAAA;AACJ,iBAAA;;;ACnBD;MAca,iBAAiB,CAAA;IAClB,QAAQ,GAAqB,EAAE;IAC/B,cAAc,GAAQ,IAAI;IAElC,IAAoB,OAAO,CAAC,KAAuB,EAAA;AAC/C,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,IAAI,EAAE;QAC3B,IAAI,CAAC,oBAAoB,EAAE;IAC/B;AAEA,IAAA,IAAW,OAAO,GAAA;QACd,OAAO,IAAI,CAAC,QAAQ;IACxB;IAEgB,WAAW,GAAG,kBAAkB;IAEhD,IAAoB,aAAa,CAAC,KAAU,EAAA;AACxC,QAAA,IAAI,CAAC,cAAc,GAAG,KAAK;QAC3B,IAAI,CAAC,oBAAoB,EAAE;IAC/B;AAEA,IAAA,IAAW,aAAa,GAAA;QACpB,OAAO,IAAI,CAAC,cAAc;IAC9B;IAEgB,QAAQ,GAAG,KAAK;AAEf,IAAA,eAAe,GAAG,IAAI,YAAY,EAAO;IAEnD,MAAM,GAAG,KAAK;IAEd,cAAc,GAA0B,IAAI;IAE5C,QAAQ,GAAA;QACX,IAAI,CAAC,oBAAoB,EAAE;IAC/B;IAEQ,oBAAoB,GAAA;AACxB,QAAA,IAAI,IAAI,CAAC,cAAc,KAAK,IAAI,IAAI,IAAI,CAAC,cAAc,KAAK,SAAS,EAAE;YACnE,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,KAAK,KAAK,IAAI,CAAC,cAAc,CAAC,IAAI,IAAI;QAC9F;aAAO;AACH,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI;QAC9B;IACJ;IAEO,cAAc,GAAA;AACjB,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAChB,YAAA,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM;QAC9B;IACJ;AAEO,IAAA,gBAAgB,CAAC,KAAoB,EAAA;AACxC,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC5C,KAAK,CAAC,cAAc,EAAE;YACtB,IAAI,CAAC,cAAc,EAAE;QACzB;IACJ;IAEO,eAAe,CAAC,KAAoB,EAAE,MAAsB,EAAA;AAC/D,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC5C,KAAK,CAAC,cAAc,EAAE;AACtB,YAAA,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;QAC7B;IACJ;AAEO,IAAA,YAAY,CAAC,MAAsB,EAAA;AACtC,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAChB,YAAA,IAAI,CAAC,cAAc,GAAG,MAAM;AAC5B,YAAA,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC,KAAK;AAClC,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;YACnB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;QAC3C;IACJ;AAGO,IAAA,cAAc,CAAC,KAAY,EAAA;AAC9B,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB;QAC1C,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE;AAClC,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;QACvB;IACJ;uGA/ES,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,iTCd9B,gyCAkCA,EAAA,MAAA,EAAA,CAAA,wwDAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,wBAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,CAAA,EAAA,CAAA;;2FDpBa,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAN7B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,cAAc,cACZ,KAAK,EAAA,QAAA,EAAA,gyCAAA,EAAA,MAAA,EAAA,CAAA,wwDAAA,CAAA,EAAA;;sBAQhB;;sBASA;;sBAEA;;sBASA;;sBAEA;;sBA+CF,YAAY;uBAAC,gBAAgB,EAAE,CAAC,QAAQ,CAAC;;;AElEtC,MAAO,iBAAkB,SAAQ,iBAAiB,CAAA;IAC3C,IAAI,GAAG,EAAE;uGADT,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,EAAA,YAAA,EAAA,KAAA,EAAA,QAAA,EAAA,eAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAfhB,CAAA;;;;;;;;;;;;;AAaT,IAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAEQ,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAlB7B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,eAAe;AACzB,oBAAA,UAAU,EAAE,KAAK;AACjB,oBAAA,QAAQ,EAAE,CAAA;;;;;;;;;;;;;AAaT,IAAA,CAAA;AACJ,iBAAA;;;ACAK,MAAO,kBAAmB,SAAQ,iBAAiB,CAAA;IAC5C,IAAI,GAAG,EAAE;uGADT,kBAAkB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,kBAAkB,EAAA,YAAA,EAAA,KAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAdjB,CAAA;;;;;;;;;;;;AAYT,IAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAEQ,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAjB9B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,KAAK;AACjB,oBAAA,QAAQ,EAAE,CAAA;;;;;;;;;;;;AAYT,IAAA,CAAA;AACJ,iBAAA;;;ACbD,MAAM,eAAe,GAAG;IACpB,iBAAiB;IACjB,kBAAkB;IAClB,wBAAwB;CAC3B;MAMY,UAAU,CAAA;uGAAV,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAV,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAU,iBATnB,iBAAiB;YACjB,kBAAkB;AAClB,YAAA,wBAAwB,aAFxB,iBAAiB;YACjB,kBAAkB;YAClB,wBAAwB,CAAA,EAAA,CAAA;wGAOf,UAAU,EAAA,CAAA;;2FAAV,UAAU,EAAA,UAAA,EAAA,CAAA;kBAJtB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,YAAY,EAAE,eAAe;AAC7B,oBAAA,OAAO,EAAE,eAAe;AAC3B,iBAAA;;;MCJY,cAAc,CAAA;uGAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAd,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,cAAc,iBAJR,iBAAiB,CAAA,EAAA,OAAA,EAAA,CACtB,YAAY,EAAE,UAAU,aACxB,iBAAiB,CAAA,EAAA,CAAA;wGAElB,cAAc,EAAA,OAAA,EAAA,CAHb,YAAY,EAAE,UAAU,CAAA,EAAA,CAAA;;2FAGzB,cAAc,EAAA,UAAA,EAAA,CAAA;kBAL1B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,YAAY,EAAE,CAAC,iBAAiB,CAAC;AACjC,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,UAAU,CAAC;oBACnC,OAAO,EAAE,CAAC,iBAAiB,CAAC;AAC/B,iBAAA;;;MCFY,iBAAiB,CAAA;IACZ,KAAK,GAAG,EAAE;IAEV,OAAO,GAAG,KAAK;IAEf,QAAQ,GAAG,KAAK;IAEhB,aAAa,GAAG,KAAK;AAEpB,IAAA,aAAa,GAAG,IAAI,YAAY,EAAW;;AAG5C,IAAA,UAAU,GAAG,CAAA,aAAA,EAAgB,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE;AAEnF,IAAA,gBAAgB,CAAC,KAAY,EAAA;AAChC,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAChB,YAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B;AAC/C,YAAA,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO;AAC7B,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;YAC3B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;QACzC;IACJ;uGArBW,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,4NCR9B,siBAeA,EAAA,MAAA,EAAA,CAAA,0gDAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FDPa,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAN7B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,cAAc,cACZ,KAAK,EAAA,QAAA,EAAA,siBAAA,EAAA,MAAA,EAAA,CAAA,0gDAAA,CAAA,EAAA;;sBAKlB;;sBAEA;;sBAEA;;sBAEA;;sBAEA;;;MEPU,cAAc,CAAA;uGAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAd,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,cAAc,EAAA,YAAA,EAAA,CAJR,iBAAiB,CAAA,EAAA,OAAA,EAAA,CACtB,YAAY,aACZ,iBAAiB,CAAA,EAAA,CAAA;AAElB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,cAAc,YAHb,YAAY,CAAA,EAAA,CAAA;;2FAGb,cAAc,EAAA,UAAA,EAAA,CAAA;kBAL1B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,YAAY,EAAE,CAAC,iBAAiB,CAAC;oBACjC,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,iBAAiB,CAAC;AAC/B,iBAAA;;;ACTD;;AAEG;;ACFH;;AAEG;;;;"}

package/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "@zhannam85/ui-kit",
+  "version": "0.1.0",
+  "description": "A modern Angular UI kit library with Button, Dropdown, and Checkbox components",
+  "keywords": [
+    "angular",
+    "ui-kit",
+    "components",
+    "button",
+    "dropdown",
+    "checkbox"
+  ],
+  "author": "",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": ""
+  },
+  "peerDependencies": {
+    "@angular/common": "^21.0.0",
+    "@angular/core": "^21.0.0"
+  },
+  "dependencies": {
+    "@angular/common": "^21.0.0",
+    "@angular/core": "^21.0.0",
+    "@angular/router": "^21.0.0",
+    "tslib": "^2.3.0"
+  },
+  "main": "dist/ui-kit/fesm2022/ui-kit.mjs",
+  "module": "fesm2022/zhannam85-ui-kit.mjs",
+  "types": "dist/ui-kit/index.d.ts",
+  "exports": {
+    ".": {
+      "esm2022": "./dist/ui-kit/fesm2022/ui-kit.mjs",
+      "esm": "./dist/ui-kit/fesm2022/ui-kit.mjs",
+      "types": "./types/zhannam85-ui-kit.d.ts",
+      "default": "./fesm2022/zhannam85-ui-kit.mjs"
+    },
+    "./package.json": {
+      "default": "./package.json"
+    }
+  },
+  "sideEffects": false,
+  "typings": "types/zhannam85-ui-kit.d.ts"
+}

package/types/zhannam85-ui-kit.d.ts

@@ -0,0 +1,111 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, OnInit } from '@angular/core';
+import * as i2 from '@angular/common';
+
+declare class ButtonComponent {
+    label: string;
+    variant: 'primary' | 'secondary' | 'danger';
+    disabled: boolean;
+    type: 'button' | 'submit' | 'reset';
+    size: 'small' | 'medium' | 'large';
+    buttonClicked: EventEmitter<MouseEvent>;
+    onClick(event: MouseEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "kit-button", never, { "label": { "alias": "label"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "type": { "alias": "type"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "buttonClicked": "buttonClicked"; }, never, never, false, never>;
+}
+
+declare class ButtonModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ButtonModule, [typeof ButtonComponent], [typeof i2.CommonModule], [typeof ButtonComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ButtonModule>;
+}
+
+interface DropdownOption {
+    label: string;
+    value: any;
+}
+declare class DropdownComponent implements OnInit {
+    private _options;
+    private _selectedValue;
+    set options(value: DropdownOption[]);
+    get options(): DropdownOption[];
+    placeholder: string;
+    set selectedValue(value: any);
+    get selectedValue(): any;
+    disabled: boolean;
+    selectionChange: EventEmitter<any>;
+    isOpen: boolean;
+    selectedOption: DropdownOption | null;
+    ngOnInit(): void;
+    private updateSelectedOption;
+    toggleDropdown(): void;
+    onTriggerKeydown(event: KeyboardEvent): void;
+    onOptionKeydown(event: KeyboardEvent, option: DropdownOption): void;
+    selectOption(option: DropdownOption): void;
+    onClickOutside(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DropdownComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DropdownComponent, "kit-dropdown", never, { "options": { "alias": "options"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "selectedValue": { "alias": "selectedValue"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "selectionChange": "selectionChange"; }, never, never, false, never>;
+}
+
+declare abstract class BaseIconComponent {
+    size: number;
+    color: string;
+    get hostWidth(): number;
+    get hostHeight(): number;
+    readonly display = "inline-flex";
+    get hostColor(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<BaseIconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BaseIconComponent, "ng-component", never, { "size": { "alias": "size"; "required": false; }; "color": { "alias": "color"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class IconCopyComponent extends BaseIconComponent {
+    size: number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IconCopyComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<IconCopyComponent, "kit-icon-copy", never, {}, {}, never, never, false, never>;
+}
+
+declare class IconCheckComponent extends BaseIconComponent {
+    size: number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IconCheckComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<IconCheckComponent, "kit-icon-check", never, {}, {}, never, never, false, never>;
+}
+
+declare class IconChevronDownComponent extends BaseIconComponent {
+    size: number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IconChevronDownComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<IconChevronDownComponent, "kit-icon-chevron-down", never, {}, {}, never, never, false, never>;
+}
+
+declare class IconModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<IconModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<IconModule, [typeof IconCopyComponent, typeof IconCheckComponent, typeof IconChevronDownComponent], never, [typeof IconCopyComponent, typeof IconCheckComponent, typeof IconChevronDownComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<IconModule>;
+}
+
+declare class DropdownModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<DropdownModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DropdownModule, [typeof DropdownComponent], [typeof i2.CommonModule, typeof IconModule], [typeof DropdownComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<DropdownModule>;
+}
+
+declare class CheckboxComponent {
+    label: string;
+    checked: boolean;
+    disabled: boolean;
+    indeterminate: boolean;
+    checkedChange: EventEmitter<boolean>;
+    /** Stable id for the input (generated once per component instance to avoid NG0100). */
+    readonly checkboxId: string;
+    onCheckboxChange(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "kit-checkbox", never, { "label": { "alias": "label"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; }, { "checkedChange": "checkedChange"; }, never, never, false, never>;
+}
+
+declare class CheckboxModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CheckboxModule, [typeof CheckboxComponent], [typeof i2.CommonModule], [typeof CheckboxComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<CheckboxModule>;
+}
+
+export { BaseIconComponent, ButtonComponent, ButtonModule, CheckboxComponent, CheckboxModule, DropdownComponent, DropdownModule, IconCheckComponent, IconChevronDownComponent, IconCopyComponent, IconModule };
+export type { DropdownOption };