@design-system-rte/angular 0.4.4 → 0.4.5
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/esm2022/design-system-rte-angular.mjs +5 -0
- package/esm2022/lib/components/button/button.component.mjs +26 -0
- package/esm2022/lib/components/checkbox/checkbox.component.mjs +35 -0
- package/esm2022/lib/components/checkbox-group/checkbox-group.component.mjs +29 -0
- package/esm2022/lib/components/grid/col/col.directive.mjs +41 -0
- package/esm2022/lib/components/grid/grid.directive.mjs +30 -0
- package/esm2022/lib/components/icon/icon-map.mjs +303 -0
- package/esm2022/lib/components/icon/icon.component.mjs +39 -0
- package/esm2022/lib/components/icon/icon.service.mjs +33 -0
- package/esm2022/lib/components/link/link.component.mjs +20 -0
- package/esm2022/lib/components/radio-button/radio-button.component.mjs +24 -0
- package/esm2022/lib/components/radio-button-group/radio-button-group.component.mjs +29 -0
- package/esm2022/public-api.mjs +10 -0
- package/fesm2022/design-system-rte-angular.mjs +583 -0
- package/fesm2022/design-system-rte-angular.mjs.map +1 -0
- package/index.d.ts +5 -0
- package/lib/components/button/button.component.d.ts +17 -0
- package/lib/components/checkbox/checkbox.component.d.ts +18 -0
- package/lib/components/checkbox-group/checkbox-group.component.d.ts +18 -0
- package/lib/components/grid/col/col.directive.d.ts +14 -0
- package/lib/components/grid/grid.directive.d.ts +10 -0
- package/lib/components/icon/icon-map.d.ts +301 -0
- package/lib/components/icon/icon.component.d.ts +21 -0
- package/lib/components/icon/icon.service.d.ts +11 -0
- package/lib/components/link/link.component.d.ts +9 -0
- package/lib/components/radio-button/radio-button.component.d.ts +13 -0
- package/lib/components/radio-button-group/radio-button-group.component.d.ts +18 -0
- package/package.json +14 -4
- package/CHANGELOG.md +0 -25
- package/ng-package.json +0 -10
- package/src/lib/components/button/button.component.html +0 -10
- package/src/lib/components/button/button.component.scss +0 -154
- package/src/lib/components/button/button.component.spec.ts +0 -22
- package/src/lib/components/button/button.component.stories.ts +0 -99
- package/src/lib/components/button/button.component.ts +0 -28
- package/src/lib/components/checkbox/checkbox.component.html +0 -31
- package/src/lib/components/checkbox/checkbox.component.scss +0 -176
- package/src/lib/components/checkbox/checkbox.component.stories.ts +0 -126
- package/src/lib/components/checkbox/checkbox.component.ts +0 -34
- package/src/lib/components/checkbox-group/checkbox-group.component.html +0 -46
- package/src/lib/components/checkbox-group/checkbox-group.component.scss +0 -82
- package/src/lib/components/checkbox-group/checkbox-group.component.stories.ts +0 -121
- package/src/lib/components/checkbox-group/checkbox-group.component.ts +0 -28
- package/src/lib/components/grid/col/col.directive.ts +0 -35
- package/src/lib/components/grid/grid.directive.stories.ts +0 -150
- package/src/lib/components/grid/grid.directive.ts +0 -22
- package/src/lib/components/icon/icon-map.ts +0 -305
- package/src/lib/components/icon/icon.component.html +0 -1
- package/src/lib/components/icon/icon.component.scss +0 -3
- package/src/lib/components/icon/icon.component.ts +0 -58
- package/src/lib/components/icon/icon.service.ts +0 -33
- package/src/lib/components/icon/icon.stories.ts +0 -84
- package/src/lib/components/icon-button/icon-button.component.html +0 -16
- package/src/lib/components/icon-button/icon-button.component.scss +0 -165
- package/src/lib/components/icon-button/icon-button.component.ts +0 -40
- package/src/lib/components/icon-button/icon-button.stories.ts +0 -200
- package/src/lib/components/icon-button-toggle/icon-button-toggle.component.html +0 -12
- package/src/lib/components/icon-button-toggle/icon-button-toggle.component.ts +0 -36
- package/src/lib/components/icon-button-toggle/icon-button-toggle.stories.ts +0 -197
- package/src/lib/components/link/link.component.html +0 -6
- package/src/lib/components/link/link.component.scss +0 -108
- package/src/lib/components/link/link.component.stories.ts +0 -61
- package/src/lib/components/link/link.component.ts +0 -18
- package/src/lib/components/radio-button/radio-button.component.html +0 -24
- package/src/lib/components/radio-button/radio-button.component.scss +0 -135
- package/src/lib/components/radio-button/radio-button.component.stories.ts +0 -76
- package/src/lib/components/radio-button/radio-button.component.ts +0 -22
- package/src/lib/components/radio-button-group/radio-button-group.component.html +0 -45
- package/src/lib/components/radio-button-group/radio-button-group.component.scss +0 -82
- package/src/lib/components/radio-button-group/radio-button-group.component.stories.ts +0 -121
- package/src/lib/components/radio-button-group/radio-button-group.component.ts +0 -28
- package/src/lib/components/split-button/split-button.component.html +0 -56
- package/src/lib/components/split-button/split-button.component.scss +0 -288
- package/src/lib/components/split-button/split-button.component.stories.ts +0 -227
- package/src/lib/components/split-button/split-button.component.ts +0 -55
- package/src/lib/components/tooltip/tooltip.component.html +0 -7
- package/src/lib/components/tooltip/tooltip.component.scss +0 -116
- package/src/lib/components/tooltip/tooltip.component.ts +0 -16
- package/src/lib/components/tooltip/tooltip.directive.stories.ts +0 -218
- package/src/lib/components/tooltip/tooltip.directive.ts +0 -187
- package/tsconfig.lib.json +0 -20
- package/tsconfig.lib.prod.json +0 -10
- package/tsconfig.spec.json +0 -14
- /package/{src/public-api.ts → public-api.d.ts} +0 -0
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Generated bundle index. Do not edit.
|
|
3
|
+
*/
|
|
4
|
+
export * from './public-api';
|
|
5
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVzaWduLXN5c3RlbS1ydGUtYW5ndWxhci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL2RzLXJ0ZS1saWIvc3JjL2Rlc2lnbi1zeXN0ZW0tcnRlLWFuZ3VsYXIudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWMtYXBpJztcbiJdfQ==
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { Component, input, output } from "@angular/core";
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class ButtonComponent {
|
|
4
|
+
constructor() {
|
|
5
|
+
this.label = input("");
|
|
6
|
+
this.variant = input("primary");
|
|
7
|
+
this.size = input("m");
|
|
8
|
+
this.disabled = input(false);
|
|
9
|
+
this.icon = input("");
|
|
10
|
+
this.ariaLabel = input("");
|
|
11
|
+
this.ariaLabelledBy = input("");
|
|
12
|
+
this.buttonType = input("button");
|
|
13
|
+
this.click = output();
|
|
14
|
+
}
|
|
15
|
+
onClick(event) {
|
|
16
|
+
event.stopPropagation();
|
|
17
|
+
this.click.emit();
|
|
18
|
+
}
|
|
19
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
20
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: ButtonComponent, isStandalone: true, selector: "rte-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, buttonType: { classPropertyName: "buttonType", publicName: "buttonType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, ngImport: i0, template: "<button\n class=\"rte-button {{ variant() }} size-{{ size() }}\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.type]=\"buttonType()\"\n [disabled]=\"disabled()\"\n (click)=\"onClick($event)\"\n>\n <span class=\"rte-button-label\">{{ label() }}</span>\n</button>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-button{align-items:center;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center}.rte-button:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}.rte-button.size-s{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-size:14px;letter-spacing:-.5px;font-weight:600;line-height:20px;height:24px;border-radius:4px;padding:4px 8px}.rte-button.size-s .rte-button-label{margin:0 4px}.rte-button.size-m{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:16px;line-height:24px;letter-spacing:-.5px;height:32px;border-radius:4px;padding:4px 12px}.rte-button.size-m .rte-button-label{margin:0 6px}.rte-button.size-l{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:20px;line-height:28px;letter-spacing:-.5px;height:40px;border-radius:8px;padding:4px 16px}.rte-button.size-l .rte-button-label{margin:0 8px}.rte-button.primary{border:var(--border-brand-default);color:var(--content-primary-inverse);background:var(--background-brand-default)}.rte-button.primary:hover{background:var(--background-brand-hover);border:var(--background-brand-hover)}.rte-button.primary:active{background:var(--background-brand-pressed)}.rte-button.primary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.secondary{background:var(--background-default);border:solid 1px var(--border-brand-default);color:var(--content-brand-default)}.rte-button.secondary:hover{background:var(--background-brand-inverse-hover)}.rte-button.secondary:active{background:var(--background-brand-inverse-pressed)}.rte-button.secondary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);cursor:default}.rte-button.text{background:transparent;border:none;color:var(--content-brand-default)}.rte-button.text:hover{background:var(--background-brand-inverse-hover)}.rte-button.text:active{background:var(--background-brand-inverse-pressed)}.rte-button.text:disabled{background:var(--background-disabled);color:var(--content-disabled);cursor:default}.rte-button.transparent{background:transparent;border:none;color:var(--content-brand-default)}.rte-button.transparent:hover{color:var(--content-brand-hover)}.rte-button.transparent:active{color:var(--content-brand-press)}.rte-button.transparent:disabled{color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.danger{background:var(--background-danger-default);border:none;color:var(--content-primary-inverse);border-radius:8px}.rte-button.danger:hover{background:var(--background-danger-hover)}.rte-button.danger:active{background:var(--background-danger-pressed)}.rte-button.danger:disabled{background:var(--background-disabled);border:var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}\n"] }); }
|
|
21
|
+
}
|
|
22
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
23
|
+
type: Component,
|
|
24
|
+
args: [{ selector: "rte-button", imports: [], standalone: true, template: "<button\n class=\"rte-button {{ variant() }} size-{{ size() }}\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.type]=\"buttonType()\"\n [disabled]=\"disabled()\"\n (click)=\"onClick($event)\"\n>\n <span class=\"rte-button-label\">{{ label() }}</span>\n</button>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-button{align-items:center;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center}.rte-button:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}.rte-button.size-s{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-size:14px;letter-spacing:-.5px;font-weight:600;line-height:20px;height:24px;border-radius:4px;padding:4px 8px}.rte-button.size-s .rte-button-label{margin:0 4px}.rte-button.size-m{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:16px;line-height:24px;letter-spacing:-.5px;height:32px;border-radius:4px;padding:4px 12px}.rte-button.size-m .rte-button-label{margin:0 6px}.rte-button.size-l{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:20px;line-height:28px;letter-spacing:-.5px;height:40px;border-radius:8px;padding:4px 16px}.rte-button.size-l .rte-button-label{margin:0 8px}.rte-button.primary{border:var(--border-brand-default);color:var(--content-primary-inverse);background:var(--background-brand-default)}.rte-button.primary:hover{background:var(--background-brand-hover);border:var(--background-brand-hover)}.rte-button.primary:active{background:var(--background-brand-pressed)}.rte-button.primary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.secondary{background:var(--background-default);border:solid 1px var(--border-brand-default);color:var(--content-brand-default)}.rte-button.secondary:hover{background:var(--background-brand-inverse-hover)}.rte-button.secondary:active{background:var(--background-brand-inverse-pressed)}.rte-button.secondary:disabled{background:var(--background-disabled);border:solid 1px var(--border-disabled);color:var(--content-disabled);cursor:default}.rte-button.text{background:transparent;border:none;color:var(--content-brand-default)}.rte-button.text:hover{background:var(--background-brand-inverse-hover)}.rte-button.text:active{background:var(--background-brand-inverse-pressed)}.rte-button.text:disabled{background:var(--background-disabled);color:var(--content-disabled);cursor:default}.rte-button.transparent{background:transparent;border:none;color:var(--content-brand-default)}.rte-button.transparent:hover{color:var(--content-brand-hover)}.rte-button.transparent:active{color:var(--content-brand-press)}.rte-button.transparent:disabled{color:var(--content-disabled);box-shadow:none;cursor:default}.rte-button.danger{background:var(--background-danger-default);border:none;color:var(--content-primary-inverse);border-radius:8px}.rte-button.danger:hover{background:var(--background-danger-hover)}.rte-button.danger:active{background:var(--background-danger-pressed)}.rte-button.danger:disabled{background:var(--background-disabled);border:var(--border-disabled);color:var(--content-disabled);box-shadow:none;cursor:default}\n"] }]
|
|
25
|
+
}] });
|
|
26
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2RzLXJ0ZS1saWIvc3JjL2xpYi9jb21wb25lbnRzL2J1dHRvbi9idXR0b24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYnV0dG9uL2J1dHRvbi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBV3pELE1BQU0sT0FBTyxlQUFlO0lBUDVCO1FBUVcsVUFBSyxHQUFHLEtBQUssQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUNsQixZQUFPLEdBQUcsS0FBSyxDQUFnQixTQUFTLENBQUMsQ0FBQztRQUMxQyxTQUFJLEdBQUcsS0FBSyxDQUFhLEdBQUcsQ0FBQyxDQUFDO1FBQzlCLGFBQVEsR0FBRyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDeEIsU0FBSSxHQUFHLEtBQUssQ0FBUyxFQUFFLENBQUMsQ0FBQztRQUN6QixjQUFTLEdBQUcsS0FBSyxDQUFTLEVBQUUsQ0FBQyxDQUFDO1FBQzlCLG1CQUFjLEdBQUcsS0FBSyxDQUFTLEVBQUUsQ0FBQyxDQUFDO1FBQ25DLGVBQVUsR0FBRyxLQUFLLENBQWEsUUFBUSxDQUFDLENBQUM7UUFFekMsVUFBSyxHQUFHLE1BQU0sRUFBUSxDQUFDO0tBTWpDO0lBSkMsT0FBTyxDQUFDLEtBQWlDO1FBQ3ZDLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUN4QixJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksRUFBRSxDQUFDO0lBQ3BCLENBQUM7K0dBZlUsZUFBZTttR0FBZixlQUFlLDhtQ0NYNUIsd1VBU1M7OzRGREVJLGVBQWU7a0JBUDNCLFNBQVM7K0JBQ0UsWUFBWSxXQUNiLEVBQUUsY0FDQyxJQUFJIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBpbnB1dCwgb3V0cHV0IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEJ1dHRvblR5cGUgfSBmcm9tIFwiQGRlc2lnbi1zeXN0ZW0tcnRlL2NvcmUvY29tcG9uZW50cy9idXR0b24vYnV0dG9uLmludGVyZmFjZVwiO1xuaW1wb3J0IHsgQnV0dG9uU2l6ZSwgQnV0dG9uVmFyaWFudCB9IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb21wb25lbnRzL2J1dHRvbi9jb21tb24vY29tbW9uLWJ1dHRvblwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwicnRlLWJ1dHRvblwiLFxuICBpbXBvcnRzOiBbXSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGVVcmw6IFwiLi9idXR0b24uY29tcG9uZW50Lmh0bWxcIixcbiAgc3R5bGVVcmw6IFwiLi9idXR0b24uY29tcG9uZW50LnNjc3NcIixcbn0pXG5leHBvcnQgY2xhc3MgQnV0dG9uQ29tcG9uZW50IHtcbiAgcmVhZG9ubHkgbGFiZWwgPSBpbnB1dChcIlwiKTtcbiAgcmVhZG9ubHkgdmFyaWFudCA9IGlucHV0PEJ1dHRvblZhcmlhbnQ+KFwicHJpbWFyeVwiKTtcbiAgcmVhZG9ubHkgc2l6ZSA9IGlucHV0PEJ1dHRvblNpemU+KFwibVwiKTtcbiAgcmVhZG9ubHkgZGlzYWJsZWQgPSBpbnB1dChmYWxzZSk7XG4gIHJlYWRvbmx5IGljb24gPSBpbnB1dDxzdHJpbmc+KFwiXCIpO1xuICByZWFkb25seSBhcmlhTGFiZWwgPSBpbnB1dDxzdHJpbmc+KFwiXCIpO1xuICByZWFkb25seSBhcmlhTGFiZWxsZWRCeSA9IGlucHV0PHN0cmluZz4oXCJcIik7XG4gIHJlYWRvbmx5IGJ1dHRvblR5cGUgPSBpbnB1dDxCdXR0b25UeXBlPihcImJ1dHRvblwiKTtcblxuICByZWFkb25seSBjbGljayA9IG91dHB1dDx2b2lkPigpO1xuXG4gIG9uQ2xpY2soZXZlbnQ6IE1vdXNlRXZlbnQgfCBLZXlib2FyZEV2ZW50KTogdm9pZCB7XG4gICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgdGhpcy5jbGljay5lbWl0KCk7XG4gIH1cbn1cbiIsIjxidXR0b25cbiAgICBjbGFzcz1cInJ0ZS1idXR0b24ge3sgdmFyaWFudCgpIH19IHNpemUte3sgc2l6ZSgpIH19XCJcbiAgICBbYXR0ci5hcmlhLWxhYmVsXT1cImFyaWFMYWJlbCgpXCJcbiAgICBbYXR0ci5hcmlhLWxhYmVsbGVkYnldPVwiYXJpYUxhYmVsbGVkQnkoKVwiXG4gICAgW2F0dHIudHlwZV09XCJidXR0b25UeXBlKClcIlxuICAgIFtkaXNhYmxlZF09XCJkaXNhYmxlZCgpXCJcbiAgICAoY2xpY2spPVwib25DbGljaygkZXZlbnQpXCJcbj5cbiAgICA8c3BhbiBjbGFzcz1cInJ0ZS1idXR0b24tbGFiZWxcIj57eyBsYWJlbCgpIH19PC9zcGFuPlxuPC9idXR0b24+Il19
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { CommonModule } from "@angular/common";
|
|
2
|
+
import { Component, input } from "@angular/core";
|
|
3
|
+
import { IconComponent } from "../icon/icon.component";
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
import * as i1 from "@angular/common";
|
|
6
|
+
export class CheckboxComponent {
|
|
7
|
+
constructor() {
|
|
8
|
+
this.id = input.required();
|
|
9
|
+
this.label = input.required();
|
|
10
|
+
this.value = input("");
|
|
11
|
+
this.indeterminate = input(false);
|
|
12
|
+
this.description = input("");
|
|
13
|
+
this.showLabel = input(true);
|
|
14
|
+
this.disabled = input(false);
|
|
15
|
+
this.error = input(false);
|
|
16
|
+
this.errorMessage = input("");
|
|
17
|
+
this.readOnly = input(false);
|
|
18
|
+
this.checked = input(false);
|
|
19
|
+
this.groupName = input("");
|
|
20
|
+
}
|
|
21
|
+
onKeydown(event) {
|
|
22
|
+
if (event.code === "Space") {
|
|
23
|
+
if (this.readOnly()) {
|
|
24
|
+
event.preventDefault();
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
29
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: CheckboxComponent, isStandalone: true, selector: "rte-checkbox", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, groupName: { classPropertyName: "groupName", publicName: "groupName", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: " <div class=\"rte-checkbox-container\">\n <input\n type=\"checkbox\"\n class=\"rte-checkbox\"\n [id]=\"id()\"\n [value]=\"value()\"\n [ngClass]=\"{'error': error(), 'read-only': readOnly()}\"\n [disabled]=\"disabled()\"\n [indeterminate]=\"indeterminate()\"\n [checked]=\"checked()\"\n (keydown)=\"onKeydown($event)\"\n />\n <rte-icon class=\"rte-checkbox-icons rte-checkbox-icon-selected\" name=\"check-small\" [size]=\"16\"/> \n <rte-icon class=\"rte-checkbox-icons rte-checkbox-icon-indeterminated\" name=\"check-indeterminate\" [size]=\"16\" /> \n <div class=\"rte-checkbox-text-container\">\n <label \n *ngIf=\"showLabel()\" \n class=\"rte-checkbox-label\" \n [for]=\"id()\"\n [ngClass]=\"{\n 'error': error(),\n 'read-only': readOnly(),\n 'disabled': disabled()\n }\"\n >\n {{ label() }}\n </label>\n <p class=\"rte-checkbox-description\">{{ description() }}</p>\n <p *ngIf=\"error() && errorMessage()\" class=\"rte-checkbox-error\">{{ errorMessage() }}</p>\n </div>\n </div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-checkbox-container{display:flex;gap:12px}.rte-checkbox-container .rte-checkbox{appearance:none;display:flex;width:16px;height:16px;border-radius:2px;border:1px solid var(--content-tertiary);opacity:100%;background:var(--background-default);align-items:center;justify-content:center;margin:4px 0}.rte-checkbox-container .rte-checkbox:before{content:\"\";display:none;position:absolute;border-radius:999px;background:var(--background-hover);width:32px;height:32px;z-index:-1}.rte-checkbox-container .rte-checkbox:active:before{opacity:100%;transform:scale(0);transition:transform 0s,opacity 0s}.rte-checkbox-container .rte-checkbox:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}.rte-checkbox-container .rte-checkbox:hover{cursor:pointer}.rte-checkbox-container .rte-checkbox:hover:not(:disabled):before{display:inline-block}.rte-checkbox-container .rte-checkbox:hover:not(:disabled):not(:active):before{opacity:50%;transition:transform .15s ease,opacity .3s ease}.rte-checkbox-container .rte-checkbox:disabled{cursor:default;border:1px solid var(--content-disabled);background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox:disabled~.rte-checkbox-text-container label,.rte-checkbox-container .rte-checkbox:disabled~.rte-checkbox-text-container .rte-checkbox-description{color:var(--content-disabled)}.rte-checkbox-container .rte-checkbox:checked{border:1px solid var(--content-brand-default);background:var(--background-brand-default)}.rte-checkbox-container .rte-checkbox:checked:hover:not(:disabled):not(:active):before{opacity:20%;background:var(--background-brand-default)}.rte-checkbox-container .rte-checkbox:checked:disabled{border:1px solid var(--content-disabled);background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox:checked:disabled~.rte-checkbox-icons{color:var(--content-disabled)}.rte-checkbox-container .rte-checkbox:checked.error{background:var(--background-danger-default)}.rte-checkbox-container .rte-checkbox:checked:not(:indeterminate)~.rte-checkbox-icon-selected{display:block}.rte-checkbox-container .rte-checkbox:indeterminate{border:1px solid var(--content-brand-default);background:var(--background-brand-default)}.rte-checkbox-container .rte-checkbox:indeterminate:hover:not(:disabled):not(:active):before{opacity:20%;background:var(--background-brand-default)}.rte-checkbox-container .rte-checkbox:indeterminate:disabled{border:1px solid var(--content-disabled);background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox:indeterminate:disabled~.rte-checkbox-icons{color:var(--content-disabled)}.rte-checkbox-container .rte-checkbox:indeterminate.error{background:var(--background-danger-default)}.rte-checkbox-container .rte-checkbox:indeterminate~.rte-checkbox-icon-indeterminated{display:block}.rte-checkbox-container .rte-checkbox.read-only{pointer-events:none;cursor:default;border:1px solid var(--content-tertiary);opacity:100%;background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox.read-only~.rte-checkbox-text-container label,.rte-checkbox-container .rte-checkbox.read-only~.rte-checkbox-text-container .checkbox-description{color:var(--content-tertiary)}.rte-checkbox-container .rte-checkbox.read-only~.rte-checkbox-icons{color:var(--content-tertiary)}.rte-checkbox-container .rte-checkbox.read-only.error{border:1px solid var(--content-danger);background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox.error{border:1px solid var(--content-danger);background:var(--background-default)}.rte-checkbox-container .rte-checkbox.error:hover:not(:disabled):not(:active):before{opacity:20%;background:var(--background-danger-hover)}.rte-checkbox-container .rte-checkbox-text-container label{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:16px;line-height:24px;letter-spacing:0px}.rte-checkbox-container .rte-checkbox-text-container .rte-checkbox-description{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:12px;line-height:16px;letter-spacing:0px;margin:0;color:var(--content-tertiary)}.rte-checkbox-container .rte-checkbox-text-container .rte-checkbox-error{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:12px;line-height:16px;letter-spacing:0px;font-weight:700;margin:0;color:var(--content-danger)}.rte-checkbox-container .rte-checkbox-icons{display:none;z-index:1;pointer-events:none;transform:translateY(4px);position:absolute;color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "rte-icon", inputs: ["name", "size", "color", "classes", "appearance"] }] }); }
|
|
30
|
+
}
|
|
31
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
32
|
+
type: Component,
|
|
33
|
+
args: [{ selector: "rte-checkbox", imports: [CommonModule, IconComponent], standalone: true, template: " <div class=\"rte-checkbox-container\">\n <input\n type=\"checkbox\"\n class=\"rte-checkbox\"\n [id]=\"id()\"\n [value]=\"value()\"\n [ngClass]=\"{'error': error(), 'read-only': readOnly()}\"\n [disabled]=\"disabled()\"\n [indeterminate]=\"indeterminate()\"\n [checked]=\"checked()\"\n (keydown)=\"onKeydown($event)\"\n />\n <rte-icon class=\"rte-checkbox-icons rte-checkbox-icon-selected\" name=\"check-small\" [size]=\"16\"/> \n <rte-icon class=\"rte-checkbox-icons rte-checkbox-icon-indeterminated\" name=\"check-indeterminate\" [size]=\"16\" /> \n <div class=\"rte-checkbox-text-container\">\n <label \n *ngIf=\"showLabel()\" \n class=\"rte-checkbox-label\" \n [for]=\"id()\"\n [ngClass]=\"{\n 'error': error(),\n 'read-only': readOnly(),\n 'disabled': disabled()\n }\"\n >\n {{ label() }}\n </label>\n <p class=\"rte-checkbox-description\">{{ description() }}</p>\n <p *ngIf=\"error() && errorMessage()\" class=\"rte-checkbox-error\">{{ errorMessage() }}</p>\n </div>\n </div>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.rte-checkbox-container{display:flex;gap:12px}.rte-checkbox-container .rte-checkbox{appearance:none;display:flex;width:16px;height:16px;border-radius:2px;border:1px solid var(--content-tertiary);opacity:100%;background:var(--background-default);align-items:center;justify-content:center;margin:4px 0}.rte-checkbox-container .rte-checkbox:before{content:\"\";display:none;position:absolute;border-radius:999px;background:var(--background-hover);width:32px;height:32px;z-index:-1}.rte-checkbox-container .rte-checkbox:active:before{opacity:100%;transform:scale(0);transition:transform 0s,opacity 0s}.rte-checkbox-container .rte-checkbox:focus-visible{outline:1px solid var(--border-brand-focused);outline-offset:4px}.rte-checkbox-container .rte-checkbox:hover{cursor:pointer}.rte-checkbox-container .rte-checkbox:hover:not(:disabled):before{display:inline-block}.rte-checkbox-container .rte-checkbox:hover:not(:disabled):not(:active):before{opacity:50%;transition:transform .15s ease,opacity .3s ease}.rte-checkbox-container .rte-checkbox:disabled{cursor:default;border:1px solid var(--content-disabled);background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox:disabled~.rte-checkbox-text-container label,.rte-checkbox-container .rte-checkbox:disabled~.rte-checkbox-text-container .rte-checkbox-description{color:var(--content-disabled)}.rte-checkbox-container .rte-checkbox:checked{border:1px solid var(--content-brand-default);background:var(--background-brand-default)}.rte-checkbox-container .rte-checkbox:checked:hover:not(:disabled):not(:active):before{opacity:20%;background:var(--background-brand-default)}.rte-checkbox-container .rte-checkbox:checked:disabled{border:1px solid var(--content-disabled);background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox:checked:disabled~.rte-checkbox-icons{color:var(--content-disabled)}.rte-checkbox-container .rte-checkbox:checked.error{background:var(--background-danger-default)}.rte-checkbox-container .rte-checkbox:checked:not(:indeterminate)~.rte-checkbox-icon-selected{display:block}.rte-checkbox-container .rte-checkbox:indeterminate{border:1px solid var(--content-brand-default);background:var(--background-brand-default)}.rte-checkbox-container .rte-checkbox:indeterminate:hover:not(:disabled):not(:active):before{opacity:20%;background:var(--background-brand-default)}.rte-checkbox-container .rte-checkbox:indeterminate:disabled{border:1px solid var(--content-disabled);background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox:indeterminate:disabled~.rte-checkbox-icons{color:var(--content-disabled)}.rte-checkbox-container .rte-checkbox:indeterminate.error{background:var(--background-danger-default)}.rte-checkbox-container .rte-checkbox:indeterminate~.rte-checkbox-icon-indeterminated{display:block}.rte-checkbox-container .rte-checkbox.read-only{pointer-events:none;cursor:default;border:1px solid var(--content-tertiary);opacity:100%;background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox.read-only~.rte-checkbox-text-container label,.rte-checkbox-container .rte-checkbox.read-only~.rte-checkbox-text-container .checkbox-description{color:var(--content-tertiary)}.rte-checkbox-container .rte-checkbox.read-only~.rte-checkbox-icons{color:var(--content-tertiary)}.rte-checkbox-container .rte-checkbox.read-only.error{border:1px solid var(--content-danger);background:var(--background-disabled)}.rte-checkbox-container .rte-checkbox.error{border:1px solid var(--content-danger);background:var(--background-default)}.rte-checkbox-container .rte-checkbox.error:hover:not(:disabled):not(:active):before{opacity:20%;background:var(--background-danger-hover)}.rte-checkbox-container .rte-checkbox-text-container label{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:16px;line-height:24px;letter-spacing:0px}.rte-checkbox-container .rte-checkbox-text-container .rte-checkbox-description{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:12px;line-height:16px;letter-spacing:0px;margin:0;color:var(--content-tertiary)}.rte-checkbox-container .rte-checkbox-text-container .rte-checkbox-error{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:12px;line-height:16px;letter-spacing:0px;font-weight:700;margin:0;color:var(--content-danger)}.rte-checkbox-container .rte-checkbox-icons{display:none;z-index:1;pointer-events:none;transform:translateY(4px);position:absolute;color:#fff}\n"] }]
|
|
34
|
+
}] });
|
|
35
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hlY2tib3guY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvY2hlY2tib3gvY2hlY2tib3guY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvY2hlY2tib3gvY2hlY2tib3guY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBRWpELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQzs7O0FBU3ZELE1BQU0sT0FBTyxpQkFBaUI7SUFQOUI7UUFRVyxPQUFFLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBVSxDQUFDO1FBQzlCLFVBQUssR0FBRyxLQUFLLENBQUMsUUFBUSxFQUFVLENBQUM7UUFDakMsVUFBSyxHQUFHLEtBQUssQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUNsQixrQkFBYSxHQUFHLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUM3QixnQkFBVyxHQUFHLEtBQUssQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUN4QixjQUFTLEdBQUcsS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQ3hCLGFBQVEsR0FBRyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDeEIsVUFBSyxHQUFHLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUNyQixpQkFBWSxHQUFHLEtBQUssQ0FBQyxFQUFFLENBQUMsQ0FBQztRQUN6QixhQUFRLEdBQUcsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQ3hCLFlBQU8sR0FBRyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDdkIsY0FBUyxHQUFHLEtBQUssQ0FBQyxFQUFFLENBQUMsQ0FBQztLQVNoQztJQVBDLFNBQVMsQ0FBQyxLQUFvQjtRQUM1QixJQUFJLEtBQUssQ0FBQyxJQUFJLEtBQUssT0FBTyxFQUFFLENBQUM7WUFDM0IsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFLEVBQUUsQ0FBQztnQkFDcEIsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO1lBQ3pCLENBQUM7UUFDSCxDQUFDO0lBQ0gsQ0FBQzsrR0FwQlUsaUJBQWlCO21HQUFqQixpQkFBaUIsd2xEQ1o5Qiw4eENBK0JBLG13SkR4QlksWUFBWSxpT0FBRSxhQUFhOzs0RkFLMUIsaUJBQWlCO2tCQVA3QixTQUFTOytCQUNFLGNBQWMsV0FDZixDQUFDLFlBQVksRUFBRSxhQUFhLENBQUMsY0FDMUIsSUFBSSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9jb21tb25cIjtcbmltcG9ydCB7IENvbXBvbmVudCwgaW5wdXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuXG5pbXBvcnQgeyBJY29uQ29tcG9uZW50IH0gZnJvbSBcIi4uL2ljb24vaWNvbi5jb21wb25lbnRcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcInJ0ZS1jaGVja2JveFwiLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBJY29uQ29tcG9uZW50XSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGVVcmw6IFwiLi9jaGVja2JveC5jb21wb25lbnQuaHRtbFwiLFxuICBzdHlsZVVybDogXCIuL2NoZWNrYm94LmNvbXBvbmVudC5zY3NzXCIsXG59KVxuZXhwb3J0IGNsYXNzIENoZWNrYm94Q29tcG9uZW50IHtcbiAgcmVhZG9ubHkgaWQgPSBpbnB1dC5yZXF1aXJlZDxzdHJpbmc+KCk7XG4gIHJlYWRvbmx5IGxhYmVsID0gaW5wdXQucmVxdWlyZWQ8c3RyaW5nPigpO1xuICByZWFkb25seSB2YWx1ZSA9IGlucHV0KFwiXCIpO1xuICByZWFkb25seSBpbmRldGVybWluYXRlID0gaW5wdXQoZmFsc2UpO1xuICByZWFkb25seSBkZXNjcmlwdGlvbiA9IGlucHV0KFwiXCIpO1xuICByZWFkb25seSBzaG93TGFiZWwgPSBpbnB1dCh0cnVlKTtcbiAgcmVhZG9ubHkgZGlzYWJsZWQgPSBpbnB1dChmYWxzZSk7XG4gIHJlYWRvbmx5IGVycm9yID0gaW5wdXQoZmFsc2UpO1xuICByZWFkb25seSBlcnJvck1lc3NhZ2UgPSBpbnB1dChcIlwiKTtcbiAgcmVhZG9ubHkgcmVhZE9ubHkgPSBpbnB1dChmYWxzZSk7XG4gIHJlYWRvbmx5IGNoZWNrZWQgPSBpbnB1dChmYWxzZSk7XG4gIHJlYWRvbmx5IGdyb3VwTmFtZSA9IGlucHV0KFwiXCIpO1xuXG4gIG9uS2V5ZG93bihldmVudDogS2V5Ym9hcmRFdmVudCkge1xuICAgIGlmIChldmVudC5jb2RlID09PSBcIlNwYWNlXCIpIHtcbiAgICAgIGlmICh0aGlzLnJlYWRPbmx5KCkpIHtcbiAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cbn1cbiIsIiAgICA8ZGl2IGNsYXNzPVwicnRlLWNoZWNrYm94LWNvbnRhaW5lclwiPlxuICAgICAgICA8aW5wdXRcbiAgICAgICAgICAgIHR5cGU9XCJjaGVja2JveFwiXG4gICAgICAgICAgICBjbGFzcz1cInJ0ZS1jaGVja2JveFwiXG4gICAgICAgICAgICBbaWRdPVwiaWQoKVwiXG4gICAgICAgICAgICBbdmFsdWVdPVwidmFsdWUoKVwiXG4gICAgICAgICAgICBbbmdDbGFzc109XCJ7J2Vycm9yJzogZXJyb3IoKSwgJ3JlYWQtb25seSc6IHJlYWRPbmx5KCl9XCJcbiAgICAgICAgICAgIFtkaXNhYmxlZF09XCJkaXNhYmxlZCgpXCJcbiAgICAgICAgICAgIFtpbmRldGVybWluYXRlXT1cImluZGV0ZXJtaW5hdGUoKVwiXG4gICAgICAgICAgICBbY2hlY2tlZF09XCJjaGVja2VkKClcIlxuICAgICAgICAgICAgKGtleWRvd24pPVwib25LZXlkb3duKCRldmVudClcIlxuICAgICAgICAvPlxuICAgICAgICAgICAgPHJ0ZS1pY29uIGNsYXNzPVwicnRlLWNoZWNrYm94LWljb25zIHJ0ZS1jaGVja2JveC1pY29uLXNlbGVjdGVkXCIgbmFtZT1cImNoZWNrLXNtYWxsXCIgW3NpemVdPVwiMTZcIi8+IFxuICAgICAgICAgICAgPHJ0ZS1pY29uIGNsYXNzPVwicnRlLWNoZWNrYm94LWljb25zIHJ0ZS1jaGVja2JveC1pY29uLWluZGV0ZXJtaW5hdGVkXCIgbmFtZT1cImNoZWNrLWluZGV0ZXJtaW5hdGVcIiBbc2l6ZV09XCIxNlwiIC8+IFxuICAgICAgICA8ZGl2IGNsYXNzPVwicnRlLWNoZWNrYm94LXRleHQtY29udGFpbmVyXCI+XG4gICAgICAgICAgICA8bGFiZWwgXG4gICAgICAgICAgICAqbmdJZj1cInNob3dMYWJlbCgpXCIgXG4gICAgICAgICAgICBjbGFzcz1cInJ0ZS1jaGVja2JveC1sYWJlbFwiIFxuICAgICAgICAgICAgW2Zvcl09XCJpZCgpXCJcbiAgICAgICAgICAgIFtuZ0NsYXNzXT1cIntcbiAgICAgICAgICAgICAgICAnZXJyb3InOiBlcnJvcigpLFxuICAgICAgICAgICAgICAgICdyZWFkLW9ubHknOiByZWFkT25seSgpLFxuICAgICAgICAgICAgICAgICdkaXNhYmxlZCc6IGRpc2FibGVkKClcbiAgICAgICAgICAgIH1cIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHt7IGxhYmVsKCkgfX1cbiAgICAgICAgICAgIDwvbGFiZWw+XG4gICAgICAgICAgICA8cCBjbGFzcz1cInJ0ZS1jaGVja2JveC1kZXNjcmlwdGlvblwiPnt7IGRlc2NyaXB0aW9uKCkgfX08L3A+XG4gICAgICAgICAgICA8cCAqbmdJZj1cImVycm9yKCkgJiYgZXJyb3JNZXNzYWdlKClcIiBjbGFzcz1cInJ0ZS1jaGVja2JveC1lcnJvclwiPnt7IGVycm9yTWVzc2FnZSgpIH19PC9wPlxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiJdfQ==
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { CommonModule } from "@angular/common";
|
|
2
|
+
import { Component, computed, input } from "@angular/core";
|
|
3
|
+
import { CheckboxComponent } from "../checkbox/checkbox.component";
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
import * as i1 from "@angular/common";
|
|
6
|
+
export class CheckboxGroupComponent {
|
|
7
|
+
constructor() {
|
|
8
|
+
this.groupName = input.required();
|
|
9
|
+
this.items = input.required();
|
|
10
|
+
this.direction = input("horizontal");
|
|
11
|
+
this.showItemsLabel = input(true);
|
|
12
|
+
this.groupTitle = input("");
|
|
13
|
+
this.showGroupTitle = input(false);
|
|
14
|
+
this.groupHelpText = input("");
|
|
15
|
+
this.showHelpText = input(false);
|
|
16
|
+
this.errorMessage = input("");
|
|
17
|
+
this.error = input(false);
|
|
18
|
+
this.disabled = input(false);
|
|
19
|
+
this.readOnly = input(false);
|
|
20
|
+
this.isDisplayed = computed(() => !(this.disabled() && this.error()));
|
|
21
|
+
}
|
|
22
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CheckboxGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
23
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: CheckboxGroupComponent, isStandalone: true, selector: "rte-checkbox-group", inputs: { groupName: { classPropertyName: "groupName", publicName: "groupName", isSignal: true, isRequired: true, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, showItemsLabel: { classPropertyName: "showItemsLabel", publicName: "showItemsLabel", isSignal: true, isRequired: false, transformFunction: null }, groupTitle: { classPropertyName: "groupTitle", publicName: "groupTitle", isSignal: true, isRequired: false, transformFunction: null }, showGroupTitle: { classPropertyName: "showGroupTitle", publicName: "showGroupTitle", isSignal: true, isRequired: false, transformFunction: null }, groupHelpText: { classPropertyName: "groupHelpText", publicName: "groupHelpText", isSignal: true, isRequired: false, transformFunction: null }, showHelpText: { classPropertyName: "showHelpText", publicName: "showHelpText", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div \n *ngIf=\"isDisplayed()\"\n class=\"checkbox-group-container\">\n <div\n class=\"checkbox-group-header\"\n [ngClass]=\"{\n 'disabled': disabled(),\n 'error': error(),\n 'read-only': readOnly(),\n }\">\n <h3\n *ngIf=\"showGroupTitle()\"\n class=\"group-title\"\n >\n {{ groupTitle() }}\n </h3>\n <p\n *ngIf=\"showHelpText()\"\n class=\"group-help-text\"\n >\n {{ groupHelpText() }}\n\n </p>\n <p\n *ngIf=\"error()\"\n class=\"group-error-message\"\n >\n {{ errorMessage() }}\n </p>\n </div>\n <div class=\"checkbox-group\" \n [ngClass]=\"{'horizontal': direction() === 'horizontal', 'vertical': direction() === 'vertical'}\">\n <ng-container \n *ngFor=\"let item of items(); let i = index\">\n <rte-checkbox\n [id]=\"item + '-' + i\"\n [label]=\"item\"\n [groupName]=\"groupName()\"\n [showLabel]=\"showItemsLabel()\"\n [disabled]=\"disabled()\"\n [error]=\"error()\"\n [readOnly]=\"readOnly()\"\n />\n </ng-container>\n </div>\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.checkbox-group-container{display:flex;padding:0;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px}.checkbox-group-container .checkbox-group-header .group-title{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:20px;line-height:28px;letter-spacing:-.5px;align-self:stretch;margin:0}.checkbox-group-container .checkbox-group-header .group-help-text{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:14px;line-height:20px;letter-spacing:0px;color:var(--content-tertiary);align-self:stretch;margin:0}.checkbox-group-container .checkbox-group-header .group-error-message{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:700;font-size:14px;line-height:20px;letter-spacing:0px;color:var(--content-danger);align-self:stretch;margin:4px 0 0}.checkbox-group-container .checkbox-group-header.error .group-title{color:var(--content-danger)}.checkbox-group-container .checkbox-group-header.read-only .group-title{color:var(--content-tertiary)}.checkbox-group-container .checkbox-group-header.read-only .error .group-title{color:var(--content-danger)}.checkbox-group-container .checkbox-group-header.disabled{pointer-events:none}.checkbox-group-container .checkbox-group-header.disabled .group-title,.checkbox-group-container .checkbox-group-header.disabled .group-help-text{color:var(--content-disabled)}.checkbox-group-container .checkbox-group{display:flex;flex-direction:row;padding:0;align-items:flex-start;gap:24px}.checkbox-group-container .checkbox-group.vertical{flex-direction:column;gap:8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CheckboxComponent, selector: "rte-checkbox", inputs: ["id", "label", "value", "indeterminate", "description", "showLabel", "disabled", "error", "errorMessage", "readOnly", "checked", "groupName"] }] }); }
|
|
24
|
+
}
|
|
25
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CheckboxGroupComponent, decorators: [{
|
|
26
|
+
type: Component,
|
|
27
|
+
args: [{ selector: "rte-checkbox-group", imports: [CommonModule, CheckboxComponent], standalone: true, template: "<div \n *ngIf=\"isDisplayed()\"\n class=\"checkbox-group-container\">\n <div\n class=\"checkbox-group-header\"\n [ngClass]=\"{\n 'disabled': disabled(),\n 'error': error(),\n 'read-only': readOnly(),\n }\">\n <h3\n *ngIf=\"showGroupTitle()\"\n class=\"group-title\"\n >\n {{ groupTitle() }}\n </h3>\n <p\n *ngIf=\"showHelpText()\"\n class=\"group-help-text\"\n >\n {{ groupHelpText() }}\n\n </p>\n <p\n *ngIf=\"error()\"\n class=\"group-error-message\"\n >\n {{ errorMessage() }}\n </p>\n </div>\n <div class=\"checkbox-group\" \n [ngClass]=\"{'horizontal': direction() === 'horizontal', 'vertical': direction() === 'vertical'}\">\n <ng-container \n *ngFor=\"let item of items(); let i = index\">\n <rte-checkbox\n [id]=\"item + '-' + i\"\n [label]=\"item\"\n [groupName]=\"groupName()\"\n [showLabel]=\"showItemsLabel()\"\n [disabled]=\"disabled()\"\n [error]=\"error()\"\n [readOnly]=\"readOnly()\"\n />\n </ng-container>\n </div>\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:wght,FILL,GRAD@400,0,0&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap\";.checkbox-group-container{display:flex;padding:0;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px}.checkbox-group-container .checkbox-group-header .group-title{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Nunito;font-weight:600;font-size:20px;line-height:28px;letter-spacing:-.5px;align-self:stretch;margin:0}.checkbox-group-container .checkbox-group-header .group-help-text{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:400;font-size:14px;line-height:20px;letter-spacing:0px;color:var(--content-tertiary);align-self:stretch;margin:0}.checkbox-group-container .checkbox-group-header .group-error-message{font-feature-settings:\"liga\" off,\"clig\" off;font-style:normal;font-family:Arial;font-weight:700;font-size:14px;line-height:20px;letter-spacing:0px;color:var(--content-danger);align-self:stretch;margin:4px 0 0}.checkbox-group-container .checkbox-group-header.error .group-title{color:var(--content-danger)}.checkbox-group-container .checkbox-group-header.read-only .group-title{color:var(--content-tertiary)}.checkbox-group-container .checkbox-group-header.read-only .error .group-title{color:var(--content-danger)}.checkbox-group-container .checkbox-group-header.disabled{pointer-events:none}.checkbox-group-container .checkbox-group-header.disabled .group-title,.checkbox-group-container .checkbox-group-header.disabled .group-help-text{color:var(--content-disabled)}.checkbox-group-container .checkbox-group{display:flex;flex-direction:row;padding:0;align-items:flex-start;gap:24px}.checkbox-group-container .checkbox-group.vertical{flex-direction:column;gap:8px}\n"] }]
|
|
28
|
+
}] });
|
|
29
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hlY2tib3gtZ3JvdXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvY2hlY2tib3gtZ3JvdXAvY2hlY2tib3gtZ3JvdXAuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHMtcnRlLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvY2hlY2tib3gtZ3JvdXAvY2hlY2tib3gtZ3JvdXAuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUUzRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQzs7O0FBU25FLE1BQU0sT0FBTyxzQkFBc0I7SUFQbkM7UUFRVyxjQUFTLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBVSxDQUFDO1FBQ3JDLFVBQUssR0FBRyxLQUFLLENBQUMsUUFBUSxFQUFZLENBQUM7UUFDbkMsY0FBUyxHQUFHLEtBQUssQ0FBQyxZQUFZLENBQUMsQ0FBQztRQUNoQyxtQkFBYyxHQUFHLEtBQUssQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUM3QixlQUFVLEdBQUcsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBQ3ZCLG1CQUFjLEdBQUcsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzlCLGtCQUFhLEdBQUcsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBQzFCLGlCQUFZLEdBQUcsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzVCLGlCQUFZLEdBQUcsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBQ3pCLFVBQUssR0FBRyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDckIsYUFBUSxHQUFHLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUN4QixhQUFRLEdBQUcsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBRXhCLGdCQUFXLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDLENBQUMsQ0FBQztLQUMzRTsrR0FmWSxzQkFBc0I7bUdBQXRCLHNCQUFzQix5cURDWm5DLGtuQ0E2Q00seTZERHRDTSxZQUFZLDhWQUFFLGlCQUFpQjs7NEZBSzlCLHNCQUFzQjtrQkFQbEMsU0FBUzsrQkFDRSxvQkFBb0IsV0FDckIsQ0FBQyxZQUFZLEVBQUUsaUJBQWlCLENBQUMsY0FDOUIsSUFBSSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9jb21tb25cIjtcbmltcG9ydCB7IENvbXBvbmVudCwgY29tcHV0ZWQsIGlucHV0IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcblxuaW1wb3J0IHsgQ2hlY2tib3hDb21wb25lbnQgfSBmcm9tIFwiLi4vY2hlY2tib3gvY2hlY2tib3guY29tcG9uZW50XCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJydGUtY2hlY2tib3gtZ3JvdXBcIixcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgQ2hlY2tib3hDb21wb25lbnRdLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICB0ZW1wbGF0ZVVybDogXCIuL2NoZWNrYm94LWdyb3VwLmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsOiBcIi4vY2hlY2tib3gtZ3JvdXAuY29tcG9uZW50LnNjc3NcIixcbn0pXG5leHBvcnQgY2xhc3MgQ2hlY2tib3hHcm91cENvbXBvbmVudCB7XG4gIHJlYWRvbmx5IGdyb3VwTmFtZSA9IGlucHV0LnJlcXVpcmVkPHN0cmluZz4oKTtcbiAgcmVhZG9ubHkgaXRlbXMgPSBpbnB1dC5yZXF1aXJlZDxzdHJpbmdbXT4oKTtcbiAgcmVhZG9ubHkgZGlyZWN0aW9uID0gaW5wdXQoXCJob3Jpem9udGFsXCIpO1xuICByZWFkb25seSBzaG93SXRlbXNMYWJlbCA9IGlucHV0KHRydWUpO1xuICByZWFkb25seSBncm91cFRpdGxlID0gaW5wdXQoXCJcIik7XG4gIHJlYWRvbmx5IHNob3dHcm91cFRpdGxlID0gaW5wdXQoZmFsc2UpO1xuICByZWFkb25seSBncm91cEhlbHBUZXh0ID0gaW5wdXQoXCJcIik7XG4gIHJlYWRvbmx5IHNob3dIZWxwVGV4dCA9IGlucHV0KGZhbHNlKTtcbiAgcmVhZG9ubHkgZXJyb3JNZXNzYWdlID0gaW5wdXQoXCJcIik7XG4gIHJlYWRvbmx5IGVycm9yID0gaW5wdXQoZmFsc2UpO1xuICByZWFkb25seSBkaXNhYmxlZCA9IGlucHV0KGZhbHNlKTtcbiAgcmVhZG9ubHkgcmVhZE9ubHkgPSBpbnB1dChmYWxzZSk7XG5cbiAgcmVhZG9ubHkgaXNEaXNwbGF5ZWQgPSBjb21wdXRlZCgoKSA9PiAhKHRoaXMuZGlzYWJsZWQoKSAmJiB0aGlzLmVycm9yKCkpKTtcbn1cbiIsIjxkaXYgIFxuICAqbmdJZj1cImlzRGlzcGxheWVkKClcIlxuICBjbGFzcz1cImNoZWNrYm94LWdyb3VwLWNvbnRhaW5lclwiPlxuICA8ZGl2XG4gICAgY2xhc3M9XCJjaGVja2JveC1ncm91cC1oZWFkZXJcIlxuICAgIFtuZ0NsYXNzXT1cIntcbiAgICAgICAgJ2Rpc2FibGVkJzogZGlzYWJsZWQoKSxcbiAgICAgICAgJ2Vycm9yJzogZXJyb3IoKSxcbiAgICAgICAgJ3JlYWQtb25seSc6IHJlYWRPbmx5KCksXG4gICAgfVwiPlxuICAgIDxoM1xuICAgICAgICAqbmdJZj1cInNob3dHcm91cFRpdGxlKClcIlxuICAgICAgICBjbGFzcz1cImdyb3VwLXRpdGxlXCJcbiAgICAgICAgPlxuICAgICAgICB7eyBncm91cFRpdGxlKCkgfX1cbiAgICA8L2gzPlxuICAgIDxwXG4gICAgICAgICpuZ0lmPVwic2hvd0hlbHBUZXh0KClcIlxuICAgICAgICBjbGFzcz1cImdyb3VwLWhlbHAtdGV4dFwiXG4gICAgICAgID5cbiAgICAgICAge3sgZ3JvdXBIZWxwVGV4dCgpIH19XG5cbiAgICA8L3A+XG4gICAgPHBcbiAgICAgICAgKm5nSWY9XCJlcnJvcigpXCJcbiAgICAgICAgY2xhc3M9XCJncm91cC1lcnJvci1tZXNzYWdlXCJcbiAgICAgICAgPlxuICAgICAgICB7eyBlcnJvck1lc3NhZ2UoKSB9fVxuICAgIDwvcD5cbiAgPC9kaXY+XG4gIDxkaXYgY2xhc3M9XCJjaGVja2JveC1ncm91cFwiIFxuICAgIFtuZ0NsYXNzXT1cInsnaG9yaXpvbnRhbCc6IGRpcmVjdGlvbigpID09PSAnaG9yaXpvbnRhbCcsICd2ZXJ0aWNhbCc6IGRpcmVjdGlvbigpID09PSAndmVydGljYWwnfVwiPlxuICAgIDxuZy1jb250YWluZXIgXG4gICAgKm5nRm9yPVwibGV0IGl0ZW0gb2YgaXRlbXMoKTsgbGV0IGkgPSBpbmRleFwiPlxuICAgICAgPHJ0ZS1jaGVja2JveFxuICAgICAgW2lkXT1cIml0ZW0gKyAnLScgKyBpXCJcbiAgICAgIFtsYWJlbF09XCJpdGVtXCJcbiAgICAgIFtncm91cE5hbWVdPVwiZ3JvdXBOYW1lKClcIlxuICAgICAgW3Nob3dMYWJlbF09XCJzaG93SXRlbXNMYWJlbCgpXCJcbiAgICAgIFtkaXNhYmxlZF09XCJkaXNhYmxlZCgpXCJcbiAgICAgIFtlcnJvcl09XCJlcnJvcigpXCJcbiAgICAgIFtyZWFkT25seV09XCJyZWFkT25seSgpXCJcbiAgICAgIC8+XG4gICAgPC9uZy1jb250YWluZXI+XG4gIDwvZGl2PlxuPC9kaXY+Il19
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { Directive, HostBinding, input } from "@angular/core";
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class ColDirective {
|
|
4
|
+
get colClasses() {
|
|
5
|
+
return [
|
|
6
|
+
"col",
|
|
7
|
+
this.generateColumnClass("col-xxs", this.xxs()),
|
|
8
|
+
this.generateColumnClass("col-xs", this.xs()),
|
|
9
|
+
this.generateColumnClass("col-s", this.s()),
|
|
10
|
+
this.generateColumnClass("col-m", this.m()),
|
|
11
|
+
this.generateColumnClass("col-l", this.l()),
|
|
12
|
+
this.generateColumnClass("col-xl", this.xl()),
|
|
13
|
+
]
|
|
14
|
+
.filter(Boolean)
|
|
15
|
+
.join(" ");
|
|
16
|
+
}
|
|
17
|
+
constructor() {
|
|
18
|
+
this.xxs = input();
|
|
19
|
+
this.xs = input();
|
|
20
|
+
this.s = input();
|
|
21
|
+
this.m = input();
|
|
22
|
+
this.l = input();
|
|
23
|
+
this.xl = input();
|
|
24
|
+
}
|
|
25
|
+
generateColumnClass(prefix, size) {
|
|
26
|
+
return size ? `${prefix}-${size}` : "";
|
|
27
|
+
}
|
|
28
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ColDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
29
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "17.3.12", type: ColDirective, isStandalone: true, selector: "[dsCol]", inputs: { xxs: { classPropertyName: "xxs", publicName: "xxs", isSignal: true, isRequired: false, transformFunction: null }, xs: { classPropertyName: "xs", publicName: "xs", isSignal: true, isRequired: false, transformFunction: null }, s: { classPropertyName: "s", publicName: "s", isSignal: true, isRequired: false, transformFunction: null }, m: { classPropertyName: "m", publicName: "m", isSignal: true, isRequired: false, transformFunction: null }, l: { classPropertyName: "l", publicName: "l", isSignal: true, isRequired: false, transformFunction: null }, xl: { classPropertyName: "xl", publicName: "xl", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.colClasses" } }, ngImport: i0 }); }
|
|
30
|
+
}
|
|
31
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ColDirective, decorators: [{
|
|
32
|
+
type: Directive,
|
|
33
|
+
args: [{
|
|
34
|
+
selector: "[dsCol]",
|
|
35
|
+
standalone: true,
|
|
36
|
+
}]
|
|
37
|
+
}], ctorParameters: () => [], propDecorators: { colClasses: [{
|
|
38
|
+
type: HostBinding,
|
|
39
|
+
args: ["class"]
|
|
40
|
+
}] } });
|
|
41
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2RzLXJ0ZS1saWIvc3JjL2xpYi9jb21wb25lbnRzL2dyaWQvY29sL2NvbC5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQU05RCxNQUFNLE9BQU8sWUFBWTtJQVF2QixJQUNJLFVBQVU7UUFDWixPQUFPO1lBQ0wsS0FBSztZQUNMLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxTQUFTLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxDQUFDO1lBQy9DLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxRQUFRLEVBQUUsSUFBSSxDQUFDLEVBQUUsRUFBRSxDQUFDO1lBQzdDLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxPQUFPLEVBQUUsSUFBSSxDQUFDLENBQUMsRUFBRSxDQUFDO1lBQzNDLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxPQUFPLEVBQUUsSUFBSSxDQUFDLENBQUMsRUFBRSxDQUFDO1lBQzNDLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxPQUFPLEVBQUUsSUFBSSxDQUFDLENBQUMsRUFBRSxDQUFDO1lBQzNDLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxRQUFRLEVBQUUsSUFBSSxDQUFDLEVBQUUsRUFBRSxDQUFDO1NBQzlDO2FBQ0UsTUFBTSxDQUFDLE9BQU8sQ0FBQzthQUNmLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztJQUNmLENBQUM7SUFFRDtRQXRCUyxRQUFHLEdBQUcsS0FBSyxFQUFVLENBQUM7UUFDdEIsT0FBRSxHQUFHLEtBQUssRUFBVSxDQUFDO1FBQ3JCLE1BQUMsR0FBRyxLQUFLLEVBQVUsQ0FBQztRQUNwQixNQUFDLEdBQUcsS0FBSyxFQUFVLENBQUM7UUFDcEIsTUFBQyxHQUFHLEtBQUssRUFBVSxDQUFDO1FBQ3BCLE9BQUUsR0FBRyxLQUFLLEVBQVUsQ0FBQztJQWlCZixDQUFDO0lBRVIsbUJBQW1CLENBQUMsTUFBYyxFQUFFLElBQWE7UUFDdkQsT0FBTyxJQUFJLENBQUMsQ0FBQyxDQUFDLEdBQUcsTUFBTSxJQUFJLElBQUksRUFBRSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUM7SUFDekMsQ0FBQzsrR0EzQlUsWUFBWTttR0FBWixZQUFZOzs0RkFBWixZQUFZO2tCQUp4QixTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxTQUFTO29CQUNuQixVQUFVLEVBQUUsSUFBSTtpQkFDakI7d0RBVUssVUFBVTtzQkFEYixXQUFXO3VCQUFDLE9BQU8iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3RpdmUsIEhvc3RCaW5kaW5nLCBpbnB1dCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogXCJbZHNDb2xdXCIsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG59KVxuZXhwb3J0IGNsYXNzIENvbERpcmVjdGl2ZSB7XG4gIHJlYWRvbmx5IHh4cyA9IGlucHV0PG51bWJlcj4oKTtcbiAgcmVhZG9ubHkgeHMgPSBpbnB1dDxudW1iZXI+KCk7XG4gIHJlYWRvbmx5IHMgPSBpbnB1dDxudW1iZXI+KCk7XG4gIHJlYWRvbmx5IG0gPSBpbnB1dDxudW1iZXI+KCk7XG4gIHJlYWRvbmx5IGwgPSBpbnB1dDxudW1iZXI+KCk7XG4gIHJlYWRvbmx5IHhsID0gaW5wdXQ8bnVtYmVyPigpO1xuXG4gIEBIb3N0QmluZGluZyhcImNsYXNzXCIpXG4gIGdldCBjb2xDbGFzc2VzKCk6IHN0cmluZyB7XG4gICAgcmV0dXJuIFtcbiAgICAgIFwiY29sXCIsXG4gICAgICB0aGlzLmdlbmVyYXRlQ29sdW1uQ2xhc3MoXCJjb2wteHhzXCIsIHRoaXMueHhzKCkpLFxuICAgICAgdGhpcy5nZW5lcmF0ZUNvbHVtbkNsYXNzKFwiY29sLXhzXCIsIHRoaXMueHMoKSksXG4gICAgICB0aGlzLmdlbmVyYXRlQ29sdW1uQ2xhc3MoXCJjb2wtc1wiLCB0aGlzLnMoKSksXG4gICAgICB0aGlzLmdlbmVyYXRlQ29sdW1uQ2xhc3MoXCJjb2wtbVwiLCB0aGlzLm0oKSksXG4gICAgICB0aGlzLmdlbmVyYXRlQ29sdW1uQ2xhc3MoXCJjb2wtbFwiLCB0aGlzLmwoKSksXG4gICAgICB0aGlzLmdlbmVyYXRlQ29sdW1uQ2xhc3MoXCJjb2wteGxcIiwgdGhpcy54bCgpKSxcbiAgICBdXG4gICAgICAuZmlsdGVyKEJvb2xlYW4pXG4gICAgICAuam9pbihcIiBcIik7XG4gIH1cblxuICBjb25zdHJ1Y3RvcigpIHt9XG5cbiAgcHJpdmF0ZSBnZW5lcmF0ZUNvbHVtbkNsYXNzKHByZWZpeDogc3RyaW5nLCBzaXplPzogbnVtYmVyKTogc3RyaW5nIHtcbiAgICByZXR1cm4gc2l6ZSA/IGAke3ByZWZpeH0tJHtzaXplfWAgOiBcIlwiO1xuICB9XG59XG4iXX0=
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { Directive, HostBinding, input } from "@angular/core";
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class GridDirective {
|
|
4
|
+
get hostClasses() {
|
|
5
|
+
return "grid";
|
|
6
|
+
}
|
|
7
|
+
get hostDataClasses() {
|
|
8
|
+
const variation = this.gridType();
|
|
9
|
+
return `${variation}`;
|
|
10
|
+
}
|
|
11
|
+
constructor() {
|
|
12
|
+
this.gridType = input("fluid");
|
|
13
|
+
}
|
|
14
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GridDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
15
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "17.3.12", type: GridDirective, isStandalone: true, selector: "[rte-grid]", inputs: { gridType: { classPropertyName: "gridType", publicName: "gridType", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.hostClasses", "attr.data-gridtype": "this.hostDataClasses" } }, ngImport: i0 }); }
|
|
16
|
+
}
|
|
17
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GridDirective, decorators: [{
|
|
18
|
+
type: Directive,
|
|
19
|
+
args: [{
|
|
20
|
+
selector: "[rte-grid]",
|
|
21
|
+
standalone: true,
|
|
22
|
+
}]
|
|
23
|
+
}], ctorParameters: () => [], propDecorators: { hostClasses: [{
|
|
24
|
+
type: HostBinding,
|
|
25
|
+
args: ["class"]
|
|
26
|
+
}], hostDataClasses: [{
|
|
27
|
+
type: HostBinding,
|
|
28
|
+
args: ["attr.data-gridtype"]
|
|
29
|
+
}] } });
|
|
30
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JpZC5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kcy1ydGUtbGliL3NyYy9saWIvY29tcG9uZW50cy9ncmlkL2dyaWQuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsV0FBVyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFPOUQsTUFBTSxPQUFPLGFBQWE7SUFHeEIsSUFDSSxXQUFXO1FBQ2IsT0FBTyxNQUFNLENBQUM7SUFDaEIsQ0FBQztJQUVELElBQ0ksZUFBZTtRQUNqQixNQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUM7UUFDbEMsT0FBTyxHQUFHLFNBQVMsRUFBRSxDQUFDO0lBQ3hCLENBQUM7SUFDRDtRQVpTLGFBQVEsR0FBRyxLQUFLLENBQVcsT0FBTyxDQUFDLENBQUM7SUFZOUIsQ0FBQzsrR0FiTCxhQUFhO21HQUFiLGFBQWE7OzRGQUFiLGFBQWE7a0JBSnpCLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLFlBQVk7b0JBQ3RCLFVBQVUsRUFBRSxJQUFJO2lCQUNqQjt3REFLSyxXQUFXO3NCQURkLFdBQVc7dUJBQUMsT0FBTztnQkFNaEIsZUFBZTtzQkFEbEIsV0FBVzt1QkFBQyxvQkFBb0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3RpdmUsIEhvc3RCaW5kaW5nLCBpbnB1dCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBHcmlkVHlwZSB9IGZyb20gXCJAZGVzaWduLXN5c3RlbS1ydGUvY29yZS9jb21wb25lbnRzL2dyaWQvZ3JpZC5pbnRlcmZhY2VcIjtcblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiBcIltydGUtZ3JpZF1cIixcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbn0pXG5leHBvcnQgY2xhc3MgR3JpZERpcmVjdGl2ZSB7XG4gIHJlYWRvbmx5IGdyaWRUeXBlID0gaW5wdXQ8R3JpZFR5cGU+KFwiZmx1aWRcIik7XG5cbiAgQEhvc3RCaW5kaW5nKFwiY2xhc3NcIilcbiAgZ2V0IGhvc3RDbGFzc2VzKCk6IHN0cmluZyB7XG4gICAgcmV0dXJuIFwiZ3JpZFwiO1xuICB9XG5cbiAgQEhvc3RCaW5kaW5nKFwiYXR0ci5kYXRhLWdyaWR0eXBlXCIpXG4gIGdldCBob3N0RGF0YUNsYXNzZXMoKTogc3RyaW5nIHtcbiAgICBjb25zdCB2YXJpYXRpb24gPSB0aGlzLmdyaWRUeXBlKCk7XG4gICAgcmV0dXJuIGAke3ZhcmlhdGlvbn1gO1xuICB9XG4gIGNvbnN0cnVjdG9yKCkge31cbn1cbiJdfQ==
|