@semantic-components/ui 0.66.0 → 0.68.0

package/esm2022/lib/components/file-upload/index.js

@@ -0,0 +1,11 @@
+export { SC_FILE_UPLOAD, ScFileUpload } from './file-upload';
+export { ScFileUploadDropzone } from './file-upload-dropzone';
+export { ScFileUploadTrigger } from './file-upload-trigger';
+export { ScFileUploadList } from './file-upload-list';
+export { ScFileUploadItem } from './file-upload-item';
+export { ScFileUploadItemPreview } from './file-upload-item-preview';
+export { ScFileUploadItemName } from './file-upload-item-name';
+export { ScFileUploadItemSize } from './file-upload-item-size';
+export { ScFileUploadItemDelete } from './file-upload-item-delete';
+export { ScFileUploadItemProgress } from './file-upload-item-progress';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/file-upload/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/file-upload/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAC;AACrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AACnE,OAAO,EAAE,wBAAwB,EAAE,MAAM,6BAA6B,CAAC","sourcesContent":["export { SC_FILE_UPLOAD, ScFileUpload } from './file-upload';\nexport type { ScFileUploadFile } from './file-upload';\nexport { ScFileUploadDropzone } from './file-upload-dropzone';\nexport { ScFileUploadTrigger } from './file-upload-trigger';\nexport { ScFileUploadList } from './file-upload-list';\nexport { ScFileUploadItem } from './file-upload-item';\nexport { ScFileUploadItemPreview } from './file-upload-item-preview';\nexport { ScFileUploadItemName } from './file-upload-item-name';\nexport { ScFileUploadItemSize } from './file-upload-item-size';\nexport { ScFileUploadItemDelete } from './file-upload-item-delete';\nexport { ScFileUploadItemProgress } from './file-upload-item-progress';\n"]}

package/esm2022/lib/components/index.js

@@ -10,13 +10,14 @@ export * from './button';
 export * from './button-group';
 export * from './calendar';
 export * from './card';
-export * from './collapsible';
 export * from './checkbox';
+export * from './collapsible';
 export * from './date-picker';
 export * from './dialog';
 export * from './drawer';
 export * from './empty';
 export * from './field';
+export * from './file-upload';
 export * from './hover-card';
 export * from './input';
 export * from './input-group';
@@ -26,22 +27,29 @@ export * from './label';
 export * from './link';
 export * from './menu';
 export * from './menu-bar';
+export * from './native-select';
+export * from './navigation-menu';
 export * from './pagination';
 export * from './popover';
 export * from './progress';
 export * from './radio-group';
+export * from './range-slider';
+export * from './scroll-area';
 export * from './select';
 export * from './separator';
 export * from './sheet';
 export * from './skeleton';
+export * from './slider';
 export * from './spinner';
 export * from './switch';
 export * from './table';
 export * from './tabs';
 export * from './textarea';
+export * from './time-picker';
+export * from './toast';
 export * from './toggle';
 export * from './toggle-group';
 export * from './toolbar';
-export * from './toast';
 export * from './tooltip';
+export * from './typography';
 //# sourceMappingURL=index.js.map

package/esm2022/lib/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../libs/ui/src/lib/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC","sourcesContent":["export * from './accordion';\nexport * from './alert';\nexport * from './alert-dialog';\nexport * from './aspect-ratio';\nexport * from './avatar';\nexport * from './backdrop';\nexport * from './badge';\nexport * from './breadcrumb';\nexport * from './button';\nexport * from './button-group';\nexport * from './calendar';\nexport * from './card';\nexport * from './collapsible';\nexport * from './checkbox';\nexport * from './date-picker';\nexport * from './dialog';\nexport * from './drawer';\nexport * from './empty';\nexport * from './field';\nexport * from './hover-card';\nexport * from './input';\nexport * from './input-group';\nexport * from './item';\nexport * from './kbd';\nexport * from './label';\nexport * from './link';\nexport * from './menu';\nexport * from './menu-bar';\nexport * from './pagination';\nexport * from './popover';\nexport * from './progress';\nexport * from './radio-group';\nexport * from './select';\nexport * from './separator';\nexport * from './sheet';\nexport * from './skeleton';\nexport * from './spinner';\nexport * from './switch';\nexport * from './table';\nexport * from './tabs';\nexport * from './textarea';\nexport * from './toggle';\nexport * from './toggle-group';\nexport * from './toolbar';\nexport * from './toast';\nexport * from './tooltip';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../libs/ui/src/lib/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC","sourcesContent":["export * from './accordion';\nexport * from './alert';\nexport * from './alert-dialog';\nexport * from './aspect-ratio';\nexport * from './avatar';\nexport * from './backdrop';\nexport * from './badge';\nexport * from './breadcrumb';\nexport * from './button';\nexport * from './button-group';\nexport * from './calendar';\nexport * from './card';\nexport * from './checkbox';\nexport * from './collapsible';\nexport * from './date-picker';\nexport * from './dialog';\nexport * from './drawer';\nexport * from './empty';\nexport * from './field';\nexport * from './file-upload';\nexport * from './hover-card';\nexport * from './input';\nexport * from './input-group';\nexport * from './item';\nexport * from './kbd';\nexport * from './label';\nexport * from './link';\nexport * from './menu';\nexport * from './menu-bar';\nexport * from './native-select';\nexport * from './navigation-menu';\nexport * from './pagination';\nexport * from './popover';\nexport * from './progress';\nexport * from './radio-group';\nexport * from './range-slider';\nexport * from './scroll-area';\nexport * from './select';\nexport * from './separator';\nexport * from './sheet';\nexport * from './skeleton';\nexport * from './slider';\nexport * from './spinner';\nexport * from './switch';\nexport * from './table';\nexport * from './tabs';\nexport * from './textarea';\nexport * from './time-picker';\nexport * from './toast';\nexport * from './toggle';\nexport * from './toggle-group';\nexport * from './toolbar';\nexport * from './tooltip';\nexport * from './typography';\n"]}

package/esm2022/lib/components/menu-bar/menu-bar-item.js

