@tailng-ui/components 0.17.0 → 0.19.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/package.json +16 -5
- package/src/lib/feedback/empty/tng-empty.component.d.ts +16 -1
- package/src/lib/feedback/empty/tng-empty.component.d.ts.map +1 -1
- package/src/lib/feedback/empty/tng-empty.component.js +47 -57
- package/src/lib/feedback/empty/tng-empty.component.js.map +1 -1
- package/src/lib/feedback/index.d.ts +0 -5
- package/src/lib/feedback/index.d.ts.map +1 -1
- package/src/lib/feedback/index.js +4 -5
- package/src/lib/feedback/index.js.map +1 -1
- package/src/lib/feedback/progress-bar/tng-progress-bar.component.d.ts +4 -0
- package/src/lib/feedback/progress-bar/tng-progress-bar.component.d.ts.map +1 -1
- package/src/lib/feedback/progress-bar/tng-progress-bar.component.js +16 -26
- package/src/lib/feedback/progress-bar/tng-progress-bar.component.js.map +1 -1
- package/src/lib/feedback/progress-spinner/tng-progress-spinner.component.d.ts +4 -0
- package/src/lib/feedback/progress-spinner/tng-progress-spinner.component.d.ts.map +1 -1
- package/src/lib/feedback/progress-spinner/tng-progress-spinner.component.js +18 -32
- package/src/lib/feedback/progress-spinner/tng-progress-spinner.component.js.map +1 -1
- package/src/lib/feedback/skeleton/tng-skeleton.component.d.ts +4 -0
- package/src/lib/feedback/skeleton/tng-skeleton.component.d.ts.map +1 -1
- package/src/lib/feedback/skeleton/tng-skeleton.component.js +14 -20
- package/src/lib/feedback/skeleton/tng-skeleton.component.js.map +1 -1
- package/src/lib/feedback/toast/tng-toast.component.d.ts +4 -1
- package/src/lib/feedback/toast/tng-toast.component.d.ts.map +1 -1
- package/src/lib/feedback/toast/tng-toast.component.js +17 -19
- package/src/lib/feedback/toast/tng-toast.component.js.map +1 -1
- package/src/lib/form/autocomplete/tng-autocomplete.component.d.ts +4 -0
- package/src/lib/form/autocomplete/tng-autocomplete.component.d.ts.map +1 -1
- package/src/lib/form/autocomplete/tng-autocomplete.component.js +46 -49
- package/src/lib/form/autocomplete/tng-autocomplete.component.js.map +1 -1
- package/src/lib/form/button-toggle/tng-button-toggle-group.component.d.ts +3 -0
- package/src/lib/form/button-toggle/tng-button-toggle-group.component.d.ts.map +1 -1
- package/src/lib/form/button-toggle/tng-button-toggle-group.component.js +33 -58
- package/src/lib/form/button-toggle/tng-button-toggle-group.component.js.map +1 -1
- package/src/lib/form/button-toggle/tng-button-toggle.component.d.ts +3 -0
- package/src/lib/form/button-toggle/tng-button-toggle.component.d.ts.map +1 -1
- package/src/lib/form/button-toggle/tng-button-toggle.component.js +15 -26
- package/src/lib/form/button-toggle/tng-button-toggle.component.js.map +1 -1
- package/src/lib/form/checkbox/tng-checkbox.component.d.ts +3 -0
- package/src/lib/form/checkbox/tng-checkbox.component.d.ts.map +1 -1
- package/src/lib/form/checkbox/tng-checkbox.component.js +32 -42
- package/src/lib/form/checkbox/tng-checkbox.component.js.map +1 -1
- package/src/lib/form/chips/tng-chips.component.d.ts +3 -0
- package/src/lib/form/chips/tng-chips.component.d.ts.map +1 -1
- package/src/lib/form/chips/tng-chips.component.js +14 -19
- package/src/lib/form/chips/tng-chips.component.js.map +1 -1
- package/src/lib/form/combobox/tng-combobox.component.d.ts +3 -0
- package/src/lib/form/combobox/tng-combobox.component.d.ts.map +1 -1
- package/src/lib/form/combobox/tng-combobox.component.js +10 -13
- package/src/lib/form/combobox/tng-combobox.component.js.map +1 -1
- package/src/lib/form/datepicker/tng-datepicker.component.d.ts +4 -1
- package/src/lib/form/datepicker/tng-datepicker.component.d.ts.map +1 -1
- package/src/lib/form/datepicker/tng-datepicker.component.js +58 -98
- package/src/lib/form/datepicker/tng-datepicker.component.js.map +1 -1
- package/src/lib/form/form-field/tng-form-field.component.d.ts +3 -0
- package/src/lib/form/form-field/tng-form-field.component.d.ts.map +1 -1
- package/src/lib/form/form-field/tng-form-field.component.js +28 -33
- package/src/lib/form/form-field/tng-form-field.component.js.map +1 -1
- package/src/lib/form/index.d.ts +0 -20
- package/src/lib/form/index.d.ts.map +1 -1
- package/src/lib/form/index.js +4 -20
- package/src/lib/form/index.js.map +1 -1
- package/src/lib/form/input/tng-input.component.d.ts +3 -0
- package/src/lib/form/input/tng-input.component.d.ts.map +1 -1
- package/src/lib/form/input/tng-input.component.js +49 -60
- package/src/lib/form/input/tng-input.component.js.map +1 -1
- package/src/lib/form/input-otp/tng-input-otp.component.d.ts +3 -0
- package/src/lib/form/input-otp/tng-input-otp.component.d.ts.map +1 -1
- package/src/lib/form/input-otp/tng-input-otp.component.js +55 -69
- package/src/lib/form/input-otp/tng-input-otp.component.js.map +1 -1
- package/src/lib/form/label/tng-label.component.d.ts +3 -0
- package/src/lib/form/label/tng-label.component.d.ts.map +1 -1
- package/src/lib/form/label/tng-label.component.js +12 -19
- package/src/lib/form/label/tng-label.component.js.map +1 -1
- package/src/lib/form/multi-autocomplete/tng-multi-autocomplete.component.d.ts +4 -0
- package/src/lib/form/multi-autocomplete/tng-multi-autocomplete.component.d.ts.map +1 -1
- package/src/lib/form/multi-autocomplete/tng-multi-autocomplete.component.js +40 -43
- package/src/lib/form/multi-autocomplete/tng-multi-autocomplete.component.js.map +1 -1
- package/src/lib/form/multiselect/tng-multiselect.component.d.ts +4 -0
- package/src/lib/form/multiselect/tng-multiselect.component.d.ts.map +1 -1
- package/src/lib/form/multiselect/tng-multiselect.component.js +49 -52
- package/src/lib/form/multiselect/tng-multiselect.component.js.map +1 -1
- package/src/lib/form/radio/tng-radio.component.d.ts +3 -0
- package/src/lib/form/radio/tng-radio.component.d.ts.map +1 -1
- package/src/lib/form/radio/tng-radio.component.js +18 -33
- package/src/lib/form/radio/tng-radio.component.js.map +1 -1
- package/src/lib/form/select/tng-select.component.d.ts +4 -0
- package/src/lib/form/select/tng-select.component.d.ts.map +1 -1
- package/src/lib/form/select/tng-select.component.js +52 -53
- package/src/lib/form/select/tng-select.component.js.map +1 -1
- package/src/lib/form/select/tng-select.slots.d.ts +5 -0
- package/src/lib/form/select/tng-select.slots.d.ts.map +1 -1
- package/src/lib/form/select/tng-select.slots.js +21 -17
- package/src/lib/form/select/tng-select.slots.js.map +1 -1
- package/src/lib/form/slider/tng-slider.component.d.ts +3 -0
- package/src/lib/form/slider/tng-slider.component.d.ts.map +1 -1
- package/src/lib/form/slider/tng-slider.component.js +14 -27
- package/src/lib/form/slider/tng-slider.component.js.map +1 -1
- package/src/lib/form/switch/tng-switch.component.d.ts +3 -0
- package/src/lib/form/switch/tng-switch.component.d.ts.map +1 -1
- package/src/lib/form/switch/tng-switch.component.js +15 -24
- package/src/lib/form/switch/tng-switch.component.js.map +1 -1
- package/src/lib/form/textarea/tng-textarea.component.d.ts +3 -0
- package/src/lib/form/textarea/tng-textarea.component.d.ts.map +1 -1
- package/src/lib/form/textarea/tng-textarea.component.js +19 -36
- package/src/lib/form/textarea/tng-textarea.component.js.map +1 -1
- package/src/lib/form/toggle/tng-toggle.component.d.ts +3 -0
- package/src/lib/form/toggle/tng-toggle.component.d.ts.map +1 -1
- package/src/lib/form/toggle/tng-toggle.component.js +41 -41
- package/src/lib/form/toggle/tng-toggle.component.js.map +1 -1
- package/src/lib/form/toggle-group/tng-toggle-group.component.d.ts +4 -0
- package/src/lib/form/toggle-group/tng-toggle-group.component.d.ts.map +1 -1
- package/src/lib/form/toggle-group/tng-toggle-group.component.js +28 -31
- package/src/lib/form/toggle-group/tng-toggle-group.component.js.map +1 -1
- package/src/lib/layout/accordion/tng-accordion.component.d.ts +10 -0
- package/src/lib/layout/accordion/tng-accordion.component.d.ts.map +1 -1
- package/src/lib/layout/accordion/tng-accordion.component.js +49 -148
- package/src/lib/layout/accordion/tng-accordion.component.js.map +1 -1
- package/src/lib/layout/bottom-sheet/tng-bottom-sheet.component.d.ts +3 -0
- package/src/lib/layout/bottom-sheet/tng-bottom-sheet.component.d.ts.map +1 -1
- package/src/lib/layout/bottom-sheet/tng-bottom-sheet.component.js +10 -13
- package/src/lib/layout/bottom-sheet/tng-bottom-sheet.component.js.map +1 -1
- package/src/lib/layout/card/tng-card.component.d.ts +21 -0
- package/src/lib/layout/card/tng-card.component.d.ts.map +1 -1
- package/src/lib/layout/card/tng-card.component.js +92 -136
- package/src/lib/layout/card/tng-card.component.js.map +1 -1
- package/src/lib/layout/collapsible/tng-collapsible.component.d.ts +3 -0
- package/src/lib/layout/collapsible/tng-collapsible.component.d.ts.map +1 -1
- package/src/lib/layout/collapsible/tng-collapsible.component.js +17 -24
- package/src/lib/layout/collapsible/tng-collapsible.component.js.map +1 -1
- package/src/lib/layout/drawer/tng-drawer.component.d.ts +4 -0
- package/src/lib/layout/drawer/tng-drawer.component.d.ts.map +1 -1
- package/src/lib/layout/drawer/tng-drawer.component.js +48 -51
- package/src/lib/layout/drawer/tng-drawer.component.js.map +1 -1
- package/src/lib/layout/grid/tng-grid.component.d.ts +8 -0
- package/src/lib/layout/grid/tng-grid.component.d.ts.map +1 -1
- package/src/lib/layout/grid/tng-grid.component.js +48 -110
- package/src/lib/layout/grid/tng-grid.component.js.map +1 -1
- package/src/lib/layout/index.d.ts +1 -8
- package/src/lib/layout/index.d.ts.map +1 -1
- package/src/lib/layout/index.js +5 -8
- package/src/lib/layout/index.js.map +1 -1
- package/src/lib/layout/separator/tng-separator.component.d.ts +3 -0
- package/src/lib/layout/separator/tng-separator.component.d.ts.map +1 -1
- package/src/lib/layout/separator/tng-separator.component.js +11 -16
- package/src/lib/layout/separator/tng-separator.component.js.map +1 -1
- package/src/lib/layout/stepper/tng-stepper.component.d.ts +3 -0
- package/src/lib/layout/stepper/tng-stepper.component.d.ts.map +1 -1
- package/src/lib/layout/stepper/tng-stepper.component.js +10 -13
- package/src/lib/layout/stepper/tng-stepper.component.js.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-item.component.d.ts +4 -0
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-item.component.d.ts.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-item.component.js +47 -49
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-item.component.js.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-link.component.d.ts +4 -0
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-link.component.d.ts.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-link.component.js +16 -18
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-link.component.js.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-list.component.d.ts +4 -0
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-list.component.d.ts.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-list.component.js +10 -12
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-list.component.js.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-separator-template.directive.d.ts +3 -0
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-separator-template.directive.d.ts.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-separator-template.directive.js +12 -10
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-separator-template.directive.js.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-separator.component.d.ts +4 -0
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-separator.component.d.ts.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-separator.component.js +12 -14
- package/src/lib/navigation/breadcrumb/tng-breadcrumb-separator.component.js.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb.component.d.ts +4 -0
- package/src/lib/navigation/breadcrumb/tng-breadcrumb.component.d.ts.map +1 -1
- package/src/lib/navigation/breadcrumb/tng-breadcrumb.component.js +23 -25
- package/src/lib/navigation/breadcrumb/tng-breadcrumb.component.js.map +1 -1
- package/src/lib/navigation/context-menu/tng-context-menu.component.d.ts +5 -0
- package/src/lib/navigation/context-menu/tng-context-menu.component.d.ts.map +1 -1
- package/src/lib/navigation/context-menu/tng-context-menu.component.js +24 -26
- package/src/lib/navigation/context-menu/tng-context-menu.component.js.map +1 -1
- package/src/lib/navigation/dropdown-menu/tng-dropdown-menu.component.d.ts +4 -0
- package/src/lib/navigation/dropdown-menu/tng-dropdown-menu.component.d.ts.map +1 -1
- package/src/lib/navigation/dropdown-menu/tng-dropdown-menu.component.js +19 -23
- package/src/lib/navigation/dropdown-menu/tng-dropdown-menu.component.js.map +1 -1
- package/src/lib/navigation/index.d.ts +0 -12
- package/src/lib/navigation/index.d.ts.map +1 -1
- package/src/lib/navigation/index.js +4 -12
- package/src/lib/navigation/index.js.map +1 -1
- package/src/lib/navigation/menu/tng-menu-trigger-for.directive.d.ts +3 -0
- package/src/lib/navigation/menu/tng-menu-trigger-for.directive.d.ts.map +1 -1
- package/src/lib/navigation/menu/tng-menu-trigger-for.directive.js +22 -20
- package/src/lib/navigation/menu/tng-menu-trigger-for.directive.js.map +1 -1
- package/src/lib/navigation/menu/tng-menu.component.d.ts +5 -0
- package/src/lib/navigation/menu/tng-menu.component.d.ts.map +1 -1
- package/src/lib/navigation/menu/tng-menu.component.js +21 -23
- package/src/lib/navigation/menu/tng-menu.component.js.map +1 -1
- package/src/lib/navigation/menubar/tng-menubar.component.d.ts +5 -0
- package/src/lib/navigation/menubar/tng-menubar.component.d.ts.map +1 -1
- package/src/lib/navigation/menubar/tng-menubar.component.js +20 -22
- package/src/lib/navigation/menubar/tng-menubar.component.js.map +1 -1
- package/src/lib/navigation/navigation-menu/tng-navigation-menu.component.d.ts +4 -0
- package/src/lib/navigation/navigation-menu/tng-navigation-menu.component.d.ts.map +1 -1
- package/src/lib/navigation/navigation-menu/tng-navigation-menu.component.js +11 -13
- package/src/lib/navigation/navigation-menu/tng-navigation-menu.component.js.map +1 -1
- package/src/lib/navigation/tabs/tng-tabs.component.d.ts +5 -0
- package/src/lib/navigation/tabs/tng-tabs.component.d.ts.map +1 -1
- package/src/lib/navigation/tabs/tng-tabs.component.js +32 -34
- package/src/lib/navigation/tabs/tng-tabs.component.js.map +1 -1
- package/src/lib/navigation/toolbar/tng-toolbar.component.d.ts +4 -0
- package/src/lib/navigation/toolbar/tng-toolbar.component.d.ts.map +1 -1
- package/src/lib/navigation/toolbar/tng-toolbar.component.js +11 -13
- package/src/lib/navigation/toolbar/tng-toolbar.component.js.map +1 -1
- package/src/lib/overlay/dialog/tng-dialog.component.d.ts +4 -0
- package/src/lib/overlay/dialog/tng-dialog.component.d.ts.map +1 -1
- package/src/lib/overlay/dialog/tng-dialog.component.js +18 -25
- package/src/lib/overlay/dialog/tng-dialog.component.js.map +1 -1
- package/src/lib/overlay/index.d.ts +0 -3
- package/src/lib/overlay/index.d.ts.map +1 -1
- package/src/lib/overlay/index.js +4 -3
- package/src/lib/overlay/index.js.map +1 -1
- package/src/lib/overlay/popover/tng-popover.component.d.ts +4 -0
- package/src/lib/overlay/popover/tng-popover.component.d.ts.map +1 -1
- package/src/lib/overlay/popover/tng-popover.component.js +23 -37
- package/src/lib/overlay/popover/tng-popover.component.js.map +1 -1
- package/src/lib/overlay/tooltip/tng-tooltip.component.d.ts +4 -0
- package/src/lib/overlay/tooltip/tng-tooltip.component.d.ts.map +1 -1
- package/src/lib/overlay/tooltip/tng-tooltip.component.js +17 -21
- package/src/lib/overlay/tooltip/tng-tooltip.component.js.map +1 -1
- package/src/lib/utility/avatar/tng-avatar.component.d.ts +4 -1
- package/src/lib/utility/avatar/tng-avatar.component.d.ts.map +1 -1
- package/src/lib/utility/avatar/tng-avatar.component.js +20 -22
- package/src/lib/utility/avatar/tng-avatar.component.js.map +1 -1
- package/src/lib/utility/badge/tng-badge.component.d.ts +4 -0
- package/src/lib/utility/badge/tng-badge.component.d.ts.map +1 -1
- package/src/lib/utility/badge/tng-badge.component.js +13 -10
- package/src/lib/utility/badge/tng-badge.component.js.map +1 -1
- package/src/lib/utility/button/tng-button.component.d.ts +4 -1
- package/src/lib/utility/button/tng-button.component.d.ts.map +1 -1
- package/src/lib/utility/button/tng-button.component.js +19 -29
- package/src/lib/utility/button/tng-button.component.js.map +1 -1
- package/src/lib/utility/code-block/tng-code-block.component.d.ts +4 -0
- package/src/lib/utility/code-block/tng-code-block.component.d.ts.map +1 -1
- package/src/lib/utility/code-block/tng-code-block.component.js +73 -103
- package/src/lib/utility/code-block/tng-code-block.component.js.map +1 -1
- package/src/lib/utility/copy-button/tng-copy-button.component.d.ts +4 -1
- package/src/lib/utility/copy-button/tng-copy-button.component.d.ts.map +1 -1
- package/src/lib/utility/copy-button/tng-copy-button.component.js +28 -36
- package/src/lib/utility/copy-button/tng-copy-button.component.js.map +1 -1
- package/src/lib/utility/index.d.ts +1 -9
- package/src/lib/utility/index.d.ts.map +1 -1
- package/src/lib/utility/index.js +5 -8
- package/src/lib/utility/index.js.map +1 -1
- package/src/lib/utility/tag/tng-tag.component.d.ts +4 -1
- package/src/lib/utility/tag/tng-tag.component.d.ts.map +1 -1
- package/src/lib/utility/tag/tng-tag.component.js +18 -24
- package/src/lib/utility/tag/tng-tag.component.js.map +1 -1
- package/src/lib/utility/tree/tng-tree.component.d.ts +4 -1
- package/src/lib/utility/tree/tng-tree.component.d.ts.map +1 -1
- package/src/lib/utility/tree/tng-tree.component.js +23 -25
- package/src/lib/utility/tree/tng-tree.component.js.map +1 -1
|
@@ -1,21 +1,25 @@
|
|
|
1
|
-
import { __decorate } from "tslib";
|
|
2
1
|
import { Directive, TemplateRef, inject } from '@angular/core';
|
|
3
|
-
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class TngSelectTriggerTpl {
|
|
4
4
|
tpl = inject((TemplateRef));
|
|
5
|
-
};
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
5
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngSelectTriggerTpl, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
6
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: TngSelectTriggerTpl, isStandalone: true, selector: "ng-template[tngSelectTriggerTpl]", ngImport: i0 });
|
|
7
|
+
}
|
|
8
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngSelectTriggerTpl, decorators: [{
|
|
9
|
+
type: Directive,
|
|
10
|
+
args: [{
|
|
11
|
+
selector: 'ng-template[tngSelectTriggerTpl]',
|
|
12
|
+
}]
|
|
13
|
+
}] });
|
|
14
|
+
export class TngSelectOptionTpl {
|
|
13
15
|
tpl = inject((TemplateRef));
|
|
14
|
-
};
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
16
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngSelectOptionTpl, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
17
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: TngSelectOptionTpl, isStandalone: true, selector: "ng-template[tngSelectOptionTpl]", ngImport: i0 });
|
|
18
|
+
}
|
|
19
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngSelectOptionTpl, decorators: [{
|
|
20
|
+
type: Directive,
|
|
21
|
+
args: [{
|
|
22
|
+
selector: 'ng-template[tngSelectOptionTpl]',
|
|
23
|
+
}]
|
|
24
|
+
}] });
|
|
21
25
|
//# sourceMappingURL=tng-select.slots.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tng-select.slots.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/select/tng-select.slots.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"tng-select.slots.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/select/tng-select.slots.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;;AAc/D,MAAM,OAAO,mBAAmB;IACrB,GAAG,GAAG,MAAM,CAAC,CAAA,WAA6C,CAAA,CAAC,CAAC;uGAD1D,mBAAmB;2FAAnB,mBAAmB;;2FAAnB,mBAAmB;kBAH/B,SAAS;mBAAC;oBACT,QAAQ,EAAE,kCAAkC;iBAC7C;;AAkBD,MAAM,OAAO,kBAAkB;IACpB,GAAG,GAAG,MAAM,CAAC,CAAA,WAA4C,CAAA,CAAC,CAAC;uGADzD,kBAAkB;2FAAlB,kBAAkB;;2FAAlB,kBAAkB;kBAH9B,SAAS;mBAAC;oBACT,QAAQ,EAAE,iCAAiC;iBAC5C","sourcesContent":["import { Directive, TemplateRef, inject } from '@angular/core';\n\nexport type TngSelectTriggerTplContext<O, V> = Readonly<{\n value: V | null;\n option: O | null;\n label: string;\n placeholder: string;\n open: boolean;\n disabled: boolean;\n}>;\n\n@Directive({\n selector: 'ng-template[tngSelectTriggerTpl]',\n})\nexport class TngSelectTriggerTpl<O = unknown, V = unknown> {\n readonly tpl = inject(TemplateRef<TngSelectTriggerTplContext<O, V>>);\n}\n\nexport type TngSelectOptionTplContext<O, V> = Readonly<{\n $implicit: O;\n option: O;\n value: V;\n label: string;\n selected: boolean;\n active: boolean;\n disabled: boolean;\n}>;\n\n@Directive({\n selector: 'ng-template[tngSelectOptionTpl]',\n})\nexport class TngSelectOptionTpl<O = unknown, V = unknown> {\n readonly tpl = inject(TemplateRef<TngSelectOptionTplContext<O, V>>);\n}"]}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
1
2
|
export declare function readTngSliderEventValue(event: unknown): number | null;
|
|
2
3
|
export declare class TngSliderComponent {
|
|
3
4
|
readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, string | boolean>;
|
|
@@ -7,5 +8,7 @@ export declare class TngSliderComponent {
|
|
|
7
8
|
readonly value: import("@angular/core").InputSignalWithTransform<number, string | number>;
|
|
8
9
|
readonly valueChange: import("@angular/core").OutputEmitterRef<number>;
|
|
9
10
|
onInput(event: unknown): void;
|
|
11
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TngSliderComponent, never>;
|
|
12
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TngSliderComponent, "tng-slider", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
|
|
10
13
|
}
|
|
11
14
|
//# sourceMappingURL=tng-slider.component.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tng-slider.component.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/slider/tng-slider.component.ts"],"names":[],"mappings":"AAQA,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAWrE;AAED,qBAMa,kBAAkB;IAC7B,SAAgB,QAAQ,8EAErB;IACH,SAAgB,GAAG,4EAGhB;IACH,SAAgB,GAAG,4EAGhB;IACH,SAAgB,IAAI,4EAGjB;IACH,SAAgB,KAAK,4EAGlB;IAEH,SAAgB,WAAW,mDAAoB;IAExC,OAAO,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;
|
|
1
|
+
{"version":3,"file":"tng-slider.component.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/slider/tng-slider.component.ts"],"names":[],"mappings":";AAQA,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAWrE;AAED,qBAMa,kBAAkB;IAC7B,SAAgB,QAAQ,8EAErB;IACH,SAAgB,GAAG,4EAGhB;IACH,SAAgB,GAAG,4EAGhB;IACH,SAAgB,IAAI,4EAGjB;IACH,SAAgB,KAAK,4EAGlB;IAEH,SAAgB,WAAW,mDAAoB;IAExC,OAAO,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;yCAvBzB,kBAAkB;2CAAlB,kBAAkB;CA+B9B"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { __decorate } from "tslib";
|
|
2
1
|
import { booleanAttribute, Component, input, output } from '@angular/core';
|
|
3
2
|
import { normalizeTngSliderMax, normalizeTngSliderMin, normalizeTngSliderStep, TngSlider as TngSliderPrimitive, } from '@tailng-ui/primitives';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
4
|
export function readTngSliderEventValue(event) {
|
|
5
5
|
if (!(event instanceof Event)) {
|
|
6
6
|
return null;
|
|
@@ -11,22 +11,12 @@ export function readTngSliderEventValue(event) {
|
|
|
11
11
|
}
|
|
12
12
|
return Number(target.value);
|
|
13
13
|
}
|
|
14
|
-
|
|
15
|
-
disabled = input(false, {
|
|
16
|
-
|
|
17
|
-
});
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
});
|
|
21
|
-
min = input(0, {
|
|
22
|
-
transform: (value) => normalizeTngSliderMin(typeof value === 'number' ? value : Number(value)),
|
|
23
|
-
});
|
|
24
|
-
step = input(1, {
|
|
25
|
-
transform: (value) => normalizeTngSliderStep(typeof value === 'number' ? value : Number(value)),
|
|
26
|
-
});
|
|
27
|
-
value = input(0, {
|
|
28
|
-
transform: (value) => typeof value === 'number' ? value : Number(value),
|
|
29
|
-
});
|
|
14
|
+
export class TngSliderComponent {
|
|
15
|
+
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
|
|
16
|
+
max = input(100, { ...(ngDevMode ? { debugName: "max" } : {}), transform: (value) => normalizeTngSliderMax(typeof value === 'number' ? value : Number(value)) });
|
|
17
|
+
min = input(0, { ...(ngDevMode ? { debugName: "min" } : {}), transform: (value) => normalizeTngSliderMin(typeof value === 'number' ? value : Number(value)) });
|
|
18
|
+
step = input(1, { ...(ngDevMode ? { debugName: "step" } : {}), transform: (value) => normalizeTngSliderStep(typeof value === 'number' ? value : Number(value)) });
|
|
19
|
+
value = input(0, { ...(ngDevMode ? { debugName: "value" } : {}), transform: (value) => typeof value === 'number' ? value : Number(value) });
|
|
30
20
|
valueChange = output();
|
|
31
21
|
onInput(event) {
|
|
32
22
|
const nextValue = readTngSliderEventValue(event);
|
|
@@ -35,14 +25,11 @@ let TngSliderComponent = class TngSliderComponent {
|
|
|
35
25
|
}
|
|
36
26
|
this.valueChange.emit(nextValue);
|
|
37
27
|
}
|
|
38
|
-
};
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
})
|
|
46
|
-
], TngSliderComponent);
|
|
47
|
-
export { TngSliderComponent };
|
|
28
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: TngSliderComponent, isStandalone: true, selector: "tng-slider", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"tng-slider-root\" [attr.data-disabled]=\"disabled() ? '' : null\">\n <input\n tngSlider\n class=\"tng-slider-control\"\n [disabled]=\"disabled()\"\n [max]=\"max()\"\n [min]=\"min()\"\n [step]=\"step()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n />\n</div>\n", styles: [":host {\n display: block;\n width: 100%;\n}\n\n.tng-slider-root {\n display: flex;\n width: 100%;\n}\n\n.tng-slider-control {\n accent-color: var(--tng-semantic-accent-brand);\n width: 100%;\n}\n\n.tng-slider-root[data-disabled] {\n cursor: not-allowed;\n opacity: 0.65;\n}\n"], dependencies: [{ kind: "directive", type: TngSliderPrimitive, selector: "input[tngSlider]", inputs: ["disabled", "max", "min", "step", "value"], exportAs: ["tngSlider"] }] });
|
|
30
|
+
}
|
|
31
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngSliderComponent, decorators: [{
|
|
32
|
+
type: Component,
|
|
33
|
+
args: [{ selector: 'tng-slider', imports: [TngSliderPrimitive], template: "<div class=\"tng-slider-root\" [attr.data-disabled]=\"disabled() ? '' : null\">\n <input\n tngSlider\n class=\"tng-slider-control\"\n [disabled]=\"disabled()\"\n [max]=\"max()\"\n [min]=\"min()\"\n [step]=\"step()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n />\n</div>\n", styles: [":host {\n display: block;\n width: 100%;\n}\n\n.tng-slider-root {\n display: flex;\n width: 100%;\n}\n\n.tng-slider-control {\n accent-color: var(--tng-semantic-accent-brand);\n width: 100%;\n}\n\n.tng-slider-root[data-disabled] {\n cursor: not-allowed;\n opacity: 0.65;\n}\n"] }]
|
|
34
|
+
}], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
|
|
48
35
|
//# sourceMappingURL=tng-slider.component.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tng-slider.component.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/slider/tng-slider.component.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"tng-slider.component.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/slider/tng-slider.component.ts","../../../../../../../../libs/tailng-ui/components/src/lib/form/slider/tng-slider.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC3E,OAAO,EACL,qBAAqB,EACrB,qBAAqB,EACrB,sBAAsB,EACtB,SAAS,IAAI,kBAAkB,GAChC,MAAM,uBAAuB,CAAC;;AAE/B,MAAM,UAAU,uBAAuB,CAAC,KAAc;IACpD,IAAI,CAAC,CAAC,KAAK,YAAY,KAAK,CAAC,EAAE,CAAC;QAC9B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;IAC5B,IAAI,CAAC,CAAC,MAAM,YAAY,gBAAgB,CAAC,EAAE,CAAC;QAC1C,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;AAC9B,CAAC;AAQD,MAAM,OAAO,kBAAkB;IACb,QAAQ,GAAG,KAAK,CAA4B,KAAK,qDAC/D,SAAS,EAAE,gBAAgB,GAC3B,CAAC;IACa,GAAG,GAAG,KAAK,CAA0B,GAAG,gDACtD,SAAS,EAAE,CAAC,KAAsB,EAAU,EAAE,CAC5C,qBAAqB,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAC1E,CAAC;IACa,GAAG,GAAG,KAAK,CAA0B,CAAC,gDACpD,SAAS,EAAE,CAAC,KAAsB,EAAU,EAAE,CAC5C,qBAAqB,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAC1E,CAAC;IACa,IAAI,GAAG,KAAK,CAA0B,CAAC,iDACrD,SAAS,EAAE,CAAC,KAAsB,EAAU,EAAE,CAC5C,sBAAsB,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAC3E,CAAC;IACa,KAAK,GAAG,KAAK,CAA0B,CAAC,kDACtD,SAAS,EAAE,CAAC,KAAsB,EAAU,EAAE,CAC5C,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GACnD,CAAC;IAEa,WAAW,GAAG,MAAM,EAAU,CAAC;IAExC,OAAO,CAAC,KAAc;QAC3B,MAAM,SAAS,GAAG,uBAAuB,CAAC,KAAK,CAAC,CAAC;QACjD,IAAI,SAAS,KAAK,IAAI,EAAE,CAAC;YACvB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACnC,CAAC;uGA9BU,kBAAkB;2FAAlB,kBAAkB,6sBC3B/B,sTAYA,qVDWY,kBAAkB;;2FAIjB,kBAAkB;kBAN9B,SAAS;+BACE,YAAY,WACb,CAAC,kBAAkB,CAAC","sourcesContent":["import { booleanAttribute, Component, input, output } from '@angular/core';\nimport {\n normalizeTngSliderMax,\n normalizeTngSliderMin,\n normalizeTngSliderStep,\n TngSlider as TngSliderPrimitive,\n} from '@tailng-ui/primitives';\n\nexport function readTngSliderEventValue(event: unknown): number | null {\n if (!(event instanceof Event)) {\n return null;\n }\n\n const target = event.target;\n if (!(target instanceof HTMLInputElement)) {\n return null;\n }\n\n return Number(target.value);\n}\n\n@Component({\n selector: 'tng-slider',\n imports: [TngSliderPrimitive],\n templateUrl: './tng-slider.component.html',\n styleUrl: './tng-slider.component.css',\n})\nexport class TngSliderComponent {\n public readonly disabled = input<boolean, boolean | string>(false, {\n transform: booleanAttribute,\n });\n public readonly max = input<number, number | string>(100, {\n transform: (value: number | string): number =>\n normalizeTngSliderMax(typeof value === 'number' ? value : Number(value)),\n });\n public readonly min = input<number, number | string>(0, {\n transform: (value: number | string): number =>\n normalizeTngSliderMin(typeof value === 'number' ? value : Number(value)),\n });\n public readonly step = input<number, number | string>(1, {\n transform: (value: number | string): number =>\n normalizeTngSliderStep(typeof value === 'number' ? value : Number(value)),\n });\n public readonly value = input<number, number | string>(0, {\n transform: (value: number | string): number =>\n typeof value === 'number' ? value : Number(value),\n });\n\n public readonly valueChange = output<number>();\n\n public onInput(event: unknown): void {\n const nextValue = readTngSliderEventValue(event);\n if (nextValue === null) {\n return;\n }\n\n this.valueChange.emit(nextValue);\n }\n}\n","<div class=\"tng-slider-root\" [attr.data-disabled]=\"disabled() ? '' : null\">\n <input\n tngSlider\n class=\"tng-slider-control\"\n [disabled]=\"disabled()\"\n [max]=\"max()\"\n [min]=\"min()\"\n [step]=\"step()\"\n [value]=\"value()\"\n (input)=\"onInput($event)\"\n />\n</div>\n"]}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
1
2
|
type TngSwitchKeyboardEvent = Readonly<Pick<KeyboardEvent, 'key'>> & Readonly<{
|
|
2
3
|
preventDefault: () => void;
|
|
3
4
|
}>;
|
|
@@ -13,6 +14,8 @@ export declare class TngSwitchComponent {
|
|
|
13
14
|
readonly checkedChange: import("@angular/core").OutputEmitterRef<boolean>;
|
|
14
15
|
onKeydown(event: TngSwitchKeyboardEvent): void;
|
|
15
16
|
onToggle(): void;
|
|
17
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TngSwitchComponent, never>;
|
|
18
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TngSwitchComponent, "tng-switch", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "checkedChange": "checkedChange"; }, never, ["[onIcon]", "[offIcon]", "*"], true, never>;
|
|
16
19
|
}
|
|
17
20
|
export {};
|
|
18
21
|
//# sourceMappingURL=tng-switch.component.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tng-switch.component.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/switch/tng-switch.component.ts"],"names":[],"mappings":"AAGA,KAAK,sBAAsB,GAAG,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC,GAChE,QAAQ,CAAC;IAAE,cAAc,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC,CAAC;AAE3C,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAE9D;AAED,wBAAgB,wBAAwB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI,CAUpE;AAED,qBAMa,kBAAkB;IAC7B,SAAgB,SAAS,qDAA8B;IACvD,SAAgB,OAAO,8EAEpB;IACH,SAAgB,QAAQ,8EAErB;IACH,SAAgB,IAAI,qDAA8B;IAClD,SAAgB,QAAQ,8EAErB;IACH,SAAgB,KAAK,8CAAuB;IAE5C,SAAgB,aAAa,oDAAqB;IAE3C,SAAS,CAAC,KAAK,EAAE,sBAAsB,GAAG,IAAI;IAc9C,QAAQ,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"tng-switch.component.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/switch/tng-switch.component.ts"],"names":[],"mappings":";AAGA,KAAK,sBAAsB,GAAG,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC,GAChE,QAAQ,CAAC;IAAE,cAAc,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC,CAAC;AAE3C,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAE9D;AAED,wBAAgB,wBAAwB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI,CAUpE;AAED,qBAMa,kBAAkB;IAC7B,SAAgB,SAAS,qDAA8B;IACvD,SAAgB,OAAO,8EAEpB;IACH,SAAgB,QAAQ,8EAErB;IACH,SAAgB,IAAI,qDAA8B;IAClD,SAAgB,QAAQ,8EAErB;IACH,SAAgB,KAAK,8CAAuB;IAE5C,SAAgB,aAAa,oDAAqB;IAE3C,SAAS,CAAC,KAAK,EAAE,sBAAsB,GAAG,IAAI;IAc9C,QAAQ,IAAI,IAAI;yCA9BZ,kBAAkB;2CAAlB,kBAAkB;CAqC9B"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { __decorate } from "tslib";
|
|
2
1
|
import { booleanAttribute, Component, input, output } from '@angular/core';
|
|
3
2
|
import { TngSwitch as TngSwitchPrimitive } from '@tailng-ui/primitives';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
4
|
export function toggleTngSwitchState(checked) {
|
|
5
5
|
return !checked;
|
|
6
6
|
}
|
|
@@ -13,19 +13,13 @@ export function resolveTngSwitchArrowKey(key) {
|
|
|
13
13
|
}
|
|
14
14
|
return null;
|
|
15
15
|
}
|
|
16
|
-
|
|
17
|
-
ariaLabel = input(null);
|
|
18
|
-
checked = input(false, {
|
|
19
|
-
|
|
20
|
-
});
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
});
|
|
24
|
-
name = input(null);
|
|
25
|
-
required = input(false, {
|
|
26
|
-
transform: booleanAttribute,
|
|
27
|
-
});
|
|
28
|
-
value = input('on');
|
|
16
|
+
export class TngSwitchComponent {
|
|
17
|
+
ariaLabel = input(null, ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
|
|
18
|
+
checked = input(false, { ...(ngDevMode ? { debugName: "checked" } : {}), transform: booleanAttribute });
|
|
19
|
+
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
|
|
20
|
+
name = input(null, ...(ngDevMode ? [{ debugName: "name" }] : []));
|
|
21
|
+
required = input(false, { ...(ngDevMode ? { debugName: "required" } : {}), transform: booleanAttribute });
|
|
22
|
+
value = input('on', ...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
29
23
|
checkedChange = output();
|
|
30
24
|
onKeydown(event) {
|
|
31
25
|
if (this.disabled()) {
|
|
@@ -44,14 +38,11 @@ let TngSwitchComponent = class TngSwitchComponent {
|
|
|
44
38
|
}
|
|
45
39
|
this.checkedChange.emit(toggleTngSwitchState(this.checked()));
|
|
46
40
|
}
|
|
47
|
-
};
|
|
48
|
-
TngSwitchComponent =
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
})
|
|
55
|
-
], TngSwitchComponent);
|
|
56
|
-
export { TngSwitchComponent };
|
|
41
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngSwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
42
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: TngSwitchComponent, isStandalone: true, selector: "tng-switch", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checkedChange: "checkedChange" }, ngImport: i0, template: "<div class=\"tng-switch-root\" [attr.data-disabled]=\"disabled() ? '' : null\">\n <button\n tngSwitch\n class=\"tng-switch-control\"\n [ariaLabel]=\"ariaLabel()\"\n [checked]=\"checked()\"\n [disabled]=\"disabled()\"\n [required]=\"required()\"\n (click)=\"onToggle()\"\n (keydown)=\"onKeydown($event)\"\n >\n <span class=\"tng-switch-track\">\n <span class=\"tng-switch-thumb\">\n @if (checked()) {\n <span class=\"tng-switch-icon\" aria-hidden=\"true\">\n <ng-content select=\"[onIcon]\"></ng-content>\n </span>\n } @else {\n <span class=\"tng-switch-icon\" aria-hidden=\"true\">\n <ng-content select=\"[offIcon]\"></ng-content>\n </span>\n }\n </span>\n </span>\n </button>\n <input\n class=\"tng-switch-native-input\"\n type=\"checkbox\"\n [checked]=\"checked()\"\n [disabled]=\"disabled()\"\n [required]=\"required()\"\n [attr.name]=\"name()\"\n [value]=\"value()\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n />\n <span class=\"tng-switch-label\">\n <ng-content />\n </span>\n</div>\n", styles: [":host {\n display: inline-flex;\n}\n\n.tng-switch-root {\n align-items: center;\n color: var(--tng-semantic-foreground-primary);\n column-gap: 0.65rem;\n display: inline-flex;\n font-size: 0.95rem;\n line-height: 1.3;\n}\n\n.tng-switch-root[data-disabled] {\n cursor: not-allowed;\n opacity: 0.65;\n}\n\n.tng-switch-control {\n align-items: center;\n background: var(--tng-semantic-border-subtle);\n border: 0;\n border-radius: 999px;\n cursor: pointer;\n display: inline-flex;\n height: 1.5rem;\n padding: 0.125rem;\n transition: background-color 150ms ease;\n width: 2.65rem;\n}\n\n.tng-switch-control[data-state='checked'] {\n background: var(--tng-semantic-accent-brand);\n}\n\n.tng-switch-control:focus-visible {\n outline: 2px solid var(--tng-semantic-focus-ring);\n outline-offset: 2px;\n}\n\n.tng-switch-track {\n align-items: center;\n display: inline-flex;\n}\n\n.tng-switch-thumb {\n align-items: center;\n background: var(--tng-color-white, #fff);\n border-radius: 999px;\n box-shadow: 0 1px 2px color-mix(in srgb, var(--tng-semantic-background-canvas) 20%, transparent);\n display: inline-flex;\n height: 1.25rem;\n justify-content: center;\n transform: translateX(0);\n transition: transform 150ms ease;\n width: 1.25rem;\n}\n\n.tng-switch-control[data-state='checked'] .tng-switch-thumb {\n transform: translateX(1.15rem);\n}\n\n.tng-switch-label {\n user-select: none;\n}\n\n.tng-switch-label:empty {\n display: none;\n}\n\n.tng-switch-icon {\n align-items: center;\n display: inline-flex;\n font-size: 0.7rem;\n line-height: 1;\n}\n\n.tng-switch-native-input {\n block-size: 1px;\n border: 0;\n clip: rect(0 0 0 0);\n inline-size: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n}\n"], dependencies: [{ kind: "directive", type: TngSwitchPrimitive, selector: "button[tngSwitch]", inputs: ["ariaLabel", "checked", "disabled", "required"], exportAs: ["tngSwitch"] }] });
|
|
43
|
+
}
|
|
44
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngSwitchComponent, decorators: [{
|
|
45
|
+
type: Component,
|
|
46
|
+
args: [{ selector: 'tng-switch', imports: [TngSwitchPrimitive], template: "<div class=\"tng-switch-root\" [attr.data-disabled]=\"disabled() ? '' : null\">\n <button\n tngSwitch\n class=\"tng-switch-control\"\n [ariaLabel]=\"ariaLabel()\"\n [checked]=\"checked()\"\n [disabled]=\"disabled()\"\n [required]=\"required()\"\n (click)=\"onToggle()\"\n (keydown)=\"onKeydown($event)\"\n >\n <span class=\"tng-switch-track\">\n <span class=\"tng-switch-thumb\">\n @if (checked()) {\n <span class=\"tng-switch-icon\" aria-hidden=\"true\">\n <ng-content select=\"[onIcon]\"></ng-content>\n </span>\n } @else {\n <span class=\"tng-switch-icon\" aria-hidden=\"true\">\n <ng-content select=\"[offIcon]\"></ng-content>\n </span>\n }\n </span>\n </span>\n </button>\n <input\n class=\"tng-switch-native-input\"\n type=\"checkbox\"\n [checked]=\"checked()\"\n [disabled]=\"disabled()\"\n [required]=\"required()\"\n [attr.name]=\"name()\"\n [value]=\"value()\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n />\n <span class=\"tng-switch-label\">\n <ng-content />\n </span>\n</div>\n", styles: [":host {\n display: inline-flex;\n}\n\n.tng-switch-root {\n align-items: center;\n color: var(--tng-semantic-foreground-primary);\n column-gap: 0.65rem;\n display: inline-flex;\n font-size: 0.95rem;\n line-height: 1.3;\n}\n\n.tng-switch-root[data-disabled] {\n cursor: not-allowed;\n opacity: 0.65;\n}\n\n.tng-switch-control {\n align-items: center;\n background: var(--tng-semantic-border-subtle);\n border: 0;\n border-radius: 999px;\n cursor: pointer;\n display: inline-flex;\n height: 1.5rem;\n padding: 0.125rem;\n transition: background-color 150ms ease;\n width: 2.65rem;\n}\n\n.tng-switch-control[data-state='checked'] {\n background: var(--tng-semantic-accent-brand);\n}\n\n.tng-switch-control:focus-visible {\n outline: 2px solid var(--tng-semantic-focus-ring);\n outline-offset: 2px;\n}\n\n.tng-switch-track {\n align-items: center;\n display: inline-flex;\n}\n\n.tng-switch-thumb {\n align-items: center;\n background: var(--tng-color-white, #fff);\n border-radius: 999px;\n box-shadow: 0 1px 2px color-mix(in srgb, var(--tng-semantic-background-canvas) 20%, transparent);\n display: inline-flex;\n height: 1.25rem;\n justify-content: center;\n transform: translateX(0);\n transition: transform 150ms ease;\n width: 1.25rem;\n}\n\n.tng-switch-control[data-state='checked'] .tng-switch-thumb {\n transform: translateX(1.15rem);\n}\n\n.tng-switch-label {\n user-select: none;\n}\n\n.tng-switch-label:empty {\n display: none;\n}\n\n.tng-switch-icon {\n align-items: center;\n display: inline-flex;\n font-size: 0.7rem;\n line-height: 1;\n}\n\n.tng-switch-native-input {\n block-size: 1px;\n border: 0;\n clip: rect(0 0 0 0);\n inline-size: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n white-space: nowrap;\n}\n"] }]
|
|
47
|
+
}], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], checkedChange: [{ type: i0.Output, args: ["checkedChange"] }] } });
|
|
57
48
|
//# sourceMappingURL=tng-switch.component.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tng-switch.component.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/switch/tng-switch.component.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"tng-switch.component.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/switch/tng-switch.component.ts","../../../../../../../../libs/tailng-ui/components/src/lib/form/switch/tng-switch.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC3E,OAAO,EAAE,SAAS,IAAI,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;;AAKxE,MAAM,UAAU,oBAAoB,CAAC,OAAgB;IACnD,OAAO,CAAC,OAAO,CAAC;AAClB,CAAC;AAED,MAAM,UAAU,wBAAwB,CAAC,GAAW;IAClD,IAAI,GAAG,KAAK,WAAW,EAAE,CAAC;QACxB,OAAO,KAAK,CAAC;IACf,CAAC;IAED,IAAI,GAAG,KAAK,YAAY,EAAE,CAAC;QACzB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC;AAQD,MAAM,OAAO,kBAAkB;IACb,SAAS,GAAG,KAAK,CAAgB,IAAI,qDAAC,CAAC;IACvC,OAAO,GAAG,KAAK,CAA4B,KAAK,oDAC9D,SAAS,EAAE,gBAAgB,GAC3B,CAAC;IACa,QAAQ,GAAG,KAAK,CAA4B,KAAK,qDAC/D,SAAS,EAAE,gBAAgB,GAC3B,CAAC;IACa,IAAI,GAAG,KAAK,CAAgB,IAAI,gDAAC,CAAC;IAClC,QAAQ,GAAG,KAAK,CAA4B,KAAK,qDAC/D,SAAS,EAAE,gBAAgB,GAC3B,CAAC;IACa,KAAK,GAAG,KAAK,CAAS,IAAI,iDAAC,CAAC;IAE5B,aAAa,GAAG,MAAM,EAAW,CAAC;IAE3C,SAAS,CAAC,KAA6B;QAC5C,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QAED,MAAM,SAAS,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACtD,IAAI,SAAS,KAAK,IAAI,IAAI,SAAS,KAAK,IAAI,CAAC,OAAO,EAAE,EAAE,CAAC;YACvD,OAAO;QACT,CAAC;QAED,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACrC,CAAC;IAEM,QAAQ;QACb,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;IAChE,CAAC;uGApCU,kBAAkB;2FAAlB,kBAAkB,g3BC5B/B,2nCAwCA,o0DDhBY,kBAAkB;;2FAIjB,kBAAkB;kBAN9B,SAAS;+BACE,YAAY,WACb,CAAC,kBAAkB,CAAC","sourcesContent":["import { booleanAttribute, Component, input, output } from '@angular/core';\nimport { TngSwitch as TngSwitchPrimitive } from '@tailng-ui/primitives';\n\ntype TngSwitchKeyboardEvent = Readonly<Pick<KeyboardEvent, 'key'>> &\n Readonly<{ preventDefault: () => void }>;\n\nexport function toggleTngSwitchState(checked: boolean): boolean {\n return !checked;\n}\n\nexport function resolveTngSwitchArrowKey(key: string): boolean | null {\n if (key === 'ArrowLeft') {\n return false;\n }\n\n if (key === 'ArrowRight') {\n return true;\n }\n\n return null;\n}\n\n@Component({\n selector: 'tng-switch',\n imports: [TngSwitchPrimitive],\n templateUrl: './tng-switch.component.html',\n styleUrl: './tng-switch.component.css',\n})\nexport class TngSwitchComponent {\n public readonly ariaLabel = input<string | null>(null);\n public readonly checked = input<boolean, boolean | string>(false, {\n transform: booleanAttribute,\n });\n public readonly disabled = input<boolean, boolean | string>(false, {\n transform: booleanAttribute,\n });\n public readonly name = input<string | null>(null);\n public readonly required = input<boolean, boolean | string>(false, {\n transform: booleanAttribute,\n });\n public readonly value = input<string>('on');\n\n public readonly checkedChange = output<boolean>();\n\n public onKeydown(event: TngSwitchKeyboardEvent): void {\n if (this.disabled()) {\n return;\n }\n\n const nextValue = resolveTngSwitchArrowKey(event.key);\n if (nextValue === null || nextValue === this.checked()) {\n return;\n }\n\n event.preventDefault();\n this.checkedChange.emit(nextValue);\n }\n\n public onToggle(): void {\n if (this.disabled()) {\n return;\n }\n\n this.checkedChange.emit(toggleTngSwitchState(this.checked()));\n }\n}\n","<div class=\"tng-switch-root\" [attr.data-disabled]=\"disabled() ? '' : null\">\n <button\n tngSwitch\n class=\"tng-switch-control\"\n [ariaLabel]=\"ariaLabel()\"\n [checked]=\"checked()\"\n [disabled]=\"disabled()\"\n [required]=\"required()\"\n (click)=\"onToggle()\"\n (keydown)=\"onKeydown($event)\"\n >\n <span class=\"tng-switch-track\">\n <span class=\"tng-switch-thumb\">\n @if (checked()) {\n <span class=\"tng-switch-icon\" aria-hidden=\"true\">\n <ng-content select=\"[onIcon]\"></ng-content>\n </span>\n } @else {\n <span class=\"tng-switch-icon\" aria-hidden=\"true\">\n <ng-content select=\"[offIcon]\"></ng-content>\n </span>\n }\n </span>\n </span>\n </button>\n <input\n class=\"tng-switch-native-input\"\n type=\"checkbox\"\n [checked]=\"checked()\"\n [disabled]=\"disabled()\"\n [required]=\"required()\"\n [attr.name]=\"name()\"\n [value]=\"value()\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n />\n <span class=\"tng-switch-label\">\n <ng-content />\n </span>\n</div>\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { type TngTextareaResize } from '@tailng-ui/primitives';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
2
3
|
type NullableBooleanInput = boolean | null | string | undefined;
|
|
3
4
|
export declare function readTngTextareaEventValue(event: unknown): string | null;
|
|
4
5
|
export declare class TngTextareaComponent {
|
|
@@ -14,6 +15,8 @@ export declare class TngTextareaComponent {
|
|
|
14
15
|
readonly value: import("@angular/core").InputSignal<string | null>;
|
|
15
16
|
readonly valueChange: import("@angular/core").OutputEmitterRef<string>;
|
|
16
17
|
onInput(event: unknown): void;
|
|
18
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TngTextareaComponent, never>;
|
|
19
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TngTextareaComponent, "tng-textarea", never, { "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; "ariaInvalid": { "alias": "ariaInvalid"; "required": false; "isSignal": true; }; "ariaRequired": { "alias": "ariaRequired"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "resize": { "alias": "resize"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
|
|
17
20
|
}
|
|
18
21
|
export {};
|
|
19
22
|
//# sourceMappingURL=tng-textarea.component.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tng-textarea.component.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/textarea/tng-textarea.component.ts"],"names":[],"mappings":"AACA,OAAO,EAKL,KAAK,iBAAiB,EACvB,MAAM,uBAAuB,CAAC
|
|
1
|
+
{"version":3,"file":"tng-textarea.component.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/textarea/tng-textarea.component.ts"],"names":[],"mappings":"AACA,OAAO,EAKL,KAAK,iBAAiB,EACvB,MAAM,uBAAuB,CAAC;;AAE/B,KAAK,oBAAoB,GAAG,OAAO,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC;AAEhE,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAWvE;AAED,qBAMa,oBAAoB;IAC/B,SAAgB,eAAe,qDAA8B;IAC7D,SAAgB,WAAW,yFAExB;IACH,SAAgB,YAAY,yFAEzB;IACH,SAAgB,QAAQ,8EAErB;IACH,SAAgB,WAAW,qDAA8B;IACzD,SAAgB,QAAQ,8EAErB;IACH,SAAgB,QAAQ,8EAErB;IACH,SAAgB,IAAI,4EAGjB;IACH,SAAgB,MAAM,8EAEnB;IACH,SAAgB,KAAK,qDAA8B;IAEnD,SAAgB,WAAW,mDAAoB;IAExC,OAAO,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;yCA7BzB,oBAAoB;2CAApB,oBAAoB;CAqChC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { __decorate } from "tslib";
|
|
2
1
|
import { booleanAttribute, Component, input, output } from '@angular/core';
|
|
3
2
|
import { coerceTngInputNullableBoolean, normalizeTngTextareaResize, normalizeTngTextareaRows, TngInput, } from '@tailng-ui/primitives';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
4
|
export function readTngTextareaEventValue(event) {
|
|
5
5
|
if (!(event instanceof Event)) {
|
|
6
6
|
return null;
|
|
@@ -11,31 +11,17 @@ export function readTngTextareaEventValue(event) {
|
|
|
11
11
|
}
|
|
12
12
|
return target.value;
|
|
13
13
|
}
|
|
14
|
-
|
|
15
|
-
ariaDescribedBy = input(null);
|
|
16
|
-
ariaInvalid = input(null, {
|
|
17
|
-
|
|
18
|
-
});
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
});
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
});
|
|
25
|
-
placeholder = input(null);
|
|
26
|
-
readonly = input(false, {
|
|
27
|
-
transform: booleanAttribute,
|
|
28
|
-
});
|
|
29
|
-
required = input(false, {
|
|
30
|
-
transform: booleanAttribute,
|
|
31
|
-
});
|
|
32
|
-
rows = input(3, {
|
|
33
|
-
transform: (value) => normalizeTngTextareaRows(typeof value === 'number' ? value : Number(value)),
|
|
34
|
-
});
|
|
35
|
-
resize = input('vertical', {
|
|
36
|
-
transform: normalizeTngTextareaResize,
|
|
37
|
-
});
|
|
38
|
-
value = input(null);
|
|
14
|
+
export class TngTextareaComponent {
|
|
15
|
+
ariaDescribedBy = input(null, ...(ngDevMode ? [{ debugName: "ariaDescribedBy" }] : []));
|
|
16
|
+
ariaInvalid = input(null, { ...(ngDevMode ? { debugName: "ariaInvalid" } : {}), transform: coerceTngInputNullableBoolean });
|
|
17
|
+
ariaRequired = input(null, { ...(ngDevMode ? { debugName: "ariaRequired" } : {}), transform: coerceTngInputNullableBoolean });
|
|
18
|
+
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
|
|
19
|
+
placeholder = input(null, ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
|
|
20
|
+
readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : {}), transform: booleanAttribute });
|
|
21
|
+
required = input(false, { ...(ngDevMode ? { debugName: "required" } : {}), transform: booleanAttribute });
|
|
22
|
+
rows = input(3, { ...(ngDevMode ? { debugName: "rows" } : {}), transform: (value) => normalizeTngTextareaRows(typeof value === 'number' ? value : Number(value)) });
|
|
23
|
+
resize = input('vertical', { ...(ngDevMode ? { debugName: "resize" } : {}), transform: normalizeTngTextareaResize });
|
|
24
|
+
value = input(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
39
25
|
valueChange = output();
|
|
40
26
|
onInput(event) {
|
|
41
27
|
const value = readTngTextareaEventValue(event);
|
|
@@ -44,14 +30,11 @@ let TngTextareaComponent = class TngTextareaComponent {
|
|
|
44
30
|
}
|
|
45
31
|
this.valueChange.emit(value);
|
|
46
32
|
}
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
})
|
|
55
|
-
], TngTextareaComponent);
|
|
56
|
-
export { TngTextareaComponent };
|
|
33
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
34
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: TngTextareaComponent, isStandalone: true, selector: "tng-textarea", inputs: { ariaDescribedBy: { classPropertyName: "ariaDescribedBy", publicName: "ariaDescribedBy", isSignal: true, isRequired: false, transformFunction: null }, ariaInvalid: { classPropertyName: "ariaInvalid", publicName: "ariaInvalid", isSignal: true, isRequired: false, transformFunction: null }, ariaRequired: { classPropertyName: "ariaRequired", publicName: "ariaRequired", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<textarea\n tngInput\n class=\"tng-textarea\"\n [style.resize]=\"resize()\"\n [attr.data-resize]=\"resize()\"\n [rows]=\"rows()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [ariaDescribedBy]=\"ariaDescribedBy()\"\n [ariaInvalid]=\"ariaInvalid()\"\n [ariaRequired]=\"ariaRequired()\"\n [attr.placeholder]=\"placeholder()\"\n [value]=\"value() ?? ''\"\n (input)=\"onInput($event)\"\n></textarea>\n", styles: [":host {\n display: inline-flex;\n width: min(28rem, 100%);\n}\n\n.tng-textarea {\n appearance: none;\n background: var(--tng-semantic-background-surface);\n border: 1px solid var(--tng-semantic-border-strong);\n border-radius: 0.75rem;\n color: var(--tng-semantic-foreground-primary);\n font: inherit;\n line-height: 1.35;\n padding: 0.7rem 0.85rem;\n resize: vertical;\n width: 100%;\n}\n\n.tng-textarea::placeholder {\n color: var(--tng-semantic-foreground-muted);\n}\n\n.tng-textarea:focus-visible {\n box-shadow: 0 0 0 3px var(--tng-semantic-focus-ring);\n outline: none;\n}\n\n.tng-textarea[data-invalid] {\n border-color: var(--tng-semantic-accent-danger);\n}\n\n.tng-textarea:disabled,\n.tng-textarea[data-disabled] {\n cursor: not-allowed;\n opacity: 0.6;\n}\n"], dependencies: [{ kind: "directive", type: TngInput, selector: "input[tngInput], textarea[tngInput]", inputs: ["ariaDescribedBy", "ariaLabel", "ariaLabelledby", "ariaInvalid", "ariaRequired", "disabled", "readonly", "required"], exportAs: ["tngInput"] }] });
|
|
35
|
+
}
|
|
36
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngTextareaComponent, decorators: [{
|
|
37
|
+
type: Component,
|
|
38
|
+
args: [{ selector: 'tng-textarea', imports: [TngInput], template: "<textarea\n tngInput\n class=\"tng-textarea\"\n [style.resize]=\"resize()\"\n [attr.data-resize]=\"resize()\"\n [rows]=\"rows()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [ariaDescribedBy]=\"ariaDescribedBy()\"\n [ariaInvalid]=\"ariaInvalid()\"\n [ariaRequired]=\"ariaRequired()\"\n [attr.placeholder]=\"placeholder()\"\n [value]=\"value() ?? ''\"\n (input)=\"onInput($event)\"\n></textarea>\n", styles: [":host {\n display: inline-flex;\n width: min(28rem, 100%);\n}\n\n.tng-textarea {\n appearance: none;\n background: var(--tng-semantic-background-surface);\n border: 1px solid var(--tng-semantic-border-strong);\n border-radius: 0.75rem;\n color: var(--tng-semantic-foreground-primary);\n font: inherit;\n line-height: 1.35;\n padding: 0.7rem 0.85rem;\n resize: vertical;\n width: 100%;\n}\n\n.tng-textarea::placeholder {\n color: var(--tng-semantic-foreground-muted);\n}\n\n.tng-textarea:focus-visible {\n box-shadow: 0 0 0 3px var(--tng-semantic-focus-ring);\n outline: none;\n}\n\n.tng-textarea[data-invalid] {\n border-color: var(--tng-semantic-accent-danger);\n}\n\n.tng-textarea:disabled,\n.tng-textarea[data-disabled] {\n cursor: not-allowed;\n opacity: 0.6;\n}\n"] }]
|
|
39
|
+
}], propDecorators: { ariaDescribedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedBy", required: false }] }], ariaInvalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaInvalid", required: false }] }], ariaRequired: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaRequired", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], resize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resize", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
|
|
57
40
|
//# sourceMappingURL=tng-textarea.component.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tng-textarea.component.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/textarea/tng-textarea.component.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"tng-textarea.component.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/textarea/tng-textarea.component.ts","../../../../../../../../libs/tailng-ui/components/src/lib/form/textarea/tng-textarea.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC3E,OAAO,EACL,6BAA6B,EAC7B,0BAA0B,EAC1B,wBAAwB,EACxB,QAAQ,GAET,MAAM,uBAAuB,CAAC;;AAI/B,MAAM,UAAU,yBAAyB,CAAC,KAAc;IACtD,IAAI,CAAC,CAAC,KAAK,YAAY,KAAK,CAAC,EAAE,CAAC;QAC9B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;IAC5B,IAAI,CAAC,CAAC,MAAM,YAAY,mBAAmB,CAAC,EAAE,CAAC;QAC7C,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,MAAM,CAAC,KAAK,CAAC;AACtB,CAAC;AAQD,MAAM,OAAO,oBAAoB;IACf,eAAe,GAAG,KAAK,CAAgB,IAAI,2DAAC,CAAC;IAC7C,WAAW,GAAG,KAAK,CAAuC,IAAI,wDAC5E,SAAS,EAAE,6BAA6B,GACxC,CAAC;IACa,YAAY,GAAG,KAAK,CAAuC,IAAI,yDAC7E,SAAS,EAAE,6BAA6B,GACxC,CAAC;IACa,QAAQ,GAAG,KAAK,CAA4B,KAAK,qDAC/D,SAAS,EAAE,gBAAgB,GAC3B,CAAC;IACa,WAAW,GAAG,KAAK,CAAgB,IAAI,uDAAC,CAAC;IACzC,QAAQ,GAAG,KAAK,CAA4B,KAAK,qDAC/D,SAAS,EAAE,gBAAgB,GAC3B,CAAC;IACa,QAAQ,GAAG,KAAK,CAA4B,KAAK,qDAC/D,SAAS,EAAE,gBAAgB,GAC3B,CAAC;IACa,IAAI,GAAG,KAAK,CAA0B,CAAC,iDACrD,SAAS,EAAE,CAAC,KAAsB,EAAU,EAAE,CAC5C,wBAAwB,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAC7E,CAAC;IACa,MAAM,GAAG,KAAK,CAAgD,UAAU,mDACtF,SAAS,EAAE,0BAA0B,GACrC,CAAC;IACa,KAAK,GAAG,KAAK,CAAgB,IAAI,iDAAC,CAAC;IAEnC,WAAW,GAAG,MAAM,EAAU,CAAC;IAExC,OAAO,CAAC,KAAc;QAC3B,MAAM,KAAK,GAAG,yBAAyB,CAAC,KAAK,CAAC,CAAC;QAC/C,IAAI,KAAK,KAAK,IAAI,EAAE,CAAC;YACnB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC;uGApCU,oBAAoB;2FAApB,oBAAoB,+5CC9BjC,scAgBA,40BDUY,QAAQ;;2FAIP,oBAAoB;kBANhC,SAAS;+BACE,cAAc,WACf,CAAC,QAAQ,CAAC","sourcesContent":["import { booleanAttribute, Component, input, output } from '@angular/core';\nimport {\n coerceTngInputNullableBoolean,\n normalizeTngTextareaResize,\n normalizeTngTextareaRows,\n TngInput,\n type TngTextareaResize,\n} from '@tailng-ui/primitives';\n\ntype NullableBooleanInput = boolean | null | string | undefined;\n\nexport function readTngTextareaEventValue(event: unknown): string | null {\n if (!(event instanceof Event)) {\n return null;\n }\n\n const target = event.target;\n if (!(target instanceof HTMLTextAreaElement)) {\n return null;\n }\n\n return target.value;\n}\n\n@Component({\n selector: 'tng-textarea',\n imports: [TngInput],\n templateUrl: './tng-textarea.component.html',\n styleUrl: './tng-textarea.component.css',\n})\nexport class TngTextareaComponent {\n public readonly ariaDescribedBy = input<string | null>(null);\n public readonly ariaInvalid = input<boolean | null, NullableBooleanInput>(null, {\n transform: coerceTngInputNullableBoolean,\n });\n public readonly ariaRequired = input<boolean | null, NullableBooleanInput>(null, {\n transform: coerceTngInputNullableBoolean,\n });\n public readonly disabled = input<boolean, boolean | string>(false, {\n transform: booleanAttribute,\n });\n public readonly placeholder = input<string | null>(null);\n public readonly readonly = input<boolean, boolean | string>(false, {\n transform: booleanAttribute,\n });\n public readonly required = input<boolean, boolean | string>(false, {\n transform: booleanAttribute,\n });\n public readonly rows = input<number, number | string>(3, {\n transform: (value: number | string): number =>\n normalizeTngTextareaRows(typeof value === 'number' ? value : Number(value)),\n });\n public readonly resize = input<TngTextareaResize, TngTextareaResize | string>('vertical', {\n transform: normalizeTngTextareaResize,\n });\n public readonly value = input<string | null>(null);\n\n public readonly valueChange = output<string>();\n\n public onInput(event: unknown): void {\n const value = readTngTextareaEventValue(event);\n if (value === null) {\n return;\n }\n\n this.valueChange.emit(value);\n }\n}\n","<textarea\n tngInput\n class=\"tng-textarea\"\n [style.resize]=\"resize()\"\n [attr.data-resize]=\"resize()\"\n [rows]=\"rows()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n [required]=\"required()\"\n [ariaDescribedBy]=\"ariaDescribedBy()\"\n [ariaInvalid]=\"ariaInvalid()\"\n [ariaRequired]=\"ariaRequired()\"\n [attr.placeholder]=\"placeholder()\"\n [value]=\"value() ?? ''\"\n (input)=\"onInput($event)\"\n></textarea>\n"]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { OnInit } from '@angular/core';
|
|
2
2
|
import { type ControlValueAccessor } from '@angular/forms';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
3
4
|
export declare function toggleTngToggleState(pressed: boolean): boolean;
|
|
4
5
|
export declare function resolveTngToggleAriaLabel(pressed: boolean, pressedLabel: string, unpressedLabel: string): string;
|
|
5
6
|
type NullableBooleanInput = '' | 'false' | 'true' | boolean | null | undefined;
|
|
@@ -34,6 +35,8 @@ export declare class TngToggleComponent implements ControlValueAccessor, OnInit
|
|
|
34
35
|
writeValue(value: unknown): void;
|
|
35
36
|
private groupItemValue;
|
|
36
37
|
private groupManagesState;
|
|
38
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TngToggleComponent, never>;
|
|
39
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TngToggleComponent, "tng-toggle", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "pressed": { "alias": "pressed"; "required": false; "isSignal": true; }; "defaultPressed": { "alias": "defaultPressed"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "pressedLabel": { "alias": "pressedLabel"; "required": false; "isSignal": true; }; "unpressedLabel": { "alias": "unpressedLabel"; "required": false; "isSignal": true; }; }, { "pressedChange": "pressedChange"; }, never, ["[onIcon]", "[offIcon]"], true, never>;
|
|
37
40
|
}
|
|
38
41
|
export {};
|
|
39
42
|
//# sourceMappingURL=tng-toggle.component.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tng-toggle.component.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/toggle/tng-toggle.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,MAAM,EAOP,MAAM,eAAe,CAAC;AACvB,OAAO,EAAqB,KAAK,oBAAoB,EAAE,MAAM,gBAAgB,CAAC
|
|
1
|
+
{"version":3,"file":"tng-toggle.component.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/components/src/lib/form/toggle/tng-toggle.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,MAAM,EAOP,MAAM,eAAe,CAAC;AACvB,OAAO,EAAqB,KAAK,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;;AAO9E,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAE9D;AAED,wBAAgB,yBAAyB,CACvC,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,MAAM,EACpB,cAAc,EAAE,MAAM,GACrB,MAAM,CAER;AAED,KAAK,oBAAoB,GAAG,EAAE,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,GAAG,SAAS,CAAC;AAqB/E,qBAmBa,kBAAmB,YAAW,oBAAoB,EAAE,MAAM;IACrE,OAAO,CAAC,QAAQ,CAAC,KAAK,CAGnB;IACH,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAiB;IACjD,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAiB;IAChD,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAiB;IAC5C,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAiB;IAE7C,OAAO,CAAC,eAAe,CAA6C;IACpE,OAAO,CAAC,gBAAgB,CAA8B;IAEtD,SAAgB,SAAS,qDAA8B;IACvD,SAAgB,cAAc,qDAA8B;IAC5D,SAAgB,eAAe,qDAA8B;IAC7D,SAAgB,KAAK,qDAA8B;IAEnD,SAAgB,OAAO,yFAEpB;IACH,SAAgB,cAAc,8EAE3B;IACH,SAAgB,QAAQ,8EAErB;IACH,SAAgB,YAAY,8CAA4B;IACxD,SAAgB,cAAc,8CAA6B;IAE3D,SAAgB,aAAa,oDAAqB;IAElD,SAAS,CAAC,QAAQ,CAAC,gBAAgB,0CAOhC;IAEH,SAAS,CAAC,QAAQ,CAAC,eAAe,0CAgB/B;;IAMI,QAAQ,IAAI,IAAI;IAIhB,MAAM,IAAI,IAAI;IAId,wBAAwB,CAAC,WAAW,EAAE,OAAO,GAAG,IAAI;IAepD,YAAY,IAAI,MAAM,GAAG,IAAI;IAkB7B,gBAAgB,CAAC,EAAE,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,GAAG,IAAI;IAKpD,iBAAiB,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,IAAI;IAKvC,gBAAgB,CAAC,UAAU,EAAE,OAAO,GAAG,IAAI;IAK3C,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAKvC,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,iBAAiB;yCAhId,kBAAkB;2CAAlB,kBAAkB;CAmI9B"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { __decorate } from "tslib";
|
|
2
1
|
import { booleanAttribute, Component, computed, forwardRef, inject, input, output, signal, } from '@angular/core';
|
|
3
2
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
4
3
|
import { coerceTngToggleNullableBoolean, TngToggle as TngTogglePrimitive, TngToggleGroup as TngToggleGroupPrimitive, } from '@tailng-ui/primitives';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
5
|
export function toggleTngToggleState(pressed) {
|
|
6
6
|
return !pressed;
|
|
7
7
|
}
|
|
@@ -23,32 +23,26 @@ function injectParentToggleGroup() {
|
|
|
23
23
|
skipSelf: true,
|
|
24
24
|
});
|
|
25
25
|
}
|
|
26
|
-
|
|
26
|
+
export class TngToggleComponent {
|
|
27
27
|
group = inject(TngToggleGroupPrimitive, {
|
|
28
28
|
optional: true,
|
|
29
29
|
skipSelf: true,
|
|
30
30
|
});
|
|
31
|
-
internalPressed = signal(false);
|
|
32
|
-
cvaModeEnabled = signal(false);
|
|
33
|
-
cvaPressed = signal(false);
|
|
34
|
-
cvaDisabled = signal(false);
|
|
31
|
+
internalPressed = signal(false, ...(ngDevMode ? [{ debugName: "internalPressed" }] : []));
|
|
32
|
+
cvaModeEnabled = signal(false, ...(ngDevMode ? [{ debugName: "cvaModeEnabled" }] : []));
|
|
33
|
+
cvaPressed = signal(false, ...(ngDevMode ? [{ debugName: "cvaPressed" }] : []));
|
|
34
|
+
cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "cvaDisabled" }] : []));
|
|
35
35
|
onControlChange = noControlChange;
|
|
36
36
|
onControlTouched = noControlTouch;
|
|
37
|
-
ariaLabel = input(null);
|
|
38
|
-
ariaLabelledby = input(null);
|
|
39
|
-
ariaDescribedBy = input(null);
|
|
40
|
-
value = input(null);
|
|
41
|
-
pressed = input(null, {
|
|
42
|
-
|
|
43
|
-
});
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
});
|
|
47
|
-
disabled = input(false, {
|
|
48
|
-
transform: booleanAttribute,
|
|
49
|
-
});
|
|
50
|
-
pressedLabel = input('Enabled');
|
|
51
|
-
unpressedLabel = input('Disabled');
|
|
37
|
+
ariaLabel = input(null, ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
|
|
38
|
+
ariaLabelledby = input(null, ...(ngDevMode ? [{ debugName: "ariaLabelledby" }] : []));
|
|
39
|
+
ariaDescribedBy = input(null, ...(ngDevMode ? [{ debugName: "ariaDescribedBy" }] : []));
|
|
40
|
+
value = input(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
41
|
+
pressed = input(null, { ...(ngDevMode ? { debugName: "pressed" } : {}), transform: coerceTngToggleNullableBoolean });
|
|
42
|
+
defaultPressed = input(false, { ...(ngDevMode ? { debugName: "defaultPressed" } : {}), transform: booleanAttribute });
|
|
43
|
+
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
|
|
44
|
+
pressedLabel = input('Enabled', ...(ngDevMode ? [{ debugName: "pressedLabel" }] : []));
|
|
45
|
+
unpressedLabel = input('Disabled', ...(ngDevMode ? [{ debugName: "unpressedLabel" }] : []));
|
|
52
46
|
pressedChange = output();
|
|
53
47
|
resolvedDisabled = computed(() => {
|
|
54
48
|
const groupDisabled = this.group?.isGroupDisabled() === true && this.groupManagesState();
|
|
@@ -56,7 +50,7 @@ let TngToggleComponent = class TngToggleComponent {
|
|
|
56
50
|
return this.cvaDisabled() || groupDisabled;
|
|
57
51
|
}
|
|
58
52
|
return this.disabled() || groupDisabled;
|
|
59
|
-
});
|
|
53
|
+
}, ...(ngDevMode ? [{ debugName: "resolvedDisabled" }] : []));
|
|
60
54
|
resolvedPressed = computed(() => {
|
|
61
55
|
const groupItemValue = this.groupItemValue();
|
|
62
56
|
if (groupItemValue !== null && this.group !== null) {
|
|
@@ -70,7 +64,7 @@ let TngToggleComponent = class TngToggleComponent {
|
|
|
70
64
|
return controlledPressed;
|
|
71
65
|
}
|
|
72
66
|
return this.internalPressed();
|
|
73
|
-
});
|
|
67
|
+
}, ...(ngDevMode ? [{ debugName: "resolvedPressed" }] : []));
|
|
74
68
|
constructor() {
|
|
75
69
|
this.internalPressed.set(false);
|
|
76
70
|
}
|
|
@@ -126,27 +120,33 @@ let TngToggleComponent = class TngToggleComponent {
|
|
|
126
120
|
groupManagesState() {
|
|
127
121
|
return this.group !== null && this.groupItemValue() !== null;
|
|
128
122
|
}
|
|
129
|
-
};
|
|
130
|
-
|
|
131
|
-
Component({
|
|
132
|
-
selector: 'tng-toggle',
|
|
133
|
-
imports: [TngTogglePrimitive],
|
|
134
|
-
templateUrl: './tng-toggle.component.html',
|
|
135
|
-
styleUrl: './tng-toggle.component.css',
|
|
136
|
-
viewProviders: [
|
|
137
|
-
{
|
|
138
|
-
provide: TngToggleGroupPrimitive,
|
|
139
|
-
useFactory: injectParentToggleGroup,
|
|
140
|
-
},
|
|
141
|
-
],
|
|
142
|
-
providers: [
|
|
123
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
124
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: TngToggleComponent, isStandalone: true, selector: "tng-toggle", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedBy: { classPropertyName: "ariaDescribedBy", publicName: "ariaDescribedBy", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, pressed: { classPropertyName: "pressed", publicName: "pressed", isSignal: true, isRequired: false, transformFunction: null }, defaultPressed: { classPropertyName: "defaultPressed", publicName: "defaultPressed", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, pressedLabel: { classPropertyName: "pressedLabel", publicName: "pressedLabel", isSignal: true, isRequired: false, transformFunction: null }, unpressedLabel: { classPropertyName: "unpressedLabel", publicName: "unpressedLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pressedChange: "pressedChange" }, providers: [
|
|
143
125
|
{
|
|
144
126
|
provide: NG_VALUE_ACCESSOR,
|
|
145
127
|
useExisting: forwardRef(() => TngToggleComponent),
|
|
146
128
|
multi: true,
|
|
147
129
|
},
|
|
148
|
-
],
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
130
|
+
], ngImport: i0, template: "<button\n tngToggle\n class=\"tng-toggle-control\"\n [tngToggleValue]=\"value()\"\n [pressed]=\"resolvedPressed()\"\n [defaultPressed]=\"defaultPressed()\"\n [disabled]=\"resolvedDisabled()\"\n [ariaLabel]=\"getAriaLabel()\"\n [ariaLabelledby]=\"ariaLabelledby()\"\n [ariaDescribedBy]=\"ariaDescribedBy()\"\n (pressedChange)=\"onPrimitivePressedChange($event)\"\n (blur)=\"onBlur()\"\n>\n @if (resolvedPressed()) {\n <span class=\"tng-toggle-icon\">\n <ng-content select=\"[onIcon]\">on</ng-content>\n </span>\n } @else {\n <span class=\"tng-toggle-icon\">\n <ng-content select=\"[offIcon]\">off</ng-content>\n </span>\n }\n</button>\n", styles: [":host {\n display: inline-flex;\n}\n\n.tng-toggle-control {\n align-items: center;\n background: var(--tng-semantic-background-surface);\n border: 1px solid var(--tng-semantic-border-strong);\n border-radius: 0.75rem;\n color: var(--tng-semantic-foreground-primary);\n cursor: pointer;\n display: inline-flex;\n font-size: 0.875rem;\n font-weight: 600;\n height: 2.25rem;\n justify-content: center;\n transition:\n background-color 150ms ease,\n border-color 150ms ease,\n color 150ms ease;\n width: 2.25rem;\n}\n\n.tng-toggle-control[data-state='on'] {\n background: var(--tng-semantic-accent-brand);\n border-color: var(--tng-semantic-accent-brand);\n color: var(--tng-color-white);\n}\n\n.tng-toggle-control[data-disabled] {\n cursor: not-allowed;\n opacity: 0.6;\n}\n\n.tng-toggle-control:focus-visible {\n outline: 2px solid var(--tng-semantic-focus-ring);\n outline-offset: 2px;\n}\n\n.tng-toggle-icon {\n display: inline-flex;\n line-height: 1;\n}\n"], dependencies: [{ kind: "directive", type: TngTogglePrimitive, selector: "button[tngToggle]", inputs: ["ariaLabel", "ariaLabelledby", "ariaDescribedBy", "tngToggleValue", "pressed", "defaultPressed", "disabled"], outputs: ["pressedChange"], exportAs: ["tngToggle"] }], viewProviders: [
|
|
131
|
+
{
|
|
132
|
+
provide: TngToggleGroupPrimitive,
|
|
133
|
+
useFactory: injectParentToggleGroup,
|
|
134
|
+
},
|
|
135
|
+
] });
|
|
136
|
+
}
|
|
137
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: TngToggleComponent, decorators: [{
|
|
138
|
+
type: Component,
|
|
139
|
+
args: [{ selector: 'tng-toggle', imports: [TngTogglePrimitive], viewProviders: [
|
|
140
|
+
{
|
|
141
|
+
provide: TngToggleGroupPrimitive,
|
|
142
|
+
useFactory: injectParentToggleGroup,
|
|
143
|
+
},
|
|
144
|
+
], providers: [
|
|
145
|
+
{
|
|
146
|
+
provide: NG_VALUE_ACCESSOR,
|
|
147
|
+
useExisting: forwardRef(() => TngToggleComponent),
|
|
148
|
+
multi: true,
|
|
149
|
+
},
|
|
150
|
+
], template: "<button\n tngToggle\n class=\"tng-toggle-control\"\n [tngToggleValue]=\"value()\"\n [pressed]=\"resolvedPressed()\"\n [defaultPressed]=\"defaultPressed()\"\n [disabled]=\"resolvedDisabled()\"\n [ariaLabel]=\"getAriaLabel()\"\n [ariaLabelledby]=\"ariaLabelledby()\"\n [ariaDescribedBy]=\"ariaDescribedBy()\"\n (pressedChange)=\"onPrimitivePressedChange($event)\"\n (blur)=\"onBlur()\"\n>\n @if (resolvedPressed()) {\n <span class=\"tng-toggle-icon\">\n <ng-content select=\"[onIcon]\">on</ng-content>\n </span>\n } @else {\n <span class=\"tng-toggle-icon\">\n <ng-content select=\"[offIcon]\">off</ng-content>\n </span>\n }\n</button>\n", styles: [":host {\n display: inline-flex;\n}\n\n.tng-toggle-control {\n align-items: center;\n background: var(--tng-semantic-background-surface);\n border: 1px solid var(--tng-semantic-border-strong);\n border-radius: 0.75rem;\n color: var(--tng-semantic-foreground-primary);\n cursor: pointer;\n display: inline-flex;\n font-size: 0.875rem;\n font-weight: 600;\n height: 2.25rem;\n justify-content: center;\n transition:\n background-color 150ms ease,\n border-color 150ms ease,\n color 150ms ease;\n width: 2.25rem;\n}\n\n.tng-toggle-control[data-state='on'] {\n background: var(--tng-semantic-accent-brand);\n border-color: var(--tng-semantic-accent-brand);\n color: var(--tng-color-white);\n}\n\n.tng-toggle-control[data-disabled] {\n cursor: not-allowed;\n opacity: 0.6;\n}\n\n.tng-toggle-control:focus-visible {\n outline: 2px solid var(--tng-semantic-focus-ring);\n outline-offset: 2px;\n}\n\n.tng-toggle-icon {\n display: inline-flex;\n line-height: 1;\n}\n"] }]
|
|
151
|
+
}], ctorParameters: () => [], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], ariaDescribedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedBy", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], pressed: [{ type: i0.Input, args: [{ isSignal: true, alias: "pressed", required: false }] }], defaultPressed: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultPressed", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], pressedLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "pressedLabel", required: false }] }], unpressedLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "unpressedLabel", required: false }] }], pressedChange: [{ type: i0.Output, args: ["pressedChange"] }] } });
|
|
152
152
|
//# sourceMappingURL=tng-toggle.component.js.map
|