@brickclay-org/ui 0.0.80 → 0.0.81

package/fesm2022/brickclay-org-ui.mjs

@@ -7320,6 +7320,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Output
             }] } });
 
+class BkLoader {
+    loading = false;
+    variant = 'dots';
+    frontAfter = false;
+    constructor() {
+        const duration = 2000;
+        const pause = 500;
+        setInterval(() => {
+            setTimeout(() => (this.frontAfter = !this.frontAfter), pause);
+        }, duration + pause);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BkLoader, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: BkLoader, isStandalone: true, selector: "bk-loader", inputs: { loading: "loading", variant: "variant" }, ngImport: i0, template: "    @if (loading) {\r\n      <div\r\n        class=\"lg:h-[calc(100vh-80px)] lg:w-[calc(100vw-79px)] h-[calc(100vh-76px)] w-[calc(100vw-33px)] top-[59px] lg:left-[58px] left-[17px] right-0 bottom-6 bg-[#00000047] backdrop-blur-[2px] flex justify-center flex-col gap-4 items-center fixed z-[99999] rounded-xl\"\r\n      >\r\n        @switch (variant) {\r\n          @case ('dots') {\r\n            <div class=\"grid-loader\" [class.front-after]=\"frontAfter\">\r\n              <div class=\"grid-circle grid-filled\"></div>\r\n              <div class=\"grid-circle grid-outline\"></div>\r\n            </div>\r\n          }\r\n\r\n          @case ('spinners') {\r\n            <div class=\"grid-spinner\"></div>\r\n          }\r\n        }\r\n      </div>\r\n    }\r\n", styles: [".grid-loader{position:relative;width:66px;height:34px}.grid-circle{position:absolute;top:0;width:32px;height:32px;border-radius:50%;animation-duration:2s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.grid-filled{left:0;background:#141414;animation-name:moveLeft;z-index:2;border:2px solid #141414;width:34px;height:34px}.grid-outline{right:0;border:2px solid #141414;background:#b8b8b8;animation-name:moveRight;z-index:1}.grid-loader.front-after .grid-filled{z-index:1}.grid-loader.front-after .grid-outline{z-index:2}@keyframes moveLeft{0%,10%{transform:translate(0)}50%,60%{transform:translate(32px)}to{transform:translate(0)}}@keyframes moveRight{0%,10%{transform:translate(0)}50%,60%{transform:translate(-32px)}to{transform:translate(0)}}.grid-spinner{width:48px;height:48px;border:5px solid #ccc;border-top-color:#000;border-right-color:#000;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BkLoader, decorators: [{
+            type: Component,
+            args: [{ selector: 'bk-loader', standalone: true, imports: [CommonModule], template: "    @if (loading) {\r\n      <div\r\n        class=\"lg:h-[calc(100vh-80px)] lg:w-[calc(100vw-79px)] h-[calc(100vh-76px)] w-[calc(100vw-33px)] top-[59px] lg:left-[58px] left-[17px] right-0 bottom-6 bg-[#00000047] backdrop-blur-[2px] flex justify-center flex-col gap-4 items-center fixed z-[99999] rounded-xl\"\r\n      >\r\n        @switch (variant) {\r\n          @case ('dots') {\r\n            <div class=\"grid-loader\" [class.front-after]=\"frontAfter\">\r\n              <div class=\"grid-circle grid-filled\"></div>\r\n              <div class=\"grid-circle grid-outline\"></div>\r\n            </div>\r\n          }\r\n\r\n          @case ('spinners') {\r\n            <div class=\"grid-spinner\"></div>\r\n          }\r\n        }\r\n      </div>\r\n    }\r\n", styles: [".grid-loader{position:relative;width:66px;height:34px}.grid-circle{position:absolute;top:0;width:32px;height:32px;border-radius:50%;animation-duration:2s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.grid-filled{left:0;background:#141414;animation-name:moveLeft;z-index:2;border:2px solid #141414;width:34px;height:34px}.grid-outline{right:0;border:2px solid #141414;background:#b8b8b8;animation-name:moveRight;z-index:1}.grid-loader.front-after .grid-filled{z-index:1}.grid-loader.front-after .grid-outline{z-index:2}@keyframes moveLeft{0%,10%{transform:translate(0)}50%,60%{transform:translate(32px)}to{transform:translate(0)}}@keyframes moveRight{0%,10%{transform:translate(0)}50%,60%{transform:translate(-32px)}to{transform:translate(0)}}.grid-spinner{width:48px;height:48px;border:5px solid #ccc;border-top-color:#000;border-right-color:#000;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { loading: [{
+                type: Input
+            }], variant: [{
+                type: Input
+            }] } });
+
 /*
  * Public API Surface of brickclay-lib
  */
@@ -7329,5 +7352,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { BKTooltipDirective, BK_DEFAULT_DIALOG_CONFIG, BK_DIALOG_DATA, BK_DIALOG_GLOBAL_CONFIG, BkAvatar, BkAvatarUploader, BkBadge, BkButton, BkButtonGroup, BkCalendarManagerService, BkCheckbox, BkColumnFilterService, BkColumnSelect, BkCustomCalendar, BkDialogActions, BkDialogClose, BkDialogContent, BkDialogModule, BkDialogRef, BkDialogService, BkDialogTitle, BkFileCard, BkFilePicker, BkGrid, BkHierarchicalSelect, BkIconButton, BkInput, BkInputChips, BkPagination, BkPill, BkRadioButton, BkScheduledDatePicker, BkSelect, BkSpinner, BkTabs, BkTextarea, BkTimePicker, BkToastr, BkToastrService, BkToggle, BkValidator, BrickclayIcons, BrickclayLib, CalendarModule, CalendarSelection, ColumnFilterOption, getDialogBackdropAnimation, getDialogPanelAnimation };
+export { BKTooltipDirective, BK_DEFAULT_DIALOG_CONFIG, BK_DIALOG_DATA, BK_DIALOG_GLOBAL_CONFIG, BkAvatar, BkAvatarUploader, BkBadge, BkButton, BkButtonGroup, BkCalendarManagerService, BkCheckbox, BkColumnFilterService, BkColumnSelect, BkCustomCalendar, BkDialogActions, BkDialogClose, BkDialogContent, BkDialogModule, BkDialogRef, BkDialogService, BkDialogTitle, BkFileCard, BkFilePicker, BkGrid, BkHierarchicalSelect, BkIconButton, BkInput, BkInputChips, BkLoader, BkPagination, BkPill, BkRadioButton, BkScheduledDatePicker, BkSelect, BkSpinner, BkTabs, BkTextarea, BkTimePicker, BkToastr, BkToastrService, BkToggle, BkValidator, BrickclayIcons, BrickclayLib, CalendarModule, CalendarSelection, ColumnFilterOption, getDialogBackdropAnimation, getDialogPanelAnimation };
 //# sourceMappingURL=brickclay-org-ui.mjs.map