@taiga-ui/kit
Version:
Taiga UI Angular main components kit
47 lines (43 loc) • 5.11 kB
JavaScript
import * as i0 from '@angular/core';
import { InjectionToken, ChangeDetectionStrategy, ViewEncapsulation, Component, inject, effect, input, Directive } from '@angular/core';
import { TUI_VERSION } from '@taiga-ui/cdk/constants';
import { tuiProvide } from '@taiga-ui/cdk/utils/di';
import { tuiInjectElement } from '@taiga-ui/cdk/utils/dom';
import { tuiWithStyles } from '@taiga-ui/cdk/utils/miscellaneous';
import { TuiDropdownDirective } from '@taiga-ui/core/portals/dropdown';
import { TUI_ICON_END } from '@taiga-ui/core/tokens';
const TUI_CHEVRON = new InjectionToken(ngDevMode ? 'TUI_CHEVRON' : '', {
factory: () => '@tui.chevron-down',
});
class Styles {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: Styles, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.21", type: Styles, isStandalone: true, selector: "ng-component", exportAs: ["tui-chevron-5.7.0"], ngImport: i0, template: '', isInline: true, styles: ["[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"]):after,tui-icon[tuiChevron]:where(*[data-tui-version=\"5.7.0\"]):before{transition-property:transform,color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;cursor:pointer;font-size:1rem}[tuiButton][data-size=m][tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"]):after{margin-inline-end:-.125rem}[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"])._chevron-rotated:after,tui-icon[tuiChevron]:where(*[data-tui-version=\"5.7.0\"])._chevron-rotated:before{transform:rotate(180deg)}tui-textfield[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"]){--t-stroke: var(--tui-stroke-width)}tui-textfield[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"]):after{transform:rotate(0) scale(calc(2 / 3));font-size:1.5rem;--tui-stroke-width: calc(var(--t-stroke) / 2 * 3)}tui-textfield[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"])._chevron-rotated:after{transform:rotate(180deg) scale(calc(2 / 3))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: Styles, decorators: [{
type: Component,
args: [{ template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: `tui-chevron-${TUI_VERSION}`, styles: ["[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"]):after,tui-icon[tuiChevron]:where(*[data-tui-version=\"5.7.0\"]):before{transition-property:transform,color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;cursor:pointer;font-size:1rem}[tuiButton][data-size=m][tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"]):after{margin-inline-end:-.125rem}[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"])._chevron-rotated:after,tui-icon[tuiChevron]:where(*[data-tui-version=\"5.7.0\"])._chevron-rotated:before{transform:rotate(180deg)}tui-textfield[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"]){--t-stroke: var(--tui-stroke-width)}tui-textfield[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"]):after{transform:rotate(0) scale(calc(2 / 3));font-size:1.5rem;--tui-stroke-width: calc(var(--t-stroke) / 2 * 3)}tui-textfield[tuiChevron][tuiIcons]:where(*[data-tui-version=\"5.7.0\"])._chevron-rotated:after{transform:rotate(180deg) scale(calc(2 / 3))}\n"] }]
}] });
class TuiChevron {
constructor() {
this.el = tuiInjectElement();
this.dropdown = inject(TuiDropdownDirective, { optional: true });
this.nothing = tuiWithStyles(Styles);
this.toggle = effect(() => this.el.classList.toggle('_chevron-rotated', this.rotated() || (this.rotated() === '' && !!this.dropdown?.ref())));
this.rotated = input('', { alias: 'tuiChevron' });
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TuiChevron, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.21", type: TuiChevron, isStandalone: true, selector: "[tuiChevron]", inputs: { rotated: { classPropertyName: "rotated", publicName: "tuiChevron", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "tuiChevron": "" } }, providers: [tuiProvide(TUI_ICON_END, TUI_CHEVRON)], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TuiChevron, decorators: [{
type: Directive,
args: [{
selector: '[tuiChevron]',
providers: [tuiProvide(TUI_ICON_END, TUI_CHEVRON)],
host: { tuiChevron: '' },
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { TUI_CHEVRON, TuiChevron };
//# sourceMappingURL=taiga-ui-kit-directives-chevron.mjs.map