iss-ctrl 0.0.21 → 0.0.23

package/fesm2022/iss-ctrl-input.field-BiwBFYx3.mjs

@@ -0,0 +1,104 @@
+import * as i0 from '@angular/core';
+import { Component } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { ReactiveFormsModule } from '@angular/forms';
+import { F as FieldBase, V as VIEW_PROVIDER, a as ValidationMessage, b as FieldViewer } from './iss-ctrl-iss-ctrl-BG-QWWdq.mjs';
+import { InputControl } from 'iss-ctrl/input';
+import { InputViewer } from './iss-ctrl-input.viewer-BOZnW0_e.mjs';
+
+/**
+ * `<iss-field-input>` — single line text, number, email or password entry.
+ *
+ * Rendered by the outlet for fields of type `text_input`. In `edit` mode it renders
+ * {@link InputControl} plus the validation message; in `view` mode the matching viewer.
+ *
+ * ### Supported `config` keys
+ * | Key | Type | Description |
+ * | --- | --- | --- |
+ * | `type` | `string` | Native input type — `text`, `number`, `email`, `password`, … |
+ * | `placeholder` | `string` | Placeholder shown while empty. |
+ * | `min` | `number` | Minimum numeric value. |
+ * | `max` | `number` | Maximum numeric value. |
+ * | `minLength` | `number` | Minimum number of characters. |
+ * | `maxLength` | `number` | Maximum number of characters. |
+ * | `readonly` | `boolean` | Shows the value but blocks interaction. |
+ *
+ * ### Other field members used
+ * `label()`
+ *
+ * Every field also honours `visible`, `mode`, `validation`, `asyncValidation` and
+ * `events` — see {@link IssField} for the full model and {@link FieldConfig} for all keys.
+ *
+ * @example
+ * ```json
+ * { "name": "email", "type": "text_input", "label": "Email", "config": { "type": "email", "maxLength": 120 } }
+ * ```
+ */
+class InputField extends FieldBase {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputField, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: InputField, isStandalone: true, selector: "iss-field-input", usesInheritance: true, ngImport: i0, template: `
+    @if (field.visible()) {
+      @if (field.mode() === "edit") {
+        <iss-ctrl-input
+          [formControlName]="field.name"
+          [type]="field.config.type() ?? ''"
+          [placeholder]="field.config.placeholder() ?? ''"
+          [min]="field.config.min() ?? null"
+          [max]="field.config.max() ?? null"
+          [readonly]="field.config.readonly() ?? false"
+          [minLength]="field.config.minLength() ?? null"
+          [maxLength]="field.config.maxLength() ?? null"
+        >
+          <label>{{ field.label() }}</label>
+        </iss-ctrl-input>
+        <iss-validation-message-viewer [errors]="ctrl.errors" [showMessage]="!ctrl.untouched"/>
+      } @else {
+        <iss-field-viewer>
+          <label>{{ field.label() }}</label>
+          <iss-viewer-input [field]="field"/>
+        </iss-field-viewer>
+      }
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: InputControl, selector: "iss-ctrl-input", inputs: ["type", "prefixIcon", "prefixText", "suffixIcon", "suffixText"], outputs: ["onPrefixClick", "onSuffixClick"] }, { kind: "component", type: ValidationMessage, selector: "iss-validation-message-viewer", inputs: ["errors", "showMessage"] }, { kind: "component", type: InputViewer, selector: "iss-viewer-input" }, { kind: "component", type: FieldViewer, selector: "iss-field-viewer" }], viewProviders: [VIEW_PROVIDER] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputField, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "iss-field-input",
+                    viewProviders: [VIEW_PROVIDER],
+                    imports: [
+                        ReactiveFormsModule,
+                        InputControl,
+                        ValidationMessage,
+                        InputViewer,
+                        FieldViewer
+                    ],
+                    template: `
+    @if (field.visible()) {
+      @if (field.mode() === "edit") {
+        <iss-ctrl-input
+          [formControlName]="field.name"
+          [type]="field.config.type() ?? ''"
+          [placeholder]="field.config.placeholder() ?? ''"
+          [min]="field.config.min() ?? null"
+          [max]="field.config.max() ?? null"
+          [readonly]="field.config.readonly() ?? false"
+          [minLength]="field.config.minLength() ?? null"
+          [maxLength]="field.config.maxLength() ?? null"
+        >
+          <label>{{ field.label() }}</label>
+        </iss-ctrl-input>
+        <iss-validation-message-viewer [errors]="ctrl.errors" [showMessage]="!ctrl.untouched"/>
+      } @else {
+        <iss-field-viewer>
+          <label>{{ field.label() }}</label>
+          <iss-viewer-input [field]="field"/>
+        </iss-field-viewer>
+      }
+    }
+  `
+                }]
+        }] });
+
+export { InputField };
+//# sourceMappingURL=iss-ctrl-input.field-BiwBFYx3.mjs.map

package/fesm2022/iss-ctrl-input.field-BiwBFYx3.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"iss-ctrl-input.field-BiwBFYx3.mjs","sources":["../../../projects/iss/src/components/controls/input/input.field.ts"],"sourcesContent":["import { Component } from \"@angular/core\";\nimport { ReactiveFormsModule } from \"@angular/forms\";\nimport { VIEW_PROVIDER } from \"../../../shared/constants/view-provider.const\";\nimport { ValidationMessage } from \"../../shared/validation-message\";\nimport { FieldBase } from \"../base/field-base\";\nimport { InputControl } from \"iss-ctrl/input\";\nimport { InputViewer } from \"./input.viewer\";\nimport { FieldViewer } from \"../../shared/field-viewer\";\n\n/**\n * `<iss-field-input>` — single line text, number, email or password entry.\n *\n * Rendered by the outlet for fields of type `text_input`. In `edit` mode it renders\n * {@link InputControl} plus the validation message; in `view` mode the matching viewer.\n *\n * ### Supported `config` keys\n * | Key | Type | Description |\n * | --- | --- | --- |\n * | `type` | `string` | Native input type — `text`, `number`, `email`, `password`, … |\n * | `placeholder` | `string` | Placeholder shown while empty. |\n * | `min` | `number` | Minimum numeric value. |\n * | `max` | `number` | Maximum numeric value. |\n * | `minLength` | `number` | Minimum number of characters. |\n * | `maxLength` | `number` | Maximum number of characters. |\n * | `readonly` | `boolean` | Shows the value but blocks interaction. |\n *\n * ### Other field members used\n * `label()`\n *\n * Every field also honours `visible`, `mode`, `validation`, `asyncValidation` and\n * `events` — see {@link IssField} for the full model and {@link FieldConfig} for all keys.\n *\n * @example\n * ```json\n * { \"name\": \"email\", \"type\": \"text_input\", \"label\": \"Email\", \"config\": { \"type\": \"email\", \"maxLength\": 120 } }\n * ```\n */\n@Component({\n  selector: \"iss-field-input\",\n  viewProviders: [VIEW_PROVIDER],\n  imports: [\n    ReactiveFormsModule,\n    InputControl,\n    ValidationMessage,\n    InputViewer,\n    FieldViewer\n  ],\n  template: `\n    @if (field.visible()) {\n      @if (field.mode() === \"edit\") {\n        <iss-ctrl-input\n          [formControlName]=\"field.name\"\n          [type]=\"field.config.type() ?? ''\"\n          [placeholder]=\"field.config.placeholder() ?? ''\"\n          [min]=\"field.config.min() ?? null\"\n          [max]=\"field.config.max() ?? null\"\n          [readonly]=\"field.config.readonly() ?? false\"\n          [minLength]=\"field.config.minLength() ?? null\"\n          [maxLength]=\"field.config.maxLength() ?? null\"\n        >\n          <label>{{ field.label() }}</label>\n        </iss-ctrl-input>\n        <iss-validation-message-viewer [errors]=\"ctrl.errors\" [showMessage]=\"!ctrl.untouched\"/>\n      } @else {\n        <iss-field-viewer>\n          <label>{{ field.label() }}</label>\n          <iss-viewer-input [field]=\"field\"/>\n        </iss-field-viewer>\n      }\n    }\n  `\n})\nexport class InputField extends FieldBase {}\n"],"names":[],"mappings":";;;;;;;;AASA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BG;AAoCG,MAAO,UAAW,SAAQ,SAAS,CAAA;uGAA5B,UAAU,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAV,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAU,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAzBX;;;;;;;;;;;;;;;;;;;;;;;AAuBT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EA7BC,mBAAmB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,YAAY,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,YAAA,EAAA,YAAA,EAAA,YAAA,EAAA,YAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACZ,iBAAiB,EAAA,QAAA,EAAA,+BAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACjB,WAAW,EAAA,QAAA,EAAA,kBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACX,WAAW,EAAA,QAAA,EAAA,kBAAA,EAAA,CAAA,EAAA,aAAA,EANE,CAAC,aAAa,CAAC,EAAA,CAAA;;2FAiCnB,UAAU,EAAA,UAAA,EAAA,CAAA;kBAnCtB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,iBAAiB;oBAC3B,aAAa,EAAE,CAAC,aAAa,CAAC;AAC9B,oBAAA,OAAO,EAAE;wBACP,mBAAmB;wBACnB,YAAY;wBACZ,iBAAiB;wBACjB,WAAW;wBACX;AACD,qBAAA;AACD,oBAAA,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;;;AAuBT,EAAA;AACF,iBAAA;;;;;"}

