@ship-ui/core 0.16.1 → 0.16.3

package/index.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { ElementRef, QueryList, ComponentRef, OutputRefSubscription, Type, OutputEmitterRef, AfterViewInit, OnDestroy, AfterContentInit, TemplateRef, WritableSignal, InjectionToken } from '@angular/core';
+import { ElementRef, QueryList, InputSignal, OutputEmitterRef, ComponentRef, OutputRefSubscription, Type, AfterViewInit, OnDestroy, AfterContentInit, TemplateRef, WritableSignal, InjectionToken } from '@angular/core';
 import { NgModel } from '@angular/forms';
 
 type ShipAlertItem = {
@@ -99,12 +99,21 @@ declare class ShipDialog {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<ShipDialog, "sh-dialog", never, { "isOpen": { "alias": "isOpen"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; }, { "isOpen": "isOpenChange"; "closed": "closed"; }, never, ["*"], true, never>;
 }
 
-interface ShipDialogServiceOptions<T = any> extends ShipDialogOptions {
-    data?: T;
-    closed?: (...args: any[]) => void;
+type Exact<T, U> = U extends T ? (keyof U extends keyof T ? U : never) : never;
+type ComponentDataType<T> = T extends {
+    data: InputSignal<infer K>;
+} ? K : void;
+type ComponentClosedType<T> = T extends {
+    closed: OutputEmitterRef<infer U>;
+} ? U : undefined;
+interface ShipDialogServiceOptions<TData = any, TResult = undefined> extends ShipDialogOptions {
+    data?: TData extends void ? void : TData & Exact<TData, TData>;
+    closed?: (res: TResult) => void;
 }
-type ShipDialogReturn<T> = ReturnType<ShipDialogService['open']> & {
+type ShipDialogInstance<T> = {
     component: T;
+    close: (res?: ComponentClosedType<T> | undefined) => void;
+    closed: OutputEmitterRef<ComponentClosedType<T> | undefined>;
 };
 declare class ShipDialogService {
     #private;
@@ -112,11 +121,10 @@ declare class ShipDialogService {
     insertedCompRef: ComponentRef<unknown> | null;
     closedFieldSub: OutputRefSubscription | null;
     compClosedSub: OutputRefSubscription | null;
-    open<T, K = any>(component: Type<T>, options?: ShipDialogServiceOptions<K>): {
-        component: T;
-        close: <U>(arg?: U | undefined) => void;
-        closed: OutputEmitterRef<void>;
-    };
+    open<T extends {
+        data?: InputSignal<any>;
+        closed?: OutputEmitterRef<any>;
+    }, K = ComponentDataType<T>, U = ComponentClosedType<T>, _Options extends ShipDialogServiceOptions<K, U | undefined> = ShipDialogServiceOptions<K, U | undefined>>(component: Type<T>, options?: _Options): ShipDialogInstance<T>;
     ngOnDestroy(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ShipDialogService, never>;
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<ShipDialogService>;
@@ -448,7 +456,7 @@ declare class ShipMenu {
         destroy: () => void;
     };
     optionsEl: _angular_core.Signal<HTMLButtonElement[]>;
-    inputValue: _angular_core.WritableSignal<string | null | undefined>;
+    inputValue: _angular_core.WritableSignal<string | undefined>;
     abortController: AbortController | null;
     optionsEffect: _angular_core.EffectRef;
     keyDownEventListener: (e: KeyboardEvent) => void;
@@ -585,7 +593,7 @@ declare class ShipSelect {
     inputValueEffect: _angular_core.EffectRef;
     inputRefElEffect: _angular_core.EffectRef;
     selectedLabels: _angular_core.Signal<string>;
-    inputState: _angular_core.Signal<"open" | "closed" | "selected" | "loading" | "open-searching" | "searching">;
+    inputState: _angular_core.Signal<"closed" | "selected" | "loading" | "open-searching" | "open" | "searching">;
     hasSearch: _angular_core.Signal<boolean>;
     ngOnInit(): void;
     setInitInput(): void;
@@ -784,6 +792,14 @@ declare class ShipVirtualScroll {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<ShipVirtualScroll, "sh-virtual-scroll", never, {}, {}, never, ["*"], true, never>;
 }
 
+declare class ShipFormFieldExperimental {
+    firstInput: _angular_core.WritableSignal<string | undefined>;
+    hello: _angular_core.EffectRef;
+    myClick(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ShipFormFieldExperimental, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ShipFormFieldExperimental, "sh-form-field-experimental", never, {}, {}, never, ["*"], true, never>;
+}
+
 declare class ShipFileDragDrop {
     filesOver: _angular_core.WritableSignal<boolean>;
     filesDropped: _angular_core.OutputEmitterRef<FileList>;
@@ -850,5 +866,5 @@ interface ShipConfig {
     sidenavType?: 'overlay' | 'simple';
 }
 
-export { GridSortable, SHIP_CONFIG, ShipAlert, ShipAlertContainer, ShipAlertModule, ShipAlertService, ShipBlueprint, ShipButton, ShipButtonGroup, ShipCard, ShipCheckbox, ShipChip, ShipColorPicker, ShipDatepicker, ShipDatepickerInput, ShipDaterangeInput, ShipDialog, ShipDialogService, ShipDivider, ShipEventCard, ShipFileDragDrop, ShipFileUpload, ShipFormField, ShipIcon, ShipInputMask, ShipList, ShipMenu, ShipPopover, ShipPreventWheel, ShipProgressBar, ShipRadio, ShipRangeSlider, ShipResize, ShipSelect, ShipSidenav, ShipSort, ShipSortable, ShipSpinner, ShipStepper, ShipStickyColumns, ShipTable, ShipTabs, ShipToggle, ShipToggleCard, ShipTooltip, ShipTooltipWrapper, ShipVirtualScroll, TEST_NODES, moveIndex, watchHostClass };
-export type { AfterDropResponse, BlueprintNode, Coordinates, ShipAlertItem, ShipAlertItemInternal, ShipAlertType, ShipConfig, ShipDialogOptions, ShipDialogReturn, ShipDialogServiceOptions, ShipPopoverOptions, ShipProgressBarMode, ShipSidenavType };
+export { GridSortable, SHIP_CONFIG, ShipAlert, ShipAlertContainer, ShipAlertModule, ShipAlertService, ShipBlueprint, ShipButton, ShipButtonGroup, ShipCard, ShipCheckbox, ShipChip, ShipColorPicker, ShipDatepicker, ShipDatepickerInput, ShipDaterangeInput, ShipDialog, ShipDialogService, ShipDivider, ShipEventCard, ShipFileDragDrop, ShipFileUpload, ShipFormField, ShipFormFieldExperimental, ShipIcon, ShipInputMask, ShipList, ShipMenu, ShipPopover, ShipPreventWheel, ShipProgressBar, ShipRadio, ShipRangeSlider, ShipResize, ShipSelect, ShipSidenav, ShipSort, ShipSortable, ShipSpinner, ShipStepper, ShipStickyColumns, ShipTable, ShipTabs, ShipToggle, ShipToggleCard, ShipTooltip, ShipTooltipWrapper, ShipVirtualScroll, TEST_NODES, moveIndex, watchHostClass };
+export type { AfterDropResponse, BlueprintNode, ComponentClosedType, ComponentDataType, Coordinates, Exact, ShipAlertItem, ShipAlertItemInternal, ShipAlertType, ShipConfig, ShipDialogInstance, ShipDialogOptions, ShipDialogServiceOptions, ShipPopoverOptions, ShipProgressBarMode, ShipSidenavType };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ship-ui/core",
   "license": "MIT",
-  "version": "0.16.1",
+  "version": "0.16.3",
   "peerDependencies": {
     "@angular/common": ">=20",
     "@angular/core": ">=20"

package/styles/components/ship-menu.scss

@@ -133,7 +133,7 @@ $shipMenu: true !default;
           display: none;
         }
 
-        *:not(button) {
+        > *:not(button) {
           display: none;
         }
       }
@@ -160,13 +160,13 @@ $shipMenu: true !default;
 
       button {
         display: flex;
-        justify-content: flex-start;
-        align-items: center;
+        flex-direction: column;
+        justify-content: center;
         text-align: left;
         min-height: p2r(32);
         margin: p2r(0 8);
-        padding: p2r(0 8);
-        gap: p2r(8);
+        padding: p2r(4 8);
+        gap: p2r(0 8);
         width: calc(100% - #{p2r(16)});
         border-radius: var(--shape-2);
         appearance: none;
@@ -177,6 +177,13 @@ $shipMenu: true !default;
         transition: transform 125ms linear;
         transform: scale(1);
 
+        &.as-row,
+        &:has([suffix]) {
+          justify-content: flex-start;
+          align-items: center;
+          flex-direction: row;
+        }
+
         &:active {
           transform: scale(0.98);
         }

package/styles/components/ship-popover.scss

@@ -36,10 +36,7 @@ $shipPopover: true !default;
 
       .trigger-anchor {
         position: absolute;
-        top: p2r(-4);
-        bottom: p2r(-4);
-        left: 0;
-        right: 0;
+        inset: 0;
         z-index: -1;
       }
     }
@@ -82,9 +79,12 @@ $shipPopover: true !default;
 
       @supports (anchor-name: --anchor) {
         inset: auto;
+        top: p2r(4);
         position: fixed;
         position-area: bottom span-right;
-        position-try-fallbacks: flip-block, flip-inline;
+        position-try-fallbacks:
+          --top-span-right, --bottom-span-left, --top-span-left, --right-span-bottom, --left-span-bottom,
+          --right-center, --left-center, --right-span-top, --left-span-top;
       }
     }
   }
@@ -99,3 +99,63 @@ $shipPopover: true !default;
     }
   }
 }
+
+@position-try --bottom-span-right {
+  position-area: bottom span-right;
+  inset: auto;
+  top: p2r(4);
+}
+
+@position-try --bottom-span-left {
+  position-area: bottom span-left;
+  inset: auto;
+  top: p2r(4);
+}
+
+@position-try --top-span-right {
+  position-area: top span-right;
+  inset: auto;
+  bottom: p2r(4);
+}
+
+@position-try --top-span-left {
+  position-area: top span-left;
+  inset: auto;
+  bottom: p2r(4);
+}
+
+@position-try --right-span-top {
+  position-area: right span-top;
+  inset: auto;
+  left: p2r(4);
+}
+
+@position-try --left-span-top {
+  position-area: left span-top;
+  inset: auto;
+  right: p2r(4);
+}
+
+@position-try --right-center {
+  position-area: right center;
+  inset: auto;
+  left: p2r(4);
+}
+
+@position-try --left-center {
+  position-area: left center;
+  inset: auto;
+  right: p2r(4);
+}
+
+@position-try --right-span-bottom {
+  position-area: right span-bottom;
+  inset: auto;
+  left: p2r(4);
+}
+
+@position-try --left-span-bottom {
+  position-area: left span-bottom;
+  inset: auto;
+  right: p2r(4);
+}