{"_id":"@bloc-ui/autocomplete","_rev":"6-2f9dc355836c806584a688b30b8097eb","name":"@bloc-ui/autocomplete","dist-tags":{"latest":"1.0.9"},"versions":{"0.0.1":{"name":"@bloc-ui/autocomplete","version":"0.0.1","_id":"@bloc-ui/autocomplete@0.0.1","maintainers":[{"name":"bloc_ui","email":"debasishsahoo444@gmail.com"}],"homepage":"https://github.com/debasish1996/BLOC-UI#readme","bugs":{"url":"https://github.com/debasish1996/BLOC-UI/issues"},"dist":{"shasum":"6cfcbda6837ed6684b1f655f4c4cd2c4ce251e68","tarball":"https://registry.npmjs.org/@bloc-ui/autocomplete/-/autocomplete-0.0.1.tgz","fileCount":4,"integrity":"sha512-5B7I4LpYqUby4tdD/0bC1+R6shoqhfi5TuxxfqvQxZYxvEFSxKo5dGSxgNZ4tZECkt8i0XRhBjmWIOdl/pA72A==","signatures":[{"sig":"MEUCIQDDCutSNwkOVmnITUiYlwHMQ0eg9aw1fful6I2hqSBKzgIgGaKlFr+F+et6TSVw2FCHfb6iqiRLQ2M8dB4cE6azpGE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":38622},"module":"fesm2022/bloc-ui-autocomplete.mjs","exports":{".":{"types":"./types/bloc-ui-autocomplete.d.ts","default":"./fesm2022/bloc-ui-autocomplete.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"58631622a80eae661e0affa0c9deca88f490cdf9","typings":"types/bloc-ui-autocomplete.d.ts","_npmUser":{"name":"bloc_ui","email":"debasishsahoo444@gmail.com"},"repository":{"url":"git+https://github.com/debasish1996/BLOC-UI.git","type":"git","directory":"projects/bloc-ui-autocomplete"},"_npmVersion":"11.9.0","directories":{},"sideEffects":false,"_nodeVersion":"24.14.0","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.2.0","@angular/forms":"^21.2.0","@angular/common":"^21.2.0"},"_npmOperationalInternal":{"tmp":"tmp/autocomplete_0.0.1_1775148309805_0.6872184232486602","host":"s3://npm-registry-packages-npm-production"}},"1.0.0":{"name":"@bloc-ui/autocomplete","version":"1.0.0","_id":"@bloc-ui/autocomplete@1.0.0","maintainers":[{"name":"bloc_ui","email":"debasishsahoo444@gmail.com"}],"homepage":"https://github.com/debasish1996/BLOC-UI#readme","bugs":{"url":"https://github.com/debasish1996/BLOC-UI/issues"},"dist":{"shasum":"a65944faf185f4a2f4f735f6816371ca9a9bf800","tarball":"https://registry.npmjs.org/@bloc-ui/autocomplete/-/autocomplete-1.0.0.tgz","fileCount":5,"integrity":"sha512-9wJWt+xGJFwLJMAhYRc7FdergTYkYRdtYt2VqwTgxathVfvQlRdDn5b6MS0c/mU5xZ/LRuQQY6YW6T6eB9R3ng==","signatures":[{"sig":"MEQCIHKdXb99vAco8rYyXuxYqTKCnm8Zm1tWFrfg6EtohNWmAiBQABwQqOFPTYQst637FbLGPGXF6lWLVTL3P5qWuLH2WQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@bloc-ui%2fautocomplete@1.0.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":41999},"module":"fesm2022/bloc-ui-autocomplete.mjs","exports":{".":{"types":"./types/bloc-ui-autocomplete.d.ts","default":"./fesm2022/bloc-ui-autocomplete.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"f832a5e7e68decf50c87d89996c37e3ff983b8bb","typings":"types/bloc-ui-autocomplete.d.ts","_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:1087c929-4fa9-45ba-9f2a-247c4b9a9bc9"}},"repository":{"url":"git+https://github.com/debasish1996/BLOC-UI.git","type":"git","directory":"projects/bloc-ui-autocomplete"},"_npmVersion":"11.11.0","description":"> **Latest:** v1.0.0","directories":{},"sideEffects":false,"_nodeVersion":"24.14.1","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.2.0","@angular/forms":"^21.2.0","@angular/common":"^21.2.0"},"_npmOperationalInternal":{"tmp":"tmp/autocomplete_1.0.0_1775451843104_0.7959191723733336","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@bloc-ui/autocomplete","version":"1.0.2","_id":"@bloc-ui/autocomplete@1.0.2","maintainers":[{"name":"bloc_ui","email":"debasishsahoo444@gmail.com"}],"homepage":"https://github.com/debasish1996/BLOC-UI#readme","bugs":{"url":"https://github.com/debasish1996/BLOC-UI/issues"},"dist":{"shasum":"e4eda37dc3f81c236376015a92f077daf1692d58","tarball":"https://registry.npmjs.org/@bloc-ui/autocomplete/-/autocomplete-1.0.2.tgz","fileCount":5,"integrity":"sha512-yxvFvTQx5dRF3vlqQZ7eXcTLg3MY1vwRmECdgIZyIwDfahfSlV0Ity+w5vBtCXk/+StBNFg5hNnkO2HXhTtNJQ==","signatures":[{"sig":"MEYCIQCJ5HPMTpOmHqD9O7Zb3pnTN9KfsiwmnpEqTCUJN89odQIhAMMSNCY3yxwi6UnQkfHbSE35sgI9OzWbIe72dCe3f9R/","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@bloc-ui%2fautocomplete@1.0.2","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":63688},"module":"fesm2022/bloc-ui-autocomplete.mjs","exports":{".":{"types":"./types/bloc-ui-autocomplete.d.ts","default":"./fesm2022/bloc-ui-autocomplete.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"8c4a17992c0b4f5098f6c8c6619ea2fe87e35111","typings":"types/bloc-ui-autocomplete.d.ts","_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:1087c929-4fa9-45ba-9f2a-247c4b9a9bc9"}},"repository":{"url":"git+https://github.com/debasish1996/BLOC-UI.git","type":"git","directory":"projects/bloc-ui-autocomplete"},"_npmVersion":"11.11.0","description":"> **Latest:** v1.0.2","directories":{},"sideEffects":false,"_nodeVersion":"24.14.1","dependencies":{"tslib":"^2.3.0","@bloc-ui/overlay":"^1.0.0"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.2.0","@angular/forms":"^21.2.0","@angular/common":"^21.2.0"},"_npmOperationalInternal":{"tmp":"tmp/autocomplete_1.0.2_1775551789689_0.253550968248629","host":"s3://npm-registry-packages-npm-production"}},"1.0.6":{"name":"@bloc-ui/autocomplete","version":"1.0.6","_id":"@bloc-ui/autocomplete@1.0.6","maintainers":[{"name":"bloc_ui","email":"debasishsahoo444@gmail.com"}],"homepage":"https://github.com/debasish1996/BLOC-UI#readme","bugs":{"url":"https://github.com/debasish1996/BLOC-UI/issues"},"dist":{"shasum":"a49e9476ae24bc7f11b725d3d0130010cde320d1","tarball":"https://registry.npmjs.org/@bloc-ui/autocomplete/-/autocomplete-1.0.6.tgz","fileCount":5,"integrity":"sha512-2yheDpF7qo2gXfQj7nrqE1XAeXhHHHuSHSi7nhFjCZXCFzxdwdURVq/vgv5V3bTEHXrxxQQTlK8x3hme5x1h1w==","signatures":[{"sig":"MEQCIFAABlau4DMqOWJO/u7YMOnLHTtdZeNkuNj5Jkhb2HceAiBO1SeygfezzXkgx0GmtJxDsSzj2FxRaYfD9n/4j7aqMg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@bloc-ui%2fautocomplete@1.0.6","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":121946},"module":"fesm2022/bloc-ui-autocomplete.mjs","exports":{".":{"types":"./types/bloc-ui-autocomplete.d.ts","default":"./fesm2022/bloc-ui-autocomplete.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"12d845eea23e9b1e95056f71e03717505203131b","typings":"types/bloc-ui-autocomplete.d.ts","_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:1087c929-4fa9-45ba-9f2a-247c4b9a9bc9"}},"repository":{"url":"git+https://github.com/debasish1996/BLOC-UI.git","type":"git","directory":"projects/bloc-ui-autocomplete"},"_npmVersion":"11.11.0","description":"> **Latest:** v1.0.6","directories":{},"sideEffects":false,"_nodeVersion":"24.14.1","dependencies":{"tslib":"^2.3.0","@bloc-ui/overlay":"^1.0.4","@bloc-ui/text-highlight":"^1.0.2"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.2.0","@angular/forms":"^21.2.0","@angular/common":"^21.2.0"},"_npmOperationalInternal":{"tmp":"tmp/autocomplete_1.0.6_1775897897117_0.48466616473436264","host":"s3://npm-registry-packages-npm-production"}},"1.0.8":{"name":"@bloc-ui/autocomplete","version":"1.0.8","keywords":["angular","angular-components","component-library","autocomplete","combobox","search","select","forms","accessible","standalone-components","bloc-ui"],"author":{"name":"Bloc Verse"},"license":"MIT","_id":"@bloc-ui/autocomplete@1.0.8","maintainers":[{"name":"bloc_ui","email":"debasishsahoo444@gmail.com"}],"homepage":"https://ui.bloc-verse.com","bugs":{"url":"https://github.com/debasish1996/BLOC-UI/issues"},"dist":{"shasum":"24ea767ce0e4607a1f629ebb7c97ebb82b822837","tarball":"https://registry.npmjs.org/@bloc-ui/autocomplete/-/autocomplete-1.0.8.tgz","fileCount":5,"integrity":"sha512-4TTmRVces9VfNzvPWNtc4CzXJXrjX/IdUdP5QCscxOuURkuJh5q5aKXDioRUef7+LiuGMPmikpahJ9/KotudnQ==","signatures":[{"sig":"MEUCIQDo3SY7AV7oGNDVJJBMFozv5lOQ/HVMXD6mIcnyB+tjygIgDu3DYCT7KsR4Z0jy1f57mJQ/NVsX4JQADGsBq4mX0TE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@bloc-ui%2fautocomplete@1.0.8","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":122556},"module":"fesm2022/bloc-ui-autocomplete.mjs","exports":{".":{"types":"./types/bloc-ui-autocomplete.d.ts","default":"./fesm2022/bloc-ui-autocomplete.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"8345ba53a6062d6dd5bb1cf67f6852e62a0799c1","typings":"types/bloc-ui-autocomplete.d.ts","_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:1087c929-4fa9-45ba-9f2a-247c4b9a9bc9"}},"repository":{"url":"git+https://github.com/debasish1996/BLOC-UI.git","type":"git","directory":"projects/bloc-ui-autocomplete"},"_npmVersion":"11.11.0","description":"Searchable single-select autocomplete for Angular with async-friendly option list, custom filterFn, and forms integration.","directories":{},"sideEffects":false,"_nodeVersion":"24.14.1","dependencies":{"tslib":"^2.3.0","@bloc-ui/overlay":"^1.0.6","@bloc-ui/text-highlight":"^1.0.4"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.2.0","@angular/forms":"^21.2.0","@angular/common":"^21.2.0"},"_npmOperationalInternal":{"tmp":"tmp/autocomplete_1.0.8_1775918384891_0.9462464498351804","host":"s3://npm-registry-packages-npm-production"}},"1.0.9":{"name":"@bloc-ui/autocomplete","version":"1.0.9","description":"Searchable single-select autocomplete for Angular with async-friendly option list, custom filterFn, and forms integration.","keywords":["angular","angular-components","component-library","autocomplete","combobox","search","select","forms","accessible","standalone-components","bloc-ui"],"license":"MIT","author":{"name":"Bloc Verse"},"homepage":"https://ui.bloc-verse.com","bugs":{"url":"https://github.com/debasish1996/BLOC-UI/issues"},"repository":{"type":"git","url":"git+https://github.com/debasish1996/BLOC-UI.git","directory":"projects/bloc-ui-autocomplete"},"peerDependencies":{"@angular/common":"^21.2.0","@angular/core":"^21.2.0","@angular/forms":"^21.2.0"},"dependencies":{"@bloc-ui/text-highlight":"^1.0.5","@bloc-ui/overlay":"^1.0.7","tslib":"^2.3.0"},"sideEffects":false,"module":"fesm2022/bloc-ui-autocomplete.mjs","typings":"types/bloc-ui-autocomplete.d.ts","exports":{"./package.json":{"default":"./package.json"},".":{"types":"./types/bloc-ui-autocomplete.d.ts","default":"./fesm2022/bloc-ui-autocomplete.mjs"}},"gitHead":"abe1c2a9145e5a2a042a16ed2d52f35a653154dc","_id":"@bloc-ui/autocomplete@1.0.9","_nodeVersion":"24.14.1","_npmVersion":"11.11.0","dist":{"integrity":"sha512-XLyJ2i7oQdzB/dKT6HOlH5mEP2Bq12FXu2auyKmWS797iwqSaEU5NdQ0HuuBD66bIN2uuLT/+4QO0tNGUwPZwg==","shasum":"0118b1d70611d75c6faef19f622805a47d72b26f","tarball":"https://registry.npmjs.org/@bloc-ui/autocomplete/-/autocomplete-1.0.9.tgz","fileCount":5,"unpackedSize":123574,"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@bloc-ui%2fautocomplete@1.0.9","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQD4n6/TYwf0DLWOdJ1w//Di8QdEPfVYEfJQ2Ctpdct+kgIhALnyOkT3JxUvwF2Xu0pDHLCfdmDsAkMF3U8JgorLCjeC"}]},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:1087c929-4fa9-45ba-9f2a-247c4b9a9bc9"}},"directories":{},"maintainers":[{"name":"bloc_ui","email":"debasishsahoo444@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/autocomplete_1.0.9_1776135143464_0.05364231691668464"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-02T16:45:09.691Z","modified":"2026-04-14T02:52:23.942Z","0.0.1":"2026-04-02T16:45:09.951Z","1.0.0":"2026-04-06T05:04:03.238Z","1.0.2":"2026-04-07T08:49:49.840Z","1.0.6":"2026-04-11T08:58:17.258Z","1.0.8":"2026-04-11T14:39:45.030Z","1.0.9":"2026-04-14T02:52:23.624Z"},"bugs":{"url":"https://github.com/debasish1996/BLOC-UI/issues"},"author":{"name":"Bloc Verse"},"license":"MIT","homepage":"https://ui.bloc-verse.com","keywords":["angular","angular-components","component-library","autocomplete","combobox","search","select","forms","accessible","standalone-components","bloc-ui"],"repository":{"type":"git","url":"git+https://github.com/debasish1996/BLOC-UI.git","directory":"projects/bloc-ui-autocomplete"},"description":"Searchable single-select autocomplete for Angular with async-friendly option list, custom filterFn, and forms integration.","maintainers":[{"name":"bloc_ui","email":"debasishsahoo444@gmail.com"}],"readme":"# @bloc-ui/autocomplete\r\n\r\n> **Latest:** v1.0.9\r\n\r\nSearchable single-select autocomplete for Angular forms. Renders a text input that filters a provided option list, supports keyboard navigation, disabled options, reactive forms integration, and a clearable mode.\r\n\r\n**[Live Documentation & Demos](https://ui.bloc-verse.com/autocomplete)**\r\n\r\n---\r\n\r\n## Installation\r\n\r\n```bash\r\nnpm install @bloc-ui/autocomplete\r\n```\r\n\r\n**Peer dependencies:** `@angular/common`, `@angular/core`, and `@angular/forms` ≥ 21.\r\n\r\n---\r\n\r\n## Selectors / API\r\n\r\n| Export                      | Selector            | Type      | Description                                 |\r\n| --------------------------- | ------------------- | --------- | ------------------------------------------- |\r\n| `BlocAutocompleteComponent` | `bloc-autocomplete` | Component | Searchable select with floating option list |\r\n\r\n---\r\n\r\n## Usage\r\n\r\n### Basic\r\n\r\n```ts\r\nimport { BlocAutocompleteComponent, BlocAutocompleteOption } from '@bloc-ui/autocomplete';\r\n\r\nreadonly teamOptions: readonly BlocAutocompleteOption<string>[] = [\r\n  { label: 'Design',      value: 'design'      },\r\n  { label: 'Engineering', value: 'engineering' },\r\n  { label: 'Growth',      value: 'growth'      },\r\n];\r\n```\r\n\r\n```html\r\n<bloc-autocomplete\r\n    [options]=\"teamOptions\"\r\n    [clearable]=\"true\"\r\n    placeholder=\"Search teams\"\r\n    (selectionChange)=\"selectedTeam = $event\"\r\n></bloc-autocomplete>\r\n```\r\n\r\n### With Angular reactive forms\r\n\r\n```ts\r\nimport { FormControl } from '@angular/forms';\r\n\r\nreadonly teamControl = new FormControl<string | null>('design');\r\n```\r\n\r\n```html\r\n<bloc-autocomplete\r\n    [options]=\"teamOptions\"\r\n    [formControl]=\"teamControl\"\r\n    placeholder=\"Assign owner\"\r\n></bloc-autocomplete>\r\n```\r\n\r\n### Options with descriptions and disabled state\r\n\r\n```ts\r\nreadonly teamOptions: readonly BlocAutocompleteOption<string>[] = [\r\n  { label: 'Design',      value: 'design',      description: 'Brand, motion, and UI systems' },\r\n  { label: 'Engineering', value: 'engineering', description: 'Frontend and platform' },\r\n  { label: 'Operations',  value: 'ops',         description: 'Disabled for this flow', disabled: true },\r\n];\r\n```\r\n\r\n---\r\n\r\n## Inputs — `BlocAutocompleteComponent`\r\n\r\n| Input         | Type                                                        | Default                | Description                                                             |\r\n| ------------- | ----------------------------------------------------------- | ---------------------- | ----------------------------------------------------------------------- |\r\n| `options`     | `BlocAutocompleteOption<T>[]`                               | `[]`                   | List of options to display and filter                                   |\r\n| `placeholder` | `string`                                                    | `'Search options'`     | Placeholder text in the search input                                    |\r\n| `clearable`   | `boolean`                                                   | `false`                | Shows a clear (×) button to reset the selection                         |\r\n| `disabled`    | `boolean`                                                   | `false`                | Disables the control                                                    |\r\n| `loading`     | `boolean`                                                   | `false`                | Replaces the option list with `loadingText`                             |\r\n| `loadingText` | `string`                                                    | `'Loading options...'` | Message shown while `loading` is true                                   |\r\n| `emptyText`   | `string`                                                    | `'No results found'`   | Message shown when the filtered list is empty                           |\r\n| `filterFn`    | `((options, query) => BlocAutocompleteOption<T>[]) \\| null` | `null`                 | Custom filter function; overrides built-in substring and fuzzy matching |\r\n| `error`       | `boolean`                                                   | `false`                | Forces the error state regardless of form control validity              |\r\n\r\n## Outputs\r\n\r\n| Output            | Type        | Description                                          |\r\n| ----------------- | ----------- | ---------------------------------------------------- |\r\n| `selectionChange` | `T \\| null` | Emits the selected option value (or `null` on clear) |\r\n\r\n## `BlocAutocompleteOption<T>`\r\n\r\n```ts\r\ninterface BlocAutocompleteOption<T> {\r\n    label: string;\r\n    value: T;\r\n    description?: string;\r\n    disabled?: boolean;\r\n}\r\n```\r\n\r\n---\r\n\r\n## CSS Custom Properties\r\n\r\nAll visual properties are token-driven. Override any token on the `bloc-autocomplete` element.\r\n\r\n| Token                                 | Default                        | Description                                     |\r\n| ------------------------------------- | ------------------------------ | ----------------------------------------------- |\r\n| `--bloc-autocomplete-bg`              | `var(--bloc-surface, #ffffff)` | Input and panel background                      |\r\n| `--bloc-autocomplete-border`          | `var(--bloc-border, #d1d5db)`  | Default border colour                           |\r\n| `--bloc-autocomplete-border-focus`    | `var(--bloc-primary, #6b7280)` | Border colour when input is focused             |\r\n| `--bloc-autocomplete-color`           | `var(--bloc-text, #374151)`    | Text colour                                     |\r\n| `--bloc-autocomplete-muted`           | `var(--bloc-muted, #9ca3af)`   | Muted text (descriptions, empty state, clear ×) |\r\n| `--bloc-autocomplete-radius`          | `4px`                          | Border radius for input, panel, and options     |\r\n| `--bloc-autocomplete-panel-radius`    | inherits `radius`              | Override panel border radius independently      |\r\n| `--bloc-autocomplete-panel-shadow`    | `0 4px 16px rgba(0,0,0,0.08)`  | Drop shadow on the floating panel               |\r\n| `--bloc-autocomplete-option-hover`    | `rgba(0, 0, 0, 0.04)`          | Option background on hover                      |\r\n| `--bloc-autocomplete-option-active`   | `rgba(0, 0, 0, 0.06)`          | Option background when keyboard-active          |\r\n| `--bloc-autocomplete-option-selected` | `rgba(0, 0, 0, 0.08)`          | Option background when selected                 |\r\n","readmeFilename":"README.md"}