sn-spinner-x 0.0.1

package/ng-package.json

@@ -0,0 +1,7 @@
+{
+  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "../../dist/sn-spinner",
+  "lib": {
+    "entryFile": "src/public-api.ts"
+  }
+}

package/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "sn-spinner-x",
+  "version": "0.0.1",
+  "description": "SnSpinner is an Angular 21 standalone loading spinner component",
+  "author": {
+    "name": "Swapnil Nakate",
+    "email": "nakate.swapnil7@gmail.com",
+    "url": "https://swapnilnakate.in"
+  },
+  "peerDependencies": {
+    "@angular/common": "^21.0.0",
+    "@angular/core": "^21.0.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false,
+  "bugs": {
+    "url": "https://github.com/swapnilnakate7/sn-ui/issues",
+    "email": "nakate.swapnil7@gmail.com"
+  },
+  "repository": {
+    "url": "https://github.com/swapnilnakate7/sn-ui",
+    "type": "git",
+    "directory": "projects/sn-spinner"
+  },
+  "license": "MIT"
+}

package/src/lib/sn-spinner-x.component.spec.ts

@@ -0,0 +1,33 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { SnSpinnerXComponent } from './sn-spinner-x.component';
+
+describe('SnSpinnerXComponent', () => {
+  let component: SnSpinnerXComponent;
+  let fixture: ComponentFixture<SnSpinnerXComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [SnSpinnerXComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(SnSpinnerXComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should default scheme to "primary"', () => {
+    expect(component.scheme).toBe('primary');
+  });
+
+  it('should default size to "md"', () => {
+    expect(component.size).toBe('md');
+  });
+
+  it('should default label to "Loading..."', () => {
+    expect(component.label).toBe('Loading...');
+  });
+});

package/src/lib/sn-spinner-x.component.ts

@@ -0,0 +1,23 @@
+import { Component, Input } from '@angular/core';
+import { CommonModule, NgClass } from '@angular/common';
+
+@Component({
+  selector: 'sn-spinner-x',
+  standalone: true,
+  imports: [CommonModule, NgClass],
+  templateUrl: './sn-spinner-x.html',
+  styleUrl: 'sn-spinner-x.scss',
+})
+export class SnSpinnerXComponent {
+  @Input() scheme: string = 'primary';
+  @Input() size: string = 'md';
+  @Input() label: string = 'Loading...';
+
+  get classes(): Record<string, boolean> {
+    return {
+      'sn-spinner': true,
+      [`scheme-${this.scheme}`]: true,
+      [`size-${this.size}`]: true,
+    };
+  }
+}

package/src/lib/sn-spinner-x.html

@@ -0,0 +1,3 @@
+<span [ngClass]="classes" role="status" [attr.aria-label]="label">
+  <span class="sr-only">{{ label }}</span>
+</span>

package/src/lib/sn-spinner-x.scss

@@ -0,0 +1,51 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@keyframes sn-spin {
+  to { transform: rotate(360deg); }
+}
+
+.sn-spinner {
+  display: inline-block;
+  border-style: solid;
+  border-radius: 50%;
+  animation: sn-spin 0.75s linear infinite;
+
+  &.size-sm { width: 1rem;   height: 1rem;   border-width: 2px; }
+  &.size-md { width: 1.5rem; height: 1.5rem; border-width: 3px; }
+  &.size-lg { width: 2.5rem; height: 2.5rem; border-width: 4px; }
+
+  &.scheme-primary {
+    border-color: #3b82f6;
+    border-top-color: transparent;
+  }
+  &.scheme-warn {
+    border-color: #f59e0b;
+    border-top-color: transparent;
+  }
+  &.scheme-danger {
+    border-color: #ef4444;
+    border-top-color: transparent;
+  }
+  &.scheme-success {
+    border-color: #22c55e;
+    border-top-color: transparent;
+  }
+  &.scheme-default {
+    border-color: #6b7280;
+    border-top-color: transparent;
+  }
+
+  .sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border-width: 0;
+  }
+}

package/src/public-api.ts

@@ -0,0 +1 @@
+export * from './lib/sn-spinner-x.component';

package/tsconfig.lib.json

@@ -0,0 +1,11 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/lib",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": []
+  },
+  "exclude": ["**/*.spec.ts"]
+}

package/tsconfig.lib.prod.json

@@ -0,0 +1,9 @@
+{
+  "extends": "./tsconfig.lib.json",
+  "compilerOptions": {
+    "declarationMap": false
+  },
+  "angularCompilerOptions": {
+    "compilationMode": "partial"
+  }
+}

package/tsconfig.spec.json

@@ -0,0 +1,8 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": ["jasmine"]
+  },
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
+}