package/fesm2022/iss-ctrl-input.mjs

@@ -0,0 +1,204 @@
+import * as i0 from '@angular/core';
+import { input, output, effect, ChangeDetectionStrategy, CUSTOM_ELEMENTS_SCHEMA, Component } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { ReactiveFormsModule, NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
+import * as i2 from '@angular/material/form-field';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInput, MatInputModule } from '@angular/material/input';
+import { ControlBase, Hints } from 'iss-ctrl/base';
+
+/**
+ * `<iss-ctrl-input>` — single line text input, the base for every scalar text field.
+ *
+ * `type` is forwarded to the native input, so `number`, `email` and `password` variants all
+ * come from this one control.
+ *
+ * @example
+ * ```html
+ * <iss-ctrl-input formControlName="amount" type="number" [min]="0" suffixText="SAR">
+ *   <label>Amount</label>
+ * </iss-ctrl-input>
+ * ```
+ *
+ * ### Own inputs
+ * | Property | Type | Default | Description |
+ * | --- | --- | --- | --- |
+ * | `type` | `string` | `"text"` | Native input type: `text`, `number`, `email`, `password`, … |
+ * | `prefixIcon` | `string` | `""` | Icon rendered before the value. |
+ * | `prefixText` | `string` | `""` | Text rendered before the value. |
+ * | `suffixIcon` | `string` | `""` | Icon rendered after the value. |
+ * | `suffixText` | `string` | `""` | Text rendered after the value. |
+ *
+ * ### Inherited from {@link ControlBase}
+ * `formControlName` · `readonly` · `className` · `(onChange)` · `placeholder` · `min` · `max` · `minLength` · `maxLength` · `hints`
+ *
+ * ### Outputs
+ * - `(onPrefixClick)` — `string`, the prefix affix was clicked.
+ * - `(onSuffixClick)` — `string`, the suffix affix was clicked.
+ *
+ * Projects `<label>` into the floating label; omit it to render the control without one.
+ *
+ * Also projects `[issPrefix]` and `[issSuffix]` for fully custom affixes.
+ */
+class InputControl extends ControlBase {
+    /**
+     * Native input type — `text`, `number`, `email`, `password`, and so on.
+     */
+    type = input("text", ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    /**
+     * Icon name rendered before the value.
+     */
+    prefixIcon = input("", ...(ngDevMode ? [{ debugName: "prefixIcon" }] : /* istanbul ignore next */ []));
+    /**
+     * Static text rendered before the value.
+     */
+    prefixText = input("", ...(ngDevMode ? [{ debugName: "prefixText" }] : /* istanbul ignore next */ []));
+    /**
+     * Icon name rendered after the value.
+     */
+    suffixIcon = input("", ...(ngDevMode ? [{ debugName: "suffixIcon" }] : /* istanbul ignore next */ []));
+    /**
+     * Static text rendered after the value, a unit or currency for example.
+     */
+    suffixText = input("", ...(ngDevMode ? [{ debugName: "suffixText" }] : /* istanbul ignore next */ []));
+    /**
+     * Emits when the prefix affix is clicked.
+     */
+    onPrefixClick = output();
+    /**
+     * Emits when the suffix affix is clicked.
+     */
+    onSuffixClick = output();
+    #disabledEffect = effect(() => {
+        if (this.disabled()) {
+            this.ctrl.disable();
+        }
+        else {
+            this.ctrl.enable();
+        }
+    }, ...(ngDevMode ? [{ debugName: "#disabledEffect" }] : /* istanbul ignore next */ []));
+    emitSuffixClick() {
+        this.onSuffixClick.emit(this.ctrl.getRawValue());
+    }
+    emitPrefixClick() {
+        this.onPrefixClick.emit(this.ctrl.getRawValue());
+    }
+    ngOnDestroy() {
+        this.#disabledEffect.destroy();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputControl, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: InputControl, isStandalone: true, selector: "iss-ctrl-input", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, prefixIcon: { classPropertyName: "prefixIcon", publicName: "prefixIcon", isSignal: true, isRequired: false, transformFunction: null }, prefixText: { classPropertyName: "prefixText", publicName: "prefixText", isSignal: true, isRequired: false, transformFunction: null }, suffixIcon: { classPropertyName: "suffixIcon", publicName: "suffixIcon", isSignal: true, isRequired: false, transformFunction: null }, suffixText: { classPropertyName: "suffixText", publicName: "suffixText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onPrefixClick: "onPrefixClick", onSuffixClick: "onSuffixClick" }, providers: [
+            { provide: NG_VALUE_ACCESSOR, useExisting: InputControl, multi: true },
+            { provide: NG_VALIDATORS, useExisting: InputControl, multi: true }
+        ], usesInheritance: true, ngImport: i0, template: `
+    <mat-form-field floatLabel="auto" class="">
+      <!-- Always rendered: upgrade.scss shows the floating label only while the projected <label> carries text, so an omitted or empty one collapses on its own. -->
+      <mat-label class="fs-16 fc-dark-gray">
+        <ng-content select="label"></ng-content>
+      </mat-label>
+      <ng-content select="[issPrefix]"></ng-content>
+      <div (click)="emitPrefixClick()" class="cursor-pointer">
+        @if (prefixText()) {
+          <span matTextPrefix>{{ prefixText() }}</span>
+        }
+        @if (prefixIcon()) {
+          <ds-icon matPrefix icon="{{prefixIcon()}}"></ds-icon>
+        }
+      </div>
+      <input
+        matInput
+        [errorStateMatcher]="errorStateMatcher"
+        (blur)="markAsTouched()"
+        (input)="emitValue()"
+        [formControl]="ctrl"
+        [attr.maxlength]="maxLength()"
+        [attr.minlength]="minLength()"
+        [attr.max]="max()"
+        [attr.min]="min()"
+        [placeholder]="placeholder()"
+        [readonly]="readonly()"
+        [type]="type()"
+      />
+      <ng-content select="[issSuffix]"></ng-content>
+      <div (click)="emitSuffixClick()" class="cursor-pointer">
+        @if (suffixText()) {
+          <span matTextSuffix>{{ suffixText() }}</span>
+        }
+        @if (suffixIcon()) {
+          <ds-icon matSuffix icon="{{suffixIcon()}}"></ds-icon>
+        }
+      </div>
+      <iss-ctrl-hints [hints]="hints()" [touched]="touched()"/>
+    </mat-form-field>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: Hints, selector: "iss-ctrl-hints", inputs: ["hints", "touched"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatInputModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputControl, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "iss-ctrl-input",
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [
+                        ReactiveFormsModule,
+                        MatFormFieldModule,
+                        Hints,
+                        MatInput,
+                        MatInputModule,
+                    ],
+                    providers: [
+                        { provide: NG_VALUE_ACCESSOR, useExisting: InputControl, multi: true },
+                        { provide: NG_VALIDATORS, useExisting: InputControl, multi: true }
+                    ],
+                    template: `
+    <mat-form-field floatLabel="auto" class="">
+      <!-- Always rendered: upgrade.scss shows the floating label only while the projected <label> carries text, so an omitted or empty one collapses on its own. -->
+      <mat-label class="fs-16 fc-dark-gray">
+        <ng-content select="label"></ng-content>
+      </mat-label>
+      <ng-content select="[issPrefix]"></ng-content>
+      <div (click)="emitPrefixClick()" class="cursor-pointer">
+        @if (prefixText()) {
+          <span matTextPrefix>{{ prefixText() }}</span>
+        }
+        @if (prefixIcon()) {
+          <ds-icon matPrefix icon="{{prefixIcon()}}"></ds-icon>
+        }
+      </div>
+      <input
+        matInput
+        [errorStateMatcher]="errorStateMatcher"
+        (blur)="markAsTouched()"
+        (input)="emitValue()"
+        [formControl]="ctrl"
+        [attr.maxlength]="maxLength()"
+        [attr.minlength]="minLength()"
+        [attr.max]="max()"
+        [attr.min]="min()"
+        [placeholder]="placeholder()"
+        [readonly]="readonly()"
+        [type]="type()"
+      />
+      <ng-content select="[issSuffix]"></ng-content>
+      <div (click)="emitSuffixClick()" class="cursor-pointer">
+        @if (suffixText()) {
+          <span matTextSuffix>{{ suffixText() }}</span>
+        }
+        @if (suffixIcon()) {
+          <ds-icon matSuffix icon="{{suffixIcon()}}"></ds-icon>
+        }
+      </div>
+      <iss-ctrl-hints [hints]="hints()" [touched]="touched()"/>
+    </mat-form-field>
+  `
+                }]
+        }], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], prefixIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "prefixIcon", required: false }] }], prefixText: [{ type: i0.Input, args: [{ isSignal: true, alias: "prefixText", required: false }] }], suffixIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "suffixIcon", required: false }] }], suffixText: [{ type: i0.Input, args: [{ isSignal: true, alias: "suffixText", required: false }] }], onPrefixClick: [{ type: i0.Output, args: ["onPrefixClick"] }], onSuffixClick: [{ type: i0.Output, args: ["onSuffixClick"] }] } });
+
+// The input control. Its field and viewer stay in the primary entry point and reach it
+// from there, so the control ships only to an app that renders it or imports it directly.
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { InputControl };
+//# sourceMappingURL=iss-ctrl-input.mjs.map

package/fesm2022/iss-ctrl-input.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"iss-ctrl-input.mjs","sources":["../../../projects/iss/input/src/input.control.ts","../../../projects/iss/input/src/public-api.ts","../../../projects/iss/input/src/iss-ctrl-input.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, CUSTOM_ELEMENTS_SCHEMA, effect, EffectRef, input, InputSignal, OnDestroy, output, OutputEmitterRef } from \"@angular/core\";\nimport { NG_VALIDATORS, NG_VALUE_ACCESSOR, ReactiveFormsModule, Validator } from \"@angular/forms\";\nimport { MatFormFieldModule } from \"@angular/material/form-field\";\nimport { MatInput, MatInputModule } from \"@angular/material/input\";\nimport { Hints } from \"iss-ctrl/base\";\nimport { ControlBase } from \"iss-ctrl/base\";\n\n/**\n * `<iss-ctrl-input>` — single line text input, the base for every scalar text field.\n *\n * `type` is forwarded to the native input, so `number`, `email` and `password` variants all\n * come from this one control.\n *\n * @example\n * ```html\n * <iss-ctrl-input formControlName=\"amount\" type=\"number\" [min]=\"0\" suffixText=\"SAR\">\n *   <label>Amount</label>\n * </iss-ctrl-input>\n * ```\n *\n * ### Own inputs\n * | Property | Type | Default | Description |\n * | --- | --- | --- | --- |\n * | `type` | `string` | `\"text\"` | Native input type: `text`, `number`, `email`, `password`, … |\n * | `prefixIcon` | `string` | `\"\"` | Icon rendered before the value. |\n * | `prefixText` | `string` | `\"\"` | Text rendered before the value. |\n * | `suffixIcon` | `string` | `\"\"` | Icon rendered after the value. |\n * | `suffixText` | `string` | `\"\"` | Text rendered after the value. |\n *\n * ### Inherited from {@link ControlBase}\n * `formControlName` · `readonly` · `className` · `(onChange)` · `placeholder` · `min` · `max` · `minLength` · `maxLength` · `hints`\n *\n * ### Outputs\n * - `(onPrefixClick)` — `string`, the prefix affix was clicked.\n * - `(onSuffixClick)` — `string`, the suffix affix was clicked.\n *\n * Projects `<label>` into the floating label; omit it to render the control without one.\n *\n * Also projects `[issPrefix]` and `[issSuffix]` for fully custom affixes.\n */\n@Component({\n  selector: \"iss-ctrl-input\",\n  schemas: [CUSTOM_ELEMENTS_SCHEMA],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    ReactiveFormsModule,\n    MatFormFieldModule,\n    Hints,\n    MatInput,\n    MatInputModule,\n  ],\n  providers: [\n    { provide: NG_VALUE_ACCESSOR, useExisting: InputControl, multi: true },\n    { provide: NG_VALIDATORS, useExisting: InputControl, multi: true }\n  ],\n  template: `\n    <mat-form-field floatLabel=\"auto\" class=\"\">\n      <!-- Always rendered: upgrade.scss shows the floating label only while the projected <label> carries text, so an omitted or empty one collapses on its own. -->\n      <mat-label class=\"fs-16 fc-dark-gray\">\n        <ng-content select=\"label\"></ng-content>\n      </mat-label>\n      <ng-content select=\"[issPrefix]\"></ng-content>\n      <div (click)=\"emitPrefixClick()\" class=\"cursor-pointer\">\n        @if (prefixText()) {\n          <span matTextPrefix>{{ prefixText() }}</span>\n        }\n        @if (prefixIcon()) {\n          <ds-icon matPrefix icon=\"{{prefixIcon()}}\"></ds-icon>\n        }\n      </div>\n      <input\n        matInput\n        [errorStateMatcher]=\"errorStateMatcher\"\n        (blur)=\"markAsTouched()\"\n        (input)=\"emitValue()\"\n        [formControl]=\"ctrl\"\n        [attr.maxlength]=\"maxLength()\"\n        [attr.minlength]=\"minLength()\"\n        [attr.max]=\"max()\"\n        [attr.min]=\"min()\"\n        [placeholder]=\"placeholder()\"\n        [readonly]=\"readonly()\"\n        [type]=\"type()\"\n      />\n      <ng-content select=\"[issSuffix]\"></ng-content>\n      <div (click)=\"emitSuffixClick()\" class=\"cursor-pointer\">\n        @if (suffixText()) {\n          <span matTextSuffix>{{ suffixText() }}</span>\n        }\n        @if (suffixIcon()) {\n          <ds-icon matSuffix icon=\"{{suffixIcon()}}\"></ds-icon>\n        }\n      </div>\n      <iss-ctrl-hints [hints]=\"hints()\" [touched]=\"touched()\"/>\n    </mat-form-field>\n  `\n})\nexport class InputControl extends ControlBase implements Validator, OnDestroy {\n  /**\n   * Native input type — `text`, `number`, `email`, `password`, and so on.\n   */\n  type: InputSignal<string> = input(\"text\");\n  /**\n   * Icon name rendered before the value.\n   */\n  prefixIcon: InputSignal<string> = input(\"\");\n  /**\n   * Static text rendered before the value.\n   */\n  prefixText: InputSignal<string> = input(\"\");\n  /**\n   * Icon name rendered after the value.\n   */\n  suffixIcon: InputSignal<string> = input(\"\");\n  /**\n   * Static text rendered after the value, a unit or currency for example.\n   */\n  suffixText: InputSignal<string> = input(\"\");\n  /**\n   * Emits when the prefix affix is clicked.\n   */\n  onPrefixClick: OutputEmitterRef<string> = output();\n  /**\n   * Emits when the suffix affix is clicked.\n   */\n  onSuffixClick: OutputEmitterRef<string> = output();\n  #disabledEffect: EffectRef = effect(() => {\n    if (this.disabled()) {\n      this.ctrl.disable();\n    } else {\n      this.ctrl.enable();\n    }\n  });\n\n  emitSuffixClick() {\n    this.onSuffixClick.emit(this.ctrl.getRawValue());\n  }\n\n  emitPrefixClick() {\n    this.onPrefixClick.emit(this.ctrl.getRawValue());\n  }\n\n  ngOnDestroy() {\n    this.#disabledEffect.destroy();\n  }\n}\n","// The input control. Its field and viewer stay in the primary entry point and reach it\n// from there, so the control ships only to an app that renders it or imports it directly.\n\nexport * from \"./input.control\";\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/iss-ctrl-input.viewer-BOZnW0_e.mjs

