@frame-ui-ng/components 0.2.0-beta.0 → 0.3.0-beta.0

package/input/src/styles/input-group.css

@@ -83,6 +83,36 @@ frame-input-group-addon {
   white-space: nowrap;
 }
 
+.frame-input-group__addon:has(> .frame-button),
+[frInputGroupAddon]:has(> .frame-button),
+frame-input-group-addon:has(> .frame-button) {
+  align-items: stretch;
+  padding-inline: 0;
+}
+
+.frame-input-group__addon > .frame-button,
+[frInputGroupAddon] > .frame-button,
+frame-input-group-addon > .frame-button {
+  --frame-button-root-corner-size: 0;
+  block-size: 100%;
+  min-block-size: 100%;
+  border: 0;
+  border-radius: 0;
+  box-shadow: none;
+}
+
+.frame-input-group__addon > .frame-button::before,
+[frInputGroupAddon] > .frame-button::before,
+frame-input-group-addon > .frame-button::before {
+  display: none;
+}
+
+.frame-input-group__addon > .frame-button:focus-visible,
+[frInputGroupAddon] > .frame-button:focus-visible,
+frame-input-group-addon > .frame-button:focus-visible {
+  outline-offset: -2px;
+}
+
 .frame-input-group:has([frInputGroupInput]:disabled) .frame-input-group__addon,
 .frame-input-group:has([frInputGroupInput]:disabled) [frInputGroupAddon],
 [frInputGroup]:has([frInputGroupInput]:disabled) .frame-input-group__addon,
@@ -104,6 +134,26 @@ frame-input-group-addon[data-align='inline-end'] {
   border-inline-start: 1px solid var(--frame-input-group-addon-border);
 }
 
