@glamera/animated-icons 0.1.0

package/play-circle/play-circle.d.ts

@@ -0,0 +1,11 @@
+import { ChangeDetectorRef } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { GlameraIconBase, GlameraIconDefinition } from '@glamera/animated-icons';
+import * as i0 from "@angular/core";
+export declare const GLM_PLAY_CIRCLE: GlameraIconDefinition;
+export declare class PlayCircleIconComponent extends GlameraIconBase {
+    readonly iconDef: GlameraIconDefinition;
+    constructor(sanitizer: DomSanitizer, cdr: ChangeDetectorRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<PlayCircleIconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PlayCircleIconComponent, "glamera-play-circle-icon", never, {}, {}, never, never, true, never>;
+}

package/play-circle/public-api.d.ts

@@ -0,0 +1 @@
+export { GLM_PLAY_CIRCLE, PlayCircleIconComponent, PlayCircleIconComponent as PlayCircleIcon, } from './play-circle';

package/play-circle/src/play-circle.animation.scss

@@ -0,0 +1,37 @@
+@import '../../src/lib/animations/play';
+
+@keyframes glm-play-circle-triangle-bounce {
+  0% {
+    transform: translateX(0) rotate(0deg);
+  }
+
+  20% {
+    transform: translateX(-1px) rotate(-10deg);
+  }
+
+  50% {
+    transform: translateX(2px) rotate(0deg);
+  }
+
+  100% {
+    transform: translateX(0) rotate(0deg);
+  }
+}
+
+.glm-icon[data-icon='play-circle'] .glm-icon-svg svg,
+.glm-icon[data-icon='play-circle'] .glm-play-circle-triangle {
+  transform-box: fill-box;
+  transform-origin: center;
+}
+
+@include glm-when-playing('play-circle') {
+  .glm-play-circle-triangle {
+    animation: glm-play-circle-triangle-bounce calc(var(--glm-duration) * 0.5) ease-in-out var(--glm-delay) forwards;
+  }
+}
+
+@include glm-loop('play-circle') {
+  .glm-play-circle-triangle {
+    animation: glm-play-circle-triangle-bounce calc(var(--glm-duration) * 0.5) ease-in-out var(--glm-delay) infinite;
+  }
+}

package/printer/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@glamera/animated-icons/printer" />
+export * from './public-api';

package/printer/printer.d.ts

@@ -0,0 +1,11 @@
+import { ChangeDetectorRef } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { GlameraIconBase, GlameraIconDefinition } from '@glamera/animated-icons';
+import * as i0 from "@angular/core";
+export declare const GLM_PRINTER: GlameraIconDefinition;
+export declare class PrinterIconComponent extends GlameraIconBase {
+    readonly iconDef: GlameraIconDefinition;
+    constructor(sanitizer: DomSanitizer, cdr: ChangeDetectorRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<PrinterIconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PrinterIconComponent, "glamera-printer-icon", never, {}, {}, never, never, true, never>;
+}

package/printer/public-api.d.ts

@@ -0,0 +1 @@
+export { GLM_PRINTER, PrinterIconComponent, PrinterIconComponent as PrinterIcon, } from './printer';

package/printer/src/printer.animation.scss

@@ -0,0 +1,35 @@
+@import '../../src/lib/animations/play';
+
+@keyframes glm-printer-paper-feed {
+  0%,
+  100% {
+    transform: translateY(0);
+  }
+
+  50% {
+    transform: translateY(1.7px);
+  }
+}
+
+.glm-icon[data-icon='printer'] .glm-icon-svg svg {
+  transform-box: fill-box;
+  transform-origin: center;
+}
+
+.glm-icon[data-icon='printer'] .glm-printer-paper {
+  transform-box: fill-box;
+  transform-origin: center;
+  transition: transform calc(var(--glm-duration) * 0.2) ease-in-out;
+}
+
+@include glm-when-playing('printer') {
+  .glm-printer-paper {
+    animation: glm-printer-paper-feed calc(var(--glm-duration) * 0.5) ease-in-out var(--glm-delay) forwards;
+  }
+}
+
+@include glm-loop('printer') {
+  .glm-printer-paper {
+    animation: glm-printer-paper-feed calc(var(--glm-duration) * 0.5) ease-in-out var(--glm-delay) infinite;
+  }
+}

package/printer-2/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@glamera/animated-icons/printer-2" />
+export * from './public-api';

package/printer-2/printer-2.d.ts

@@ -0,0 +1,11 @@
+import { ChangeDetectorRef } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { GlameraIconBase, GlameraIconDefinition } from '@glamera/animated-icons';
+import * as i0 from "@angular/core";
+export declare const GLM_PRINTER_2: GlameraIconDefinition;
+export declare class Printer2IconComponent extends GlameraIconBase {
+    readonly iconDef: GlameraIconDefinition;
+    constructor(sanitizer: DomSanitizer, cdr: ChangeDetectorRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<Printer2IconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Printer2IconComponent, "glamera-printer-2-icon", never, {}, {}, never, never, true, never>;
+}

package/printer-2/public-api.d.ts

@@ -0,0 +1 @@
+export { GLM_PRINTER_2, Printer2IconComponent, Printer2IconComponent as Printer2Icon, } from './printer-2';

package/printer-2/src/printer-2.animation.scss

@@ -0,0 +1,104 @@
+@import '../../src/lib/animations/play';
+
+@keyframes glm-printer-2-fill-in {
+  0% {
+    fill-opacity: 0;
+  }
+
+  100% {
+    fill-opacity: 0.18;
+  }
+}
+
+@keyframes glm-printer-2-fade-pop {
+  0% {
+    opacity: 0.3;
+    transform: scale(0.92);
+  }
+
+  60% {
+    opacity: 1;
+    transform: scale(1.04);
+  }
+
+  100% {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+@keyframes glm-printer-2-fill-loop {
+  0%,
+  100% {
+    fill-opacity: 0;
+  }
+
+  40%,
+  70% {
+    fill-opacity: 0.18;
+  }
+}
+
+@keyframes glm-printer-2-fade-pop-loop {
+  0%,
+  100% {
+    opacity: 0.3;
+    transform: scale(0.92);
+  }
+
+  30% {
+    opacity: 1;
+    transform: scale(1.04);
+  }
+
+  45%,
+  70% {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+.glm-icon[data-icon='printer-2'] .glm-icon-svg svg {
+  overflow: visible;
+}
+
+.glm-icon[data-icon='printer-2'] .glm-printer-2-body {
+  fill: currentColor;
+  fill-opacity: 0;
+  transition: fill-opacity calc(var(--glm-duration) * 0.5) ease var(--glm-delay);
+}
+
+.glm-icon[data-icon='printer-2'] .glm-printer-2-top,
+.glm-icon[data-icon='printer-2'] .glm-printer-2-output {
+  fill: none;
+  transform-box: fill-box;
+  transform-origin: center;
+}
+
+@include glm-when-playing('printer-2') {
+  .glm-printer-2-body {
+    animation: glm-printer-2-fill-in calc(var(--glm-duration) * 0.5) ease var(--glm-delay) both;
+  }
+
+  .glm-printer-2-top {
+    animation: glm-printer-2-fade-pop calc(var(--glm-duration) * 0.5) ease calc(var(--glm-delay) + var(--glm-duration) * 0.08) both;
+  }
+
+  .glm-printer-2-output {
+    animation: glm-printer-2-fade-pop calc(var(--glm-duration) * 0.5) ease calc(var(--glm-delay) + var(--glm-duration) * 0.16) both;
+  }
+}
+
+@include glm-loop('printer-2') {
+  .glm-printer-2-body {
+    animation: glm-printer-2-fill-loop calc(var(--glm-duration) * 1.4) ease var(--glm-delay) infinite both;
+  }
+
+  .glm-printer-2-top {
+    animation: glm-printer-2-fade-pop-loop calc(var(--glm-duration) * 1.4) ease calc(var(--glm-delay) + var(--glm-duration) * 0.08) infinite both;
+  }
+
+  .glm-printer-2-output {
+    animation: glm-printer-2-fade-pop-loop calc(var(--glm-duration) * 1.4) ease calc(var(--glm-delay) + var(--glm-duration) * 0.16) infinite both;
+  }
+}

package/public-api.d.ts

@@ -0,0 +1,9 @@
+export { GlameraIconsModule } from './lib/glamera-icons.module';
+export { provideGlameraIcons } from './lib/provide-icons';
+export { GlameraIconComponent } from './lib/components/icon/icon.component';
+export { GlameraIconRegistry } from './lib/icon-registry';
+export { GlameraIconBase } from './lib/base/icon-base';
+export { GLAMERA_ICON_HOST_TEMPLATE } from './lib/base/icon-host.template';
+export { GLAMERA_ICONS } from './lib/tokens';
+export { coerceBooleanAttribute, coerceDurationMs, coerceIconSize, GLAMERA_DEFAULT_DURATION, } from './lib/utils';
+export type { GlameraAnimationMode, GlameraIconDefinition, GlameraIconSize, } from './lib/types';

package/qr-code/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@glamera/animated-icons/qr-code" />
+export * from './public-api';

package/qr-code/public-api.d.ts

@@ -0,0 +1 @@
+export { GLM_QR_CODE, QrCodeIconComponent, QrCodeIconComponent as QrCodeIcon, } from './qr-code';

package/qr-code/qr-code.d.ts

@@ -0,0 +1,11 @@
+import { ChangeDetectorRef } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { GlameraIconBase, GlameraIconDefinition } from '@glamera/animated-icons';
+import * as i0 from "@angular/core";
+export declare const GLM_QR_CODE: GlameraIconDefinition;
+export declare class QrCodeIconComponent extends GlameraIconBase {
+    readonly iconDef: GlameraIconDefinition;
+    constructor(sanitizer: DomSanitizer, cdr: ChangeDetectorRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<QrCodeIconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<QrCodeIconComponent, "glamera-qr-code-icon", never, {}, {}, never, never, true, never>;
+}

package/qr-code/src/qr-code.animation.scss

@@ -0,0 +1,119 @@
+@import '../../src/lib/animations/play';
+
+@keyframes glm-qr-code-pulse {
+  0%,
+  100% {
+    transform: scale(1);
+  }
+
+  50% {
+    transform: scale(1.04);
+  }
+}
+
+@keyframes glm-qr-code-block-tl {
+  0%,
+  100% {
+    transform: translate(0, 0);
+    opacity: 1;
+  }
+
+  50% {
+    transform: translate(-2px, -2px);
+    opacity: 0.7;
+  }
+}
+
+@keyframes glm-qr-code-block-tr {
+  0%,
+  100% {
+    transform: translate(0, 0);
+    opacity: 1;
+  }
+
+  50% {
+    transform: translate(2px, -2px);
+    opacity: 0.7;
+  }
+}
+
+@keyframes glm-qr-code-block-bl {
+  0%,
+  100% {
+    transform: translate(0, 0);
+    opacity: 1;
+  }
+
+  50% {
+    transform: translate(-2px, 2px);
+    opacity: 0.7;
+  }
+}
+
+@keyframes glm-qr-code-bit {
+  0%,
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
+
+  50% {
+    transform: scale(0.6);
+    opacity: 0.5;
+  }
+}
+
+.glm-icon[data-icon='qr-code'] .glm-qr-code-group {
+  transform-box: view-box;
+  transform-origin: 12px 12px;
+}
+
+.glm-icon[data-icon='qr-code'] .glm-qr-code-block,
+.glm-icon[data-icon='qr-code'] .glm-qr-code-bit {
+  transform-box: fill-box;
+  transform-origin: center;
+}
+
+@include glm-when-playing('qr-code') {
+  .glm-qr-code-group {
+    animation: glm-qr-code-pulse calc(var(--glm-duration) * 0.35) ease-out var(--glm-delay) both;
+  }
+
+  .glm-qr-code-block-tl {
+    animation: glm-qr-code-block-tl calc(var(--glm-duration) * 0.4) ease-out var(--glm-delay) both;
+  }
+
+  .glm-qr-code-block-tr {
+    animation: glm-qr-code-block-tr calc(var(--glm-duration) * 0.4) ease-out var(--glm-delay) both;
+  }
+
+  .glm-qr-code-block-bl {
+    animation: glm-qr-code-block-bl calc(var(--glm-duration) * 0.4) ease-out var(--glm-delay) both;
+  }
+
+  .glm-qr-code-bit {
+    animation: glm-qr-code-bit calc(var(--glm-duration) * 0.3) ease-out var(--glm-delay) both;
+  }
+}
+
+@include glm-loop('qr-code') {
+  .glm-qr-code-group {
+    animation: glm-qr-code-pulse calc(var(--glm-duration) * 0.7) ease-out var(--glm-delay) infinite both;
+  }
+
+  .glm-qr-code-block-tl {
+    animation: glm-qr-code-block-tl calc(var(--glm-duration) * 0.8) ease-out var(--glm-delay) infinite both;
+  }
+
+  .glm-qr-code-block-tr {
+    animation: glm-qr-code-block-tr calc(var(--glm-duration) * 0.8) ease-out var(--glm-delay) infinite both;
+  }
+
+  .glm-qr-code-block-bl {
+    animation: glm-qr-code-block-bl calc(var(--glm-duration) * 0.8) ease-out var(--glm-delay) infinite both;
+  }
+
+  .glm-qr-code-bit {
+    animation: glm-qr-code-bit calc(var(--glm-duration) * 0.6) ease-out var(--glm-delay) infinite both;
+  }
+}

package/repeat/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@glamera/animated-icons/repeat" />
+export * from './public-api';

package/repeat/public-api.d.ts

@@ -0,0 +1 @@
+export { GLM_REPEAT, RepeatIconComponent, RepeatIconComponent as RepeatIcon } from './repeat';

package/repeat/repeat.d.ts

@@ -0,0 +1,11 @@
+import { ChangeDetectorRef } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { GlameraIconBase, GlameraIconDefinition } from '@glamera/animated-icons';
+import * as i0 from "@angular/core";
+export declare const GLM_REPEAT: GlameraIconDefinition;
+export declare class RepeatIconComponent extends GlameraIconBase {
+    readonly iconDef: GlameraIconDefinition;
+    constructor(sanitizer: DomSanitizer, cdr: ChangeDetectorRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<RepeatIconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RepeatIconComponent, "glamera-repeat-icon", never, {}, {}, never, never, true, never>;
+}

package/repeat/src/repeat.animation.scss

@@ -0,0 +1,149 @@
+@import '../../src/lib/animations/play';
+
+$repeat-dash: 0.34;
+$repeat-spacing: 0.66;
+$repeat-cycle: 1.8;
+$repeat-travel: -1;
+
+@keyframes glm-repeat-top-pulse {
+  0% {
+    opacity: 0;
+    stroke-dashoffset: 0;
+  }
+  4% {
+    opacity: 1;
+    stroke-dashoffset: 0;
+  }
+  46% {
+    opacity: 1;
+    stroke-dashoffset: #{$repeat-travel};
+  }
+  50% {
+    opacity: 0;
+    stroke-dashoffset: #{$repeat-travel};
+  }
+  100% {
+    opacity: 0;
+    stroke-dashoffset: #{$repeat-travel};
+  }
+}
+
+@keyframes glm-repeat-bottom-pulse {
+  0% {
+    opacity: 0;
+    stroke-dashoffset: 0;
+  }
+  50% {
+    opacity: 0;
+    stroke-dashoffset: 0;
+  }
+  54% {
+    opacity: 1;
+    stroke-dashoffset: 0;
+  }
+  96% {
+    opacity: 1;
+    stroke-dashoffset: #{$repeat-travel};
+  }
+  100% {
+    opacity: 0;
+    stroke-dashoffset: #{$repeat-travel};
+  }
+}
+
+@keyframes glm-repeat-top-head {
+  0%,
+  40% {
+    transform: scale(1);
+  }
+  48% {
+    transform: scale(1.3);
+  }
+  58%,
+  100% {
+    transform: scale(1);
+  }
+}
+
+@keyframes glm-repeat-bottom-head {
+  0%,
+  90% {
+    transform: scale(1);
+  }
+  98% {
+    transform: scale(1.3);
+  }
+  100% {
+    transform: scale(1);
+  }
+}
+
+.glm-icon[data-icon='repeat'] .glm-repeat-top-base,
+.glm-icon[data-icon='repeat'] .glm-repeat-bottom-base {
+  opacity: 1;
+  transition: opacity calc(var(--glm-duration) * 0.3) ease-out;
+}
+
+.glm-icon[data-icon='repeat'] .glm-repeat-top-pulse,
+.glm-icon[data-icon='repeat'] .glm-repeat-bottom-pulse {
+  fill: none;
+  stroke-dasharray: #{$repeat-dash} #{$repeat-spacing};
+  stroke-dashoffset: 0;
+  opacity: 0;
+}
+
+.glm-icon[data-icon='repeat'] .glm-repeat-top-head,
+.glm-icon[data-icon='repeat'] .glm-repeat-bottom-head {
+  transform-box: fill-box;
+  transform-origin: center;
+}
+
+@include glm-when-playing('repeat') {
+  .glm-repeat-top-base,
+  .glm-repeat-bottom-base {
+    opacity: 0.3;
+    transition-duration: calc(var(--glm-duration) * 0.2);
+    transition-timing-function: ease-out;
+  }
+
+  .glm-repeat-top-pulse {
+    animation: glm-repeat-top-pulse calc(var(--glm-duration) * #{$repeat-cycle}) linear var(--glm-delay) infinite both;
+  }
+
+  .glm-repeat-bottom-pulse {
+    animation: glm-repeat-bottom-pulse calc(var(--glm-duration) * #{$repeat-cycle}) linear var(--glm-delay) infinite both;
+  }
+
+  .glm-repeat-top-head {
+    animation: glm-repeat-top-head calc(var(--glm-duration) * #{$repeat-cycle}) ease-in-out var(--glm-delay) infinite both;
+  }
+
+  .glm-repeat-bottom-head {
+    animation: glm-repeat-bottom-head calc(var(--glm-duration) * #{$repeat-cycle}) ease-in-out var(--glm-delay) infinite both;
+  }
+}
+
+@include glm-loop('repeat') {
+  .glm-repeat-top-base,
+  .glm-repeat-bottom-base {
+    opacity: 0.3;
+    transition-duration: calc(var(--glm-duration) * 0.2);
+    transition-timing-function: ease-out;
+  }
+
+  .glm-repeat-top-pulse {
+    animation: glm-repeat-top-pulse calc(var(--glm-duration) * #{$repeat-cycle}) linear var(--glm-delay) infinite both;
+  }
+
+  .glm-repeat-bottom-pulse {
+    animation: glm-repeat-bottom-pulse calc(var(--glm-duration) * #{$repeat-cycle}) linear var(--glm-delay) infinite both;
+  }
+
+  .glm-repeat-top-head {
+    animation: glm-repeat-top-head calc(var(--glm-duration) * #{$repeat-cycle}) ease-in-out var(--glm-delay) infinite both;
+  }
+
+  .glm-repeat-bottom-head {
+    animation: glm-repeat-bottom-head calc(var(--glm-duration) * #{$repeat-cycle}) ease-in-out var(--glm-delay) infinite both;
+  }
+}

package/scan-qr-code/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@glamera/animated-icons/scan-qr-code" />
+export * from './public-api';

package/scan-qr-code/public-api.d.ts

@@ -0,0 +1 @@
+export { GLM_SCAN_QR_CODE, ScanQrCodeIconComponent, ScanQrCodeIconComponent as ScanQrCodeIcon, } from './scan-qr-code';

package/scan-qr-code/scan-qr-code.d.ts

@@ -0,0 +1,11 @@
+import { ChangeDetectorRef } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { GlameraIconBase, GlameraIconDefinition } from '@glamera/animated-icons';
+import * as i0 from "@angular/core";
+export declare const GLM_SCAN_QR_CODE: GlameraIconDefinition;
+export declare class ScanQrCodeIconComponent extends GlameraIconBase {
+    readonly iconDef: GlameraIconDefinition;
+    constructor(sanitizer: DomSanitizer, cdr: ChangeDetectorRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<ScanQrCodeIconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ScanQrCodeIconComponent, "glamera-scan-qr-code-icon", never, {}, {}, never, never, true, never>;
+}