@mesgflow/ui-kit 0.6.0 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +56 -5
- package/fesm2022/mesgflow-ui-kit-accordion.mjs +9 -8
- package/fesm2022/mesgflow-ui-kit-accordion.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-agenda.mjs +208 -0
- package/fesm2022/mesgflow-ui-kit-agenda.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-alert.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-aspect-ratio.mjs +37 -0
- package/fesm2022/mesgflow-ui-kit-aspect-ratio.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-avatar-group.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-avatar.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-badge.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-banner.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-blocks.mjs +207 -0
- package/fesm2022/mesgflow-ui-kit-blocks.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-box-input.mjs +4 -4
- package/fesm2022/mesgflow-ui-kit-box-input.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-brand.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-breadcrumb.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-button-group.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-button.mjs +190 -244
- package/fesm2022/mesgflow-ui-kit-button.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-card.mjs +48 -27
- package/fesm2022/mesgflow-ui-kit-card.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-carousel.mjs +308 -0
- package/fesm2022/mesgflow-ui-kit-carousel.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-chart.mjs +12 -12
- package/fesm2022/mesgflow-ui-kit-checkbox.mjs +18 -23
- package/fesm2022/mesgflow-ui-kit-checkbox.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-chip.mjs +5 -5
- package/fesm2022/mesgflow-ui-kit-chip.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-code-block.mjs +11 -7
- package/fesm2022/mesgflow-ui-kit-code-block.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-collapsible.mjs +9 -9
- package/fesm2022/mesgflow-ui-kit-color-picker.mjs +9 -7
- package/fesm2022/mesgflow-ui-kit-color-picker.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-combobox.mjs +147 -67
- package/fesm2022/mesgflow-ui-kit-combobox.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-command.mjs +15 -16
- package/fesm2022/mesgflow-ui-kit-command.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-context-menu.mjs +7 -9
- package/fesm2022/mesgflow-ui-kit-context-menu.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-copy-button.mjs +6 -6
- package/fesm2022/mesgflow-ui-kit-core.mjs +446 -128
- package/fesm2022/mesgflow-ui-kit-core.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-countdown.mjs +149 -0
- package/fesm2022/mesgflow-ui-kit-countdown.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-date-picker.mjs +140 -19
- package/fesm2022/mesgflow-ui-kit-date-picker.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-description-list.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-dialog.mjs +310 -64
- package/fesm2022/mesgflow-ui-kit-dialog.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-divider.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-drawer.mjs +109 -0
- package/fesm2022/mesgflow-ui-kit-drawer.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-dropzone.mjs +6 -6
- package/fesm2022/mesgflow-ui-kit-dropzone.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-empty-state.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-field.mjs +55 -14
- package/fesm2022/mesgflow-ui-kit-field.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-file-upload.mjs +356 -0
- package/fesm2022/mesgflow-ui-kit-file-upload.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-hover-card.mjs +6 -6
- package/fesm2022/mesgflow-ui-kit-i18n-tr.mjs +135 -0
- package/fesm2022/mesgflow-ui-kit-i18n-tr.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-icon.mjs +8 -3
- package/fesm2022/mesgflow-ui-kit-icon.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-icons-lucide.mjs +371 -0
- package/fesm2022/mesgflow-ui-kit-icons-lucide.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-inline-edit.mjs +279 -0
- package/fesm2022/mesgflow-ui-kit-inline-edit.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-input.mjs +162 -19
- package/fesm2022/mesgflow-ui-kit-input.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-kbd.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-lightbox.mjs +299 -0
- package/fesm2022/mesgflow-ui-kit-lightbox.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-link.mjs +5 -5
- package/fesm2022/mesgflow-ui-kit-link.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-listbox.mjs +151 -0
- package/fesm2022/mesgflow-ui-kit-listbox.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-mention.mjs +283 -0
- package/fesm2022/mesgflow-ui-kit-mention.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-menu.mjs +178 -14
- package/fesm2022/mesgflow-ui-kit-menu.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-nav-menu.mjs +276 -0
- package/fesm2022/mesgflow-ui-kit-nav-menu.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-notification-center.mjs +281 -0
- package/fesm2022/mesgflow-ui-kit-notification-center.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-number-input.mjs +9 -6
- package/fesm2022/mesgflow-ui-kit-number-input.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-otp-input.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-page-header.mjs +6 -6
- package/fesm2022/mesgflow-ui-kit-pagination.mjs +7 -6
- package/fesm2022/mesgflow-ui-kit-pagination.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-password-input.mjs +38 -68
- package/fesm2022/mesgflow-ui-kit-password-input.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-popover.mjs +12 -52
- package/fesm2022/mesgflow-ui-kit-popover.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-progress.mjs +164 -23
- package/fesm2022/mesgflow-ui-kit-progress.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-qr-code.mjs +766 -0
- package/fesm2022/mesgflow-ui-kit-qr-code.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-radio.mjs +10 -12
- package/fesm2022/mesgflow-ui-kit-radio.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-rating.mjs +4 -4
- package/fesm2022/mesgflow-ui-kit-rating.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-scroll-area.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-search-input.mjs +11 -7
- package/fesm2022/mesgflow-ui-kit-search-input.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-segmented-control.mjs +15 -11
- package/fesm2022/mesgflow-ui-kit-segmented-control.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-select.mjs +6 -5
- package/fesm2022/mesgflow-ui-kit-select.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-sidebar.mjs +24 -21
- package/fesm2022/mesgflow-ui-kit-sidebar.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-skeleton.mjs +6 -5
- package/fesm2022/mesgflow-ui-kit-skeleton.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-slider.mjs +253 -6
- package/fesm2022/mesgflow-ui-kit-slider.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-sortable.mjs +526 -0
- package/fesm2022/mesgflow-ui-kit-sortable.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-spinner.mjs +44 -15
- package/fesm2022/mesgflow-ui-kit-spinner.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-split-button.mjs +205 -0
- package/fesm2022/mesgflow-ui-kit-split-button.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-splitter.mjs +213 -6
- package/fesm2022/mesgflow-ui-kit-splitter.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-stat-tile.mjs +13 -6
- package/fesm2022/mesgflow-ui-kit-stat-tile.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-stepper.mjs +171 -64
- package/fesm2022/mesgflow-ui-kit-stepper.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-switch.mjs +4 -4
- package/fesm2022/mesgflow-ui-kit-switch.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-table.mjs +34 -28
- package/fesm2022/mesgflow-ui-kit-table.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-tabs.mjs +421 -180
- package/fesm2022/mesgflow-ui-kit-tabs.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-tag-input.mjs +9 -4
- package/fesm2022/mesgflow-ui-kit-tag-input.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-theme-switcher.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-theming.mjs +7 -7
- package/fesm2022/mesgflow-ui-kit-theming.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-time-picker.mjs +6 -6
- package/fesm2022/mesgflow-ui-kit-time-picker.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-timeline.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-toast.mjs +118 -35
- package/fesm2022/mesgflow-ui-kit-toast.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-toggle.mjs +12 -11
- package/fesm2022/mesgflow-ui-kit-toggle.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-toolbar.mjs +13 -11
- package/fesm2022/mesgflow-ui-kit-toolbar.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-tooltip.mjs +76 -53
- package/fesm2022/mesgflow-ui-kit-tooltip.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-tour.mjs +17 -29
- package/fesm2022/mesgflow-ui-kit-tour.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-transfer-list.mjs +288 -0
- package/fesm2022/mesgflow-ui-kit-transfer-list.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit-tree-select.mjs +3 -3
- package/fesm2022/mesgflow-ui-kit-tree.mjs +4 -4
- package/fesm2022/mesgflow-ui-kit-tree.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-virtual-list.mjs +109 -0
- package/fesm2022/mesgflow-ui-kit-virtual-list.mjs.map +1 -0
- package/fesm2022/mesgflow-ui-kit.mjs +93 -12836
- package/fesm2022/mesgflow-ui-kit.mjs.map +1 -1
- package/package.json +91 -3
- package/schematics/collection.json +10 -0
- package/schematics/migration.json +10 -0
- package/schematics/migrations/v0-7.cjs +70 -0
- package/schematics/ng-add/index.cjs +234 -0
- package/schematics/ng-add/schema.json +43 -0
- package/tokens/color.css +96 -0
- package/tokens/controls.css +145 -0
- package/tokens/elevation.css +62 -6
- package/tokens/motion.css +304 -66
- package/tokens/radius.css +14 -0
- package/tokens.css +1 -0
- package/tokens.json +1583 -0
- package/types/mesgflow-ui-kit-agenda.d.ts +49 -0
- package/types/mesgflow-ui-kit-aspect-ratio.d.ts +18 -0
- package/types/mesgflow-ui-kit-blocks.d.ts +128 -0
- package/types/mesgflow-ui-kit-button.d.ts +23 -38
- package/types/mesgflow-ui-kit-card.d.ts +26 -16
- package/types/mesgflow-ui-kit-carousel.d.ts +51 -0
- package/types/mesgflow-ui-kit-checkbox.d.ts +8 -5
- package/types/mesgflow-ui-kit-code-block.d.ts +4 -1
- package/types/mesgflow-ui-kit-combobox.d.ts +47 -22
- package/types/mesgflow-ui-kit-command.d.ts +2 -2
- package/types/mesgflow-ui-kit-core.d.ts +279 -21
- package/types/mesgflow-ui-kit-countdown.d.ts +47 -0
- package/types/mesgflow-ui-kit-date-picker.d.ts +31 -1
- package/types/mesgflow-ui-kit-dialog.d.ts +122 -14
- package/types/mesgflow-ui-kit-drawer.d.ts +45 -0
- package/types/mesgflow-ui-kit-field.d.ts +17 -8
- package/types/mesgflow-ui-kit-file-upload.d.ts +64 -0
- package/types/mesgflow-ui-kit-hover-card.d.ts +2 -2
- package/types/mesgflow-ui-kit-icons-lucide.d.ts +27 -0
- package/types/mesgflow-ui-kit-inline-edit.d.ts +42 -0
- package/types/mesgflow-ui-kit-input.d.ts +64 -2
- package/types/mesgflow-ui-kit-lightbox.d.ts +54 -0
- package/types/mesgflow-ui-kit-listbox.d.ts +30 -0
- package/types/mesgflow-ui-kit-mention.d.ts +59 -0
- package/types/mesgflow-ui-kit-menu.d.ts +41 -2
- package/types/mesgflow-ui-kit-nav-menu.d.ts +58 -0
- package/types/mesgflow-ui-kit-notification-center.d.ts +41 -0
- package/types/mesgflow-ui-kit-number-input.d.ts +3 -1
- package/types/mesgflow-ui-kit-password-input.d.ts +35 -5
- package/types/mesgflow-ui-kit-popover.d.ts +13 -5
- package/types/mesgflow-ui-kit-progress.d.ts +33 -12
- package/types/mesgflow-ui-kit-qr-code.d.ts +160 -0
- package/types/mesgflow-ui-kit-radio.d.ts +2 -2
- package/types/mesgflow-ui-kit-search-input.d.ts +3 -1
- package/types/mesgflow-ui-kit-segmented-control.d.ts +4 -0
- package/types/mesgflow-ui-kit-sidebar.d.ts +1 -1
- package/types/mesgflow-ui-kit-slider.d.ts +60 -1
- package/types/mesgflow-ui-kit-sortable.d.ts +103 -0
- package/types/mesgflow-ui-kit-spinner.d.ts +5 -8
- package/types/mesgflow-ui-kit-split-button.d.ts +47 -0
- package/types/mesgflow-ui-kit-splitter.d.ts +64 -1
- package/types/mesgflow-ui-kit-stat-tile.d.ts +3 -0
- package/types/mesgflow-ui-kit-stepper.d.ts +54 -32
- package/types/mesgflow-ui-kit-table.d.ts +2 -0
- package/types/mesgflow-ui-kit-tabs.d.ts +193 -93
- package/types/mesgflow-ui-kit-tag-input.d.ts +3 -1
- package/types/mesgflow-ui-kit-toast.d.ts +48 -22
- package/types/mesgflow-ui-kit-tooltip.d.ts +15 -12
- package/types/mesgflow-ui-kit-transfer-list.d.ts +34 -0
- package/types/mesgflow-ui-kit-virtual-list.d.ts +35 -0
- package/types/mesgflow-ui-kit.d.ts +88 -5444
|
@@ -41,6 +41,9 @@ class NumberInput {
|
|
|
41
41
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
42
42
|
hasError = input(false, /* @ts-ignore */
|
|
43
43
|
...(ngDevMode ? [{ debugName: "hasError" }] : /* istanbul ignore next */ []));
|
|
44
|
+
/** İç `<input>`'un id'si — harici bir `<label for>` / `mf-field for` ile ilişkilendirmek için. */
|
|
45
|
+
inputId = input(/* @ts-ignore */
|
|
46
|
+
...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
44
47
|
ariaLabel = input('', /* @ts-ignore */
|
|
45
48
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
46
49
|
onChange = () => { };
|
|
@@ -133,17 +136,17 @@ class NumberInput {
|
|
|
133
136
|
event.currentTarget.releasePointerCapture(event.pointerId);
|
|
134
137
|
this.onTouched();
|
|
135
138
|
}
|
|
136
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
137
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.
|
|
139
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: NumberInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
140
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: NumberInput, isStandalone: true, selector: "mf-number-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "inline-flex" }, providers: [
|
|
138
141
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumberInput), multi: true },
|
|
139
|
-
], exportAs: ["mfNumberInput"], ngImport: i0, template: "<mf-input-group [padded]=\"false\" [hasError]=\"hasError()\" [disabled]=\"disabled()\">\r\n <button\r\n type=\"button\"\r\n mfInputPrefix\r\n class=\"w-8 justify-center rounded-s-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-
|
|
142
|
+
], exportAs: ["mfNumberInput"], ngImport: i0, template: "<mf-input-group [padded]=\"false\" [hasError]=\"hasError()\" [disabled]=\"disabled()\">\r\n <button\r\n type=\"button\"\r\n mfInputPrefix\r\n class=\"w-8 justify-center rounded-s-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n [disabled]=\"!canDecrement()\"\r\n (click)=\"adjust(-step())\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <span mfIcon [size]=\"16\">remove</span>\r\n </button>\r\n <input\r\n mfInput\r\n [attr.id]=\"inputId() || null\"\r\n type=\"text\"\r\n inputmode=\"decimal\"\r\n role=\"spinbutton\"\r\n class=\"min-w-0 flex-1 border-0 bg-transparent px-1 py-1.5 text-center shadow-none focus-visible:outline-none disabled:cursor-not-allowed\"\r\n [value]=\"value() ?? ''\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n [attr.aria-valuemin]=\"min()\"\r\n [attr.aria-valuemax]=\"max()\"\r\n [attr.aria-valuenow]=\"value()\"\r\n (input)=\"onInputChange($any($event.target).value)\"\r\n (blur)=\"onBlur()\"\r\n (keydown)=\"onKeydown($event)\"\r\n />\r\n @if (unit()) {\r\n <span\r\n class=\"number-input-unit flex shrink-0 items-center pe-2 text-sm text-fg-subtle select-none\"\r\n [class.cursor-ew-resize]=\"!disabled()\"\r\n aria-hidden=\"true\"\r\n (pointerdown)=\"onUnitPointerDown($event)\"\r\n (pointermove)=\"onUnitPointerMove($event)\"\r\n (pointerup)=\"onUnitPointerUp($event)\"\r\n >{{ unit() }}</span\r\n >\r\n }\r\n <button\r\n type=\"button\"\r\n mfInputSuffix\r\n class=\"w-8 justify-center rounded-e-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n [disabled]=\"!canIncrement()\"\r\n (click)=\"adjust(step())\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <span mfIcon [size]=\"16\">add</span>\r\n </button>\r\n</mf-input-group>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }, { kind: "component", type: InputGroup, selector: "mf-input-group", inputs: ["size", "disabled", "hasError", "padded", "wrap"], exportAs: ["mfInputGroup"] }, { kind: "directive", type: InputPrefix, selector: "[mfInputPrefix]", inputs: ["addon"] }, { kind: "directive", type: InputSuffix, selector: "[mfInputSuffix]", inputs: ["addon"] }] });
|
|
140
143
|
}
|
|
141
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
144
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: NumberInput, decorators: [{
|
|
142
145
|
type: Component,
|
|
143
146
|
args: [{ selector: 'mf-number-input', exportAs: 'mfNumberInput', host: { class: 'inline-flex' }, imports: [Icon, Input, InputGroup, InputPrefix, InputSuffix], providers: [
|
|
144
147
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumberInput), multi: true },
|
|
145
|
-
], template: "<mf-input-group [padded]=\"false\" [hasError]=\"hasError()\" [disabled]=\"disabled()\">\r\n <button\r\n type=\"button\"\r\n mfInputPrefix\r\n class=\"w-8 justify-center rounded-s-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-
|
|
146
|
-
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], unit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unit", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hasError: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasError", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
148
|
+
], template: "<mf-input-group [padded]=\"false\" [hasError]=\"hasError()\" [disabled]=\"disabled()\">\r\n <button\r\n type=\"button\"\r\n mfInputPrefix\r\n class=\"w-8 justify-center rounded-s-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n [disabled]=\"!canDecrement()\"\r\n (click)=\"adjust(-step())\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <span mfIcon [size]=\"16\">remove</span>\r\n </button>\r\n <input\r\n mfInput\r\n [attr.id]=\"inputId() || null\"\r\n type=\"text\"\r\n inputmode=\"decimal\"\r\n role=\"spinbutton\"\r\n class=\"min-w-0 flex-1 border-0 bg-transparent px-1 py-1.5 text-center shadow-none focus-visible:outline-none disabled:cursor-not-allowed\"\r\n [value]=\"value() ?? ''\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n [attr.aria-valuemin]=\"min()\"\r\n [attr.aria-valuemax]=\"max()\"\r\n [attr.aria-valuenow]=\"value()\"\r\n (input)=\"onInputChange($any($event.target).value)\"\r\n (blur)=\"onBlur()\"\r\n (keydown)=\"onKeydown($event)\"\r\n />\r\n @if (unit()) {\r\n <span\r\n class=\"number-input-unit flex shrink-0 items-center pe-2 text-sm text-fg-subtle select-none\"\r\n [class.cursor-ew-resize]=\"!disabled()\"\r\n aria-hidden=\"true\"\r\n (pointerdown)=\"onUnitPointerDown($event)\"\r\n (pointermove)=\"onUnitPointerMove($event)\"\r\n (pointerup)=\"onUnitPointerUp($event)\"\r\n >{{ unit() }}</span\r\n >\r\n }\r\n <button\r\n type=\"button\"\r\n mfInputSuffix\r\n class=\"w-8 justify-center rounded-e-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n [disabled]=\"!canIncrement()\"\r\n (click)=\"adjust(step())\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <span mfIcon [size]=\"16\">add</span>\r\n </button>\r\n</mf-input-group>\r\n" }]
|
|
149
|
+
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], unit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unit", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hasError: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasError", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
147
150
|
|
|
148
151
|
/**
|
|
149
152
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mesgflow-ui-kit-number-input.mjs","sources":["../../../projects/ui-kit/number-input/number-input.ts","../../../projects/ui-kit/number-input/number-input.html","../../../projects/ui-kit/number-input/mesgflow-ui-kit-number-input.ts"],"sourcesContent":["import { Component, computed, forwardRef, input, model, signal } from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Input, InputGroup, InputPrefix, InputSuffix } from '@mesgflow/ui-kit/input';\r\n\r\n/** Sürükleyerek değiştirmede kaç piksel sürüklemenin BİR `step()` ilerlemeye karşılık geldiği — Figma/After Effects gibi araçlardaki yaygın \"scrubber\" deseniyle AYNI kaba değer. */\r\nconst DRAG_PIXELS_PER_STEP = 4;\r\n\r\n/**\r\n * `<mf-number-input [(value)]=\"padding\" [min]=\"0\" [max]=\"64\" [step]=\"4\" unit=\"px\" />`\r\n *\r\n * `Select`'in `ControlValueAccessor` deseni tekrarlanıyor (bkz. select.ts\r\n * üstündeki not) — native değil, `NG_VALUE_ACCESSOR`'ı KENDİSİ sağlamak\r\n * zorunda. Klavye (yukarı/aşağı ok, PageUp/PageDown ±10×step) + stepper\r\n * butonları (mouse-only, `tabindex=\"-1\"` — gerçek `spinbutton` semantiği\r\n * input'un kendisinde) HER ZAMAN TAM işlevsellik sağlıyor.\r\n *\r\n * Sürükleyerek değiştirme (Kademe 12 paket BV — önceden \"v1 kapsamı dışı\"\r\n * bırakılmıştı) — SADECE `unit()` VERİLMİŞSE (`px` etiketi gibi) o etiket\r\n * yatay sürüklenebilir bir \"scrubber\" olur (`pointerdown`+`setPointerCapture`\r\n * ile sürükleme YAKALANIR, imleç `ew-resize` olur). `unit` YOKSA (boş\r\n * string) sürükleme EKLENMEDİ — dekoratif bir tutamaç elementi olmadan\r\n * kullanıcının \"burayı sürükleyebilirim\" sezgisi YOK, YENİ bir görsel\r\n * eleman eklemek gerekirdi (kapsam dışı). Bu, ERİŞİLEBİLİRLİK açısından\r\n * bir GERİLEME DEĞİL — klavye ZATEN aynı işlevselliği (yukarı/aşağı ok)\r\n * tam olarak sağlıyor, sürükleme SADECE mouse kullanıcıları için EK bir\r\n * kısayol (stepper butonlarının `tabindex=\"-1\"` olmasıyla AYNI ilke).\r\n */\r\n@Component({\r\n selector: 'mf-number-input',\r\n exportAs: 'mfNumberInput',\r\n host: { class: 'inline-flex' },\r\n imports: [Icon, Input, InputGroup, InputPrefix, InputSuffix],\r\n templateUrl: './number-input.html',\r\n providers: [\r\n { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumberInput), multi: true },\r\n ],\r\n})\r\nexport class NumberInput implements ControlValueAccessor {\r\n readonly value = model<number | null>(null);\r\n readonly min = input<number | null>(null);\r\n readonly max = input<number | null>(null);\r\n readonly step = input(1);\r\n readonly unit = input('');\r\n readonly disabled = input(false);\r\n readonly hasError = input(false);\r\n readonly ariaLabel = input('');\r\n\r\n private onChange: (value: number | null) => void = () => {};\r\n private onTouched: () => void = () => {};\r\n\r\n protected readonly canDecrement = computed(\r\n () => !this.disabled() && (this.min() == null || (this.value() ?? 0) > this.min()!),\r\n );\r\n protected readonly canIncrement = computed(\r\n () => !this.disabled() && (this.max() == null || (this.value() ?? 0) < this.max()!),\r\n );\r\n\r\n protected readonly dragging = signal(false);\r\n private dragStartClientX = 0;\r\n private dragStartValue = 0;\r\n\r\n writeValue(value: number | null): void {\r\n this.value.set(value);\r\n }\r\n\r\n registerOnChange(fn: (value: number | null) => void): void {\r\n this.onChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: () => void): void {\r\n this.onTouched = fn;\r\n }\r\n\r\n protected clamp(next: number): number {\r\n let v = next;\r\n if (this.min() != null) v = Math.max(this.min()!, v);\r\n if (this.max() != null) v = Math.min(this.max()!, v);\r\n return v;\r\n }\r\n\r\n protected adjust(delta: number): void {\r\n if (this.disabled()) return;\r\n const next = this.clamp((this.value() ?? 0) + delta);\r\n this.value.set(next);\r\n this.onChange(next);\r\n }\r\n\r\n protected onInputChange(raw: string): void {\r\n const parsed = raw.trim() === '' ? null : Number(raw);\r\n const next = parsed === null || Number.isNaN(parsed) ? null : this.clamp(parsed);\r\n this.value.set(next);\r\n this.onChange(next);\r\n }\r\n\r\n protected onBlur(): void {\r\n this.onTouched();\r\n }\r\n\r\n protected onKeydown(event: KeyboardEvent): void {\r\n switch (event.key) {\r\n case 'ArrowUp':\r\n event.preventDefault();\r\n this.adjust(this.step());\r\n break;\r\n case 'ArrowDown':\r\n event.preventDefault();\r\n this.adjust(-this.step());\r\n break;\r\n case 'PageUp':\r\n event.preventDefault();\r\n this.adjust(this.step() * 10);\r\n break;\r\n case 'PageDown':\r\n event.preventDefault();\r\n this.adjust(-this.step() * 10);\r\n break;\r\n }\r\n }\r\n\r\n // --- Sürükleyerek değiştirme (Kademe 12 paket BV) — bkz. class üstündeki not. ---\r\n protected onUnitPointerDown(event: PointerEvent): void {\r\n if (this.disabled()) return;\r\n event.preventDefault();\r\n this.dragging.set(true);\r\n this.dragStartClientX = event.clientX;\r\n this.dragStartValue = this.value() ?? 0;\r\n (event.currentTarget as HTMLElement).setPointerCapture(event.pointerId);\r\n }\r\n\r\n protected onUnitPointerMove(event: PointerEvent): void {\r\n if (!this.dragging()) return;\r\n const deltaSteps = Math.round((event.clientX - this.dragStartClientX) / DRAG_PIXELS_PER_STEP);\r\n const next = this.clamp(this.dragStartValue + deltaSteps * this.step());\r\n if (next !== this.value()) {\r\n this.value.set(next);\r\n this.onChange(next);\r\n }\r\n }\r\n\r\n protected onUnitPointerUp(event: PointerEvent): void {\r\n if (!this.dragging()) return;\r\n this.dragging.set(false);\r\n (event.currentTarget as HTMLElement).releasePointerCapture(event.pointerId);\r\n this.onTouched();\r\n }\r\n}\r\n","<mf-input-group [padded]=\"false\" [hasError]=\"hasError()\" [disabled]=\"disabled()\">\r\n <button\r\n type=\"button\"\r\n mfInputPrefix\r\n class=\"w-8 justify-center rounded-s-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-alt hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n [disabled]=\"!canDecrement()\"\r\n (click)=\"adjust(-step())\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <span mfIcon [size]=\"16\">remove</span>\r\n </button>\r\n <input\r\n mfInput\r\n type=\"text\"\r\n inputmode=\"decimal\"\r\n role=\"spinbutton\"\r\n class=\"min-w-0 flex-1 border-0 bg-transparent px-1 py-1.5 text-center shadow-none focus-visible:outline-none disabled:cursor-not-allowed\"\r\n [value]=\"value() ?? ''\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n [attr.aria-valuemin]=\"min()\"\r\n [attr.aria-valuemax]=\"max()\"\r\n [attr.aria-valuenow]=\"value()\"\r\n (input)=\"onInputChange($any($event.target).value)\"\r\n (blur)=\"onBlur()\"\r\n (keydown)=\"onKeydown($event)\"\r\n />\r\n @if (unit()) {\r\n <span\r\n class=\"number-input-unit flex shrink-0 items-center pe-2 text-sm text-fg-subtle select-none\"\r\n [class.cursor-ew-resize]=\"!disabled()\"\r\n aria-hidden=\"true\"\r\n (pointerdown)=\"onUnitPointerDown($event)\"\r\n (pointermove)=\"onUnitPointerMove($event)\"\r\n (pointerup)=\"onUnitPointerUp($event)\"\r\n >{{ unit() }}</span\r\n >\r\n }\r\n <button\r\n type=\"button\"\r\n mfInputSuffix\r\n class=\"w-8 justify-center rounded-e-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-surface-alt hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n [disabled]=\"!canIncrement()\"\r\n (click)=\"adjust(step())\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <span mfIcon [size]=\"16\">add</span>\r\n </button>\r\n</mf-input-group>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAKA;AACA,MAAM,oBAAoB,GAAG,CAAC;AAE9B;;;;;;;;;;;;;;;;;;;AAmBG;MAWU,WAAW,CAAA;IACb,KAAK,GAAG,KAAK,CAAgB,IAAI;8EAAC;IAClC,GAAG,GAAG,KAAK,CAAgB,IAAI;4EAAC;IAChC,GAAG,GAAG,KAAK,CAAgB,IAAI;4EAAC;IAChC,IAAI,GAAG,KAAK,CAAC,CAAC;6EAAC;IACf,IAAI,GAAG,KAAK,CAAC,EAAE;6EAAC;IAChB,QAAQ,GAAG,KAAK,CAAC,KAAK;iFAAC;IACvB,QAAQ,GAAG,KAAK,CAAC,KAAK;iFAAC;IACvB,SAAS,GAAG,KAAK,CAAC,EAAE;kFAAC;AAEtB,IAAA,QAAQ,GAAmC,MAAK,EAAE,CAAC;AACnD,IAAA,SAAS,GAAe,MAAK,EAAE,CAAC;AAErB,IAAA,YAAY,GAAG,QAAQ,CACxC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,IAAI,CAAC,GAAG,EAAE,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,IAAI,IAAI,CAAC,GAAG,EAAG,CAAC;qFACpF;AACkB,IAAA,YAAY,GAAG,QAAQ,CACxC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,IAAI,CAAC,GAAG,EAAE,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,IAAI,IAAI,CAAC,GAAG,EAAG,CAAC;qFACpF;IAEkB,QAAQ,GAAG,MAAM,CAAC,KAAK;iFAAC;IACnC,gBAAgB,GAAG,CAAC;IACpB,cAAc,GAAG,CAAC;AAE1B,IAAA,UAAU,CAAC,KAAoB,EAAA;AAC7B,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC;IACvB;AAEA,IAAA,gBAAgB,CAAC,EAAkC,EAAA;AACjD,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;IACpB;AAEA,IAAA,iBAAiB,CAAC,EAAc,EAAA;AAC9B,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AAEU,IAAA,KAAK,CAAC,IAAY,EAAA;QAC1B,IAAI,CAAC,GAAG,IAAI;AACZ,QAAA,IAAI,IAAI,CAAC,GAAG,EAAE,IAAI,IAAI;AAAE,YAAA,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,EAAG,EAAE,CAAC,CAAC;AACpD,QAAA,IAAI,IAAI,CAAC,GAAG,EAAE,IAAI,IAAI;AAAE,YAAA,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,EAAG,EAAE,CAAC,CAAC;AACpD,QAAA,OAAO,CAAC;IACV;AAEU,IAAA,MAAM,CAAC,KAAa,EAAA;QAC5B,IAAI,IAAI,CAAC,QAAQ,EAAE;YAAE;AACrB,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,CAAC;AACpD,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC;AACpB,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;IACrB;AAEU,IAAA,aAAa,CAAC,GAAW,EAAA;AACjC,QAAA,MAAM,MAAM,GAAG,GAAG,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,IAAI,GAAG,MAAM,CAAC,GAAG,CAAC;QACrD,MAAM,IAAI,GAAG,MAAM,KAAK,IAAI,IAAI,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;AAChF,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC;AACpB,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;IACrB;IAEU,MAAM,GAAA;QACd,IAAI,CAAC,SAAS,EAAE;IAClB;AAEU,IAAA,SAAS,CAAC,KAAoB,EAAA;AACtC,QAAA,QAAQ,KAAK,CAAC,GAAG;AACf,YAAA,KAAK,SAAS;gBACZ,KAAK,CAAC,cAAc,EAAE;gBACtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;gBACxB;AACF,YAAA,KAAK,WAAW;gBACd,KAAK,CAAC,cAAc,EAAE;gBACtB,IAAI,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;gBACzB;AACF,YAAA,KAAK,QAAQ;gBACX,KAAK,CAAC,cAAc,EAAE;gBACtB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC;gBAC7B;AACF,YAAA,KAAK,UAAU;gBACb,KAAK,CAAC,cAAc,EAAE;gBACtB,IAAI,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC;gBAC9B;;IAEN;;AAGU,IAAA,iBAAiB,CAAC,KAAmB,EAAA;QAC7C,IAAI,IAAI,CAAC,QAAQ,EAAE;YAAE;QACrB,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC;AACvB,QAAA,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC,OAAO;QACrC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC;QACtC,KAAK,CAAC,aAA6B,CAAC,iBAAiB,CAAC,KAAK,CAAC,SAAS,CAAC;IACzE;AAEU,IAAA,iBAAiB,CAAC,KAAmB,EAAA;AAC7C,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAAE;AACtB,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,gBAAgB,IAAI,oBAAoB,CAAC;AAC7F,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,cAAc,GAAG,UAAU,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC;AACvE,QAAA,IAAI,IAAI,KAAK,IAAI,CAAC,KAAK,EAAE,EAAE;AACzB,YAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC;AACpB,YAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;QACrB;IACF;AAEU,IAAA,eAAe,CAAC,KAAmB,EAAA;AAC3C,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAAE;AACtB,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;QACvB,KAAK,CAAC,aAA6B,CAAC,qBAAqB,CAAC,KAAK,CAAC,SAAS,CAAC;QAC3E,IAAI,CAAC,SAAS,EAAE;IAClB;uGA3GW,WAAW,EAAA,IAAA,EAAA,EAAA,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,iBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,KAAA,EAAA,aAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,aAAA,EAAA,EAAA,SAAA,EAJX;AACT,YAAA,EAAE,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,UAAU,CAAC,MAAM,WAAW,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE;SACxF,EAAA,QAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECpCH,i/DAmDA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDnBY,IAAI,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,KAAK,qLAAE,UAAU,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,MAAA,CAAA,EAAA,QAAA,EAAA,CAAA,cAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,WAAW,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,WAAW,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAMhD,WAAW,EAAA,UAAA,EAAA,CAAA;kBAVvB,SAAS;+BACE,iBAAiB,EAAA,QAAA,EACjB,eAAe,EAAA,IAAA,EACnB,EAAE,KAAK,EAAE,aAAa,EAAE,EAAA,OAAA,EACrB,CAAC,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,CAAC,EAAA,SAAA,EAEjD;AACT,wBAAA,EAAE,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,UAAU,CAAC,iBAAiB,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE;AACxF,qBAAA,EAAA,QAAA,EAAA,i/DAAA,EAAA;;;AEpCH;;AAEG;;"}
|
|
1
|
+
{"version":3,"file":"mesgflow-ui-kit-number-input.mjs","sources":["../../../projects/ui-kit/number-input/number-input.ts","../../../projects/ui-kit/number-input/number-input.html","../../../projects/ui-kit/number-input/mesgflow-ui-kit-number-input.ts"],"sourcesContent":["import { Component, computed, forwardRef, input, model, signal } from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Input, InputGroup, InputPrefix, InputSuffix } from '@mesgflow/ui-kit/input';\r\n\r\n/** Sürükleyerek değiştirmede kaç piksel sürüklemenin BİR `step()` ilerlemeye karşılık geldiği — Figma/After Effects gibi araçlardaki yaygın \"scrubber\" deseniyle AYNI kaba değer. */\r\nconst DRAG_PIXELS_PER_STEP = 4;\r\n\r\n/**\r\n * `<mf-number-input [(value)]=\"padding\" [min]=\"0\" [max]=\"64\" [step]=\"4\" unit=\"px\" />`\r\n *\r\n * `Select`'in `ControlValueAccessor` deseni tekrarlanıyor (bkz. select.ts\r\n * üstündeki not) — native değil, `NG_VALUE_ACCESSOR`'ı KENDİSİ sağlamak\r\n * zorunda. Klavye (yukarı/aşağı ok, PageUp/PageDown ±10×step) + stepper\r\n * butonları (mouse-only, `tabindex=\"-1\"` — gerçek `spinbutton` semantiği\r\n * input'un kendisinde) HER ZAMAN TAM işlevsellik sağlıyor.\r\n *\r\n * Sürükleyerek değiştirme (Kademe 12 paket BV — önceden \"v1 kapsamı dışı\"\r\n * bırakılmıştı) — SADECE `unit()` VERİLMİŞSE (`px` etiketi gibi) o etiket\r\n * yatay sürüklenebilir bir \"scrubber\" olur (`pointerdown`+`setPointerCapture`\r\n * ile sürükleme YAKALANIR, imleç `ew-resize` olur). `unit` YOKSA (boş\r\n * string) sürükleme EKLENMEDİ — dekoratif bir tutamaç elementi olmadan\r\n * kullanıcının \"burayı sürükleyebilirim\" sezgisi YOK, YENİ bir görsel\r\n * eleman eklemek gerekirdi (kapsam dışı). Bu, ERİŞİLEBİLİRLİK açısından\r\n * bir GERİLEME DEĞİL — klavye ZATEN aynı işlevselliği (yukarı/aşağı ok)\r\n * tam olarak sağlıyor, sürükleme SADECE mouse kullanıcıları için EK bir\r\n * kısayol (stepper butonlarının `tabindex=\"-1\"` olmasıyla AYNI ilke).\r\n */\r\n@Component({\r\n selector: 'mf-number-input',\r\n exportAs: 'mfNumberInput',\r\n host: { class: 'inline-flex' },\r\n imports: [Icon, Input, InputGroup, InputPrefix, InputSuffix],\r\n templateUrl: './number-input.html',\r\n providers: [\r\n { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumberInput), multi: true },\r\n ],\r\n})\r\nexport class NumberInput implements ControlValueAccessor {\r\n readonly value = model<number | null>(null);\r\n readonly min = input<number | null>(null);\r\n readonly max = input<number | null>(null);\r\n readonly step = input(1);\r\n readonly unit = input('');\r\n readonly disabled = input(false);\r\n readonly hasError = input(false);\r\n /** İç `<input>`'un id'si — harici bir `<label for>` / `mf-field for` ile ilişkilendirmek için. */\r\n readonly inputId = input<string>();\r\n readonly ariaLabel = input('');\r\n\r\n private onChange: (value: number | null) => void = () => {};\r\n private onTouched: () => void = () => {};\r\n\r\n protected readonly canDecrement = computed(\r\n () => !this.disabled() && (this.min() == null || (this.value() ?? 0) > this.min()!),\r\n );\r\n protected readonly canIncrement = computed(\r\n () => !this.disabled() && (this.max() == null || (this.value() ?? 0) < this.max()!),\r\n );\r\n\r\n protected readonly dragging = signal(false);\r\n private dragStartClientX = 0;\r\n private dragStartValue = 0;\r\n\r\n writeValue(value: number | null): void {\r\n this.value.set(value);\r\n }\r\n\r\n registerOnChange(fn: (value: number | null) => void): void {\r\n this.onChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: () => void): void {\r\n this.onTouched = fn;\r\n }\r\n\r\n protected clamp(next: number): number {\r\n let v = next;\r\n if (this.min() != null) v = Math.max(this.min()!, v);\r\n if (this.max() != null) v = Math.min(this.max()!, v);\r\n return v;\r\n }\r\n\r\n protected adjust(delta: number): void {\r\n if (this.disabled()) return;\r\n const next = this.clamp((this.value() ?? 0) + delta);\r\n this.value.set(next);\r\n this.onChange(next);\r\n }\r\n\r\n protected onInputChange(raw: string): void {\r\n const parsed = raw.trim() === '' ? null : Number(raw);\r\n const next = parsed === null || Number.isNaN(parsed) ? null : this.clamp(parsed);\r\n this.value.set(next);\r\n this.onChange(next);\r\n }\r\n\r\n protected onBlur(): void {\r\n this.onTouched();\r\n }\r\n\r\n protected onKeydown(event: KeyboardEvent): void {\r\n switch (event.key) {\r\n case 'ArrowUp':\r\n event.preventDefault();\r\n this.adjust(this.step());\r\n break;\r\n case 'ArrowDown':\r\n event.preventDefault();\r\n this.adjust(-this.step());\r\n break;\r\n case 'PageUp':\r\n event.preventDefault();\r\n this.adjust(this.step() * 10);\r\n break;\r\n case 'PageDown':\r\n event.preventDefault();\r\n this.adjust(-this.step() * 10);\r\n break;\r\n }\r\n }\r\n\r\n // --- Sürükleyerek değiştirme (Kademe 12 paket BV) — bkz. class üstündeki not. ---\r\n protected onUnitPointerDown(event: PointerEvent): void {\r\n if (this.disabled()) return;\r\n event.preventDefault();\r\n this.dragging.set(true);\r\n this.dragStartClientX = event.clientX;\r\n this.dragStartValue = this.value() ?? 0;\r\n (event.currentTarget as HTMLElement).setPointerCapture(event.pointerId);\r\n }\r\n\r\n protected onUnitPointerMove(event: PointerEvent): void {\r\n if (!this.dragging()) return;\r\n const deltaSteps = Math.round((event.clientX - this.dragStartClientX) / DRAG_PIXELS_PER_STEP);\r\n const next = this.clamp(this.dragStartValue + deltaSteps * this.step());\r\n if (next !== this.value()) {\r\n this.value.set(next);\r\n this.onChange(next);\r\n }\r\n }\r\n\r\n protected onUnitPointerUp(event: PointerEvent): void {\r\n if (!this.dragging()) return;\r\n this.dragging.set(false);\r\n (event.currentTarget as HTMLElement).releasePointerCapture(event.pointerId);\r\n this.onTouched();\r\n }\r\n}\r\n","<mf-input-group [padded]=\"false\" [hasError]=\"hasError()\" [disabled]=\"disabled()\">\r\n <button\r\n type=\"button\"\r\n mfInputPrefix\r\n class=\"w-8 justify-center rounded-s-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n [disabled]=\"!canDecrement()\"\r\n (click)=\"adjust(-step())\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <span mfIcon [size]=\"16\">remove</span>\r\n </button>\r\n <input\r\n mfInput\r\n [attr.id]=\"inputId() || null\"\r\n type=\"text\"\r\n inputmode=\"decimal\"\r\n role=\"spinbutton\"\r\n class=\"min-w-0 flex-1 border-0 bg-transparent px-1 py-1.5 text-center shadow-none focus-visible:outline-none disabled:cursor-not-allowed\"\r\n [value]=\"value() ?? ''\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n [attr.aria-valuemin]=\"min()\"\r\n [attr.aria-valuemax]=\"max()\"\r\n [attr.aria-valuenow]=\"value()\"\r\n (input)=\"onInputChange($any($event.target).value)\"\r\n (blur)=\"onBlur()\"\r\n (keydown)=\"onKeydown($event)\"\r\n />\r\n @if (unit()) {\r\n <span\r\n class=\"number-input-unit flex shrink-0 items-center pe-2 text-sm text-fg-subtle select-none\"\r\n [class.cursor-ew-resize]=\"!disabled()\"\r\n aria-hidden=\"true\"\r\n (pointerdown)=\"onUnitPointerDown($event)\"\r\n (pointermove)=\"onUnitPointerMove($event)\"\r\n (pointerup)=\"onUnitPointerUp($event)\"\r\n >{{ unit() }}</span\r\n >\r\n }\r\n <button\r\n type=\"button\"\r\n mfInputSuffix\r\n class=\"w-8 justify-center rounded-e-md text-fg-subtle transition-colors duration-fast ease-emphasis hover:bg-state-hover hover:text-fg disabled:pointer-events-none disabled:opacity-50\"\r\n [disabled]=\"!canIncrement()\"\r\n (click)=\"adjust(step())\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <span mfIcon [size]=\"16\">add</span>\r\n </button>\r\n</mf-input-group>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -101,8 +101,8 @@ class OtpInput extends ValueAccessorBase {
|
|
|
101
101
|
focusBox(i) {
|
|
102
102
|
this.boxes()[i]?.nativeElement.focus();
|
|
103
103
|
}
|
|
104
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
105
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.
|
|
104
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: OtpInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
105
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: OtpInput, isStandalone: true, selector: "mf-otp-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "inline-flex gap-2" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => OtpInput), multi: true }], viewQueries: [{ propertyName: "boxes", predicate: ["boxEl"], descendants: true, isSignal: true }], exportAs: ["mfOtpInput"], usesInheritance: true, ngImport: i0, template: `
|
|
106
106
|
@for (i of indexes(); track i) {
|
|
107
107
|
<input
|
|
108
108
|
mfInput
|
|
@@ -124,7 +124,7 @@ class OtpInput extends ValueAccessorBase {
|
|
|
124
124
|
}
|
|
125
125
|
`, isInline: true, dependencies: [{ kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }] });
|
|
126
126
|
}
|
|
127
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
127
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: OtpInput, decorators: [{
|
|
128
128
|
type: Component,
|
|
129
129
|
args: [{
|
|
130
130
|
selector: 'mf-otp-input',
|
|
@@ -22,8 +22,8 @@ class PageHeader {
|
|
|
22
22
|
...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
|
|
23
23
|
breadcrumbItems = input([], /* @ts-ignore */
|
|
24
24
|
...(ngDevMode ? [{ debugName: "breadcrumbItems" }] : /* istanbul ignore next */ []));
|
|
25
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
26
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.
|
|
25
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PageHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
26
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: PageHeader, isStandalone: true, selector: "mf-page-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, breadcrumbItems: { classPropertyName: "breadcrumbItems", publicName: "breadcrumbItems", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block @container" }, exportAs: ["mfPageHeader"], ngImport: i0, template: `
|
|
27
27
|
@if (breadcrumbItems().length > 0) {
|
|
28
28
|
<mf-breadcrumb [items]="breadcrumbItems()" class="mb-2 block" />
|
|
29
29
|
}
|
|
@@ -38,7 +38,7 @@ class PageHeader {
|
|
|
38
38
|
</div>
|
|
39
39
|
`, isInline: true, dependencies: [{ kind: "component", type: Breadcrumb, selector: "mf-breadcrumb", inputs: ["items", "ariaLabel"], exportAs: ["mfBreadcrumb"] }] });
|
|
40
40
|
}
|
|
41
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
41
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PageHeader, decorators: [{
|
|
42
42
|
type: Component,
|
|
43
43
|
args: [{
|
|
44
44
|
selector: 'mf-page-header',
|
|
@@ -64,10 +64,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImpor
|
|
|
64
64
|
|
|
65
65
|
/** `<div mfPageHeaderActions><button mfButton>...</button></div>` — bkz. `page-header.ts`'in JSDoc'u. */
|
|
66
66
|
class PageHeaderActions {
|
|
67
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
68
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
67
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PageHeaderActions, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
68
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: PageHeaderActions, isStandalone: true, selector: "[mfPageHeaderActions]", host: { classAttribute: "flex shrink-0 items-center gap-2" }, ngImport: i0 });
|
|
69
69
|
}
|
|
70
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
70
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PageHeaderActions, decorators: [{
|
|
71
71
|
type: Directive,
|
|
72
72
|
args: [{
|
|
73
73
|
selector: '[mfPageHeaderActions]',
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { model, input, booleanAttribute, inject, computed, Component } from '@angular/core';
|
|
3
|
-
import { MF_PAGINATION_LABELS, cn } from '@mesgflow/ui-kit/core';
|
|
3
|
+
import { focusRecipe, MF_PAGINATION_LABELS, cn } from '@mesgflow/ui-kit/core';
|
|
4
4
|
import { Icon } from '@mesgflow/ui-kit/icon';
|
|
5
5
|
|
|
6
6
|
/**
|
|
@@ -33,7 +33,8 @@ function paginationRange(current, pageCount, siblings = 1, boundaries = 1) {
|
|
|
33
33
|
|
|
34
34
|
const CELL_BASE = 'relative inline-flex shrink-0 cursor-pointer appearance-none items-center justify-center rounded-md border-0 bg-transparent px-2 ' +
|
|
35
35
|
'font-medium tabular-nums transition-colors duration-fast ease-emphasis active:scale-[0.99] ' +
|
|
36
|
-
|
|
36
|
+
focusRecipe +
|
|
37
|
+
' ' +
|
|
37
38
|
'disabled:pointer-events-none disabled:opacity-50 disabled:active:scale-100';
|
|
38
39
|
const SIZE = { sm: 'h-8 min-w-8 text-xs', md: 'h-9 min-w-9 text-sm' };
|
|
39
40
|
/**
|
|
@@ -75,7 +76,7 @@ class Pagination {
|
|
|
75
76
|
cell(active = false) {
|
|
76
77
|
return cn(CELL_BASE, SIZE[this.size()], active
|
|
77
78
|
? 'bg-surface-alt font-semibold text-fg'
|
|
78
|
-
: 'text-fg-muted hover:bg-
|
|
79
|
+
: 'text-fg-muted hover:bg-state-hover hover:text-fg', active &&
|
|
79
80
|
"after:absolute after:inset-x-2 after:bottom-0 after:h-0.5 after:rounded-full after:bg-accent-fill after:content-['']");
|
|
80
81
|
}
|
|
81
82
|
goTo(page) {
|
|
@@ -83,10 +84,10 @@ class Pagination {
|
|
|
83
84
|
if (next !== this.current())
|
|
84
85
|
this.page.set(next);
|
|
85
86
|
}
|
|
86
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
87
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.
|
|
87
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Pagination, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
88
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: Pagination, isStandalone: true, selector: "mf-pagination", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, pageCount: { classPropertyName: "pageCount", publicName: "pageCount", isSignal: true, isRequired: true, transformFunction: null }, siblings: { classPropertyName: "siblings", publicName: "siblings", isSignal: true, isRequired: false, transformFunction: null }, showEdges: { classPropertyName: "showEdges", publicName: "showEdges", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange" }, host: { classAttribute: "block" }, exportAs: ["mfPagination"], ngImport: i0, template: "<nav class=\"flex items-center gap-0.5\" [attr.aria-label]=\"effectiveAriaLabel()\">\r\n @if (showEdges()) {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === 1\"\r\n [attr.aria-label]=\"labels().first\"\r\n (click)=\"goTo(1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">first_page</span>\r\n </button>\r\n }\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === 1\"\r\n [attr.aria-label]=\"labels().previous\"\r\n (click)=\"goTo(current() - 1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n </button>\r\n\r\n @if (compact()) {\r\n <span class=\"px-2 text-sm text-fg-muted tabular-nums\" aria-live=\"polite\">\r\n {{ labels().page }} {{ current() }} / {{ safeCount() }}\r\n </span>\r\n } @else {\r\n @for (item of items(); track item) {\r\n @if (item === 'ellipsis-start' || item === 'ellipsis-end') {\r\n <span\r\n aria-hidden=\"true\"\r\n class=\"inline-flex min-w-8 items-center justify-center text-sm text-fg-subtle select-none\"\r\n >\u2026</span\r\n >\r\n } @else {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell(item === current())\"\r\n [attr.aria-current]=\"item === current() ? 'page' : null\"\r\n [attr.aria-label]=\"labels().page + ' ' + item\"\r\n (click)=\"goTo(item)\"\r\n >\r\n {{ item }}\r\n </button>\r\n }\r\n }\r\n }\r\n\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === safeCount()\"\r\n [attr.aria-label]=\"labels().next\"\r\n (click)=\"goTo(current() + 1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n </button>\r\n @if (showEdges()) {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === safeCount()\"\r\n [attr.aria-label]=\"labels().last\"\r\n (click)=\"goTo(safeCount())\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">last_page</span>\r\n </button>\r\n }\r\n</nav>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }] });
|
|
88
89
|
}
|
|
89
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
90
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Pagination, decorators: [{
|
|
90
91
|
type: Component,
|
|
91
92
|
args: [{ selector: 'mf-pagination', exportAs: 'mfPagination', imports: [Icon], host: { class: 'block' }, template: "<nav class=\"flex items-center gap-0.5\" [attr.aria-label]=\"effectiveAriaLabel()\">\r\n @if (showEdges()) {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === 1\"\r\n [attr.aria-label]=\"labels().first\"\r\n (click)=\"goTo(1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">first_page</span>\r\n </button>\r\n }\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === 1\"\r\n [attr.aria-label]=\"labels().previous\"\r\n (click)=\"goTo(current() - 1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n </button>\r\n\r\n @if (compact()) {\r\n <span class=\"px-2 text-sm text-fg-muted tabular-nums\" aria-live=\"polite\">\r\n {{ labels().page }} {{ current() }} / {{ safeCount() }}\r\n </span>\r\n } @else {\r\n @for (item of items(); track item) {\r\n @if (item === 'ellipsis-start' || item === 'ellipsis-end') {\r\n <span\r\n aria-hidden=\"true\"\r\n class=\"inline-flex min-w-8 items-center justify-center text-sm text-fg-subtle select-none\"\r\n >\u2026</span\r\n >\r\n } @else {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell(item === current())\"\r\n [attr.aria-current]=\"item === current() ? 'page' : null\"\r\n [attr.aria-label]=\"labels().page + ' ' + item\"\r\n (click)=\"goTo(item)\"\r\n >\r\n {{ item }}\r\n </button>\r\n }\r\n }\r\n }\r\n\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === safeCount()\"\r\n [attr.aria-label]=\"labels().next\"\r\n (click)=\"goTo(current() + 1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n </button>\r\n @if (showEdges()) {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === safeCount()\"\r\n [attr.aria-label]=\"labels().last\"\r\n (click)=\"goTo(safeCount())\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">last_page</span>\r\n </button>\r\n }\r\n</nav>\r\n" }]
|
|
92
93
|
}], propDecorators: { page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], pageCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageCount", required: true }] }], siblings: [{ type: i0.Input, args: [{ isSignal: true, alias: "siblings", required: false }] }], showEdges: [{ type: i0.Input, args: [{ isSignal: true, alias: "showEdges", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mesgflow-ui-kit-pagination.mjs","sources":["../../../projects/ui-kit/pagination/pagination-range.ts","../../../projects/ui-kit/pagination/pagination.ts","../../../projects/ui-kit/pagination/pagination.html","../../../projects/ui-kit/pagination/mesgflow-ui-kit-pagination.ts"],"sourcesContent":["export type PaginationItem = number | 'ellipsis-start' | 'ellipsis-end';\r\n\r\n/**\r\n * Görünen sayfa öğeleri — SABİT uzunlukta: `2 × boundaries + 2 × siblings + 3` (sayfa sayısı\r\n * bundan azsa hepsi). Böylece sayfa değiştikçe öğe sayısı oynamaz, düğmeler zıplamaz (Table\r\n * sayfalamasındaki değişken uzunluklu listenin aksine). Üç nokta tek bir sayfanın yerini\r\n * tutuyorsa üç nokta yerine o sayfa gösterilir (… yalnızca ≥2 sayfayı gizler).\r\n *\r\n * `paginationRange(6, 20)` → `[1, 'ellipsis-start', 5, 6, 7, 'ellipsis-end', 20]`\r\n */\r\nexport function paginationRange(\r\n current: number,\r\n pageCount: number,\r\n siblings = 1,\r\n boundaries = 1,\r\n): PaginationItem[] {\r\n const range = (from: number, to: number) =>\r\n Array.from({ length: Math.max(0, to - from + 1) }, (_, i) => from + i);\r\n\r\n const slots = 2 * boundaries + 2 * siblings + 3;\r\n if (pageCount <= slots) return range(1, pageCount);\r\n\r\n const page = Math.min(Math.max(current, 1), pageCount);\r\n const startPages = range(1, boundaries);\r\n const endPages = range(pageCount - boundaries + 1, pageCount);\r\n\r\n // Kardeş penceresi kenarlara yaklaşınca kayar — toplam uzunluk sabit kalsın.\r\n const siblingsStart = Math.max(\r\n Math.min(page - siblings, pageCount - boundaries - siblings * 2 - 1),\r\n boundaries + 2,\r\n );\r\n const siblingsEnd = Math.min(\r\n Math.max(page + siblings, boundaries + siblings * 2 + 2),\r\n pageCount - boundaries - 1,\r\n );\r\n\r\n return [\r\n ...startPages,\r\n siblingsStart > boundaries + 2 ? 'ellipsis-start' : boundaries + 1,\r\n ...range(siblingsStart, siblingsEnd),\r\n siblingsEnd < pageCount - boundaries - 1 ? 'ellipsis-end' : pageCount - boundaries,\r\n ...endPages,\r\n ] as PaginationItem[];\r\n}\r\n","import { Component, booleanAttribute, computed, inject, input, model } from '@angular/core';\r\nimport { MF_PAGINATION_LABELS, cn } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { paginationRange } from './pagination-range';\r\n\r\nconst CELL_BASE =\r\n 'relative inline-flex shrink-0 cursor-pointer appearance-none items-center justify-center rounded-md border-0 bg-transparent px-2 ' +\r\n 'font-medium tabular-nums transition-colors duration-fast ease-emphasis active:scale-[0.99] ' +\r\n 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus-ring ' +\r\n 'disabled:pointer-events-none disabled:opacity-50 disabled:active:scale-100';\r\n\r\nconst SIZE = { sm: 'h-8 min-w-8 text-xs', md: 'h-9 min-w-9 text-sm' } as const;\r\n\r\n/**\r\n * `<mf-pagination [pageCount]=\"20\" [(page)]=\"page\" />`\r\n *\r\n * Tablo dışı listeler (kart ızgarası, arama sonuçları) için bağımsız sayfalama. Table'ın\r\n * kendi sayfalamasıyla AYNI görsel dil: aktif sayfa nötr zemin + alt kenarda 2px marka rayı\r\n * (\"buradasın\" motifi), dolu blok değil.\r\n *\r\n * Öğe sayısı sabittir (bkz. `paginationRange`) — sayfa değiştikçe düğmeler kaymaz. `compact`:\r\n * sayı listesi yerine \"Sayfa 3 / 20\" (dar alanlar, mobil). `<nav>` landmark'ı + aktif sayfada\r\n * `aria-current=\"page\"`; sayfa düğmeleri \"Page 3\" gibi tam adla duyurulur; üç nokta gizlidir.\r\n */\r\n@Component({\r\n selector: 'mf-pagination',\r\n exportAs: 'mfPagination',\r\n imports: [Icon],\r\n host: { class: 'block' },\r\n templateUrl: './pagination.html',\r\n})\r\nexport class Pagination {\r\n readonly page = model(1);\r\n readonly pageCount = input.required<number>();\r\n /** Aktif sayfanın iki yanında gösterilecek sayfa sayısı. */\r\n readonly siblings = input(1);\r\n /** İlk/son sayfaya atlama düğmeleri. */\r\n readonly showEdges = input(false, { transform: booleanAttribute });\r\n readonly compact = input(false, { transform: booleanAttribute });\r\n readonly size = input<'sm' | 'md'>('md');\r\n /** Verilmezse `MfLabels.pagination.navAriaLabel` — sayfada birden çok sayfalama varsa ayırt edin. */\r\n readonly ariaLabel = input<string>();\r\n\r\n protected readonly labels = inject(MF_PAGINATION_LABELS);\r\n protected readonly effectiveAriaLabel = computed(\r\n () => this.ariaLabel() ?? this.labels().navAriaLabel,\r\n );\r\n protected readonly safeCount = computed(() => Math.max(1, Math.floor(this.pageCount())));\r\n protected readonly current = computed(() => Math.min(Math.max(1, this.page()), this.safeCount()));\r\n protected readonly items = computed(() =>\r\n paginationRange(this.current(), this.safeCount(), this.siblings()),\r\n );\r\n\r\n protected cell(active = false): string {\r\n return cn(\r\n CELL_BASE,\r\n SIZE[this.size()],\r\n active\r\n ? 'bg-surface-alt font-semibold text-fg'\r\n : 'text-fg-muted hover:bg-surface-alt hover:text-fg',\r\n active &&\r\n \"after:absolute after:inset-x-2 after:bottom-0 after:h-0.5 after:rounded-full after:bg-accent-fill after:content-['']\",\r\n );\r\n }\r\n\r\n protected goTo(page: number): void {\r\n const next = Math.min(Math.max(1, page), this.safeCount());\r\n if (next !== this.current()) this.page.set(next);\r\n }\r\n}\r\n","<nav class=\"flex items-center gap-0.5\" [attr.aria-label]=\"effectiveAriaLabel()\">\r\n @if (showEdges()) {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === 1\"\r\n [attr.aria-label]=\"labels().first\"\r\n (click)=\"goTo(1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">first_page</span>\r\n </button>\r\n }\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === 1\"\r\n [attr.aria-label]=\"labels().previous\"\r\n (click)=\"goTo(current() - 1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n </button>\r\n\r\n @if (compact()) {\r\n <span class=\"px-2 text-sm text-fg-muted tabular-nums\" aria-live=\"polite\">\r\n {{ labels().page }} {{ current() }} / {{ safeCount() }}\r\n </span>\r\n } @else {\r\n @for (item of items(); track item) {\r\n @if (item === 'ellipsis-start' || item === 'ellipsis-end') {\r\n <span\r\n aria-hidden=\"true\"\r\n class=\"inline-flex min-w-8 items-center justify-center text-sm text-fg-subtle select-none\"\r\n >…</span\r\n >\r\n } @else {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell(item === current())\"\r\n [attr.aria-current]=\"item === current() ? 'page' : null\"\r\n [attr.aria-label]=\"labels().page + ' ' + item\"\r\n (click)=\"goTo(item)\"\r\n >\r\n {{ item }}\r\n </button>\r\n }\r\n }\r\n }\r\n\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === safeCount()\"\r\n [attr.aria-label]=\"labels().next\"\r\n (click)=\"goTo(current() + 1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n </button>\r\n @if (showEdges()) {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === safeCount()\"\r\n [attr.aria-label]=\"labels().last\"\r\n (click)=\"goTo(safeCount())\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">last_page</span>\r\n </button>\r\n }\r\n</nav>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"mesgflow-ui-kit-pagination.mjs","sources":["../../../projects/ui-kit/pagination/pagination-range.ts","../../../projects/ui-kit/pagination/pagination.ts","../../../projects/ui-kit/pagination/pagination.html","../../../projects/ui-kit/pagination/mesgflow-ui-kit-pagination.ts"],"sourcesContent":["export type PaginationItem = number | 'ellipsis-start' | 'ellipsis-end';\r\n\r\n/**\r\n * Görünen sayfa öğeleri — SABİT uzunlukta: `2 × boundaries + 2 × siblings + 3` (sayfa sayısı\r\n * bundan azsa hepsi). Böylece sayfa değiştikçe öğe sayısı oynamaz, düğmeler zıplamaz (Table\r\n * sayfalamasındaki değişken uzunluklu listenin aksine). Üç nokta tek bir sayfanın yerini\r\n * tutuyorsa üç nokta yerine o sayfa gösterilir (… yalnızca ≥2 sayfayı gizler).\r\n *\r\n * `paginationRange(6, 20)` → `[1, 'ellipsis-start', 5, 6, 7, 'ellipsis-end', 20]`\r\n */\r\nexport function paginationRange(\r\n current: number,\r\n pageCount: number,\r\n siblings = 1,\r\n boundaries = 1,\r\n): PaginationItem[] {\r\n const range = (from: number, to: number) =>\r\n Array.from({ length: Math.max(0, to - from + 1) }, (_, i) => from + i);\r\n\r\n const slots = 2 * boundaries + 2 * siblings + 3;\r\n if (pageCount <= slots) return range(1, pageCount);\r\n\r\n const page = Math.min(Math.max(current, 1), pageCount);\r\n const startPages = range(1, boundaries);\r\n const endPages = range(pageCount - boundaries + 1, pageCount);\r\n\r\n // Kardeş penceresi kenarlara yaklaşınca kayar — toplam uzunluk sabit kalsın.\r\n const siblingsStart = Math.max(\r\n Math.min(page - siblings, pageCount - boundaries - siblings * 2 - 1),\r\n boundaries + 2,\r\n );\r\n const siblingsEnd = Math.min(\r\n Math.max(page + siblings, boundaries + siblings * 2 + 2),\r\n pageCount - boundaries - 1,\r\n );\r\n\r\n return [\r\n ...startPages,\r\n siblingsStart > boundaries + 2 ? 'ellipsis-start' : boundaries + 1,\r\n ...range(siblingsStart, siblingsEnd),\r\n siblingsEnd < pageCount - boundaries - 1 ? 'ellipsis-end' : pageCount - boundaries,\r\n ...endPages,\r\n ] as PaginationItem[];\r\n}\r\n","import { Component, booleanAttribute, computed, inject, input, model } from '@angular/core';\r\nimport { MF_PAGINATION_LABELS, cn, focusRecipe } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { paginationRange } from './pagination-range';\r\n\r\nconst CELL_BASE =\r\n 'relative inline-flex shrink-0 cursor-pointer appearance-none items-center justify-center rounded-md border-0 bg-transparent px-2 ' +\r\n 'font-medium tabular-nums transition-colors duration-fast ease-emphasis active:scale-[0.99] ' +\r\n focusRecipe +\r\n ' ' +\r\n 'disabled:pointer-events-none disabled:opacity-50 disabled:active:scale-100';\r\n\r\nconst SIZE = { sm: 'h-8 min-w-8 text-xs', md: 'h-9 min-w-9 text-sm' } as const;\r\n\r\n/**\r\n * `<mf-pagination [pageCount]=\"20\" [(page)]=\"page\" />`\r\n *\r\n * Tablo dışı listeler (kart ızgarası, arama sonuçları) için bağımsız sayfalama. Table'ın\r\n * kendi sayfalamasıyla AYNI görsel dil: aktif sayfa nötr zemin + alt kenarda 2px marka rayı\r\n * (\"buradasın\" motifi), dolu blok değil.\r\n *\r\n * Öğe sayısı sabittir (bkz. `paginationRange`) — sayfa değiştikçe düğmeler kaymaz. `compact`:\r\n * sayı listesi yerine \"Sayfa 3 / 20\" (dar alanlar, mobil). `<nav>` landmark'ı + aktif sayfada\r\n * `aria-current=\"page\"`; sayfa düğmeleri \"Page 3\" gibi tam adla duyurulur; üç nokta gizlidir.\r\n */\r\n@Component({\r\n selector: 'mf-pagination',\r\n exportAs: 'mfPagination',\r\n imports: [Icon],\r\n host: { class: 'block' },\r\n templateUrl: './pagination.html',\r\n})\r\nexport class Pagination {\r\n readonly page = model(1);\r\n readonly pageCount = input.required<number>();\r\n /** Aktif sayfanın iki yanında gösterilecek sayfa sayısı. */\r\n readonly siblings = input(1);\r\n /** İlk/son sayfaya atlama düğmeleri. */\r\n readonly showEdges = input(false, { transform: booleanAttribute });\r\n readonly compact = input(false, { transform: booleanAttribute });\r\n readonly size = input<'sm' | 'md'>('md');\r\n /** Verilmezse `MfLabels.pagination.navAriaLabel` — sayfada birden çok sayfalama varsa ayırt edin. */\r\n readonly ariaLabel = input<string>();\r\n\r\n protected readonly labels = inject(MF_PAGINATION_LABELS);\r\n protected readonly effectiveAriaLabel = computed(\r\n () => this.ariaLabel() ?? this.labels().navAriaLabel,\r\n );\r\n protected readonly safeCount = computed(() => Math.max(1, Math.floor(this.pageCount())));\r\n protected readonly current = computed(() => Math.min(Math.max(1, this.page()), this.safeCount()));\r\n protected readonly items = computed(() =>\r\n paginationRange(this.current(), this.safeCount(), this.siblings()),\r\n );\r\n\r\n protected cell(active = false): string {\r\n return cn(\r\n CELL_BASE,\r\n SIZE[this.size()],\r\n active\r\n ? 'bg-surface-alt font-semibold text-fg'\r\n : 'text-fg-muted hover:bg-state-hover hover:text-fg',\r\n active &&\r\n \"after:absolute after:inset-x-2 after:bottom-0 after:h-0.5 after:rounded-full after:bg-accent-fill after:content-['']\",\r\n );\r\n }\r\n\r\n protected goTo(page: number): void {\r\n const next = Math.min(Math.max(1, page), this.safeCount());\r\n if (next !== this.current()) this.page.set(next);\r\n }\r\n}\r\n","<nav class=\"flex items-center gap-0.5\" [attr.aria-label]=\"effectiveAriaLabel()\">\r\n @if (showEdges()) {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === 1\"\r\n [attr.aria-label]=\"labels().first\"\r\n (click)=\"goTo(1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">first_page</span>\r\n </button>\r\n }\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === 1\"\r\n [attr.aria-label]=\"labels().previous\"\r\n (click)=\"goTo(current() - 1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_left</span>\r\n </button>\r\n\r\n @if (compact()) {\r\n <span class=\"px-2 text-sm text-fg-muted tabular-nums\" aria-live=\"polite\">\r\n {{ labels().page }} {{ current() }} / {{ safeCount() }}\r\n </span>\r\n } @else {\r\n @for (item of items(); track item) {\r\n @if (item === 'ellipsis-start' || item === 'ellipsis-end') {\r\n <span\r\n aria-hidden=\"true\"\r\n class=\"inline-flex min-w-8 items-center justify-center text-sm text-fg-subtle select-none\"\r\n >…</span\r\n >\r\n } @else {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell(item === current())\"\r\n [attr.aria-current]=\"item === current() ? 'page' : null\"\r\n [attr.aria-label]=\"labels().page + ' ' + item\"\r\n (click)=\"goTo(item)\"\r\n >\r\n {{ item }}\r\n </button>\r\n }\r\n }\r\n }\r\n\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === safeCount()\"\r\n [attr.aria-label]=\"labels().next\"\r\n (click)=\"goTo(current() + 1)\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">chevron_right</span>\r\n </button>\r\n @if (showEdges()) {\r\n <button\r\n type=\"button\"\r\n [class]=\"cell()\"\r\n [disabled]=\"current() === safeCount()\"\r\n [attr.aria-label]=\"labels().last\"\r\n (click)=\"goTo(safeCount())\"\r\n >\r\n <span mfIcon [size]=\"16\" class=\"rtl:-scale-x-100\">last_page</span>\r\n </button>\r\n }\r\n</nav>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { model, input, inject, computed, signal, forwardRef, Component } from '@angular/core';
|
|
2
|
+
import { model, input, booleanAttribute, inject, computed, signal, forwardRef, Component } from '@angular/core';
|
|
3
3
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
4
4
|
import { ValueAccessorBase, MF_PASSWORD_INPUT_LABELS } from '@mesgflow/ui-kit/core';
|
|
5
5
|
import { Icon } from '@mesgflow/ui-kit/icon';
|
|
@@ -12,33 +12,56 @@ import { Input, InputGroup, InputSuffix } from '@mesgflow/ui-kit/input';
|
|
|
12
12
|
* kullanma deseni). `type="password"`/`"text"` arasında geçiş SADECE
|
|
13
13
|
* görünürlük içindir — değer her zaman `value` model'inde düz metin olarak
|
|
14
14
|
* tutulur.
|
|
15
|
+
*
|
|
16
|
+
* Parola yöneticisi uyumu: `autocomplete` (varsayılan `current-password`) ve
|
|
17
|
+
* `name` iç `<input>`'a iletilir; `autocapitalize="off"`/`spellcheck="false"`
|
|
18
|
+
* sabit — parola görünür moda (`type="text"`) geçtiğinde de mobil klavye büyük
|
|
19
|
+
* harfe çevirmez, yazım denetimi parolayı bir sözlük servisine göndermez.
|
|
20
|
+
* Signal Forms `[formField]` bağlandığında `name`/`required`/`readonly`/`disabled`
|
|
21
|
+
* alan durumundan OTOMATİK doldurulur.
|
|
15
22
|
*/
|
|
16
23
|
class PasswordInput extends ValueAccessorBase {
|
|
17
24
|
value = model('', /* @ts-ignore */
|
|
18
25
|
...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
19
26
|
placeholder = input('', /* @ts-ignore */
|
|
20
27
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
21
|
-
disabled = input(false, /*
|
|
22
|
-
...(ngDevMode ?
|
|
23
|
-
|
|
24
|
-
|
|
28
|
+
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
29
|
+
hasError = input(false, { ...(ngDevMode ? { debugName: "hasError" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
30
|
+
/** İç `<input>`'un id'si — harici bir `<label for>` / `mf-field for` ile ilişkilendirmek için. */
|
|
31
|
+
inputId = input(/* @ts-ignore */
|
|
32
|
+
...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
25
33
|
ariaLabel = input('', /* @ts-ignore */
|
|
26
34
|
...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
27
|
-
fullWidth = input(false, /*
|
|
28
|
-
...(ngDevMode ? [{ debugName: "fullWidth" }] : /* istanbul ignore next */ []));
|
|
35
|
+
fullWidth = input(false, { ...(ngDevMode ? { debugName: "fullWidth" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
29
36
|
showLabel = input(/* @ts-ignore */
|
|
30
37
|
...(ngDevMode ? [undefined, { debugName: "showLabel" }] : /* istanbul ignore next */ []));
|
|
31
38
|
hideLabel = input(/* @ts-ignore */
|
|
32
39
|
...(ngDevMode ? [undefined, { debugName: "hideLabel" }] : /* istanbul ignore next */ []));
|
|
40
|
+
/** Parola yöneticisi ipucu — bkz. `PasswordAutocomplete`. */
|
|
41
|
+
autocomplete = input('current-password', /* @ts-ignore */
|
|
42
|
+
...(ngDevMode ? [{ debugName: "autocomplete" }] : /* istanbul ignore next */ []));
|
|
43
|
+
/** İç `<input>`'un `name`'i — form gönderimi ve parola yöneticilerinin alanı tanıması için. */
|
|
44
|
+
name = input(/* @ts-ignore */
|
|
45
|
+
...(ngDevMode ? [undefined, { debugName: "name" }] : /* istanbul ignore next */ []));
|
|
46
|
+
required = input(false, { ...(ngDevMode ? { debugName: "required" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
47
|
+
readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
33
48
|
passwordLabels = inject(MF_PASSWORD_INPUT_LABELS);
|
|
34
49
|
effectiveShowLabel = computed(() => this.showLabel() ?? this.passwordLabels().show, /* @ts-ignore */
|
|
35
50
|
...(ngDevMode ? [{ debugName: "effectiveShowLabel" }] : /* istanbul ignore next */ []));
|
|
36
51
|
effectiveHideLabel = computed(() => this.hideLabel() ?? this.passwordLabels().hide, /* @ts-ignore */
|
|
37
52
|
...(ngDevMode ? [{ debugName: "effectiveHideLabel" }] : /* istanbul ignore next */ []));
|
|
53
|
+
/** Reactive Forms `control.disable()` — `disabled` girdisiyle VEYA'lanır. */
|
|
54
|
+
formDisabled = signal(false, /* @ts-ignore */
|
|
55
|
+
...(ngDevMode ? [{ debugName: "formDisabled" }] : /* istanbul ignore next */ []));
|
|
56
|
+
isDisabled = computed(() => this.disabled() || this.formDisabled(), /* @ts-ignore */
|
|
57
|
+
...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
|
|
38
58
|
visible = signal(false, /* @ts-ignore */
|
|
39
59
|
...(ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []));
|
|
40
60
|
writeValue(value) {
|
|
41
|
-
this.value.set(value);
|
|
61
|
+
this.value.set(value ?? '');
|
|
62
|
+
}
|
|
63
|
+
setDisabledState(disabled) {
|
|
64
|
+
this.formDisabled.set(disabled);
|
|
42
65
|
}
|
|
43
66
|
toggle() {
|
|
44
67
|
this.visible.update((v) => !v);
|
|
@@ -47,70 +70,17 @@ class PasswordInput extends ValueAccessorBase {
|
|
|
47
70
|
this.value.set(raw);
|
|
48
71
|
this.onChange(raw);
|
|
49
72
|
}
|
|
50
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
51
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.
|
|
73
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PasswordInput, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
74
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: PasswordInput, isStandalone: true, selector: "mf-password-input", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, hideLabel: { classPropertyName: "hideLabel", publicName: "hideLabel", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.w-full": "fullWidth()" }, classAttribute: "inline-flex" }, providers: [
|
|
52
75
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordInput), multi: true },
|
|
53
|
-
], exportAs: ["mfPasswordInput"], usesInheritance: true, ngImport: i0, template:
|
|
54
|
-
<mf-input-group [hasError]="hasError()" [disabled]="disabled()">
|
|
55
|
-
<input
|
|
56
|
-
mfInput
|
|
57
|
-
[type]="visible() ? 'text' : 'password'"
|
|
58
|
-
class="border-0 bg-transparent p-0 shadow-none focus-visible:outline-none"
|
|
59
|
-
[value]="value()"
|
|
60
|
-
[disabled]="disabled()"
|
|
61
|
-
[placeholder]="placeholder()"
|
|
62
|
-
[attr.aria-label]="ariaLabel() || null"
|
|
63
|
-
(input)="onInput($any($event.target).value)"
|
|
64
|
-
(blur)="onTouched()"
|
|
65
|
-
/>
|
|
66
|
-
<button
|
|
67
|
-
mfInputSuffix
|
|
68
|
-
type="button"
|
|
69
|
-
class="appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg"
|
|
70
|
-
[attr.aria-label]="visible() ? effectiveHideLabel() : effectiveShowLabel()"
|
|
71
|
-
(click)="toggle()"
|
|
72
|
-
>
|
|
73
|
-
<span mfIcon [size]="16">{{ visible() ? 'visibility_off' : 'visibility' }}</span>
|
|
74
|
-
</button>
|
|
75
|
-
</mf-input-group>
|
|
76
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }, { kind: "component", type: InputGroup, selector: "mf-input-group", inputs: ["size", "disabled", "hasError", "padded", "wrap"], exportAs: ["mfInputGroup"] }, { kind: "directive", type: InputSuffix, selector: "[mfInputSuffix]", inputs: ["addon"] }] });
|
|
76
|
+
], exportAs: ["mfPasswordInput"], usesInheritance: true, ngImport: i0, template: "<mf-input-group [hasError]=\"hasError()\" [disabled]=\"isDisabled()\">\r\n <input\r\n mfInput\r\n [attr.id]=\"inputId() || null\"\r\n [attr.name]=\"name() || null\"\r\n [attr.autocomplete]=\"autocomplete()\"\r\n autocapitalize=\"off\"\r\n spellcheck=\"false\"\r\n [type]=\"visible() ? 'text' : 'password'\"\r\n class=\"border-0 bg-transparent p-0 shadow-none focus-visible:outline-none\"\r\n [value]=\"value()\"\r\n [disabled]=\"isDisabled()\"\r\n [required]=\"required()\"\r\n [readOnly]=\"readonly()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n (input)=\"onInput($any($event.target).value)\"\r\n (blur)=\"onTouched()\"\r\n />\r\n <button\r\n mfInputSuffix\r\n type=\"button\"\r\n class=\"appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n [disabled]=\"isDisabled()\"\r\n [attr.aria-label]=\"visible() ? effectiveHideLabel() : effectiveShowLabel()\"\r\n (click)=\"toggle()\"\r\n >\r\n <span mfIcon [size]=\"16\">{{ visible() ? 'visibility_off' : 'visibility' }}</span>\r\n </button>\r\n</mf-input-group>\r\n", dependencies: [{ kind: "directive", type: Icon, selector: "span[mfIcon]", inputs: ["size", "filled"] }, { kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }, { kind: "component", type: InputGroup, selector: "mf-input-group", inputs: ["size", "disabled", "hasError", "padded", "wrap"], exportAs: ["mfInputGroup"] }, { kind: "directive", type: InputSuffix, selector: "[mfInputSuffix]", inputs: ["addon"] }] });
|
|
77
77
|
}
|
|
78
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
78
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: PasswordInput, decorators: [{
|
|
79
79
|
type: Component,
|
|
80
|
-
args: [{
|
|
81
|
-
selector: 'mf-password-input',
|
|
82
|
-
exportAs: 'mfPasswordInput',
|
|
83
|
-
imports: [Icon, Input, InputGroup, InputSuffix],
|
|
84
|
-
host: { class: 'inline-flex', '[class.w-full]': 'fullWidth()' },
|
|
85
|
-
template: `
|
|
86
|
-
<mf-input-group [hasError]="hasError()" [disabled]="disabled()">
|
|
87
|
-
<input
|
|
88
|
-
mfInput
|
|
89
|
-
[type]="visible() ? 'text' : 'password'"
|
|
90
|
-
class="border-0 bg-transparent p-0 shadow-none focus-visible:outline-none"
|
|
91
|
-
[value]="value()"
|
|
92
|
-
[disabled]="disabled()"
|
|
93
|
-
[placeholder]="placeholder()"
|
|
94
|
-
[attr.aria-label]="ariaLabel() || null"
|
|
95
|
-
(input)="onInput($any($event.target).value)"
|
|
96
|
-
(blur)="onTouched()"
|
|
97
|
-
/>
|
|
98
|
-
<button
|
|
99
|
-
mfInputSuffix
|
|
100
|
-
type="button"
|
|
101
|
-
class="appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg"
|
|
102
|
-
[attr.aria-label]="visible() ? effectiveHideLabel() : effectiveShowLabel()"
|
|
103
|
-
(click)="toggle()"
|
|
104
|
-
>
|
|
105
|
-
<span mfIcon [size]="16">{{ visible() ? 'visibility_off' : 'visibility' }}</span>
|
|
106
|
-
</button>
|
|
107
|
-
</mf-input-group>
|
|
108
|
-
`,
|
|
109
|
-
providers: [
|
|
80
|
+
args: [{ selector: 'mf-password-input', exportAs: 'mfPasswordInput', imports: [Icon, Input, InputGroup, InputSuffix], host: { class: 'inline-flex', '[class.w-full]': 'fullWidth()' }, providers: [
|
|
110
81
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordInput), multi: true },
|
|
111
|
-
],
|
|
112
|
-
|
|
113
|
-
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hasError: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasError", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], hideLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideLabel", required: false }] }] } });
|
|
82
|
+
], template: "<mf-input-group [hasError]=\"hasError()\" [disabled]=\"isDisabled()\">\r\n <input\r\n mfInput\r\n [attr.id]=\"inputId() || null\"\r\n [attr.name]=\"name() || null\"\r\n [attr.autocomplete]=\"autocomplete()\"\r\n autocapitalize=\"off\"\r\n spellcheck=\"false\"\r\n [type]=\"visible() ? 'text' : 'password'\"\r\n class=\"border-0 bg-transparent p-0 shadow-none focus-visible:outline-none\"\r\n [value]=\"value()\"\r\n [disabled]=\"isDisabled()\"\r\n [required]=\"required()\"\r\n [readOnly]=\"readonly()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n (input)=\"onInput($any($event.target).value)\"\r\n (blur)=\"onTouched()\"\r\n />\r\n <button\r\n mfInputSuffix\r\n type=\"button\"\r\n class=\"appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n [disabled]=\"isDisabled()\"\r\n [attr.aria-label]=\"visible() ? effectiveHideLabel() : effectiveShowLabel()\"\r\n (click)=\"toggle()\"\r\n >\r\n <span mfIcon [size]=\"16\">{{ visible() ? 'visibility_off' : 'visibility' }}</span>\r\n </button>\r\n</mf-input-group>\r\n" }]
|
|
83
|
+
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hasError: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasError", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], hideLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideLabel", required: false }] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }] } });
|
|
114
84
|
|
|
115
85
|
/**
|
|
116
86
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mesgflow-ui-kit-password-input.mjs","sources":["../../../projects/ui-kit/password-input/password-input.ts","../../../projects/ui-kit/password-input/mesgflow-ui-kit-password-input.ts"],"sourcesContent":["import { Component, computed, forwardRef, inject, input, model, signal } from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { MF_PASSWORD_INPUT_LABELS, ValueAccessorBase } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Input, InputGroup, InputSuffix } from '@mesgflow/ui-kit/input';\r\n\r\n/**\r\n * `<mf-password-input [(value)]=\"password\" />` — `InputGroup` üstüne kompoze\r\n * edilmiş, sağda göster/gizle düğmesi taşıyan parola alanı (emsal:\r\n * `NumberInput`/`DateRangePicker`'ın AYNI `mf-input-group` kabuğunu\r\n * kullanma deseni). `type=\"password\"`/`\"text\"` arasında geçiş SADECE\r\n * görünürlük içindir — değer her zaman `value` model'inde düz metin olarak\r\n * tutulur.\r\n */\r\n@Component({\r\n selector: 'mf-password-input',\r\n exportAs: 'mfPasswordInput',\r\n imports: [Icon, Input, InputGroup, InputSuffix],\r\n host: { class: 'inline-flex', '[class.w-full]': 'fullWidth()' },\r\n template: `\r\n <mf-input-group [hasError]=\"hasError()\" [disabled]=\"disabled()\">\r\n <input\r\n mfInput\r\n [type]=\"visible() ? 'text' : 'password'\"\r\n class=\"border-0 bg-transparent p-0 shadow-none focus-visible:outline-none\"\r\n [value]=\"value()\"\r\n [disabled]=\"disabled()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n (input)=\"onInput($any($event.target).value)\"\r\n (blur)=\"onTouched()\"\r\n />\r\n <button\r\n mfInputSuffix\r\n type=\"button\"\r\n class=\"appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n [attr.aria-label]=\"visible() ? effectiveHideLabel() : effectiveShowLabel()\"\r\n (click)=\"toggle()\"\r\n >\r\n <span mfIcon [size]=\"16\">{{ visible() ? 'visibility_off' : 'visibility' }}</span>\r\n </button>\r\n </mf-input-group>\r\n `,\r\n providers: [\r\n { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordInput), multi: true },\r\n ],\r\n})\r\nexport class PasswordInput extends ValueAccessorBase<string> implements ControlValueAccessor {\r\n readonly value = model('');\r\n readonly placeholder = input('');\r\n readonly disabled = input(false);\r\n readonly hasError = input(false);\r\n readonly ariaLabel = input('');\r\n readonly fullWidth = input(false);\r\n readonly showLabel = input<string>();\r\n readonly hideLabel = input<string>();\r\n\r\n private readonly passwordLabels = inject(MF_PASSWORD_INPUT_LABELS);\r\n protected readonly effectiveShowLabel = computed(\r\n () => this.showLabel() ?? this.passwordLabels().show,\r\n );\r\n protected readonly effectiveHideLabel = computed(\r\n () => this.hideLabel() ?? this.passwordLabels().hide,\r\n );\r\n\r\n protected readonly visible = signal(false);\r\n\r\n writeValue(value: string): void {\r\n this.value.set(value);\r\n }\r\n\r\n protected toggle(): void {\r\n this.visible.update((v) => !v);\r\n }\r\n\r\n protected onInput(raw: string): void {\r\n this.value.set(raw);\r\n this.onChange(raw);\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"mesgflow-ui-kit-password-input.mjs","sources":["../../../projects/ui-kit/password-input/password-input.ts","../../../projects/ui-kit/password-input/password-input.html","../../../projects/ui-kit/password-input/mesgflow-ui-kit-password-input.ts"],"sourcesContent":["import {\r\n Component,\r\n booleanAttribute,\r\n computed,\r\n forwardRef,\r\n inject,\r\n input,\r\n model,\r\n signal,\r\n} from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { MF_PASSWORD_INPUT_LABELS, ValueAccessorBase } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Input, InputGroup, InputSuffix } from '@mesgflow/ui-kit/input';\r\n\r\n/**\r\n * Parola alanının `autocomplete` ipucu — parola yöneticileri/tarayıcı bunu okur:\r\n * - `current-password` (varsayılan): giriş formu — kayıtlı parolayı doldurur.\r\n * - `new-password`: kayıt/parola değiştirme — güçlü parola ÖNERİR, eskisini doldurmaz\r\n * (hem \"yeni\" hem \"tekrar\" alanında kullanılır).\r\n * - `off`: modern tarayıcılar parola alanlarında çoğunlukla YOK SAYAR — sadece\r\n * gerçekten tek kullanımlık alanlarda (ör. API anahtarı onayı) kullanın.\r\n * - Diğer geçerli token dizileri de kabul edilir (ör. `section-billing current-password`).\r\n */\r\nexport type PasswordAutocomplete = 'current-password' | 'new-password' | 'off' | (string & {});\r\n\r\n/**\r\n * `<mf-password-input [(value)]=\"password\" />` — `InputGroup` üstüne kompoze\r\n * edilmiş, sağda göster/gizle düğmesi taşıyan parola alanı (emsal:\r\n * `NumberInput`/`DateRangePicker`'ın AYNI `mf-input-group` kabuğunu\r\n * kullanma deseni). `type=\"password\"`/`\"text\"` arasında geçiş SADECE\r\n * görünürlük içindir — değer her zaman `value` model'inde düz metin olarak\r\n * tutulur.\r\n *\r\n * Parola yöneticisi uyumu: `autocomplete` (varsayılan `current-password`) ve\r\n * `name` iç `<input>`'a iletilir; `autocapitalize=\"off\"`/`spellcheck=\"false\"`\r\n * sabit — parola görünür moda (`type=\"text\"`) geçtiğinde de mobil klavye büyük\r\n * harfe çevirmez, yazım denetimi parolayı bir sözlük servisine göndermez.\r\n * Signal Forms `[formField]` bağlandığında `name`/`required`/`readonly`/`disabled`\r\n * alan durumundan OTOMATİK doldurulur.\r\n */\r\n@Component({\r\n selector: 'mf-password-input',\r\n exportAs: 'mfPasswordInput',\r\n imports: [Icon, Input, InputGroup, InputSuffix],\r\n host: { class: 'inline-flex', '[class.w-full]': 'fullWidth()' },\r\n templateUrl: './password-input.html',\r\n providers: [\r\n { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => PasswordInput), multi: true },\r\n ],\r\n})\r\nexport class PasswordInput extends ValueAccessorBase<string> implements ControlValueAccessor {\r\n readonly value = model('');\r\n readonly placeholder = input('');\r\n readonly disabled = input(false, { transform: booleanAttribute });\r\n readonly hasError = input(false, { transform: booleanAttribute });\r\n /** İç `<input>`'un id'si — harici bir `<label for>` / `mf-field for` ile ilişkilendirmek için. */\r\n readonly inputId = input<string>();\r\n readonly ariaLabel = input('');\r\n readonly fullWidth = input(false, { transform: booleanAttribute });\r\n readonly showLabel = input<string>();\r\n readonly hideLabel = input<string>();\r\n /** Parola yöneticisi ipucu — bkz. `PasswordAutocomplete`. */\r\n readonly autocomplete = input<PasswordAutocomplete>('current-password');\r\n /** İç `<input>`'un `name`'i — form gönderimi ve parola yöneticilerinin alanı tanıması için. */\r\n readonly name = input<string>();\r\n readonly required = input(false, { transform: booleanAttribute });\r\n readonly readonly = input(false, { transform: booleanAttribute });\r\n\r\n private readonly passwordLabels = inject(MF_PASSWORD_INPUT_LABELS);\r\n protected readonly effectiveShowLabel = computed(\r\n () => this.showLabel() ?? this.passwordLabels().show,\r\n );\r\n protected readonly effectiveHideLabel = computed(\r\n () => this.hideLabel() ?? this.passwordLabels().hide,\r\n );\r\n\r\n /** Reactive Forms `control.disable()` — `disabled` girdisiyle VEYA'lanır. */\r\n private readonly formDisabled = signal(false);\r\n protected readonly isDisabled = computed(() => this.disabled() || this.formDisabled());\r\n\r\n protected readonly visible = signal(false);\r\n\r\n writeValue(value: string | null): void {\r\n this.value.set(value ?? '');\r\n }\r\n\r\n setDisabledState(disabled: boolean): void {\r\n this.formDisabled.set(disabled);\r\n }\r\n\r\n protected toggle(): void {\r\n this.visible.update((v) => !v);\r\n }\r\n\r\n protected onInput(raw: string): void {\r\n this.value.set(raw);\r\n this.onChange(raw);\r\n }\r\n}\r\n","<mf-input-group [hasError]=\"hasError()\" [disabled]=\"isDisabled()\">\r\n <input\r\n mfInput\r\n [attr.id]=\"inputId() || null\"\r\n [attr.name]=\"name() || null\"\r\n [attr.autocomplete]=\"autocomplete()\"\r\n autocapitalize=\"off\"\r\n spellcheck=\"false\"\r\n [type]=\"visible() ? 'text' : 'password'\"\r\n class=\"border-0 bg-transparent p-0 shadow-none focus-visible:outline-none\"\r\n [value]=\"value()\"\r\n [disabled]=\"isDisabled()\"\r\n [required]=\"required()\"\r\n [readOnly]=\"readonly()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n (input)=\"onInput($any($event.target).value)\"\r\n (blur)=\"onTouched()\"\r\n />\r\n <button\r\n mfInputSuffix\r\n type=\"button\"\r\n class=\"appearance-none border-0 bg-transparent p-0 transition-colors duration-fast ease-emphasis hover:text-fg\"\r\n [disabled]=\"isDisabled()\"\r\n [attr.aria-label]=\"visible() ? effectiveHideLabel() : effectiveShowLabel()\"\r\n (click)=\"toggle()\"\r\n >\r\n <span mfIcon [size]=\"16\">{{ visible() ? 'visibility_off' : 'visibility' }}</span>\r\n </button>\r\n</mf-input-group>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|