@mesgflow/ui-kit 0.8.0 → 0.10.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/fesm2022/mesgflow-ui-kit-badge.mjs +20 -6
- package/fesm2022/mesgflow-ui-kit-badge.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-blocks.mjs +1 -1
- package/fesm2022/mesgflow-ui-kit-blocks.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-combobox.mjs +1 -1
- package/fesm2022/mesgflow-ui-kit-combobox.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-field.mjs +36 -5
- package/fesm2022/mesgflow-ui-kit-field.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-input.mjs +104 -96
- package/fesm2022/mesgflow-ui-kit-input.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-menu.mjs +198 -16
- package/fesm2022/mesgflow-ui-kit-menu.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-password-input.mjs +17 -6
- package/fesm2022/mesgflow-ui-kit-password-input.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-popover.mjs +43 -13
- package/fesm2022/mesgflow-ui-kit-popover.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-segmented-control.mjs +31 -19
- package/fesm2022/mesgflow-ui-kit-segmented-control.mjs.map +1 -1
- package/fesm2022/mesgflow-ui-kit-split-button.mjs +1 -1
- package/fesm2022/mesgflow-ui-kit-split-button.mjs.map +1 -1
- package/package.json +1 -1
- package/tokens.json +1583 -1583
- package/types/mesgflow-ui-kit-badge.d.ts +9 -3
- package/types/mesgflow-ui-kit-field.d.ts +24 -2
- package/types/mesgflow-ui-kit-input.d.ts +8 -6
- package/types/mesgflow-ui-kit-menu.d.ts +64 -8
- package/types/mesgflow-ui-kit-password-input.d.ts +11 -2
- package/types/mesgflow-ui-kit-popover.d.ts +32 -7
- package/types/mesgflow-ui-kit-segmented-control.d.ts +19 -11
|
@@ -20,7 +20,7 @@ import { cva } from 'class-variance-authority';
|
|
|
20
20
|
* `color-mix` her zeminde AYRI karışıp `check:contrast`'ta dört yüzeyde de
|
|
21
21
|
* doğrulanıyor (bkz. projects/ui-kit/README.md "Token mimarisi").
|
|
22
22
|
*/
|
|
23
|
-
const badgeVariants = cva('inline-flex items-center gap-1.5 rounded-full
|
|
23
|
+
const badgeVariants = cva('inline-flex items-center gap-1.5 rounded-full ' +
|
|
24
24
|
"before:block before:h-1.5 before:w-1.5 before:shrink-0 before:rounded-full before:bg-current before:content-['']", {
|
|
25
25
|
variants: {
|
|
26
26
|
tone: {
|
|
@@ -32,25 +32,39 @@ const badgeVariants = cva('inline-flex items-center gap-1.5 rounded-full font-mo
|
|
|
32
32
|
info: 'bg-info-tint text-info-tint-fg',
|
|
33
33
|
help: 'bg-help-tint text-help-tint-fg',
|
|
34
34
|
},
|
|
35
|
+
/**
|
|
36
|
+
* `eyebrow` (varsayılan): mono + BÜYÜK harf + geniş aralık mikro-etiket. `sentence`:
|
|
37
|
+
* gövde yazı tipi, yazıldığı gibi, normal aralık — tablo/durum etiketlerinde
|
|
38
|
+
* ("Hazırlanıyor", "Aktif") daha sakin; renk ve nokta göstergesi aynı.
|
|
39
|
+
*/
|
|
40
|
+
casing: {
|
|
41
|
+
eyebrow: 'font-mono text-eyebrow uppercase',
|
|
42
|
+
sentence: 'font-sans text-xs font-medium normal-case tracking-normal',
|
|
43
|
+
},
|
|
35
44
|
/** `md` öncekiyle (tek boyutlu dönem) BİREBİR aynı dolgu — `sm` tablo hücresi/chip gibi sık dizilen bağlamlar için. */
|
|
36
45
|
size: {
|
|
37
46
|
sm: 'py-0.5 pe-2 ps-1.5',
|
|
38
47
|
md: 'py-1 pe-2.5 ps-2',
|
|
39
48
|
},
|
|
40
49
|
},
|
|
41
|
-
defaultVariants: { tone: 'neutral', size: 'md' },
|
|
50
|
+
defaultVariants: { tone: 'neutral', size: 'md', casing: 'eyebrow' },
|
|
42
51
|
});
|
|
43
52
|
|
|
44
|
-
/**
|
|
53
|
+
/**
|
|
54
|
+
* `<span mfBadge tone="success">Aktif</span>` — cümle biçimi için
|
|
55
|
+
* `<span mfBadge tone="warning" casing="sentence">Hazırlanıyor</span>`.
|
|
56
|
+
*/
|
|
45
57
|
class Badge {
|
|
46
58
|
tone = input('neutral', /* @ts-ignore */
|
|
47
59
|
...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
|
|
48
60
|
size = input('md', /* @ts-ignore */
|
|
49
61
|
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
50
|
-
|
|
62
|
+
casing = input('eyebrow', /* @ts-ignore */
|
|
63
|
+
...(ngDevMode ? [{ debugName: "casing" }] : /* istanbul ignore next */ []));
|
|
64
|
+
classes = computed(() => cn(badgeVariants({ tone: this.tone(), size: this.size(), casing: this.casing() })), /* @ts-ignore */
|
|
51
65
|
...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
|
|
52
66
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Badge, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
53
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: Badge, isStandalone: true, selector: "span[mfBadge]", inputs: { tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0 });
|
|
67
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: Badge, isStandalone: true, selector: "span[mfBadge]", inputs: { tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, casing: { classPropertyName: "casing", publicName: "casing", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0 });
|
|
54
68
|
}
|
|
55
69
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Badge, decorators: [{
|
|
56
70
|
type: Directive,
|
|
@@ -58,7 +72,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
58
72
|
selector: 'span[mfBadge]',
|
|
59
73
|
host: { '[class]': 'classes()' },
|
|
60
74
|
}]
|
|
61
|
-
}], propDecorators: { tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
|
|
75
|
+
}], propDecorators: { tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], casing: [{ type: i0.Input, args: [{ isSignal: true, alias: "casing", required: false }] }] } });
|
|
62
76
|
|
|
63
77
|
/**
|
|
64
78
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mesgflow-ui-kit-badge.mjs","sources":["../../../projects/ui-kit/badge/badge.variants.ts","../../../projects/ui-kit/badge/badge.ts","../../../projects/ui-kit/badge/mesgflow-ui-kit-badge.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\n/**\r\n * Kullanıcının beğendiği bir Artifact'teki `.pill` deseni birebir uyarlandı:\r\n * mono + büyük harf + geniş harf aralığı + `currentColor` nokta göstergesi\r\n * (`before:`). Bu bileşenin kendisi bu tazelemenin imza motiflerinden biri\r\n * (\"mono mikro-etiket\") — `text-eyebrow` token'ı (tokens/typography.css)\r\n * TAM OLARAK bu dili konuşmak için var (kalın ağırlık + geniş tracking bir\r\n * arada); font-weight/letter-spacing'i elle tekrar YAZMAK yerine doğrudan\r\n * o token kullanılıyor (bkz. plan Faz 1d — sm/md artık FONT BOYUTUNDA değil,\r\n * sadece dolguda ayrışıyor, ikisi de aynı mikro-etiket ölçeğini paylaşıyor).\r\n *\r\n * Renkli tonlar rol token'ı `bg-X-tint text-X-tint-fg` kullanır — spec'in\r\n * \"Soft Tinting\" tekniği: `color-mix()` ile rampanın kendi basamağının %12\r\n * alfası (light çapa 600, dark çapa 400), metin rampanın 800/400 basamağı.\r\n * Rozet her türlü zeminin (kart, tablo satırı, toolbar) üstüne oturabiliyor —\r\n * `color-mix` her zeminde AYRI karışıp `check:contrast`'ta dört yüzeyde de\r\n * doğrulanıyor (bkz. projects/ui-kit/README.md \"Token mimarisi\").\r\n */\r\nexport const badgeVariants = cva(\r\n 'inline-flex items-center gap-1.5 rounded-full
|
|
1
|
+
{"version":3,"file":"mesgflow-ui-kit-badge.mjs","sources":["../../../projects/ui-kit/badge/badge.variants.ts","../../../projects/ui-kit/badge/badge.ts","../../../projects/ui-kit/badge/mesgflow-ui-kit-badge.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\n\r\n/**\r\n * Kullanıcının beğendiği bir Artifact'teki `.pill` deseni birebir uyarlandı:\r\n * mono + büyük harf + geniş harf aralığı + `currentColor` nokta göstergesi\r\n * (`before:`). Bu bileşenin kendisi bu tazelemenin imza motiflerinden biri\r\n * (\"mono mikro-etiket\") — `text-eyebrow` token'ı (tokens/typography.css)\r\n * TAM OLARAK bu dili konuşmak için var (kalın ağırlık + geniş tracking bir\r\n * arada); font-weight/letter-spacing'i elle tekrar YAZMAK yerine doğrudan\r\n * o token kullanılıyor (bkz. plan Faz 1d — sm/md artık FONT BOYUTUNDA değil,\r\n * sadece dolguda ayrışıyor, ikisi de aynı mikro-etiket ölçeğini paylaşıyor).\r\n *\r\n * Renkli tonlar rol token'ı `bg-X-tint text-X-tint-fg` kullanır — spec'in\r\n * \"Soft Tinting\" tekniği: `color-mix()` ile rampanın kendi basamağının %12\r\n * alfası (light çapa 600, dark çapa 400), metin rampanın 800/400 basamağı.\r\n * Rozet her türlü zeminin (kart, tablo satırı, toolbar) üstüne oturabiliyor —\r\n * `color-mix` her zeminde AYRI karışıp `check:contrast`'ta dört yüzeyde de\r\n * doğrulanıyor (bkz. projects/ui-kit/README.md \"Token mimarisi\").\r\n */\r\nexport const badgeVariants = cva(\r\n 'inline-flex items-center gap-1.5 rounded-full ' +\r\n \"before:block before:h-1.5 before:w-1.5 before:shrink-0 before:rounded-full before:bg-current before:content-['']\",\r\n {\r\n variants: {\r\n tone: {\r\n neutral: 'bg-surface-alt text-fg-muted',\r\n primary: 'bg-primary-tint text-primary-tint-fg',\r\n success: 'bg-success-tint text-success-tint-fg',\r\n warning: 'bg-warning-tint text-warning-tint-fg',\r\n danger: 'bg-danger-tint text-danger-tint-fg',\r\n info: 'bg-info-tint text-info-tint-fg',\r\n help: 'bg-help-tint text-help-tint-fg',\r\n },\r\n /**\r\n * `eyebrow` (varsayılan): mono + BÜYÜK harf + geniş aralık mikro-etiket. `sentence`:\r\n * gövde yazı tipi, yazıldığı gibi, normal aralık — tablo/durum etiketlerinde\r\n * (\"Hazırlanıyor\", \"Aktif\") daha sakin; renk ve nokta göstergesi aynı.\r\n */\r\n casing: {\r\n eyebrow: 'font-mono text-eyebrow uppercase',\r\n sentence: 'font-sans text-xs font-medium normal-case tracking-normal',\r\n },\r\n /** `md` öncekiyle (tek boyutlu dönem) BİREBİR aynı dolgu — `sm` tablo hücresi/chip gibi sık dizilen bağlamlar için. */\r\n size: {\r\n sm: 'py-0.5 pe-2 ps-1.5',\r\n md: 'py-1 pe-2.5 ps-2',\r\n },\r\n },\r\n defaultVariants: { tone: 'neutral', size: 'md', casing: 'eyebrow' },\r\n },\r\n);\r\n\r\nexport type BadgeTone = VariantProps<typeof badgeVariants>['tone'];\r\nexport type BadgeSize = VariantProps<typeof badgeVariants>['size'];\r\nexport type BadgeCasing = VariantProps<typeof badgeVariants>['casing'];\r\n","import { Directive, computed, input } from '@angular/core';\r\nimport { cn } from '@mesgflow/ui-kit/core';\r\nimport { badgeVariants, type BadgeCasing, type BadgeSize, type BadgeTone } from './badge.variants';\r\n\r\n/**\r\n * `<span mfBadge tone=\"success\">Aktif</span>` — cümle biçimi için\r\n * `<span mfBadge tone=\"warning\" casing=\"sentence\">Hazırlanıyor</span>`.\r\n */\r\n@Directive({\r\n selector: 'span[mfBadge]',\r\n host: { '[class]': 'classes()' },\r\n})\r\nexport class Badge {\r\n readonly tone = input<BadgeTone>('neutral');\r\n readonly size = input<BadgeSize>('md');\r\n readonly casing = input<BadgeCasing>('eyebrow');\r\n protected readonly classes = computed(() =>\r\n cn(badgeVariants({ tone: this.tone(), size: this.size(), casing: this.casing() })),\r\n );\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAEA;;;;;;;;;;;;;;;;AAgBG;AACI,MAAM,aAAa,GAAG,GAAG,CAC9B,gDAAgD;AAC9C,IAAA,kHAAkH,EACpH;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,OAAO,EAAE,8BAA8B;AACvC,YAAA,OAAO,EAAE,sCAAsC;AAC/C,YAAA,OAAO,EAAE,sCAAsC;AAC/C,YAAA,OAAO,EAAE,sCAAsC;AAC/C,YAAA,MAAM,EAAE,oCAAoC;AAC5C,YAAA,IAAI,EAAE,gCAAgC;AACtC,YAAA,IAAI,EAAE,gCAAgC;AACvC,SAAA;AACD;;;;AAIG;AACH,QAAA,MAAM,EAAE;AACN,YAAA,OAAO,EAAE,kCAAkC;AAC3C,YAAA,QAAQ,EAAE,2DAA2D;AACtE,SAAA;;AAED,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE,oBAAoB;AACxB,YAAA,EAAE,EAAE,kBAAkB;AACvB,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE;AACpE,CAAA;;AC7CH;;;AAGG;MAKU,KAAK,CAAA;IACP,IAAI,GAAG,KAAK,CAAY,SAAS;6EAAC;IAClC,IAAI,GAAG,KAAK,CAAY,IAAI;6EAAC;IAC7B,MAAM,GAAG,KAAK,CAAc,SAAS;+EAAC;AAC5B,IAAA,OAAO,GAAG,QAAQ,CAAC,MACpC,EAAE,CAAC,aAAa,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;gFACnF;uGANU,KAAK,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAL,KAAK,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,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,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,WAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAL,KAAK,EAAA,UAAA,EAAA,CAAA;kBAJjB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,eAAe;AACzB,oBAAA,IAAI,EAAE,EAAE,SAAS,EAAE,WAAW,EAAE;AACjC,iBAAA;;;ACXD;;AAEG;;"}
|
|
@@ -92,7 +92,7 @@ class AuthCard {
|
|
|
92
92
|
});
|
|
93
93
|
}
|
|
94
94
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: AuthCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
95
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: AuthCard, isStandalone: true, selector: "mf-auth-card", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, showRemember: { classPropertyName: "showRemember", publicName: "showRemember", isSignal: true, isRequired: false, transformFunction: null }, showForgotPassword: { classPropertyName: "showForgotPassword", publicName: "showForgotPassword", isSignal: true, isRequired: false, transformFunction: null }, showSignUp: { classPropertyName: "showSignUp", publicName: "showSignUp", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { signIn: "signIn", forgotPassword: "forgotPassword", signUp: "signUp", errorDismissed: "errorDismissed" }, host: { classAttribute: "@container block w-full max-w-sm" }, queries: [{ propertyName: "providers", first: true, predicate: AuthProviders, descendants: true, isSignal: true }], exportAs: ["mfAuthCard"], ngImport: i0, template: "<form class=\"flex flex-col gap-5\" novalidate (submit)=\"submit($event)\">\r\n <div>\r\n <h2 class=\"font-display text-title text-fg\">{{ title() ?? labels().title }}</h2>\r\n <p class=\"mt-1 text-sm text-fg-muted\">{{ description() ?? labels().description }}</p>\r\n </div>\r\n\r\n @if (error()) {\r\n <mf-alert\r\n tone=\"danger\"\r\n [title]=\"labels().errorTitle\"\r\n [dismissible]=\"true\"\r\n (dismissed)=\"errorDismissed.emit()\"\r\n >{{ error() }}</mf-alert\r\n >\r\n }\r\n\r\n @if (providers()) {\r\n <ng-content select=\"[mfAuthProviders]\" />\r\n <mf-divider [label]=\"labels().divider\" />\r\n }\r\n\r\n <mf-field [label]=\"labels().email\" [for]=\"ids.email\" [error]=\"emailError()\" [required]=\"true\">\r\n <input\r\n mfInput\r\n [id]=\"ids.email\"\r\n type=\"email\"\r\n autocomplete=\"email\"\r\n [placeholder]=\"labels().emailPlaceholder\"\r\n [value]=\"email()\"\r\n [hasError]=\"!!emailError()\"\r\n (input)=\"email.set($any($event.target).value)\"\r\n />\r\n </mf-field>\r\n\r\n <div class=\"flex flex-col gap-1.5\">\r\n <div class=\"flex items-center justify-between gap-3\">\r\n <label [for]=\"ids.password\" class=\"text-label text-fg-muted\">{{ labels().password }}</label>\r\n @if (showForgotPassword()) {\r\n <button mfButton type=\"button\" appearance=\"link\" size=\"xs\" (click)=\"forgotPassword.emit()\">\r\n {{ labels().forgotPassword }}\r\n </button>\r\n }\r\n </div>\r\n <mf-password-input\r\n [inputId]=\"ids.password\"\r\n name=\"password\"\r\n autocomplete=\"current-password\"\r\n [required]=\"true\"\r\n [(value)]=\"password\"\r\n [fullWidth]=\"true\"\r\n [hasError]=\"!!passwordError()\"\r\n />\r\n @if (passwordError(); as message) {\r\n <p class=\"text-sm text-danger\" aria-live=\"polite\">{{ message }}</p>\r\n }\r\n </div>\r\n\r\n @if (showRemember()) {\r\n <label class=\"flex items-center gap-2 text-sm text-fg-muted\">\r\n <input\r\n type=\"checkbox\"\r\n mfCheckbox\r\n [checked]=\"remember()\"\r\n (change)=\"remember.set($any($event.target).checked)\"\r\n />\r\n {{ labels().remember }}\r\n </label>\r\n }\r\n\r\n <button mfButton type=\"submit\" size=\"lg\" [loading]=\"loading()\">{{ labels().submit }}</button>\r\n\r\n @if (showSignUp()) {\r\n <p class=\"text-center text-sm text-fg-muted\">\r\n {{ labels().noAccount }}\r\n <button mfButton type=\"button\" appearance=\"link\" size=\"sm\" (click)=\"signUp.emit()\">\r\n {{ labels().signUp }}\r\n </button>\r\n </p>\r\n }\r\n</form>\r\n", dependencies: [{ kind: "component", type: Alert, selector: "mf-alert", inputs: ["tone", "title", "icon", "dismissible", "dismissLabel"], outputs: ["dismissed"], exportAs: ["mfAlert"] }, { kind: "component", type: Button, selector: "button[mfButton], a[mfButton]", inputs: ["tone", "appearance", "size", "shape", "type", "loading", "iconStart", "iconEnd"], exportAs: ["mfButton"] }, { kind: "directive", type: Checkbox, selector: "input[type=checkbox][mfCheckbox]", inputs: ["size", "indeterminate"] }, { kind: "component", type: Divider, selector: "mf-divider", inputs: ["orientation", "label"], exportAs: ["mfDivider"] }, { kind: "component", type: Field, selector: "mf-field", inputs: ["label", "for", "hint", "error", "required", "grow"] }, { kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }, { kind: "component", type: PasswordInput, selector: "mf-password-input", inputs: ["value", "placeholder", "disabled", "hasError", "inputId", "ariaLabel", "fullWidth", "showLabel", "hideLabel", "autocomplete", "name", "required", "readonly"], outputs: ["valueChange"], exportAs: ["mfPasswordInput"] }] });
|
|
95
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: AuthCard, isStandalone: true, selector: "mf-auth-card", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, showRemember: { classPropertyName: "showRemember", publicName: "showRemember", isSignal: true, isRequired: false, transformFunction: null }, showForgotPassword: { classPropertyName: "showForgotPassword", publicName: "showForgotPassword", isSignal: true, isRequired: false, transformFunction: null }, showSignUp: { classPropertyName: "showSignUp", publicName: "showSignUp", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { signIn: "signIn", forgotPassword: "forgotPassword", signUp: "signUp", errorDismissed: "errorDismissed" }, host: { classAttribute: "@container block w-full max-w-sm" }, queries: [{ propertyName: "providers", first: true, predicate: AuthProviders, descendants: true, isSignal: true }], exportAs: ["mfAuthCard"], ngImport: i0, template: "<form class=\"flex flex-col gap-5\" novalidate (submit)=\"submit($event)\">\r\n <div>\r\n <h2 class=\"font-display text-title text-fg\">{{ title() ?? labels().title }}</h2>\r\n <p class=\"mt-1 text-sm text-fg-muted\">{{ description() ?? labels().description }}</p>\r\n </div>\r\n\r\n @if (error()) {\r\n <mf-alert\r\n tone=\"danger\"\r\n [title]=\"labels().errorTitle\"\r\n [dismissible]=\"true\"\r\n (dismissed)=\"errorDismissed.emit()\"\r\n >{{ error() }}</mf-alert\r\n >\r\n }\r\n\r\n @if (providers()) {\r\n <ng-content select=\"[mfAuthProviders]\" />\r\n <mf-divider [label]=\"labels().divider\" />\r\n }\r\n\r\n <mf-field [label]=\"labels().email\" [for]=\"ids.email\" [error]=\"emailError()\" [required]=\"true\">\r\n <input\r\n mfInput\r\n [id]=\"ids.email\"\r\n type=\"email\"\r\n autocomplete=\"email\"\r\n [placeholder]=\"labels().emailPlaceholder\"\r\n [value]=\"email()\"\r\n [hasError]=\"!!emailError()\"\r\n (input)=\"email.set($any($event.target).value)\"\r\n />\r\n </mf-field>\r\n\r\n <div class=\"flex flex-col gap-1.5\">\r\n <div class=\"flex items-center justify-between gap-3\">\r\n <label [for]=\"ids.password\" class=\"text-label text-fg-muted\">{{ labels().password }}</label>\r\n @if (showForgotPassword()) {\r\n <button mfButton type=\"button\" appearance=\"link\" size=\"xs\" (click)=\"forgotPassword.emit()\">\r\n {{ labels().forgotPassword }}\r\n </button>\r\n }\r\n </div>\r\n <mf-password-input\r\n [inputId]=\"ids.password\"\r\n name=\"password\"\r\n autocomplete=\"current-password\"\r\n [required]=\"true\"\r\n [(value)]=\"password\"\r\n [fullWidth]=\"true\"\r\n [hasError]=\"!!passwordError()\"\r\n />\r\n @if (passwordError(); as message) {\r\n <p class=\"text-sm text-danger\" aria-live=\"polite\">{{ message }}</p>\r\n }\r\n </div>\r\n\r\n @if (showRemember()) {\r\n <label class=\"flex items-center gap-2 text-sm text-fg-muted\">\r\n <input\r\n type=\"checkbox\"\r\n mfCheckbox\r\n [checked]=\"remember()\"\r\n (change)=\"remember.set($any($event.target).checked)\"\r\n />\r\n {{ labels().remember }}\r\n </label>\r\n }\r\n\r\n <button mfButton type=\"submit\" size=\"lg\" [loading]=\"loading()\">{{ labels().submit }}</button>\r\n\r\n @if (showSignUp()) {\r\n <p class=\"text-center text-sm text-fg-muted\">\r\n {{ labels().noAccount }}\r\n <button mfButton type=\"button\" appearance=\"link\" size=\"sm\" (click)=\"signUp.emit()\">\r\n {{ labels().signUp }}\r\n </button>\r\n </p>\r\n }\r\n</form>\r\n", dependencies: [{ kind: "component", type: Alert, selector: "mf-alert", inputs: ["tone", "title", "icon", "dismissible", "dismissLabel"], outputs: ["dismissed"], exportAs: ["mfAlert"] }, { kind: "component", type: Button, selector: "button[mfButton], a[mfButton]", inputs: ["tone", "appearance", "size", "shape", "type", "loading", "iconStart", "iconEnd"], exportAs: ["mfButton"] }, { kind: "directive", type: Checkbox, selector: "input[type=checkbox][mfCheckbox]", inputs: ["size", "indeterminate"] }, { kind: "component", type: Divider, selector: "mf-divider", inputs: ["orientation", "label"], exportAs: ["mfDivider"] }, { kind: "component", type: Field, selector: "mf-field", inputs: ["label", "for", "hint", "error", "required", "grow"] }, { kind: "directive", type: Input, selector: "input[mfInput]:not([type=checkbox]):not([type=radio]), textarea[mfInput]", inputs: ["size", "hasError", "autosize", "minRows", "maxRows"] }, { kind: "component", type: PasswordInput, selector: "mf-password-input", inputs: ["value", "size", "placeholder", "disabled", "hasError", "inputId", "ariaLabel", "fullWidth", "showLabel", "hideLabel", "autocomplete", "name", "required", "readonly"], outputs: ["valueChange"], exportAs: ["mfPasswordInput"] }] });
|
|
96
96
|
}
|
|
97
97
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: AuthCard, decorators: [{
|
|
98
98
|
type: Component,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mesgflow-ui-kit-blocks.mjs","sources":["../../../projects/ui-kit/blocks/auth-card.ts","../../../projects/ui-kit/blocks/auth-card.html","../../../projects/ui-kit/blocks/invite-members.ts","../../../projects/ui-kit/blocks/invite-members.html","../../../projects/ui-kit/blocks/settings-section.ts","../../../projects/ui-kit/blocks/settings-section.html","../../../projects/ui-kit/blocks/mesgflow-ui-kit-blocks.ts"],"sourcesContent":["import {\r\n Component,\r\n Directive,\r\n booleanAttribute,\r\n computed,\r\n contentChild,\r\n inject,\r\n input,\r\n output,\r\n signal,\r\n} from '@angular/core';\r\nimport { Alert } from '@mesgflow/ui-kit/alert';\r\nimport { Button } from '@mesgflow/ui-kit/button';\r\nimport { Checkbox } from '@mesgflow/ui-kit/checkbox';\r\nimport { MF_AUTH_CARD_LABELS, nextId } from '@mesgflow/ui-kit/core';\r\nimport { Divider } from '@mesgflow/ui-kit/divider';\r\nimport { Field } from '@mesgflow/ui-kit/field';\r\nimport { Input } from '@mesgflow/ui-kit/input';\r\nimport { PasswordInput } from '@mesgflow/ui-kit/password-input';\r\n\r\nexport interface AuthCredentials {\r\n email: string;\r\n password: string;\r\n remember: boolean;\r\n}\r\n\r\nconst EMAIL = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\r\n\r\n/**\r\n * `<div mfAuthProviders>…GitHub/Google düğmeleri…</div>` — `mf-auth-card`\r\n * içinde e-posta formunun üstünde, ayırıcıyla birlikte gösterilir.\r\n */\r\n@Directive({ selector: '[mfAuthProviders]', host: { class: 'grid gap-2 @xs:grid-cols-2' } })\r\nexport class AuthProviders {}\r\n\r\n/**\r\n * `<mf-auth-card [loading]=\"busy()\" [error]=\"err()\" (signIn)=\"login($event)\" (forgotPassword)=\"…\" (signUp)=\"…\" />`\r\n *\r\n * Kullanıma hazır giriş kartı (Login bloğunun tüketilebilir hâli): başlık,\r\n * isteğe bağlı sosyal sağlayıcı slotu (`[mfAuthProviders]`), e-posta +\r\n * parola (göster/gizle), \"beni hatırla\", gönder ve kayıt bağlantısı.\r\n *\r\n * - Doğrulama yerleşik: boş/geçersiz e-posta ve boş parola alanın altında\r\n * (`mf-field`, `aria-invalid` + `aria-describedby`) gösterilir; `signIn`\r\n * yalnızca geçerli değerlerle yayılır.\r\n * - Sunucu hatası `error` girdisiyle üstte bir `role=\"alert\"` uyarısı olur.\r\n * - Tüm metinler `MfLabels.authCard` — `title`/`description` girdileri\r\n * yalnızca bu örnek için ezer.\r\n * - Kapsayıcı sorgusuyla (`@container`) dar yerlerde tek sütun.\r\n */\r\n@Component({\r\n selector: 'mf-auth-card',\r\n exportAs: 'mfAuthCard',\r\n imports: [Alert, Button, Checkbox, Divider, Field, Input, PasswordInput],\r\n host: { class: '@container block w-full max-w-sm' },\r\n templateUrl: './auth-card.html',\r\n})\r\nexport class AuthCard {\r\n readonly title = input<string>();\r\n readonly description = input<string>();\r\n readonly loading = input(false, { transform: booleanAttribute });\r\n /** Sunucudan dönen hata metni — boşsa uyarı gösterilmez. */\r\n readonly error = input<string | null>(null);\r\n readonly showRemember = input(true, { transform: booleanAttribute });\r\n /** `false` ise \"parolamı unuttum\" bağlantısı gizlenir. */\r\n readonly showForgotPassword = input(true, { transform: booleanAttribute });\r\n /** `false` ise alttaki kayıt satırı gizlenir. */\r\n readonly showSignUp = input(true, { transform: booleanAttribute });\r\n\r\n readonly signIn = output<AuthCredentials>();\r\n readonly forgotPassword = output<void>();\r\n readonly signUp = output<void>();\r\n readonly errorDismissed = output<void>();\r\n\r\n protected readonly labels = inject(MF_AUTH_CARD_LABELS);\r\n protected readonly ids = { email: nextId('mf-auth-email'), password: nextId('mf-auth-password') };\r\n protected readonly providers = contentChild(AuthProviders);\r\n\r\n protected readonly email = signal('');\r\n protected readonly password = signal('');\r\n protected readonly remember = signal(true);\r\n protected readonly submitted = signal(false);\r\n\r\n protected readonly emailError = computed(() => {\r\n if (!this.submitted()) return undefined;\r\n const value = this.email().trim();\r\n if (!value) return this.labels().emailRequired;\r\n return EMAIL.test(value) ? undefined : this.labels().emailInvalid;\r\n });\r\n protected readonly passwordError = computed(() =>\r\n this.submitted() && !this.password() ? this.labels().passwordRequired : undefined,\r\n );\r\n\r\n protected submit(event: Event): void {\r\n event.preventDefault();\r\n this.submitted.set(true);\r\n if (this.emailError() || this.passwordError() || this.loading()) return;\r\n this.signIn.emit({\r\n email: this.email().trim(),\r\n password: this.password(),\r\n remember: this.showRemember() && this.remember(),\r\n });\r\n }\r\n}\r\n","<form class=\"flex flex-col gap-5\" novalidate (submit)=\"submit($event)\">\r\n <div>\r\n <h2 class=\"font-display text-title text-fg\">{{ title() ?? labels().title }}</h2>\r\n <p class=\"mt-1 text-sm text-fg-muted\">{{ description() ?? labels().description }}</p>\r\n </div>\r\n\r\n @if (error()) {\r\n <mf-alert\r\n tone=\"danger\"\r\n [title]=\"labels().errorTitle\"\r\n [dismissible]=\"true\"\r\n (dismissed)=\"errorDismissed.emit()\"\r\n >{{ error() }}</mf-alert\r\n >\r\n }\r\n\r\n @if (providers()) {\r\n <ng-content select=\"[mfAuthProviders]\" />\r\n <mf-divider [label]=\"labels().divider\" />\r\n }\r\n\r\n <mf-field [label]=\"labels().email\" [for]=\"ids.email\" [error]=\"emailError()\" [required]=\"true\">\r\n <input\r\n mfInput\r\n [id]=\"ids.email\"\r\n type=\"email\"\r\n autocomplete=\"email\"\r\n [placeholder]=\"labels().emailPlaceholder\"\r\n [value]=\"email()\"\r\n [hasError]=\"!!emailError()\"\r\n (input)=\"email.set($any($event.target).value)\"\r\n />\r\n </mf-field>\r\n\r\n <div class=\"flex flex-col gap-1.5\">\r\n <div class=\"flex items-center justify-between gap-3\">\r\n <label [for]=\"ids.password\" class=\"text-label text-fg-muted\">{{ labels().password }}</label>\r\n @if (showForgotPassword()) {\r\n <button mfButton type=\"button\" appearance=\"link\" size=\"xs\" (click)=\"forgotPassword.emit()\">\r\n {{ labels().forgotPassword }}\r\n </button>\r\n }\r\n </div>\r\n <mf-password-input\r\n [inputId]=\"ids.password\"\r\n name=\"password\"\r\n autocomplete=\"current-password\"\r\n [required]=\"true\"\r\n [(value)]=\"password\"\r\n [fullWidth]=\"true\"\r\n [hasError]=\"!!passwordError()\"\r\n />\r\n @if (passwordError(); as message) {\r\n <p class=\"text-sm text-danger\" aria-live=\"polite\">{{ message }}</p>\r\n }\r\n </div>\r\n\r\n @if (showRemember()) {\r\n <label class=\"flex items-center gap-2 text-sm text-fg-muted\">\r\n <input\r\n type=\"checkbox\"\r\n mfCheckbox\r\n [checked]=\"remember()\"\r\n (change)=\"remember.set($any($event.target).checked)\"\r\n />\r\n {{ labels().remember }}\r\n </label>\r\n }\r\n\r\n <button mfButton type=\"submit\" size=\"lg\" [loading]=\"loading()\">{{ labels().submit }}</button>\r\n\r\n @if (showSignUp()) {\r\n <p class=\"text-center text-sm text-fg-muted\">\r\n {{ labels().noAccount }}\r\n <button mfButton type=\"button\" appearance=\"link\" size=\"sm\" (click)=\"signUp.emit()\">\r\n {{ labels().signUp }}\r\n </button>\r\n </p>\r\n }\r\n</form>\r\n","import {\r\n Component,\r\n booleanAttribute,\r\n computed,\r\n inject,\r\n input,\r\n linkedSignal,\r\n output,\r\n signal,\r\n} from '@angular/core';\r\nimport { Button } from '@mesgflow/ui-kit/button';\r\nimport { MF_INVITE_MEMBERS_LABELS, nextId } from '@mesgflow/ui-kit/core';\r\nimport { Field } from '@mesgflow/ui-kit/field';\r\nimport { Select, type SelectOption } from '@mesgflow/ui-kit/select';\r\nimport { TagInput } from '@mesgflow/ui-kit/tag-input';\r\n\r\nexport interface MemberInvite<R = string> {\r\n emails: string[];\r\n role: R;\r\n}\r\n\r\nconst EMAIL = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\r\n\r\n/**\r\n * `<mf-invite-members [roles]=\"roles\" [loading]=\"sending()\" (invite)=\"send($event)\" />`\r\n *\r\n * Ekip daveti formu (Invite bloğunun tüketilebilir hâli): etiketli e-posta\r\n * girişi (Enter/virgül ile birden çok adres), rol seçimi ve gönder. Geçersiz\r\n * adresler gönderimde listelenir; `invite` yalnızca geçerli adreslerle yayılır\r\n * ve başarılıysa tüketici `reset()` çağırabilir.\r\n *\r\n * Metinler `MfLabels.inviteMembers`; `roles` tüketicinin alanıdır (ör.\r\n * Yönetici/Düzenleyici/Görüntüleyici). Varsayılan rol listenin ilkidir.\r\n */\r\n@Component({\r\n selector: 'mf-invite-members',\r\n exportAs: 'mfInviteMembers',\r\n imports: [Button, Field, Select, TagInput],\r\n host: { class: '@container block' },\r\n templateUrl: './invite-members.html',\r\n})\r\nexport class InviteMembers<R = string> {\r\n readonly roles = input.required<SelectOption<R>[]>();\r\n readonly loading = input(false, { transform: booleanAttribute });\r\n readonly title = input<string>();\r\n readonly description = input<string>();\r\n\r\n readonly invite = output<MemberInvite<R>>();\r\n\r\n protected readonly labels = inject(MF_INVITE_MEMBERS_LABELS);\r\n protected readonly ids = { emails: nextId('mf-invite-emails'), role: nextId('mf-invite-role') };\r\n protected readonly emails = signal<string[]>([]);\r\n protected readonly role = linkedSignal<R | null>(() => this.roles()[0]?.value ?? null);\r\n protected readonly submitted = signal(false);\r\n\r\n protected readonly invalid = computed(() => this.emails().filter((e) => !EMAIL.test(e.trim())));\r\n protected readonly error = computed(() => {\r\n if (!this.submitted()) return undefined;\r\n if (!this.emails().length) return this.labels().emailsRequired;\r\n const bad = this.invalid();\r\n return bad.length ? this.labels().invalidEmails.replace('{emails}', bad.join(', ')) : undefined;\r\n });\r\n\r\n protected submit(event: Event): void {\r\n event.preventDefault();\r\n this.submitted.set(true);\r\n const role = this.role();\r\n if (this.error() || role === null || this.loading()) return;\r\n this.invite.emit({ emails: this.emails().map((e) => e.trim()), role });\r\n }\r\n\r\n /** Başarılı gönderimden sonra formu boşaltır. */\r\n reset(): void {\r\n this.emails.set([]);\r\n this.submitted.set(false);\r\n }\r\n}\r\n","<form class=\"flex flex-col gap-4\" novalidate (submit)=\"submit($event)\">\r\n <div>\r\n <h2 class=\"font-display text-title-sm text-fg\">{{ title() ?? labels().title }}</h2>\r\n <p class=\"mt-1 text-sm text-fg-muted\">{{ description() ?? labels().description }}</p>\r\n </div>\r\n\r\n <div class=\"flex flex-col gap-3 @lg:flex-row @lg:items-start\">\r\n <mf-field\r\n class=\"min-w-0 flex-1\"\r\n [label]=\"labels().emails\"\r\n [for]=\"ids.emails\"\r\n [error]=\"error()\"\r\n [required]=\"true\"\r\n >\r\n <mf-tag-input\r\n [inputId]=\"ids.emails\"\r\n [(value)]=\"emails\"\r\n [placeholder]=\"labels().emailsPlaceholder\"\r\n [hasError]=\"!!error()\"\r\n [fullWidth]=\"true\"\r\n [unique]=\"true\"\r\n />\r\n </mf-field>\r\n <mf-field class=\"@lg:w-44\" [label]=\"labels().role\">\r\n <mf-select [ariaLabel]=\"labels().role\" [options]=\"roles()\" [(value)]=\"role\" />\r\n </mf-field>\r\n </div>\r\n\r\n <div class=\"flex justify-end\">\r\n <button mfButton type=\"submit\" iconStart=\"send\" [loading]=\"loading()\">\r\n {{ labels().submit }}\r\n </button>\r\n </div>\r\n</form>\r\n","import { Component, Directive, input } from '@angular/core';\r\nimport { nextId } from '@mesgflow/ui-kit/core';\r\n\r\n/** `mf-settings-section`'ın alt eylem şeridi — sönük zemin, sağa hizalı düğmeler. */\r\n@Directive({\r\n selector: '[mfSettingsActions]',\r\n host: {\r\n class:\r\n 'flex flex-wrap items-center justify-end gap-2 border-t border-hairline bg-surface-sunken px-5 py-3',\r\n },\r\n})\r\nexport class SettingsActions {}\r\n\r\n/**\r\n * `<mf-settings-section heading=\"Profil\" description=\"Herkese görünen bilgiler.\">\r\n * …alanlar…\r\n * <div mfSettingsActions><button mfButton>Kaydet</button></div>\r\n * </mf-settings-section>`\r\n *\r\n * Ayarlar sayfalarının iki sütunlu bölüm düzeni (Settings bloğundan): solda\r\n * başlık + açıklama, sağda kart içinde alanlar, altta isteğe bağlı eylem\r\n * şeridi. Dar kapsayıcıda tek sütuna iner (`@container`). Bölüm başlığıyla\r\n * adlandırılmış bir `<section>`; metnin tamamı tüketiciden gelir.\r\n */\r\n@Component({\r\n selector: 'mf-settings-section',\r\n exportAs: 'mfSettingsSection',\r\n host: { class: '@container block' },\r\n templateUrl: './settings-section.html',\r\n})\r\nexport class SettingsSection {\r\n readonly heading = input.required<string>();\r\n readonly description = input<string>();\r\n protected readonly headingId = nextId('mf-settings-heading');\r\n}\r\n","<section\r\n [attr.aria-labelledby]=\"headingId\"\r\n class=\"grid gap-4 @3xl:grid-cols-[16rem_1fr] @3xl:gap-10\"\r\n>\r\n <div>\r\n <h2 [id]=\"headingId\" class=\"font-display text-title-sm text-fg\">{{ heading() }}</h2>\r\n @if (description()) {\r\n <p class=\"mt-1 text-sm text-fg-muted\">{{ description() }}</p>\r\n }\r\n </div>\r\n <div class=\"overflow-hidden rounded-xl border border-hairline bg-surface\">\r\n <div class=\"flex flex-col gap-5 p-5 @md:p-6\"><ng-content /></div>\r\n <ng-content select=\"[mfSettingsActions]\" />\r\n </div>\r\n</section>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["EMAIL"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"mesgflow-ui-kit-blocks.mjs","sources":["../../../projects/ui-kit/blocks/auth-card.ts","../../../projects/ui-kit/blocks/auth-card.html","../../../projects/ui-kit/blocks/invite-members.ts","../../../projects/ui-kit/blocks/invite-members.html","../../../projects/ui-kit/blocks/settings-section.ts","../../../projects/ui-kit/blocks/settings-section.html","../../../projects/ui-kit/blocks/mesgflow-ui-kit-blocks.ts"],"sourcesContent":["import {\r\n Component,\r\n Directive,\r\n booleanAttribute,\r\n computed,\r\n contentChild,\r\n inject,\r\n input,\r\n output,\r\n signal,\r\n} from '@angular/core';\r\nimport { Alert } from '@mesgflow/ui-kit/alert';\r\nimport { Button } from '@mesgflow/ui-kit/button';\r\nimport { Checkbox } from '@mesgflow/ui-kit/checkbox';\r\nimport { MF_AUTH_CARD_LABELS, nextId } from '@mesgflow/ui-kit/core';\r\nimport { Divider } from '@mesgflow/ui-kit/divider';\r\nimport { Field } from '@mesgflow/ui-kit/field';\r\nimport { Input } from '@mesgflow/ui-kit/input';\r\nimport { PasswordInput } from '@mesgflow/ui-kit/password-input';\r\n\r\nexport interface AuthCredentials {\r\n email: string;\r\n password: string;\r\n remember: boolean;\r\n}\r\n\r\nconst EMAIL = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\r\n\r\n/**\r\n * `<div mfAuthProviders>…GitHub/Google düğmeleri…</div>` — `mf-auth-card`\r\n * içinde e-posta formunun üstünde, ayırıcıyla birlikte gösterilir.\r\n */\r\n@Directive({ selector: '[mfAuthProviders]', host: { class: 'grid gap-2 @xs:grid-cols-2' } })\r\nexport class AuthProviders {}\r\n\r\n/**\r\n * `<mf-auth-card [loading]=\"busy()\" [error]=\"err()\" (signIn)=\"login($event)\" (forgotPassword)=\"…\" (signUp)=\"…\" />`\r\n *\r\n * Kullanıma hazır giriş kartı (Login bloğunun tüketilebilir hâli): başlık,\r\n * isteğe bağlı sosyal sağlayıcı slotu (`[mfAuthProviders]`), e-posta +\r\n * parola (göster/gizle), \"beni hatırla\", gönder ve kayıt bağlantısı.\r\n *\r\n * - Doğrulama yerleşik: boş/geçersiz e-posta ve boş parola alanın altında\r\n * (`mf-field`, `aria-invalid` + `aria-describedby`) gösterilir; `signIn`\r\n * yalnızca geçerli değerlerle yayılır.\r\n * - Sunucu hatası `error` girdisiyle üstte bir `role=\"alert\"` uyarısı olur.\r\n * - Tüm metinler `MfLabels.authCard` — `title`/`description` girdileri\r\n * yalnızca bu örnek için ezer.\r\n * - Kapsayıcı sorgusuyla (`@container`) dar yerlerde tek sütun.\r\n */\r\n@Component({\r\n selector: 'mf-auth-card',\r\n exportAs: 'mfAuthCard',\r\n imports: [Alert, Button, Checkbox, Divider, Field, Input, PasswordInput],\r\n host: { class: '@container block w-full max-w-sm' },\r\n templateUrl: './auth-card.html',\r\n})\r\nexport class AuthCard {\r\n readonly title = input<string>();\r\n readonly description = input<string>();\r\n readonly loading = input(false, { transform: booleanAttribute });\r\n /** Sunucudan dönen hata metni — boşsa uyarı gösterilmez. */\r\n readonly error = input<string | null>(null);\r\n readonly showRemember = input(true, { transform: booleanAttribute });\r\n /** `false` ise \"parolamı unuttum\" bağlantısı gizlenir. */\r\n readonly showForgotPassword = input(true, { transform: booleanAttribute });\r\n /** `false` ise alttaki kayıt satırı gizlenir. */\r\n readonly showSignUp = input(true, { transform: booleanAttribute });\r\n\r\n readonly signIn = output<AuthCredentials>();\r\n readonly forgotPassword = output<void>();\r\n readonly signUp = output<void>();\r\n readonly errorDismissed = output<void>();\r\n\r\n protected readonly labels = inject(MF_AUTH_CARD_LABELS);\r\n protected readonly ids = { email: nextId('mf-auth-email'), password: nextId('mf-auth-password') };\r\n protected readonly providers = contentChild(AuthProviders);\r\n\r\n protected readonly email = signal('');\r\n protected readonly password = signal('');\r\n protected readonly remember = signal(true);\r\n protected readonly submitted = signal(false);\r\n\r\n protected readonly emailError = computed(() => {\r\n if (!this.submitted()) return undefined;\r\n const value = this.email().trim();\r\n if (!value) return this.labels().emailRequired;\r\n return EMAIL.test(value) ? undefined : this.labels().emailInvalid;\r\n });\r\n protected readonly passwordError = computed(() =>\r\n this.submitted() && !this.password() ? this.labels().passwordRequired : undefined,\r\n );\r\n\r\n protected submit(event: Event): void {\r\n event.preventDefault();\r\n this.submitted.set(true);\r\n if (this.emailError() || this.passwordError() || this.loading()) return;\r\n this.signIn.emit({\r\n email: this.email().trim(),\r\n password: this.password(),\r\n remember: this.showRemember() && this.remember(),\r\n });\r\n }\r\n}\r\n","<form class=\"flex flex-col gap-5\" novalidate (submit)=\"submit($event)\">\r\n <div>\r\n <h2 class=\"font-display text-title text-fg\">{{ title() ?? labels().title }}</h2>\r\n <p class=\"mt-1 text-sm text-fg-muted\">{{ description() ?? labels().description }}</p>\r\n </div>\r\n\r\n @if (error()) {\r\n <mf-alert\r\n tone=\"danger\"\r\n [title]=\"labels().errorTitle\"\r\n [dismissible]=\"true\"\r\n (dismissed)=\"errorDismissed.emit()\"\r\n >{{ error() }}</mf-alert\r\n >\r\n }\r\n\r\n @if (providers()) {\r\n <ng-content select=\"[mfAuthProviders]\" />\r\n <mf-divider [label]=\"labels().divider\" />\r\n }\r\n\r\n <mf-field [label]=\"labels().email\" [for]=\"ids.email\" [error]=\"emailError()\" [required]=\"true\">\r\n <input\r\n mfInput\r\n [id]=\"ids.email\"\r\n type=\"email\"\r\n autocomplete=\"email\"\r\n [placeholder]=\"labels().emailPlaceholder\"\r\n [value]=\"email()\"\r\n [hasError]=\"!!emailError()\"\r\n (input)=\"email.set($any($event.target).value)\"\r\n />\r\n </mf-field>\r\n\r\n <div class=\"flex flex-col gap-1.5\">\r\n <div class=\"flex items-center justify-between gap-3\">\r\n <label [for]=\"ids.password\" class=\"text-label text-fg-muted\">{{ labels().password }}</label>\r\n @if (showForgotPassword()) {\r\n <button mfButton type=\"button\" appearance=\"link\" size=\"xs\" (click)=\"forgotPassword.emit()\">\r\n {{ labels().forgotPassword }}\r\n </button>\r\n }\r\n </div>\r\n <mf-password-input\r\n [inputId]=\"ids.password\"\r\n name=\"password\"\r\n autocomplete=\"current-password\"\r\n [required]=\"true\"\r\n [(value)]=\"password\"\r\n [fullWidth]=\"true\"\r\n [hasError]=\"!!passwordError()\"\r\n />\r\n @if (passwordError(); as message) {\r\n <p class=\"text-sm text-danger\" aria-live=\"polite\">{{ message }}</p>\r\n }\r\n </div>\r\n\r\n @if (showRemember()) {\r\n <label class=\"flex items-center gap-2 text-sm text-fg-muted\">\r\n <input\r\n type=\"checkbox\"\r\n mfCheckbox\r\n [checked]=\"remember()\"\r\n (change)=\"remember.set($any($event.target).checked)\"\r\n />\r\n {{ labels().remember }}\r\n </label>\r\n }\r\n\r\n <button mfButton type=\"submit\" size=\"lg\" [loading]=\"loading()\">{{ labels().submit }}</button>\r\n\r\n @if (showSignUp()) {\r\n <p class=\"text-center text-sm text-fg-muted\">\r\n {{ labels().noAccount }}\r\n <button mfButton type=\"button\" appearance=\"link\" size=\"sm\" (click)=\"signUp.emit()\">\r\n {{ labels().signUp }}\r\n </button>\r\n </p>\r\n }\r\n</form>\r\n","import {\r\n Component,\r\n booleanAttribute,\r\n computed,\r\n inject,\r\n input,\r\n linkedSignal,\r\n output,\r\n signal,\r\n} from '@angular/core';\r\nimport { Button } from '@mesgflow/ui-kit/button';\r\nimport { MF_INVITE_MEMBERS_LABELS, nextId } from '@mesgflow/ui-kit/core';\r\nimport { Field } from '@mesgflow/ui-kit/field';\r\nimport { Select, type SelectOption } from '@mesgflow/ui-kit/select';\r\nimport { TagInput } from '@mesgflow/ui-kit/tag-input';\r\n\r\nexport interface MemberInvite<R = string> {\r\n emails: string[];\r\n role: R;\r\n}\r\n\r\nconst EMAIL = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\r\n\r\n/**\r\n * `<mf-invite-members [roles]=\"roles\" [loading]=\"sending()\" (invite)=\"send($event)\" />`\r\n *\r\n * Ekip daveti formu (Invite bloğunun tüketilebilir hâli): etiketli e-posta\r\n * girişi (Enter/virgül ile birden çok adres), rol seçimi ve gönder. Geçersiz\r\n * adresler gönderimde listelenir; `invite` yalnızca geçerli adreslerle yayılır\r\n * ve başarılıysa tüketici `reset()` çağırabilir.\r\n *\r\n * Metinler `MfLabels.inviteMembers`; `roles` tüketicinin alanıdır (ör.\r\n * Yönetici/Düzenleyici/Görüntüleyici). Varsayılan rol listenin ilkidir.\r\n */\r\n@Component({\r\n selector: 'mf-invite-members',\r\n exportAs: 'mfInviteMembers',\r\n imports: [Button, Field, Select, TagInput],\r\n host: { class: '@container block' },\r\n templateUrl: './invite-members.html',\r\n})\r\nexport class InviteMembers<R = string> {\r\n readonly roles = input.required<SelectOption<R>[]>();\r\n readonly loading = input(false, { transform: booleanAttribute });\r\n readonly title = input<string>();\r\n readonly description = input<string>();\r\n\r\n readonly invite = output<MemberInvite<R>>();\r\n\r\n protected readonly labels = inject(MF_INVITE_MEMBERS_LABELS);\r\n protected readonly ids = { emails: nextId('mf-invite-emails'), role: nextId('mf-invite-role') };\r\n protected readonly emails = signal<string[]>([]);\r\n protected readonly role = linkedSignal<R | null>(() => this.roles()[0]?.value ?? null);\r\n protected readonly submitted = signal(false);\r\n\r\n protected readonly invalid = computed(() => this.emails().filter((e) => !EMAIL.test(e.trim())));\r\n protected readonly error = computed(() => {\r\n if (!this.submitted()) return undefined;\r\n if (!this.emails().length) return this.labels().emailsRequired;\r\n const bad = this.invalid();\r\n return bad.length ? this.labels().invalidEmails.replace('{emails}', bad.join(', ')) : undefined;\r\n });\r\n\r\n protected submit(event: Event): void {\r\n event.preventDefault();\r\n this.submitted.set(true);\r\n const role = this.role();\r\n if (this.error() || role === null || this.loading()) return;\r\n this.invite.emit({ emails: this.emails().map((e) => e.trim()), role });\r\n }\r\n\r\n /** Başarılı gönderimden sonra formu boşaltır. */\r\n reset(): void {\r\n this.emails.set([]);\r\n this.submitted.set(false);\r\n }\r\n}\r\n","<form class=\"flex flex-col gap-4\" novalidate (submit)=\"submit($event)\">\r\n <div>\r\n <h2 class=\"font-display text-title-sm text-fg\">{{ title() ?? labels().title }}</h2>\r\n <p class=\"mt-1 text-sm text-fg-muted\">{{ description() ?? labels().description }}</p>\r\n </div>\r\n\r\n <div class=\"flex flex-col gap-3 @lg:flex-row @lg:items-start\">\r\n <mf-field\r\n class=\"min-w-0 flex-1\"\r\n [label]=\"labels().emails\"\r\n [for]=\"ids.emails\"\r\n [error]=\"error()\"\r\n [required]=\"true\"\r\n >\r\n <mf-tag-input\r\n [inputId]=\"ids.emails\"\r\n [(value)]=\"emails\"\r\n [placeholder]=\"labels().emailsPlaceholder\"\r\n [hasError]=\"!!error()\"\r\n [fullWidth]=\"true\"\r\n [unique]=\"true\"\r\n />\r\n </mf-field>\r\n <mf-field class=\"@lg:w-44\" [label]=\"labels().role\">\r\n <mf-select [ariaLabel]=\"labels().role\" [options]=\"roles()\" [(value)]=\"role\" />\r\n </mf-field>\r\n </div>\r\n\r\n <div class=\"flex justify-end\">\r\n <button mfButton type=\"submit\" iconStart=\"send\" [loading]=\"loading()\">\r\n {{ labels().submit }}\r\n </button>\r\n </div>\r\n</form>\r\n","import { Component, Directive, input } from '@angular/core';\r\nimport { nextId } from '@mesgflow/ui-kit/core';\r\n\r\n/** `mf-settings-section`'ın alt eylem şeridi — sönük zemin, sağa hizalı düğmeler. */\r\n@Directive({\r\n selector: '[mfSettingsActions]',\r\n host: {\r\n class:\r\n 'flex flex-wrap items-center justify-end gap-2 border-t border-hairline bg-surface-sunken px-5 py-3',\r\n },\r\n})\r\nexport class SettingsActions {}\r\n\r\n/**\r\n * `<mf-settings-section heading=\"Profil\" description=\"Herkese görünen bilgiler.\">\r\n * …alanlar…\r\n * <div mfSettingsActions><button mfButton>Kaydet</button></div>\r\n * </mf-settings-section>`\r\n *\r\n * Ayarlar sayfalarının iki sütunlu bölüm düzeni (Settings bloğundan): solda\r\n * başlık + açıklama, sağda kart içinde alanlar, altta isteğe bağlı eylem\r\n * şeridi. Dar kapsayıcıda tek sütuna iner (`@container`). Bölüm başlığıyla\r\n * adlandırılmış bir `<section>`; metnin tamamı tüketiciden gelir.\r\n */\r\n@Component({\r\n selector: 'mf-settings-section',\r\n exportAs: 'mfSettingsSection',\r\n host: { class: '@container block' },\r\n templateUrl: './settings-section.html',\r\n})\r\nexport class SettingsSection {\r\n readonly heading = input.required<string>();\r\n readonly description = input<string>();\r\n protected readonly headingId = nextId('mf-settings-heading');\r\n}\r\n","<section\r\n [attr.aria-labelledby]=\"headingId\"\r\n class=\"grid gap-4 @3xl:grid-cols-[16rem_1fr] @3xl:gap-10\"\r\n>\r\n <div>\r\n <h2 [id]=\"headingId\" class=\"font-display text-title-sm text-fg\">{{ heading() }}</h2>\r\n @if (description()) {\r\n <p class=\"mt-1 text-sm text-fg-muted\">{{ description() }}</p>\r\n }\r\n </div>\r\n <div class=\"overflow-hidden rounded-xl border border-hairline bg-surface\">\r\n <div class=\"flex flex-col gap-5 p-5 @md:p-6\"><ng-content /></div>\r\n <ng-content select=\"[mfSettingsActions]\" />\r\n </div>\r\n</section>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["EMAIL"],"mappings":"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"}
|
|
@@ -20,7 +20,7 @@ const comboboxTriggerVariants = cva('w-full rounded-md border border-border bg-s
|
|
|
20
20
|
size: {
|
|
21
21
|
sm: 'min-h-(--control-h-sm) px-2.5 py-1',
|
|
22
22
|
md: 'min-h-(--control-h-md) px-3 py-1.5',
|
|
23
|
-
lg: 'min-h-(--control-h-lg) px-3.5 py-
|
|
23
|
+
lg: 'min-h-(--control-h-lg) px-3.5 py-1.5 text-base',
|
|
24
24
|
},
|
|
25
25
|
hasError: {
|
|
26
26
|
true: 'border-danger focus:border-danger focus-visible:outline-danger',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mesgflow-ui-kit-combobox.mjs","sources":["../../../projects/ui-kit/combobox/combobox.variants.ts","../../../projects/ui-kit/combobox/combobox.ts","../../../projects/ui-kit/combobox/combobox.html","../../../projects/ui-kit/combobox/mesgflow-ui-kit-combobox.ts"],"sourcesContent":["import { focusRecipe } from '@mesgflow/ui-kit/core';\r\nimport { cva, type VariantProps } from 'class-variance-authority';\r\n\r\n/** `Select`'in trigger/option görsel diliyle AYNI — bkz. select.variants.ts / `core/recipes.ts`. */\r\nexport const comboboxTriggerVariants = cva(\r\n 'w-full rounded-md border border-border bg-surface pe-9 text-sm text-fg shadow-control ' +\r\n 'transition-colors duration-fast ease-emphasis placeholder:text-fg-subtle ' +\r\n 'hover:border-border-strong ' +\r\n 'focus:border-accent ' +\r\n focusRecipe +\r\n ' ' +\r\n 'disabled:cursor-not-allowed disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none disabled:hover:border-border',\r\n {\r\n variants: {\r\n size: {\r\n sm: 'min-h-(--control-h-sm) px-2.5 py-1',\r\n md: 'min-h-(--control-h-md) px-3 py-1.5',\r\n lg: 'min-h-(--control-h-lg) px-3.5 py-2 text-base',\r\n },\r\n hasError: {\r\n true: 'border-danger focus:border-danger focus-visible:outline-danger',\r\n false: '',\r\n },\r\n },\r\n defaultVariants: { size: 'md', hasError: false },\r\n },\r\n);\r\n\r\nexport type ComboboxSize = VariantProps<typeof comboboxTriggerVariants>['size'];\r\nexport type ComboboxHasError = VariantProps<typeof comboboxTriggerVariants>['hasError'];\r\n\r\nexport const comboboxOptionVariants = cva(\r\n 'flex cursor-pointer items-center justify-between gap-2 rounded-sm px-2.5 py-1.5 text-fg-muted transition-colors duration-fast ease-emphasis',\r\n {\r\n variants: {\r\n highlighted: {\r\n true: 'bg-state-hover text-fg',\r\n false: '',\r\n },\r\n selected: {\r\n true: 'bg-primary-tint text-primary-tint-fg',\r\n false: '',\r\n },\r\n },\r\n defaultVariants: { highlighted: false, selected: false },\r\n },\r\n);\r\n","import { OverlayModule } from '@angular/cdk/overlay';\r\nimport {\r\n Component,\r\n ElementRef,\r\n booleanAttribute,\r\n computed,\r\n forwardRef,\r\n inject,\r\n input,\r\n model,\r\n output,\r\n signal,\r\n viewChild,\r\n} from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { cn, MF_COMBOBOX_LABELS, nextId, type MfSize } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Popover } from '@mesgflow/ui-kit/popover';\r\nimport { comboboxOptionVariants, comboboxTriggerVariants } from './combobox.variants';\r\n\r\nexport interface ComboboxOption<T> {\r\n label: string;\r\n value: T;\r\n /** İkincil satır (e-posta, açıklama) — aramaya da dahildir. */\r\n description?: string;\r\n disabled?: boolean;\r\n}\r\n\r\n/** Listede gösterilen satır — gerçek bir seçenek ya da \"oluştur\" satırı. */\r\ntype Row<T> = { kind: 'option'; option: ComboboxOption<T> } | { kind: 'create'; query: string };\r\n\r\n/**\r\n * `<mf-combobox [options]=\"opts\" [(value)]=\"chosen\" />` — filtrelenebilir tekli seçim.\r\n * `<mf-combobox multiple [options]=\"opts\" [(values)]=\"tags\" creatable (create)=\"add($event)\" />`\r\n * — çoklu seçim (çipler), isteğe bağlı \"oluştur\" satırı.\r\n *\r\n * ARIA 1.2 combobox deseni: input `role=\"combobox\"` + `aria-controls` (listbox)\r\n * + `aria-activedescendant` (vurgulanan satır; odak input'ta kalır). Çoklu\r\n * modda listbox `aria-multiselectable`, seçim sonrası panel AÇIK kalır ve\r\n * sorgu temizlenir; boş sorguda Backspace son çipi kaldırır.\r\n *\r\n * `(mousedown)=\"$event.preventDefault()\"` seçenek satırında ZORUNLU — aksi\r\n * halde input'un `blur`'ı `click`'ten ÖNCE tetiklenip paneli kapatır.\r\n */\r\n@Component({\r\n selector: 'mf-combobox',\r\n exportAs: 'mfCombobox',\r\n host: { class: 'block' },\r\n imports: [OverlayModule, Icon, Popover],\r\n templateUrl: './combobox.html',\r\n providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Combobox), multi: true }],\r\n})\r\nexport class Combobox<T> implements ControlValueAccessor {\r\n readonly options = input.required<ComboboxOption<T>[]>();\r\n readonly value = model<T | null>(null);\r\n /** Çoklu modda seçili değerler. */\r\n readonly values = model<T[]>([]);\r\n readonly multiple = input(false, { transform: booleanAttribute });\r\n /** Sorgu hiçbir etiketle birebir eşleşmezse listenin sonunda \"oluştur\" satırı. */\r\n readonly creatable = input(false, { transform: booleanAttribute });\r\n readonly placeholder = input<string>();\r\n readonly disabled = input(false, { transform: booleanAttribute });\r\n readonly size = input<MfSize>('md');\r\n readonly hasError = input(false, { transform: booleanAttribute });\r\n readonly ariaLabel = input('');\r\n /** Harici `<label for>` / `mf-field for` için input id'si. */\r\n readonly inputId = input<string>();\r\n\r\n /** \"Oluştur\" satırı seçildi — tüketici seçeneği ekleyip seçer. */\r\n readonly create = output<string>();\r\n\r\n private onChange: (value: T | T[] | null) => void = () => {};\r\n private onTouched: () => void = () => {};\r\n\r\n protected readonly labels = inject(MF_COMBOBOX_LABELS);\r\n protected readonly effectivePlaceholder = computed(\r\n () => this.placeholder() ?? this.labels().placeholder,\r\n );\r\n\r\n private readonly inputEl = viewChild<ElementRef<HTMLInputElement>>('inputEl');\r\n protected readonly open = signal(false);\r\n protected readonly query = signal('');\r\n protected readonly highlighted = signal(0);\r\n\r\n protected readonly listboxId = nextId('mf-combobox-listbox');\r\n protected readonly optionIdPrefix = nextId('mf-combobox-option');\r\n\r\n protected readonly triggerClasses = computed(() =>\r\n cn(\r\n comboboxTriggerVariants({ size: this.size(), hasError: this.hasError() }),\r\n this.multiple() && 'flex flex-wrap items-center gap-1 cursor-text focus-within:border-accent',\r\n ),\r\n );\r\n\r\n protected readonly selectedLabel = computed(\r\n () => this.options().find((o) => o.value === this.value())?.label ?? '',\r\n );\r\n\r\n protected readonly selectedOptions = computed(() => {\r\n const values = this.values();\r\n return values\r\n .map((v) => this.options().find((o) => o.value === v))\r\n .filter((o): o is ComboboxOption<T> => !!o);\r\n });\r\n\r\n protected readonly rows = computed<Row<T>[]>(() => {\r\n const q = this.query().trim().toLocaleLowerCase();\r\n const matches = !q\r\n ? this.options()\r\n : this.options().filter((o) =>\r\n `${o.label} ${o.description ?? ''}`.toLocaleLowerCase().includes(q),\r\n );\r\n const rows: Row<T>[] = matches.map((option) => ({ kind: 'option', option }));\r\n const exact = this.options().some((o) => o.label.toLocaleLowerCase() === q);\r\n if (this.creatable() && q && !exact) rows.push({ kind: 'create', query: this.query().trim() });\r\n return rows;\r\n });\r\n\r\n protected readonly activeDescendant = computed(() =>\r\n this.open() && this.rows().length ? `${this.optionIdPrefix}-${this.highlighted()}` : null,\r\n );\r\n\r\n protected createLabel(query: string): string {\r\n return this.labels().create.replace('{query}', query);\r\n }\r\n\r\n protected removeLabel(label: string): string {\r\n return this.labels().remove.replace('{label}', label);\r\n }\r\n\r\n writeValue(value: T | T[] | null): void {\r\n if (this.multiple()) this.values.set(Array.isArray(value) ? value : []);\r\n else this.value.set((value as T | null) ?? null);\r\n }\r\n\r\n registerOnChange(fn: (value: T | T[] | 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 onFocus(): void {\r\n if (this.disabled()) return;\r\n this.query.set('');\r\n this.highlighted.set(0);\r\n this.open.set(true);\r\n }\r\n\r\n protected focusInput(): void {\r\n this.inputEl()?.nativeElement.focus();\r\n }\r\n\r\n protected onQueryInput(raw: string): void {\r\n this.query.set(raw);\r\n this.highlighted.set(0);\r\n if (!this.open()) this.open.set(true);\r\n }\r\n\r\n protected choose(row: Row<T>): void {\r\n if (row.kind === 'create') {\r\n this.create.emit(row.query);\r\n this.query.set('');\r\n if (!this.multiple()) this.close();\r\n return;\r\n }\r\n const option = row.option;\r\n if (option.disabled) return;\r\n if (this.multiple()) {\r\n const values = this.values();\r\n const next = values.includes(option.value)\r\n ? values.filter((v) => v !== option.value)\r\n : [...values, option.value];\r\n this.values.set(next);\r\n this.onChange(next);\r\n this.query.set('');\r\n this.focusInput();\r\n return;\r\n }\r\n this.value.set(option.value);\r\n this.onChange(option.value);\r\n this.close();\r\n }\r\n\r\n protected removeValue(value: T): void {\r\n const next = this.values().filter((v) => v !== value);\r\n this.values.set(next);\r\n this.onChange(next);\r\n this.focusInput();\r\n }\r\n\r\n protected close(): void {\r\n this.open.set(false);\r\n this.query.set('');\r\n this.onTouched();\r\n }\r\n\r\n protected isSelected(option: ComboboxOption<T>): boolean {\r\n return this.multiple() ? this.values().includes(option.value) : option.value === this.value();\r\n }\r\n\r\n protected rowClasses(row: Row<T>, index: number): string {\r\n const selected = row.kind === 'option' && this.isSelected(row.option);\r\n return cn(\r\n comboboxOptionVariants({ highlighted: index === this.highlighted() && !selected, selected }),\r\n row.kind === 'option' && row.option.disabled && 'pointer-events-none opacity-50',\r\n selected && index === this.highlighted() && 'outline-1 -outline-offset-1 outline-accent/40',\r\n );\r\n }\r\n\r\n protected onKeydown(event: KeyboardEvent): void {\r\n const rows = this.rows();\r\n switch (event.key) {\r\n case 'Escape':\r\n if (this.open()) {\r\n event.preventDefault();\r\n this.close();\r\n }\r\n return;\r\n case 'ArrowDown':\r\n event.preventDefault();\r\n if (!this.open()) {\r\n this.open.set(true);\r\n return;\r\n }\r\n this.highlighted.update((i) => Math.min(rows.length - 1, i + 1));\r\n return;\r\n case 'ArrowUp':\r\n event.preventDefault();\r\n this.highlighted.update((i) => Math.max(0, i - 1));\r\n return;\r\n case 'Home':\r\n if (this.open()) {\r\n event.preventDefault();\r\n this.highlighted.set(0);\r\n }\r\n return;\r\n case 'End':\r\n if (this.open()) {\r\n event.preventDefault();\r\n this.highlighted.set(Math.max(0, rows.length - 1));\r\n }\r\n return;\r\n case 'Enter': {\r\n event.preventDefault();\r\n const row = rows[this.highlighted()];\r\n if (row) this.choose(row);\r\n return;\r\n }\r\n case 'Backspace':\r\n if (this.multiple() && !this.query() && this.values().length) {\r\n this.removeValue(this.values()[this.values().length - 1]!);\r\n }\r\n return;\r\n }\r\n }\r\n}\r\n","<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\r\n<div\r\n class=\"relative\"\r\n cdkOverlayOrigin\r\n #origin=\"cdkOverlayOrigin\"\r\n [class]=\"multiple() ? triggerClasses() : ''\"\r\n (click)=\"multiple() && focusInput()\"\r\n>\r\n @if (multiple()) {\r\n @for (option of selectedOptions(); track option.label) {\r\n <span\r\n class=\"inline-flex max-w-full items-center gap-1 rounded-sm bg-primary-tint py-0.5 ps-2 pe-1 text-xs font-medium text-primary-tint-fg animate-pop\"\r\n >\r\n <span class=\"truncate\">{{ option.label }}</span>\r\n <button\r\n type=\"button\"\r\n tabindex=\"-1\"\r\n class=\"flex h-4 w-4 items-center justify-center rounded-xs text-primary-tint-fg/70 hover:bg-state-hover hover:text-primary-tint-fg\"\r\n [attr.aria-label]=\"removeLabel(option.label)\"\r\n (mousedown)=\"$event.preventDefault()\"\r\n (click)=\"$event.stopPropagation(); removeValue(option.value)\"\r\n >\r\n <span mfIcon [size]=\"12\">close</span>\r\n </button>\r\n </span>\r\n }\r\n }\r\n <input\r\n #inputEl\r\n type=\"text\"\r\n role=\"combobox\"\r\n aria-autocomplete=\"list\"\r\n autocomplete=\"off\"\r\n [attr.id]=\"inputId() || null\"\r\n [class]=\"\r\n multiple()\r\n ? 'min-w-24 flex-1 border-0 bg-transparent p-0 text-sm text-fg outline-none placeholder:text-fg-subtle'\r\n : triggerClasses()\r\n \"\r\n [value]=\"open() || multiple() ? query() : selectedLabel()\"\r\n [placeholder]=\"multiple() && selectedOptions().length ? '' : effectivePlaceholder()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n [attr.aria-expanded]=\"open()\"\r\n [attr.aria-controls]=\"listboxId\"\r\n [attr.aria-activedescendant]=\"activeDescendant()\"\r\n [attr.aria-invalid]=\"hasError() || null\"\r\n (focus)=\"onFocus()\"\r\n (input)=\"onQueryInput($any($event.target).value)\"\r\n (keydown)=\"onKeydown($event)\"\r\n (blur)=\"close()\"\r\n />\r\n <span\r\n mfIcon\r\n [size]=\"18\"\r\n class=\"pointer-events-none absolute top-1/2 end-3 -translate-y-1/2 text-fg-subtle\"\r\n >unfold_more</span\r\n >\r\n</div>\r\n\r\n<mf-popover\r\n [origin]=\"origin\"\r\n [open]=\"open()\"\r\n placement=\"bottom-start\"\r\n padding=\"sm\"\r\n [hasBackdrop]=\"false\"\r\n [matchTriggerWidth]=\"true\"\r\n (closed)=\"close()\"\r\n>\r\n <ul\r\n [id]=\"listboxId\"\r\n role=\"listbox\"\r\n [attr.aria-multiselectable]=\"multiple() || null\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n class=\"max-h-64 min-w-[8rem] overflow-y-auto text-sm\"\r\n >\r\n @for (row of rows(); track $index; let i = $index) {\r\n <!--\r\n Satırlar BİLEREK odaklanabilir değil — odak input'ta kalır, vurgulanan\r\n satır aria-activedescendant ile duyurulur.\r\n -->\r\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\r\n <li\r\n role=\"option\"\r\n [id]=\"optionIdPrefix + '-' + i\"\r\n [attr.aria-selected]=\"row.kind === 'option' ? isSelected(row.option) : false\"\r\n [attr.aria-disabled]=\"(row.kind === 'option' && row.option.disabled) || null\"\r\n [class]=\"rowClasses(row, i)\"\r\n (mousedown)=\"$event.preventDefault()\"\r\n (mouseenter)=\"highlighted.set(i)\"\r\n (click)=\"choose(row)\"\r\n >\r\n @if (row.kind === 'option') {\r\n <span class=\"min-w-0\">\r\n <span class=\"block truncate\">{{ row.option.label }}</span>\r\n @if (row.option.description) {\r\n <span class=\"block truncate text-xs text-fg-subtle\">{{\r\n row.option.description\r\n }}</span>\r\n }\r\n </span>\r\n @if (isSelected(row.option)) {\r\n <span mfIcon [size]=\"16\" class=\"shrink-0\">check</span>\r\n }\r\n } @else {\r\n <span class=\"flex items-center gap-2 text-accent\">\r\n <span mfIcon [size]=\"16\">add</span>\r\n <span class=\"truncate\">{{ createLabel(row.query) }}</span>\r\n </span>\r\n }\r\n </li>\r\n } @empty {\r\n <li class=\"px-2.5 py-3 text-center text-fg-subtle\">{{ labels().noResults }}</li>\r\n }\r\n </ul>\r\n</mf-popover>\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-combobox.mjs","sources":["../../../projects/ui-kit/combobox/combobox.variants.ts","../../../projects/ui-kit/combobox/combobox.ts","../../../projects/ui-kit/combobox/combobox.html","../../../projects/ui-kit/combobox/mesgflow-ui-kit-combobox.ts"],"sourcesContent":["import { focusRecipe } from '@mesgflow/ui-kit/core';\r\nimport { cva, type VariantProps } from 'class-variance-authority';\r\n\r\n/** `Select`'in trigger/option görsel diliyle AYNI — bkz. select.variants.ts / `core/recipes.ts`. */\r\nexport const comboboxTriggerVariants = cva(\r\n 'w-full rounded-md border border-border bg-surface pe-9 text-sm text-fg shadow-control ' +\r\n 'transition-colors duration-fast ease-emphasis placeholder:text-fg-subtle ' +\r\n 'hover:border-border-strong ' +\r\n 'focus:border-accent ' +\r\n focusRecipe +\r\n ' ' +\r\n 'disabled:cursor-not-allowed disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none disabled:hover:border-border',\r\n {\r\n variants: {\r\n size: {\r\n sm: 'min-h-(--control-h-sm) px-2.5 py-1',\r\n md: 'min-h-(--control-h-md) px-3 py-1.5',\r\n lg: 'min-h-(--control-h-lg) px-3.5 py-1.5 text-base',\r\n },\r\n hasError: {\r\n true: 'border-danger focus:border-danger focus-visible:outline-danger',\r\n false: '',\r\n },\r\n },\r\n defaultVariants: { size: 'md', hasError: false },\r\n },\r\n);\r\n\r\nexport type ComboboxSize = VariantProps<typeof comboboxTriggerVariants>['size'];\r\nexport type ComboboxHasError = VariantProps<typeof comboboxTriggerVariants>['hasError'];\r\n\r\nexport const comboboxOptionVariants = cva(\r\n 'flex cursor-pointer items-center justify-between gap-2 rounded-sm px-2.5 py-1.5 text-fg-muted transition-colors duration-fast ease-emphasis',\r\n {\r\n variants: {\r\n highlighted: {\r\n true: 'bg-state-hover text-fg',\r\n false: '',\r\n },\r\n selected: {\r\n true: 'bg-primary-tint text-primary-tint-fg',\r\n false: '',\r\n },\r\n },\r\n defaultVariants: { highlighted: false, selected: false },\r\n },\r\n);\r\n","import { OverlayModule } from '@angular/cdk/overlay';\r\nimport {\r\n Component,\r\n ElementRef,\r\n booleanAttribute,\r\n computed,\r\n forwardRef,\r\n inject,\r\n input,\r\n model,\r\n output,\r\n signal,\r\n viewChild,\r\n} from '@angular/core';\r\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\r\nimport { cn, MF_COMBOBOX_LABELS, nextId, type MfSize } from '@mesgflow/ui-kit/core';\r\nimport { Icon } from '@mesgflow/ui-kit/icon';\r\nimport { Popover } from '@mesgflow/ui-kit/popover';\r\nimport { comboboxOptionVariants, comboboxTriggerVariants } from './combobox.variants';\r\n\r\nexport interface ComboboxOption<T> {\r\n label: string;\r\n value: T;\r\n /** İkincil satır (e-posta, açıklama) — aramaya da dahildir. */\r\n description?: string;\r\n disabled?: boolean;\r\n}\r\n\r\n/** Listede gösterilen satır — gerçek bir seçenek ya da \"oluştur\" satırı. */\r\ntype Row<T> = { kind: 'option'; option: ComboboxOption<T> } | { kind: 'create'; query: string };\r\n\r\n/**\r\n * `<mf-combobox [options]=\"opts\" [(value)]=\"chosen\" />` — filtrelenebilir tekli seçim.\r\n * `<mf-combobox multiple [options]=\"opts\" [(values)]=\"tags\" creatable (create)=\"add($event)\" />`\r\n * — çoklu seçim (çipler), isteğe bağlı \"oluştur\" satırı.\r\n *\r\n * ARIA 1.2 combobox deseni: input `role=\"combobox\"` + `aria-controls` (listbox)\r\n * + `aria-activedescendant` (vurgulanan satır; odak input'ta kalır). Çoklu\r\n * modda listbox `aria-multiselectable`, seçim sonrası panel AÇIK kalır ve\r\n * sorgu temizlenir; boş sorguda Backspace son çipi kaldırır.\r\n *\r\n * `(mousedown)=\"$event.preventDefault()\"` seçenek satırında ZORUNLU — aksi\r\n * halde input'un `blur`'ı `click`'ten ÖNCE tetiklenip paneli kapatır.\r\n */\r\n@Component({\r\n selector: 'mf-combobox',\r\n exportAs: 'mfCombobox',\r\n host: { class: 'block' },\r\n imports: [OverlayModule, Icon, Popover],\r\n templateUrl: './combobox.html',\r\n providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Combobox), multi: true }],\r\n})\r\nexport class Combobox<T> implements ControlValueAccessor {\r\n readonly options = input.required<ComboboxOption<T>[]>();\r\n readonly value = model<T | null>(null);\r\n /** Çoklu modda seçili değerler. */\r\n readonly values = model<T[]>([]);\r\n readonly multiple = input(false, { transform: booleanAttribute });\r\n /** Sorgu hiçbir etiketle birebir eşleşmezse listenin sonunda \"oluştur\" satırı. */\r\n readonly creatable = input(false, { transform: booleanAttribute });\r\n readonly placeholder = input<string>();\r\n readonly disabled = input(false, { transform: booleanAttribute });\r\n readonly size = input<MfSize>('md');\r\n readonly hasError = input(false, { transform: booleanAttribute });\r\n readonly ariaLabel = input('');\r\n /** Harici `<label for>` / `mf-field for` için input id'si. */\r\n readonly inputId = input<string>();\r\n\r\n /** \"Oluştur\" satırı seçildi — tüketici seçeneği ekleyip seçer. */\r\n readonly create = output<string>();\r\n\r\n private onChange: (value: T | T[] | null) => void = () => {};\r\n private onTouched: () => void = () => {};\r\n\r\n protected readonly labels = inject(MF_COMBOBOX_LABELS);\r\n protected readonly effectivePlaceholder = computed(\r\n () => this.placeholder() ?? this.labels().placeholder,\r\n );\r\n\r\n private readonly inputEl = viewChild<ElementRef<HTMLInputElement>>('inputEl');\r\n protected readonly open = signal(false);\r\n protected readonly query = signal('');\r\n protected readonly highlighted = signal(0);\r\n\r\n protected readonly listboxId = nextId('mf-combobox-listbox');\r\n protected readonly optionIdPrefix = nextId('mf-combobox-option');\r\n\r\n protected readonly triggerClasses = computed(() =>\r\n cn(\r\n comboboxTriggerVariants({ size: this.size(), hasError: this.hasError() }),\r\n this.multiple() && 'flex flex-wrap items-center gap-1 cursor-text focus-within:border-accent',\r\n ),\r\n );\r\n\r\n protected readonly selectedLabel = computed(\r\n () => this.options().find((o) => o.value === this.value())?.label ?? '',\r\n );\r\n\r\n protected readonly selectedOptions = computed(() => {\r\n const values = this.values();\r\n return values\r\n .map((v) => this.options().find((o) => o.value === v))\r\n .filter((o): o is ComboboxOption<T> => !!o);\r\n });\r\n\r\n protected readonly rows = computed<Row<T>[]>(() => {\r\n const q = this.query().trim().toLocaleLowerCase();\r\n const matches = !q\r\n ? this.options()\r\n : this.options().filter((o) =>\r\n `${o.label} ${o.description ?? ''}`.toLocaleLowerCase().includes(q),\r\n );\r\n const rows: Row<T>[] = matches.map((option) => ({ kind: 'option', option }));\r\n const exact = this.options().some((o) => o.label.toLocaleLowerCase() === q);\r\n if (this.creatable() && q && !exact) rows.push({ kind: 'create', query: this.query().trim() });\r\n return rows;\r\n });\r\n\r\n protected readonly activeDescendant = computed(() =>\r\n this.open() && this.rows().length ? `${this.optionIdPrefix}-${this.highlighted()}` : null,\r\n );\r\n\r\n protected createLabel(query: string): string {\r\n return this.labels().create.replace('{query}', query);\r\n }\r\n\r\n protected removeLabel(label: string): string {\r\n return this.labels().remove.replace('{label}', label);\r\n }\r\n\r\n writeValue(value: T | T[] | null): void {\r\n if (this.multiple()) this.values.set(Array.isArray(value) ? value : []);\r\n else this.value.set((value as T | null) ?? null);\r\n }\r\n\r\n registerOnChange(fn: (value: T | T[] | 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 onFocus(): void {\r\n if (this.disabled()) return;\r\n this.query.set('');\r\n this.highlighted.set(0);\r\n this.open.set(true);\r\n }\r\n\r\n protected focusInput(): void {\r\n this.inputEl()?.nativeElement.focus();\r\n }\r\n\r\n protected onQueryInput(raw: string): void {\r\n this.query.set(raw);\r\n this.highlighted.set(0);\r\n if (!this.open()) this.open.set(true);\r\n }\r\n\r\n protected choose(row: Row<T>): void {\r\n if (row.kind === 'create') {\r\n this.create.emit(row.query);\r\n this.query.set('');\r\n if (!this.multiple()) this.close();\r\n return;\r\n }\r\n const option = row.option;\r\n if (option.disabled) return;\r\n if (this.multiple()) {\r\n const values = this.values();\r\n const next = values.includes(option.value)\r\n ? values.filter((v) => v !== option.value)\r\n : [...values, option.value];\r\n this.values.set(next);\r\n this.onChange(next);\r\n this.query.set('');\r\n this.focusInput();\r\n return;\r\n }\r\n this.value.set(option.value);\r\n this.onChange(option.value);\r\n this.close();\r\n }\r\n\r\n protected removeValue(value: T): void {\r\n const next = this.values().filter((v) => v !== value);\r\n this.values.set(next);\r\n this.onChange(next);\r\n this.focusInput();\r\n }\r\n\r\n protected close(): void {\r\n this.open.set(false);\r\n this.query.set('');\r\n this.onTouched();\r\n }\r\n\r\n protected isSelected(option: ComboboxOption<T>): boolean {\r\n return this.multiple() ? this.values().includes(option.value) : option.value === this.value();\r\n }\r\n\r\n protected rowClasses(row: Row<T>, index: number): string {\r\n const selected = row.kind === 'option' && this.isSelected(row.option);\r\n return cn(\r\n comboboxOptionVariants({ highlighted: index === this.highlighted() && !selected, selected }),\r\n row.kind === 'option' && row.option.disabled && 'pointer-events-none opacity-50',\r\n selected && index === this.highlighted() && 'outline-1 -outline-offset-1 outline-accent/40',\r\n );\r\n }\r\n\r\n protected onKeydown(event: KeyboardEvent): void {\r\n const rows = this.rows();\r\n switch (event.key) {\r\n case 'Escape':\r\n if (this.open()) {\r\n event.preventDefault();\r\n this.close();\r\n }\r\n return;\r\n case 'ArrowDown':\r\n event.preventDefault();\r\n if (!this.open()) {\r\n this.open.set(true);\r\n return;\r\n }\r\n this.highlighted.update((i) => Math.min(rows.length - 1, i + 1));\r\n return;\r\n case 'ArrowUp':\r\n event.preventDefault();\r\n this.highlighted.update((i) => Math.max(0, i - 1));\r\n return;\r\n case 'Home':\r\n if (this.open()) {\r\n event.preventDefault();\r\n this.highlighted.set(0);\r\n }\r\n return;\r\n case 'End':\r\n if (this.open()) {\r\n event.preventDefault();\r\n this.highlighted.set(Math.max(0, rows.length - 1));\r\n }\r\n return;\r\n case 'Enter': {\r\n event.preventDefault();\r\n const row = rows[this.highlighted()];\r\n if (row) this.choose(row);\r\n return;\r\n }\r\n case 'Backspace':\r\n if (this.multiple() && !this.query() && this.values().length) {\r\n this.removeValue(this.values()[this.values().length - 1]!);\r\n }\r\n return;\r\n }\r\n }\r\n}\r\n","<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\r\n<div\r\n class=\"relative\"\r\n cdkOverlayOrigin\r\n #origin=\"cdkOverlayOrigin\"\r\n [class]=\"multiple() ? triggerClasses() : ''\"\r\n (click)=\"multiple() && focusInput()\"\r\n>\r\n @if (multiple()) {\r\n @for (option of selectedOptions(); track option.label) {\r\n <span\r\n class=\"inline-flex max-w-full items-center gap-1 rounded-sm bg-primary-tint py-0.5 ps-2 pe-1 text-xs font-medium text-primary-tint-fg animate-pop\"\r\n >\r\n <span class=\"truncate\">{{ option.label }}</span>\r\n <button\r\n type=\"button\"\r\n tabindex=\"-1\"\r\n class=\"flex h-4 w-4 items-center justify-center rounded-xs text-primary-tint-fg/70 hover:bg-state-hover hover:text-primary-tint-fg\"\r\n [attr.aria-label]=\"removeLabel(option.label)\"\r\n (mousedown)=\"$event.preventDefault()\"\r\n (click)=\"$event.stopPropagation(); removeValue(option.value)\"\r\n >\r\n <span mfIcon [size]=\"12\">close</span>\r\n </button>\r\n </span>\r\n }\r\n }\r\n <input\r\n #inputEl\r\n type=\"text\"\r\n role=\"combobox\"\r\n aria-autocomplete=\"list\"\r\n autocomplete=\"off\"\r\n [attr.id]=\"inputId() || null\"\r\n [class]=\"\r\n multiple()\r\n ? 'min-w-24 flex-1 border-0 bg-transparent p-0 text-sm text-fg outline-none placeholder:text-fg-subtle'\r\n : triggerClasses()\r\n \"\r\n [value]=\"open() || multiple() ? query() : selectedLabel()\"\r\n [placeholder]=\"multiple() && selectedOptions().length ? '' : effectivePlaceholder()\"\r\n [disabled]=\"disabled()\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n [attr.aria-expanded]=\"open()\"\r\n [attr.aria-controls]=\"listboxId\"\r\n [attr.aria-activedescendant]=\"activeDescendant()\"\r\n [attr.aria-invalid]=\"hasError() || null\"\r\n (focus)=\"onFocus()\"\r\n (input)=\"onQueryInput($any($event.target).value)\"\r\n (keydown)=\"onKeydown($event)\"\r\n (blur)=\"close()\"\r\n />\r\n <span\r\n mfIcon\r\n [size]=\"18\"\r\n class=\"pointer-events-none absolute top-1/2 end-3 -translate-y-1/2 text-fg-subtle\"\r\n >unfold_more</span\r\n >\r\n</div>\r\n\r\n<mf-popover\r\n [origin]=\"origin\"\r\n [open]=\"open()\"\r\n placement=\"bottom-start\"\r\n padding=\"sm\"\r\n [hasBackdrop]=\"false\"\r\n [matchTriggerWidth]=\"true\"\r\n (closed)=\"close()\"\r\n>\r\n <ul\r\n [id]=\"listboxId\"\r\n role=\"listbox\"\r\n [attr.aria-multiselectable]=\"multiple() || null\"\r\n [attr.aria-label]=\"ariaLabel() || null\"\r\n class=\"max-h-64 min-w-[8rem] overflow-y-auto text-sm\"\r\n >\r\n @for (row of rows(); track $index; let i = $index) {\r\n <!--\r\n Satırlar BİLEREK odaklanabilir değil — odak input'ta kalır, vurgulanan\r\n satır aria-activedescendant ile duyurulur.\r\n -->\r\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\r\n <li\r\n role=\"option\"\r\n [id]=\"optionIdPrefix + '-' + i\"\r\n [attr.aria-selected]=\"row.kind === 'option' ? isSelected(row.option) : false\"\r\n [attr.aria-disabled]=\"(row.kind === 'option' && row.option.disabled) || null\"\r\n [class]=\"rowClasses(row, i)\"\r\n (mousedown)=\"$event.preventDefault()\"\r\n (mouseenter)=\"highlighted.set(i)\"\r\n (click)=\"choose(row)\"\r\n >\r\n @if (row.kind === 'option') {\r\n <span class=\"min-w-0\">\r\n <span class=\"block truncate\">{{ row.option.label }}</span>\r\n @if (row.option.description) {\r\n <span class=\"block truncate text-xs text-fg-subtle\">{{\r\n row.option.description\r\n }}</span>\r\n }\r\n </span>\r\n @if (isSelected(row.option)) {\r\n <span mfIcon [size]=\"16\" class=\"shrink-0\">check</span>\r\n }\r\n } @else {\r\n <span class=\"flex items-center gap-2 text-accent\">\r\n <span mfIcon [size]=\"16\">add</span>\r\n <span class=\"truncate\">{{ createLabel(row.query) }}</span>\r\n </span>\r\n }\r\n </li>\r\n } @empty {\r\n <li class=\"px-2.5 py-3 text-center text-fg-subtle\">{{ labels().noResults }}</li>\r\n }\r\n </ul>\r\n</mf-popover>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,30 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, inject, ElementRef,
|
|
2
|
+
import { Directive, input, contentChild, computed, inject, ElementRef, afterRenderEffect, Component } from '@angular/core';
|
|
3
3
|
import { nextId } from '@mesgflow/ui-kit/core';
|
|
4
4
|
|
|
5
|
+
/**
|
|
6
|
+
* `<a mfLink mfFieldLabelAction routerLink="/forgot-password">Şifremi unuttum</a>` —
|
|
7
|
+
* `mf-field` içine konan öğeyi etiket satırının SAĞINA taşır (yaygın "etiket + eylem"
|
|
8
|
+
* kalıbı: parola alanının yanında "Şifremi unuttum").
|
|
9
|
+
*
|
|
10
|
+
* Öğe `<label>`'ın İÇİNE değil, KARDEŞİNE projekte edilir — label içindeki bir bağlantı
|
|
11
|
+
* tıklamayı alana yönlendirir ve ekran okuyucuda etiket adına karışırdı. DOM sırası =
|
|
12
|
+
* görsel sıra (etiket → eylem → alan), sekme sırası da buna uyar.
|
|
13
|
+
*
|
|
14
|
+
* `ms-auto`: etiket yoksa ya da dar ekranda alt satıra sarıldığında da sağda kalır.
|
|
15
|
+
*/
|
|
16
|
+
class FieldLabelAction {
|
|
17
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: FieldLabelAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
18
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: FieldLabelAction, isStandalone: true, selector: "[mfFieldLabelAction]", host: { classAttribute: "ms-auto min-w-0 text-sm" }, ngImport: i0 });
|
|
19
|
+
}
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: FieldLabelAction, decorators: [{
|
|
21
|
+
type: Directive,
|
|
22
|
+
args: [{
|
|
23
|
+
selector: '[mfFieldLabelAction]',
|
|
24
|
+
host: { class: 'ms-auto min-w-0 text-sm' },
|
|
25
|
+
}]
|
|
26
|
+
}] });
|
|
27
|
+
|
|
5
28
|
/**
|
|
6
29
|
* `<mf-field label="E-posta" for="email" [error]="emailError()" hint="İş adresiniz">
|
|
7
30
|
* <input mfInput id="email" type="email" />
|
|
@@ -14,6 +37,10 @@ import { nextId } from '@mesgflow/ui-kit/core';
|
|
|
14
37
|
* - `aria-required="true"` → `required` iken.
|
|
15
38
|
* Hata metni `role="alert"` DEĞİL, `aria-live="polite"` — her tuş vuruşunda
|
|
16
39
|
* ekran okuyucuyu kesmesin. `error` `string | undefined` kabul eder.
|
|
40
|
+
*
|
|
41
|
+
* Etiket satırında eylem: `[mfFieldLabelAction]` işaretli çocuk (ör. "Şifremi
|
|
42
|
+
* unuttum" bağlantısı) etiketin sağına, label'ın KARDEŞİ olarak projekte edilir —
|
|
43
|
+
* bkz. `FieldLabelAction`. Etiket boşsa da satır eylem için çizilir.
|
|
17
44
|
*/
|
|
18
45
|
class Field {
|
|
19
46
|
label = input('', /* @ts-ignore */
|
|
@@ -29,6 +56,10 @@ class Field {
|
|
|
29
56
|
/** `true` ise kalan yüksekliği doldurur (`flex-1 min-h-0`). */
|
|
30
57
|
grow = input(false, /* @ts-ignore */
|
|
31
58
|
...(ngDevMode ? [{ debugName: "grow" }] : /* istanbul ignore next */ []));
|
|
59
|
+
labelAction = contentChild(FieldLabelAction, /* @ts-ignore */
|
|
60
|
+
...(ngDevMode ? [{ debugName: "labelAction" }] : /* istanbul ignore next */ []));
|
|
61
|
+
hasLabelRow = computed(() => !!this.label() || !!this.labelAction(), /* @ts-ignore */
|
|
62
|
+
...(ngDevMode ? [{ debugName: "hasLabelRow" }] : /* istanbul ignore next */ []));
|
|
32
63
|
host = inject(ElementRef);
|
|
33
64
|
baseId = nextId('mf-field');
|
|
34
65
|
hintId = `${this.baseId}-hint`;
|
|
@@ -68,16 +99,16 @@ class Field {
|
|
|
68
99
|
});
|
|
69
100
|
}
|
|
70
101
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Field, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
71
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: Field, isStandalone: true, selector: "mf-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, for: { classPropertyName: "for", publicName: "for", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, grow: { classPropertyName: "grow", publicName: "grow", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block" }, ngImport: i0, template: "<div class=\"flex flex-col gap-1.5\" [class.min-h-0]=\"grow()\" [class.flex-1]=\"grow()\">\r\n @if (
|
|
102
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: Field, isStandalone: true, selector: "mf-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, for: { classPropertyName: "for", publicName: "for", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, grow: { classPropertyName: "grow", publicName: "grow", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block" }, queries: [{ propertyName: "labelAction", first: true, predicate: FieldLabelAction, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"flex flex-col gap-1.5\" [class.min-h-0]=\"grow()\" [class.flex-1]=\"grow()\">\r\n @if (hasLabelRow()) {\r\n <div class=\"flex flex-wrap items-baseline justify-between gap-x-2 gap-y-0.5\">\r\n @if (label()) {\r\n <label [attr.for]=\"for() || null\" class=\"text-label text-fg-muted\">\r\n {{ label() }}\r\n @if (required()) {\r\n <span class=\"text-danger\" aria-hidden=\"true\">*</span>\r\n }\r\n </label>\r\n }\r\n <ng-content select=\"[mfFieldLabelAction]\" />\r\n </div>\r\n }\r\n <ng-content />\r\n <div aria-live=\"polite\" class=\"empty:hidden\">\r\n @if (error()) {\r\n <p\r\n [id]=\"errorId\"\r\n class=\"m-0 flex items-center gap-1 text-xs text-danger animate-fade-in\"\r\n [textContent]=\"error()\"\r\n ></p>\r\n } @else if (hint()) {\r\n <p [id]=\"hintId\" class=\"m-0 text-xs text-fg-subtle\" [textContent]=\"hint()\"></p>\r\n }\r\n </div>\r\n</div>\r\n" });
|
|
72
103
|
}
|
|
73
104
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: Field, decorators: [{
|
|
74
105
|
type: Component,
|
|
75
|
-
args: [{ selector: 'mf-field', host: { class: 'block' }, template: "<div class=\"flex flex-col gap-1.5\" [class.min-h-0]=\"grow()\" [class.flex-1]=\"grow()\">\r\n @if (
|
|
76
|
-
}], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], for: [{ type: i0.Input, args: [{ isSignal: true, alias: "for", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], grow: [{ type: i0.Input, args: [{ isSignal: true, alias: "grow", required: false }] }] } });
|
|
106
|
+
args: [{ selector: 'mf-field', host: { class: 'block' }, template: "<div class=\"flex flex-col gap-1.5\" [class.min-h-0]=\"grow()\" [class.flex-1]=\"grow()\">\r\n @if (hasLabelRow()) {\r\n <div class=\"flex flex-wrap items-baseline justify-between gap-x-2 gap-y-0.5\">\r\n @if (label()) {\r\n <label [attr.for]=\"for() || null\" class=\"text-label text-fg-muted\">\r\n {{ label() }}\r\n @if (required()) {\r\n <span class=\"text-danger\" aria-hidden=\"true\">*</span>\r\n }\r\n </label>\r\n }\r\n <ng-content select=\"[mfFieldLabelAction]\" />\r\n </div>\r\n }\r\n <ng-content />\r\n <div aria-live=\"polite\" class=\"empty:hidden\">\r\n @if (error()) {\r\n <p\r\n [id]=\"errorId\"\r\n class=\"m-0 flex items-center gap-1 text-xs text-danger animate-fade-in\"\r\n [textContent]=\"error()\"\r\n ></p>\r\n } @else if (hint()) {\r\n <p [id]=\"hintId\" class=\"m-0 text-xs text-fg-subtle\" [textContent]=\"hint()\"></p>\r\n }\r\n </div>\r\n</div>\r\n" }]
|
|
107
|
+
}], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], for: [{ type: i0.Input, args: [{ isSignal: true, alias: "for", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], grow: [{ type: i0.Input, args: [{ isSignal: true, alias: "grow", required: false }] }], labelAction: [{ type: i0.ContentChild, args: [i0.forwardRef(() => FieldLabelAction), { isSignal: true }] }] } });
|
|
77
108
|
|
|
78
109
|
/**
|
|
79
110
|
* Generated bundle index. Do not edit.
|
|
80
111
|
*/
|
|
81
112
|
|
|
82
|
-
export { Field };
|
|
113
|
+
export { Field, FieldLabelAction };
|
|
83
114
|
//# sourceMappingURL=mesgflow-ui-kit-field.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mesgflow-ui-kit-field.mjs","sources":["../../../projects/ui-kit/field/field.ts","../../../projects/ui-kit/field/field.html","../../../projects/ui-kit/field/mesgflow-ui-kit-field.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"mesgflow-ui-kit-field.mjs","sources":["../../../projects/ui-kit/field/field-label-action.ts","../../../projects/ui-kit/field/field.ts","../../../projects/ui-kit/field/field.html","../../../projects/ui-kit/field/mesgflow-ui-kit-field.ts"],"sourcesContent":["import { Directive } from '@angular/core';\r\n\r\n/**\r\n * `<a mfLink mfFieldLabelAction routerLink=\"/forgot-password\">Şifremi unuttum</a>` —\r\n * `mf-field` içine konan öğeyi etiket satırının SAĞINA taşır (yaygın \"etiket + eylem\"\r\n * kalıbı: parola alanının yanında \"Şifremi unuttum\").\r\n *\r\n * Öğe `<label>`'ın İÇİNE değil, KARDEŞİNE projekte edilir — label içindeki bir bağlantı\r\n * tıklamayı alana yönlendirir ve ekran okuyucuda etiket adına karışırdı. DOM sırası =\r\n * görsel sıra (etiket → eylem → alan), sekme sırası da buna uyar.\r\n *\r\n * `ms-auto`: etiket yoksa ya da dar ekranda alt satıra sarıldığında da sağda kalır.\r\n */\r\n@Directive({\r\n selector: '[mfFieldLabelAction]',\r\n host: { class: 'ms-auto min-w-0 text-sm' },\r\n})\r\nexport class FieldLabelAction {}\r\n","import {\r\n Component,\r\n ElementRef,\r\n afterRenderEffect,\r\n computed,\r\n contentChild,\r\n inject,\r\n input,\r\n} from '@angular/core';\r\nimport { nextId } from '@mesgflow/ui-kit/core';\r\nimport { FieldLabelAction } from './field-label-action';\r\n\r\n/**\r\n * `<mf-field label=\"E-posta\" for=\"email\" [error]=\"emailError()\" hint=\"İş adresiniz\">\r\n * <input mfInput id=\"email\" type=\"email\" />\r\n * </mf-field>`\r\n *\r\n * `for` verildiğinde alan, içindeki `#for` kontrolünü OTOMATİK bağlar:\r\n * - `aria-describedby` → ipucu/hata metninin id'si (kontrolün mevcut\r\n * describedby değerleri korunur, yalnızca kendi id'lerini ekler/çıkarır),\r\n * - `aria-invalid=\"true\"` → hata varken,\r\n * - `aria-required=\"true\"` → `required` iken.\r\n * Hata metni `role=\"alert\"` DEĞİL, `aria-live=\"polite\"` — her tuş vuruşunda\r\n * ekran okuyucuyu kesmesin. `error` `string | undefined` kabul eder.\r\n *\r\n * Etiket satırında eylem: `[mfFieldLabelAction]` işaretli çocuk (ör. \"Şifremi\r\n * unuttum\" bağlantısı) etiketin sağına, label'ın KARDEŞİ olarak projekte edilir —\r\n * bkz. `FieldLabelAction`. Etiket boşsa da satır eylem için çizilir.\r\n */\r\n@Component({\r\n selector: 'mf-field',\r\n host: { class: 'block' },\r\n templateUrl: './field.html',\r\n})\r\nexport class Field {\r\n readonly label = input<string>('');\r\n readonly for = input<string>('');\r\n readonly hint = input<string>('');\r\n readonly error = input<string | undefined>('');\r\n readonly required = input(false);\r\n /** `true` ise kalan yüksekliği doldurur (`flex-1 min-h-0`). */\r\n readonly grow = input(false);\r\n\r\n private readonly labelAction = contentChild(FieldLabelAction);\r\n protected readonly hasLabelRow = computed(() => !!this.label() || !!this.labelAction());\r\n\r\n private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\r\n private readonly baseId = nextId('mf-field');\r\n protected readonly hintId = `${this.baseId}-hint`;\r\n protected readonly errorId = `${this.baseId}-error`;\r\n\r\n /** Şu an görünen açıklama metninin id'si (hata ipucunun yerine geçer). */\r\n protected readonly describedId = computed(() =>\r\n this.error() ? this.errorId : this.hint() ? this.hintId : null,\r\n );\r\n\r\n constructor() {\r\n afterRenderEffect(() => {\r\n const id = this.for();\r\n const described = this.describedId();\r\n const invalid = !!this.error();\r\n const required = this.required();\r\n if (!id) return;\r\n const control = this.host.nativeElement.querySelector<HTMLElement>(`#${CSS.escape(id)}`);\r\n if (!control) return;\r\n\r\n const own = new Set([this.hintId, this.errorId]);\r\n const ids = (control.getAttribute('aria-describedby') ?? '')\r\n .split(/\\s+/)\r\n .filter((x) => x && !own.has(x));\r\n if (described) ids.push(described);\r\n if (ids.length) control.setAttribute('aria-describedby', ids.join(' '));\r\n else control.removeAttribute('aria-describedby');\r\n\r\n if (invalid) control.setAttribute('aria-invalid', 'true');\r\n else control.removeAttribute('aria-invalid');\r\n if (required) control.setAttribute('aria-required', 'true');\r\n else control.removeAttribute('aria-required');\r\n });\r\n }\r\n}\r\n","<div class=\"flex flex-col gap-1.5\" [class.min-h-0]=\"grow()\" [class.flex-1]=\"grow()\">\r\n @if (hasLabelRow()) {\r\n <div class=\"flex flex-wrap items-baseline justify-between gap-x-2 gap-y-0.5\">\r\n @if (label()) {\r\n <label [attr.for]=\"for() || null\" class=\"text-label text-fg-muted\">\r\n {{ label() }}\r\n @if (required()) {\r\n <span class=\"text-danger\" aria-hidden=\"true\">*</span>\r\n }\r\n </label>\r\n }\r\n <ng-content select=\"[mfFieldLabelAction]\" />\r\n </div>\r\n }\r\n <ng-content />\r\n <div aria-live=\"polite\" class=\"empty:hidden\">\r\n @if (error()) {\r\n <p\r\n [id]=\"errorId\"\r\n class=\"m-0 flex items-center gap-1 text-xs text-danger animate-fade-in\"\r\n [textContent]=\"error()\"\r\n ></p>\r\n } @else if (hint()) {\r\n <p [id]=\"hintId\" class=\"m-0 text-xs text-fg-subtle\" [textContent]=\"hint()\"></p>\r\n }\r\n </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|