inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2026-04-16 22:24:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove unused adf-button component (#11520)

Browse Source
This commit is contained in:
Denys Vuika
2026-01-12 12:11:50 +00:00
committed by GitHub
parent aecc388213
commit 38070c210c
8 changed files with 5 additions and 298 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
docs/README.md
View File

@@ -83,7 +83,6 @@ A collection of Angular components for generic use.
| Name | Description |
|---------------------------------------------------|-------------------------------------------------|
| [Avatar](core/components/avatar.component.md) | Displays user avatars. |
| [Button](core/components/button.component.md) | A standard button component. |
| [Header](core/components/adf-header.component.md) | A simple reusable application header component. |
### Components

1
docs/core/components/button.component.md
View File

@@ -1 +0,0 @@
../../../lib/core/src/lib/button/button.component.md

127
lib/core/src/lib/button/button.component.html
View File

@@ -1,127 +0,0 @@
<ng-container [ngSwitch]="variant">
<ng-container *ngSwitchDefault>
<button
mat-button
class="adf-button__content"
[attr.id]="uid"
[attr.title]="tooltip"
[color]="color"
[disabled]="disabled"
[disableRipple]="disableRipple"
[attr.aria-label]="ariaLabel"
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<ng-container [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
<ng-container *ngSwitchCase="'raised'">
<button
mat-raised-button
class="adf-button__content"
[attr.id]="uid"
[attr.title]="tooltip"
[color]="color"
[disabled]="disabled"
[disableRipple]="disableRipple"
[attr.aria-label]="ariaLabel"
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<ng-container [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
<ng-container *ngSwitchCase="'stroked'">
<button
mat-stroked-button
class="adf-button__content"
[attr.id]="uid"
[attr.title]="tooltip"
[color]="color"
[disabled]="disabled"
[disableRipple]="disableRipple"
[attr.aria-label]="ariaLabel"
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<ng-container [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
<ng-container *ngSwitchCase="'flat'">
<button
mat-flat-button
class="adf-button__content"
[attr.id]="uid"
[attr.title]="tooltip"
[color]="color"
[disabled]="disabled"
[disableRipple]="disableRipple"
[attr.aria-label]="ariaLabel"
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<ng-container [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
<ng-container *ngSwitchCase="'icon'">
<button
mat-icon-button
class="adf-button__content"
[attr.id]="uid"
[attr.title]="tooltip"
[color]="color"
[disabled]="disabled"
[disableRipple]="disableRipple"
[attr.aria-label]="ariaLabel"
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<mat-icon *ngIf="icon" class="adf-button__icon" [adf-icon]="icon" />
<ng-container [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
<ng-container *ngSwitchCase="'fab'">
<button
mat-fab
class="adf-button__content"
[id]="uid"
[title]="tooltip"
[color]="color"
[disabled]="disabled"
[disableRipple]="disableRipple"
[attr.aria-label]="ariaLabel"
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<mat-icon *ngIf="icon" class="adf-button__icon" [adf-icon]="icon" />
<ng-container *ngIf="!icon" [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
<ng-container *ngSwitchCase="'mini-fab'">
<button
mat-mini-fab
class="adf-button__content"
[id]="uid"
[title]="tooltip"
[color]="color"
[disabled]="disabled"
[disableRipple]="disableRipple"
[attr.aria-label]="ariaLabel"
[attr.aria-hidden]="ariaHidden"
[attr.data-automation-id]="testId"
>
<mat-icon *ngIf="icon" class="adf-button__icon" [adf-icon]="icon" />
<ng-container *ngIf="!icon" [ngTemplateOutlet]="buttonContent" />
</button>
</ng-container>
</ng-container>
<ng-template #buttonContent>
<ng-content />
</ng-template>

101
lib/core/src/lib/button/button.component.md
View File

@@ -1,101 +0,0 @@
# Button Component
`standalone`, `component`
The Button component is a simple button that can be used to trigger actions.
## Usage
```html
<adf-button>Click me!</adf-button>
```
### Variant
The button supports the following variants:
- basic
- raised
- stroked
- flat
- icon
- fab
- mini-fab
```html
<adf-button variant="basic">Basic</adf-button>
<adf-button variant="raised">Raised</adf-button>
<adf-button variant="stroked">Stroked</adf-button>
<adf-button variant="flat">Flat</adf-button>
<adf-button variant="icon" icon="home">Icon</adf-button>
<adf-button variant="icon"><mat-icon>more_vert</mat-icon></adf-button>
<adf-button variant="fab" icon="plus_one">Fab</adf-button>
<adf-button variant="mini-fab" icon="menu">Mini Fab</adf-button>
```
### Color
The button supports the following colors:
- primary
- accent
- warn
```html
<adf-button color="primary">Primary</adf-button>
<adf-button color="accent">Accent</adf-button>
<adf-button color="warn">Warn</adf-button>
```
## API
Import the following standalone components:
```typescript
import { ButtonComponent } from '@alfresco/adf-core';
```
## Properties
| Name | Type | Default | Description |
|-----------------|---------|---------|----------------------------------------------------------------------------------------------------------|
| `uid` | string | | The button id. |
| `variant` | string | `basic` | The button variant. Possible values are `basic`, `raised`, `stroked`, `flat`, `icon`, `fab`, `mini-fab`. |
| `tooltip` | string | | The button tooltip. |
| `color` | string | | The button color. Possible values are `primary`, `accent`, `warn`. |
| `icon` | string | | The button icon. |
| `disableRipple` | boolean | `false` | Whether the ripple effect should be disabled. |
| `disabled` | boolean | `false` | Whether the button should be disabled. |
| `testId` | string | | The button test id (uses `data-automation-id` attribute). |
### Accessibility
The button component has been designed to be accessible. The following attributes are available:
- `ariaLabel`: The button aria label.
- `ariaHidden`: Whether the button should be hidden from the accessibility tree.
## Events
| Name | Description |
|---------|-------------------------------------|
| `click` | Emitted when the button is clicked. |
## Theming
The following CSS classes are available for theming:
| Name | Description |
|------------------------|-----------------------------|
| `adf-button` | The host element. |
| `.adf-button__content` | The button content element. |
| `.adf-button__icon` | The icon element. |
### CSS Variables
The following CSS variables are available for theming:
| Name | Default | Description |
|--------------------------|---------|---------------|
| `--adf-button-icon-size` | `24px` | The icon size |

13
lib/core/src/lib/button/button.component.scss
View File

@@ -1,13 +0,0 @@
adf-button {
// custom styles
.adf-button__content {
// custom styles
}
.adf-button__icon {
font-size: var(--adf-button-icon-size, 24px);
width: var(--adf-button-icon-size, 24px);
height: var(--adf-button-icon-size, 24px);
}
}

49
lib/core/src/lib/button/button.component.ts
View File

@@ -1,49 +0,0 @@
/*!
* @license
* Copyright © 2005-2025 Hyland Software, Inc. and its affiliates. All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Component, HostBinding, Input, ViewEncapsulation } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatButtonModule } from '@angular/material/button';
import { ThemePalette } from '@angular/material/core';
import { IconModule } from '../icon/icon.module';
export type ButtonVariant = 'basic' | 'raised' | 'stroked' | 'flat' | 'icon' | 'fab' | 'mini-fab' | undefined;
export type ButtonColor = ThemePalette;
@Component({
selector: 'adf-button',
imports: [CommonModule, MatButtonModule, IconModule],
templateUrl: './button.component.html',
styleUrls: ['./button.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class ButtonComponent {
@Input() uid?: string;
@Input() variant: ButtonVariant;
@Input() color?: ButtonColor;
@Input() tooltip?: string;
@Input() icon?: string;
@Input() disableRipple: boolean;
@Input() disabled: boolean;
@Input() ariaLabel?: string;
@Input() ariaHidden?: boolean;
@Input() testId?: string;
@HostBinding('style.--adf-button-icon-size')
@Input()
iconSize = getComputedStyle(document.documentElement).getPropertyValue('--adf-button-icon-size');
}

10
lib/core/src/lib/header/header.component.md
View File

@@ -34,7 +34,7 @@ Toolbar actions can be added to the header by placing them inside an element wit
>
<div adf-toolbar-actions>
<adf-toolbar-divider></adf-toolbar-divider>
<adf-button variant="icon" icon="search" (click)="onSearchClick()"></adf-button>
<mat-button variant="icon" icon="search" (click)="onSearchClick()"></mat-button>
<adf-avatar [src]="src"></adf-avatar>
</div>
</adf-header>
@@ -47,13 +47,13 @@ Displaying an extended header with toolbar actions:
```html
<adf-header variant="extended" [logoSrc]="src" [title]="title" [navbarItems]="items">
<div adf-toolbar-actions>
<adf-button variant="flat">Secondary</adf-button>
<adf-button variant="flat" color="accent">Primary</adf-button>
<mat-button variant="flat">Secondary</mat-button>
<mat-button variant="flat" color="accent">Primary</mat-button>
<adf-toolbar-divider></adf-toolbar-divider>
<adf-button variant="icon" icon="search"></adf-button>
<adf-button variant="icon" [matMenuTriggerFor]="menu" icon="apps"></adf-button>
<mat-button variant="icon" icon="search"></mat-button>
<mat-button variant="icon" [matMenuTriggerFor]="menu" icon="apps"></mat-button>
<mat-menu #menu="matMenu">
...
</mat-menu>

1
lib/core/src/public-api.ts
View File

@@ -17,7 +17,6 @@
export * from './lib/about/index';
export * from './lib/avatar/avatar.component';
export * from './lib/button/button.component';
export * from './lib/viewer/index';
export * from './lib/toolbar/index';
export * from './lib/header/index';