orbiq-neural-ui-kit 1.2.73 → 1.2.75

package/fesm2022/orbiq-neural-ui-kit.mjs

@@ -14522,7 +14522,7 @@ class NeuralSidebarItemComponent {
             routerLinkActive="active"
             #rla="routerLinkActive"
             [attr.aria-label]="tooltipText() || undefined"
-            [title]="isCollapsed() ? tooltipText() : null"
+            [attr.title]="isCollapsed() ? tooltipText() : null"
             [attr.aria-current]="resolvedActive() ? 'page' : undefined"
             class="flex h-full w-full items-center rounded-4 focus-visible:ring-0 focus-visible:focus-ring overflow-hidden transition-all duration-300 ease-in-out"
             (click)="handleClick($event)"
@@ -14533,7 +14533,7 @@ class NeuralSidebarItemComponent {
           <button
             type="button"
             [attr.aria-label]="tooltipText() || undefined"
-            [title]="isCollapsed() ? tooltipText() : null"
+            [attr.title]="isCollapsed() ? tooltipText() : null"
             class="flex h-full w-full text-left items-center rounded-4 focus-visible:ring-0 focus-visible:focus-ring overflow-hidden transition-all duration-300 ease-in-out"
             (click)="handleClick($event)"
           >
@@ -14630,7 +14630,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
             routerLinkActive="active"
             #rla="routerLinkActive"
             [attr.aria-label]="tooltipText() || undefined"
-            [title]="isCollapsed() ? tooltipText() : null"
+            [attr.title]="isCollapsed() ? tooltipText() : null"
             [attr.aria-current]="resolvedActive() ? 'page' : undefined"
             class="flex h-full w-full items-center rounded-4 focus-visible:ring-0 focus-visible:focus-ring overflow-hidden transition-all duration-300 ease-in-out"
             (click)="handleClick($event)"
@@ -14641,7 +14641,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
           <button
             type="button"
             [attr.aria-label]="tooltipText() || undefined"
-            [title]="isCollapsed() ? tooltipText() : null"
+            [attr.title]="isCollapsed() ? tooltipText() : null"
             class="flex h-full w-full text-left items-center rounded-4 focus-visible:ring-0 focus-visible:focus-ring overflow-hidden transition-all duration-300 ease-in-out"
             (click)="handleClick($event)"
           >
@@ -14742,7 +14742,7 @@ class NeuralSidebarHeaderComponent {
         class="flex items-center h-10 rounded-6 transition-all duration-300 ease-in-out cursor-pointer overflow-hidden"
         [ngClass]="isOpen && !isCollapsed() ? 'bg-surface-elevation-2 shadow-sm ring-1 ring-black/5' : 'hover:bg-surface-gray-2'"
         [attr.aria-label]="title()"
-        [title]="isCollapsed() ? title() : null"
+        [attr.title]="isCollapsed() ? title() : null"
       >
         <!-- App Icon Container (32px wide, centers icon exactly) -->
         <div class="flex-none flex items-center justify-center size-8 rounded-[10px] shrink-0" [ngClass]="iconClass()">
@@ -14782,7 +14782,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
         class="flex items-center h-10 rounded-6 transition-all duration-300 ease-in-out cursor-pointer overflow-hidden"
         [ngClass]="isOpen && !isCollapsed() ? 'bg-surface-elevation-2 shadow-sm ring-1 ring-black/5' : 'hover:bg-surface-gray-2'"
         [attr.aria-label]="title()"
-        [title]="isCollapsed() ? title() : null"
+        [attr.title]="isCollapsed() ? title() : null"
       >
         <!-- App Icon Container (32px wide, centers icon exactly) -->
         <div class="flex-none flex items-center justify-center size-8 rounded-[10px] shrink-0" [ngClass]="iconClass()">
@@ -16085,6 +16085,124 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                 }]
         }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }] } });
 
