@raintonic/formaui 0.4.0 → 0.9.2
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/CHANGELOG.md +80 -35
- package/README.md +22 -26
- package/fesm2022/raintonic-formaui-cdk-drag-drop.mjs +39 -41
- package/fesm2022/raintonic-formaui-cdk-drag-drop.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-cdk-form-field.mjs +207 -3
- package/fesm2022/raintonic-formaui-cdk-form-field.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-cdk-overlay.mjs +19 -1
- package/fesm2022/raintonic-formaui-cdk-overlay.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-cdk-virtual-scroll.mjs +5 -12
- package/fesm2022/raintonic-formaui-cdk-virtual-scroll.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-accordion.mjs +8 -5
- package/fesm2022/raintonic-formaui-components-accordion.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-alert.mjs +16 -2
- package/fesm2022/raintonic-formaui-components-alert.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-autocomplete.mjs +255 -462
- package/fesm2022/raintonic-formaui-components-autocomplete.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-avatar.mjs +34 -59
- package/fesm2022/raintonic-formaui-components-avatar.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-badge.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-badge.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-breadcrumb.mjs +4 -4
- package/fesm2022/raintonic-formaui-components-breadcrumb.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-button-group.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-button-group.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-button.mjs +15 -20
- package/fesm2022/raintonic-formaui-components-button.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-card.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-card.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-checkbox.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-checkbox.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-chip.mjs +97 -0
- package/fesm2022/raintonic-formaui-components-chip.mjs.map +1 -0
- package/fesm2022/raintonic-formaui-components-data-table.mjs +69 -29
- package/fesm2022/raintonic-formaui-components-data-table.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-date-picker.mjs +223 -144
- package/fesm2022/raintonic-formaui-components-date-picker.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-divider.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-divider.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-drawer.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-drawer.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-dropdown-menu.mjs +888 -0
- package/fesm2022/raintonic-formaui-components-dropdown-menu.mjs.map +1 -0
- package/fesm2022/raintonic-formaui-components-dual-tier-navigation.mjs +774 -0
- package/fesm2022/raintonic-formaui-components-dual-tier-navigation.mjs.map +1 -0
- package/fesm2022/raintonic-formaui-components-empty-state.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-empty-state.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-file-upload.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-file-upload.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-form-field.mjs +81 -50
- package/fesm2022/raintonic-formaui-components-form-field.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-icon.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-icon.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-input.mjs +47 -12
- package/fesm2022/raintonic-formaui-components-input.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-list.mjs +4 -4
- package/fesm2022/raintonic-formaui-components-list.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-number-input.mjs +20 -12
- package/fesm2022/raintonic-formaui-components-number-input.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-paginator.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-paginator.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-password-input.mjs +35 -110
- package/fesm2022/raintonic-formaui-components-password-input.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-popover.mjs +3 -2
- package/fesm2022/raintonic-formaui-components-popover.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-progressbar.mjs +3 -2
- package/fesm2022/raintonic-formaui-components-progressbar.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-radio.mjs +5 -6
- package/fesm2022/raintonic-formaui-components-radio.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-select.mjs +257 -412
- package/fesm2022/raintonic-formaui-components-select.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-side-panel.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-side-panel.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-sidebar-nav-menu.mjs +525 -0
- package/fesm2022/raintonic-formaui-components-sidebar-nav-menu.mjs.map +1 -0
- package/fesm2022/raintonic-formaui-components-skeleton.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-skeleton.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-slider.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-slider.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-spinner.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-spinner.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-stepper.mjs +50 -45
- package/fesm2022/raintonic-formaui-components-stepper.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-strength-meter.mjs +149 -0
- package/fesm2022/raintonic-formaui-components-strength-meter.mjs.map +1 -0
- package/fesm2022/raintonic-formaui-components-tab.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-tab.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-time-picker.mjs +194 -154
- package/fesm2022/raintonic-formaui-components-time-picker.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-toggle-group.mjs +302 -0
- package/fesm2022/raintonic-formaui-components-toggle-group.mjs.map +1 -0
- package/fesm2022/raintonic-formaui-components-toggle.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-toggle.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-toolbar.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-toolbar.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-tooltip.mjs +10 -4
- package/fesm2022/raintonic-formaui-components-tooltip.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-topbar.mjs +60 -0
- package/fesm2022/raintonic-formaui-components-topbar.mjs.map +1 -0
- package/fesm2022/raintonic-formaui-components-tree-select.mjs +59 -69
- package/fesm2022/raintonic-formaui-components-tree-select.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-tree-table.mjs +2 -2
- package/fesm2022/raintonic-formaui-components-tree-table.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-components-tree.mjs +31 -5
- package/fesm2022/raintonic-formaui-components-tree.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-core.mjs +279 -1
- package/fesm2022/raintonic-formaui-core.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-services-breakpoint.mjs +93 -0
- package/fesm2022/raintonic-formaui-services-breakpoint.mjs.map +1 -0
- package/fesm2022/raintonic-formaui-services-dialog.mjs +314 -16
- package/fesm2022/raintonic-formaui-services-dialog.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-services-notification.mjs +93 -29
- package/fesm2022/raintonic-formaui-services-notification.mjs.map +1 -1
- package/fesm2022/raintonic-formaui-services-theme.mjs +46 -196
- package/fesm2022/raintonic-formaui-services-theme.mjs.map +1 -1
- package/fesm2022/raintonic-formaui.mjs +1 -1
- package/fesm2022/raintonic-formaui.mjs.map +1 -1
- package/llms-full.txt +2329 -450
- package/llms.txt +36 -33
- package/package.json +42 -19
- package/styles/fonts/Geist-Bold.woff2 +0 -0
- package/styles/fonts/Geist-Italic.woff2 +0 -0
- package/styles/fonts/Geist-Light.woff2 +0 -0
- package/styles/fonts/Geist-Medium.woff2 +0 -0
- package/styles/fonts/Geist-Regular.woff2 +0 -0
- package/styles/fonts/Geist-SemiBold.woff2 +0 -0
- package/styles/fonts/GeistMono-Regular.woff2 +0 -0
- package/styles/generated/_tokens.scss +906 -0
- package/styles/index.scss +11 -10
- package/styles/partials/_brand.scss +46 -0
- package/styles/partials/_constants.scss +22 -20
- package/styles/partials/_fonts.scss +54 -10
- package/styles/partials/_grid.scss +29 -18
- package/styles/partials/_mixins.scss +69 -27
- package/styles/partials/_motion.scss +28 -33
- package/styles/partials/_theme.scss +28 -255
- package/styles/partials/_type.scss +117 -0
- package/styles/partials/_typography.scss +45 -45
- package/styles/partials/_utilities.scss +198 -98
- package/styles/partials/components/_button.scss +144 -75
- package/styles/partials/components/_dialog.scss +181 -180
- package/styles/partials/components/_overlay.scss +87 -87
- package/styles/partials/themes/_dark.scss +3 -268
- package/styles/partials/themes/_light.scss +4 -268
- package/styles/styles.css +7744 -0
- package/styles/styles.entry.scss +3 -0
- package/styles/utilities.css +4802 -0
- package/styles/utilities.entry.scss +3 -0
- package/types/raintonic-formaui-cdk-drag-drop.d.ts +0 -1
- package/types/raintonic-formaui-cdk-drag-drop.d.ts.map +1 -1
- package/types/raintonic-formaui-cdk-form-field.d.ts +118 -2
- package/types/raintonic-formaui-cdk-form-field.d.ts.map +1 -1
- package/types/raintonic-formaui-cdk-overlay.d.ts +2 -0
- package/types/raintonic-formaui-cdk-overlay.d.ts.map +1 -1
- package/types/raintonic-formaui-cdk-virtual-scroll.d.ts +0 -1
- package/types/raintonic-formaui-cdk-virtual-scroll.d.ts.map +1 -1
- package/types/raintonic-formaui-components-accordion.d.ts +1 -1
- package/types/raintonic-formaui-components-accordion.d.ts.map +1 -1
- package/types/raintonic-formaui-components-alert.d.ts +6 -1
- package/types/raintonic-formaui-components-alert.d.ts.map +1 -1
- package/types/raintonic-formaui-components-autocomplete.d.ts +73 -116
- package/types/raintonic-formaui-components-autocomplete.d.ts.map +1 -1
- package/types/raintonic-formaui-components-avatar.d.ts +13 -31
- package/types/raintonic-formaui-components-avatar.d.ts.map +1 -1
- package/types/raintonic-formaui-components-button.d.ts +4 -10
- package/types/raintonic-formaui-components-button.d.ts.map +1 -1
- package/types/raintonic-formaui-components-chip.d.ts +43 -0
- package/types/raintonic-formaui-components-chip.d.ts.map +1 -0
- package/types/raintonic-formaui-components-data-table.d.ts +48 -11
- package/types/raintonic-formaui-components-data-table.d.ts.map +1 -1
- package/types/raintonic-formaui-components-date-picker.d.ts +59 -23
- package/types/raintonic-formaui-components-date-picker.d.ts.map +1 -1
- package/types/raintonic-formaui-components-dropdown-menu.d.ts +394 -0
- package/types/raintonic-formaui-components-dropdown-menu.d.ts.map +1 -0
- package/types/raintonic-formaui-components-dual-tier-navigation.d.ts +87 -0
- package/types/raintonic-formaui-components-dual-tier-navigation.d.ts.map +1 -0
- package/types/raintonic-formaui-components-form-field.d.ts +51 -21
- package/types/raintonic-formaui-components-form-field.d.ts.map +1 -1
- package/types/raintonic-formaui-components-input.d.ts +20 -11
- package/types/raintonic-formaui-components-input.d.ts.map +1 -1
- package/types/raintonic-formaui-components-number-input.d.ts +5 -3
- package/types/raintonic-formaui-components-number-input.d.ts.map +1 -1
- package/types/raintonic-formaui-components-password-input.d.ts +18 -32
- package/types/raintonic-formaui-components-password-input.d.ts.map +1 -1
- package/types/raintonic-formaui-components-popover.d.ts.map +1 -1
- package/types/raintonic-formaui-components-progressbar.d.ts +1 -1
- package/types/raintonic-formaui-components-progressbar.d.ts.map +1 -1
- package/types/raintonic-formaui-components-radio.d.ts +1 -2
- package/types/raintonic-formaui-components-radio.d.ts.map +1 -1
- package/types/raintonic-formaui-components-select.d.ts +107 -76
- package/types/raintonic-formaui-components-select.d.ts.map +1 -1
- package/types/raintonic-formaui-components-sidebar-nav-menu.d.ts +223 -0
- package/types/raintonic-formaui-components-sidebar-nav-menu.d.ts.map +1 -0
- package/types/raintonic-formaui-components-stepper.d.ts +4 -2
- package/types/raintonic-formaui-components-stepper.d.ts.map +1 -1
- package/types/raintonic-formaui-components-strength-meter.d.ts +78 -0
- package/types/raintonic-formaui-components-strength-meter.d.ts.map +1 -0
- package/types/raintonic-formaui-components-time-picker.d.ts +44 -24
- package/types/raintonic-formaui-components-time-picker.d.ts.map +1 -1
- package/types/raintonic-formaui-components-toggle-group.d.ts +100 -0
- package/types/raintonic-formaui-components-toggle-group.d.ts.map +1 -0
- package/types/raintonic-formaui-components-tooltip.d.ts +2 -1
- package/types/raintonic-formaui-components-tooltip.d.ts.map +1 -1
- package/types/raintonic-formaui-components-topbar.d.ts +48 -0
- package/types/raintonic-formaui-components-topbar.d.ts.map +1 -0
- package/types/raintonic-formaui-components-tree-select.d.ts +25 -9
- package/types/raintonic-formaui-components-tree-select.d.ts.map +1 -1
- package/types/raintonic-formaui-components-tree.d.ts +12 -1
- package/types/raintonic-formaui-components-tree.d.ts.map +1 -1
- package/types/raintonic-formaui-core.d.ts +243 -5
- package/types/raintonic-formaui-core.d.ts.map +1 -1
- package/types/raintonic-formaui-services-breakpoint.d.ts +44 -0
- package/types/raintonic-formaui-services-breakpoint.d.ts.map +1 -0
- package/types/raintonic-formaui-services-dialog.d.ts +141 -2
- package/types/raintonic-formaui-services-dialog.d.ts.map +1 -1
- package/types/raintonic-formaui-services-notification.d.ts +24 -2
- package/types/raintonic-formaui-services-notification.d.ts.map +1 -1
- package/types/raintonic-formaui-services-theme.d.ts +13 -103
- package/types/raintonic-formaui-services-theme.d.ts.map +1 -1
- package/types/raintonic-formaui.d.ts +1 -1
- package/fesm2022/raintonic-formaui-components-big-menu.mjs +0 -86
- package/fesm2022/raintonic-formaui-components-big-menu.mjs.map +0 -1
- package/fesm2022/raintonic-formaui-components-menu.mjs +0 -896
- package/fesm2022/raintonic-formaui-components-menu.mjs.map +0 -1
- package/fesm2022/raintonic-formaui-components-sidebar.mjs +0 -275
- package/fesm2022/raintonic-formaui-components-sidebar.mjs.map +0 -1
- package/fesm2022/raintonic-formaui-components-tag.mjs +0 -95
- package/fesm2022/raintonic-formaui-components-tag.mjs.map +0 -1
- package/styles/_fonts-entry.scss +0 -3
- package/styles/fonts/inter-tight-latin-italic.woff2 +0 -0
- package/styles/fonts/inter-tight-latin.woff2 +0 -0
- package/types/raintonic-formaui-components-big-menu.d.ts +0 -73
- package/types/raintonic-formaui-components-big-menu.d.ts.map +0 -1
- package/types/raintonic-formaui-components-menu.d.ts +0 -403
- package/types/raintonic-formaui-components-menu.d.ts.map +0 -1
- package/types/raintonic-formaui-components-sidebar.d.ts +0 -185
- package/types/raintonic-formaui-components-sidebar.d.ts.map +0 -1
- package/types/raintonic-formaui-components-tag.d.ts +0 -43
- package/types/raintonic-formaui-components-tag.d.ts.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"raintonic-formaui-components-badge.mjs","sources":["../../../lib/components/badge/badge.types.ts","../../../lib/components/badge/badge.component.ts","../../../lib/components/badge/badge.component.html","../../../lib/components/badge/raintonic-formaui-components-badge.ts"],"sourcesContent":["export type FuiBadgeSize = 'sm' | 'md' | 'lg';\r\n\r\nexport interface FuiBadgeCustomColorObject {\r\n label: string;\r\n background: string;\r\n}\r\n\r\nexport type FuiBadgeCustomColor = string | FuiBadgeCustomColorObject;\r\n\r\nexport type FuiBadgeVariant = 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'custom';\r\n\r\nexport const FUI_BADGE_SIZES: readonly FuiBadgeSize[] = ['sm', 'md', 'lg'] as const;\r\n\r\nexport const FUI_BADGE_VARIANTS: readonly FuiBadgeVariant[] = [\r\n 'primary',\r\n 'secondary',\r\n 'success',\r\n 'info',\r\n 'warning',\r\n 'error',\r\n 'custom',\r\n] as const;\r\n","import { ChangeDetectionStrategy, Component, computed, input, Signal } from '@angular/core';\r\nimport { FuiIconComponent } from '@raintonic/formaui/components/icon';\r\nimport {\r\n FuiBadgeCustomColor,\r\n FuiBadgeCustomColorObject,\r\n FuiBadgeSize,\r\n FuiBadgeVariant,\r\n FUI_BADGE_SIZES,\r\n FUI_BADGE_VARIANTS,\r\n} from './badge.types';\r\n\r\n/**\r\n * @component FuiBadgeComponent\r\n * @selector fui-badge\r\n * @description Displays a small label badge with optional icon and color variants.\r\n * Supports custom colors with automatic text contrast calculation.\r\n *\r\n * @input label - (required) Text content of the badge.\r\n * @input icon - Optional Phosphor icon name displayed before the label.\r\n * @input customColor - Optional hex color or `{ label, background }` object that overrides the variant palette.\r\n * - Hex string: used as label color; background is the same hex with 16% alpha.\r\n * - Object: `{ label, background }` both as hex; applied as-is.\r\n * @input size - Badge size: 'sm' | 'md' | 'lg'. Default 'md'.\r\n * @input variant - Color variant: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info'. Default 'primary'.\r\n * @input ariaLabel - Accessible label override for screen readers.\r\n *\r\n * @example\r\n * <fui-badge label=\"Active\" variant=\"success\" icon=\"check-circle\"></fui-badge>\r\n */\r\n@Component({\r\n selector: 'fui-badge',\r\n standalone: true,\r\n imports: [FuiIconComponent],\r\n templateUrl: './badge.component.html',\r\n styleUrls: ['./badge.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n host: {\r\n '[class]': 'computedClasses()',\r\n '[style]': 'computedStyles()',\r\n role: 'status',\r\n '[attr.aria-label]': 'ariaLabel() || null',\r\n },\r\n})\r\nexport class FuiBadgeComponent {\r\n /** Hex pattern: #rgb, #rgba, #rrggbb, #rrggbbaa */\r\n private static readonly _HEX_PATTERN = /^#([0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/;\r\n\r\n readonly label = input.required<string>();\r\n\r\n readonly icon = input<string | null>(null);\r\n\r\n readonly customColor = input<FuiBadgeCustomColor | null>(null);\r\n\r\n readonly size = input<FuiBadgeSize, FuiBadgeSize | string>('md', {\r\n transform: (v) => ((FUI_BADGE_SIZES as readonly string[]).includes(v) ? (v as FuiBadgeSize) : 'md'),\r\n });\r\n\r\n readonly variant = input<FuiBadgeVariant, FuiBadgeVariant | string>('primary', {\r\n transform: (v) => ((FUI_BADGE_VARIANTS as readonly string[]).includes(v) ? (v as FuiBadgeVariant) : 'primary'),\r\n });\r\n\r\n readonly ariaLabel = input<string | null>(null);\r\n\r\n /**\r\n * Resolved custom color pair (label + background).\r\n * - String input: must be a valid hex → used as label color, background is same hex with 16% alpha.\r\n * - Object input: `{ label, background }` used directly (both must be valid hex).\r\n * Returns null for invalid values to prevent CSS injection.\r\n */\r\n readonly resolvedCustomColor: Signal<FuiBadgeCustomColorObject | null> = computed(() => {\r\n const value = this.customColor();\r\n if (!value) return null;\r\n\r\n if (typeof value === 'string') {\r\n if (!FuiBadgeComponent._HEX_PATTERN.test(value)) {\r\n console.warn(`[FormaUI] Invalid badge color: \"${value}\"`);\r\n return null;\r\n }\r\n return { label: value, background: this.hexToRgba(value, 0.16) };\r\n }\r\n\r\n const { label, background } = value;\r\n if (!FuiBadgeComponent._HEX_PATTERN.test(label) || !FuiBadgeComponent._HEX_PATTERN.test(background)) {\r\n console.warn(`[FormaUI] Invalid badge color object:`, value);\r\n return null;\r\n }\r\n return { label, background };\r\n });\r\n\r\n readonly computedStyles = computed(() => {\r\n const resolved = this.resolvedCustomColor();\r\n if (!resolved) return {} as Record<string, string>;\r\n return {\r\n 'background-color': resolved.background,\r\n color: resolved.label,\r\n } as Record<string, string>;\r\n });\r\n\r\n readonly computedClasses: Signal<string> = computed(() => {\r\n const effectiveVariant = this.resolvedCustomColor() ? 'custom' : this.variant();\r\n const classes: string[] = ['fui-badge', `fui-badge--${effectiveVariant}`, `fui-badge--${this.size()}`];\r\n\r\n if (this.icon()) {\r\n classes.push('fui-badge--with-icon');\r\n }\r\n\r\n return classes.join(' ');\r\n });\r\n\r\n readonly iconSize: Signal<'sm' | 'md' | 'lg'> = computed(() => {\r\n const size = this.size();\r\n if (size === 'lg') return 'md';\r\n return 'sm';\r\n });\r\n\r\n private hexToRgba(hex: string, alpha: number): string {\r\n let h = hex.slice(1);\r\n if (h.length === 3 || h.length === 4) {\r\n h = h\r\n .split('')\r\n .map((c) => c + c)\r\n .join('');\r\n }\r\n const r = parseInt(h.slice(0, 2), 16);\r\n const g = parseInt(h.slice(2, 4), 16);\r\n const b = parseInt(h.slice(4, 6), 16);\r\n return `rgba(${r}, ${g}, ${b}, ${alpha})`;\r\n }\r\n}\r\n","<div class=\"fui-badge__content\">\r\n @if (icon()) {\r\n <fui-icon class=\"fui-badge__icon\" [name]=\"icon()!\" [size]=\"iconSize()\" aria-hidden=\"true\" />\r\n }\r\n <span class=\"fui-badge__label\">{{ label() }}</span>\r\n</div>\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":"raintonic-formaui-components-badge.mjs","sources":["../../../lib/components/badge/badge.types.ts","../../../lib/components/badge/badge.component.ts","../../../lib/components/badge/badge.component.html","../../../lib/components/badge/raintonic-formaui-components-badge.ts"],"sourcesContent":["export type FuiBadgeSize = 'sm' | 'md' | 'lg';\r\n\r\nexport interface FuiBadgeCustomColorObject {\r\n label: string;\r\n background: string;\r\n}\r\n\r\nexport type FuiBadgeCustomColor = string | FuiBadgeCustomColorObject;\r\n\r\nexport type FuiBadgeVariant = 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'custom';\r\n\r\nexport const FUI_BADGE_SIZES: readonly FuiBadgeSize[] = ['sm', 'md', 'lg'] as const;\r\n\r\nexport const FUI_BADGE_VARIANTS: readonly FuiBadgeVariant[] = [\r\n 'primary',\r\n 'secondary',\r\n 'success',\r\n 'info',\r\n 'warning',\r\n 'error',\r\n 'custom',\r\n] as const;\r\n","import { ChangeDetectionStrategy, Component, computed, input, Signal } from '@angular/core';\r\nimport { FuiIconComponent } from '@raintonic/formaui/components/icon';\r\nimport {\r\n FuiBadgeCustomColor,\r\n FuiBadgeCustomColorObject,\r\n FuiBadgeSize,\r\n FuiBadgeVariant,\r\n FUI_BADGE_SIZES,\r\n FUI_BADGE_VARIANTS,\r\n} from './badge.types';\r\n\r\n/**\r\n * @component FuiBadgeComponent\r\n * @selector fui-badge\r\n * @description Displays a small label badge with optional icon and color variants.\r\n * Supports custom colors with automatic text contrast calculation.\r\n *\r\n * @input label - (required) Text content of the badge.\r\n * @input icon - Optional Phosphor icon name displayed before the label.\r\n * @input customColor - Optional hex color or `{ label, background }` object that overrides the variant palette.\r\n * - Hex string: used as label color; background is the same hex with 16% alpha.\r\n * - Object: `{ label, background }` both as hex; applied as-is.\r\n * @input size - Badge size: 'sm' | 'md' | 'lg'. Default 'md'.\r\n * @input variant - Color variant: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info'. Default 'primary'.\r\n * @input ariaLabel - Accessible label override for screen readers.\r\n *\r\n * @example\r\n * <fui-badge label=\"Active\" variant=\"success\" icon=\"check-circle\"></fui-badge>\r\n */\r\n@Component({\r\n selector: 'fui-badge',\r\n standalone: true,\r\n imports: [FuiIconComponent],\r\n templateUrl: './badge.component.html',\r\n styleUrls: ['./badge.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n host: {\r\n '[class]': 'computedClasses()',\r\n '[style]': 'computedStyles()',\r\n role: 'status',\r\n '[attr.aria-label]': 'ariaLabel() || null',\r\n },\r\n})\r\nexport class FuiBadgeComponent {\r\n /** Hex pattern: #rgb, #rgba, #rrggbb, #rrggbbaa */\r\n private static readonly _HEX_PATTERN = /^#([0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/;\r\n\r\n readonly label = input.required<string>();\r\n\r\n readonly icon = input<string | null>(null);\r\n\r\n readonly customColor = input<FuiBadgeCustomColor | null>(null);\r\n\r\n readonly size = input<FuiBadgeSize, FuiBadgeSize | string>('md', {\r\n transform: (v) => ((FUI_BADGE_SIZES as readonly string[]).includes(v) ? (v as FuiBadgeSize) : 'md'),\r\n });\r\n\r\n readonly variant = input<FuiBadgeVariant, FuiBadgeVariant | string>('primary', {\r\n transform: (v) => ((FUI_BADGE_VARIANTS as readonly string[]).includes(v) ? (v as FuiBadgeVariant) : 'primary'),\r\n });\r\n\r\n readonly ariaLabel = input<string | null>(null);\r\n\r\n /**\r\n * Resolved custom color pair (label + background).\r\n * - String input: must be a valid hex → used as label color, background is same hex with 16% alpha.\r\n * - Object input: `{ label, background }` used directly (both must be valid hex).\r\n * Returns null for invalid values to prevent CSS injection.\r\n */\r\n readonly resolvedCustomColor: Signal<FuiBadgeCustomColorObject | null> = computed(() => {\r\n const value = this.customColor();\r\n if (!value) return null;\r\n\r\n if (typeof value === 'string') {\r\n if (!FuiBadgeComponent._HEX_PATTERN.test(value)) {\r\n console.warn(`[FormaUI] Invalid badge color: \"${value}\"`);\r\n return null;\r\n }\r\n return { label: value, background: this.hexToRgba(value, 0.16) };\r\n }\r\n\r\n const { label, background } = value;\r\n if (!FuiBadgeComponent._HEX_PATTERN.test(label) || !FuiBadgeComponent._HEX_PATTERN.test(background)) {\r\n console.warn(`[FormaUI] Invalid badge color object:`, value);\r\n return null;\r\n }\r\n return { label, background };\r\n });\r\n\r\n readonly computedStyles = computed(() => {\r\n const resolved = this.resolvedCustomColor();\r\n if (!resolved) return {} as Record<string, string>;\r\n return {\r\n 'background-color': resolved.background,\r\n color: resolved.label,\r\n } as Record<string, string>;\r\n });\r\n\r\n readonly computedClasses: Signal<string> = computed(() => {\r\n const effectiveVariant = this.resolvedCustomColor() ? 'custom' : this.variant();\r\n const classes: string[] = ['fui-badge', `fui-badge--${effectiveVariant}`, `fui-badge--${this.size()}`];\r\n\r\n if (this.icon()) {\r\n classes.push('fui-badge--with-icon');\r\n }\r\n\r\n return classes.join(' ');\r\n });\r\n\r\n readonly iconSize: Signal<'sm' | 'md' | 'lg'> = computed(() => {\r\n const size = this.size();\r\n if (size === 'lg') return 'md';\r\n return 'sm';\r\n });\r\n\r\n private hexToRgba(hex: string, alpha: number): string {\r\n let h = hex.slice(1);\r\n if (h.length === 3 || h.length === 4) {\r\n h = h\r\n .split('')\r\n .map((c) => c + c)\r\n .join('');\r\n }\r\n const r = parseInt(h.slice(0, 2), 16);\r\n const g = parseInt(h.slice(2, 4), 16);\r\n const b = parseInt(h.slice(4, 6), 16);\r\n return `rgba(${r}, ${g}, ${b}, ${alpha})`;\r\n }\r\n}\r\n","<div class=\"fui-badge__content\">\r\n @if (icon()) {\r\n <fui-icon class=\"fui-badge__icon\" [name]=\"icon()!\" [size]=\"iconSize()\" aria-hidden=\"true\" />\r\n }\r\n <span class=\"fui-badge__label\">{{ label() }}</span>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -14,7 +14,7 @@ class FuiBreadcrumbItemComponent {
|
|
|
14
14
|
_separator = signal('/', ...(ngDevMode ? [{ debugName: "_separator" }] : /* istanbul ignore next */ []));
|
|
15
15
|
isLink = computed(() => this.routerLink() != null && !this.isLast() && !this.disabled(), ...(ngDevMode ? [{ debugName: "isLink" }] : /* istanbul ignore next */ []));
|
|
16
16
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiBreadcrumbItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
17
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiBreadcrumbItemComponent, isStandalone: true, selector: "fui-breadcrumb-item", inputs: { routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.fui-breadcrumb-item--active": "isLast()", "class.fui-breadcrumb-item--disabled": "disabled()", "attr.aria-current": "isLast() ? \"page\" : null" }, classAttribute: "fui-breadcrumb-item" }, ngImport: i0, template: "<li class=\"fui-breadcrumb-item__wrapper\">\r\n @if (isLink()) {\r\n <a class=\"fui-breadcrumb-item__link\" [routerLink]=\"routerLink()\"><ng-content></ng-content></a>\r\n } @else {\r\n <span class=\"fui-breadcrumb-item__text\"><ng-content></ng-content></span>\r\n }\r\n</li>\r\n@if (!isLast()) {\r\n <li class=\"fui-breadcrumb-item__separator\" aria-hidden=\"true\">{{ _separator() }}</li>\r\n}\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity
|
|
17
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiBreadcrumbItemComponent, isStandalone: true, selector: "fui-breadcrumb-item", inputs: { routerLink: { classPropertyName: "routerLink", publicName: "routerLink", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.fui-breadcrumb-item--active": "isLast()", "class.fui-breadcrumb-item--disabled": "disabled()", "attr.aria-current": "isLast() ? \"page\" : null" }, classAttribute: "fui-breadcrumb-item" }, ngImport: i0, template: "<li class=\"fui-breadcrumb-item__wrapper\">\r\n @if (isLink()) {\r\n <a class=\"fui-breadcrumb-item__link\" [routerLink]=\"routerLink()\"><ng-content></ng-content></a>\r\n } @else {\r\n <span class=\"fui-breadcrumb-item__text\"><ng-content></ng-content></span>\r\n }\r\n</li>\r\n@if (!isLast()) {\r\n <li class=\"fui-breadcrumb-item__separator\" aria-hidden=\"true\">{{ _separator() }}</li>\r\n}\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-out);transition-delay:0ms}.fui-motion-fade-out{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-in);transition-delay:0ms}.fui-motion-slide-in-bottom{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition-property:transform,opacity;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-base) var(--fui-ease-out)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-breadcrumb{display:block}.fui-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;list-style:none;margin:0;padding:0;gap:var(--fui-spacing-2, .25rem)}.fui-breadcrumb-item{display:contents}.fui-breadcrumb-item__wrapper{display:flex;align-items:center}.fui-breadcrumb-item__link{color:var(--fui-text-link);text-decoration:none;font-family:var(--fui-font-sans);font-size:var(--fui-text-base);transition-property:color;transition-duration:var(--fui-duration-fast, .15s);transition-timing-function:var(--fui-ease-in-out);transition-delay:0ms}.fui-breadcrumb-item__link:hover{color:var(--fui-primary-80);text-decoration:underline}.fui-breadcrumb-item__link:focus-visible{outline:2px solid var(--fui-primary-10);border-radius:var(--fui-radius-sm, 8px)}.fui-breadcrumb-item__text{font-family:var(--fui-font-sans);font-size:var(--fui-text-base);color:var(--fui-text-primary)}.fui-breadcrumb-item--active .fui-breadcrumb-item__text{font-weight:var(--fui-weight-medium, 500);color:var(--fui-text-primary)}.fui-breadcrumb-item--disabled .fui-breadcrumb-item__text{color:var(--fui-text-disabled)}.fui-breadcrumb-item__separator{display:flex;align-items:center;color:var(--fui-text-secondary);font-size:var(--fui-text-base);-webkit-user-select:none;user-select:none;padding:0 var(--fui-spacing-2, .25rem)}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
18
18
|
}
|
|
19
19
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiBreadcrumbItemComponent, decorators: [{
|
|
20
20
|
type: Component,
|
|
@@ -23,7 +23,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
|
|
|
23
23
|
'[class.fui-breadcrumb-item--active]': 'isLast()',
|
|
24
24
|
'[class.fui-breadcrumb-item--disabled]': 'disabled()',
|
|
25
25
|
'[attr.aria-current]': 'isLast() ? "page" : null',
|
|
26
|
-
}, template: "<li class=\"fui-breadcrumb-item__wrapper\">\r\n @if (isLink()) {\r\n <a class=\"fui-breadcrumb-item__link\" [routerLink]=\"routerLink()\"><ng-content></ng-content></a>\r\n } @else {\r\n <span class=\"fui-breadcrumb-item__text\"><ng-content></ng-content></span>\r\n }\r\n</li>\r\n@if (!isLast()) {\r\n <li class=\"fui-breadcrumb-item__separator\" aria-hidden=\"true\">{{ _separator() }}</li>\r\n}\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity
|
|
26
|
+
}, template: "<li class=\"fui-breadcrumb-item__wrapper\">\r\n @if (isLink()) {\r\n <a class=\"fui-breadcrumb-item__link\" [routerLink]=\"routerLink()\"><ng-content></ng-content></a>\r\n } @else {\r\n <span class=\"fui-breadcrumb-item__text\"><ng-content></ng-content></span>\r\n }\r\n</li>\r\n@if (!isLast()) {\r\n <li class=\"fui-breadcrumb-item__separator\" aria-hidden=\"true\">{{ _separator() }}</li>\r\n}\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-out);transition-delay:0ms}.fui-motion-fade-out{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-in);transition-delay:0ms}.fui-motion-slide-in-bottom{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition-property:transform,opacity;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-base) var(--fui-ease-out)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-breadcrumb{display:block}.fui-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;list-style:none;margin:0;padding:0;gap:var(--fui-spacing-2, .25rem)}.fui-breadcrumb-item{display:contents}.fui-breadcrumb-item__wrapper{display:flex;align-items:center}.fui-breadcrumb-item__link{color:var(--fui-text-link);text-decoration:none;font-family:var(--fui-font-sans);font-size:var(--fui-text-base);transition-property:color;transition-duration:var(--fui-duration-fast, .15s);transition-timing-function:var(--fui-ease-in-out);transition-delay:0ms}.fui-breadcrumb-item__link:hover{color:var(--fui-primary-80);text-decoration:underline}.fui-breadcrumb-item__link:focus-visible{outline:2px solid var(--fui-primary-10);border-radius:var(--fui-radius-sm, 8px)}.fui-breadcrumb-item__text{font-family:var(--fui-font-sans);font-size:var(--fui-text-base);color:var(--fui-text-primary)}.fui-breadcrumb-item--active .fui-breadcrumb-item__text{font-weight:var(--fui-weight-medium, 500);color:var(--fui-text-primary)}.fui-breadcrumb-item--disabled .fui-breadcrumb-item__text{color:var(--fui-text-disabled)}.fui-breadcrumb-item__separator{display:flex;align-items:center;color:var(--fui-text-secondary);font-size:var(--fui-text-base);-webkit-user-select:none;user-select:none;padding:0 var(--fui-spacing-2, .25rem)}\n"] }]
|
|
27
27
|
}], propDecorators: { routerLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerLink", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
|
|
28
28
|
|
|
29
29
|
class FuiBreadcrumbIntl extends FuiIntlBase {
|
|
@@ -55,13 +55,13 @@ class FuiBreadcrumbComponent {
|
|
|
55
55
|
.subscribe(() => { this._cdr.markForCheck(); });
|
|
56
56
|
}
|
|
57
57
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
58
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.6", type: FuiBreadcrumbComponent, isStandalone: true, selector: "fui-breadcrumb", inputs: { separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "fui-breadcrumb" }, providers: [{ provide: FUI_BREADCRUMB, useExisting: FuiBreadcrumbComponent }], queries: [{ propertyName: "items", predicate: FuiBreadcrumbItemComponent, isSignal: true }], ngImport: i0, template: "<nav [attr.aria-label]=\"ariaLabel() ?? intl.rootAriaLabel\">\r\n <ol class=\"fui-breadcrumb__list\">\r\n <ng-content></ng-content>\r\n </ol>\r\n</nav>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity
|
|
58
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.6", type: FuiBreadcrumbComponent, isStandalone: true, selector: "fui-breadcrumb", inputs: { separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "fui-breadcrumb" }, providers: [{ provide: FUI_BREADCRUMB, useExisting: FuiBreadcrumbComponent }], queries: [{ propertyName: "items", predicate: FuiBreadcrumbItemComponent, isSignal: true }], ngImport: i0, template: "<nav [attr.aria-label]=\"ariaLabel() ?? intl.rootAriaLabel\">\r\n <ol class=\"fui-breadcrumb__list\">\r\n <ng-content></ng-content>\r\n </ol>\r\n</nav>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-out);transition-delay:0ms}.fui-motion-fade-out{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-in);transition-delay:0ms}.fui-motion-slide-in-bottom{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition-property:transform,opacity;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-base) var(--fui-ease-out)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-breadcrumb{display:block}.fui-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;list-style:none;margin:0;padding:0;gap:var(--fui-spacing-2, .25rem)}.fui-breadcrumb-item{display:contents}.fui-breadcrumb-item__wrapper{display:flex;align-items:center}.fui-breadcrumb-item__link{color:var(--fui-text-link);text-decoration:none;font-family:var(--fui-font-sans);font-size:var(--fui-text-base);transition-property:color;transition-duration:var(--fui-duration-fast, .15s);transition-timing-function:var(--fui-ease-in-out);transition-delay:0ms}.fui-breadcrumb-item__link:hover{color:var(--fui-primary-80);text-decoration:underline}.fui-breadcrumb-item__link:focus-visible{outline:2px solid var(--fui-primary-10);border-radius:var(--fui-radius-sm, 8px)}.fui-breadcrumb-item__text{font-family:var(--fui-font-sans);font-size:var(--fui-text-base);color:var(--fui-text-primary)}.fui-breadcrumb-item--active .fui-breadcrumb-item__text{font-weight:var(--fui-weight-medium, 500);color:var(--fui-text-primary)}.fui-breadcrumb-item--disabled .fui-breadcrumb-item__text{color:var(--fui-text-disabled)}.fui-breadcrumb-item__separator{display:flex;align-items:center;color:var(--fui-text-secondary);font-size:var(--fui-text-base);-webkit-user-select:none;user-select:none;padding:0 var(--fui-spacing-2, .25rem)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
59
59
|
}
|
|
60
60
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiBreadcrumbComponent, decorators: [{
|
|
61
61
|
type: Component,
|
|
62
62
|
args: [{ selector: 'fui-breadcrumb', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
63
63
|
class: 'fui-breadcrumb',
|
|
64
|
-
}, providers: [{ provide: FUI_BREADCRUMB, useExisting: FuiBreadcrumbComponent }], template: "<nav [attr.aria-label]=\"ariaLabel() ?? intl.rootAriaLabel\">\r\n <ol class=\"fui-breadcrumb__list\">\r\n <ng-content></ng-content>\r\n </ol>\r\n</nav>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity
|
|
64
|
+
}, providers: [{ provide: FUI_BREADCRUMB, useExisting: FuiBreadcrumbComponent }], template: "<nav [attr.aria-label]=\"ariaLabel() ?? intl.rootAriaLabel\">\r\n <ol class=\"fui-breadcrumb__list\">\r\n <ng-content></ng-content>\r\n </ol>\r\n</nav>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-out);transition-delay:0ms}.fui-motion-fade-out{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-in);transition-delay:0ms}.fui-motion-slide-in-bottom{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition-property:transform,opacity;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-base) var(--fui-ease-out)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-breadcrumb{display:block}.fui-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;list-style:none;margin:0;padding:0;gap:var(--fui-spacing-2, .25rem)}.fui-breadcrumb-item{display:contents}.fui-breadcrumb-item__wrapper{display:flex;align-items:center}.fui-breadcrumb-item__link{color:var(--fui-text-link);text-decoration:none;font-family:var(--fui-font-sans);font-size:var(--fui-text-base);transition-property:color;transition-duration:var(--fui-duration-fast, .15s);transition-timing-function:var(--fui-ease-in-out);transition-delay:0ms}.fui-breadcrumb-item__link:hover{color:var(--fui-primary-80);text-decoration:underline}.fui-breadcrumb-item__link:focus-visible{outline:2px solid var(--fui-primary-10);border-radius:var(--fui-radius-sm, 8px)}.fui-breadcrumb-item__text{font-family:var(--fui-font-sans);font-size:var(--fui-text-base);color:var(--fui-text-primary)}.fui-breadcrumb-item--active .fui-breadcrumb-item__text{font-weight:var(--fui-weight-medium, 500);color:var(--fui-text-primary)}.fui-breadcrumb-item--disabled .fui-breadcrumb-item__text{color:var(--fui-text-disabled)}.fui-breadcrumb-item__separator{display:flex;align-items:center;color:var(--fui-text-secondary);font-size:var(--fui-text-base);-webkit-user-select:none;user-select:none;padding:0 var(--fui-spacing-2, .25rem)}\n"] }]
|
|
65
65
|
}], ctorParameters: () => [], propDecorators: { separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }], items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => FuiBreadcrumbItemComponent), { isSignal: true }] }] } });
|
|
66
66
|
|
|
67
67
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"raintonic-formaui-components-breadcrumb.mjs","sources":["../../../lib/components/breadcrumb/breadcrumb.types.ts","../../../lib/components/breadcrumb/breadcrumb-item.component.ts","../../../lib/components/breadcrumb/breadcrumb-item.component.html","../../../lib/components/breadcrumb/breadcrumb.intl.ts","../../../lib/components/breadcrumb/breadcrumb.component.ts","../../../lib/components/breadcrumb/breadcrumb.component.html","../../../lib/components/breadcrumb/raintonic-formaui-components-breadcrumb.ts"],"sourcesContent":["import { InjectionToken } from '@angular/core';\r\n\r\nexport const FUI_BREADCRUMB = new InjectionToken<unknown>('FUI_BREADCRUMB');\r\n","import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n ViewEncapsulation,\r\n booleanAttribute,\r\n computed,\r\n input,\r\n signal,\r\n} from '@angular/core';\r\nimport { RouterLink } from '@angular/router';\r\n\r\n@Component({\r\n selector: 'fui-breadcrumb-item',\r\n standalone: true,\r\n imports: [RouterLink],\r\n templateUrl: './breadcrumb-item.component.html',\r\n styleUrls: ['./breadcrumb.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-breadcrumb-item',\r\n '[class.fui-breadcrumb-item--active]': 'isLast()',\r\n '[class.fui-breadcrumb-item--disabled]': 'disabled()',\r\n '[attr.aria-current]': 'isLast() ? \"page\" : null',\r\n },\r\n})\r\nexport class FuiBreadcrumbItemComponent {\r\n readonly routerLink = input<string | unknown[] | null>(null);\r\n readonly disabled = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n // Set by parent breadcrumb\r\n readonly isLast = signal(false);\r\n readonly _separator = signal('/');\r\n\r\n readonly isLink = computed(() => this.routerLink() != null && !this.isLast() && !this.disabled());\r\n}\r\n","<li class=\"fui-breadcrumb-item__wrapper\">\r\n @if (isLink()) {\r\n <a class=\"fui-breadcrumb-item__link\" [routerLink]=\"routerLink()\"><ng-content></ng-content></a>\r\n } @else {\r\n <span class=\"fui-breadcrumb-item__text\"><ng-content></ng-content></span>\r\n }\r\n</li>\r\n@if (!isLast()) {\r\n <li class=\"fui-breadcrumb-item__separator\" aria-hidden=\"true\">{{ _separator() }}</li>\r\n}\r\n","import { Injectable } from '@angular/core';\r\nimport { FuiIntlBase } from '@raintonic/formaui/core';\r\n\r\n@Injectable({ providedIn: 'root' })\r\nexport class FuiBreadcrumbIntl extends FuiIntlBase {\r\n rootAriaLabel = 'Breadcrumb';\r\n}\r\n","import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ViewEncapsulation, contentChildren, effect, inject, input } from '@angular/core';\r\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\r\nimport { FUI_BREADCRUMB } from './breadcrumb.types';\r\nimport { FuiBreadcrumbItemComponent } from './breadcrumb-item.component';\r\nimport { FuiBreadcrumbIntl } from './breadcrumb.intl';\r\n\r\n@Component({\r\n selector: 'fui-breadcrumb',\r\n standalone: true,\r\n imports: [],\r\n templateUrl: './breadcrumb.component.html',\r\n styleUrls: ['./breadcrumb.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-breadcrumb',\r\n },\r\n providers: [{ provide: FUI_BREADCRUMB, useExisting: FuiBreadcrumbComponent }],\r\n})\r\nexport class FuiBreadcrumbComponent {\r\n readonly intl = inject(FuiBreadcrumbIntl);\r\n private readonly _cdr = inject(ChangeDetectorRef);\r\n\r\n readonly separator = input('/');\r\n readonly ariaLabel = input<string | undefined>(undefined, { alias: 'aria-label' });\r\n\r\n readonly items = contentChildren(FuiBreadcrumbItemComponent);\r\n\r\n constructor() {\r\n effect(() => {\r\n const items = this.items();\r\n items.forEach((item, idx) => {\r\n item.isLast.set(idx === items.length - 1);\r\n item._separator.set(this.separator());\r\n });\r\n });\r\n\r\n this.intl.changes\r\n .pipe(takeUntilDestroyed())\r\n .subscribe(() => { this._cdr.markForCheck(); });\r\n }\r\n}\r\n","<nav [attr.aria-label]=\"ariaLabel() ?? intl.rootAriaLabel\">\r\n <ol class=\"fui-breadcrumb__list\">\r\n <ng-content></ng-content>\r\n </ol>\r\n</nav>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;MAEa,cAAc,GAAG,IAAI,cAAc,CAAU,gBAAgB;;MCwB7D,0BAA0B,CAAA;AAC5B,IAAA,UAAU,GAAG,KAAK,CAA4B,IAAI,iFAAC;IACnD,QAAQ,GAAG,KAAK,CAAmB,KAAK,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;;AAG1E,IAAA,MAAM,GAAG,MAAM,CAAC,KAAK,6EAAC;AACtB,IAAA,UAAU,GAAG,MAAM,CAAC,GAAG,iFAAC;IAExB,MAAM,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,UAAU,EAAE,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;uGARtF,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAA1B,0BAA0B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,mCAAA,EAAA,UAAA,EAAA,qCAAA,EAAA,YAAA,EAAA,mBAAA,EAAA,4BAAA,EAAA,EAAA,cAAA,EAAA,qBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC1BvC,2ZAUA,EAAA,MAAA,EAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"raintonic-formaui-components-breadcrumb.mjs","sources":["../../../lib/components/breadcrumb/breadcrumb.types.ts","../../../lib/components/breadcrumb/breadcrumb-item.component.ts","../../../lib/components/breadcrumb/breadcrumb-item.component.html","../../../lib/components/breadcrumb/breadcrumb.intl.ts","../../../lib/components/breadcrumb/breadcrumb.component.ts","../../../lib/components/breadcrumb/breadcrumb.component.html","../../../lib/components/breadcrumb/raintonic-formaui-components-breadcrumb.ts"],"sourcesContent":["import { InjectionToken } from '@angular/core';\r\n\r\nexport const FUI_BREADCRUMB = new InjectionToken<unknown>('FUI_BREADCRUMB');\r\n","import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n ViewEncapsulation,\r\n booleanAttribute,\r\n computed,\r\n input,\r\n signal,\r\n} from '@angular/core';\r\nimport { RouterLink } from '@angular/router';\r\n\r\n@Component({\r\n selector: 'fui-breadcrumb-item',\r\n standalone: true,\r\n imports: [RouterLink],\r\n templateUrl: './breadcrumb-item.component.html',\r\n styleUrls: ['./breadcrumb.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-breadcrumb-item',\r\n '[class.fui-breadcrumb-item--active]': 'isLast()',\r\n '[class.fui-breadcrumb-item--disabled]': 'disabled()',\r\n '[attr.aria-current]': 'isLast() ? \"page\" : null',\r\n },\r\n})\r\nexport class FuiBreadcrumbItemComponent {\r\n readonly routerLink = input<string | unknown[] | null>(null);\r\n readonly disabled = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n // Set by parent breadcrumb\r\n readonly isLast = signal(false);\r\n readonly _separator = signal('/');\r\n\r\n readonly isLink = computed(() => this.routerLink() != null && !this.isLast() && !this.disabled());\r\n}\r\n","<li class=\"fui-breadcrumb-item__wrapper\">\r\n @if (isLink()) {\r\n <a class=\"fui-breadcrumb-item__link\" [routerLink]=\"routerLink()\"><ng-content></ng-content></a>\r\n } @else {\r\n <span class=\"fui-breadcrumb-item__text\"><ng-content></ng-content></span>\r\n }\r\n</li>\r\n@if (!isLast()) {\r\n <li class=\"fui-breadcrumb-item__separator\" aria-hidden=\"true\">{{ _separator() }}</li>\r\n}\r\n","import { Injectable } from '@angular/core';\r\nimport { FuiIntlBase } from '@raintonic/formaui/core';\r\n\r\n@Injectable({ providedIn: 'root' })\r\nexport class FuiBreadcrumbIntl extends FuiIntlBase {\r\n rootAriaLabel = 'Breadcrumb';\r\n}\r\n","import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ViewEncapsulation, contentChildren, effect, inject, input } from '@angular/core';\r\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\r\nimport { FUI_BREADCRUMB } from './breadcrumb.types';\r\nimport { FuiBreadcrumbItemComponent } from './breadcrumb-item.component';\r\nimport { FuiBreadcrumbIntl } from './breadcrumb.intl';\r\n\r\n@Component({\r\n selector: 'fui-breadcrumb',\r\n standalone: true,\r\n imports: [],\r\n templateUrl: './breadcrumb.component.html',\r\n styleUrls: ['./breadcrumb.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-breadcrumb',\r\n },\r\n providers: [{ provide: FUI_BREADCRUMB, useExisting: FuiBreadcrumbComponent }],\r\n})\r\nexport class FuiBreadcrumbComponent {\r\n readonly intl = inject(FuiBreadcrumbIntl);\r\n private readonly _cdr = inject(ChangeDetectorRef);\r\n\r\n readonly separator = input('/');\r\n readonly ariaLabel = input<string | undefined>(undefined, { alias: 'aria-label' });\r\n\r\n readonly items = contentChildren(FuiBreadcrumbItemComponent);\r\n\r\n constructor() {\r\n effect(() => {\r\n const items = this.items();\r\n items.forEach((item, idx) => {\r\n item.isLast.set(idx === items.length - 1);\r\n item._separator.set(this.separator());\r\n });\r\n });\r\n\r\n this.intl.changes\r\n .pipe(takeUntilDestroyed())\r\n .subscribe(() => { this._cdr.markForCheck(); });\r\n }\r\n}\r\n","<nav [attr.aria-label]=\"ariaLabel() ?? intl.rootAriaLabel\">\r\n <ol class=\"fui-breadcrumb__list\">\r\n <ng-content></ng-content>\r\n </ol>\r\n</nav>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;MAEa,cAAc,GAAG,IAAI,cAAc,CAAU,gBAAgB;;MCwB7D,0BAA0B,CAAA;AAC5B,IAAA,UAAU,GAAG,KAAK,CAA4B,IAAI,iFAAC;IACnD,QAAQ,GAAG,KAAK,CAAmB,KAAK,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;;AAG1E,IAAA,MAAM,GAAG,MAAM,CAAC,KAAK,6EAAC;AACtB,IAAA,UAAU,GAAG,MAAM,CAAC,GAAG,iFAAC;IAExB,MAAM,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,UAAU,EAAE,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;uGARtF,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAA1B,0BAA0B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,mCAAA,EAAA,UAAA,EAAA,qCAAA,EAAA,YAAA,EAAA,mBAAA,EAAA,4BAAA,EAAA,EAAA,cAAA,EAAA,qBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC1BvC,2ZAUA,EAAA,MAAA,EAAA,CAAA,kwGAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDIY,UAAU,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,aAAA,EAAA,UAAA,EAAA,qBAAA,EAAA,OAAA,EAAA,MAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,YAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAYT,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBAftC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,qBAAqB,EAAA,UAAA,EACnB,IAAI,EAAA,OAAA,EACP,CAAC,UAAU,CAAC,EAAA,eAAA,EAGJ,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,KAAK,EAAE,qBAAqB;AAC5B,wBAAA,qCAAqC,EAAE,UAAU;AACjD,wBAAA,uCAAuC,EAAE,YAAY;AACrD,wBAAA,qBAAqB,EAAE,0BAA0B;AAClD,qBAAA,EAAA,QAAA,EAAA,2ZAAA,EAAA,MAAA,EAAA,CAAA,kwGAAA,CAAA,EAAA;;;AEpBG,MAAO,iBAAkB,SAAQ,WAAW,CAAA;IAChD,aAAa,GAAG,YAAY;uGADjB,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,cADJ,MAAM,EAAA,CAAA;;2FACnB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAD7B,UAAU;mBAAC,EAAE,UAAU,EAAE,MAAM,EAAE;;;MCgBrB,sBAAsB,CAAA;AACxB,IAAA,IAAI,GAAG,MAAM,CAAC,iBAAiB,CAAC;AACxB,IAAA,IAAI,GAAG,MAAM,CAAC,iBAAiB,CAAC;AAExC,IAAA,SAAS,GAAG,KAAK,CAAC,GAAG,gFAAC;IACtB,SAAS,GAAG,KAAK,CAAqB,SAAS,iFAAI,KAAK,EAAE,YAAY,EAAA,CAAG;AAEzE,IAAA,KAAK,GAAG,eAAe,CAAC,0BAA0B,4EAAC;AAE5D,IAAA,WAAA,GAAA;QACE,MAAM,CAAC,MAAK;AACV,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE;YAC1B,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,GAAG,KAAI;AAC1B,gBAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,GAAG,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;gBACzC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;AACvC,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC,CAAC;QAEF,IAAI,CAAC,IAAI,CAAC;aACP,IAAI,CAAC,kBAAkB,EAAE;AACzB,aAAA,SAAS,CAAC,MAAK,EAAG,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;IACnD;uGArBW,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAtB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,EAAA,SAAA,EAFtB,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,sBAAsB,EAAE,CAAC,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAS5C,0BAA0B,6CC1B7D,kKAKA,EAAA,MAAA,EAAA,CAAA,kwGAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FDca,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAblC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,gBAAgB,EAAA,UAAA,EACd,IAAI,EAAA,OAAA,EACP,EAAE,EAAA,eAAA,EAGM,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,KAAK,EAAE,gBAAgB;qBACxB,EAAA,SAAA,EACU,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAA,sBAAwB,EAAE,CAAC,EAAA,QAAA,EAAA,kKAAA,EAAA,MAAA,EAAA,CAAA,kwGAAA,CAAA,EAAA;4TAS5C,0BAA0B,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AE1B7D;;AAEG;;;;"}
|
|
@@ -84,7 +84,7 @@ class FuiButtonGroupComponent {
|
|
|
84
84
|
});
|
|
85
85
|
}
|
|
86
86
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
87
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", type: FuiButtonGroupComponent, isStandalone: true, selector: "fui-button-group", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "attr.aria-label": "ariaLabel()" }, classAttribute: "fui-button-group" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".fui-button-group{contain:layout style;display:inline-flex;align-items:center;gap:0;background-color:var(--fui-
|
|
87
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", type: FuiButtonGroupComponent, isStandalone: true, selector: "fui-button-group", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "attr.aria-label": "ariaLabel()" }, classAttribute: "fui-button-group" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".fui-button-group{contain:layout style;display:inline-flex;align-items:center;gap:0;background-color:var(--fui-bg-subtle);padding:var(--fui-spacing-2);border-radius:var(--fui-radius-sm);box-sizing:border-box}.fui-button-group .fui-button{margin:0}.fui-button-group .fui-button-group__button--middle{border-radius:var(--fui-radius-none)}.fui-button-group .fui-button-group__button--first{border-top-right-radius:var(--fui-radius-none);border-bottom-right-radius:var(--fui-radius-none)}.fui-button-group .fui-button-group__button--last{border-top-left-radius:var(--fui-radius-none);border-bottom-left-radius:var(--fui-radius-none)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
88
88
|
}
|
|
89
89
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiButtonGroupComponent, decorators: [{
|
|
90
90
|
type: Component,
|
|
@@ -92,7 +92,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
|
|
|
92
92
|
class: 'fui-button-group',
|
|
93
93
|
role: 'group',
|
|
94
94
|
'[attr.aria-label]': 'ariaLabel()',
|
|
95
|
-
}, styles: [".fui-button-group{contain:layout style;display:inline-flex;align-items:center;gap:0;background-color:var(--fui-
|
|
95
|
+
}, styles: [".fui-button-group{contain:layout style;display:inline-flex;align-items:center;gap:0;background-color:var(--fui-bg-subtle);padding:var(--fui-spacing-2);border-radius:var(--fui-radius-sm);box-sizing:border-box}.fui-button-group .fui-button{margin:0}.fui-button-group .fui-button-group__button--middle{border-radius:var(--fui-radius-none)}.fui-button-group .fui-button-group__button--first{border-top-right-radius:var(--fui-radius-none);border-bottom-right-radius:var(--fui-radius-none)}.fui-button-group .fui-button-group__button--last{border-top-left-radius:var(--fui-radius-none);border-bottom-left-radius:var(--fui-radius-none)}\n"] }]
|
|
96
96
|
}], ctorParameters: () => [], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
97
97
|
|
|
98
98
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"raintonic-formaui-components-button-group.mjs","sources":["../../../lib/components/button-group/button-group.component.ts","../../../lib/components/button-group/raintonic-formaui-components-button-group.ts"],"sourcesContent":["import {\r\n Component,\r\n ChangeDetectionStrategy,\r\n ViewEncapsulation,\r\n AfterContentInit,\r\n ElementRef,\r\n Renderer2,\r\n inject,\r\n effect,\r\n input,\r\n} from '@angular/core';\r\n\r\n/**\r\n * # Button Group Component\r\n *\r\n * A container component that groups multiple buttons together, creating a unified\r\n * visual element with connected borders. Follows Carbon Design System patterns.\r\n *\r\n * ## Features\r\n * - Groups multiple buttons into a single visual unit\r\n * - Removes internal border-radius, keeping only the extremities rounded\r\n * - Surface-02 background with small padding\r\n * - Automatically handles button border-radius for first and last buttons\r\n *\r\n * ## Usage\r\n *\r\n * ### Basic Button Group\r\n * ```html\r\n * <fui-button-group>\r\n * <button fuiButton variant=\"secondary\">Left</button>\r\n * <button fuiButton variant=\"secondary\">Center</button>\r\n * <button fuiButton variant=\"secondary\">Right</button>\r\n * </fui-button-group>\r\n * ```\r\n *\r\n * @example\r\n * ```typescript\r\n * import { FuiButtonGroupComponent } from '@raintonic/formaui/components/button-group';\r\n * import { FuiButtonDirective } from '@raintonic/formaui/components/button';\r\n *\r\n * @Component({\r\n * standalone: true,\r\n * imports: [FuiButtonGroupComponent, FuiButtonDirective],\r\n * template: `\r\n * <fui-button-group>\r\n * <button fuiButton variant=\"secondary\">Option 1</button>\r\n * <button fuiButton variant=\"secondary\">Option 2</button>\r\n * <button fuiButton variant=\"secondary\">Option 3</button>\r\n * </fui-button-group>\r\n * `\r\n * })\r\n * export class MyComponent {}\r\n * ```\r\n */\r\n@Component({\r\n selector: 'fui-button-group',\r\n standalone: true,\r\n template: `<ng-content></ng-content>`,\r\n styleUrls: ['./button-group.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-button-group',\r\n role: 'group',\r\n '[attr.aria-label]': 'ariaLabel()',\r\n },\r\n})\r\nexport class FuiButtonGroupComponent implements AfterContentInit {\r\n /**\r\n * Accessible label for the button group\r\n */\r\n readonly ariaLabel = input<string | undefined>(undefined);\r\n\r\n private readonly _elementRef = inject(ElementRef);\r\n private readonly _renderer = inject(Renderer2);\r\n\r\n constructor() {\r\n // Set up an effect to handle dynamic button changes\r\n effect(() => {\r\n this._updateButtonStyles();\r\n });\r\n }\r\n\r\n ngAfterContentInit(): void {\r\n this._updateButtonStyles();\r\n }\r\n\r\n private _updateButtonStyles(): void {\r\n const hostElement = this._elementRef.nativeElement as HTMLElement;\r\n const buttons = hostElement.querySelectorAll('[fuiButton]');\r\n\r\n buttons.forEach((button, index) => {\r\n // Remove all position classes first\r\n this._renderer.removeClass(button, 'fui-button-group__button--first');\r\n this._renderer.removeClass(button, 'fui-button-group__button--middle');\r\n this._renderer.removeClass(button, 'fui-button-group__button--last');\r\n this._renderer.removeClass(button, 'fui-button-group__button--only');\r\n\r\n // Add appropriate class based on position\r\n if (buttons.length === 1) {\r\n this._renderer.addClass(button, 'fui-button-group__button--only');\r\n } else if (index === 0) {\r\n this._renderer.addClass(button, 'fui-button-group__button--first');\r\n } else if (index === buttons.length - 1) {\r\n this._renderer.addClass(button, 'fui-button-group__button--last');\r\n } else {\r\n this._renderer.addClass(button, 'fui-button-group__button--middle');\r\n }\r\n });\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAYA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCG;MAcU,uBAAuB,CAAA;AAClC;;AAEG;AACM,IAAA,SAAS,GAAG,KAAK,CAAqB,SAAS,gFAAC;AAExC,IAAA,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAChC,IAAA,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;AAE9C,IAAA,WAAA,GAAA;;QAEE,MAAM,CAAC,MAAK;YACV,IAAI,CAAC,mBAAmB,EAAE;AAC5B,QAAA,CAAC,CAAC;IACJ;IAEA,kBAAkB,GAAA;QAChB,IAAI,CAAC,mBAAmB,EAAE;IAC5B;IAEQ,mBAAmB,GAAA;AACzB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,aAA4B;QACjE,MAAM,OAAO,GAAG,WAAW,CAAC,gBAAgB,CAAC,aAAa,CAAC;QAE3D,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,KAAK,KAAI;;YAEhC,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,iCAAiC,CAAC;YACrE,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,kCAAkC,CAAC;YACtE,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,gCAAgC,CAAC;YACpE,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,gCAAgC,CAAC;;AAGpE,YAAA,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,EAAE;gBACxB,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,gCAAgC,CAAC;YACnE;AAAO,iBAAA,IAAI,KAAK,KAAK,CAAC,EAAE;gBACtB,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,iCAAiC,CAAC;YACpE;iBAAO,IAAI,KAAK,KAAK,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;gBACvC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,gCAAgC,CAAC;YACnE;iBAAO;gBACL,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,kCAAkC,CAAC;YACrE;AACF,QAAA,CAAC,CAAC;IACJ;uGA1CW,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAvB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,6VAVxB,CAAA,yBAAA,CAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"raintonic-formaui-components-button-group.mjs","sources":["../../../lib/components/button-group/button-group.component.ts","../../../lib/components/button-group/raintonic-formaui-components-button-group.ts"],"sourcesContent":["import {\r\n Component,\r\n ChangeDetectionStrategy,\r\n ViewEncapsulation,\r\n AfterContentInit,\r\n ElementRef,\r\n Renderer2,\r\n inject,\r\n effect,\r\n input,\r\n} from '@angular/core';\r\n\r\n/**\r\n * # Button Group Component\r\n *\r\n * A container component that groups multiple buttons together, creating a unified\r\n * visual element with connected borders. Follows Carbon Design System patterns.\r\n *\r\n * ## Features\r\n * - Groups multiple buttons into a single visual unit\r\n * - Removes internal border-radius, keeping only the extremities rounded\r\n * - Surface-02 background with small padding\r\n * - Automatically handles button border-radius for first and last buttons\r\n *\r\n * ## Usage\r\n *\r\n * ### Basic Button Group\r\n * ```html\r\n * <fui-button-group>\r\n * <button fuiButton variant=\"secondary\">Left</button>\r\n * <button fuiButton variant=\"secondary\">Center</button>\r\n * <button fuiButton variant=\"secondary\">Right</button>\r\n * </fui-button-group>\r\n * ```\r\n *\r\n * @example\r\n * ```typescript\r\n * import { FuiButtonGroupComponent } from '@raintonic/formaui/components/button-group';\r\n * import { FuiButtonDirective } from '@raintonic/formaui/components/button';\r\n *\r\n * @Component({\r\n * standalone: true,\r\n * imports: [FuiButtonGroupComponent, FuiButtonDirective],\r\n * template: `\r\n * <fui-button-group>\r\n * <button fuiButton variant=\"secondary\">Option 1</button>\r\n * <button fuiButton variant=\"secondary\">Option 2</button>\r\n * <button fuiButton variant=\"secondary\">Option 3</button>\r\n * </fui-button-group>\r\n * `\r\n * })\r\n * export class MyComponent {}\r\n * ```\r\n */\r\n@Component({\r\n selector: 'fui-button-group',\r\n standalone: true,\r\n template: `<ng-content></ng-content>`,\r\n styleUrls: ['./button-group.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-button-group',\r\n role: 'group',\r\n '[attr.aria-label]': 'ariaLabel()',\r\n },\r\n})\r\nexport class FuiButtonGroupComponent implements AfterContentInit {\r\n /**\r\n * Accessible label for the button group\r\n */\r\n readonly ariaLabel = input<string | undefined>(undefined);\r\n\r\n private readonly _elementRef = inject(ElementRef);\r\n private readonly _renderer = inject(Renderer2);\r\n\r\n constructor() {\r\n // Set up an effect to handle dynamic button changes\r\n effect(() => {\r\n this._updateButtonStyles();\r\n });\r\n }\r\n\r\n ngAfterContentInit(): void {\r\n this._updateButtonStyles();\r\n }\r\n\r\n private _updateButtonStyles(): void {\r\n const hostElement = this._elementRef.nativeElement as HTMLElement;\r\n const buttons = hostElement.querySelectorAll('[fuiButton]');\r\n\r\n buttons.forEach((button, index) => {\r\n // Remove all position classes first\r\n this._renderer.removeClass(button, 'fui-button-group__button--first');\r\n this._renderer.removeClass(button, 'fui-button-group__button--middle');\r\n this._renderer.removeClass(button, 'fui-button-group__button--last');\r\n this._renderer.removeClass(button, 'fui-button-group__button--only');\r\n\r\n // Add appropriate class based on position\r\n if (buttons.length === 1) {\r\n this._renderer.addClass(button, 'fui-button-group__button--only');\r\n } else if (index === 0) {\r\n this._renderer.addClass(button, 'fui-button-group__button--first');\r\n } else if (index === buttons.length - 1) {\r\n this._renderer.addClass(button, 'fui-button-group__button--last');\r\n } else {\r\n this._renderer.addClass(button, 'fui-button-group__button--middle');\r\n }\r\n });\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAYA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCG;MAcU,uBAAuB,CAAA;AAClC;;AAEG;AACM,IAAA,SAAS,GAAG,KAAK,CAAqB,SAAS,gFAAC;AAExC,IAAA,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAChC,IAAA,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;AAE9C,IAAA,WAAA,GAAA;;QAEE,MAAM,CAAC,MAAK;YACV,IAAI,CAAC,mBAAmB,EAAE;AAC5B,QAAA,CAAC,CAAC;IACJ;IAEA,kBAAkB,GAAA;QAChB,IAAI,CAAC,mBAAmB,EAAE;IAC5B;IAEQ,mBAAmB,GAAA;AACzB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,aAA4B;QACjE,MAAM,OAAO,GAAG,WAAW,CAAC,gBAAgB,CAAC,aAAa,CAAC;QAE3D,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,KAAK,KAAI;;YAEhC,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,iCAAiC,CAAC;YACrE,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,kCAAkC,CAAC;YACtE,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,gCAAgC,CAAC;YACpE,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,gCAAgC,CAAC;;AAGpE,YAAA,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,EAAE;gBACxB,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,gCAAgC,CAAC;YACnE;AAAO,iBAAA,IAAI,KAAK,KAAK,CAAC,EAAE;gBACtB,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,iCAAiC,CAAC;YACpE;iBAAO,IAAI,KAAK,KAAK,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;gBACvC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,gCAAgC,CAAC;YACnE;iBAAO;gBACL,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,kCAAkC,CAAC;YACrE;AACF,QAAA,CAAC,CAAC;IACJ;uGA1CW,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAvB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,6VAVxB,CAAA,yBAAA,CAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,ynBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAU1B,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAbnC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,EAAA,UAAA,EAChB,IAAI,EAAA,QAAA,EACN,CAAA,yBAAA,CAA2B,EAAA,eAAA,EAEpB,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,KAAK,EAAE,kBAAkB;AACzB,wBAAA,IAAI,EAAE,OAAO;AACb,wBAAA,mBAAmB,EAAE,aAAa;AACnC,qBAAA,EAAA,MAAA,EAAA,CAAA,ynBAAA,CAAA,EAAA;;;ACjEH;;AAEG;;;;"}
|
|
@@ -1,14 +1,7 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { input, booleanAttribute, computed, inject, ElementRef, Renderer2, effect, HostListener, Directive } from '@angular/core';
|
|
3
3
|
|
|
4
|
-
const FUI_BUTTON_VARIANTS = [
|
|
5
|
-
'primary',
|
|
6
|
-
'secondary',
|
|
7
|
-
'tertiary',
|
|
8
|
-
'tertiary-violet',
|
|
9
|
-
'link',
|
|
10
|
-
'destructive',
|
|
11
|
-
];
|
|
4
|
+
const FUI_BUTTON_VARIANTS = ['primary', 'accent', 'outline', 'tertiary', 'link', 'destructive'];
|
|
12
5
|
const FUI_BUTTON_SIZES = ['sm', 'md', 'lg', 'xl', '2xl'];
|
|
13
6
|
/**
|
|
14
7
|
* # Button Directive
|
|
@@ -17,7 +10,7 @@ const FUI_BUTTON_SIZES = ['sm', 'md', 'lg', 'xl', '2xl'];
|
|
|
17
10
|
* Follows Carbon Design System patterns with full accessibility support.
|
|
18
11
|
*
|
|
19
12
|
* ## Features
|
|
20
|
-
* - Multiple variants
|
|
13
|
+
* - Multiple variants
|
|
21
14
|
* - Five sizes: sm, md, lg, xl, 2xl
|
|
22
15
|
* - Full accessibility support (ARIA attributes, keyboard navigation)
|
|
23
16
|
* - Loading and disabled states
|
|
@@ -165,23 +158,25 @@ class FuiButtonDirective {
|
|
|
165
158
|
return;
|
|
166
159
|
}
|
|
167
160
|
// Only synthesize activation for anchors
|
|
168
|
-
if (this.isAnchor) {
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
161
|
+
if (!this.isAnchor) {
|
|
162
|
+
return;
|
|
163
|
+
}
|
|
164
|
+
const ke = event;
|
|
165
|
+
if (ke.key === 'Enter') {
|
|
166
|
+
event.preventDefault();
|
|
167
|
+
this._elementRef.nativeElement.click();
|
|
168
|
+
}
|
|
169
|
+
else if (ke.key === ' ') {
|
|
170
|
+
// prevent page scroll; activation handled on keyup
|
|
171
|
+
event.preventDefault();
|
|
178
172
|
}
|
|
179
173
|
}
|
|
180
174
|
onKeyup(event) {
|
|
181
175
|
if (this.disabled() || this.loading()) {
|
|
182
176
|
return;
|
|
183
177
|
}
|
|
184
|
-
|
|
178
|
+
const isSpaceKey = event.key === ' ';
|
|
179
|
+
if (this.isAnchor && isSpaceKey) {
|
|
185
180
|
this._elementRef.nativeElement.click();
|
|
186
181
|
}
|
|
187
182
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"raintonic-formaui-components-button.mjs","sources":["../../../lib/components/button/button.directive.ts","../../../lib/components/button/raintonic-formaui-components-button.ts"],"sourcesContent":["import {\r\n Directive,\r\n ElementRef,\r\n Renderer2,\r\n input,\r\n computed,\r\n effect,\r\n HostListener,\r\n inject,\r\n Signal,\r\n AfterViewInit,\r\n booleanAttribute,\r\n} from '@angular/core';\r\n\r\n/**\r\n * Available button variants following Carbon Design System patterns\r\n */\r\nexport type ButtonVariant =\r\n | 'primary'\r\n | 'secondary'\r\n | 'tertiary'\r\n | 'tertiary-violet'\r\n | 'link'\r\n | 'destructive';\r\n\r\n/**\r\n * Available button sizes\r\n */\r\nexport type ButtonSize = 'sm' | 'md' | 'lg' | 'xl' | '2xl';\r\n\r\nexport const FUI_BUTTON_VARIANTS = [\r\n 'primary',\r\n 'secondary',\r\n 'tertiary',\r\n 'tertiary-violet',\r\n 'link',\r\n 'destructive',\r\n] as const;\r\nexport const FUI_BUTTON_SIZES = ['sm', 'md', 'lg', 'xl', '2xl'] as const;\r\n\r\nexport type ButtonType = 'button' | 'submit' | 'reset';\r\n\r\n/**\r\n * # Button Directive\r\n *\r\n * A versatile button directive that can be applied to both `<button>` and `<a>` elements.\r\n * Follows Carbon Design System patterns with full accessibility support.\r\n *\r\n * ## Features\r\n * - Multiple variants: primary, secondary, tertiary, tertiary-violet, link, destructive\r\n * - Five sizes: sm, md, lg, xl, 2xl\r\n * - Full accessibility support (ARIA attributes, keyboard navigation)\r\n * - Loading and disabled states\r\n * - Icon support with proper spacing\r\n * - Full-width option\r\n * - Works with both button and anchor elements\r\n *\r\n *\r\n * ### Link Button\r\n * ```html\r\n * <a fuiButton href=\"/dashboard\" variant=\"tertiary\">Go to Dashboard</a>\r\n * ```\r\n *\r\n * @example\r\n * ```typescript\r\n * import { FuiButtonDirective } from '@raintonic/formaui/components/button';\r\n *\r\n * @Component({\r\n * standalone: true,\r\n * imports: [FuiButtonDirective],\r\n * template: `\r\n * <button fuiButton variant=\"primary\" (click)=\"save()\">\r\n * Save Changes\r\n * </button>\r\n * `\r\n * })\r\n * export class MyComponent {\r\n * save() {\r\n * // Handle save action\r\n * }\r\n * }\r\n * ```\r\n */\r\n@Directive({\r\n selector: 'button[fuiButton], a[fuiButton]',\r\n standalone: true,\r\n host: {\r\n '[class]': 'computedClasses()',\r\n // Use attribute binding for boolean disabled; valid on <button>, ignored on <a>\r\n '[attr.disabled]': 'isButton && (disabled() || loading()) ? \"\" : null',\r\n // ARIA: present only when true\r\n '[attr.aria-disabled]': '(disabled() || loading()) ? \"true\" : null',\r\n '[attr.aria-busy]': 'loading() ? \"true\" : null',\r\n '[attr.aria-label]': 'ariaLabel()',\r\n '[attr.aria-live]': 'loading() ? \"polite\" : null',\r\n // For anchors, provide role and manage tabindex\r\n '[attr.role]': 'isAnchor ? \"button\" : null',\r\n '[attr.tabindex]': 'isAnchor && (disabled() || loading()) ? \"-1\" : null',\r\n // Optionally prevent interactions for anchors when disabled/loading\r\n '[style.pointer-events]': 'isAnchor && (disabled() || loading()) ? \"none\" : null',\r\n },\r\n})\r\nexport class FuiButtonDirective implements AfterViewInit {\r\n /**\r\n * Button variant that determines the color scheme\r\n * @default 'primary'\r\n */\r\n readonly variant = input<ButtonVariant, ButtonVariant | string>('primary', {\r\n transform: (v) => ((FUI_BUTTON_VARIANTS as readonly string[]).includes(v) ? (v as ButtonVariant) : 'primary'),\r\n });\r\n\r\n /**\r\n * Button size\r\n * @default 'md'\r\n */\r\n readonly size = input<ButtonSize, ButtonSize | string>('md', {\r\n transform: (v) => ((FUI_BUTTON_SIZES as readonly string[]).includes(v) ? (v as ButtonSize) : 'md'),\r\n });\r\n\r\n /**\r\n * Whether the button is disabled\r\n * @default false\r\n */\r\n readonly disabled = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Whether the button should take full width of its container\r\n * @default false\r\n */\r\n readonly fullWidth = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Whether the button is in loading state\r\n * @default false\r\n */\r\n readonly loading = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Whether the button contains only an icon (for proper padding)\r\n * @default false\r\n */\r\n readonly iconOnly = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Accessible label for icon-only buttons.\r\n * Required when `iconOnly` is true so screen readers can announce the button's purpose.\r\n */\r\n readonly ariaLabel = input<string | null>(null, { alias: 'aria-label' });\r\n\r\n /**\r\n * Button type for native button elements\r\n * @default 'button'\r\n */\r\n readonly type = input<ButtonType>('button');\r\n\r\n // Computed properties\r\n readonly computedClasses: Signal<string> = computed(() => {\r\n const classes: string[] = ['fui-button', `fui-button--${this.variant()}`, `fui-button--${this.size()}`];\r\n\r\n if (this.disabled()) {\r\n classes.push('fui-button--disabled');\r\n }\r\n\r\n if (this.fullWidth()) {\r\n classes.push('fui-button--full-width');\r\n }\r\n\r\n if (this.loading()) {\r\n classes.push('fui-button--loading');\r\n }\r\n\r\n if (this.iconOnly()) {\r\n classes.push('fui-button--icon-only');\r\n }\r\n\r\n return classes.join(' ');\r\n });\r\n\r\n private readonly _elementRef: ElementRef<HTMLElement> = inject(ElementRef);\r\n private readonly _renderer: Renderer2 = inject(Renderer2);\r\n private _leadingSlot: HTMLElement | null = null;\r\n\r\n // Element kind guards\r\n get isButton(): boolean {\r\n return this._elementRef.nativeElement.tagName.toLowerCase() === 'button';\r\n }\r\n get isAnchor(): boolean {\r\n return this._elementRef.nativeElement.tagName.toLowerCase() === 'a';\r\n }\r\n\r\n constructor() {\r\n // Manage loading spinner and anchor href disabled-state together\r\n effect(() => {\r\n if (this.loading()) {\r\n this._fillLeadingSlot();\r\n } else {\r\n this._clearLeadingSlot();\r\n }\r\n this._syncAnchorHrefDisabledState();\r\n });\r\n\r\n // Keep the native `type` attribute in sync with the `type` input signal.\r\n // No-op for anchor elements (guarded by `this.isButton`).\r\n effect(() => {\r\n if (this.isButton) {\r\n this._renderer.setAttribute(this._elementRef.nativeElement, 'type', this.type());\r\n }\r\n });\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n const el = this._elementRef.nativeElement;\r\n // Create the permanent leading slot (spinner target) as the first child.\r\n const slot = this._renderer.createElement('span');\r\n this._renderer.addClass(slot, 'fui-button__leading');\r\n this._renderer.setAttribute(slot, 'aria-hidden', 'true');\r\n this._renderer.insertBefore(el, slot, el.firstChild);\r\n this._leadingSlot = slot;\r\n // If loading was true before view init, fill the slot now.\r\n if (this.loading()) {\r\n this._fillLeadingSlot();\r\n }\r\n }\r\n\r\n @HostListener('click', ['$event'])\r\n onClick(event: Event): void {\r\n if (this.disabled() || this.loading()) {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n return;\r\n }\r\n this._spawnRipple(event as MouseEvent);\r\n }\r\n\r\n @HostListener('keydown', ['$event'])\r\n onKeydown(event: Event): void {\r\n if (this.disabled() || this.loading()) {\r\n event.preventDefault();\r\n return;\r\n }\r\n\r\n // Only synthesize activation for anchors\r\n if (this.isAnchor) {\r\n const ke = event as KeyboardEvent;\r\n if (ke.key === 'Enter') {\r\n event.preventDefault();\r\n this._elementRef.nativeElement.click();\r\n } else if (ke.key === ' ') {\r\n // prevent page scroll; activation handled on keyup\r\n event.preventDefault();\r\n }\r\n }\r\n }\r\n\r\n @HostListener('keyup', ['$event'])\r\n onKeyup(event: Event): void {\r\n if (this.disabled() || this.loading()) {\r\n return;\r\n }\r\n if (this.isAnchor && (event as KeyboardEvent).key === ' ') {\r\n this._elementRef.nativeElement.click();\r\n }\r\n }\r\n\r\n private _fillLeadingSlot(): void {\r\n if (!this._leadingSlot) return;\r\n // Idempotence guard\r\n if (this._leadingSlot.querySelector('.fui-button__spinner')) return;\r\n\r\n const spinner = this._renderer.createElement('fui-icon');\r\n this._renderer.addClass(spinner, 'fui-button__spinner');\r\n this._renderer.setAttribute(spinner, 'aria-hidden', 'true');\r\n\r\n const spinnerIcon = this._renderer.createElement('span');\r\n this._renderer.addClass(spinnerIcon, 'fui-button__spinner-icon');\r\n this._renderer.appendChild(spinner, spinnerIcon);\r\n\r\n this._renderer.appendChild(this._leadingSlot, spinner);\r\n }\r\n\r\n private _clearLeadingSlot(): void {\r\n if (!this._leadingSlot) return;\r\n const spinner = this._leadingSlot.querySelector('.fui-button__spinner');\r\n if (spinner) {\r\n this._renderer.removeChild(this._leadingSlot, spinner);\r\n }\r\n }\r\n\r\n private _spawnRipple(event: MouseEvent): void {\r\n const host = this._elementRef.nativeElement;\r\n const rect = host.getBoundingClientRect();\r\n // Diameter covers the farthest corner from the click point\r\n const size = Math.max(rect.width, rect.height) * 2;\r\n // Fallback to center for keyboard-synthesized clicks (clientX/Y === 0)\r\n const hasCoords = event.clientX !== 0 || event.clientY !== 0;\r\n const x = (hasCoords ? event.clientX - rect.left : rect.width / 2) - size / 2;\r\n const y = (hasCoords ? event.clientY - rect.top : rect.height / 2) - size / 2;\r\n\r\n const ripple = this._renderer.createElement('span') as HTMLElement;\r\n this._renderer.addClass(ripple, 'fui-button__ripple');\r\n this._renderer.setAttribute(ripple, 'aria-hidden', 'true');\r\n this._renderer.setStyle(ripple, 'width', `${size}px`);\r\n this._renderer.setStyle(ripple, 'height', `${size}px`);\r\n this._renderer.setStyle(ripple, 'left', `${x}px`);\r\n this._renderer.setStyle(ripple, 'top', `${y}px`);\r\n\r\n ripple.addEventListener('animationend', () => {\r\n this._renderer.removeChild(host, ripple);\r\n }, { once: true });\r\n\r\n this._renderer.appendChild(host, ripple);\r\n }\r\n\r\n private _syncAnchorHrefDisabledState(): void {\r\n const el = this._elementRef.nativeElement as HTMLElement & { getAttribute(name: string): string | null };\r\n if (!this.isAnchor) return;\r\n const disabledLike = this.disabled() || this.loading();\r\n const stored = el.getAttribute('data-fuiStoredHref');\r\n const href = el.getAttribute('href');\r\n\r\n if (disabledLike && href) {\r\n this._renderer.setAttribute(el, 'data-fuiStoredHref', href);\r\n this._renderer.removeAttribute(el, 'href');\r\n } else if (!disabledLike && !href && stored) {\r\n this._renderer.setAttribute(el, 'href', stored);\r\n this._renderer.removeAttribute(el, 'data-fuiStoredHref');\r\n }\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"raintonic-formaui-components-button.mjs","sources":["../../../lib/components/button/button.directive.ts","../../../lib/components/button/raintonic-formaui-components-button.ts"],"sourcesContent":["import {\r\n Directive,\r\n ElementRef,\r\n Renderer2,\r\n input,\r\n computed,\r\n effect,\r\n HostListener,\r\n inject,\r\n Signal,\r\n AfterViewInit,\r\n booleanAttribute,\r\n} from '@angular/core';\r\n\r\nexport type ButtonSize = 'sm' | 'md' | 'lg' | 'xl' | '2xl';\r\n\r\nexport const FUI_BUTTON_VARIANTS = ['primary', 'accent', 'outline', 'tertiary', 'link', 'destructive'] as const;\r\n\r\nexport type ButtonVariant = (typeof FUI_BUTTON_VARIANTS)[number];\r\n\r\nexport const FUI_BUTTON_SIZES = ['sm', 'md', 'lg', 'xl', '2xl'] as const;\r\n\r\nexport type ButtonType = 'button' | 'submit' | 'reset';\r\n\r\n/**\r\n * # Button Directive\r\n *\r\n * A versatile button directive that can be applied to both `<button>` and `<a>` elements.\r\n * Follows Carbon Design System patterns with full accessibility support.\r\n *\r\n * ## Features\r\n * - Multiple variants\r\n * - Five sizes: sm, md, lg, xl, 2xl\r\n * - Full accessibility support (ARIA attributes, keyboard navigation)\r\n * - Loading and disabled states\r\n * - Icon support with proper spacing\r\n * - Full-width option\r\n * - Works with both button and anchor elements\r\n *\r\n *\r\n * ### Link Button\r\n * ```html\r\n * <a fuiButton href=\"/dashboard\" variant=\"tertiary\">Go to Dashboard</a>\r\n * ```\r\n *\r\n * @example\r\n * ```typescript\r\n * import { FuiButtonDirective } from '@raintonic/formaui/components/button';\r\n *\r\n * @Component({\r\n * standalone: true,\r\n * imports: [FuiButtonDirective],\r\n * template: `\r\n * <button fuiButton variant=\"primary\" (click)=\"save()\">\r\n * Save Changes\r\n * </button>\r\n * `\r\n * })\r\n * export class MyComponent {\r\n * save() {\r\n * // Handle save action\r\n * }\r\n * }\r\n * ```\r\n */\r\n@Directive({\r\n selector: 'button[fuiButton], a[fuiButton]',\r\n standalone: true,\r\n host: {\r\n '[class]': 'computedClasses()',\r\n // Use attribute binding for boolean disabled; valid on <button>, ignored on <a>\r\n '[attr.disabled]': 'isButton && (disabled() || loading()) ? \"\" : null',\r\n // ARIA: present only when true\r\n '[attr.aria-disabled]': '(disabled() || loading()) ? \"true\" : null',\r\n '[attr.aria-busy]': 'loading() ? \"true\" : null',\r\n '[attr.aria-label]': 'ariaLabel()',\r\n '[attr.aria-live]': 'loading() ? \"polite\" : null',\r\n // For anchors, provide role and manage tabindex\r\n '[attr.role]': 'isAnchor ? \"button\" : null',\r\n '[attr.tabindex]': 'isAnchor && (disabled() || loading()) ? \"-1\" : null',\r\n // Optionally prevent interactions for anchors when disabled/loading\r\n '[style.pointer-events]': 'isAnchor && (disabled() || loading()) ? \"none\" : null',\r\n },\r\n})\r\nexport class FuiButtonDirective implements AfterViewInit {\r\n /**\r\n * Button variant that determines the color scheme\r\n * @default 'primary'\r\n */\r\n readonly variant = input<ButtonVariant, ButtonVariant | string>('primary', {\r\n transform: (v) => ((FUI_BUTTON_VARIANTS as readonly string[]).includes(v) ? (v as ButtonVariant) : 'primary'),\r\n });\r\n\r\n /**\r\n * Button size\r\n * @default 'md'\r\n */\r\n readonly size = input<ButtonSize, ButtonSize | string>('md', {\r\n transform: (v) => ((FUI_BUTTON_SIZES as readonly string[]).includes(v) ? (v as ButtonSize) : 'md'),\r\n });\r\n\r\n /**\r\n * Whether the button is disabled\r\n * @default false\r\n */\r\n readonly disabled = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Whether the button should take full width of its container\r\n * @default false\r\n */\r\n readonly fullWidth = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Whether the button is in loading state\r\n * @default false\r\n */\r\n readonly loading = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Whether the button contains only an icon (for proper padding)\r\n * @default false\r\n */\r\n readonly iconOnly = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Accessible label for icon-only buttons.\r\n * Required when `iconOnly` is true so screen readers can announce the button's purpose.\r\n */\r\n readonly ariaLabel = input<string | null>(null, { alias: 'aria-label' });\r\n\r\n /**\r\n * Button type for native button elements\r\n * @default 'button'\r\n */\r\n readonly type = input<ButtonType>('button');\r\n\r\n // Computed properties\r\n readonly computedClasses: Signal<string> = computed(() => {\r\n const classes: string[] = ['fui-button', `fui-button--${this.variant()}`, `fui-button--${this.size()}`];\r\n\r\n if (this.disabled()) {\r\n classes.push('fui-button--disabled');\r\n }\r\n\r\n if (this.fullWidth()) {\r\n classes.push('fui-button--full-width');\r\n }\r\n\r\n if (this.loading()) {\r\n classes.push('fui-button--loading');\r\n }\r\n\r\n if (this.iconOnly()) {\r\n classes.push('fui-button--icon-only');\r\n }\r\n\r\n return classes.join(' ');\r\n });\r\n\r\n private readonly _elementRef: ElementRef<HTMLElement> = inject(ElementRef);\r\n private readonly _renderer: Renderer2 = inject(Renderer2);\r\n private _leadingSlot: HTMLElement | null = null;\r\n\r\n // Element kind guards\r\n get isButton(): boolean {\r\n return this._elementRef.nativeElement.tagName.toLowerCase() === 'button';\r\n }\r\n get isAnchor(): boolean {\r\n return this._elementRef.nativeElement.tagName.toLowerCase() === 'a';\r\n }\r\n\r\n constructor() {\r\n // Manage loading spinner and anchor href disabled-state together\r\n effect(() => {\r\n if (this.loading()) {\r\n this._fillLeadingSlot();\r\n } else {\r\n this._clearLeadingSlot();\r\n }\r\n this._syncAnchorHrefDisabledState();\r\n });\r\n\r\n // Keep the native `type` attribute in sync with the `type` input signal.\r\n // No-op for anchor elements (guarded by `this.isButton`).\r\n effect(() => {\r\n if (this.isButton) {\r\n this._renderer.setAttribute(this._elementRef.nativeElement, 'type', this.type());\r\n }\r\n });\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n const el = this._elementRef.nativeElement;\r\n // Create the permanent leading slot (spinner target) as the first child.\r\n const slot = this._renderer.createElement('span');\r\n this._renderer.addClass(slot, 'fui-button__leading');\r\n this._renderer.setAttribute(slot, 'aria-hidden', 'true');\r\n this._renderer.insertBefore(el, slot, el.firstChild);\r\n this._leadingSlot = slot;\r\n // If loading was true before view init, fill the slot now.\r\n if (this.loading()) {\r\n this._fillLeadingSlot();\r\n }\r\n }\r\n\r\n @HostListener('click', ['$event'])\r\n onClick(event: Event): void {\r\n if (this.disabled() || this.loading()) {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n return;\r\n }\r\n this._spawnRipple(event as MouseEvent);\r\n }\r\n\r\n @HostListener('keydown', ['$event'])\r\n onKeydown(event: Event): void {\r\n if (this.disabled() || this.loading()) {\r\n event.preventDefault();\r\n return;\r\n }\r\n\r\n // Only synthesize activation for anchors\r\n if (!this.isAnchor) {\r\n return;\r\n }\r\n const ke = event as KeyboardEvent;\r\n if (ke.key === 'Enter') {\r\n event.preventDefault();\r\n this._elementRef.nativeElement.click();\r\n } else if (ke.key === ' ') {\r\n // prevent page scroll; activation handled on keyup\r\n event.preventDefault();\r\n }\r\n }\r\n\r\n @HostListener('keyup', ['$event'])\r\n onKeyup(event: Event): void {\r\n if (this.disabled() || this.loading()) {\r\n return;\r\n }\r\n const isSpaceKey = (event as KeyboardEvent).key === ' ';\r\n if (this.isAnchor && isSpaceKey) {\r\n this._elementRef.nativeElement.click();\r\n }\r\n }\r\n\r\n private _fillLeadingSlot(): void {\r\n if (!this._leadingSlot) return;\r\n // Idempotence guard\r\n if (this._leadingSlot.querySelector('.fui-button__spinner')) return;\r\n\r\n const spinner = this._renderer.createElement('fui-icon');\r\n this._renderer.addClass(spinner, 'fui-button__spinner');\r\n this._renderer.setAttribute(spinner, 'aria-hidden', 'true');\r\n\r\n const spinnerIcon = this._renderer.createElement('span');\r\n this._renderer.addClass(spinnerIcon, 'fui-button__spinner-icon');\r\n this._renderer.appendChild(spinner, spinnerIcon);\r\n\r\n this._renderer.appendChild(this._leadingSlot, spinner);\r\n }\r\n\r\n private _clearLeadingSlot(): void {\r\n if (!this._leadingSlot) return;\r\n const spinner = this._leadingSlot.querySelector('.fui-button__spinner');\r\n if (spinner) {\r\n this._renderer.removeChild(this._leadingSlot, spinner);\r\n }\r\n }\r\n\r\n private _spawnRipple(event: MouseEvent): void {\r\n const host = this._elementRef.nativeElement;\r\n const rect = host.getBoundingClientRect();\r\n // Diameter covers the farthest corner from the click point\r\n const size = Math.max(rect.width, rect.height) * 2;\r\n // Fallback to center for keyboard-synthesized clicks (clientX/Y === 0)\r\n const hasCoords = event.clientX !== 0 || event.clientY !== 0;\r\n const x = (hasCoords ? event.clientX - rect.left : rect.width / 2) - size / 2;\r\n const y = (hasCoords ? event.clientY - rect.top : rect.height / 2) - size / 2;\r\n\r\n const ripple = this._renderer.createElement('span') as HTMLElement;\r\n this._renderer.addClass(ripple, 'fui-button__ripple');\r\n this._renderer.setAttribute(ripple, 'aria-hidden', 'true');\r\n this._renderer.setStyle(ripple, 'width', `${size}px`);\r\n this._renderer.setStyle(ripple, 'height', `${size}px`);\r\n this._renderer.setStyle(ripple, 'left', `${x}px`);\r\n this._renderer.setStyle(ripple, 'top', `${y}px`);\r\n\r\n ripple.addEventListener(\r\n 'animationend',\r\n () => {\r\n this._renderer.removeChild(host, ripple);\r\n },\r\n { once: true },\r\n );\r\n\r\n this._renderer.appendChild(host, ripple);\r\n }\r\n\r\n private _syncAnchorHrefDisabledState(): void {\r\n const el = this._elementRef.nativeElement as HTMLElement & { getAttribute(name: string): string | null };\r\n if (!this.isAnchor) return;\r\n const disabledLike = this.disabled() || this.loading();\r\n const stored = el.getAttribute('data-fuiStoredHref');\r\n const href = el.getAttribute('href');\r\n\r\n if (disabledLike && href) {\r\n this._renderer.setAttribute(el, 'data-fuiStoredHref', href);\r\n this._renderer.removeAttribute(el, 'href');\r\n } else if (!disabledLike && !href && stored) {\r\n this._renderer.setAttribute(el, 'href', stored);\r\n this._renderer.removeAttribute(el, 'data-fuiStoredHref');\r\n }\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAgBO,MAAM,mBAAmB,GAAG,CAAC,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,aAAa;AAI9F,MAAM,gBAAgB,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK;AAI9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCG;MAoBU,kBAAkB,CAAA;AAC7B;;;AAGG;AACM,IAAA,OAAO,GAAG,KAAK,CAAwC,SAAS,EAAA,EAAA,IAAA,SAAA,GAAA,EAAA,SAAA,EAAA,SAAA,EAAA,8BAAA,EAAA,CAAA,EACvE,SAAS,EAAE,CAAC,CAAC,MAAO,mBAAyC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAI,CAAmB,GAAG,SAAS,CAAC,GAC7G;AAEF;;;AAGG;AACM,IAAA,IAAI,GAAG,KAAK,CAAkC,IAAI,EAAA,EAAA,IAAA,SAAA,GAAA,EAAA,SAAA,EAAA,MAAA,EAAA,8BAAA,EAAA,CAAA,EACzD,SAAS,EAAE,CAAC,CAAC,MAAO,gBAAsC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAI,CAAgB,GAAG,IAAI,CAAC,GAClG;AAEF;;;AAGG;IACM,QAAQ,GAAG,KAAK,CAAmB,KAAK,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEnF;;;AAGG;IACM,SAAS,GAAG,KAAK,CAAmB,KAAK,iFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEpF;;;AAGG;IACM,OAAO,GAAG,KAAK,CAAmB,KAAK,+EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAElF;;;AAGG;IACM,QAAQ,GAAG,KAAK,CAAmB,KAAK,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEnF;;;AAGG;IACM,SAAS,GAAG,KAAK,CAAgB,IAAI,iFAAI,KAAK,EAAE,YAAY,EAAA,CAAG;AAExE;;;AAGG;AACM,IAAA,IAAI,GAAG,KAAK,CAAa,QAAQ,2EAAC;;AAGlC,IAAA,eAAe,GAAmB,QAAQ,CAAC,MAAK;AACvD,QAAA,MAAM,OAAO,GAAa,CAAC,YAAY,EAAE,CAAA,YAAA,EAAe,IAAI,CAAC,OAAO,EAAE,CAAA,CAAE,EAAE,eAAe,IAAI,CAAC,IAAI,EAAE,CAAA,CAAE,CAAC;AAEvG,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;AACnB,YAAA,OAAO,CAAC,IAAI,CAAC,sBAAsB,CAAC;QACtC;AAEA,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;AACpB,YAAA,OAAO,CAAC,IAAI,CAAC,wBAAwB,CAAC;QACxC;AAEA,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE;AAClB,YAAA,OAAO,CAAC,IAAI,CAAC,qBAAqB,CAAC;QACrC;AAEA,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;AACnB,YAAA,OAAO,CAAC,IAAI,CAAC,uBAAuB,CAAC;QACvC;AAEA,QAAA,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AAC1B,IAAA,CAAC,sFAAC;AAEe,IAAA,WAAW,GAA4B,MAAM,CAAC,UAAU,CAAC;AACzD,IAAA,SAAS,GAAc,MAAM,CAAC,SAAS,CAAC;IACjD,YAAY,GAAuB,IAAI;;AAG/C,IAAA,IAAI,QAAQ,GAAA;AACV,QAAA,OAAO,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,QAAQ;IAC1E;AACA,IAAA,IAAI,QAAQ,GAAA;AACV,QAAA,OAAO,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,GAAG;IACrE;AAEA,IAAA,WAAA,GAAA;;QAEE,MAAM,CAAC,MAAK;AACV,YAAA,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE;gBAClB,IAAI,CAAC,gBAAgB,EAAE;YACzB;iBAAO;gBACL,IAAI,CAAC,iBAAiB,EAAE;YAC1B;YACA,IAAI,CAAC,4BAA4B,EAAE;AACrC,QAAA,CAAC,CAAC;;;QAIF,MAAM,CAAC,MAAK;AACV,YAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,gBAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,EAAE,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;YAClF;AACF,QAAA,CAAC,CAAC;IACJ;IAEA,eAAe,GAAA;AACb,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa;;QAEzC,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,MAAM,CAAC;QACjD,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,qBAAqB,CAAC;QACpD,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,EAAE,aAAa,EAAE,MAAM,CAAC;AACxD,QAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,EAAE,IAAI,EAAE,EAAE,CAAC,UAAU,CAAC;AACpD,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;;AAExB,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE;YAClB,IAAI,CAAC,gBAAgB,EAAE;QACzB;IACF;AAGA,IAAA,OAAO,CAAC,KAAY,EAAA;QAClB,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE;YACrC,KAAK,CAAC,cAAc,EAAE;YACtB,KAAK,CAAC,eAAe,EAAE;YACvB;QACF;AACA,QAAA,IAAI,CAAC,YAAY,CAAC,KAAmB,CAAC;IACxC;AAGA,IAAA,SAAS,CAAC,KAAY,EAAA;QACpB,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE;YACrC,KAAK,CAAC,cAAc,EAAE;YACtB;QACF;;AAGA,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB;QACF;QACA,MAAM,EAAE,GAAG,KAAsB;AACjC,QAAA,IAAI,EAAE,CAAC,GAAG,KAAK,OAAO,EAAE;YACtB,KAAK,CAAC,cAAc,EAAE;AACtB,YAAA,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,KAAK,EAAE;QACxC;AAAO,aAAA,IAAI,EAAE,CAAC,GAAG,KAAK,GAAG,EAAE;;YAEzB,KAAK,CAAC,cAAc,EAAE;QACxB;IACF;AAGA,IAAA,OAAO,CAAC,KAAY,EAAA;QAClB,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE,EAAE;YACrC;QACF;AACA,QAAA,MAAM,UAAU,GAAI,KAAuB,CAAC,GAAG,KAAK,GAAG;AACvD,QAAA,IAAI,IAAI,CAAC,QAAQ,IAAI,UAAU,EAAE;AAC/B,YAAA,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,KAAK,EAAE;QACxC;IACF;IAEQ,gBAAgB,GAAA;QACtB,IAAI,CAAC,IAAI,CAAC,YAAY;YAAE;;AAExB,QAAA,IAAI,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,sBAAsB,CAAC;YAAE;QAE7D,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,UAAU,CAAC;QACxD,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,OAAO,EAAE,qBAAqB,CAAC;QACvD,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,OAAO,EAAE,aAAa,EAAE,MAAM,CAAC;QAE3D,MAAM,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,MAAM,CAAC;QACxD,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,0BAA0B,CAAC;QAChE,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,OAAO,EAAE,WAAW,CAAC;QAEhD,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,EAAE,OAAO,CAAC;IACxD;IAEQ,iBAAiB,GAAA;QACvB,IAAI,CAAC,IAAI,CAAC,YAAY;YAAE;QACxB,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,sBAAsB,CAAC;QACvE,IAAI,OAAO,EAAE;YACX,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,EAAE,OAAO,CAAC;QACxD;IACF;AAEQ,IAAA,YAAY,CAAC,KAAiB,EAAA;AACpC,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa;AAC3C,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,qBAAqB,EAAE;;AAEzC,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC;;AAElD,QAAA,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,CAAC,OAAO,KAAK,CAAC;QAC5D,MAAM,CAAC,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC,IAAI,IAAI,GAAG,CAAC;QAC7E,MAAM,CAAC,GAAG,CAAC,SAAS,GAAG,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,GAAG,CAAC;QAE7E,MAAM,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,MAAM,CAAgB;QAClE,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,oBAAoB,CAAC;QACrD,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,MAAM,EAAE,aAAa,EAAE,MAAM,CAAC;AAC1D,QAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,OAAO,EAAE,CAAA,EAAG,IAAI,CAAA,EAAA,CAAI,CAAC;AACrD,QAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,QAAQ,EAAE,CAAA,EAAG,IAAI,CAAA,EAAA,CAAI,CAAC;AACtD,QAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,MAAM,EAAE,CAAA,EAAG,CAAC,CAAA,EAAA,CAAI,CAAC;AACjD,QAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,KAAK,EAAE,CAAA,EAAG,CAAC,CAAA,EAAA,CAAI,CAAC;AAEhD,QAAA,MAAM,CAAC,gBAAgB,CACrB,cAAc,EACd,MAAK;YACH,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,EAAE,MAAM,CAAC;AAC1C,QAAA,CAAC,EACD,EAAE,IAAI,EAAE,IAAI,EAAE,CACf;QAED,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,EAAE,MAAM,CAAC;IAC1C;IAEQ,4BAA4B,GAAA;AAClC,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,aAA4E;QACxG,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE;QACpB,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE;QACtD,MAAM,MAAM,GAAG,EAAE,CAAC,YAAY,CAAC,oBAAoB,CAAC;QACpD,MAAM,IAAI,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC;AAEpC,QAAA,IAAI,YAAY,IAAI,IAAI,EAAE;YACxB,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,EAAE,oBAAoB,EAAE,IAAI,CAAC;YAC3D,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,EAAE,EAAE,MAAM,CAAC;QAC5C;aAAO,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,IAAI,MAAM,EAAE;YAC3C,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,CAAC;YAC/C,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,EAAE,EAAE,oBAAoB,CAAC;QAC1D;IACF;uGAvOW,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAlB,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iCAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,YAAA,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,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,mBAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,eAAA,EAAA,qDAAA,EAAA,oBAAA,EAAA,6CAAA,EAAA,gBAAA,EAAA,6BAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,+BAAA,EAAA,WAAA,EAAA,8BAAA,EAAA,eAAA,EAAA,uDAAA,EAAA,sBAAA,EAAA,yDAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAlB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAnB9B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,iCAAiC;AAC3C,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACJ,wBAAA,SAAS,EAAE,mBAAmB;;AAE9B,wBAAA,iBAAiB,EAAE,mDAAmD;;AAEtE,wBAAA,sBAAsB,EAAE,2CAA2C;AACnE,wBAAA,kBAAkB,EAAE,2BAA2B;AAC/C,wBAAA,mBAAmB,EAAE,aAAa;AAClC,wBAAA,kBAAkB,EAAE,6BAA6B;;AAEjD,wBAAA,aAAa,EAAE,4BAA4B;AAC3C,wBAAA,iBAAiB,EAAE,qDAAqD;;AAExE,wBAAA,wBAAwB,EAAE,uDAAuD;AAClF,qBAAA;AACF,iBAAA;;sBA2HE,YAAY;uBAAC,OAAO,EAAE,CAAC,QAAQ,CAAC;;sBAUhC,YAAY;uBAAC,SAAS,EAAE,CAAC,QAAQ,CAAC;;sBAqBlC,YAAY;uBAAC,OAAO,EAAE,CAAC,QAAQ,CAAC;;;AC7OnC;;AAEG;;;;"}
|
|
@@ -230,7 +230,7 @@ class FuiCardComponent {
|
|
|
230
230
|
return !!this.actionsCmp;
|
|
231
231
|
}
|
|
232
232
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
233
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiCardComponent, isStandalone: true, selector: "fui-card", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "keydown": "onKeyDown($event)", "click": "onClick($event)" }, properties: { "class": "computedClasses()", "attr.role": "clickable() ? \"button\" : \"region\"", "attr.tabindex": "clickable() && !disabled() ? \"0\" : null", "attr.aria-disabled": "disabled() ? \"true\" : null", "attr.aria-labelledby": "headerId" }, classAttribute: "fui-card" }, queries: [{ propertyName: "headerCmp", first: true, predicate: FuiCardHeaderComponent, descendants: true }, { propertyName: "actionsCmp", first: true, predicate: FuiCardActionsComponent, descendants: true }], ngImport: i0, template: "@if (hasHeader) {\r\n <div class=\"fui-card__header\">\r\n <ng-content select=\"fui-card-header, [rtCardHeader]\"></ng-content>\r\n </div>\r\n}\r\n\r\n<div class=\"fui-card__content\" [class.fui-card__content--no-padding]=\"padding() === 'none'\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n@if (hasActions) {\r\n <div class=\"fui-card__actions\">\r\n <ng-content select=\"fui-card-actions, [rtCardActions]\"></ng-content>\r\n </div>\r\n}\r\n", styles: [".fui-text-xs{font-size:var(--fui-font-size-01);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-text-xs);letter-spacing:.24px}.fui-text-sm{font-size:var(--fui-font-size-02);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-text-sm);letter-spacing:.56px}.fui-text-md{font-size:var(--fui-font-size-03);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-text-md)}.fui-text-lg{font-size:var(--fui-font-size-04);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-text-lg)}.fui-text-xl{font-size:var(--fui-font-size-05);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-text-xl)}.fui-display-xs{font-size:var(--fui-font-size-06);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-display-xs);letter-spacing:.48px}.fui-display-sm{font-size:var(--fui-font-size-07);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-display-sm)}.fui-display-md{font-size:var(--fui-font-size-08);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-display-md)}.fui-display-lg{font-size:var(--fui-font-size-09);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-display-lg)}.fui-display-xl{font-size:var(--fui-font-size-10);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-display-xl);letter-spacing:-1.2px}.fui-display-2xl{font-size:var(--fui-font-size-11);font-style:normal;font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-display-2xl);letter-spacing:-1.44px}.fui-code-01{font-family:var(--fui-font-family-mono);font-size:var(--fui-font-size-01);line-height:var(--fui-line-height-04)}.fui-code-02{font-family:var(--fui-font-family-mono);font-size:var(--fui-font-size-02);line-height:var(--fui-line-height-04)}.fui-font-light{font-weight:var(--fui-font-weight-light)}.fui-font-regular{font-weight:var(--fui-font-weight-regular)}.fui-font-medium{font-weight:var(--fui-font-weight-medium)}.fui-font-semibold{font-weight:var(--fui-font-weight-semibold)}.fui-font-bold{font-weight:var(--fui-font-weight-bold)}@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-card{--fui-card-bg: var(--fui-surface-00);--fui-card-border-color: var(--fui-border-color);--fui-card-header-padding: var(--fui-spacing-05) var(--fui-spacing-06);--fui-card-actions-gap: var(--fui-spacing-03);contain:layout style;display:flex;flex-direction:column;position:relative;border-radius:var(--fui-card-border-radius);background-color:var(--fui-card-bg);box-shadow:var(--fui-shadow-01);backdrop-filter:blur(8px);overflow:hidden;transition:box-shadow,transform,border-color var(--fui-duration-moderate-01) var(--fui-ease-standard) 0ms}.fui-card--elevated{box-shadow:var(--fui-card-shadow);border:none}.fui-card--elevated.fui-card--hovered:not(.fui-card--disabled){box-shadow:var(--fui-card-shadow-hover)}.fui-card--outlined{border:1px solid var(--fui-border-color)}.fui-card--outlined.fui-card--hovered:not(.fui-card--disabled){border-color:var(--fui-border-color-strong)}.fui-card--flat{box-shadow:none;border:1px solid transparent}.fui-card--clickable{cursor:pointer;transition:transform var(--fui-duration-fast-02) var(--fui-ease-standard),box-shadow var(--fui-duration-fast-02) var(--fui-ease-standard)}.fui-card--clickable:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.fui-card--clickable:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px;transition:all var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms}.fui-card--disabled{opacity:var(--fui-opacity-disabled);cursor:not-allowed}.fui-card--padding-none .fui-card__content{padding:0}.fui-card--padding-sm .fui-card__content{padding:var(--fui-spacing-04)}.fui-card--padding-md .fui-card__content{padding:var(--fui-spacing-05)}.fui-card--padding-lg .fui-card__content{padding:var(--fui-spacing-06)}.fui-card--padding-xl .fui-card__content{padding:var(--fui-spacing-07)}.fui-card__header{border-bottom:1px solid var(--fui-border-color);font-weight:var(--fui-font-weight-medium)}.fui-card__header:empty{display:none}.fui-card__content{flex:1;padding:var(--fui-card-padding)}.fui-card__content--no-padding{padding:0}.fui-card__content>:first-child{margin-top:0}.fui-card__content>:last-child{margin-bottom:0}.fui-card__actions{padding-bottom:0;display:flex;gap:var(--fui-spacing-03);align-items:center;justify-content:flex-end}.fui-card__actions:empty{display:none}.fui-card__actions--align-start{justify-content:flex-start}.fui-card__actions--align-center{justify-content:center}.fui-card__actions--align-end{justify-content:flex-end}.fui-card-header{padding:var(--fui-spacing-05) var(--fui-spacing-06);display:flex;flex-direction:column;gap:var(--fui-spacing-02)}.fui-card-header__title{color:var(--fui-text-primary);margin:0}.fui-card-header__subtitle{font-size:var(--fui-font-size-02);font-weight:var(--fui-font-weight-regular);line-height:var(--fui-line-height-02);color:var(--fui-text-secondary);margin:0}.fui-card-header__content:empty{margin-top:0}.fui-card-actions{display:flex;gap:var(--fui-spacing-03);align-items:center}.fui-card-actions--align-start{justify-content:flex-start}.fui-card-actions--align-center{justify-content:center}.fui-card-actions--align-end{justify-content:flex-end}.fui-card-actions--paddingless{padding:0}.fui-card-actions .fui-button+.fui-button{margin-left:var(--fui-spacing-03)}@media(min-width:576px){.fui-card--padding-sm .fui-card__content{padding:var(--fui-spacing-02)}.fui-card--padding-md .fui-card__content{padding:var(--fui-spacing-04)}.fui-card--padding-lg .fui-card__content{padding:var(--fui-spacing-06)}.fui-card__actions{padding:0 var(--fui-spacing-04) var(--fui-spacing-04);gap:var(--fui-spacing-02);flex-wrap:wrap}}.fui-card--horizontal{flex-direction:row}.fui-card--horizontal .fui-card__content{flex:1}.fui-card--horizontal .fui-card__actions{flex-direction:column;padding:var(--fui-spacing-05)}.fui-card__image{width:100%;height:auto;border-radius:var(--fui-card-border-radius) var(--fui-card-border-radius) 0 0}.fui-card__image:only-child{border-radius:var(--fui-card-border-radius)}.fui-card__media{position:relative;overflow:hidden;border-radius:var(--fui-card-border-radius) var(--fui-card-border-radius) 0 0}.fui-card__media img,.fui-card__media video{width:100%;height:auto;display:block}.fui-card__media:last-child{border-radius:0 0 var(--fui-card-border-radius) var(--fui-card-border-radius)}.fui-card__media:only-child{border-radius:var(--fui-card-border-radius)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
233
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiCardComponent, isStandalone: true, selector: "fui-card", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "keydown": "onKeyDown($event)", "click": "onClick($event)" }, properties: { "class": "computedClasses()", "attr.role": "clickable() ? \"button\" : \"region\"", "attr.tabindex": "clickable() && !disabled() ? \"0\" : null", "attr.aria-disabled": "disabled() ? \"true\" : null", "attr.aria-labelledby": "headerId" }, classAttribute: "fui-card" }, queries: [{ propertyName: "headerCmp", first: true, predicate: FuiCardHeaderComponent, descendants: true }, { propertyName: "actionsCmp", first: true, predicate: FuiCardActionsComponent, descendants: true }], ngImport: i0, template: "@if (hasHeader) {\r\n <div class=\"fui-card__header\">\r\n <ng-content select=\"fui-card-header, [rtCardHeader]\"></ng-content>\r\n </div>\r\n}\r\n\r\n<div class=\"fui-card__content\" [class.fui-card__content--no-padding]=\"padding() === 'none'\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n@if (hasActions) {\r\n <div class=\"fui-card__actions\">\r\n <ng-content select=\"fui-card-actions, [rtCardActions]\"></ng-content>\r\n </div>\r\n}\r\n", styles: [".fui-text-xs{font-size:var(--fui-text-sm);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal);letter-spacing:.24px}.fui-text-sm{font-size:var(--fui-text-base);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal);letter-spacing:.56px}.fui-text-md{font-size:var(--fui-text-md);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal)}.fui-text-lg{font-size:var(--fui-text-lg);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal)}.fui-text-xl{font-size:var(--fui-text-xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal)}.fui-display-xs{font-size:var(--fui-text-2xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-snug);letter-spacing:.48px}.fui-display-sm{font-size:var(--fui-text-3xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight)}.fui-display-md{font-size:var(--fui-text-4xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight)}.fui-display-lg{font-size:var(--fui-text-5xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight)}.fui-display-xl{font-size:var(--fui-text-6xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight);letter-spacing:-1.2px}.fui-display-2xl{font-size:var(--fui-text-7xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight);letter-spacing:-1.44px}.fui-code-01{font-family:var(--fui-font-mono);font-size:var(--fui-text-sm);line-height:var(--fui-leading-loose)}.fui-code-02{font-family:var(--fui-font-mono);font-size:var(--fui-text-base);line-height:var(--fui-leading-relaxed)}.fui-font-light{font-weight:var(--fui-weight-light)}.fui-font-regular{font-weight:var(--fui-weight-regular)}.fui-font-medium{font-weight:var(--fui-weight-medium)}.fui-font-semibold{font-weight:var(--fui-weight-semibold)}.fui-font-bold{font-weight:var(--fui-weight-bold)}@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-out);transition-delay:0ms}.fui-motion-fade-out{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-in);transition-delay:0ms}.fui-motion-slide-in-bottom{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition-property:transform,opacity;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-base) var(--fui-ease-out)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-card{--fui-card-bg: var(--fui-bg-default);--fui-card-border-color: var(--fui-border-default);--fui-card-header-padding: var(--fui-spacing-7) var(--fui-spacing-9);--fui-card-actions-gap: var(--fui-spacing-4);contain:layout style;display:flex;flex-direction:column;position:relative;border-radius:var(--fui-card-border-radius);background-color:var(--fui-card-bg);box-shadow:var(--fui-shadow-xs);backdrop-filter:blur(8px);overflow:hidden;transition-property:box-shadow,transform,border-color;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-in-out);transition-delay:0ms}.fui-card--elevated{box-shadow:var(--fui-card-shadow);border:none}.fui-card--elevated.fui-card--hovered:not(.fui-card--disabled){box-shadow:var(--fui-card-shadow-hover)}.fui-card--outlined{border:var(--fui-border-width-sm) solid var(--fui-border-default)}.fui-card--outlined.fui-card--hovered:not(.fui-card--disabled){border-color:var(--fui-border-strong)}.fui-card--flat{box-shadow:none;border:var(--fui-border-width-sm) solid transparent}.fui-card--clickable{cursor:pointer;transition:transform var(--fui-duration-fast) var(--fui-ease-in-out),box-shadow var(--fui-duration-fast) var(--fui-ease-in-out)}.fui-card--clickable:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.fui-card--clickable:focus-visible{outline:2px solid var(--fui-primary-10);transition-property:all;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-in-out);transition-delay:0ms}.fui-card--disabled{opacity:var(--fui-state-disabled-opacity);cursor:not-allowed}.fui-card--padding-none .fui-card__content{padding:0}.fui-card--padding-sm .fui-card__content{padding:var(--fui-spacing-6)}.fui-card--padding-md .fui-card__content{padding:var(--fui-spacing-7)}.fui-card--padding-lg .fui-card__content{padding:var(--fui-spacing-9)}.fui-card--padding-xl .fui-card__content{padding:var(--fui-spacing-11)}.fui-card__header{border-bottom:var(--fui-border-width-sm) solid var(--fui-border-default);font-weight:var(--fui-weight-medium)}.fui-card__header:empty{display:none}.fui-card__content{flex:1;padding:var(--fui-card-padding)}.fui-card__content--no-padding{padding:0}.fui-card__content>:first-child{margin-top:0}.fui-card__content>:last-child{margin-bottom:0}.fui-card__actions{padding-bottom:0;display:flex;gap:var(--fui-spacing-4);align-items:center;justify-content:flex-end}.fui-card__actions:empty{display:none}.fui-card__actions--align-start{justify-content:flex-start}.fui-card__actions--align-center{justify-content:center}.fui-card__actions--align-end{justify-content:flex-end}.fui-card-header{padding:var(--fui-spacing-7) var(--fui-spacing-9);display:flex;flex-direction:column;gap:var(--fui-spacing-2)}.fui-card-header__title{color:var(--fui-text-primary);margin:0}.fui-card-header__subtitle{font-size:var(--fui-text-base);font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal);color:var(--fui-text-secondary);margin:0}.fui-card-header__content:empty{margin-top:0}.fui-card-actions{display:flex;gap:var(--fui-spacing-4);align-items:center}.fui-card-actions--align-start{justify-content:flex-start}.fui-card-actions--align-center{justify-content:center}.fui-card-actions--align-end{justify-content:flex-end}.fui-card-actions--paddingless{padding:0}.fui-card-actions .fui-button+.fui-button{margin-left:var(--fui-spacing-4)}@media(min-width:640px){.fui-card--padding-sm .fui-card__content{padding:var(--fui-spacing-2)}.fui-card--padding-md .fui-card__content{padding:var(--fui-spacing-6)}.fui-card--padding-lg .fui-card__content{padding:var(--fui-spacing-9)}.fui-card__actions{padding:0 var(--fui-spacing-6) var(--fui-spacing-6);gap:var(--fui-spacing-2);flex-wrap:wrap}}.fui-card--horizontal{flex-direction:row}.fui-card--horizontal .fui-card__content{flex:1}.fui-card--horizontal .fui-card__actions{flex-direction:column;padding:var(--fui-spacing-7)}.fui-card__image{width:100%;height:auto;border-radius:var(--fui-card-border-radius) var(--fui-card-border-radius) 0 0}.fui-card__image:only-child{border-radius:var(--fui-card-border-radius)}.fui-card__media{position:relative;overflow:hidden;border-radius:var(--fui-card-border-radius) var(--fui-card-border-radius) 0 0}.fui-card__media img,.fui-card__media video{width:100%;height:auto;display:block}.fui-card__media:last-child{border-radius:0 0 var(--fui-card-border-radius) var(--fui-card-border-radius)}.fui-card__media:only-child{border-radius:var(--fui-card-border-radius)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
234
234
|
}
|
|
235
235
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiCardComponent, decorators: [{
|
|
236
236
|
type: Component,
|
|
@@ -241,7 +241,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
|
|
|
241
241
|
'[attr.tabindex]': 'clickable() && !disabled() ? "0" : null',
|
|
242
242
|
'[attr.aria-disabled]': 'disabled() ? "true" : null',
|
|
243
243
|
'[attr.aria-labelledby]': 'headerId',
|
|
244
|
-
}, template: "@if (hasHeader) {\r\n <div class=\"fui-card__header\">\r\n <ng-content select=\"fui-card-header, [rtCardHeader]\"></ng-content>\r\n </div>\r\n}\r\n\r\n<div class=\"fui-card__content\" [class.fui-card__content--no-padding]=\"padding() === 'none'\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n@if (hasActions) {\r\n <div class=\"fui-card__actions\">\r\n <ng-content select=\"fui-card-actions, [rtCardActions]\"></ng-content>\r\n </div>\r\n}\r\n", styles: [".fui-text-xs{font-size:var(--fui-
|
|
244
|
+
}, template: "@if (hasHeader) {\r\n <div class=\"fui-card__header\">\r\n <ng-content select=\"fui-card-header, [rtCardHeader]\"></ng-content>\r\n </div>\r\n}\r\n\r\n<div class=\"fui-card__content\" [class.fui-card__content--no-padding]=\"padding() === 'none'\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n@if (hasActions) {\r\n <div class=\"fui-card__actions\">\r\n <ng-content select=\"fui-card-actions, [rtCardActions]\"></ng-content>\r\n </div>\r\n}\r\n", styles: [".fui-text-xs{font-size:var(--fui-text-sm);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal);letter-spacing:.24px}.fui-text-sm{font-size:var(--fui-text-base);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal);letter-spacing:.56px}.fui-text-md{font-size:var(--fui-text-md);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal)}.fui-text-lg{font-size:var(--fui-text-lg);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal)}.fui-text-xl{font-size:var(--fui-text-xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal)}.fui-display-xs{font-size:var(--fui-text-2xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-snug);letter-spacing:.48px}.fui-display-sm{font-size:var(--fui-text-3xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight)}.fui-display-md{font-size:var(--fui-text-4xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight)}.fui-display-lg{font-size:var(--fui-text-5xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight)}.fui-display-xl{font-size:var(--fui-text-6xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight);letter-spacing:-1.2px}.fui-display-2xl{font-size:var(--fui-text-7xl);font-style:normal;font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-tight);letter-spacing:-1.44px}.fui-code-01{font-family:var(--fui-font-mono);font-size:var(--fui-text-sm);line-height:var(--fui-leading-loose)}.fui-code-02{font-family:var(--fui-font-mono);font-size:var(--fui-text-base);line-height:var(--fui-leading-relaxed)}.fui-font-light{font-weight:var(--fui-weight-light)}.fui-font-regular{font-weight:var(--fui-weight-regular)}.fui-font-medium{font-weight:var(--fui-weight-medium)}.fui-font-semibold{font-weight:var(--fui-weight-semibold)}.fui-font-bold{font-weight:var(--fui-weight-bold)}@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-out);transition-delay:0ms}.fui-motion-fade-out{transition-property:opacity;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-in);transition-delay:0ms}.fui-motion-slide-in-bottom{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition-property:transform;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition-property:transform,opacity;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-out);transition-delay:0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-base) var(--fui-ease-out)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-card{--fui-card-bg: var(--fui-bg-default);--fui-card-border-color: var(--fui-border-default);--fui-card-header-padding: var(--fui-spacing-7) var(--fui-spacing-9);--fui-card-actions-gap: var(--fui-spacing-4);contain:layout style;display:flex;flex-direction:column;position:relative;border-radius:var(--fui-card-border-radius);background-color:var(--fui-card-bg);box-shadow:var(--fui-shadow-xs);backdrop-filter:blur(8px);overflow:hidden;transition-property:box-shadow,transform,border-color;transition-duration:var(--fui-duration-base);transition-timing-function:var(--fui-ease-in-out);transition-delay:0ms}.fui-card--elevated{box-shadow:var(--fui-card-shadow);border:none}.fui-card--elevated.fui-card--hovered:not(.fui-card--disabled){box-shadow:var(--fui-card-shadow-hover)}.fui-card--outlined{border:var(--fui-border-width-sm) solid var(--fui-border-default)}.fui-card--outlined.fui-card--hovered:not(.fui-card--disabled){border-color:var(--fui-border-strong)}.fui-card--flat{box-shadow:none;border:var(--fui-border-width-sm) solid transparent}.fui-card--clickable{cursor:pointer;transition:transform var(--fui-duration-fast) var(--fui-ease-in-out),box-shadow var(--fui-duration-fast) var(--fui-ease-in-out)}.fui-card--clickable:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.fui-card--clickable:focus-visible{outline:2px solid var(--fui-primary-10);transition-property:all;transition-duration:var(--fui-duration-fast);transition-timing-function:var(--fui-ease-in-out);transition-delay:0ms}.fui-card--disabled{opacity:var(--fui-state-disabled-opacity);cursor:not-allowed}.fui-card--padding-none .fui-card__content{padding:0}.fui-card--padding-sm .fui-card__content{padding:var(--fui-spacing-6)}.fui-card--padding-md .fui-card__content{padding:var(--fui-spacing-7)}.fui-card--padding-lg .fui-card__content{padding:var(--fui-spacing-9)}.fui-card--padding-xl .fui-card__content{padding:var(--fui-spacing-11)}.fui-card__header{border-bottom:var(--fui-border-width-sm) solid var(--fui-border-default);font-weight:var(--fui-weight-medium)}.fui-card__header:empty{display:none}.fui-card__content{flex:1;padding:var(--fui-card-padding)}.fui-card__content--no-padding{padding:0}.fui-card__content>:first-child{margin-top:0}.fui-card__content>:last-child{margin-bottom:0}.fui-card__actions{padding-bottom:0;display:flex;gap:var(--fui-spacing-4);align-items:center;justify-content:flex-end}.fui-card__actions:empty{display:none}.fui-card__actions--align-start{justify-content:flex-start}.fui-card__actions--align-center{justify-content:center}.fui-card__actions--align-end{justify-content:flex-end}.fui-card-header{padding:var(--fui-spacing-7) var(--fui-spacing-9);display:flex;flex-direction:column;gap:var(--fui-spacing-2)}.fui-card-header__title{color:var(--fui-text-primary);margin:0}.fui-card-header__subtitle{font-size:var(--fui-text-base);font-weight:var(--fui-weight-regular);line-height:var(--fui-leading-normal);color:var(--fui-text-secondary);margin:0}.fui-card-header__content:empty{margin-top:0}.fui-card-actions{display:flex;gap:var(--fui-spacing-4);align-items:center}.fui-card-actions--align-start{justify-content:flex-start}.fui-card-actions--align-center{justify-content:center}.fui-card-actions--align-end{justify-content:flex-end}.fui-card-actions--paddingless{padding:0}.fui-card-actions .fui-button+.fui-button{margin-left:var(--fui-spacing-4)}@media(min-width:640px){.fui-card--padding-sm .fui-card__content{padding:var(--fui-spacing-2)}.fui-card--padding-md .fui-card__content{padding:var(--fui-spacing-6)}.fui-card--padding-lg .fui-card__content{padding:var(--fui-spacing-9)}.fui-card__actions{padding:0 var(--fui-spacing-6) var(--fui-spacing-6);gap:var(--fui-spacing-2);flex-wrap:wrap}}.fui-card--horizontal{flex-direction:row}.fui-card--horizontal .fui-card__content{flex:1}.fui-card--horizontal .fui-card__actions{flex-direction:column;padding:var(--fui-spacing-7)}.fui-card__image{width:100%;height:auto;border-radius:var(--fui-card-border-radius) var(--fui-card-border-radius) 0 0}.fui-card__image:only-child{border-radius:var(--fui-card-border-radius)}.fui-card__media{position:relative;overflow:hidden;border-radius:var(--fui-card-border-radius) var(--fui-card-border-radius) 0 0}.fui-card__media img,.fui-card__media video{width:100%;height:auto;display:block}.fui-card__media:last-child{border-radius:0 0 var(--fui-card-border-radius) var(--fui-card-border-radius)}.fui-card__media:only-child{border-radius:var(--fui-card-border-radius)}\n"] }]
|
|
245
245
|
}], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], headerCmp: [{
|
|
246
246
|
type: ContentChild,
|
|
247
247
|
args: [FuiCardHeaderComponent]
|