From f7514ec804a783608fbfff5b4376b1abcb1b18eb Mon Sep 17 00:00:00 2001 From: Vicki League Date: Fri, 3 May 2024 11:40:25 -0400 Subject: [PATCH] rename, add menu, update styling --- .../chip-select.component.ts} | 16 ++++++++--- .../chip-select.stories.ts} | 14 ++++++++-- .../src/chip-select/chip-select.template.html | 27 +++++++++++++++++++ libs/components/src/chip/chip.template.html | 14 ---------- 4 files changed, 52 insertions(+), 19 deletions(-) rename libs/components/src/{chip/chip.component.ts => chip-select/chip-select.component.ts} (51%) rename libs/components/src/{chip/chip.stories.ts => chip-select/chip-select.stories.ts} (58%) create mode 100644 libs/components/src/chip-select/chip-select.template.html delete mode 100644 libs/components/src/chip/chip.template.html diff --git a/libs/components/src/chip/chip.component.ts b/libs/components/src/chip-select/chip-select.component.ts similarity index 51% rename from libs/components/src/chip/chip.component.ts rename to libs/components/src/chip-select/chip-select.component.ts index cc02020503..8247286f9e 100644 --- a/libs/components/src/chip/chip.component.ts +++ b/libs/components/src/chip-select/chip-select.component.ts @@ -1,15 +1,16 @@ import { BooleanInput, coerceBooleanProperty } from "@angular/cdk/coercion"; import { CommonModule } from "@angular/common"; -import { Component, Input } from "@angular/core"; +import { Component, Input, QueryList, ContentChildren } from "@angular/core"; import { ButtonModule } from "../button"; import { IconButtonModule } from "../icon-button"; +import { MenuItemDirective, MenuModule } from "../menu"; @Component({ selector: "bit-chip", - templateUrl: "chip.template.html", + templateUrl: "chip-select.template.html", standalone: true, - imports: [CommonModule, ButtonModule, IconButtonModule], + imports: [CommonModule, ButtonModule, IconButtonModule, MenuModule], }) export class ChipComponent { @Input() @@ -20,5 +21,14 @@ export class ChipComponent { this._selected = coerceBooleanProperty(value); } + @ContentChildren(MenuItemDirective, { descendants: true }) + menuItems: QueryList; + private _selected = false; + + clear(e: Event) { + //eslint-disable-next-line + console.log("hi"); + e.stopPropagation(); + } } diff --git a/libs/components/src/chip/chip.stories.ts b/libs/components/src/chip-select/chip-select.stories.ts similarity index 58% rename from libs/components/src/chip/chip.stories.ts rename to libs/components/src/chip-select/chip-select.stories.ts index 8034b2b855..71fa017bd4 100644 --- a/libs/components/src/chip/chip.stories.ts +++ b/libs/components/src/chip-select/chip-select.stories.ts @@ -1,13 +1,15 @@ import { Meta, StoryObj, moduleMetadata } from "@storybook/angular"; -import { ChipComponent } from "./chip.component"; +import { MenuModule } from "../menu"; + +import { ChipComponent } from "./chip-select.component"; export default { title: "Component Library/Chip", component: ChipComponent, decorators: [ moduleMetadata({ - imports: [], + imports: [MenuModule], providers: [], }), ], @@ -22,11 +24,19 @@ export const Default: Story = { Label + + Anchor link + Another link + Label + + Anchor link + Another link + `, }), diff --git a/libs/components/src/chip-select/chip-select.template.html b/libs/components/src/chip-select/chip-select.template.html new file mode 100644 index 0000000000..c3ee1bfe75 --- /dev/null +++ b/libs/components/src/chip-select/chip-select.template.html @@ -0,0 +1,27 @@ + + + + + + diff --git a/libs/components/src/chip/chip.template.html b/libs/components/src/chip/chip.template.html deleted file mode 100644 index 26ee865366..0000000000 --- a/libs/components/src/chip/chip.template.html +++ /dev/null @@ -1,14 +0,0 @@ - - -