@taiga-ui/kit
Version:
Taiga UI Angular main components kit
35 lines (31 loc) • 7.95 kB
JavaScript
import * as i0 from '@angular/core';
import { ChangeDetectionStrategy, ViewEncapsulation, Component, Directive } from '@angular/core';
import { TUI_VERSION } from '@taiga-ui/cdk/constants';
import { tuiWithStyles } from '@taiga-ui/cdk/utils/miscellaneous';
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-button-group-5.7.0"], ngImport: i0, template: '', isInline: true, styles: ["[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]),[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) tui-elastic-container{transition-property:background,height,border-radius;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;border-radius:var(--tui-radius-xl);overflow:hidden}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]),[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) tui-elastic-container .t-wrapper{display:flex;justify-content:center}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) tui-elastic-container{inline-size:100%}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;display:flex;border:none;outline:none;background:transparent;align-items:center;flex:1;flex-direction:column;padding:1.125rem .25rem;gap:.5rem;font:var(--tui-typography-ui-s);max-inline-size:calc(50% - 1.75rem);cursor:pointer;color:var(--tui-text-action);text-align:center;text-decoration:none;clip-path:inset(0)}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:first-child,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:first-child{clip-path:inset(0 0 0 -10rem)}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:last-child,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:last-child{clip-path:inset(0 -10rem 0 0)}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:active,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:active{background:var(--tui-background-neutral-1)}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:before,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:before,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:after,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:after{position:absolute;inset-block-start:0;background:inherit;inline-size:1.75rem;block-size:100%}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:first-child:before,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:first-child:before{content:\"\";inset-inline-start:-1.75rem}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:last-child:after,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:last-child:after{content:\"\";inset-inline-end:-1.75rem}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button tui-icon,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a tui-icon{font-size:1.75rem}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]):has(button:only-child){border-radius:1rem}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:only-child,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:only-child{inline-size:100%;flex-direction:row;font:var(--tui-typography-ui-l);max-inline-size:100%;justify-content:center}\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-button-group-${TUI_VERSION}`, styles: ["[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]),[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) tui-elastic-container{transition-property:background,height,border-radius;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;border-radius:var(--tui-radius-xl);overflow:hidden}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]),[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) tui-elastic-container .t-wrapper{display:flex;justify-content:center}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) tui-elastic-container{inline-size:100%}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;display:flex;border:none;outline:none;background:transparent;align-items:center;flex:1;flex-direction:column;padding:1.125rem .25rem;gap:.5rem;font:var(--tui-typography-ui-s);max-inline-size:calc(50% - 1.75rem);cursor:pointer;color:var(--tui-text-action);text-align:center;text-decoration:none;clip-path:inset(0)}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:first-child,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:first-child{clip-path:inset(0 0 0 -10rem)}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:last-child,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:last-child{clip-path:inset(0 -10rem 0 0)}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:active,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:active{background:var(--tui-background-neutral-1)}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:before,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:before,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:after,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:after{position:absolute;inset-block-start:0;background:inherit;inline-size:1.75rem;block-size:100%}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:first-child:before,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:first-child:before{content:\"\";inset-inline-start:-1.75rem}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:last-child:after,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:last-child:after{content:\"\";inset-inline-end:-1.75rem}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button tui-icon,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a tui-icon{font-size:1.75rem}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]):has(button:only-child){border-radius:1rem}[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) button:only-child,[tuiButtonGroup]:where(*[data-tui-version=\"5.7.0\"]) a:only-child{inline-size:100%;flex-direction:row;font:var(--tui-typography-ui-l);max-inline-size:100%;justify-content:center}\n"] }]
}] });
class TuiButtonGroup {
constructor() {
this.nothing = tuiWithStyles(Styles);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TuiButtonGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.21", type: TuiButtonGroup, isStandalone: true, selector: "[tuiButtonGroup]", host: { attributes: { "data-tui-version": "5.7.0" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: TuiButtonGroup, decorators: [{
type: Directive,
args: [{
selector: '[tuiButtonGroup]',
host: { 'data-tui-version': TUI_VERSION },
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { TuiButtonGroup };
//# sourceMappingURL=taiga-ui-kit-directives-button-group.mjs.map