@tacdaed/fragments 1.0.0-beta.8 → 1.0.0-beta.9

package/fesm2022/tacdaed-fragments.mjs

@@ -1578,10 +1578,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImpor
                 args: ['morphPath', { static: false }]
             }] } });
 
-class SparkleFieldComponent {
+class SparkleSectionComponent {
     constructor() {
+        /* Layout */
         this.width = null;
         this.height = null;
+        /* Sparkles */
         this.count = 12;
         this.minSize = 2;
         this.maxSize = 6;
@@ -1593,24 +1595,13 @@ class SparkleFieldComponent {
         this.sparkles = [];
         this.animations = [];
         this.changesSub = null;
-        this.fallbackWidth = 260;
-        this.fallbackHeight = 160;
     }
+    /* Host sizing (ONLY when provided) */
     get hostWidth() {
-        return this.width == null ? null : this.formatSize(this.width);
+        return this.width ? this.formatSize(this.width) : null;
     }
     get hostHeight() {
-        return this.height === null ? null : this.formatSize(this.height);
-    }
-    get hostMinWidth() {
-        return this.needsMinSize(this.width)
-            ? `${this.fallbackWidth}px`
-            : null;
-    }
-    get hostMinHeight() {
-        return this.needsMinSize(this.height)
-            ? `${this.fallbackHeight}px`
-            : null;
+        return this.height ? this.formatSize(this.height) : null;
     }
     get hostColor() {
         return this.color;
@@ -1682,19 +1673,14 @@ class SparkleFieldComponent {
         return min + Math.random() * (max - min);
     }
     formatSize(value) {
-        if (value == null)
-            return '';
-        return typeof value === 'number' ? `${value}px` : value;
-    }
-    needsMinSize(value) {
-        return typeof value === 'string' && value.trim().endsWith('%');
+        return typeof value === 'number' ? `${value}px` : (value || '');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SparkleFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: SparkleFieldComponent, isStandalone: true, selector: "frg-sparkle-field", inputs: { width: "width", height: "height", count: "count", minSize: "minSize", maxSize: "maxSize", drift: "drift", minDuration: "minDuration", maxDuration: "maxDuration", loop: "loop", color: "color" }, host: { properties: { "style.width": "this.hostWidth", "style.height": "this.hostHeight", "style.minWidth": "this.hostMinWidth", "style.minHeight": "this.hostMinHeight", "style.color": "this.hostColor" } }, viewQueries: [{ propertyName: "sparkleRefs", predicate: ["sparkle"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"frg-sparkle-layer\">\r\n  @for (sparkle of sparkles; track $index) {\r\n    <span\r\n      #sparkle\r\n      class=\"frg-sparkle\"\r\n      [style.left.%]=\"sparkle.x\"\r\n      [style.top.%]=\"sparkle.y\"\r\n      [style.width.px]=\"sparkle.size\"\r\n      [style.height.px]=\"sparkle.size\">\r\n    </span>\r\n  }\r\n</div>\r\n", styles: [":host{display:block;position:relative;overflow:hidden;pointer-events:none}.frg-sparkle-layer{position:absolute;inset:0}.frg-sparkle{position:absolute;border-radius:50%;background:radial-gradient(circle,currentColor 0%,rgba(255,255,255,.85) 35%,rgba(255,255,255,0) 70%);opacity:.6;will-change:transform,opacity;transform:translateZ(0)}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SparkleSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: SparkleSectionComponent, isStandalone: true, selector: "frg-sparkle-section", inputs: { width: "width", height: "height", count: "count", minSize: "minSize", maxSize: "maxSize", drift: "drift", minDuration: "minDuration", maxDuration: "maxDuration", loop: "loop", color: "color" }, host: { properties: { "style.width": "this.hostWidth", "style.height": "this.hostHeight", "style.color": "this.hostColor" } }, viewQueries: [{ propertyName: "sparkleRefs", predicate: ["sparkle"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"frg-sparkle-layer\" aria-hidden=\"true\">\r\n  @for (sparkle of sparkles; track $index) {\r\n    <span\r\n      #sparkle\r\n      class=\"frg-sparkle\"\r\n      [style.left.%]=\"sparkle.x\"\r\n      [style.top.%]=\"sparkle.y\"\r\n      [style.width.px]=\"sparkle.size\"\r\n      [style.height.px]=\"sparkle.size\">\r\n    </span>\r\n  }\r\n</div>\r\n\r\n<div class=\"frg-sparkle-content\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [":host{display:block;position:relative;overflow:hidden}.frg-sparkle-layer{position:absolute;inset:0;pointer-events:none;z-index:0}.frg-sparkle-content{position:relative;z-index:1}.frg-sparkle{position:absolute;border-radius:50%;background:radial-gradient(circle,currentColor 0%,#fdfdfd 35%,#3d3d3d 70%);opacity:.6;will-change:transform,opacity;transform:translateZ(0)}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SparkleFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SparkleSectionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'frg-sparkle-field', standalone: true, template: "<div class=\"frg-sparkle-layer\">\r\n  @for (sparkle of sparkles; track $index) {\r\n    <span\r\n      #sparkle\r\n      class=\"frg-sparkle\"\r\n      [style.left.%]=\"sparkle.x\"\r\n      [style.top.%]=\"sparkle.y\"\r\n      [style.width.px]=\"sparkle.size\"\r\n      [style.height.px]=\"sparkle.size\">\r\n    </span>\r\n  }\r\n</div>\r\n", styles: [":host{display:block;position:relative;overflow:hidden;pointer-events:none}.frg-sparkle-layer{position:absolute;inset:0}.frg-sparkle{position:absolute;border-radius:50%;background:radial-gradient(circle,currentColor 0%,rgba(255,255,255,.85) 35%,rgba(255,255,255,0) 70%);opacity:.6;will-change:transform,opacity;transform:translateZ(0)}\n"] }]
+            args: [{ selector: 'frg-sparkle-section', standalone: true, template: "<div class=\"frg-sparkle-layer\" aria-hidden=\"true\">\r\n  @for (sparkle of sparkles; track $index) {\r\n    <span\r\n      #sparkle\r\n      class=\"frg-sparkle\"\r\n      [style.left.%]=\"sparkle.x\"\r\n      [style.top.%]=\"sparkle.y\"\r\n      [style.width.px]=\"sparkle.size\"\r\n      [style.height.px]=\"sparkle.size\">\r\n    </span>\r\n  }\r\n</div>\r\n\r\n<div class=\"frg-sparkle-content\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", styles: [":host{display:block;position:relative;overflow:hidden}.frg-sparkle-layer{position:absolute;inset:0;pointer-events:none;z-index:0}.frg-sparkle-content{position:relative;z-index:1}.frg-sparkle{position:absolute;border-radius:50%;background:radial-gradient(circle,currentColor 0%,#fdfdfd 35%,#3d3d3d 70%);opacity:.6;will-change:transform,opacity;transform:translateZ(0)}\n"] }]
         }], propDecorators: { width: [{
                 type: Input
             }], height: [{
@@ -1724,12 +1710,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImpor
             }], hostHeight: [{
                 type: HostBinding,
                 args: ['style.height']
-            }], hostMinWidth: [{
-                type: HostBinding,
-                args: ['style.minWidth']
-            }], hostMinHeight: [{
-                type: HostBinding,
-                args: ['style.minHeight']
             }], hostColor: [{
                 type: HostBinding,
                 args: ['style.color']
@@ -8920,5 +8900,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AccordionComponent, BlobMorphComponent, BreadcrumbComponent, ButtonComponent, CardComponent, ChipComponent, ChunkPipe, CodeBlockComponent, ContainerComponent, ContentBlurComponent, DividerComponent, DynamicPipe, EnumDirectionSortTable, FieldArrayPositionPipe, FragmentsPopoverDirective, FragmentsTooltipDirective, FrgBadgeDirective, InputCalendarComponent, InputCheckboxComponent, InputCheckboxGroupComponent, InputClockPickerComponent, InputDateComponent, InputDateTimeComponent, InputFileUploadComponent, InputNumberComponent, InputRadioGroupComponent, InputSliderComponent, InputTextComponent, InputTimeComponent, InputToggleSwitchComponent, InputValidationComponent, ModalComponent, MultiSelectComponent, PillComponent, ProgressBarComponent, PulseLoaderComponent, SafeHtmlPipe, SanitizeHtmlPipe, SectionComponent, SelectionListComponent, SeparatorComponent, SideNavComponent, SkeletonLoaderComponent, SmallPaginationComponent, SnackbarComponent, SparkleFieldComponent, SpinnerComponent, StepperComponent, TableComponent, TabsComponent, TagComponent, TitleBarComponent, ToastComponent, ToastStackComponent, TypeOfArrayPipe, generateId, generateNumberId, generateUUID, generateUniqueId, getActivatedRouteChild, getTimestampISO, getTimestampMillis, isObjectEmpty, normalizeNumber, orderList, paginationList, sortTable };
+export { AccordionComponent, BlobMorphComponent, BreadcrumbComponent, ButtonComponent, CardComponent, ChipComponent, ChunkPipe, CodeBlockComponent, ContainerComponent, ContentBlurComponent, DividerComponent, DynamicPipe, EnumDirectionSortTable, FieldArrayPositionPipe, FragmentsPopoverDirective, FragmentsTooltipDirective, FrgBadgeDirective, InputCalendarComponent, InputCheckboxComponent, InputCheckboxGroupComponent, InputClockPickerComponent, InputDateComponent, InputDateTimeComponent, InputFileUploadComponent, InputNumberComponent, InputRadioGroupComponent, InputSliderComponent, InputTextComponent, InputTimeComponent, InputToggleSwitchComponent, InputValidationComponent, ModalComponent, MultiSelectComponent, PillComponent, ProgressBarComponent, PulseLoaderComponent, SafeHtmlPipe, SanitizeHtmlPipe, SectionComponent, SelectionListComponent, SeparatorComponent, SideNavComponent, SkeletonLoaderComponent, SmallPaginationComponent, SnackbarComponent, SparkleSectionComponent, SpinnerComponent, StepperComponent, TableComponent, TabsComponent, TagComponent, TitleBarComponent, ToastComponent, ToastStackComponent, TypeOfArrayPipe, generateId, generateNumberId, generateUUID, generateUniqueId, getActivatedRouteChild, getTimestampISO, getTimestampMillis, isObjectEmpty, normalizeNumber, orderList, paginationList, sortTable };
 //# sourceMappingURL=tacdaed-fragments.mjs.map

package/index.d.ts

@@ -796,7 +796,7 @@ declare class BlobMorphComponent extends MorphBase implements AfterViewInit {
 }
 
 type SizeValue = number | string | null;
-interface Sparkle {
+interface ISparkleConfiguration {
     x: number;
     y: number;
     size: number;
@@ -806,7 +806,7 @@ interface Sparkle {
     driftY: number;
 }
 
-declare class SparkleFieldComponent implements OnInit, OnChanges, AfterViewInit, OnDestroy {
+declare class SparkleSectionComponent implements OnInit, OnChanges, AfterViewInit, OnDestroy {
     width: SizeValue;
     height: SizeValue;
     count: number;
@@ -817,16 +817,12 @@ declare class SparkleFieldComponent implements OnInit, OnChanges, AfterViewInit,
     maxDuration: number;
     loop: boolean;
     color: string | null;
-    sparkles: Sparkle[];
+    sparkles: ISparkleConfiguration[];
     sparkleRefs: QueryList<ElementRef<HTMLSpanElement>>;
     private animations;
     private changesSub;
-    private readonly fallbackWidth;
-    private readonly fallbackHeight;
     get hostWidth(): string | null;
     get hostHeight(): string | null;
-    get hostMinWidth(): string | null;
-    get hostMinHeight(): string | null;
     get hostColor(): string | null;
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
@@ -836,9 +832,8 @@ declare class SparkleFieldComponent implements OnInit, OnChanges, AfterViewInit,
     private restartAnimation;
     private rand;
     private formatSize;
-    private needsMinSize;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SparkleFieldComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SparkleFieldComponent, "frg-sparkle-field", never, { "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "count": { "alias": "count"; "required": false; }; "minSize": { "alias": "minSize"; "required": false; }; "maxSize": { "alias": "maxSize"; "required": false; }; "drift": { "alias": "drift"; "required": false; }; "minDuration": { "alias": "minDuration"; "required": false; }; "maxDuration": { "alias": "maxDuration"; "required": false; }; "loop": { "alias": "loop"; "required": false; }; "color": { "alias": "color"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SparkleSectionComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SparkleSectionComponent, "frg-sparkle-section", never, { "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "count": { "alias": "count"; "required": false; }; "minSize": { "alias": "minSize"; "required": false; }; "maxSize": { "alias": "maxSize"; "required": false; }; "drift": { "alias": "drift"; "required": false; }; "minDuration": { "alias": "minDuration"; "required": false; }; "maxDuration": { "alias": "maxDuration"; "required": false; }; "loop": { "alias": "loop"; "required": false; }; "color": { "alias": "color"; "required": false; }; }, {}, never, ["*"], true, never>;
 }
 
 interface IPaginationOutput<T> {
@@ -3926,5 +3921,5 @@ declare function getTimestampMillis(): number;
  */
 declare function generateUniqueId(prefix?: string): string;
 
-export { AccordionComponent, BlobMorphComponent, BreadcrumbComponent, ButtonComponent, CardComponent, ChipComponent, ChunkPipe, CodeBlockComponent, ContainerComponent, ContentBlurComponent, DividerComponent, DynamicPipe, EnumDirectionSortTable, FieldArrayPositionPipe, FragmentsPopoverDirective, FragmentsTooltipDirective, FrgBadgeDirective, InputCalendarComponent, InputCheckboxComponent, InputCheckboxGroupComponent, InputClockPickerComponent, InputDateComponent, InputDateTimeComponent, InputFileUploadComponent, InputNumberComponent, InputRadioGroupComponent, InputSliderComponent, InputTextComponent, InputTimeComponent, InputToggleSwitchComponent, InputValidationComponent, ModalComponent, MultiSelectComponent, PillComponent, ProgressBarComponent, PulseLoaderComponent, SafeHtmlPipe, SanitizeHtmlPipe, SectionComponent, SelectionListComponent, SeparatorComponent, SideNavComponent, SkeletonLoaderComponent, SmallPaginationComponent, SnackbarComponent, SparkleFieldComponent, SpinnerComponent, StepperComponent, TableComponent, TabsComponent, TagComponent, TitleBarComponent, ToastComponent, ToastStackComponent, TypeOfArrayPipe, generateId, generateNumberId, generateUUID, generateUniqueId, getActivatedRouteChild, getTimestampISO, getTimestampMillis, isObjectEmpty, normalizeNumber, orderList, paginationList, sortTable };
+export { AccordionComponent, BlobMorphComponent, BreadcrumbComponent, ButtonComponent, CardComponent, ChipComponent, ChunkPipe, CodeBlockComponent, ContainerComponent, ContentBlurComponent, DividerComponent, DynamicPipe, EnumDirectionSortTable, FieldArrayPositionPipe, FragmentsPopoverDirective, FragmentsTooltipDirective, FrgBadgeDirective, InputCalendarComponent, InputCheckboxComponent, InputCheckboxGroupComponent, InputClockPickerComponent, InputDateComponent, InputDateTimeComponent, InputFileUploadComponent, InputNumberComponent, InputRadioGroupComponent, InputSliderComponent, InputTextComponent, InputTimeComponent, InputToggleSwitchComponent, InputValidationComponent, ModalComponent, MultiSelectComponent, PillComponent, ProgressBarComponent, PulseLoaderComponent, SafeHtmlPipe, SanitizeHtmlPipe, SectionComponent, SelectionListComponent, SeparatorComponent, SideNavComponent, SkeletonLoaderComponent, SmallPaginationComponent, SnackbarComponent, SparkleSectionComponent, SpinnerComponent, StepperComponent, TableComponent, TabsComponent, TagComponent, TitleBarComponent, ToastComponent, ToastStackComponent, TypeOfArrayPipe, generateId, generateNumberId, generateUUID, generateUniqueId, getActivatedRouteChild, getTimestampISO, getTimestampMillis, isObjectEmpty, normalizeNumber, orderList, paginationList, sortTable };
 export type { AccordionItem, AccordionItemContext, AccordionToggleEvent, ArrayOneOrMore, Badge, BreadcrumbItem, Chip, CodeBlockBody, CodeBlockConfig, CodeBlockFooter, CodeBlockHeader, DateFormat, DateTimeFormat, GenericFunction, IActionElement, IBaseAction, IConfigTable, IEventAction, IFieldPipe, ILinkAction, IPaginationOutput, ISideNavConfig, ISideNavItem, ISideNavSection, ITBody, ITBodyAction, ITBodyCell, ITBodyCellIcon, ITBodyColumn, ITCaption, ITHead, ITHeadAction, ITHeadColumn, ITPagination, ITSort, ITTitleBar, ITTitleBarFilter, ITTitleBarSearch, ITooltipElement, InputCheckboxGroupItem, InputRadioGroupItem, ModalCloseEvent, NgClassValue, Pill, SelectionListItem, SnackbarCloseEvent, StatusIndicator, StepChangeEvent, StepItem, StepItemContext, StepValidationContext, StepValidationEvent, StepValidator, TAccordionSize, TAccordionStyle, TBasePosition, TBaseSideNavSize, TBaseSideNavStyle, TBaseSize, TBaseStatusIconPosition, TBaseStatusSize, TBaseStatusStyle, TBaseStyle, TBehaviourAction, TButtonIconPosition, TButtonShape, TButtonSize, TButtonStyle, TButtonType, TCardStyle, TChipIconPosition, TChipSize, TChipType, TContainerSize, TCustomNgClass, TDividerOrientation, TDividerSpacing, THLJSLanguage, TIconPosition, TInputType, TModalCloseReason, TModalSize, TPillIconPosition, TPillSize, TPillType, TProgressBarAnimation, TProgressBarSize, TProgressBarType, TPulseLoaderSize, TPulseLoaderType, TSectionHeading, TSectionSpacing, TSeparatorSize, TSideNavLink, TSkeletonLoaderSize, TSkeletonLoaderType, TSnackbarCloseReason, TSnackbarPosition, TSnackbarSize, TSnackbarStyle, TSpinnerSize, TSpinnerType, TStepNavigationSource, TStepperMotion, TStepperOrientation, TTabSize, TTabStyle, TTagIconPosition, TTagSize, TTagType, TToastCloseReason, TToastPosition, TToastSize, TToastStyle, TabChangeEvent, TabItem, TabItemContext, Tag, TimeFormat, ToastCloseEvent, ToastStackCloseEvent, ToastStackItem, TooltipPosition, TypeForm, Without, XOR };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tacdaed/fragments",
-  "version": "1.0.0-beta.8",
+  "version": "1.0.0-beta.9",
   "peerDependencies": {
     "@angular/common": "^20.2.0",
     "@angular/core": "^20.2.0",