oasys-lib 0.0.2 → 0.0.45
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/bundles/oasys-lib.umd.js +328 -0
- package/bundles/oasys-lib.umd.js.map +1 -0
- package/esm2015/lib/components/button/button.component.js +83 -0
- package/esm2015/lib/components/button/button.js +2 -0
- package/esm2015/lib/components/icon/icon.component.js +59 -0
- package/{esm2020/lib/components/icon/icon.mjs → esm2015/lib/components/icon/icon.js} +0 -0
- package/esm2015/lib/components/layout/box/box.component.js +32 -0
- package/esm2015/lib/components/layout/inline/inline.component.js +20 -0
- package/{esm2020/lib/components/text/text.mjs → esm2015/lib/components/text/text.js} +0 -0
- package/esm2015/lib/oasys-lib.module.js +52 -0
- package/{esm2020/lib/services/token.service.mjs → esm2015/lib/services/token.service.js} +4 -4
- package/{esm2020/lib/services/window.service.mjs → esm2015/lib/services/window.service.js} +4 -4
- package/{esm2020/oasys-lib.mjs → esm2015/oasys-lib.js} +0 -0
- package/{esm2020/public-api.mjs → esm2015/public-api.js} +2 -1
- package/fesm2015/oasys-lib.js +284 -0
- package/fesm2015/oasys-lib.js.map +1 -0
- package/lib/components/button/button.component.d.ts +3 -3
- package/lib/components/button/button.component.d.ts.map +1 -1
- package/lib/components/button/button.d.ts +1 -1
- package/lib/components/button/button.d.ts.map +1 -1
- package/lib/components/icon/icon.component.d.ts.map +1 -1
- package/lib/oasys-lib.module.d.ts +1 -1
- package/lib/oasys-lib.module.d.ts.map +1 -1
- package/package.json +8 -21
- package/public-api.d.ts +1 -0
- package/public-api.d.ts.map +1 -1
- package/esm2020/lib/components/button/button.component.mjs +0 -77
- package/esm2020/lib/components/button/button.mjs +0 -2
- package/esm2020/lib/components/icon/icon.component.mjs +0 -53
- package/esm2020/lib/components/layout/box/box.component.mjs +0 -25
- package/esm2020/lib/components/layout/inline/inline.component.mjs +0 -14
- package/esm2020/lib/oasys-lib.module.mjs +0 -49
- package/fesm2015/oasys-lib.mjs +0 -257
- package/fesm2015/oasys-lib.mjs.map +0 -1
- package/fesm2020/oasys-lib.mjs +0 -257
- package/fesm2020/oasys-lib.mjs.map +0 -1
|
@@ -0,0 +1,328 @@
|
|
|
1
|
+
(function (global, factory) {
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/router')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define('oasys-lib', ['exports', '@angular/common', '@angular/core', '@angular/router'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["oasys-lib"] = {}, global.ng.common, global.ng.core, global.ng.router));
|
|
5
|
+
})(this, (function (exports, i3, i0, i2) { 'use strict';
|
|
6
|
+
|
|
7
|
+
function _interopNamespace(e) {
|
|
8
|
+
if (e && e.__esModule) return e;
|
|
9
|
+
var n = Object.create(null);
|
|
10
|
+
if (e) {
|
|
11
|
+
Object.keys(e).forEach(function (k) {
|
|
12
|
+
if (k !== 'default') {
|
|
13
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
14
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
15
|
+
enumerable: true,
|
|
16
|
+
get: function () { return e[k]; }
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
n["default"] = e;
|
|
22
|
+
return Object.freeze(n);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
|
|
26
|
+
var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
|
|
27
|
+
var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
|
|
28
|
+
|
|
29
|
+
function _window() {
|
|
30
|
+
return window;
|
|
31
|
+
}
|
|
32
|
+
var WindowService = /** @class */ (function () {
|
|
33
|
+
function WindowService() {
|
|
34
|
+
}
|
|
35
|
+
Object.defineProperty(WindowService.prototype, "nativeWindow", {
|
|
36
|
+
get: function () {
|
|
37
|
+
return _window();
|
|
38
|
+
},
|
|
39
|
+
enumerable: false,
|
|
40
|
+
configurable: true
|
|
41
|
+
});
|
|
42
|
+
return WindowService;
|
|
43
|
+
}());
|
|
44
|
+
WindowService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: WindowService, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
|
|
45
|
+
WindowService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: WindowService, providedIn: 'root' });
|
|
46
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: WindowService, decorators: [{
|
|
47
|
+
type: i0.Injectable,
|
|
48
|
+
args: [{
|
|
49
|
+
providedIn: 'root'
|
|
50
|
+
}]
|
|
51
|
+
}] });
|
|
52
|
+
|
|
53
|
+
var TokenService = /** @class */ (function () {
|
|
54
|
+
function TokenService(windowRef) {
|
|
55
|
+
this.windowRef = windowRef;
|
|
56
|
+
}
|
|
57
|
+
/*
|
|
58
|
+
Get the brand name for the currently enable custom property set (ie. /bloomon/variables.css)
|
|
59
|
+
Because variables are scoped via a selector (ie: ':root .bloomon {}')
|
|
60
|
+
we cannot get brand-specific custom properties programatically
|
|
61
|
+
|
|
62
|
+
Important: Ensure that the component requiring the brand name has locally scoped the custom property:
|
|
63
|
+
| ui-icon {
|
|
64
|
+
| --icon-component-brand: var(--utility-brand-name);
|
|
65
|
+
| }
|
|
66
|
+
*/
|
|
67
|
+
TokenService.prototype.getBrandName = function (tokenName, element) {
|
|
68
|
+
return this.getTokenValue(tokenName, element);
|
|
69
|
+
};
|
|
70
|
+
TokenService.prototype.getTokenValue = function (tokenName, element) {
|
|
71
|
+
var rootElement = element || this.windowRef.nativeWindow.document.documentElement;
|
|
72
|
+
return this.windowRef.nativeWindow.getComputedStyle(rootElement)
|
|
73
|
+
.getPropertyValue(tokenName)
|
|
74
|
+
.trim() || '';
|
|
75
|
+
};
|
|
76
|
+
return TokenService;
|
|
77
|
+
}());
|
|
78
|
+
TokenService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TokenService, deps: [{ token: WindowService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
|
|
79
|
+
TokenService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TokenService, providedIn: 'root' });
|
|
80
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TokenService, decorators: [{
|
|
81
|
+
type: i0.Injectable,
|
|
82
|
+
args: [{
|
|
83
|
+
providedIn: 'root'
|
|
84
|
+
}]
|
|
85
|
+
}], ctorParameters: function () { return [{ type: WindowService }]; } });
|
|
86
|
+
|
|
87
|
+
var IconComponent = /** @class */ (function () {
|
|
88
|
+
function IconComponent(tokenService, windowRef, elementRef) {
|
|
89
|
+
this.tokenService = tokenService;
|
|
90
|
+
this.windowRef = windowRef;
|
|
91
|
+
this.elementRef = elementRef;
|
|
92
|
+
this.iconSize = 'large';
|
|
93
|
+
this.iconContext = 'none';
|
|
94
|
+
}
|
|
95
|
+
IconComponent.prototype.convertRemToPixels = function (remString) {
|
|
96
|
+
var remNumber = parseFloat(remString.replace('rem', ''));
|
|
97
|
+
return remNumber * parseFloat(getComputedStyle(this.windowRef.nativeWindow.document.documentElement).fontSize);
|
|
98
|
+
};
|
|
99
|
+
IconComponent.prototype.ngOnChanges = function () {
|
|
100
|
+
this.ngOnInit();
|
|
101
|
+
};
|
|
102
|
+
IconComponent.prototype.ngOnInit = function () {
|
|
103
|
+
this.iconBrandPath = "" + this.tokenService.getBrandName("--icon-component-brand", this.elementRef.nativeElement);
|
|
104
|
+
this.size = this.tokenService.getTokenValue("--global-size-icon-" + this.iconSize);
|
|
105
|
+
this.iconDisplayClasses = [
|
|
106
|
+
"icon-context-" + this.iconContext,
|
|
107
|
+
"icon-size-" + this.iconSize
|
|
108
|
+
];
|
|
109
|
+
var sizeInPixels = this.convertRemToPixels(this.size);
|
|
110
|
+
this.iconWidth = sizeInPixels;
|
|
111
|
+
this.iconHeight = sizeInPixels;
|
|
112
|
+
};
|
|
113
|
+
return IconComponent;
|
|
114
|
+
}());
|
|
115
|
+
IconComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IconComponent, deps: [{ token: TokenService }, { token: WindowService }, { token: i0__namespace.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
116
|
+
IconComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IconComponent, selector: "ui-icon", inputs: { iconSize: "iconSize", iconName: "iconName", iconContext: "iconContext", iconWidth: "iconWidth", iconHeight: "iconHeight", iconClass: "iconClass" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"ui-icon\" [ngClass]=\"iconDisplayClasses\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" attr.width=\"{{iconWidth}}px\" attr.height=\"{{iconHeight}}px\" attr.class=\"{{iconClass}}\">\n <use attr.xlink:href=\"./{{iconBrandPath}}/assets/icons/icons.svg#icon-{{iconName}}-24\"></use>\n </svg>\n</div>\n", styles: ["ui-icon{--icon-component-brand: var(--utility-brand-name)}.ui-icon{display:inline-flex}.ui-icon.icon-size-large.icon-context-leading{margin-left:calc(var(--component-size-button-large-icon-offset-leading) * -1)}.ui-icon.icon-size-large.icon-context-trailing{margin-right:calc(var(--component-size-button-large-icon-offset-trailing) * -1)}.ui-icon.icon-size-large.icon-context-iconOnly{margin-left:calc(var(--component-size-button-large-icon-offset-icon-only) * -1);margin-right:calc(var(--component-size-button-large-icon-offset-icon-only) * -1)}.ui-icon.icon-size-small.icon-context-leading{margin-left:calc(var(--component-size-button-small-icon-offset-leading) * -1)}.ui-icon.icon-size-small.icon-context-trailing{margin-right:calc(var(--component-size-button-small-icon-offset-trailing) * -1)}.ui-icon.icon-size-small.icon-context-iconOnly{margin-left:calc(var(--component-size-button-small-icon-offset-icon-only) * -1);margin-right:calc(var(--component-size-button-small-icon-offset-icon-only) * -1)}\n"], directives: [{ type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
|
|
117
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: IconComponent, decorators: [{
|
|
118
|
+
type: i0.Component,
|
|
119
|
+
args: [{
|
|
120
|
+
selector: 'ui-icon',
|
|
121
|
+
templateUrl: './icon.component.html',
|
|
122
|
+
styleUrls: ['./icon.component.scss'],
|
|
123
|
+
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
124
|
+
encapsulation: i0.ViewEncapsulation.None
|
|
125
|
+
}]
|
|
126
|
+
}], ctorParameters: function () { return [{ type: TokenService }, { type: WindowService }, { type: i0__namespace.ElementRef }]; }, propDecorators: { iconSize: [{
|
|
127
|
+
type: i0.Input
|
|
128
|
+
}], iconName: [{
|
|
129
|
+
type: i0.Input
|
|
130
|
+
}], iconContext: [{
|
|
131
|
+
type: i0.Input
|
|
132
|
+
}], iconWidth: [{
|
|
133
|
+
type: i0.Input
|
|
134
|
+
}], iconHeight: [{
|
|
135
|
+
type: i0.Input
|
|
136
|
+
}], iconClass: [{
|
|
137
|
+
type: i0.Input
|
|
138
|
+
}] } });
|
|
139
|
+
|
|
140
|
+
var OasysButtonComponent = /** @class */ (function () {
|
|
141
|
+
function OasysButtonComponent(changes) {
|
|
142
|
+
this.changes = changes;
|
|
143
|
+
this.buttonIconPlacement = 'leading';
|
|
144
|
+
// Button Stylings
|
|
145
|
+
this.buttonSize = 'large';
|
|
146
|
+
this.buttonFullWidth = false;
|
|
147
|
+
this.buttonType = 'primary';
|
|
148
|
+
this.buttonDisabled = false;
|
|
149
|
+
// Button Actions
|
|
150
|
+
this.href = '';
|
|
151
|
+
this.click = new i0.EventEmitter();
|
|
152
|
+
this.iconContext = 'none';
|
|
153
|
+
}
|
|
154
|
+
OasysButtonComponent.prototype.onClick = function () {
|
|
155
|
+
console.log('button was clicked');
|
|
156
|
+
this.click.emit();
|
|
157
|
+
};
|
|
158
|
+
OasysButtonComponent.prototype.createButton = function () {
|
|
159
|
+
return {
|
|
160
|
+
buttonText: this.buttonText,
|
|
161
|
+
buttonIcon: this.buttonIcon,
|
|
162
|
+
buttonIconPlacement: this.buttonIconPlacement,
|
|
163
|
+
buttonType: this.buttonType,
|
|
164
|
+
buttonSize: this.buttonSize,
|
|
165
|
+
buttonDisabled: this.buttonDisabled,
|
|
166
|
+
href: this.href,
|
|
167
|
+
target: '',
|
|
168
|
+
buttonDisplayClasses: [
|
|
169
|
+
"type-" + this.buttonType,
|
|
170
|
+
"size-" + this.buttonSize,
|
|
171
|
+
"" + (this.buttonIcon ? 'button--has-icon' : ''),
|
|
172
|
+
"" + (this.buttonFullWidth ? 'button--full-width' : ''),
|
|
173
|
+
"" + (this.buttonText && this.buttonIcon ? 'button--icon--' + this.buttonIconPlacement : ''),
|
|
174
|
+
"" + (!this.buttonText && this.buttonIcon ? 'button--icon--only' : '')
|
|
175
|
+
].filter(function (d) { return !!d; })
|
|
176
|
+
};
|
|
177
|
+
};
|
|
178
|
+
OasysButtonComponent.prototype.ngOnChanges = function () {
|
|
179
|
+
this.button = this.createButton();
|
|
180
|
+
console.log(this.button);
|
|
181
|
+
this.changes.markForCheck();
|
|
182
|
+
};
|
|
183
|
+
OasysButtonComponent.prototype.ngOnInit = function () {
|
|
184
|
+
this.button = this.createButton();
|
|
185
|
+
};
|
|
186
|
+
return OasysButtonComponent;
|
|
187
|
+
}());
|
|
188
|
+
OasysButtonComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OasysButtonComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
189
|
+
OasysButtonComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: OasysButtonComponent, selector: "ui-button", inputs: { buttonText: "buttonText", buttonIcon: "buttonIcon", buttonIconPlacement: "buttonIconPlacement", buttonSize: "buttonSize", buttonFullWidth: "buttonFullWidth", buttonType: "buttonType", buttonDisabled: "buttonDisabled", href: "href" }, outputs: { click: "click" }, usesOnChanges: true, ngImport: i0__namespace, template: "<button (click)=\"onClick()\"\n [routerLink]=\"button.href || null\"\n [ngClass]=\"button.buttonDisplayClasses\"\n [attr.disabled]=\"button.buttonDisabled === true || null\"\n role=\"button\"\n [attr.aria-label]=\"button.buttonText\">\n <div class=\"button-content\">\n <ui-icon *ngIf=\"button.buttonIcon && button.buttonIconPlacement !== 'none'\" [iconName]=\"button.buttonIcon\" [iconSize]=\"button.buttonSize\" [iconClass]=\"'buttonIcon'\" [iconContext]=\"button.buttonIconPlacement\"></ui-icon>\n <span\n class=\"ui-text\"\n *ngIf=\"button.buttonText && button.buttonIconPlacement !== 'iconOnly'\">\n {{button.buttonText}}\n </span>\n </div>\n <div class=\"button-overlay\"></div>\n</button>\n", styles: ["ui-button button{border:0;padding:0;position:relative;display:inline-flex;text-align:center;justify-content:center;align-items:center;border-style:solid;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;-webkit-font-smoothing:antialiased;border-width:var(--component-border-width-button);font-family:var(--semantic-font-family-body);border-radius:var(--component-border-radius-button)}ui-button button:focus-visible{outline:none;box-shadow:0 0 0 var(--semantic-border-width-focus) var(--component-color-button-expressive-background)}ui-button button:focus{outline:none;box-shadow:0 0 0 var(--semantic-border-width-focus) var(--component-color-button-expressive-background)}ui-button button.type-primary{background-color:var(--component-color-button-primary-background);border-color:var(--component-color-button-primary-border);color:var(--component-color-button-primary-text)}ui-button button.type-primary .button-overlay{background-color:var(--component-color-button-primary-text)}ui-button button.type-secondary{background-color:var(--component-color-button-secondary-background);border-color:var(--component-color-button-secondary-border);color:var(--component-color-button-secondary-text)}ui-button button.type-secondary .button-overlay{background-color:var(--component-color-button-secondary-text)}ui-button button.type-tertiary{background-color:var(--component-color-button-tertiary-background);border-color:var(--component-color-button-tertiary-border);color:var(--component-color-button-tertiary-text)}ui-button button.type-tertiary .button-overlay{background-color:var(--component-color-button-tertiary-text)}ui-button button.type-primary-inverse{background-color:var(--component-color-button-primary-inverse-background);border-color:var(--component-color-button-primary-inverse-border);color:var(--component-color-button-primary-inverse-text)}ui-button button.type-primary-inverse .button-overlay{background-color:var(--component-color-button-primary-inverse-text)}ui-button button.type-secondary-inverse{background-color:var(--component-color-button-secondary-inverse-background);border-color:var(--component-color-button-secondary-inverse-border);color:var(--component-color-button-secondary-inverse-text)}ui-button button.type-secondary-inverse .button-overlay{background-color:var(--component-color-button-secondary-inverse-text)}ui-button button.type-tertiary-inverse{background-color:var(--component-color-button-tertiary-inverse-background);border-color:var(--component-color-button-tertiary-inverse-border);color:var(--component-color-button-tertiary-inverse-text)}ui-button button.type-tertiary-inverse .button-overlay{background-color:var(--component-color-button-tertiary-inverse-text)}ui-button button.type-expressive{background-color:var(--component-color-button-expressive-background);border-color:var(--component-color-button-expressive-border);color:var(--component-color-button-expressive-text)}ui-button button.type-expressive .button-overlay{background-color:var(--component-color-button-expressive-text)}ui-button button.type-danger{background-color:var(--component-color-button-danger-background);border-color:var(--component-color-button-danger-border);color:var(--component-color-button-danger-text)}ui-button button.type-danger .button-overlay{background-color:var(--component-color-button-danger-text)}ui-button button.type-facebook{background-color:var(--component-color-button-facebook-background);border-color:var(--component-color-button-facebook-border);color:var(--component-color-button-facebook-text)}ui-button button.type-facebook .button-overlay{background-color:var(--component-color-button-facebook-text)}ui-button button.type-paypal{background-color:var(--component-color-button-paypal-background);border-color:var(--component-color-button-paypal-border);color:var(--component-color-button-paypal-text)}ui-button button.type-paypal .button-overlay{background-color:var(--component-color-button-paypal-text)}ui-button button.type-trustpilot{background-color:var(--component-color-button-trustpilot-background);border-color:var(--component-color-button-trustpilot-border);color:var(--component-color-button-trustpilot-text)}ui-button button.type-trustpilot .button-overlay{background-color:var(--component-color-button-trustpilot-text)}ui-button button.size-large{padding:var(--component-size-button-large-padding-y) var(--component-size-button-large-padding-x);font-size:var(--component-size-button-large-font-size)}ui-button button.size-large .button-content{grid-gap:var(--component-size-button-large-inline-spacing);gap:var(--component-size-button-large-inline-spacing)}ui-button button.size-large .ui-icon{max-height:var(--component-size-button-large-line-height)}ui-button button.size-large .ui-text{line-height:var(--component-size-button-large-line-height)}ui-button button.size-small{padding:var(--component-size-button-small-padding-y) var(--component-size-button-small-padding-x);font-size:var(--component-size-button-small-font-size)}ui-button button.size-small .button-content{grid-gap:var(--component-size-button-small-inline-spacing);gap:var(--component-size-button-small-inline-spacing)}ui-button button.size-small .ui-icon{max-height:var(--component-size-button-small-line-height)}ui-button button.size-small .ui-text{line-height:var(--component-size-button-small-line-height)}ui-button button[disabled]{background-color:var(--component-color-button-disabled-background);border-color:var(--component-color-button-disabled-border);color:var(--component-color-button-disabled-text);cursor:default}ui-button button .buttonIcon{fill:currentColor}ui-button button .button-overlay{position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none;pointer-events:none;opacity:0;border-radius:var(--component-border-radius-button)}ui-button button:hover .button-overlay{opacity:var(--component-opacity-overlay-hover)}ui-button button:focus .button-overlay{opacity:var(--component-opacity-overlay-focus)}ui-button button.button--has-icon.button--icon--trailing .button-content{flex-direction:row-reverse}ui-button button .button-content{display:flex;align-items:center}ui-button button .button-content .ui-icon{display:flex;align-items:center}ui-button button .button-content .ui-text{text-transform:var(--component-text-transform-button);letter-spacing:var(--component-letter-spacing-button);font-weight:var(--component-font-weight-button)}ui-button button.button--full-width{display:flex;width:100%}\n"], components: [{ type: IconComponent, selector: "ui-icon", inputs: ["iconSize", "iconName", "iconContext", "iconWidth", "iconHeight", "iconClass"] }], directives: [{ type: i2__namespace.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["routerLink", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
|
|
190
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OasysButtonComponent, decorators: [{
|
|
191
|
+
type: i0.Component,
|
|
192
|
+
args: [{
|
|
193
|
+
selector: 'ui-button',
|
|
194
|
+
templateUrl: './button.component.html',
|
|
195
|
+
styleUrls: ['./button.component.scss'],
|
|
196
|
+
encapsulation: i0.ViewEncapsulation.None,
|
|
197
|
+
changeDetection: i0.ChangeDetectionStrategy.OnPush
|
|
198
|
+
}]
|
|
199
|
+
}], ctorParameters: function () { return [{ type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { buttonText: [{
|
|
200
|
+
type: i0.Input
|
|
201
|
+
}], buttonIcon: [{
|
|
202
|
+
type: i0.Input
|
|
203
|
+
}], buttonIconPlacement: [{
|
|
204
|
+
type: i0.Input
|
|
205
|
+
}], buttonSize: [{
|
|
206
|
+
type: i0.Input
|
|
207
|
+
}], buttonFullWidth: [{
|
|
208
|
+
type: i0.Input
|
|
209
|
+
}], buttonType: [{
|
|
210
|
+
type: i0.Input
|
|
211
|
+
}], buttonDisabled: [{
|
|
212
|
+
type: i0.Input
|
|
213
|
+
}], href: [{
|
|
214
|
+
type: i0.Input
|
|
215
|
+
}], click: [{
|
|
216
|
+
type: i0.Output
|
|
217
|
+
}] } });
|
|
218
|
+
|
|
219
|
+
var LayoutInlineComponent = /** @class */ (function () {
|
|
220
|
+
function LayoutInlineComponent() {
|
|
221
|
+
}
|
|
222
|
+
LayoutInlineComponent.prototype.ngOnInit = function () {
|
|
223
|
+
};
|
|
224
|
+
return LayoutInlineComponent;
|
|
225
|
+
}());
|
|
226
|
+
LayoutInlineComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: LayoutInlineComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
227
|
+
LayoutInlineComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: LayoutInlineComponent, selector: "ui-inline", ngImport: i0__namespace, template: "<div class=\"ui-layout-inline\"><ng-content></ng-content></div>", styles: [".ui-layout-inline{display:inline-flex;position:relative}.ui-layout-inline>*{margin-left:var(--layout-inline-spacing-default);margin-right:var(--layout-inline-spacing-default)}.ui-layout-inline:first-child{margin-left:0}.ui-layout-inline:last-child{margin-right:0}.ui-layout-inline:only-child{margin-left:0;margin-right:0}\n"], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
|
|
228
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: LayoutInlineComponent, decorators: [{
|
|
229
|
+
type: i0.Component,
|
|
230
|
+
args: [{
|
|
231
|
+
selector: 'ui-inline',
|
|
232
|
+
templateUrl: './inline.component.html',
|
|
233
|
+
styleUrls: ['./inline.component.css'],
|
|
234
|
+
encapsulation: i0.ViewEncapsulation.None,
|
|
235
|
+
changeDetection: i0.ChangeDetectionStrategy.OnPush
|
|
236
|
+
}]
|
|
237
|
+
}], ctorParameters: function () { return []; } });
|
|
238
|
+
|
|
239
|
+
var LayoutBoxComponent = /** @class */ (function () {
|
|
240
|
+
function LayoutBoxComponent() {
|
|
241
|
+
this.padding = 'default';
|
|
242
|
+
}
|
|
243
|
+
LayoutBoxComponent.prototype.ngOnInit = function () {
|
|
244
|
+
this.boxLayoutClasses = [
|
|
245
|
+
"ui-layout-box-" + this.padding
|
|
246
|
+
].join(' ');
|
|
247
|
+
};
|
|
248
|
+
return LayoutBoxComponent;
|
|
249
|
+
}());
|
|
250
|
+
LayoutBoxComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: LayoutBoxComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
251
|
+
LayoutBoxComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: LayoutBoxComponent, selector: "ui-box", inputs: { padding: "padding" }, host: { properties: { "class": "boxLayoutClasses" } }, ngImport: i0__namespace, template: '<ng-content></ng-content>', isInline: true, styles: [".ui-layout-box-xsmall{padding:var(--size-unit-xsmall)}.ui-layout-box-small{padding:var(--size-unit-small)}.ui-layout-box-default{padding:var(--size-unit-default)}.ui-layout-box-large{padding:var(--size-unit-large)}\n"], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
|
|
252
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: LayoutBoxComponent, decorators: [{
|
|
253
|
+
type: i0.Component,
|
|
254
|
+
args: [{
|
|
255
|
+
selector: 'ui-box',
|
|
256
|
+
template: '<ng-content></ng-content>',
|
|
257
|
+
host: {
|
|
258
|
+
'[class]': 'boxLayoutClasses'
|
|
259
|
+
},
|
|
260
|
+
styleUrls: ['./box.component.scss'],
|
|
261
|
+
encapsulation: i0.ViewEncapsulation.None,
|
|
262
|
+
changeDetection: i0.ChangeDetectionStrategy.OnPush
|
|
263
|
+
}]
|
|
264
|
+
}], ctorParameters: function () { return []; }, propDecorators: { padding: [{
|
|
265
|
+
type: i0.Input
|
|
266
|
+
}] } });
|
|
267
|
+
|
|
268
|
+
var OasysLibModule = /** @class */ (function () {
|
|
269
|
+
function OasysLibModule() {
|
|
270
|
+
}
|
|
271
|
+
return OasysLibModule;
|
|
272
|
+
}());
|
|
273
|
+
OasysLibModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OasysLibModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
|
|
274
|
+
OasysLibModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OasysLibModule, declarations: [OasysButtonComponent,
|
|
275
|
+
LayoutInlineComponent,
|
|
276
|
+
IconComponent,
|
|
277
|
+
LayoutBoxComponent], imports: [i3.CommonModule, i2__namespace.RouterModule], exports: [OasysButtonComponent,
|
|
278
|
+
LayoutBoxComponent] });
|
|
279
|
+
OasysLibModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OasysLibModule, providers: [
|
|
280
|
+
WindowService,
|
|
281
|
+
TokenService,
|
|
282
|
+
{ provide: i3.APP_BASE_HREF, useValue: '/' }
|
|
283
|
+
], imports: [[
|
|
284
|
+
i3.CommonModule,
|
|
285
|
+
i2.RouterModule.forRoot([])
|
|
286
|
+
]] });
|
|
287
|
+
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OasysLibModule, decorators: [{
|
|
288
|
+
type: i0.NgModule,
|
|
289
|
+
args: [{
|
|
290
|
+
declarations: [
|
|
291
|
+
OasysButtonComponent,
|
|
292
|
+
LayoutInlineComponent,
|
|
293
|
+
IconComponent,
|
|
294
|
+
LayoutBoxComponent
|
|
295
|
+
],
|
|
296
|
+
imports: [
|
|
297
|
+
i3.CommonModule,
|
|
298
|
+
i2.RouterModule.forRoot([])
|
|
299
|
+
],
|
|
300
|
+
exports: [
|
|
301
|
+
OasysButtonComponent,
|
|
302
|
+
LayoutBoxComponent
|
|
303
|
+
],
|
|
304
|
+
providers: [
|
|
305
|
+
WindowService,
|
|
306
|
+
TokenService,
|
|
307
|
+
{ provide: i3.APP_BASE_HREF, useValue: '/' }
|
|
308
|
+
]
|
|
309
|
+
}]
|
|
310
|
+
}] });
|
|
311
|
+
|
|
312
|
+
/*
|
|
313
|
+
* Public API Surface of oasys-lib
|
|
314
|
+
*/
|
|
315
|
+
|
|
316
|
+
/**
|
|
317
|
+
* Generated bundle index. Do not edit.
|
|
318
|
+
*/
|
|
319
|
+
|
|
320
|
+
exports.IconComponent = IconComponent;
|
|
321
|
+
exports.LayoutBoxComponent = LayoutBoxComponent;
|
|
322
|
+
exports.OasysButtonComponent = OasysButtonComponent;
|
|
323
|
+
exports.OasysLibModule = OasysLibModule;
|
|
324
|
+
|
|
325
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
326
|
+
|
|
327
|
+
}));
|
|
328
|
+
//# sourceMappingURL=oasys-lib.umd.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"oasys-lib.umd.js","sources":["../../../projects/oasys-lib/src/lib/services/window.service.ts","../../../projects/oasys-lib/src/lib/services/token.service.ts","../../../projects/oasys-lib/src/lib/components/icon/icon.component.ts","../../../projects/oasys-lib/src/lib/components/icon/icon.component.html","../../../projects/oasys-lib/src/lib/components/button/button.component.ts","../../../projects/oasys-lib/src/lib/components/button/button.component.html","../../../projects/oasys-lib/src/lib/components/layout/inline/inline.component.ts","../../../projects/oasys-lib/src/lib/components/layout/inline/inline.component.html","../../../projects/oasys-lib/src/lib/components/layout/box/box.component.ts","../../../projects/oasys-lib/src/lib/oasys-lib.module.ts","../../../projects/oasys-lib/src/public-api.ts","../../../projects/oasys-lib/src/oasys-lib.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\n\nfunction _window(): any {\n return window;\n}\n\n@Injectable({\n providedIn: 'root'\n})\nexport class WindowService {\n \n get nativeWindow(): any {\n return _window();\n }\n \n}","import { Injectable } from '@angular/core';\nimport { WindowService } from './window.service';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class TokenService {\n\n constructor(private windowRef: WindowService){}\n\n /*\n Get the brand name for the currently enable custom property set (ie. /bloomon/variables.css)\n Because variables are scoped via a selector (ie: ':root .bloomon {}')\n we cannot get brand-specific custom properties programatically\n\n Important: Ensure that the component requiring the brand name has locally scoped the custom property:\n | ui-icon {\n | --icon-component-brand: var(--utility-brand-name);\n | }\n */\n getBrandName(tokenName: string, element: Element): string {\n return this.getTokenValue(tokenName, element);\n }\n\n getTokenValue(tokenName: string, element?: Element): string {\n const rootElement = element || this.windowRef.nativeWindow.document.documentElement;\n return this.windowRef.nativeWindow.getComputedStyle(rootElement)\n .getPropertyValue(tokenName)\n .trim() || '';\n }\n\n}","import { Component, Input, OnInit, ViewEncapsulation, ChangeDetectionStrategy, OnChanges, ElementRef } from '@angular/core';\nimport { TokenService } from '../../services/token.service';\nimport { WindowService } from '../../services/window.service';\nimport { IconNames, IconContext } from './icon';\n@Component({\n selector:'ui-icon',\n templateUrl: './icon.component.html',\n styleUrls: ['./icon.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None\n})\nexport class IconComponent implements OnInit, OnChanges {\n @Input() iconSize: 'small'|'large' = 'large';\n @Input() iconName!: IconNames;\n @Input() iconContext: IconContext = 'none';\n\n @Input() iconWidth?: number;\n @Input() iconHeight?: number;\n @Input() iconClass?: string;\n\n size?: string;\n iconBrandPath?: string;\n iconDisplayClasses: string[];\n\n constructor(private tokenService: TokenService, private windowRef: WindowService, private elementRef: ElementRef) { }\n\n convertRemToPixels(remString: string): number {\n const remNumber = parseFloat(remString.replace('rem', ''));\n return remNumber * parseFloat(getComputedStyle(this.windowRef.nativeWindow.document.documentElement).fontSize);\n }\n\n ngOnChanges(): void {\n this.ngOnInit();\n }\n\n ngOnInit(): void {\n this.iconBrandPath = `${this.tokenService.getBrandName(`--icon-component-brand`, this.elementRef.nativeElement)}`\n this.size = this.tokenService.getTokenValue(`--global-size-icon-${this.iconSize}`);\n\n this.iconDisplayClasses = [\n `icon-context-${this.iconContext}`,\n `icon-size-${this.iconSize}`\n ];\n\n const sizeInPixels = this.convertRemToPixels(this.size);\n this.iconWidth = sizeInPixels;\n this.iconHeight = sizeInPixels;\n }\n\n}\n","<div class=\"ui-icon\" [ngClass]=\"iconDisplayClasses\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" attr.width=\"{{iconWidth}}px\" attr.height=\"{{iconHeight}}px\" attr.class=\"{{iconClass}}\">\n <use attr.xlink:href=\"./{{iconBrandPath}}/assets/icons/icons.svg#icon-{{iconName}}-24\"></use>\n </svg>\n</div>\n","import { Component, Input, OnInit, Output, ViewEncapsulation, EventEmitter, ChangeDetectionStrategy, ChangeDetectorRef, OnChanges, AfterViewInit, SimpleChanges } from '@angular/core';\nimport { IconNames, IconContext } from '../icon/icon';\nimport { TextTransform } from '../text/text';\nimport {\n UIButton,\n UIButtonBoolean,\n UIButtonSize,\n UIButtonType\n} from './button';\n\n@Component({\n selector:'ui-button',\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class OasysButtonComponent implements OnInit, OnChanges {\n\n button: UIButton;\n\n // // Button Content\n @Input() buttonText: string;\n @Input() buttonIcon?: IconNames;\n @Input() buttonIconPlacement: IconContext = 'leading';\n\n // Button Stylings\n @Input() buttonSize: UIButtonSize = 'large';\n @Input() buttonFullWidth: UIButtonBoolean = false;\n @Input() buttonType: UIButtonType = 'primary';\n @Input() buttonDisabled: boolean = false;\n\n\n // Button Actions\n @Input() href: string = '';\n @Output() click: EventEmitter<void> = new EventEmitter();\n\n buttonDisplayClasses: string[];\n iconContext: IconContext = 'none';\n textTransform!: TextTransform;\n\n constructor(private changes: ChangeDetectorRef) { }\n\n onClick(): void {\n console.log('button was clicked');\n this.click.emit();\n }\n\n createButton(): UIButton {\n return <UIButton>{\n buttonText: this.buttonText,\n buttonIcon: this.buttonIcon,\n buttonIconPlacement: this.buttonIconPlacement,\n buttonType: this.buttonType,\n buttonSize: this.buttonSize,\n buttonDisabled: this.buttonDisabled,\n href: this.href,\n target: '',\n buttonDisplayClasses: [\n `type-${this.buttonType}`,\n `size-${this.buttonSize}`,\n `${this.buttonIcon ? 'button--has-icon': ''}`,\n `${this.buttonFullWidth ? 'button--full-width': ''}`,\n `${this.buttonText && this.buttonIcon ? 'button--icon--'+this.buttonIconPlacement : ''}`,\n `${!this.buttonText && this.buttonIcon ? 'button--icon--only' : ''}`\n ].filter((d) => !!d)\n };\n }\n\n ngOnChanges(): void {\n this.button = this.createButton();\n console.log(this.button);\n this.changes.markForCheck();\n }\n\n ngOnInit(): void {\n this.button = this.createButton();\n }\n}\n","<button (click)=\"onClick()\"\n [routerLink]=\"button.href || null\"\n [ngClass]=\"button.buttonDisplayClasses\"\n [attr.disabled]=\"button.buttonDisabled === true || null\"\n role=\"button\"\n [attr.aria-label]=\"button.buttonText\">\n <div class=\"button-content\">\n <ui-icon *ngIf=\"button.buttonIcon && button.buttonIconPlacement !== 'none'\" [iconName]=\"button.buttonIcon\" [iconSize]=\"button.buttonSize\" [iconClass]=\"'buttonIcon'\" [iconContext]=\"button.buttonIconPlacement\"></ui-icon>\n <span\n class=\"ui-text\"\n *ngIf=\"button.buttonText && button.buttonIconPlacement !== 'iconOnly'\">\n {{button.buttonText}}\n </span>\n </div>\n <div class=\"button-overlay\"></div>\n</button>\n","import { ChangeDetectionStrategy, Component, OnInit, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector:'ui-inline',\n templateUrl: './inline.component.html',\n styleUrls: ['./inline.component.css'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LayoutInlineComponent implements OnInit {\n\n constructor() { }\n\n ngOnInit(): void {\n }\n\n}\n","<div class=\"ui-layout-inline\"><ng-content></ng-content></div>","import { ChangeDetectionStrategy, OnInit, ViewEncapsulation } from '@angular/core';\nimport { Input } from '@angular/core';\nimport { Component} from '@angular/core';\n\n@Component({\n selector:'ui-box',\n template: '<ng-content></ng-content>',\n host: {\n '[class]' : 'boxLayoutClasses'\n },\n styleUrls: ['./box.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LayoutBoxComponent implements OnInit {\n boxLayoutClasses?: string;\n\n @Input() padding?: BoxPaddings = 'default';\n\n constructor() { }\n\n ngOnInit(): void {\n this.boxLayoutClasses = [\n `ui-layout-box-${this.padding}`\n ].join(' ');\n }\n\n}\n\nexport type BoxPaddings = 'xsmall'|'small'|'medium'|'large'|'default';","import { APP_BASE_HREF, CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { RouterModule } from '@angular/router';\nimport { OasysButtonComponent } from './components/button/button.component';\nimport { LayoutInlineComponent } from './components/layout/inline/inline.component';\nimport { IconComponent } from './components/icon/icon.component';\nimport { LayoutBoxComponent } from './components/layout/box/box.component';\nimport { WindowService } from './services/window.service';\nimport { TokenService } from './services/token.service';\n\n\n\n@NgModule({\n declarations: [\n OasysButtonComponent,\n LayoutInlineComponent,\n IconComponent,\n LayoutBoxComponent\n ],\n imports: [\n CommonModule,\n RouterModule.forRoot([])\n ],\n exports: [\n OasysButtonComponent,\n LayoutBoxComponent\n ],\n providers: [\n WindowService,\n TokenService,\n {provide: APP_BASE_HREF, useValue: '/'}\n ]\n})\nexport class OasysLibModule { }\n","/*\n * Public API Surface of oasys-lib\n */\n\n\nexport * from './lib/oasys-lib.module';\n\nexport * from './lib/components/button/button.component';\nexport * from './lib/components/icon/icon.component';\nexport * from './lib/components/layout/box/box.component';\n\nexport * from './lib/components/icon/icon';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i0","Injectable","i1.WindowService","i1.TokenService","i2.WindowService","i3","Component","ChangeDetectionStrategy","ViewEncapsulation","Input","EventEmitter","i1.IconComponent","i2","Output","CommonModule","i1","APP_BASE_HREF","RouterModule","NgModule"],"mappings":"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"}
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import { Component, Input, Output, ViewEncapsulation, EventEmitter, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "../icon/icon.component";
|
|
4
|
+
import * as i2 from "@angular/router";
|
|
5
|
+
import * as i3 from "@angular/common";
|
|
6
|
+
export class OasysButtonComponent {
|
|
7
|
+
constructor(changes) {
|
|
8
|
+
this.changes = changes;
|
|
9
|
+
this.buttonIconPlacement = 'leading';
|
|
10
|
+
// Button Stylings
|
|
11
|
+
this.buttonSize = 'large';
|
|
12
|
+
this.buttonFullWidth = false;
|
|
13
|
+
this.buttonType = 'primary';
|
|
14
|
+
this.buttonDisabled = false;
|
|
15
|
+
// Button Actions
|
|
16
|
+
this.href = '';
|
|
17
|
+
this.click = new EventEmitter();
|
|
18
|
+
this.iconContext = 'none';
|
|
19
|
+
}
|
|
20
|
+
onClick() {
|
|
21
|
+
console.log('button was clicked');
|
|
22
|
+
this.click.emit();
|
|
23
|
+
}
|
|
24
|
+
createButton() {
|
|
25
|
+
return {
|
|
26
|
+
buttonText: this.buttonText,
|
|
27
|
+
buttonIcon: this.buttonIcon,
|
|
28
|
+
buttonIconPlacement: this.buttonIconPlacement,
|
|
29
|
+
buttonType: this.buttonType,
|
|
30
|
+
buttonSize: this.buttonSize,
|
|
31
|
+
buttonDisabled: this.buttonDisabled,
|
|
32
|
+
href: this.href,
|
|
33
|
+
target: '',
|
|
34
|
+
buttonDisplayClasses: [
|
|
35
|
+
`type-${this.buttonType}`,
|
|
36
|
+
`size-${this.buttonSize}`,
|
|
37
|
+
`${this.buttonIcon ? 'button--has-icon' : ''}`,
|
|
38
|
+
`${this.buttonFullWidth ? 'button--full-width' : ''}`,
|
|
39
|
+
`${this.buttonText && this.buttonIcon ? 'button--icon--' + this.buttonIconPlacement : ''}`,
|
|
40
|
+
`${!this.buttonText && this.buttonIcon ? 'button--icon--only' : ''}`
|
|
41
|
+
].filter((d) => !!d)
|
|
42
|
+
};
|
|
43
|
+
}
|
|
44
|
+
ngOnChanges() {
|
|
45
|
+
this.button = this.createButton();
|
|
46
|
+
console.log(this.button);
|
|
47
|
+
this.changes.markForCheck();
|
|
48
|
+
}
|
|
49
|
+
ngOnInit() {
|
|
50
|
+
this.button = this.createButton();
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
OasysButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: OasysButtonComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
54
|
+
OasysButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: OasysButtonComponent, selector: "ui-button", inputs: { buttonText: "buttonText", buttonIcon: "buttonIcon", buttonIconPlacement: "buttonIconPlacement", buttonSize: "buttonSize", buttonFullWidth: "buttonFullWidth", buttonType: "buttonType", buttonDisabled: "buttonDisabled", href: "href" }, outputs: { click: "click" }, usesOnChanges: true, ngImport: i0, template: "<button (click)=\"onClick()\"\n [routerLink]=\"button.href || null\"\n [ngClass]=\"button.buttonDisplayClasses\"\n [attr.disabled]=\"button.buttonDisabled === true || null\"\n role=\"button\"\n [attr.aria-label]=\"button.buttonText\">\n <div class=\"button-content\">\n <ui-icon *ngIf=\"button.buttonIcon && button.buttonIconPlacement !== 'none'\" [iconName]=\"button.buttonIcon\" [iconSize]=\"button.buttonSize\" [iconClass]=\"'buttonIcon'\" [iconContext]=\"button.buttonIconPlacement\"></ui-icon>\n <span\n class=\"ui-text\"\n *ngIf=\"button.buttonText && button.buttonIconPlacement !== 'iconOnly'\">\n {{button.buttonText}}\n </span>\n </div>\n <div class=\"button-overlay\"></div>\n</button>\n", styles: ["ui-button button{border:0;padding:0;position:relative;display:inline-flex;text-align:center;justify-content:center;align-items:center;border-style:solid;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;-webkit-font-smoothing:antialiased;border-width:var(--component-border-width-button);font-family:var(--semantic-font-family-body);border-radius:var(--component-border-radius-button)}ui-button button:focus-visible{outline:none;box-shadow:0 0 0 var(--semantic-border-width-focus) var(--component-color-button-expressive-background)}ui-button button:focus{outline:none;box-shadow:0 0 0 var(--semantic-border-width-focus) var(--component-color-button-expressive-background)}ui-button button.type-primary{background-color:var(--component-color-button-primary-background);border-color:var(--component-color-button-primary-border);color:var(--component-color-button-primary-text)}ui-button button.type-primary .button-overlay{background-color:var(--component-color-button-primary-text)}ui-button button.type-secondary{background-color:var(--component-color-button-secondary-background);border-color:var(--component-color-button-secondary-border);color:var(--component-color-button-secondary-text)}ui-button button.type-secondary .button-overlay{background-color:var(--component-color-button-secondary-text)}ui-button button.type-tertiary{background-color:var(--component-color-button-tertiary-background);border-color:var(--component-color-button-tertiary-border);color:var(--component-color-button-tertiary-text)}ui-button button.type-tertiary .button-overlay{background-color:var(--component-color-button-tertiary-text)}ui-button button.type-primary-inverse{background-color:var(--component-color-button-primary-inverse-background);border-color:var(--component-color-button-primary-inverse-border);color:var(--component-color-button-primary-inverse-text)}ui-button button.type-primary-inverse .button-overlay{background-color:var(--component-color-button-primary-inverse-text)}ui-button button.type-secondary-inverse{background-color:var(--component-color-button-secondary-inverse-background);border-color:var(--component-color-button-secondary-inverse-border);color:var(--component-color-button-secondary-inverse-text)}ui-button button.type-secondary-inverse .button-overlay{background-color:var(--component-color-button-secondary-inverse-text)}ui-button button.type-tertiary-inverse{background-color:var(--component-color-button-tertiary-inverse-background);border-color:var(--component-color-button-tertiary-inverse-border);color:var(--component-color-button-tertiary-inverse-text)}ui-button button.type-tertiary-inverse .button-overlay{background-color:var(--component-color-button-tertiary-inverse-text)}ui-button button.type-expressive{background-color:var(--component-color-button-expressive-background);border-color:var(--component-color-button-expressive-border);color:var(--component-color-button-expressive-text)}ui-button button.type-expressive .button-overlay{background-color:var(--component-color-button-expressive-text)}ui-button button.type-danger{background-color:var(--component-color-button-danger-background);border-color:var(--component-color-button-danger-border);color:var(--component-color-button-danger-text)}ui-button button.type-danger .button-overlay{background-color:var(--component-color-button-danger-text)}ui-button button.type-facebook{background-color:var(--component-color-button-facebook-background);border-color:var(--component-color-button-facebook-border);color:var(--component-color-button-facebook-text)}ui-button button.type-facebook .button-overlay{background-color:var(--component-color-button-facebook-text)}ui-button button.type-paypal{background-color:var(--component-color-button-paypal-background);border-color:var(--component-color-button-paypal-border);color:var(--component-color-button-paypal-text)}ui-button button.type-paypal .button-overlay{background-color:var(--component-color-button-paypal-text)}ui-button button.type-trustpilot{background-color:var(--component-color-button-trustpilot-background);border-color:var(--component-color-button-trustpilot-border);color:var(--component-color-button-trustpilot-text)}ui-button button.type-trustpilot .button-overlay{background-color:var(--component-color-button-trustpilot-text)}ui-button button.size-large{padding:var(--component-size-button-large-padding-y) var(--component-size-button-large-padding-x);font-size:var(--component-size-button-large-font-size)}ui-button button.size-large .button-content{grid-gap:var(--component-size-button-large-inline-spacing);gap:var(--component-size-button-large-inline-spacing)}ui-button button.size-large .ui-icon{max-height:var(--component-size-button-large-line-height)}ui-button button.size-large .ui-text{line-height:var(--component-size-button-large-line-height)}ui-button button.size-small{padding:var(--component-size-button-small-padding-y) var(--component-size-button-small-padding-x);font-size:var(--component-size-button-small-font-size)}ui-button button.size-small .button-content{grid-gap:var(--component-size-button-small-inline-spacing);gap:var(--component-size-button-small-inline-spacing)}ui-button button.size-small .ui-icon{max-height:var(--component-size-button-small-line-height)}ui-button button.size-small .ui-text{line-height:var(--component-size-button-small-line-height)}ui-button button[disabled]{background-color:var(--component-color-button-disabled-background);border-color:var(--component-color-button-disabled-border);color:var(--component-color-button-disabled-text);cursor:default}ui-button button .buttonIcon{fill:currentColor}ui-button button .button-overlay{position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none;pointer-events:none;opacity:0;border-radius:var(--component-border-radius-button)}ui-button button:hover .button-overlay{opacity:var(--component-opacity-overlay-hover)}ui-button button:focus .button-overlay{opacity:var(--component-opacity-overlay-focus)}ui-button button.button--has-icon.button--icon--trailing .button-content{flex-direction:row-reverse}ui-button button .button-content{display:flex;align-items:center}ui-button button .button-content .ui-icon{display:flex;align-items:center}ui-button button .button-content .ui-text{text-transform:var(--component-text-transform-button);letter-spacing:var(--component-letter-spacing-button);font-weight:var(--component-font-weight-button)}ui-button button.button--full-width{display:flex;width:100%}\n"], components: [{ type: i1.IconComponent, selector: "ui-icon", inputs: ["iconSize", "iconName", "iconContext", "iconWidth", "iconHeight", "iconClass"] }], directives: [{ type: i2.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["routerLink", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
55
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: OasysButtonComponent, decorators: [{
|
|
56
|
+
type: Component,
|
|
57
|
+
args: [{
|
|
58
|
+
selector: 'ui-button',
|
|
59
|
+
templateUrl: './button.component.html',
|
|
60
|
+
styleUrls: ['./button.component.scss'],
|
|
61
|
+
encapsulation: ViewEncapsulation.None,
|
|
62
|
+
changeDetection: ChangeDetectionStrategy.OnPush
|
|
63
|
+
}]
|
|
64
|
+
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { buttonText: [{
|
|
65
|
+
type: Input
|
|
66
|
+
}], buttonIcon: [{
|
|
67
|
+
type: Input
|
|
68
|
+
}], buttonIconPlacement: [{
|
|
69
|
+
type: Input
|
|
70
|
+
}], buttonSize: [{
|
|
71
|
+
type: Input
|
|
72
|
+
}], buttonFullWidth: [{
|
|
73
|
+
type: Input
|
|
74
|
+
}], buttonType: [{
|
|
75
|
+
type: Input
|
|
76
|
+
}], buttonDisabled: [{
|
|
77
|
+
type: Input
|
|
78
|
+
}], href: [{
|
|
79
|
+
type: Input
|
|
80
|
+
}], click: [{
|
|
81
|
+
type: Output
|
|
82
|
+
}] } });
|
|
83
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL29hc3lzLWxpYi9zcmMvbGliL2NvbXBvbmVudHMvYnV0dG9uL2J1dHRvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9vYXN5cy1saWIvc3JjL2xpYi9jb21wb25lbnRzL2J1dHRvbi9idXR0b24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQVUsTUFBTSxFQUFFLGlCQUFpQixFQUFFLFlBQVksRUFBRSx1QkFBdUIsRUFBRSxpQkFBaUIsRUFBMkMsTUFBTSxlQUFlLENBQUM7Ozs7O0FBaUJ2TCxNQUFNLE9BQU8sb0JBQW9CO0lBd0IvQixZQUFvQixPQUEwQjtRQUExQixZQUFPLEdBQVAsT0FBTyxDQUFtQjtRQWpCckMsd0JBQW1CLEdBQWdCLFNBQVMsQ0FBQztRQUV0RCxrQkFBa0I7UUFDVCxlQUFVLEdBQWlCLE9BQU8sQ0FBQztRQUNuQyxvQkFBZSxHQUFvQixLQUFLLENBQUM7UUFDekMsZUFBVSxHQUFpQixTQUFTLENBQUM7UUFDckMsbUJBQWMsR0FBWSxLQUFLLENBQUM7UUFHekMsaUJBQWlCO1FBQ1IsU0FBSSxHQUFXLEVBQUUsQ0FBQztRQUNqQixVQUFLLEdBQXVCLElBQUksWUFBWSxFQUFFLENBQUM7UUFHekQsZ0JBQVcsR0FBZ0IsTUFBTSxDQUFDO0lBR2dCLENBQUM7SUFFbkQsT0FBTztRQUNMLE9BQU8sQ0FBQyxHQUFHLENBQUMsb0JBQW9CLENBQUMsQ0FBQztRQUNsQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksRUFBRSxDQUFDO0lBQ3BCLENBQUM7SUFFRCxZQUFZO1FBQ1YsT0FBaUI7WUFDZixVQUFVLEVBQUUsSUFBSSxDQUFDLFVBQVU7WUFDM0IsVUFBVSxFQUFFLElBQUksQ0FBQyxVQUFVO1lBQzNCLG1CQUFtQixFQUFFLElBQUksQ0FBQyxtQkFBbUI7WUFDN0MsVUFBVSxFQUFFLElBQUksQ0FBQyxVQUFVO1lBQzNCLFVBQVUsRUFBRSxJQUFJLENBQUMsVUFBVTtZQUMzQixjQUFjLEVBQUUsSUFBSSxDQUFDLGNBQWM7WUFDbkMsSUFBSSxFQUFFLElBQUksQ0FBQyxJQUFJO1lBQ2YsTUFBTSxFQUFFLEVBQUU7WUFDVixvQkFBb0IsRUFBRTtnQkFDdEIsUUFBUSxJQUFJLENBQUMsVUFBVSxFQUFFO2dCQUN6QixRQUFRLElBQUksQ0FBQyxVQUFVLEVBQUU7Z0JBQ3pCLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsa0JBQWtCLENBQUEsQ0FBQyxDQUFDLEVBQUUsRUFBRTtnQkFDN0MsR0FBRyxJQUFJLENBQUMsZUFBZSxDQUFDLENBQUMsQ0FBQyxvQkFBb0IsQ0FBQSxDQUFDLENBQUMsRUFBRSxFQUFFO2dCQUNwRCxHQUFHLElBQUksQ0FBQyxVQUFVLElBQUksSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsZ0JBQWdCLEdBQUMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQUU7Z0JBQ3hGLEdBQUcsQ0FBQyxJQUFJLENBQUMsVUFBVSxJQUFJLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLG9CQUFvQixDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQUU7YUFDbkUsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7U0FDckIsQ0FBQztJQUNKLENBQUM7SUFFRCxXQUFXO1FBQ1AsSUFBSSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDbEMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDekIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUNoQyxDQUFDO0lBRUQsUUFBUTtRQUNOLElBQUksQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ3BDLENBQUM7O2tIQTVEVSxvQkFBb0I7c0dBQXBCLG9CQUFvQix1VkNqQmpDLDZ4QkFnQkE7NEZEQ2Esb0JBQW9CO2tCQVBoQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBQyxXQUFXO29CQUNwQixXQUFXLEVBQUUseUJBQXlCO29CQUN0QyxTQUFTLEVBQUUsQ0FBQyx5QkFBeUIsQ0FBQztvQkFDdEMsYUFBYSxFQUFFLGlCQUFpQixDQUFDLElBQUk7b0JBQ3JDLGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNO2lCQUNoRDt3R0FNVSxVQUFVO3NCQUFsQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csbUJBQW1CO3NCQUEzQixLQUFLO2dCQUdHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csZUFBZTtzQkFBdkIsS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBSUcsSUFBSTtzQkFBWixLQUFLO2dCQUNJLEtBQUs7c0JBQWQsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0LCBWaWV3RW5jYXBzdWxhdGlvbiwgRXZlbnRFbWl0dGVyLCBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ2hhbmdlRGV0ZWN0b3JSZWYsIE9uQ2hhbmdlcywgQWZ0ZXJWaWV3SW5pdCwgU2ltcGxlQ2hhbmdlcyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSWNvbk5hbWVzLCBJY29uQ29udGV4dCB9IGZyb20gJy4uL2ljb24vaWNvbic7XG5pbXBvcnQgeyBUZXh0VHJhbnNmb3JtIH0gZnJvbSAnLi4vdGV4dC90ZXh0JztcbmltcG9ydCB7XG4gIFVJQnV0dG9uLFxuICBVSUJ1dHRvbkJvb2xlYW4sXG4gIFVJQnV0dG9uU2l6ZSxcbiAgVUlCdXR0b25UeXBlXG59IGZyb20gJy4vYnV0dG9uJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOid1aS1idXR0b24nLFxuICB0ZW1wbGF0ZVVybDogJy4vYnV0dG9uLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vYnV0dG9uLmNvbXBvbmVudC5zY3NzJ10sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoXG59KVxuZXhwb3J0IGNsYXNzIE9hc3lzQnV0dG9uQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkNoYW5nZXMge1xuXG4gIGJ1dHRvbjogVUlCdXR0b247XG5cbiAgLy8gLy8gQnV0dG9uIENvbnRlbnRcbiAgQElucHV0KCkgYnV0dG9uVGV4dDogc3RyaW5nO1xuICBASW5wdXQoKSBidXR0b25JY29uPzogSWNvbk5hbWVzO1xuICBASW5wdXQoKSBidXR0b25JY29uUGxhY2VtZW50OiBJY29uQ29udGV4dCA9ICdsZWFkaW5nJztcblxuICAvLyBCdXR0b24gU3R5bGluZ3NcbiAgQElucHV0KCkgYnV0dG9uU2l6ZTogVUlCdXR0b25TaXplID0gJ2xhcmdlJztcbiAgQElucHV0KCkgYnV0dG9uRnVsbFdpZHRoOiBVSUJ1dHRvbkJvb2xlYW4gPSBmYWxzZTtcbiAgQElucHV0KCkgYnV0dG9uVHlwZTogVUlCdXR0b25UeXBlID0gJ3ByaW1hcnknO1xuICBASW5wdXQoKSBidXR0b25EaXNhYmxlZDogYm9vbGVhbiA9IGZhbHNlO1xuXG5cbiAgLy8gQnV0dG9uIEFjdGlvbnNcbiAgQElucHV0KCkgaHJlZjogc3RyaW5nID0gJyc7XG4gIEBPdXRwdXQoKSBjbGljazogRXZlbnRFbWl0dGVyPHZvaWQ+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gIGJ1dHRvbkRpc3BsYXlDbGFzc2VzOiBzdHJpbmdbXTtcbiAgaWNvbkNvbnRleHQ6IEljb25Db250ZXh0ID0gJ25vbmUnO1xuICB0ZXh0VHJhbnNmb3JtITogVGV4dFRyYW5zZm9ybTtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGNoYW5nZXM6IENoYW5nZURldGVjdG9yUmVmKSB7IH1cblxuICBvbkNsaWNrKCk6IHZvaWQge1xuICAgIGNvbnNvbGUubG9nKCdidXR0b24gd2FzIGNsaWNrZWQnKTtcbiAgICB0aGlzLmNsaWNrLmVtaXQoKTtcbiAgfVxuXG4gIGNyZWF0ZUJ1dHRvbigpOiBVSUJ1dHRvbiB7XG4gICAgcmV0dXJuIDxVSUJ1dHRvbj57XG4gICAgICBidXR0b25UZXh0OiB0aGlzLmJ1dHRvblRleHQsXG4gICAgICBidXR0b25JY29uOiB0aGlzLmJ1dHRvbkljb24sXG4gICAgICBidXR0b25JY29uUGxhY2VtZW50OiB0aGlzLmJ1dHRvbkljb25QbGFjZW1lbnQsXG4gICAgICBidXR0b25UeXBlOiB0aGlzLmJ1dHRvblR5cGUsXG4gICAgICBidXR0b25TaXplOiB0aGlzLmJ1dHRvblNpemUsXG4gICAgICBidXR0b25EaXNhYmxlZDogdGhpcy5idXR0b25EaXNhYmxlZCxcbiAgICAgIGhyZWY6IHRoaXMuaHJlZixcbiAgICAgIHRhcmdldDogJycsXG4gICAgICBidXR0b25EaXNwbGF5Q2xhc3NlczogW1xuICAgICAgYHR5cGUtJHt0aGlzLmJ1dHRvblR5cGV9YCxcbiAgICAgIGBzaXplLSR7dGhpcy5idXR0b25TaXplfWAsXG4gICAgICBgJHt0aGlzLmJ1dHRvbkljb24gPyAnYnV0dG9uLS1oYXMtaWNvbic6ICcnfWAsXG4gICAgICBgJHt0aGlzLmJ1dHRvbkZ1bGxXaWR0aCA/ICdidXR0b24tLWZ1bGwtd2lkdGgnOiAnJ31gLFxuICAgICAgYCR7dGhpcy5idXR0b25UZXh0ICYmIHRoaXMuYnV0dG9uSWNvbiA/ICdidXR0b24tLWljb24tLScrdGhpcy5idXR0b25JY29uUGxhY2VtZW50IDogJyd9YCxcbiAgICAgIGAkeyF0aGlzLmJ1dHRvblRleHQgJiYgdGhpcy5idXR0b25JY29uID8gJ2J1dHRvbi0taWNvbi0tb25seScgOiAnJ31gXG4gICAgICBdLmZpbHRlcigoZCkgPT4gISFkKVxuICAgIH07XG4gIH1cblxuICBuZ09uQ2hhbmdlcygpOiB2b2lkIHtcbiAgICAgIHRoaXMuYnV0dG9uID0gdGhpcy5jcmVhdGVCdXR0b24oKTtcbiAgICAgIGNvbnNvbGUubG9nKHRoaXMuYnV0dG9uKTtcbiAgICAgIHRoaXMuY2hhbmdlcy5tYXJrRm9yQ2hlY2soKTtcbiAgfVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHRoaXMuYnV0dG9uID0gdGhpcy5jcmVhdGVCdXR0b24oKTtcbiAgfVxufVxuIiwiPGJ1dHRvbiAoY2xpY2spPVwib25DbGljaygpXCJcbiAgICAgICAgW3JvdXRlckxpbmtdPVwiYnV0dG9uLmhyZWYgfHwgbnVsbFwiXG4gICAgICAgIFtuZ0NsYXNzXT1cImJ1dHRvbi5idXR0b25EaXNwbGF5Q2xhc3Nlc1wiXG4gICAgICAgIFthdHRyLmRpc2FibGVkXT1cImJ1dHRvbi5idXR0b25EaXNhYmxlZCA9PT0gdHJ1ZSB8fCBudWxsXCJcbiAgICAgICAgcm9sZT1cImJ1dHRvblwiXG4gICAgICAgIFthdHRyLmFyaWEtbGFiZWxdPVwiYnV0dG9uLmJ1dHRvblRleHRcIj5cbiAgICA8ZGl2IGNsYXNzPVwiYnV0dG9uLWNvbnRlbnRcIj5cbiAgICAgICAgPHVpLWljb24gKm5nSWY9XCJidXR0b24uYnV0dG9uSWNvbiAmJiBidXR0b24uYnV0dG9uSWNvblBsYWNlbWVudCAhPT0gJ25vbmUnXCIgW2ljb25OYW1lXT1cImJ1dHRvbi5idXR0b25JY29uXCIgW2ljb25TaXplXT1cImJ1dHRvbi5idXR0b25TaXplXCIgW2ljb25DbGFzc109XCInYnV0dG9uSWNvbidcIiBbaWNvbkNvbnRleHRdPVwiYnV0dG9uLmJ1dHRvbkljb25QbGFjZW1lbnRcIj48L3VpLWljb24+XG4gICAgICAgIDxzcGFuXG4gICAgICAgICAgICBjbGFzcz1cInVpLXRleHRcIlxuICAgICAgICAgICAgKm5nSWY9XCJidXR0b24uYnV0dG9uVGV4dCAmJiBidXR0b24uYnV0dG9uSWNvblBsYWNlbWVudCAhPT0gJ2ljb25Pbmx5J1wiPlxuICAgICAgICAgICAge3tidXR0b24uYnV0dG9uVGV4dH19XG4gICAgICAgIDwvc3Bhbj5cbiAgICA8L2Rpdj5cbiAgICA8ZGl2IGNsYXNzPVwiYnV0dG9uLW92ZXJsYXlcIj48L2Rpdj5cbjwvYnV0dG9uPlxuIl19
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
export {};
|
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvb2FzeXMtbGliL3NyYy9saWIvY29tcG9uZW50cy9idXR0b24vYnV0dG9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBFdmVudEVtaXR0ZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEljb25OYW1lcywgSWNvbkNvbnRleHQgfSBmcm9tICcuLi9pY29uL2ljb24nO1xuXG5cbmV4cG9ydCB0eXBlIFVJQnV0dG9uQm9vbGVhbiA9IHRydWUgfCAndHJ1ZScgfCBmYWxzZSB8ICdmYWxzZSc7XG5cbmV4cG9ydCB0eXBlIFVJQnV0dG9uU2l6ZSA9ICdzbWFsbCcgfCAnbGFyZ2UnO1xuXG5leHBvcnQgdHlwZSBVSUJ1dHRvblR5cGUgPVxuICB8ICdwcmltYXJ5J1xuICB8ICdzZWNvbmRhcnknXG4gIHwgJ3RlcnRpYXJ5J1xuICB8ICdwcmltYXJ5LWludmVyc2UnXG4gIHwgJ3NlY29uZGFyeS1pbnZlcnNlJ1xuICB8ICd0ZXJ0aWFyeS1pbnZlcnNlJ1xuICB8ICdleHByZXNzaXZlJ1xuICB8ICdkYW5nZXInXG4gIHwgJ2ZhY2Vib29rJ1xuICB8ICdwYXlwYWwnXG4gIHwgJ3RydXN0cGlsb3QnO1xuXG5leHBvcnQgaW50ZXJmYWNlIFVJQnV0dG9uIHtcblxuICAvLyBJbnB1dHNcblxuICAvLyBEaXNwbGF5IHRleHQgLSBSZXF1aXJlZCBldmVuIGlmIGljb24gb25seVxuICBidXR0b25UZXh0OiBzdHJpbmc7XG4gIC8vIGljb24gbmFtZVxuICBidXR0b25JY29uOiBJY29uTmFtZXM7XG4gIC8vIGNvbG9yL3N0eWxpbmcgb2YgYnV0dG9uXG4gIGJ1dHRvblR5cGU6IFVJQnV0dG9uVHlwZTtcbiAgLy8gcG9zaXRpb25pbmcgZm9yIGljb25cbiAgYnV0dG9uSWNvblBsYWNlbWVudDogSWNvbkNvbnRleHRcbiAgLy8gYnV0dG9uIHNpemVcbiAgYnV0dG9uU2l6ZTogVUlCdXR0b25TaXplO1xuICAvLyBGdWxsIHdpZHRoXG4gIGJ1dHRvbkZ1bGxXaWR0aDogVUlCdXR0b25Cb29sZWFuO1xuICAvLyBGb3IgbGlua3MsIGV4cGVjdHMgcmVsYXRpdmUgb3IgYWJzb2x1dGUgdXJsXG4gIGhyZWY6IHN0cmluZztcbiAgdGFyZ2V0OiBzdHJpbmc7XG4gIGJ1dHRvbkRpc2FibGVkOiBVSUJ1dHRvbkJvb2xlYW47XG5cbiAgLy8gUHJpdmF0ZSBwcm9wZXJ0aWVzXG4gIGJ1dHRvbkRpc3BsYXlDbGFzc2VzOiBzdHJpbmdbXTtcblxuICAvLyBPdXRwdXRzXG5cbiAgLy8gQ2xpY2sgZXZlbnQsIHVzZWQgd2hlbiBubyBocmVmIGlucHV0XG4gIGJ1dHRvbkRpZENsaWNrOiBFdmVudEVtaXR0ZXI8YW55Pjtcbn1cbiJdfQ==
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { Component, Input, ViewEncapsulation, ChangeDetectionStrategy, ElementRef } from '@angular/core';
|
|
2
|
+
import { TokenService } from '../../services/token.service';
|
|
3
|
+
import { WindowService } from '../../services/window.service';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
import * as i1 from "../../services/token.service";
|
|
6
|
+
import * as i2 from "../../services/window.service";
|
|
7
|
+
import * as i3 from "@angular/common";
|
|
8
|
+
export class IconComponent {
|
|
9
|
+
constructor(tokenService, windowRef, elementRef) {
|
|
10
|
+
this.tokenService = tokenService;
|
|
11
|
+
this.windowRef = windowRef;
|
|
12
|
+
this.elementRef = elementRef;
|
|
13
|
+
this.iconSize = 'large';
|
|
14
|
+
this.iconContext = 'none';
|
|
15
|
+
}
|
|
16
|
+
convertRemToPixels(remString) {
|
|
17
|
+
const remNumber = parseFloat(remString.replace('rem', ''));
|
|
18
|
+
return remNumber * parseFloat(getComputedStyle(this.windowRef.nativeWindow.document.documentElement).fontSize);
|
|
19
|
+
}
|
|
20
|
+
ngOnChanges() {
|
|
21
|
+
this.ngOnInit();
|
|
22
|
+
}
|
|
23
|
+
ngOnInit() {
|
|
24
|
+
this.iconBrandPath = `${this.tokenService.getBrandName(`--icon-component-brand`, this.elementRef.nativeElement)}`;
|
|
25
|
+
this.size = this.tokenService.getTokenValue(`--global-size-icon-${this.iconSize}`);
|
|
26
|
+
this.iconDisplayClasses = [
|
|
27
|
+
`icon-context-${this.iconContext}`,
|
|
28
|
+
`icon-size-${this.iconSize}`
|
|
29
|
+
];
|
|
30
|
+
const sizeInPixels = this.convertRemToPixels(this.size);
|
|
31
|
+
this.iconWidth = sizeInPixels;
|
|
32
|
+
this.iconHeight = sizeInPixels;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: IconComponent, deps: [{ token: i1.TokenService }, { token: i2.WindowService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
36
|
+
IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: IconComponent, selector: "ui-icon", inputs: { iconSize: "iconSize", iconName: "iconName", iconContext: "iconContext", iconWidth: "iconWidth", iconHeight: "iconHeight", iconClass: "iconClass" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"ui-icon\" [ngClass]=\"iconDisplayClasses\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" attr.width=\"{{iconWidth}}px\" attr.height=\"{{iconHeight}}px\" attr.class=\"{{iconClass}}\">\n <use attr.xlink:href=\"./{{iconBrandPath}}/assets/icons/icons.svg#icon-{{iconName}}-24\"></use>\n </svg>\n</div>\n", styles: ["ui-icon{--icon-component-brand: var(--utility-brand-name)}.ui-icon{display:inline-flex}.ui-icon.icon-size-large.icon-context-leading{margin-left:calc(var(--component-size-button-large-icon-offset-leading) * -1)}.ui-icon.icon-size-large.icon-context-trailing{margin-right:calc(var(--component-size-button-large-icon-offset-trailing) * -1)}.ui-icon.icon-size-large.icon-context-iconOnly{margin-left:calc(var(--component-size-button-large-icon-offset-icon-only) * -1);margin-right:calc(var(--component-size-button-large-icon-offset-icon-only) * -1)}.ui-icon.icon-size-small.icon-context-leading{margin-left:calc(var(--component-size-button-small-icon-offset-leading) * -1)}.ui-icon.icon-size-small.icon-context-trailing{margin-right:calc(var(--component-size-button-small-icon-offset-trailing) * -1)}.ui-icon.icon-size-small.icon-context-iconOnly{margin-left:calc(var(--component-size-button-small-icon-offset-icon-only) * -1);margin-right:calc(var(--component-size-button-small-icon-offset-icon-only) * -1)}\n"], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
37
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: IconComponent, decorators: [{
|
|
38
|
+
type: Component,
|
|
39
|
+
args: [{
|
|
40
|
+
selector: 'ui-icon',
|
|
41
|
+
templateUrl: './icon.component.html',
|
|
42
|
+
styleUrls: ['./icon.component.scss'],
|
|
43
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
44
|
+
encapsulation: ViewEncapsulation.None
|
|
45
|
+
}]
|
|
46
|
+
}], ctorParameters: function () { return [{ type: i1.TokenService }, { type: i2.WindowService }, { type: i0.ElementRef }]; }, propDecorators: { iconSize: [{
|
|
47
|
+
type: Input
|
|
48
|
+
}], iconName: [{
|
|
49
|
+
type: Input
|
|
50
|
+
}], iconContext: [{
|
|
51
|
+
type: Input
|
|
52
|
+
}], iconWidth: [{
|
|
53
|
+
type: Input
|
|
54
|
+
}], iconHeight: [{
|
|
55
|
+
type: Input
|
|
56
|
+
}], iconClass: [{
|
|
57
|
+
type: Input
|
|
58
|
+
}] } });
|
|
59
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9vYXN5cy1saWIvc3JjL2xpYi9jb21wb25lbnRzL2ljb24vaWNvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9vYXN5cy1saWIvc3JjL2xpYi9jb21wb25lbnRzL2ljb24vaWNvbi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBVSxpQkFBaUIsRUFBRSx1QkFBdUIsRUFBYSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDNUgsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLDhCQUE4QixDQUFDO0FBQzVELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQzs7Ozs7QUFTOUQsTUFBTSxPQUFPLGFBQWE7SUFheEIsWUFBb0IsWUFBMEIsRUFBVSxTQUF3QixFQUFVLFVBQXNCO1FBQTVGLGlCQUFZLEdBQVosWUFBWSxDQUFjO1FBQVUsY0FBUyxHQUFULFNBQVMsQ0FBZTtRQUFVLGVBQVUsR0FBVixVQUFVLENBQVk7UUFadkcsYUFBUSxHQUFvQixPQUFPLENBQUM7UUFFcEMsZ0JBQVcsR0FBZ0IsTUFBTSxDQUFDO0lBVXlFLENBQUM7SUFFckgsa0JBQWtCLENBQUMsU0FBaUI7UUFDbEMsTUFBTSxTQUFTLEdBQUcsVUFBVSxDQUFDLFNBQVMsQ0FBQyxPQUFPLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxDQUFDLENBQUM7UUFDM0QsT0FBTyxTQUFTLEdBQUcsVUFBVSxDQUFDLGdCQUFnQixDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsWUFBWSxDQUFDLFFBQVEsQ0FBQyxlQUFlLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQztJQUNqSCxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNsQixDQUFDO0lBRUQsUUFBUTtRQUNOLElBQUksQ0FBQyxhQUFhLEdBQUcsR0FBRyxJQUFJLENBQUMsWUFBWSxDQUFDLFlBQVksQ0FBQyx3QkFBd0IsRUFBRSxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxFQUFFLENBQUE7UUFDakgsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsWUFBWSxDQUFDLGFBQWEsQ0FBQyxzQkFBc0IsSUFBSSxDQUFDLFFBQVEsRUFBRSxDQUFDLENBQUM7UUFFbkYsSUFBSSxDQUFDLGtCQUFrQixHQUFHO1lBQ3hCLGdCQUFnQixJQUFJLENBQUMsV0FBVyxFQUFFO1lBQ2xDLGFBQWEsSUFBSSxDQUFDLFFBQVEsRUFBRTtTQUM3QixDQUFDO1FBRUYsTUFBTSxZQUFZLEdBQUcsSUFBSSxDQUFDLGtCQUFrQixDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUN4RCxJQUFJLENBQUMsU0FBUyxHQUFHLFlBQVksQ0FBQztRQUM5QixJQUFJLENBQUMsVUFBVSxHQUFHLFlBQVksQ0FBQztJQUNqQyxDQUFDOzsyR0FwQ1UsYUFBYTsrRkFBYixhQUFhLGtPQ1gxQiw4VEFLQTs0RkRNYSxhQUFhO2tCQVB6QixTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBQyxTQUFTO29CQUNsQixXQUFXLEVBQUUsdUJBQXVCO29CQUNwQyxTQUFTLEVBQUUsQ0FBQyx1QkFBdUIsQ0FBQztvQkFDcEMsZUFBZSxFQUFFLHVCQUF1QixDQUFDLE1BQU07b0JBQy9DLGFBQWEsRUFBRSxpQkFBaUIsQ0FBQyxJQUFJO2lCQUN0Qzt3SkFFVSxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFFRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csU0FBUztzQkFBakIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uSW5pdCwgVmlld0VuY2Fwc3VsYXRpb24sIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBPbkNoYW5nZXMsIEVsZW1lbnRSZWYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFRva2VuU2VydmljZSB9IGZyb20gJy4uLy4uL3NlcnZpY2VzL3Rva2VuLnNlcnZpY2UnO1xuaW1wb3J0IHsgV2luZG93U2VydmljZSB9IGZyb20gJy4uLy4uL3NlcnZpY2VzL3dpbmRvdy5zZXJ2aWNlJztcbmltcG9ydCB7IEljb25OYW1lcywgSWNvbkNvbnRleHQgfSBmcm9tICcuL2ljb24nO1xuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOid1aS1pY29uJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2ljb24uY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9pY29uLmNvbXBvbmVudC5zY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lXG59KVxuZXhwb3J0IGNsYXNzIEljb25Db21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcyB7XG4gIEBJbnB1dCgpIGljb25TaXplOiAnc21hbGwnfCdsYXJnZScgPSAnbGFyZ2UnO1xuICBASW5wdXQoKSBpY29uTmFtZSE6IEljb25OYW1lcztcbiAgQElucHV0KCkgaWNvbkNvbnRleHQ6IEljb25Db250ZXh0ID0gJ25vbmUnO1xuXG4gIEBJbnB1dCgpIGljb25XaWR0aD86IG51bWJlcjtcbiAgQElucHV0KCkgaWNvbkhlaWdodD86IG51bWJlcjtcbiAgQElucHV0KCkgaWNvbkNsYXNzPzogc3RyaW5nO1xuXG4gIHNpemU/OiBzdHJpbmc7XG4gIGljb25CcmFuZFBhdGg/OiBzdHJpbmc7XG4gIGljb25EaXNwbGF5Q2xhc3Nlczogc3RyaW5nW107XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSB0b2tlblNlcnZpY2U6IFRva2VuU2VydmljZSwgcHJpdmF0ZSB3aW5kb3dSZWY6IFdpbmRvd1NlcnZpY2UsIHByaXZhdGUgZWxlbWVudFJlZjogRWxlbWVudFJlZikgeyB9XG5cbiAgY29udmVydFJlbVRvUGl4ZWxzKHJlbVN0cmluZzogc3RyaW5nKTogbnVtYmVyIHtcbiAgICBjb25zdCByZW1OdW1iZXIgPSBwYXJzZUZsb2F0KHJlbVN0cmluZy5yZXBsYWNlKCdyZW0nLCAnJykpO1xuICAgIHJldHVybiByZW1OdW1iZXIgKiBwYXJzZUZsb2F0KGdldENvbXB1dGVkU3R5bGUodGhpcy53aW5kb3dSZWYubmF0aXZlV2luZG93LmRvY3VtZW50LmRvY3VtZW50RWxlbWVudCkuZm9udFNpemUpO1xuICB9XG5cbiAgbmdPbkNoYW5nZXMoKTogdm9pZCB7XG4gICAgdGhpcy5uZ09uSW5pdCgpO1xuICB9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy5pY29uQnJhbmRQYXRoID0gYCR7dGhpcy50b2tlblNlcnZpY2UuZ2V0QnJhbmROYW1lKGAtLWljb24tY29tcG9uZW50LWJyYW5kYCwgdGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQpfWBcbiAgICB0aGlzLnNpemUgPSB0aGlzLnRva2VuU2VydmljZS5nZXRUb2tlblZhbHVlKGAtLWdsb2JhbC1zaXplLWljb24tJHt0aGlzLmljb25TaXplfWApO1xuXG4gICAgdGhpcy5pY29uRGlzcGxheUNsYXNzZXMgPSBbXG4gICAgICBgaWNvbi1jb250ZXh0LSR7dGhpcy5pY29uQ29udGV4dH1gLFxuICAgICAgYGljb24tc2l6ZS0ke3RoaXMuaWNvblNpemV9YFxuICAgIF07XG5cbiAgICBjb25zdCBzaXplSW5QaXhlbHMgPSB0aGlzLmNvbnZlcnRSZW1Ub1BpeGVscyh0aGlzLnNpemUpO1xuICAgIHRoaXMuaWNvbldpZHRoID0gc2l6ZUluUGl4ZWxzO1xuICAgIHRoaXMuaWNvbkhlaWdodCA9IHNpemVJblBpeGVscztcbiAgfVxuXG59XG4iLCI8ZGl2IGNsYXNzPVwidWktaWNvblwiIFtuZ0NsYXNzXT1cImljb25EaXNwbGF5Q2xhc3Nlc1wiPlxuICA8c3ZnIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIiBhdHRyLndpZHRoPVwie3tpY29uV2lkdGh9fXB4XCIgYXR0ci5oZWlnaHQ9XCJ7e2ljb25IZWlnaHR9fXB4XCIgYXR0ci5jbGFzcz1cInt7aWNvbkNsYXNzfX1cIj5cbiAgICA8dXNlIGF0dHIueGxpbms6aHJlZj1cIi4ve3tpY29uQnJhbmRQYXRofX0vYXNzZXRzL2ljb25zL2ljb25zLnN2ZyNpY29uLXt7aWNvbk5hbWV9fS0yNFwiPjwvdXNlPlxuICA8L3N2Zz5cbjwvZGl2PlxuIl19
|
|
File without changes
|