+class NeuralAuthShellComponent {
+    title = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
+    subtitlePrefix = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "subtitlePrefix" }] : /* istanbul ignore next */ []));
+    subtitleLinkText = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "subtitleLinkText" }] : /* istanbul ignore next */ []));
+    subtitleLinkHref = input('#', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "subtitleLinkHref" }] : /* istanbul ignore next */ []));
+    logoIcon = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "logoIcon" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralAuthShellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: NeuralAuthShellComponent, isStandalone: true, selector: "neural-auth-shell", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitlePrefix: { classPropertyName: "subtitlePrefix", publicName: "subtitlePrefix", isSignal: true, isRequired: false, transformFunction: null }, subtitleLinkText: { classPropertyName: "subtitleLinkText", publicName: "subtitleLinkText", isSignal: true, isRequired: false, transformFunction: null }, subtitleLinkHref: { classPropertyName: "subtitleLinkHref", publicName: "subtitleLinkHref", isSignal: true, isRequired: false, transformFunction: null }, logoIcon: { classPropertyName: "logoIcon", publicName: "logoIcon", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <div data-slot="auth-shell" class="min-h-screen flex bg-surface-base font-sans">
+      <!-- Branding / Image Side (Left) -->
+      <div class="hidden lg:flex lg:w-1/2 xl:w-7/12 relative bg-surface-gray-2 dark:bg-surface-gray-8 items-center justify-center overflow-hidden">
+        <!-- Dynamic Background Gradient -->
+        <div class="absolute inset-0 bg-gradient-to-br from-primary/10 to-primary/5 dark:from-primary/20 dark:to-primary/5"></div>
+        
+        <div class="relative z-10 p-12 text-center flex flex-col items-center max-w-lg">
+          @if (logoIcon()) {
+            <div class="size-16 mb-8 flex items-center justify-center rounded-2xl bg-white/50 dark:bg-black/20 backdrop-blur-md shadow-sm border border-white/40 dark:border-white/10">
+              <neural-icon [name]="logoIcon()" class="size-8 text-ink-base"></neural-icon>
+            </div>
+          }
+          <h1 class="text-4xl font-bold tracking-tight text-ink-base mb-4">{{ title() }}</h1>
+          <p class="text-lg text-ink-muted">
+            {{ subtitlePrefix() }}
+            @if (subtitleLinkText() && subtitleLinkHref()) {
+              <a [href]="subtitleLinkHref()" class="font-semibold text-primary hover:text-primary-dark transition-colors">{{ subtitleLinkText() }}</a>
+            }
+          </p>
+        </div>
+      </div>
+
+      <!-- Form Side (Right) -->
+      <div class="flex-1 flex flex-col justify-center py-12 px-4 sm:px-6 lg:px-20 xl:px-24 bg-surface-base lg:border-l border-outline-base shadow-2xl relative z-20">
+        <div class="mx-auto w-full max-w-sm lg:max-w-md">
+          <!-- Mobile Header (Visible only on small screens) -->
+          <div class="lg:hidden text-center mb-10 flex flex-col items-center">
+            @if (logoIcon()) {
+              <div class="size-12 mb-6 flex items-center justify-center rounded-xl bg-white dark:bg-surface-gray-8 shadow-sm border border-outline-base">
+                <neural-icon [name]="logoIcon()" class="size-6 text-ink-base"></neural-icon>
+              </div>
+            }
+            <h2 class="text-3xl font-bold tracking-tight text-ink-base">{{ title() }}</h2>
+            <p class="mt-2 text-sm text-ink-muted">
+              {{ subtitlePrefix() }}
+              @if (subtitleLinkText() && subtitleLinkHref()) {
+                <a [href]="subtitleLinkHref()" class="font-semibold text-primary hover:text-primary-dark transition-colors">{{ subtitleLinkText() }}</a>
+              }
+            </p>
+          </div>
+          
+          <!-- Content Projection for the form -->
+          <ng-content></ng-content>
+        </div>
+      </div>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: NeuralIconComponent, selector: "neural-icon", inputs: ["name"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralAuthShellComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'neural-auth-shell',
+                    standalone: true,
+                    imports: [CommonModule, NeuralIconComponent],
+                    template: `
+    <div data-slot="auth-shell" class="min-h-screen flex bg-surface-base font-sans">
+      <!-- Branding / Image Side (Left) -->
+      <div class="hidden lg:flex lg:w-1/2 xl:w-7/12 relative bg-surface-gray-2 dark:bg-surface-gray-8 items-center justify-center overflow-hidden">
+        <!-- Dynamic Background Gradient -->
+        <div class="absolute inset-0 bg-gradient-to-br from-primary/10 to-primary/5 dark:from-primary/20 dark:to-primary/5"></div>
+        
+        <div class="relative z-10 p-12 text-center flex flex-col items-center max-w-lg">
+          @if (logoIcon()) {
+            <div class="size-16 mb-8 flex items-center justify-center rounded-2xl bg-white/50 dark:bg-black/20 backdrop-blur-md shadow-sm border border-white/40 dark:border-white/10">
+              <neural-icon [name]="logoIcon()" class="size-8 text-ink-base"></neural-icon>
+            </div>
+          }
+          <h1 class="text-4xl font-bold tracking-tight text-ink-base mb-4">{{ title() }}</h1>
+          <p class="text-lg text-ink-muted">
+            {{ subtitlePrefix() }}
+            @if (subtitleLinkText() && subtitleLinkHref()) {
+              <a [href]="subtitleLinkHref()" class="font-semibold text-primary hover:text-primary-dark transition-colors">{{ subtitleLinkText() }}</a>
+            }
+          </p>
+        </div>
+      </div>
+
+      <!-- Form Side (Right) -->
+      <div class="flex-1 flex flex-col justify-center py-12 px-4 sm:px-6 lg:px-20 xl:px-24 bg-surface-base lg:border-l border-outline-base shadow-2xl relative z-20">
+        <div class="mx-auto w-full max-w-sm lg:max-w-md">
+          <!-- Mobile Header (Visible only on small screens) -->
+          <div class="lg:hidden text-center mb-10 flex flex-col items-center">
+            @if (logoIcon()) {
+              <div class="size-12 mb-6 flex items-center justify-center rounded-xl bg-white dark:bg-surface-gray-8 shadow-sm border border-outline-base">
+                <neural-icon [name]="logoIcon()" class="size-6 text-ink-base"></neural-icon>
+              </div>
+            }
+            <h2 class="text-3xl font-bold tracking-tight text-ink-base">{{ title() }}</h2>
+            <p class="mt-2 text-sm text-ink-muted">
+              {{ subtitlePrefix() }}
+              @if (subtitleLinkText() && subtitleLinkHref()) {
+                <a [href]="subtitleLinkHref()" class="font-semibold text-primary hover:text-primary-dark transition-colors">{{ subtitleLinkText() }}</a>
+              }
+            </p>
+          </div>
+          
+          <!-- Content Projection for the form -->
+          <ng-content></ng-content>
+        </div>
+      </div>
+    </div>
+  `
+                }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitlePrefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitlePrefix", required: false }] }], subtitleLinkText: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitleLinkText", required: false }] }], subtitleLinkHref: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitleLinkHref", required: false }] }], logoIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "logoIcon", required: false }] }] } });
+
 /*
  * Public API Surface of neural-ui-kit
  */