@@ -1,6 +1,6 @@
-import { ChangeDetectionStrategy, Component, computed, contentChild, effect, inject, input, ViewEncapsulation, } from '@angular/core';
+import { ChangeDetectionStrategy, Component, computed, contentChild, effect, inject, input, viewChild, ViewEncapsulation, } from '@angular/core';
 import { NgTemplateOutlet } from '@angular/common';
-import { CdkOverlayOrigin, OverlayModule } from '@angular/cdk/overlay';
+import { CdkConnectedOverlay, CdkOverlayOrigin, OverlayModule, } from '@angular/cdk/overlay';
 import { MenuItem } from '@angular/aria/menu';
 import { SIGNAL, signalSetFn } from '@angular/core/primitives/signals';
 import { cn } from '../../utils';
@@ -14,6 +14,7 @@ export class ScMenuBarItem {
     overlayOrigin = inject(CdkOverlayOrigin);
     menuItem = inject(MenuItem);
     submenuPortal = contentChild(ScMenuPortal, ...(ngDevMode ? [{ debugName: "submenuPortal" }] : []));
+    connectedOverlay = viewChild(CdkConnectedOverlay, ...(ngDevMode ? [{ debugName: "connectedOverlay" }] : []));
     scMenuBar = inject(ScMenuBar);
     rendered = computed(() => this.scMenuBar.rendered(), ...(ngDevMode ? [{ debugName: "rendered" }] : []));
     class = computed(() => cn('flex items-center rounded-sm px-2 py-0.5 text-sm font-medium outline-hidden select-none cursor-default hover:bg-muted aria-expanded:bg-muted focus-visible:outline-2 focus-visible:outline-ring', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
@@ -24,9 +25,16 @@ export class ScMenuBarItem {
                 signalSetFn(this.menuItem.submenu[SIGNAL], menu);
             }
         });
+        // Force overlay to recalculate position when menu item expands
+        effect(() => {
+            const expanded = this.menuItem.expanded();
+            if (expanded) {
+                this.connectedOverlay()?.overlayRef?.updatePosition();
+            }
+        });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScMenuBarItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ScMenuBarItem, isStandalone: true, selector: "[scMenuBarItem]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "menu-bar-item" }, properties: { "class": "class()" } }, queries: [{ propertyName: "submenuPortal", first: true, predicate: ScMenuPortal, descendants: true, isSignal: true }], exportAs: ["scMenuBarItem"], hostDirectives: [{ directive: i1.MenuItem, inputs: ["id", "id", "value", "value", "disabled", "disabled"] }, { directive: i2.CdkOverlayOrigin }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ScMenuBarItem, isStandalone: true, selector: "[scMenuBarItem]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "menu-bar-item" }, properties: { "class": "class()" } }, queries: [{ propertyName: "submenuPortal", first: true, predicate: ScMenuPortal, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "connectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true, isSignal: true }], exportAs: ["scMenuBarItem"], hostDirectives: [{ directive: i1.MenuItem, inputs: ["id", "id", "value", "value", "disabled", "disabled"] }, { directive: i2.CdkOverlayOrigin }], ngImport: i0, template: `
     <ng-content />
 
     @if (submenuPortal(); as portal) {
@@ -91,5 +99,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
                     encapsulation: ViewEncapsulation.None,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], ctorParameters: () => [], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], submenuPortal: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ScMenuPortal), { isSignal: true }] }] } });
+        }], ctorParameters: () => [], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], submenuPortal: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ScMenuPortal), { isSignal: true }] }], connectedOverlay: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkConnectedOverlay), { isSignal: true }] }] } });
 //# sourceMappingURL=menu-bar-item.js.map

