@iamgld/ui 1.9.0 → 1.9.1
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/fesm2022/iamgld-ui.mjs +2 -2
- package/package.json +1 -1
package/fesm2022/iamgld-ui.mjs
CHANGED
|
@@ -412,11 +412,11 @@ class IconButtonComponent {
|
|
|
412
412
|
this.emitClick();
|
|
413
413
|
}
|
|
414
414
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
415
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.1", type: IconButtonComponent, isStandalone: true, selector: "gld-icon-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\r\n id=\"{{ name() }}\"\r\n attr.aria-label=\"{{ name() }}\"\r\n class=\"button button--{{ color() }}\"\r\n [class.button--disabled]=\"disabled()\"\r\n [class.button--background]=\"background()\"\r\n (click)=\"emitClick()\"\r\n (keyup.enter)=\"keyup()\">\r\n <gld-icon\r\n [icon]=\"icon()\"\r\n [size]=\"iconSize()\"\r\n [space]=\"space()\"\r\n [moveTopToBottom]=\"moveTopToBottom()\"\r\n [moveLeftToRight]=\"moveLeftToRight()\"\r\n [disabled]=\"disabled()\" />\r\n</button>\r\n", styles: [".button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-radius: var(--gld-radius--xxxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:none;padding:var(--gld-spacing--xxxs);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);-webkit-user-select:none;user-select:none;will-change:background,color;transition:background var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{background:var(--gld-background--hover)}.button--pink{--gld-color: var(--gld-pink)}.button--pink.
|
|
415
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.1", type: IconButtonComponent, isStandalone: true, selector: "gld-icon-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, moveTopToBottom: { classPropertyName: "moveTopToBottom", publicName: "moveTopToBottom", isSignal: true, isRequired: false, transformFunction: null }, moveLeftToRight: { classPropertyName: "moveLeftToRight", publicName: "moveLeftToRight", isSignal: true, isRequired: false, transformFunction: null }, background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<button\r\n id=\"{{ name() }}\"\r\n attr.aria-label=\"{{ name() }}\"\r\n class=\"button button--{{ color() }}\"\r\n [class.button--disabled]=\"disabled()\"\r\n [class.button--background]=\"background()\"\r\n (click)=\"emitClick()\"\r\n (keyup.enter)=\"keyup()\">\r\n <gld-icon\r\n [icon]=\"icon()\"\r\n [size]=\"iconSize()\"\r\n [space]=\"space()\"\r\n [moveTopToBottom]=\"moveTopToBottom()\"\r\n [moveLeftToRight]=\"moveLeftToRight()\"\r\n [disabled]=\"disabled()\" />\r\n</button>\r\n", styles: [".button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-radius: var(--gld-radius--xxxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:none;padding:var(--gld-spacing--xxxs);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);-webkit-user-select:none;user-select:none;will-change:background,color;transition:background var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{background:var(--gld-background--hover)}.button--pink{--gld-color: var(--gld-pink)}.button--pink.button--background{--gld-background: var(--gld-pink-transparent--010);--gld-background--hover: var(--gld-pink-transparent--020)}.button--purple{--gld-color: var(--gld-purple)}.button--purple.button--background{--gld-background: var(--gld-purple-transparent--010);--gld-background--hover: var(--gld-purple-transparent--020)}.button--mustard{--gld-color: var(--gld-mustard)}.button--mustard.button--background{--gld-background: var(--gld-mustard-transparent--010);--gld-background--hover: var(--gld-mustard-transparent--020)}.button--orange{--gld-color: var(--gld-orange)}.button--orange.button--background{--gld-background: var(--gld-orange-transparent--010);--gld-background--hover: var(--gld-orange-transparent--020)}.button--blue{--gld-color: var(--gld-blue)}.button--blue.button--background{--gld-background: var(--gld-blue-transparent--010);--gld-background--hover: var(--gld-blue-transparent--020)}.button--red{--gld-color: var(--gld-red)}.button--red.button--background{--gld-background: var(--gld-red-transparent--010);--gld-background--hover: var(--gld-red-transparent--020)}.button--green{--gld-color: var(--gld-green)}.button--green.button--background{--gld-background: var(--gld-green-transparent--010);--gld-background--hover: var(--gld-green-transparent--020)}.button--disabled{--gld-color: var(--gld-gray-transparent--060);pointer-events:none;cursor:not-allowed}.button--disabled.button--background{--gld-background: var(--gld-gray-transparent--010);--gld-background--hover: var(--gld-gray-transparent--020)}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "gld-icon", inputs: ["icon", "size", "space", "moveTopToBottom", "moveLeftToRight", "disabled"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
416
416
|
}
|
|
417
417
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: IconButtonComponent, decorators: [{
|
|
418
418
|
type: Component,
|
|
419
|
-
args: [{ selector: 'gld-icon-button', imports: [IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\r\n id=\"{{ name() }}\"\r\n attr.aria-label=\"{{ name() }}\"\r\n class=\"button button--{{ color() }}\"\r\n [class.button--disabled]=\"disabled()\"\r\n [class.button--background]=\"background()\"\r\n (click)=\"emitClick()\"\r\n (keyup.enter)=\"keyup()\">\r\n <gld-icon\r\n [icon]=\"icon()\"\r\n [size]=\"iconSize()\"\r\n [space]=\"space()\"\r\n [moveTopToBottom]=\"moveTopToBottom()\"\r\n [moveLeftToRight]=\"moveLeftToRight()\"\r\n [disabled]=\"disabled()\" />\r\n</button>\r\n", styles: [".button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-radius: var(--gld-radius--xxxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:none;padding:var(--gld-spacing--xxxs);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);-webkit-user-select:none;user-select:none;will-change:background,color;transition:background var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{background:var(--gld-background--hover)}.button--pink{--gld-color: var(--gld-pink)}.button--pink.
|
|
419
|
+
args: [{ selector: 'gld-icon-button', imports: [IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\r\n id=\"{{ name() }}\"\r\n attr.aria-label=\"{{ name() }}\"\r\n class=\"button button--{{ color() }}\"\r\n [class.button--disabled]=\"disabled()\"\r\n [class.button--background]=\"background()\"\r\n (click)=\"emitClick()\"\r\n (keyup.enter)=\"keyup()\">\r\n <gld-icon\r\n [icon]=\"icon()\"\r\n [size]=\"iconSize()\"\r\n [space]=\"space()\"\r\n [moveTopToBottom]=\"moveTopToBottom()\"\r\n [moveLeftToRight]=\"moveLeftToRight()\"\r\n [disabled]=\"disabled()\" />\r\n</button>\r\n", styles: [".button{--gld-color: inherit;--gld-background: transparent;--gld-background--hover: transparent;--gld-radius: var(--gld-radius--xxxs);--gld-font-size: var(--gld-font-size--normal);outline:none;border:none;padding:var(--gld-spacing--xxxs);border-radius:var(--gld-radius);font-family:var(--gld-font--poppins);font-size:var(--gld-font-size);font-weight:600;line-height:1.25;cursor:pointer;width:inherit;color:var(--gld-color);background:var(--gld-background);display:inline-flex;align-items:center;justify-content:center;gap:var(--gld-spacing--xxxs);-webkit-user-select:none;user-select:none;will-change:background,color;transition:background var(--gld-animation-time--150),color var(--gld-animation-time--150)}.button:hover,.button:focus{background:var(--gld-background--hover)}.button--pink{--gld-color: var(--gld-pink)}.button--pink.button--background{--gld-background: var(--gld-pink-transparent--010);--gld-background--hover: var(--gld-pink-transparent--020)}.button--purple{--gld-color: var(--gld-purple)}.button--purple.button--background{--gld-background: var(--gld-purple-transparent--010);--gld-background--hover: var(--gld-purple-transparent--020)}.button--mustard{--gld-color: var(--gld-mustard)}.button--mustard.button--background{--gld-background: var(--gld-mustard-transparent--010);--gld-background--hover: var(--gld-mustard-transparent--020)}.button--orange{--gld-color: var(--gld-orange)}.button--orange.button--background{--gld-background: var(--gld-orange-transparent--010);--gld-background--hover: var(--gld-orange-transparent--020)}.button--blue{--gld-color: var(--gld-blue)}.button--blue.button--background{--gld-background: var(--gld-blue-transparent--010);--gld-background--hover: var(--gld-blue-transparent--020)}.button--red{--gld-color: var(--gld-red)}.button--red.button--background{--gld-background: var(--gld-red-transparent--010);--gld-background--hover: var(--gld-red-transparent--020)}.button--green{--gld-color: var(--gld-green)}.button--green.button--background{--gld-background: var(--gld-green-transparent--010);--gld-background--hover: var(--gld-green-transparent--020)}.button--disabled{--gld-color: var(--gld-gray-transparent--060);pointer-events:none;cursor:not-allowed}.button--disabled.button--background{--gld-background: var(--gld-gray-transparent--010);--gld-background--hover: var(--gld-gray-transparent--020)}\n"] }]
|
|
420
420
|
}] });
|
|
421
421
|
|
|
422
422
|
// Angular Imports
|