@@ -16094,5 +16212,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { NeuralAccordionComponent, NeuralAlertComponent, NeuralAppLauncherComponent, NeuralAvatarComponent, NeuralAwesomeBarComponent, NeuralAxisChartComponent, NeuralBadgeComponent, NeuralBottomSheetComponent, NeuralBreadcrumbsComponent, NeuralButtonComponent, NeuralCalendarComponent, NeuralCheckboxComponent, NeuralCodeEditorComponent, NeuralCodePreviewComponent, NeuralComboboxComponent, NeuralCommandPaletteComponent, NeuralContextMenuComponent, NeuralDataTableComponent, NeuralDatePickerComponent, NeuralDesktopShellComponent, NeuralDialogComponent, NeuralDividerComponent, NeuralDonutChartComponent, NeuralDrawerComponent, NeuralDropdownComponent, NeuralDurationComponent, NeuralEChartsComponent, NeuralEntityFormComponent, NeuralErrorMessageComponent, NeuralFileUploaderComponent, NeuralFilterBuilderComponent, NeuralFloatingWindowComponent, NeuralFooterComponent, NeuralFormControlComponent, NeuralFormLabelComponent, NeuralFunnelChartComponent, NeuralHoverCardComponent, NeuralIconComponent, NeuralInputDescriptionComponent, NeuralInputErrorComponent, NeuralInputLabelComponent, NeuralItemListRowComponent, NeuralKeyboardShortcutComponent, NeuralKeyboardShortcutsDialogComponent, NeuralLabelingWrapperComponent, NeuralListViewComponent, NeuralLoadingIndicatorComponent, NeuralLoadingTextComponent, NeuralMenuComponent, NeuralMobileNavComponent, NeuralMobileNavItemComponent, NeuralMobileShellComponent, NeuralMultiEmailInputComponent, NeuralMultiSelectComponent, NeuralNotificationCenterComponent, NeuralNumberChartComponent, NeuralPageHeaderComponent, NeuralPasswordComponent, NeuralPopoverComponent, NeuralPopoverContentDirective, NeuralPopoverPanelComponent, NeuralPopoverTriggerDirective, NeuralProgressComponent, NeuralRadioComponent, NeuralRadioGroupComponent, NeuralRailComponent, NeuralRailItemComponent, NeuralRatingComponent, NeuralRequiredIndicatorComponent, NeuralScrollAreaComponent, NeuralSearchTriggerComponent, NeuralSelectComponent, NeuralSettingsContentComponent, NeuralSettingsDialogComponent, NeuralSettingsNavItemComponent, NeuralSettingsPanelComponent, NeuralSettingsSidebarComponent, NeuralSidebarComponent, NeuralSidebarFooterComponent, NeuralSidebarHeaderComponent, NeuralSidebarItemComponent, NeuralSkeletonComponent, NeuralSliderComponent, NeuralSpinnerComponent, NeuralSubGridComponent, NeuralSwitchComponent, NeuralTabComponent, NeuralTabPanelComponent, NeuralTabsComponent, NeuralTextEditorComponent, NeuralTextInputComponent, NeuralTextareaComponent, NeuralThemeSwitcherComponent, NeuralTimePickerComponent, NeuralToastComponent, NeuralTooltipComponent, NeuralTreeComponent, NeuralTreeItemComponent, RADIO_GROUP, TABS_ROOT, ToastService, formatDuration, parseDuration };
+export { NeuralAccordionComponent, NeuralAlertComponent, NeuralAppLauncherComponent, NeuralAuthShellComponent, NeuralAvatarComponent, NeuralAwesomeBarComponent, NeuralAxisChartComponent, NeuralBadgeComponent, NeuralBottomSheetComponent, NeuralBreadcrumbsComponent, NeuralButtonComponent, NeuralCalendarComponent, NeuralCheckboxComponent, NeuralCodeEditorComponent, NeuralCodePreviewComponent, NeuralComboboxComponent, NeuralCommandPaletteComponent, NeuralContextMenuComponent, NeuralDataTableComponent, NeuralDatePickerComponent, NeuralDesktopShellComponent, NeuralDialogComponent, NeuralDividerComponent, NeuralDonutChartComponent, NeuralDrawerComponent, NeuralDropdownComponent, NeuralDurationComponent, NeuralEChartsComponent, NeuralEntityFormComponent, NeuralErrorMessageComponent, NeuralFileUploaderComponent, NeuralFilterBuilderComponent, NeuralFloatingWindowComponent, NeuralFooterComponent, NeuralFormControlComponent, NeuralFormLabelComponent, NeuralFunnelChartComponent, NeuralHoverCardComponent, NeuralIconComponent, NeuralInputDescriptionComponent, NeuralInputErrorComponent, NeuralInputLabelComponent, NeuralItemListRowComponent, NeuralKeyboardShortcutComponent, NeuralKeyboardShortcutsDialogComponent, NeuralLabelingWrapperComponent, NeuralListViewComponent, NeuralLoadingIndicatorComponent, NeuralLoadingTextComponent, NeuralMenuComponent, NeuralMobileNavComponent, NeuralMobileNavItemComponent, NeuralMobileShellComponent, NeuralMultiEmailInputComponent, NeuralMultiSelectComponent, NeuralNotificationCenterComponent, NeuralNumberChartComponent, NeuralPageHeaderComponent, NeuralPasswordComponent, NeuralPopoverComponent, NeuralPopoverContentDirective, NeuralPopoverPanelComponent, NeuralPopoverTriggerDirective, NeuralProgressComponent, NeuralRadioComponent, NeuralRadioGroupComponent, NeuralRailComponent, NeuralRailItemComponent, NeuralRatingComponent, NeuralRequiredIndicatorComponent, NeuralScrollAreaComponent, NeuralSearchTriggerComponent, NeuralSelectComponent, NeuralSettingsContentComponent, NeuralSettingsDialogComponent, NeuralSettingsNavItemComponent, NeuralSettingsPanelComponent, NeuralSettingsSidebarComponent, NeuralSidebarComponent, NeuralSidebarFooterComponent, NeuralSidebarHeaderComponent, NeuralSidebarItemComponent, NeuralSkeletonComponent, NeuralSliderComponent, NeuralSpinnerComponent, NeuralSubGridComponent, NeuralSwitchComponent, NeuralTabComponent, NeuralTabPanelComponent, NeuralTabsComponent, NeuralTextEditorComponent, NeuralTextInputComponent, NeuralTextareaComponent, NeuralThemeSwitcherComponent, NeuralTimePickerComponent, NeuralToastComponent, NeuralTooltipComponent, NeuralTreeComponent, NeuralTreeItemComponent, RADIO_GROUP, TABS_ROOT, ToastService, formatDuration, parseDuration };
 //# sourceMappingURL=orbiq-neural-ui-kit.mjs.map