npm - @acorex/components - Versions diffs - 22.0.0-next.2 → 22.0.0-next.21 - Mend

@acorex/components 22.0.0-next.2 → 22.0.0-next.21

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 (76) hide show

package/fesm2022/acorex-components-scheduler-picker.mjs CHANGED Viewed

@@ -266,7 +266,7 @@ class AXSchedulerPickerDaySelectorComponent {
         {{ '@acorex:schedulerPicker.labels.selectDays' | translate | async }}
       </label>
       <ax-select-box
-        [dataSource]="dayItems"
+        [items]="dayItems"
         textField="text"
         valueField="id"
         [multiple]="true"
@@ -274,7 +274,7 @@ class AXSchedulerPickerDaySelectorComponent {
         (onValueChanged)="onDaysChange($event)"
       />
     </div>
-  `, isInline: true, styles: [".ax-scheduler-picker-day-selector{display:flex;flex-direction:column;gap:.5rem}.ax-scheduler-picker-label{color:var(--ax-comp-scheduler-picker-label-color);font-size:var(--ax-comp-scheduler-picker-label-font-size);font-weight:var(--ax-comp-scheduler-picker-label-font-weight);margin:0}ax-select-box{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
+  `, isInline: true, styles: [".ax-scheduler-picker-day-selector{display:flex;flex-direction:column;gap:.5rem}.ax-scheduler-picker-label{color:var(--ax-comp-scheduler-picker-label-color);font-size:var(--ax-comp-scheduler-picker-label-font-size);font-weight:var(--ax-comp-scheduler-picker-label-font-weight);margin:0}ax-select-box{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "items", "placeholder", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "maxVisibleItems", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerPickerDaySelectorComponent, decorators: [{
             type: Component,
@@ -284,7 +284,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
         {{ '@acorex:schedulerPicker.labels.selectDays' | translate | async }}
       </label>
       <ax-select-box
-        [dataSource]="dayItems"
+        [items]="dayItems"
         textField="text"
         valueField="id"
         [multiple]="true"
@@ -358,21 +358,21 @@ class AXSchedulerPickerOccurrenceSelectorComponent {
       <div class="ax-scheduler-picker-row">
         <ax-select-box
           [value]="selectedPosition()"
-          [dataSource]="positions"
+          [items]="positions"
           textField="text"
           valueField="value"
           (onValueChanged)="onPositionChangeEvent($event)"
         />
         <ax-select-box
           [value]="selectedDay()"
-          [dataSource]="days"
+          [items]="days"
           textField="text"
           valueField="value"
           (onValueChanged)="onDayChangeEvent($event)"
         />
       </div>
     </div>
-  `, isInline: true, styles: [".ax-scheduler-picker-occurrence-selector{display:flex;flex-direction:column;gap:.5rem}.ax-scheduler-picker-row{display:flex;gap:.5rem}.ax-scheduler-picker-row>*{flex:1}.ax-scheduler-picker-label{color:var(--ax-comp-scheduler-picker-label-color);font-size:var(--ax-comp-scheduler-picker-label-font-size);font-weight:var(--ax-comp-scheduler-picker-label-font-weight);margin:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
+  `, isInline: true, styles: [".ax-scheduler-picker-occurrence-selector{display:flex;flex-direction:column;gap:.5rem}.ax-scheduler-picker-row{display:flex;gap:.5rem}.ax-scheduler-picker-row>*{flex:1}.ax-scheduler-picker-label{color:var(--ax-comp-scheduler-picker-label-color);font-size:var(--ax-comp-scheduler-picker-label-font-size);font-weight:var(--ax-comp-scheduler-picker-label-font-weight);margin:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "items", "placeholder", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "maxVisibleItems", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerPickerOccurrenceSelectorComponent, decorators: [{
             type: Component,
@@ -385,14 +385,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
       <div class="ax-scheduler-picker-row">
         <ax-select-box
           [value]="selectedPosition()"
-          [dataSource]="positions"
+          [items]="positions"
           textField="text"
           valueField="value"
           (onValueChanged)="onPositionChangeEvent($event)"
         />
         <ax-select-box
           [value]="selectedDay()"
-          [dataSource]="days"
+          [items]="days"
           textField="text"
           valueField="value"
           (onValueChanged)="onDayChangeEvent($event)"
@@ -594,7 +594,7 @@ class AXSchedulerPickerMonthSelectorComponent {
         {{ '@acorex:schedulerPicker.labels.selectMonths' | translate | async }}
       </label>
       <ax-select-box
-        [dataSource]="monthItems"
+        [items]="monthItems"
         textField="text"
         valueField="id"
         [multiple]="true"
@@ -602,7 +602,7 @@ class AXSchedulerPickerMonthSelectorComponent {
         (onValueChanged)="onMonthsChange($event)"
       />
     </div>
-  `, isInline: true, styles: [".ax-scheduler-picker-month-selector{display:flex;flex-direction:column;gap:.5rem}.ax-scheduler-picker-label{color:var(--ax-comp-scheduler-picker-label-color);font-size:var(--ax-comp-scheduler-picker-label-font-size);font-weight:var(--ax-comp-scheduler-picker-label-font-weight);margin:0}ax-select-box{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
+  `, isInline: true, styles: [".ax-scheduler-picker-month-selector{display:flex;flex-direction:column;gap:.5rem}.ax-scheduler-picker-label{color:var(--ax-comp-scheduler-picker-label-color);font-size:var(--ax-comp-scheduler-picker-label-font-size);font-weight:var(--ax-comp-scheduler-picker-label-font-weight);margin:0}ax-select-box{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "items", "placeholder", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "maxVisibleItems", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerPickerMonthSelectorComponent, decorators: [{
             type: Component,
@@ -612,7 +612,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
         {{ '@acorex:schedulerPicker.labels.selectMonths' | translate | async }}
       </label>
       <ax-select-box
-        [dataSource]="monthItems"
+        [items]="monthItems"
         textField="text"
         valueField="id"
         [multiple]="true"
@@ -2254,13 +2254,13 @@ class AXSchedulerPickerTimezoneSelectorComponent {
       </label>
       <ax-select-box
         [value]="timezone() || 'UTC'"
-        [dataSource]="timezones"
+        [items]="timezones"
         textField="text"
         valueField="value"
         (onValueChanged)="onTimezoneChange($event)"
       />
     </div>
-  `, isInline: true, styles: [".ax-scheduler-picker-timezone-selector{display:flex;flex-direction:column;gap:.5rem}.ax-scheduler-picker-label{color:var(--ax-comp-scheduler-picker-label-color);font-size:var(--ax-comp-scheduler-picker-label-font-size);font-weight:var(--ax-comp-scheduler-picker-label-font-weight)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
+  `, isInline: true, styles: [".ax-scheduler-picker-timezone-selector{display:flex;flex-direction:column;gap:.5rem}.ax-scheduler-picker-label{color:var(--ax-comp-scheduler-picker-label-color);font-size:var(--ax-comp-scheduler-picker-label-font-size);font-weight:var(--ax-comp-scheduler-picker-label-font-weight)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "items", "placeholder", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "maxVisibleItems", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerPickerTimezoneSelectorComponent, decorators: [{
             type: Component,
@@ -2271,7 +2271,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
       </label>
       <ax-select-box
         [value]="timezone() || 'UTC'"
-        [dataSource]="timezones"
+        [items]="timezones"
         textField="text"
         valueField="value"
         (onValueChanged)="onTimezoneChange($event)"
@@ -2377,11 +2377,11 @@ class AXSchedulerPickerConfigComponent {
         this.modeChange.emit(mode);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerPickerConfigComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerPickerConfigComponent, isStandalone: true, selector: "ax-scheduler-picker-config", outputs: { configChange: "configChange", modeChange: "modeChange" }, ngImport: i0, template: "<div class=\"ax-scheduler-picker-config\">\n  <h3>Configuration</h3>\n\n  <!-- Mode Selector -->\n  <div class=\"control-group\">\n    <label>Mode</label>\n    <ax-select-box\n      [dataSource]=\"modeOptions\"\n      [textField]=\"'text'\"\n      [valueField]=\"'value'\"\n      [value]=\"selectedMode()\"\n      (onValueChanged)=\"onModeChange($event.value)\"\n    />\n  </div>\n\n  <!-- Global Options -->\n  <div class=\"control-group\">\n    <label>Global Options</label>\n    <div class=\"switch-group\">\n      <span>Show Interval</span>\n      <ax-switch [(value)]=\"showInterval\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Start Condition</span>\n      <ax-switch [(value)]=\"showStartCondition\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show End Conditions</span>\n      <ax-switch [(value)]=\"showEndConditions\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Exclusions</span>\n      <ax-switch [(value)]=\"showExclusions\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Inclusions</span>\n      <ax-switch [(value)]=\"showInclusions\" />\n    </div>\n  </div>\n\n  <!-- Mode-Specific Options -->\n  @if (selectedMode() === 'daily') {\n    <div class=\"control-group\">\n      <label>Daily Options</label>\n      <div class=\"switch-group\">\n        <span>Show Weekdays Only</span>\n        <ax-switch [(value)]=\"showWeekdaysOnly\" />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'weekly') {\n    <div class=\"control-group\">\n      <label>Weekly Options</label>\n      <div class=\"switch-group\">\n        <span>Show Weekday Selection</span>\n        <ax-switch [(value)]=\"showWeekdaySelection\" />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'monthly') {\n    <div class=\"control-group\">\n      <label>Monthly Options</label>\n      <div class=\"control-subgroup\">\n        <label>Recurrence Mode</label>\n        <ax-select-box\n          [dataSource]=\"[\n            { value: 'none', text: 'None' },\n            { value: 'specificDays', text: 'Specific Days' },\n            { value: 'occurrence', text: 'Occurrence' }\n          ]\"\n          [textField]=\"'text'\"\n          [valueField]=\"'value'\"\n          [value]=\"monthlyRecurrenceMode()\"\n          (onValueChanged)=\"monthlyRecurrenceMode.set($event.value)\"\n        />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'yearly') {\n    <div class=\"control-group\">\n      <label>Yearly Options</label>\n      <div class=\"control-subgroup\">\n        <label>Recurrence Mode</label>\n        <ax-select-box\n          [dataSource]=\"[\n            { value: 'none', text: 'None' },\n            { value: 'specificDate', text: 'Specific Date' },\n            { value: 'occurrence', text: 'Occurrence' }\n          ]\"\n          [textField]=\"'text'\"\n          [valueField]=\"'value'\"\n          [value]=\"yearlyRecurrenceMode()\"\n          (onValueChanged)=\"yearlyRecurrenceMode.set($event.value)\"\n        />\n      </div>\n      <div class=\"switch-group\">\n        <span>Show Month Selection</span>\n        <ax-switch [(value)]=\"showMonthSelection\" />\n      </div>\n    </div>\n  }\n</div>\n", styles: ["@layer properties;@layer components{.ax-scheduler-picker-config{padding:calc(var(--spacing, .25rem) * 5);background:var(--ax-sys-color-surface-container);border-radius:var(--ax-sys-border-radius-md)}.ax-scheduler-picker-config h3{margin-top:calc(var(--spacing, .25rem) * 0);margin-bottom:calc(var(--spacing, .25rem) * 5);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--ax-sys-color-on-surface)}.ax-scheduler-picker-config .control-group{margin-bottom:calc(var(--spacing, .25rem) * 5)}.ax-scheduler-picker-config .control-group:last-child{margin-bottom:calc(var(--spacing, .25rem) * 0)}.ax-scheduler-picker-config .control-group>label{margin-bottom:calc(var(--spacing, .25rem) * 2);display:block;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--ax-sys-color-on-surface-variant)}.ax-scheduler-picker-config .control-group ax-select-box{width:100%}.ax-scheduler-picker-config .control-subgroup{margin-bottom:calc(var(--spacing, .25rem) * 3)}.ax-scheduler-picker-config .control-subgroup label{margin-bottom:calc(var(--spacing, .25rem) * 1.5);display:block;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--ax-sys-color-on-surface-variant)}.ax-scheduler-picker-config .control-subgroup ax-select-box{width:100%}.ax-scheduler-picker-config .switch-group{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-scheduler-picker-config .switch-group span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--ax-sys-color-on-surface)}.ax-scheduler-picker-config .switch-group ax-switch{flex-shrink:0}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "component", type: AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: FormsModule }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerPickerConfigComponent, isStandalone: true, selector: "ax-scheduler-picker-config", outputs: { configChange: "configChange", modeChange: "modeChange" }, ngImport: i0, template: "<div class=\"ax-scheduler-picker-config\">\n  <h3>Configuration</h3>\n\n  <!-- Mode Selector -->\n  <div class=\"control-group\">\n    <label>Mode</label>\n    <ax-select-box\n      [items]=\"modeOptions\"\n      [textField]=\"'text'\"\n      [valueField]=\"'value'\"\n      [value]=\"selectedMode()\"\n      (onValueChanged)=\"onModeChange($event.value)\"\n    />\n  </div>\n\n  <!-- Global Options -->\n  <div class=\"control-group\">\n    <label>Global Options</label>\n    <div class=\"switch-group\">\n      <span>Show Interval</span>\n      <ax-switch [(value)]=\"showInterval\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Start Condition</span>\n      <ax-switch [(value)]=\"showStartCondition\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show End Conditions</span>\n      <ax-switch [(value)]=\"showEndConditions\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Exclusions</span>\n      <ax-switch [(value)]=\"showExclusions\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Inclusions</span>\n      <ax-switch [(value)]=\"showInclusions\" />\n    </div>\n  </div>\n\n  <!-- Mode-Specific Options -->\n  @if (selectedMode() === 'daily') {\n    <div class=\"control-group\">\n      <label>Daily Options</label>\n      <div class=\"switch-group\">\n        <span>Show Weekdays Only</span>\n        <ax-switch [(value)]=\"showWeekdaysOnly\" />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'weekly') {\n    <div class=\"control-group\">\n      <label>Weekly Options</label>\n      <div class=\"switch-group\">\n        <span>Show Weekday Selection</span>\n        <ax-switch [(value)]=\"showWeekdaySelection\" />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'monthly') {\n    <div class=\"control-group\">\n      <label>Monthly Options</label>\n      <div class=\"control-subgroup\">\n        <label>Recurrence Mode</label>\n        <ax-select-box\n          [items]=\"[\n            { value: 'none', text: 'None' },\n            { value: 'specificDays', text: 'Specific Days' },\n            { value: 'occurrence', text: 'Occurrence' }\n          ]\"\n          [textField]=\"'text'\"\n          [valueField]=\"'value'\"\n          [value]=\"monthlyRecurrenceMode()\"\n          (onValueChanged)=\"monthlyRecurrenceMode.set($event.value)\"\n        />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'yearly') {\n    <div class=\"control-group\">\n      <label>Yearly Options</label>\n      <div class=\"control-subgroup\">\n        <label>Recurrence Mode</label>\n        <ax-select-box\n          [items]=\"[\n            { value: 'none', text: 'None' },\n            { value: 'specificDate', text: 'Specific Date' },\n            { value: 'occurrence', text: 'Occurrence' }\n          ]\"\n          [textField]=\"'text'\"\n          [valueField]=\"'value'\"\n          [value]=\"yearlyRecurrenceMode()\"\n          (onValueChanged)=\"yearlyRecurrenceMode.set($event.value)\"\n        />\n      </div>\n      <div class=\"switch-group\">\n        <span>Show Month Selection</span>\n        <ax-switch [(value)]=\"showMonthSelection\" />\n      </div>\n    </div>\n  }\n</div>\n", styles: ["@layer properties;@layer components{.ax-scheduler-picker-config{padding:calc(var(--spacing, .25rem) * 5);background:var(--ax-sys-color-surface-container);border-radius:var(--ax-sys-border-radius-md)}.ax-scheduler-picker-config h3{margin-top:calc(var(--spacing, .25rem) * 0);margin-bottom:calc(var(--spacing, .25rem) * 5);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--ax-sys-color-on-surface)}.ax-scheduler-picker-config .control-group{margin-bottom:calc(var(--spacing, .25rem) * 5)}.ax-scheduler-picker-config .control-group:last-child{margin-bottom:calc(var(--spacing, .25rem) * 0)}.ax-scheduler-picker-config .control-group>label{margin-bottom:calc(var(--spacing, .25rem) * 2);display:block;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--ax-sys-color-on-surface-variant)}.ax-scheduler-picker-config .control-group ax-select-box{width:100%}.ax-scheduler-picker-config .control-subgroup{margin-bottom:calc(var(--spacing, .25rem) * 3)}.ax-scheduler-picker-config .control-subgroup label{margin-bottom:calc(var(--spacing, .25rem) * 1.5);display:block;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--ax-sys-color-on-surface-variant)}.ax-scheduler-picker-config .control-subgroup ax-select-box{width:100%}.ax-scheduler-picker-config .switch-group{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-scheduler-picker-config .switch-group span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--ax-sys-color-on-surface)}.ax-scheduler-picker-config .switch-group ax-switch{flex-shrink:0}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "items", "placeholder", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "maxVisibleItems", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "component", type: AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "ngmodule", type: FormsModule }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerPickerConfigComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-scheduler-picker-config', encapsulation: ViewEncapsulation.None, imports: [AXSelectBoxComponent, AXSwitchComponent, FormsModule], template: "<div class=\"ax-scheduler-picker-config\">\n  <h3>Configuration</h3>\n\n  <!-- Mode Selector -->\n  <div class=\"control-group\">\n    <label>Mode</label>\n    <ax-select-box\n      [dataSource]=\"modeOptions\"\n      [textField]=\"'text'\"\n      [valueField]=\"'value'\"\n      [value]=\"selectedMode()\"\n      (onValueChanged)=\"onModeChange($event.value)\"\n    />\n  </div>\n\n  <!-- Global Options -->\n  <div class=\"control-group\">\n    <label>Global Options</label>\n    <div class=\"switch-group\">\n      <span>Show Interval</span>\n      <ax-switch [(value)]=\"showInterval\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Start Condition</span>\n      <ax-switch [(value)]=\"showStartCondition\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show End Conditions</span>\n      <ax-switch [(value)]=\"showEndConditions\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Exclusions</span>\n      <ax-switch [(value)]=\"showExclusions\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Inclusions</span>\n      <ax-switch [(value)]=\"showInclusions\" />\n    </div>\n  </div>\n\n  <!-- Mode-Specific Options -->\n  @if (selectedMode() === 'daily') {\n    <div class=\"control-group\">\n      <label>Daily Options</label>\n      <div class=\"switch-group\">\n        <span>Show Weekdays Only</span>\n        <ax-switch [(value)]=\"showWeekdaysOnly\" />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'weekly') {\n    <div class=\"control-group\">\n      <label>Weekly Options</label>\n      <div class=\"switch-group\">\n        <span>Show Weekday Selection</span>\n        <ax-switch [(value)]=\"showWeekdaySelection\" />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'monthly') {\n    <div class=\"control-group\">\n      <label>Monthly Options</label>\n      <div class=\"control-subgroup\">\n        <label>Recurrence Mode</label>\n        <ax-select-box\n          [dataSource]=\"[\n            { value: 'none', text: 'None' },\n            { value: 'specificDays', text: 'Specific Days' },\n            { value: 'occurrence', text: 'Occurrence' }\n          ]\"\n          [textField]=\"'text'\"\n          [valueField]=\"'value'\"\n          [value]=\"monthlyRecurrenceMode()\"\n          (onValueChanged)=\"monthlyRecurrenceMode.set($event.value)\"\n        />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'yearly') {\n    <div class=\"control-group\">\n      <label>Yearly Options</label>\n      <div class=\"control-subgroup\">\n        <label>Recurrence Mode</label>\n        <ax-select-box\n          [dataSource]=\"[\n            { value: 'none', text: 'None' },\n            { value: 'specificDate', text: 'Specific Date' },\n            { value: 'occurrence', text: 'Occurrence' }\n          ]\"\n          [textField]=\"'text'\"\n          [valueField]=\"'value'\"\n          [value]=\"yearlyRecurrenceMode()\"\n          (onValueChanged)=\"yearlyRecurrenceMode.set($event.value)\"\n        />\n      </div>\n      <div class=\"switch-group\">\n        <span>Show Month Selection</span>\n        <ax-switch [(value)]=\"showMonthSelection\" />\n      </div>\n    </div>\n  }\n</div>\n", styles: ["@layer properties;@layer components{.ax-scheduler-picker-config{padding:calc(var(--spacing, .25rem) * 5);background:var(--ax-sys-color-surface-container);border-radius:var(--ax-sys-border-radius-md)}.ax-scheduler-picker-config h3{margin-top:calc(var(--spacing, .25rem) * 0);margin-bottom:calc(var(--spacing, .25rem) * 5);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--ax-sys-color-on-surface)}.ax-scheduler-picker-config .control-group{margin-bottom:calc(var(--spacing, .25rem) * 5)}.ax-scheduler-picker-config .control-group:last-child{margin-bottom:calc(var(--spacing, .25rem) * 0)}.ax-scheduler-picker-config .control-group>label{margin-bottom:calc(var(--spacing, .25rem) * 2);display:block;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--ax-sys-color-on-surface-variant)}.ax-scheduler-picker-config .control-group ax-select-box{width:100%}.ax-scheduler-picker-config .control-subgroup{margin-bottom:calc(var(--spacing, .25rem) * 3)}.ax-scheduler-picker-config .control-subgroup label{margin-bottom:calc(var(--spacing, .25rem) * 1.5);display:block;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--ax-sys-color-on-surface-variant)}.ax-scheduler-picker-config .control-subgroup ax-select-box{width:100%}.ax-scheduler-picker-config .switch-group{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-scheduler-picker-config .switch-group span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--ax-sys-color-on-surface)}.ax-scheduler-picker-config .switch-group ax-switch{flex-shrink:0}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
+            args: [{ selector: 'ax-scheduler-picker-config', encapsulation: ViewEncapsulation.None, imports: [AXSelectBoxComponent, AXSwitchComponent, FormsModule], template: "<div class=\"ax-scheduler-picker-config\">\n  <h3>Configuration</h3>\n\n  <!-- Mode Selector -->\n  <div class=\"control-group\">\n    <label>Mode</label>\n    <ax-select-box\n      [items]=\"modeOptions\"\n      [textField]=\"'text'\"\n      [valueField]=\"'value'\"\n      [value]=\"selectedMode()\"\n      (onValueChanged)=\"onModeChange($event.value)\"\n    />\n  </div>\n\n  <!-- Global Options -->\n  <div class=\"control-group\">\n    <label>Global Options</label>\n    <div class=\"switch-group\">\n      <span>Show Interval</span>\n      <ax-switch [(value)]=\"showInterval\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Start Condition</span>\n      <ax-switch [(value)]=\"showStartCondition\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show End Conditions</span>\n      <ax-switch [(value)]=\"showEndConditions\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Exclusions</span>\n      <ax-switch [(value)]=\"showExclusions\" />\n    </div>\n    <div class=\"switch-group\">\n      <span>Show Inclusions</span>\n      <ax-switch [(value)]=\"showInclusions\" />\n    </div>\n  </div>\n\n  <!-- Mode-Specific Options -->\n  @if (selectedMode() === 'daily') {\n    <div class=\"control-group\">\n      <label>Daily Options</label>\n      <div class=\"switch-group\">\n        <span>Show Weekdays Only</span>\n        <ax-switch [(value)]=\"showWeekdaysOnly\" />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'weekly') {\n    <div class=\"control-group\">\n      <label>Weekly Options</label>\n      <div class=\"switch-group\">\n        <span>Show Weekday Selection</span>\n        <ax-switch [(value)]=\"showWeekdaySelection\" />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'monthly') {\n    <div class=\"control-group\">\n      <label>Monthly Options</label>\n      <div class=\"control-subgroup\">\n        <label>Recurrence Mode</label>\n        <ax-select-box\n          [items]=\"[\n            { value: 'none', text: 'None' },\n            { value: 'specificDays', text: 'Specific Days' },\n            { value: 'occurrence', text: 'Occurrence' }\n          ]\"\n          [textField]=\"'text'\"\n          [valueField]=\"'value'\"\n          [value]=\"monthlyRecurrenceMode()\"\n          (onValueChanged)=\"monthlyRecurrenceMode.set($event.value)\"\n        />\n      </div>\n    </div>\n  }\n  \n  @if (selectedMode() === 'yearly') {\n    <div class=\"control-group\">\n      <label>Yearly Options</label>\n      <div class=\"control-subgroup\">\n        <label>Recurrence Mode</label>\n        <ax-select-box\n          [items]=\"[\n            { value: 'none', text: 'None' },\n            { value: 'specificDate', text: 'Specific Date' },\n            { value: 'occurrence', text: 'Occurrence' }\n          ]\"\n          [textField]=\"'text'\"\n          [valueField]=\"'value'\"\n          [value]=\"yearlyRecurrenceMode()\"\n          (onValueChanged)=\"yearlyRecurrenceMode.set($event.value)\"\n        />\n      </div>\n      <div class=\"switch-group\">\n        <span>Show Month Selection</span>\n        <ax-switch [(value)]=\"showMonthSelection\" />\n      </div>\n    </div>\n  }\n</div>\n", styles: ["@layer properties;@layer components{.ax-scheduler-picker-config{padding:calc(var(--spacing, .25rem) * 5);background:var(--ax-sys-color-surface-container);border-radius:var(--ax-sys-border-radius-md)}.ax-scheduler-picker-config h3{margin-top:calc(var(--spacing, .25rem) * 0);margin-bottom:calc(var(--spacing, .25rem) * 5);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:var(--ax-sys-color-on-surface)}.ax-scheduler-picker-config .control-group{margin-bottom:calc(var(--spacing, .25rem) * 5)}.ax-scheduler-picker-config .control-group:last-child{margin-bottom:calc(var(--spacing, .25rem) * 0)}.ax-scheduler-picker-config .control-group>label{margin-bottom:calc(var(--spacing, .25rem) * 2);display:block;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--ax-sys-color-on-surface-variant)}.ax-scheduler-picker-config .control-group ax-select-box{width:100%}.ax-scheduler-picker-config .control-subgroup{margin-bottom:calc(var(--spacing, .25rem) * 3)}.ax-scheduler-picker-config .control-subgroup label{margin-bottom:calc(var(--spacing, .25rem) * 1.5);display:block;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:var(--ax-sys-color-on-surface-variant)}.ax-scheduler-picker-config .control-subgroup ax-select-box{width:100%}.ax-scheduler-picker-config .switch-group{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-scheduler-picker-config .switch-group span{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:var(--ax-sys-color-on-surface)}.ax-scheduler-picker-config .switch-group ax-switch{flex-shrink:0}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
         }], ctorParameters: () => [], propDecorators: { configChange: [{ type: i0.Output, args: ["configChange"] }], modeChange: [{ type: i0.Output, args: ["modeChange"] }] } });
 // Main component