@@ -0,0 +1,22 @@
+import * as i0 from '@angular/core';
+import { Component } from '@angular/core';
+import { ViewerBase } from 'iss-ctrl/base';
+
+class InputViewer extends ViewerBase {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputViewer, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.9", type: InputViewer, isStandalone: true, selector: "iss-viewer-input", usesInheritance: true, ngImport: i0, template: `
+    {{ field().ctrlValue() }}
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: InputViewer, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "iss-viewer-input",
+                    template: `
+    {{ field().ctrlValue() }}
+  `,
+                }]
+        }] });
+
+export { InputViewer };
+//# sourceMappingURL=iss-ctrl-input.viewer-BOZnW0_e.mjs.map

package/fesm2022/iss-ctrl-input.viewer-BOZnW0_e.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"iss-ctrl-input.viewer-BOZnW0_e.mjs","sources":["../../../projects/iss/src/components/controls/input/input.viewer.ts"],"sourcesContent":["import { Component } from \"@angular/core\";\nimport { ViewerBase } from \"iss-ctrl/base\";\n\n@Component({\n  selector: \"iss-viewer-input\",\n  template: `\n    {{ field().ctrlValue() }}\n  `,\n})\nexport class InputViewer extends ViewerBase {}\n"],"names":[],"mappings":";;;;AASM,MAAO,WAAY,SAAQ,UAAU,CAAA;uGAA9B,WAAW,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAX,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAJZ;;AAET,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAEU,WAAW,EAAA,UAAA,EAAA,CAAA;kBANvB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,kBAAkB;AAC5B,oBAAA,QAAQ,EAAE;;AAET,EAAA,CAAA;AACF,iBAAA;;;;;"}