@rededor/site-front-end-lib 20.0.39 → 20.1.0-alpha.0
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/components/algolia-search/index.d.ts +1 -1
- package/components/filters/filter-generic/index.d.ts +3 -3
- package/components/filters/filter-planos-convenios/index.d.ts +3 -2
- package/components/footer/index.d.ts +1 -1
- package/components/header/index.d.ts +1 -1
- package/core/index.d.ts +3 -4
- package/fesm2022/rededor-site-front-end-lib-components-algolia-search.mjs +4 -4
- package/fesm2022/rededor-site-front-end-lib-components-algolia-search.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-banner.mjs +5 -5
- package/fesm2022/rededor-site-front-end-lib-components-banner.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-breadcrumbs.mjs +2 -2
- package/fesm2022/rededor-site-front-end-lib-components-breadcrumbs.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-cards.mjs +6 -6
- package/fesm2022/rededor-site-front-end-lib-components-cards.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-carousels.mjs +2 -2
- package/fesm2022/rededor-site-front-end-lib-components-carousels.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-cta-wrapper.mjs +2 -2
- package/fesm2022/rededor-site-front-end-lib-components-cta-wrapper.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-error.mjs +6 -6
- package/fesm2022/rededor-site-front-end-lib-components-error.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-filter-letter-and-terms.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-filter-letter-and-terms.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-filters-filter-generic.mjs +13 -13
- package/fesm2022/rededor-site-front-end-lib-components-filters-filter-generic.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-filters-filter-planos-convenios.mjs +14 -14
- package/fesm2022/rededor-site-front-end-lib-components-filters-filter-planos-convenios.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-footer.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-footer.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header-components-action.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header-components-action.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header-components-auxiliar.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header-components-auxiliar.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header-components-main.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header-components-main.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header-components-side.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header-components-side.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-header.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-load-screen.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-load-screen.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-modal-drawer.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-modal-drawer.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-modal.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-modal.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-page-header.mjs +2 -2
- package/fesm2022/rededor-site-front-end-lib-components-page-header.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-pagination.mjs +2 -2
- package/fesm2022/rededor-site-front-end-lib-components-pagination.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-search.mjs +3 -3
- package/fesm2022/rededor-site-front-end-lib-components-search.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-section-navigation.mjs +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-section-navigation.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-side-ctas.mjs +2 -2
- package/fesm2022/rededor-site-front-end-lib-components-side-ctas.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-sidebar-navigation.mjs +3 -3
- package/fesm2022/rededor-site-front-end-lib-components-sidebar-navigation.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-sticky-navigation.mjs +3 -3
- package/fesm2022/rededor-site-front-end-lib-components-sticky-navigation.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-components-whatsapp.mjs +2 -2
- package/fesm2022/rededor-site-front-end-lib-components-whatsapp.mjs.map +1 -1
- package/fesm2022/rededor-site-front-end-lib-core.mjs +1 -0
- package/fesm2022/rededor-site-front-end-lib-core.mjs.map +1 -1
- package/package.json +2 -133
- package/cura/accordion/index.d.ts +0 -120
- package/cura/api/index.d.ts +0 -359
- package/cura/badges/cura-badge-counter/index.d.ts +0 -38
- package/cura/badges/cura-badge-distance/index.d.ts +0 -21
- package/cura/badges/cura-badge-dot/index.d.ts +0 -29
- package/cura/badges/cura-badge-pill/index.d.ts +0 -42
- package/cura/badges/index.d.ts +0 -5
- package/cura/buttons/cura-button/index.d.ts +0 -90
- package/cura/buttons/cura-button-outline/index.d.ts +0 -90
- package/cura/buttons/cura-button-select/index.d.ts +0 -39
- package/cura/buttons/cura-button-transparent/index.d.ts +0 -87
- package/cura/buttons/index.d.ts +0 -15
- package/cura/cards/cura-card/index.d.ts +0 -49
- package/cura/feedback/cura-alert/index.d.ts +0 -55
- package/cura/feedback/cura-modal/index.d.ts +0 -97
- package/cura/feedback/cura-toast/index.d.ts +0 -104
- package/cura/forms/cura-checkbox/index.d.ts +0 -160
- package/cura/forms/cura-input-text/index.d.ts +0 -236
- package/cura/forms/cura-label/index.d.ts +0 -47
- package/cura/forms/cura-radio/index.d.ts +0 -148
- package/cura/forms/cura-select/index.d.ts +0 -154
- package/cura/forms/cura-select-option/index.d.ts +0 -54
- package/cura/forms/cura-select-state/index.d.ts +0 -72
- package/cura/forms/cura-switch/index.d.ts +0 -113
- package/cura/forms/cura-textarea/index.d.ts +0 -113
- package/cura/forms/index.d.ts +0 -20
- package/cura/icons/cura-icon/index.d.ts +0 -46
- package/cura/loaders/cura-loader-bar/index.d.ts +0 -22
- package/cura/loaders/cura-loader-circle/index.d.ts +0 -24
- package/cura/texts/cura-display/index.d.ts +0 -54
- package/cura/texts/cura-heading/index.d.ts +0 -65
- package/cura/texts/cura-paragraph/index.d.ts +0 -54
- package/cura/texts/index.d.ts +0 -7
- package/fesm2022/rededor-site-front-end-lib-cura-accordion.mjs +0 -252
- package/fesm2022/rededor-site-front-end-lib-cura-accordion.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-api.mjs +0 -643
- package/fesm2022/rededor-site-front-end-lib-cura-api.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-badges-cura-badge-counter.mjs +0 -90
- package/fesm2022/rededor-site-front-end-lib-cura-badges-cura-badge-counter.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-badges-cura-badge-distance.mjs +0 -55
- package/fesm2022/rededor-site-front-end-lib-cura-badges-cura-badge-distance.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-badges-cura-badge-dot.mjs +0 -66
- package/fesm2022/rededor-site-front-end-lib-cura-badges-cura-badge-dot.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-badges-cura-badge-pill.mjs +0 -91
- package/fesm2022/rededor-site-front-end-lib-cura-badges-cura-badge-pill.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-badges.mjs +0 -4
- package/fesm2022/rededor-site-front-end-lib-cura-badges.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-buttons-cura-button-outline.mjs +0 -170
- package/fesm2022/rededor-site-front-end-lib-cura-buttons-cura-button-outline.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-buttons-cura-button-select.mjs +0 -135
- package/fesm2022/rededor-site-front-end-lib-cura-buttons-cura-button-select.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-buttons-cura-button-transparent.mjs +0 -161
- package/fesm2022/rededor-site-front-end-lib-cura-buttons-cura-button-transparent.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-buttons-cura-button.mjs +0 -170
- package/fesm2022/rededor-site-front-end-lib-cura-buttons-cura-button.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-buttons.mjs +0 -13
- package/fesm2022/rededor-site-front-end-lib-cura-buttons.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-cards-cura-card.mjs +0 -72
- package/fesm2022/rededor-site-front-end-lib-cura-cards-cura-card.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-feedback-cura-alert.mjs +0 -90
- package/fesm2022/rededor-site-front-end-lib-cura-feedback-cura-alert.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-feedback-cura-modal.mjs +0 -105
- package/fesm2022/rededor-site-front-end-lib-cura-feedback-cura-modal.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-feedback-cura-toast.mjs +0 -198
- package/fesm2022/rededor-site-front-end-lib-cura-feedback-cura-toast.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-checkbox.mjs +0 -262
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-checkbox.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-input-text.mjs +0 -586
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-input-text.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-label.mjs +0 -82
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-label.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-radio.mjs +0 -243
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-radio.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-select-option.mjs +0 -89
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-select-option.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-select-state.mjs +0 -123
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-select-state.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-select.mjs +0 -365
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-select.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-switch.mjs +0 -182
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-switch.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-textarea.mjs +0 -209
- package/fesm2022/rededor-site-front-end-lib-cura-forms-cura-textarea.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-forms.mjs +0 -21
- package/fesm2022/rededor-site-front-end-lib-cura-forms.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-icons-cura-icon.mjs +0 -88
- package/fesm2022/rededor-site-front-end-lib-cura-icons-cura-icon.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-loaders-cura-loader-bar.mjs +0 -44
- package/fesm2022/rededor-site-front-end-lib-cura-loaders-cura-loader-bar.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-loaders-cura-loader-circle.mjs +0 -49
- package/fesm2022/rededor-site-front-end-lib-cura-loaders-cura-loader-circle.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-texts-cura-display.mjs +0 -84
- package/fesm2022/rededor-site-front-end-lib-cura-texts-cura-display.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-texts-cura-heading.mjs +0 -104
- package/fesm2022/rededor-site-front-end-lib-cura-texts-cura-heading.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-texts-cura-paragraph.mjs +0 -89
- package/fesm2022/rededor-site-front-end-lib-cura-texts-cura-paragraph.mjs.map +0 -1
- package/fesm2022/rededor-site-front-end-lib-cura-texts.mjs +0 -4
- package/fesm2022/rededor-site-front-end-lib-cura-texts.mjs.map +0 -1
|
@@ -1,161 +0,0 @@
|
|
|
1
|
-
import * as i1 from '@angular/common';
|
|
2
|
-
import { CommonModule } from '@angular/common';
|
|
3
|
-
import * as i0 from '@angular/core';
|
|
4
|
-
import { inject, input, output, computed, HostListener, Component } from '@angular/core';
|
|
5
|
-
import { labelSizes } from '@rededor/site-front-end-lib/cura/buttons';
|
|
6
|
-
import { CuraApiService } from '@rededor/site-front-end-lib/cura/api';
|
|
7
|
-
import { CuraIconComponent } from '@rededor/site-front-end-lib/cura/icons/cura-icon';
|
|
8
|
-
import { CuraLoaderCircleComponent } from '@rededor/site-front-end-lib/cura/loaders/cura-loader-circle';
|
|
9
|
-
import { CuraLabelComponent } from '@rededor/site-front-end-lib/cura/forms/cura-label';
|
|
10
|
-
|
|
11
|
-
class CuraButtonTransparentComponent {
|
|
12
|
-
constructor() {
|
|
13
|
-
this.curaApi = inject(CuraApiService);
|
|
14
|
-
/**
|
|
15
|
-
* Button type: button (default) | submit | reset
|
|
16
|
-
*/
|
|
17
|
-
this.type = input('button', ...(ngDevMode ? [{ debugName: "type" }] : []));
|
|
18
|
-
/**
|
|
19
|
-
* Button size: small | medium | large (default)
|
|
20
|
-
*/
|
|
21
|
-
this.size = input('large', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
22
|
-
/**
|
|
23
|
-
* Disabled state. Boolean.
|
|
24
|
-
*/
|
|
25
|
-
this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
26
|
-
/**
|
|
27
|
-
* Loading state. Boolean.
|
|
28
|
-
*/
|
|
29
|
-
this.isLoading = input(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
|
|
30
|
-
/**
|
|
31
|
-
* Name of the icon to be used from iconset.
|
|
32
|
-
*/
|
|
33
|
-
this.iconName = input('', ...(ngDevMode ? [{ debugName: "iconName" }] : []));
|
|
34
|
-
/**
|
|
35
|
-
* Custom iconset if needed.
|
|
36
|
-
*/
|
|
37
|
-
this.iconset = input('default', ...(ngDevMode ? [{ debugName: "iconset" }] : []));
|
|
38
|
-
/**
|
|
39
|
-
* Icon position: left (default) | right.
|
|
40
|
-
*/
|
|
41
|
-
this.iconPosition = input('left', ...(ngDevMode ? [{ debugName: "iconPosition" }] : []));
|
|
42
|
-
/**
|
|
43
|
-
* Set button to FAB/icon only.
|
|
44
|
-
*/
|
|
45
|
-
this.iconOnly = input(false, ...(ngDevMode ? [{ debugName: "iconOnly" }] : []));
|
|
46
|
-
/**
|
|
47
|
-
* Property href switch button to link.
|
|
48
|
-
*/
|
|
49
|
-
this.href = input('', ...(ngDevMode ? [{ debugName: "href" }] : []));
|
|
50
|
-
/**
|
|
51
|
-
* Set target if link.
|
|
52
|
-
*/
|
|
53
|
-
this.target = input('_self', ...(ngDevMode ? [{ debugName: "target" }] : []));
|
|
54
|
-
/**
|
|
55
|
-
* Color base from color scheme. Default: primary.
|
|
56
|
-
*/
|
|
57
|
-
this.color = input('primary', ...(ngDevMode ? [{ debugName: "color" }] : []));
|
|
58
|
-
/**
|
|
59
|
-
* Set the font color to dark or light.
|
|
60
|
-
* Default: dark.
|
|
61
|
-
*/
|
|
62
|
-
this.fontColor = input('dark', ...(ngDevMode ? [{ debugName: "fontColor" }] : []));
|
|
63
|
-
/**
|
|
64
|
-
* Set text alignment for the button label.
|
|
65
|
-
* Values: left (default) | center | right.
|
|
66
|
-
*/
|
|
67
|
-
this.textAlign = input('left', ...(ngDevMode ? [{ debugName: "textAlign" }] : []));
|
|
68
|
-
/**
|
|
69
|
-
* Justify icons and label inside the button.
|
|
70
|
-
* Values: false (default) | true.
|
|
71
|
-
*/
|
|
72
|
-
this.justify = input(false, ...(ngDevMode ? [{ debugName: "justify" }] : []));
|
|
73
|
-
/**
|
|
74
|
-
* Accessible name for the button (aria-label).
|
|
75
|
-
* Required for icon-only buttons or when button text is not descriptive enough.
|
|
76
|
-
*/
|
|
77
|
-
this.ariaLabel = input('', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
|
|
78
|
-
this.buttonClick = output();
|
|
79
|
-
this.hovered = false;
|
|
80
|
-
// Computed signal
|
|
81
|
-
this.buttonStyles = computed(() => {
|
|
82
|
-
const styles = {};
|
|
83
|
-
styles['--base-spacing'] = this.curaApi.theme.spacing.getSpacing();
|
|
84
|
-
styles['--neutral-white'] = this.curaApi.theme.colors.getColor('neutral-white');
|
|
85
|
-
styles['--neutral-base'] = this.curaApi.theme.colors.getColor('neutral-base');
|
|
86
|
-
styles['--neutral-dark'] = this.curaApi.theme.colors.getColor('neutral-dark');
|
|
87
|
-
styles['--font-size'] = this.curaApi.theme.fonts.getSize();
|
|
88
|
-
styles['--font-family'] = this.curaApi.theme.fonts.getFamily();
|
|
89
|
-
const weights = this.curaApi.theme.fonts.getWeights();
|
|
90
|
-
styles['--font-weight-medium'] = weights.medium;
|
|
91
|
-
styles['--text-align'] = this.textAlign();
|
|
92
|
-
return styles;
|
|
93
|
-
}, ...(ngDevMode ? [{ debugName: "buttonStyles" }] : []));
|
|
94
|
-
this.containerClasses = computed(() => {
|
|
95
|
-
const classes = [];
|
|
96
|
-
classes.push(this.size()?.toLowerCase());
|
|
97
|
-
classes.push(`icon-${this.iconPosition()?.toLowerCase()}`);
|
|
98
|
-
if (this.iconOnly())
|
|
99
|
-
classes.push('icon-only');
|
|
100
|
-
if (this.disabled())
|
|
101
|
-
classes.push('disabled');
|
|
102
|
-
if (this.isLoading())
|
|
103
|
-
classes.push('isLoading');
|
|
104
|
-
if (this.justify())
|
|
105
|
-
classes.push('justify');
|
|
106
|
-
return classes.join(' ');
|
|
107
|
-
}, ...(ngDevMode ? [{ debugName: "containerClasses" }] : []));
|
|
108
|
-
this.iconSize = computed(() => {
|
|
109
|
-
return this.size() === 'large' ? '20' : '16';
|
|
110
|
-
}, ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
|
|
111
|
-
this.symbolColor = computed(() => {
|
|
112
|
-
if (this.disabled())
|
|
113
|
-
return 'neutral-dark';
|
|
114
|
-
if (this.hovered && !this.isLoading()) {
|
|
115
|
-
return this.fontColor() === 'light' ? `${this.color()}-light` : `${this.color()}-darker`;
|
|
116
|
-
}
|
|
117
|
-
return this.fontColor() === 'light' ? 'neutral-white' : `${this.color()}-dark`;
|
|
118
|
-
}, ...(ngDevMode ? [{ debugName: "symbolColor" }] : []));
|
|
119
|
-
this.labelSize = computed(() => {
|
|
120
|
-
return (labelSizes[this.size()] || labelSizes['default']);
|
|
121
|
-
}, ...(ngDevMode ? [{ debugName: "labelSize" }] : []));
|
|
122
|
-
}
|
|
123
|
-
handleMouseEnter() {
|
|
124
|
-
if (this.disabled())
|
|
125
|
-
return;
|
|
126
|
-
this.hovered = true;
|
|
127
|
-
}
|
|
128
|
-
handleMouseLeave() {
|
|
129
|
-
this.hovered = false;
|
|
130
|
-
}
|
|
131
|
-
handleClick(event) {
|
|
132
|
-
if (this.disabled() || this.isLoading()) {
|
|
133
|
-
event.preventDefault();
|
|
134
|
-
return;
|
|
135
|
-
}
|
|
136
|
-
this.buttonClick.emit(event);
|
|
137
|
-
}
|
|
138
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CuraButtonTransparentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
139
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: CuraButtonTransparentComponent, isStandalone: true, selector: "cura-button-transparent", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, iconName: { classPropertyName: "iconName", publicName: "iconName", isSignal: true, isRequired: false, transformFunction: null }, iconset: { classPropertyName: "iconset", publicName: "iconset", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, fontColor: { classPropertyName: "fontColor", publicName: "fontColor", isSignal: true, isRequired: false, transformFunction: null }, textAlign: { classPropertyName: "textAlign", publicName: "textAlign", isSignal: true, isRequired: false, transformFunction: null }, justify: { classPropertyName: "justify", publicName: "justify", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClick: "buttonClick" }, host: { listeners: { "mouseenter": "handleMouseEnter()", "mouseleave": "handleMouseLeave()" }, properties: { "attr.role": "href() ? \"link\" : type()", "attr.aria-disabled": "disabled()", "attr.href": "href()" } }, ngImport: i0, template: "<ng-template #button>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if (href()) {\r\n <a\r\n [href]=\"disabled() ? '' : href()\"\r\n [target]=\"target()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </a>\r\n} @else {\r\n <button\r\n [type]=\"type()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </button>\r\n}\r\n", styles: [":host{--border-radius: 4px;display:inline-block;vertical-align:middle;position:relative}:host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none!important;font-size:var(--font-size);cursor:pointer;transition:background-color .07s linear,box-shadow .07s linear,border-color .07s linear;border-radius:var(--border-radius);position:relative;background-color:transparent;border:none}:host button:focus,:host a:focus{outline:2px solid #6ea8ff}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px);min-height:calc(var(--cura-spacing-base) * 11px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px);min-height:calc(var(--cura-spacing-base) * 10px)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px);min-height:calc(var(--cura-spacing-base) * 8px)}:host button .button-container,:host a .button-container{display:flex;align-items:center;opacity:1;transition:opacity .2s linear;position:relative}:host button.icon-right .button-container,:host a.icon-right .button-container{flex-direction:row-reverse}:host button.justify .button-container,:host a.justify .button-container{width:100%}:host button cura-label,:host a cura-label{flex:1;text-align:var(--text-align, \"left\")}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 3px)}:host button.medium.icon-left cura-icon,:host button.small.icon-left cura-icon,:host a.medium.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.medium.icon-right cura-icon,:host button.small.icon-right cura-icon,:host a.medium.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 2px)}:host button.disabled,:host a.disabled{cursor:not-allowed}:host button.icon-only,:host a.icon-only{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.icon-only cura-label,:host a.icon-only cura-label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0!important;margin-right:0!important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--cura-spacing-base) * 3px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--cura-spacing-base) * 2px)}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CuraIconComponent, selector: "cura-icon", inputs: ["name", "color", "size", "iconset", "disabled"] }, { kind: "component", type: CuraLoaderCircleComponent, selector: "cura-loader-circle", inputs: ["size", "color"] }, { kind: "component", type: CuraLabelComponent, selector: "cura-label", inputs: ["size", "weight", "spotColor", "color", "marginBlock", "lineHeight", "textOverflow"] }] }); }
|
|
140
|
-
}
|
|
141
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CuraButtonTransparentComponent, decorators: [{
|
|
142
|
-
type: Component,
|
|
143
|
-
args: [{ selector: 'cura-button-transparent', imports: [CommonModule, CuraIconComponent, CuraLoaderCircleComponent, CuraLabelComponent], host: {
|
|
144
|
-
'[attr.role]': 'href() ? "link" : type()',
|
|
145
|
-
'[attr.aria-disabled]': 'disabled()',
|
|
146
|
-
'[attr.href]': 'href()',
|
|
147
|
-
}, template: "<ng-template #button>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if (href()) {\r\n <a\r\n [href]=\"disabled() ? '' : href()\"\r\n [target]=\"target()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </a>\r\n} @else {\r\n <button\r\n [type]=\"type()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </button>\r\n}\r\n", styles: [":host{--border-radius: 4px;display:inline-block;vertical-align:middle;position:relative}:host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none!important;font-size:var(--font-size);cursor:pointer;transition:background-color .07s linear,box-shadow .07s linear,border-color .07s linear;border-radius:var(--border-radius);position:relative;background-color:transparent;border:none}:host button:focus,:host a:focus{outline:2px solid #6ea8ff}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px);min-height:calc(var(--cura-spacing-base) * 11px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px);min-height:calc(var(--cura-spacing-base) * 10px)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px);min-height:calc(var(--cura-spacing-base) * 8px)}:host button .button-container,:host a .button-container{display:flex;align-items:center;opacity:1;transition:opacity .2s linear;position:relative}:host button.icon-right .button-container,:host a.icon-right .button-container{flex-direction:row-reverse}:host button.justify .button-container,:host a.justify .button-container{width:100%}:host button cura-label,:host a cura-label{flex:1;text-align:var(--text-align, \"left\")}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 3px)}:host button.medium.icon-left cura-icon,:host button.small.icon-left cura-icon,:host a.medium.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.medium.icon-right cura-icon,:host button.small.icon-right cura-icon,:host a.medium.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 2px)}:host button.disabled,:host a.disabled{cursor:not-allowed}:host button.icon-only,:host a.icon-only{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.icon-only cura-label,:host a.icon-only cura-label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0!important;margin-right:0!important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--cura-spacing-base) * 3px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--cura-spacing-base) * 2px)}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}\n"] }]
|
|
148
|
-
}], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], iconName: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconName", required: false }] }], iconset: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconset", required: false }] }], iconPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconPosition", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], fontColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "fontColor", required: false }] }], textAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "textAlign", required: false }] }], justify: [{ type: i0.Input, args: [{ isSignal: true, alias: "justify", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], buttonClick: [{ type: i0.Output, args: ["buttonClick"] }], handleMouseEnter: [{
|
|
149
|
-
type: HostListener,
|
|
150
|
-
args: ['mouseenter']
|
|
151
|
-
}], handleMouseLeave: [{
|
|
152
|
-
type: HostListener,
|
|
153
|
-
args: ['mouseleave']
|
|
154
|
-
}] } });
|
|
155
|
-
|
|
156
|
-
/**
|
|
157
|
-
* Generated bundle index. Do not edit.
|
|
158
|
-
*/
|
|
159
|
-
|
|
160
|
-
export { CuraButtonTransparentComponent };
|
|
161
|
-
//# sourceMappingURL=rededor-site-front-end-lib-cura-buttons-cura-button-transparent.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"rededor-site-front-end-lib-cura-buttons-cura-button-transparent.mjs","sources":["../../../projects/site-front-end-lib/cura/buttons/cura-button-transparent/cura-button-transparent.component.ts","../../../projects/site-front-end-lib/cura/buttons/cura-button-transparent/cura-button-transparent.component.html","../../../projects/site-front-end-lib/cura/buttons/cura-button-transparent/rededor-site-front-end-lib-cura-buttons-cura-button-transparent.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\r\nimport { Component, input, output, HostListener, computed, inject } from '@angular/core';\r\nimport { labelSizes, ButtonType, ButtonSize, IconPosition, FontColor, TextAlign } from '@rededor/site-front-end-lib/cura/buttons';\r\nimport { CuraApiService } from '@rededor/site-front-end-lib/cura/api';\r\nimport { CuraIconComponent } from '@rededor/site-front-end-lib/cura/icons/cura-icon';\r\nimport { CuraLoaderCircleComponent } from '@rededor/site-front-end-lib/cura/loaders/cura-loader-circle';\r\nimport { CuraLabelComponent } from '@rededor/site-front-end-lib/cura/forms/cura-label';\r\nimport { LabelSize } from '@rededor/site-front-end-lib/cura/forms';\r\n\r\n@Component({\r\n selector: 'cura-button-transparent',\r\n imports: [CommonModule, CuraIconComponent, CuraLoaderCircleComponent, CuraLabelComponent],\r\n templateUrl: './cura-button-transparent.component.html',\r\n styleUrls: ['./cura-button-transparent.component.scss'],\r\n host: {\r\n '[attr.role]': 'href() ? \"link\" : type()',\r\n '[attr.aria-disabled]': 'disabled()',\r\n '[attr.href]': 'href()',\r\n },\r\n})\r\nexport class CuraButtonTransparentComponent {\r\n private curaApi: CuraApiService = inject(CuraApiService);\r\n\r\n /**\r\n * Button type: button (default) | submit | reset\r\n */\r\n type = input<ButtonType>('button');\r\n\r\n /**\r\n * Button size: small | medium | large (default)\r\n */\r\n size = input<ButtonSize>('large');\r\n\r\n /**\r\n * Disabled state. Boolean.\r\n */\r\n disabled = input<boolean>(false);\r\n\r\n /**\r\n * Loading state. Boolean.\r\n */\r\n isLoading = input<boolean>(false);\r\n\r\n /**\r\n * Name of the icon to be used from iconset.\r\n */\r\n iconName = input<string>('');\r\n\r\n /**\r\n * Custom iconset if needed.\r\n */\r\n iconset = input<string>('default');\r\n\r\n /**\r\n * Icon position: left (default) | right.\r\n */\r\n iconPosition = input<IconPosition>('left');\r\n\r\n /**\r\n * Set button to FAB/icon only.\r\n */\r\n iconOnly = input<boolean>(false);\r\n\r\n /**\r\n * Property href switch button to link.\r\n */\r\n href = input<string>('');\r\n\r\n /**\r\n * Set target if link.\r\n */\r\n target = input<string>('_self');\r\n\r\n /**\r\n * Color base from color scheme. Default: primary.\r\n */\r\n color = input<string>('primary');\r\n\r\n /**\r\n * Set the font color to dark or light.\r\n * Default: dark.\r\n */\r\n fontColor = input<FontColor>('dark');\r\n\r\n /**\r\n * Set text alignment for the button label.\r\n * Values: left (default) | center | right.\r\n */\r\n textAlign = input<TextAlign>('left');\r\n\r\n /**\r\n * Justify icons and label inside the button.\r\n * Values: false (default) | true.\r\n */\r\n justify = input<boolean>(false);\r\n\r\n /**\r\n * Accessible name for the button (aria-label).\r\n * Required for icon-only buttons or when button text is not descriptive enough.\r\n */\r\n ariaLabel = input<string>('');\r\n\r\n buttonClick = output<Event>();\r\n\r\n hovered = false;\r\n\r\n // Computed signal\r\n buttonStyles = computed(() => {\r\n const styles: { [key: string]: string } = {};\r\n\r\n styles['--base-spacing'] = this.curaApi.theme.spacing.getSpacing();\r\n styles['--neutral-white'] = this.curaApi.theme.colors.getColor('neutral-white');\r\n styles['--neutral-base'] = this.curaApi.theme.colors.getColor('neutral-base');\r\n styles['--neutral-dark'] = this.curaApi.theme.colors.getColor('neutral-dark');\r\n styles['--font-size'] = this.curaApi.theme.fonts.getSize();\r\n styles['--font-family'] = this.curaApi.theme.fonts.getFamily();\r\n const weights = this.curaApi.theme.fonts.getWeights();\r\n styles['--font-weight-medium'] = weights.medium;\r\n styles['--text-align'] = this.textAlign();\r\n\r\n return styles;\r\n });\r\n\r\n containerClasses = computed(() => {\r\n const classes = [];\r\n classes.push(this.size()?.toLowerCase());\r\n classes.push(`icon-${this.iconPosition()?.toLowerCase()}`);\r\n\r\n if (this.iconOnly()) classes.push('icon-only');\r\n if (this.disabled()) classes.push('disabled');\r\n if (this.isLoading()) classes.push('isLoading');\r\n if (this.justify()) classes.push('justify');\r\n\r\n return classes.join(' ');\r\n });\r\n\r\n iconSize = computed(() => {\r\n return this.size() === 'large' ? '20' : '16';\r\n });\r\n\r\n symbolColor = computed(() => {\r\n if (this.disabled()) return 'neutral-dark';\r\n if (this.hovered && !this.isLoading()) {\r\n return this.fontColor() === 'light' ? `${this.color()}-light` : `${this.color()}-darker`;\r\n }\r\n return this.fontColor() === 'light' ? 'neutral-white' : `${this.color()}-dark`;\r\n });\r\n\r\n labelSize = computed(() => {\r\n return (labelSizes[this.size()] || labelSizes['default']) as LabelSize;\r\n });\r\n\r\n @HostListener('mouseenter')\r\n handleMouseEnter() {\r\n if (this.disabled()) return;\r\n this.hovered = true;\r\n }\r\n\r\n @HostListener('mouseleave')\r\n handleMouseLeave() {\r\n this.hovered = false;\r\n }\r\n\r\n handleClick(event: Event) {\r\n if (this.disabled() || this.isLoading()) {\r\n event.preventDefault();\r\n return;\r\n }\r\n\r\n this.buttonClick.emit(event);\r\n }\r\n}\r\n","<ng-template #button>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if (href()) {\r\n <a\r\n [href]=\"disabled() ? '' : href()\"\r\n [target]=\"target()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </a>\r\n} @else {\r\n <button\r\n [type]=\"type()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </button>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,170 +0,0 @@
|
|
|
1
|
-
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, input, output, computed, HostListener, Component } from '@angular/core';
|
|
3
|
-
import { labelSizes } from '@rededor/site-front-end-lib/cura/buttons';
|
|
4
|
-
import { CuraApiService } from '@rededor/site-front-end-lib/cura/api';
|
|
5
|
-
import * as i1 from '@angular/common';
|
|
6
|
-
import { CommonModule } from '@angular/common';
|
|
7
|
-
import { CuraIconComponent } from '@rededor/site-front-end-lib/cura/icons/cura-icon';
|
|
8
|
-
import { CuraLoaderCircleComponent } from '@rededor/site-front-end-lib/cura/loaders/cura-loader-circle';
|
|
9
|
-
import { CuraLabelComponent } from '@rededor/site-front-end-lib/cura/forms/cura-label';
|
|
10
|
-
|
|
11
|
-
class CuraButtonComponent {
|
|
12
|
-
constructor() {
|
|
13
|
-
this.curaApi = inject(CuraApiService);
|
|
14
|
-
/**
|
|
15
|
-
* Button type: button (default) | submit | reset
|
|
16
|
-
*/
|
|
17
|
-
this.type = input('button', ...(ngDevMode ? [{ debugName: "type" }] : []));
|
|
18
|
-
/**
|
|
19
|
-
* Button size: small | medium | large (default)
|
|
20
|
-
*/
|
|
21
|
-
this.size = input('large', ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
22
|
-
/**
|
|
23
|
-
* Disabled state. Boolean.
|
|
24
|
-
*/
|
|
25
|
-
this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
26
|
-
/**
|
|
27
|
-
* Loading state. Boolean.
|
|
28
|
-
*/
|
|
29
|
-
this.isLoading = input(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
|
|
30
|
-
/**
|
|
31
|
-
* Name of the icon to be used from iconset.
|
|
32
|
-
*/
|
|
33
|
-
this.iconName = input('', ...(ngDevMode ? [{ debugName: "iconName" }] : []));
|
|
34
|
-
/**
|
|
35
|
-
* Custom iconset if needed.
|
|
36
|
-
*/
|
|
37
|
-
this.iconset = input('default', ...(ngDevMode ? [{ debugName: "iconset" }] : []));
|
|
38
|
-
/**
|
|
39
|
-
* Icon position: left (default) | right.
|
|
40
|
-
*/
|
|
41
|
-
this.iconPosition = input('left', ...(ngDevMode ? [{ debugName: "iconPosition" }] : []));
|
|
42
|
-
/**
|
|
43
|
-
* Set button to FAB/icon only.
|
|
44
|
-
*/
|
|
45
|
-
this.iconOnly = input(false, ...(ngDevMode ? [{ debugName: "iconOnly" }] : []));
|
|
46
|
-
/**
|
|
47
|
-
* Property href switch button to link.
|
|
48
|
-
*/
|
|
49
|
-
this.href = input('', ...(ngDevMode ? [{ debugName: "href" }] : []));
|
|
50
|
-
/**
|
|
51
|
-
* Set target if link.
|
|
52
|
-
*/
|
|
53
|
-
this.target = input('_self', ...(ngDevMode ? [{ debugName: "target" }] : []));
|
|
54
|
-
/**
|
|
55
|
-
* Color base from color scheme. Default: accent.
|
|
56
|
-
*/
|
|
57
|
-
this.color = input('accent', ...(ngDevMode ? [{ debugName: "color" }] : []));
|
|
58
|
-
/**
|
|
59
|
-
* Set the background color to dark or light.
|
|
60
|
-
*/
|
|
61
|
-
this.background = input('light', ...(ngDevMode ? [{ debugName: "background" }] : []));
|
|
62
|
-
/**
|
|
63
|
-
* Set the font color to dark or light.
|
|
64
|
-
*/
|
|
65
|
-
this.fontColor = input('dark', ...(ngDevMode ? [{ debugName: "fontColor" }] : []));
|
|
66
|
-
/**
|
|
67
|
-
* Set text alignment for the button label.
|
|
68
|
-
* Values: left (default) | center | right.
|
|
69
|
-
*/
|
|
70
|
-
this.textAlign = input('left', ...(ngDevMode ? [{ debugName: "textAlign" }] : []));
|
|
71
|
-
/**
|
|
72
|
-
* Justify icons and label inside the button.
|
|
73
|
-
* Values: false (default) | true.
|
|
74
|
-
*/
|
|
75
|
-
this.justify = input(false, ...(ngDevMode ? [{ debugName: "justify" }] : []));
|
|
76
|
-
/**
|
|
77
|
-
* Accessible name for the button (aria-label).
|
|
78
|
-
* Required for icon-only buttons or when button text is not descriptive enough.
|
|
79
|
-
*/
|
|
80
|
-
this.ariaLabel = input('', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
|
|
81
|
-
this.buttonClick = output();
|
|
82
|
-
this.hovered = false;
|
|
83
|
-
// Computed signal
|
|
84
|
-
this.buttonStyles = computed(() => {
|
|
85
|
-
const styles = {};
|
|
86
|
-
styles['--base-spacing'] = this.curaApi.theme.spacing.getSpacing();
|
|
87
|
-
styles['--font-size'] = this.curaApi.theme.fonts.getSize();
|
|
88
|
-
styles['--font-family'] = this.curaApi.theme.fonts.getFamily();
|
|
89
|
-
const weights = this.curaApi.theme.fonts.getWeights();
|
|
90
|
-
styles['--font-weight-medium'] = weights.medium;
|
|
91
|
-
styles['--text-align'] = this.textAlign();
|
|
92
|
-
const colorMappings = [
|
|
93
|
-
{ name: '--color-base-neutral-purewhite', theme: this.background() === 'light' ? `${this.color()}-base` : 'neutral-pale' },
|
|
94
|
-
{ name: '--color-base-color-light', theme: this.background() === 'light' ? `${this.color()}-base` : `${this.color()}-lighter` },
|
|
95
|
-
{ name: '--color-dark-color-light', theme: this.background() === 'light' ? `${this.color()}-dark` : `${this.color()}-light` },
|
|
96
|
-
{ name: '--color-dark-color-base', theme: this.background() === 'light' ? `${this.color()}-dark` : `${this.color()}-base` },
|
|
97
|
-
{ name: '--neutral-pale-neutral-black', theme: this.background() === 'light' ? 'neutral-pale' : 'neutral-black' },
|
|
98
|
-
];
|
|
99
|
-
colorMappings.forEach((mapping) => {
|
|
100
|
-
styles[mapping.name] = this.curaApi.theme.colors.getColor(mapping.theme);
|
|
101
|
-
});
|
|
102
|
-
return styles;
|
|
103
|
-
}, ...(ngDevMode ? [{ debugName: "buttonStyles" }] : []));
|
|
104
|
-
this.containerClasses = computed(() => {
|
|
105
|
-
const classes = [];
|
|
106
|
-
classes.push(this.size()?.toLowerCase());
|
|
107
|
-
classes.push(`icon-${this.iconPosition()?.toLowerCase()}`);
|
|
108
|
-
if (this.iconOnly())
|
|
109
|
-
classes.push('icon-only');
|
|
110
|
-
if (this.disabled())
|
|
111
|
-
classes.push('disabled');
|
|
112
|
-
if (this.isLoading())
|
|
113
|
-
classes.push('isLoading');
|
|
114
|
-
if (this.justify())
|
|
115
|
-
classes.push('justify');
|
|
116
|
-
return classes.join(' ');
|
|
117
|
-
}, ...(ngDevMode ? [{ debugName: "containerClasses" }] : []));
|
|
118
|
-
this.iconSize = computed(() => {
|
|
119
|
-
return this.size() === 'large' ? '20' : '16';
|
|
120
|
-
}, ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
|
|
121
|
-
this.symbolColor = computed(() => {
|
|
122
|
-
if (this.isLoading() && this.fontColor() === 'light')
|
|
123
|
-
return 'neutral-white';
|
|
124
|
-
if (this.isLoading() && this.fontColor() === 'dark')
|
|
125
|
-
return 'neutral-black';
|
|
126
|
-
return this.disabled() ? 'neutral-dark' : this.fontColor() === 'light' ? 'neutral-white' : 'neutral-black';
|
|
127
|
-
}, ...(ngDevMode ? [{ debugName: "symbolColor" }] : []));
|
|
128
|
-
this.labelSize = computed(() => {
|
|
129
|
-
return (labelSizes[this.size()] || labelSizes['default']);
|
|
130
|
-
}, ...(ngDevMode ? [{ debugName: "labelSize" }] : []));
|
|
131
|
-
}
|
|
132
|
-
handleMouseEnter() {
|
|
133
|
-
if (this.disabled())
|
|
134
|
-
return;
|
|
135
|
-
this.hovered = true;
|
|
136
|
-
}
|
|
137
|
-
handleMouseLeave() {
|
|
138
|
-
this.hovered = false;
|
|
139
|
-
}
|
|
140
|
-
handleClick(event) {
|
|
141
|
-
if (this.disabled() || this.isLoading()) {
|
|
142
|
-
event.preventDefault();
|
|
143
|
-
return;
|
|
144
|
-
}
|
|
145
|
-
this.buttonClick.emit(event);
|
|
146
|
-
}
|
|
147
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CuraButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
148
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: CuraButtonComponent, isStandalone: true, selector: "cura-button", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, iconName: { classPropertyName: "iconName", publicName: "iconName", isSignal: true, isRequired: false, transformFunction: null }, iconset: { classPropertyName: "iconset", publicName: "iconset", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, fontColor: { classPropertyName: "fontColor", publicName: "fontColor", isSignal: true, isRequired: false, transformFunction: null }, textAlign: { classPropertyName: "textAlign", publicName: "textAlign", isSignal: true, isRequired: false, transformFunction: null }, justify: { classPropertyName: "justify", publicName: "justify", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClick: "buttonClick" }, host: { listeners: { "mouseenter": "handleMouseEnter()", "mouseleave": "handleMouseLeave()" }, properties: { "attr.role": "href() ? \"link\" : type()", "attr.aria-disabled": "disabled()", "attr.href": "href()" } }, ngImport: i0, template: "<ng-template #button>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if (href()) {\r\n <a\r\n [href]=\"disabled() ? '' : href()\"\r\n [target]=\"target()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </a>\r\n} @else {\r\n <button\r\n [type]=\"type()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </button>\r\n}\r\n", styles: [":host{--border-radius: 4px;display:inline-block;vertical-align:middle;position:relative}:host button,:host a{outline:none;box-shadow:none;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none!important;font-size:var(--font-size);cursor:pointer;transition:background-color .07s linear,box-shadow .07s linear,border-color .07s linear;border-radius:var(--border-radius);position:relative;background-color:var(--color-base-neutral-purewhite);box-sizing:border-box;border:none}:host button:focus,:host a:focus{outline:2px solid #6ea8ff}:host button:before,:host a:before{content:\"\";width:100%;height:100%;position:absolute;left:0;top:0;box-sizing:border-box;border:2px solid transparent;border-radius:var(--border-radius)}:host button:not(.disabled):not(.isLoading):before,:host a:not(.disabled):not(.isLoading):before{border:2px solid var(--color-base-color-light)}:host button:not(.disabled):hover,:host a:not(.disabled):hover{background:var(--color-base-color-light);box-shadow:0 4px 8px #26262629}:host button:not(.disabled):not(.isLoading):hover:before,:host a:not(.disabled):not(.isLoading):hover:before{border-color:var(--color-dark-color-base)}:host button:not(.isLoading):not(.disabled):active,:host a:not(.isLoading):not(.disabled):active{background-color:var(--color-dark-color-light)}:host button:not(.isLoading):not(.disabled):active:before,:host a:not(.isLoading):not(.disabled):active:before{border-color:var(--color-dark-color-light)}:host button:hover,:host a:hover{box-shadow:0 4px 8px #26262629}:host button.medium:hover,:host a.medium:hover{box-shadow:0 3px 6px #26262629}:host button.small:hover,:host a.small:hover{box-shadow:0 2px 5px #26262629}:host button:active,:host button.disabled:hover,:host button.isLoading:hover,:host a:active,:host a.disabled:hover,:host a.isLoading:hover{box-shadow:none!important}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px);min-height:calc(var(--cura-spacing-base) * 11px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px);min-height:calc(var(--cura-spacing-base) * 10px)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px);min-height:calc(var(--cura-spacing-base) * 8px)}:host button .button-container,:host a .button-container{display:flex;align-items:center;opacity:1;transition:opacity .2s linear;position:relative}:host button.icon-right .button-container,:host a.icon-right .button-container{flex-direction:row-reverse}:host button.justify .button-container,:host a.justify .button-container{width:100%}:host button cura-label,:host a cura-label{flex:1;text-align:var(--text-align, \"left\")}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 3px)}:host button.medium.icon-left cura-icon,:host button.small.icon-left cura-icon,:host a.medium.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.medium.icon-right cura-icon,:host button.small.icon-right cura-icon,:host a.medium.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 2px)}:host button.disabled,:host a.disabled{cursor:not-allowed;background-color:var(--neutral-pale-neutral-black)}:host button.icon-only,:host a.icon-only{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.icon-only cura-label,:host a.icon-only cura-label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0!important;margin-right:0!important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--cura-spacing-base) * 3px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--cura-spacing-base) * 2px)}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CuraIconComponent, selector: "cura-icon", inputs: ["name", "color", "size", "iconset", "disabled"] }, { kind: "component", type: CuraLoaderCircleComponent, selector: "cura-loader-circle", inputs: ["size", "color"] }, { kind: "component", type: CuraLabelComponent, selector: "cura-label", inputs: ["size", "weight", "spotColor", "color", "marginBlock", "lineHeight", "textOverflow"] }] }); }
|
|
149
|
-
}
|
|
150
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CuraButtonComponent, decorators: [{
|
|
151
|
-
type: Component,
|
|
152
|
-
args: [{ selector: 'cura-button', imports: [CommonModule, CuraIconComponent, CuraLoaderCircleComponent, CuraLabelComponent], host: {
|
|
153
|
-
'[attr.role]': 'href() ? "link" : type()',
|
|
154
|
-
'[attr.aria-disabled]': 'disabled()',
|
|
155
|
-
'[attr.href]': 'href()',
|
|
156
|
-
}, template: "<ng-template #button>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if (href()) {\r\n <a\r\n [href]=\"disabled() ? '' : href()\"\r\n [target]=\"target()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </a>\r\n} @else {\r\n <button\r\n [type]=\"type()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </button>\r\n}\r\n", styles: [":host{--border-radius: 4px;display:inline-block;vertical-align:middle;position:relative}:host button,:host a{outline:none;box-shadow:none;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none!important;font-size:var(--font-size);cursor:pointer;transition:background-color .07s linear,box-shadow .07s linear,border-color .07s linear;border-radius:var(--border-radius);position:relative;background-color:var(--color-base-neutral-purewhite);box-sizing:border-box;border:none}:host button:focus,:host a:focus{outline:2px solid #6ea8ff}:host button:before,:host a:before{content:\"\";width:100%;height:100%;position:absolute;left:0;top:0;box-sizing:border-box;border:2px solid transparent;border-radius:var(--border-radius)}:host button:not(.disabled):not(.isLoading):before,:host a:not(.disabled):not(.isLoading):before{border:2px solid var(--color-base-color-light)}:host button:not(.disabled):hover,:host a:not(.disabled):hover{background:var(--color-base-color-light);box-shadow:0 4px 8px #26262629}:host button:not(.disabled):not(.isLoading):hover:before,:host a:not(.disabled):not(.isLoading):hover:before{border-color:var(--color-dark-color-base)}:host button:not(.isLoading):not(.disabled):active,:host a:not(.isLoading):not(.disabled):active{background-color:var(--color-dark-color-light)}:host button:not(.isLoading):not(.disabled):active:before,:host a:not(.isLoading):not(.disabled):active:before{border-color:var(--color-dark-color-light)}:host button:hover,:host a:hover{box-shadow:0 4px 8px #26262629}:host button.medium:hover,:host a.medium:hover{box-shadow:0 3px 6px #26262629}:host button.small:hover,:host a.small:hover{box-shadow:0 2px 5px #26262629}:host button:active,:host button.disabled:hover,:host button.isLoading:hover,:host a:active,:host a.disabled:hover,:host a.isLoading:hover{box-shadow:none!important}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px);min-height:calc(var(--cura-spacing-base) * 11px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px);min-height:calc(var(--cura-spacing-base) * 10px)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px);min-height:calc(var(--cura-spacing-base) * 8px)}:host button .button-container,:host a .button-container{display:flex;align-items:center;opacity:1;transition:opacity .2s linear;position:relative}:host button.icon-right .button-container,:host a.icon-right .button-container{flex-direction:row-reverse}:host button.justify .button-container,:host a.justify .button-container{width:100%}:host button cura-label,:host a cura-label{flex:1;text-align:var(--text-align, \"left\")}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 3px)}:host button.medium.icon-left cura-icon,:host button.small.icon-left cura-icon,:host a.medium.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.medium.icon-right cura-icon,:host button.small.icon-right cura-icon,:host a.medium.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 2px)}:host button.disabled,:host a.disabled{cursor:not-allowed;background-color:var(--neutral-pale-neutral-black)}:host button.icon-only,:host a.icon-only{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.icon-only cura-label,:host a.icon-only cura-label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0!important;margin-right:0!important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--cura-spacing-base) * 3px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--cura-spacing-base) * 2px)}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}\n"] }]
|
|
157
|
-
}], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], iconName: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconName", required: false }] }], iconset: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconset", required: false }] }], iconPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconPosition", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }], fontColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "fontColor", required: false }] }], textAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "textAlign", required: false }] }], justify: [{ type: i0.Input, args: [{ isSignal: true, alias: "justify", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], buttonClick: [{ type: i0.Output, args: ["buttonClick"] }], handleMouseEnter: [{
|
|
158
|
-
type: HostListener,
|
|
159
|
-
args: ['mouseenter']
|
|
160
|
-
}], handleMouseLeave: [{
|
|
161
|
-
type: HostListener,
|
|
162
|
-
args: ['mouseleave']
|
|
163
|
-
}] } });
|
|
164
|
-
|
|
165
|
-
/**
|
|
166
|
-
* Generated bundle index. Do not edit.
|
|
167
|
-
*/
|
|
168
|
-
|
|
169
|
-
export { CuraButtonComponent };
|
|
170
|
-
//# sourceMappingURL=rededor-site-front-end-lib-cura-buttons-cura-button.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"rededor-site-front-end-lib-cura-buttons-cura-button.mjs","sources":["../../../projects/site-front-end-lib/cura/buttons/cura-button/cura-button.component.ts","../../../projects/site-front-end-lib/cura/buttons/cura-button/cura-button.component.html","../../../projects/site-front-end-lib/cura/buttons/cura-button/rededor-site-front-end-lib-cura-buttons-cura-button.ts"],"sourcesContent":["import { Component, HostListener, input, output, inject, computed } from '@angular/core';\r\nimport { labelSizes, ButtonType, ButtonSize, IconPosition, BackgroundType, FontColor, TextAlign } from '@rededor/site-front-end-lib/cura/buttons';\r\nimport { CuraApiService } from '@rededor/site-front-end-lib/cura/api';\r\nimport { CommonModule } from '@angular/common';\r\nimport { CuraIconComponent } from '@rededor/site-front-end-lib/cura/icons/cura-icon';\r\nimport { CuraLoaderCircleComponent } from '@rededor/site-front-end-lib/cura/loaders/cura-loader-circle';\r\nimport { CuraLabelComponent } from '@rededor/site-front-end-lib/cura/forms/cura-label';\r\nimport { LabelSize } from '@rededor/site-front-end-lib/cura/forms';\r\n\r\n@Component({\r\n selector: 'cura-button',\r\n imports: [CommonModule, CuraIconComponent, CuraLoaderCircleComponent, CuraLabelComponent],\r\n templateUrl: './cura-button.component.html',\r\n styleUrls: ['./cura-button.component.scss'],\r\n host: {\r\n '[attr.role]': 'href() ? \"link\" : type()',\r\n '[attr.aria-disabled]': 'disabled()',\r\n '[attr.href]': 'href()',\r\n },\r\n})\r\nexport class CuraButtonComponent {\r\n private curaApi: CuraApiService = inject(CuraApiService);\r\n\r\n /**\r\n * Button type: button (default) | submit | reset\r\n */\r\n type = input<ButtonType>('button');\r\n\r\n /**\r\n * Button size: small | medium | large (default)\r\n */\r\n size = input<ButtonSize>('large');\r\n\r\n /**\r\n * Disabled state. Boolean.\r\n */\r\n disabled = input<boolean>(false);\r\n\r\n /**\r\n * Loading state. Boolean.\r\n */\r\n isLoading = input<boolean>(false);\r\n\r\n /**\r\n * Name of the icon to be used from iconset.\r\n */\r\n iconName = input<string>('');\r\n\r\n /**\r\n * Custom iconset if needed.\r\n */\r\n iconset = input<string>('default');\r\n\r\n /**\r\n * Icon position: left (default) | right.\r\n */\r\n iconPosition = input<IconPosition>('left');\r\n\r\n /**\r\n * Set button to FAB/icon only.\r\n */\r\n iconOnly = input<boolean>(false);\r\n\r\n /**\r\n * Property href switch button to link.\r\n */\r\n href = input<string>('');\r\n\r\n /**\r\n * Set target if link.\r\n */\r\n target = input<string>('_self');\r\n\r\n /**\r\n * Color base from color scheme. Default: accent.\r\n */\r\n color = input<string>('accent');\r\n\r\n /**\r\n * Set the background color to dark or light.\r\n */\r\n background = input<BackgroundType>('light');\r\n\r\n /**\r\n * Set the font color to dark or light.\r\n */\r\n fontColor = input<FontColor>('dark');\r\n\r\n /**\r\n * Set text alignment for the button label.\r\n * Values: left (default) | center | right.\r\n */\r\n textAlign = input<TextAlign>('left');\r\n\r\n /**\r\n * Justify icons and label inside the button.\r\n * Values: false (default) | true.\r\n */\r\n justify = input<boolean>(false);\r\n\r\n /**\r\n * Accessible name for the button (aria-label).\r\n * Required for icon-only buttons or when button text is not descriptive enough.\r\n */\r\n ariaLabel = input<string>('');\r\n\r\n buttonClick = output<Event>();\r\n\r\n hovered = false;\r\n\r\n // Computed signal\r\n buttonStyles = computed(() => {\r\n const styles: { [key: string]: string } = {};\r\n\r\n styles['--base-spacing'] = this.curaApi.theme.spacing.getSpacing();\r\n styles['--font-size'] = this.curaApi.theme.fonts.getSize();\r\n styles['--font-family'] = this.curaApi.theme.fonts.getFamily();\r\n const weights = this.curaApi.theme.fonts.getWeights();\r\n styles['--font-weight-medium'] = weights.medium;\r\n styles['--text-align'] = this.textAlign();\r\n\r\n const colorMappings = [\r\n { name: '--color-base-neutral-purewhite', theme: this.background() === 'light' ? `${this.color()}-base` : 'neutral-pale' },\r\n { name: '--color-base-color-light', theme: this.background() === 'light' ? `${this.color()}-base` : `${this.color()}-lighter` },\r\n { name: '--color-dark-color-light', theme: this.background() === 'light' ? `${this.color()}-dark` : `${this.color()}-light` },\r\n { name: '--color-dark-color-base', theme: this.background() === 'light' ? `${this.color()}-dark` : `${this.color()}-base` },\r\n { name: '--neutral-pale-neutral-black', theme: this.background() === 'light' ? 'neutral-pale' : 'neutral-black' },\r\n ];\r\n\r\n colorMappings.forEach((mapping) => {\r\n styles[mapping.name] = this.curaApi.theme.colors.getColor(mapping.theme);\r\n });\r\n\r\n return styles;\r\n });\r\n\r\n containerClasses = computed(() => {\r\n const classes = [];\r\n classes.push(this.size()?.toLowerCase());\r\n classes.push(`icon-${this.iconPosition()?.toLowerCase()}`);\r\n\r\n if (this.iconOnly()) classes.push('icon-only');\r\n if (this.disabled()) classes.push('disabled');\r\n if (this.isLoading()) classes.push('isLoading');\r\n if (this.justify()) classes.push('justify');\r\n\r\n return classes.join(' ');\r\n });\r\n\r\n iconSize = computed(() => {\r\n return this.size() === 'large' ? '20' : '16';\r\n });\r\n\r\n symbolColor = computed(() => {\r\n if (this.isLoading() && this.fontColor() === 'light') return 'neutral-white';\r\n if (this.isLoading() && this.fontColor() === 'dark') return 'neutral-black';\r\n\r\n return this.disabled() ? 'neutral-dark' : this.fontColor() === 'light' ? 'neutral-white' : 'neutral-black';\r\n });\r\n\r\n labelSize = computed(() => {\r\n return (labelSizes[this.size()] || labelSizes['default']) as LabelSize;\r\n });\r\n\r\n @HostListener('mouseenter')\r\n handleMouseEnter() {\r\n if (this.disabled()) return;\r\n this.hovered = true;\r\n }\r\n\r\n @HostListener('mouseleave')\r\n handleMouseLeave() {\r\n this.hovered = false;\r\n }\r\n\r\n handleClick(event: Event) {\r\n if (this.disabled() || this.isLoading()) {\r\n event.preventDefault();\r\n return;\r\n }\r\n\r\n this.buttonClick.emit(event);\r\n }\r\n}\r\n","<ng-template #button>\r\n <ng-content></ng-content>\r\n</ng-template>\r\n\r\n@if (href()) {\r\n <a\r\n [href]=\"disabled() ? '' : href()\"\r\n [target]=\"target()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </a>\r\n} @else {\r\n <button\r\n [type]=\"type()\"\r\n [class]=\"containerClasses()\"\r\n [ngStyle]=\"buttonStyles()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel()\"\r\n (click)=\"handleClick($event)\"\r\n (mouseenter)=\"handleMouseEnter()\"\r\n (mouseleave)=\"handleMouseLeave()\"\r\n >\r\n <span class=\"button-container\">\r\n @if (iconName()) {\r\n <cura-icon [name]=\"iconName()\" [size]=\"iconSize()\" [color]=\"symbolColor()\" [iconset]=\"iconset()\" [disabled]=\"disabled()\"> </cura-icon>\r\n }\r\n <cura-label class=\"label\" [size]=\"labelSize()\" lineHeight=\"normal\" [color]=\"symbolColor()\">\r\n <ng-container *ngTemplateOutlet=\"button\"></ng-container>\r\n </cura-label>\r\n </span>\r\n <cura-loader-circle [size]=\"size()\" [color]=\"symbolColor()\"> </cura-loader-circle>\r\n </button>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
const labelSizes = {
|
|
2
|
-
small: 'xsmall',
|
|
3
|
-
medium: 'small',
|
|
4
|
-
large: 'medium',
|
|
5
|
-
default: 'medium',
|
|
6
|
-
};
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* Generated bundle index. Do not edit.
|
|
10
|
-
*/
|
|
11
|
-
|
|
12
|
-
export { labelSizes };
|
|
13
|
-
//# sourceMappingURL=rededor-site-front-end-lib-cura-buttons.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"rededor-site-front-end-lib-cura-buttons.mjs","sources":["../../../projects/site-front-end-lib/cura/buttons/cura-button.definitions.ts","../../../projects/site-front-end-lib/cura/buttons/rededor-site-front-end-lib-cura-buttons.ts"],"sourcesContent":["export const labelSizes = {\r\n small: 'xsmall',\r\n medium: 'small',\r\n large: 'medium',\r\n default: 'medium',\r\n};\r\n\r\nexport type ButtonType = 'button' | 'reset' | 'submit';\r\nexport type ButtonSize = 'small' | 'medium' | 'large';\r\nexport type IconPosition = 'left' | 'right';\r\nexport type BackgroundType = 'dark' | 'light';\r\nexport type FontColor = 'dark' | 'light';\r\nexport type TextAlign = 'left' | 'center' | 'right';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"AAAO,MAAM,UAAU,GAAG;AACxB,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,MAAM,EAAE,OAAO;AACf,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,OAAO,EAAE,QAAQ;;;ACJnB;;AAEG;;;;"}
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, computed, Component } from '@angular/core';
|
|
3
|
-
import { CommonModule } from '@angular/common';
|
|
4
|
-
|
|
5
|
-
class CuraCardComponent {
|
|
6
|
-
constructor() {
|
|
7
|
-
// private curaApi = inject(CuraApiService);
|
|
8
|
-
/**
|
|
9
|
-
* Determines whether the card should have padding.
|
|
10
|
-
* @default true
|
|
11
|
-
*/
|
|
12
|
-
this.hasPadding = input(true, ...(ngDevMode ? [{ debugName: "hasPadding" }] : []));
|
|
13
|
-
/**
|
|
14
|
-
* Determines whether the card should have a shadow effect.
|
|
15
|
-
* @default false
|
|
16
|
-
*/
|
|
17
|
-
this.hasShadow = input(false, ...(ngDevMode ? [{ debugName: "hasShadow" }] : []));
|
|
18
|
-
/**
|
|
19
|
-
* Sets the type of the card background.
|
|
20
|
-
* - 'solid': A solid background.
|
|
21
|
-
* - 'transparent': A transparent background.
|
|
22
|
-
* @default 'solid'
|
|
23
|
-
*/
|
|
24
|
-
this.type = input('solid', ...(ngDevMode ? [{ debugName: "type" }] : []));
|
|
25
|
-
/**
|
|
26
|
-
* Sets the color mode of the card.
|
|
27
|
-
* - 'light': Light mode for the card.
|
|
28
|
-
* - 'dark': Dark mode for the card.
|
|
29
|
-
* @default 'light'
|
|
30
|
-
*/
|
|
31
|
-
this.colorMode = input('light', ...(ngDevMode ? [{ debugName: "colorMode" }] : []));
|
|
32
|
-
/**
|
|
33
|
-
* The URL that the card should link to (if set).
|
|
34
|
-
* If not set, the card acts as a normal card.
|
|
35
|
-
*/
|
|
36
|
-
this.href = input('', ...(ngDevMode ? [{ debugName: "href" }] : []));
|
|
37
|
-
/**
|
|
38
|
-
* The target attribute for the link.
|
|
39
|
-
* Applicable only if `href` is set.
|
|
40
|
-
* @default '_self'
|
|
41
|
-
*/
|
|
42
|
-
this.target = input('_self', ...(ngDevMode ? [{ debugName: "target" }] : []));
|
|
43
|
-
this.containerClasses = computed(() => {
|
|
44
|
-
const classes = [];
|
|
45
|
-
classes.push(this.type());
|
|
46
|
-
classes.push(this.colorMode());
|
|
47
|
-
if (this.href())
|
|
48
|
-
classes.push('cardLink');
|
|
49
|
-
if (this.hasPadding())
|
|
50
|
-
classes.push('hasPadding');
|
|
51
|
-
if (this.hasShadow())
|
|
52
|
-
classes.push('hasShadow');
|
|
53
|
-
return classes.join(' ');
|
|
54
|
-
}, ...(ngDevMode ? [{ debugName: "containerClasses" }] : []));
|
|
55
|
-
this.isLink = computed(() => {
|
|
56
|
-
return !!this.href();
|
|
57
|
-
}, ...(ngDevMode ? [{ debugName: "isLink" }] : []));
|
|
58
|
-
}
|
|
59
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CuraCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
60
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: CuraCardComponent, isStandalone: true, selector: "cura-card", inputs: { hasPadding: { classPropertyName: "hasPadding", publicName: "hasPadding", isSignal: true, isRequired: false, transformFunction: null }, hasShadow: { classPropertyName: "hasShadow", publicName: "hasShadow", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, colorMode: { classPropertyName: "colorMode", publicName: "colorMode", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (isLink()) {\r\n <!-- <a [class]=\"containerClasses()\" [ngStyle]=\"cardStyles()\" [target]=\"target()\" [href]=\"href()\"> -->\r\n <a [class]=\"containerClasses()\" [target]=\"target()\" [href]=\"href()\">\r\n <ng-content></ng-content>\r\n </a>\r\n} @else {\r\n <!-- <div [class]=\"containerClasses()\" [ngStyle]=\"cardStyles()\"> -->\r\n <div [class]=\"containerClasses()\">\r\n <ng-content></ng-content>\r\n </div>\r\n}\r\n", styles: [":host{display:block;box-sizing:border-box;font-size:var(--cura-font-size);font-family:var(--cura-font-body)}a::ng-deep>*,div::ng-deep>*{display:flex;align-items:center;justify-content:center;font-size:var(--cura-font-size);font-family:var(--cura-font-body)}a{display:block;text-decoration:none!important;color:inherit}.solid{background-color:#fff;border:2px solid rgb(183,183,183);border-radius:12px;overflow:hidden;padding:0;box-shadow:none}.solid ::ng-deep>*{border-radius:0}.solid.hasPadding{padding:20px}.solid.hasPadding ::ng-deep>*{border-radius:4px!important}.solid.hasShadow{border:2px solid rgb(183,183,183);box-shadow:0 1px 4px 0 var(rgba(38, 38, 38, .16), rgba(38, 38, 38, .16))}.solid.cardLink{background-color:#fff;border:2px solid var(--cura-color-primary-500);border-radius:12px;padding:0;box-shadow:none;cursor:pointer}.solid.cardLink ::ng-deep>*{border-radius:0}.solid.cardLink:hover{border:2px solid var(--cura-color-primary-100)!important}.solid.cardLink.hasPadding{padding:20px}.solid.cardLink.hasPadding ::ng-deep>*{border-radius:4px!important}.solid.cardLink.hasPadding:hover{border:2px solid var(--cura-color-primary-100)!important}.solid.cardLink.hasShadow{border:2px solid var(--cura-color-primary-500);box-shadow:0 4px 8px 0 var(rgba(38, 38, 38, .16), rgba(38, 38, 38, .16))}.solid.cardLink:not(.hasPadding).hasShadow ::ng-deep>*{border-radius:12px!important}.solid.cardLink.dark{background-color:#fff;border:2px solid rgb(255,255,255)}.solid.cardLink.dark:hover{border:2px solid var(--cura-color-primary-100)}.transparent{background-color:transparent;border:0;border-radius:12px;padding:0;overflow:hidden}.transparent ::ng-deep>*{border-radius:12px}.transparent.hasPadding{padding:20px}.transparent.hasPadding ::ng-deep>*{border-radius:4px}.transparent.cardLink{background-color:transparent;border:2px solid var(--cura-color-primary-500);overflow:hidden;border-radius:12px;padding:0;box-shadow:none}.transparent.cardLink ::ng-deep>*{border-radius:0!important}.transparent.cardLink:hover{border:2px solid var(--cura-color-primary-100)!important}.transparent.cardLink.light{background-color:#fff;border:2px solid var(--cura-color-primary-500)}.transparent.cardLink.light ::ng-deep>*{border-radius:12px!important}.transparent.cardLink.light:hover{border-color:var(--cura-color-primary-100)!important}.transparent.cardLink.dark{background-color:transparent;border:2px solid rgb(255,255,255)}.transparent.cardLink.dark:hover{border:0}.transparent.cardLink.hasPadding{padding:20px}.transparent.cardLink.hasPadding ::ng-deep>*{border-radius:4px!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
61
|
-
}
|
|
62
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CuraCardComponent, decorators: [{
|
|
63
|
-
type: Component,
|
|
64
|
-
args: [{ selector: 'cura-card', imports: [CommonModule], template: "@if (isLink()) {\r\n <!-- <a [class]=\"containerClasses()\" [ngStyle]=\"cardStyles()\" [target]=\"target()\" [href]=\"href()\"> -->\r\n <a [class]=\"containerClasses()\" [target]=\"target()\" [href]=\"href()\">\r\n <ng-content></ng-content>\r\n </a>\r\n} @else {\r\n <!-- <div [class]=\"containerClasses()\" [ngStyle]=\"cardStyles()\"> -->\r\n <div [class]=\"containerClasses()\">\r\n <ng-content></ng-content>\r\n </div>\r\n}\r\n", styles: [":host{display:block;box-sizing:border-box;font-size:var(--cura-font-size);font-family:var(--cura-font-body)}a::ng-deep>*,div::ng-deep>*{display:flex;align-items:center;justify-content:center;font-size:var(--cura-font-size);font-family:var(--cura-font-body)}a{display:block;text-decoration:none!important;color:inherit}.solid{background-color:#fff;border:2px solid rgb(183,183,183);border-radius:12px;overflow:hidden;padding:0;box-shadow:none}.solid ::ng-deep>*{border-radius:0}.solid.hasPadding{padding:20px}.solid.hasPadding ::ng-deep>*{border-radius:4px!important}.solid.hasShadow{border:2px solid rgb(183,183,183);box-shadow:0 1px 4px 0 var(rgba(38, 38, 38, .16), rgba(38, 38, 38, .16))}.solid.cardLink{background-color:#fff;border:2px solid var(--cura-color-primary-500);border-radius:12px;padding:0;box-shadow:none;cursor:pointer}.solid.cardLink ::ng-deep>*{border-radius:0}.solid.cardLink:hover{border:2px solid var(--cura-color-primary-100)!important}.solid.cardLink.hasPadding{padding:20px}.solid.cardLink.hasPadding ::ng-deep>*{border-radius:4px!important}.solid.cardLink.hasPadding:hover{border:2px solid var(--cura-color-primary-100)!important}.solid.cardLink.hasShadow{border:2px solid var(--cura-color-primary-500);box-shadow:0 4px 8px 0 var(rgba(38, 38, 38, .16), rgba(38, 38, 38, .16))}.solid.cardLink:not(.hasPadding).hasShadow ::ng-deep>*{border-radius:12px!important}.solid.cardLink.dark{background-color:#fff;border:2px solid rgb(255,255,255)}.solid.cardLink.dark:hover{border:2px solid var(--cura-color-primary-100)}.transparent{background-color:transparent;border:0;border-radius:12px;padding:0;overflow:hidden}.transparent ::ng-deep>*{border-radius:12px}.transparent.hasPadding{padding:20px}.transparent.hasPadding ::ng-deep>*{border-radius:4px}.transparent.cardLink{background-color:transparent;border:2px solid var(--cura-color-primary-500);overflow:hidden;border-radius:12px;padding:0;box-shadow:none}.transparent.cardLink ::ng-deep>*{border-radius:0!important}.transparent.cardLink:hover{border:2px solid var(--cura-color-primary-100)!important}.transparent.cardLink.light{background-color:#fff;border:2px solid var(--cura-color-primary-500)}.transparent.cardLink.light ::ng-deep>*{border-radius:12px!important}.transparent.cardLink.light:hover{border-color:var(--cura-color-primary-100)!important}.transparent.cardLink.dark{background-color:transparent;border:2px solid rgb(255,255,255)}.transparent.cardLink.dark:hover{border:0}.transparent.cardLink.hasPadding{padding:20px}.transparent.cardLink.hasPadding ::ng-deep>*{border-radius:4px!important}\n"] }]
|
|
65
|
-
}], propDecorators: { hasPadding: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasPadding", required: false }] }], hasShadow: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasShadow", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], colorMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "colorMode", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }] } });
|
|
66
|
-
|
|
67
|
-
/**
|
|
68
|
-
* Generated bundle index. Do not edit.
|
|
69
|
-
*/
|
|
70
|
-
|
|
71
|
-
export { CuraCardComponent };
|
|
72
|
-
//# sourceMappingURL=rededor-site-front-end-lib-cura-cards-cura-card.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"rededor-site-front-end-lib-cura-cards-cura-card.mjs","sources":["../../../projects/site-front-end-lib/cura/cards/cura-card/cura-card.component.ts","../../../projects/site-front-end-lib/cura/cards/cura-card/cura-card.component.html","../../../projects/site-front-end-lib/cura/cards/cura-card/rededor-site-front-end-lib-cura-cards-cura-card.ts"],"sourcesContent":["import { Component, input, computed } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n// import { CuraApiService } from '@rededor/site-front-end-lib/cura/api';\r\nimport { CardType, CardColorMode, CardTarget } from './cura-cards.definitions';\r\n\r\n@Component({\r\n selector: 'cura-card',\r\n imports: [CommonModule],\r\n templateUrl: './cura-card.component.html',\r\n styleUrls: ['./cura-card.component.scss'],\r\n})\r\nexport class CuraCardComponent {\r\n // private curaApi = inject(CuraApiService);\r\n\r\n /**\r\n * Determines whether the card should have padding.\r\n * @default true\r\n */\r\n hasPadding = input<boolean>(true);\r\n\r\n /**\r\n * Determines whether the card should have a shadow effect.\r\n * @default false\r\n */\r\n hasShadow = input<boolean>(false);\r\n\r\n /**\r\n * Sets the type of the card background.\r\n * - 'solid': A solid background.\r\n * - 'transparent': A transparent background.\r\n * @default 'solid'\r\n */\r\n type = input<CardType>('solid');\r\n\r\n /**\r\n * Sets the color mode of the card.\r\n * - 'light': Light mode for the card.\r\n * - 'dark': Dark mode for the card.\r\n * @default 'light'\r\n */\r\n colorMode = input<CardColorMode>('light');\r\n\r\n /**\r\n * The URL that the card should link to (if set).\r\n * If not set, the card acts as a normal card.\r\n */\r\n href = input<string>('');\r\n\r\n /**\r\n * The target attribute for the link.\r\n * Applicable only if `href` is set.\r\n * @default '_self'\r\n */\r\n target = input<CardTarget>('_self');\r\n\r\n containerClasses = computed(() => {\r\n const classes = [];\r\n\r\n classes.push(this.type());\r\n classes.push(this.colorMode());\r\n\r\n if (this.href()) classes.push('cardLink');\r\n if (this.hasPadding()) classes.push('hasPadding');\r\n if (this.hasShadow()) classes.push('hasShadow');\r\n\r\n return classes.join(' ');\r\n });\r\n\r\n isLink = computed(() => {\r\n return !!this.href();\r\n });\r\n\r\n // // Computed signal\r\n // cardStyles = computed(() => {\r\n // const styles: { [key: string]: string } = {};\r\n\r\n // styles['--base-spacing'] = this.curaApi.theme.spacing.getSpacing();\r\n // styles['--neutral-purewhite'] = this.curaApi.theme.colors.getColor('neutral-purewhite');\r\n // styles['--neutral-base'] = this.curaApi.theme.colors.getColor('neutral-base');\r\n // styles['--neutral-black-shadow'] = this.curaApi.theme.colors.getColor('neutral-black', 0.16);\r\n // styles['--primary-lighter'] = this.curaApi.theme.colors.getColor('primary-lighter');\r\n // styles['--primary-base'] = this.curaApi.theme.colors.getColor('primary-base');\r\n // styles['--font-size'] = this.curaApi.theme.fonts.getSize();\r\n // styles['--font-family'] = this.curaApi.theme.fonts.getFamily();\r\n // styles['--font-weight-medium'] = this.curaApi.theme.fonts.getWeights().medium;\r\n\r\n // return styles;\r\n // });\r\n}\r\n","@if (isLink()) {\r\n <!-- <a [class]=\"containerClasses()\" [ngStyle]=\"cardStyles()\" [target]=\"target()\" [href]=\"href()\"> -->\r\n <a [class]=\"containerClasses()\" [target]=\"target()\" [href]=\"href()\">\r\n <ng-content></ng-content>\r\n </a>\r\n} @else {\r\n <!-- <div [class]=\"containerClasses()\" [ngStyle]=\"cardStyles()\"> -->\r\n <div [class]=\"containerClasses()\">\r\n <ng-content></ng-content>\r\n </div>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|