@xui/tag-input 2.0.0-alpha.16 → 2.0.0-alpha.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/fesm2022/xui-tag-input.mjs +14 -33
- package/fesm2022/xui-tag-input.mjs.map +1 -1
- package/package.json +3 -5
- package/types/xui-tag-input.d.ts +4 -0
package/README.md
CHANGED
|
@@ -127,7 +127,7 @@ The full token reference, rendered in both themes, is the **Design tokens** page
|
|
|
127
127
|
|
|
128
128
|
**Date & time** — [`@xui/date-input`](https://www.npmjs.com/package/@xui/date-input) · [`@xui/date-picker`](https://www.npmjs.com/package/@xui/date-picker) · [`@xui/date-range-input`](https://www.npmjs.com/package/@xui/date-range-input) · [`@xui/date-range-picker`](https://www.npmjs.com/package/@xui/date-range-picker) · [`@xui/time-picker`](https://www.npmjs.com/package/@xui/time-picker) · [`@xui/timezone-select`](https://www.npmjs.com/package/@xui/timezone-select)
|
|
129
129
|
|
|
130
|
-
**Data display** — [`@xui/avatar`](https://www.npmjs.com/package/@xui/avatar) · [`@xui/
|
|
130
|
+
**Data display** — [`@xui/avatar`](https://www.npmjs.com/package/@xui/avatar) · [`@xui/card`](https://www.npmjs.com/package/@xui/card) · [`@xui/card-list`](https://www.npmjs.com/package/@xui/card-list) · [`@xui/carousel`](https://www.npmjs.com/package/@xui/carousel) · [`@xui/data-table`](https://www.npmjs.com/package/@xui/data-table) · [`@xui/descriptions`](https://www.npmjs.com/package/@xui/descriptions) · [`@xui/entity-title`](https://www.npmjs.com/package/@xui/entity-title) · [`@xui/kbd`](https://www.npmjs.com/package/@xui/kbd) · [`@xui/statistic`](https://www.npmjs.com/package/@xui/statistic) · [`@xui/status`](https://www.npmjs.com/package/@xui/status) · [`@xui/table`](https://www.npmjs.com/package/@xui/table) · [`@xui/tag`](https://www.npmjs.com/package/@xui/tag) · [`@xui/timeline`](https://www.npmjs.com/package/@xui/timeline) · [`@xui/tree`](https://www.npmjs.com/package/@xui/tree)
|
|
131
131
|
|
|
132
132
|
**Navigation** — [`@xui/breadcrumb`](https://www.npmjs.com/package/@xui/breadcrumb) · [`@xui/menubar`](https://www.npmjs.com/package/@xui/menubar) · [`@xui/navbar`](https://www.npmjs.com/package/@xui/navbar) · [`@xui/navigation-menu`](https://www.npmjs.com/package/@xui/navigation-menu) · [`@xui/pagination`](https://www.npmjs.com/package/@xui/pagination) · [`@xui/panel-stack`](https://www.npmjs.com/package/@xui/panel-stack) · [`@xui/steps`](https://www.npmjs.com/package/@xui/steps) · [`@xui/tabs`](https://www.npmjs.com/package/@xui/tabs)
|
|
133
133
|
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { input, model, booleanAttribute, output, signal, viewChild, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
|
-
import { provideIcons, NgIcon } from '@ng-icons/core';
|
|
4
|
-
import { matCloseRound } from '@ng-icons/material-icons/round';
|
|
5
3
|
import { xui } from '@xui/core';
|
|
6
4
|
import { createXValueAccessor, provideXValueAccessor } from '@xui/core/forms';
|
|
7
|
-
import {
|
|
5
|
+
import { XuiTag } from '@xui/tag';
|
|
8
6
|
import { cva } from 'class-variance-authority';
|
|
9
7
|
|
|
10
8
|
const tagInputContainerVariants = cva([
|
|
@@ -21,6 +19,10 @@ const tagInputContainerVariants = cva([
|
|
|
21
19
|
* A token/chip input: type and press Enter (or the separator) to add a tag, click
|
|
22
20
|
* a tag's ✕ or press Backspace on an empty field to remove one. `[(values)]`
|
|
23
21
|
* two-way binding and `ControlValueAccessor` over a `string[]`.
|
|
22
|
+
*
|
|
23
|
+
* The tokens are real `xui-tag`s rather than a look-alike, so they cannot drift from what a tag
|
|
24
|
+
* looks like. `minimal` is the variant that carries a border, which is what marks a chip out
|
|
25
|
+
* against the filled field it sits in.
|
|
24
26
|
*/
|
|
25
27
|
class XuiTagInput {
|
|
26
28
|
class = input('', /* @ts-ignore */
|
|
@@ -152,19 +154,9 @@ class XuiTagInput {
|
|
|
152
154
|
<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->
|
|
153
155
|
<div [class]="containerClass()" (click)="focusInput($event)">
|
|
154
156
|
@for (tag of values(); track $index) {
|
|
155
|
-
<
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
<button
|
|
159
|
-
type="button"
|
|
160
|
-
class="text-foreground-muted hover:text-foreground -me-0.5 flex items-center"
|
|
161
|
-
[attr.aria-label]="'Remove ' + tag"
|
|
162
|
-
(click)="removeAt($index); $event.stopPropagation()"
|
|
163
|
-
>
|
|
164
|
-
<ng-icon xui size="xs" name="matCloseRound" />
|
|
165
|
-
</button>
|
|
166
|
-
}
|
|
167
|
-
</span>
|
|
157
|
+
<xui-tag minimal [removable]="!isDisabled()" [removeLabel]="'Remove ' + tag" (removed)="removeAt($index)">{{
|
|
158
|
+
tag
|
|
159
|
+
}}</xui-tag>
|
|
168
160
|
}
|
|
169
161
|
|
|
170
162
|
<input
|
|
@@ -180,32 +172,22 @@ class XuiTagInput {
|
|
|
180
172
|
(blur)="onBlur()"
|
|
181
173
|
/>
|
|
182
174
|
</div>
|
|
183
|
-
`, isInline: true, dependencies: [{ kind: "component", type:
|
|
175
|
+
`, isInline: true, dependencies: [{ kind: "component", type: XuiTag, selector: "xui-tag", inputs: ["class", "color", "minimal", "large", "round", "fill", "interactive", "removable", "removeLabel", "icon"], outputs: ["removed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
184
176
|
}
|
|
185
177
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: XuiTagInput, decorators: [{
|
|
186
178
|
type: Component,
|
|
187
179
|
args: [{
|
|
188
180
|
selector: 'xui-tag-input',
|
|
189
|
-
imports: [
|
|
181
|
+
imports: [XuiTag],
|
|
190
182
|
template: `
|
|
191
183
|
<!-- Clicking empty container space focuses the real input, which is itself
|
|
192
184
|
focusable and keyboard-operable, so no separate key handler is needed. -->
|
|
193
185
|
<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->
|
|
194
186
|
<div [class]="containerClass()" (click)="focusInput($event)">
|
|
195
187
|
@for (tag of values(); track $index) {
|
|
196
|
-
<
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
<button
|
|
200
|
-
type="button"
|
|
201
|
-
class="text-foreground-muted hover:text-foreground -me-0.5 flex items-center"
|
|
202
|
-
[attr.aria-label]="'Remove ' + tag"
|
|
203
|
-
(click)="removeAt($index); $event.stopPropagation()"
|
|
204
|
-
>
|
|
205
|
-
<ng-icon xui size="xs" name="matCloseRound" />
|
|
206
|
-
</button>
|
|
207
|
-
}
|
|
208
|
-
</span>
|
|
188
|
+
<xui-tag minimal [removable]="!isDisabled()" [removeLabel]="'Remove ' + tag" (removed)="removeAt($index)">{{
|
|
189
|
+
tag
|
|
190
|
+
}}</xui-tag>
|
|
209
191
|
}
|
|
210
192
|
|
|
211
193
|
<input
|
|
@@ -228,8 +210,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
228
210
|
},
|
|
229
211
|
providers: [provideXValueAccessor((() => XuiTagInput))],
|
|
230
212
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
231
|
-
encapsulation: ViewEncapsulation.None
|
|
232
|
-
viewProviders: [provideIcons({ matCloseRound })]
|
|
213
|
+
encapsulation: ViewEncapsulation.None
|
|
233
214
|
}]
|
|
234
215
|
}], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], values: [{ type: i0.Input, args: [{ isSignal: true, alias: "values", required: false }] }, { type: i0.Output, args: ["valuesChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }], addOnBlur: [{ type: i0.Input, args: [{ isSignal: true, alias: "addOnBlur", required: false }] }], addOnPaste: [{ type: i0.Input, args: [{ isSignal: true, alias: "addOnPaste", required: false }] }], allowDuplicates: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowDuplicates", required: false }] }], added: [{ type: i0.Output, args: ["added"] }], removed: [{ type: i0.Output, args: ["removed"] }], field: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }] } });
|
|
235
216
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"xui-tag-input.mjs","sources":["../../../../../../libs/ui/tag-input/xui/src/lib/tag-input.ts","../../../../../../libs/ui/tag-input/xui/src/index.ts","../../../../../../libs/ui/tag-input/xui/src/xui-tag-input.ts"],"sourcesContent":["import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n ElementRef,\n input,\n model,\n output,\n signal,\n viewChild,\n ViewEncapsulation\n} from '@angular/core';\nimport { ControlValueAccessor } from '@angular/forms';\nimport { NgIcon, provideIcons } from '@ng-icons/core';\nimport { matCloseRound } from '@ng-icons/material-icons/round';\nimport { xui } from '@xui/core';\nimport { createXValueAccessor, provideXValueAccessor } from '@xui/core/forms';\nimport { XuiIcon } from '@xui/icon';\nimport { cva, VariantProps } from 'class-variance-authority';\nimport type { ClassValue } from 'clsx';\n\nexport const tagInputContainerVariants = cva(\n [\n 'flex min-h-(--control-height-md) flex-wrap items-center gap-1.5 rounded-lg border border-border bg-surface-inset px-(--control-padding-sm) py-0.5 text-sm',\n 'focus-within:border-focus transition-colors',\n 'data-disabled:cursor-not-allowed data-disabled:opacity-50'\n ],\n {\n variants: {\n fill: { true: 'w-full', false: 'min-w-72' }\n },\n defaultVariants: { fill: false }\n }\n);\n\nexport type XuiTagInputVariants = VariantProps<typeof tagInputContainerVariants>;\n\n/**\n * A token/chip input: type and press Enter (or the separator) to add a tag, click\n * a tag's ✕ or press Backspace on an empty field to remove one. `[(values)]`\n * two-way binding and `ControlValueAccessor` over a `string[]`.\n */\n@Component({\n selector: 'xui-tag-input',\n imports: [NgIcon, XuiIcon],\n template: `\n <!-- Clicking empty container space focuses the real input, which is itself\n focusable and keyboard-operable, so no separate key handler is needed. -->\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n <div [class]=\"containerClass()\" (click)=\"focusInput($event)\">\n @for (tag of values(); track $index) {\n <span class=\"bg-surface-raised text-foreground inline-flex items-center gap-1 rounded px-2 py-0.5\">\n {{ tag }}\n @if (!isDisabled()) {\n <button\n type=\"button\"\n class=\"text-foreground-muted hover:text-foreground -me-0.5 flex items-center\"\n [attr.aria-label]=\"'Remove ' + tag\"\n (click)=\"removeAt($index); $event.stopPropagation()\"\n >\n <ng-icon xui size=\"xs\" name=\"matCloseRound\" />\n </button>\n }\n </span>\n }\n\n <input\n #field\n type=\"text\"\n class=\"text-foreground placeholder:text-foreground-subtle min-w-24 flex-1 bg-transparent outline-none\"\n [value]=\"draft()\"\n [placeholder]=\"values().length ? '' : placeholder()\"\n [disabled]=\"isDisabled()\"\n (input)=\"onInput($event)\"\n (keydown)=\"onKeydown($event)\"\n (paste)=\"onPaste($event)\"\n (blur)=\"onBlur()\"\n />\n </div>\n `,\n host: {\n '[class]': 'computedClass()',\n '[attr.data-disabled]': 'isDisabled() ? \"\" : null'\n },\n providers: [provideXValueAccessor(() => XuiTagInput)],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n viewProviders: [provideIcons({ matCloseRound })]\n})\nexport class XuiTagInput implements ControlValueAccessor {\n readonly class = input<ClassValue>('');\n\n /** The current tags. Two-way bindable with `[(values)]`. */\n readonly values = model<string[]>([]);\n\n readonly placeholder = input<string>('');\n readonly fill = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n readonly disabled = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n /** Character that also commits the current draft (besides Enter). */\n readonly separator = input<string>(',');\n\n /** Commit the draft when the field loses focus. */\n readonly addOnBlur = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n /** Split pasted text on the separator and add each piece. */\n readonly addOnPaste = input<boolean, BooleanInput>(true, { transform: booleanAttribute });\n\n /** Reject a tag that already exists. */\n readonly allowDuplicates = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n /** Emits each tag as it is added. */\n readonly added = output<string>();\n /** Emits each tag as it is removed. */\n readonly removed = output<string>();\n\n protected readonly draft = signal('');\n private readonly field = viewChild<ElementRef<HTMLInputElement>>('field');\n\n protected readonly cva = createXValueAccessor<string[]>({\n onWrite: value => this.values.set(value ?? []),\n disabled: this.disabled\n });\n protected readonly isDisabled = this.cva.disabled;\n\n protected readonly computedClass = computed(() => xui('block', this.class()));\n protected readonly containerClass = computed(() => xui(tagInputContainerVariants({ fill: this.fill() })));\n\n protected onInput(event: Event): void {\n this.draft.set((event.target as HTMLInputElement).value);\n }\n\n protected onKeydown(event: KeyboardEvent): void {\n if (event.key === 'Enter' || event.key === this.separator()) {\n event.preventDefault();\n this.commitDraft();\n return;\n }\n\n // Backspace on an empty field trims the last tag.\n if (event.key === 'Backspace' && this.draft() === '' && this.values().length) {\n event.preventDefault();\n this.removeAt(this.values().length - 1);\n }\n }\n\n protected onPaste(event: ClipboardEvent): void {\n if (!this.addOnPaste()) {\n return;\n }\n\n const text = event.clipboardData?.getData('text') ?? '';\n if (text.includes(this.separator())) {\n event.preventDefault();\n this.addTokens(text);\n this.draft.set('');\n }\n }\n\n protected onBlur(): void {\n if (this.addOnBlur()) {\n this.commitDraft();\n }\n\n this.cva.markTouched();\n }\n\n protected focusInput(event: MouseEvent): void {\n // Clicking the container (but not a tag's button) focuses the field.\n if (this.isDisabled()) {\n return;\n }\n\n (event.currentTarget as HTMLElement).querySelector('input')?.focus();\n }\n\n private commitDraft(): void {\n this.addTokens(this.draft());\n this.draft.set('');\n // Clear the native field directly too: if the draft round-tripped within a\n // single change-detection pass, the `[value]` binding may not diff as changed.\n const el = this.field()?.nativeElement;\n if (el) {\n el.value = '';\n }\n }\n\n private addTokens(raw: string): void {\n const tokens = raw\n .split(this.separator())\n .map(t => t.trim())\n .filter(Boolean);\n if (!tokens.length) {\n return;\n }\n\n const next = [...this.values()];\n for (const token of tokens) {\n if (!this.allowDuplicates() && next.includes(token)) {\n continue;\n }\n\n next.push(token);\n this.added.emit(token);\n }\n\n if (next.length !== this.values().length) {\n this.commit(next);\n }\n }\n\n protected removeAt(index: number): void {\n if (this.isDisabled()) {\n return;\n }\n\n const tag = this.values()[index];\n const next = this.values().filter((_, i) => i !== index);\n this.commit(next);\n this.removed.emit(tag);\n }\n\n private commit(next: string[]): void {\n this.values.set(next);\n this.cva.notifyChange(next);\n }\n\n // --- ControlValueAccessor ---\n readonly writeValue = this.cva.writeValue;\n readonly registerOnChange = this.cva.registerOnChange;\n readonly registerOnTouched = this.cva.registerOnTouched;\n readonly setDisabledState = this.cva.setDisabledState;\n}\n","import { XuiTagInput } from './lib/tag-input';\n\nexport * from './lib/tag-input';\n\nexport const XuiTagInputImports = [XuiTagInput] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"xui-tag-input.mjs","sources":["../../../../../../libs/ui/tag-input/xui/src/lib/tag-input.ts","../../../../../../libs/ui/tag-input/xui/src/index.ts","../../../../../../libs/ui/tag-input/xui/src/xui-tag-input.ts"],"sourcesContent":["import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n ElementRef,\n input,\n model,\n output,\n signal,\n viewChild,\n ViewEncapsulation\n} from '@angular/core';\nimport { ControlValueAccessor } from '@angular/forms';\nimport { xui } from '@xui/core';\nimport { createXValueAccessor, provideXValueAccessor } from '@xui/core/forms';\nimport { XuiTag } from '@xui/tag';\nimport { cva, VariantProps } from 'class-variance-authority';\nimport type { ClassValue } from 'clsx';\n\nexport const tagInputContainerVariants = cva(\n [\n 'flex min-h-(--control-height-md) flex-wrap items-center gap-1.5 rounded-lg border border-border bg-surface-inset px-(--control-padding-sm) py-0.5 text-sm',\n 'focus-within:border-focus transition-colors',\n 'data-disabled:cursor-not-allowed data-disabled:opacity-50'\n ],\n {\n variants: {\n fill: { true: 'w-full', false: 'min-w-72' }\n },\n defaultVariants: { fill: false }\n }\n);\n\nexport type XuiTagInputVariants = VariantProps<typeof tagInputContainerVariants>;\n\n/**\n * A token/chip input: type and press Enter (or the separator) to add a tag, click\n * a tag's ✕ or press Backspace on an empty field to remove one. `[(values)]`\n * two-way binding and `ControlValueAccessor` over a `string[]`.\n *\n * The tokens are real `xui-tag`s rather than a look-alike, so they cannot drift from what a tag\n * looks like. `minimal` is the variant that carries a border, which is what marks a chip out\n * against the filled field it sits in.\n */\n@Component({\n selector: 'xui-tag-input',\n imports: [XuiTag],\n template: `\n <!-- Clicking empty container space focuses the real input, which is itself\n focusable and keyboard-operable, so no separate key handler is needed. -->\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n <div [class]=\"containerClass()\" (click)=\"focusInput($event)\">\n @for (tag of values(); track $index) {\n <xui-tag minimal [removable]=\"!isDisabled()\" [removeLabel]=\"'Remove ' + tag\" (removed)=\"removeAt($index)\">{{\n tag\n }}</xui-tag>\n }\n\n <input\n #field\n type=\"text\"\n class=\"text-foreground placeholder:text-foreground-subtle min-w-24 flex-1 bg-transparent outline-none\"\n [value]=\"draft()\"\n [placeholder]=\"values().length ? '' : placeholder()\"\n [disabled]=\"isDisabled()\"\n (input)=\"onInput($event)\"\n (keydown)=\"onKeydown($event)\"\n (paste)=\"onPaste($event)\"\n (blur)=\"onBlur()\"\n />\n </div>\n `,\n host: {\n '[class]': 'computedClass()',\n '[attr.data-disabled]': 'isDisabled() ? \"\" : null'\n },\n providers: [provideXValueAccessor(() => XuiTagInput)],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None\n})\nexport class XuiTagInput implements ControlValueAccessor {\n readonly class = input<ClassValue>('');\n\n /** The current tags. Two-way bindable with `[(values)]`. */\n readonly values = model<string[]>([]);\n\n readonly placeholder = input<string>('');\n readonly fill = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n readonly disabled = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n /** Character that also commits the current draft (besides Enter). */\n readonly separator = input<string>(',');\n\n /** Commit the draft when the field loses focus. */\n readonly addOnBlur = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n /** Split pasted text on the separator and add each piece. */\n readonly addOnPaste = input<boolean, BooleanInput>(true, { transform: booleanAttribute });\n\n /** Reject a tag that already exists. */\n readonly allowDuplicates = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n /** Emits each tag as it is added. */\n readonly added = output<string>();\n /** Emits each tag as it is removed. */\n readonly removed = output<string>();\n\n protected readonly draft = signal('');\n private readonly field = viewChild<ElementRef<HTMLInputElement>>('field');\n\n protected readonly cva = createXValueAccessor<string[]>({\n onWrite: value => this.values.set(value ?? []),\n disabled: this.disabled\n });\n protected readonly isDisabled = this.cva.disabled;\n\n protected readonly computedClass = computed(() => xui('block', this.class()));\n protected readonly containerClass = computed(() => xui(tagInputContainerVariants({ fill: this.fill() })));\n\n protected onInput(event: Event): void {\n this.draft.set((event.target as HTMLInputElement).value);\n }\n\n protected onKeydown(event: KeyboardEvent): void {\n if (event.key === 'Enter' || event.key === this.separator()) {\n event.preventDefault();\n this.commitDraft();\n return;\n }\n\n // Backspace on an empty field trims the last tag.\n if (event.key === 'Backspace' && this.draft() === '' && this.values().length) {\n event.preventDefault();\n this.removeAt(this.values().length - 1);\n }\n }\n\n protected onPaste(event: ClipboardEvent): void {\n if (!this.addOnPaste()) {\n return;\n }\n\n const text = event.clipboardData?.getData('text') ?? '';\n if (text.includes(this.separator())) {\n event.preventDefault();\n this.addTokens(text);\n this.draft.set('');\n }\n }\n\n protected onBlur(): void {\n if (this.addOnBlur()) {\n this.commitDraft();\n }\n\n this.cva.markTouched();\n }\n\n protected focusInput(event: MouseEvent): void {\n // Clicking the container (but not a tag's button) focuses the field.\n if (this.isDisabled()) {\n return;\n }\n\n (event.currentTarget as HTMLElement).querySelector('input')?.focus();\n }\n\n private commitDraft(): void {\n this.addTokens(this.draft());\n this.draft.set('');\n // Clear the native field directly too: if the draft round-tripped within a\n // single change-detection pass, the `[value]` binding may not diff as changed.\n const el = this.field()?.nativeElement;\n if (el) {\n el.value = '';\n }\n }\n\n private addTokens(raw: string): void {\n const tokens = raw\n .split(this.separator())\n .map(t => t.trim())\n .filter(Boolean);\n if (!tokens.length) {\n return;\n }\n\n const next = [...this.values()];\n for (const token of tokens) {\n if (!this.allowDuplicates() && next.includes(token)) {\n continue;\n }\n\n next.push(token);\n this.added.emit(token);\n }\n\n if (next.length !== this.values().length) {\n this.commit(next);\n }\n }\n\n protected removeAt(index: number): void {\n if (this.isDisabled()) {\n return;\n }\n\n const tag = this.values()[index];\n const next = this.values().filter((_, i) => i !== index);\n this.commit(next);\n this.removed.emit(tag);\n }\n\n private commit(next: string[]): void {\n this.values.set(next);\n this.cva.notifyChange(next);\n }\n\n // --- ControlValueAccessor ---\n readonly writeValue = this.cva.writeValue;\n readonly registerOnChange = this.cva.registerOnChange;\n readonly registerOnTouched = this.cva.registerOnTouched;\n readonly setDisabledState = this.cva.setDisabledState;\n}\n","import { XuiTagInput } from './lib/tag-input';\n\nexport * from './lib/tag-input';\n\nexport const XuiTagInputImports = [XuiTagInput] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xui/tag-input",
|
|
3
|
-
"version": "2.0.0-alpha.
|
|
3
|
+
"version": "2.0.0-alpha.17",
|
|
4
4
|
"description": "Modern Angular 22 UI Library based on TailwindCSS",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"angular",
|
|
@@ -39,10 +39,8 @@
|
|
|
39
39
|
"@angular/cdk": "22",
|
|
40
40
|
"@angular/core": "22",
|
|
41
41
|
"@angular/forms": "22",
|
|
42
|
-
"@
|
|
43
|
-
"@
|
|
44
|
-
"@xui/core": "2.0.0-alpha.16",
|
|
45
|
-
"@xui/icon": "2.0.0-alpha.16",
|
|
42
|
+
"@xui/core": "2.0.0-alpha.17",
|
|
43
|
+
"@xui/tag": "2.0.0-alpha.17",
|
|
46
44
|
"class-variance-authority": "^0.7.1",
|
|
47
45
|
"clsx": "^2.1.1"
|
|
48
46
|
},
|
package/types/xui-tag-input.d.ts
CHANGED
|
@@ -14,6 +14,10 @@ type XuiTagInputVariants = VariantProps<typeof tagInputContainerVariants>;
|
|
|
14
14
|
* A token/chip input: type and press Enter (or the separator) to add a tag, click
|
|
15
15
|
* a tag's ✕ or press Backspace on an empty field to remove one. `[(values)]`
|
|
16
16
|
* two-way binding and `ControlValueAccessor` over a `string[]`.
|
|
17
|
+
*
|
|
18
|
+
* The tokens are real `xui-tag`s rather than a look-alike, so they cannot drift from what a tag
|
|
19
|
+
* looks like. `minimal` is the variant that carries a border, which is what marks a chip out
|
|
20
|
+
* against the filled field it sits in.
|
|
17
21
|
*/
|
|
18
22
|
declare class XuiTagInput implements ControlValueAccessor {
|
|
19
23
|
readonly class: _angular_core.InputSignal<ClassValue>;
|