@elderbyte/ngx-starter 20.12.0-beta.2 → 20.12.0-beta.4

package/index.d.ts

@@ -4077,6 +4077,18 @@ declare const booleanTransformFn: (input: BooleanInput) => boolean;
 
 declare const someSignal: <T>(items: readonly T[], fn: (item: T) => boolean) => boolean;
 
+/**
+ * Helper type to build an array of a specific length
+ */
+type BuildArray<Length extends number, Acc extends unknown[] = []> = Acc['length'] extends Length ? Acc : BuildArray<Length, [...Acc, unknown]>;
+/**
+ * Creates a union type of numbers from Start to End (inclusive)
+ * @example
+ * type NumberFromZeroToTen = InclusiveRange<1, 10> // 1 | 2 | 3 | ... | 10
+ */
+type InclusiveRange<Start extends number, End extends number, Acc extends unknown[] = BuildArray<Start>> = Acc['length'] extends End ? End | Acc[number] : InclusiveRange<Start, End, [...Acc, Acc['length']]>;
+type Percentage = InclusiveRange<0, 100>;
+
 declare class FilterUtil {
     private static readonly log;
     static equals(aFilters: Filter[], bFilters: Filter[]): boolean;
@@ -17491,50 +17503,71 @@ declare class ElderTabModule {
 }
 
 declare class ElderDraggablePaneDirective implements OnDestroy {
+    private readonly logger;
     private readonly elementRef;
-    isActive: i0.InputSignal<boolean>;
-    minWidth: i0.InputSignal<number>;
-    maxWidth: i0.InputSignal<number>;
-    handlePosition: i0.InputSignal<"start" | "end">;
-    initialWidthCss: i0.InputSignal<string>;
-    widthMode: i0.WritableSignal<"dynamic" | "initial">;
-    isDragging: i0.WritableSignal<boolean>;
-    widthInPercent: i0.WritableSignal<number>;
-    constrainedWidth: i0.Signal<number>;
-    isInitialized: i0.Signal<boolean>;
+    private readonly renderer;
+    /***************************************************************************
+     *                                                                         *
+     * Inputs                                                                  *
+     *                                                                         *
+     **************************************************************************/
+    readonly minWidth: i0.InputSignal<0 | 1 | 2 | 6 | 9 | 3 | 4 | 5 | 30 | 50 | 100 | 10 | 8 | 24 | 7 | 23 | 19 | 60 | 45 | 90 | 22 | 36 | 25 | 59 | 12 | 16 | 15 | 11 | 13 | 14 | 17 | 18 | 20 | 21 | 26 | 27 | 28 | 29 | 31 | 32 | 33 | 34 | 35 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 46 | 47 | 48 | 49 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99>;
+    readonly maxWidth: i0.InputSignal<0 | 1 | 2 | 6 | 9 | 3 | 4 | 5 | 30 | 50 | 100 | 10 | 8 | 24 | 7 | 23 | 19 | 60 | 45 | 90 | 22 | 36 | 25 | 59 | 12 | 16 | 15 | 11 | 13 | 14 | 17 | 18 | 20 | 21 | 26 | 27 | 28 | 29 | 31 | 32 | 33 | 34 | 35 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 46 | 47 | 48 | 49 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99>;
+    readonly handlePosition: i0.InputSignal<"start" | "end">;
+    readonly handleDisabled: i0.InputSignal<boolean>;
+    /***************************************************************************
+     *                                                                         *
+     * State                                                                   *
+     *                                                                         *
+     **************************************************************************/
+    protected readonly isInComputedWidthMode: i0.WritableSignal<boolean>;
+    protected readonly isDragging: i0.WritableSignal<boolean>;
+    protected readonly widthInPercent: i0.WritableSignal<number>;
+    private containerWidth;
     private dragStartMousePosX;
     private dragStartPaneWidthInPercent;
-    private containerWidthInPx;
-    onMouseUp(): void;
     /***************************************************************************
      *                                                                         *
-     * Constructor                                                             *
+     * Computed                                                                *
      *                                                                         *
      **************************************************************************/
-    constructor();
+    protected constrainedWidth: i0.Signal<number>;
     /***************************************************************************
      *                                                                         *
-     * Lifecycle methods                                                      *
+     * Observables                                                             *
      *                                                                         *
      **************************************************************************/
-    ngOnDestroy(): void;
+    readonly mouseDown$: Subject<MouseEvent>;
+    private readonly mouseMove$;
+    private readonly mouseUp$;
+    private readonly drag$;
+    /***************************************************************************
+     *                                                                         *
+     * Constructor                                                             *
+     *                                                                         *
+     **************************************************************************/
+    constructor();
     /***************************************************************************
      *                                                                         *
-     * Public API                                                          *
+     * Life Cycle                                                              *
      *                                                                         *
      **************************************************************************/
-    onMouseDown(event: MouseEvent): void;
+    ngOnDestroy(): void;
     /***************************************************************************
      *                                                                         *
      * Private methods                                                         *
      *                                                                         *
      **************************************************************************/
+    private removeExternalWidthStyles;
+    private setWidthStyle;
+    private processDragStart;
+    private processDragEnd;
+    private initializeIfNecessary;
     private setWidthInPercentFromElementWidth;
-    private startEventListenerMouseMove;
-    private stopEventListenerMouseMove;
+    private updateContainerWidth;
     private handleMouseMove;
     static ɵfac: i0.ɵɵFactoryDeclaration<ElderDraggablePaneDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ElderDraggablePaneDirective, "[elderDraggablePane]", never, { "isActive": { "alias": "isActive"; "required": false; "isSignal": true; }; "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "handlePosition": { "alias": "handlePosition"; "required": false; "isSignal": true; }; "initialWidthCss": { "alias": "initialWidthCss"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ElderDraggablePaneDirective, "[elderDraggablePane]", never, { "minWidth": { "alias": "minWidth"; "required": false; "isSignal": true; }; "maxWidth": { "alias": "maxWidth"; "required": false; "isSignal": true; }; "handlePosition": { "alias": "handlePosition"; "required": false; "isSignal": true; }; "handleDisabled": { "alias": "handleDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class ElderPaneComponent {
@@ -18285,4 +18318,4 @@ declare class KafentModule {
 }
 
 export { ActivationEventSource, ActivationModel, Arrays, AuditedEntity, AutoStartSpec, Batcher, BlobUrl, BytesFormat, BytesPerSecondFormat, BytesPipe, CardDropEvent, CardOrganizerData, CardStack, CollectionUtil, CommonValidationMessageStrategy, ComparatorBuilder, CompositeSort, ConfirmDialogConfig, ContinuableListing, CountryPhoneFormatService, CsvColumnSpec, CsvSerializer, CsvSpec, CsvStreamExporter, CsvStreamExporterBuilder, CsvStreamExporterBuilderService, CuratedDataSource, CuratedListDataSource, CuratedPagedDataSource, Currency, CurrencyCode, CurrencyFormatUtil, CurrencyUnit, CurrencyUnitRegistry, CustomDateAdapter, CustomMatcherSpec, DataContextActivePage, DataContextAutoStarter, DataContextBase, DataContextBuilder, DataContextContinuableBase, DataContextContinuablePaged, DataContextContinuableToken, DataContextLifeCycleBinding, DataContextRange, DataContextSelectionDirective, DataContextSimple, DataContextSnapshot, DataContextSourceEventBinding, DataContextStateIndicatorComponent, DataContextStatus, DataSelectionController, DataSourceAdapter, DataSourceBase, DataSourceChangeEvent, DataSourceEntityPatch, DataSourceProcessor, DataTransferFactory, DataTransferProgress, DataTransferProgressAggregate, DataTransferState, DataTransferStatus, DataViewActivationController, DataViewDndControllerService, DataViewDndGroupControllerService, DataViewDndModelUtil, DataViewDragEnteredEvent, DataViewDragExitedEvent, DataViewIframeAdapterDirective, DataViewIframeComponent, DataViewInteractionControllerDirective, DataViewItemDropEvent, DataViewMessage, DataViewMessageTypeValues, DataViewOptionsProviderBinding, DataViewSelection, DataViewSelectionInit, DateUtil, DelegateContinuableDataSource, DelegateDataSource, DelegateListDataSource, DelegatePagedDataSource, Dimensions, DomUtil, DrawerOutletBinding, DurationBucket, DurationFormat, DurationFormatUtil, DynamicValidationMessageStrategy, ELDER_DATA_VIEW, ELDER_SELECT_BASE, ElderAccessDeniedComponent, ElderAccessDeniedModule, ElderAppHeaderComponent, ElderAppearanceSettingsComponent, ElderAuditModule, ElderAuditedEntityComponent, ElderAutoSelectFirstDirective, ElderAutoSelectSuggestFirstDirective, ElderAutocompleteDirective, ElderAutocompleteManyDirective, ElderAutocompleteModule, ElderBadgeDirective, ElderBasicPaneLayoutComponent, ElderBlobViewerComponent, ElderBreadCrumbsComponent, ElderBreadCrumbsModule, ElderButtonGroupComponent, ElderButtonGroupModule, ElderCardComponent, ElderCardContentDirective, ElderCardHeaderActionsDirective, ElderCardHeaderComponent, ElderCardModule, ElderCardOrganizerComponent, ElderCardOrganizerModule, ElderCardPanelComponent, ElderCardStackComponent, ElderCardSubtitleDirective, ElderCardTitleDirective, ElderCenterCellDirective, ElderChipLabelDirective, ElderChipListSelectComponent, ElderChipListSelectModule, ElderChipsIncludeExcludeDirective, ElderChipsModule, ElderClearSelectDirective, ElderClipboardPutDirective, ElderClipboardService, ElderCompositeSortComponent, ElderCompositeSortDcDirective, ElderConfirmDialogComponent, ElderConnectivityModule, ElderConnectivityService, ElderContainersModule, ElderContinuatorComponent, ElderCsvExportBtnComponent, ElderCsvModule, ElderCurrencyModule, ElderCurrencyPipe, ElderDataActivationDirective, ElderDataCommonModule, ElderDataToolbarComponent, ElderDataTransferModule, ElderDataTransferService, ElderDataViewBaseComponent, ElderDataViewDndDirective, ElderDataViewDndGroupDirective, ElderDataViewItemDragDirective, ElderDataViewOptions, ElderDataViewOptionsProvider, ElderDateSwitcherComponent, ElderDateTimeInputComponent, ElderDelayedFocusDirective, ElderDeleteActiveDirective, ElderDetailDialogComponent, ElderDetailDirective, ElderDialogConfig, ElderDialogModule, ElderDialogPanelComponent, ElderDialogService, ElderDimensionsInputComponent, ElderDraggablePaneDirective, ElderDropZoneComponent, ElderDurationInputComponent, ElderEntityValueAccessorUtil, ElderEnumTranslationService, ElderErrorModule, ElderEventSourceService, ElderExceptionDetailComponent, ElderExpandToggleButtonComponent, ElderExpandToggleButtonModule, ElderFileDropZoneDirective, ElderFileModule, ElderFileSelectComponent, ElderFileSelectDirective, ElderFileUploadComponent, ElderFilterChipTemplateComponent, ElderFormFieldControlBase, ElderFormFieldDenseDirective, ElderFormFieldLabelDirective, ElderFormFieldNoHintDirective, ElderFormFieldNoSpinnerDirective, ElderFormsDirectivesModule, ElderFormsModule, ElderFromFieldBase, ElderFromFieldEntityBase, ElderFromFieldMultiEntityBase, ElderGridActivationDirective, ElderGridComponent, ElderGridModule, ElderGridTileDirective, ElderGridToolbarDirective, ElderHeaderComponent, ElderHeaderModule, ElderI18nEntitiesModule, ElderIFrameModule, ElderInfiniteAutocompleteDirective, ElderInfiniteScrollDirective, ElderInfiniteScrollModule, ElderInputPatternDirective, ElderIntervalInputComponent, ElderIntervalPickerBindingDirective, ElderIntervalPickerComponent, ElderIntervalPickerToggleComponent, ElderKeyEventDirective, ElderLabelInputComponent, ElderLabelsModule, ElderLanguageConfig, ElderLanguageInterceptor, ElderLanguageModule, ElderLanguageService, ElderLanguageSwitcherComponent, ElderLocalDateInputComponent, ElderLocalDndSupportDirective, ElderLocalTimeInputComponent, ElderLocalesDeChModule, ElderLocalizedInputComponent, ElderLocalizedInputDialogComponent, ElderLocalizedInputDialogService, ElderLocalizedInputTableComponent, ElderLocalizedTextColumnDirective, ElderLocalizedTextsDirective, ElderLock, ElderLockContext, ElderLockContextDirective, ElderLockManagerService, ElderLockWarningService, ElderMasterActivationDirective, ElderMasterDetailComponent, ElderMasterDetailModule, ElderMasterDetailService, ElderMasterDirective, ElderMaxValidator, ElderMeasuresModule, ElderMinValidator, ElderMultiEntityValueAccessorUtil, ElderMultiSelectAllInitialDirective, ElderMultiSelectBase, ElderMultiSelectChipOptionsComponent, ElderMultiSelectChipsComponent, ElderMultiSelectChipsOptionsDirective, ElderMultiSelectFormField, ElderMultiTranslateHttpLoader, ElderMultipleOfUtil, ElderMultipleOfValidator, ElderNavGroupComponent, ElderNavLinkComponent, ElderNavListComponent, ElderNavModule, ElderNextFocusableDirective, ElderNumberCellDirective, ElderOfflineIndicatorComponent, ElderOverlayComponent, ElderOverlayModule, ElderOverlayOriginDirective, ElderOverlayRef, ElderOverlayTriggerDirective, ElderPaddingDirective, ElderPaneActionsComponent, ElderPaneComponent, ElderPaneContentComponent, ElderPaneHeaderComponent, ElderPaneSubtitleComponent, ElderPaneTitleComponent, ElderPanelModule, ElderPeriodInputComponent, ElderPipesModule, ElderPlugParentFormDirective, ElderProgressBarComponent, ElderProgressBarModule, ElderQuantityFormFieldComponent, ElderQuantityInputControlComponent, ElderQuantityPipe, ElderQuantityRangeValidator, ElderQuantityService, ElderQuantityTransformPipe, ElderQuestionDialogComponent, ElderRailNavDirective, ElderRepeatPipe, ElderRequiredDimensionsValidator, ElderRequiredIgnoreZeroValidator, ElderRequiredQuantityValidator, ElderRoundPipe, ElderRouteOutletDrawerService, ElderRouterOutletService, ElderRouterService, ElderSafeUrlPipe, ElderScrollContainerComponent, ElderScrollbarDirective, ElderScrollbarModule, ElderSearchBoxComponent, ElderSearchContextDirective, ElderSearchIncludeExcludeDirective, ElderSearchInputDirective, ElderSearchModule, ElderSearchPanelComponent, ElderSearchUrlDirective, ElderSelectBase, ElderSelectChipAvatarDirective, ElderSelectChipDirective, ElderSelectComponent, ElderSelectComponentState, ElderSelectCustomInputDirective, ElderSelectFormField, ElderSelectModule, ElderSelectOnTabDirective, ElderSelectOptionComponent, ElderSelectValueDirective, ElderSelectionDialogComponent, ElderSelectionDialogDirective, ElderSelectionMasterCheckboxComponent, ElderSelectionPopupTriggerAdapterDirective, ElderShellCenterDirective, ElderShellComponent, ElderShellModule, ElderShellNavigationToggleComponent, ElderShellService, ElderShellSideLeftDirective, ElderShellSideRightDirective, ElderShellSlotDirective, ElderShellStaticNavSlotDirective, ElderSimpleSelectionViewComponent, ElderSimpleSelectionViewModule, ElderSinglePaneWrapperComponent, ElderSingleSortComponent, ElderSingleStateCheckboxDirective, ElderStackCardDirective, ElderStaticNavToggleComponent, ElderStopEventPropagationDirective, ElderSuggestionPanelComponent, ElderSvgViewerComponent, ElderTabDirective, ElderTabFocusTrapDirective, ElderTabGroupRoutingDirective, ElderTabModule, ElderTableActivationDirective, ElderTableComponent, ElderTableDropListConnectorDirective, ElderTableExtensionDirective, ElderTableGroup, ElderTableModel, ElderTableModelCdkTableBinding, ElderTableModelQueryGroup, ElderTableModule, ElderTableNavigationBarDirective, ElderTableProviders, ElderTableRootDirective, ElderTableSelectionCellComponent, ElderTableSortDirective, ElderTableToolbarDirective, ElderThemeApplierDirective, ElderThemeDirective, ElderThemeModule, ElderThemePreferenceService, ElderThemeService, ElderThemeToggleComponent, ElderTileComponent, ElderTimeModule, ElderToastModule, ElderToastService, ElderTogglePanelComponent, ElderTogglePanelPrimaryDirective, ElderTogglePanelSecondaryDirective, ElderTogglePanelTriggerDirective, ElderToggleTextInputDirective, ElderToolbarColumnDirective, ElderToolbarComponent, ElderToolbarContentDirective, ElderToolbarModule, ElderToolbarService, ElderToolbarTitleComponent, ElderToolbarTitleService, ElderTouchedDirective, ElderTripleStateCheckboxDirective, ElderTruncatePipe, ElderUnitSelectDirective, ElderUnitService, ElderUrlFragment, ElderUrlFragmentModule, ElderUrlFragmentParamsService, ElderUrlFragmentSwitcherComponent, ElderValidationErrorDirective, ElderViewersModule, EntitiesChangeEvent, EntityDelta, EntityIdUtil, EntitySetPatch, ErrorUtil, ExceptionDetailCtx, FallbackValidationMessageStrategy, FileEntry, FileListingRx, FileUploadClient, Filter, FilterContext, FilterUtil, FocusUtil, FormFieldBaseComponent, GlobalDragDropService, HttpClientBuilder, HttpClientPristine, HttpDataTransfer, HttpDataTransferAggregateComponent, HttpDataTransferComponent, HttpDataTransferIndicatorComponent, HttpDataTransferOverviewComponent, HttpParamsBuilder, I18nBase, I18nPickAsyncPipe, I18nPickPipe, I18nText, IFrameState, IframeCloseDirective, IframeDialogComponent, IframeHostComponent, IframeService, IframeSideContentComponent, IncludeExcludeSelectionModel, IncludeExcludeState, IncludeExcludeValue, IndexedEntities, InternalRestClientConfig, Interval, IsoDurationPipe, IsoIntervalFormatUtil, IsoIntervalParsePipe, IsoIntervalPipe, ItemActivationEvent, ItemActivationOptions, JsonMapUtil, KafentConfig, KafentEvent, KafentEventService, KafentEventStream, KafentEventStreamDisabled, KafentEventStreamSse, KafentEventTransport, KafentModule, KafentSseEventChannel, KafentTokenProvider, KafentTokenProviderSessionStorage, KafentTopicSse, KnownElderThemes, KnownLocaleTags, LocalDataFilter, LocalListDataSource, LocalPagedDataSource, Locale, LocalisationPickerService, MasterDetailActivationEvent, MasterSelectionState, MatTableDataContextBinding, MatTableDataContextBindingBuilder, ModifierKeyService, ModifierKeyState, MultiModelBaseComponent, NamedColorDirective, NamedColorSelectDirective, NamedColorSelectValueComponent, NextNumberUtil, ObjectFieldMatcher, ObjectPathResolver, Objects, OnlineStatus, Page, PageRequest, Pageable, ParseUtil, Path, PathNode, PeriodBucket, PeriodDuration, PeriodFormat, PhoneFormatService, PhonePipe, ProcessIterationContext, ProcessState, PropertyPathUtil, Quantity, QueryListBinding, QuestionDialogConfig, ReactiveEventSource, ReactiveEventSourceState, ReactiveFetchEventSource, ReactiveFetchEventSourceService, ReactiveMap, ReactiveSSeMessage, RefreshingEntity, ResizeObserverDirective, RestClient, RestClientConfig, RestClientContinuable, RestClientList, RestClientPaged, RoutedTabActivationFailed, SearchInputState, SelectChipSpecUtil, SelectOptionChipSpecUtil, SelectionChangedEvent, SelectionEventSource, SelectionModel, SelectionModelPopupDirective, Sets, SimpleLocalisationPicker, SimpleSearchInput, Sort, SortUtil, StandardToastComponent, SubBar, SuggestionProvider, TargetValue, TemplateCompositeControl, TemplatedSelectionDialogComponent, TemporalPlainDateInterval, TemporalUtil, ThemeSpec, TimeAgoPipe, TimeDurationPipe, TimeUtil, ToIsoDateStringPipe, ToastType, TokenChunkRequest, ToolbarHeader, Translated, TranslatedConverter, TranslatedEnumValue, TranslatedText, TypedEventMessage, Unit, UnitDimension, UnitDimensionInfo, UnitInfo, UnitRegistry, UnreachableCaseError, UrlBuilder, UrlQueryParams, UuidUtil, ValueAccessorBase, ValueChangeEvent, ValueWrapper, ViewDropModelUpdateInstruction, ViewProviders, WebLocalStorage, WebSessionStorage, WebappDomainFragmentSpec, WebappDomainSpec, WebappDomainSpecService, WebappDomainSwitcherDirective, WebappUrlFragmentSwitcherConfig, WeightPipe, alphaNumStringComparator, booleanTransformFn, buildFormIntegrationProviders, coerceInterval, coerceIntervalIsoStr, createDataOptionsProvider, createSelectionModel, elderChipColorLevels, elderChipColorStates, elderNamedColorRoles, elderNamedColorToken, elderNamedColors, existingOrNewElderTableModel, initSearchUrlService, isActivePagedDataContext, isContinuableDataContext, isContinuableDataSource, isDataContext, isDataSource, isDataViewMessageType, isElderEntityValueAccessor, isElderMultiEntityValueAccessor, isListDataSource, isLocalListDataSource, isPagedDataSource, lazySample, lazySampleTime, naturalValueComparator, newElderTableModel, proxyControlContainer, registerLocale, runInZone, someSignal, themeInit };
-export type { ChipAvatarSpec, ChipColorSpec, ComparatorFn, ConfirmDeleteOptions, CountryPhoneFormat, CurrencyIndication, DataViewMessageType, ElderActivationOptions, ElderApplyControlFn, ElderAutoActivateItem, ElderAutoActivationMode, ElderDataViewInteractionMode, ElderLocalizedInputOptions, ElderMasterDetailMode, ElderNamedColor, ElderNamedColorRole, ElderSize, ElderToolbarContentSlot, EventSourceRequestInit, ExceptionDetail, Focusable, GenericMatcherOptions, IAuditedEntity, IContinuableDataSource, IContinuationFetcher, IDataContext, IDataContextActivePage, IDataContextContinuable, IDataSource, IDynamicValidationMessage, IElderDataView, IElderDetailDialogOptions, IElderEntityValueAccessor, IElderMultiEntityValueAccessor, IFileUploadClient, IFrameParams, IFrameStateType, IListDataSource, IListFetcher, IMasterDetailActivationOptions, IPageFetcher, IPagedDataSource, ISelectionModelDialogOptions, IStandardErrorDetail, ISuggestionProvider, ITranslated, ITranslatedText, ITranslationResource, IdExtractor, IncludeExcludeCycleStrategy, InputValue, IsoDateStr, IsoDurationStr, IsoIntervalStr, JsonMap, KafentConsumerEventRequest, KafentEventFilter, KafentEventRequestBase, KafentLiveEventRequest, KeyGetterFn, LanguageTag, LocalDataFilterFn, LocalDataSortFn, LocaleMap, LocalisationPicker, Localized, LockWarningOptions, MatchOptions, ObservedElementDimension, PageDto, PhoneNumber, QuantityPipeOptions, ScrollDirection, SearchInput, SelectChipSpec, SelectOptionChipSpec, SelectionOptions, ShellContentSlot, SortDirection, TextResolverFn$1 as TextResolverFn, Toast, ToastErrorDetails, ToastOptions, TrailingSpec, UnitCode, ValueSpec };
+export type { ChipAvatarSpec, ChipColorSpec, ComparatorFn, ConfirmDeleteOptions, CountryPhoneFormat, CurrencyIndication, DataViewMessageType, ElderActivationOptions, ElderApplyControlFn, ElderAutoActivateItem, ElderAutoActivationMode, ElderDataViewInteractionMode, ElderLocalizedInputOptions, ElderMasterDetailMode, ElderNamedColor, ElderNamedColorRole, ElderSize, ElderToolbarContentSlot, EventSourceRequestInit, ExceptionDetail, Focusable, GenericMatcherOptions, IAuditedEntity, IContinuableDataSource, IContinuationFetcher, IDataContext, IDataContextActivePage, IDataContextContinuable, IDataSource, IDynamicValidationMessage, IElderDataView, IElderDetailDialogOptions, IElderEntityValueAccessor, IElderMultiEntityValueAccessor, IFileUploadClient, IFrameParams, IFrameStateType, IListDataSource, IListFetcher, IMasterDetailActivationOptions, IPageFetcher, IPagedDataSource, ISelectionModelDialogOptions, IStandardErrorDetail, ISuggestionProvider, ITranslated, ITranslatedText, ITranslationResource, IdExtractor, IncludeExcludeCycleStrategy, InclusiveRange, InputValue, IsoDateStr, IsoDurationStr, IsoIntervalStr, JsonMap, KafentConsumerEventRequest, KafentEventFilter, KafentEventRequestBase, KafentLiveEventRequest, KeyGetterFn, LanguageTag, LocalDataFilterFn, LocalDataSortFn, LocaleMap, LocalisationPicker, Localized, LockWarningOptions, MatchOptions, ObservedElementDimension, PageDto, Percentage, PhoneNumber, QuantityPipeOptions, ScrollDirection, SearchInput, SelectChipSpec, SelectOptionChipSpec, SelectionOptions, ShellContentSlot, SortDirection, TextResolverFn$1 as TextResolverFn, Toast, ToastErrorDetails, ToastOptions, TrailingSpec, UnitCode, ValueSpec };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elderbyte/ngx-starter",
-  "version": "20.12.0-beta.2",
+  "version": "20.12.0-beta.4",
   "peerDependencies": {
     "@angular/core": "^20.0.0 || ^21.0.0",
     "@angular/common": "^20.0.0 || ^21.0.0",

package/src/lib/components/layout/pane/pane/pane.component.scss

@@ -1,14 +1,18 @@
 :host {
+  --handle-width: 4px;
+  --handle-offset: calc(-1 * var(--elder-pane-gap) / 2 - var(--handle-width) / 2);
+
   display: flex;
   height: 100%;
   position: relative;
+
   // .flex class
   flex: 1 1 0;
   min-width: 0;
   min-height: 0;
 
-  &.pane-with-drag-handle-initialized {
-    flex: none;
+  &.resize-mode {
+    flex: none !important;
   }
 }
 
@@ -34,39 +38,26 @@
   position: absolute;
   top: 0;
   bottom: 0;
-  width: 4px;
-  background-color: var(--md-sys-color-primary-container);
+  width: var(--handle-width);
+  background-color: var(--md-sys-color-outline-variant);
   cursor: col-resize;
   border-radius: 3px;
   z-index: 10;
-  opacity: 0;
-  transition: 0.2s ease-in-out;
-
-  &:hover {
-    opacity: 1;
-  }
+  transition: 0.1s ease-in-out;
 
   &.handle-left {
-    left: -8px;
+    left: var(--handle-offset);
   }
 
   &.handle-right {
-    right: -8px;
+    right: var(--handle-offset);
   }
 }
 
 :host.dragging {
+  --handle-width: 6px;
+
   .elder-pane-drag-handle {
     background-color: var(--md-sys-color-secondary-container);
-    width: 6px;
-    opacity: 1;
-
-    &.handle-left {
-      left: -9px;
-    }
-
-    &.handle-right {
-      right: -9px;
-    }
   }
 }