@luzmo/ngx-lucero 1.0.3-alpha.0 → 1.0.3-alpha.2
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.
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { OnChanges, SimpleChanges } from '@angular/core';
|
|
2
2
|
import { ControlValueAccessor } from '@angular/forms';
|
|
3
3
|
import '@luzmo/lucero/action-button';
|
|
4
|
-
import type { LuzmoActionButton as LuzmoActionButtonHostElement } from '@luzmo/lucero/action-button';
|
|
4
|
+
import type { LuzmoActionButton as LuzmoActionButtonHostElement, ActionButtonVariants } from '@luzmo/lucero/action-button';
|
|
5
5
|
import * as i0 from "@angular/core";
|
|
6
|
+
export type { ActionButtonVariants } from '@luzmo/lucero/action-button';
|
|
6
7
|
export declare class LuzmoActionButton implements OnChanges, ControlValueAccessor {
|
|
7
8
|
private readonly elementRef;
|
|
8
9
|
private readonly renderer;
|
|
@@ -25,6 +26,8 @@ export declare class LuzmoActionButton implements OnChanges, ControlValueAccesso
|
|
|
25
26
|
toggles?: boolean;
|
|
26
27
|
/** The static color variant to use for the action button. */
|
|
27
28
|
staticColor?: 'white' | 'black';
|
|
29
|
+
/** The appearance preset to apply to this action button. - `neutral` (default): the standard action button. - `pill`: a content-width chip using the standard action-button radius. - `accent`: a content-width chip with a soft, primary-tinted theme. */
|
|
30
|
+
variant?: ActionButtonVariants;
|
|
28
31
|
/** The value of the Action Button */
|
|
29
32
|
value?: string;
|
|
30
33
|
size?: ('xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl');
|
|
@@ -73,7 +76,7 @@ export declare class LuzmoActionButton implements OnChanges, ControlValueAccesso
|
|
|
73
76
|
setDisabledState(isDisabled: boolean): void;
|
|
74
77
|
focus(options?: FocusOptions): void;
|
|
75
78
|
static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoActionButton, never>;
|
|
76
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoActionButton, "luzmo-action-button", ["luzmoActionButton"], { "emphasized": { "alias": "emphasized"; "required": false; }; "holdAffordance": { "alias": "holdAffordance"; "required": false; }; "quiet": { "alias": "quiet"; "required": false; }; "role": { "alias": "role"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "toggles": { "alias": "toggles"; "required": false; }; "staticColor": { "alias": "staticColor"; "required": false; }; "value": { "alias": "value"; "required": false; }; "size": { "alias": "size"; "required": false; }; "download": { "alias": "download"; "required": false; }; "label": { "alias": "label"; "required": false; }; "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "referrerpolicy": { "alias": "referrerpolicy"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "active": { "alias": "active"; "required": false; }; "type": { "alias": "type"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "longpressEvent": "longpress"; "changeEvent": "change"; "keydownEvent": "keydown"; }, never, ["*"], true, never>;
|
|
79
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoActionButton, "luzmo-action-button", ["luzmoActionButton"], { "emphasized": { "alias": "emphasized"; "required": false; }; "holdAffordance": { "alias": "holdAffordance"; "required": false; }; "quiet": { "alias": "quiet"; "required": false; }; "role": { "alias": "role"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "toggles": { "alias": "toggles"; "required": false; }; "staticColor": { "alias": "staticColor"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "value": { "alias": "value"; "required": false; }; "size": { "alias": "size"; "required": false; }; "download": { "alias": "download"; "required": false; }; "label": { "alias": "label"; "required": false; }; "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "referrerpolicy": { "alias": "referrerpolicy"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "active": { "alias": "active"; "required": false; }; "type": { "alias": "type"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "longpressEvent": "longpress"; "changeEvent": "change"; "keydownEvent": "keydown"; }, never, ["*"], true, never>;
|
|
77
80
|
}
|
|
78
81
|
/** The underlying custom element type for LuzmoActionButton */
|
|
79
82
|
export type LuzmoActionButtonElement = LuzmoActionButtonHostElement;
|
|
@@ -33,6 +33,8 @@ export class LuzmoActionButton {
|
|
|
33
33
|
toggles;
|
|
34
34
|
/** The static color variant to use for the action button. */
|
|
35
35
|
staticColor;
|
|
36
|
+
/** The appearance preset to apply to this action button. - `neutral` (default): the standard action button. - `pill`: a content-width chip using the standard action-button radius. - `accent`: a content-width chip with a soft, primary-tinted theme. */
|
|
37
|
+
variant;
|
|
36
38
|
/** The value of the Action Button */
|
|
37
39
|
value;
|
|
38
40
|
size;
|
|
@@ -93,6 +95,9 @@ export class LuzmoActionButton {
|
|
|
93
95
|
case 'staticColor':
|
|
94
96
|
this.setHostProperty('staticColor', changes['staticColor'].currentValue);
|
|
95
97
|
break;
|
|
98
|
+
case 'variant':
|
|
99
|
+
this.setHostProperty('variant', changes['variant'].currentValue);
|
|
100
|
+
break;
|
|
96
101
|
case 'value':
|
|
97
102
|
this.setHostProperty('value', changes['value'].currentValue);
|
|
98
103
|
break;
|
|
@@ -204,7 +209,7 @@ export class LuzmoActionButton {
|
|
|
204
209
|
return this.host.focus(options);
|
|
205
210
|
}
|
|
206
211
|
static ɵfac = function LuzmoActionButton_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoActionButton)(); };
|
|
207
|
-
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoActionButton, selectors: [["luzmo-action-button"]], inputs: { emphasized: "emphasized", holdAffordance: "holdAffordance", quiet: "quiet", role: "role", selected: "selected", toggles: "toggles", staticColor: "staticColor", value: "value", size: "size", download: "download", label: "label", href: "href", target: "target", referrerpolicy: "referrerpolicy", rel: "rel", active: "active", type: "type", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { longpressEvent: "longpress", changeEvent: "change", keydownEvent: "keydown" }, exportAs: ["luzmoActionButton"], features: [i0.ɵɵProvidersFeature([
|
|
212
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoActionButton, selectors: [["luzmo-action-button"]], inputs: { emphasized: "emphasized", holdAffordance: "holdAffordance", quiet: "quiet", role: "role", selected: "selected", toggles: "toggles", staticColor: "staticColor", variant: "variant", value: "value", size: "size", download: "download", label: "label", href: "href", target: "target", referrerpolicy: "referrerpolicy", rel: "rel", active: "active", type: "type", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { longpressEvent: "longpress", changeEvent: "change", keydownEvent: "keydown" }, exportAs: ["luzmoActionButton"], features: [i0.ɵɵProvidersFeature([
|
|
208
213
|
{
|
|
209
214
|
provide: NG_VALUE_ACCESSOR,
|
|
210
215
|
useExisting: forwardRef(() => LuzmoActionButton),
|
|
@@ -252,6 +257,9 @@ export class LuzmoActionButton {
|
|
|
252
257
|
}], staticColor: [{
|
|
253
258
|
type: Input,
|
|
254
259
|
args: [{ alias: 'staticColor' }]
|
|
260
|
+
}], variant: [{
|
|
261
|
+
type: Input,
|
|
262
|
+
args: [{ alias: 'variant' }]
|
|
255
263
|
}], value: [{
|
|
256
264
|
type: Input,
|
|
257
265
|
args: [{ alias: 'value' }]
|
|
@@ -289,4 +297,4 @@ export class LuzmoActionButton {
|
|
|
289
297
|
type: Input,
|
|
290
298
|
args: [{ alias: 'tabIndex' }]
|
|
291
299
|
}], longpressEvent: [{ type: i0.Output, args: ["longpress"] }], changeEvent: [{ type: i0.Output, args: ["change"] }], keydownEvent: [{ type: i0.Output, args: ["keydown"] }] }); })();
|
|
292
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoActionButton, { className: "LuzmoActionButton", filePath: "components/action-button.ts", lineNumber:
|
|
300
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoActionButton, { className: "LuzmoActionButton", filePath: "components/action-button.ts", lineNumber: 27 }); })();
|
package/esm/index.d.ts
CHANGED
|
@@ -51,7 +51,6 @@ import { LuzmoSelect } from './components/select.js';
|
|
|
51
51
|
import { LuzmoSkeletonLoader } from './components/skeleton-loader.js';
|
|
52
52
|
import { LuzmoSlider } from './components/slider.js';
|
|
53
53
|
import { LuzmoStatusLight } from './components/status-light.js';
|
|
54
|
-
import { LuzmoSuggestion } from './components/suggestion.js';
|
|
55
54
|
import { LuzmoSwatch } from './components/swatch.js';
|
|
56
55
|
import { LuzmoSwatchGroup } from './components/swatch-group.js';
|
|
57
56
|
import { LuzmoSwitch } from './components/switch.js';
|
|
@@ -119,7 +118,6 @@ export { LuzmoSelect, type LuzmoSelectElement } from './components/select.js';
|
|
|
119
118
|
export { LuzmoSkeletonLoader, type LuzmoSkeletonLoaderElement } from './components/skeleton-loader.js';
|
|
120
119
|
export { LuzmoSlider, type LuzmoSliderElement } from './components/slider.js';
|
|
121
120
|
export { LuzmoStatusLight, type LuzmoStatusLightElement } from './components/status-light.js';
|
|
122
|
-
export { LuzmoSuggestion, type LuzmoSuggestionElement } from './components/suggestion.js';
|
|
123
121
|
export { LuzmoSwatch, type LuzmoSwatchElement } from './components/swatch.js';
|
|
124
122
|
export { LuzmoSwatchGroup, type LuzmoSwatchGroupElement } from './components/swatch-group.js';
|
|
125
123
|
export { LuzmoSwitch, type LuzmoSwitchElement } from './components/switch.js';
|
|
@@ -134,6 +132,6 @@ export { LuzmoToast, type LuzmoToastElement } from './components/toast.js';
|
|
|
134
132
|
export { LuzmoTooltip, type LuzmoTooltipElement } from './components/tooltip.js';
|
|
135
133
|
export { LuzmoTopNav, type LuzmoTopNavElement } from './components/top-nav.js';
|
|
136
134
|
export { LuzmoTopNavItem, type LuzmoTopNavItemElement } from './components/top-nav-item.js';
|
|
137
|
-
export declare const LUZMO_ANGULAR_COMPONENTS: readonly [typeof LuzmoAccordion, typeof LuzmoAccordionItem, typeof LuzmoActionBar, typeof LuzmoActionButton, typeof LuzmoActionGroup, typeof LuzmoActionMenu, typeof LuzmoAvatar, typeof LuzmoBadge, typeof LuzmoButton, typeof LuzmoButtonGroup, typeof LuzmoCalendar, typeof LuzmoChatMessage, typeof LuzmoChatMessageGroup, typeof LuzmoCheckbox, typeof LuzmoClearButton, typeof LuzmoCloseButton, typeof LuzmoColorArea, typeof LuzmoColorField, typeof LuzmoColorHandle, typeof LuzmoColorLoupe, typeof LuzmoColorMenu, typeof LuzmoColorPalette, typeof LuzmoColorPaletteGroup, typeof LuzmoColorPicker, typeof LuzmoColorSlider, typeof LuzmoDateRangePicker, typeof LuzmoDateTimePicker, typeof LuzmoDivider, typeof LuzmoFieldGroup, typeof LuzmoFieldLabel, typeof LuzmoHelpText, typeof LuzmoIcon, typeof LuzmoInfieldButton, typeof LuzmoLabel, typeof LuzmoMenu, typeof LuzmoMultiLanguageField, typeof LuzmoNumberField, typeof LuzmoOptions, typeof LuzmoOverlay, typeof LuzmoPicker, typeof LuzmoPickerButton, typeof LuzmoPopover, typeof LuzmoProgressBar, typeof LuzmoProgressCircle, typeof LuzmoProgressSteps, typeof LuzmoPromptBox, typeof LuzmoRadio, typeof LuzmoRadioGroup, typeof LuzmoSearch, typeof LuzmoSelect, typeof LuzmoSkeletonLoader, typeof LuzmoSlider, typeof LuzmoStatusLight, typeof
|
|
138
|
-
export declare const LUZMO_ANGULAR_COMPONENT_NAMES: readonly ["LuzmoAccordion", "LuzmoAccordionItem", "LuzmoActionBar", "LuzmoActionButton", "LuzmoActionGroup", "LuzmoActionMenu", "LuzmoAvatar", "LuzmoBadge", "LuzmoButton", "LuzmoButtonGroup", "LuzmoCalendar", "LuzmoChatMessage", "LuzmoChatMessageGroup", "LuzmoCheckbox", "LuzmoClearButton", "LuzmoCloseButton", "LuzmoColorArea", "LuzmoColorField", "LuzmoColorHandle", "LuzmoColorLoupe", "LuzmoColorMenu", "LuzmoColorPalette", "LuzmoColorPaletteGroup", "LuzmoColorPicker", "LuzmoColorSlider", "LuzmoDateRangePicker", "LuzmoDateTimePicker", "LuzmoDivider", "LuzmoFieldGroup", "LuzmoFieldLabel", "LuzmoHelpText", "LuzmoIcon", "LuzmoInfieldButton", "LuzmoLabel", "LuzmoMenu", "LuzmoMultiLanguageField", "LuzmoNumberField", "LuzmoOptions", "LuzmoOverlay", "LuzmoPicker", "LuzmoPickerButton", "LuzmoPopover", "LuzmoProgressBar", "LuzmoProgressCircle", "LuzmoProgressSteps", "LuzmoPromptBox", "LuzmoRadio", "LuzmoRadioGroup", "LuzmoSearch", "LuzmoSelect", "LuzmoSkeletonLoader", "LuzmoSlider", "LuzmoStatusLight", "
|
|
135
|
+
export declare const LUZMO_ANGULAR_COMPONENTS: readonly [typeof LuzmoAccordion, typeof LuzmoAccordionItem, typeof LuzmoActionBar, typeof LuzmoActionButton, typeof LuzmoActionGroup, typeof LuzmoActionMenu, typeof LuzmoAvatar, typeof LuzmoBadge, typeof LuzmoButton, typeof LuzmoButtonGroup, typeof LuzmoCalendar, typeof LuzmoChatMessage, typeof LuzmoChatMessageGroup, typeof LuzmoCheckbox, typeof LuzmoClearButton, typeof LuzmoCloseButton, typeof LuzmoColorArea, typeof LuzmoColorField, typeof LuzmoColorHandle, typeof LuzmoColorLoupe, typeof LuzmoColorMenu, typeof LuzmoColorPalette, typeof LuzmoColorPaletteGroup, typeof LuzmoColorPicker, typeof LuzmoColorSlider, typeof LuzmoDateRangePicker, typeof LuzmoDateTimePicker, typeof LuzmoDivider, typeof LuzmoFieldGroup, typeof LuzmoFieldLabel, typeof LuzmoHelpText, typeof LuzmoIcon, typeof LuzmoInfieldButton, typeof LuzmoLabel, typeof LuzmoMenu, typeof LuzmoMultiLanguageField, typeof LuzmoNumberField, typeof LuzmoOptions, typeof LuzmoOverlay, typeof LuzmoPicker, typeof LuzmoPickerButton, typeof LuzmoPopover, typeof LuzmoProgressBar, typeof LuzmoProgressCircle, typeof LuzmoProgressSteps, typeof LuzmoPromptBox, typeof LuzmoRadio, typeof LuzmoRadioGroup, typeof LuzmoSearch, typeof LuzmoSelect, typeof LuzmoSkeletonLoader, typeof LuzmoSlider, typeof LuzmoStatusLight, typeof LuzmoSwatch, typeof LuzmoSwatchGroup, typeof LuzmoSwitch, typeof LuzmoTab, typeof LuzmoTabPanel, typeof LuzmoTabs, typeof LuzmoTabsOverflow, typeof LuzmoTag, typeof LuzmoTags, typeof LuzmoTextField, typeof LuzmoToast, typeof LuzmoTooltip, typeof LuzmoTopNav, typeof LuzmoTopNavItem];
|
|
136
|
+
export declare const LUZMO_ANGULAR_COMPONENT_NAMES: readonly ["LuzmoAccordion", "LuzmoAccordionItem", "LuzmoActionBar", "LuzmoActionButton", "LuzmoActionGroup", "LuzmoActionMenu", "LuzmoAvatar", "LuzmoBadge", "LuzmoButton", "LuzmoButtonGroup", "LuzmoCalendar", "LuzmoChatMessage", "LuzmoChatMessageGroup", "LuzmoCheckbox", "LuzmoClearButton", "LuzmoCloseButton", "LuzmoColorArea", "LuzmoColorField", "LuzmoColorHandle", "LuzmoColorLoupe", "LuzmoColorMenu", "LuzmoColorPalette", "LuzmoColorPaletteGroup", "LuzmoColorPicker", "LuzmoColorSlider", "LuzmoDateRangePicker", "LuzmoDateTimePicker", "LuzmoDivider", "LuzmoFieldGroup", "LuzmoFieldLabel", "LuzmoHelpText", "LuzmoIcon", "LuzmoInfieldButton", "LuzmoLabel", "LuzmoMenu", "LuzmoMultiLanguageField", "LuzmoNumberField", "LuzmoOptions", "LuzmoOverlay", "LuzmoPicker", "LuzmoPickerButton", "LuzmoPopover", "LuzmoProgressBar", "LuzmoProgressCircle", "LuzmoProgressSteps", "LuzmoPromptBox", "LuzmoRadio", "LuzmoRadioGroup", "LuzmoSearch", "LuzmoSelect", "LuzmoSkeletonLoader", "LuzmoSlider", "LuzmoStatusLight", "LuzmoSwatch", "LuzmoSwatchGroup", "LuzmoSwitch", "LuzmoTab", "LuzmoTabPanel", "LuzmoTabs", "LuzmoTabsOverflow", "LuzmoTag", "LuzmoTags", "LuzmoTextField", "LuzmoToast", "LuzmoTooltip", "LuzmoTopNav", "LuzmoTopNavItem"];
|
|
139
137
|
export type LuzmoAngularComponentName = (typeof LUZMO_ANGULAR_COMPONENT_NAMES)[number];
|
package/esm/index.js
CHANGED
|
@@ -52,7 +52,6 @@ import { LuzmoSelect } from './components/select.js';
|
|
|
52
52
|
import { LuzmoSkeletonLoader } from './components/skeleton-loader.js';
|
|
53
53
|
import { LuzmoSlider } from './components/slider.js';
|
|
54
54
|
import { LuzmoStatusLight } from './components/status-light.js';
|
|
55
|
-
import { LuzmoSuggestion } from './components/suggestion.js';
|
|
56
55
|
import { LuzmoSwatch } from './components/swatch.js';
|
|
57
56
|
import { LuzmoSwatchGroup } from './components/swatch-group.js';
|
|
58
57
|
import { LuzmoSwitch } from './components/switch.js';
|
|
@@ -120,7 +119,6 @@ export { LuzmoSelect } from './components/select.js';
|
|
|
120
119
|
export { LuzmoSkeletonLoader } from './components/skeleton-loader.js';
|
|
121
120
|
export { LuzmoSlider } from './components/slider.js';
|
|
122
121
|
export { LuzmoStatusLight } from './components/status-light.js';
|
|
123
|
-
export { LuzmoSuggestion } from './components/suggestion.js';
|
|
124
122
|
export { LuzmoSwatch } from './components/swatch.js';
|
|
125
123
|
export { LuzmoSwatchGroup } from './components/swatch-group.js';
|
|
126
124
|
export { LuzmoSwitch } from './components/switch.js';
|
|
@@ -189,7 +187,6 @@ export const LUZMO_ANGULAR_COMPONENTS = [
|
|
|
189
187
|
LuzmoSkeletonLoader,
|
|
190
188
|
LuzmoSlider,
|
|
191
189
|
LuzmoStatusLight,
|
|
192
|
-
LuzmoSuggestion,
|
|
193
190
|
LuzmoSwatch,
|
|
194
191
|
LuzmoSwatchGroup,
|
|
195
192
|
LuzmoSwitch,
|
|
@@ -259,7 +256,6 @@ export const LUZMO_ANGULAR_COMPONENT_NAMES = [
|
|
|
259
256
|
'LuzmoSkeletonLoader',
|
|
260
257
|
'LuzmoSlider',
|
|
261
258
|
'LuzmoStatusLight',
|
|
262
|
-
'LuzmoSuggestion',
|
|
263
259
|
'LuzmoSwatch',
|
|
264
260
|
'LuzmoSwatchGroup',
|
|
265
261
|
'LuzmoSwitch',
|
package/package.json
CHANGED
|
@@ -29,9 +29,9 @@
|
|
|
29
29
|
"peerDependencies": {
|
|
30
30
|
"@angular/core": "^17.3.0 || ^18.0.0 || ^19.0.0 || ^20.0.0 || ^21.0.0",
|
|
31
31
|
"@angular/forms": "^17.3.0 || ^18.0.0 || ^19.0.0 || ^20.0.0 || ^21.0.0",
|
|
32
|
-
"@luzmo/lucero": "1.0.3-alpha.
|
|
32
|
+
"@luzmo/lucero": "1.0.3-alpha.2"
|
|
33
33
|
},
|
|
34
|
-
"version": "1.0.3-alpha.
|
|
34
|
+
"version": "1.0.3-alpha.2",
|
|
35
35
|
"peerDependenciesMeta": {
|
|
36
36
|
"@angular/forms": {
|
|
37
37
|
"optional": true
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import { OnChanges, SimpleChanges } from '@angular/core';
|
|
2
|
-
import '@luzmo/lucero/suggestion';
|
|
3
|
-
import type { LuzmoSuggestion as LuzmoSuggestionHostElement, SuggestionVariants } from '@luzmo/lucero/suggestion';
|
|
4
|
-
import * as i0 from "@angular/core";
|
|
5
|
-
export type { SuggestionVariants } from '@luzmo/lucero/suggestion';
|
|
6
|
-
export declare class LuzmoSuggestion implements OnChanges {
|
|
7
|
-
private readonly elementRef;
|
|
8
|
-
private readonly renderer;
|
|
9
|
-
private readonly destroyRef;
|
|
10
|
-
private readonly host;
|
|
11
|
-
private readonly listenerCleanup;
|
|
12
|
-
/** The underlying custom element instance. Use to call imperative methods. */
|
|
13
|
-
get nativeElement(): LuzmoSuggestionHostElement;
|
|
14
|
-
variant?: SuggestionVariants;
|
|
15
|
-
disabled?: boolean;
|
|
16
|
-
constructor();
|
|
17
|
-
ngOnChanges(changes: SimpleChanges): void;
|
|
18
|
-
/**
|
|
19
|
-
* Forward a wrapper @Input to the underlying host element via Renderer2 so
|
|
20
|
-
* the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
|
|
21
|
-
* Unlike a "skip undefined" guard, this lets consumers reset values back to
|
|
22
|
-
* undefined / null by clearing their bindings.
|
|
23
|
-
*/
|
|
24
|
-
private setHostProperty;
|
|
25
|
-
private bindEvents;
|
|
26
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoSuggestion, never>;
|
|
27
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSuggestion, "luzmo-suggestion", ["luzmoSuggestion"], { "variant": { "alias": "variant"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
28
|
-
}
|
|
29
|
-
/** The underlying custom element type for LuzmoSuggestion */
|
|
30
|
-
export type LuzmoSuggestionElement = LuzmoSuggestionHostElement;
|
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, Renderer2 } from '@angular/core';
|
|
2
|
-
import '@luzmo/lucero/suggestion';
|
|
3
|
-
import * as i0 from "@angular/core";
|
|
4
|
-
const _c0 = ["*"];
|
|
5
|
-
/**
|
|
6
|
-
* Angular wrapper component for <luzmo-suggestion>
|
|
7
|
-
*
|
|
8
|
-
* @slot (default) - text label of the suggestion
|
|
9
|
-
* @slot icon - an icon element to display before the label
|
|
10
|
-
*/
|
|
11
|
-
export class LuzmoSuggestion {
|
|
12
|
-
elementRef = inject(ElementRef);
|
|
13
|
-
renderer = inject(Renderer2);
|
|
14
|
-
destroyRef = inject(DestroyRef);
|
|
15
|
-
host = this.elementRef.nativeElement;
|
|
16
|
-
listenerCleanup = [];
|
|
17
|
-
/** The underlying custom element instance. Use to call imperative methods. */
|
|
18
|
-
get nativeElement() {
|
|
19
|
-
return this.host;
|
|
20
|
-
}
|
|
21
|
-
variant;
|
|
22
|
-
disabled;
|
|
23
|
-
constructor() {
|
|
24
|
-
this.bindEvents();
|
|
25
|
-
this.destroyRef.onDestroy(() => {
|
|
26
|
-
for (const cleanup of this.listenerCleanup) {
|
|
27
|
-
cleanup();
|
|
28
|
-
}
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
ngOnChanges(changes) {
|
|
32
|
-
for (const key of Object.keys(changes)) {
|
|
33
|
-
switch (key) {
|
|
34
|
-
case 'variant':
|
|
35
|
-
this.setHostProperty('variant', changes['variant'].currentValue);
|
|
36
|
-
break;
|
|
37
|
-
case 'disabled':
|
|
38
|
-
this.setHostProperty('disabled', changes['disabled'].currentValue);
|
|
39
|
-
break;
|
|
40
|
-
default:
|
|
41
|
-
break;
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
/**
|
|
46
|
-
* Forward a wrapper @Input to the underlying host element via Renderer2 so
|
|
47
|
-
* the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
|
|
48
|
-
* Unlike a "skip undefined" guard, this lets consumers reset values back to
|
|
49
|
-
* undefined / null by clearing their bindings.
|
|
50
|
-
*/
|
|
51
|
-
setHostProperty(key, value) {
|
|
52
|
-
this.renderer.setProperty(this.host, key, value);
|
|
53
|
-
}
|
|
54
|
-
bindEvents() {
|
|
55
|
-
// No custom events for this wrapper.
|
|
56
|
-
}
|
|
57
|
-
static ɵfac = function LuzmoSuggestion_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoSuggestion)(); };
|
|
58
|
-
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSuggestion, selectors: [["luzmo-suggestion"]], inputs: { variant: "variant", disabled: "disabled" }, exportAs: ["luzmoSuggestion"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoSuggestion_Template(rf, ctx) { if (rf & 1) {
|
|
59
|
-
i0.ɵɵprojectionDef();
|
|
60
|
-
i0.ɵɵprojection(0);
|
|
61
|
-
} }, encapsulation: 2, changeDetection: 0 });
|
|
62
|
-
}
|
|
63
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LuzmoSuggestion, [{
|
|
64
|
-
type: Component,
|
|
65
|
-
args: [{
|
|
66
|
-
selector: 'luzmo-suggestion',
|
|
67
|
-
exportAs: 'luzmoSuggestion',
|
|
68
|
-
standalone: true,
|
|
69
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
70
|
-
template: '<ng-content />'
|
|
71
|
-
}]
|
|
72
|
-
}], () => [], { variant: [{
|
|
73
|
-
type: Input,
|
|
74
|
-
args: [{ alias: 'variant' }]
|
|
75
|
-
}], disabled: [{
|
|
76
|
-
type: Input,
|
|
77
|
-
args: [{ alias: 'disabled' }]
|
|
78
|
-
}] }); })();
|
|
79
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoSuggestion, { className: "LuzmoSuggestion", filePath: "components/suggestion.ts", lineNumber: 19 }); })();
|