zyra-ng-ui 1.0.2

package/README.md

@@ -0,0 +1,64 @@
+# ZyraUiLib
+
+This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 20.3.0.
+
+## Code scaffolding
+
+Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
+
+```bash
+ng generate component component-name
+```
+
+For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
+
+```bash
+ng generate --help
+```
+
+## Building
+
+To build the library, run:
+
+```bash
+ng build zyra-ui-lib
+```
+
+This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
+
+### Publishing the Library
+
+Once the project is built, you can publish your library by following these steps:
+
+1. Navigate to the `dist` directory:
+
+    ```bash
+    cd dist/zyra-ui-lib
+    ```
+
+2. Run the `npm publish` command to publish your library to the npm registry:
+    ```bash
+    npm publish
+    ```
+
+## Running unit tests
+
+To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
+
+```bash
+ng test
+```
+
+## Running end-to-end tests
+
+For end-to-end (e2e) testing, run:
+
+```bash
+ng e2e
+```
+
+Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
+
+## Additional Resources
+
+For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.

package/fesm2022/zyra-ng-ui.mjs

@@ -0,0 +1,37 @@
+import * as i0 from '@angular/core';
+import { Input, Component } from '@angular/core';
+
+class Button {
+    variant = 'primary';
+    size = 'md';
+    disabled = false;
+    type = 'button';
+    ngOnChanges() {
+        console.log(this.variant);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: Button, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: Button, isStandalone: true, selector: "zyra-button", inputs: { variant: "variant", size: "size", disabled: "disabled", type: "type" }, usesOnChanges: true, ngImport: i0, template: "<button [attr.type]=\"type\" [disabled]=\"disabled\" class=\"zyra-btn\" [class.zyra-btn--gradient]=\"variant === 'gradient'\" [class.zyra-btn--primary]=\"variant === 'primary'\"\r\n\t[class.zyra-btn--secondary]=\"variant === 'secondary'\" [class.zyra-btn--accent]=\"variant === 'accent'\"\r\n\t[class.zyra-btn--success]=\"variant === 'success'\" [class.zyra-btn--danger]=\"variant === 'danger'\"\r\n\t[class.zyra-btn--sm]=\"size === 'sm'\" [class.zyra-btn--md]=\"size === 'md'\" [class.zyra-btn--lg]=\"size === 'lg'\">\r\n\t<ng-content></ng-content>\r\n</button>\r\n\r\n", styles: [".zyra-btn{transition:background .2s ease,border .2s ease;padding:var(--zyra-spacing-1) var(--zyra-spacing-3);border-radius:var(--zyra-radius-md);font-weight:var(--zyra-font-weight-medium);font-size:.875rem;border:none;cursor:pointer;margin:8px;background:var(--btn-bg);color:var(--zyra-foreground)}.zyra-btn:disabled{opacity:.6;cursor:not-allowed;background-color:var(--zyra-muted)}.zyra-btn:disabled :hover{background-color:var(--zyra-muted)}.zyra-btn--sm{height:32px;padding:0 12px;font-size:13px}.zyra-btn--md{height:40px;padding:0 16px;font-size:14px}.zyra-btn--lg{height:48px;padding:0 20px;font-size:15px}.zyra-btn--primary{--btn-bg: var(--zyra-primary)}.zyra-btn--primary:hover{--btn-bg: var(--zyra-primary-hover)}.zyra-btn--secondary{--btn-bg: var(--zyra-secondary)}.zyra-btn--secondary:hover{--btn-bg: var(--zyra-secondary-hover)}.zyra-btn--accent{--btn-bg: var(--zyra-accent)}.zyra-btn--accent:hover{--btn-bg: var(--zyra-accent-hover)}.zyra-btn--success{--btn-bg: var(--zyra-success)}.zyra-btn--success:hover{--btn-bg: var(--zyra-success-hover)}.zyra-btn--danger{--btn-bg: var(--zyra-error)}.zyra-btn--danger:hover{--btn-bg: var(--zyra-error-hover)}.zyra-btn--gradient{--btn-bg: var(--zyra-gradient-btn)}.zyra-btn--gradient:hover{--btn-bg: var(--zyra-gradient-btn-hover)}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: Button, decorators: [{
+            type: Component,
+            args: [{ selector: 'zyra-button', imports: [], standalone: true, template: "<button [attr.type]=\"type\" [disabled]=\"disabled\" class=\"zyra-btn\" [class.zyra-btn--gradient]=\"variant === 'gradient'\" [class.zyra-btn--primary]=\"variant === 'primary'\"\r\n\t[class.zyra-btn--secondary]=\"variant === 'secondary'\" [class.zyra-btn--accent]=\"variant === 'accent'\"\r\n\t[class.zyra-btn--success]=\"variant === 'success'\" [class.zyra-btn--danger]=\"variant === 'danger'\"\r\n\t[class.zyra-btn--sm]=\"size === 'sm'\" [class.zyra-btn--md]=\"size === 'md'\" [class.zyra-btn--lg]=\"size === 'lg'\">\r\n\t<ng-content></ng-content>\r\n</button>\r\n\r\n", styles: [".zyra-btn{transition:background .2s ease,border .2s ease;padding:var(--zyra-spacing-1) var(--zyra-spacing-3);border-radius:var(--zyra-radius-md);font-weight:var(--zyra-font-weight-medium);font-size:.875rem;border:none;cursor:pointer;margin:8px;background:var(--btn-bg);color:var(--zyra-foreground)}.zyra-btn:disabled{opacity:.6;cursor:not-allowed;background-color:var(--zyra-muted)}.zyra-btn:disabled :hover{background-color:var(--zyra-muted)}.zyra-btn--sm{height:32px;padding:0 12px;font-size:13px}.zyra-btn--md{height:40px;padding:0 16px;font-size:14px}.zyra-btn--lg{height:48px;padding:0 20px;font-size:15px}.zyra-btn--primary{--btn-bg: var(--zyra-primary)}.zyra-btn--primary:hover{--btn-bg: var(--zyra-primary-hover)}.zyra-btn--secondary{--btn-bg: var(--zyra-secondary)}.zyra-btn--secondary:hover{--btn-bg: var(--zyra-secondary-hover)}.zyra-btn--accent{--btn-bg: var(--zyra-accent)}.zyra-btn--accent:hover{--btn-bg: var(--zyra-accent-hover)}.zyra-btn--success{--btn-bg: var(--zyra-success)}.zyra-btn--success:hover{--btn-bg: var(--zyra-success-hover)}.zyra-btn--danger{--btn-bg: var(--zyra-error)}.zyra-btn--danger:hover{--btn-bg: var(--zyra-error-hover)}.zyra-btn--gradient{--btn-bg: var(--zyra-gradient-btn)}.zyra-btn--gradient:hover{--btn-bg: var(--zyra-gradient-btn-hover)}\n"] }]
+        }], propDecorators: { variant: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }] } });
+
+/*
+ * Public API Surface of zyra-ui-lib
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Button };
+//# sourceMappingURL=zyra-ng-ui.mjs.map

package/fesm2022/zyra-ng-ui.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"zyra-ng-ui.mjs","sources":["../../../projects/zyra-ui-lib/src/lib/button/button.ts","../../../projects/zyra-ui-lib/src/lib/button/button.html","../../../projects/zyra-ui-lib/src/public-api.ts","../../../projects/zyra-ui-lib/src/zyra-ng-ui.ts"],"sourcesContent":["import { Component, Input } from '@angular/core';\r\n\r\n@Component({\r\n\tselector: 'zyra-button',\r\n\timports: [],\r\n\tstandalone: true,\r\n\ttemplateUrl: './button.html',\r\n\tstyleUrl: './button.css',\r\n})\r\nexport class Button {\r\n\t@Input() variant: 'gradient' | 'primary' | 'secondary' | 'accent' | 'success' | 'danger' = 'primary';\r\n\t@Input() size: 'sm' | 'md' | 'lg' = 'md';\r\n\t@Input() disabled = false;\r\n\t@Input() type: 'button' | 'submit' | 'reset' = 'button';\r\n\r\n\tngOnChanges() {\r\n\t\tconsole.log(this.variant);\r\n\t}\r\n}\r\n","<button [attr.type]=\"type\" [disabled]=\"disabled\" class=\"zyra-btn\" [class.zyra-btn--gradient]=\"variant === 'gradient'\" [class.zyra-btn--primary]=\"variant === 'primary'\"\r\n\t[class.zyra-btn--secondary]=\"variant === 'secondary'\" [class.zyra-btn--accent]=\"variant === 'accent'\"\r\n\t[class.zyra-btn--success]=\"variant === 'success'\" [class.zyra-btn--danger]=\"variant === 'danger'\"\r\n\t[class.zyra-btn--sm]=\"size === 'sm'\" [class.zyra-btn--md]=\"size === 'md'\" [class.zyra-btn--lg]=\"size === 'lg'\">\r\n\t<ng-content></ng-content>\r\n</button>\r\n\r\n","/*\r\n * Public API Surface of zyra-ui-lib\r\n */\r\n\r\nexport * from './lib/button/button';","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MASa,MAAM,CAAA;IACT,OAAO,GAA2E,SAAS;IAC3F,IAAI,GAAuB,IAAI;IAC/B,QAAQ,GAAG,KAAK;IAChB,IAAI,GAAkC,QAAQ;IAEvD,WAAW,GAAA;AACV,QAAA,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;IAC1B;uGARY,MAAM,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAN,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAM,8KCTnB,4jBAOA,EAAA,MAAA,EAAA,CAAA,qwCAAA,CAAA,EAAA,CAAA;;2FDEa,MAAM,EAAA,UAAA,EAAA,CAAA;kBAPlB,SAAS;+BACC,aAAa,EAAA,OAAA,EACd,EAAE,EAAA,UAAA,EACC,IAAI,EAAA,QAAA,EAAA,4jBAAA,EAAA,MAAA,EAAA,CAAA,qwCAAA,CAAA,EAAA;;sBAKf;;sBACA;;sBACA;;sBACA;;;AEbF;;AAEG;;ACFH;;AAEG;;;;"}

