npm - @testgorilla/tgo-ui - Versions diffs - 12.1.0 → 12.3.0 - Mend

@testgorilla/tgo-ui 12.1.0 → 12.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (64) hide show

package/fesm2022/testgorilla-tgo-ui-components-button.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-button.mjs","names":[],"sources":["../../../components/button/color-contrast.ts","../../../components/button/button.component.ts","../../../components/button/button.component.html","../../../components/button/button.component.module.ts"],"sourcesContent":["/*\n Function for adjusting the lightness of a color based on different events (hover, pressed, disabled).\n * Accepts a hex color, transforms it to HSL, and based on color's L and event darkens or lightens it.\n * Used to manage different colors based on application configuration\n \n @param hexColor color in hex format\n * @param typeEvent interaction event\n * @param theme\n /\ntype LightnessEvent = 'hover' \| 'pressed' \| 'disabled';\n\n/* Lightness band of a colour, in percent. `null` = exactly on a 30/70 boundary (no adjustment). /\nconst lightnessBand = (lightness: number): 'high' \| 'low' \| 'mid' \| null => {\n if (lightness > 70) {\n return 'high';\n }\n if (lightness < 30) {\n return 'low';\n }\n if (lightness < 70 && lightness > 30) {\n return 'mid';\n }\n return null;\n};\n\n/* Lightness delta (in percent points) for the `new` theme. /\nconst getNewThemeDelta = (lightness: number, typeEvent: LightnessEvent): number => {\n if (typeEvent !== 'hover' && typeEvent !== 'pressed') {\n return 0;\n }\n const band = lightnessBand(lightness);\n return band === 'low' ? 10 : band ? -10 : 0;\n};\n\n/* Lightness delta (in percent points) for the `classic` theme. /\nconst getClassicThemeDelta = (lightness: number, typeEvent: LightnessEvent): number => {\n const deltasByEvent: Record<LightnessEvent, { high: number; low: number; mid: number }> = {\n hover: { high: -10, low: 10, mid: -10 },\n pressed: { high: -20, low: 30, mid: -20 },\n disabled: { high: 10, low: 50, mid: 20 },\n };\n const band = lightnessBand(lightness);\n if (!band) {\n return 0;\n }\n // typeEvent is LightnessEvent at compile time, but callers may pass an\n // out-of-range button state at runtime (matches the original no-op behaviour).\n const eventDeltas: { high: number; low: number; mid: number } \| undefined = deltasByEvent[typeEvent];\n return eventDeltas ? eventDeltas[band] : 0;\n};\n\nexport const adjustLightness = (\n hexColor: string,\n typeEvent: LightnessEvent,\n theme: 'new' \| 'classic' = 'new'\n): string => {\n const hexRegex = /^#(?:[0-9A-F]{3}\|[0-9A-F]{6})$/i;\n if (hexColor && !hexRegex.test(hexColor)) {\n throw new Error('Invalid HEX color format');\n }\n\n const hslColor = hexToHsl(hexColor);\n const lightness = hslColor.l 100;\n const delta = theme === 'new' ? getNewThemeDelta(lightness, typeEvent) : getClassicThemeDelta(lightness, typeEvent);\n hslColor.l = clamp(hslColor.l + delta / 100);\n\n return hslToHex(hslColor);\n};\n\n/*\n Transforms hex color to HSL in object variation.\n * @param hexColor string value with hex color\n /\nexport const hexToHsl = (hexColor: string): { h: number; s: number; l: number } => {\n const rgbColor = parseInt(hexColor.slice(1), 16);\n / eslint-disable no-bitwise -- standard RGB channel extraction from a packed 24-bit integer /\n const r = ((rgbColor >> 16) & 255) / 255;\n const g = ((rgbColor >> 8) & 255) / 255;\n const b = (rgbColor & 255) / 255;\n / eslint-enable no-bitwise /\n\n const max = Math.max(r, g, b);\n const min = Math.min(r, g, b);\n\n let h = 0;\n let s;\n const l = (max + min) / 2;\n\n if (max === min) {\n h = s = 0; // grayscale\n } else {\n const d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n }\n\n h /= 6;\n }\n\n return { h, s, l };\n};\n\n/\n Transforms HSL color, represented as an object and transforms it to hex string.\n * @param hslColor accepts the HSL color like an object.\n /\nexport const hslToHex = (hslColor: { h: number; s: number; l: number }): string => {\n const { h, s, l } = hslColor;\n\n const hueToRgb = (p: number, q: number, t: number): number => {\n let tNorm = t;\n if (tNorm < 0) {\n tNorm += 1;\n }\n if (tNorm > 1) {\n tNorm -= 1;\n }\n if (tNorm < 1 / 6) {\n return p + (q - p) 6 * tNorm;\n }\n if (tNorm < 1 / 2) {\n return q;\n }\n if (tNorm < 2 / 3) {\n return p + (q - p) * (2 / 3 - tNorm) * 6;\n }\n return p;\n };\n\n const qBase = l < 0.5 ? l * (1 + s) : l + s - l * s;\n const pBase = 2 * l - qBase;\n\n const r = hueToRgb(pBase, qBase, h + 1 / 3);\n const g = hueToRgb(pBase, qBase, h);\n const b = hueToRgb(pBase, qBase, h - 1 / 3);\n\n // eslint-disable-next-line no-bitwise -- standard RGB channel packing into a 24-bit integer\n const rgbColor = (Math.round(r * 255) << 16) \| (Math.round(g * 255) << 8) \| Math.round(b * 255);\n\n return `#${rgbColor.toString(16).padStart(6, '0')}`;\n};\n\n/*\n Restricts the value to be within the range [0, 1].\n * @param value\n /\nconst clamp = (value: number): number => Math.min(Math.max(value, 0), 1);\n","/ eslint-disable @angular-eslint/use-lifecycle-interface /\nimport { FocusOrigin } from '@angular/cdk/a11y';\nimport { NgClass, NgStyle, AsyncPipe } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n AfterViewInit,\n booleanAttribute,\n Component,\n ElementRef,\n EventEmitter,\n HostBinding,\n Inject,\n Input,\n OnInit,\n Optional,\n Output,\n SimpleChanges,\n ViewChild,\n} from '@angular/core';\nimport { MatButton } from '@angular/material/button';\nimport { MatProgressSpinner } from '@angular/material/progress-spinner';\nimport { TooltipPosition, MatTooltip } from '@angular/material/tooltip';\n\nimport { BadgeComponent } from '@testgorilla/tgo-ui/components/badge';\nimport { ApplicationTheme, Color, EllipseTextDirective, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconName, IconComponentModule, tgoIcons, tgoRebrandIcons } from '@testgorilla/tgo-ui/components/icon';\n\nimport {\n ButtonBadgeConfig,\n ButtonColor,\n ButtonIconPosition,\n ButtonSize,\n ButtonState,\n ButtonType,\n IconButtonSize,\n LinkUrlTarget,\n} from './button.model';\nimport { adjustLightness } from './color-contrast';\n\n@Component({\n selector: 'ui-button',\n changeDetection: ChangeDetectionStrategy.OnPush,\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n imports: [\n MatTooltip,\n NgClass,\n BadgeComponent,\n MatButton,\n NgStyle,\n MatProgressSpinner,\n IconComponentModule,\n EllipseTextDirective,\n AsyncPipe,\n UiTranslatePipe,\n ],\n})\nexport class ButtonComponent implements OnInit, AfterViewInit {\n @HostBinding('style.pointer-events')\n get enabled(): string {\n return this.disabled ? 'none' : 'all';\n }\n\n @ViewChild('tooltipElement') tooltipElement: ElementRef<HTMLElement>;\n\n /\n Define button height\n \n @type {ButtonSize}\n * @memberof ButtonComponent\n /\n @Input() size: ButtonSize = 'big';\n /\n Background color of the button while in active state\n \n @type {ButtonColor}\n * @memberof ButtonComponent\n /\n @HostBinding('attr.btn-variant')\n @Input()\n variant: ButtonColor = 'primary';\n\n /\n Text content to appear on the button\n \n @memberof ButtonComponent\n /\n @Input() label = '';\n\n /\n Positioning of the icon (when existant)\n \n @type {ButtonIconPosition}\n * @memberof ButtonComponent\n /\n @Input() iconPosition?: ButtonIconPosition = 'right';\n\n /\n Define if button has only icon without text\n \n @memberof ButtonComponent\n /\n @Input() justIcon = false;\n\n /\n Name of ui-icon\n \n @type {IconName}\n * @memberof ButtonComponent\n /\n @Input() iconName: IconName \| undefined;\n\n /\n Name of a second ui-icon rendered after the label, in addition to `iconName`.\n * Pair it with `iconPosition=\"left\"` to show a leading and a trailing icon at once.\n \n @type {IconName}\n * @memberof ButtonComponent\n /\n @Input() trailingIconName: IconName \| undefined;\n\n /\n Renders the trailing icon filled, independently of `iconFilled`.\n \n @memberof ButtonComponent\n /\n @Input() trailingIconFilled = false;\n\n /\n Indicator if the button should be disabled\n \n @memberof ButtonComponent\n /\n @Input() disabled = false;\n\n /\n Indicator if the loading icon should be shown\n \n @memberof ButtonComponent\n /\n @Input() loading = false;\n\n /\n Show a small inline spinner to the left of the label while keeping the\n * label visible. Pair with `disabled` to make the button non-interactive.\n * If `loading` is also true, `loading` takes precedence.\n \n @memberof ButtonComponent\n /\n @Input() loadingWithLabel = false;\n\n /\n Indicator of the button width\n \n @memberof ButtonComponent\n /\n @Input() fullWidth = false;\n\n /\n Url of button if it is a link\n \n @memberof ButtonComponent\n /\n @Input() url?: string;\n\n /\n Url's target of button if it is a link\n \n @type {@type {LinkUrlTarget}}\n * @memberof ButtonComponent\n /\n @Input() urlTarget?: LinkUrlTarget;\n\n /\n Button value\n \n @memberof ButtonComponent\n /\n @Input() value?: string;\n\n /\n @property tooltip\n * @description The tooltip that is displayed on hover. Required for icon-button type\n * @type {string}\n * @memberof ButtonComponent\n /\n @Input() tooltip = '';\n\n /\n @property isPremium\n * @description The icon that is displayed for Premium button\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input() isPremium = false;\n\n /\n The type of the button.\n \n @type {ButtonType}\n * @memberof ButtonComponent\n * @default 'button'\n /\n @Input() type: ButtonType = 'button';\n\n /\n Color of the button.\n * Defaults to Test Gorilla primary color.\n \n @type {string}\n * @memberof ButtonComponent\n /\n @Input() companyColor: string \| null = '';\n\n /\n Config for the button badge variation\n * @type {ButtonBadgeConfig}\n * @property badgeType Type of badge on the button\n * @property badgeLabel Label text for the badge\n * @property badgeNotificationAmount The amount for notification in the badge\n /\n @Input() buttonBadgeConfig: ButtonBadgeConfig \| undefined;\n\n /\n \n * Defines the application theme where buttons is used\n \n @type {ApplicationTheme}\n * @memberof ButtonComponent\n /\n @HostBinding('attr.theme')\n @Input()\n applicationTheme: ApplicationTheme = 'light';\n\n /* The premium marker reads as the warning badge does, so the two are recognisably the same signal. /\n protected readonly premiumMarkerColor = Color.BLACK;\n\n /\n \n * Disabled button scale on click\n \n @type {boolean}\n * @memberof ButtonComponent\n /\n @Input() disabledScaleOnClick = false;\n\n /\n A string representing the ARIA label for accessibility.\n * This label is used to provide an accessible name for the input element.\n * @type {string}\n * @memberof ButtonComponent\n /\n @Input() ariaLabel: string;\n\n /\n Whether the button controls a disclosure widget that is currently expanded.\n * Set to `true` for an expanded disclosure, `false` for collapsed, or leave\n * undefined when the button is not a disclosure trigger.\n * @memberof ButtonComponent\n /\n @Input() ariaExpanded?: boolean;\n\n /\n The id of the element controlled by this button (used together with\n * `ariaExpanded` for disclosure semantics).\n * @memberof ButtonComponent\n /\n @Input() ariaControls?: string;\n\n /\n Whether the button is a toggle button currently in the pressed state.\n * Use `true` / `false` for two-state toggles. Leave undefined when the\n * button is not a toggle.\n * @memberof ButtonComponent\n /\n @Input() ariaPressed?: boolean;\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input() ariaRequired = false;\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {string}\n * @memberof ButtonComponent\n /\n @Input() ariaLabelledby = '';\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {string}\n * @memberof ButtonComponent\n /\n @Input() ariaDescribedby = '';\n\n /\n Prevents default button click behavior\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input({ transform: booleanAttribute }) preventDefault = false;\n\n /\n Ghost variant with white background\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input({ transform: booleanAttribute }) hasBackground = false;\n\n /\n Draws an icon-only button as a circle on any variant: 32px when small, 40px when medium and 48px when big.\n * Has no effect on buttons that show a label, on the classic theme or on `icon-button`, which is already round.\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input({ transform: booleanAttribute }) circular = false;\n\n /\n Sets tooltip position\n \n @type {TooltipPosition}\n * @memberof ButtonComponent\n /\n @Input() tooltipPosition: TooltipPosition = 'below';\n\n @Input() role = 'button';\n\n @Input() iconFilled = false;\n\n @Input() testId: string \| null = null;\n\n @Output() buttonClickEvent: EventEmitter<Event> = new EventEmitter<Event>();\n\n @Output() buttonHoverEvent: EventEmitter<Event> = new EventEmitter<Event>();\n\n @ViewChild('buttonElement', { static: false }) buttonElement: MatButton;\n\n get isDisabled(): boolean {\n return this.disabled;\n }\n\n @HostBinding('style.--color')\n get compColor() {\n return this.getCompanyColor;\n }\n\n classCss: string;\n styleCss: Record<string, string>;\n isButtonLink: boolean;\n isLabel: boolean;\n buttonState: ButtonState;\n hover = false;\n iconButtonSize: IconButtonSize = '40';\n allowButtonTypeForPremium: ButtonColor[] = [\n 'secondary',\n 'secondary-inverted',\n 'primary',\n 'ghost',\n 'outlined',\n 'destructive',\n 'icon-button',\n ];\n isFilledIcon: boolean;\n coloredIcons = ['Google-in-line', 'Google', 'Google-filled', 'Linkedin-brand-filled', 'Linkedin-brand-in-line'];\n labelEllipsis = false;\n icon: IconName = '';\n trailingIcon: IconName = '';\n\n private static nextAriaLabelledId = 0;\n ariaLabelledbyId = '';\n\n get typeIncluded(): boolean {\n return this.allowButtonTypeForPremium.includes(this.variant);\n }\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngOnInit(): void {\n this.classCss = this.setCssClass();\n this.styleCss = this.setCssStyle();\n this.isButtonLink = this.showButtonLink();\n this.isLabel = this.showLabel();\n this.createAriaLabelledById();\n }\n\n ngOnChanges(changes: SimpleChanges) {\n if (changes['disabled']) {\n this.buttonState = 'default';\n }\n if (!this.applicationTheme) {\n this.applicationTheme = 'light';\n }\n if (changes['type']) {\n this.isButtonLink = this.showButtonLink();\n }\n if (changes['loading']) {\n this.isLabel = this.showLabel();\n }\n if (changes['iconName']) {\n this.icon = changes['iconName'].currentValue as IconName;\n }\n if (changes['trailingIconName']) {\n this.trailingIcon = changes['trailingIconName'].currentValue as IconName;\n }\n if (this.hasCssAffectingChange(changes)) {\n this.classCss = this.setCssClass();\n this.styleCss = this.setCssStyle();\n }\n if (this.isIconButtonSizeChange(changes)) {\n this.iconButtonSize = this.setIconButtonSize();\n }\n\n this.isFilledIcon = this.isFilledIconVariant();\n }\n\n private hasCssAffectingChange(changes: SimpleChanges): boolean {\n return Boolean(\n changes['type'] \|\|\n changes['fullWidth'] \|\|\n changes['iconName'] \|\|\n changes['trailingIconName'] \|\|\n changes['trailingIconFilled'] \|\|\n changes['justIcon'] \|\|\n changes['iconPosition'] \|\|\n changes['disabled'] \|\|\n changes['companyColor'] \|\|\n changes['variant'] \|\|\n changes['applicationTheme']\n );\n }\n\n private isIconButtonSizeChange(changes: SimpleChanges): boolean {\n return (\n changes['variant']?.currentValue === 'icon-button' \|\|\n (changes['variant']?.currentValue === 'menuTrigger' && this.applicationTheme !== 'classic')\n );\n }\n\n private isFilledIconVariant(): boolean {\n return (\n this.applicationTheme !== 'classic' &&\n (this.variant === 'primary' \|\|\n this.variant === 'secondary' \|\|\n this.variant === 'secondary-inverted' \|\|\n this.variant === 'linkedin')\n );\n }\n\n ngAfterViewInit(): void {\n this.tooltipElement.nativeElement.onclick = ev => {\n ev.preventDefault();\n ev.stopPropagation();\n };\n }\n\n buttonClick(event: Event): void {\n if (this.preventDefault) {\n event.preventDefault();\n event.stopPropagation();\n }\n this.buttonClickEvent.emit(event);\n }\n\n buttonHover(event: Event): void {\n if (event.type === 'mouseenter') {\n this.hover = true;\n this.buttonHoverEvent.emit(event);\n this.buttonState = 'hover';\n if (this.shouldChangeFilledStatus && this.icon) {\n this.icon = this.getIconName(this.iconName as IconName, '-filled');\n }\n if (this.trailingIcon && this.canToggleFilled(this.trailingIcon)) {\n this.trailingIcon = this.getIconName(this.trailingIconName as IconName, '-filled');\n }\n } else {\n this.hover = false;\n if (this.shouldChangeFilledStatus && this.icon) {\n this.icon = this.iconName as IconName;\n }\n if (this.trailingIcon && this.canToggleFilled(this.trailingIcon)) {\n this.trailingIcon = this.trailingIconName as IconName;\n }\n this.buttonState = 'default';\n }\n\n this.styleCss = this.setCssStyle();\n }\n\n //Show or hide label\n showLabel(): boolean {\n return !this.loading;\n }\n\n //Set css class according inputs\n setCssClass(): string {\n const width = this.fullWidth ? 'full-width' : '';\n const hasIcon = this.iconName === null ? '' : 'icon';\n const justIcon = this.justIcon \|\| this.variant === 'icon-button' ? 'only-icon' : '';\n const iconPosition = this.iconPosition ?? '';\n const disabled = this.disabled && this.variant === 'primary' ? 'primary-disabled' : '';\n const variant = this.variant === 'ghost' && this.applicationTheme === 'classic' ? 'outlined' : this.variant;\n const companyColor = this.companyColor ? 'has-company-color' : '';\n return `${this.size} ${iconPosition} ${variant} ${width} ${hasIcon} ${justIcon} ${disabled} ${companyColor} ${this.applicationTheme}-theme`;\n }\n\n setCssStyle(): Record<string, string> {\n this.buttonState = this.disabled ? 'disabled' : this.buttonState;\n return (\n this.getInteractiveStyle() ??\n this.getClassicInteractiveStyle() ??\n this.getCompanyColorStyle() ??\n this.getGhostBackgroundStyle() ??\n {}\n );\n }\n\n private get isColorVariant(): boolean {\n return this.variant === 'primary' \|\| this.variant === 'text' \|\| this.variant === 'text-inline';\n }\n\n private get isTextVariant(): boolean {\n return this.variant === 'text' \|\| this.variant === 'text-inline';\n }\n\n private getInteractiveStyle(): Record<string, string> \| null {\n if (this.buttonState !== 'hover' && this.buttonState !== 'pressed') {\n return null;\n }\n if (!this.isColorVariant \|\| this.applicationTheme === 'classic') {\n return null;\n }\n const styleObj: Record<string, string> = {};\n styleObj[this.variant === 'primary' ? 'background-color' : 'color'] = adjustLightness(\n this.getCompanyColor,\n this.buttonState\n );\n if (this.isTextVariant) {\n styleObj['--active-color'] = this.companyColor\n ? adjustLightness(this.getCompanyColor, this.buttonState)\n : '#666666';\n }\n return styleObj;\n }\n\n private getClassicInteractiveStyle(): Record<string, string> \| null {\n if (this.buttonState === 'default') {\n return null;\n }\n if (!this.isColorVariant \|\| this.applicationTheme !== 'classic') {\n return null;\n }\n return {\n [this.variant === 'primary' ? 'background-color' : 'color']: adjustLightness(\n this.getCompanyColor,\n this.buttonState,\n 'classic'\n ),\n };\n }\n\n private getCompanyColorStyle(): Record<string, string> \| null {\n const isCompanyColorVariant =\n this.variant === 'link' \|\| this.variant === 'tertiary' \|\| this.variant === 'icon-button';\n if (!(this.getCompanyColor && isCompanyColorVariant)) {\n return null;\n }\n return { color: this.getCompanyColor };\n }\n\n private getGhostBackgroundStyle(): Record<string, string> \| null {\n return this.hasBackground ? { '--ghost-background': '#ffffff' } : null;\n }\n\n //Show or hide spinner\n get showSpinner(): boolean {\n const isNotTab = this.variant !== 'tab';\n const isNotLink = this.variant !== 'link';\n const isLoading = this.loading === true;\n return isLoading && isNotTab && isNotLink;\n }\n\n //Show or hide the inline spinner that sits next to the label\n get showInlineSpinner(): boolean {\n return (\n this.loadingWithLabel && !this.loading && this.variant !== 'tab' && this.variant !== 'link' && !this.justIcon\n );\n }\n\n //Show button with <button> or <a> tag\n showButtonLink(): boolean {\n return this.variant !== 'link';\n }\n\n setIconButtonSize(): IconButtonSize {\n return this.size === 'big' ? '40' : this.size === 'small' ? '24' : '32';\n }\n\n onPressed(ev: Event): void {\n if (ev.type === 'mousedown') {\n this.buttonState = 'pressed';\n } else {\n this.buttonState = this.hover ? 'hover' : 'default';\n }\n\n this.styleCss = this.setCssStyle();\n }\n\n focus(origin?: FocusOrigin): void {\n this.buttonElement.focus(origin);\n }\n\n get getCompanyColor(): string {\n return (\n // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- empty companyColor ('' is the default) falls back to the theme colour\n this.companyColor \|\|\n (this.variant === 'text' \|\| this.variant === 'text-inline'\n ? this.applicationTheme === 'dark'\n ? '#ffffff'\n : '#242424'\n : this.applicationTheme === 'classic'\n ? '#46A997'\n : '#D410AA')\n );\n }\n\n get shouldChangeFilledStatus(): boolean {\n return this.canToggleFilled(this.icon);\n }\n\n /\n Whether this specific icon may be swapped to its filled variant on hover. Takes the icon as an\n * argument because a button can render two, and a brand icon in one slot must not freeze the other.\n */\n canToggleFilled(icon: IconName): boolean {\n return (\n this.applicationTheme !== 'classic' &&\n this.variant !== 'primary' &&\n this.variant !== 'secondary' &&\n this.variant !== 'linkedin' &&\n !this.coloredIcons.includes(icon)\n );\n }\n\n onKeydown(event: KeyboardEvent): void {\n if (event.key === ' ') {\n event.preventDefault();\n const target = event.target as HTMLElement;\n target.click();\n }\n\n if (event.key === 'Enter' \|\| event.key === ' ') {\n this.buttonState = 'pressed';\n this.styleCss = this.setCssStyle();\n }\n }\n\n onKeyup(event: KeyboardEvent): void {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n this.buttonState = this.hover ? 'hover' : 'default';\n this.styleCss = this.setCssStyle();\n }\n }\n\n onLabelEllipsisChange(state: boolean): void {\n this.labelEllipsis = state;\n }\n\n getIconName(iconName: string, defaultValue: string): IconName {\n if (iconName.includes('filled')) {\n return iconName.replace(/filled/, 'in-line') as IconName;\n } else if (iconName.includes('in-line')) {\n return iconName.replace(/in-line/, 'filled') as IconName;\n }\n // Only append when the result is a real icon; otherwise it falls outside the IconName union.\n const suffixed = iconName + defaultValue;\n return this.isKnownIconName(suffixed) ? suffixed : (iconName as IconName);\n }\n\n private isKnownIconName(name: string): name is IconName {\n return (tgoRebrandIcons as readonly string[]).includes(name) \|\| (tgoIcons as readonly string[]).includes(name);\n }\n\n private createAriaLabelledById(): void {\n const labelledByValue = this.variant === 'link' ? 'labelledby-link' : 'labelledby';\n this.ariaLabelledbyId = `${labelledByValue}-uiButton-${++ButtonComponent.nextAriaLabelledId}`;\n }\n}\n","<div\n #tooltipElement\n class=\"tooltip\"\n [matTooltip]=\"tooltip ? tooltip : labelEllipsis ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n></div>\n<div\n class=\"button-wrapper\"\n [ngClass]=\"{\n 'full-width': fullWidth,\n 'rounded-icon': applicationTheme !== 'classic' && icon && !label,\n circular: circular && justIcon && variant !== 'icon-button' && applicationTheme !== 'classic',\n link: !isButtonLink,\n }\"\n>\n <div\n class=\"button-container\"\n [ngClass]=\"{\n disabled: disabled,\n 'button-scale': buttonState === 'pressed' && applicationTheme !== 'classic' && !disabledScaleOnClick,\n }\"\n >\n @if (isPremium && typeIncluded) {\n <span class=\"right-top premium-marker\">\n <ui-icon name=\"Premium-in-line\" size=\"16\" [color]=\"premiumMarkerColor\"></ui-icon>\n </span>\n }\n @if (buttonBadgeConfig?.badgeType) {\n <ui-badge\n id=\"badge\"\n [rebrandColor]=\"buttonBadgeConfig?.rebrandColor ?? 'brand'\"\n [variant]=\"buttonBadgeConfig!.badgeType!\"\n [label]=\"buttonBadgeConfig?.badgeLabel ?? ''\"\n [notificationsAmount]=\"buttonBadgeConfig?.badgeNotificationAmount ?? 0\"\n class=\"right-top\"\n [ngClass]=\"[\n buttonBadgeConfig?.badgeType === 'primary' ? 'badge-primary' : '',\n buttonBadgeConfig?.badgeType === 'notification' ? 'badge-notification' : '',\n variant,\n ]\"\n ></ui-badge>\n }\n @if (isButtonLink) {\n <button\n [style]=\"'--icon-button-size:' + iconButtonSize + 'px'\"\n [ngClass]=\"classCss\"\n [ngStyle]=\"styleCss\"\n [disabled]=\"disabled\"\n (click)=\"buttonClick($event)\"\n (mouseleave)=\"buttonHover($event)\"\n (mouseenter)=\"buttonHover($event)\"\n (mousedown)=\"onPressed($event)\"\n (mouseup)=\"onPressed($event)\"\n (keydown)=\"onKeydown($event)\"\n (keyup)=\"onKeyup($event)\"\n [attr.aria-required]=\"ariaRequired\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledbyId\"\n [attr.aria-describedby]=\"'describedby'\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-pressed]=\"ariaPressed\"\n [attr.data-testid]=\"testId\"\n [type]=\"type\"\n [disableRipple]=\"applicationTheme !== 'classic'\"\n [matTooltip]=\"tooltip ? tooltip : labelEllipsis ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n [matTooltipPosition]=\"tooltipPosition\"\n #buttonElement\n [attr.role]=\"role\"\n mat-flat-button\n >\n <span id=\"describedby\" [style.display]=\"'none'\">\n {{ isPremium ? label + ' ' + ('BUTTON.PREMIUM_FEATURE' \| uiTranslate \| async) : ariaDescribedby }}\n </span>\n <span [id]=\"ariaLabelledbyId\" [style.display]=\"'none'\">\n {{ ariaLabelledby }}\n </span>\n @if (showSpinner) {\n <span class=\"spinner-wrapper\">\n <mat-spinner class=\"position-spinner\" aria-label=\"loading\" mode=\"indeterminate\" diameter=\"24\"></mat-spinner>\n </span>\n } @else {\n @if (justIcon && !!icon) {\n <span class=\"icon-only-wrapper\">\n <span class=\"icon only\" role=\"label\">\n <ui-icon\n [color]=\"variant === 'ghost-ai' ? 'ai' : 'inherit'\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"icon\"\n [filled]=\"isFilledIcon \|\| iconFilled\"\n [useFullIconName]=\"variant === 'primary' \|\| variant === 'secondary' \|\| variant === 'linkedin'\"\n [size]=\"size === 'small' ? '16' : '24'\"\n ></ui-icon>\n </span>\n </span>\n }\n @if (!justIcon) {\n <span class=\"icon-label-wrapper\" [ngClass]=\"{ 'center-text': iconName === '' }\">\n @if (showInlineSpinner) {\n <span class=\"icon inline-spinner\" aria-hidden=\"true\">\n <mat-spinner\n aria-label=\"loading\"\n mode=\"indeterminate\"\n [diameter]=\"size === 'small' ? 16 : 20\"\n ></mat-spinner>\n </span>\n }\n @if (iconPosition === 'left' && !!iconName && !showInlineSpinner) {\n <span class=\"icon\" aria-hidden=\"true\">\n <ui-icon\n [color]=\"variant === 'ghost-ai' ? 'ai' : 'inherit'\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"icon\"\n [filled]=\"isFilledIcon \|\| iconFilled\"\n [useFullIconName]=\"variant === 'primary' \|\| variant === 'secondary' \|\| variant === 'linkedin'\"\n [size]=\"size === 'small' ? '16' : '24'\"\n ></ui-icon>\n </span>\n }\n @if (isLabel) {\n <span\n class=\"label\"\n id=\"label\"\n uiEllipseText\n [isMultiline]=\"true\"\n (onChangeTextState)=\"onLabelEllipsisChange($event)\"\n >\n {{ label }}\n </span>\n }\n @if (iconPosition === 'right' && !!icon) {\n <span class=\"icon\" aria-hidden=\"true\"\n ><ui-icon\n [color]=\"variant === 'ghost-ai' ? 'ai' : 'inherit'\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"icon\"\n [filled]=\"isFilledIcon \|\| iconFilled\"\n [size]=\"size === 'small' ? '16' : '24'\"\n [useFullIconName]=\"variant === 'primary' \|\| variant === 'secondary' \|\| variant === 'linkedin'\"\n ></ui-icon\n ></span>\n }\n @if (!!trailingIcon && !showInlineSpinner) {\n <span class=\"icon trailing\" aria-hidden=\"true\"\n ><ui-icon\n [color]=\"variant === 'ghost-ai' ? 'ai' : 'inherit'\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"trailingIcon\"\n [filled]=\"isFilledIcon \|\| trailingIconFilled\"\n [size]=\"size === 'small' ? '16' : '24'\"\n [useFullIconName]=\"variant === 'primary' \|\| variant === 'secondary' \|\| variant === 'linkedin'\"\n ></ui-icon\n ></span>\n }\n </span>\n }\n }\n </button>\n }\n @if (!isButtonLink) {\n <a\n #buttonElement\n [ngClass]=\"classCss\"\n [ngStyle]=\"styleCss\"\n [disabled]=\"disabled\"\n (click)=\"buttonClick($event)\"\n (mouseenter)=\"buttonHover($event)\"\n (mouseleave)=\"buttonHover($event)\"\n (mousedown)=\"onPressed($event)\"\n (mouseup)=\"onPressed($event)\"\n (keydown)=\"onKeydown($event)\"\n (keyup)=\"onKeyup($event)\"\n [disableRipple]=\"true\"\n [attr.aria-required]=\"ariaRequired\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledbyId\"\n [attr.aria-describedby]=\"'describedby-link'\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-pressed]=\"ariaPressed\"\n [attr.data-testid]=\"testId\"\n [matTooltip]=\"tooltip ? tooltip : labelEllipsis ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n role=\"link\"\n [href]=\"url\"\n [target]=\"urlTarget\"\n mat-flat-button\n >\n <span id=\"describedby-link\" [style.display]=\"'none'\">\n {{ ariaDescribedby }}\n </span>\n <span [id]=\"ariaLabelledbyId\" [style.display]=\"'none'\">\n {{ ariaLabelledby }}\n </span>\n <span class=\"icon-label-wrapper\">\n {{ label }}\n </span>\n </a>\n }\n </div>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\nimport { MatRadioModule } from '@angular/material/radio';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { BadgeComponentModule } from '@testgorilla/tgo-ui/components/badge';\nimport { EllipseTextDirective, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\n\nimport { ButtonComponent } from './button.component';\n\n@NgModule({\n imports: [\n CommonModule,\n MatButtonModule,\n IconComponentModule,\n MatProgressSpinnerModule,\n MatTooltipModule,\n BadgeComponentModule,\n EllipseTextDirective,\n MatRadioModule,\n UiTranslatePipe,\n ButtonComponent,\n ],\n exports: [ButtonComponent],\n providers: [],\n})\nexport class ButtonComponentModule {}\n"],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-button.mjs","names":[],"sources":["../../../components/button/color-contrast.ts","../../../components/button/button.component.ts","../../../components/button/button.component.html","../../../components/button/button.component.module.ts"],"sourcesContent":["/*\n Function for adjusting the lightness of a color based on different events (hover, pressed, disabled).\n * Accepts a hex color, transforms it to HSL, and based on color's L and event darkens or lightens it.\n * Used to manage different colors based on application configuration\n \n @param hexColor color in hex format\n * @param typeEvent interaction event\n * @param theme\n /\ntype LightnessEvent = 'hover' \| 'pressed' \| 'disabled';\n\n/* Lightness band of a colour, in percent. `null` = exactly on a 30/70 boundary (no adjustment). /\nconst lightnessBand = (lightness: number): 'high' \| 'low' \| 'mid' \| null => {\n if (lightness > 70) {\n return 'high';\n }\n if (lightness < 30) {\n return 'low';\n }\n if (lightness < 70 && lightness > 30) {\n return 'mid';\n }\n return null;\n};\n\n/* Lightness delta (in percent points) for the `new` theme. /\nconst getNewThemeDelta = (lightness: number, typeEvent: LightnessEvent): number => {\n if (typeEvent !== 'hover' && typeEvent !== 'pressed') {\n return 0;\n }\n const band = lightnessBand(lightness);\n return band === 'low' ? 10 : band ? -10 : 0;\n};\n\n/* Lightness delta (in percent points) for the `classic` theme. /\nconst getClassicThemeDelta = (lightness: number, typeEvent: LightnessEvent): number => {\n const deltasByEvent: Record<LightnessEvent, { high: number; low: number; mid: number }> = {\n hover: { high: -10, low: 10, mid: -10 },\n pressed: { high: -20, low: 30, mid: -20 },\n disabled: { high: 10, low: 50, mid: 20 },\n };\n const band = lightnessBand(lightness);\n if (!band) {\n return 0;\n }\n // typeEvent is LightnessEvent at compile time, but callers may pass an\n // out-of-range button state at runtime (matches the original no-op behaviour).\n const eventDeltas: { high: number; low: number; mid: number } \| undefined = deltasByEvent[typeEvent];\n return eventDeltas ? eventDeltas[band] : 0;\n};\n\nexport const adjustLightness = (\n hexColor: string,\n typeEvent: LightnessEvent,\n theme: 'new' \| 'classic' = 'new'\n): string => {\n const hexRegex = /^#(?:[0-9A-F]{3}\|[0-9A-F]{6})$/i;\n if (hexColor && !hexRegex.test(hexColor)) {\n throw new Error('Invalid HEX color format');\n }\n\n const hslColor = hexToHsl(hexColor);\n const lightness = hslColor.l 100;\n const delta = theme === 'new' ? getNewThemeDelta(lightness, typeEvent) : getClassicThemeDelta(lightness, typeEvent);\n hslColor.l = clamp(hslColor.l + delta / 100);\n\n return hslToHex(hslColor);\n};\n\n/*\n Transforms hex color to HSL in object variation.\n * @param hexColor string value with hex color\n /\nexport const hexToHsl = (hexColor: string): { h: number; s: number; l: number } => {\n const rgbColor = parseInt(hexColor.slice(1), 16);\n / eslint-disable no-bitwise -- standard RGB channel extraction from a packed 24-bit integer /\n const r = ((rgbColor >> 16) & 255) / 255;\n const g = ((rgbColor >> 8) & 255) / 255;\n const b = (rgbColor & 255) / 255;\n / eslint-enable no-bitwise /\n\n const max = Math.max(r, g, b);\n const min = Math.min(r, g, b);\n\n let h = 0;\n let s;\n const l = (max + min) / 2;\n\n if (max === min) {\n h = s = 0; // grayscale\n } else {\n const d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n }\n\n h /= 6;\n }\n\n return { h, s, l };\n};\n\n/\n Transforms HSL color, represented as an object and transforms it to hex string.\n * @param hslColor accepts the HSL color like an object.\n /\nexport const hslToHex = (hslColor: { h: number; s: number; l: number }): string => {\n const { h, s, l } = hslColor;\n\n const hueToRgb = (p: number, q: number, t: number): number => {\n let tNorm = t;\n if (tNorm < 0) {\n tNorm += 1;\n }\n if (tNorm > 1) {\n tNorm -= 1;\n }\n if (tNorm < 1 / 6) {\n return p + (q - p) 6 * tNorm;\n }\n if (tNorm < 1 / 2) {\n return q;\n }\n if (tNorm < 2 / 3) {\n return p + (q - p) * (2 / 3 - tNorm) * 6;\n }\n return p;\n };\n\n const qBase = l < 0.5 ? l * (1 + s) : l + s - l * s;\n const pBase = 2 * l - qBase;\n\n const r = hueToRgb(pBase, qBase, h + 1 / 3);\n const g = hueToRgb(pBase, qBase, h);\n const b = hueToRgb(pBase, qBase, h - 1 / 3);\n\n // eslint-disable-next-line no-bitwise -- standard RGB channel packing into a 24-bit integer\n const rgbColor = (Math.round(r * 255) << 16) \| (Math.round(g * 255) << 8) \| Math.round(b * 255);\n\n return `#${rgbColor.toString(16).padStart(6, '0')}`;\n};\n\n/*\n Restricts the value to be within the range [0, 1].\n * @param value\n /\nconst clamp = (value: number): number => Math.min(Math.max(value, 0), 1);\n","/ eslint-disable @angular-eslint/use-lifecycle-interface /\nimport { FocusOrigin } from '@angular/cdk/a11y';\nimport { NgClass, NgStyle, AsyncPipe } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n AfterViewInit,\n booleanAttribute,\n Component,\n ElementRef,\n EventEmitter,\n HostBinding,\n Inject,\n Input,\n OnInit,\n Optional,\n Output,\n SimpleChanges,\n ViewChild,\n} from '@angular/core';\nimport { MatButton } from '@angular/material/button';\nimport { MatProgressSpinner } from '@angular/material/progress-spinner';\nimport { TooltipPosition, MatTooltip } from '@angular/material/tooltip';\n\nimport { BadgeComponent } from '@testgorilla/tgo-ui/components/badge';\nimport { ApplicationTheme, Color, EllipseTextDirective, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconName, IconComponentModule, tgoIcons, tgoRebrandIcons } from '@testgorilla/tgo-ui/components/icon';\n\nimport {\n ButtonAriaHasPopup,\n ButtonBadgeConfig,\n ButtonColor,\n ButtonIconPosition,\n ButtonSize,\n ButtonState,\n ButtonType,\n IconButtonShape,\n IconButtonSize,\n LinkUrlTarget,\n} from './button.model';\nimport { adjustLightness } from './color-contrast';\n\n@Component({\n selector: 'ui-button',\n changeDetection: ChangeDetectionStrategy.OnPush,\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n imports: [\n MatTooltip,\n NgClass,\n BadgeComponent,\n MatButton,\n NgStyle,\n MatProgressSpinner,\n IconComponentModule,\n EllipseTextDirective,\n AsyncPipe,\n UiTranslatePipe,\n ],\n})\nexport class ButtonComponent implements OnInit, AfterViewInit {\n @HostBinding('style.pointer-events')\n get enabled(): string {\n return this.disabled ? 'none' : 'all';\n }\n\n @ViewChild('tooltipElement') tooltipElement: ElementRef<HTMLElement>;\n\n /\n Define button height\n \n @type {ButtonSize}\n * @memberof ButtonComponent\n /\n @Input() size: ButtonSize = 'big';\n /\n Background color of the button while in active state\n \n @type {ButtonColor}\n * @memberof ButtonComponent\n /\n @HostBinding('attr.btn-variant')\n @Input()\n variant: ButtonColor = 'primary';\n\n /\n Text content to appear on the button\n \n @memberof ButtonComponent\n /\n @Input() label = '';\n\n /\n Positioning of the icon (when existant)\n \n @type {ButtonIconPosition}\n * @memberof ButtonComponent\n /\n @Input() iconPosition?: ButtonIconPosition = 'right';\n\n /\n Define if button has only icon without text\n \n @memberof ButtonComponent\n /\n @Input() justIcon = false;\n\n /\n Name of ui-icon\n \n @type {IconName}\n * @memberof ButtonComponent\n /\n @Input() iconName: IconName \| undefined;\n\n /\n Name of a second ui-icon rendered after the label, in addition to `iconName`.\n * Pair it with `iconPosition=\"left\"` to show a leading and a trailing icon at once.\n \n @type {IconName}\n * @memberof ButtonComponent\n /\n @Input() trailingIconName: IconName \| undefined;\n\n /\n Renders the trailing icon filled, independently of `iconFilled`.\n \n @memberof ButtonComponent\n /\n @Input() trailingIconFilled = false;\n\n /\n Indicator if the button should be disabled\n \n @memberof ButtonComponent\n /\n @Input() disabled = false;\n\n /\n Indicator if the loading icon should be shown\n \n @memberof ButtonComponent\n /\n @Input() loading = false;\n\n /\n Show a small inline spinner to the left of the label while keeping the\n * label visible. Pair with `disabled` to make the button non-interactive.\n * If `loading` is also true, `loading` takes precedence.\n \n @memberof ButtonComponent\n /\n @Input() loadingWithLabel = false;\n\n /\n Indicator of the button width\n \n @memberof ButtonComponent\n /\n @Input() fullWidth = false;\n\n /\n Url of button if it is a link\n \n @memberof ButtonComponent\n /\n @Input() url?: string;\n\n /\n Url's target of button if it is a link\n \n @type {@type {LinkUrlTarget}}\n * @memberof ButtonComponent\n /\n @Input() urlTarget?: LinkUrlTarget;\n\n /\n Button value\n \n @memberof ButtonComponent\n /\n @Input() value?: string;\n\n /\n @property tooltip\n * @description The tooltip that is displayed on hover. Required for icon-button type\n * @type {string}\n * @memberof ButtonComponent\n /\n @Input() tooltip = '';\n\n /\n @property isPremium\n * @description The icon that is displayed for Premium button\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input() isPremium = false;\n\n /\n The type of the button.\n \n @type {ButtonType}\n * @memberof ButtonComponent\n * @default 'button'\n /\n @Input() type: ButtonType = 'button';\n\n /\n Color of the button.\n * Defaults to Test Gorilla primary color.\n \n @type {string}\n * @memberof ButtonComponent\n /\n @Input() companyColor: string \| null = '';\n\n /\n Config for the button badge variation\n * @type {ButtonBadgeConfig}\n * @property badgeType Type of badge on the button\n * @property badgeLabel Label text for the badge\n * @property badgeNotificationAmount The amount for notification in the badge\n /\n @Input() buttonBadgeConfig: ButtonBadgeConfig \| undefined;\n\n /\n \n * Defines the application theme where buttons is used\n \n @type {ApplicationTheme}\n * @memberof ButtonComponent\n /\n @HostBinding('attr.theme')\n @Input()\n applicationTheme: ApplicationTheme = 'light';\n\n /* The premium marker reads as the warning badge does, so the two are recognisably the same signal. /\n protected readonly premiumMarkerColor = Color.BLACK;\n\n /\n \n * Disabled button scale on click\n \n @type {boolean}\n * @memberof ButtonComponent\n /\n @Input() disabledScaleOnClick = false;\n\n /\n A string representing the ARIA label for accessibility.\n * This label is used to provide an accessible name for the input element.\n * @type {string}\n * @memberof ButtonComponent\n /\n @Input() ariaLabel: string;\n\n /\n Whether the button controls a disclosure widget that is currently expanded.\n * Set to `true` for an expanded disclosure, `false` for collapsed, or leave\n * undefined when the button is not a disclosure trigger.\n * @memberof ButtonComponent\n /\n @Input() ariaExpanded?: boolean;\n\n /\n The id of the element controlled by this button (used together with\n * `ariaExpanded` for disclosure semantics).\n * @memberof ButtonComponent\n /\n @Input() ariaControls?: string;\n\n /\n Whether the button is a toggle button currently in the pressed state.\n * Use `true` / `false` for two-state toggles. Leave undefined when the\n * button is not a toggle.\n * @memberof ButtonComponent\n /\n @Input() ariaPressed?: boolean;\n\n /\n The kind of popup the button opens, as `aria-haspopup`. Leave undefined when it opens none.\n * @memberof ButtonComponent\n /\n @Input() ariaHasPopup?: ButtonAriaHasPopup;\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input() ariaRequired = false;\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {string}\n * @memberof ButtonComponent\n /\n @Input() ariaLabelledby = '';\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {string}\n * @memberof ButtonComponent\n /\n @Input() ariaDescribedby = '';\n\n /\n Prevents default button click behavior\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input({ transform: booleanAttribute }) preventDefault = false;\n\n /\n Ghost variant with white background\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input({ transform: booleanAttribute }) hasBackground = false;\n\n /\n Draws an icon-only button as a circle on any variant: 32px when small, 40px when medium and 48px when big.\n * Has no effect on buttons that show a label, on the classic theme or on `icon-button`, which is already round.\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input({ transform: booleanAttribute }) circular = false;\n\n /\n Keeps the label on one line with an ellipsis; a label that gets cut off is shown as the tooltip.\n * @type {boolean}\n * @memberof ButtonComponent\n /\n @Input({ transform: booleanAttribute }) isSingleLineLabel = false;\n\n /\n `square` gives an `icon-button` rounded corners instead of a circle. Has no effect on other variants.\n * @type {IconButtonShape}\n * @memberof ButtonComponent\n /\n @Input() iconButtonShape: IconButtonShape = 'round';\n\n /\n Sets tooltip position\n \n @type {TooltipPosition}\n * @memberof ButtonComponent\n /\n @Input() tooltipPosition: TooltipPosition = 'below';\n\n @Input() role = 'button';\n\n @Input() iconFilled = false;\n\n @Input() testId: string \| null = null;\n\n @Output() buttonClickEvent: EventEmitter<Event> = new EventEmitter<Event>();\n\n @Output() buttonHoverEvent: EventEmitter<Event> = new EventEmitter<Event>();\n\n @ViewChild('buttonElement', { static: false }) buttonElement: MatButton;\n\n get isDisabled(): boolean {\n return this.disabled;\n }\n\n @HostBinding('style.--color')\n get compColor() {\n return this.getCompanyColor;\n }\n\n classCss: string;\n styleCss: Record<string, string>;\n isButtonLink: boolean;\n isLabel: boolean;\n buttonState: ButtonState;\n hover = false;\n iconButtonSize: IconButtonSize = '40';\n allowButtonTypeForPremium: ButtonColor[] = [\n 'secondary',\n 'secondary-inverted',\n 'primary',\n 'ghost',\n 'outlined',\n 'destructive',\n 'icon-button',\n ];\n isFilledIcon: boolean;\n coloredIcons = ['Google-in-line', 'Google', 'Google-filled', 'Linkedin-brand-filled', 'Linkedin-brand-in-line'];\n labelEllipsis = false;\n icon: IconName = '';\n trailingIcon: IconName = '';\n\n private static nextAriaLabelledId = 0;\n ariaLabelledbyId = '';\n\n get typeIncluded(): boolean {\n return this.allowButtonTypeForPremium.includes(this.variant);\n }\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n ngOnInit(): void {\n this.classCss = this.setCssClass();\n this.styleCss = this.setCssStyle();\n this.isButtonLink = this.showButtonLink();\n this.isLabel = this.showLabel();\n this.createAriaLabelledById();\n }\n\n ngOnChanges(changes: SimpleChanges) {\n if (changes['disabled']) {\n this.buttonState = 'default';\n }\n if (!this.applicationTheme) {\n this.applicationTheme = 'light';\n }\n if (changes['type']) {\n this.isButtonLink = this.showButtonLink();\n }\n if (changes['loading']) {\n this.isLabel = this.showLabel();\n }\n if (changes['iconName']) {\n this.icon = changes['iconName'].currentValue as IconName;\n }\n if (changes['trailingIconName']) {\n this.trailingIcon = changes['trailingIconName'].currentValue as IconName;\n }\n if (this.hasCssAffectingChange(changes)) {\n this.classCss = this.setCssClass();\n this.styleCss = this.setCssStyle();\n }\n if (this.isIconButtonSizeChange(changes)) {\n this.iconButtonSize = this.setIconButtonSize();\n }\n\n this.isFilledIcon = this.isFilledIconVariant();\n }\n\n private hasCssAffectingChange(changes: SimpleChanges): boolean {\n return Boolean(\n changes['type'] \|\|\n changes['fullWidth'] \|\|\n changes['iconName'] \|\|\n changes['trailingIconName'] \|\|\n changes['trailingIconFilled'] \|\|\n changes['justIcon'] \|\|\n changes['iconPosition'] \|\|\n changes['disabled'] \|\|\n changes['companyColor'] \|\|\n changes['variant'] \|\|\n changes['applicationTheme']\n );\n }\n\n private isIconButtonSizeChange(changes: SimpleChanges): boolean {\n return (\n changes['variant']?.currentValue === 'icon-button' \|\|\n (changes['variant']?.currentValue === 'menuTrigger' && this.applicationTheme !== 'classic')\n );\n }\n\n private isFilledIconVariant(): boolean {\n return (\n this.applicationTheme !== 'classic' &&\n (this.variant === 'primary' \|\|\n this.variant === 'secondary' \|\|\n this.variant === 'secondary-inverted' \|\|\n this.variant === 'linkedin')\n );\n }\n\n ngAfterViewInit(): void {\n this.tooltipElement.nativeElement.onclick = ev => {\n ev.preventDefault();\n ev.stopPropagation();\n };\n }\n\n buttonClick(event: Event): void {\n if (this.preventDefault) {\n event.preventDefault();\n event.stopPropagation();\n }\n this.buttonClickEvent.emit(event);\n }\n\n buttonHover(event: Event): void {\n if (event.type === 'mouseenter') {\n this.hover = true;\n this.buttonHoverEvent.emit(event);\n this.buttonState = 'hover';\n if (this.shouldChangeFilledStatus && this.icon) {\n this.icon = this.getIconName(this.iconName as IconName, '-filled');\n }\n if (this.trailingIcon && this.canToggleFilled(this.trailingIcon)) {\n this.trailingIcon = this.getIconName(this.trailingIconName as IconName, '-filled');\n }\n } else {\n this.hover = false;\n if (this.shouldChangeFilledStatus && this.icon) {\n this.icon = this.iconName as IconName;\n }\n if (this.trailingIcon && this.canToggleFilled(this.trailingIcon)) {\n this.trailingIcon = this.trailingIconName as IconName;\n }\n this.buttonState = 'default';\n }\n\n this.styleCss = this.setCssStyle();\n }\n\n //Show or hide label\n showLabel(): boolean {\n return !this.loading;\n }\n\n //Set css class according inputs\n setCssClass(): string {\n const width = this.fullWidth ? 'full-width' : '';\n const hasIcon = this.iconName === null ? '' : 'icon';\n const justIcon = this.justIcon \|\| this.variant === 'icon-button' ? 'only-icon' : '';\n const iconPosition = this.iconPosition ?? '';\n const disabled = this.disabled && this.variant === 'primary' ? 'primary-disabled' : '';\n const variant = this.variant === 'ghost' && this.applicationTheme === 'classic' ? 'outlined' : this.variant;\n const companyColor = this.companyColor ? 'has-company-color' : '';\n return `${this.size} ${iconPosition} ${variant} ${width} ${hasIcon} ${justIcon} ${disabled} ${companyColor} ${this.applicationTheme}-theme`;\n }\n\n setCssStyle(): Record<string, string> {\n this.buttonState = this.disabled ? 'disabled' : this.buttonState;\n return (\n this.getInteractiveStyle() ??\n this.getClassicInteractiveStyle() ??\n this.getCompanyColorStyle() ??\n this.getGhostBackgroundStyle() ??\n {}\n );\n }\n\n private get isColorVariant(): boolean {\n return this.variant === 'primary' \|\| this.variant === 'text' \|\| this.variant === 'text-inline';\n }\n\n private get isTextVariant(): boolean {\n return this.variant === 'text' \|\| this.variant === 'text-inline';\n }\n\n private getInteractiveStyle(): Record<string, string> \| null {\n if (this.buttonState !== 'hover' && this.buttonState !== 'pressed') {\n return null;\n }\n if (!this.isColorVariant \|\| this.applicationTheme === 'classic') {\n return null;\n }\n const styleObj: Record<string, string> = {};\n styleObj[this.variant === 'primary' ? 'background-color' : 'color'] = adjustLightness(\n this.getCompanyColor,\n this.buttonState\n );\n if (this.isTextVariant) {\n styleObj['--active-color'] = this.companyColor\n ? adjustLightness(this.getCompanyColor, this.buttonState)\n : '#666666';\n }\n return styleObj;\n }\n\n private getClassicInteractiveStyle(): Record<string, string> \| null {\n if (this.buttonState === 'default') {\n return null;\n }\n if (!this.isColorVariant \|\| this.applicationTheme !== 'classic') {\n return null;\n }\n return {\n [this.variant === 'primary' ? 'background-color' : 'color']: adjustLightness(\n this.getCompanyColor,\n this.buttonState,\n 'classic'\n ),\n };\n }\n\n private getCompanyColorStyle(): Record<string, string> \| null {\n const isCompanyColorVariant =\n this.variant === 'link' \|\| this.variant === 'tertiary' \|\| this.variant === 'icon-button';\n if (!(this.getCompanyColor && isCompanyColorVariant)) {\n return null;\n }\n return { color: this.getCompanyColor };\n }\n\n private getGhostBackgroundStyle(): Record<string, string> \| null {\n return this.hasBackground ? { '--ghost-background': '#ffffff' } : null;\n }\n\n //Show or hide spinner\n get showSpinner(): boolean {\n const isNotTab = this.variant !== 'tab';\n const isNotLink = this.variant !== 'link';\n const isLoading = this.loading === true;\n return isLoading && isNotTab && isNotLink;\n }\n\n //Show or hide the inline spinner that sits next to the label\n get showInlineSpinner(): boolean {\n return (\n this.loadingWithLabel && !this.loading && this.variant !== 'tab' && this.variant !== 'link' && !this.justIcon\n );\n }\n\n //Show button with <button> or <a> tag\n showButtonLink(): boolean {\n return this.variant !== 'link';\n }\n\n setIconButtonSize(): IconButtonSize {\n return this.size === 'big' ? '40' : this.size === 'small' ? '24' : '32';\n }\n\n onPressed(ev: Event): void {\n if (ev.type === 'mousedown') {\n this.buttonState = 'pressed';\n } else {\n this.buttonState = this.hover ? 'hover' : 'default';\n }\n\n this.styleCss = this.setCssStyle();\n }\n\n focus(origin?: FocusOrigin): void {\n this.buttonElement.focus(origin);\n }\n\n get getCompanyColor(): string {\n return (\n // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- empty companyColor ('' is the default) falls back to the theme colour\n this.companyColor \|\|\n (this.variant === 'text' \|\| this.variant === 'text-inline'\n ? this.applicationTheme === 'dark'\n ? '#ffffff'\n : '#242424'\n : this.applicationTheme === 'classic'\n ? '#46A997'\n : '#D410AA')\n );\n }\n\n get shouldChangeFilledStatus(): boolean {\n return this.canToggleFilled(this.icon);\n }\n\n /\n Whether this specific icon may be swapped to its filled variant on hover. Takes the icon as an\n * argument because a button can render two, and a brand icon in one slot must not freeze the other.\n */\n canToggleFilled(icon: IconName): boolean {\n return (\n this.applicationTheme !== 'classic' &&\n this.variant !== 'primary' &&\n this.variant !== 'secondary' &&\n this.variant !== 'linkedin' &&\n !this.coloredIcons.includes(icon)\n );\n }\n\n onKeydown(event: KeyboardEvent): void {\n if (event.key === ' ') {\n event.preventDefault();\n const target = event.target as HTMLElement;\n target.click();\n }\n\n if (event.key === 'Enter' \|\| event.key === ' ') {\n this.buttonState = 'pressed';\n this.styleCss = this.setCssStyle();\n }\n }\n\n onKeyup(event: KeyboardEvent): void {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n this.buttonState = this.hover ? 'hover' : 'default';\n this.styleCss = this.setCssStyle();\n }\n }\n\n onLabelEllipsisChange(state: boolean): void {\n this.labelEllipsis = state;\n }\n\n getIconName(iconName: string, defaultValue: string): IconName {\n if (iconName.includes('filled')) {\n return iconName.replace(/filled/, 'in-line') as IconName;\n } else if (iconName.includes('in-line')) {\n return iconName.replace(/in-line/, 'filled') as IconName;\n }\n // Only append when the result is a real icon; otherwise it falls outside the IconName union.\n const suffixed = iconName + defaultValue;\n return this.isKnownIconName(suffixed) ? suffixed : (iconName as IconName);\n }\n\n private isKnownIconName(name: string): name is IconName {\n return (tgoRebrandIcons as readonly string[]).includes(name) \|\| (tgoIcons as readonly string[]).includes(name);\n }\n\n private createAriaLabelledById(): void {\n const labelledByValue = this.variant === 'link' ? 'labelledby-link' : 'labelledby';\n this.ariaLabelledbyId = `${labelledByValue}-uiButton-${++ButtonComponent.nextAriaLabelledId}`;\n }\n}\n","<div\n #tooltipElement\n class=\"tooltip\"\n [matTooltip]=\"tooltip ? tooltip : labelEllipsis ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n></div>\n<div\n class=\"button-wrapper\"\n [ngClass]=\"{\n 'full-width': fullWidth,\n 'rounded-icon': applicationTheme !== 'classic' && icon && !label,\n circular: circular && justIcon && variant !== 'icon-button' && applicationTheme !== 'classic',\n 'single-line-label': isSingleLineLabel,\n 'square-icon-button': variant === 'icon-button' && iconButtonShape === 'square',\n link: !isButtonLink,\n }\"\n>\n <div\n class=\"button-container\"\n [ngClass]=\"{\n disabled: disabled,\n 'button-scale': buttonState === 'pressed' && applicationTheme !== 'classic' && !disabledScaleOnClick,\n }\"\n >\n @if (isPremium && typeIncluded) {\n <span class=\"right-top premium-marker\">\n <ui-icon name=\"Premium-in-line\" size=\"16\" [color]=\"premiumMarkerColor\"></ui-icon>\n </span>\n }\n @if (buttonBadgeConfig?.badgeType) {\n <ui-badge\n id=\"badge\"\n [rebrandColor]=\"buttonBadgeConfig?.rebrandColor ?? 'brand'\"\n [variant]=\"buttonBadgeConfig!.badgeType!\"\n [label]=\"buttonBadgeConfig?.badgeLabel ?? ''\"\n [notificationsAmount]=\"buttonBadgeConfig?.badgeNotificationAmount ?? 0\"\n class=\"right-top\"\n [ngClass]=\"[\n buttonBadgeConfig?.badgeType === 'primary' ? 'badge-primary' : '',\n buttonBadgeConfig?.badgeType === 'notification' ? 'badge-notification' : '',\n variant,\n ]\"\n ></ui-badge>\n }\n @if (isButtonLink) {\n <button\n [style]=\"'--icon-button-size:' + iconButtonSize + 'px'\"\n [ngClass]=\"classCss\"\n [ngStyle]=\"styleCss\"\n [disabled]=\"disabled\"\n (click)=\"buttonClick($event)\"\n (mouseleave)=\"buttonHover($event)\"\n (mouseenter)=\"buttonHover($event)\"\n (mousedown)=\"onPressed($event)\"\n (mouseup)=\"onPressed($event)\"\n (keydown)=\"onKeydown($event)\"\n (keyup)=\"onKeyup($event)\"\n [attr.aria-required]=\"ariaRequired\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledbyId\"\n [attr.aria-describedby]=\"'describedby'\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-pressed]=\"ariaPressed\"\n [attr.aria-haspopup]=\"ariaHasPopup\"\n [attr.data-testid]=\"testId\"\n [type]=\"type\"\n [disableRipple]=\"applicationTheme !== 'classic'\"\n [matTooltip]=\"tooltip ? tooltip : labelEllipsis ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n [matTooltipPosition]=\"tooltipPosition\"\n #buttonElement\n [attr.role]=\"role\"\n mat-flat-button\n >\n <span id=\"describedby\" [style.display]=\"'none'\">\n {{ isPremium ? label + ' ' + ('BUTTON.PREMIUM_FEATURE' \| uiTranslate \| async) : ariaDescribedby }}\n </span>\n <span [id]=\"ariaLabelledbyId\" [style.display]=\"'none'\">\n {{ ariaLabelledby }}\n </span>\n @if (showSpinner) {\n <span class=\"spinner-wrapper\">\n <mat-spinner class=\"position-spinner\" aria-label=\"loading\" mode=\"indeterminate\" diameter=\"24\"></mat-spinner>\n </span>\n } @else {\n @if (justIcon && !!icon) {\n <span class=\"icon-only-wrapper\">\n <span class=\"icon only\" role=\"label\">\n <ui-icon\n [color]=\"variant === 'ghost-ai' ? 'ai' : 'inherit'\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"icon\"\n [filled]=\"isFilledIcon \|\| iconFilled\"\n [useFullIconName]=\"variant === 'primary' \|\| variant === 'secondary' \|\| variant === 'linkedin'\"\n [size]=\"size === 'small' ? '16' : '24'\"\n ></ui-icon>\n </span>\n </span>\n }\n @if (!justIcon) {\n <span class=\"icon-label-wrapper\" [ngClass]=\"{ 'center-text': iconName === '' }\">\n @if (showInlineSpinner) {\n <span class=\"icon inline-spinner\" aria-hidden=\"true\">\n <mat-spinner\n aria-label=\"loading\"\n mode=\"indeterminate\"\n [diameter]=\"size === 'small' ? 16 : 20\"\n ></mat-spinner>\n </span>\n }\n @if (iconPosition === 'left' && !!iconName && !showInlineSpinner) {\n <span class=\"icon\" aria-hidden=\"true\">\n <ui-icon\n [color]=\"variant === 'ghost-ai' ? 'ai' : 'inherit'\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"icon\"\n [filled]=\"isFilledIcon \|\| iconFilled\"\n [useFullIconName]=\"variant === 'primary' \|\| variant === 'secondary' \|\| variant === 'linkedin'\"\n [size]=\"size === 'small' ? '16' : '24'\"\n ></ui-icon>\n </span>\n }\n @if (isLabel) {\n <span\n class=\"label\"\n id=\"label\"\n uiEllipseText\n [isMultiline]=\"!isSingleLineLabel\"\n [refresh]=\"label\"\n (onChangeTextState)=\"onLabelEllipsisChange($event)\"\n >\n {{ label }}\n </span>\n }\n @if (iconPosition === 'right' && !!icon) {\n <span class=\"icon\" aria-hidden=\"true\"\n ><ui-icon\n [color]=\"variant === 'ghost-ai' ? 'ai' : 'inherit'\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"icon\"\n [filled]=\"isFilledIcon \|\| iconFilled\"\n [size]=\"size === 'small' ? '16' : '24'\"\n [useFullIconName]=\"variant === 'primary' \|\| variant === 'secondary' \|\| variant === 'linkedin'\"\n ></ui-icon\n ></span>\n }\n @if (!!trailingIcon && !showInlineSpinner) {\n <span class=\"icon trailing\" aria-hidden=\"true\"\n ><ui-icon\n [color]=\"variant === 'ghost-ai' ? 'ai' : 'inherit'\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"trailingIcon\"\n [filled]=\"isFilledIcon \|\| trailingIconFilled\"\n [size]=\"size === 'small' ? '16' : '24'\"\n [useFullIconName]=\"variant === 'primary' \|\| variant === 'secondary' \|\| variant === 'linkedin'\"\n ></ui-icon\n ></span>\n }\n </span>\n }\n }\n </button>\n }\n @if (!isButtonLink) {\n <a\n #buttonElement\n [ngClass]=\"classCss\"\n [ngStyle]=\"styleCss\"\n [disabled]=\"disabled\"\n (click)=\"buttonClick($event)\"\n (mouseenter)=\"buttonHover($event)\"\n (mouseleave)=\"buttonHover($event)\"\n (mousedown)=\"onPressed($event)\"\n (mouseup)=\"onPressed($event)\"\n (keydown)=\"onKeydown($event)\"\n (keyup)=\"onKeyup($event)\"\n [disableRipple]=\"true\"\n [attr.aria-required]=\"ariaRequired\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledbyId\"\n [attr.aria-describedby]=\"'describedby-link'\"\n [attr.aria-disabled]=\"disabled\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-pressed]=\"ariaPressed\"\n [attr.aria-haspopup]=\"ariaHasPopup\"\n [attr.data-testid]=\"testId\"\n [matTooltip]=\"tooltip ? tooltip : labelEllipsis ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n role=\"link\"\n [href]=\"url\"\n [target]=\"urlTarget\"\n mat-flat-button\n >\n <span id=\"describedby-link\" [style.display]=\"'none'\">\n {{ ariaDescribedby }}\n </span>\n <span [id]=\"ariaLabelledbyId\" [style.display]=\"'none'\">\n {{ ariaLabelledby }}\n </span>\n <span class=\"icon-label-wrapper\">\n {{ label }}\n </span>\n </a>\n }\n </div>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\nimport { MatRadioModule } from '@angular/material/radio';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { BadgeComponentModule } from '@testgorilla/tgo-ui/components/badge';\nimport { EllipseTextDirective, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\n\nimport { ButtonComponent } from './button.component';\n\n@NgModule({\n imports: [\n CommonModule,\n MatButtonModule,\n IconComponentModule,\n MatProgressSpinnerModule,\n MatTooltipModule,\n BadgeComponentModule,\n EllipseTextDirective,\n MatRadioModule,\n UiTranslatePipe,\n ButtonComponent,\n ],\n exports: [ButtonComponent],\n providers: [],\n})\nexport class ButtonComponentModule {}\n"],"mappings":"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"}

package/fesm2022/testgorilla-tgo-ui-components-checklist.mjs CHANGED Viewed

@@ -250,12 +250,15 @@ var ChecklistComponent = class ChecklistComponent {
 						"ariaExpanded",
 						"ariaControls",
 						"ariaPressed",
+						"ariaHasPopup",
 						"ariaRequired",
 						"ariaLabelledby",
 						"ariaDescribedby",
 						"preventDefault",
 						"hasBackground",
 						"circular",
+						"isSingleLineLabel",
+						"iconButtonShape",
 						"tooltipPosition",
 						"role",
 						"iconFilled",

package/fesm2022/testgorilla-tgo-ui-components-checklist.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-checklist.mjs","names":[],"sources":["../../../components/checklist/checklist.component.ts","../../../components/checklist/checklist.component.html"],"sourcesContent":["import { AsyncPipe } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Inject, Optional, computed, input, model, output } from '@angular/core';\n\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport {\n ApplicationTheme,\n IKeyboardEvent,\n UiTranslatePipe,\n LanguageService,\n} from '@testgorilla/tgo-ui/components/core';\nimport { DividerComponentModule } from '@testgorilla/tgo-ui/components/divider';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ProgressBarComponentModule } from '@testgorilla/tgo-ui/components/progress-bar';\nimport { RadioButtonComponentModule } from '@testgorilla/tgo-ui/components/radio-button';\n\nimport type { ChecklistItem } from './checklist.model';\n\n@Component({\n selector: 'ui-checklist',\n imports: [\n ProgressBarComponentModule,\n RadioButtonComponentModule,\n IconComponentModule,\n ButtonComponentModule,\n DividerComponentModule,\n UiTranslatePipe,\n AsyncPipe,\n ],\n templateUrl: './checklist.component.html',\n styleUrl: './checklist.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ChecklistComponent {\n /*\n Label for the checklist\n * @type {string}\n * @memberof ChecklistComponent\n /\n label = input('');\n\n /\n Sub title/Description for the checklist\n * @type {string}\n * @memberof ChecklistComponent\n /\n description = input<string \| null>(null);\n\n /\n Items for the checklist\n * @type {ModelSignal<ChecklistItem[]>}\n * @memberof ChecklistComponent\n /\n items = model<ChecklistItem[]>([]);\n\n /\n Application theme\n * @type {ApplicationTheme}\n * @memberof ChecklistComponent\n /\n applicationTheme = input<ApplicationTheme \| undefined>(undefined);\n readonly theme = computed(() => this.applicationTheme() ?? this.defaultAppTheme);\n\n /\n Confirm button label\n * @type {string}\n * @memberof ChecklistComponent\n /\n footerButtonLabel = input<string \| undefined>(undefined);\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {string}\n * @memberof ChecklistComponent\n /\n ariaLabel = input<string \| undefined>(undefined);\n\n /\n The language to be used\n * @property language\n * @type {Language}\n * @memberof ChecklistComponent\n /\n language = input(LanguageService.defaultLanguage);\n\n /\n A boolean property that determines whether the checklist items should be automatically checked.\n \n @type {boolean}\n /\n autocheck = input(true);\n\n readonly testId = input<string \| null>(null);\n\n protected itemTestId(value: string): string {\n const testId = this.testId();\n return testId ? `${testId}-${value}` : 'checklist-item';\n }\n\n /\n Event emitter that triggers when the footer button is clicked.\n * Emits a void event.\n /\n footerButtonClicked = output<void>();\n\n /\n An output event emitter that signifies the completion of a task or process.\n * This event does not carry any payload.\n /\n readonly completed = output<void>();\n\n /\n Represents the currently selected item in the checklist.\n * This is an instance of the `ChecklistItem` supports two-way binding.\n /\n selectedItem = model<ChecklistItem>();\n\n readonly currentIndex = computed(() => {\n const items = this.items();\n const selectedItem = this.selectedItem();\n return selectedItem ? items.indexOf(selectedItem) : -1;\n });\n\n protected progress = computed(() => {\n const items = this.items();\n const total = items.length;\n const checked = items.filter(item => item.checked).length;\n const progressValue = Number(((checked / total) 100).toFixed(0));\n if (progressValue === 100) {\n this.completed.emit();\n }\n return progressValue;\n });\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {}\n\n selectItem(item: ChecklistItem) {\n if ((item.checked \|\| item.disabled \|\| this.selectedItem() === item) && !item.reselect) {\n return;\n }\n if (this.autocheck()) {\n item.checked = item?.reselect ? !item.checked : true;\n this.items.set([...this.items()]);\n }\n this.selectedItem.set(item);\n }\n\n keydownHandler($event: KeyboardEvent, item: ChecklistItem) {\n if ((IKeyboardEvent.SPACE as string) === $event.key \|\| (IKeyboardEvent.ENTER as string) === $event.key) {\n $event.preventDefault();\n this.selectItem(item);\n }\n }\n\n next() {\n const currentIndex = this.currentIndex();\n if (currentIndex < this.items().length - 1) {\n this.selectItem(this.items()[currentIndex + 1]);\n }\n }\n\n prev() {\n const currentIndex = this.currentIndex();\n if (currentIndex > 0) {\n this.selectItem(this.items()[currentIndex - 1]);\n }\n }\n\n footerButtonClick(event: Event) {\n event.preventDefault();\n this.footerButtonClicked.emit();\n }\n}\n","@if (label()) {\n <h4 [attr.aria-label]=\"ariaLabel() ?? label()\">{{ label() }}</h4>\n}\n@if (description()) {\n <div aria-label=\"description\" class=\"description\" [innerHTML]=\"description()\"></div>\n}\n\n<ui-progress-bar [showPercentage]=\"true\" [progress]=\"progress()\"></ui-progress-bar>\n\n<div style=\"position: absolute; left: -9999px\" [attr.aria-live]=\"'polite'\">\n {{ 'COMMON.PROGRESS' \| uiTranslate: { progress: progress() } \| async }}\n</div>\n\n<ui-divider size=\"small\" companyColor=\"#d3d3d3\"> </ui-divider>\n\n<div class=\"checklist-container\" [attr.data-testid]=\"testId() ?? 'checklist-container'\">\n @for (item of items(); track item.value + item.checked; let i = $index) {\n <div\n [attr.data-testid]=\"itemTestId(item.value)\"\n class=\"checklist-item\"\n [class.disabled]=\"item.disabled\"\n [class.checked]=\"item.checked\"\n [class.active]=\"item === selectedItem() && !autocheck()\"\n [attr.aria-labelledby]=\"'item-' + item.value\"\n [tabindex]=\"item?.disabled ? -1 : 0\"\n (click)=\"selectItem(item)\"\n (keydown)=\"keydownHandler($event, item)\"\n >\n <div class=\"content\">\n <ui-icon\n [name]=\"item.checked ? 'Check-in-line' : 'Circle-in-line'\"\n [filled]=\"item.checked\"\n class=\"checked\"\n [applicationTheme]=\"theme()\"\n [size]=\"'16'\"\n [color]=\"item.checked ? 'white' : item.disabled ? '#919191' : 'dark'\"\n ></ui-icon>\n <div class=\"label-and-description\">\n <span [id]=\"'item-' + item.value\" class=\"label\">{{ item.label }}</span>\n @if (item.description) {\n <span class=\"item-description\">{{ item.description }}</span>\n }\n </div>\n </div>\n\n @if (item.hasLink && !item.disabled) {\n <div class=\"navigation\">\n <ui-icon\n [tabindex]=\"-1\"\n class=\"link\"\n [name]=\"'Arrow-chevron-right-filled'\"\n [applicationTheme]=\"theme()\"\n [size]=\"'24'\"\n color=\"rebrand-black\"\n ></ui-icon>\n </div>\n }\n </div>\n }\n</div>\n@if (footerButtonLabel()) {\n <div class=\"action-btn\">\n <ui-button\n data-testid=\"checklist-footer-button\"\n [label]=\"footerButtonLabel()!\"\n [variant]=\"'link'\"\n [companyColor]=\"'#000'\"\n (buttonClickEvent)=\"footerButtonClick($event)\"\n ></ui-button>\n </div>\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-checklist.mjs","names":[],"sources":["../../../components/checklist/checklist.component.ts","../../../components/checklist/checklist.component.html"],"sourcesContent":["import { AsyncPipe } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Inject, Optional, computed, input, model, output } from '@angular/core';\n\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport {\n ApplicationTheme,\n IKeyboardEvent,\n UiTranslatePipe,\n LanguageService,\n} from '@testgorilla/tgo-ui/components/core';\nimport { DividerComponentModule } from '@testgorilla/tgo-ui/components/divider';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ProgressBarComponentModule } from '@testgorilla/tgo-ui/components/progress-bar';\nimport { RadioButtonComponentModule } from '@testgorilla/tgo-ui/components/radio-button';\n\nimport type { ChecklistItem } from './checklist.model';\n\n@Component({\n selector: 'ui-checklist',\n imports: [\n ProgressBarComponentModule,\n RadioButtonComponentModule,\n IconComponentModule,\n ButtonComponentModule,\n DividerComponentModule,\n UiTranslatePipe,\n AsyncPipe,\n ],\n templateUrl: './checklist.component.html',\n styleUrl: './checklist.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ChecklistComponent {\n /*\n Label for the checklist\n * @type {string}\n * @memberof ChecklistComponent\n /\n label = input('');\n\n /\n Sub title/Description for the checklist\n * @type {string}\n * @memberof ChecklistComponent\n /\n description = input<string \| null>(null);\n\n /\n Items for the checklist\n * @type {ModelSignal<ChecklistItem[]>}\n * @memberof ChecklistComponent\n /\n items = model<ChecklistItem[]>([]);\n\n /\n Application theme\n * @type {ApplicationTheme}\n * @memberof ChecklistComponent\n /\n applicationTheme = input<ApplicationTheme \| undefined>(undefined);\n readonly theme = computed(() => this.applicationTheme() ?? this.defaultAppTheme);\n\n /\n Confirm button label\n * @type {string}\n * @memberof ChecklistComponent\n /\n footerButtonLabel = input<string \| undefined>(undefined);\n\n /\n A string representing the ARIA requirement for accessibility.\n * This attribute is used to indicate whether an input field is required for form submission.\n * @type {string}\n * @memberof ChecklistComponent\n /\n ariaLabel = input<string \| undefined>(undefined);\n\n /\n The language to be used\n * @property language\n * @type {Language}\n * @memberof ChecklistComponent\n /\n language = input(LanguageService.defaultLanguage);\n\n /\n A boolean property that determines whether the checklist items should be automatically checked.\n \n @type {boolean}\n /\n autocheck = input(true);\n\n readonly testId = input<string \| null>(null);\n\n protected itemTestId(value: string): string {\n const testId = this.testId();\n return testId ? `${testId}-${value}` : 'checklist-item';\n }\n\n /\n Event emitter that triggers when the footer button is clicked.\n * Emits a void event.\n /\n footerButtonClicked = output<void>();\n\n /\n An output event emitter that signifies the completion of a task or process.\n * This event does not carry any payload.\n /\n readonly completed = output<void>();\n\n /\n Represents the currently selected item in the checklist.\n * This is an instance of the `ChecklistItem` supports two-way binding.\n /\n selectedItem = model<ChecklistItem>();\n\n readonly currentIndex = computed(() => {\n const items = this.items();\n const selectedItem = this.selectedItem();\n return selectedItem ? items.indexOf(selectedItem) : -1;\n });\n\n protected progress = computed(() => {\n const items = this.items();\n const total = items.length;\n const checked = items.filter(item => item.checked).length;\n const progressValue = Number(((checked / total) 100).toFixed(0));\n if (progressValue === 100) {\n this.completed.emit();\n }\n return progressValue;\n });\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {}\n\n selectItem(item: ChecklistItem) {\n if ((item.checked \|\| item.disabled \|\| this.selectedItem() === item) && !item.reselect) {\n return;\n }\n if (this.autocheck()) {\n item.checked = item?.reselect ? !item.checked : true;\n this.items.set([...this.items()]);\n }\n this.selectedItem.set(item);\n }\n\n keydownHandler($event: KeyboardEvent, item: ChecklistItem) {\n if ((IKeyboardEvent.SPACE as string) === $event.key \|\| (IKeyboardEvent.ENTER as string) === $event.key) {\n $event.preventDefault();\n this.selectItem(item);\n }\n }\n\n next() {\n const currentIndex = this.currentIndex();\n if (currentIndex < this.items().length - 1) {\n this.selectItem(this.items()[currentIndex + 1]);\n }\n }\n\n prev() {\n const currentIndex = this.currentIndex();\n if (currentIndex > 0) {\n this.selectItem(this.items()[currentIndex - 1]);\n }\n }\n\n footerButtonClick(event: Event) {\n event.preventDefault();\n this.footerButtonClicked.emit();\n }\n}\n","@if (label()) {\n <h4 [attr.aria-label]=\"ariaLabel() ?? label()\">{{ label() }}</h4>\n}\n@if (description()) {\n <div aria-label=\"description\" class=\"description\" [innerHTML]=\"description()\"></div>\n}\n\n<ui-progress-bar [showPercentage]=\"true\" [progress]=\"progress()\"></ui-progress-bar>\n\n<div style=\"position: absolute; left: -9999px\" [attr.aria-live]=\"'polite'\">\n {{ 'COMMON.PROGRESS' \| uiTranslate: { progress: progress() } \| async }}\n</div>\n\n<ui-divider size=\"small\" companyColor=\"#d3d3d3\"> </ui-divider>\n\n<div class=\"checklist-container\" [attr.data-testid]=\"testId() ?? 'checklist-container'\">\n @for (item of items(); track item.value + item.checked; let i = $index) {\n <div\n [attr.data-testid]=\"itemTestId(item.value)\"\n class=\"checklist-item\"\n [class.disabled]=\"item.disabled\"\n [class.checked]=\"item.checked\"\n [class.active]=\"item === selectedItem() && !autocheck()\"\n [attr.aria-labelledby]=\"'item-' + item.value\"\n [tabindex]=\"item?.disabled ? -1 : 0\"\n (click)=\"selectItem(item)\"\n (keydown)=\"keydownHandler($event, item)\"\n >\n <div class=\"content\">\n <ui-icon\n [name]=\"item.checked ? 'Check-in-line' : 'Circle-in-line'\"\n [filled]=\"item.checked\"\n class=\"checked\"\n [applicationTheme]=\"theme()\"\n [size]=\"'16'\"\n [color]=\"item.checked ? 'white' : item.disabled ? '#919191' : 'dark'\"\n ></ui-icon>\n <div class=\"label-and-description\">\n <span [id]=\"'item-' + item.value\" class=\"label\">{{ item.label }}</span>\n @if (item.description) {\n <span class=\"item-description\">{{ item.description }}</span>\n }\n </div>\n </div>\n\n @if (item.hasLink && !item.disabled) {\n <div class=\"navigation\">\n <ui-icon\n [tabindex]=\"-1\"\n class=\"link\"\n [name]=\"'Arrow-chevron-right-filled'\"\n [applicationTheme]=\"theme()\"\n [size]=\"'24'\"\n color=\"rebrand-black\"\n ></ui-icon>\n </div>\n }\n </div>\n }\n</div>\n@if (footerButtonLabel()) {\n <div class=\"action-btn\">\n <ui-button\n data-testid=\"checklist-footer-button\"\n [label]=\"footerButtonLabel()!\"\n [variant]=\"'link'\"\n [companyColor]=\"'#000'\"\n (buttonClickEvent)=\"footerButtonClick($event)\"\n ></ui-button>\n </div>\n}\n"],"mappings":"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"}

package/fesm2022/testgorilla-tgo-ui-components-core.mjs CHANGED Viewed

@@ -1,6 +1,7 @@
 import * as i0 from "@angular/core";
 import { DestroyRef, Directive, ElementRef, EventEmitter, HostListener, Injectable, InjectionToken, Input, Output, Pipe, effect, inject, input } from "@angular/core";
 import { BehaviorSubject, Subject, Subscription, combineLatest, debounceTime, map, startWith } from "rxjs";
+import { DOCUMENT } from "@angular/common";
 import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
 import { BreakpointObserver } from "@angular/cdk/layout";
 var __defProp = Object.defineProperty;
@@ -140,12 +141,19 @@ var EllipseTextDirective = class EllipseTextDirective {
 		this.refreshEllipsis$ = new Subject();
 		this.onChangeTextState = new EventEmitter();
 		this.destroyRef = inject(DestroyRef);
+		this.document = inject(DOCUMENT);
 	}
 	ngOnInit() {
 		combineLatest([this.checkEllipsis$.pipe(startWith(null)), this.refreshEllipsis$.pipe(startWith(null))]).pipe(debounceTime(100), takeUntilDestroyed(this.destroyRef)).subscribe(() => {
 			const textElement = this.el.nativeElement;
 			this.onChangeTextState.emit(this.isMultiline ? textElement.clientHeight + this.maxDiffPixels < textElement.scrollHeight : textElement.clientWidth + this.maxDiffPixels < textElement.scrollWidth);
 		});
+		if (typeof ResizeObserver !== "undefined") {
+			const observer = new ResizeObserver(() => this.checkEllipsis$.next());
+			observer.observe(this.el.nativeElement);
+			this.destroyRef.onDestroy(() => observer.disconnect());
+		}
+		this.document.fonts?.ready.then(() => this.checkEllipsis$.next());
 	}
 	static {
 		this.ɵfac = i0.ɵɵngDeclareFactory({
@@ -1869,7 +1877,9 @@ var en_default = {
 		"MOBILE_CLOSE_LABEL": "Close sidebar",
 		"NAV_ARIA_LABEL": "Main",
 		"ANNOUNCE_COLLAPSED": "Sidebar collapsed",
-		"ANNOUNCE_EXPANDED": "Sidebar expanded"
+		"ANNOUNCE_EXPANDED": "Sidebar expanded",
+		"SUBMENU_LABEL": "{{label}} submenu",
+		"NEW_LABEL": "New"
 	},
 	AUTOCOMPLETE: {
 		"SELECTED_AMOUNT": "Selected ({{numberSelected}})",