@masterteam/components 0.0.129 → 0.0.131

package/fesm2022/masterteam-components-client-page.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"masterteam-components-client-page.mjs","sources":["../../../../packages/masterteam/components/client-page/client-page.ts","../../../../packages/masterteam/components/client-page/client-page.html","../../../../packages/masterteam/components/client-page/masterteam-components-client-page.ts"],"sourcesContent":["import {\r\n  Component,\r\n  contentChild,\r\n  computed,\r\n  effect,\r\n  inject,\r\n  input,\r\n  linkedSignal,\r\n  model,\r\n  OnDestroy,\r\n  output,\r\n  PLATFORM_ID,\r\n  signal,\r\n  TemplateRef,\r\n} from '@angular/core';\r\nimport { isPlatformBrowser, NgTemplateOutlet } from '@angular/common';\r\nimport { Avatar } from '@masterteam/components/avatar';\r\nimport { Card } from '@masterteam/components/card';\r\nimport {\r\n  ClientPageMenu,\r\n  ClientPageMenuItem,\r\n} from '@masterteam/components/client-page-menu';\r\nimport { Icon } from '@masterteam/icons';\r\n\r\n@Component({\r\n  selector: 'mt-client-page',\r\n  standalone: true,\r\n  imports: [Avatar, Card, ClientPageMenu, Icon, NgTemplateOutlet],\r\n  templateUrl: './client-page.html',\r\n  host: {\r\n    class: 'block h-full',\r\n  },\r\n})\r\nexport class ClientPage implements OnDestroy {\r\n  private readonly platformId = inject(PLATFORM_ID);\r\n  private mediaQueryList: MediaQueryList | null = null;\r\n\r\n  /** Icon for the left sidebar header */\r\n  readonly menuIcon = input<string>();\r\n\r\n  /** Title for the left sidebar header */\r\n  readonly menuTitle = input<string>();\r\n\r\n  /** List of menu items for the left sidebar */\r\n  readonly menuItems = input<ClientPageMenuItem[]>([]);\r\n\r\n  /** Whether menu items are loading */\r\n  readonly menuItemsLoading = input<boolean>(false);\r\n\r\n  /** Key of the active menu item (defaults to first item) */\r\n  readonly activeItem = input<string>();\r\n\r\n  /** Whether the sidebar menu is collapsed (two-way bindable) */\r\n  readonly collapsed = model<boolean>(false);\r\n\r\n  /** Template projected into the left sidebar header end */\r\n  readonly headerEnd = contentChild<TemplateRef<any>>('headerClientPageEnd');\r\n\r\n  /** Emitted when a menu item is clicked */\r\n  readonly menuItemClick = output<ClientPageMenuItem>();\r\n\r\n  /** Tracks activeItem input, overridable by user clicks */\r\n  private readonly selectedKey = linkedSignal(() => this.activeItem());\r\n\r\n  /** Currently selected menu item */\r\n  readonly selectedItem = computed(() => {\r\n    const key = this.selectedKey();\r\n    const items = this.menuItems();\r\n    if (key) {\r\n      return items.find((item) => item.key === key) ?? items[0] ?? null;\r\n    }\r\n    return items[0] ?? null;\r\n  });\r\n\r\n  /** Whether the initial default selection has been emitted */\r\n  private initialEmitted = false;\r\n\r\n  constructor() {\r\n    effect(() => {\r\n      const item = this.selectedItem();\r\n      if (item && !this.initialEmitted) {\r\n        this.initialEmitted = true;\r\n        this.menuItemClick.emit(item);\r\n      }\r\n    });\r\n\r\n    this.setupResponsiveBehavior();\r\n  }\r\n\r\n  /** Whether the divider/toggle area is being hovered */\r\n  readonly dividerHovered = signal(false);\r\n\r\n  /** Whether the viewport is at or below the responsive breakpoint */\r\n  readonly isResponsive = signal(false);\r\n\r\n  /** Whether the responsive top navigation is expanded */\r\n  readonly responsiveMenuExpanded = signal(false);\r\n\r\n  /** Whether the menu section is currently visible */\r\n  readonly showSidebarMenu = computed(() =>\r\n    this.isResponsive() ? this.responsiveMenuExpanded() : !this.collapsed(),\r\n  );\r\n\r\n  /** Sidebar width reacts to collapsed + hover */\r\n  readonly sidebarWidth = computed(() => {\r\n    if (this.isResponsive()) {\r\n      return '100%';\r\n    }\r\n    if (this.collapsed()) {\r\n      return this.dividerHovered() ? '12px' : '9px';\r\n    }\r\n    return this.dividerHovered() ? '15.8%' : '16%';\r\n  });\r\n\r\n  /** Icon for the collapse toggle button */\r\n  readonly toggleIcon = computed(() =>\r\n    this.isResponsive()\r\n      ? this.responsiveMenuExpanded()\r\n        ? 'arrow.chevron-up'\r\n        : 'arrow.chevron-down'\r\n      : this.collapsed()\r\n        ? 'arrow.chevron-right'\r\n        : 'arrow.chevron-left',\r\n  );\r\n\r\n  /** Accessible label for the toggle button */\r\n  readonly toggleAriaLabel = computed(() =>\r\n    this.isResponsive()\r\n      ? this.responsiveMenuExpanded()\r\n        ? 'Collapse menu'\r\n        : 'Expand menu'\r\n      : this.collapsed()\r\n        ? 'Expand sidebar'\r\n        : 'Collapse sidebar',\r\n  );\r\n\r\n  toggleCollapsed(): void {\r\n    if (this.isResponsive()) {\r\n      this.responsiveMenuExpanded.update((expanded) => !expanded);\r\n      return;\r\n    }\r\n    this.collapsed.update((v) => !v);\r\n  }\r\n\r\n  selectItem(item: ClientPageMenuItem): void {\r\n    this.selectedKey.set(item.key);\r\n    if (this.isResponsive()) {\r\n      this.responsiveMenuExpanded.set(false);\r\n    }\r\n    this.menuItemClick.emit(item);\r\n  }\r\n\r\n  ngOnDestroy(): void {\r\n    if (!this.mediaQueryList) {\r\n      return;\r\n    }\r\n\r\n    if (typeof this.mediaQueryList.removeEventListener === 'function') {\r\n      this.mediaQueryList.removeEventListener(\r\n        'change',\r\n        this.handleResponsiveBreakpointChange,\r\n      );\r\n      return;\r\n    }\r\n\r\n    this.mediaQueryList.removeListener(this.handleResponsiveBreakpointChange);\r\n  }\r\n\r\n  getAvatarStyle(color: string): Record<string, string> {\r\n    if (color.startsWith('#')) {\r\n      return {\r\n        '--p-avatar-background': color + '1a',\r\n        '--p-avatar-color': color,\r\n      };\r\n    }\r\n    return {\r\n      '--p-avatar-background': `var(--p-${color}-100)`,\r\n      '--p-avatar-color': `var(--p-${color}-700)`,\r\n    };\r\n  }\r\n\r\n  private readonly handleResponsiveBreakpointChange = (\r\n    event: MediaQueryListEvent,\r\n  ): void => {\r\n    this.syncResponsiveState(event.matches);\r\n  };\r\n\r\n  private setupResponsiveBehavior(): void {\r\n    if (\r\n      !isPlatformBrowser(this.platformId) ||\r\n      typeof window.matchMedia !== 'function'\r\n    ) {\r\n      return;\r\n    }\r\n\r\n    this.mediaQueryList = window.matchMedia('(max-width: 1024px)');\r\n    this.syncResponsiveState(this.mediaQueryList.matches);\r\n\r\n    if (typeof this.mediaQueryList.addEventListener === 'function') {\r\n      this.mediaQueryList.addEventListener(\r\n        'change',\r\n        this.handleResponsiveBreakpointChange,\r\n      );\r\n      return;\r\n    }\r\n\r\n    this.mediaQueryList.addListener(this.handleResponsiveBreakpointChange);\r\n  }\r\n\r\n  private syncResponsiveState(isResponsive: boolean): void {\r\n    const wasResponsive = this.isResponsive();\r\n    this.isResponsive.set(isResponsive);\r\n    this.dividerHovered.set(false);\r\n\r\n    if (wasResponsive !== isResponsive) {\r\n      this.responsiveMenuExpanded.set(false);\r\n    }\r\n  }\r\n}\r\n","<mt-card class=\"bg-gray-200 w-full h-full\">\r\n  <ng-template #headless>\r\n    <div class=\"flex h-full min-h-0\" [class.flex-col]=\"isResponsive()\">\r\n      <!-- Left Sidebar -->\r\n      <div\r\n        class=\"flex min-h-0 flex-col overflow-hidden transition-all duration-300 ease-in-out\"\r\n        [style.width]=\"sidebarWidth()\"\r\n      >\r\n        <!-- Sidebar Header -->\r\n        <div\r\n          class=\"flex shrink-0 items-center justify-between overflow-hidden border-b border-gray-300 px-5 py-4\"\r\n          [class.whitespace-nowrap]=\"!isResponsive()\"\r\n        >\r\n          <div class=\"flex min-w-0 items-center gap-2\">\r\n            @if (menuIcon()) {\r\n              <div class=\"text-lg shrink-0\">\r\n                <mt-icon [icon]=\"menuIcon()!\" />\r\n              </div>\r\n            }\r\n            @if (menuTitle()) {\r\n              <div class=\"min-w-0 truncate font-semibold\">\r\n                {{ menuTitle() }}\r\n              </div>\r\n            }\r\n          </div>\r\n\r\n          @if (isResponsive()) {\r\n            <button\r\n              type=\"button\"\r\n              (click)=\"toggleCollapsed()\"\r\n              class=\"ml-3 flex h-9 w-9 shrink-0 items-center justify-center rounded-full border border-gray-300 bg-white text-gray-500 transition-all duration-200 ease-in-out hover:bg-gray-50 hover:text-primary-600 active:scale-95 active:bg-gray-100\"\r\n              [attr.aria-label]=\"toggleAriaLabel()\"\r\n            >\r\n              <mt-icon [icon]=\"toggleIcon()\" class=\"text-sm\" />\r\n            </button>\r\n          }\r\n        </div>\r\n\r\n        @if (showSidebarMenu()) {\r\n          <!-- Menu Items -->\r\n          <div\r\n            class=\"min-h-0 overflow-hidden\"\r\n            [class.flex-1]=\"!isResponsive()\"\r\n            [style.maxHeight]=\"isResponsive() ? '22rem' : null\"\r\n          >\r\n            <mt-client-page-menu\r\n              class=\"h-full\"\r\n              [menuItems]=\"menuItems()\"\r\n              [selectedItem]=\"selectedItem()\"\r\n              [loading]=\"menuItemsLoading()\"\r\n              (menuItemClick)=\"selectItem($event)\"\r\n            />\r\n          </div>\r\n        }\r\n      </div>\r\n\r\n      <!-- Vertical Divider with Toggle Button -->\r\n      @if (!isResponsive()) {\r\n        <div\r\n          class=\"relative w-px flex-shrink-0\"\r\n          (mouseenter)=\"dividerHovered.set(true)\"\r\n          (mouseleave)=\"dividerHovered.set(false)\"\r\n        >\r\n          <!-- Toggle Button at bottom of divider -->\r\n          <button\r\n            type=\"button\"\r\n            (click)=\"toggleCollapsed()\"\r\n            class=\"absolute bottom-6 left-1/2 z-10 flex h-6 w-6 -translate-x-1/2 cursor-pointer items-center justify-center rounded-full border border-gray-300 bg-white shadow-sm transition-all duration-200 ease-in-out hover:scale-125 hover:bg-gray-50 hover:shadow-md active:scale-95 active:bg-gray-100 group\"\r\n            [attr.aria-label]=\"toggleAriaLabel()\"\r\n          >\r\n            <mt-icon\r\n              [icon]=\"toggleIcon()\"\r\n              class=\"text-xs text-gray-500 transition-all duration-200 group-hover:animate-pulse group-hover:text-primary-600\"\r\n            />\r\n          </button>\r\n        </div>\r\n      }\r\n\r\n      <!-- Right Content Panel -->\r\n      <div class=\"flex min-h-0 min-w-0 flex-1 flex-col\">\r\n        <mt-card class=\"h-full min-h-0\">\r\n          <ng-template #headless>\r\n            <!-- Content Header -->\r\n            <div\r\n              class=\"flex shrink-0 items-center justify-between border-b border-surface px-5 py-4\"\r\n              [class.flex-col]=\"isResponsive()\"\r\n              [class.items-start]=\"isResponsive()\"\r\n              [class.gap-3]=\"isResponsive()\"\r\n            >\r\n              <div class=\"flex min-w-0 items-center gap-3\">\r\n                @if (selectedItem(); as selected) {\r\n                  <mt-avatar\r\n                    [style]=\"getAvatarStyle(selected.color)\"\r\n                    [icon]=\"selected.icon\"\r\n                    shape=\"square\"\r\n                    size=\"large\"\r\n                  />\r\n                  <div class=\"min-w-0\">\r\n                    <div class=\"text-md truncate font-semibold\">\r\n                      {{ selected.title }}\r\n                    </div>\r\n                    @if (selected.subtitle) {\r\n                      <div class=\"truncate text-sm font-semibold text-gray-500\">\r\n                        {{ selected.subtitle }}\r\n                      </div>\r\n                    }\r\n                  </div>\r\n                }\r\n              </div>\r\n              @if (headerEnd(); as template) {\r\n                <div\r\n                  class=\"flex gap-2\"\r\n                  [class.w-full]=\"isResponsive()\"\r\n                  [class.flex-wrap]=\"isResponsive()\"\r\n                  [class.justify-end]=\"isResponsive()\"\r\n                >\r\n                  <ng-container [ngTemplateOutlet]=\"template\" />\r\n                </div>\r\n              }\r\n            </div>\r\n\r\n            <!-- Content Body -->\r\n            <div\r\n              class=\"flex min-h-0 min-w-0 flex-1 flex-col overflow-y-auto p-5\"\r\n            >\r\n              <ng-content />\r\n            </div>\r\n          </ng-template>\r\n        </mt-card>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n</mt-card>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/masterteam-components-color-picker-field.mjs

@@ -1,94 +0,0 @@
-import * as i0 from '@angular/core';
-import { input, output, inject, signal, effect, ViewChild, Component } from '@angular/core';
-import * as i1 from '@angular/forms';
-import { NgControl, Validators, FormsModule } from '@angular/forms';
-import * as i2 from 'primeng/colorpicker';
-import { ColorPickerModule } from 'primeng/colorpicker';
-import { FieldValidation } from '@masterteam/components/field-validation';
-import { TextField } from '@masterteam/components/text-field';
-import { isInvalid } from '@masterteam/components';
-
-class ColorPickerField {
-    colorPicker;
-    label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
-    appendTo = input('body', ...(ngDevMode ? [{ debugName: "appendTo" }] : []));
-    placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : []));
-    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
-    variant = input('outlined', ...(ngDevMode ? [{ debugName: "variant" }] : []));
-    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
-    pInputs = input(...(ngDevMode ? [undefined, { debugName: "pInputs" }] : []));
-    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
-    onChange = output();
-    ngControl = inject(NgControl, { self: true });
-    requiredValidator = Validators.required;
-    value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
-    disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-    onTouched = () => { };
-    onModelChange = () => { };
-    isInvalid = isInvalid;
-    constructor() {
-        if (this.ngControl) {
-            this.ngControl.valueAccessor = this;
-        }
-        // Effect to apply pInputs reactively when the pInputs signal changes
-        effect(() => {
-            const currentPInputs = this.pInputs();
-            // Ensure colorPicker ViewChild is initialized and pInputs has a value
-            // @ViewChild with static: true makes 'colorPicker' available during construction/ngOnInit
-            if (this.colorPicker && currentPInputs) {
-                this.applyInputsToColorPicker();
-            }
-        });
-        // Effect to add required validator if required input is true
-        effect(() => {
-            if (this.ngControl.control && this.required()) {
-                this.ngControl.control.addValidators(Validators.required);
-                this.ngControl.control.updateValueAndValidity();
-            }
-            if (this.ngControl.control) {
-                this.ngControl.control.addValidators(Validators.pattern(/^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$/));
-            }
-        });
-    }
-    applyInputsToColorPicker() {
-        const currentPInputs = this.pInputs();
-        if (currentPInputs) {
-            Object.assign(this.colorPicker, currentPInputs);
-        }
-    }
-    onValueChange(value) {
-        this.onModelChange(value);
-        this.onTouched();
-        this.value.set(value);
-    }
-    writeValue(value) {
-        this.value.set(value);
-    }
-    registerOnChange(fn) {
-        this.onModelChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(disabled) {
-        this.disabled.set(disabled);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ColorPickerField, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: ColorPickerField, isStandalone: true, selector: "mt-color-picker-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChange: "onChange" }, host: { properties: { "class": "class()" } }, viewQueries: [{ propertyName: "colorPicker", first: true, predicate: ["colorPicker"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"flex flex-col gap-1 min-w-full\">\r\n  @if (label()) {\r\n    <label\r\n      [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n      [for]=\"ngControl?.name || label()\"\r\n      >{{ label() }}</label\r\n    >\r\n  }\r\n  <div\r\n    class=\"flex items-center hover:border-(--p-inputtext-hover-border-color)! p-inputtext\"\r\n    [class.bg-(--p-inputtext-filled-background)]=\"variant() === 'filled'\"\r\n    [class.border-(--p-inputtext-invalid-border-color)!]=\"\r\n      ngControl?.control?.invalid && ngControl?.control?.touched\r\n    \"\r\n  >\r\n    <p-colorpicker\r\n      #colorPicker=\"\"\r\n      [ngModel]=\"value()\"\r\n      (ngModelChange)=\"onValueChange($event)\"\r\n      (onChange)=\"onChange.emit($event)\"\r\n      (blur)=\"onTouched()\"\r\n      [disabled]=\"disabled() || readonly()\"\r\n      [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n      [class.ng-invalid]=\"ngControl?.control?.invalid\"\r\n      class=\"leading-none\"\r\n      [appendTo]=\"appendTo()\"\r\n      [invalid]=\"isInvalid(ngControl?.control)\"\r\n    ></p-colorpicker>\r\n    <div class=\"ms-2 w-full min-w-0\">\r\n      <mt-text-field\r\n        [ngModel]=\"value()\"\r\n        (ngModelChange)=\"onValueChange($event)\"\r\n        (change)=\"onChange.emit($event)\"\r\n        (blur)=\"onTouched()\"\r\n        [disabled]=\"disabled() || readonly()\"\r\n        [class.ng-invalid]=\"ngControl?.control?.invalid\"\r\n        placeholder=\"Select Color\"\r\n        class=\"leading-none p-0 input-no-border px-0 w-full\"\r\n        hint=\"Should be a hex color code, e.g. #ff5733 or #f00\"\r\n      ></mt-text-field>\r\n    </div>\r\n  </div>\r\n  <mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n</div>\r\n", styles: [":host{display:flex;align-items:center}::ng-deep .input-no-border .p-component{border:none;box-shadow:none;background-color:transparent;width:100%}::ng-deep .input-no-border .p-inputgroupaddon{border-inline:none;border-block-start:none;border-block-end:none;padding:0!important}::ng-deep .input-no-border .p-inputgroupaddon:last-child{border-inline-end:none}::ng-deep .p-inputtext .p-inputtext{padding:0!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ColorPickerModule }, { kind: "component", type: i2.ColorPicker, selector: "p-colorPicker, p-colorpicker, p-color-picker", inputs: ["styleClass", "showTransitionOptions", "hideTransitionOptions", "inline", "format", "tabindex", "inputId", "autoZIndex", "autofocus", "defaultColor", "appendTo", "overlayOptions", "motionOptions"], outputs: ["onChange", "onShow", "onHide"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }, { kind: "component", type: TextField, selector: "mt-text-field", inputs: ["field", "hint", "label", "placeholder", "class", "type", "readonly", "pInputs", "required", "icon", "iconPosition"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: ColorPickerField, decorators: [{
-            type: Component,
-            args: [{ selector: 'mt-color-picker-field', standalone: true, imports: [FormsModule, ColorPickerModule, FieldValidation, TextField], host: {
-                        '[class]': 'class()',
-                    }, template: "<div class=\"flex flex-col gap-1 min-w-full\">\r\n  @if (label()) {\r\n    <label\r\n      [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n      [for]=\"ngControl?.name || label()\"\r\n      >{{ label() }}</label\r\n    >\r\n  }\r\n  <div\r\n    class=\"flex items-center hover:border-(--p-inputtext-hover-border-color)! p-inputtext\"\r\n    [class.bg-(--p-inputtext-filled-background)]=\"variant() === 'filled'\"\r\n    [class.border-(--p-inputtext-invalid-border-color)!]=\"\r\n      ngControl?.control?.invalid && ngControl?.control?.touched\r\n    \"\r\n  >\r\n    <p-colorpicker\r\n      #colorPicker=\"\"\r\n      [ngModel]=\"value()\"\r\n      (ngModelChange)=\"onValueChange($event)\"\r\n      (onChange)=\"onChange.emit($event)\"\r\n      (blur)=\"onTouched()\"\r\n      [disabled]=\"disabled() || readonly()\"\r\n      [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n      [class.ng-invalid]=\"ngControl?.control?.invalid\"\r\n      class=\"leading-none\"\r\n      [appendTo]=\"appendTo()\"\r\n      [invalid]=\"isInvalid(ngControl?.control)\"\r\n    ></p-colorpicker>\r\n    <div class=\"ms-2 w-full min-w-0\">\r\n      <mt-text-field\r\n        [ngModel]=\"value()\"\r\n        (ngModelChange)=\"onValueChange($event)\"\r\n        (change)=\"onChange.emit($event)\"\r\n        (blur)=\"onTouched()\"\r\n        [disabled]=\"disabled() || readonly()\"\r\n        [class.ng-invalid]=\"ngControl?.control?.invalid\"\r\n        placeholder=\"Select Color\"\r\n        class=\"leading-none p-0 input-no-border px-0 w-full\"\r\n        hint=\"Should be a hex color code, e.g. #ff5733 or #f00\"\r\n      ></mt-text-field>\r\n    </div>\r\n  </div>\r\n  <mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n</div>\r\n", styles: [":host{display:flex;align-items:center}::ng-deep .input-no-border .p-component{border:none;box-shadow:none;background-color:transparent;width:100%}::ng-deep .input-no-border .p-inputgroupaddon{border-inline:none;border-block-start:none;border-block-end:none;padding:0!important}::ng-deep .input-no-border .p-inputgroupaddon:last-child{border-inline-end:none}::ng-deep .p-inputtext .p-inputtext{padding:0!important}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { colorPicker: [{
-                type: ViewChild,
-                args: ['colorPicker', { static: true }]
-            }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], appendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendTo", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], pInputs: [{ type: i0.Input, args: [{ isSignal: true, alias: "pInputs", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], onChange: [{ type: i0.Output, args: ["onChange"] }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { ColorPickerField };
-//# sourceMappingURL=masterteam-components-color-picker-field.mjs.map

package/fesm2022/masterteam-components-color-picker-field.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"masterteam-components-color-picker-field.mjs","sources":["../../../../packages/masterteam/components/color-picker-field/color-picker-field.ts","../../../../packages/masterteam/components/color-picker-field/color-picker-field.html","../../../../packages/masterteam/components/color-picker-field/masterteam-components-color-picker-field.ts"],"sourcesContent":["import {\r\n  Component,\r\n  ViewChild,\r\n  signal,\r\n  input,\r\n  output,\r\n  inject,\r\n  effect,\r\n} from '@angular/core';\r\nimport {\r\n  ControlValueAccessor,\r\n  FormsModule,\r\n  NgControl,\r\n  Validators,\r\n} from '@angular/forms';\r\nimport {\r\n  ColorPickerModule,\r\n  ColorPicker,\r\n  ColorPickerChangeEvent,\r\n} from 'primeng/colorpicker';\r\nimport { FieldValidation } from '@masterteam/components/field-validation';\r\nimport { TextField } from '@masterteam/components/text-field';\r\nimport { isInvalid } from '@masterteam/components';\r\n\r\n@Component({\r\n  selector: 'mt-color-picker-field',\r\n  standalone: true,\r\n  imports: [FormsModule, ColorPickerModule, FieldValidation, TextField],\r\n  templateUrl: './color-picker-field.html',\r\n  styleUrls: ['./color-picker-field.scss'],\r\n  host: {\r\n    '[class]': 'class()',\r\n  },\r\n})\r\nexport class ColorPickerField implements ControlValueAccessor {\r\n  @ViewChild('colorPicker', { static: true })\r\n  colorPicker: ColorPicker;\r\n  label = input<string>();\r\n  appendTo = input<string>('body');\r\n  placeholder = input<string>();\r\n  class = input<string>('');\r\n  variant = input<'outlined' | 'filled'>('outlined');\r\n  readonly = input<boolean>(false);\r\n  pInputs = input<Partial<ColorPicker>>();\r\n  required = input<boolean>(false);\r\n\r\n  onChange = output<ColorPickerChangeEvent>();\r\n\r\n  public ngControl = inject(NgControl, { self: true });\r\n\r\n  requiredValidator = Validators.required;\r\n  value = signal<string | null>(null);\r\n  disabled = signal<boolean>(false);\r\n\r\n  onTouched: () => void = () => {};\r\n  onModelChange: (value: string | null) => void = () => {};\r\n  isInvalid = isInvalid;\r\n\r\n  constructor() {\r\n    if (this.ngControl) {\r\n      this.ngControl.valueAccessor = this;\r\n    }\r\n\r\n    // Effect to apply pInputs reactively when the pInputs signal changes\r\n    effect(() => {\r\n      const currentPInputs = this.pInputs();\r\n      // Ensure colorPicker ViewChild is initialized and pInputs has a value\r\n      // @ViewChild with static: true makes 'colorPicker' available during construction/ngOnInit\r\n      if (this.colorPicker && currentPInputs) {\r\n        this.applyInputsToColorPicker();\r\n      }\r\n    });\r\n\r\n    // Effect to add required validator if required input is true\r\n    effect(() => {\r\n      if (this.ngControl.control && this.required()) {\r\n        this.ngControl.control.addValidators(Validators.required);\r\n        this.ngControl.control.updateValueAndValidity();\r\n      }\r\n      if (this.ngControl.control) {\r\n        this.ngControl.control.addValidators(\r\n          Validators.pattern(/^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$/),\r\n        );\r\n      }\r\n    });\r\n  }\r\n\r\n  applyInputsToColorPicker() {\r\n    const currentPInputs = this.pInputs();\r\n    if (currentPInputs) {\r\n      Object.assign(this.colorPicker, currentPInputs);\r\n    }\r\n  }\r\n\r\n  onValueChange(value: string | null) {\r\n    this.onModelChange(value);\r\n    this.onTouched();\r\n    this.value.set(value);\r\n  }\r\n\r\n  writeValue(value: string | null) {\r\n    this.value.set(value);\r\n  }\r\n\r\n  registerOnChange(fn: any) {\r\n    this.onModelChange = fn;\r\n  }\r\n\r\n  registerOnTouched(fn: any) {\r\n    this.onTouched = fn;\r\n  }\r\n\r\n  setDisabledState(disabled: boolean) {\r\n    this.disabled.set(disabled);\r\n  }\r\n}\r\n","<div class=\"flex flex-col gap-1 min-w-full\">\r\n  @if (label()) {\r\n    <label\r\n      [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n      [for]=\"ngControl?.name || label()\"\r\n      >{{ label() }}</label\r\n    >\r\n  }\r\n  <div\r\n    class=\"flex items-center hover:border-(--p-inputtext-hover-border-color)! p-inputtext\"\r\n    [class.bg-(--p-inputtext-filled-background)]=\"variant() === 'filled'\"\r\n    [class.border-(--p-inputtext-invalid-border-color)!]=\"\r\n      ngControl?.control?.invalid && ngControl?.control?.touched\r\n    \"\r\n  >\r\n    <p-colorpicker\r\n      #colorPicker=\"\"\r\n      [ngModel]=\"value()\"\r\n      (ngModelChange)=\"onValueChange($event)\"\r\n      (onChange)=\"onChange.emit($event)\"\r\n      (blur)=\"onTouched()\"\r\n      [disabled]=\"disabled() || readonly()\"\r\n      [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n      [class.ng-invalid]=\"ngControl?.control?.invalid\"\r\n      class=\"leading-none\"\r\n      [appendTo]=\"appendTo()\"\r\n      [invalid]=\"isInvalid(ngControl?.control)\"\r\n    ></p-colorpicker>\r\n    <div class=\"ms-2 w-full min-w-0\">\r\n      <mt-text-field\r\n        [ngModel]=\"value()\"\r\n        (ngModelChange)=\"onValueChange($event)\"\r\n        (change)=\"onChange.emit($event)\"\r\n        (blur)=\"onTouched()\"\r\n        [disabled]=\"disabled() || readonly()\"\r\n        [class.ng-invalid]=\"ngControl?.control?.invalid\"\r\n        placeholder=\"Select Color\"\r\n        class=\"leading-none p-0 input-no-border px-0 w-full\"\r\n        hint=\"Should be a hex color code, e.g. #ff5733 or #f00\"\r\n      ></mt-text-field>\r\n    </div>\r\n  </div>\r\n  <mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/masterteam-components-date-field.mjs

@@ -1,93 +0,0 @@
-import * as i0 from '@angular/core';
-import { input, signal, inject, effect, HostBinding, ViewChild, ChangeDetectionStrategy, Component } from '@angular/core';
-import * as i1 from '@angular/forms';
-import { Validators, NgControl, FormsModule } from '@angular/forms';
-import * as i2 from 'primeng/datepicker';
-import { DatePickerModule } from 'primeng/datepicker';
-import { isInvalid } from '@masterteam/components';
-import { Icon } from '@masterteam/icons';
-
-class DateField {
-    calendar;
-    field = input(true, ...(ngDevMode ? [{ debugName: "field" }] : []));
-    label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
-    placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : []));
-    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
-    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
-    showIcon = input(true, ...(ngDevMode ? [{ debugName: "showIcon" }] : []));
-    showClear = input(false, ...(ngDevMode ? [{ debugName: "showClear" }] : []));
-    showTime = input(false, ...(ngDevMode ? [{ debugName: "showTime" }] : []));
-    pInputs = input(...(ngDevMode ? [undefined, { debugName: "pInputs" }] : []));
-    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : []));
-    rtl = signal(document.documentElement.dir === 'rtl', ...(ngDevMode ? [{ debugName: "rtl" }] : []));
-    styleClass;
-    requiredValidator = Validators.required;
-    value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
-    disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
-    onTouched = () => { };
-    onModelChange = () => { };
-    ngControl = inject(NgControl, { self: true });
-    isInvalid = isInvalid;
-    constructor() {
-        if (this.ngControl) {
-            this.ngControl.valueAccessor = this;
-        }
-        effect(() => {
-            if (this.ngControl.control && this.required()) {
-                this.ngControl.control.addValidators(Validators.required);
-                this.ngControl.control.updateValueAndValidity();
-            }
-        });
-    }
-    applyInputsToCalendar() {
-        Object.assign(this.calendar, this.pInputs());
-    }
-    ngOnInit() {
-        this.styleClass = this.class();
-        if (this.pInputs()) {
-            this.applyInputsToCalendar();
-        }
-    }
-    onValueChange(value) {
-        this.onModelChange(value);
-        this.value.set(value);
-    }
-    ngOnChanges(changes) {
-        if (changes['pInputs']) {
-            this.applyInputsToCalendar();
-        }
-    }
-    writeValue(value) {
-        this.value.set(value);
-    }
-    registerOnChange(fn) {
-        this.onModelChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(disabled) {
-        this.disabled.set(disabled);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: DateField, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: DateField, isStandalone: true, selector: "mt-date-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, showTime: { classPropertyName: "showTime", publicName: "showTime", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.styleClass" }, classAttribute: "grid gap-1" }, viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "@if (label()) {\r\n  <label\r\n    [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n    [for]=\"ngControl?.name || label()\"\r\n    >{{ label() }}</label\r\n  >\r\n}\r\n<p-datepicker\r\n  #calendar\r\n  [ngModel]=\"value()\"\r\n  (ngModelChange)=\"onValueChange($event)\"\r\n  (onBlur)=\"onTouched()\"\r\n  [disabled]=\"disabled() || readonly()\"\r\n  [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n  [invalid]=\"isInvalid(ngControl?.control)\"\r\n  [baseZIndex]=\"1051\"\r\n  placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\r\n  inputStyleClass=\"w-full\"\r\n  [showIcon]=\"showIcon()\"\r\n  [showClear]=\"showClear()\"\r\n  [showTime]=\"showTime()\"\r\n  dateFormat=\"dd/mm/yy\"\r\n  appendTo=\"body\"\r\n>\r\n  <ng-template #previousicon>\r\n    <mt-icon\r\n      [icon]=\"rtl() ? 'arrow.chevron-right' : 'arrow.chevron-left'\"\r\n      class=\"text-2xl\"\r\n    />\r\n  </ng-template>\r\n  <ng-template #nexticon>\r\n    <mt-icon\r\n      [icon]=\"rtl() ? 'arrow.chevron-left' : 'arrow.chevron-right'\"\r\n      class=\"text-2xl\"\r\n    />\r\n  </ng-template>\r\n</p-datepicker>\r\n\r\n<!-- <mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation> -->\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: DateField, decorators: [{
-            type: Component,
-            args: [{ selector: 'mt-date-field', standalone: true, imports: [FormsModule, DatePickerModule, Icon], changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        class: 'grid gap-1',
-                    }, template: "@if (label()) {\r\n  <label\r\n    [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n    [for]=\"ngControl?.name || label()\"\r\n    >{{ label() }}</label\r\n  >\r\n}\r\n<p-datepicker\r\n  #calendar\r\n  [ngModel]=\"value()\"\r\n  (ngModelChange)=\"onValueChange($event)\"\r\n  (onBlur)=\"onTouched()\"\r\n  [disabled]=\"disabled() || readonly()\"\r\n  [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n  [invalid]=\"isInvalid(ngControl?.control)\"\r\n  [baseZIndex]=\"1051\"\r\n  placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\r\n  inputStyleClass=\"w-full\"\r\n  [showIcon]=\"showIcon()\"\r\n  [showClear]=\"showClear()\"\r\n  [showTime]=\"showTime()\"\r\n  dateFormat=\"dd/mm/yy\"\r\n  appendTo=\"body\"\r\n>\r\n  <ng-template #previousicon>\r\n    <mt-icon\r\n      [icon]=\"rtl() ? 'arrow.chevron-right' : 'arrow.chevron-left'\"\r\n      class=\"text-2xl\"\r\n    />\r\n  </ng-template>\r\n  <ng-template #nexticon>\r\n    <mt-icon\r\n      [icon]=\"rtl() ? 'arrow.chevron-left' : 'arrow.chevron-right'\"\r\n      class=\"text-2xl\"\r\n    />\r\n  </ng-template>\r\n</p-datepicker>\r\n\r\n<!-- <mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation> -->\r\n" }]
-        }], ctorParameters: () => [], propDecorators: { calendar: [{
-                type: ViewChild,
-                args: ['calendar', { static: true }]
-            }], field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], showClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClear", required: false }] }], showTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTime", required: false }] }], pInputs: [{ type: i0.Input, args: [{ isSignal: true, alias: "pInputs", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], styleClass: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { DateField };
-//# sourceMappingURL=masterteam-components-date-field.mjs.map

package/fesm2022/masterteam-components-date-field.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"masterteam-components-date-field.mjs","sources":["../../../../packages/masterteam/components/date-field/date-field.ts","../../../../packages/masterteam/components/date-field/date-field.html","../../../../packages/masterteam/components/date-field/masterteam-components-date-field.ts"],"sourcesContent":["import {\r\n  Component,\r\n  HostBinding,\r\n  OnChanges,\r\n  OnInit,\r\n  SimpleChanges,\r\n  ViewChild,\r\n  signal,\r\n  input,\r\n  inject,\r\n  ChangeDetectionStrategy,\r\n  effect,\r\n} from '@angular/core';\r\nimport {\r\n  ControlValueAccessor,\r\n  FormsModule,\r\n  NgControl,\r\n  Validators,\r\n} from '@angular/forms';\r\nimport { DatePickerModule, DatePicker } from 'primeng/datepicker';\r\nimport { isInvalid } from '@masterteam/components';\r\nimport { Icon } from '@masterteam/icons';\r\n\r\n@Component({\r\n  selector: 'mt-date-field',\r\n  standalone: true,\r\n  imports: [FormsModule, DatePickerModule, Icon],\r\n  templateUrl: './date-field.html',\r\n  styleUrls: ['./date-field.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  host: {\r\n    class: 'grid gap-1',\r\n  },\r\n})\r\nexport class DateField implements ControlValueAccessor, OnInit, OnChanges {\r\n  @ViewChild('calendar', { static: true })\r\n  calendar: DatePicker;\r\n\r\n  readonly field = input<boolean>(true);\r\n  readonly label = input<string>();\r\n  readonly placeholder = input<string>();\r\n  readonly class = input<string>('');\r\n  readonly readonly = input<boolean>(false);\r\n  readonly showIcon = input<boolean>(true);\r\n  readonly showClear = input<boolean>(false);\r\n  readonly showTime = input<boolean>(false);\r\n  readonly pInputs = input<Partial<DatePicker>>();\r\n  readonly required = input<boolean>(false);\r\n\r\n  rtl = signal<boolean>(document.documentElement.dir === 'rtl');\r\n\r\n  @HostBinding('class') styleClass: string;\r\n\r\n  requiredValidator = Validators.required;\r\n  value = signal<string | null>(null);\r\n  disabled = signal<boolean>(false);\r\n\r\n  onTouched: () => void = () => {};\r\n  onModelChange: (value: string) => void = () => {};\r\n\r\n  public ngControl = inject(NgControl, { self: true });\r\n\r\n  isInvalid = isInvalid;\r\n\r\n  constructor() {\r\n    if (this.ngControl) {\r\n      this.ngControl.valueAccessor = this;\r\n    }\r\n    effect(() => {\r\n      if (this.ngControl.control && this.required()) {\r\n        this.ngControl.control.addValidators(Validators.required);\r\n        this.ngControl.control.updateValueAndValidity();\r\n      }\r\n    });\r\n  }\r\n\r\n  applyInputsToCalendar() {\r\n    Object.assign(this.calendar, this.pInputs());\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.styleClass = this.class();\r\n    if (this.pInputs()) {\r\n      this.applyInputsToCalendar();\r\n    }\r\n  }\r\n  onValueChange(value: string) {\r\n    this.onModelChange(value);\r\n    this.value.set(value);\r\n  }\r\n  ngOnChanges(changes: SimpleChanges) {\r\n    if (changes['pInputs']) {\r\n      this.applyInputsToCalendar();\r\n    }\r\n  }\r\n\r\n  writeValue(value: string) {\r\n    this.value.set(value);\r\n  }\r\n\r\n  registerOnChange(fn: any) {\r\n    this.onModelChange = fn;\r\n  }\r\n\r\n  registerOnTouched(fn: any) {\r\n    this.onTouched = fn;\r\n  }\r\n\r\n  setDisabledState(disabled: boolean) {\r\n    this.disabled.set(disabled);\r\n  }\r\n}\r\n","@if (label()) {\r\n  <label\r\n    [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n    [for]=\"ngControl?.name || label()\"\r\n    >{{ label() }}</label\r\n  >\r\n}\r\n<p-datepicker\r\n  #calendar\r\n  [ngModel]=\"value()\"\r\n  (ngModelChange)=\"onValueChange($event)\"\r\n  (onBlur)=\"onTouched()\"\r\n  [disabled]=\"disabled() || readonly()\"\r\n  [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\r\n  [invalid]=\"isInvalid(ngControl?.control)\"\r\n  [baseZIndex]=\"1051\"\r\n  placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\r\n  inputStyleClass=\"w-full\"\r\n  [showIcon]=\"showIcon()\"\r\n  [showClear]=\"showClear()\"\r\n  [showTime]=\"showTime()\"\r\n  dateFormat=\"dd/mm/yy\"\r\n  appendTo=\"body\"\r\n>\r\n  <ng-template #previousicon>\r\n    <mt-icon\r\n      [icon]=\"rtl() ? 'arrow.chevron-right' : 'arrow.chevron-left'\"\r\n      class=\"text-2xl\"\r\n    />\r\n  </ng-template>\r\n  <ng-template #nexticon>\r\n    <mt-icon\r\n      [icon]=\"rtl() ? 'arrow.chevron-left' : 'arrow.chevron-right'\"\r\n      class=\"text-2xl\"\r\n    />\r\n  </ng-template>\r\n</p-datepicker>\r\n\r\n<!-- <mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation> -->\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/masterteam-components-drawer.mjs

@@ -1,69 +0,0 @@
-import { Button } from '@masterteam/components/button';
-import * as i0 from '@angular/core';
-import { inject, model, output, input, computed, Component } from '@angular/core';
-import { DOCUMENT, CommonModule } from '@angular/common';
-import * as i1 from 'primeng/drawer';
-import { DrawerModule } from 'primeng/drawer';
-import * as i2 from 'primeng/skeleton';
-import { SkeletonModule } from 'primeng/skeleton';
-
-class Drawer {
-    doc = inject(DOCUMENT);
-    visible = model(false, ...(ngDevMode ? [{ debugName: "visible" }] : []));
-    visibleChange = output();
-    onShow = output();
-    onHide = output();
-    position = input('right', ...(ngDevMode ? [{ debugName: "position" }] : []));
-    fullScreen = input(false, ...(ngDevMode ? [{ debugName: "fullScreen" }] : []));
-    closeOnEscape = input(false, ...(ngDevMode ? [{ debugName: "closeOnEscape" }] : []));
-    blockScroll = input(true, ...(ngDevMode ? [{ debugName: "blockScroll" }] : []));
-    dismissible = input(true, ...(ngDevMode ? [{ debugName: "dismissible" }] : []));
-    title = input('', ...(ngDevMode ? [{ debugName: "title" }] : []));
-    subtitle = input('', ...(ngDevMode ? [{ debugName: "subtitle" }] : []));
-    loadingHeader = input(false, ...(ngDevMode ? [{ debugName: "loadingHeader" }] : []));
-    styleClass = input('', ...(ngDevMode ? [{ debugName: "styleClass" }] : []));
-    transitionOptions = input('200ms cubic-bezier(0, 0, 1, 1)', ...(ngDevMode ? [{ debugName: "transitionOptions" }] : []));
-    appendTo = input('self', ...(ngDevMode ? [{ debugName: "appendTo" }] : []));
-    modal = input(true, ...(ngDevMode ? [{ debugName: "modal" }] : []));
-    resolvedAppendTo = computed(() => {
-        this.visible();
-        const appendTo = this.appendTo();
-        if (!appendTo || appendTo === 'self' || appendTo === 'body') {
-            return appendTo || 'self';
-        }
-        if (typeof appendTo !== 'string') {
-            return appendTo;
-        }
-        const selector = appendTo.startsWith('#') || appendTo.startsWith('.')
-            ? appendTo
-            : `#${appendTo}`;
-        return this.doc.querySelector(selector) ?? 'self';
-    }, ...(ngDevMode ? [{ debugName: "resolvedAppendTo" }] : []));
-    visibleChangeEvent(event) {
-        this.visibleChange.emit(event);
-    }
-    onClose() {
-        this.visible.set(false);
-        this.visibleChange.emit(false);
-        this.onHide.emit(true);
-    }
-    onShowEvent() {
-        this.onShow.emit(true);
-    }
-    onHideEvent() {
-        this.onHide.emit(true);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Drawer, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: Drawer, isStandalone: true, selector: "mt-drawer", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, fullScreen: { classPropertyName: "fullScreen", publicName: "fullScreen", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, blockScroll: { classPropertyName: "blockScroll", publicName: "blockScroll", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, loadingHeader: { classPropertyName: "loadingHeader", publicName: "loadingHeader", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, transitionOptions: { classPropertyName: "transitionOptions", publicName: "transitionOptions", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", visibleChange: "visibleChange", onShow: "onShow", onHide: "onHide" }, ngImport: i0, template: "<p-drawer\n  [(visible)]=\"visible\"\n  [position]=\"position()\"\n  [fullScreen]=\"fullScreen()\"\n  [modal]=\"modal()\"\n  [closable]=\"false\"\r\n  [closeOnEscape]=\"closeOnEscape()\"\r\n  [blockScroll]=\"blockScroll()\"\r\n  [dismissible]=\"dismissible()\"\r\n  [appendTo]=\"resolvedAppendTo()\"\r\n  [transitionOptions]=\"transitionOptions()\"\r\n  [styleClass]=\"styleClass() + ' mt-custom-drawer'\"\r\n  (visibleChange)=\"visibleChangeEvent($event)\"\r\n  (onShow)=\"onShowEvent()\"\r\n  (onHide)=\"onHideEvent()\"\r\n>\r\n  <ng-template #header>\r\n    <div\r\n      class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\r\n    >\r\n      @if (loadingHeader()) {\r\n        <div class=\"flex flex-1 flex-col gap-2\">\r\n          <p-skeleton width=\"12rem\" height=\"1.75rem\" borderRadius=\"0.5rem\" />\r\n          <p-skeleton width=\"8rem\" height=\"0.875rem\" borderRadius=\"0.5rem\" />\r\n        </div>\r\n      } @else {\r\n        <div class=\"flex flex-1 flex-col\">\r\n          <h3 class=\"text-xl font-semibold\" [innerHTML]=\"title()\"></h3>\r\n          @if (subtitle()) {\r\n            <p class=\"text-sm text-surface-500\" [innerHTML]=\"subtitle()\"></p>\r\n          }\r\n        </div>\r\n      }\r\n      <mt-button\r\n        (onClick)=\"onClose()\"\r\n        variant=\"outlined\"\r\n        styleClass=\"!bg-white\"\r\n        icon=\"general.x-close\"\r\n        severity=\"secondary\"\r\n      >\r\n      </mt-button>\r\n    </div>\r\n  </ng-template>\r\n\r\n  <ng-content select=\"[content]\"></ng-content>\r\n\r\n  <ng-template #footer>\r\n    <div class=\"flex justify-end p-3 gap-2 border-t border-surface-200\">\r\n      <ng-content select=\"[footer]\"></ng-content>\r\n    </div>\r\n  </ng-template>\r\n</p-drawer>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i1.Drawer, selector: "p-drawer", inputs: ["appendTo", "motionOptions", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Drawer, decorators: [{
-            type: Component,
-            args: [{ selector: 'mt-drawer', standalone: true, imports: [CommonModule, DrawerModule, SkeletonModule, Button], template: "<p-drawer\n  [(visible)]=\"visible\"\n  [position]=\"position()\"\n  [fullScreen]=\"fullScreen()\"\n  [modal]=\"modal()\"\n  [closable]=\"false\"\r\n  [closeOnEscape]=\"closeOnEscape()\"\r\n  [blockScroll]=\"blockScroll()\"\r\n  [dismissible]=\"dismissible()\"\r\n  [appendTo]=\"resolvedAppendTo()\"\r\n  [transitionOptions]=\"transitionOptions()\"\r\n  [styleClass]=\"styleClass() + ' mt-custom-drawer'\"\r\n  (visibleChange)=\"visibleChangeEvent($event)\"\r\n  (onShow)=\"onShowEvent()\"\r\n  (onHide)=\"onHideEvent()\"\r\n>\r\n  <ng-template #header>\r\n    <div\r\n      class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\r\n    >\r\n      @if (loadingHeader()) {\r\n        <div class=\"flex flex-1 flex-col gap-2\">\r\n          <p-skeleton width=\"12rem\" height=\"1.75rem\" borderRadius=\"0.5rem\" />\r\n          <p-skeleton width=\"8rem\" height=\"0.875rem\" borderRadius=\"0.5rem\" />\r\n        </div>\r\n      } @else {\r\n        <div class=\"flex flex-1 flex-col\">\r\n          <h3 class=\"text-xl font-semibold\" [innerHTML]=\"title()\"></h3>\r\n          @if (subtitle()) {\r\n            <p class=\"text-sm text-surface-500\" [innerHTML]=\"subtitle()\"></p>\r\n          }\r\n        </div>\r\n      }\r\n      <mt-button\r\n        (onClick)=\"onClose()\"\r\n        variant=\"outlined\"\r\n        styleClass=\"!bg-white\"\r\n        icon=\"general.x-close\"\r\n        severity=\"secondary\"\r\n      >\r\n      </mt-button>\r\n    </div>\r\n  </ng-template>\r\n\r\n  <ng-content select=\"[content]\"></ng-content>\r\n\r\n  <ng-template #footer>\r\n    <div class=\"flex justify-end p-3 gap-2 border-t border-surface-200\">\r\n      <ng-content select=\"[footer]\"></ng-content>\r\n    </div>\r\n  </ng-template>\r\n</p-drawer>\r\n" }]
-        }], propDecorators: { visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }, { type: i0.Output, args: ["visibleChange"] }], visibleChange: [{ type: i0.Output, args: ["visibleChange"] }], onShow: [{ type: i0.Output, args: ["onShow"] }], onHide: [{ type: i0.Output, args: ["onHide"] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], fullScreen: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullScreen", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], blockScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "blockScroll", required: false }] }], dismissible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissible", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], loadingHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingHeader", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], transitionOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "transitionOptions", required: false }] }], appendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendTo", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { Drawer };
-//# sourceMappingURL=masterteam-components-drawer.mjs.map

package/fesm2022/masterteam-components-drawer.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"masterteam-components-drawer.mjs","sources":["../../../../packages/masterteam/components/drawer/drawer.ts","../../../../packages/masterteam/components/drawer/drawer.html","../../../../packages/masterteam/components/drawer/masterteam-components-drawer.ts"],"sourcesContent":["import { Button } from '@masterteam/components/button';\r\nimport {\r\n  Component,\r\n  computed,\r\n  inject,\r\n  input,\r\n  output,\r\n  model,\r\n} from '@angular/core';\r\nimport { CommonModule, DOCUMENT } from '@angular/common';\r\nimport { DrawerModule } from 'primeng/drawer';\r\nimport { SkeletonModule } from 'primeng/skeleton';\r\n\r\n@Component({\r\n  selector: 'mt-drawer',\r\n  standalone: true,\r\n  imports: [CommonModule, DrawerModule, SkeletonModule, Button],\r\n  templateUrl: './drawer.html',\r\n  styleUrls: ['./drawer.scss'],\r\n})\r\nexport class Drawer {\r\n  private readonly doc = inject(DOCUMENT);\r\n  visible = model<boolean>(false);\r\n  visibleChange = output<boolean>();\r\n  onShow = output<boolean>();\r\n  onHide = output<boolean>();\r\n  position = input<'left' | 'right' | 'top' | 'bottom'>('right');\r\n  fullScreen = input<boolean>(false);\r\n  closeOnEscape = input<boolean>(false);\r\n  blockScroll = input<boolean>(true);\r\n  dismissible = input<boolean>(true);\r\n  title = input<string>('');\r\n  subtitle = input<string>('');\r\n  loadingHeader = input<boolean>(false);\r\n  styleClass = input<string>('');\r\n  transitionOptions = input<string>('200ms cubic-bezier(0, 0, 1, 1)');\r\n  appendTo = input<string | HTMLElement>('self');\r\n  modal = input<boolean>(true);\r\n  protected readonly resolvedAppendTo = computed(() => {\r\n    this.visible();\r\n\r\n    const appendTo = this.appendTo();\r\n\r\n    if (!appendTo || appendTo === 'self' || appendTo === 'body') {\r\n      return appendTo || 'self';\r\n    }\r\n\r\n    if (typeof appendTo !== 'string') {\r\n      return appendTo;\r\n    }\r\n\r\n    const selector =\r\n      appendTo.startsWith('#') || appendTo.startsWith('.')\r\n        ? appendTo\r\n        : `#${appendTo}`;\r\n\r\n    return (this.doc.querySelector(selector) as HTMLElement | null) ?? 'self';\r\n  });\r\n\r\n  visibleChangeEvent(event: boolean) {\r\n    this.visibleChange.emit(event);\r\n  }\r\n\r\n  onClose() {\r\n    this.visible.set(false);\r\n    this.visibleChange.emit(false);\r\n    this.onHide.emit(true);\r\n  }\r\n  onShowEvent() {\r\n    this.onShow.emit(true);\r\n  }\r\n  onHideEvent() {\r\n    this.onHide.emit(true);\r\n  }\r\n}\r\n","<p-drawer\n  [(visible)]=\"visible\"\n  [position]=\"position()\"\n  [fullScreen]=\"fullScreen()\"\n  [modal]=\"modal()\"\n  [closable]=\"false\"\r\n  [closeOnEscape]=\"closeOnEscape()\"\r\n  [blockScroll]=\"blockScroll()\"\r\n  [dismissible]=\"dismissible()\"\r\n  [appendTo]=\"resolvedAppendTo()\"\r\n  [transitionOptions]=\"transitionOptions()\"\r\n  [styleClass]=\"styleClass() + ' mt-custom-drawer'\"\r\n  (visibleChange)=\"visibleChangeEvent($event)\"\r\n  (onShow)=\"onShowEvent()\"\r\n  (onHide)=\"onHideEvent()\"\r\n>\r\n  <ng-template #header>\r\n    <div\r\n      class=\"flex items-center justify-between px-5 w-full py-3 border-b border-surface\"\r\n    >\r\n      @if (loadingHeader()) {\r\n        <div class=\"flex flex-1 flex-col gap-2\">\r\n          <p-skeleton width=\"12rem\" height=\"1.75rem\" borderRadius=\"0.5rem\" />\r\n          <p-skeleton width=\"8rem\" height=\"0.875rem\" borderRadius=\"0.5rem\" />\r\n        </div>\r\n      } @else {\r\n        <div class=\"flex flex-1 flex-col\">\r\n          <h3 class=\"text-xl font-semibold\" [innerHTML]=\"title()\"></h3>\r\n          @if (subtitle()) {\r\n            <p class=\"text-sm text-surface-500\" [innerHTML]=\"subtitle()\"></p>\r\n          }\r\n        </div>\r\n      }\r\n      <mt-button\r\n        (onClick)=\"onClose()\"\r\n        variant=\"outlined\"\r\n        styleClass=\"!bg-white\"\r\n        icon=\"general.x-close\"\r\n        severity=\"secondary\"\r\n      >\r\n      </mt-button>\r\n    </div>\r\n  </ng-template>\r\n\r\n  <ng-content select=\"[content]\"></ng-content>\r\n\r\n  <ng-template #footer>\r\n    <div class=\"flex justify-end p-3 gap-2 border-t border-surface-200\">\r\n      <ng-content select=\"[footer]\"></ng-content>\r\n    </div>\r\n  </ng-template>\r\n</p-drawer>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}