@tedi-design-system/angular 8.1.0-rc.10 → 8.1.0-rc.11
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/community/index.d.ts +5 -0
- package/community/index.d.ts.map +1 -1
- package/fesm2022/tedi-design-system-angular-community.mjs +7 -2
- package/fesm2022/tedi-design-system-angular-community.mjs.map +1 -1
- package/fesm2022/tedi-design-system-angular-tedi.mjs +103 -3
- package/fesm2022/tedi-design-system-angular-tedi.mjs.map +1 -1
- package/package.json +1 -1
- package/tedi/index.d.ts +77 -2
- package/tedi/index.d.ts.map +1 -1
|
@@ -3379,7 +3379,7 @@ class ButtonGroupComponent {
|
|
|
3379
3379
|
this.toggle(item.value());
|
|
3380
3380
|
}
|
|
3381
3381
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: ButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3382
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: ButtonGroupComponent, isStandalone: true, selector: "tedi-button-group", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, stretch: { classPropertyName: "stretch", publicName: "stretch", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, enableMobileDropdown: { classPropertyName: "enableMobileDropdown", publicName: "enableMobileDropdown", isSignal: true, isRequired: false, transformFunction: null }, mobileBreakpoint: { classPropertyName: "mobileBreakpoint", publicName: "mobileBreakpoint", isSignal: true, isRequired: false, transformFunction: null }, dropdownLabel: { classPropertyName: "dropdownLabel", publicName: "dropdownLabel", isSignal: true, isRequired: false, transformFunction: null }, dropdownLabelMode: { classPropertyName: "dropdownLabelMode", publicName: "dropdownLabelMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", selectionChange: "selectionChange" }, host: { properties: { "class": "hostClasses()", "attr.role": "isDropdownMode() ? null : 'group'", "attr.aria-label": "ariaLabel() || null" } }, queries: [{ propertyName: "items", predicate: i0.forwardRef(() => ButtonGroupButtonDirective), isSignal: true }], ngImport: i0, template: "<ng-content />\n\n@if (isDropdownMode()) {\n <tedi-dropdown\n class=\"tedi-button-group__dropdown\"\n appendTo=\"body\"\n [offset]=\"0\"\n >\n <button\n tedi-dropdown-trigger\n tedi-button\n type=\"button\"\n [variant]=\"triggerVariant()\"\n [attr.aria-label]=\"ariaLabel() || null\"\n class=\"tedi-button-group__dropdown-trigger\"\n >\n <tedi-icon [name]=\"triggerIcon()\" color=\"inherit\" [size]=\"18\" />\n {{ triggerLabel() }}\n </button>\n\n <tedi-dropdown-content>\n @for (item of items(); track item.value()) {\n <li\n tedi-dropdown-item\n [value]=\"item.value()\"\n [disabled]=\"item.disabled()\"\n [class.tedi-dropdown-item--selected]=\"item.selected()\"\n (itemSelect)=\"onDropdownItemSelect(item)\"\n >\n <tedi-dropdown-item-value>\n @if (item.iconLeft()) {\n <tedi-icon\n [name]=\"item.iconLeft()!\"\n color=\"inherit\"\n [size]=\"18\"\n />\n } @else if (item.icon()) {\n <tedi-icon [name]=\"item.icon()!\" color=\"inherit\" [size]=\"18\" />\n }\n <tedi-dropdown-item-value-label>{{\n item.label()\n }}</tedi-dropdown-item-value-label>\n @if (item.iconRight()) {\n <tedi-icon\n [name]=\"item.iconRight()!\"\n color=\"inherit\"\n [size]=\"18\"\n />\n }\n </tedi-dropdown-item-value>\n </li>\n }\n </tedi-dropdown-content>\n </tedi-dropdown>\n}\n", styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-inactive-text);--_btn-bg: var(--button-group-primary-inactive-background);--_btn-border: var(--button-group-primary-inactive-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-inactive-text);--_btn-focus-bg: var(--button-group-primary-inactive-background);--_btn-focus-border: var(--button-group-primary-inactive-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-inactive-text);--_btn-bg: var(--button-group-secondary-inactive-background);--_btn-border: var(--button-group-secondary-inactive-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-inactive-text);--_btn-focus-bg: var(--button-group-secondary-inactive-background);--_btn-focus-border: var(--button-group-secondary-inactive-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}.tedi-button-group{display:flex}.tedi-button-group--stretch .tedi-button{flex:1}.tedi-button-group .tedi-button:focus-visible{z-index:2}.tedi-button-group .tedi-button[aria-pressed=true]{z-index:1}.tedi-button-group .tedi-button[aria-pressed=true]:not(:disabled){color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group>.tedi-button:not(:first-child){margin-left:calc(var(--tedi-borders-01) * -1);border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group>.tedi-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.tedi-button-group tedi-tooltip:not(:first-child) tedi-tooltip-trigger{margin-left:calc(var(--tedi-borders-01) * -1)}.tedi-button-group tedi-tooltip:not(:first-child) .tedi-button{border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group tedi-tooltip:not(:last-child) .tedi-button{border-top-right-radius:0;border-bottom-right-radius:0}@media(max-width:47.98rem){.tedi-button-group .tedi-button{flex:1}}.tedi-button-group--dropdown-mode>.tedi-button,.tedi-button-group--dropdown-mode>tedi-tooltip{display:none}.tedi-button-group__dropdown{display:flex;flex:1 1 auto}.tedi-button-group__dropdown-trigger{flex:1}.tedi-button-group__dropdown-trigger[aria-expanded=true]{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger{border-radius:var(--button-radius-sm)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary{padding:calc(var(--_btn-padding-y) - var(--tedi-borders-02)) calc(var(--_btn-padding-x) - var(--tedi-borders-02));border-width:var(--tedi-borders-02)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary:not([aria-expanded=true]){border-color:var(--button-group-secondary-selected-border)}.tedi-button.tedi-button-group-button{gap:0}.tedi-button-group-button__label{padding-inline:var(--_btn-inner-spacing)}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: DropdownComponent, selector: "tedi-dropdown", inputs: ["value", "position", "preventOverflow", "offset", "hideOnScroll"], outputs: ["valueChange"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[tedi-dropdown-trigger]", inputs: ["ariaHaspopup"] }, { kind: "component", type: DropdownContentComponent, selector: "tedi-dropdown-content", inputs: ["dropdownRole"] }, { kind: "component", type: DropdownItemComponent, selector: "li[tedi-dropdown-item]", inputs: ["value", "disabled", "clipContent", "closeOnSelect"], outputs: ["itemSelect"] }, { kind: "component", type: DropdownItemValueComponent, selector: "tedi-dropdown-item-value", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: DropdownItemValueLabelComponent, selector: "tedi-dropdown-item-value-label", inputs: ["clipContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3382
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.24", type: ButtonGroupComponent, isStandalone: true, selector: "tedi-button-group", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, stretch: { classPropertyName: "stretch", publicName: "stretch", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, enableMobileDropdown: { classPropertyName: "enableMobileDropdown", publicName: "enableMobileDropdown", isSignal: true, isRequired: false, transformFunction: null }, mobileBreakpoint: { classPropertyName: "mobileBreakpoint", publicName: "mobileBreakpoint", isSignal: true, isRequired: false, transformFunction: null }, dropdownLabel: { classPropertyName: "dropdownLabel", publicName: "dropdownLabel", isSignal: true, isRequired: false, transformFunction: null }, dropdownLabelMode: { classPropertyName: "dropdownLabelMode", publicName: "dropdownLabelMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", selectionChange: "selectionChange" }, host: { properties: { "class": "hostClasses()", "attr.role": "isDropdownMode() ? null : 'group'", "attr.aria-label": "ariaLabel() || null" } }, queries: [{ propertyName: "items", predicate: i0.forwardRef(() => ButtonGroupButtonDirective), isSignal: true }], ngImport: i0, template: "<ng-content />\n\n@if (isDropdownMode()) {\n <tedi-dropdown\n class=\"tedi-button-group__dropdown\"\n appendTo=\"body\"\n [offset]=\"0\"\n >\n <button\n tedi-dropdown-trigger\n tedi-button\n type=\"button\"\n [variant]=\"triggerVariant()\"\n [attr.aria-label]=\"ariaLabel() || null\"\n class=\"tedi-button-group__dropdown-trigger\"\n >\n <tedi-icon [name]=\"triggerIcon()\" color=\"inherit\" [size]=\"18\" />\n {{ triggerLabel() }}\n </button>\n\n <tedi-dropdown-content>\n @for (item of items(); track item.value()) {\n <li\n tedi-dropdown-item\n [value]=\"item.value()\"\n [disabled]=\"item.disabled()\"\n [class.tedi-dropdown-item--selected]=\"item.selected()\"\n (itemSelect)=\"onDropdownItemSelect(item)\"\n >\n <tedi-dropdown-item-value>\n @if (item.iconLeft()) {\n <tedi-icon\n [name]=\"item.iconLeft()!\"\n color=\"inherit\"\n [size]=\"18\"\n />\n } @else if (item.icon()) {\n <tedi-icon [name]=\"item.icon()!\" color=\"inherit\" [size]=\"18\" />\n }\n <tedi-dropdown-item-value-label>{{\n item.label()\n }}</tedi-dropdown-item-value-label>\n @if (item.iconRight()) {\n <tedi-icon\n [name]=\"item.iconRight()!\"\n color=\"inherit\"\n [size]=\"18\"\n />\n }\n </tedi-dropdown-item-value>\n </li>\n }\n </tedi-dropdown-content>\n </tedi-dropdown>\n}\n", styles: [".tedi-button-group{display:flex}.tedi-button-group--stretch .tedi-button{flex:1}.tedi-button-group .tedi-button:focus-visible{z-index:2}.tedi-button-group .tedi-button[aria-pressed=true]{z-index:1}.tedi-button-group .tedi-button[aria-pressed=true]:not(:disabled){color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group>.tedi-button:not(:first-child){margin-left:calc(var(--tedi-borders-01) * -1);border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group>.tedi-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.tedi-button-group tedi-tooltip:not(:first-child) tedi-tooltip-trigger{margin-left:calc(var(--tedi-borders-01) * -1)}.tedi-button-group tedi-tooltip:not(:first-child) .tedi-button{border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group tedi-tooltip:not(:last-child) .tedi-button{border-top-right-radius:0;border-bottom-right-radius:0}@media(max-width:47.98rem){.tedi-button-group .tedi-button{flex:1}}.tedi-button-group--dropdown-mode>.tedi-button,.tedi-button-group--dropdown-mode>tedi-tooltip{display:none}.tedi-button-group__dropdown{display:flex;flex:1 1 auto}.tedi-button-group__dropdown-trigger{flex:1}.tedi-button-group__dropdown-trigger[aria-expanded=true]{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger{border-radius:var(--button-radius-sm)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary{padding:calc(var(--_btn-padding-y) - var(--tedi-borders-02)) calc(var(--_btn-padding-x) - var(--tedi-borders-02));border-width:var(--tedi-borders-02)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary:not([aria-expanded=true]){border-color:var(--button-group-secondary-selected-border)}.tedi-button.tedi-button-group-button{gap:0}.tedi-button-group-button__label{padding-inline:var(--_btn-inner-spacing)}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "[tedi-button]", inputs: ["variant", "size"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: DropdownComponent, selector: "tedi-dropdown", inputs: ["value", "position", "preventOverflow", "offset", "hideOnScroll"], outputs: ["valueChange"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[tedi-dropdown-trigger]", inputs: ["ariaHaspopup"] }, { kind: "component", type: DropdownContentComponent, selector: "tedi-dropdown-content", inputs: ["dropdownRole"] }, { kind: "component", type: DropdownItemComponent, selector: "li[tedi-dropdown-item]", inputs: ["value", "disabled", "clipContent", "closeOnSelect"], outputs: ["itemSelect"] }, { kind: "component", type: DropdownItemValueComponent, selector: "tedi-dropdown-item-value", inputs: ["type", "layout", "selected", "indeterminate", "disabled"] }, { kind: "component", type: DropdownItemValueLabelComponent, selector: "tedi-dropdown-item-value-label", inputs: ["clipContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3383
3383
|
}
|
|
3384
3384
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: ButtonGroupComponent, decorators: [{
|
|
3385
3385
|
type: Component,
|
|
@@ -3396,7 +3396,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
|
|
|
3396
3396
|
"[class]": "hostClasses()",
|
|
3397
3397
|
"[attr.role]": "isDropdownMode() ? null : 'group'",
|
|
3398
3398
|
"[attr.aria-label]": "ariaLabel() || null",
|
|
3399
|
-
}, template: "<ng-content />\n\n@if (isDropdownMode()) {\n <tedi-dropdown\n class=\"tedi-button-group__dropdown\"\n appendTo=\"body\"\n [offset]=\"0\"\n >\n <button\n tedi-dropdown-trigger\n tedi-button\n type=\"button\"\n [variant]=\"triggerVariant()\"\n [attr.aria-label]=\"ariaLabel() || null\"\n class=\"tedi-button-group__dropdown-trigger\"\n >\n <tedi-icon [name]=\"triggerIcon()\" color=\"inherit\" [size]=\"18\" />\n {{ triggerLabel() }}\n </button>\n\n <tedi-dropdown-content>\n @for (item of items(); track item.value()) {\n <li\n tedi-dropdown-item\n [value]=\"item.value()\"\n [disabled]=\"item.disabled()\"\n [class.tedi-dropdown-item--selected]=\"item.selected()\"\n (itemSelect)=\"onDropdownItemSelect(item)\"\n >\n <tedi-dropdown-item-value>\n @if (item.iconLeft()) {\n <tedi-icon\n [name]=\"item.iconLeft()!\"\n color=\"inherit\"\n [size]=\"18\"\n />\n } @else if (item.icon()) {\n <tedi-icon [name]=\"item.icon()!\" color=\"inherit\" [size]=\"18\" />\n }\n <tedi-dropdown-item-value-label>{{\n item.label()\n }}</tedi-dropdown-item-value-label>\n @if (item.iconRight()) {\n <tedi-icon\n [name]=\"item.iconRight()!\"\n color=\"inherit\"\n [size]=\"18\"\n />\n }\n </tedi-dropdown-item-value>\n </li>\n }\n </tedi-dropdown-content>\n </tedi-dropdown>\n}\n", styles: [".tedi-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-button--small{font-size:var(--button-text-size-sm);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-sm-inner-spacing);--_btn-padding-y: var(--button-sm-padding-y);--_btn-padding-x: var(--button-sm-padding-x)}.tedi-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-button--primary{--_btn-bg: var(--button-main-primary-background-default);--_btn-border: var(--button-main-primary-border-default);--_btn-text: var(--button-main-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary{--_btn-hover-bg: var(--button-main-primary-background-hover, var(--button-main-primary-background-default));--_btn-hover-border: var(--button-main-primary-border-hover, var(--button-main-primary-border-default));--_btn-hover-text: var(--button-main-primary-text-hover, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-focus-bg: var(--button-main-primary-background-focus, var(--button-main-primary-background-default));--_btn-focus-border: var(--button-main-primary-border-focus, var(--button-main-primary-border-default));--_btn-focus-text: var(--button-main-primary-text-focus, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-active-bg: var(--button-main-primary-background-active, var(--button-main-primary-background-default));--_btn-active-border: var(--button-main-primary-border-active, var(--button-main-primary-border-default));--_btn-active-text: var(--button-main-primary-text-active, var(--button-main-primary-text-default))}.tedi-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary{--_btn-bg: var(--button-main-secondary-background-default);--_btn-border: var(--button-main-secondary-border-default);--_btn-text: var(--button-main-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary{--_btn-hover-bg: var(--button-main-secondary-background-hover, var(--button-main-secondary-background-default));--_btn-hover-border: var(--button-main-secondary-border-hover, var(--button-main-secondary-border-default));--_btn-hover-text: var(--button-main-secondary-text-hover, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-focus-bg: var(--button-main-secondary-background-focus, var(--button-main-secondary-background-default));--_btn-focus-border: var(--button-main-secondary-border-focus, var(--button-main-secondary-border-default));--_btn-focus-text: var(--button-main-secondary-text-focus, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-active-bg: var(--button-main-secondary-background-active, var(--button-main-secondary-background-default));--_btn-active-border: var(--button-main-secondary-border-active, var(--button-main-secondary-border-default));--_btn-active-text: var(--button-main-secondary-text-active, var(--button-main-secondary-text-default))}.tedi-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-background-hover, var(--button-main-neutral-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-background-focus, var(--button-main-neutral-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-background-active, var(--button-main-neutral-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--success{--_btn-bg: var(--button-main-success-background-default);--_btn-border: var(--button-main-success-border-default);--_btn-text: var(--button-main-success-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--success{--_btn-hover-bg: var(--button-main-success-background-hover, var(--button-main-success-background-default));--_btn-hover-border: var(--button-main-success-border-hover, var(--button-main-success-border-default));--_btn-hover-text: var(--button-main-success-text-hover, var(--button-main-success-text-default))}.tedi-button--success{--_btn-focus-bg: var(--button-main-success-background-focus, var(--button-main-success-background-default));--_btn-focus-border: var(--button-main-success-border-focus, var(--button-main-success-border-default));--_btn-focus-text: var(--button-main-success-text-focus, var(--button-main-success-text-default))}.tedi-button--success{--_btn-active-bg: var(--button-main-success-background-active, var(--button-main-success-background-default));--_btn-active-border: var(--button-main-success-border-active, var(--button-main-success-border-default));--_btn-active-text: var(--button-main-success-text-active, var(--button-main-success-text-default))}.tedi-button--success{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger{--_btn-bg: var(--button-main-danger-background-default);--_btn-border: var(--button-main-danger-border-default);--_btn-text: var(--button-main-danger-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger{--_btn-hover-bg: var(--button-main-danger-background-hover, var(--button-main-danger-background-default));--_btn-hover-border: var(--button-main-danger-border-hover, var(--button-main-danger-border-default));--_btn-hover-text: var(--button-main-danger-text-hover, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-focus-bg: var(--button-main-danger-background-focus, var(--button-main-danger-background-default));--_btn-focus-border: var(--button-main-danger-border-focus, var(--button-main-danger-border-default));--_btn-focus-text: var(--button-main-danger-text-focus, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-active-bg: var(--button-main-danger-background-active, var(--button-main-danger-background-default));--_btn-active-border: var(--button-main-danger-border-active, var(--button-main-danger-border-default));--_btn-active-text: var(--button-main-danger-text-active, var(--button-main-danger-text-default))}.tedi-button--danger{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--danger-neutral:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-background-hover, var(--button-main-danger-neutral-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-background-focus, var(--button-main-danger-neutral-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-background-active, var(--button-main-danger-neutral-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--primary-inverted{--_btn-bg: var(--button-main-primary-inverted-background-default);--_btn-border: var(--button-main-primary-inverted-border-default);--_btn-text: var(--button-main-primary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--primary-inverted{--_btn-hover-bg: var(--button-main-primary-inverted-background-hover, var(--button-main-primary-inverted-background-default));--_btn-hover-border: var(--button-main-primary-inverted-border-hover, var(--button-main-primary-inverted-border-default));--_btn-hover-text: var(--button-main-primary-inverted-text-hover, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-focus-bg: var(--button-main-primary-inverted-background-focus, var(--button-main-primary-inverted-background-default));--_btn-focus-border: var(--button-main-primary-inverted-border-focus, var(--button-main-primary-inverted-border-default));--_btn-focus-text: var(--button-main-primary-inverted-text-focus, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-active-bg: var(--button-main-primary-inverted-background-active, var(--button-main-primary-inverted-background-default));--_btn-active-border: var(--button-main-primary-inverted-border-active, var(--button-main-primary-inverted-border-default));--_btn-active-text: var(--button-main-primary-inverted-text-active, var(--button-main-primary-inverted-text-default))}.tedi-button--primary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--secondary-inverted{--_btn-bg: var(--button-main-secondary-inverted-background-default);--_btn-border: var(--button-main-secondary-inverted-border-default);--_btn-text: var(--button-main-secondary-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--secondary-inverted{--_btn-hover-bg: var(--button-main-secondary-inverted-background-hover, var(--button-main-secondary-inverted-background-default));--_btn-hover-border: var(--button-main-secondary-inverted-border-hover, var(--button-main-secondary-inverted-border-default));--_btn-hover-text: var(--button-main-secondary-inverted-text-hover, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-focus-bg: var(--button-main-secondary-inverted-background-focus, var(--button-main-secondary-inverted-background-default));--_btn-focus-border: var(--button-main-secondary-inverted-border-focus, var(--button-main-secondary-inverted-border-default));--_btn-focus-text: var(--button-main-secondary-inverted-text-focus, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-active-bg: var(--button-main-secondary-inverted-background-active, var(--button-main-secondary-inverted-background-default));--_btn-active-border: var(--button-main-secondary-inverted-border-active, var(--button-main-secondary-inverted-border-default));--_btn-active-text: var(--button-main-secondary-inverted-text-active, var(--button-main-secondary-inverted-text-default))}.tedi-button--secondary-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-background-hover, var(--button-main-neutral-inverted-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-background-focus, var(--button-main-neutral-inverted-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-background-active, var(--button-main-neutral-inverted-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--neutral-inverted:where(.tedi-button--small){--_btn-padding-y: var(--button-sm-neutral-padding-y);--_btn-padding-x: var(--button-sm-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--neutral-inverted:where(.tedi-button--default){--_btn-padding-y: var(--button-md-neutral-padding-y);--_btn-padding-x: var(--button-md-neutral-padding-x);--_btn-padding: calc(var(--_btn-padding-y) - 1px) var(--_btn-padding-x)}.tedi-button--primary-button-group{--_btn-text: var(--button-group-primary-inactive-text);--_btn-bg: var(--button-group-primary-inactive-background);--_btn-border: var(--button-group-primary-inactive-border);--_btn-hover-text: var(--button-group-primary-hover-text);--_btn-hover-bg: var(--button-group-primary-hover-background);--_btn-hover-border: var(--button-group-primary-hover-border);--_btn-active-text: var(--button-group-primary-selected-text);--_btn-active-bg: var(--button-group-primary-selected-background);--_btn-active-border: var(--button-group-primary-selected-border);--_btn-focus-text: var(--button-group-primary-inactive-text);--_btn-focus-bg: var(--button-group-primary-inactive-background);--_btn-focus-border: var(--button-group-primary-inactive-border);--_btn-disabled-text: var(--button-group-primary-disabled-text);--_btn-disabled-bg: var(--button-group-primary-disabled-background);--_btn-disabled-border: var(--button-group-primary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--primary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-primary-selected-text);background:var(--button-group-primary-selected-background);border-color:var(--button-group-primary-selected-border)}.tedi-button--secondary-button-group{--_btn-text: var(--button-group-secondary-inactive-text);--_btn-bg: var(--button-group-secondary-inactive-background);--_btn-border: var(--button-group-secondary-inactive-border);--_btn-hover-text: var(--button-group-secondary-hover-text);--_btn-hover-bg: var(--button-group-secondary-hover-background);--_btn-hover-border: var(--button-group-secondary-hover-border);--_btn-active-text: var(--button-group-secondary-selected-text);--_btn-active-bg: var(--button-group-secondary-selected-background);--_btn-active-border: var(--button-group-secondary-selected-border);--_btn-focus-text: var(--button-group-secondary-inactive-text);--_btn-focus-bg: var(--button-group-secondary-inactive-background);--_btn-focus-border: var(--button-group-secondary-inactive-border);--_btn-disabled-text: var(--button-group-secondary-disabled-text);--_btn-disabled-bg: var(--button-group-secondary-disabled-background);--_btn-disabled-border: var(--button-group-secondary-disabled-border);--_btn-outline: var(--tedi-primary-500);border-radius:var(--button-radius-sm)}.tedi-button--secondary-button-group[aria-pressed=true]:not(:disabled){z-index:1;color:var(--button-group-secondary-selected-text);background:var(--button-group-secondary-selected-background);border-color:var(--button-group-secondary-selected-border);box-shadow:inset 0 0 0 var(--tedi-borders-01) var(--button-group-secondary-selected-border)}.tedi-button[class*=-inverted]:focus-visible{outline:none;border-color:var(--tedi-neutral-100);box-shadow:0 0 0 1px var(--tedi-neutral-100),0 0 0 3px var(--_btn-outline)}.tedi-button--icon-only.tedi-button--neutral{--_btn-bg: var(--button-main-neutral-icon-only-background-default);--_btn-border: var(--button-main-neutral-border-default);--_btn-text: var(--button-main-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral{--_btn-hover-bg: var(--button-main-neutral-icon-only-background-hover, var(--button-main-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-border-hover, var(--button-main-neutral-border-default));--_btn-hover-text: var(--button-main-neutral-text-hover, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-focus-bg: var(--button-main-neutral-icon-only-background-focus, var(--button-main-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-border-focus, var(--button-main-neutral-border-default));--_btn-focus-text: var(--button-main-neutral-text-focus, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-active-bg: var(--button-main-neutral-icon-only-background-active, var(--button-main-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-border-active, var(--button-main-neutral-border-default));--_btn-active-text: var(--button-main-neutral-text-active, var(--button-main-neutral-text-default))}.tedi-button--icon-only.tedi-button--neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-bg: var(--button-main-neutral-inverted-icon-only-background-default);--_btn-border: var(--button-main-neutral-inverted-border-default);--_btn-text: var(--button-main-neutral-inverted-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-hover-bg: var(--button-main-neutral-inverted-icon-only-background-hover, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-hover-border: var(--button-main-neutral-inverted-border-hover, var(--button-main-neutral-inverted-border-default));--_btn-hover-text: var(--button-main-neutral-inverted-text-hover, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-focus-bg: var(--button-main-neutral-inverted-icon-only-background-focus, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-focus-border: var(--button-main-neutral-inverted-border-focus, var(--button-main-neutral-inverted-border-default));--_btn-focus-text: var(--button-main-neutral-inverted-text-focus, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-active-bg: var(--button-main-neutral-inverted-icon-only-background-active, var(--button-main-neutral-inverted-icon-only-background-default));--_btn-active-border: var(--button-main-neutral-inverted-border-active, var(--button-main-neutral-inverted-border-default));--_btn-active-text: var(--button-main-neutral-inverted-text-active, var(--button-main-neutral-inverted-text-default))}.tedi-button--icon-only.tedi-button--neutral-inverted{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-bg: var(--button-main-danger-neutral-icon-only-background-default);--_btn-border: var(--button-main-danger-neutral-border-default);--_btn-text: var(--button-main-danger-neutral-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-hover-bg: var(--button-main-danger-neutral-icon-only-background-hover, var(--button-main-danger-neutral-icon-only-background-default));--_btn-hover-border: var(--button-main-danger-neutral-border-hover, var(--button-main-danger-neutral-border-default));--_btn-hover-text: var(--button-main-danger-neutral-text-hover, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-focus-bg: var(--button-main-danger-neutral-icon-only-background-focus, var(--button-main-danger-neutral-icon-only-background-default));--_btn-focus-border: var(--button-main-danger-neutral-border-focus, var(--button-main-danger-neutral-border-default));--_btn-focus-text: var(--button-main-danger-neutral-text-focus, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-active-bg: var(--button-main-danger-neutral-icon-only-background-active, var(--button-main-danger-neutral-icon-only-background-default));--_btn-active-border: var(--button-main-danger-neutral-border-active, var(--button-main-danger-neutral-border-default));--_btn-active-text: var(--button-main-danger-neutral-text-active, var(--button-main-danger-neutral-text-default))}.tedi-button--icon-only.tedi-button--danger-neutral{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-neutral-background);--_btn-disabled-border: var(--button-main-disabled-neutral-border)}.tedi-button--icon-only.tedi-button--small{width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);padding:var(--button-sm-icon-padding)}.tedi-button-group{display:flex}.tedi-button-group--stretch .tedi-button{flex:1}.tedi-button-group .tedi-button:focus-visible{z-index:2}.tedi-button-group .tedi-button[aria-pressed=true]{z-index:1}.tedi-button-group .tedi-button[aria-pressed=true]:not(:disabled){color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group>.tedi-button:not(:first-child){margin-left:calc(var(--tedi-borders-01) * -1);border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group>.tedi-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.tedi-button-group tedi-tooltip:not(:first-child) tedi-tooltip-trigger{margin-left:calc(var(--tedi-borders-01) * -1)}.tedi-button-group tedi-tooltip:not(:first-child) .tedi-button{border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group tedi-tooltip:not(:last-child) .tedi-button{border-top-right-radius:0;border-bottom-right-radius:0}@media(max-width:47.98rem){.tedi-button-group .tedi-button{flex:1}}.tedi-button-group--dropdown-mode>.tedi-button,.tedi-button-group--dropdown-mode>tedi-tooltip{display:none}.tedi-button-group__dropdown{display:flex;flex:1 1 auto}.tedi-button-group__dropdown-trigger{flex:1}.tedi-button-group__dropdown-trigger[aria-expanded=true]{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger{border-radius:var(--button-radius-sm)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary{padding:calc(var(--_btn-padding-y) - var(--tedi-borders-02)) calc(var(--_btn-padding-x) - var(--tedi-borders-02));border-width:var(--tedi-borders-02)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary:not([aria-expanded=true]){border-color:var(--button-group-secondary-selected-border)}.tedi-button.tedi-button-group-button{gap:0}.tedi-button-group-button__label{padding-inline:var(--_btn-inner-spacing)}\n"] }]
|
|
3399
|
+
}, template: "<ng-content />\n\n@if (isDropdownMode()) {\n <tedi-dropdown\n class=\"tedi-button-group__dropdown\"\n appendTo=\"body\"\n [offset]=\"0\"\n >\n <button\n tedi-dropdown-trigger\n tedi-button\n type=\"button\"\n [variant]=\"triggerVariant()\"\n [attr.aria-label]=\"ariaLabel() || null\"\n class=\"tedi-button-group__dropdown-trigger\"\n >\n <tedi-icon [name]=\"triggerIcon()\" color=\"inherit\" [size]=\"18\" />\n {{ triggerLabel() }}\n </button>\n\n <tedi-dropdown-content>\n @for (item of items(); track item.value()) {\n <li\n tedi-dropdown-item\n [value]=\"item.value()\"\n [disabled]=\"item.disabled()\"\n [class.tedi-dropdown-item--selected]=\"item.selected()\"\n (itemSelect)=\"onDropdownItemSelect(item)\"\n >\n <tedi-dropdown-item-value>\n @if (item.iconLeft()) {\n <tedi-icon\n [name]=\"item.iconLeft()!\"\n color=\"inherit\"\n [size]=\"18\"\n />\n } @else if (item.icon()) {\n <tedi-icon [name]=\"item.icon()!\" color=\"inherit\" [size]=\"18\" />\n }\n <tedi-dropdown-item-value-label>{{\n item.label()\n }}</tedi-dropdown-item-value-label>\n @if (item.iconRight()) {\n <tedi-icon\n [name]=\"item.iconRight()!\"\n color=\"inherit\"\n [size]=\"18\"\n />\n }\n </tedi-dropdown-item-value>\n </li>\n }\n </tedi-dropdown-content>\n </tedi-dropdown>\n}\n", styles: [".tedi-button-group{display:flex}.tedi-button-group--stretch .tedi-button{flex:1}.tedi-button-group .tedi-button:focus-visible{z-index:2}.tedi-button-group .tedi-button[aria-pressed=true]{z-index:1}.tedi-button-group .tedi-button[aria-pressed=true]:not(:disabled){color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group>.tedi-button:not(:first-child){margin-left:calc(var(--tedi-borders-01) * -1);border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group>.tedi-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.tedi-button-group tedi-tooltip:not(:first-child) tedi-tooltip-trigger{margin-left:calc(var(--tedi-borders-01) * -1)}.tedi-button-group tedi-tooltip:not(:first-child) .tedi-button{border-top-left-radius:0;border-bottom-left-radius:0}.tedi-button-group tedi-tooltip:not(:last-child) .tedi-button{border-top-right-radius:0;border-bottom-right-radius:0}@media(max-width:47.98rem){.tedi-button-group .tedi-button{flex:1}}.tedi-button-group--dropdown-mode>.tedi-button,.tedi-button-group--dropdown-mode>tedi-tooltip{display:none}.tedi-button-group__dropdown{display:flex;flex:1 1 auto}.tedi-button-group__dropdown-trigger{flex:1}.tedi-button-group__dropdown-trigger[aria-expanded=true]{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger{border-radius:var(--button-radius-sm)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary{padding:calc(var(--_btn-padding-y) - var(--tedi-borders-02)) calc(var(--_btn-padding-x) - var(--tedi-borders-02));border-width:var(--tedi-borders-02)}.tedi-button-group--segmented .tedi-button-group__dropdown-trigger.tedi-button--secondary:not([aria-expanded=true]){border-color:var(--button-group-secondary-selected-border)}.tedi-button.tedi-button-group-button{gap:0}.tedi-button-group-button__label{padding-inline:var(--_btn-inner-spacing)}\n"] }]
|
|
3400
3400
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], stretch: [{ type: i0.Input, args: [{ isSignal: true, alias: "stretch", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], enableMobileDropdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableMobileDropdown", required: false }] }], mobileBreakpoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobileBreakpoint", required: false }] }], dropdownLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownLabel", required: false }] }], dropdownLabelMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownLabelMode", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], items: [{ type: i0.ContentChildren, args: [forwardRef(() => ButtonGroupButtonDirective), { isSignal: true }] }] } });
|
|
3401
3401
|
|
|
3402
3402
|
/**
|
|
@@ -4365,6 +4365,106 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImpo
|
|
|
4365
4365
|
args: [{ standalone: true, selector: "tedi-collapse", imports: [CollapseButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"tedi-collapse\"\n [class.tedi-collapse--open]=\"isOpen() === true\"\n [class.tedi-collapse--inverted]=\"isInvertedActive()\"\n>\n <button\n tedi-collapse-button\n [open]=\"isOpen()\"\n [openText]=\"openText()\"\n [closeText]=\"closeText()\"\n [hideText]=\"hideCollapseText()\"\n [arrowType]=\"arrowType()\"\n [size]=\"size()\"\n [inverted]=\"inverted()\"\n [ariaControls]=\"collapseContentId\"\n (openChange)=\"isOpen.set($event)\"\n ></button>\n <div class=\"tedi-collapse__content\" [id]=\"collapseContentId\">\n <div class=\"tedi-collapse__extender\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block}.tedi-collapse--inverted{color:var(--general-text-white)}.tedi-collapse__extender{visibility:hidden;min-height:0;padding-top:var(--tedi-dimensions-05);transition:visibility .3s}.tedi-collapse__content{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .3s}.tedi-collapse--open>.tedi-collapse__content{grid-template-rows:1fr}.tedi-collapse--open>.tedi-collapse__content .tedi-collapse__extender{visibility:visible}\n"] }]
|
|
4366
4366
|
}], propDecorators: { openText: [{ type: i0.Input, args: [{ isSignal: true, alias: "openText", required: false }] }], closeText: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeText", required: false }] }], defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], hideCollapseText: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideCollapseText", required: false }] }], arrowType: [{ type: i0.Input, args: [{ isSignal: true, alias: "arrowType", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], inverted: [{ type: i0.Input, args: [{ isSignal: true, alias: "inverted", required: false }] }] } });
|
|
4367
4367
|
|
|
4368
|
+
const edgeStyle = (isPinned, offset = 0) => {
|
|
4369
|
+
if (!isPinned) {
|
|
4370
|
+
return null;
|
|
4371
|
+
}
|
|
4372
|
+
return typeof offset === "number" ? `${offset}px` : offset;
|
|
4373
|
+
};
|
|
4374
|
+
class FloatingButtonComponent {
|
|
4375
|
+
baseButton = inject(BaseButtonDirective);
|
|
4376
|
+
/**
|
|
4377
|
+
* The button's color variant.
|
|
4378
|
+
* @default primary
|
|
4379
|
+
*/
|
|
4380
|
+
variant = input("primary", ...(ngDevMode ? [{ debugName: "variant" }] : []));
|
|
4381
|
+
/**
|
|
4382
|
+
* The button's size.
|
|
4383
|
+
* @default default
|
|
4384
|
+
*/
|
|
4385
|
+
size = input("default", ...(ngDevMode ? [{ debugName: "size" }] : []));
|
|
4386
|
+
/**
|
|
4387
|
+
* `vertical` rotates the button 90° counter-clockwise, with rounded left
|
|
4388
|
+
* corners and square right corners. Intended for desktop side placement;
|
|
4389
|
+
* on mobile prefer a horizontal button near the bottom, or an icon-only one.
|
|
4390
|
+
*
|
|
4391
|
+
* Rotation does not change the layout box. To align the visible button with
|
|
4392
|
+
* an edge, center it in a container that reserves its rotated width and height,
|
|
4393
|
+
* then position the container at that edge. See the Placement story.
|
|
4394
|
+
* @default horizontal
|
|
4395
|
+
*/
|
|
4396
|
+
axis = input("horizontal", ...(ngDevMode ? [{ debugName: "axis" }] : []));
|
|
4397
|
+
/**
|
|
4398
|
+
* CSS positioning mode. Defaults to `fixed`; use `static` to keep the button
|
|
4399
|
+
* in normal document flow.
|
|
4400
|
+
* @default fixed
|
|
4401
|
+
*/
|
|
4402
|
+
position = input("fixed", ...(ngDevMode ? [{ debugName: "position" }] : []));
|
|
4403
|
+
/**
|
|
4404
|
+
* Where to pin the button within its containing block. Applied as `top` / `bottom` /
|
|
4405
|
+
* `left` / `right`; `center` pins the midpoint on that axis. Has no effect when
|
|
4406
|
+
* `position` is `static`.
|
|
4407
|
+
*/
|
|
4408
|
+
placement = input(...(ngDevMode ? [undefined, { debugName: "placement" }] : []));
|
|
4409
|
+
/**
|
|
4410
|
+
* Distance from the pinned edges, defaulting to `0`. Numbers are treated as pixels,
|
|
4411
|
+
* strings accept CSS lengths such as `1rem`. Only the edges named by `placement` apply.
|
|
4412
|
+
*/
|
|
4413
|
+
offset = input(...(ngDevMode ? [undefined, { debugName: "offset" }] : []));
|
|
4414
|
+
/**
|
|
4415
|
+
* Overrides the button's CSS `z-index`. Defaults to `--z-index-feedback` when omitted.
|
|
4416
|
+
*/
|
|
4417
|
+
zIndex = input(...(ngDevMode ? [undefined, { debugName: "zIndex" }] : []));
|
|
4418
|
+
// Keep CSS classes distinct while the Community FloatingButton is still available.
|
|
4419
|
+
classes = computed(() => [
|
|
4420
|
+
"tedi-ready-floating-button",
|
|
4421
|
+
`tedi-ready-floating-button--${this.variant()}`,
|
|
4422
|
+
`tedi-ready-floating-button--${this.size()}`,
|
|
4423
|
+
`tedi-ready-floating-button--${this.axis()}`,
|
|
4424
|
+
].join(" "), ...(ngDevMode ? [{ debugName: "classes" }] : []));
|
|
4425
|
+
/**
|
|
4426
|
+
* Uses the separate `translate` property for centering, while the vertical
|
|
4427
|
+
* orientation is handled by `rotate`.
|
|
4428
|
+
*/
|
|
4429
|
+
placementStyles = computed(() => {
|
|
4430
|
+
const placement = this.position() === "static" ? undefined : this.placement();
|
|
4431
|
+
const { vertical, horizontal } = placement ?? {};
|
|
4432
|
+
const offset = this.offset();
|
|
4433
|
+
const centered = horizontal === "center" || vertical === "center";
|
|
4434
|
+
return {
|
|
4435
|
+
top: vertical === "center"
|
|
4436
|
+
? "50%"
|
|
4437
|
+
: edgeStyle(vertical === "top", offset?.top),
|
|
4438
|
+
bottom: edgeStyle(vertical === "bottom", offset?.bottom),
|
|
4439
|
+
left: horizontal === "center"
|
|
4440
|
+
? "50%"
|
|
4441
|
+
: edgeStyle(horizontal === "left", offset?.left),
|
|
4442
|
+
right: edgeStyle(horizontal === "right", offset?.right),
|
|
4443
|
+
translate: centered
|
|
4444
|
+
? `${horizontal === "center" ? "-50%" : "0"} ${vertical === "center" ? "-50%" : "0"}`
|
|
4445
|
+
: null,
|
|
4446
|
+
};
|
|
4447
|
+
}, ...(ngDevMode ? [{ debugName: "placementStyles" }] : []));
|
|
4448
|
+
ngOnInit() {
|
|
4449
|
+
this.baseButton.classNamePrefix.set("tedi-ready-floating-button");
|
|
4450
|
+
}
|
|
4451
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: FloatingButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4452
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.24", type: FloatingButtonComponent, isStandalone: true, selector: "[tedi-floating-button]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, axis: { classPropertyName: "axis", publicName: "axis", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "offset", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "style.position": "position()", "style.z-index": "zIndex()", "style.top": "placementStyles().top", "style.bottom": "placementStyles().bottom", "style.left": "placementStyles().left", "style.right": "placementStyles().right", "style.translate": "placementStyles().translate" } }, hostDirectives: [{ directive: BaseButtonDirective }], ngImport: i0, template: "<ng-content />", isInline: true, styles: [".tedi-ready-floating-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-ready-floating-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-ready-floating-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-ready-floating-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-ready-floating-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-ready-floating-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-ready-floating-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-ready-floating-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-ready-floating-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-ready-floating-button{z-index:var(--z-index-feedback);box-sizing:border-box;text-wrap:wrap;box-shadow:0 4px 10px 0 var(--general-effect-colors-elevation-general-secondary)}.tedi-ready-floating-button--vertical{flex-shrink:0;white-space:nowrap;border-radius:var(--button-radius-sm) var(--button-radius-sm) 0 0;box-shadow:-4px 0 10px 0 var(--general-effect-colors-elevation-general-secondary);transform-origin:center;rotate:-90deg}.tedi-ready-floating-button--primary{--_btn-bg: var(--button-floating-primary-background-default);--_btn-border: var(--button-floating-primary-border-default);--_btn-text: var(--button-floating-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-ready-floating-button--primary{--_btn-hover-bg: var(--button-floating-primary-background-hover, var(--button-floating-primary-background-default));--_btn-hover-border: var(--button-floating-primary-border-hover, var(--button-floating-primary-border-default));--_btn-hover-text: var(--button-floating-primary-text-hover, var(--button-floating-primary-text-default))}.tedi-ready-floating-button--primary{--_btn-focus-bg: var(--button-floating-primary-background-focus, var(--button-floating-primary-background-default));--_btn-focus-border: var(--button-floating-primary-border-focus, var(--button-floating-primary-border-default));--_btn-focus-text: var(--button-floating-primary-text-focus, var(--button-floating-primary-text-default))}.tedi-ready-floating-button--primary{--_btn-active-bg: var(--button-floating-primary-background-active, var(--button-floating-primary-background-default));--_btn-active-border: var(--button-floating-primary-border-active, var(--button-floating-primary-border-default));--_btn-active-text: var(--button-floating-primary-text-active, var(--button-floating-primary-text-default))}.tedi-ready-floating-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-ready-floating-button--secondary{--_btn-bg: var(--button-floating-secondary-background-default);--_btn-border: var(--button-floating-secondary-border-default);--_btn-text: var(--button-floating-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-ready-floating-button--secondary{--_btn-hover-bg: var(--button-floating-secondary-background-hover, var(--button-floating-secondary-background-default));--_btn-hover-border: var(--button-floating-secondary-border-hover, var(--button-floating-secondary-border-default));--_btn-hover-text: var(--button-floating-secondary-text-hover, var(--button-floating-secondary-text-default))}.tedi-ready-floating-button--secondary{--_btn-focus-bg: var(--button-floating-secondary-background-focus, var(--button-floating-secondary-background-default));--_btn-focus-border: var(--button-floating-secondary-border-focus, var(--button-floating-secondary-border-default));--_btn-focus-text: var(--button-floating-secondary-text-focus, var(--button-floating-secondary-text-default))}.tedi-ready-floating-button--secondary{--_btn-active-bg: var(--button-floating-secondary-background-active, var(--button-floating-secondary-background-default));--_btn-active-border: var(--button-floating-secondary-border-active, var(--button-floating-secondary-border-default));--_btn-active-text: var(--button-floating-secondary-text-active, var(--button-floating-secondary-text-default))}.tedi-ready-floating-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-ready-floating-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-ready-floating-button--large{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-xl-inner-spacing);--_btn-padding-y: var(--button-xl-padding-y);--_btn-padding-x: var(--button-xl-padding-x)}.tedi-ready-floating-button--large.tedi-ready-floating-button--icon-only{width:var(--button-xl-icon-size);height:var(--button-xl-icon-size);padding:var(--button-xl-icon-padding)}.tedi-ready-floating-button:not(.tedi-ready-floating-button--icon-only){min-width:var(--button-width-min);max-width:var(--button-width-max)}.tedi-ready-floating-button--vertical:not(.tedi-ready-floating-button--icon-only){width:max-content}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4453
|
+
}
|
|
4454
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.24", ngImport: i0, type: FloatingButtonComponent, decorators: [{
|
|
4455
|
+
type: Component,
|
|
4456
|
+
args: [{ selector: "[tedi-floating-button]", standalone: true, template: "<ng-content />", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [BaseButtonDirective], host: {
|
|
4457
|
+
"[class]": "classes()",
|
|
4458
|
+
"[style.position]": "position()",
|
|
4459
|
+
"[style.z-index]": "zIndex()",
|
|
4460
|
+
"[style.top]": "placementStyles().top",
|
|
4461
|
+
"[style.bottom]": "placementStyles().bottom",
|
|
4462
|
+
"[style.left]": "placementStyles().left",
|
|
4463
|
+
"[style.right]": "placementStyles().right",
|
|
4464
|
+
"[style.translate]": "placementStyles().translate",
|
|
4465
|
+
}, styles: [".tedi-ready-floating-button{display:inline-flex;gap:var(--_btn-inner-spacing);align-items:center;justify-content:center;padding:var(--_btn-padding);font-family:var(--family-default);font-weight:var(--body-regular-weight);line-height:var(--body-bold-line-height);color:var(--_btn-text);text-decoration:none;cursor:pointer;background:var(--_btn-bg);border:var(--tedi-borders-01) solid var(--_btn-border);border-radius:var(--button-radius-default);transition:.15s ease;transition-property:background-color,border-color}.tedi-ready-floating-button--icon-only{width:var(--button-md-icon-size);height:var(--button-md-icon-size);padding:var(--button-md-icon-padding)}.tedi-ready-floating-button--pl:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-left:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-ready-floating-button--pr:not(.tedi-button--neutral,.tedi-button--danger-neutral,.tedi-button--neutral-inverted,.tedi-button--primary-button-group,.tedi-button--secondary-button-group){padding-right:calc(var(--_btn-padding-x) + var(--_btn-inner-spacing) - 1px)}.tedi-ready-floating-button:hover{color:var(--_btn-hover-text);background:var(--_btn-hover-bg);border-color:var(--_btn-hover-border)}.tedi-ready-floating-button:active{color:var(--_btn-active-text);background:var(--_btn-active-bg);border-color:var(--_btn-active-border)}.tedi-ready-floating-button:focus-visible{color:var(--_btn-focus-text);outline:2px solid var(--_btn-outline);outline-offset:1px;background:var(--_btn-focus-bg);border-color:var(--_btn-focus-border)}.tedi-ready-floating-button:disabled{color:var(--_btn-disabled-text);cursor:not-allowed;background:var(--_btn-disabled-bg);border-color:var(--_btn-disabled-border)}.tedi-ready-floating-button tedi-icon{--_tedi-icon-size: var(--icon-03);color:inherit}.tedi-ready-floating-button{z-index:var(--z-index-feedback);box-sizing:border-box;text-wrap:wrap;box-shadow:0 4px 10px 0 var(--general-effect-colors-elevation-general-secondary)}.tedi-ready-floating-button--vertical{flex-shrink:0;white-space:nowrap;border-radius:var(--button-radius-sm) var(--button-radius-sm) 0 0;box-shadow:-4px 0 10px 0 var(--general-effect-colors-elevation-general-secondary);transform-origin:center;rotate:-90deg}.tedi-ready-floating-button--primary{--_btn-bg: var(--button-floating-primary-background-default);--_btn-border: var(--button-floating-primary-border-default);--_btn-text: var(--button-floating-primary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-ready-floating-button--primary{--_btn-hover-bg: var(--button-floating-primary-background-hover, var(--button-floating-primary-background-default));--_btn-hover-border: var(--button-floating-primary-border-hover, var(--button-floating-primary-border-default));--_btn-hover-text: var(--button-floating-primary-text-hover, var(--button-floating-primary-text-default))}.tedi-ready-floating-button--primary{--_btn-focus-bg: var(--button-floating-primary-background-focus, var(--button-floating-primary-background-default));--_btn-focus-border: var(--button-floating-primary-border-focus, var(--button-floating-primary-border-default));--_btn-focus-text: var(--button-floating-primary-text-focus, var(--button-floating-primary-text-default))}.tedi-ready-floating-button--primary{--_btn-active-bg: var(--button-floating-primary-background-active, var(--button-floating-primary-background-default));--_btn-active-border: var(--button-floating-primary-border-active, var(--button-floating-primary-border-default));--_btn-active-text: var(--button-floating-primary-text-active, var(--button-floating-primary-text-default))}.tedi-ready-floating-button--primary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-ready-floating-button--secondary{--_btn-bg: var(--button-floating-secondary-background-default);--_btn-border: var(--button-floating-secondary-border-default);--_btn-text: var(--button-floating-secondary-text-default);--_btn-outline: var(--tedi-primary-500)}.tedi-ready-floating-button--secondary{--_btn-hover-bg: var(--button-floating-secondary-background-hover, var(--button-floating-secondary-background-default));--_btn-hover-border: var(--button-floating-secondary-border-hover, var(--button-floating-secondary-border-default));--_btn-hover-text: var(--button-floating-secondary-text-hover, var(--button-floating-secondary-text-default))}.tedi-ready-floating-button--secondary{--_btn-focus-bg: var(--button-floating-secondary-background-focus, var(--button-floating-secondary-background-default));--_btn-focus-border: var(--button-floating-secondary-border-focus, var(--button-floating-secondary-border-default));--_btn-focus-text: var(--button-floating-secondary-text-focus, var(--button-floating-secondary-text-default))}.tedi-ready-floating-button--secondary{--_btn-active-bg: var(--button-floating-secondary-background-active, var(--button-floating-secondary-background-default));--_btn-active-border: var(--button-floating-secondary-border-active, var(--button-floating-secondary-border-default));--_btn-active-text: var(--button-floating-secondary-text-active, var(--button-floating-secondary-text-default))}.tedi-ready-floating-button--secondary{--_btn-disabled-text: var(--button-main-disabled-general-text);--_btn-disabled-bg: var(--button-main-disabled-general-background);--_btn-disabled-border: var(--button-main-disabled-general-border)}.tedi-ready-floating-button--default{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-md-inner-spacing);--_btn-padding-y: var(--button-md-padding-y);--_btn-padding-x: var(--button-md-padding-x)}.tedi-ready-floating-button--large{font-size:var(--button-text-size-default);--_btn-padding: calc(var(--_btn-padding-y) - 1px) calc(var(--_btn-padding-x) - 1px);--_btn-inner-spacing: var(--button-xl-inner-spacing);--_btn-padding-y: var(--button-xl-padding-y);--_btn-padding-x: var(--button-xl-padding-x)}.tedi-ready-floating-button--large.tedi-ready-floating-button--icon-only{width:var(--button-xl-icon-size);height:var(--button-xl-icon-size);padding:var(--button-xl-icon-padding)}.tedi-ready-floating-button:not(.tedi-ready-floating-button--icon-only){min-width:var(--button-width-min);max-width:var(--button-width-max)}.tedi-ready-floating-button--vertical:not(.tedi-ready-floating-button--icon-only){width:max-content}\n"] }]
|
|
4466
|
+
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], axis: [{ type: i0.Input, args: [{ isSignal: true, alias: "axis", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], offset: [{ type: i0.Input, args: [{ isSignal: true, alias: "offset", required: false }] }], zIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "zIndex", required: false }] }] } });
|
|
4467
|
+
|
|
4368
4468
|
/**
|
|
4369
4469
|
* A single item inside a `tedi-accordion`. Owns the item's state (expanded)
|
|
4370
4470
|
* and the inputs shared by header and content (selected, showIconCard,
|
|
@@ -22563,5 +22663,5 @@ function provideTedi(config = {}) {
|
|
|
22563
22663
|
* Generated bundle index. Do not edit.
|
|
22564
22664
|
*/
|
|
22565
22665
|
|
|
22566
|
-
export { AVAILABLE_LANGUAGES, AccordionComponent, AccordionItemComponent, AccordionItemContentComponent, AccordionItemHeaderComponent, AlertComponent, AttachmentActionsComponent, AttachmentComponent, BREAKPOINTS, BaseButtonDirective, BreadcrumbItemDirective, BreadcrumbSeparatorDirective, BreadcrumbsComponent, BreakpointService, ButtonComponent, ButtonGroupButtonDirective, ButtonGroupComponent, COUNTER_TAG_WIDTH, CalendarComponent, CardButtonComponent, CardComponent, CardContentComponent, CardHeaderComponent, CardIconComponent, CardRowComponent, CarouselComponent, CarouselContentComponent, CarouselFooterComponent, CarouselHeaderComponent, CarouselIndicatorsComponent, CarouselNavigationComponent, CarouselSlideDirective, CheckboxCardComponent, CheckboxCardGroupComponent, CheckboxComponent, CheckboxGroupComponent, ClosingButtonComponent, ColComponent, CollapseButtonComponent, CollapseComponent, DROPDOWN_API, DROPDOWN_CONTENT_API, DateFieldComponent, DatePickerComponent, DropdownComponent, DropdownContentComponent, DropdownItemComponent, DropdownItemValueComponent, DropdownItemValueLabelComponent, DropdownItemValueMetaComponent, DropdownTriggerDirective, EllipsisComponent, EmptyStateComponent, FeedbackTextComponent, FilterComponent, FilterContentDirective, FilterGroupComponent, FilterPrependDirective, FooterBodyComponent, FooterBottomComponent, FooterComponent, FooterSectionComponent, FooterSideComponent, FormFieldComponent, FormFieldExtraDirective, HeaderActionsComponent, HeaderBottomComponent, HeaderComponent, HeaderContentComponent, HeaderLanguageComponent, HeaderLoginComponent, HeaderLogoComponent, HeaderLogoDarkDirective, HeaderLogoutComponent, HeaderMobileButtonComponent, HeaderProfileComponent, HeaderRoleComponent, HeaderRoleContentDirective, HeaderRoleNoResultsDirective, HeaderRoleTitleDirective, HeaderSearchComponent, HeaderTopComponent, HeadingWithIconComponent, HideAtDirective, HorizontalPushHandler, HorizontalStepperComponent, HorizontalStepperItemComponent, IconComponent, InfoButtonComponent, InfoTooltipComponent, InputGroupComponent, InputGroupPrefixDirective, InputGroupSuffixDirective, LANGUAGE_COOKIE_NAME, LANGUAGE_FALLBACK_VALUE, LabelComponent, LabelRowComponent, LinkComponent, ListComponent, MODAL_DATA, MODAL_SIZE, ModalComponent, ModalContentComponent, ModalFooterComponent, ModalHeaderComponent, ModalRef, ModalService, NumberFieldComponent, PaginationComponent, PopoverComponent, PopoverContentComponent, PopoverTriggerDirective, ProgressBarComponent, RadioCardComponent, RadioCardGroupComponent, RadioComponent, RadioGroupComponent, RowComponent, ScrollFadeComponent, SearchComponent, SearchFooterActionsComponent, SearchFooterTemplateDirective, SearchSuggestionComponent, SearchSuggestionTemplateDirective, SelectComponent, SelectOptionTemplateDirective, SelectTooltipTemplateDirective, SelectValueTemplateDirective, SeparatorComponent, ShowAtDirective, SideNavComponent, SideNavDropdownComponent, SideNavDropdownGroupComponent, SideNavDropdownItemComponent, SideNavGroupTitleComponent, SideNavItemComponent, SideNavOverlayComponent, SideNavToggleComponent, SkeletonBlockComponent, SkeletonComponent, SliderComponent, SpecialOptionControls, SpinnerComponent, StatusBadgeComponent, StatusIndicatorComponent, TAG_GAP, TEDI_FIELD_CONTEXT, TEDI_FORM_FIELD_CONTROL, TEDI_INPUT_GROUP, TEDI_TABLE_CONTEXT, TEDI_THEME_DEFAULT_TOKEN, TEDI_TRANSLATION_DEFAULT_TOKEN, THEME_CLASS_PREFIX, THEME_COOKIE_NAME, THEME_FALLBACK_VALUE, TOAST_DEFAULT_DURATION, TabsComponent, TabsContentComponent, TabsListComponent, TabsTriggerComponent, TagComponent, TediPaginationResultsDirective, TediTableColumnsMenuComponent, TediTableComponent, TediTableHeaderButtonComponent, TediTableToolbarComponent, TediTranslationPipe, TediTranslationService, TextComponent, TextFieldComponent, TextGroupComponent, TextGroupLabelComponent, TextGroupValueComponent, TextareaComponent, ThemeService, TimeFieldComponent, TimePickerComponent, TimelineComponent, TimelineDescriptionComponent, TimelineItemComponent, TimelineTimingsBottomDirective, TimelineTitleComponent, ToastComponent, ToastService, ToggleComponent, TooltipComponent, TooltipContentComponent, TooltipTriggerComponent, TruncateComponent, VerticalSpacingDirective, VerticalSpacingItemDirective, addDays, addMonths, addYears, breakpointInput, buildMonthGrid, calculateArrowOffset, calculateVisibleTagCount, computeGroupSpans, controlDescribedBy, cookieSignal, createTablePersistence, deriveControlState, endOfMonth, formatDate, formatLocaleDate, formatLocaleDateHint, formatLocaleDateLong, formatMonthYear, generateUUID, getCardBorderPlacementColor, getDaysInMonth, getFirstDayOfWeek, getFocusableElements, getISOWeek, getMonthNames, getPaddingCssVariables, getPlacementFromPositionChange, getWeekdayNames, groupRowSpan, highlightParts, injectTediTableContext, isAfterDay, isBeforeDay, isDateInRange, isSameDay, isSameMonth, isSameYear, isValidTime, matchAny, matchDate, normalizeTime, parseDate, parseLocaleDate, provideTedi, resolveCardBorderRadius, startOfMonth, startOfWeek, toConnectedPositions, toggleDateInArray, usePagination };
|
|
22666
|
+
export { AVAILABLE_LANGUAGES, AccordionComponent, AccordionItemComponent, AccordionItemContentComponent, AccordionItemHeaderComponent, AlertComponent, AttachmentActionsComponent, AttachmentComponent, BREAKPOINTS, BaseButtonDirective, BreadcrumbItemDirective, BreadcrumbSeparatorDirective, BreadcrumbsComponent, BreakpointService, ButtonComponent, ButtonGroupButtonDirective, ButtonGroupComponent, COUNTER_TAG_WIDTH, CalendarComponent, CardButtonComponent, CardComponent, CardContentComponent, CardHeaderComponent, CardIconComponent, CardRowComponent, CarouselComponent, CarouselContentComponent, CarouselFooterComponent, CarouselHeaderComponent, CarouselIndicatorsComponent, CarouselNavigationComponent, CarouselSlideDirective, CheckboxCardComponent, CheckboxCardGroupComponent, CheckboxComponent, CheckboxGroupComponent, ClosingButtonComponent, ColComponent, CollapseButtonComponent, CollapseComponent, DROPDOWN_API, DROPDOWN_CONTENT_API, DateFieldComponent, DatePickerComponent, DropdownComponent, DropdownContentComponent, DropdownItemComponent, DropdownItemValueComponent, DropdownItemValueLabelComponent, DropdownItemValueMetaComponent, DropdownTriggerDirective, EllipsisComponent, EmptyStateComponent, FeedbackTextComponent, FilterComponent, FilterContentDirective, FilterGroupComponent, FilterPrependDirective, FloatingButtonComponent, FooterBodyComponent, FooterBottomComponent, FooterComponent, FooterSectionComponent, FooterSideComponent, FormFieldComponent, FormFieldExtraDirective, HeaderActionsComponent, HeaderBottomComponent, HeaderComponent, HeaderContentComponent, HeaderLanguageComponent, HeaderLoginComponent, HeaderLogoComponent, HeaderLogoDarkDirective, HeaderLogoutComponent, HeaderMobileButtonComponent, HeaderProfileComponent, HeaderRoleComponent, HeaderRoleContentDirective, HeaderRoleNoResultsDirective, HeaderRoleTitleDirective, HeaderSearchComponent, HeaderTopComponent, HeadingWithIconComponent, HideAtDirective, HorizontalPushHandler, HorizontalStepperComponent, HorizontalStepperItemComponent, IconComponent, InfoButtonComponent, InfoTooltipComponent, InputGroupComponent, InputGroupPrefixDirective, InputGroupSuffixDirective, LANGUAGE_COOKIE_NAME, LANGUAGE_FALLBACK_VALUE, LabelComponent, LabelRowComponent, LinkComponent, ListComponent, MODAL_DATA, MODAL_SIZE, ModalComponent, ModalContentComponent, ModalFooterComponent, ModalHeaderComponent, ModalRef, ModalService, NumberFieldComponent, PaginationComponent, PopoverComponent, PopoverContentComponent, PopoverTriggerDirective, ProgressBarComponent, RadioCardComponent, RadioCardGroupComponent, RadioComponent, RadioGroupComponent, RowComponent, ScrollFadeComponent, SearchComponent, SearchFooterActionsComponent, SearchFooterTemplateDirective, SearchSuggestionComponent, SearchSuggestionTemplateDirective, SelectComponent, SelectOptionTemplateDirective, SelectTooltipTemplateDirective, SelectValueTemplateDirective, SeparatorComponent, ShowAtDirective, SideNavComponent, SideNavDropdownComponent, SideNavDropdownGroupComponent, SideNavDropdownItemComponent, SideNavGroupTitleComponent, SideNavItemComponent, SideNavOverlayComponent, SideNavToggleComponent, SkeletonBlockComponent, SkeletonComponent, SliderComponent, SpecialOptionControls, SpinnerComponent, StatusBadgeComponent, StatusIndicatorComponent, TAG_GAP, TEDI_FIELD_CONTEXT, TEDI_FORM_FIELD_CONTROL, TEDI_INPUT_GROUP, TEDI_TABLE_CONTEXT, TEDI_THEME_DEFAULT_TOKEN, TEDI_TRANSLATION_DEFAULT_TOKEN, THEME_CLASS_PREFIX, THEME_COOKIE_NAME, THEME_FALLBACK_VALUE, TOAST_DEFAULT_DURATION, TabsComponent, TabsContentComponent, TabsListComponent, TabsTriggerComponent, TagComponent, TediPaginationResultsDirective, TediTableColumnsMenuComponent, TediTableComponent, TediTableHeaderButtonComponent, TediTableToolbarComponent, TediTranslationPipe, TediTranslationService, TextComponent, TextFieldComponent, TextGroupComponent, TextGroupLabelComponent, TextGroupValueComponent, TextareaComponent, ThemeService, TimeFieldComponent, TimePickerComponent, TimelineComponent, TimelineDescriptionComponent, TimelineItemComponent, TimelineTimingsBottomDirective, TimelineTitleComponent, ToastComponent, ToastService, ToggleComponent, TooltipComponent, TooltipContentComponent, TooltipTriggerComponent, TruncateComponent, VerticalSpacingDirective, VerticalSpacingItemDirective, addDays, addMonths, addYears, breakpointInput, buildMonthGrid, calculateArrowOffset, calculateVisibleTagCount, computeGroupSpans, controlDescribedBy, cookieSignal, createTablePersistence, deriveControlState, endOfMonth, formatDate, formatLocaleDate, formatLocaleDateHint, formatLocaleDateLong, formatMonthYear, generateUUID, getCardBorderPlacementColor, getDaysInMonth, getFirstDayOfWeek, getFocusableElements, getISOWeek, getMonthNames, getPaddingCssVariables, getPlacementFromPositionChange, getWeekdayNames, groupRowSpan, highlightParts, injectTediTableContext, isAfterDay, isBeforeDay, isDateInRange, isSameDay, isSameMonth, isSameYear, isValidTime, matchAny, matchDate, normalizeTime, parseDate, parseLocaleDate, provideTedi, resolveCardBorderRadius, startOfMonth, startOfWeek, toConnectedPositions, toggleDateInArray, usePagination };
|
|
22567
22667
|
//# sourceMappingURL=tedi-design-system-angular-tedi.mjs.map
|