package/fesm2022/zyra-ui.mjs

@@ -0,0 +1,37 @@
+import * as i0 from '@angular/core';
+import { Input, Component } from '@angular/core';
+
+class Button {
+    variant = 'primary';
+    size = 'md';
+    disabled = false;
+    type = 'button';
+    ngOnChanges() {
+        console.log(this.variant);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: Button, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: Button, isStandalone: true, selector: "zyra-button", inputs: { variant: "variant", size: "size", disabled: "disabled", type: "type" }, usesOnChanges: true, ngImport: i0, template: "<button [attr.type]=\"type\" [disabled]=\"disabled\" class=\"zyra-btn\" [class.zyra-btn--gradient]=\"variant === 'gradient'\" [class.zyra-btn--primary]=\"variant === 'primary'\"\r\n\t[class.zyra-btn--secondary]=\"variant === 'secondary'\" [class.zyra-btn--accent]=\"variant === 'accent'\"\r\n\t[class.zyra-btn--success]=\"variant === 'success'\" [class.zyra-btn--danger]=\"variant === 'danger'\"\r\n\t[class.zyra-btn--sm]=\"size === 'sm'\" [class.zyra-btn--md]=\"size === 'md'\" [class.zyra-btn--lg]=\"size === 'lg'\">\r\n\t<ng-content></ng-content>\r\n</button>\r\n\r\n", styles: [".zyra-btn{transition:background .2s ease,border .2s ease;padding:var(--zyra-spacing-1) var(--zyra-spacing-3);border-radius:var(--zyra-radius-md);font-weight:var(--zyra-font-weight-medium);font-size:.875rem;border:none;cursor:pointer;margin:8px;background:var(--btn-bg);color:var(--zyra-foreground)}.zyra-btn:disabled{opacity:.6;cursor:not-allowed;background-color:var(--zyra-muted)}.zyra-btn:disabled :hover{background-color:var(--zyra-muted)}.zyra-btn--sm{height:32px;padding:0 12px;font-size:13px}.zyra-btn--md{height:40px;padding:0 16px;font-size:14px}.zyra-btn--lg{height:48px;padding:0 20px;font-size:15px}.zyra-btn--primary{--btn-bg: var(--zyra-primary)}.zyra-btn--primary:hover{--btn-bg: var(--zyra-primary-hover)}.zyra-btn--secondary{--btn-bg: var(--zyra-secondary)}.zyra-btn--secondary:hover{--btn-bg: var(--zyra-secondary-hover)}.zyra-btn--accent{--btn-bg: var(--zyra-accent)}.zyra-btn--accent:hover{--btn-bg: var(--zyra-accent-hover)}.zyra-btn--success{--btn-bg: var(--zyra-success)}.zyra-btn--success:hover{--btn-bg: var(--zyra-success-hover)}.zyra-btn--danger{--btn-bg: var(--zyra-error)}.zyra-btn--danger:hover{--btn-bg: var(--zyra-error-hover)}.zyra-btn--gradient{--btn-bg: var(--zyra-gradient-btn)}.zyra-btn--gradient:hover{--btn-bg: var(--zyra-gradient-btn-hover)}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: Button, decorators: [{
+            type: Component,
+            args: [{ selector: 'zyra-button', imports: [], standalone: true, template: "<button [attr.type]=\"type\" [disabled]=\"disabled\" class=\"zyra-btn\" [class.zyra-btn--gradient]=\"variant === 'gradient'\" [class.zyra-btn--primary]=\"variant === 'primary'\"\r\n\t[class.zyra-btn--secondary]=\"variant === 'secondary'\" [class.zyra-btn--accent]=\"variant === 'accent'\"\r\n\t[class.zyra-btn--success]=\"variant === 'success'\" [class.zyra-btn--danger]=\"variant === 'danger'\"\r\n\t[class.zyra-btn--sm]=\"size === 'sm'\" [class.zyra-btn--md]=\"size === 'md'\" [class.zyra-btn--lg]=\"size === 'lg'\">\r\n\t<ng-content></ng-content>\r\n</button>\r\n\r\n", styles: [".zyra-btn{transition:background .2s ease,border .2s ease;padding:var(--zyra-spacing-1) var(--zyra-spacing-3);border-radius:var(--zyra-radius-md);font-weight:var(--zyra-font-weight-medium);font-size:.875rem;border:none;cursor:pointer;margin:8px;background:var(--btn-bg);color:var(--zyra-foreground)}.zyra-btn:disabled{opacity:.6;cursor:not-allowed;background-color:var(--zyra-muted)}.zyra-btn:disabled :hover{background-color:var(--zyra-muted)}.zyra-btn--sm{height:32px;padding:0 12px;font-size:13px}.zyra-btn--md{height:40px;padding:0 16px;font-size:14px}.zyra-btn--lg{height:48px;padding:0 20px;font-size:15px}.zyra-btn--primary{--btn-bg: var(--zyra-primary)}.zyra-btn--primary:hover{--btn-bg: var(--zyra-primary-hover)}.zyra-btn--secondary{--btn-bg: var(--zyra-secondary)}.zyra-btn--secondary:hover{--btn-bg: var(--zyra-secondary-hover)}.zyra-btn--accent{--btn-bg: var(--zyra-accent)}.zyra-btn--accent:hover{--btn-bg: var(--zyra-accent-hover)}.zyra-btn--success{--btn-bg: var(--zyra-success)}.zyra-btn--success:hover{--btn-bg: var(--zyra-success-hover)}.zyra-btn--danger{--btn-bg: var(--zyra-error)}.zyra-btn--danger:hover{--btn-bg: var(--zyra-error-hover)}.zyra-btn--gradient{--btn-bg: var(--zyra-gradient-btn)}.zyra-btn--gradient:hover{--btn-bg: var(--zyra-gradient-btn-hover)}\n"] }]
+        }], propDecorators: { variant: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }] } });
+
+/*
+ * Public API Surface of zyra-ui-lib
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Button };
+//# sourceMappingURL=zyra-ui.mjs.map

package/fesm2022/zyra-ui.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"zyra-ui.mjs","sources":["../../../projects/zyra-ui-lib/src/lib/button/button.ts","../../../projects/zyra-ui-lib/src/lib/button/button.html","../../../projects/zyra-ui-lib/src/public-api.ts","../../../projects/zyra-ui-lib/src/zyra-ui.ts"],"sourcesContent":["import { Component, Input } from '@angular/core';\r\n\r\n@Component({\r\n\tselector: 'zyra-button',\r\n\timports: [],\r\n\tstandalone: true,\r\n\ttemplateUrl: './button.html',\r\n\tstyleUrl: './button.css',\r\n})\r\nexport class Button {\r\n\t@Input() variant: 'gradient' | 'primary' | 'secondary' | 'accent' | 'success' | 'danger' = 'primary';\r\n\t@Input() size: 'sm' | 'md' | 'lg' = 'md';\r\n\t@Input() disabled = false;\r\n\t@Input() type: 'button' | 'submit' | 'reset' = 'button';\r\n\r\n\tngOnChanges() {\r\n\t\tconsole.log(this.variant);\r\n\t}\r\n}\r\n","<button [attr.type]=\"type\" [disabled]=\"disabled\" class=\"zyra-btn\" [class.zyra-btn--gradient]=\"variant === 'gradient'\" [class.zyra-btn--primary]=\"variant === 'primary'\"\r\n\t[class.zyra-btn--secondary]=\"variant === 'secondary'\" [class.zyra-btn--accent]=\"variant === 'accent'\"\r\n\t[class.zyra-btn--success]=\"variant === 'success'\" [class.zyra-btn--danger]=\"variant === 'danger'\"\r\n\t[class.zyra-btn--sm]=\"size === 'sm'\" [class.zyra-btn--md]=\"size === 'md'\" [class.zyra-btn--lg]=\"size === 'lg'\">\r\n\t<ng-content></ng-content>\r\n</button>\r\n\r\n","/*\r\n * Public API Surface of zyra-ui-lib\r\n */\r\n\r\nexport * from './lib/button/button';","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MASa,MAAM,CAAA;IACT,OAAO,GAA2E,SAAS;IAC3F,IAAI,GAAuB,IAAI;IAC/B,QAAQ,GAAG,KAAK;IAChB,IAAI,GAAkC,QAAQ;IAEvD,WAAW,GAAA;AACV,QAAA,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;IAC1B;uGARY,MAAM,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAN,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAM,8KCTnB,4jBAOA,EAAA,MAAA,EAAA,CAAA,qwCAAA,CAAA,EAAA,CAAA;;2FDEa,MAAM,EAAA,UAAA,EAAA,CAAA;kBAPlB,SAAS;+BACC,aAAa,EAAA,OAAA,EACd,EAAE,EAAA,UAAA,EACC,IAAI,EAAA,QAAA,EAAA,4jBAAA,EAAA,MAAA,EAAA,CAAA,qwCAAA,CAAA,EAAA;;sBAKf;;sBACA;;sBACA;;sBACA;;;AEbF;;AAEG;;ACFH;;AAEG;;;;"}

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "zyra-ng-ui",
+  "version": "1.0.2",
+  "description": "ZyraUI – Modern Angular UI Components",
+  "author": "Rama Jonnada",
+  "license": "MIT",
+  "peerDependencies": {
+    "@angular/core": "^21.0.0",
+    "@angular/common": "^21.0.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false,
+  "module": "fesm2022/zyra-ng-ui.mjs",
+  "typings": "types/zyra-ng-ui.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./types/zyra-ng-ui.d.ts",
+      "default": "./fesm2022/zyra-ng-ui.mjs"
+    }
+  }
+}

package/types/zyra-ng-ui.d.ts

@@ -0,0 +1,13 @@
+import * as i0 from '@angular/core';
+
+declare class Button {
+    variant: 'gradient' | 'primary' | 'secondary' | 'accent' | 'success' | 'danger';
+    size: 'sm' | 'md' | 'lg';
+    disabled: boolean;
+    type: 'button' | 'submit' | 'reset';
+    ngOnChanges(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Button, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Button, "zyra-button", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+
+export { Button };

package/types/zyra-ui.d.ts

@@ -0,0 +1,13 @@
+import * as i0 from '@angular/core';
+
+declare class Button {
+    variant: 'gradient' | 'primary' | 'secondary' | 'accent' | 'success' | 'danger';
+    size: 'sm' | 'md' | 'lg';
+    disabled: boolean;
+    type: 'button' | 'submit' | 'reset';
+    ngOnChanges(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Button, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Button, "zyra-button", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+
+export { Button };