+.frame-input-group__addon[data-variant='ghost'],
+[frInputGroupAddon][data-variant='ghost'],
+frame-input-group-addon[data-variant='ghost'] {
+  min-inline-size: auto;
+  border-inline: 0;
+  background: transparent;
+}
+
+.frame-input-group__addon[data-align='inline-start'][data-variant='ghost'],
+[frInputGroupAddon][data-align='inline-start'][data-variant='ghost'],
+frame-input-group-addon[data-align='inline-start'][data-variant='ghost'] {
+  padding-inline-end: 0;
+}
+
+.frame-input-group__addon[data-align='inline-end'][data-variant='ghost'],
+[frInputGroupAddon][data-align='inline-end'][data-variant='ghost'],
+frame-input-group-addon[data-align='inline-end'][data-variant='ghost'] {
+  padding-inline-start: 0.25rem;
+}
+
 .frame-input-group__text,
 [frInputGroupText],
 frame-input-group-text {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@frame-ui-ng/components",
-  "version": "0.2.0-beta.0",
+  "version": "0.3.0-beta.0",
   "description": "Angular components for FrameUI.",
   "license": "MIT",
   "repository": {
@@ -26,7 +26,7 @@
     "@angular/common": ">=21.0.0 <22.0.0",
     "@angular/core": ">=21.0.0 <22.0.0",
     "@angular/forms": ">=21.0.0 <22.0.0",
-    "@frame-ui-ng/foundation": "0.2.0-beta.0",
+    "@frame-ui-ng/foundation": "0.3.0-beta.0",
     "rxjs": "^7.8.0"
   },
   "dependencies": {

package/select/src/styles/select-trigger.css

@@ -8,13 +8,6 @@
   --frame-select-trigger-active-bg: color-mix(in srgb, var(--frame-surface) 65%, var(--frame-muted));
   --frame-select-trigger-active-border: var(--frame-select-trigger-hover-border);
   --frame-select-trigger-active-color: var(--frame-select-trigger-hover-color);
-  --frame-select-trigger-corner-color: var(--frame-frame-line-muted);
-  --frame-select-trigger-corner-inset: var(--frame-frame-tick-inset, 0px);
-  --frame-select-trigger-corner-size: clamp(
-    0px,
-    calc((1px - var(--frame-select-trigger-radius, 0px)) * 9999),
-    var(--frame-frame-tick-size, 0.5rem)
-  );
   appearance: none;
   -webkit-appearance: none;
   display: inline-flex;
@@ -25,7 +18,7 @@
   min-height: var(--frame-select-trigger-height);
   min-width: var(--frame-select-trigger-min-width);
   align-items: center;
-  justify-content: space-between;
+  justify-content: flex-start;
   gap: var(--frame-select-trigger-gap);
   border: 1px solid var(--frame-select-trigger-border);
   border-radius: var(--frame-select-trigger-radius);
@@ -42,7 +35,6 @@
   text-align: left;
   text-decoration: none;
   box-shadow: none;
-  position: relative;
   transition:
     border-color var(--frame-select-trigger-transition-duration) ease,
     box-shadow var(--frame-select-trigger-transition-duration) ease,
@@ -52,27 +44,6 @@
     transform var(--frame-select-trigger-transition-duration) ease;
 }
 
-.frame-select__trigger::before {
-  position: absolute;
-  inset: 0;
-  border-radius: inherit;
-  background:
-    linear-gradient(var(--frame-select-trigger-corner-color), var(--frame-select-trigger-corner-color))
-      left var(--frame-select-trigger-corner-inset) top var(--frame-select-trigger-corner-inset) /
-      var(--frame-select-trigger-corner-size) 1px no-repeat,
-    linear-gradient(var(--frame-select-trigger-corner-color), var(--frame-select-trigger-corner-color))
-      left var(--frame-select-trigger-corner-inset) top var(--frame-select-trigger-corner-inset) / 1px
-      var(--frame-select-trigger-corner-size) no-repeat,
-    linear-gradient(var(--frame-select-trigger-corner-color), var(--frame-select-trigger-corner-color))
-      right var(--frame-select-trigger-corner-inset) bottom var(--frame-select-trigger-corner-inset) /
-      var(--frame-select-trigger-corner-size) 1px no-repeat,
-    linear-gradient(var(--frame-select-trigger-corner-color), var(--frame-select-trigger-corner-color))
-      right var(--frame-select-trigger-corner-inset) bottom var(--frame-select-trigger-corner-inset) / 1px
-      var(--frame-select-trigger-corner-size) no-repeat;
-  pointer-events: none;
-  content: '';
-}
-
 .frame-select__trigger:where(:not([data-disabled])):hover {
   background: var(--frame-select-trigger-hover-bg);
   border-color: var(--frame-select-trigger-hover-border);
@@ -93,11 +64,6 @@
   box-shadow: none;
 }
 
-.frame-select__trigger:focus-visible,
-.frame-select__trigger[data-state='open'] {
-  --frame-select-trigger-corner-color: var(--frame-frame-accent);
-}
-
 .frame-select__trigger[data-state='open'] {
   background: var(--frame-select-trigger-active-bg);
   border-color: var(--frame-select-trigger-active-border);
@@ -117,6 +83,7 @@
 }
 
 .frame-select__value {
+  flex: 1 1 auto;
   min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -133,6 +100,10 @@
   color: var(--frame-muted-foreground);
 }
 
-.frame-select__trigger[data-state='open'] .frame-select__icon {
+.frame-select__icon[data-position='trailing'] {
+  margin-inline-start: auto;
+}
+
+.frame-select__trigger[data-state='open'] .frame-select__icon[data-position='trailing'] {
   transform: rotate(180deg);
 }

package/src/styles/blueprint.css

@@ -108,7 +108,6 @@
   .frame-modal__panel,
   .frame-navigation-menu__viewport,
   .frame-popover__content,
-  .frame-select__content,
   .frame-sheet__panel,
   .frame-toast,
   .frame-tooltip__content,
@@ -348,14 +347,9 @@
   .frame-modal__panel,
   .frame-navigation-menu__viewport,
   .frame-popover__content,
-  .frame-select__content,
   .frame-sheet__panel,
   .frame-toast,
-  .frame-tooltip__content,
-  [frSidebar],
-  frame-sidebar,
-  [frSidebarInset],
-  frame-sidebar-inset
+  .frame-tooltip__content
 )::before {
   --frame-blueprint-corner-offset: var(--frame-blueprint-corner-inset, 0px);
   --frame-blueprint-corner-size: clamp(
@@ -390,6 +384,7 @@
   [frVirtualList],
   frame-virtual-list,
   .frame-combobox__panel,
+  .frame-dropdown-menu__content,
   .frame-navigation-menu__viewport,
   .frame-select__content
 )::before {
@@ -410,8 +405,7 @@
   [frVirtualList],
   frame-virtual-list,
   .frame-combobox__panel,
-  .frame-navigation-menu__viewport,
-  .frame-select__content
+  .frame-navigation-menu__viewport
 ) {
   background-image:
     linear-gradient(var(--frame-blueprint-corner-color, var(--frame-frame-accent)), var(--frame-blueprint-corner-color, var(--frame-frame-accent))),
@@ -446,7 +440,6 @@
   .frame-modal__panel,
   .frame-navigation-menu__viewport,
   .frame-popover__content,
-  .frame-select__content,
   .frame-sheet__panel,
   .frame-toast,
   .frame-tooltip__content
@@ -652,7 +645,7 @@
   .frame-menubar__trigger,
   [frPopoverClose],
   .frame-select__trigger,
-  [frTooltipTrigger],
+  [frTooltip],
   [frToggle]
 ):where([data-state='open'], [aria-expanded='true']) {
   border-color: var(--frame-frame-accent, var(--frame-primary));

package/styles/blueprint.css

@@ -108,7 +108,6 @@
   .frame-modal__panel,
   .frame-navigation-menu__viewport,
   .frame-popover__content,
-  .frame-select__content,
   .frame-sheet__panel,
   .frame-toast,
   .frame-tooltip__content,
@@ -348,14 +347,9 @@
   .frame-modal__panel,
   .frame-navigation-menu__viewport,
   .frame-popover__content,
-  .frame-select__content,
   .frame-sheet__panel,
   .frame-toast,
-  .frame-tooltip__content,
-  [frSidebar],
-  frame-sidebar,
-  [frSidebarInset],
-  frame-sidebar-inset
+  .frame-tooltip__content
 )::before {
   --frame-blueprint-corner-offset: var(--frame-blueprint-corner-inset, 0px);
   --frame-blueprint-corner-size: clamp(
@@ -390,6 +384,7 @@
   [frVirtualList],
   frame-virtual-list,
   .frame-combobox__panel,
+  .frame-dropdown-menu__content,
   .frame-navigation-menu__viewport,
   .frame-select__content
 )::before {
@@ -410,8 +405,7 @@
   [frVirtualList],
   frame-virtual-list,
   .frame-combobox__panel,
-  .frame-navigation-menu__viewport,
-  .frame-select__content
+  .frame-navigation-menu__viewport
 ) {
   background-image:
     linear-gradient(var(--frame-blueprint-corner-color, var(--frame-frame-accent)), var(--frame-blueprint-corner-color, var(--frame-frame-accent))),
@@ -446,7 +440,6 @@
   .frame-modal__panel,
   .frame-navigation-menu__viewport,
   .frame-popover__content,
-  .frame-select__content,
   .frame-sheet__panel,
   .frame-toast,
   .frame-tooltip__content
@@ -652,7 +645,7 @@
   .frame-menubar__trigger,
   [frPopoverClose],
   .frame-select__trigger,
-  [frTooltipTrigger],
+  [frTooltip],
   [frToggle]
 ):where([data-state='open'], [aria-expanded='true']) {
   border-color: var(--frame-frame-accent, var(--frame-primary));

package/tooltip/src/styles/tooltip.css

@@ -1,15 +1,9 @@
 @import './_vars.css';
 
-frame-tooltip {
-  display: inline-block;
-}
-
-.frame-tooltip__anchor {
+.frame-tooltip__disabled-trigger {
   display: inline-flex;
-}
-
-[frTooltipTrigger] {
-  cursor: default;
+  max-width: 100%;
+  vertical-align: middle;
 }
 
 .frame-tooltip__content {

package/types/frame-ui-ng-components-calendar.d.ts

@@ -58,9 +58,11 @@ declare class FrCalendar implements ControlValueAccessor {
     readonly selected: _angular_core.InputSignal<Date | FrCalendarDateRange | null | undefined>;
     readonly selectedChange: _angular_core.OutputEmitterRef<Date | FrCalendarDateRange | null>;
     readonly monthChange: _angular_core.OutputEmitterRef<Date>;
+    readonly focusedDate: _angular_core.WritableSignal<Date | null>;
     private readonly navigatedMonth;
     private readonly internalValue;
     private readonly cvaDisabled;
+    private readonly host;
     readonly currentMonth: _angular_core.Signal<Date>;
     readonly isDisabled: _angular_core.Signal<boolean>;
     readonly value: _angular_core.Signal<Date | FrCalendarDateRange | null>;
@@ -71,6 +73,7 @@ declare class FrCalendar implements ControlValueAccessor {
     }[]>;
     readonly yearOptions: _angular_core.Signal<number[]>;
     readonly months: _angular_core.Signal<CalendarMonth[]>;
+    readonly activeDate: _angular_core.Signal<Date>;
     private onTouched;
     private onChange;
     writeValue(value: Date | FrCalendarDateRange | null): void;
@@ -82,9 +85,20 @@ declare class FrCalendar implements ControlValueAccessor {
     setMonth(value: string): void;
     setYear(value: string): void;
     selectDay(day: CalendarDay): void;
+    handleDayKeydown(event: KeyboardEvent, day: CalendarDay): void;
+    dayTabIndex(day: CalendarDay): number;
+    focusActiveDate(): void;
     monthLabel(date: Date): string;
     dayLabel(date: Date): string;
     weekNumber(date: Date): string;
+    private navigationOffset;
+    private resolveActiveDate;
+    private selectedDate;
+    private isDateVisible;
+    private findDay;
+    private isDayDisabled;
+    private focusDay;
+    private focusDayElement;
     private updateMonth;
     private buildMonth;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FrCalendar, never>;

package/types/frame-ui-ng-components-context-menu.d.ts

@@ -11,7 +11,7 @@ declare class FrContextMenuContent implements Partial<FrDropdownMenuContent> {
     readonly align: i0.InputSignal<"center" | "end" | "start">;
     readonly alignOffset: i0.InputSignal<number>;
     readonly debugVisible: i0.InputSignalWithTransform<boolean, unknown>;
-    readonly side: i0.InputSignal<"bottom" | "left" | "right" | "top">;
+    readonly side: i0.InputSignal<"auto" | "bottom" | "left" | "right" | "top">;
     readonly sideOffset: i0.InputSignal<number>;
     isDebugVisible(): boolean;
     getPositions(isSubmenu: boolean): ConnectedPosition[];
@@ -19,7 +19,7 @@ declare class FrContextMenuContent implements Partial<FrDropdownMenuContent> {
     static ɵdir: i0.ɵɵDirectiveDeclaration<FrContextMenuContent, "ng-template[frContextMenuContent], ng-template[frContextMenuSubContent]", ["frContextMenuContent"], { "align": { "alias": "align"; "required": false; "isSignal": true; }; "alignOffset": { "alias": "alignOffset"; "required": false; "isSignal": true; }; "debugVisible": { "alias": "debugVisible"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "sideOffset": { "alias": "sideOffset"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 declare class FrContextMenuPanel {
-    protected readonly side: i0.InputSignal<"bottom" | "left" | "right" | "top">;
+    protected readonly side: i0.InputSignal<"auto" | "bottom" | "left" | "right" | "top">;
     private readonly tree;
     private readonly parent;
     protected handleMouseEnter(): void;

package/types/frame-ui-ng-components-date-picker.d.ts

@@ -1,7 +1,7 @@
 import * as _angular_core from '@angular/core';
 import { TemplateRef } from '@angular/core';
 import { ConnectedPosition, ConnectedOverlayPositionChange } from '@angular/cdk/overlay';
-import { FrCalendarDateRange, FrCalendarMode, FrCalendarCaptionLayout, FrCalendarDisabledMatcher, FrCalendarCellContext } from '@frame-ui-ng/components/calendar';
+import { FrCalendarDateRange, FrCalendarMode, FrCalendarCaptionLayout, FrCalendarDisabledMatcher, FrCalendarCellContext, FrCalendar } from '@frame-ui-ng/components/calendar';
 import { FrControlValueAccessor } from '@frame-ui-ng/components/forms';
 
 type FrDatePickerValue = Date | FrCalendarDateRange | null;
@@ -53,6 +53,7 @@ declare class FrDatePicker extends FrControlValueAccessor<FrDatePickerValue> {
     readonly valueChange: _angular_core.OutputEmitterRef<FrDatePickerValue>;
     readonly openChange: _angular_core.OutputEmitterRef<boolean>;
     readonly monthChange: _angular_core.OutputEmitterRef<Date>;
+    readonly calendar: _angular_core.Signal<FrCalendar | undefined>;
     readonly positions: ConnectedPosition[];
     readonly isOpen: _angular_core.WritableSignal<boolean>;
     readonly overlaySide: _angular_core.WritableSignal<"bottom" | "top">;
@@ -78,6 +79,7 @@ declare class FrDatePicker extends FrControlValueAccessor<FrDatePickerValue> {
     commitInput(value: string): void;
     handleTriggerKeydown(event: KeyboardEvent): void;
     handlePositionChange(event: ConnectedOverlayPositionChange): void;
+    focusCalendar(): void;
     overlayPanelClasses(): string[];
     protected setViewValue(value: FrDatePickerValue): void;
     private commitValue;

package/types/frame-ui-ng-components-dropdown-menu.d.ts

@@ -10,7 +10,7 @@ declare class FrDropdownMenuContent {
     readonly align: i0.InputSignal<"center" | "end" | "start">;
     readonly alignOffset: i0.InputSignal<number>;
     readonly debugVisible: i0.InputSignalWithTransform<boolean, unknown>;
-    readonly side: i0.InputSignal<"bottom" | "left" | "right" | "top">;
+    readonly side: i0.InputSignal<"auto" | "bottom" | "left" | "right" | "top">;
     readonly sideOffset: i0.InputSignal<number>;
     isDebugVisible(): boolean;
     getPositions(isSubmenu: boolean): ConnectedPosition[];
@@ -18,7 +18,7 @@ declare class FrDropdownMenuContent {
     static ɵdir: i0.ɵɵDirectiveDeclaration<FrDropdownMenuContent, "ng-template[frDropdownMenuContent], ng-template[frDropdownMenuSubContent]", ["frDropdownMenuContent"], { "align": { "alias": "align"; "required": false; "isSignal": true; }; "alignOffset": { "alias": "alignOffset"; "required": false; "isSignal": true; }; "debugVisible": { "alias": "debugVisible"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "sideOffset": { "alias": "sideOffset"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 declare class FrDropdownMenuPanel {
-    protected readonly side: i0.InputSignal<"bottom" | "left" | "right" | "top">;
+    protected readonly side: i0.InputSignal<"auto" | "bottom" | "left" | "right" | "top">;
     private readonly tree;
     private readonly parent;
     protected handleMouseEnter(): void;
@@ -74,7 +74,7 @@ declare class FrDropdownMenuItemIndicator {
 }
 
 declare const FR_DROPDOWN_MENU_ALIGNMENTS: readonly ["center", "end", "start"];
-declare const FR_DROPDOWN_MENU_SIDES: readonly ["bottom", "left", "right", "top"];
+declare const FR_DROPDOWN_MENU_SIDES: readonly ["auto", "bottom", "left", "right", "top"];
 declare const FR_DROPDOWN_MENU_TRIGGER_MODES: readonly ["both", "click", "hover"];
 declare const FR_DROPDOWN_MENU_ITEM_VARIANTS: readonly ["default", "destructive"];
 type FrDropdownMenuAlignment = (typeof FR_DROPDOWN_MENU_ALIGNMENTS)[number];

package/types/frame-ui-ng-components-input.d.ts

@@ -38,15 +38,18 @@ declare class FrInputBadge {
 }
 
 declare const FR_INPUT_GROUP_ADDON_ALIGNS: readonly ["inline-start", "inline-end"];
+declare const FR_INPUT_GROUP_ADDON_VARIANTS: readonly ["default", "ghost"];
 type FrInputGroupAddonAlign = (typeof FR_INPUT_GROUP_ADDON_ALIGNS)[number];
+type FrInputGroupAddonVariant = (typeof FR_INPUT_GROUP_ADDON_VARIANTS)[number];
 declare class FrInputGroup {
     static ɵfac: i0.ɵɵFactoryDeclaration<FrInputGroup, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<FrInputGroup, "[frInputGroup], frame-input-group", never, {}, {}, never, never, true, never>;
 }
 declare class FrInputGroupAddon {
     readonly align: i0.InputSignal<"inline-start" | "inline-end">;
+    readonly variant: i0.InputSignal<"default" | "ghost">;
     static ɵfac: i0.ɵɵFactoryDeclaration<FrInputGroupAddon, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<FrInputGroupAddon, "[frInputGroupAddon], frame-input-group-addon", never, { "align": { "alias": "align"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<FrInputGroupAddon, "[frInputGroupAddon], frame-input-group-addon", never, { "align": { "alias": "align"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 declare class FrInputGroupText {
     static ɵfac: i0.ɵɵFactoryDeclaration<FrInputGroupText, never>;
@@ -63,5 +66,5 @@ declare class FrInputModule {
     static ɵinj: i0.ɵɵInjectorDeclaration<FrInputModule>;
 }
 
-export { FR_INPUT_GROUP_ADDON_ALIGNS, FrInput, FrInputBadge, FrInputControl, FrInputDescription, FrInputError, FrInputField, FrInputFieldGroup, FrInputGroup, FrInputGroupAddon, FrInputGroupInput, FrInputGroupText, FrInputHeader, FrInputLabel, FrInputModule };
-export type { FrInputGroupAddonAlign };
+export { FR_INPUT_GROUP_ADDON_ALIGNS, FR_INPUT_GROUP_ADDON_VARIANTS, FrInput, FrInputBadge, FrInputControl, FrInputDescription, FrInputError, FrInputField, FrInputFieldGroup, FrInputGroup, FrInputGroupAddon, FrInputGroupInput, FrInputGroupText, FrInputHeader, FrInputLabel, FrInputModule };
+export type { FrInputGroupAddonAlign, FrInputGroupAddonVariant };

package/types/frame-ui-ng-components-select.d.ts

@@ -56,6 +56,8 @@ declare class FrSelectPanel {
     static ɵdir: i0.ɵɵDirectiveDeclaration<FrSelectPanel, "[frSelectPanel], frame-select-panel", never, {}, {}, never, never, true, [{ directive: typeof i1.FrDropdownMenuPanel; inputs: {}; outputs: {}; }]>;
 }
 
+declare const FR_SELECT_ICON_POSITIONS: readonly ["leading", "trailing"];
+type FrSelectIconPosition = (typeof FR_SELECT_ICON_POSITIONS)[number];
 declare class FrSelectValue {
     private readonly select;
     readonly placeholder: i0.InputSignal<string>;
@@ -69,8 +71,9 @@ declare class FrSelectItemIndicator {
     static ɵdir: i0.ɵɵDirectiveDeclaration<FrSelectItemIndicator, "[frSelectItemIndicator], frame-select-item-indicator", never, {}, {}, never, never, true, never>;
 }
 declare class FrSelectIcon {
+    readonly position: i0.InputSignal<"leading" | "trailing">;
     static ɵfac: i0.ɵɵFactoryDeclaration<FrSelectIcon, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<FrSelectIcon, "[frSelectIcon], frame-select-icon", never, {}, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<FrSelectIcon, "[frSelectIcon], frame-select-icon", never, { "position": { "alias": "position"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 declare class FrSelectError {
     static ɵfac: i0.ɵɵFactoryDeclaration<FrSelectError, never>;
@@ -110,5 +113,5 @@ declare class FrSelectModule {
     static ɵinj: i0.ɵɵInjectorDeclaration<FrSelectModule>;
 }
 
-export { FR_SELECT_INDICATOR_POSITIONS, FR_SELECT_POSITIONS, FrSelect, FrSelectContent, FrSelectError, FrSelectGroup, FrSelectIcon, FrSelectItem, FrSelectItemIndicator, FrSelectLabel, FrSelectModule, FrSelectPanel, FrSelectSeparator, FrSelectValue };
-export type { FrSelectIndicatorPosition, FrSelectPosition };
+export { FR_SELECT_ICON_POSITIONS, FR_SELECT_INDICATOR_POSITIONS, FR_SELECT_POSITIONS, FrSelect, FrSelectContent, FrSelectError, FrSelectGroup, FrSelectIcon, FrSelectItem, FrSelectItemIndicator, FrSelectLabel, FrSelectModule, FrSelectPanel, FrSelectSeparator, FrSelectValue };
+export type { FrSelectIconPosition, FrSelectIndicatorPosition, FrSelectPosition };

package/types/frame-ui-ng-components-sidebar.d.ts

@@ -45,8 +45,10 @@ declare class FrSidebar {
     readonly side: i0.InputSignalWithTransform<"left" | "right", unknown>;
     readonly variant: i0.InputSignalWithTransform<"sidebar" | "floating" | "inset", unknown>;
     readonly collapsible: i0.InputSignalWithTransform<"offcanvas" | "icon" | "none", unknown>;
+    readonly minSize: i0.InputSignalWithTransform<number | null, unknown>;
+    readonly maxSize: i0.InputSignalWithTransform<number | null, unknown>;
     static ɵfac: i0.ɵɵFactoryDeclaration<FrSidebar, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<FrSidebar, "[frSidebar], frame-sidebar", never, { "side": { "alias": "side"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<FrSidebar, "[frSidebar], frame-sidebar", never, { "side": { "alias": "side"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "minSize": { "alias": "minSize"; "required": false; "isSignal": true; }; "maxSize": { "alias": "maxSize"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 declare class FrSidebarTrigger {
     readonly provider: FrSidebarProvider | null;
@@ -64,11 +66,16 @@ declare class FrSidebarRail {
     private suppressClick;
     private frameId;
     private pendingWidth;
+    private resizeMinSize;
+    private resizeMaxSize;
     readonly provider: FrSidebarProvider | null;
     toggle(): void;
     startResize(event: PointerEvent): void;
     private resize;
     private flushResize;
+    private clampWidth;
+    private captureResizeBounds;
+    private measureContentMinSize;
     static ɵfac: i0.ɵɵFactoryDeclaration<FrSidebarRail, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<FrSidebarRail, "[frSidebarRail], frame-sidebar-rail", never, {}, {}, never, never, true, never>;
 }

package/types/frame-ui-ng-components-tooltip.d.ts

@@ -1,87 +1,57 @@
 import * as _angular_core from '@angular/core';
-import { TemplateRef } from '@angular/core';
-import { ConnectedPosition, ConnectedOverlayPositionChange } from '@angular/cdk/overlay';
+import { AfterViewInit, TemplateRef } from '@angular/core';
 
-type FrTooltipController = {
-    isOpen(): boolean;
-    overlaySide(): string;
-    registerTrigger(trigger: HTMLElement): void;
-    setContent(content: unknown | null): void;
-    openWithDelay(): void;
-    closeWithDelay(): void;
-    open(): void;
-    close(): void;
-};
-
-declare class FrTooltipContent {
-    readonly templateRef: TemplateRef<any>;
-    readonly id: string;
+declare class FrTooltipDirective implements AfterViewInit {
+    private readonly destroyRef;
+    private readonly document;
+    private readonly elementRef;
+    private readonly overlay;
+    private readonly platformId;
+    readonly content: _angular_core.InputSignal<string | TemplateRef<unknown> | null>;
     readonly align: _angular_core.InputSignal<"start" | "center" | "end">;
     readonly alignOffset: _angular_core.InputSignal<number>;
     readonly arrow: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    readonly debugVisible: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly closeDelay: _angular_core.InputSignal<number>;
+    readonly openDelay: _angular_core.InputSignalWithTransform<number, unknown>;
     readonly side: _angular_core.InputSignal<"top" | "right" | "bottom" | "left">;
     readonly sideOffset: _angular_core.InputSignal<number>;
-    getPositions(): ConnectedPosition[];
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FrTooltipContent, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<FrTooltipContent, "ng-template[frTooltipContent]", ["frTooltipContent"], { "align": { "alias": "align"; "required": false; "isSignal": true; }; "alignOffset": { "alias": "alignOffset"; "required": false; "isSignal": true; }; "arrow": { "alias": "arrow"; "required": false; "isSignal": true; }; "debugVisible": { "alias": "debugVisible"; "required": false; "isSignal": true; }; "side": { "alias": "side"; "required": false; "isSignal": true; }; "sideOffset": { "alias": "sideOffset"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
-}
-declare class FrTooltipPanel {
-    protected readonly content: FrTooltipContent;
-    protected readonly root: FrTooltipController;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FrTooltipPanel, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<FrTooltipPanel, "[frTooltipPanel]", never, {}, {}, never, never, true, never>;
-}
-declare class FrTooltipShortcut {
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FrTooltipShortcut, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<FrTooltipShortcut, "[frTooltipShortcut]", never, {}, {}, never, never, true, never>;
-}
-
-declare class FrTooltipRoot {
-    private readonly elementRef;
-    readonly openDelay: _angular_core.InputSignal<number>;
-    readonly closeDelay: _angular_core.InputSignal<number>;
-    readonly defaultOpen: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    readonly debugVisible: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    readonly openChange: _angular_core.OutputEmitterRef<boolean>;
-    readonly isOpen: _angular_core.WritableSignal<boolean>;
-    readonly content: _angular_core.WritableSignal<FrTooltipContent | null>;
-    readonly overlaySide: _angular_core.WritableSignal<string>;
-    private openTimer;
+    protected readonly isOpen: _angular_core.WritableSignal<boolean>;
+    protected readonly tooltipId: string;
     private closeTimer;
+    private disabledObserver;
+    private openTimer;
+    private overlayRef;
+    private panelRef;
     private triggerElement;
-    readonly positions: _angular_core.Signal<ConnectedPosition[]>;
+    private wrapped;
+    private wrapper;
+    private teardownListeners;
     constructor();
-    registerTrigger(trigger: HTMLElement): void;
-    setContent(content: unknown | null): void;
-    openWithDelay(): void;
-    closeWithDelay(): void;
-    open(): void;
-    close(): void;
-    handleOverlayKeydown(event: KeyboardEvent): void;
-    handlePositionChange(event: ConnectedOverlayPositionChange): void;
-    overlayPanelClasses(): string[];
-    private cancelOpen;
-    private cancelClose;
+    ngAfterViewInit(): void;
+    private bindTriggerEvents;
+    private ensureDisabledHostWrapper;
+    private observeDisabledState;
+    private openWithDelay;
+    private closeWithDelay;
+    private open;
+    private close;
+    private createOverlay;
+    private positions;
+    private handlePositionChange;
+    private updatePanelInputs;
     private syncCustomPropertiesToOverlay;
-    private scheduleCustomPropertySync;
     private copyCustomProperties;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FrTooltipRoot, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FrTooltipRoot, "frame-tooltip", ["frTooltip"], { "openDelay": { "alias": "openDelay"; "required": false; "isSignal": true; }; "closeDelay": { "alias": "closeDelay"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "debugVisible": { "alias": "debugVisible"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, never, ["*"], true, never>;
+    private listen;
+    private cancelOpen;
+    private cancelClose;
+    private destroy;
+    private teardownTriggerListeners;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FrTooltipDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<FrTooltipDirective, "[frTooltip]", never, { "content": { "alias": "frTooltip"; "required": false; "isSignal": true; }; "align": { "alias": "frTooltipAlign"; "required": false; "isSignal": true; }; "alignOffset": { "alias": "frTooltipAlignOffset"; "required": false; "isSignal": true; }; "arrow": { "alias": "frTooltipArrow"; "required": false; "isSignal": true; }; "closeDelay": { "alias": "frTooltipCloseDelay"; "required": false; "isSignal": true; }; "openDelay": { "alias": "frTooltipOpenDelay"; "required": false; "isSignal": true; }; "side": { "alias": "frTooltipSide"; "required": false; "isSignal": true; }; "sideOffset": { "alias": "frTooltipSideOffset"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
-
-declare class FrTooltipTrigger {
-    readonly content: _angular_core.InputSignal<FrTooltipContent | null>;
-    protected readonly root: FrTooltipController;
-    private readonly elementRef;
-    constructor();
-    protected handleMouseEnter(): void;
-    protected handleMouseLeave(): void;
-    protected handleFocusIn(): void;
-    protected handleFocusOut(): void;
-    protected handleKeydown(event: KeyboardEvent): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FrTooltipTrigger, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<FrTooltipTrigger, "[frTooltipTrigger]", never, { "content": { "alias": "frTooltipTrigger"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+declare class FrTooltipShortcut {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FrTooltipShortcut, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<FrTooltipShortcut, "[frTooltipShortcut]", never, {}, {}, never, never, true, never>;
 }
 
 declare const FR_TOOLTIP_SIDES: readonly ["top", "right", "bottom", "left"];
@@ -91,9 +61,9 @@ type FrTooltipAlignment = (typeof FR_TOOLTIP_ALIGNMENTS)[number];
 
 declare class FrTooltipModule {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FrTooltipModule, never>;
-    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<FrTooltipModule, never, [typeof FrTooltipRoot, typeof FrTooltipTrigger, typeof FrTooltipContent, typeof FrTooltipPanel, typeof FrTooltipShortcut], [typeof FrTooltipRoot, typeof FrTooltipTrigger, typeof FrTooltipContent, typeof FrTooltipPanel, typeof FrTooltipShortcut]>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<FrTooltipModule, never, [typeof FrTooltipDirective, typeof FrTooltipShortcut], [typeof FrTooltipDirective, typeof FrTooltipShortcut]>;
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<FrTooltipModule>;
 }
 
-export { FR_TOOLTIP_ALIGNMENTS, FR_TOOLTIP_SIDES, FrTooltipRoot as FrTooltip, FrTooltipContent, FrTooltipModule, FrTooltipPanel, FrTooltipShortcut, FrTooltipTrigger };
+export { FR_TOOLTIP_ALIGNMENTS, FR_TOOLTIP_SIDES, FrTooltipDirective, FrTooltipModule, FrTooltipShortcut };
 export type { FrTooltipAlignment, FrTooltipSide };