@kouji-ui/components 0.6.3 → 0.7.1
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.
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { ChangeDetectionStrategy, ViewEncapsulation, Component, input, inject, Injectable, booleanAttribute, computed, TemplateRef, model, ViewChild, contentChildren, ElementRef, PLATFORM_ID, DestroyRef, afterNextRender, effect, signal, Injector, viewChild, untracked, output, EventEmitter, Output, makeEnvironmentProviders, provideEnvironmentInitializer, forwardRef, EnvironmentInjector, Directive, InjectionToken, ViewContainerRef, contentChild, numberAttribute } from '@angular/core';
|
|
3
3
|
import * as i1 from '@kouji-ui/core';
|
|
4
|
-
import { KjAccordion, KjAccordionTrigger, KjAccordionItem, KjAccordionContent, SHEET_DATA, KjSheetRef, KjSheet, KjIconDirective, KjSheetService, KjAlert, KjAlertIcon, KjAlertTitle, KjAlertDescription, KjAlertActions, KjAlertDismiss, KJ_AVATAR_GROUP, KjAvatarImage, KjAvatarFallback, KjAvatar, KjAvatarGroup, KjBadge, KjBreadcrumb, KjBreadcrumbList, KjBreadcrumbItem, KjLink, KjBreadcrumbCurrent, KjBreadcrumbSeparator, KjBreadcrumbEllipsis, KjButton, KjButtonGroup, KjCalendar, KjCalendarHeader, KjCalendarGrid, KjCalendarDay, KjCarousel, KjLiveRegion, KjVisuallyHidden, KjCarouselViewport, KjCarouselSlide, KjCarouselPrevious, KjCarouselNext, KJ_CAROUSEL, KjCarouselIndicator, KjCarouselIndicators, KjCarouselAutoplay, KjCarouselPauseToggle, KjChatLog, KjChat, KjChatAvatar, KjChatHeader, KjChatBubble, KjChatFooter, KjChatAnnouncer, parseSlash, matchSlashCommands, KjCheckbox, KjColorPicker, KjColorPickerTrigger, KjColorPickerPanel, KjColorPickerArea, KjColorPickerHueSlider, KjColorPickerAlphaSlider, KjColorPickerInput, KjComboboxInput, KjComboboxListbox, KjCombobox, KjComboboxOption, KjConfirmPopup, KjConfirmPopupTrigger, KjPopoverContent, KjConfirmPopupContent, KjConfirmPopupMessage, KjConfirmPopupAction, KjConfirmPopupCancel, KjDatePicker, KjDatePickerTrigger, KjDatePickerCalendar, defaultDateRangePresets, KjDateRangePresets, KjDateRangePresetOption, KjLocale, KjDropdownMenuTrigger, KjDropdownMenuContent, KjDropdownMenuItem, KjDropdownMenuSeparator, KjDropdownMenuLabel, KjDropdownMenuGroup, KjSpinner, KjEditorLoader, KjEditor, KJ_SIZE_PRESET,
|
|
4
|
+
import { KjAccordion, KjAccordionTrigger, KjAccordionItem, KjAccordionContent, SHEET_DATA, KjSheetRef, KjSheet, KjIconDirective, KjSheetService, KjAlert, KjAlertIcon, KjAlertTitle, KjAlertDescription, KjAlertActions, KjAlertDismiss, KJ_AVATAR_GROUP, KjAvatarImage, KjAvatarFallback, KjAvatar, KjAvatarGroup, KjBadge, KjBreadcrumb, KjSize, KjBreadcrumbList, KjBreadcrumbItem, KJ_BREADCRUMB_CONFIG, KjLink, KjBreadcrumbCurrent, KjBreadcrumbSeparator, KjBreadcrumbEllipsis, KjButton, KjButtonGroup, KjCalendar, KjCalendarHeader, KjCalendarGrid, KjCalendarDay, KjCarousel, KjLiveRegion, KjVisuallyHidden, KjCarouselViewport, KjCarouselSlide, KjCarouselPrevious, KjCarouselNext, KJ_CAROUSEL, KjCarouselIndicator, KjCarouselIndicators, KjCarouselAutoplay, KjCarouselPauseToggle, KjChatLog, KjChat, KjChatAvatar, KjChatHeader, KjChatBubble, KjChatFooter, KjChatAnnouncer, parseSlash, matchSlashCommands, KjCheckbox, KjColorPicker, KjColorPickerTrigger, KjColorPickerPanel, KjColorPickerArea, KjColorPickerHueSlider, KjColorPickerAlphaSlider, KjColorPickerInput, KjComboboxInput, KjComboboxListbox, KjCombobox, KjComboboxOption, KjConfirmPopup, KjConfirmPopupTrigger, KjPopoverContent, KjConfirmPopupContent, KjConfirmPopupMessage, KjConfirmPopupAction, KjConfirmPopupCancel, KjDatePicker, KjDatePickerTrigger, KjDatePickerCalendar, defaultDateRangePresets, KjDateRangePresets, KjDateRangePresetOption, KjLocale, KjDropdownMenuTrigger, KjDropdownMenuContent, KjDropdownMenuItem, KjDropdownMenuSeparator, KjDropdownMenuLabel, KjDropdownMenuGroup, KjSpinner, KjVariant, KjEditorLoader, KjEditor, KJ_SIZE_PRESET, KjField, KjFieldLabel, KjFieldHelp, KjFieldError, KjFieldGroup, KjFileUpload, KjFileUploadTrigger, KjFileUploadDropzone, KjFileUploadList, KjFileUploadItem, KjProgressBar, KjProgressBarFill, KjForm, KjFormErrorSummary, KJ_ICON_REGISTRY, KjInput, KjInputGroup, KjInputGroupAddon, KjInputMask, KJ_INPUT_MASK_PRESETS, KjInputOtp, KjInputOtpCell, KjKbd, KJ_KBD_SIZE_PRESET, KjDivider, KJ_VARIANT_PRESET, KjList, KjListRow, KjMenubar, KjMenubarItem, KjNumberInput, KjNumberInputGroup, KjNumberStepper, KJ_OVERLAY_BADGE, KjOverlayBadgeContent, KjOverlayBadge, KjPagination, KjPaginationItem, KjPaginationPrevious, KjPaginationNext, KjPaginationFirst, KjPaginationLast, KjPaginationEllipsis, KjPaginationInfo, KJ_PASSWORD_INPUT, KjPasswordInput, KjPasswordInputScope, KjPasswordToggle, KjPasswordStrength, KjPasswordCapsLockWarning, KjPopoverTrigger, KjPopoverArrow, KjPopoverClose, KjPopoverTitle, KjRadioGroup, KjRadio, injectRteOverlayData, createKjImageNode, KJ_RTE_OVERLAY_DATA, KjRichTextEditor, KjRovingTabindex, KjRovingTabindexItemDirective, KjSelect, KjSelectTrigger, KjSelectContent, KjOption, KjSkeleton, KjSkipLink, KjSlider, KjSliderTrack, KjSliderRange, KjSliderThumb, KjSpeedDial, KjSpeedDialTrigger, KjSpeedDialActions, KjSpeedDialAction, KjStepper, KjStep, KjStepLabel, KjStepContent, KjStepperNext, KjStepperPrevious, KjStepperReset, KjToggle, KJ_TABLE, provideKjFilterParams, KjTable, KJ_TABLE_STORAGE, KjTableHeader, KjTableRow, KjTableCell, KjTableKeyboardNav, DRAWER_DATA, KjDrawer, KjDrawerService, bindPresets, KJ_TABS_CONFIG, KjTabs, KjTabList, KjTab, KjTabPanel, KjTag, KjTagRemove, KjTagList, KjTextarea, KjTimePicker, KjTimePickerHours, KjTimePickerMinutes, KjTimePickerSeconds, KjTimePickerMeridiem, KjToastViewport, KjToast, KjToastClose, KjTooltipTrigger, KjTooltipContent, KjTooltipArrow, KjTooltipGroup, KjCascadeSelect, KjCascadeSelectTrigger, KjCascadeSelectPanel, KjCascadeSelectOption, KjCascadeSelectSubPanel, KjCommandPalette, KjCommandInput, KjCommandList, KjCommandEmpty, injectListItem, KjListItem, KjCommandGroup, KjCommandSeparator, KjTreeSelectNode, KjTreeSelectToggle, KjTreeSelect, KjTreeSelectTrigger, KjTreeSelectContent } from '@kouji-ui/core';
|
|
5
5
|
export { KJ_DROPDOWN_MENU, KjBlockquote, KjCarousel, KjCarouselSlide, KjCascadeSelectOption, KjChatAnnouncer, KjChatStore, KjCode, KjColorPicker, KjCombobox, KjDatePicker, KjDialog, KjDialogRef, KjDialogService, KjDrawer, KjDrawerRef, KjDrawerService, KjDropdownMenuContent, KjDropdownMenuGroup, KjDropdownMenuItem, KjDropdownMenuLabel, KjDropdownMenuSeparator, KjDropdownMenuTrigger, KjFileUpload, KjInput, KjLead, KjLiveRegion, KjMuted, KjOverlayPanel, KjPopoverArrow, KjPopoverClose, KjPopoverContent, KjPopoverTitle, KjPopoverTrigger, KjRichTextEditor, KjSheet, KjSheetRef, KjSheetService, KjTabPanel, KjTable, KjTooltipArrow, KjTooltipContent, KjTooltipGroup, KjTooltipTrigger, KjTreeSelect, KjTruncate, SHEET_ARIA_LABEL, SHEET_DATA, SHEET_DETENT, SHEET_DISMISSIBLE } from '@kouji-ui/core';
|
|
6
6
|
import { NgTemplateOutlet, isPlatformBrowser, NgComponentOutlet } from '@angular/common';
|
|
7
7
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
@@ -1119,11 +1119,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
1119
1119
|
* @doc-is-main
|
|
1120
1120
|
*/
|
|
1121
1121
|
class KjBreadcrumbComponent {
|
|
1122
|
+
// Forwarded via `hostDirectives.inputs` above; re-declared for the docs
|
|
1123
|
+
// extractor only. Unset falls back to the `provideKjBreadcrumb(…)` default
|
|
1124
|
+
// (`'md'`).
|
|
1122
1125
|
/** Size preset cascaded onto descendants. Default `'md'`. */
|
|
1123
|
-
kjSize = input(
|
|
1126
|
+
kjSize = input(undefined, /* @ts-ignore */
|
|
1124
1127
|
...(ngDevMode ? [{ debugName: "kjSize" }] : /* istanbul ignore next */ []));
|
|
1125
1128
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1126
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: KjBreadcrumbComponent, isStandalone: true, selector: "nav[kj-breadcrumb], kj-breadcrumb", inputs: { kjSize: { classPropertyName: "kjSize", publicName: "kjSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "navigation" },
|
|
1129
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: KjBreadcrumbComponent, isStandalone: true, selector: "nav[kj-breadcrumb], kj-breadcrumb", inputs: { kjSize: { classPropertyName: "kjSize", publicName: "kjSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "navigation" }, classAttribute: "kj-breadcrumb" }, hostDirectives: [{ directive: i1.KjBreadcrumb, inputs: ["kjAriaLabel", "kjAriaLabel", "kjSeparator", "kjSeparator", "kjMaxItems", "kjMaxItems", "kjOverflow", "kjOverflow"] }, { directive: i1.KjSize, inputs: ["kjSize", "kjSize"] }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: ["@layer kj.component{.kj-breadcrumb{--kj-breadcrumb-gap: var(--kj-space-sm, .5rem);--kj-breadcrumb-separator-content: \"/\";--kj-breadcrumb-overflow-pad: .25rem;--kj-color-breadcrumb-muted: var(--kj-fg-muted);--kj-color-breadcrumb-current: var(--kj-fg-default);display:block;color:var(--kj-color-breadcrumb-muted);font-size:.875rem}.kj-breadcrumb[data-size=sm]{font-size:.8125rem}.kj-breadcrumb[data-size=md]{font-size:.875rem}.kj-breadcrumb[data-size=lg]{font-size:1rem}.kj-breadcrumb-list{display:flex;align-items:center;flex-wrap:nowrap;gap:var(--kj-breadcrumb-gap);margin:0;padding:0;list-style:none;min-width:0}.kj-breadcrumb-list[data-wrap=wrap]{flex-wrap:wrap}.kj-breadcrumb-list[data-wrap=no-wrap],.kj-breadcrumb-list[data-wrap=truncate]{flex-wrap:nowrap}.kj-breadcrumb-item{display:inline-flex;align-items:center;gap:var(--kj-breadcrumb-gap);min-width:0}.kj-breadcrumb-item[data-hidden]{display:none}.kj-breadcrumb-list:not([data-explicit-separators])>.kj-breadcrumb-item:not(:first-child):before{content:var(--kj-breadcrumb-separator-content, \"/\");color:var(--kj-color-breadcrumb-muted);opacity:.65;-webkit-user-select:none;user-select:none;margin-inline-end:var(--kj-breadcrumb-gap)}[dir=rtl] .kj-breadcrumb[data-mirror-separator] .kj-breadcrumb-list:not([data-explicit-separators])>.kj-breadcrumb-item:not(:first-child):before{display:inline-block;transform:scaleX(-1)}.kj-breadcrumb-separator{display:inline-flex;align-items:center;color:var(--kj-color-breadcrumb-muted);opacity:.65;-webkit-user-select:none;user-select:none}.kj-breadcrumb-link{--kj-link-fg: var(--kj-color-breadcrumb-muted);--kj-link-hover-fg: var(--kj-color-breadcrumb-current);color:var(--kj-link-fg);text-decoration:none;padding-block:.5rem;transition:color var(--kj-transition, .15s ease)}.kj-breadcrumb-link:hover{color:var(--kj-link-hover-fg);text-decoration:underline;text-underline-offset:3px}.kj-breadcrumb-link:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px;border-radius:var(--kj-radius-field, .25rem)}.kj-breadcrumb-current{color:var(--kj-color-breadcrumb-current);font-weight:500}.kj-breadcrumb-ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:1.5rem;padding-inline:var(--kj-breadcrumb-overflow-pad);color:var(--kj-color-breadcrumb-muted);background:transparent;border:0;cursor:default;-webkit-user-select:none;user-select:none}.kj-breadcrumb-ellipsis[data-overflow=menu]{cursor:pointer;border-radius:var(--kj-radius-field, .25rem)}.kj-breadcrumb-ellipsis[data-overflow=menu]:hover{background:var(--kj-bg-surface, transparent)}@media print{.kj-breadcrumb-item[data-hidden]{display:revert}.kj-breadcrumb-ellipsis{display:none}}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1127
1130
|
}
|
|
1128
1131
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjBreadcrumbComponent, decorators: [{
|
|
1129
1132
|
type: Component,
|
|
@@ -1132,10 +1135,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
1132
1135
|
directive: KjBreadcrumb,
|
|
1133
1136
|
inputs: ['kjAriaLabel', 'kjSeparator', 'kjMaxItems', 'kjOverflow'],
|
|
1134
1137
|
},
|
|
1138
|
+
// Host-directive input forwarding is not transitive: KjBreadcrumb composes
|
|
1139
|
+
// KjSize itself, but the wrapper must compose it directly to expose kjSize
|
|
1140
|
+
// as its own input (same instance — Angular applies a directive once per
|
|
1141
|
+
// host). Unset falls back to the `provideKjBreadcrumb(…)` default.
|
|
1142
|
+
{ directive: KjSize, inputs: ['kjSize'] },
|
|
1135
1143
|
], template: `<ng-content />`, encapsulation: ViewEncapsulation.None, host: {
|
|
1136
1144
|
'class': 'kj-breadcrumb',
|
|
1137
1145
|
'role': 'navigation',
|
|
1138
|
-
'[attr.data-size]': 'kjSize()',
|
|
1139
1146
|
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{.kj-breadcrumb{--kj-breadcrumb-gap: var(--kj-space-sm, .5rem);--kj-breadcrumb-separator-content: \"/\";--kj-breadcrumb-overflow-pad: .25rem;--kj-color-breadcrumb-muted: var(--kj-fg-muted);--kj-color-breadcrumb-current: var(--kj-fg-default);display:block;color:var(--kj-color-breadcrumb-muted);font-size:.875rem}.kj-breadcrumb[data-size=sm]{font-size:.8125rem}.kj-breadcrumb[data-size=md]{font-size:.875rem}.kj-breadcrumb[data-size=lg]{font-size:1rem}.kj-breadcrumb-list{display:flex;align-items:center;flex-wrap:nowrap;gap:var(--kj-breadcrumb-gap);margin:0;padding:0;list-style:none;min-width:0}.kj-breadcrumb-list[data-wrap=wrap]{flex-wrap:wrap}.kj-breadcrumb-list[data-wrap=no-wrap],.kj-breadcrumb-list[data-wrap=truncate]{flex-wrap:nowrap}.kj-breadcrumb-item{display:inline-flex;align-items:center;gap:var(--kj-breadcrumb-gap);min-width:0}.kj-breadcrumb-item[data-hidden]{display:none}.kj-breadcrumb-list:not([data-explicit-separators])>.kj-breadcrumb-item:not(:first-child):before{content:var(--kj-breadcrumb-separator-content, \"/\");color:var(--kj-color-breadcrumb-muted);opacity:.65;-webkit-user-select:none;user-select:none;margin-inline-end:var(--kj-breadcrumb-gap)}[dir=rtl] .kj-breadcrumb[data-mirror-separator] .kj-breadcrumb-list:not([data-explicit-separators])>.kj-breadcrumb-item:not(:first-child):before{display:inline-block;transform:scaleX(-1)}.kj-breadcrumb-separator{display:inline-flex;align-items:center;color:var(--kj-color-breadcrumb-muted);opacity:.65;-webkit-user-select:none;user-select:none}.kj-breadcrumb-link{--kj-link-fg: var(--kj-color-breadcrumb-muted);--kj-link-hover-fg: var(--kj-color-breadcrumb-current);color:var(--kj-link-fg);text-decoration:none;padding-block:.5rem;transition:color var(--kj-transition, .15s ease)}.kj-breadcrumb-link:hover{color:var(--kj-link-hover-fg);text-decoration:underline;text-underline-offset:3px}.kj-breadcrumb-link:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px;border-radius:var(--kj-radius-field, .25rem)}.kj-breadcrumb-current{color:var(--kj-color-breadcrumb-current);font-weight:500}.kj-breadcrumb-ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:1.5rem;padding-inline:var(--kj-breadcrumb-overflow-pad);color:var(--kj-color-breadcrumb-muted);background:transparent;border:0;cursor:default;-webkit-user-select:none;user-select:none}.kj-breadcrumb-ellipsis[data-overflow=menu]{cursor:pointer;border-radius:var(--kj-radius-field, .25rem)}.kj-breadcrumb-ellipsis[data-overflow=menu]:hover{background:var(--kj-bg-surface, transparent)}@media print{.kj-breadcrumb-item[data-hidden]{display:revert}.kj-breadcrumb-ellipsis{display:none}}}\n"] }]
|
|
1140
1147
|
}], propDecorators: { kjSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjSize", required: false }] }] } });
|
|
1141
1148
|
/**
|
|
@@ -1207,14 +1214,15 @@ class KjBreadcrumbLinkComponent {
|
|
|
1207
1214
|
/** Bound to `[attr.aria-label]` on the inner `<a>`. */
|
|
1208
1215
|
kjAriaLabel = input(undefined, /* @ts-ignore */
|
|
1209
1216
|
...(ngDevMode ? [{ debugName: "kjAriaLabel" }] : /* istanbul ignore next */ []));
|
|
1210
|
-
|
|
1211
|
-
|
|
1217
|
+
config = inject(KJ_BREADCRUMB_CONFIG);
|
|
1218
|
+
/** KjLink variant. Defaults to `provideKjBreadcrumb(…)`'s `linkVariant` (`'muted'`). */
|
|
1219
|
+
kjVariant = input(this.config.defaults.linkVariant, /* @ts-ignore */
|
|
1212
1220
|
...(ngDevMode ? [{ debugName: "kjVariant" }] : /* istanbul ignore next */ []));
|
|
1213
|
-
/** KjLink size. Defaults to `'sm'`
|
|
1214
|
-
kjSize = input(
|
|
1221
|
+
/** KjLink size. Defaults to `provideKjBreadcrumb(…)`'s `linkSize` (`'sm'`). */
|
|
1222
|
+
kjSize = input(this.config.defaults.linkSize, /* @ts-ignore */
|
|
1215
1223
|
...(ngDevMode ? [{ debugName: "kjSize" }] : /* istanbul ignore next */ []));
|
|
1216
|
-
/** Underline mode. Defaults to `'hover'
|
|
1217
|
-
kjUnderline = input(
|
|
1224
|
+
/** Underline mode. Defaults to `provideKjBreadcrumb(…)`'s `linkUnderline` (`'hover'`). */
|
|
1225
|
+
kjUnderline = input(this.config.defaults.linkUnderline, /* @ts-ignore */
|
|
1218
1226
|
...(ngDevMode ? [{ debugName: "kjUnderline" }] : /* istanbul ignore next */ []));
|
|
1219
1227
|
/** External-link tri-state. Forwarded to `KjLink`. */
|
|
1220
1228
|
kjExternal = input(false, /* @ts-ignore */
|
|
@@ -1448,9 +1456,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
1448
1456
|
* @doc-description Themed button with variants, sizes, and built-in disabled, loading, and pressed states.
|
|
1449
1457
|
*/
|
|
1450
1458
|
class KjButtonComponent {
|
|
1451
|
-
|
|
1459
|
+
/**
|
|
1460
|
+
* Visual variant. Left unset, the inner `[kjButton]` resolves it:
|
|
1461
|
+
* enclosing button-group cascade, else the `provideKjButton(…)` default,
|
|
1462
|
+
* else `'default'`. Binding a hardcoded default here would clobber that
|
|
1463
|
+
* chain — keep it `undefined` when the consumer didn't choose one.
|
|
1464
|
+
*/
|
|
1465
|
+
kjVariant = input(undefined, /* @ts-ignore */
|
|
1452
1466
|
...(ngDevMode ? [{ debugName: "kjVariant" }] : /* istanbul ignore next */ []));
|
|
1453
|
-
|
|
1467
|
+
/** Size preset. Resolution mirrors {@link kjVariant} (default `'md'`). */
|
|
1468
|
+
kjSize = input(undefined, /* @ts-ignore */
|
|
1454
1469
|
...(ngDevMode ? [{ debugName: "kjSize" }] : /* istanbul ignore next */ []));
|
|
1455
1470
|
kjDisabled = input(false, /* @ts-ignore */
|
|
1456
1471
|
...(ngDevMode ? [{ debugName: "kjDisabled" }] : /* istanbul ignore next */ []));
|
|
@@ -2831,11 +2846,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2831
2846
|
* @doc-name chat
|
|
2832
2847
|
*/
|
|
2833
2848
|
class KjChatBubbleComponent {
|
|
2834
|
-
/** Visual register. Validated against `KJ_CHAT_BUBBLE_CONFIG`. */
|
|
2835
|
-
kjVariant = input(
|
|
2849
|
+
/** Visual register. Validated against `KJ_CHAT_BUBBLE_CONFIG`. Unset falls back to the `provideKjChatBubble(…)` default (`'default'`). */
|
|
2850
|
+
kjVariant = input(undefined, /* @ts-ignore */
|
|
2836
2851
|
...(ngDevMode ? [{ debugName: "kjVariant" }] : /* istanbul ignore next */ []));
|
|
2837
|
-
/** Density preset. Drives padding + font-size on the bubble. */
|
|
2838
|
-
kjSize = input(
|
|
2852
|
+
/** Density preset. Drives padding + font-size on the bubble. Unset falls back to the configured default (`'md'`). */
|
|
2853
|
+
kjSize = input(undefined, /* @ts-ignore */
|
|
2839
2854
|
...(ngDevMode ? [{ debugName: "kjSize" }] : /* istanbul ignore next */ []));
|
|
2840
2855
|
/** Suppresses the tail unconditionally. Auto-suppression on grouped rows is independent. */
|
|
2841
2856
|
kjChatBubbleNoTail = input(false, /* @ts-ignore */
|
|
@@ -5480,19 +5495,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
5480
5495
|
* @doc-is-main
|
|
5481
5496
|
*/
|
|
5482
5497
|
class KjSpinnerComponent {
|
|
5498
|
+
// Inputs are forwarded via `hostDirectives.inputs` above. Re-declared here
|
|
5499
|
+
// for the docs extractor only — the forwarded copies are authoritative.
|
|
5483
5500
|
/**
|
|
5484
|
-
* Color preset reflected to `data-variant` on the host.
|
|
5485
|
-
* `'neutral'`, which resolves to
|
|
5486
|
-
*
|
|
5501
|
+
* Color preset reflected to `data-variant` on the host. Unset falls back
|
|
5502
|
+
* to the `provideKjSpinner(…)` default (`'neutral'`, which resolves to
|
|
5503
|
+
* `currentColor` in shipped themes — so a spinner inside a coloured
|
|
5504
|
+
* surface inherits its parent's text colour).
|
|
5487
5505
|
*/
|
|
5488
|
-
kjVariant = input(
|
|
5506
|
+
kjVariant = input(undefined, /* @ts-ignore */
|
|
5489
5507
|
...(ngDevMode ? [{ debugName: "kjVariant" }] : /* istanbul ignore next */ []));
|
|
5490
5508
|
/**
|
|
5491
|
-
* Size preset reflected to `data-size` on the host.
|
|
5492
|
-
* Sizes ship as `xs | sm | md | lg`; an
|
|
5493
|
-
* spinner that big almost always wants a
|
|
5509
|
+
* Size preset reflected to `data-size` on the host. Unset falls back to
|
|
5510
|
+
* the configured default (`'md'`). Sizes ship as `xs | sm | md | lg`; an
|
|
5511
|
+
* `xl` is intentionally absent — a spinner that big almost always wants a
|
|
5512
|
+
* determinate Progress Bar instead.
|
|
5494
5513
|
*/
|
|
5495
|
-
kjSize = input(
|
|
5514
|
+
kjSize = input(undefined, /* @ts-ignore */
|
|
5496
5515
|
...(ngDevMode ? [{ debugName: "kjSize" }] : /* istanbul ignore next */ []));
|
|
5497
5516
|
/**
|
|
5498
5517
|
* Animation shape preset forwarded to `KjSpinner.kjAnimation` via the
|
|
@@ -5534,7 +5553,7 @@ class KjSpinnerComponent {
|
|
|
5534
5553
|
this.el.nativeElement.hasAttribute('aria-labelledby');
|
|
5535
5554
|
}
|
|
5536
5555
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5537
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: KjSpinnerComponent, isStandalone: true, selector: "kj-spinner", inputs: { kjVariant: { classPropertyName: "kjVariant", publicName: "kjVariant", isSignal: true, isRequired: false, transformFunction: null }, kjSize: { classPropertyName: "kjSize", publicName: "kjSize", isSignal: true, isRequired: false, transformFunction: null }, kjAnimation: { classPropertyName: "kjAnimation", publicName: "kjAnimation", isSignal: true, isRequired: false, transformFunction: null }, kjAriaLabel: { classPropertyName: "kjAriaLabel", publicName: "kjAriaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: {
|
|
5556
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: KjSpinnerComponent, isStandalone: true, selector: "kj-spinner", inputs: { kjVariant: { classPropertyName: "kjVariant", publicName: "kjVariant", isSignal: true, isRequired: false, transformFunction: null }, kjSize: { classPropertyName: "kjSize", publicName: "kjSize", isSignal: true, isRequired: false, transformFunction: null }, kjAnimation: { classPropertyName: "kjAnimation", publicName: "kjAnimation", isSignal: true, isRequired: false, transformFunction: null }, kjAriaLabel: { classPropertyName: "kjAriaLabel", publicName: "kjAriaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kj-spinner" }, hostDirectives: [{ directive: i1.KjSpinner, inputs: ["kjAnimation", "kjAnimation", "kjAriaLabel", "kjAriaLabel"] }, { directive: i1.KjVariant, inputs: ["kjVariant", "kjVariant"] }, { directive: i1.KjSize, inputs: ["kjSize", "kjSize"] }], ngImport: i0, template: `
|
|
5538
5557
|
<span class="kj-spinner__glyph" aria-hidden="true"></span>
|
|
5539
5558
|
@if (shouldRenderHiddenLabel()) {
|
|
5540
5559
|
<span kjVisuallyHidden>{{ kjAriaLabel() }}</span>
|
|
@@ -5544,24 +5563,21 @@ class KjSpinnerComponent {
|
|
|
5544
5563
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjSpinnerComponent, decorators: [{
|
|
5545
5564
|
type: Component,
|
|
5546
5565
|
args: [{ selector: 'kj-spinner', standalone: true, imports: [KjVisuallyHidden], hostDirectives: [
|
|
5547
|
-
{
|
|
5548
|
-
|
|
5549
|
-
|
|
5550
|
-
|
|
5551
|
-
|
|
5552
|
-
|
|
5553
|
-
|
|
5554
|
-
},
|
|
5566
|
+
{ directive: KjSpinner, inputs: ['kjAnimation', 'kjAriaLabel'] },
|
|
5567
|
+
// Host-directive input forwarding is not transitive: KjSpinner composes
|
|
5568
|
+
// KjVariant / KjSize itself, but the wrapper must compose them directly
|
|
5569
|
+
// to expose kjVariant / kjSize as its own inputs. Angular applies each
|
|
5570
|
+
// directive once per host, so these bind the same preset instances that
|
|
5571
|
+
// KjSpinner already composes — unset falls back to the
|
|
5572
|
+
// `provideKjSpinner(…)` default.
|
|
5573
|
+
{ directive: KjVariant, inputs: ['kjVariant'] },
|
|
5574
|
+
{ directive: KjSize, inputs: ['kjSize'] },
|
|
5555
5575
|
], template: `
|
|
5556
5576
|
<span class="kj-spinner__glyph" aria-hidden="true"></span>
|
|
5557
5577
|
@if (shouldRenderHiddenLabel()) {
|
|
5558
5578
|
<span kjVisuallyHidden>{{ kjAriaLabel() }}</span>
|
|
5559
5579
|
}
|
|
5560
|
-
`, encapsulation: ViewEncapsulation.None, host: {
|
|
5561
|
-
'class': 'kj-spinner',
|
|
5562
|
-
'[attr.data-variant]': 'kjVariant()',
|
|
5563
|
-
'[attr.data-size]': 'kjSize()',
|
|
5564
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{.kj-spinner{--kj-spinner-size: 1.25rem;--kj-spinner-color: currentColor;--kj-spinner-track: color-mix(in srgb, currentColor 20%, transparent);--kj-spinner-duration: .7s;display:inline-flex;align-items:center;justify-content:center;inline-size:var(--kj-spinner-size);block-size:var(--kj-spinner-size);color:var(--kj-spinner-color);pointer-events:none}.kj-spinner[data-size=xs]{--kj-spinner-size: .75rem}.kj-spinner[data-size=sm]{--kj-spinner-size: 1rem}.kj-spinner[data-size=md]{--kj-spinner-size: 1.25rem}.kj-spinner[data-size=lg]{--kj-spinner-size: 1.75rem}.kj-spinner[data-variant=neutral]{--kj-spinner-color: currentColor}.kj-spinner[data-variant=primary]{--kj-spinner-color: var(--kj-fg-primary)}.kj-spinner[data-variant=secondary]{--kj-spinner-color: var(--kj-fg-default)}.kj-spinner[data-variant=success]{--kj-spinner-color: var(--kj-fg-success, #16a34a)}.kj-spinner[data-variant=warning]{--kj-spinner-color: var(--kj-fg-warning, #d97706)}.kj-spinner[data-variant=error]{--kj-spinner-color: var(--kj-fg-danger, #dc2626)}.kj-spinner[data-variant=info]{--kj-spinner-color: var(--kj-fg-info, #2563eb)}.kj-spinner__glyph{display:inline-block;inline-size:100%;block-size:100%}.kj-spinner[data-animation=spin] .kj-spinner__glyph{border:2px solid var(--kj-spinner-track);border-block-start-color:var(--kj-spinner-color);border-radius:50%;animation:kj-spinner-spin var(--kj-spinner-duration) linear infinite}.kj-spinner[data-animation=pulse] .kj-spinner__glyph{background:var(--kj-spinner-color);border-radius:50%;animation:kj-spinner-pulse calc(var(--kj-spinner-duration) * 2) ease-in-out infinite}.kj-spinner[data-animation=dots]{inline-size:auto}.kj-spinner[data-animation=dots] .kj-spinner__glyph{display:inline-flex;gap:calc(var(--kj-spinner-size) * .25);inline-size:auto;block-size:100%}.kj-spinner[data-animation=dots] .kj-spinner__glyph:before,.kj-spinner[data-animation=dots] .kj-spinner__glyph:after{content:\"\";inline-size:calc(var(--kj-spinner-size) * .3);block-size:calc(var(--kj-spinner-size) * .3);background:var(--kj-spinner-color);border-radius:50%;animation:kj-spinner-dots calc(var(--kj-spinner-duration) * 2) ease-in-out infinite}.kj-spinner[data-animation=dots] .kj-spinner__glyph{background:transparent}.kj-spinner[data-animation=dots] .kj-spinner__glyph:after{animation-delay:calc(var(--kj-spinner-duration) * .4)}.kj-spinner[data-animation=bars]{inline-size:auto}.kj-spinner[data-animation=bars] .kj-spinner__glyph{display:inline-flex;align-items:stretch;gap:calc(var(--kj-spinner-size) * .15);inline-size:auto;block-size:100%}.kj-spinner[data-animation=bars] .kj-spinner__glyph:before,.kj-spinner[data-animation=bars] .kj-spinner__glyph:after{content:\"\";inline-size:calc(var(--kj-spinner-size) * .2);background:var(--kj-spinner-color);border-radius:calc(var(--kj-spinner-size) * .05);animation:kj-spinner-bars calc(var(--kj-spinner-duration) * 1.6) ease-in-out infinite;transform-origin:center}.kj-spinner[data-animation=bars] .kj-spinner__glyph:after{animation-delay:calc(var(--kj-spinner-duration) * .4)}.kj-spinner[data-reduced-motion=true] .kj-spinner__glyph,.kj-spinner[data-reduced-motion=true] .kj-spinner__glyph:before,.kj-spinner[data-reduced-motion=true] .kj-spinner__glyph:after{animation:kj-spinner-reduced-motion 1.6s ease-in-out infinite!important}}@keyframes kj-spinner-spin{to{transform:rotate(360deg)}}@keyframes kj-spinner-pulse{0%,to{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1)}}@keyframes kj-spinner-dots{0%,80%,to{transform:scale(.4);opacity:.4}40%{transform:scale(1);opacity:1}}@keyframes kj-spinner-bars{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}@keyframes kj-spinner-reduced-motion{0%,to{opacity:.45}50%{opacity:1}}\n"] }]
|
|
5580
|
+
`, encapsulation: ViewEncapsulation.None, host: { class: 'kj-spinner' }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{.kj-spinner{--kj-spinner-size: 1.25rem;--kj-spinner-color: currentColor;--kj-spinner-track: color-mix(in srgb, currentColor 20%, transparent);--kj-spinner-duration: .7s;display:inline-flex;align-items:center;justify-content:center;inline-size:var(--kj-spinner-size);block-size:var(--kj-spinner-size);color:var(--kj-spinner-color);pointer-events:none}.kj-spinner[data-size=xs]{--kj-spinner-size: .75rem}.kj-spinner[data-size=sm]{--kj-spinner-size: 1rem}.kj-spinner[data-size=md]{--kj-spinner-size: 1.25rem}.kj-spinner[data-size=lg]{--kj-spinner-size: 1.75rem}.kj-spinner[data-variant=neutral]{--kj-spinner-color: currentColor}.kj-spinner[data-variant=primary]{--kj-spinner-color: var(--kj-fg-primary)}.kj-spinner[data-variant=secondary]{--kj-spinner-color: var(--kj-fg-default)}.kj-spinner[data-variant=success]{--kj-spinner-color: var(--kj-fg-success, #16a34a)}.kj-spinner[data-variant=warning]{--kj-spinner-color: var(--kj-fg-warning, #d97706)}.kj-spinner[data-variant=error]{--kj-spinner-color: var(--kj-fg-danger, #dc2626)}.kj-spinner[data-variant=info]{--kj-spinner-color: var(--kj-fg-info, #2563eb)}.kj-spinner__glyph{display:inline-block;inline-size:100%;block-size:100%}.kj-spinner[data-animation=spin] .kj-spinner__glyph{border:2px solid var(--kj-spinner-track);border-block-start-color:var(--kj-spinner-color);border-radius:50%;animation:kj-spinner-spin var(--kj-spinner-duration) linear infinite}.kj-spinner[data-animation=pulse] .kj-spinner__glyph{background:var(--kj-spinner-color);border-radius:50%;animation:kj-spinner-pulse calc(var(--kj-spinner-duration) * 2) ease-in-out infinite}.kj-spinner[data-animation=dots]{inline-size:auto}.kj-spinner[data-animation=dots] .kj-spinner__glyph{display:inline-flex;gap:calc(var(--kj-spinner-size) * .25);inline-size:auto;block-size:100%}.kj-spinner[data-animation=dots] .kj-spinner__glyph:before,.kj-spinner[data-animation=dots] .kj-spinner__glyph:after{content:\"\";inline-size:calc(var(--kj-spinner-size) * .3);block-size:calc(var(--kj-spinner-size) * .3);background:var(--kj-spinner-color);border-radius:50%;animation:kj-spinner-dots calc(var(--kj-spinner-duration) * 2) ease-in-out infinite}.kj-spinner[data-animation=dots] .kj-spinner__glyph{background:transparent}.kj-spinner[data-animation=dots] .kj-spinner__glyph:after{animation-delay:calc(var(--kj-spinner-duration) * .4)}.kj-spinner[data-animation=bars]{inline-size:auto}.kj-spinner[data-animation=bars] .kj-spinner__glyph{display:inline-flex;align-items:stretch;gap:calc(var(--kj-spinner-size) * .15);inline-size:auto;block-size:100%}.kj-spinner[data-animation=bars] .kj-spinner__glyph:before,.kj-spinner[data-animation=bars] .kj-spinner__glyph:after{content:\"\";inline-size:calc(var(--kj-spinner-size) * .2);background:var(--kj-spinner-color);border-radius:calc(var(--kj-spinner-size) * .05);animation:kj-spinner-bars calc(var(--kj-spinner-duration) * 1.6) ease-in-out infinite;transform-origin:center}.kj-spinner[data-animation=bars] .kj-spinner__glyph:after{animation-delay:calc(var(--kj-spinner-duration) * .4)}.kj-spinner[data-reduced-motion=true] .kj-spinner__glyph,.kj-spinner[data-reduced-motion=true] .kj-spinner__glyph:before,.kj-spinner[data-reduced-motion=true] .kj-spinner__glyph:after{animation:kj-spinner-reduced-motion 1.6s ease-in-out infinite!important}}@keyframes kj-spinner-spin{to{transform:rotate(360deg)}}@keyframes kj-spinner-pulse{0%,to{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1)}}@keyframes kj-spinner-dots{0%,80%,to{transform:scale(.4);opacity:.4}40%{transform:scale(1);opacity:1}}@keyframes kj-spinner-bars{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}@keyframes kj-spinner-reduced-motion{0%,to{opacity:.45}50%{opacity:1}}\n"] }]
|
|
5565
5581
|
}], ctorParameters: () => [], propDecorators: { kjVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjVariant", required: false }] }], kjSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjSize", required: false }] }], kjAnimation: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjAnimation", required: false }] }], kjAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjAriaLabel", required: false }] }] } });
|
|
5566
5582
|
|
|
5567
5583
|
/**
|
|
@@ -10357,11 +10373,11 @@ class KjLinkComponent {
|
|
|
10357
10373
|
/** Bound to `[attr.aria-label]` on the inner `<a>`. When set, suppresses the AT suffix injection. */
|
|
10358
10374
|
kjAriaLabel = input(undefined, /* @ts-ignore */
|
|
10359
10375
|
...(ngDevMode ? [{ debugName: "kjAriaLabel" }] : /* istanbul ignore next */ []));
|
|
10360
|
-
/** Forwarded to the directive's `KjVariant` host directive. */
|
|
10361
|
-
kjVariant = input(
|
|
10376
|
+
/** Forwarded to the directive's `KjVariant` host directive. Unset falls back to the `provideKjLink(…)` default (`'primary'`). */
|
|
10377
|
+
kjVariant = input(undefined, /* @ts-ignore */
|
|
10362
10378
|
...(ngDevMode ? [{ debugName: "kjVariant" }] : /* istanbul ignore next */ []));
|
|
10363
|
-
/** Forwarded to the directive's `KjSize` host directive. */
|
|
10364
|
-
kjSize = input(
|
|
10379
|
+
/** Forwarded to the directive's `KjSize` host directive. Unset falls back to the configured default (`'inherit'`). */
|
|
10380
|
+
kjSize = input(undefined, /* @ts-ignore */
|
|
10365
10381
|
...(ngDevMode ? [{ debugName: "kjSize" }] : /* istanbul ignore next */ []));
|
|
10366
10382
|
/** Forwarded to the directive's underline-mode reflection. */
|
|
10367
10383
|
kjUnderline = input('hover', /* @ts-ignore */
|
|
@@ -11695,9 +11711,11 @@ class KjPaginationDefaultComponent {
|
|
|
11695
11711
|
...(ngDevMode ? [{ debugName: "kjSiblingCount" }] : /* istanbul ignore next */ []));
|
|
11696
11712
|
kjBoundaryCount = input(1, /* @ts-ignore */
|
|
11697
11713
|
...(ngDevMode ? [{ debugName: "kjBoundaryCount" }] : /* istanbul ignore next */ []));
|
|
11698
|
-
|
|
11714
|
+
/** Cascaded onto items/boundaries. Unset falls back to the `provideKjPagination(…)` default (`'default'`). */
|
|
11715
|
+
kjVariant = input(undefined, /* @ts-ignore */
|
|
11699
11716
|
...(ngDevMode ? [{ debugName: "kjVariant" }] : /* istanbul ignore next */ []));
|
|
11700
|
-
|
|
11717
|
+
/** Cascaded onto items/boundaries. Unset falls back to the configured default (`'md'`). */
|
|
11718
|
+
kjSize = input(undefined, /* @ts-ignore */
|
|
11701
11719
|
...(ngDevMode ? [{ debugName: "kjSize" }] : /* istanbul ignore next */ []));
|
|
11702
11720
|
/** Render the First / Last boundary buttons. Default `true`. */
|
|
11703
11721
|
kjShowFirstLast = input(true, /* @ts-ignore */
|
|
@@ -12233,15 +12251,17 @@ class KjProgressBarComponent {
|
|
|
12233
12251
|
...(ngDevMode ? [{ debugName: "kjAriaValuetext" }] : /* istanbul ignore next */ []));
|
|
12234
12252
|
/**
|
|
12235
12253
|
* Variant — one of the configured presets (`primary` | `success` |
|
|
12236
|
-
* `warning` | `error` by default).
|
|
12254
|
+
* `warning` | `error` by default). Unset falls back to the
|
|
12255
|
+
* `provideKjProgressBar(…)` default. @default 'primary'
|
|
12237
12256
|
*/
|
|
12238
|
-
kjVariant = input(
|
|
12257
|
+
kjVariant = input(undefined, /* @ts-ignore */
|
|
12239
12258
|
...(ngDevMode ? [{ debugName: "kjVariant" }] : /* istanbul ignore next */ []));
|
|
12240
12259
|
/**
|
|
12241
12260
|
* Size — one of the configured presets (`xs` | `sm` | `md` | `lg` by
|
|
12242
|
-
* default). Drives the bar height.
|
|
12261
|
+
* default). Drives the bar height. Unset falls back to the configured
|
|
12262
|
+
* default. @default 'md'
|
|
12243
12263
|
*/
|
|
12244
|
-
kjSize = input(
|
|
12264
|
+
kjSize = input(undefined, /* @ts-ignore */
|
|
12245
12265
|
...(ngDevMode ? [{ debugName: "kjSize" }] : /* istanbul ignore next */ []));
|
|
12246
12266
|
/**
|
|
12247
12267
|
* Accessible label for the bar. At least one of `kjAriaLabel` or
|
|
@@ -13375,7 +13395,7 @@ class KjSelectComponent {
|
|
|
13375
13395
|
<kj-select-content [kjFor]="trig" class="kj-select-content">
|
|
13376
13396
|
<ng-content />
|
|
13377
13397
|
</kj-select-content>
|
|
13378
|
-
`, isInline: true, styles: ["@layer kj.component{.kj-select{position:relative;display:inline-block;min-width:12rem}.kj-select-trigger{--kj-select-trigger-height: 2.25rem;width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:var(--kj-space-sm);background:var(--kj-bg-field);color:var(--kj-fg-default);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);padding:0 var(--kj-space-md);height:var(--kj-select-trigger-height);font:.875rem var(--kj-font-sans);cursor:pointer}.kj-select[data-size=xs] .kj-select-trigger{--kj-select-trigger-height: 1.75rem;font-size:.75rem;padding-inline:var(--kj-space-sm);gap:var(--kj-space-xs)}.kj-select[data-size=sm] .kj-select-trigger{--kj-select-trigger-height: 2rem;font-size:.8125rem}.kj-select[data-size=lg] .kj-select-trigger{--kj-select-trigger-height: 2.75rem;font-size:1rem}.kj-select[data-size=xs]{min-width:0}.kj-select-trigger-caret{font-size:.875em;color:var(--kj-fg-muted);flex:none}.kj-select-trigger:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px}.kj-select[data-disabled] .kj-select-trigger{opacity:.45;cursor:not-allowed;pointer-events:none}.kj-select-content{box-sizing:border-box;min-width:12rem;width:max-content;background:var(--kj-bg-elevated);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);box-shadow:var(--kj-shadow-md, 0 8px 24px rgb(0 0 0 / .12));padding:4px;max-height:16rem;overflow:auto;z-index:100}.kj-select-content[hidden]{display:none}.kj-option{padding:var(--kj-space-sm) var(--kj-space-md);border-radius:var(--kj-radius-selector);cursor:pointer;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans)}.kj-option:hover{background:var(--kj-bg-field)}.kj-option[aria-selected=true]{background:color-mix(in oklab,var(--kj-bg-primary) 12%,transparent);color:var(--kj-fg-primary);font-weight:600}.kj-option[aria-selected=true]:hover{background:color-mix(in oklab,var(--kj-bg-primary) 18%,transparent)}}\n"], dependencies: [{ kind: "directive", type: KjIconDirective, selector: "span[kjIcon], i[kjIcon]", inputs: ["kjIcon", "kjIconLabel", "kjIconColor", "kjIconSize"] }, { kind: "directive", type: KjSelectTrigger, selector: "[kjSelectTrigger]", inputs: ["kjMultiple", "kjDisabled"], exportAs: ["kjSelectTrigger"] }, { kind: "component", type: KjSelectContent, selector: "kj-select-content", inputs: ["kjSide", "kjAlign", "kjOffset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
13398
|
+
`, isInline: true, styles: ["@layer kj.component{.kj-select{position:relative;display:inline-block;min-width:12rem}.kj-select-trigger{--kj-select-trigger-height: 2.25rem;width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:var(--kj-space-sm);background:var(--kj-bg-field);color:var(--kj-fg-default);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);padding:0 var(--kj-space-md);height:var(--kj-select-trigger-height);font:.875rem var(--kj-font-sans);cursor:pointer;min-width:0}.kj-select-trigger-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.kj-select[data-size=xs] .kj-select-trigger{--kj-select-trigger-height: 1.75rem;font-size:.75rem;padding-inline:var(--kj-space-sm);gap:var(--kj-space-xs)}.kj-select[data-size=sm] .kj-select-trigger{--kj-select-trigger-height: 2rem;font-size:.8125rem}.kj-select[data-size=lg] .kj-select-trigger{--kj-select-trigger-height: 2.75rem;font-size:1rem}.kj-select[data-size=xs]{min-width:0}.kj-select-trigger-caret{font-size:.875em;color:var(--kj-fg-muted);flex:none}.kj-select-trigger:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px}.kj-select[data-disabled] .kj-select-trigger{opacity:.45;cursor:not-allowed;pointer-events:none}.kj-select-content{box-sizing:border-box;min-width:12rem;width:max-content;max-width:min(28rem,calc(100vw - 2rem));background:var(--kj-bg-elevated);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);box-shadow:var(--kj-shadow-md, 0 8px 24px rgb(0 0 0 / .12));padding:4px;max-height:16rem;overflow:auto;z-index:100}.kj-select-content[hidden]{display:none}.kj-option{padding:var(--kj-space-sm) var(--kj-space-md);border-radius:var(--kj-radius-selector);cursor:pointer;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kj-option:hover{background:var(--kj-bg-field)}.kj-option[aria-selected=true]{background:color-mix(in oklab,var(--kj-bg-primary) 12%,transparent);color:var(--kj-fg-primary);font-weight:600}.kj-option[aria-selected=true]:hover{background:color-mix(in oklab,var(--kj-bg-primary) 18%,transparent)}}\n"], dependencies: [{ kind: "directive", type: KjIconDirective, selector: "span[kjIcon], i[kjIcon]", inputs: ["kjIcon", "kjIconLabel", "kjIconColor", "kjIconSize"] }, { kind: "directive", type: KjSelectTrigger, selector: "[kjSelectTrigger]", inputs: ["kjMultiple", "kjDisabled"], exportAs: ["kjSelectTrigger"] }, { kind: "component", type: KjSelectContent, selector: "kj-select-content", inputs: ["kjSide", "kjAlign", "kjOffset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
13379
13399
|
}
|
|
13380
13400
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjSelectComponent, decorators: [{
|
|
13381
13401
|
type: Component,
|
|
@@ -13394,7 +13414,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
13394
13414
|
'[attr.data-disabled]': "disabled() ? '' : null",
|
|
13395
13415
|
'[attr.data-multiple]': "multiple() ? '' : null",
|
|
13396
13416
|
'[attr.data-size]': "kjSize() === 'md' ? null : kjSize()",
|
|
13397
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{.kj-select{position:relative;display:inline-block;min-width:12rem}.kj-select-trigger{--kj-select-trigger-height: 2.25rem;width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:var(--kj-space-sm);background:var(--kj-bg-field);color:var(--kj-fg-default);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);padding:0 var(--kj-space-md);height:var(--kj-select-trigger-height);font:.875rem var(--kj-font-sans);cursor:pointer}.kj-select[data-size=xs] .kj-select-trigger{--kj-select-trigger-height: 1.75rem;font-size:.75rem;padding-inline:var(--kj-space-sm);gap:var(--kj-space-xs)}.kj-select[data-size=sm] .kj-select-trigger{--kj-select-trigger-height: 2rem;font-size:.8125rem}.kj-select[data-size=lg] .kj-select-trigger{--kj-select-trigger-height: 2.75rem;font-size:1rem}.kj-select[data-size=xs]{min-width:0}.kj-select-trigger-caret{font-size:.875em;color:var(--kj-fg-muted);flex:none}.kj-select-trigger:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px}.kj-select[data-disabled] .kj-select-trigger{opacity:.45;cursor:not-allowed;pointer-events:none}.kj-select-content{box-sizing:border-box;min-width:12rem;width:max-content;background:var(--kj-bg-elevated);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);box-shadow:var(--kj-shadow-md, 0 8px 24px rgb(0 0 0 / .12));padding:4px;max-height:16rem;overflow:auto;z-index:100}.kj-select-content[hidden]{display:none}.kj-option{padding:var(--kj-space-sm) var(--kj-space-md);border-radius:var(--kj-radius-selector);cursor:pointer;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans)}.kj-option:hover{background:var(--kj-bg-field)}.kj-option[aria-selected=true]{background:color-mix(in oklab,var(--kj-bg-primary) 12%,transparent);color:var(--kj-fg-primary);font-weight:600}.kj-option[aria-selected=true]:hover{background:color-mix(in oklab,var(--kj-bg-primary) 18%,transparent)}}\n"] }]
|
|
13417
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{.kj-select{position:relative;display:inline-block;min-width:12rem}.kj-select-trigger{--kj-select-trigger-height: 2.25rem;width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:var(--kj-space-sm);background:var(--kj-bg-field);color:var(--kj-fg-default);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);padding:0 var(--kj-space-md);height:var(--kj-select-trigger-height);font:.875rem var(--kj-font-sans);cursor:pointer;min-width:0}.kj-select-trigger-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.kj-select[data-size=xs] .kj-select-trigger{--kj-select-trigger-height: 1.75rem;font-size:.75rem;padding-inline:var(--kj-space-sm);gap:var(--kj-space-xs)}.kj-select[data-size=sm] .kj-select-trigger{--kj-select-trigger-height: 2rem;font-size:.8125rem}.kj-select[data-size=lg] .kj-select-trigger{--kj-select-trigger-height: 2.75rem;font-size:1rem}.kj-select[data-size=xs]{min-width:0}.kj-select-trigger-caret{font-size:.875em;color:var(--kj-fg-muted);flex:none}.kj-select-trigger:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px}.kj-select[data-disabled] .kj-select-trigger{opacity:.45;cursor:not-allowed;pointer-events:none}.kj-select-content{box-sizing:border-box;min-width:12rem;width:max-content;max-width:min(28rem,calc(100vw - 2rem));background:var(--kj-bg-elevated);border:var(--kj-border) solid var(--kj-border-default);border-radius:var(--kj-radius-field);box-shadow:var(--kj-shadow-md, 0 8px 24px rgb(0 0 0 / .12));padding:4px;max-height:16rem;overflow:auto;z-index:100}.kj-select-content[hidden]{display:none}.kj-option{padding:var(--kj-space-sm) var(--kj-space-md);border-radius:var(--kj-radius-selector);cursor:pointer;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kj-option:hover{background:var(--kj-bg-field)}.kj-option[aria-selected=true]{background:color-mix(in oklab,var(--kj-bg-primary) 12%,transparent);color:var(--kj-fg-primary);font-weight:600}.kj-option[aria-selected=true]:hover{background:color-mix(in oklab,var(--kj-bg-primary) 18%,transparent)}}\n"] }]
|
|
13398
13418
|
}], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], kjSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjSize", required: false }] }], options: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => forwardRef(() => KjOptionComponent)), { isSignal: true }] }] } });
|
|
13399
13419
|
/**
|
|
13400
13420
|
* Single option row.
|
|
@@ -18426,11 +18446,20 @@ async function copyToClipboard(text) {
|
|
|
18426
18446
|
* @doc-is-main
|
|
18427
18447
|
*/
|
|
18428
18448
|
class KjTabsComponent {
|
|
18429
|
-
/**
|
|
18430
|
-
|
|
18449
|
+
/**
|
|
18450
|
+
* Visual chrome for the tab strip, reflected as `data-variant` on the host.
|
|
18451
|
+
* Ships `'default'` (underline strip) and `'pills'` (recessed chip tray);
|
|
18452
|
+
* register more with `provideKjTabs({ variants: [...] })` and key a CSS rule
|
|
18453
|
+
* on `.kj-tabs[data-variant="…"]`.
|
|
18454
|
+
*
|
|
18455
|
+
* Declared here for the docs extractor only — the value is owned by the
|
|
18456
|
+
* composed `KjVariant` preset directive (see `hostDirectives`), which is
|
|
18457
|
+
* what actually resolves and reflects it.
|
|
18458
|
+
*/
|
|
18459
|
+
variant = input(undefined, /* @ts-ignore */
|
|
18431
18460
|
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
18432
18461
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
18433
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: KjTabsComponent, isStandalone: true, selector: "kj-tabs", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: {
|
|
18462
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: KjTabsComponent, isStandalone: true, selector: "kj-tabs", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "kj-tabs" }, providers: [...bindPresets(KJ_TABS_CONFIG)], hostDirectives: [{ directive: i1.KjTabs, inputs: ["kjValue", "value", "kjOrientation", "orientation", "kjActivationMode", "activationMode"], outputs: ["kjValueChange", "valueChange"] }, { directive: i1.KjVariant, inputs: ["kjVariant", "variant"] }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: ["@layer kj.component{.kj-tabs{display:block;--kj-tab-fg: var(--kj-fg-muted);--kj-tab-fg-active: var(--kj-fg-default);--kj-tab-font-size: .875rem;--kj-tab-font-weight: 400;--kj-tab-padding-x: var(--kj-space-md);--kj-tab-padding-y: var(--kj-space-sm);--kj-tab-gap: 0;--kj-tab-indicator-color: var(--kj-bg-primary);--kj-tab-indicator-size: 2px;--kj-tab-indicator-inset: 0px;--kj-tab-list-border-color: var(--kj-border-default);--kj-tab-list-gap: var(--kj-space-lg);--kj-tab-tray-bg: var(--kj-bg-surface);--kj-tab-tray-border-color: var(--kj-border-default);--kj-tab-tray-radius: var(--kj-radius-field);--kj-tab-tray-padding: 3px;--kj-tab-tray-gap: 2px;--kj-tab-chip-radius: calc(var(--kj-radius-field) - 2px);--kj-tab-chip-bg-active: var(--kj-bg-body);--kj-tab-chip-ring-active: var(--kj-border-default)}.kj-tabs[data-orientation=vertical]{display:grid;grid-template-columns:auto 1fr;gap:var(--kj-space-lg)}.kj-tab-list{display:flex;gap:var(--kj-tab-gap);border-bottom:1px solid var(--kj-tab-list-border-color);margin-bottom:var(--kj-tab-list-gap)}.kj-tabs[data-orientation=vertical] .kj-tab-list{flex-direction:column;border-bottom:0;border-right:1px solid var(--kj-tab-list-border-color);margin:0}.kj-tab{position:relative;background:none;border:0;color:var(--kj-tab-fg);padding:var(--kj-tab-padding-y) var(--kj-tab-padding-x);font:var(--kj-tab-font-weight) var(--kj-tab-font-size) / 1.2 var(--kj-font-sans);cursor:pointer;transition:color var(--kj-transition),background-color var(--kj-transition),box-shadow var(--kj-transition)}.kj-tab:after{content:\"\";position:absolute;left:var(--kj-tab-indicator-inset);right:var(--kj-tab-indicator-inset);bottom:0;height:var(--kj-tab-indicator-size);background:var(--kj-tab-indicator-color);opacity:0;transition:opacity var(--kj-transition)}.kj-tab[aria-selected=true]{color:var(--kj-tab-fg-active)}.kj-tab[aria-selected=true]:after{opacity:1}.kj-tab:hover{color:var(--kj-tab-fg-active)}.kj-tab:focus-visible{outline:2px solid var(--kj-border-focus, var(--kj-bg-primary));outline-offset:-2px}.kj-tab:disabled,.kj-tab[aria-disabled=true]{opacity:.4;cursor:not-allowed}.kj-tabs[data-variant=pills]{display:inline-block}.kj-tabs[data-variant=pills] .kj-tab-list{display:inline-flex;gap:var(--kj-tab-tray-gap);padding:var(--kj-tab-tray-padding);background-color:var(--kj-tab-tray-bg);border:1px solid var(--kj-tab-tray-border-color);border-radius:var(--kj-tab-tray-radius);width:fit-content;margin-bottom:0}.kj-tabs[data-variant=pills] .kj-tab{border-radius:var(--kj-tab-chip-radius);margin:0}.kj-tabs[data-variant=pills] .kj-tab:after{content:none}.kj-tabs[data-variant=pills] .kj-tab[aria-selected=true]{background-color:var(--kj-tab-chip-bg-active);color:var(--kj-tab-fg-active);box-shadow:inset 0 0 0 1px var(--kj-tab-chip-ring-active)}.kj-tabs[data-orientation=vertical] .kj-tab{text-align:left}.kj-tabs[data-orientation=vertical] .kj-tab:after{left:auto;right:0;top:var(--kj-tab-indicator-inset);bottom:var(--kj-tab-indicator-inset);width:var(--kj-tab-indicator-size);height:auto}.kj-tab-panel{display:block;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans);line-height:1.5}.kj-tab-panel[hidden]{display:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
18434
18463
|
}
|
|
18435
18464
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTabsComponent, decorators: [{
|
|
18436
18465
|
type: Component,
|
|
@@ -18444,10 +18473,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
18444
18473
|
],
|
|
18445
18474
|
outputs: ['kjValueChange: valueChange'],
|
|
18446
18475
|
},
|
|
18447
|
-
|
|
18448
|
-
|
|
18449
|
-
|
|
18450
|
-
|
|
18476
|
+
// `variant` resolves through the preset chain (explicit input >
|
|
18477
|
+
// provideKjTabs default > library default) and reflects data-variant —
|
|
18478
|
+
// the same contract Button uses. Declaring it as a plain input here would
|
|
18479
|
+
// hardcode the default and clobber provideKjTabs(…).
|
|
18480
|
+
{ directive: KjVariant, inputs: ['kjVariant: variant'] },
|
|
18481
|
+
], providers: [...bindPresets(KJ_TABS_CONFIG)], template: `<ng-content />`, encapsulation: ViewEncapsulation.None, host: { class: 'kj-tabs' }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{.kj-tabs{display:block;--kj-tab-fg: var(--kj-fg-muted);--kj-tab-fg-active: var(--kj-fg-default);--kj-tab-font-size: .875rem;--kj-tab-font-weight: 400;--kj-tab-padding-x: var(--kj-space-md);--kj-tab-padding-y: var(--kj-space-sm);--kj-tab-gap: 0;--kj-tab-indicator-color: var(--kj-bg-primary);--kj-tab-indicator-size: 2px;--kj-tab-indicator-inset: 0px;--kj-tab-list-border-color: var(--kj-border-default);--kj-tab-list-gap: var(--kj-space-lg);--kj-tab-tray-bg: var(--kj-bg-surface);--kj-tab-tray-border-color: var(--kj-border-default);--kj-tab-tray-radius: var(--kj-radius-field);--kj-tab-tray-padding: 3px;--kj-tab-tray-gap: 2px;--kj-tab-chip-radius: calc(var(--kj-radius-field) - 2px);--kj-tab-chip-bg-active: var(--kj-bg-body);--kj-tab-chip-ring-active: var(--kj-border-default)}.kj-tabs[data-orientation=vertical]{display:grid;grid-template-columns:auto 1fr;gap:var(--kj-space-lg)}.kj-tab-list{display:flex;gap:var(--kj-tab-gap);border-bottom:1px solid var(--kj-tab-list-border-color);margin-bottom:var(--kj-tab-list-gap)}.kj-tabs[data-orientation=vertical] .kj-tab-list{flex-direction:column;border-bottom:0;border-right:1px solid var(--kj-tab-list-border-color);margin:0}.kj-tab{position:relative;background:none;border:0;color:var(--kj-tab-fg);padding:var(--kj-tab-padding-y) var(--kj-tab-padding-x);font:var(--kj-tab-font-weight) var(--kj-tab-font-size) / 1.2 var(--kj-font-sans);cursor:pointer;transition:color var(--kj-transition),background-color var(--kj-transition),box-shadow var(--kj-transition)}.kj-tab:after{content:\"\";position:absolute;left:var(--kj-tab-indicator-inset);right:var(--kj-tab-indicator-inset);bottom:0;height:var(--kj-tab-indicator-size);background:var(--kj-tab-indicator-color);opacity:0;transition:opacity var(--kj-transition)}.kj-tab[aria-selected=true]{color:var(--kj-tab-fg-active)}.kj-tab[aria-selected=true]:after{opacity:1}.kj-tab:hover{color:var(--kj-tab-fg-active)}.kj-tab:focus-visible{outline:2px solid var(--kj-border-focus, var(--kj-bg-primary));outline-offset:-2px}.kj-tab:disabled,.kj-tab[aria-disabled=true]{opacity:.4;cursor:not-allowed}.kj-tabs[data-variant=pills]{display:inline-block}.kj-tabs[data-variant=pills] .kj-tab-list{display:inline-flex;gap:var(--kj-tab-tray-gap);padding:var(--kj-tab-tray-padding);background-color:var(--kj-tab-tray-bg);border:1px solid var(--kj-tab-tray-border-color);border-radius:var(--kj-tab-tray-radius);width:fit-content;margin-bottom:0}.kj-tabs[data-variant=pills] .kj-tab{border-radius:var(--kj-tab-chip-radius);margin:0}.kj-tabs[data-variant=pills] .kj-tab:after{content:none}.kj-tabs[data-variant=pills] .kj-tab[aria-selected=true]{background-color:var(--kj-tab-chip-bg-active);color:var(--kj-tab-fg-active);box-shadow:inset 0 0 0 1px var(--kj-tab-chip-ring-active)}.kj-tabs[data-orientation=vertical] .kj-tab{text-align:left}.kj-tabs[data-orientation=vertical] .kj-tab:after{left:auto;right:0;top:var(--kj-tab-indicator-inset);bottom:var(--kj-tab-indicator-inset);width:var(--kj-tab-indicator-size);height:auto}.kj-tab-panel{display:block;color:var(--kj-fg-default);font:.875rem var(--kj-font-sans);line-height:1.5}.kj-tab-panel[hidden]{display:none}}\n"] }]
|
|
18451
18482
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }] } });
|
|
18452
18483
|
/**
|
|
18453
18484
|
* Styled wrapper around `KjTabList`. Hosts `role="tablist"` (provided by the
|
|
@@ -18893,11 +18924,11 @@ class KjTextareaComponent {
|
|
|
18893
18924
|
kjInvalid = input(false, { ...(ngDevMode ? { debugName: "kjInvalid" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
18894
18925
|
/** Disables the textarea. Reflects `aria-disabled` and native `disabled`. */
|
|
18895
18926
|
kjDisabled = input(false, { ...(ngDevMode ? { debugName: "kjDisabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
18896
|
-
/** Theme variant.
|
|
18897
|
-
kjVariant = input(
|
|
18927
|
+
/** Theme variant. Unset falls back to the `provideKjTextarea(...)` default (`'outlined'`). */
|
|
18928
|
+
kjVariant = input(undefined, /* @ts-ignore */
|
|
18898
18929
|
...(ngDevMode ? [{ debugName: "kjVariant" }] : /* istanbul ignore next */ []));
|
|
18899
|
-
/** Theme size.
|
|
18900
|
-
kjSize = input(
|
|
18930
|
+
/** Theme size. Unset falls back to the `provideKjTextarea(...)` default (`'md'`). */
|
|
18931
|
+
kjSize = input(undefined, /* @ts-ignore */
|
|
18901
18932
|
...(ngDevMode ? [{ debugName: "kjSize" }] : /* istanbul ignore next */ []));
|
|
18902
18933
|
/** @internal stable id for the counter / aria-describedby wiring. */
|
|
18903
18934
|
counterId = `kj-textarea-counter-${++nextId}`;
|