package/esm2022/lib/components/menu-bar/menu-bar-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-bar-item.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/menu-bar/menu-bar-item.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,MAAM,EACN,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACvE,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;;;;AA0CvC,MAAM,OAAO,aAAa;IACf,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IACnD,aAAa,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC;IACjC,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,aAAa,GAAG,YAAY,CAAC,YAAY,yDAAC,CAAC;IAE7C,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC;IAE5B,QAAQ,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,oDAAC,CAAC;IAErD,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,iMAAiM,EACjM,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;IAEF;QACE,MAAM,CAAC,GAAG,EAAE;YACV,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,EAAE,EAAE,IAAI,EAAE,CAAC;YAC1C,IAAI,IAAI,EAAE,CAAC;gBACT,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,IAAI,CAAC,CAAC;YACnD,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;uGAxBU,aAAa;2FAAb,aAAa,gWAIwB,YAAY,+OAjClD;;;;;;;;;;;;;;;;;;;;;GAqBT,2DA7BS,aAAa,0nCAAE,gBAAgB;;2FAqC9B,aAAa;kBAxCzB,SAAS;mBAAC;oBACT,QAAQ,EAAE,iBAAiB;oBAC3B,QAAQ,EAAE,eAAe;oBACzB,OAAO,EAAE,CAAC,aAAa,EAAE,gBAAgB,CAAC;oBAC1C,cAAc,EAAE;wBACd;4BACE,SAAS,EAAE,QAAQ;4BACnB,MAAM,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,UAAU,CAAC;yBACpC;wBACD,gBAAgB;qBACjB;oBACD,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;GAqBT;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,eAAe;wBAC5B,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD;2NAKiD,YAAY","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  contentChild,\n  effect,\n  inject,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { CdkOverlayOrigin, OverlayModule } from '@angular/cdk/overlay';\nimport { MenuItem } from '@angular/aria/menu';\nimport { SIGNAL, signalSetFn } from '@angular/core/primitives/signals';\nimport { cn } from '../../utils';\nimport { ScMenuPortal } from '../menu';\nimport { ScMenuBar } from './menu-bar';\n\n@Component({\n  selector: '[scMenuBarItem]',\n  exportAs: 'scMenuBarItem',\n  imports: [OverlayModule, NgTemplateOutlet],\n  hostDirectives: [\n    {\n      directive: MenuItem,\n      inputs: ['id', 'value', 'disabled'],\n    },\n    CdkOverlayOrigin,\n  ],\n  template: `\n    <ng-content />\n\n    @if (submenuPortal(); as portal) {\n      <ng-template\n        [cdkConnectedOverlayOpen]=\"rendered()\"\n        [cdkConnectedOverlay]=\"{ origin: overlayOrigin, usePopover: 'inline' }\"\n        [cdkConnectedOverlayPositions]=\"[\n          {\n            originX: 'start',\n            originY: 'bottom',\n            overlayX: 'start',\n            overlayY: 'top',\n            offsetY: 4,\n          },\n        ]\"\n        cdkAttachPopoverAsChild\n      >\n        <ng-container [ngTemplateOutlet]=\"portal.templateRef\" />\n      </ng-template>\n    }\n  `,\n  host: {\n    'data-slot': 'menu-bar-item',\n    '[class]': 'class()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScMenuBarItem {\n  readonly classInput = input<string>('', { alias: 'class' });\n  readonly overlayOrigin = inject(CdkOverlayOrigin);\n  private readonly menuItem = inject(MenuItem);\n  protected readonly submenuPortal = contentChild(ScMenuPortal);\n\n  private readonly scMenuBar = inject(ScMenuBar);\n\n  protected readonly rendered = computed(() => this.scMenuBar.rendered());\n\n  protected readonly class = computed(() =>\n    cn(\n      'flex items-center rounded-sm px-2 py-0.5 text-sm font-medium outline-hidden select-none cursor-default hover:bg-muted aria-expanded:bg-muted focus-visible:outline-2 focus-visible:outline-ring',\n      this.classInput(),\n    ),\n  );\n\n  constructor() {\n    effect(() => {\n      const menu = this.submenuPortal()?.menu();\n      if (menu) {\n        signalSetFn(this.menuItem.submenu[SIGNAL], menu);\n      }\n    });\n  }\n}\n"]}
+{"version":3,"file":"menu-bar-item.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/menu-bar/menu-bar-item.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,MAAM,EACN,KAAK,EACL,SAAS,EACT,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EACL,mBAAmB,EACnB,gBAAgB,EAChB,aAAa,GACd,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;;;;AA0CvC,MAAM,OAAO,aAAa;IACf,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IACnD,aAAa,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC;IACjC,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,aAAa,GAAG,YAAY,CAAC,YAAY,yDAAC,CAAC;IAC7C,gBAAgB,GAAG,SAAS,CAAC,mBAAmB,4DAAC,CAAC;IAElD,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC;IAE5B,QAAQ,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,oDAAC,CAAC;IAErD,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,iMAAiM,EACjM,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;IAEF;QACE,MAAM,CAAC,GAAG,EAAE;YACV,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,EAAE,EAAE,IAAI,EAAE,CAAC;YAC1C,IAAI,IAAI,EAAE,CAAC;gBACT,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,IAAI,CAAC,CAAC;YACnD,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,+DAA+D;QAC/D,MAAM,CAAC,GAAG,EAAE;YACV,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC;YAC1C,IAAI,QAAQ,EAAE,CAAC;gBACb,IAAI,CAAC,gBAAgB,EAAE,EAAE,UAAU,EAAE,cAAc,EAAE,CAAC;YACxD,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;uGAjCU,aAAa;2FAAb,aAAa,gWAIwB,YAAY,kHACd,mBAAmB,+OAlCvD;;;;;;;;;;;;;;;;;;;;;GAqBT,2DA7BS,aAAa,0nCAAE,gBAAgB;;2FAqC9B,aAAa;kBAxCzB,SAAS;mBAAC;oBACT,QAAQ,EAAE,iBAAiB;oBAC3B,QAAQ,EAAE,eAAe;oBACzB,OAAO,EAAE,CAAC,aAAa,EAAE,gBAAgB,CAAC;oBAC1C,cAAc,EAAE;wBACd;4BACE,SAAS,EAAE,QAAQ;4BACnB,MAAM,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,UAAU,CAAC;yBACpC;wBACD,gBAAgB;qBACjB;oBACD,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;GAqBT;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,eAAe;wBAC5B,SAAS,EAAE,SAAS;qBACrB;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD;2NAKiD,YAAY,+FACd,mBAAmB","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  contentChild,\n  effect,\n  inject,\n  input,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n  CdkConnectedOverlay,\n  CdkOverlayOrigin,\n  OverlayModule,\n} from '@angular/cdk/overlay';\nimport { MenuItem } from '@angular/aria/menu';\nimport { SIGNAL, signalSetFn } from '@angular/core/primitives/signals';\nimport { cn } from '../../utils';\nimport { ScMenuPortal } from '../menu';\nimport { ScMenuBar } from './menu-bar';\n\n@Component({\n  selector: '[scMenuBarItem]',\n  exportAs: 'scMenuBarItem',\n  imports: [OverlayModule, NgTemplateOutlet],\n  hostDirectives: [\n    {\n      directive: MenuItem,\n      inputs: ['id', 'value', 'disabled'],\n    },\n    CdkOverlayOrigin,\n  ],\n  template: `\n    <ng-content />\n\n    @if (submenuPortal(); as portal) {\n      <ng-template\n        [cdkConnectedOverlayOpen]=\"rendered()\"\n        [cdkConnectedOverlay]=\"{ origin: overlayOrigin, usePopover: 'inline' }\"\n        [cdkConnectedOverlayPositions]=\"[\n          {\n            originX: 'start',\n            originY: 'bottom',\n            overlayX: 'start',\n            overlayY: 'top',\n            offsetY: 4,\n          },\n        ]\"\n        cdkAttachPopoverAsChild\n      >\n        <ng-container [ngTemplateOutlet]=\"portal.templateRef\" />\n      </ng-template>\n    }\n  `,\n  host: {\n    'data-slot': 'menu-bar-item',\n    '[class]': 'class()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScMenuBarItem {\n  readonly classInput = input<string>('', { alias: 'class' });\n  readonly overlayOrigin = inject(CdkOverlayOrigin);\n  private readonly menuItem = inject(MenuItem);\n  protected readonly submenuPortal = contentChild(ScMenuPortal);\n  private readonly connectedOverlay = viewChild(CdkConnectedOverlay);\n\n  private readonly scMenuBar = inject(ScMenuBar);\n\n  protected readonly rendered = computed(() => this.scMenuBar.rendered());\n\n  protected readonly class = computed(() =>\n    cn(\n      'flex items-center rounded-sm px-2 py-0.5 text-sm font-medium outline-hidden select-none cursor-default hover:bg-muted aria-expanded:bg-muted focus-visible:outline-2 focus-visible:outline-ring',\n      this.classInput(),\n    ),\n  );\n\n  constructor() {\n    effect(() => {\n      const menu = this.submenuPortal()?.menu();\n      if (menu) {\n        signalSetFn(this.menuItem.submenu[SIGNAL], menu);\n      }\n    });\n\n    // Force overlay to recalculate position when menu item expands\n    effect(() => {\n      const expanded = this.menuItem.expanded();\n      if (expanded) {\n        this.connectedOverlay()?.overlayRef?.updatePosition();\n      }\n    });\n  }\n}\n"]}

package/esm2022/lib/components/native-select/index.js

@@ -0,0 +1,6 @@
+export * from './native-select-container';
+export * from './native-select';
+export * from './native-select-icon';
+export * from './native-select-option';
+export * from './native-select-optgroup';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/native-select/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/native-select/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC","sourcesContent":["export * from './native-select-container';\nexport * from './native-select';\nexport * from './native-select-icon';\nexport * from './native-select-option';\nexport * from './native-select-optgroup';\n"]}

package/esm2022/lib/components/native-select/native-select-container.js

@@ -0,0 +1,20 @@
+import { computed, Directive, input } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScNativeSelectContainer {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('group/native-select relative w-fit has-[select:disabled]:opacity-50', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelectContainer, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScNativeSelectContainer, isStandalone: true, selector: "div[scNativeSelectContainer]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "native-select-container" }, properties: { "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelectContainer, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'div[scNativeSelectContainer]',
+                    host: {
+                        'data-slot': 'native-select-container',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=native-select-container.js.map

package/esm2022/lib/components/native-select/native-select-container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-select-container.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/native-select/native-select-container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AASjC,MAAM,OAAO,uBAAuB;IACzB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,qEAAqE,EACrE,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGARS,uBAAuB;2FAAvB,uBAAuB;;2FAAvB,uBAAuB;kBAPnC,SAAS;mBAAC;oBACT,QAAQ,EAAE,8BAA8B;oBACxC,IAAI,EAAE;wBACJ,WAAW,EAAE,yBAAyB;wBACtC,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: 'div[scNativeSelectContainer]',\n  host: {\n    'data-slot': 'native-select-container',\n    '[class]': 'class()',\n  },\n})\nexport class ScNativeSelectContainer {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn(\n      'group/native-select relative w-fit has-[select:disabled]:opacity-50',\n      this.classInput(),\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/native-select/native-select-icon.js

@@ -0,0 +1,20 @@
+import { computed, Directive, input } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScNativeSelectIcon {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('text-muted-foreground top-1/2 right-2.5 size-4 -translate-y-1/2 pointer-events-none absolute select-none', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelectIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScNativeSelectIcon, isStandalone: true, selector: "[scNativeSelectIcon]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "native-select-icon" }, properties: { "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelectIcon, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[scNativeSelectIcon]',
+                    host: {
+                        'data-slot': 'native-select-icon',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=native-select-icon.js.map

package/esm2022/lib/components/native-select/native-select-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-select-icon.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/native-select/native-select-icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AASjC,MAAM,OAAO,kBAAkB;IACpB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,0GAA0G,EAC1G,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGARS,kBAAkB;2FAAlB,kBAAkB;;2FAAlB,kBAAkB;kBAP9B,SAAS;mBAAC;oBACT,QAAQ,EAAE,sBAAsB;oBAChC,IAAI,EAAE;wBACJ,WAAW,EAAE,oBAAoB;wBACjC,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: '[scNativeSelectIcon]',\n  host: {\n    'data-slot': 'native-select-icon',\n    '[class]': 'class()',\n  },\n})\nexport class ScNativeSelectIcon {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn(\n      'text-muted-foreground top-1/2 right-2.5 size-4 -translate-y-1/2 pointer-events-none absolute select-none',\n      this.classInput(),\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/native-select/native-select-optgroup.js

@@ -0,0 +1,20 @@
+import { computed, Directive, input } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScNativeSelectOptGroup {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn(this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelectOptGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScNativeSelectOptGroup, isStandalone: true, selector: "optgroup[scNativeSelectOptgroup]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "native-select-optgroup" }, properties: { "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelectOptGroup, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'optgroup[scNativeSelectOptgroup]',
+                    host: {
+                        'data-slot': 'native-select-optgroup',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=native-select-optgroup.js.map

package/esm2022/lib/components/native-select/native-select-optgroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-select-optgroup.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/native-select/native-select-optgroup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AASjC,MAAM,OAAO,sBAAsB;IACxB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,iDAAC,CAAC;uGAHtD,sBAAsB;2FAAtB,sBAAsB;;2FAAtB,sBAAsB;kBAPlC,SAAS;mBAAC;oBACT,QAAQ,EAAE,kCAAkC;oBAC5C,IAAI,EAAE;wBACJ,WAAW,EAAE,wBAAwB;wBACrC,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: 'optgroup[scNativeSelectOptgroup]',\n  host: {\n    'data-slot': 'native-select-optgroup',\n    '[class]': 'class()',\n  },\n})\nexport class ScNativeSelectOptGroup {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() => cn(this.classInput()));\n}\n"]}

package/esm2022/lib/components/native-select/native-select-option.js

@@ -0,0 +1,20 @@
+import { computed, Directive, input } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScNativeSelectOption {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn(this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelectOption, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScNativeSelectOption, isStandalone: true, selector: "option[scNativeSelectOption]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "native-select-option" }, properties: { "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelectOption, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'option[scNativeSelectOption]',
+                    host: {
+                        'data-slot': 'native-select-option',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=native-select-option.js.map

package/esm2022/lib/components/native-select/native-select-option.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-select-option.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/native-select/native-select-option.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AASjC,MAAM,OAAO,oBAAoB;IACtB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,iDAAC,CAAC;uGAHtD,oBAAoB;2FAApB,oBAAoB;;2FAApB,oBAAoB;kBAPhC,SAAS;mBAAC;oBACT,QAAQ,EAAE,8BAA8B;oBACxC,IAAI,EAAE;wBACJ,WAAW,EAAE,sBAAsB;wBACnC,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: 'option[scNativeSelectOption]',\n  host: {\n    'data-slot': 'native-select-option',\n    '[class]': 'class()',\n  },\n})\nexport class ScNativeSelectOption {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() => cn(this.classInput()));\n}\n"]}

package/esm2022/lib/components/native-select/native-select.js

@@ -0,0 +1,29 @@
+import { _IdGenerator } from '@angular/cdk/a11y';
+import { computed, Directive, inject, input } from '@angular/core';
+import { cn } from '../../utils';
+import { SC_FIELD } from '../field';
+import * as i0 from "@angular/core";
+export class ScNativeSelect {
+    field = inject(SC_FIELD, { optional: true });
+    fallbackId = inject(_IdGenerator).getId('sc-native-select-');
+    idInput = input('', { ...(ngDevMode ? { debugName: "idInput" } : {}), alias: 'id' });
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    size = input('default', ...(ngDevMode ? [{ debugName: "size" }] : []));
+    id = computed(() => this.idInput() || this.field?.id() || this.fallbackId, ...(ngDevMode ? [{ debugName: "id" }] : []));
+    class = computed(() => cn('border-input placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 h-8 w-full min-w-0 appearance-none rounded-lg border bg-transparent py-1 pr-8 pl-2.5 text-sm transition-colors select-none focus-visible:ring-3 aria-invalid:ring-3 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-[size=sm]:py-0.5 outline-none disabled:pointer-events-none disabled:cursor-not-allowed', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelect, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScNativeSelect, isStandalone: true, selector: "select[scNativeSelect]", inputs: { idInput: { classPropertyName: "idInput", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "native-select" }, properties: { "attr.id": "id()", "attr.data-size": "size()", "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNativeSelect, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'select[scNativeSelect]',
+                    host: {
+                        'data-slot': 'native-select',
+                        '[attr.id]': 'id()',
+                        '[attr.data-size]': 'size()',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { idInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+//# sourceMappingURL=native-select.js.map

package/esm2022/lib/components/native-select/native-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"native-select.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/native-select/native-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;;AAWpC,MAAM,OAAO,cAAc;IACR,KAAK,GAAG,MAAM,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAC7C,UAAU,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC;IAErE,OAAO,GAAG,KAAK,CAAC,EAAE,oDAAI,KAAK,EAAE,IAAI,GAAG,CAAC;IACrC,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IACnD,IAAI,GAAG,KAAK,CAAmB,SAAS,gDAAC,CAAC;IAE1C,EAAE,GAAG,QAAQ,CACpB,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,IAAI,CAAC,KAAK,EAAE,EAAE,EAAE,IAAI,IAAI,CAAC,UAAU,8CAC5D,CAAC;IAEiB,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,0pBAA0pB,EAC1pB,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGAjBS,cAAc;2FAAd,cAAc;;2FAAd,cAAc;kBAT1B,SAAS;mBAAC;oBACT,QAAQ,EAAE,wBAAwB;oBAClC,IAAI,EAAE;wBACJ,WAAW,EAAE,eAAe;wBAC5B,WAAW,EAAE,MAAM;wBACnB,kBAAkB,EAAE,QAAQ;wBAC5B,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { _IdGenerator } from '@angular/cdk/a11y';\nimport { computed, Directive, inject, input } from '@angular/core';\nimport { cn } from '../../utils';\nimport { SC_FIELD } from '../field';\n\n@Directive({\n  selector: 'select[scNativeSelect]',\n  host: {\n    'data-slot': 'native-select',\n    '[attr.id]': 'id()',\n    '[attr.data-size]': 'size()',\n    '[class]': 'class()',\n  },\n})\nexport class ScNativeSelect {\n  private readonly field = inject(SC_FIELD, { optional: true });\n  private readonly fallbackId = inject(_IdGenerator).getId('sc-native-select-');\n\n  readonly idInput = input('', { alias: 'id' });\n  readonly classInput = input<string>('', { alias: 'class' });\n  readonly size = input<'default' | 'sm'>('default');\n\n  readonly id = computed(\n    () => this.idInput() || this.field?.id() || this.fallbackId,\n  );\n\n  protected readonly class = computed(() =>\n    cn(\n      'border-input placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 h-8 w-full min-w-0 appearance-none rounded-lg border bg-transparent py-1 pr-8 pl-2.5 text-sm transition-colors select-none focus-visible:ring-3 aria-invalid:ring-3 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-[size=sm]:py-0.5 outline-none disabled:pointer-events-none disabled:cursor-not-allowed',\n      this.classInput(),\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/navigation-menu/index.js

@@ -0,0 +1,9 @@
+export { ScNavigationMenu } from './navigation-menu';
+export { ScNavigationMenuContent } from './navigation-menu-content';
+export { ScNavigationMenuGrid } from './navigation-menu-grid';
+export { ScNavigationMenuItem } from './navigation-menu-item';
+export { ScNavigationMenuLink } from './navigation-menu-link';
+export { ScNavigationMenuList } from './navigation-menu-list';
+export { ScNavigationMenuPortal } from './navigation-menu-portal';
+export { ScNavigationMenuTrigger } from './navigation-menu-trigger';
+//# sourceMappingURL=index.js.map

package/esm2022/lib/components/navigation-menu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/navigation-menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC","sourcesContent":["export { ScNavigationMenu } from './navigation-menu';\nexport { ScNavigationMenuContent } from './navigation-menu-content';\nexport { ScNavigationMenuGrid } from './navigation-menu-grid';\nexport { ScNavigationMenuItem } from './navigation-menu-item';\nexport { ScNavigationMenuLink } from './navigation-menu-link';\nexport { ScNavigationMenuList } from './navigation-menu-list';\nexport { ScNavigationMenuPortal } from './navigation-menu-portal';\nexport { ScNavigationMenuTrigger } from './navigation-menu-trigger';\n"]}

package/esm2022/lib/components/navigation-menu/navigation-menu-content.js

@@ -0,0 +1,37 @@
+import { ChangeDetectionStrategy, Component, computed, inject, input, ViewEncapsulation, } from '@angular/core';
+import { cn } from '../../utils';
+import { ScNavigationMenuItem } from './navigation-menu-item';
+import * as i0 from "@angular/core";
+export class ScNavigationMenuContent {
+    menuItem = inject(ScNavigationMenuItem);
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('block', 'left-0 top-0 w-full md:absolute md:w-auto', 'bg-popover text-popover-foreground', 'rounded-md border shadow-lg', 'overflow-hidden', 'data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out', 'data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out', 'data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52', 'data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52', '**:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    onMouseEnter() {
+        this.menuItem.cancelHide();
+    }
+    onMouseLeave() {
+        this.menuItem.onMouseLeave();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNavigationMenuContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.5", type: ScNavigationMenuContent, isStandalone: true, selector: "div[scNavigationMenuContent]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "navigation-menu-content" }, listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" }, properties: { "class": "class()" } }, ngImport: i0, template: `
+    <ng-content />
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNavigationMenuContent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'div[scNavigationMenuContent]',
+                    template: `
+    <ng-content />
+  `,
+                    host: {
+                        'data-slot': 'navigation-menu-content',
+                        '[class]': 'class()',
+                        '(mouseenter)': 'onMouseEnter()',
+                        '(mouseleave)': 'onMouseLeave()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=navigation-menu-content.js.map

package/esm2022/lib/components/navigation-menu/navigation-menu-content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-menu-content.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/navigation-menu/navigation-menu-content.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;;AAgB9D,MAAM,OAAO,uBAAuB;IACjB,QAAQ,GAAG,MAAM,CAAC,oBAAoB,CAAC,CAAC;IAChD,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,OAAO,EACP,2CAA2C,EAC3C,oCAAoC,EACpC,6BAA6B,EAC7B,iBAAiB,EACjB,gEAAgE,EAChE,0DAA0D,EAC1D,8FAA8F,EAC9F,wFAAwF,EACxF,yGAAyG,EACzG,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;IAEF,YAAY;QACV,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;IAC7B,CAAC;IAED,YAAY;QACV,IAAI,CAAC,QAAQ,CAAC,YAAY,EAAE,CAAC;IAC/B,CAAC;uGA1BU,uBAAuB;2FAAvB,uBAAuB,2ZAZxB;;GAET;;2FAUU,uBAAuB;kBAdnC,SAAS;mBAAC;oBACT,QAAQ,EAAE,8BAA8B;oBACxC,QAAQ,EAAE;;GAET;oBACD,IAAI,EAAE;wBACJ,WAAW,EAAE,yBAAyB;wBACtC,SAAS,EAAE,SAAS;wBACpB,cAAc,EAAE,gBAAgB;wBAChC,cAAc,EAAE,gBAAgB;qBACjC;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;iBAChD","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  inject,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { cn } from '../../utils';\nimport { ScNavigationMenuItem } from './navigation-menu-item';\n\n@Component({\n  selector: 'div[scNavigationMenuContent]',\n  template: `\n    <ng-content />\n  `,\n  host: {\n    'data-slot': 'navigation-menu-content',\n    '[class]': 'class()',\n    '(mouseenter)': 'onMouseEnter()',\n    '(mouseleave)': 'onMouseLeave()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScNavigationMenuContent {\n  private readonly menuItem = inject(ScNavigationMenuItem);\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn(\n      'block',\n      'left-0 top-0 w-full md:absolute md:w-auto',\n      'bg-popover text-popover-foreground',\n      'rounded-md border shadow-lg',\n      'overflow-hidden',\n      'data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out',\n      'data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out',\n      'data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52',\n      'data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52',\n      '**:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none',\n      this.classInput(),\n    ),\n  );\n\n  onMouseEnter(): void {\n    this.menuItem.cancelHide();\n  }\n\n  onMouseLeave(): void {\n    this.menuItem.onMouseLeave();\n  }\n}\n"]}

package/esm2022/lib/components/navigation-menu/navigation-menu-grid.js

@@ -0,0 +1,20 @@
+import { computed, Directive, input } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScNavigationMenuGrid {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    class = computed(() => cn('grid w-[400px] gap-3 p-4 md:w-[500px] md:grid-cols-2 lg:w-[600px]', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNavigationMenuGrid, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScNavigationMenuGrid, isStandalone: true, selector: "ul[scNavigationMenuGrid]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "navigation-menu-grid" }, properties: { "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNavigationMenuGrid, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ul[scNavigationMenuGrid]',
+                    host: {
+                        'data-slot': 'navigation-menu-grid',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+//# sourceMappingURL=navigation-menu-grid.js.map

package/esm2022/lib/components/navigation-menu/navigation-menu-grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-menu-grid.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/navigation-menu/navigation-menu-grid.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AASjC,MAAM,OAAO,oBAAoB;IACtB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IAEzC,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,mEAAmE,EACnE,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGARS,oBAAoB;2FAApB,oBAAoB;;2FAApB,oBAAoB;kBAPhC,SAAS;mBAAC;oBACT,QAAQ,EAAE,0BAA0B;oBACpC,IAAI,EAAE;wBACJ,WAAW,EAAE,sBAAsB;wBACnC,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: 'ul[scNavigationMenuGrid]',\n  host: {\n    'data-slot': 'navigation-menu-grid',\n    '[class]': 'class()',\n  },\n})\nexport class ScNavigationMenuGrid {\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  protected readonly class = computed(() =>\n    cn(\n      'grid w-[400px] gap-3 p-4 md:w-[500px] md:grid-cols-2 lg:w-[600px]',\n      this.classInput(),\n    ),\n  );\n}\n"]}

package/esm2022/lib/components/navigation-menu/navigation-menu-item.js

@@ -0,0 +1,118 @@
+import { _IdGenerator } from '@angular/cdk/a11y';
+import { NgTemplateOutlet } from '@angular/common';
+import { OverlayModule } from '@angular/cdk/overlay';
+import { ChangeDetectionStrategy, Component, computed, contentChild, DestroyRef, inject, input, signal, ViewEncapsulation, } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { NavigationStart, Router } from '@angular/router';
+import { filter } from 'rxjs';
+import { cn } from '../../utils';
+import { ScNavigationMenu } from './navigation-menu';
+import { ScNavigationMenuPortal } from './navigation-menu-portal';
+import { ScNavigationMenuTrigger } from './navigation-menu-trigger';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/cdk/overlay";
+const position = {
+    originX: 'start',
+    originY: 'bottom',
+    overlayX: 'start',
+    overlayY: 'top',
+    offsetY: 4,
+};
+export class ScNavigationMenuItem {
+    navigationMenu = inject(ScNavigationMenu);
+    router = inject(Router);
+    destroyRef = inject(DestroyRef);
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    itemId = inject(_IdGenerator).getId('sc-navigation-menu-item-');
+    /** Whether this item's content is open */
+    open = signal(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
+    triggerChild = contentChild(ScNavigationMenuTrigger, ...(ngDevMode ? [{ debugName: "triggerChild" }] : []));
+    navigationMenuPortal = contentChild(ScNavigationMenuPortal, ...(ngDevMode ? [{ debugName: "navigationMenuPortal" }] : []));
+    origin = computed(() => this.triggerChild()?.overlayOrigin, ...(ngDevMode ? [{ debugName: "origin" }] : []));
+    position = position;
+    class = computed(() => cn('block relative', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    hideTimeout = null;
+    ngOnInit() {
+        // Close the menu when navigation starts
+        this.router.events
+            .pipe(filter((event) => event instanceof NavigationStart), takeUntilDestroyed(this.destroyRef))
+            .subscribe(() => {
+            this.open.set(false);
+            if (this.navigationMenu.activeItem() === this.itemId) {
+                this.navigationMenu.setActiveItem(null);
+            }
+        });
+    }
+    onMouseEnter() {
+        this.cancelHide();
+        this.open.set(true);
+        this.navigationMenu.setActiveItem(this.itemId);
+    }
+    onMouseLeave() {
+        this.scheduleHide();
+    }
+    scheduleHide() {
+        this.cancelHide();
+        this.hideTimeout = setTimeout(() => {
+            this.open.set(false);
+            if (this.navigationMenu.activeItem() === this.itemId) {
+                this.navigationMenu.setActiveItem(null);
+            }
+        }, 100);
+    }
+    cancelHide() {
+        if (this.hideTimeout) {
+            clearTimeout(this.hideTimeout);
+            this.hideTimeout = null;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNavigationMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: ScNavigationMenuItem, isStandalone: true, selector: "li[scNavigationMenuItem]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "navigation-menu-item" }, listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" }, properties: { "class": "class()" } }, queries: [{ propertyName: "triggerChild", first: true, predicate: ScNavigationMenuTrigger, descendants: true, isSignal: true }, { propertyName: "navigationMenuPortal", first: true, predicate: ScNavigationMenuPortal, descendants: true, isSignal: true }], ngImport: i0, template: `
+    <ng-content />
+
+    @if (origin(); as origin) {
+      <ng-template
+        cdkConnectedOverlay
+        [cdkConnectedOverlayOrigin]="origin"
+        [cdkConnectedOverlayOpen]="open()"
+        [cdkConnectedOverlayPositions]="[position]"
+      >
+        @if (navigationMenuPortal(); as portal) {
+          <ng-container [ngTemplateOutlet]="portal.templateRef" />
+        }
+      </ng-template>
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNavigationMenuItem, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'li[scNavigationMenuItem]',
+                    imports: [OverlayModule, NgTemplateOutlet],
+                    template: `
+    <ng-content />
+
+    @if (origin(); as origin) {
+      <ng-template
+        cdkConnectedOverlay
+        [cdkConnectedOverlayOrigin]="origin"
+        [cdkConnectedOverlayOpen]="open()"
+        [cdkConnectedOverlayPositions]="[position]"
+      >
+        @if (navigationMenuPortal(); as portal) {
+          <ng-container [ngTemplateOutlet]="portal.templateRef" />
+        }
+      </ng-template>
+    }
+  `,
+                    host: {
+                        'data-slot': 'navigation-menu-item',
+                        '[class]': 'class()',
+                        '(mouseenter)': 'onMouseEnter()',
+                        '(mouseleave)': 'onMouseLeave()',
+                    },
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], triggerChild: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ScNavigationMenuTrigger), { isSignal: true }] }], navigationMenuPortal: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ScNavigationMenuPortal), { isSignal: true }] }] } });
+//# sourceMappingURL=navigation-menu-item.js.map

package/esm2022/lib/components/navigation-menu/navigation-menu-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-menu-item.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/navigation-menu/navigation-menu-item.ts"],"names":[],"mappings":"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","sourcesContent":["import { _IdGenerator } from '@angular/cdk/a11y';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { ConnectedPosition, OverlayModule } from '@angular/cdk/overlay';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  contentChild,\n  DestroyRef,\n  inject,\n  input,\n  OnInit,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { NavigationStart, Router } from '@angular/router';\nimport { filter } from 'rxjs';\nimport { cn } from '../../utils';\nimport { ScNavigationMenu } from './navigation-menu';\nimport { ScNavigationMenuPortal } from './navigation-menu-portal';\nimport { ScNavigationMenuTrigger } from './navigation-menu-trigger';\n\nconst position: ConnectedPosition = {\n  originX: 'start',\n  originY: 'bottom',\n  overlayX: 'start',\n  overlayY: 'top',\n  offsetY: 4,\n};\n\n@Component({\n  selector: 'li[scNavigationMenuItem]',\n  imports: [OverlayModule, NgTemplateOutlet],\n  template: `\n    <ng-content />\n\n    @if (origin(); as origin) {\n      <ng-template\n        cdkConnectedOverlay\n        [cdkConnectedOverlayOrigin]=\"origin\"\n        [cdkConnectedOverlayOpen]=\"open()\"\n        [cdkConnectedOverlayPositions]=\"[position]\"\n      >\n        @if (navigationMenuPortal(); as portal) {\n          <ng-container [ngTemplateOutlet]=\"portal.templateRef\" />\n        }\n      </ng-template>\n    }\n  `,\n  host: {\n    'data-slot': 'navigation-menu-item',\n    '[class]': 'class()',\n    '(mouseenter)': 'onMouseEnter()',\n    '(mouseleave)': 'onMouseLeave()',\n  },\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ScNavigationMenuItem implements OnInit {\n  readonly navigationMenu = inject(ScNavigationMenu);\n  private readonly router = inject(Router);\n  private readonly destroyRef = inject(DestroyRef);\n  readonly classInput = input<string>('', { alias: 'class' });\n\n  readonly itemId = inject(_IdGenerator).getId('sc-navigation-menu-item-');\n\n  /** Whether this item's content is open */\n  readonly open = signal<boolean>(false);\n\n  private readonly triggerChild = contentChild(ScNavigationMenuTrigger);\n  protected readonly navigationMenuPortal = contentChild(\n    ScNavigationMenuPortal,\n  );\n\n  readonly origin = computed(() => this.triggerChild()?.overlayOrigin);\n\n  protected readonly position = position;\n\n  protected readonly class = computed(() =>\n    cn('block relative', this.classInput()),\n  );\n\n  private hideTimeout: ReturnType<typeof setTimeout> | null = null;\n\n  ngOnInit(): void {\n    // Close the menu when navigation starts\n    this.router.events\n      .pipe(\n        filter((event) => event instanceof NavigationStart),\n        takeUntilDestroyed(this.destroyRef),\n      )\n      .subscribe(() => {\n        this.open.set(false);\n        if (this.navigationMenu.activeItem() === this.itemId) {\n          this.navigationMenu.setActiveItem(null);\n        }\n      });\n  }\n\n  onMouseEnter(): void {\n    this.cancelHide();\n    this.open.set(true);\n    this.navigationMenu.setActiveItem(this.itemId);\n  }\n\n  onMouseLeave(): void {\n    this.scheduleHide();\n  }\n\n  private scheduleHide(): void {\n    this.cancelHide();\n    this.hideTimeout = setTimeout(() => {\n      this.open.set(false);\n      if (this.navigationMenu.activeItem() === this.itemId) {\n        this.navigationMenu.setActiveItem(null);\n      }\n    }, 100);\n  }\n\n  cancelHide(): void {\n    if (this.hideTimeout) {\n      clearTimeout(this.hideTimeout);\n      this.hideTimeout = null;\n    }\n  }\n}\n"]}

package/esm2022/lib/components/navigation-menu/navigation-menu-link.js

@@ -0,0 +1,22 @@
+import { computed, Directive, input } from '@angular/core';
+import { cn } from '../../utils';
+import * as i0 from "@angular/core";
+export class ScNavigationMenuLink {
+    classInput = input('', { ...(ngDevMode ? { debugName: "classInput" } : {}), alias: 'class' });
+    active = input(false, ...(ngDevMode ? [{ debugName: "active" }] : []));
+    class = computed(() => cn('data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground', 'hover:bg-accent hover:text-accent-foreground', 'focus:bg-accent focus:text-accent-foreground', 'focus-visible:ring-ring/50', '[&_svg:not([class*="text-"])]:text-muted-foreground', 'flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none', 'focus-visible:ring-[3px] focus-visible:outline-1', '[&_svg:not([class*="size-"])]:size-4', this.classInput()), ...(ngDevMode ? [{ debugName: "class" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNavigationMenuLink, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.5", type: ScNavigationMenuLink, isStandalone: true, selector: "a[scNavigationMenuLink]", inputs: { classInput: { classPropertyName: "classInput", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "navigation-menu-link" }, properties: { "attr.data-active": "active()", "class": "class()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: ScNavigationMenuLink, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'a[scNavigationMenuLink]',
+                    host: {
+                        'data-slot': 'navigation-menu-link',
+                        '[attr.data-active]': 'active()',
+                        '[class]': 'class()',
+                    },
+                }]
+        }], propDecorators: { classInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }] } });
+//# sourceMappingURL=navigation-menu-link.js.map

package/esm2022/lib/components/navigation-menu/navigation-menu-link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-menu-link.js","sourceRoot":"","sources":["../../../../../../../libs/ui/src/lib/components/navigation-menu/navigation-menu-link.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC3D,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;;AAUjC,MAAM,OAAO,oBAAoB;IACtB,UAAU,GAAG,KAAK,CAAS,EAAE,uDAAI,KAAK,EAAE,OAAO,GAAG,CAAC;IACnD,MAAM,GAAG,KAAK,CAAU,KAAK,kDAAC,CAAC;IAErB,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CACvC,EAAE,CACA,iJAAiJ,EACjJ,8CAA8C,EAC9C,8CAA8C,EAC9C,4BAA4B,EAC5B,qDAAqD,EACrD,wEAAwE,EACxE,kDAAkD,EAClD,sCAAsC,EACtC,IAAI,CAAC,UAAU,EAAE,CAClB,iDACF,CAAC;uGAhBS,oBAAoB;2FAApB,oBAAoB;;2FAApB,oBAAoB;kBARhC,SAAS;mBAAC;oBACT,QAAQ,EAAE,yBAAyB;oBACnC,IAAI,EAAE;wBACJ,WAAW,EAAE,sBAAsB;wBACnC,oBAAoB,EAAE,UAAU;wBAChC,SAAS,EAAE,SAAS;qBACrB;iBACF","sourcesContent":["import { computed, Directive, input } from '@angular/core';\nimport { cn } from '../../utils';\n\n@Directive({\n  selector: 'a[scNavigationMenuLink]',\n  host: {\n    'data-slot': 'navigation-menu-link',\n    '[attr.data-active]': 'active()',\n    '[class]': 'class()',\n  },\n})\nexport class ScNavigationMenuLink {\n  readonly classInput = input<string>('', { alias: 'class' });\n  readonly active = input<boolean>(false);\n\n  protected readonly class = computed(() =>\n    cn(\n      'data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground',\n      'hover:bg-accent hover:text-accent-foreground',\n      'focus:bg-accent focus:text-accent-foreground',\n      'focus-visible:ring-ring/50',\n      '[&_svg:not([class*=\"text-\"])]:text-muted-foreground',\n      'flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none',\n      'focus-visible:ring-[3px] focus-visible:outline-1',\n      '[&_svg:not([class*=\"size-\"])]:size-4',\n      this.classInput(),\n    ),\n  );\n}\n"]}