npm - @frame-ui-ng/components - Versions diffs - 0.5.0-beta.0 → 0.6.0-beta.0 - Mend

@frame-ui-ng/components 0.5.0-beta.0 → 0.6.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (106) hide show

package/fesm2022/frame-ui-ng-components-breadcrumb.mjs CHANGED Viewed

@@ -95,7 +95,11 @@ class FrBreadcrumbEllipsis {
     label = input('More pages', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrBreadcrumbEllipsis, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.16", type: FrBreadcrumbEllipsis, isStandalone: true, selector: "[frBreadcrumbEllipsis], frame-breadcrumb-ellipsis", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "presentation" }, classAttribute: "frame-breadcrumb__ellipsis" }, ngImport: i0, template: `
-    <span aria-hidden="true">...</span>
+    <svg aria-hidden="true" viewBox="0 0 24 24" fill="currentColor">
+      <circle cx="5" cy="12" r="1.75"></circle>
+      <circle cx="12" cy="12" r="1.75"></circle>
+      <circle cx="19" cy="12" r="1.75"></circle>
+    </svg>
     <span class="frame-breadcrumb__sr-only">{{ label() }}</span>
   `, isInline: true });
 }
@@ -108,7 +112,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
                         'role': 'presentation',
                     },
                     template: `
-    <span aria-hidden="true">...</span>
+    <svg aria-hidden="true" viewBox="0 0 24 24" fill="currentColor">
+      <circle cx="5" cy="12" r="1.75"></circle>
+      <circle cx="12" cy="12" r="1.75"></circle>
+      <circle cx="19" cy="12" r="1.75"></circle>
+    </svg>
     <span class="frame-breadcrumb__sr-only">{{ label() }}</span>
   `,
                 }]

package/fesm2022/frame-ui-ng-components-breadcrumb.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"frame-ui-ng-components-breadcrumb.mjs","sources":["../../../projects/components/breadcrumb/src/breadcrumb.ts","../../../projects/components/breadcrumb/breadcrumb.module.ts","../../../projects/components/breadcrumb/frame-ui-ng-components-breadcrumb.ts"],"sourcesContent":["import { Component, Directive, input } from '@angular/core';\r\n\r\n/** Breadcrumb navigation landmark. /\r\n@Directive({\r\n selector: 'nav[frBreadcrumb], [frBreadcrumb]',\r\n host: {\r\n class: 'frame-breadcrumb',\r\n '[attr.aria-label]': 'ariaLabel()',\r\n },\r\n})\r\nexport class FrBreadcrumb {\r\n readonly ariaLabel = input('breadcrumb', { alias: 'aria-label' });\r\n}\r\n\r\n/* List slot for breadcrumb. /\r\n@Directive({\r\n selector: 'ol[frBreadcrumbList], ul[frBreadcrumbList], [frBreadcrumbList]',\r\n host: {\r\n class: 'frame-breadcrumb__list',\r\n },\r\n})\r\nexport class FrBreadcrumbList {}\r\n\r\n/* Item slot for breadcrumb. /\r\n@Directive({\r\n selector: 'li[frBreadcrumbItem], [frBreadcrumbItem]',\r\n host: {\r\n class: 'frame-breadcrumb__item',\r\n },\r\n})\r\nexport class FrBreadcrumbItem {}\r\n\r\n/* Navigable link inside a breadcrumb item. /\r\n@Directive({\r\n selector: 'a[frBreadcrumbLink], [frBreadcrumbLink]',\r\n host: {\r\n class: 'frame-breadcrumb__link',\r\n },\r\n})\r\nexport class FrBreadcrumbLink {}\r\n\r\n/* Page slot for breadcrumb. /\r\n@Directive({\r\n selector: '[frBreadcrumbPage]',\r\n host: {\r\n class: 'frame-breadcrumb__page',\r\n 'aria-current': 'page',\r\n },\r\n})\r\nexport class FrBreadcrumbPage {}\r\n\r\n/* Separator slot for breadcrumb. /\r\n@Directive({\r\n selector: '[frBreadcrumbSeparator]',\r\n host: {\r\n class: 'frame-breadcrumb__separator',\r\n 'aria-hidden': 'true',\r\n 'role': 'presentation',\r\n },\r\n})\r\nexport class FrBreadcrumbSeparator {}\r\n\r\n/* Ellipsis slot for breadcrumb. /\r\n@Component({\r\n selector: '[frBreadcrumbEllipsis], frame-breadcrumb-ellipsis',\r\n host: {\r\n class: 'frame-breadcrumb__ellipsis',\r\n 'role': 'presentation',\r\n },\r\n template: `\r\n <~~span~~ aria-hidden=\"true\"~~>...</span~~>\r\n <span class=\"frame-breadcrumb__sr-only\">{{ label() }}</span>\r\n `,\r\n})\r\nexport class FrBreadcrumbEllipsis {\r\n readonly label = input('More pages');\r\n}\r\n\r\n","import { NgModule } from '@angular/core';\nimport {\n FrBreadcrumb,\n FrBreadcrumbEllipsis,\n FrBreadcrumbItem,\n FrBreadcrumbLink,\n FrBreadcrumbList,\n FrBreadcrumbPage,\n FrBreadcrumbSeparator,\n} from './src/breadcrumb';\n\n@NgModule({\n imports: [\n FrBreadcrumb,\n FrBreadcrumbEllipsis,\n FrBreadcrumbItem,\n FrBreadcrumbLink,\n FrBreadcrumbList,\n FrBreadcrumbPage,\n FrBreadcrumbSeparator,\n ],\n exports: [\n FrBreadcrumb,\n FrBreadcrumbEllipsis,\n FrBreadcrumbItem,\n FrBreadcrumbLink,\n FrBreadcrumbList,\n FrBreadcrumbPage,\n FrBreadcrumbSeparator,\n ],\n})\nexport class FrBreadcrumbModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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~~MAYa~~,oBAAoB,CAAA;AACtB,IAAA,KAAK,GAAG,KAAK,CAAC,YAAY,4EAAC;wGADzB,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAApB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mDAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,cAAA,EAAA,EAAA,cAAA,EAAA,4BAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,~~EALrB~~,CAAA~~;;;AAGT~~,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;4FAEU,oBAAoB,EAAA,UAAA,EAAA,CAAA;~~kBAXhC~~,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,mDAAmD;AAC7D,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,4BAA4B;AACnC,wBAAA,MAAM,EAAE,cAAc;AACvB,qBAAA;AACD,oBAAA,QAAQ,EAAE,CAAA~~;;;AAGT~~,EAAA,CAAA;AACF,iBAAA;;;~~MC1CY~~,kBAAkB,CAAA;wGAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,YAlB3B,YAAY;YACZ,oBAAoB;YACpB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;AAChB,YAAA,qBAAqB,aAGrB,YAAY;YACZ,oBAAoB;YACpB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;YAChB,qBAAqB,CAAA,EAAA,CAAA;yGAGZ,kBAAkB,EAAA,CAAA;;4FAAlB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBApB9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,oBAAoB;wBACpB,gBAAgB;wBAChB,gBAAgB;wBAChB,gBAAgB;wBAChB,gBAAgB;wBAChB,qBAAqB;AACtB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,oBAAoB;wBACpB,gBAAgB;wBAChB,gBAAgB;wBAChB,gBAAgB;wBAChB,gBAAgB;wBAChB,qBAAqB;AACtB,qBAAA;AACF,iBAAA;;;AC9BD;;AAEG;;;;"}
1	+ {"version":3,"file":"frame-ui-ng-components-breadcrumb.mjs","sources":["../../../projects/components/breadcrumb/src/breadcrumb.ts","../../../projects/components/breadcrumb/breadcrumb.module.ts","../../../projects/components/breadcrumb/frame-ui-ng-components-breadcrumb.ts"],"sourcesContent":["import { Component, Directive, input } from '@angular/core';\r\n\r\n/** Breadcrumb navigation landmark. /\r\n@Directive({\r\n selector: 'nav[frBreadcrumb], [frBreadcrumb]',\r\n host: {\r\n class: 'frame-breadcrumb',\r\n '[attr.aria-label]': 'ariaLabel()',\r\n },\r\n})\r\nexport class FrBreadcrumb {\r\n readonly ariaLabel = input('breadcrumb', { alias: 'aria-label' });\r\n}\r\n\r\n/* List slot for breadcrumb. /\r\n@Directive({\r\n selector: 'ol[frBreadcrumbList], ul[frBreadcrumbList], [frBreadcrumbList]',\r\n host: {\r\n class: 'frame-breadcrumb__list',\r\n },\r\n})\r\nexport class FrBreadcrumbList {}\r\n\r\n/* Item slot for breadcrumb. /\r\n@Directive({\r\n selector: 'li[frBreadcrumbItem], [frBreadcrumbItem]',\r\n host: {\r\n class: 'frame-breadcrumb__item',\r\n },\r\n})\r\nexport class FrBreadcrumbItem {}\r\n\r\n/* Navigable link inside a breadcrumb item. /\r\n@Directive({\r\n selector: 'a[frBreadcrumbLink], [frBreadcrumbLink]',\r\n host: {\r\n class: 'frame-breadcrumb__link',\r\n },\r\n})\r\nexport class FrBreadcrumbLink {}\r\n\r\n/* Page slot for breadcrumb. /\r\n@Directive({\r\n selector: '[frBreadcrumbPage]',\r\n host: {\r\n class: 'frame-breadcrumb__page',\r\n 'aria-current': 'page',\r\n },\r\n})\r\nexport class FrBreadcrumbPage {}\r\n\r\n/* Separator slot for breadcrumb. /\r\n@Directive({\r\n selector: '[frBreadcrumbSeparator]',\r\n host: {\r\n class: 'frame-breadcrumb__separator',\r\n 'aria-hidden': 'true',\r\n 'role': 'presentation',\r\n },\r\n})\r\nexport class FrBreadcrumbSeparator {}\r\n\r\n/* Ellipsis slot for breadcrumb. /\r\n@Component({\r\n selector: '[frBreadcrumbEllipsis], frame-breadcrumb-ellipsis',\r\n host: {\r\n class: 'frame-breadcrumb__ellipsis',\r\n 'role': 'presentation',\r\n },\r\n template: `\r\n <svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\r\n <circle cx=\"5\" cy=\"12\" r=\"1.75\"></circle>\r\n <circle cx=\"12\" cy=\"12\" r=\"1.75\"></circle>\r\n <circle cx=\"19\" cy=\"12\" r=\"1.75\"></circle>\r\n </svg>\r\n <span class=\"frame-breadcrumb__sr-only\">{{ label() }}</span>\r\n `,\r\n})\r\nexport class FrBreadcrumbEllipsis {\r\n readonly label = input('More pages');\r\n}\r\n\r\n","import { NgModule } from '@angular/core';\nimport {\n FrBreadcrumb,\n FrBreadcrumbEllipsis,\n FrBreadcrumbItem,\n FrBreadcrumbLink,\n FrBreadcrumbList,\n FrBreadcrumbPage,\n FrBreadcrumbSeparator,\n} from './src/breadcrumb';\n\n@NgModule({\n imports: [\n FrBreadcrumb,\n FrBreadcrumbEllipsis,\n FrBreadcrumbItem,\n FrBreadcrumbLink,\n FrBreadcrumbList,\n FrBreadcrumbPage,\n FrBreadcrumbSeparator,\n ],\n exports: [\n FrBreadcrumb,\n FrBreadcrumbEllipsis,\n FrBreadcrumbItem,\n FrBreadcrumbLink,\n FrBreadcrumbList,\n FrBreadcrumbPage,\n FrBreadcrumbSeparator,\n ],\n})\nexport class FrBreadcrumbModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;AAEA;MAQa,YAAY,CAAA;IACd,SAAS,GAAG,KAAK,CAAC,YAAY,iFAAI,KAAK,EAAE,YAAY,EAAA,CAAG;wGADtD,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAZ,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mCAAA,EAAA,MAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,EAAA,cAAA,EAAA,kBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAPxB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,mCAAmC;AAC7C,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,kBAAkB;AACzB,wBAAA,mBAAmB,EAAE,aAAa;AACnC,qBAAA;AACF,iBAAA;;AAKD;MAOa,gBAAgB,CAAA;wGAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gEAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,wBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAhB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAN5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gEAAgE;AAC1E,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,wBAAwB;AAChC,qBAAA;AACF,iBAAA;;AAGD;MAOa,gBAAgB,CAAA;wGAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,0CAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,wBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAhB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAN5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,0CAA0C;AACpD,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,wBAAwB;AAChC,qBAAA;AACF,iBAAA;;AAGD;MAOa,gBAAgB,CAAA;wGAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,yCAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,wBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAhB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAN5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,yCAAyC;AACnD,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,wBAAwB;AAChC,qBAAA;AACF,iBAAA;;AAGD;MAQa,gBAAgB,CAAA;wGAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,cAAA,EAAA,wBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAhB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAP5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,oBAAoB;AAC9B,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,wBAAwB;AAC/B,wBAAA,cAAc,EAAE,MAAM;AACvB,qBAAA;AACF,iBAAA;;AAGD;MASa,qBAAqB,CAAA;wGAArB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAArB,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,yBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,aAAA,EAAA,MAAA,EAAA,MAAA,EAAA,cAAA,EAAA,EAAA,cAAA,EAAA,6BAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAArB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBARjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,yBAAyB;AACnC,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,6BAA6B;AACpC,wBAAA,aAAa,EAAE,MAAM;AACrB,wBAAA,MAAM,EAAE,cAAc;AACvB,qBAAA;AACF,iBAAA;;AAGD;MAgBa,oBAAoB,CAAA;AACtB,IAAA,KAAK,GAAG,KAAK,CAAC,YAAY,4EAAC;wGADzB,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAApB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mDAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,cAAA,EAAA,EAAA,cAAA,EAAA,4BAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EATrB,CAAA;;;;;;;AAOT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;4FAEU,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAfhC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,mDAAmD;AAC7D,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,4BAA4B;AACnC,wBAAA,MAAM,EAAE,cAAc;AACvB,qBAAA;AACD,oBAAA,QAAQ,EAAE,CAAA;;;;;;;AAOT,EAAA,CAAA;AACF,iBAAA;;;MC9CY,kBAAkB,CAAA;wGAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,YAlB3B,YAAY;YACZ,oBAAoB;YACpB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;AAChB,YAAA,qBAAqB,aAGrB,YAAY;YACZ,oBAAoB;YACpB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;YAChB,gBAAgB;YAChB,qBAAqB,CAAA,EAAA,CAAA;yGAGZ,kBAAkB,EAAA,CAAA;;4FAAlB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBApB9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,oBAAoB;wBACpB,gBAAgB;wBAChB,gBAAgB;wBAChB,gBAAgB;wBAChB,gBAAgB;wBAChB,qBAAqB;AACtB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,oBAAoB;wBACpB,gBAAgB;wBAChB,gBAAgB;wBAChB,gBAAgB;wBAChB,gBAAgB;wBAChB,qBAAqB;AACtB,qBAAA;AACF,iBAAA;;;AC9BD;;AAEG;;;;"}

package/fesm2022/frame-ui-ng-components-button-group.mjs CHANGED Viewed

@@ -6,14 +6,14 @@ const FR_BUTTON_GROUP_ORIENTATIONS = ['horizontal', 'vertical'];
 class FrButtonGroup {
     orientation = input('horizontal', ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrButtonGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.16", type: FrButtonGroup, isStandalone: true, selector: "[frButtonGroup], frame-button-group", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "attr.data-orientation": "orientation()" }, classAttribute: "frame-button-group" }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.16", type: FrButtonGroup, isStandalone: true, selector: "[frButtonGroup], frame-button-group", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "attr.data-orientation": "orientation()" }, classAttribute: "frame-button-group frame-corner-handles" }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrButtonGroup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[frButtonGroup], frame-button-group',
                     host: {
-                        class: 'frame-button-group',
+                        class: 'frame-button-group frame-corner-handles',
                         '[attr.data-orientation]': 'orientation()',
                         role: 'group',
                     },

package/fesm2022/frame-ui-ng-components-button-group.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"frame-ui-ng-components-button-group.mjs","sources":["../../../projects/components/button-group/src/button-group.ts","../../../projects/components/button-group/button-group.module.ts","../../../projects/components/button-group/frame-ui-ng-components-button-group.ts"],"sourcesContent":["import { Directive, input } from '@angular/core';\r\n\r\nexport const FR_BUTTON_GROUP_ORIENTATIONS = ['horizontal', 'vertical'] as const;\r\nexport type FrButtonGroupOrientation = (typeof FR_BUTTON_GROUP_ORIENTATIONS)[number];\r\n\r\n/** Groups related buttons with shared orientation. /\r\n@Directive({\r\n selector: '[frButtonGroup], frame-button-group',\r\n host: {\r\n class: 'frame-button-group',\r\n '[attr.data-orientation]': 'orientation()',\r\n role: 'group',\r\n },\r\n})\r\nexport class FrButtonGroup {\r\n readonly orientation = input<FrButtonGroupOrientation>('horizontal');\r\n}\r\n","import { NgModule } from '@angular/core';\nimport {\n FrButtonGroup,\n} from './src/button-group';\n\n@NgModule({\n imports: [\n FrButtonGroup,\n ],\n exports: [\n FrButtonGroup,\n ],\n})\nexport class FrButtonGroupModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;MAEa,4BAA4B,GAAG,CAAC,YAAY,EAAE,UAAU;AAGrE;MASa,aAAa,CAAA;AACf,IAAA,WAAW,GAAG,KAAK,CAA2B,YAAY,kFAAC;wGADzD,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAb,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qCAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,OAAA,EAAA,EAAA,UAAA,EAAA,EAAA,uBAAA,EAAA,eAAA,EAAA,EAAA,cAAA,EAAA,~~oBAAA~~,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBARzB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,qCAAqC;AAC/C,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,~~oBAAoB~~;~~AAC3B~~,wBAAA,yBAAyB,EAAE,eAAe;AAC1C,wBAAA,IAAI,EAAE,OAAO;AACd,qBAAA;AACF,iBAAA;;;MCAY,mBAAmB,CAAA;wGAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;yGAAnB,mBAAmB,EAAA,OAAA,EAAA,CAN5B,aAAa,CAAA,EAAA,OAAA,EAAA,CAGb,aAAa,CAAA,EAAA,CAAA;yGAGJ,mBAAmB,EAAA,CAAA;;4FAAnB,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAR/B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,aAAa;AACd,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,aAAa;AACd,qBAAA;AACF,iBAAA;;;ACZD;;AAEG;;;;"}
1	+ {"version":3,"file":"frame-ui-ng-components-button-group.mjs","sources":["../../../projects/components/button-group/src/button-group.ts","../../../projects/components/button-group/button-group.module.ts","../../../projects/components/button-group/frame-ui-ng-components-button-group.ts"],"sourcesContent":["import { Directive, input } from '@angular/core';\r\n\r\nexport const FR_BUTTON_GROUP_ORIENTATIONS = ['horizontal', 'vertical'] as const;\r\nexport type FrButtonGroupOrientation = (typeof FR_BUTTON_GROUP_ORIENTATIONS)[number];\r\n\r\n/** Groups related buttons with shared orientation. /\r\n@Directive({\r\n selector: '[frButtonGroup], frame-button-group',\r\n host: {\r\n class: 'frame-button-group frame-corner-handles',\r\n '[attr.data-orientation]': 'orientation()',\r\n role: 'group',\r\n },\r\n})\r\nexport class FrButtonGroup {\r\n readonly orientation = input<FrButtonGroupOrientation>('horizontal');\r\n}\r\n","import { NgModule } from '@angular/core';\nimport {\n FrButtonGroup,\n} from './src/button-group';\n\n@NgModule({\n imports: [\n FrButtonGroup,\n ],\n exports: [\n FrButtonGroup,\n ],\n})\nexport class FrButtonGroupModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;MAEa,4BAA4B,GAAG,CAAC,YAAY,EAAE,UAAU;AAGrE;MASa,aAAa,CAAA;AACf,IAAA,WAAW,GAAG,KAAK,CAA2B,YAAY,kFAAC;wGADzD,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAb,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qCAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,OAAA,EAAA,EAAA,UAAA,EAAA,EAAA,uBAAA,EAAA,eAAA,EAAA,EAAA,cAAA,EAAA,yCAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBARzB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,qCAAqC;AAC/C,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,yCAAyC;AAChD,wBAAA,yBAAyB,EAAE,eAAe;AAC1C,wBAAA,IAAI,EAAE,OAAO;AACd,qBAAA;AACF,iBAAA;;;MCAY,mBAAmB,CAAA;wGAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;yGAAnB,mBAAmB,EAAA,OAAA,EAAA,CAN5B,aAAa,CAAA,EAAA,OAAA,EAAA,CAGb,aAAa,CAAA,EAAA,CAAA;yGAGJ,mBAAmB,EAAA,CAAA;;4FAAnB,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAR/B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,aAAa;AACd,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,aAAa;AACd,qBAAA;AACF,iBAAA;;;ACZD;;AAEG;;;;"}

package/fesm2022/frame-ui-ng-components-button.mjs CHANGED Viewed

@@ -21,14 +21,14 @@ class FrButton {
     hasCustomLoadingIndicator = computed(() => !!this.loadingIndicator() || !!this.spinnerIndicator(), ...(ngDevMode ? [{ debugName: "hasCustomLoadingIndicator" }] : /* istanbul ignore next */ []));
     isUnavailable = computed(() => this.disabled() || this.loading(), ...(ngDevMode ? [{ debugName: "isUnavailable" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrButton, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.2.16", type: FrButton, isStandalone: true, selector: "a[frButton], button[frButton]", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, loadingDisplay: { classPropertyName: "loadingDisplay", publicName: "loadingDisplay", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-appearance": "appearance()", "attr.data-disabled": "disabled() ? \"\" : null", "attr.data-has-custom-loading": "hasCustomLoadingIndicator() ? \"\" : null", "attr.data-loading": "loading() ? \"\" : null", "attr.data-loading-display": "loadingDisplay()", "attr.data-size": "size()", "attr.aria-busy": "loading() ? \"true\" : null", "attr.aria-disabled": "disabled() ? \"true\" : null", "attr.disabled": "isUnavailable() ? \"\" : null", "class.frame-button-disabled": "isUnavailable()", "class.frame-button-loading": "loading()" }, classAttribute: "frame-button" }, queries: [{ propertyName: "loadingIndicator", first: true, predicate: FrButtonLoading, descendants: true, isSignal: true }, { propertyName: "spinnerIndicator", first: true, predicate: FrSpinner, descendants: true, isSignal: true }], ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.2.16", type: FrButton, isStandalone: true, selector: "a[frButton], button[frButton]", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, loadingDisplay: { classPropertyName: "loadingDisplay", publicName: "loadingDisplay", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-appearance": "appearance()", "attr.data-disabled": "disabled() ? \"\" : null", "attr.data-has-custom-loading": "hasCustomLoadingIndicator() ? \"\" : null", "attr.data-loading": "loading() ? \"\" : null", "attr.data-loading-display": "loadingDisplay()", "attr.data-size": "size()", "attr.aria-busy": "loading() ? \"true\" : null", "attr.aria-disabled": "disabled() ? \"true\" : null", "attr.disabled": "isUnavailable() ? \"\" : null", "class.frame-button-disabled": "isUnavailable()", "class.frame-button-loading": "loading()" }, classAttribute: "frame-button frame-corner-handles" }, queries: [{ propertyName: "loadingIndicator", first: true, predicate: FrButtonLoading, descendants: true, isSignal: true }, { propertyName: "spinnerIndicator", first: true, predicate: FrSpinner, descendants: true, isSignal: true }], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrButton, decorators: [{
             type: Directive,
             args: [{
                     selector: 'a[frButton], button[frButton]',
                     host: {
-                        class: 'frame-button',
+                        class: 'frame-button frame-corner-handles',
                         '[attr.data-appearance]': 'appearance()',
                         '[attr.data-disabled]': 'disabled() ? "" : null',
                         '[attr.data-has-custom-loading]': 'hasCustomLoadingIndicator() ? "" : null',

package/fesm2022/frame-ui-ng-components-button.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"frame-ui-ng-components-button.mjs","sources":["../../../projects/components/button/src/button.ts","../../../projects/components/button/button.module.ts","../../../projects/components/button/frame-ui-ng-components-button.ts"],"sourcesContent":["import { Directive, booleanAttribute, computed, contentChild, input } from '@angular/core';\r\nimport { FrSpinner } from '@frame-ui-ng/components/spinner';\r\n\r\nexport const FR_BUTTON_APPEARANCES = [\r\n 'ghost',\r\n 'outline',\r\n 'primary',\r\n] as const;\r\nexport const FR_BUTTON_LOADING_DISPLAYS = ['inline', 'replace'] as const;\r\nexport const FR_BUTTON_SIZES = ['sm', 'md', 'lg'] as const;\r\n\r\nexport type FrButtonAppearance = (typeof FR_BUTTON_APPEARANCES)[number];\r\nexport type FrButtonLoadingDisplay = (typeof FR_BUTTON_LOADING_DISPLAYS)[number];\r\nexport type FrButtonSize = (typeof FR_BUTTON_SIZES)[number];\r\n\r\n/** Button host with FrameUI size and appearance variants. /\r\n@Directive({\r\n selector: 'a[frButton], button[frButton]',\r\n host: {\r\n class: 'frame-button',\r\n '[attr.data-appearance]': 'appearance()',\r\n '[attr.data-disabled]': 'disabled() ? \"\" : null',\r\n '[attr.data-has-custom-loading]': 'hasCustomLoadingIndicator() ? \"\" : null',\r\n '[attr.data-loading]': 'loading() ? \"\" : null',\r\n '[attr.data-loading-display]': 'loadingDisplay()',\r\n '[attr.data-size]': 'size()',\r\n '[attr.aria-busy]': 'loading() ? \"true\" : null',\r\n '[attr.aria-disabled]': 'disabled() ? \"true\" : null',\r\n '[attr.disabled]': 'isUnavailable() ? \"\" : null',\r\n '[class.frame-button-disabled]': 'isUnavailable()',\r\n '[class.frame-button-loading]': 'loading()',\r\n },\r\n})\r\nexport class FrButton {\r\n private readonly loadingIndicator = contentChild(FrButtonLoading);\r\n private readonly spinnerIndicator = contentChild(FrSpinner);\r\n\r\n readonly appearance = input<FrButtonAppearance>('primary');\r\n readonly disabled = input(false, { transform: booleanAttribute });\r\n readonly loading = input(false, { transform: booleanAttribute });\r\n readonly loadingDisplay = input<FrButtonLoadingDisplay>('replace');\r\n readonly size = input<FrButtonSize>('md');\r\n protected readonly hasCustomLoadingIndicator = computed(\r\n () => !!this.loadingIndicator() \|\| !!this.spinnerIndicator(),\r\n );\r\n protected readonly isUnavailable = computed(() => this.disabled() \|\| this.loading());\r\n}\r\n\r\n/* Icon-only button host with square sizing. /\r\n@Directive({\r\n selector: 'a[frIconButton], button[frIconButton]',\r\n hostDirectives: [\r\n {\r\n directive: FrButton,\r\n inputs: ['appearance', 'disabled', 'loading', 'loadingDisplay', 'size'],\r\n },\r\n ],\r\n host: {\r\n class: 'frame-icon-button',\r\n '[attr.data-icon-button]': '\"\"',\r\n '[attr.aria-label]': 'ariaLabel()',\r\n },\r\n})\r\nexport class FrIconButton {\r\n readonly ariaLabel = input<string \| null>(null, { alias: 'aria-label' });\r\n}\r\n\r\n/* Icon slot for button. /\r\n@Directive({\r\n selector: '[frButtonIcon]',\r\n host: {\r\n class: 'frame-button__icon',\r\n 'aria-hidden': 'true',\r\n },\r\n})\r\nexport class FrButtonIcon {}\r\n\r\n/* Label slot for button. /\r\n@Directive({\r\n selector: '[frButtonLabel]',\r\n host: {\r\n class: 'frame-button__label',\r\n },\r\n})\r\nexport class FrButtonLabel {}\r\n\r\n/* Loading indicator slot for button. /\r\n@Directive({\r\n selector: '[frButtonLoading]',\r\n host: {\r\n class: 'frame-button__loading',\r\n 'aria-hidden': 'true',\r\n },\r\n})\r\nexport class FrButtonLoading {}\r\n\r\n","import { NgModule } from '@angular/core';\nimport {\n FrButton,\n FrButtonIcon,\n FrButtonLabel,\n FrButtonLoading,\n FrIconButton,\n} from './src/button';\n\n@NgModule({\n imports: [\n FrButton,\n FrButtonIcon,\n FrButtonLabel,\n FrButtonLoading,\n FrIconButton,\n ],\n exports: [\n FrButton,\n FrButtonIcon,\n FrButtonLabel,\n FrButtonLoading,\n FrIconButton,\n ],\n})\nexport class FrButtonModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"frame-ui-ng-components-button.mjs","sources":["../../../projects/components/button/src/button.ts","../../../projects/components/button/button.module.ts","../../../projects/components/button/frame-ui-ng-components-button.ts"],"sourcesContent":["import { Directive, booleanAttribute, computed, contentChild, input } from '@angular/core';\r\nimport { FrSpinner } from '@frame-ui-ng/components/spinner';\r\n\r\nexport const FR_BUTTON_APPEARANCES = [\r\n 'ghost',\r\n 'outline',\r\n 'primary',\r\n] as const;\r\nexport const FR_BUTTON_LOADING_DISPLAYS = ['inline', 'replace'] as const;\r\nexport const FR_BUTTON_SIZES = ['sm', 'md', 'lg'] as const;\r\n\r\nexport type FrButtonAppearance = (typeof FR_BUTTON_APPEARANCES)[number];\r\nexport type FrButtonLoadingDisplay = (typeof FR_BUTTON_LOADING_DISPLAYS)[number];\r\nexport type FrButtonSize = (typeof FR_BUTTON_SIZES)[number];\r\n\r\n/** Button host with FrameUI size and appearance variants. /\r\n@Directive({\r\n selector: 'a[frButton], button[frButton]',\r\n host: {\r\n class: 'frame-button frame-corner-handles',\r\n '[attr.data-appearance]': 'appearance()',\r\n '[attr.data-disabled]': 'disabled() ? \"\" : null',\r\n '[attr.data-has-custom-loading]': 'hasCustomLoadingIndicator() ? \"\" : null',\r\n '[attr.data-loading]': 'loading() ? \"\" : null',\r\n '[attr.data-loading-display]': 'loadingDisplay()',\r\n '[attr.data-size]': 'size()',\r\n '[attr.aria-busy]': 'loading() ? \"true\" : null',\r\n '[attr.aria-disabled]': 'disabled() ? \"true\" : null',\r\n '[attr.disabled]': 'isUnavailable() ? \"\" : null',\r\n '[class.frame-button-disabled]': 'isUnavailable()',\r\n '[class.frame-button-loading]': 'loading()',\r\n },\r\n})\r\nexport class FrButton {\r\n private readonly loadingIndicator = contentChild(FrButtonLoading);\r\n private readonly spinnerIndicator = contentChild(FrSpinner);\r\n\r\n readonly appearance = input<FrButtonAppearance>('primary');\r\n readonly disabled = input(false, { transform: booleanAttribute });\r\n readonly loading = input(false, { transform: booleanAttribute });\r\n readonly loadingDisplay = input<FrButtonLoadingDisplay>('replace');\r\n readonly size = input<FrButtonSize>('md');\r\n protected readonly hasCustomLoadingIndicator = computed(\r\n () => !!this.loadingIndicator() \|\| !!this.spinnerIndicator(),\r\n );\r\n protected readonly isUnavailable = computed(() => this.disabled() \|\| this.loading());\r\n}\r\n\r\n/* Icon-only button host with square sizing. /\r\n@Directive({\r\n selector: 'a[frIconButton], button[frIconButton]',\r\n hostDirectives: [\r\n {\r\n directive: FrButton,\r\n inputs: ['appearance', 'disabled', 'loading', 'loadingDisplay', 'size'],\r\n },\r\n ],\r\n host: {\r\n class: 'frame-icon-button',\r\n '[attr.data-icon-button]': '\"\"',\r\n '[attr.aria-label]': 'ariaLabel()',\r\n },\r\n})\r\nexport class FrIconButton {\r\n readonly ariaLabel = input<string \| null>(null, { alias: 'aria-label' });\r\n}\r\n\r\n/* Icon slot for button. /\r\n@Directive({\r\n selector: '[frButtonIcon]',\r\n host: {\r\n class: 'frame-button__icon',\r\n 'aria-hidden': 'true',\r\n },\r\n})\r\nexport class FrButtonIcon {}\r\n\r\n/* Label slot for button. /\r\n@Directive({\r\n selector: '[frButtonLabel]',\r\n host: {\r\n class: 'frame-button__label',\r\n },\r\n})\r\nexport class FrButtonLabel {}\r\n\r\n/* Loading indicator slot for button. /\r\n@Directive({\r\n selector: '[frButtonLoading]',\r\n host: {\r\n class: 'frame-button__loading',\r\n 'aria-hidden': 'true',\r\n },\r\n})\r\nexport class FrButtonLoading {}\r\n\r\n","import { NgModule } from '@angular/core';\nimport {\n FrButton,\n FrButtonIcon,\n FrButtonLabel,\n FrButtonLoading,\n FrIconButton,\n} from './src/button';\n\n@NgModule({\n imports: [\n FrButton,\n FrButtonIcon,\n FrButtonLabel,\n FrButtonLoading,\n FrIconButton,\n ],\n exports: [\n FrButton,\n FrButtonIcon,\n FrButtonLabel,\n FrButtonLoading,\n FrIconButton,\n ],\n})\nexport class FrButtonModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;AAGO,MAAM,qBAAqB,GAAG;IACnC,OAAO;IACP,SAAS;IACT,SAAS;;MAEE,0BAA0B,GAAG,CAAC,QAAQ,EAAE,SAAS;AACvD,MAAM,eAAe,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI;AAMhD;MAkBa,QAAQ,CAAA;AACF,IAAA,gBAAgB,GAAG,YAAY,CAAC,eAAe,uFAAC;AAChD,IAAA,gBAAgB,GAAG,YAAY,CAAC,SAAS,uFAAC;AAElD,IAAA,UAAU,GAAG,KAAK,CAAqB,SAAS,iFAAC;IACjD,QAAQ,GAAG,KAAK,CAAC,KAAK,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;IACxD,OAAO,GAAG,KAAK,CAAC,KAAK,+EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AACvD,IAAA,cAAc,GAAG,KAAK,CAAyB,SAAS,qFAAC;AACzD,IAAA,IAAI,GAAG,KAAK,CAAe,IAAI,2EAAC;IACtB,yBAAyB,GAAG,QAAQ,CACrD,MAAM,CAAC,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,gBAAgB,EAAE,gGAC7D;AACkB,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE,oFAAC;wGAZzE,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAR,QAAQ,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,+BAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,sBAAA,EAAA,cAAA,EAAA,oBAAA,EAAA,0BAAA,EAAA,8BAAA,EAAA,2CAAA,EAAA,mBAAA,EAAA,yBAAA,EAAA,2BAAA,EAAA,kBAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,6BAAA,EAAA,oBAAA,EAAA,8BAAA,EAAA,eAAA,EAAA,+BAAA,EAAA,6BAAA,EAAA,iBAAA,EAAA,4BAAA,EAAA,WAAA,EAAA,EAAA,cAAA,EAAA,mCAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAC8B,eAAe,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EACf,SAAS,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAF/C,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAjBpB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,+BAA+B;AACzC,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,mCAAmC;AAC1C,wBAAA,wBAAwB,EAAE,cAAc;AACxC,wBAAA,sBAAsB,EAAE,wBAAwB;AAChD,wBAAA,gCAAgC,EAAE,yCAAyC;AAC3E,wBAAA,qBAAqB,EAAE,uBAAuB;AAC9C,wBAAA,6BAA6B,EAAE,kBAAkB;AACjD,wBAAA,kBAAkB,EAAE,QAAQ;AAC5B,wBAAA,kBAAkB,EAAE,2BAA2B;AAC/C,wBAAA,sBAAsB,EAAE,4BAA4B;AACpD,wBAAA,iBAAiB,EAAE,6BAA6B;AAChD,wBAAA,+BAA+B,EAAE,iBAAiB;AAClD,wBAAA,8BAA8B,EAAE,WAAW;AAC5C,qBAAA;AACF,iBAAA;AAEkD,SAAA,CAAA,EAAA,cAAA,EAAA,EAAA,gBAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,UAAA,CAAA,MAAA,eAAe,kGACf,SAAS,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,UAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,OAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,SAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,cAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,IAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,MAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;AAa5D;MAea,YAAY,CAAA;IACd,SAAS,GAAG,KAAK,CAAgB,IAAI,iFAAI,KAAK,EAAE,YAAY,EAAA,CAAG;wGAD7D,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAZ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,YAAY,0XA9BZ,QAAQ,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,YAAA,EAAA,UAAA,EAAA,UAAA,EAAA,SAAA,EAAA,SAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,MAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FA8BR,YAAY,EAAA,UAAA,EAAA,CAAA;kBAdxB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,uCAAuC;AACjD,oBAAA,cAAc,EAAE;AACd,wBAAA;AACE,4BAAA,SAAS,EAAE,QAAQ;4BACnB,MAAM,EAAE,CAAC,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,CAAC;AACxE,yBAAA;AACF,qBAAA;AACD,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,mBAAmB;AAC1B,wBAAA,yBAAyB,EAAE,IAAI;AAC/B,wBAAA,mBAAmB,EAAE,aAAa;AACnC,qBAAA;AACF,iBAAA;;AAKD;MAQa,YAAY,CAAA;wGAAZ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAZ,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,aAAA,EAAA,MAAA,EAAA,EAAA,cAAA,EAAA,oBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAPxB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,oBAAoB;AAC3B,wBAAA,aAAa,EAAE,MAAM;AACtB,qBAAA;AACF,iBAAA;;AAGD;MAOa,aAAa,CAAA;wGAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAb,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,qBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBANzB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,qBAAqB;AAC7B,qBAAA;AACF,iBAAA;;AAGD;MAQa,eAAe,CAAA;wGAAf,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAf,eAAe,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,aAAA,EAAA,MAAA,EAAA,EAAA,cAAA,EAAA,uBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;4FAAf,eAAe,EAAA,UAAA,EAAA,CAAA;kBAP3B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,mBAAmB;AAC7B,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,uBAAuB;AAC9B,wBAAA,aAAa,EAAE,MAAM;AACtB,qBAAA;AACF,iBAAA;;;MCpEY,cAAc,CAAA;wGAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAd,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,cAAc,YAdvB,QAAQ;YACR,YAAY;YACZ,aAAa;YACb,eAAe;AACf,YAAA,YAAY,aAGZ,QAAQ;YACR,YAAY;YACZ,aAAa;YACb,eAAe;YACf,YAAY,CAAA,EAAA,CAAA;yGAGH,cAAc,EAAA,CAAA;;4FAAd,cAAc,EAAA,UAAA,EAAA,CAAA;kBAhB1B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,QAAQ;wBACR,YAAY;wBACZ,aAAa;wBACb,eAAe;wBACf,YAAY;AACb,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,QAAQ;wBACR,YAAY;wBACZ,aAAa;wBACb,eAAe;wBACf,YAAY;AACb,qBAAA;AACF,iBAAA;;;ACxBD;;AAEG;;;;"}

package/fesm2022/frame-ui-ng-components-calendar.mjs CHANGED Viewed

@@ -2,6 +2,8 @@ import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
 import { forwardRef, input, booleanAttribute, output, signal, inject, ElementRef, computed, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import * as i1 from '@frame-ui-ng/components/select';
+import { FrSelectModule } from '@frame-ui-ng/components/select';
 const VALUE_ACCESSOR = {
     provide: NG_VALUE_ACCESSOR,
@@ -28,8 +30,6 @@ class FrCalendar {
     cellTemplate = input(null, ...(ngDevMode ? [{ debugName: "cellTemplate" }] : /* istanbul ignore next */ []));
     previousMonthTemplate = input(null, ...(ngDevMode ? [{ debugName: "previousMonthTemplate" }] : /* istanbul ignore next */ []));
     nextMonthTemplate = input(null, ...(ngDevMode ? [{ debugName: "nextMonthTemplate" }] : /* istanbul ignore next */ []));
-    previousMonthIcon = input('‹', ...(ngDevMode ? [{ debugName: "previousMonthIcon" }] : /* istanbul ignore next */ []));
-    nextMonthIcon = input('›', ...(ngDevMode ? [{ debugName: "nextMonthIcon" }] : /* istanbul ignore next */ []));
     previousMonthLabel = input('Previous month', ...(ngDevMode ? [{ debugName: "previousMonthLabel" }] : /* istanbul ignore next */ []));
     nextMonthLabel = input('Next month', ...(ngDevMode ? [{ debugName: "nextMonthLabel" }] : /* istanbul ignore next */ []));
     month = input(undefined, ...(ngDevMode ? [{ debugName: "month" }] : /* istanbul ignore next */ []));
@@ -42,6 +42,8 @@ class FrCalendar {
     cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "cvaDisabled" }] : /* istanbul ignore next */ []));
     host = inject((ElementRef));
     currentMonth = computed(() => startOfMonth(this.navigatedMonth() ?? this.month() ?? new Date()), ...(ngDevMode ? [{ debugName: "currentMonth" }] : /* istanbul ignore next */ []));
+    currentMonthValue = computed(() => String(this.currentMonth().getMonth()), ...(ngDevMode ? [{ debugName: "currentMonthValue" }] : /* istanbul ignore next */ []));
+    currentYearValue = computed(() => String(this.currentMonth().getFullYear()), ...(ngDevMode ? [{ debugName: "currentYearValue" }] : /* istanbul ignore next */ []));
     isDisabled = computed(() => this.disabled() || this.cvaDisabled(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
     value = computed(() => {
         const selected = this.selected();
@@ -49,13 +51,13 @@ class FrCalendar {
     }, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     weekdayLabels = computed(() => buildWeekdayLabels(this.locale(), this.firstDayOfWeek(), this.timeZone()), ...(ngDevMode ? [{ debugName: "weekdayLabels" }] : /* istanbul ignore next */ []));
     monthOptions = computed(() => Array.from({ length: 12 }, (_, value) => ({
-        value,
+        value: String(value),
         label: new Intl.DateTimeFormat(this.locale(), {
             month: 'short',
             timeZone: this.timeZone(),
         }).format(new Date(2026, value, 1)),
     })), ...(ngDevMode ? [{ debugName: "monthOptions" }] : /* istanbul ignore next */ []));
-    yearOptions = computed(() => Array.from({ length: Math.max(0, this.toYear() - this.fromYear() + 1) }, (_, index) => this.fromYear() + index), ...(ngDevMode ? [{ debugName: "yearOptions" }] : /* istanbul ignore next */ []));
+    yearOptions = computed(() => Array.from({ length: Math.max(0, this.toYear() - this.fromYear() + 1) }, (_, index) => String(this.fromYear() + index)), ...(ngDevMode ? [{ debugName: "yearOptions" }] : /* istanbul ignore next */ []));
     months = computed(() => Array.from({ length: Math.max(1, this.numberOfMonths()) }, (_, index) => this.buildMonth(addMonths(this.currentMonth(), index))), ...(ngDevMode ? [{ debugName: "months" }] : /* istanbul ignore next */ []));
     activeDate = computed(() => this.resolveActiveDate(), ...(ngDevMode ? [{ debugName: "activeDate" }] : /* istanbul ignore next */ []));
     hasDateLabels = computed(() => Object.keys(this.dateLabels()).length > 0, ...(ngDevMode ? [{ debugName: "hasDateLabels" }] : /* istanbul ignore next */ []));
@@ -86,10 +88,16 @@ class FrCalendar {
         this.updateMonth(addMonths(this.currentMonth(), 1));
     }
     setMonth(value) {
+        if (value === null) {
+            return;
+        }
         const month = new Date(this.currentMonth().getFullYear(), Number(value), 1);
         this.updateMonth(month);
     }
     setYear(value) {
+        if (value === null) {
+            return;
+        }
         const month = new Date(Number(value), this.currentMonth().getMonth(), 1);
         this.updateMonth(month);
     }
@@ -255,7 +263,7 @@ class FrCalendar {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrCalendar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: FrCalendar, isStandalone: true, selector: "frame-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, captionLayout: { classPropertyName: "captionLayout", publicName: "captionLayout", isSignal: true, isRequired: false, transformFunction: null }, numberOfMonths: { classPropertyName: "numberOfMonths", publicName: "numberOfMonths", isSignal: true, isRequired: false, transformFunction: null }, firstDayOfWeek: { classPropertyName: "firstDayOfWeek", publicName: "firstDayOfWeek", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, timeZone: { classPropertyName: "timeZone", publicName: "timeZone", isSignal: true, isRequired: false, transformFunction: null }, dir: { classPropertyName: "dir", publicName: "dir", isSignal: true, isRequired: false, transformFunction: null }, fromYear: { classPropertyName: "fromYear", publicName: "fromYear", isSignal: true, isRequired: false, transformFunction: null }, toYear: { classPropertyName: "toYear", publicName: "toYear", isSignal: true, isRequired: false, transformFunction: null }, showOutsideDays: { classPropertyName: "showOutsideDays", publicName: "showOutsideDays", isSignal: true, isRequired: false, transformFunction: null }, showWeekNumber: { classPropertyName: "showWeekNumber", publicName: "showWeekNumber", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, disabledDates: { classPropertyName: "disabledDates", publicName: "disabledDates", isSignal: true, isRequired: false, transformFunction: null }, dateLabels: { classPropertyName: "dateLabels", publicName: "dateLabels", isSignal: true, isRequired: false, transformFunction: null }, disabledMatcher: { classPropertyName: "disabledMatcher", publicName: "disabledMatcher", isSignal: true, isRequired: false, transformFunction: null }, cellTemplate: { classPropertyName: "cellTemplate", publicName: "cellTemplate", isSignal: true, isRequired: false, transformFunction: null }, previousMonthTemplate: { classPropertyName: "previousMonthTemplate", publicName: "previousMonthTemplate", isSignal: true, isRequired: false, transformFunction: null }, nextMonthTemplate: { classPropertyName: "nextMonthTemplate", publicName: "nextMonthTemplate", isSignal: true, isRequired: false, transformFunction: null }, previousMonthIcon: { classPropertyName: "previousMonthIcon", publicName: "previousMonthIcon", isSignal: true, isRequired: false, transformFunction: null }, nextMonthIcon: { classPropertyName: "nextMonthIcon", publicName: "nextMonthIcon", isSignal: true, isRequired: false, transformFunction: null }, previousMonthLabel: { classPropertyName: "previousMonthLabel", publicName: "previousMonthLabel", isSignal: true, isRequired: false, transformFunction: null }, nextMonthLabel: { classPropertyName: "nextMonthLabel", publicName: "nextMonthLabel", isSignal: true, isRequired: false, transformFunction: null }, month: { classPropertyName: "month", publicName: "month", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedChange: "selectedChange", monthChange: "monthChange" }, host: { properties: { "attr.data-mode": "mode()", "attr.data-caption-layout": "captionLayout()", "attr.data-disabled": "isDisabled() ? \"\" : null", "attr.data-week-number": "showWeekNumber() ? \"\" : null", "attr.data-date-labels": "hasDateLabels() ? \"\" : null", "attr.dir": "dir()" }, classAttribute: "frame-calendar" }, providers: [VALUE_ACCESSOR], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.16", type: FrCalendar, isStandalone: true, selector: "frame-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, captionLayout: { classPropertyName: "captionLayout", publicName: "captionLayout", isSignal: true, isRequired: false, transformFunction: null }, numberOfMonths: { classPropertyName: "numberOfMonths", publicName: "numberOfMonths", isSignal: true, isRequired: false, transformFunction: null }, firstDayOfWeek: { classPropertyName: "firstDayOfWeek", publicName: "firstDayOfWeek", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, timeZone: { classPropertyName: "timeZone", publicName: "timeZone", isSignal: true, isRequired: false, transformFunction: null }, dir: { classPropertyName: "dir", publicName: "dir", isSignal: true, isRequired: false, transformFunction: null }, fromYear: { classPropertyName: "fromYear", publicName: "fromYear", isSignal: true, isRequired: false, transformFunction: null }, toYear: { classPropertyName: "toYear", publicName: "toYear", isSignal: true, isRequired: false, transformFunction: null }, showOutsideDays: { classPropertyName: "showOutsideDays", publicName: "showOutsideDays", isSignal: true, isRequired: false, transformFunction: null }, showWeekNumber: { classPropertyName: "showWeekNumber", publicName: "showWeekNumber", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, disabledDates: { classPropertyName: "disabledDates", publicName: "disabledDates", isSignal: true, isRequired: false, transformFunction: null }, dateLabels: { classPropertyName: "dateLabels", publicName: "dateLabels", isSignal: true, isRequired: false, transformFunction: null }, disabledMatcher: { classPropertyName: "disabledMatcher", publicName: "disabledMatcher", isSignal: true, isRequired: false, transformFunction: null }, cellTemplate: { classPropertyName: "cellTemplate", publicName: "cellTemplate", isSignal: true, isRequired: false, transformFunction: null }, previousMonthTemplate: { classPropertyName: "previousMonthTemplate", publicName: "previousMonthTemplate", isSignal: true, isRequired: false, transformFunction: null }, nextMonthTemplate: { classPropertyName: "nextMonthTemplate", publicName: "nextMonthTemplate", isSignal: true, isRequired: false, transformFunction: null }, previousMonthLabel: { classPropertyName: "previousMonthLabel", publicName: "previousMonthLabel", isSignal: true, isRequired: false, transformFunction: null }, nextMonthLabel: { classPropertyName: "nextMonthLabel", publicName: "nextMonthLabel", isSignal: true, isRequired: false, transformFunction: null }, month: { classPropertyName: "month", publicName: "month", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedChange: "selectedChange", monthChange: "monthChange" }, host: { properties: { "attr.data-mode": "mode()", "attr.data-caption-layout": "captionLayout()", "attr.data-disabled": "isDisabled() ? \"\" : null", "attr.data-week-number": "showWeekNumber() ? \"\" : null", "attr.data-date-labels": "hasDateLabels() ? \"\" : null", "attr.dir": "dir()" }, classAttribute: "frame-calendar frame-corner-handles" }, providers: [VALUE_ACCESSOR], ngImport: i0, template: `
     <div class="frame-calendar__header">
       <button
         class="frame-calendar__nav-button"
@@ -267,39 +275,100 @@ class FrCalendar {
         @if (previousMonthTemplate(); as template) {
           <ng-container [ngTemplateOutlet]="template" />
         } @else {
-          {{ previousMonthIcon() }}
+          <svg
+            class="frame-calendar__nav-icon"
+            aria-hidden="true"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <path d="m15 18-6-6 6-6"></path>
+          </svg>
         }
       </button>
       @if (captionLayout() === 'dropdown') {
         <div class="frame-calendar__caption-controls">
-          <select
+          <button
             class="frame-calendar__select"
+            [frSelect]="monthMenu"
             [disabled]="isDisabled()"
-            [value]="currentMonth().getMonth()"
+            [value]="currentMonthValue()"
+            (valueChange)="setMonth($event)"
+            indicatorPosition="end"
             aria-label="Month"
-            (change)="setMonth($any($event.target).value)"
+            type="button"
           >
-            @for (month of monthOptions(); track month.value) {
-              <option [value]="month.value" [selected]="month.value === currentMonth().getMonth()">
-                {{ month.label }}
-              </option>
-            }
-          </select>
+            <frame-select-value></frame-select-value>
+            <span frSelectIcon>
+              <svg
+                class="frame-calendar__select-icon"
+                aria-hidden="true"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <path d="m6 9 6 6 6-6"></path>
+              </svg>
+            </span>
+          </button>
+          <ng-template #monthMenu="frSelectContent" frSelectContent>
+            <frame-select-panel>
+              <frame-select-group>
+              @for (month of monthOptions(); track month.value) {
+                <button frSelectItem [value]="month.value" [label]="month.label" type="button">
+                  {{ month.label }}
+                </button>
+              }
+              </frame-select-group>
+            </frame-select-panel>
+          </ng-template>
-          <select
+          <button
             class="frame-calendar__select"
+            [frSelect]="yearMenu"
             [disabled]="isDisabled()"
-            [value]="currentMonth().getFullYear()"
+            [value]="currentYearValue()"
+            (valueChange)="setYear($event)"
+            indicatorPosition="end"
             aria-label="Year"
-            (change)="setYear($any($event.target).value)"
+            type="button"
           >
-            @for (year of yearOptions(); track year) {
-              <option [value]="year" [selected]="year === currentMonth().getFullYear()">
-                {{ year }}
-              </option>
-            }
-          </select>
+            <frame-select-value></frame-select-value>
+            <span frSelectIcon>
+              <svg
+                class="frame-calendar__select-icon"
+                aria-hidden="true"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <path d="m6 9 6 6 6-6"></path>
+              </svg>
+            </span>
+          </button>
+          <ng-template #yearMenu="frSelectContent" frSelectContent>
+            <frame-select-panel>
+              <frame-select-group>
+              @for (year of yearOptions(); track year) {
+                <button frSelectItem [value]="year" [label]="year" type="button">
+                  {{ year }}
+                </button>
+              }
+              </frame-select-group>
+            </frame-select-panel>
+          </ng-template>
         </div>
       } @else {
         <div class="frame-calendar__caption" aria-live="polite">
@@ -317,7 +386,18 @@ class FrCalendar {
         @if (nextMonthTemplate(); as template) {
           <ng-container [ngTemplateOutlet]="template" />
         } @else {
-          {{ nextMonthIcon() }}
+          <svg
+            class="frame-calendar__nav-icon"
+            aria-hidden="true"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <path d="m9 18 6-6-6-6"></path>
+          </svg>
         }
       </button>
     </div>
@@ -400,17 +480,17 @@ class FrCalendar {
         </section>
       }
     </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FrSelectModule }, { kind: "directive", type: i1.FrSelect, selector: "button[frSelect]", inputs: ["value", "frSelect", "debugVisible", "disabled", "indicatorPosition", "invalid"], outputs: ["valueChange"] }, { kind: "directive", type: i1.FrSelectContent, selector: "ng-template[frSelectContent]", inputs: ["position"], exportAs: ["frSelectContent"] }, { kind: "directive", type: i1.FrSelectGroup, selector: "[frSelectGroup], frame-select-group" }, { kind: "directive", type: i1.FrSelectIcon, selector: "[frSelectIcon], frame-select-icon", inputs: ["position"] }, { kind: "directive", type: i1.FrSelectItem, selector: "button[frSelectItem]", inputs: ["label", "value"] }, { kind: "directive", type: i1.FrSelectPanel, selector: "[frSelectPanel], frame-select-panel" }, { kind: "directive", type: i1.FrSelectValue, selector: "[frSelectValue], frame-select-value", inputs: ["placeholder"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrCalendar, decorators: [{
             type: Component,
             args: [{
                     selector: 'frame-calendar',
-                    imports: [NgTemplateOutlet],
+                    imports: [NgTemplateOutlet, FrSelectModule],
                     providers: [VALUE_ACCESSOR],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     host: {
-                        class: 'frame-calendar',
+                        class: 'frame-calendar frame-corner-handles',
                         '[attr.data-mode]': 'mode()',
                         '[attr.data-caption-layout]': 'captionLayout()',
                         '[attr.data-disabled]': 'isDisabled() ? "" : null',
@@ -430,39 +510,100 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
         @if (previousMonthTemplate(); as template) {
           <ng-container [ngTemplateOutlet]="template" />
         } @else {
-          {{ previousMonthIcon() }}
+          <svg
+            class="frame-calendar__nav-icon"
+            aria-hidden="true"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <path d="m15 18-6-6 6-6"></path>
+          </svg>
         }
       </button>
       @if (captionLayout() === 'dropdown') {
         <div class="frame-calendar__caption-controls">
-          <select
+          <button
             class="frame-calendar__select"
+            [frSelect]="monthMenu"
             [disabled]="isDisabled()"
-            [value]="currentMonth().getMonth()"
+            [value]="currentMonthValue()"
+            (valueChange)="setMonth($event)"
+            indicatorPosition="end"
             aria-label="Month"
-            (change)="setMonth($any($event.target).value)"
+            type="button"
           >
-            @for (month of monthOptions(); track month.value) {
-              <option [value]="month.value" [selected]="month.value === currentMonth().getMonth()">
-                {{ month.label }}
-              </option>
-            }
-          </select>
+            <frame-select-value></frame-select-value>
+            <span frSelectIcon>
+              <svg
+                class="frame-calendar__select-icon"
+                aria-hidden="true"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <path d="m6 9 6 6 6-6"></path>
+              </svg>
+            </span>
+          </button>
+          <ng-template #monthMenu="frSelectContent" frSelectContent>
+            <frame-select-panel>
+              <frame-select-group>
+              @for (month of monthOptions(); track month.value) {
+                <button frSelectItem [value]="month.value" [label]="month.label" type="button">
+                  {{ month.label }}
+                </button>
+              }
+              </frame-select-group>
+            </frame-select-panel>
+          </ng-template>
-          <select
+          <button
             class="frame-calendar__select"
+            [frSelect]="yearMenu"
             [disabled]="isDisabled()"
-            [value]="currentMonth().getFullYear()"
+            [value]="currentYearValue()"
+            (valueChange)="setYear($event)"
+            indicatorPosition="end"
             aria-label="Year"
-            (change)="setYear($any($event.target).value)"
+            type="button"
           >
-            @for (year of yearOptions(); track year) {
-              <option [value]="year" [selected]="year === currentMonth().getFullYear()">
-                {{ year }}
-              </option>
-            }
-          </select>
+            <frame-select-value></frame-select-value>
+            <span frSelectIcon>
+              <svg
+                class="frame-calendar__select-icon"
+                aria-hidden="true"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <path d="m6 9 6 6 6-6"></path>
+              </svg>
+            </span>
+          </button>
+          <ng-template #yearMenu="frSelectContent" frSelectContent>
+            <frame-select-panel>
+              <frame-select-group>
+              @for (year of yearOptions(); track year) {
+                <button frSelectItem [value]="year" [label]="year" type="button">
+                  {{ year }}
+                </button>
+              }
+              </frame-select-group>
+            </frame-select-panel>
+          </ng-template>
         </div>
       } @else {
         <div class="frame-calendar__caption" aria-live="polite">
@@ -480,7 +621,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
         @if (nextMonthTemplate(); as template) {
           <ng-container [ngTemplateOutlet]="template" />
         } @else {
-          {{ nextMonthIcon() }}
+          <svg
+            class="frame-calendar__nav-icon"
+            aria-hidden="true"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <path d="m9 18 6-6-6-6"></path>
+          </svg>
         }
       </button>
     </div>
@@ -565,7 +717,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImpo
     </div>
   `,
                 }]
-        }], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], captionLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "captionLayout", required: false }] }], numberOfMonths: [{ type: i0.Input, args: [{ isSignal: true, alias: "numberOfMonths", required: false }] }], firstDayOfWeek: [{ type: i0.Input, args: [{ isSignal: true, alias: "firstDayOfWeek", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], timeZone: [{ type: i0.Input, args: [{ isSignal: true, alias: "timeZone", required: false }] }], dir: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], fromYear: [{ type: i0.Input, args: [{ isSignal: true, alias: "fromYear", required: false }] }], toYear: [{ type: i0.Input, args: [{ isSignal: true, alias: "toYear", required: false }] }], showOutsideDays: [{ type: i0.Input, args: [{ isSignal: true, alias: "showOutsideDays", required: false }] }], showWeekNumber: [{ type: i0.Input, args: [{ isSignal: true, alias: "showWeekNumber", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], disabledDates: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledDates", required: false }] }], dateLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateLabels", required: false }] }], disabledMatcher: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledMatcher", required: false }] }], cellTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellTemplate", required: false }] }], previousMonthTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "previousMonthTemplate", required: false }] }], nextMonthTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextMonthTemplate", required: false }] }], previousMonthIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "previousMonthIcon", required: false }] }], nextMonthIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextMonthIcon", required: false }] }], previousMonthLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "previousMonthLabel", required: false }] }], nextMonthLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextMonthLabel", required: false }] }], month: [{ type: i0.Input, args: [{ isSignal: true, alias: "month", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], selectedChange: [{ type: i0.Output, args: ["selectedChange"] }], monthChange: [{ type: i0.Output, args: ["monthChange"] }] } });
+        }], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], captionLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "captionLayout", required: false }] }], numberOfMonths: [{ type: i0.Input, args: [{ isSignal: true, alias: "numberOfMonths", required: false }] }], firstDayOfWeek: [{ type: i0.Input, args: [{ isSignal: true, alias: "firstDayOfWeek", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], timeZone: [{ type: i0.Input, args: [{ isSignal: true, alias: "timeZone", required: false }] }], dir: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], fromYear: [{ type: i0.Input, args: [{ isSignal: true, alias: "fromYear", required: false }] }], toYear: [{ type: i0.Input, args: [{ isSignal: true, alias: "toYear", required: false }] }], showOutsideDays: [{ type: i0.Input, args: [{ isSignal: true, alias: "showOutsideDays", required: false }] }], showWeekNumber: [{ type: i0.Input, args: [{ isSignal: true, alias: "showWeekNumber", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], disabledDates: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledDates", required: false }] }], dateLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateLabels", required: false }] }], disabledMatcher: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledMatcher", required: false }] }], cellTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellTemplate", required: false }] }], previousMonthTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "previousMonthTemplate", required: false }] }], nextMonthTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextMonthTemplate", required: false }] }], previousMonthLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "previousMonthLabel", required: false }] }], nextMonthLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextMonthLabel", required: false }] }], month: [{ type: i0.Input, args: [{ isSignal: true, alias: "month", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], selectedChange: [{ type: i0.Output, args: ["selectedChange"] }], monthChange: [{ type: i0.Output, args: ["monthChange"] }] } });
 function buildWeekdayLabels(locale, firstDayOfWeek, timeZone) {
     const baseSunday = new Date(2026, 5, 7);
     return Array.from({ length: 7 }, (_, index) => {
@@ -666,7 +818,7 @@ function isoWeekNumber(date) {
 class FrCalendarModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrCalendarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.16", ngImport: i0, type: FrCalendarModule, imports: [FrCalendar], exports: [FrCalendar] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrCalendarModule });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrCalendarModule, imports: [FrCalendar] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.16", ngImport: i0, type: FrCalendarModule, decorators: [{
             type: NgModule,