@beeq/core 1.10.0 → 1.11.0-beta.1

package/dist/beeq/bq-option-list.bq-tag.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"bq-option-list.bq-tag.entry.esm.js","sources":["../../packages/beeq/src/components/option-list/scss/bq-option-list.scss?tag=bq-option-list&encapsulation=shadow","../../packages/beeq/src/components/option-list/bq-option-list.tsx","../../packages/beeq/src/components/tag/bq-tag.types.ts","../../packages/beeq/src/components/tag/helper/index.ts","../../packages/beeq/src/components/tag/scss/bq-tag.scss?tag=bq-tag&encapsulation=shadow","../../packages/beeq/src/components/tag/bq-tag.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/*                                Option list styles                */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-option-list.variables';\n\n:host {\n  @apply block;\n}\n","import { Component, Element, Event, h, Listen, Prop } from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\n\nimport { isEventTargetChildOfElement, isHTMLElement } from '../../shared/utils';\n\n/**\n * The option list component is a container for multiple option elements.\n * It allows to manage the appearance and size of all options at once.\n *\n * @example How to use it\n * ```html\n * <bq-option-list>\n *   <bq-option value=\"football\">Football</bq-option>\n *   <bq-option value=\"basketball\">Basketball</bq-option>\n *   <bq-option value=\"tennis\">Tennis</bq-option>\n * </bq-option-list>\n * ```\n *\n * @documentation https://storybook.beeq.design/?path=/story/components-option--default\n * @status stable\n *\n * @attr {string} aria-label - Aria label for the list.\n *\n * @slot - The option items\n *\n * @part base - The component's internal wrapper.\n *\n * @cssprop --bq-option-group--gapY-list - Option group gap between items Y axis\n */\n@Component({\n  tag: 'bq-option-list',\n  styleUrl: './scss/bq-option-list.scss',\n  shadow: true,\n})\nexport class BqOptionList {\n  // Own Properties\n  // ====================\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqOptionListElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  // Public Property API\n  // ========================\n\n  // Prop lifecycle events\n  // =======================\n\n  /** Aria label for the list. */\n  @Prop({ reflect: true }) ariaLabel: string = 'Options';\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Handler to be called when `bq-option` is selected (on click/enter press). */\n  @Event() bqSelect: EventEmitter<{ value: string; item: HTMLBqOptionElement }>;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentDidLoad() {\n    this.el.setAttribute('role', 'listbox');\n  }\n\n  // Listeners\n  // ==============\n\n  @Listen('bqClick', { passive: true })\n  @Listen('bqEnter', { passive: true })\n  onBqSelect(event: CustomEvent<HTMLElement>) {\n    const { target: item } = event;\n    if (!isHTMLElement(item, 'bq-option') || !isEventTargetChildOfElement(event, this.el)) return;\n\n    this.bqSelect.emit({ item, value: item.value });\n  }\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    return (\n      <div class=\"bq-option__list flex flex-col gap-y-[--bq-option-group--gapY-list]\" part=\"base\">\n        <slot />\n      </div>\n    );\n  }\n}\n","export const TAG_SIZE = ['xsmall', 'small', 'medium'] as const;\nexport type TTagSize = (typeof TAG_SIZE)[number];\n\nexport const TAG_COLOR = ['error', 'gray', 'info', 'success', 'warning'] as const;\nexport type TTagColor = (typeof TAG_COLOR)[number];\n\nexport const TAG_VARIANT = ['outline', 'filled'] as const;\nexport type TTagVariant = (typeof TAG_VARIANT)[number];\n\nexport const TAG_BORDER_RADIUS = ['none', 'xs2', 'xs', 's', 'm', 'l', 'full'] as const;\nexport type TTagBorderRadius = (typeof TAG_BORDER_RADIUS)[number];\n","import { TAG_COLOR, TAG_SIZE, TAG_VARIANT, TTagColor, TTagSize, TTagVariant } from '../bq-tag.types';\n\n/**\n * Function to determine the icon size based on the provided tag size.\n *\n * @param {TTagSize} size - The size of the tag.\n * @returns {number} The corresponding icon size. If the provided size does not match any predefined sizes, the function returns the size for 'medium'.\n */\nexport const iconSize = (size: TTagSize): number => {\n  const xsmall = TAG_SIZE[0];\n  const small = TAG_SIZE[1];\n  const medium = TAG_SIZE[2];\n\n  const SIZE = {\n    [xsmall]: 16,\n    [small]: 20,\n    [medium]: 24,\n  };\n\n  return SIZE[size] || SIZE[medium];\n};\n\n/**\n * Function to determine the tag text color scheme for a given tag type.\n *\n * @param {TTagType} color - The color of the tag.\n * @returns {Object} An object containing the color scheme for the given tag type. If the provided type does not match any predefined types, the function returns the color scheme for 'default'.\n */\nexport const textColor = (color: TTagColor): Partial<{ [K in TTagVariant]: string }> => {\n  const typeError = TAG_COLOR[0];\n  const typeGray = TAG_COLOR[1];\n  const typeInfo = TAG_COLOR[2];\n  const typeSuccess = TAG_COLOR[3];\n  const typeWarning = TAG_COLOR[4];\n\n  const variantOutline = TAG_VARIANT[0];\n  const variantFilled = TAG_VARIANT[1];\n\n  const COLORS = {\n    [typeError]: {\n      [variantOutline]: 'text--danger',\n      [variantFilled]: 'text--alt',\n    },\n    [typeGray]: {\n      [variantOutline]: 'text--primary',\n      [variantFilled]: 'text--alt',\n    },\n    [typeInfo]: {\n      [variantOutline]: 'text--brand',\n      [variantFilled]: 'text--alt',\n    },\n    [typeSuccess]: {\n      [variantOutline]: 'text--success',\n      [variantFilled]: 'text--alt',\n    },\n    [typeWarning]: {\n      [variantOutline]: 'text--warning',\n      [variantFilled]: 'text--alt',\n    },\n  };\n\n  return COLORS[color];\n};\n","/* -------------------------------------------------------------------------- */\n/*                        Tag styles                        */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-tag.variables';\n\n:host {\n  @apply relative inline-block;\n}\n\n:host([removable][hidden]) {\n  @apply hidden;\n}\n\n.bq-tag {\n  @apply box-border inline-flex select-none flex-row items-center justify-center bg-[--bq-tag--background-color];\n  @apply gap-[--bq-tag--medium-gap] font-medium leading-regular text-primary p-b-[--bq-tag--medium-padding-y] p-i-[--bq-tag--medium-padding-x];\n  @apply rounded-[--bq-tag--border-radius] border-[length:--bq-tag--border-width] border-[color:--bq-tag--border-color];\n  @apply transition-colors duration-300 ease-in-out;\n\n  border-style: var(--bq-tag--border-style);\n}\n\n/* ---------------------------------- Size ---------------------------------- */\n\n.bq-tag__xsmall,\n.bq-tag__small {\n  @apply gap-[--bq-tag--small-gap] p-b-[--bq-tag--small-padding-y] p-i-[--bq-tag--small-padding-x];\n\n  /* Apply predefined border radius only if the border property have NO VALUE */\n  &:not(.has-border) {\n    @apply rounded-[--bq-tag--small-border-radius];\n  }\n}\n\n/* --------------------------------- Action --------------------------------- */\n\n.bq-tag__default.is-clickable {\n  @apply cursor-pointer;\n  // Focus\n  @apply focus-visible:focus;\n  // Hover\n  @apply hover:enabled:bg-[color-mix(in_srgb,_var(--bq-tag--background-color),_var(--bq-hover)_20%)];\n  // Active/Selected\n  @apply [&.active]:text-alt [&.active]:[--bq-tag--background-color:--bq-ui--brand];\n  // Disabled\n  @apply disabled:cursor-not-allowed disabled:border-none disabled:opacity-60;\n}\n\n/* ------------------------------ Color styles ------------------------------ */\n\n.bq-tag__error {\n  &.bq-tag__filled {\n    @apply bg-ui-danger text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply bg-ui-danger-alt text-danger [--bq-tag--border-color:--bq-stroke--danger];\n  }\n}\n\n.bq-tag__gray {\n  &.bq-tag__filled {\n    @apply bg-ui-tertiary text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply bg-ui-primary text-primary [--bq-tag--border-color:--bq-stroke--tertiary];\n  }\n}\n\n.bq-tag__info {\n  &.bq-tag__filled {\n    @apply bg-ui-brand text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply bg-ui-brand-alt text-brand [--bq-tag--border-color:--bq-stroke--brand];\n  }\n}\n\n.bq-tag__success {\n  &.bq-tag__filled {\n    @apply bg-ui-success text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply bg-ui-success-alt text-success [--bq-tag--border-color:--bq-tag--border-success];\n  }\n}\n\n.bq-tag__warning {\n  &.bq-tag__filled {\n    @apply bg-ui-warning text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply border-warning bg-ui-warning-alt text-warning;\n  }\n}\n\n/* ------------------------------ Close button ------------------------------ */\n\n.bq-tag__close::part(button) {\n  @apply pointer-events-none border-0 bs-fit p-b-0 p-i-0;\n}\n\n/* --------------- Apply the right size to the bq-icon prefix --------------- */\n\n.bq-tag__prefix ::slotted(bq-icon) {\n  --bq-icon--size: var(--bq-tag--icon-prefix-size) !important;\n}\n","import { Component, Element, Event, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\n\nimport { TAG_COLOR, TAG_SIZE, TAG_VARIANT } from './bq-tag.types';\nimport type { TTagBorderRadius, TTagColor, TTagSize, TTagVariant } from './bq-tag.types';\nimport { iconSize, textColor } from './helper';\nimport { getColorCSSVariable, hasSlotContent, validatePropValue } from '../../shared/utils';\n\n/**\n * The Tag Component is a UI element used to label and categorize content within an application.\n * Tags are commonly used to label items with keywords or categories, making it easier to find and organize content.\n *\n * @example How to use it\n * ```html\n * <bq-tag color=\"success\" size=\"medium\" variant=\"filled\">Success</bq-tag>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/42f8c9-tag\n * @status stable\n *\n * @dependency bq-button\n * @dependency bq-icon\n *\n * @attr {string} border - The corner radius of the Tag (will override size's predefined border)\n * @attr {boolean} clickable - If `true`, the Tag can be clickable\n * @attr {\"error\" | \"gray\" | \"info\" | \"success\" | \"warning\"} color - The color style of the Tag\n * @attr {boolean} disabled - If `true`, the Tag will be disabled (only if clickable = `true`, no interaction allowed)\n * @attr {boolean} hidden - If `true`, the Tag component will hidden (only if removable = `true`)\n * @attr {boolean} removable - If `true`, the Tag component can be removed\n * @attr {boolean} selected - If `true`, the Tag is selected (only if clickable = `true`)\n * @attr {\"xsmall\" | \"small\" | \"medium\"} size - The size of the Tag component\n * @attr {\"outline\" | \"filled\"} variant - The variant of Tag to apply on top of the variant\n *\n * @method hide - Method to be called to remove the tag component\n * @method show - Method to be called to show the tag component\n *\n * @event bqClose - Callback handler to be called when the tag is close/hidden\n * @event bqOpen - Callback handler to be called when the tag is not open/shown\n * @event bqBlur - Handler to be called when tag loses focus\n * @event bqClick - Handler to be called when tag is clicked\n * @event bqFocus - Handler to be called when tag is focused\n *\n * @slot prefix - The prefix slot to add an icon or any other content before the text\n * @slot - The text content of the tag\n *\n * @part wrapper - The wrapper container `<div>` of the element inside the shadow DOM.\n * @part prefix - The `<span>` tag element that acts as prefix container (when icon exists in front of tag).\n * @part text - The `<div>` element containing the text of the tag component.\n * @part btn-close - The close button element to remove the tag component.\n *\n * @cssprop --bq-tag--background-color - Tag background color\n * @cssprop --bq-tag--border-color - Tag border color\n * @cssprop --bq-tag--border-radius - Tag border radius\n * @cssprop --bq-tag--border-style - Tag border style\n * @cssprop --bq-tag--border-width - Tag border width\n * @cssprop --bq-tag--small-border-radius - Tag small border radius\n * @cssprop --bq-tag--small-gap - Tag small gap between content\n * @cssprop --bq-tag--small-padding-x - Tag small padding horizontal\n * @cssprop --bq-tag--small-padding-y - Tag small padding vertical\n * @cssprop --bq-tag--medium-gap - Tag medium gap between content\n * @cssprop --bq-tag--medium-padding-x - Tag medium padding horizontal\n * @cssprop --bq-tag--medium-padding-y - Tag medium padding vertical\n */\n@Component({\n  tag: 'bq-tag',\n  styleUrl: './scss/bq-tag.scss',\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class BqTag {\n  // Own Properties\n  // ====================\n\n  private prefixElem: HTMLElement;\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqTagElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() private hasPrefix = false;\n\n  // Public Property API\n  // ========================\n\n  /** The corner radius of the Tag (will override size's predefined border) */\n  @Prop({ reflect: true }) border: TTagBorderRadius;\n\n  /** If true, the Tag can be clickable */\n  @Prop({ reflect: true }) clickable: boolean = false;\n\n  /** The color style of the Tag */\n  @Prop({ reflect: true }) color: TTagColor;\n\n  /** If true, the Tag will be disabled (only if clickable = `true`, no interaction allowed) */\n  @Prop({ reflect: true }) disabled?: boolean = false;\n\n  /** If true, the Tag component will hidden (only if removable = `true`) */\n  @Prop({ reflect: true, mutable: true }) hidden: boolean;\n\n  /** If true, the Tag component can be removed */\n  @Prop({ reflect: true }) removable: boolean = false;\n\n  /** If true, the Tag is selected (only if clickable = `true`) */\n  @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n\n  /** The size of the Tag component */\n  @Prop({ reflect: true }) size: TTagSize = 'medium';\n\n  /** The variant of Tag to apply on top of the variant */\n  @Prop({ reflect: true }) variant: TTagVariant = 'filled';\n\n  // Prop lifecycle events\n  // =======================\n\n  @Watch('size')\n  @Watch('variant')\n  checkPropValues() {\n    validatePropValue(TAG_SIZE, 'medium', this.el, 'size');\n    validatePropValue(TAG_VARIANT, 'filled', this.el, 'variant');\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Callback handler to be called when the tag is close/hidden  */\n  @Event() bqClose: EventEmitter;\n\n  /** Callback handler to be called when the tag is not open/shown */\n  @Event() bqOpen: EventEmitter;\n\n  /** Handler to be called when tag loses focus */\n  @Event() bqBlur: EventEmitter<HTMLBqTagElement>;\n\n  /** Handler to be called when tag is clicked */\n  @Event() bqClick: EventEmitter<HTMLBqTagElement>;\n\n  /** Handler to be called when tag is focused */\n  @Event() bqFocus: EventEmitter<HTMLBqTagElement>;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentWillLoad() {\n    this.checkPropValues();\n  }\n\n  componentDidLoad() {\n    this.handleSlotChange();\n  }\n\n  // Listeners\n  // ==============\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  /** Method to be called to remove the tag component */\n  @Method()\n  async hide(): Promise<void> {\n    this.handleHide();\n  }\n\n  /** Method to be called to show the tag component */\n  @Method()\n  async show(): Promise<void> {\n    this.handleShow();\n  }\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private handleHide = () => {\n    if (!this.isRemovable) return;\n\n    const ev = this.bqClose.emit(this.el);\n    if (!ev.defaultPrevented) {\n      this.hidden = true;\n    }\n  };\n\n  private handleShow = () => {\n    if (!this.isRemovable) return;\n\n    const ev = this.bqOpen.emit(this.el);\n    if (!ev.defaultPrevented) {\n      this.hidden = false;\n    }\n  };\n\n  private handleClick = () => {\n    // If the tag is not clickable or the tag is disabled, we don't want to handle the click\n    if (!this.isClickable || this.disabled) return;\n\n    // Emit a click event on the element\n    const ev = this.bqClick.emit(this.el);\n    // If the event was not prevented, toggle the clickable state\n    if (!ev.defaultPrevented) {\n      this.selected = !this.selected;\n    }\n  };\n\n  private handleBlur = () => {\n    if (!this.isClickable) return;\n\n    this.bqBlur.emit(this.el);\n  };\n\n  private handleFocus = () => {\n    if (!this.isClickable) return;\n\n    this.bqFocus.emit(this.el);\n  };\n\n  private handleSlotChange = () => {\n    this.hasPrefix = hasSlotContent(this.prefixElem, 'prefix');\n  };\n\n  private get isClickable(): boolean {\n    return this.clickable && !this.color && !this.hasCustomColor && !this.removable;\n  }\n\n  private get isRemovable(): boolean {\n    return this.removable && !this.isClickable;\n  }\n\n  private get isHidden(): boolean {\n    return this.isRemovable && this.hidden;\n  }\n\n  private get hasCustomColor(): boolean {\n    return this.color !== undefined ? !TAG_COLOR.includes(this.color) : false;\n  }\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    const style = {\n      '--bq-tag--icon-prefix-size': `${iconSize(this.size)}px`,\n      ...(this.border && { '--bq-tag--border-radius': `var(--bq-radius--${this.border})` }),\n      ...(this.color && { '--bq-tag--background-color': getColorCSSVariable(this.color) ?? this.color }),\n      ...(this.hasCustomColor && { '--bq-text--primary': `var(--bq-text--alt)` }),\n    };\n\n    return (\n      <Host style={style} aria-hidden={this.isHidden ? 'true' : 'false'} hidden={this.isHidden ? 'true' : 'false'}>\n        <button\n          class={{\n            [`bq-tag bq-tag__${this.size}`]: true,\n            [`bq-tag__${this.color || 'default'} bq-tag__${this.variant}`]: !this.hasCustomColor,\n            'is-clickable': this.isClickable,\n            'is-removable': this.removable,\n            // Active/Selected state when clickable\n            active: this.isClickable && this.selected,\n            // Fixed border radius\n            'has-border': !!this.border,\n          }}\n          disabled={this.disabled}\n          onBlur={this.handleBlur}\n          onClick={this.handleClick}\n          onFocus={this.handleFocus}\n          tabindex={this.isClickable ? 0 : -1}\n          part=\"wrapper\"\n        >\n          <span\n            class={{ 'bq-tag__prefix inline-flex': true, '!hidden': !this.hasPrefix }}\n            ref={(spanElem) => (this.prefixElem = spanElem)}\n            part=\"prefix\"\n          >\n            <slot name=\"prefix\" onSlotchange={this.handleSlotChange} />\n          </span>\n          <div\n            class={{\n              'text-xs': this.size === 'xsmall',\n              'text-s': this.size === 'small',\n              'text-m': this.size === 'medium',\n            }}\n            part=\"text\"\n          >\n            <slot />\n          </div>\n          {this.isRemovable && !this.disabled && (\n            <bq-button class=\"bq-tag__close\" appearance=\"text\" size=\"small\" onClick={this.handleHide} part=\"btn-close\">\n              <bq-icon\n                size={iconSize(this.size)}\n                name=\"x-circle\"\n                color={this.color && !this.hasCustomColor ? textColor(this.color)[this.variant] : 'text--primary'}\n              />\n            </bq-button>\n          )}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"bq-option-list.bq-tag.entry.esm.js","sources":["../../packages/beeq/src/components/option-list/scss/bq-option-list.scss?tag=bq-option-list&encapsulation=shadow","../../packages/beeq/src/components/option-list/bq-option-list.tsx","../../packages/beeq/src/components/tag/bq-tag.types.ts","../../packages/beeq/src/components/tag/helper/index.ts","../../packages/beeq/src/components/tag/scss/bq-tag.scss?tag=bq-tag&encapsulation=shadow","../../packages/beeq/src/components/tag/bq-tag.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/*                                Option list styles                */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-option-list.variables';\n\n:host {\n  @apply block;\n}\n","import { Component, Element, Event, h, Listen, Prop } from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\n\nimport { isEventTargetChildOfElement, isHTMLElement } from '../../shared/utils';\n\n/**\n * The option list component is a container for multiple option elements.\n * It allows to manage the appearance and size of all options at once.\n *\n * @example How to use it\n * ```html\n * <bq-option-list>\n *   <bq-option value=\"football\">Football</bq-option>\n *   <bq-option value=\"basketball\">Basketball</bq-option>\n *   <bq-option value=\"tennis\">Tennis</bq-option>\n * </bq-option-list>\n * ```\n *\n * @documentation https://storybook.beeq.design/?path=/story/components-option--default\n * @status stable\n *\n * @attr {string} aria-label - Aria label for the list.\n *\n * @slot - The option items\n *\n * @part base - The component's internal wrapper.\n *\n * @cssprop --bq-option-group--gapY-list - Option group gap between items Y axis\n */\n@Component({\n  tag: 'bq-option-list',\n  styleUrl: './scss/bq-option-list.scss',\n  shadow: true,\n})\nexport class BqOptionList {\n  // Own Properties\n  // ====================\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqOptionListElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  // Public Property API\n  // ========================\n\n  // Prop lifecycle events\n  // =======================\n\n  /** Aria label for the list. */\n  @Prop({ reflect: true }) ariaLabel: string = 'Options';\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Handler to be called when `bq-option` is selected (on click/enter press). */\n  @Event() bqSelect: EventEmitter<{ value: string; item: HTMLBqOptionElement }>;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentDidLoad() {\n    this.el.setAttribute('role', 'listbox');\n  }\n\n  // Listeners\n  // ==============\n\n  @Listen('bqClick', { passive: true })\n  @Listen('bqEnter', { passive: true })\n  onBqSelect(event: CustomEvent<HTMLElement>) {\n    const { target: item } = event;\n    if (!isHTMLElement(item, 'bq-option') || !isEventTargetChildOfElement(event, this.el)) return;\n\n    this.bqSelect.emit({ item, value: item.value });\n  }\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    return (\n      <div class=\"bq-option__list flex flex-col gap-y-[--bq-option-group--gapY-list]\" part=\"base\">\n        <slot />\n      </div>\n    );\n  }\n}\n","export const TAG_SIZE = ['xsmall', 'small', 'medium'] as const;\nexport type TTagSize = (typeof TAG_SIZE)[number];\n\nexport const TAG_COLOR = ['error', 'gray', 'info', 'success', 'warning'] as const;\nexport type TTagColor = (typeof TAG_COLOR)[number];\n\nexport const TAG_VARIANT = ['outline', 'filled'] as const;\nexport type TTagVariant = (typeof TAG_VARIANT)[number];\n\nexport const TAG_BORDER_RADIUS = ['none', 'xs2', 'xs', 's', 'm', 'l', 'full'] as const;\nexport type TTagBorderRadius = (typeof TAG_BORDER_RADIUS)[number];\n","import { TAG_COLOR, TAG_SIZE, TAG_VARIANT, TTagColor, TTagSize, TTagVariant } from '../bq-tag.types';\n\n/**\n * Function to determine the icon size based on the provided tag size.\n *\n * @param {TTagSize} size - The size of the tag.\n * @returns {number} The corresponding icon size. If the provided size does not match any predefined sizes, the function returns the size for 'medium'.\n */\nexport const iconSize = (size: TTagSize): number => {\n  const xsmall = TAG_SIZE[0];\n  const small = TAG_SIZE[1];\n  const medium = TAG_SIZE[2];\n\n  const SIZE = {\n    [xsmall]: 16,\n    [small]: 20,\n    [medium]: 24,\n  };\n\n  return SIZE[size] || SIZE[medium];\n};\n\n/**\n * Function to determine the tag text color scheme for a given tag type.\n *\n * @param {TTagType} color - The color of the tag.\n * @returns {Object} An object containing the color scheme for the given tag type. If the provided type does not match any predefined types, the function returns the color scheme for 'default'.\n */\nexport const textColor = (color: TTagColor): Partial<{ [K in TTagVariant]: string }> => {\n  const typeError = TAG_COLOR[0];\n  const typeGray = TAG_COLOR[1];\n  const typeInfo = TAG_COLOR[2];\n  const typeSuccess = TAG_COLOR[3];\n  const typeWarning = TAG_COLOR[4];\n\n  const variantOutline = TAG_VARIANT[0];\n  const variantFilled = TAG_VARIANT[1];\n\n  const COLORS = {\n    [typeError]: {\n      [variantOutline]: 'text--danger',\n      [variantFilled]: 'text--alt',\n    },\n    [typeGray]: {\n      [variantOutline]: 'text--primary',\n      [variantFilled]: 'text--alt',\n    },\n    [typeInfo]: {\n      [variantOutline]: 'text--brand',\n      [variantFilled]: 'text--alt',\n    },\n    [typeSuccess]: {\n      [variantOutline]: 'text--success',\n      [variantFilled]: 'text--alt',\n    },\n    [typeWarning]: {\n      [variantOutline]: 'text--warning',\n      [variantFilled]: 'text--alt',\n    },\n  };\n\n  return COLORS[color];\n};\n","/* -------------------------------------------------------------------------- */\n/*                        Tag styles                        */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-tag.variables';\n\n:host {\n  @apply relative inline-block;\n}\n\n:host([removable][hidden]) {\n  @apply hidden;\n}\n\n.bq-tag {\n  @apply box-border inline-flex select-none flex-row items-center justify-center bg-[--bq-tag--background-color];\n  @apply gap-[--bq-tag--medium-gap] font-medium leading-regular text-primary p-b-[--bq-tag--medium-padding-y] p-i-[--bq-tag--medium-padding-x];\n  @apply rounded-[--bq-tag--border-radius] border-[length:--bq-tag--border-width] border-[color:--bq-tag--border-color];\n  @apply transition-colors duration-300 ease-in-out;\n\n  border-style: var(--bq-tag--border-style);\n}\n\n/* ---------------------------------- Size ---------------------------------- */\n\n.bq-tag__xsmall,\n.bq-tag__small {\n  @apply gap-[--bq-tag--small-gap] p-b-[--bq-tag--small-padding-y] p-i-[--bq-tag--small-padding-x];\n\n  /* Apply predefined border radius only if the border property have NO VALUE */\n  &:not(.has-border) {\n    @apply rounded-[--bq-tag--small-border-radius];\n  }\n}\n\n/* --------------------------------- Action --------------------------------- */\n\n.bq-tag__default.is-clickable {\n  @apply cursor-pointer;\n  // Focus\n  @apply focus-visible:focus;\n  // Hover\n  @apply hover:enabled:bg-[color-mix(in_srgb,_var(--bq-tag--background-color),_var(--bq-hover)_20%)];\n  // Active/Selected\n  @apply [&.active]:text-alt [&.active]:[--bq-tag--background-color:--bq-ui--brand];\n  // Disabled\n  @apply disabled:cursor-not-allowed disabled:border-none disabled:opacity-60;\n}\n\n/* ------------------------------ Color styles ------------------------------ */\n\n.bq-tag__error {\n  &.bq-tag__filled {\n    @apply bg-ui-danger text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply bg-ui-danger-alt text-danger [--bq-tag--border-color:--bq-stroke--danger];\n  }\n}\n\n.bq-tag__gray {\n  &.bq-tag__filled {\n    @apply bg-ui-tertiary text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply bg-ui-primary text-primary [--bq-tag--border-color:--bq-stroke--tertiary];\n  }\n}\n\n.bq-tag__info {\n  &.bq-tag__filled {\n    @apply bg-ui-brand text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply bg-ui-brand-alt text-brand [--bq-tag--border-color:--bq-stroke--brand];\n  }\n}\n\n.bq-tag__success {\n  &.bq-tag__filled {\n    @apply bg-ui-success text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply bg-ui-success-alt text-success [--bq-tag--border-color:--bq-tag--border-success];\n  }\n}\n\n.bq-tag__warning {\n  &.bq-tag__filled {\n    @apply bg-ui-warning text-alt;\n  }\n\n  &.bq-tag__outline {\n    @apply border-warning bg-ui-warning-alt text-warning;\n  }\n}\n\n/* ------------------------------ Close button ------------------------------ */\n\n.bq-tag__close::part(button) {\n  @apply pointer-events-none border-0 bs-fit p-b-0 p-i-0;\n}\n\n/* --------------- Apply the right size to the bq-icon prefix --------------- */\n\n.bq-tag__prefix ::slotted(bq-icon) {\n  --bq-icon--size: var(--bq-tag--icon-prefix-size) !important;\n}\n","import { Component, Element, Event, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\n\nimport { TAG_COLOR, TAG_SIZE, TAG_VARIANT } from './bq-tag.types';\nimport type { TTagBorderRadius, TTagColor, TTagSize, TTagVariant } from './bq-tag.types';\nimport { iconSize, textColor } from './helper';\nimport { getColorCSSVariable, hasSlotContent, validatePropValue } from '../../shared/utils';\n\n/**\n * The Tag Component is a UI element used to label and categorize content within an application.\n * Tags are commonly used to label items with keywords or categories, making it easier to find and organize content.\n *\n * @example How to use it\n * ```html\n * <bq-tag color=\"success\" size=\"medium\" variant=\"filled\">Success</bq-tag>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/42f8c9-tag\n * @status stable\n *\n * @dependency bq-button\n * @dependency bq-icon\n *\n * @attr {string} border - The corner radius of the Tag (will override size's predefined border)\n * @attr {boolean} clickable - If `true`, the Tag can be clickable\n * @attr {\"error\" | \"gray\" | \"info\" | \"success\" | \"warning\"} color - The color style of the Tag\n * @attr {boolean} disabled - If `true`, the Tag will be disabled (only if clickable = `true`, no interaction allowed)\n * @attr {boolean} hidden - If `true`, the Tag component will hidden (only if removable = `true`)\n * @attr {boolean} removable - If `true`, the Tag component can be removed\n * @attr {boolean} selected - If `true`, the Tag is selected (only if clickable = `true`)\n * @attr {\"xsmall\" | \"small\" | \"medium\"} size - The size of the Tag component\n * @attr {\"outline\" | \"filled\"} variant - The variant of Tag to apply on top of the variant\n *\n * @method hide - Method to be called to remove the tag component\n * @method show - Method to be called to show the tag component\n *\n * @event bqClose - Callback handler to be called when the tag is close/hidden\n * @event bqOpen - Callback handler to be called when the tag is not open/shown\n * @event bqBlur - Handler to be called when tag loses focus\n * @event bqClick - Handler to be called when tag is clicked\n * @event bqFocus - Handler to be called when tag is focused\n *\n * @slot prefix - The prefix slot to add an icon or any other content before the text\n * @slot - The text content of the tag\n *\n * @part wrapper - The wrapper container `<div>` of the element inside the shadow DOM.\n * @part prefix - The `<span>` tag element that acts as prefix container (when icon exists in front of tag).\n * @part text - The `<div>` element containing the text of the tag component.\n * @part btn-close - The close button element to remove the tag component.\n *\n * @cssprop --bq-tag--background-color - Tag background color\n * @cssprop --bq-tag--border-color - Tag border color\n * @cssprop --bq-tag--border-radius - Tag border radius\n * @cssprop --bq-tag--border-style - Tag border style\n * @cssprop --bq-tag--border-width - Tag border width\n * @cssprop --bq-tag--small-border-radius - Tag small border radius\n * @cssprop --bq-tag--small-gap - Tag small gap between content\n * @cssprop --bq-tag--small-padding-x - Tag small padding horizontal\n * @cssprop --bq-tag--small-padding-y - Tag small padding vertical\n * @cssprop --bq-tag--medium-gap - Tag medium gap between content\n * @cssprop --bq-tag--medium-padding-x - Tag medium padding horizontal\n * @cssprop --bq-tag--medium-padding-y - Tag medium padding vertical\n */\n@Component({\n  tag: 'bq-tag',\n  styleUrl: './scss/bq-tag.scss',\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class BqTag {\n  // Own Properties\n  // ====================\n\n  private prefixElem: HTMLElement;\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqTagElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() private hasPrefix = false;\n\n  // Public Property API\n  // ========================\n\n  /** The corner radius of the Tag (will override size's predefined border) */\n  @Prop({ reflect: true }) border: TTagBorderRadius;\n\n  /** If true, the Tag can be clickable */\n  @Prop({ reflect: true }) clickable: boolean = false;\n\n  /** The color style of the Tag */\n  @Prop({ reflect: true }) color: TTagColor;\n\n  /** If true, the Tag will be disabled (only if clickable = `true`, no interaction allowed) */\n  @Prop({ reflect: true }) disabled?: boolean = false;\n\n  /** If true, the Tag component will hidden (only if removable = `true`) */\n  @Prop({ reflect: true, mutable: true }) hidden: boolean;\n\n  /** If true, the Tag component can be removed */\n  @Prop({ reflect: true }) removable: boolean = false;\n\n  /** If true, the Tag is selected (only if clickable = `true`) */\n  @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n\n  /** The size of the Tag component */\n  @Prop({ reflect: true }) size: TTagSize = 'medium';\n\n  /** The variant of Tag to apply on top of the variant */\n  @Prop({ reflect: true }) variant: TTagVariant = 'filled';\n\n  // Prop lifecycle events\n  // =======================\n\n  @Watch('size')\n  @Watch('variant')\n  checkPropValues() {\n    validatePropValue(TAG_SIZE, 'medium', this.el, 'size');\n    validatePropValue(TAG_VARIANT, 'filled', this.el, 'variant');\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Callback handler to be called when the tag is close/hidden  */\n  @Event() bqClose: EventEmitter;\n\n  /** Callback handler to be called when the tag is not open/shown */\n  @Event() bqOpen: EventEmitter;\n\n  /** Handler to be called when tag loses focus */\n  @Event() bqBlur: EventEmitter<HTMLBqTagElement>;\n\n  /** Handler to be called when tag is clicked */\n  @Event() bqClick: EventEmitter<HTMLBqTagElement>;\n\n  /** Handler to be called when tag is focused */\n  @Event() bqFocus: EventEmitter<HTMLBqTagElement>;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentWillLoad() {\n    this.checkPropValues();\n  }\n\n  componentDidLoad() {\n    this.handleSlotChange();\n  }\n\n  // Listeners\n  // ==============\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  /** Method to be called to remove the tag component */\n  @Method()\n  async hide(): Promise<void> {\n    this.handleHide();\n  }\n\n  /** Method to be called to show the tag component */\n  @Method()\n  async show(): Promise<void> {\n    this.handleShow();\n  }\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private handleHide = () => {\n    if (!this.isRemovable) return;\n\n    const ev = this.bqClose.emit(this.el);\n    if (!ev.defaultPrevented) {\n      this.hidden = true;\n    }\n  };\n\n  private handleShow = () => {\n    if (!this.isRemovable) return;\n\n    const ev = this.bqOpen.emit(this.el);\n    if (!ev.defaultPrevented) {\n      this.hidden = false;\n    }\n  };\n\n  private handleClick = () => {\n    // If the tag is not clickable or the tag is disabled, we don't want to handle the click\n    if (!this.isClickable || this.disabled) return;\n\n    // Emit a click event on the element\n    const ev = this.bqClick.emit(this.el);\n    // If the event was not prevented, toggle the clickable state\n    if (!ev.defaultPrevented) {\n      this.selected = !this.selected;\n    }\n  };\n\n  private handleBlur = () => {\n    if (!this.isClickable) return;\n\n    this.bqBlur.emit(this.el);\n  };\n\n  private handleFocus = () => {\n    if (!this.isClickable) return;\n\n    this.bqFocus.emit(this.el);\n  };\n\n  private handleSlotChange = () => {\n    this.hasPrefix = hasSlotContent(this.prefixElem, 'prefix');\n  };\n\n  private get isClickable(): boolean {\n    return this.clickable && !this.color && !this.hasCustomColor && !this.removable;\n  }\n\n  private get isRemovable(): boolean {\n    return this.removable && !this.isClickable;\n  }\n\n  private get isHidden(): boolean {\n    return this.isRemovable && this.hidden;\n  }\n\n  private get hasCustomColor(): boolean {\n    return this.color !== undefined ? !TAG_COLOR.includes(this.color) : false;\n  }\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    const style = {\n      '--bq-tag--icon-prefix-size': `${iconSize(this.size)}px`,\n      ...(this.border && { '--bq-tag--border-radius': `var(--bq-radius--${this.border})` }),\n      ...(this.color && { '--bq-tag--background-color': getColorCSSVariable(this.color) ?? this.color }),\n      ...(this.hasCustomColor && { '--bq-text--primary': `var(--bq-text--alt)` }),\n    };\n\n    return (\n      <Host style={style} aria-hidden={this.isHidden ? 'true' : 'false'} hidden={this.isHidden ? 'true' : 'false'}>\n        <button\n          class={{\n            [`bq-tag bq-tag__${this.size}`]: true,\n            [`bq-tag__${this.color || 'default'} bq-tag__${this.variant}`]: !this.hasCustomColor,\n            'is-clickable': this.isClickable,\n            'is-removable': this.removable,\n            // Active/Selected state when clickable\n            active: this.isClickable && this.selected,\n            // Fixed border radius\n            'has-border': !!this.border,\n          }}\n          disabled={this.disabled}\n          onBlur={this.handleBlur}\n          onClick={this.handleClick}\n          onFocus={this.handleFocus}\n          tabindex={this.isClickable ? 0 : -1}\n          part=\"wrapper\"\n        >\n          <span\n            class={{ 'bq-tag__prefix inline-flex': true, '!hidden': !this.hasPrefix }}\n            ref={(spanElem) => (this.prefixElem = spanElem)}\n            part=\"prefix\"\n          >\n            <slot name=\"prefix\" onSlotchange={this.handleSlotChange} />\n          </span>\n          <div\n            class={{\n              'text-xs': this.size === 'xsmall',\n              'text-s': this.size === 'small',\n              'text-m': this.size === 'medium',\n            }}\n            part=\"text\"\n          >\n            <slot />\n          </div>\n          {this.isRemovable && !this.disabled && (\n            <bq-button class=\"bq-tag__close\" appearance=\"text\" size=\"small\" onClick={this.handleHide} part=\"btn-close\">\n              <bq-icon\n                size={iconSize(this.size)}\n                name=\"x-circle\"\n                color={this.color && !this.hasCustomColor ? textColor(this.color)[this.variant] : 'text--primary'}\n              />\n            </bq-button>\n          )}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;AAAA,MAAM,eAAe,GAAG,ohmBAAohmB;;MCkC/hmB,YAAY,GAAA,MAAA;;;;;;;;;;;;;;IAoBE,SAAS,GAAW,SAAS;;;;;AAO7C,IAAA,QAAQ;;;;IAMjB,gBAAgB,GAAA;QACd,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,SAAS,CAAC;;;;AAQzC,IAAA,UAAU,CAAC,KAA+B,EAAA;AACxC,QAAA,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK;AAC9B,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC,2BAA2B,CAAC,KAAK,EAAE,IAAI,CAAC,EAAE,CAAC;YAAE;AAEvF,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;;;;;;;;;;;;;;;IAmBjD,MAAM,GAAA;AACJ,QAAA,QACE,4DAAK,KAAK,EAAC,oEAAoE,EAAC,IAAI,EAAC,MAAM,EAAA,EACzF,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACJ;;;;;ACvGL,MAAM,QAAQ,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,CAAU;AAGvD,MAAM,SAAS,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,CAAU;AAG1E,MAAM,WAAW,GAAG,CAAC,SAAS,EAAE,QAAQ,CAAU;;ACJzD;;;;;AAKG;AACI,MAAM,QAAQ,GAAG,CAAC,IAAc,KAAY;AACjD,IAAA,MAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC;AAC1B,IAAA,MAAM,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC;AACzB,IAAA,MAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC;AAE1B,IAAA,MAAM,IAAI,GAAG;QACX,CAAC,MAAM,GAAG,EAAE;QACZ,CAAC,KAAK,GAAG,EAAE;QACX,CAAC,MAAM,GAAG,EAAE;KACb;IAED,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC;AACnC,CAAC;AAED;;;;;AAKG;AACI,MAAM,SAAS,GAAG,CAAC,KAAgB,KAA6C;AACrF,IAAA,MAAM,SAAS,GAAG,SAAS,CAAC,CAAC,CAAC;AAC9B,IAAA,MAAM,QAAQ,GAAG,SAAS,CAAC,CAAC,CAAC;AAC7B,IAAA,MAAM,QAAQ,GAAG,SAAS,CAAC,CAAC,CAAC;AAC7B,IAAA,MAAM,WAAW,GAAG,SAAS,CAAC,CAAC,CAAC;AAChC,IAAA,MAAM,WAAW,GAAG,SAAS,CAAC,CAAC,CAAC;AAEhC,IAAA,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,CAAC;AACrC,IAAA,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,CAAC;AAEpC,IAAA,MAAM,MAAM,GAAG;QACb,CAAC,SAAS,GAAG;YACX,CAAC,cAAc,GAAG,cAAc;YAChC,CAAC,aAAa,GAAG,WAAW;AAC7B,SAAA;QACD,CAAC,QAAQ,GAAG;YACV,CAAC,cAAc,GAAG,eAAe;YACjC,CAAC,aAAa,GAAG,WAAW;AAC7B,SAAA;QACD,CAAC,QAAQ,GAAG;YACV,CAAC,cAAc,GAAG,aAAa;YAC/B,CAAC,aAAa,GAAG,WAAW;AAC7B,SAAA;QACD,CAAC,WAAW,GAAG;YACb,CAAC,cAAc,GAAG,eAAe;YACjC,CAAC,aAAa,GAAG,WAAW;AAC7B,SAAA;QACD,CAAC,WAAW,GAAG;YACb,CAAC,cAAc,GAAG,eAAe;YACjC,CAAC,aAAa,GAAG,WAAW;AAC7B,SAAA;KACF;AAED,IAAA,OAAO,MAAM,CAAC,KAAK,CAAC;AACtB,CAAC;;AC9DD,MAAM,QAAQ,GAAG,s30BAAs30B;;MCsE130B,KAAK,GAAA,MAAA;;;;;;;;;;;AAIR,IAAA,UAAU;;;;;IAWD,SAAS,GAAG,KAAK;;;;AAMT,IAAA,MAAM;;IAGN,SAAS,GAAY,KAAK;;AAG1B,IAAA,KAAK;;IAGL,QAAQ,GAAa,KAAK;;AAGX,IAAA,MAAM;;IAGrB,SAAS,GAAY,KAAK;;IAGX,QAAQ,GAAY,KAAK;;IAGxC,IAAI,GAAa,QAAQ;;IAGzB,OAAO,GAAgB,QAAQ;;;IAOxD,eAAe,GAAA;QACb,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC;QACtD,iBAAiB,CAAC,WAAW,EAAE,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC;;;;;;AAQrD,IAAA,OAAO;;AAGP,IAAA,MAAM;;AAGN,IAAA,MAAM;;AAGN,IAAA,OAAO;;AAGP,IAAA,OAAO;;;;IAMhB,iBAAiB,GAAA;QACf,IAAI,CAAC,eAAe,EAAE;;IAGxB,gBAAgB,GAAA;QACd,IAAI,CAAC,gBAAgB,EAAE;;;;;;;;;;;AAezB,IAAA,MAAM,IAAI,GAAA;QACR,IAAI,CAAC,UAAU,EAAE;;;AAKnB,IAAA,MAAM,IAAI,GAAA;QACR,IAAI,CAAC,UAAU,EAAE;;;;;;IAQX,UAAU,GAAG,MAAK;QACxB,IAAI,CAAC,IAAI,CAAC,WAAW;YAAE;AAEvB,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;AACrC,QAAA,IAAI,CAAC,EAAE,CAAC,gBAAgB,EAAE;AACxB,YAAA,IAAI,CAAC,MAAM,GAAG,IAAI;;AAEtB,KAAC;IAEO,UAAU,GAAG,MAAK;QACxB,IAAI,CAAC,IAAI,CAAC,WAAW;YAAE;AAEvB,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;AACpC,QAAA,IAAI,CAAC,EAAE,CAAC,gBAAgB,EAAE;AACxB,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;;AAEvB,KAAC;IAEO,WAAW,GAAG,MAAK;;AAEzB,QAAA,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,QAAQ;YAAE;;AAGxC,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;;AAErC,QAAA,IAAI,CAAC,EAAE,CAAC,gBAAgB,EAAE;AACxB,YAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ;;AAElC,KAAC;IAEO,UAAU,GAAG,MAAK;QACxB,IAAI,CAAC,IAAI,CAAC,WAAW;YAAE;QAEvB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;AAC3B,KAAC;IAEO,WAAW,GAAG,MAAK;QACzB,IAAI,CAAC,IAAI,CAAC,WAAW;YAAE;QAEvB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;AAC5B,KAAC;IAEO,gBAAgB,GAAG,MAAK;QAC9B,IAAI,CAAC,SAAS,GAAG,cAAc,CAAC,IAAI,CAAC,UAAU,EAAE,QAAQ,CAAC;AAC5D,KAAC;AAED,IAAA,IAAY,WAAW,GAAA;AACrB,QAAA,OAAO,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,SAAS;;AAGjF,IAAA,IAAY,WAAW,GAAA;QACrB,OAAO,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,WAAW;;AAG5C,IAAA,IAAY,QAAQ,GAAA;AAClB,QAAA,OAAO,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,MAAM;;AAGxC,IAAA,IAAY,cAAc,GAAA;QACxB,OAAO,IAAI,CAAC,KAAK,KAAK,SAAS,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,KAAK;;;;;IAO3E,MAAM,GAAA;AACJ,QAAA,MAAM,KAAK,GAAG;YACZ,4BAA4B,EAAE,GAAG,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAI,EAAA,CAAA;AACxD,YAAA,IAAI,IAAI,CAAC,MAAM,IAAI,EAAE,yBAAyB,EAAE,CAAA,iBAAA,EAAoB,IAAI,CAAC,MAAM,CAAA,CAAA,CAAG,EAAE,CAAC;AACrF,YAAA,IAAI,IAAI,CAAC,KAAK,IAAI,EAAE,4BAA4B,EAAE,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YAClG,IAAI,IAAI,CAAC,cAAc,IAAI,EAAE,oBAAoB,EAAE,CAAqB,mBAAA,CAAA,EAAE,CAAC;SAC5E;QAED,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,KAAK,EAAE,KAAK,EAAe,aAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAA,EACzG,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,CAAC,kBAAkB,IAAI,CAAC,IAAI,CAAE,CAAA,GAAG,IAAI;AACrC,gBAAA,CAAC,WAAW,IAAI,CAAC,KAAK,IAAI,SAAS,CAAY,SAAA,EAAA,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,IAAI,CAAC,cAAc;gBACpF,cAAc,EAAE,IAAI,CAAC,WAAW;gBAChC,cAAc,EAAE,IAAI,CAAC,SAAS;;AAE9B,gBAAA,MAAM,EAAE,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,QAAQ;;AAEzC,gBAAA,YAAY,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM;aAC5B,EACD,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,MAAM,EAAE,IAAI,CAAC,UAAU,EACvB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,QAAQ,EAAE,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,EAAE,EACnC,IAAI,EAAC,SAAS,EAAA,EAEd,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,EAAE,4BAA4B,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,EACzE,GAAG,EAAE,CAAC,QAAQ,MAAM,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,EAC/C,IAAI,EAAC,QAAQ,EAAA,EAEb,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAA,CAAI,CACtD,EACP,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;AACjC,gBAAA,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;AAC/B,gBAAA,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;aACjC,EACD,IAAI,EAAC,MAAM,EAAA,EAEX,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACJ,EACL,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,QAAQ,KACjC,CAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAW,KAAK,EAAC,eAAe,EAAC,UAAU,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAC,WAAW,EAAA,EACxG,CACE,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EACzB,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,eAAe,EAAA,CACjG,CACQ,CACb,CACM,CACJ;;;;;;;;;;;;"}

package/dist/beeq/bq-page-title.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"bq-page-title.entry.esm.js","sources":["../../packages/beeq/src/components/page-title/scss/bq-page-title.scss?tag=bq-page-title&encapsulation=shadow","../../packages/beeq/src/components/page-title/bq-page-title.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/*                        Page title styles                        */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-page-title.variables';\n\n:host {\n  @apply block;\n}\n","import { Component, Element, h, State } from '@stencil/core';\n\nimport { hasSlotContent } from '../../shared/utils';\n\n/**\n * The Page Title component is a versatile and essential element used to display the main title of a page or section within an application.\n *\n * @example How to use it\n * ```html\n * <bq-page-title>\n *   <bq-button appearance=\"link\" slot=\"back\">\n *     <bq-icon\n *       color=\"text--primary\"\n *       name=\"arrow-left\"\n *       weight=\"bold\"\n *       role=\"img\"\n *       title=\"Navigate back to the previous page\"\n *     ></bq-icon>\n *   </bq-button>\n *   Title\n *   <div slot=\"sub-title\">Sub-title</div>\n * </bq-page-title>\n * ```\n *\n * @documentation https://storybook.beeq.design/?path=/docs/components-page-title--overview\n * @status stable\n *\n * @slot back - The back navigation button.\n * @slot - The main title content.\n * @slot sub-title - The sub-title content.\n * @slot suffix - The suffix content.\n *\n * @part base - The inner container `<div>`of element that contains the base page title component.\n * @part content - Defines the main container of the page title component, which includes the title and subtitle elements.\n * @part title-suffix - Defines the container that holds the title and any suffix content.\n * @part back - The container `<div>` page title element that acts as back slot container.\n * @part title - The `<h1>` element serves as a container for the page title content, to improve accessibility.\n * @part suffix - The `<div>` page title element that acts as suffix slot container.\n * @part sub-title - The `<div>` page title element that acts as sub-title slot container.\n *\n * @cssprop --paddingY - Padding top and bottom of the page title wrapper\n * @cssprop --subtitle-borderBlockEnd - Page title border end color\n * @cssprop --subtitle-fontWeight - Page title font weight for subtitle\n * @cssprop --subtitle-textColor - Page title color for sub-title\n * @cssprop --subtitle-textSize - Page title text size for subtitle\n * @cssprop --title-fontWeight - Page title font weight for title\n * @cssprop --title-lineHeight - Page title text line height\n * @cssprop --title-textColor - Page title color for title\n * @cssprop --title-textSize - Page title text size for title\n */\n@Component({\n  tag: 'bq-page-title',\n  styleUrl: './scss/bq-page-title.scss',\n  shadow: true,\n})\nexport class BqPageTitle {\n  // Own Properties\n  // ====================\n\n  private backNavigationElem: HTMLElement;\n  private suffixElem: HTMLElement;\n  private subTitleElem: HTMLElement;\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqPageTitleElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() private haveBackNavigation = false;\n  @State() private hasSuffix = false;\n  @State() private hasSubTitle = false;\n\n  // Public Property API\n  // ========================\n\n  // Prop lifecycle events\n  // =======================\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentDidLoad() {\n    this.handleSlotChange();\n  }\n\n  // Listeners\n  // ==============\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private handleSlotChange = () => {\n    this.haveBackNavigation = hasSlotContent(this.backNavigationElem, 'back');\n    this.hasSuffix = hasSlotContent(this.suffixElem, 'suffix');\n    this.hasSubTitle = hasSlotContent(this.subTitleElem, 'sub-title');\n  };\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    return (\n      <div class=\"flex gap-xs p-b-[--paddingY] [border-block-end:--subtitle-borderBlockEnd]\" part=\"base\">\n        {/* Back navigation button */}\n        <div\n          class={{ flex: true, '!hidden': !this.haveBackNavigation }}\n          ref={(divElem) => (this.backNavigationElem = divElem)}\n          part=\"back\"\n        >\n          <slot name=\"back\" onSlotchange={this.handleSlotChange} />\n        </div>\n        <div class=\"flex flex-grow flex-col gap-xs\" part=\"content\">\n          <div class=\"flex items-center gap-xs\" part=\"title-suffix\">\n            {/* Title */}\n            <h1\n              class=\"title-font text-[length:--title-textSize] font-[--title-fontWeight] leading-[--title-lineHeight] text-[color:--title-textColor]\"\n              part=\"title\"\n            >\n              <slot />\n            </h1>\n            {/* Suffix */}\n            <div\n              class={{ 'flex flex-grow gap-xs p-b-xs2 p-i-xs2': true, '!hidden': !this.hasSuffix }}\n              ref={(divElem) => (this.suffixElem = divElem)}\n              part=\"suffix\"\n            >\n              <slot name=\"suffix\" onSlotchange={this.handleSlotChange} />\n            </div>\n          </div>\n          {/* Sub-title */}\n          <div\n            class={{\n              'title-font text-[length:--subtitle-textSize] font-[--subtitle-fontWeight] leading-[--title-lineHeight] text-[color:--subtitle-textColor]': true,\n              hidden: !this.hasSubTitle,\n            }}\n            ref={(divElem) => (this.subTitleElem = divElem)}\n            part=\"sub-title\"\n          >\n            <slot name=\"sub-title\" onSlotchange={this.handleSlotChange} />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"],"names":[],"mappings":";;;;;;;AAAA,MAAM,cAAc,GAAG,o+oBAAo+oB;;MCuD9+oB,WAAW,GAAA,MAAA;;;;;;AAId,IAAA,kBAAkB;AAClB,IAAA,UAAU;AACV,IAAA,YAAY;;;;;IAWH,kBAAkB,GAAG,KAAK;IAC1B,SAAS,GAAG,KAAK;IACjB,WAAW,GAAG,KAAK;;;;;;;;;;;IAgBpC,gBAAgB,GAAA;QACd,IAAI,CAAC,gBAAgB,EAAE;;;;;;;;;;;;;;IAkBjB,gBAAgB,GAAG,MAAK;QAC9B,IAAI,CAAC,kBAAkB,GAAG,cAAc,CAAC,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,SAAS,GAAG,cAAc,CAAC,IAAI,CAAC,UAAU,EAAE,QAAQ,CAAC;QAC1D,IAAI,CAAC,WAAW,GAAG,cAAc,CAAC,IAAI,CAAC,YAAY,EAAE,WAAW,CAAC;AACnE,KAAC;;;;IAMD,MAAM,GAAA;QACJ,QACE,4DAAK,KAAK,EAAC,2EAA2E,EAAC,IAAI,EAAC,MAAM,EAAA,EAEhG,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,IAAI,CAAC,kBAAkB,EAAE,EAC1D,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,kBAAkB,GAAG,OAAO,CAAC,EACrD,IAAI,EAAC,MAAM,EAAA,EAEX,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAA,CAAI,CACrD,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,gCAAgC,EAAC,IAAI,EAAC,SAAS,EAAA,EACxD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,0BAA0B,EAAC,IAAI,EAAC,cAAc,EAAA,EAEvD,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,iIAAiI,EACvI,IAAI,EAAC,OAAO,EAAA,EAEZ,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACL,EAEL,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,EAAE,uCAAuC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,EACpF,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,EAC7C,IAAI,EAAC,QAAQ,EAAA,EAEb,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAI,CAAA,CACvD,CACF,EAEN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,0IAA0I,EAAE,IAAI;AAChJ,gBAAA,MAAM,EAAE,CAAC,IAAI,CAAC,WAAW;aAC1B,EACD,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,EAC/C,IAAI,EAAC,WAAW,EAAA,EAEhB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,WAAW,EAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAI,CAAA,CAC1D,CACF,CACF;;;;;;;"}
+{"version":3,"file":"bq-page-title.entry.esm.js","sources":["../../packages/beeq/src/components/page-title/scss/bq-page-title.scss?tag=bq-page-title&encapsulation=shadow","../../packages/beeq/src/components/page-title/bq-page-title.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/*                        Page title styles                        */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-page-title.variables';\n\n:host {\n  @apply block;\n}\n","import { Component, Element, h, State } from '@stencil/core';\n\nimport { hasSlotContent } from '../../shared/utils';\n\n/**\n * The Page Title component is a versatile and essential element used to display the main title of a page or section within an application.\n *\n * @example How to use it\n * ```html\n * <bq-page-title>\n *   <bq-button appearance=\"link\" slot=\"back\">\n *     <bq-icon\n *       color=\"text--primary\"\n *       name=\"arrow-left\"\n *       weight=\"bold\"\n *       role=\"img\"\n *       title=\"Navigate back to the previous page\"\n *     ></bq-icon>\n *   </bq-button>\n *   Title\n *   <div slot=\"sub-title\">Sub-title</div>\n * </bq-page-title>\n * ```\n *\n * @documentation https://storybook.beeq.design/?path=/docs/components-page-title--overview\n * @status stable\n *\n * @slot back - The back navigation button.\n * @slot - The main title content.\n * @slot sub-title - The sub-title content.\n * @slot suffix - The suffix content.\n *\n * @part base - The inner container `<div>`of element that contains the base page title component.\n * @part content - Defines the main container of the page title component, which includes the title and subtitle elements.\n * @part title-suffix - Defines the container that holds the title and any suffix content.\n * @part back - The container `<div>` page title element that acts as back slot container.\n * @part title - The `<h1>` element serves as a container for the page title content, to improve accessibility.\n * @part suffix - The `<div>` page title element that acts as suffix slot container.\n * @part sub-title - The `<div>` page title element that acts as sub-title slot container.\n *\n * @cssprop --paddingY - Padding top and bottom of the page title wrapper\n * @cssprop --subtitle-borderBlockEnd - Page title border end color\n * @cssprop --subtitle-fontWeight - Page title font weight for subtitle\n * @cssprop --subtitle-textColor - Page title color for sub-title\n * @cssprop --subtitle-textSize - Page title text size for subtitle\n * @cssprop --title-fontWeight - Page title font weight for title\n * @cssprop --title-lineHeight - Page title text line height\n * @cssprop --title-textColor - Page title color for title\n * @cssprop --title-textSize - Page title text size for title\n */\n@Component({\n  tag: 'bq-page-title',\n  styleUrl: './scss/bq-page-title.scss',\n  shadow: true,\n})\nexport class BqPageTitle {\n  // Own Properties\n  // ====================\n\n  private backNavigationElem: HTMLElement;\n  private suffixElem: HTMLElement;\n  private subTitleElem: HTMLElement;\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqPageTitleElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() private haveBackNavigation = false;\n  @State() private hasSuffix = false;\n  @State() private hasSubTitle = false;\n\n  // Public Property API\n  // ========================\n\n  // Prop lifecycle events\n  // =======================\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentDidLoad() {\n    this.handleSlotChange();\n  }\n\n  // Listeners\n  // ==============\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private handleSlotChange = () => {\n    this.haveBackNavigation = hasSlotContent(this.backNavigationElem, 'back');\n    this.hasSuffix = hasSlotContent(this.suffixElem, 'suffix');\n    this.hasSubTitle = hasSlotContent(this.subTitleElem, 'sub-title');\n  };\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    return (\n      <div class=\"flex gap-xs p-b-[--paddingY] [border-block-end:--subtitle-borderBlockEnd]\" part=\"base\">\n        {/* Back navigation button */}\n        <div\n          class={{ flex: true, '!hidden': !this.haveBackNavigation }}\n          ref={(divElem) => (this.backNavigationElem = divElem)}\n          part=\"back\"\n        >\n          <slot name=\"back\" onSlotchange={this.handleSlotChange} />\n        </div>\n        <div class=\"flex flex-grow flex-col gap-xs\" part=\"content\">\n          <div class=\"flex items-center gap-xs\" part=\"title-suffix\">\n            {/* Title */}\n            <h1\n              class=\"title-font text-[length:--title-textSize] font-[--title-fontWeight] leading-[--title-lineHeight] text-[color:--title-textColor]\"\n              part=\"title\"\n            >\n              <slot />\n            </h1>\n            {/* Suffix */}\n            <div\n              class={{ 'flex flex-grow gap-xs p-b-xs2 p-i-xs2': true, '!hidden': !this.hasSuffix }}\n              ref={(divElem) => (this.suffixElem = divElem)}\n              part=\"suffix\"\n            >\n              <slot name=\"suffix\" onSlotchange={this.handleSlotChange} />\n            </div>\n          </div>\n          {/* Sub-title */}\n          <div\n            class={{\n              'title-font text-[length:--subtitle-textSize] font-[--subtitle-fontWeight] leading-[--title-lineHeight] text-[color:--subtitle-textColor]': true,\n              hidden: !this.hasSubTitle,\n            }}\n            ref={(divElem) => (this.subTitleElem = divElem)}\n            part=\"sub-title\"\n          >\n            <slot name=\"sub-title\" onSlotchange={this.handleSlotChange} />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"],"names":[],"mappings":";;;;;;;AAAA,MAAM,cAAc,GAAG,+roBAA+roB;;MCuDzsoB,WAAW,GAAA,MAAA;;;;;;AAId,IAAA,kBAAkB;AAClB,IAAA,UAAU;AACV,IAAA,YAAY;;;;;IAWH,kBAAkB,GAAG,KAAK;IAC1B,SAAS,GAAG,KAAK;IACjB,WAAW,GAAG,KAAK;;;;;;;;;;;IAgBpC,gBAAgB,GAAA;QACd,IAAI,CAAC,gBAAgB,EAAE;;;;;;;;;;;;;;IAkBjB,gBAAgB,GAAG,MAAK;QAC9B,IAAI,CAAC,kBAAkB,GAAG,cAAc,CAAC,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,SAAS,GAAG,cAAc,CAAC,IAAI,CAAC,UAAU,EAAE,QAAQ,CAAC;QAC1D,IAAI,CAAC,WAAW,GAAG,cAAc,CAAC,IAAI,CAAC,YAAY,EAAE,WAAW,CAAC;AACnE,KAAC;;;;IAMD,MAAM,GAAA;QACJ,QACE,4DAAK,KAAK,EAAC,2EAA2E,EAAC,IAAI,EAAC,MAAM,EAAA,EAEhG,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,IAAI,CAAC,kBAAkB,EAAE,EAC1D,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,kBAAkB,GAAG,OAAO,CAAC,EACrD,IAAI,EAAC,MAAM,EAAA,EAEX,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAA,CAAI,CACrD,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,gCAAgC,EAAC,IAAI,EAAC,SAAS,EAAA,EACxD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,0BAA0B,EAAC,IAAI,EAAC,cAAc,EAAA,EAEvD,CAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,iIAAiI,EACvI,IAAI,EAAC,OAAO,EAAA,EAEZ,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACL,EAEL,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,EAAE,uCAAuC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,EACpF,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,EAC7C,IAAI,EAAC,QAAQ,EAAA,EAEb,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAI,CAAA,CACvD,CACF,EAEN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,0IAA0I,EAAE,IAAI;AAChJ,gBAAA,MAAM,EAAE,CAAC,IAAI,CAAC,WAAW;aAC1B,EACD,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,EAC/C,IAAI,EAAC,WAAW,EAAA,EAEhB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,WAAW,EAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAI,CAAA,CAC1D,CACF,CACF;;;;;;;"}

package/dist/beeq/bq-progress.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"bq-progress.entry.esm.js","sources":["../../packages/beeq/src/components/progress/bq-progress.types.ts","../../packages/beeq/src/components/progress/scss/bq-progress.scss?tag=bq-progress&encapsulation=shadow","../../packages/beeq/src/components/progress/bq-progress.tsx"],"sourcesContent":["export const PROGRESS_BORDER_SHAPE = ['square', 'rounded'] as const;\nexport type TProgressBorderShape = (typeof PROGRESS_BORDER_SHAPE)[number];\n\nexport const PROGRESS_THICKNESS = ['medium', 'large'] as const;\nexport type TProgressThickness = (typeof PROGRESS_THICKNESS)[number];\n\nexport const PROGRESS_TYPE = ['default', 'error'] as const;\nexport type TProgressType = (typeof PROGRESS_TYPE)[number];\n","/* -------------------------------------------------------------------------- */\n/*                        Progress styles                        */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-progress.variables';\n\n@layer component {\n  @keyframes move-indeterminate {\n    0% {\n      inset-inline-start: 0;\n    }\n\n    100% {\n      inset-inline-start: calc(100% - var(--bq-progress-bar--indeterminateWidth));\n    }\n  }\n\n  .animate-indeterminate {\n    animation: move-indeterminate 1s linear 0s infinite alternate-reverse;\n  }\n}\n\n.progress-bar {\n  @apply relative appearance-none bs-[--bq-progress-bar--height] is-full;\n}\n\n.progress-bar::-webkit-progress-bar {\n  @apply bg-[--bq-progress-bar--trackColor];\n}\n\n.progress-bar::-webkit-progress-value {\n  @apply bg-[--bq-progress-bar--indicatorColor];\n}\n\n.progress-bar::-moz-progress-bar {\n  @apply animate-indeterminate bg-[--bq-progress-bar--indicatorColor];\n}\n\n.progress-bar:indeterminate::-moz-progress-bar {\n  @apply bg-[--bq-progress-bar--trackColor];\n}\n\n.progress-bar.progress-bar__border-shape::-webkit-progress-value,\n.progress-bar.progress-bar__border-shape::-webkit-progress-bar {\n  @apply rounded-full;\n}\n\n.progress-bar__indeterminate {\n  @apply animate-indeterminate;\n}\n\n.progress-bar.progress-bar__border-shape::-moz-progress-bar {\n  @apply animate-indeterminate rounded-full;\n}\n","import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\n\nimport { PROGRESS_BORDER_SHAPE, PROGRESS_THICKNESS, PROGRESS_TYPE } from './bq-progress.types';\nimport type { TProgressBorderShape, TProgressThickness, TProgressType } from './bq-progress.types';\nimport { validatePropValue } from '../../shared/utils';\n\n/**\n * The progress bar is a user interface component that visually represents the completion status of a task or process.\n *\n * @example How to use it\n * ```html\n * <bq-progress value=\"50\"></bq-progress>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/691cb3-progress\n * @status stable\n *\n * @dependency bq-tooltip\n *\n * @attr {\"rounded\" | \"rounded-full\"} border-shape - It will set the border style of the progress bar\n * @attr {boolean} enable-tooltip - If `true`, a tooltip will be shown displaying the progress value\n * @attr {boolean} indeterminate - If `true` the indeterminate state of progress bar is enabled\n * @attr {boolean} label - If `true`, a label text showing the value (in percentage) will be shown\n * @attr {\"small\" | \"medium\" | \"large\"} thickness - Progress bar thickness\n * @attr {\"default\" | \"error\"} type - Progress type\n * @attr {number} value - A number representing the current value of the progress bar\n *\n * @part wrapper - The component wrapper container inside the shadow DOM\n * @part progress - The `<div>` container that holds the native progress element\n * @part progress-bar - The native html for progress element\n * @part label - The `<div>` container that holds the label value (in percentage)\n * @part indeterminate - The `<div>` container that holds the indeterminate progress bar\n * @part base - The base container for the tooltip component inside the shadow DOM when hovering over the progress bar\n * @part trigger - The container holding the element that triggers the tooltip display when hovering over the progress bar\n * @part panel - The container holding the content of the tooltip when hovering over the progress bar\n *\n * @cssprop --bq-progress-bar--height - The progress bars height\n * @cssprop --bq-progress-bar--indeterminateWidth - The progress bar width when its indeterminate\n * @cssprop --bq-progress-bar--indicatorColor - The progress bar color (inside the track area)\n * @cssprop --bq-progress-bar--trackColor - The progress bar track area (the grey one)\n */\n@Component({\n  tag: 'bq-progress',\n  styleUrl: './scss/bq-progress.scss',\n  shadow: true,\n})\nexport class BqProgress {\n  // Own Properties\n  // ====================\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqProgressElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  // Public Property API\n  // ========================\n\n  /** It will set the border style of the progress bar */\n  @Prop({ reflect: true }) borderShape: TProgressBorderShape = 'rounded';\n\n  /** If `true`, a tooltip will be shown displaying the progress value */\n  @Prop({ reflect: true }) enableTooltip: boolean = false;\n\n  /** If `true` the indeterminate state of progress bar is enabled */\n  @Prop({ reflect: true }) indeterminate: boolean = false;\n\n  /** If `true, a label text showing the value (in percentage) will be shown */\n  @Prop({ reflect: true }) label: boolean = false;\n\n  /** Progress bar thickness */\n  @Prop({ reflect: true }) thickness: TProgressThickness = 'medium';\n\n  /** Progress type */\n  @Prop({ reflect: true }) type: TProgressType = 'default';\n\n  /** A number representing the current value of the progress bar */\n  @Prop({ reflect: true, mutable: true }) value = 0;\n\n  // Prop lifecycle events\n  // =======================\n\n  @Watch('borderShape')\n  @Watch('thickness')\n  @Watch('type')\n  handleTypePropChange() {\n    validatePropValue(PROGRESS_BORDER_SHAPE, 'rounded', this.el, 'borderShape');\n    validatePropValue(PROGRESS_THICKNESS, 'medium', this.el, 'thickness');\n    validatePropValue(PROGRESS_TYPE, 'default', this.el, 'type');\n  }\n\n  @Watch('value')\n  handleValuePropChange(newValue: number) {\n    this.validateValue(newValue);\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentWillLoad() {\n    this.handleTypePropChange();\n    this.handleValuePropChange(this.value);\n  }\n\n  // Listeners\n  // ==============\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private validateValue(newValue: number) {\n    const clampedValue = Math.max(0, Math.min(100, newValue));\n    if (newValue !== clampedValue) {\n      this.value = clampedValue;\n    }\n    return this.value;\n  }\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    const style = {\n      ...(this.thickness === 'large' && { '--bq-progress-bar--height': 'var(--bq-spacing-xs)' }),\n      ...(this.type === 'error' && { '--bq-progress-bar--indicatorColor': 'var(--bq-ui--danger)' }),\n    };\n\n    return (\n      <Host style={style}>\n        <div class=\"flex items-center\" part=\"wrapper\">\n          <div class=\"relative flex items-center is-full\" part=\"progress\">\n            <progress\n              class={{\n                [`progress-bar progress-bar__${this.type} ${this.thickness}`]: true,\n                'progress-bar__border-shape rounded-full': this.borderShape === 'rounded',\n              }}\n              value={this.indeterminate ? undefined : this.value}\n              max=\"100\"\n              part=\"progress-bar\"\n            />\n            {this.enableTooltip && !this.indeterminate && (\n              <bq-tooltip\n                class=\"absolute [&::part(panel)]:absolute\"\n                exportparts=\"base,trigger,panel\"\n                alwaysVisible={true}\n                distance={16}\n                style={{ insetInlineStart: `${this.value}%`, fontVariant: 'tabular-nums' }}\n              >\n                <div class=\"absolute bs-1 is-1\" slot=\"trigger\"></div>\n                {this.value}\n              </bq-tooltip>\n            )}\n            {this.indeterminate && (\n              <div\n                class={{\n                  'progress-bar__indeterminate absolute bg-[--bq-progress-bar--indicatorColor] bs-[--bq-progress-bar--height] is-[--bq-progress-bar--indeterminateWidth]': true,\n                  'rounded-full': this.borderShape === 'rounded',\n                }}\n                part=\"indeterminate\"\n              />\n            )}\n          </div>\n          <div\n            aria-hidden={!this.label || this.indeterminate ? 'true' : 'false'}\n            class={{\n              'ms-xs font-medium leading-regular': true,\n              'text-primary': this.type !== 'error',\n              'text-danger': this.type === 'error',\n              'invisible ms-0 is-0': !this.label || this.indeterminate,\n            }}\n            style={{ fontVariant: 'tabular-nums' }}\n            part=\"label\"\n          >\n            <span>{this.value}%</span>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"bq-progress.entry.esm.js","sources":["../../packages/beeq/src/components/progress/bq-progress.types.ts","../../packages/beeq/src/components/progress/scss/bq-progress.scss?tag=bq-progress&encapsulation=shadow","../../packages/beeq/src/components/progress/bq-progress.tsx"],"sourcesContent":["export const PROGRESS_BORDER_SHAPE = ['square', 'rounded'] as const;\nexport type TProgressBorderShape = (typeof PROGRESS_BORDER_SHAPE)[number];\n\nexport const PROGRESS_THICKNESS = ['medium', 'large'] as const;\nexport type TProgressThickness = (typeof PROGRESS_THICKNESS)[number];\n\nexport const PROGRESS_TYPE = ['default', 'error'] as const;\nexport type TProgressType = (typeof PROGRESS_TYPE)[number];\n","/* -------------------------------------------------------------------------- */\n/*                        Progress styles                        */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-progress.variables';\n\n@layer component {\n  @keyframes move-indeterminate {\n    0% {\n      inset-inline-start: 0;\n    }\n\n    100% {\n      inset-inline-start: calc(100% - var(--bq-progress-bar--indeterminateWidth));\n    }\n  }\n\n  .animate-indeterminate {\n    animation: move-indeterminate 1s linear 0s infinite alternate-reverse;\n  }\n}\n\n.progress-bar {\n  @apply relative appearance-none bs-[--bq-progress-bar--height] is-full;\n}\n\n.progress-bar::-webkit-progress-bar {\n  @apply bg-[--bq-progress-bar--trackColor];\n}\n\n.progress-bar::-webkit-progress-value {\n  @apply bg-[--bq-progress-bar--indicatorColor];\n}\n\n.progress-bar::-moz-progress-bar {\n  @apply animate-indeterminate bg-[--bq-progress-bar--indicatorColor];\n}\n\n.progress-bar:indeterminate::-moz-progress-bar {\n  @apply bg-[--bq-progress-bar--trackColor];\n}\n\n.progress-bar.progress-bar__border-shape::-webkit-progress-value,\n.progress-bar.progress-bar__border-shape::-webkit-progress-bar {\n  @apply rounded-full;\n}\n\n.progress-bar__indeterminate {\n  @apply animate-indeterminate;\n}\n\n.progress-bar.progress-bar__border-shape::-moz-progress-bar {\n  @apply animate-indeterminate rounded-full;\n}\n","import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\n\nimport { PROGRESS_BORDER_SHAPE, PROGRESS_THICKNESS, PROGRESS_TYPE } from './bq-progress.types';\nimport type { TProgressBorderShape, TProgressThickness, TProgressType } from './bq-progress.types';\nimport { validatePropValue } from '../../shared/utils';\n\n/**\n * The progress bar is a user interface component that visually represents the completion status of a task or process.\n *\n * @example How to use it\n * ```html\n * <bq-progress value=\"50\"></bq-progress>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/691cb3-progress\n * @status stable\n *\n * @dependency bq-tooltip\n *\n * @attr {\"rounded\" | \"rounded-full\"} border-shape - It will set the border style of the progress bar\n * @attr {boolean} enable-tooltip - If `true`, a tooltip will be shown displaying the progress value\n * @attr {boolean} indeterminate - If `true` the indeterminate state of progress bar is enabled\n * @attr {boolean} label - If `true`, a label text showing the value (in percentage) will be shown\n * @attr {\"small\" | \"medium\" | \"large\"} thickness - Progress bar thickness\n * @attr {\"default\" | \"error\"} type - Progress type\n * @attr {number} value - A number representing the current value of the progress bar\n *\n * @part wrapper - The component wrapper container inside the shadow DOM\n * @part progress - The `<div>` container that holds the native progress element\n * @part progress-bar - The native html for progress element\n * @part label - The `<div>` container that holds the label value (in percentage)\n * @part indeterminate - The `<div>` container that holds the indeterminate progress bar\n * @part base - The base container for the tooltip component inside the shadow DOM when hovering over the progress bar\n * @part trigger - The container holding the element that triggers the tooltip display when hovering over the progress bar\n * @part panel - The container holding the content of the tooltip when hovering over the progress bar\n *\n * @cssprop --bq-progress-bar--height - The progress bars height\n * @cssprop --bq-progress-bar--indeterminateWidth - The progress bar width when its indeterminate\n * @cssprop --bq-progress-bar--indicatorColor - The progress bar color (inside the track area)\n * @cssprop --bq-progress-bar--trackColor - The progress bar track area (the grey one)\n */\n@Component({\n  tag: 'bq-progress',\n  styleUrl: './scss/bq-progress.scss',\n  shadow: true,\n})\nexport class BqProgress {\n  // Own Properties\n  // ====================\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqProgressElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  // Public Property API\n  // ========================\n\n  /** It will set the border style of the progress bar */\n  @Prop({ reflect: true }) borderShape: TProgressBorderShape = 'rounded';\n\n  /** If `true`, a tooltip will be shown displaying the progress value */\n  @Prop({ reflect: true }) enableTooltip: boolean = false;\n\n  /** If `true` the indeterminate state of progress bar is enabled */\n  @Prop({ reflect: true }) indeterminate: boolean = false;\n\n  /** If `true, a label text showing the value (in percentage) will be shown */\n  @Prop({ reflect: true }) label: boolean = false;\n\n  /** Progress bar thickness */\n  @Prop({ reflect: true }) thickness: TProgressThickness = 'medium';\n\n  /** Progress type */\n  @Prop({ reflect: true }) type: TProgressType = 'default';\n\n  /** A number representing the current value of the progress bar */\n  @Prop({ reflect: true, mutable: true }) value = 0;\n\n  // Prop lifecycle events\n  // =======================\n\n  @Watch('borderShape')\n  @Watch('thickness')\n  @Watch('type')\n  handleTypePropChange() {\n    validatePropValue(PROGRESS_BORDER_SHAPE, 'rounded', this.el, 'borderShape');\n    validatePropValue(PROGRESS_THICKNESS, 'medium', this.el, 'thickness');\n    validatePropValue(PROGRESS_TYPE, 'default', this.el, 'type');\n  }\n\n  @Watch('value')\n  handleValuePropChange(newValue: number) {\n    this.validateValue(newValue);\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentWillLoad() {\n    this.handleTypePropChange();\n    this.handleValuePropChange(this.value);\n  }\n\n  // Listeners\n  // ==============\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private validateValue(newValue: number) {\n    const clampedValue = Math.max(0, Math.min(100, newValue));\n    if (newValue !== clampedValue) {\n      this.value = clampedValue;\n    }\n    return this.value;\n  }\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    const style = {\n      ...(this.thickness === 'large' && { '--bq-progress-bar--height': 'var(--bq-spacing-xs)' }),\n      ...(this.type === 'error' && { '--bq-progress-bar--indicatorColor': 'var(--bq-ui--danger)' }),\n    };\n\n    return (\n      <Host style={style}>\n        <div class=\"flex items-center\" part=\"wrapper\">\n          <div class=\"relative flex items-center is-full\" part=\"progress\">\n            <progress\n              class={{\n                [`progress-bar progress-bar__${this.type} ${this.thickness}`]: true,\n                'progress-bar__border-shape rounded-full': this.borderShape === 'rounded',\n              }}\n              value={this.indeterminate ? undefined : this.value}\n              max=\"100\"\n              part=\"progress-bar\"\n            />\n            {this.enableTooltip && !this.indeterminate && (\n              <bq-tooltip\n                class=\"absolute [&::part(panel)]:absolute\"\n                exportparts=\"base,trigger,panel\"\n                alwaysVisible={true}\n                distance={16}\n                style={{ insetInlineStart: `${this.value}%`, fontVariant: 'tabular-nums' }}\n              >\n                <div class=\"absolute bs-1 is-1\" slot=\"trigger\"></div>\n                {this.value}\n              </bq-tooltip>\n            )}\n            {this.indeterminate && (\n              <div\n                class={{\n                  'progress-bar__indeterminate absolute bg-[--bq-progress-bar--indicatorColor] bs-[--bq-progress-bar--height] is-[--bq-progress-bar--indeterminateWidth]': true,\n                  'rounded-full': this.borderShape === 'rounded',\n                }}\n                part=\"indeterminate\"\n              />\n            )}\n          </div>\n          <div\n            aria-hidden={!this.label || this.indeterminate ? 'true' : 'false'}\n            class={{\n              'ms-xs font-medium leading-regular': true,\n              'text-primary': this.type !== 'error',\n              'text-danger': this.type === 'error',\n              'invisible ms-0 is-0': !this.label || this.indeterminate,\n            }}\n            style={{ fontVariant: 'tabular-nums' }}\n            part=\"label\"\n          >\n            <span>{this.value}%</span>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/beeq/bq-radio-group.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"bq-radio-group.entry.esm.js","sources":["../../packages/beeq/src/components/radio-group/bq-radio-group.types.ts","../../packages/beeq/src/components/radio-group/scss/bq-radio-group.scss?tag=bq-radio-group&encapsulation=shadow","../../packages/beeq/src/components/radio-group/bq-radio-group.tsx"],"sourcesContent":["export const RADIO_GROUP_ORIENTATION = ['horizontal', 'vertical'] as const;\nexport type TRadioGroupOrientation = (typeof RADIO_GROUP_ORIENTATION)[number];\n","/* -------------------------------------------------------------------------- */\n/*                                Radio group styles                               */\n/* -------------------------------------------------------------------------- */\n\n:host {\n  @apply inline-block;\n}\n\n.bq-radio-group {\n  @apply m-b-0 m-i-0;\n\n  &:not(.has-fieldset) {\n    @apply border-0 m-b-0 m-i-0 p-b-0 p-i-0;\n  }\n\n  &--horizontal {\n    @apply flex;\n  }\n\n  &--vertical {\n    @apply flex flex-col;\n  }\n}\n","import { AttachInternals, Component, Element, Event, h, Host, Listen, Prop, State, Watch } from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\n\nimport { RADIO_GROUP_ORIENTATION } from './bq-radio-group.types';\nimport type { TRadioGroupOrientation } from './bq-radio-group.types';\nimport {\n  debounce,\n  getNextElement,\n  isEventTargetChildOfElement,\n  isNil,\n  TDebounce,\n  validatePropValue,\n} from '../../shared/utils';\n\nconst KEY_MAP = {\n  ArrowDown: 'forward',\n  ArrowRight: 'forward',\n  ArrowUp: 'backward',\n  ArrowLeft: 'backward',\n} as const;\n\ntype Direction = (typeof KEY_MAP)[keyof typeof KEY_MAP];\n\n/**\n * The radio group is a user interface component that groups radio buttons to enable a single selection within the group.\n *\n * @example How to use it\n * ```html\n * <bq-radio-group fieldset value=\"option1\">\n *   <span slot=\"label\">radio group</span>\n *   <bq-radio value=\"option1\">Radio option 1</bq-radio>\n *   <bq-radio value=\"option2\">Radio option 2</bq-radio>\n *   <bq-radio value=\"option3\">Radio option 3</bq-radio>\n * </bq-radio-group>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/9718e1-radio-button/b/09d7b1\n * @status stable\n *\n * @attr {boolean} background-on-hover - If `true`, the radio displays background on hover\n * @attr {number} debounce-time - A number representing the delay time (in milliseconds) that bqChange event handler gets triggered once the value change\n * @attr {boolean} disabled - If `true` radio inputs are disabled\n * @attr {boolean} fieldset - If `true` displays fieldset\n * @attr {string} name - Name of the HTML input form control. Submitted with the form as part of a name/value pair\n * @attr {\"horizontal\" | \"vertical\"} orientation - The display orientation of the radio inputs\n * @attr {boolean} required - If `true`, the radio group is required\n * @attr {string} required-validation-message - The native form validation message when the radio group is required\n * @attr {string} value - The display orientation of the radio inputs\n *\n * @method vClick - Simulate a click event on the native `<input>` HTML element used under the hood\n * @method vFocus - Sets focus on the native `<input>` HTML element used under the hood\n * @method vBlur - Remove focus from the native `<input>` HTML element used under the hood\n *\n * @event bqChange - Handler to be called when the radio state changes\n *\n * @slot - The bq-radio items to group\n * @slot label - The label content of radio group\n *\n * @part base - The component's internal wrapper of the radio components.\n * @part label - The `<legend>` element that holds the text content.\n * @part group - The `<div>` element that holds the radio inputs.\n */\n@Component({\n  tag: 'bq-radio-group',\n  styleUrl: './scss/bq-radio-group.scss',\n  formAssociated: true,\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class BqRadioGroup {\n  // Own Properties\n  // ====================\n\n  private initialValue?: string;\n  private debouncedBqChange: TDebounce<{ value: string; target: HTMLBqRadioElement }>;\n  private focusedBqRadio: HTMLBqRadioElement | null = null;\n  private readonly radioElementsSet = new Set<HTMLBqRadioElement>();\n  private cachedRadioElements: HTMLBqRadioElement[] = [];\n\n  // Reference to host HTML element\n  // ===================================\n\n  @AttachInternals() internals!: ElementInternals;\n  @Element() el!: HTMLBqRadioGroupElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() checkedRadio?: HTMLBqRadioElement;\n  @State() tabIndex: '0' | '-1' = '0';\n\n  // Public Property API\n  // ========================\n\n  /** If true, all radio inputs in the group will display a background on hover */\n  @Prop({ reflect: true }) backgroundOnHover = false;\n\n  /** A number representing the delay time (in milliseconds) that `bqChange` event handler gets triggered once the value change */\n  @Prop({ reflect: true, mutable: true }) debounceTime = 0;\n\n  /** If true radio inputs are disabled */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** If true displays fieldset */\n  @Prop({ reflect: true }) fieldset = false;\n\n  /** Name of the HTML input form control. Submitted with the form as part of a name/value pair.  */\n  @Prop({ reflect: true }) name!: string;\n\n  /** The display orientation of the radio inputs */\n  @Prop({ reflect: true, mutable: true }) orientation: TRadioGroupOrientation = 'vertical';\n\n  /** If true, the radio group is required */\n  @Prop({ reflect: true }) required = false;\n\n  /** The native form validation message when the radio group is required */\n  @Prop({ reflect: true }) requiredValidationMessage?: string;\n\n  /** A string representing the value of the radio. */\n  @Prop({ reflect: true, mutable: true }) value?: string;\n\n  // Prop lifecycle events\n  // =======================\n\n  @Watch('debounceTime')\n  handleDebounceTimeChange() {\n    const MIN_DEBOUNCE_TIME = 0;\n    const normalizedDebounceTime = Math.max(MIN_DEBOUNCE_TIME, this.debounceTime);\n\n    if (normalizedDebounceTime !== this.debounceTime) {\n      this.debounceTime = normalizedDebounceTime;\n    }\n\n    this.debouncedBqChange?.cancel();\n    this.debouncedBqChange = debounce((event: { value: string; target: HTMLBqRadioElement }): void => {\n      this.bqChange?.emit(event);\n    }, this.debounceTime);\n  }\n\n  @Watch('disabled')\n  handleDisabledChange() {\n    this.tabIndex = this.disabled ? '-1' : '0';\n    this.updateRadioTabIndexes();\n  }\n\n  @Watch('backgroundOnHover')\n  @Watch('disabled')\n  @Watch('name')\n  @Watch('required')\n  handleGroupProperties() {\n    this.updateRadioProperties();\n  }\n\n  @Watch('orientation')\n  checkPropValues() {\n    validatePropValue(RADIO_GROUP_ORIENTATION, 'vertical', this.el, 'orientation');\n  }\n\n  @Watch('required')\n  handleRequiredChange() {\n    this.updateFormValidity();\n  }\n\n  @Watch('value')\n  handleValueChange() {\n    this.updateRadioProperties();\n    this.updateFormValidity();\n\n    // Find and update the checked radio based on the new value\n    const newCheckedRadio = this.cachedRadioElements.find((radio) => radio.value === this.value);\n    if (newCheckedRadio) {\n      this.checkedRadio = newCheckedRadio;\n      this.debouncedBqChange?.({ value: this.value, target: newCheckedRadio });\n    } else {\n      this.checkedRadio = undefined;\n    }\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Handler to be called when the radio state changes */\n  @Event() bqChange: EventEmitter<{ value: string; target: HTMLBqRadioElement }>;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentWillLoad() {\n    this.initialValue = this.value;\n    this.handleDebounceTimeChange();\n    this.internals.setFormValue(this.value ?? null);\n\n    this.updateCustomStates();\n    this.updateFormValidity();\n  }\n\n  disconnectedCallback() {\n    this.debouncedBqChange?.cancel();\n  }\n\n  formAssociatedCallback() {\n    this.internals.setFormValue(this.value ?? null);\n    this.updateFormValidity();\n  }\n\n  formResetCallback() {\n    this.value = this.initialValue;\n    this.internals.setFormValue(this.value ?? null);\n    this.updateFormValidity();\n    this.updateCustomStates();\n  }\n\n  // Listeners\n  // ==============\n\n  @Listen('bqClick', { capture: true })\n  async onBqClick(event: CustomEvent<{ value: string; target: HTMLBqRadioElement }>) {\n    if (!isEventTargetChildOfElement(event, this.el)) return;\n\n    const { target, value } = event.detail;\n    if (value === this.value) return;\n\n    requestAnimationFrame(() => {\n      if (event.defaultPrevented) return;\n      this.updateRadioSelection(target);\n    });\n  }\n\n  @Listen('bqKeyDown')\n  onBqKeyDown(event: CustomEvent<{ key: string; target: HTMLBqRadioElement }>) {\n    if (!isEventTargetChildOfElement(event, this.el)) return;\n\n    const direction: Direction | undefined = KEY_MAP[event.detail.key];\n    if (!direction) return;\n\n    this.focusRadioInputSibling(event.detail.target, direction);\n  }\n\n  @Listen('bqFocus', { capture: true })\n  onBqFocus(event: CustomEvent<HTMLBqRadioElement>) {\n    if (!isEventTargetChildOfElement(event, this.el)) return;\n\n    const shouldStopPropagation = this.focusedBqRadio && event.detail !== this.focusedBqRadio;\n    if (shouldStopPropagation) {\n      event.stopPropagation();\n    }\n\n    this.focusedBqRadio = event.detail;\n  }\n\n  @Listen('bqBlur', { capture: true })\n  onBqBlur(event: CustomEvent<HTMLBqRadioElement>) {\n    if (!isEventTargetChildOfElement(event, this.el)) return;\n\n    const shouldStopPropagation = this.focusedBqRadio && event.detail !== this.focusedBqRadio;\n    if (shouldStopPropagation) {\n      event.stopPropagation();\n      return;\n    }\n\n    this.focusedBqRadio = null;\n  }\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  /**\n   * Initializes the radio elements set by querying the host element for `ds-radio` elements.\n   * This is done to avoid re-querying the host element for radio elements on every change.\n   */\n  private initializeRadioElements = (): void => {\n    this.radioElementsSet.clear();\n    this.el.querySelectorAll('bq-radio').forEach((radio) => this.radioElementsSet.add(radio));\n    // Caching the radio elements in an array for faster access and iteration\n    this.cachedRadioElements = Array.from(this.radioElementsSet);\n    // Set the tabIndex of the host element to -1 if there are no radio elements or the group is disabled, otherwise set it to 0\n    this.tabIndex = this.cachedRadioElements.length === 0 || this.disabled ? '-1' : '0';\n    // Set initial tabIndex for all radios\n    this.updateRadioTabIndexes();\n  };\n\n  /**\n   * Sets tabIndex for all radio elements based on current state\n   * Handles all scenarios: disabled state, checked radio, value matching, fallback to first\n   */\n  private updateRadioTabIndexes = (): void => {\n    if (this.cachedRadioElements.length === 0) return;\n\n    // If disabled, all radios get tabIndex -1\n    if (this.disabled) {\n      this.cachedRadioElements.forEach((radio) => (radio.tabIndex = -1));\n      return;\n    }\n\n    // Find which radio should be focusable\n    let focusableRadio: HTMLBqRadioElement | undefined;\n\n    // Priority 1: Currently checked radio\n    focusableRadio = this.cachedRadioElements.find((radio) => radio.checked);\n\n    // Priority 2: Radio matching current value\n    if (!focusableRadio && this.value) {\n      focusableRadio = this.cachedRadioElements.find((radio) => radio.value === this.value);\n    }\n\n    // Priority 3: First enabled radio (fallback)\n    if (!focusableRadio) {\n      focusableRadio = this.cachedRadioElements.find((radio) => !radio.disabled);\n    }\n\n    // Apply tabIndex to all radios\n    this.cachedRadioElements.forEach((radio) => {\n      radio.tabIndex = radio === focusableRadio ? 0 : -1;\n    });\n  };\n\n  /**\n   * Updates the radio selection and focus.\n   * @param target - The radio element to update.\n   */\n  private updateRadioSelection = (target: HTMLBqRadioElement): void => {\n    // Only uncheck the previously checked radio if it's different\n    if (this.checkedRadio && this.checkedRadio !== target) {\n      this.checkedRadio.checked = false;\n      this.checkedRadio.tabIndex = -1;\n    }\n\n    target.checked = true;\n    target.tabIndex = 0;\n    target.vFocus();\n\n    this.checkedRadio = target;\n    this.value = target.value;\n    this.internals?.setFormValue(this.value ?? null);\n\n    this.updateRadioTabIndexes();\n  };\n\n  /**\n   * Synchronizes properties of child radio elements with the group's state.\n   */\n  private updateRadioProperties = (): void => {\n    if (this.cachedRadioElements.length === 0) return;\n\n    const { backgroundOnHover, disabled, name, required, value } = this;\n\n    for (const radio of this.cachedRadioElements) {\n      radio.backgroundOnHover = backgroundOnHover;\n      radio.checked = value === radio.value;\n      // This will allows us to force all radio elements to be disabled\n      // while keeping the disabled state of the radio element if it was set individually by the user\n      radio.forceDisabled = disabled;\n      radio.name = name;\n      radio.required = required;\n    }\n  };\n\n  /**\n   * Focuses the next/previous radio element in the group based on the current target.\n   * Handles circular navigation and skips disabled elements.\n   * @param currentTarget - The currently focused radio element\n   * @param direction - The navigation direction ('forward' | 'backward')\n   */\n  private focusRadioInputSibling = (currentTarget: HTMLBqRadioElement, direction: Direction): void => {\n    // If there is none or only one radio element, there will be no sibling to focus\n    if (this.cachedRadioElements.length <= 1) return;\n\n    const currentIndex = this.cachedRadioElements.indexOf(currentTarget);\n    // If the index of the radio element target is not found, it means that it's not part of the group\n    if (currentIndex === -1) return;\n\n    const nextElement = getNextElement(this.cachedRadioElements, currentIndex, direction);\n    this.updateRadioSelection(nextElement);\n  };\n\n  private updateFormValidity = async (): Promise<void> => {\n    const { internals, required, requiredValidationMessage, value } = this;\n    // Clear the validity state\n    internals?.states.clear();\n\n    if (!required || (required && !isNil(value))) {\n      // If the radio group is not required or has a value, set the validity state to valid\n      internals?.states.add('valid');\n      internals?.setValidity({});\n      return;\n    }\n\n    const firstRadio = this.cachedRadioElements[0];\n    if (!firstRadio) return;\n    // If the radio group is required and has no value, set the validity state to invalid\n    internals?.states.add('invalid');\n    // We need to pass the native input element to the setValidity method as anchor element\n    internals?.setValidity(\n      { valueMissing: true },\n      requiredValidationMessage ?? 'Please select an option',\n      await firstRadio.getNativeInput(),\n    );\n  };\n\n  /**\n   * Updates the custom states based on the component properties.\n   * The custom states can be used to style the component based on the component properties.\n   * The custom states are `disabled`, based on the component properties.\n   */\n  private updateCustomStates = (): void => {\n    const states = new Set<string>();\n\n    if (this.disabled) states.add('disabled');\n    if (this.orientation) states.add(this.orientation);\n\n    // Update states\n    this.internals?.states.clear();\n    states.forEach((state) => this.internals?.states.add(state));\n  };\n\n  private handleSlotChange = (): void => {\n    this.initializeRadioElements();\n    this.updateRadioProperties();\n  };\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    return (\n      <Host tabindex={this.tabIndex}>\n        <fieldset\n          class={{ 'bq-radio-group': true, 'has-fieldset': this.fieldset }}\n          aria-controls=\"bq-radiogroup\"\n          aria-labelledby=\"bq-radio-group__label\"\n          aria-disabled={this.disabled}\n          aria-required={this.required}\n          disabled={this.disabled}\n          role=\"radiogroup\"\n          part=\"base\"\n        >\n          <legend part=\"label\">\n            <slot id=\"bq-radiogroup__label\" name=\"label\" />\n          </legend>\n          <div class={`bq-radio-group--${this.orientation}`} part=\"group\">\n            <slot id=\"bq-radiogroup\" onSlotchange={this.handleSlotChange} />\n          </div>\n        </fieldset>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"bq-radio-group.entry.esm.js","sources":["../../packages/beeq/src/components/radio-group/bq-radio-group.types.ts","../../packages/beeq/src/components/radio-group/scss/bq-radio-group.scss?tag=bq-radio-group&encapsulation=shadow","../../packages/beeq/src/components/radio-group/bq-radio-group.tsx"],"sourcesContent":["export const RADIO_GROUP_ORIENTATION = ['horizontal', 'vertical'] as const;\nexport type TRadioGroupOrientation = (typeof RADIO_GROUP_ORIENTATION)[number];\n","/* -------------------------------------------------------------------------- */\n/*                                Radio group styles                               */\n/* -------------------------------------------------------------------------- */\n\n:host {\n  @apply inline-block;\n}\n\n.bq-radio-group {\n  @apply m-b-0 m-i-0;\n\n  &:not(.has-fieldset) {\n    @apply border-0 m-b-0 m-i-0 p-b-0 p-i-0;\n  }\n\n  &--horizontal {\n    @apply flex;\n  }\n\n  &--vertical {\n    @apply flex flex-col;\n  }\n}\n","import { AttachInternals, Component, Element, Event, h, Host, Listen, Prop, State, Watch } from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\n\nimport { RADIO_GROUP_ORIENTATION } from './bq-radio-group.types';\nimport type { TRadioGroupOrientation } from './bq-radio-group.types';\nimport {\n  debounce,\n  getNextElement,\n  isDefined,\n  isEventTargetChildOfElement,\n  isNil,\n  TDebounce,\n  validatePropValue,\n} from '../../shared/utils';\n\nconst KEY_MAP = {\n  ArrowDown: 'forward',\n  ArrowRight: 'forward',\n  ArrowUp: 'backward',\n  ArrowLeft: 'backward',\n} as const;\n\ntype Direction = (typeof KEY_MAP)[keyof typeof KEY_MAP];\n\n/**\n * The radio group is a user interface component that groups radio buttons to enable a single selection within the group.\n *\n * @example How to use it\n * ```html\n * <bq-radio-group fieldset value=\"option1\">\n *   <span slot=\"label\">radio group</span>\n *   <bq-radio value=\"option1\">Radio option 1</bq-radio>\n *   <bq-radio value=\"option2\">Radio option 2</bq-radio>\n *   <bq-radio value=\"option3\">Radio option 3</bq-radio>\n * </bq-radio-group>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/9718e1-radio-button/b/09d7b1\n * @status stable\n *\n * @attr {boolean} background-on-hover - If `true`, the radio displays background on hover\n * @attr {number} debounce-time - A number representing the delay time (in milliseconds) that bqChange event handler gets triggered once the value change\n * @attr {boolean} disabled - If `true` radio inputs are disabled\n * @attr {boolean} fieldset - If `true` displays fieldset\n * @attr {string} name - Name of the HTML input form control. Submitted with the form as part of a name/value pair\n * @attr {\"horizontal\" | \"vertical\"} orientation - The display orientation of the radio inputs\n * @attr {boolean} required - If `true`, the radio group is required\n * @attr {string} required-validation-message - The native form validation message when the radio group is required\n * @attr {string} value - The display orientation of the radio inputs\n *\n * @method vClick - Simulate a click event on the native `<input>` HTML element used under the hood\n * @method vFocus - Sets focus on the native `<input>` HTML element used under the hood\n * @method vBlur - Remove focus from the native `<input>` HTML element used under the hood\n *\n * @event bqChange - Handler to be called when the radio state changes\n *\n * @slot - The bq-radio items to group\n * @slot label - The label content of radio group\n *\n * @part base - The component's internal wrapper of the radio components.\n * @part label - The `<legend>` element that holds the text content.\n * @part group - The `<div>` element that holds the radio inputs.\n */\n@Component({\n  tag: 'bq-radio-group',\n  styleUrl: './scss/bq-radio-group.scss',\n  formAssociated: true,\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class BqRadioGroup {\n  // Own Properties\n  // ====================\n\n  private initialValue?: string;\n  private debouncedBqChange: TDebounce<{ value: string; target: HTMLBqRadioElement }>;\n  private focusedBqRadio: HTMLBqRadioElement | null = null;\n  private readonly radioElementsSet = new Set<HTMLBqRadioElement>();\n  private cachedRadioElements: HTMLBqRadioElement[] = [];\n\n  // Reference to host HTML element\n  // ===================================\n\n  @AttachInternals() internals!: ElementInternals;\n  @Element() el!: HTMLBqRadioGroupElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() checkedRadio?: HTMLBqRadioElement;\n  @State() tabIndex: '0' | '-1' = '0';\n\n  // Public Property API\n  // ========================\n\n  /** If true, all radio inputs in the group will display a background on hover */\n  @Prop({ reflect: true }) backgroundOnHover = false;\n\n  /** A number representing the delay time (in milliseconds) that `bqChange` event handler gets triggered once the value change */\n  @Prop({ reflect: true, mutable: true }) debounceTime = 0;\n\n  /** If true radio inputs are disabled */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** If true displays fieldset */\n  @Prop({ reflect: true }) fieldset = false;\n\n  /** Name of the HTML input form control. Submitted with the form as part of a name/value pair.  */\n  @Prop({ reflect: true }) name!: string;\n\n  /** The display orientation of the radio inputs */\n  @Prop({ reflect: true, mutable: true }) orientation: TRadioGroupOrientation = 'vertical';\n\n  /** If true, the radio group is required */\n  @Prop({ reflect: true }) required = false;\n\n  /** The native form validation message when the radio group is required */\n  @Prop({ reflect: true }) requiredValidationMessage?: string;\n\n  /** A string representing the value of the radio. */\n  @Prop({ reflect: true, mutable: true }) value?: string;\n\n  // Prop lifecycle events\n  // =======================\n\n  @Watch('debounceTime')\n  handleDebounceTimeChange() {\n    const MIN_DEBOUNCE_TIME = 0;\n    const normalizedDebounceTime = Math.max(MIN_DEBOUNCE_TIME, this.debounceTime);\n\n    if (normalizedDebounceTime !== this.debounceTime) {\n      this.debounceTime = normalizedDebounceTime;\n    }\n\n    this.debouncedBqChange?.cancel();\n    this.debouncedBqChange = debounce((event: { value: string; target: HTMLBqRadioElement }): void => {\n      this.bqChange?.emit(event);\n    }, this.debounceTime);\n  }\n\n  @Watch('disabled')\n  handleDisabledChange() {\n    this.tabIndex = this.disabled ? '-1' : '0';\n    this.updateRadioTabIndexes();\n  }\n\n  @Watch('backgroundOnHover')\n  @Watch('disabled')\n  @Watch('name')\n  @Watch('required')\n  handleGroupProperties() {\n    this.updateRadioProperties();\n  }\n\n  @Watch('orientation')\n  checkPropValues() {\n    validatePropValue(RADIO_GROUP_ORIENTATION, 'vertical', this.el, 'orientation');\n  }\n\n  @Watch('required')\n  handleRequiredChange() {\n    this.updateFormValidity();\n  }\n\n  @Watch('value')\n  handleValueChange() {\n    this.updateRadioProperties();\n    this.updateFormValidity();\n\n    // Find and update the checked radio based on the new value\n    const newCheckedRadio = this.cachedRadioElements.find((radio) => radio.value === this.value);\n    if (newCheckedRadio) {\n      this.checkedRadio = newCheckedRadio;\n      this.debouncedBqChange?.({ value: this.value, target: newCheckedRadio });\n    } else {\n      this.checkedRadio = undefined;\n    }\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Handler to be called when the radio state changes */\n  @Event() bqChange: EventEmitter<{ value: string; target: HTMLBqRadioElement }>;\n\n  /** Handler to be called when the radio loses focus */\n  @Event() bqBlur: EventEmitter<HTMLBqRadioElement>;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentWillLoad() {\n    this.initialValue = this.value;\n    this.handleDebounceTimeChange();\n    this.internals.setFormValue(this.value ?? null);\n\n    this.updateCustomStates();\n    this.updateFormValidity();\n  }\n\n  disconnectedCallback() {\n    this.debouncedBqChange?.cancel();\n  }\n\n  formAssociatedCallback() {\n    this.internals.setFormValue(this.value ?? null);\n    this.updateFormValidity();\n  }\n\n  formResetCallback() {\n    this.value = this.initialValue;\n    this.internals.setFormValue(this.value ?? null);\n    this.updateFormValidity();\n    this.updateCustomStates();\n  }\n\n  // Listeners\n  // ==============\n\n  @Listen('bqClick', { capture: true })\n  async onBqClick(event: CustomEvent<{ value: string; target: HTMLBqRadioElement }>) {\n    if (!isEventTargetChildOfElement(event, this.el)) return;\n\n    const { target, value } = event.detail;\n    if (value === this.value) return;\n\n    requestAnimationFrame(() => {\n      if (event.defaultPrevented) return;\n      this.updateRadioSelection(target);\n    });\n  }\n\n  @Listen('bqKeyDown')\n  onBqKeyDown(event: CustomEvent<{ key: string; target: HTMLBqRadioElement }>) {\n    if (!isEventTargetChildOfElement(event, this.el)) return;\n\n    const direction: Direction | undefined = KEY_MAP[event.detail.key];\n    if (!direction) return;\n\n    this.focusRadioInputSibling(event.detail.target, direction);\n  }\n\n  @Listen('bqFocus', { capture: true })\n  onBqFocus(event: CustomEvent<HTMLBqRadioElement>) {\n    if (!isEventTargetChildOfElement(event, this.el)) return;\n\n    const shouldStopPropagation = isDefined(this.focusedBqRadio);\n    this.focusedBqRadio = event.detail;\n\n    if (shouldStopPropagation) {\n      event.stopPropagation();\n    }\n  }\n\n  @Listen('bqBlur', { capture: true })\n  onBqBlur(event: CustomEvent<HTMLBqRadioElement>) {\n    if (!isEventTargetChildOfElement(event, this.el)) return;\n\n    // NOTE: if focusedBqRadio is nil that means the event occured from this component\n    if (isNil(this.focusedBqRadio)) return;\n\n    event.stopPropagation();\n\n    requestAnimationFrame(() => {\n      if (this.focusedBqRadio !== event.detail) return;\n\n      this.focusedBqRadio = null;\n      this.bqBlur.emit(event.detail);\n    });\n  }\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  /**\n   * Initializes the radio elements set by querying the host element for `ds-radio` elements.\n   * This is done to avoid re-querying the host element for radio elements on every change.\n   */\n  private initializeRadioElements = (): void => {\n    this.radioElementsSet.clear();\n    this.el.querySelectorAll('bq-radio').forEach((radio) => this.radioElementsSet.add(radio));\n    // Caching the radio elements in an array for faster access and iteration\n    this.cachedRadioElements = Array.from(this.radioElementsSet);\n    // Set the tabIndex of the host element to -1 if there are no radio elements or the group is disabled, otherwise set it to 0\n    this.tabIndex = this.cachedRadioElements.length === 0 || this.disabled ? '-1' : '0';\n    // Set initial tabIndex for all radios\n    this.updateRadioTabIndexes();\n  };\n\n  /**\n   * Sets tabIndex for all radio elements based on current state\n   * Handles all scenarios: disabled state, checked radio, value matching, fallback to first\n   */\n  private updateRadioTabIndexes = (): void => {\n    if (this.cachedRadioElements.length === 0) return;\n\n    // If disabled, all radios get tabIndex -1\n    if (this.disabled) {\n      this.cachedRadioElements.forEach((radio) => (radio.tabIndex = -1));\n      return;\n    }\n\n    // Find which radio should be focusable\n    let focusableRadio: HTMLBqRadioElement | undefined;\n\n    // Priority 1: Currently checked radio\n    focusableRadio = this.cachedRadioElements.find((radio) => radio.checked);\n\n    // Priority 2: Radio matching current value\n    if (!focusableRadio && this.value) {\n      focusableRadio = this.cachedRadioElements.find((radio) => radio.value === this.value);\n    }\n\n    // Priority 3: First enabled radio (fallback)\n    if (!focusableRadio) {\n      focusableRadio = this.cachedRadioElements.find((radio) => !radio.disabled);\n    }\n\n    // Apply tabIndex to all radios\n    this.cachedRadioElements.forEach((radio) => {\n      radio.tabIndex = radio === focusableRadio ? 0 : -1;\n    });\n  };\n\n  /**\n   * Updates the radio selection and focus.\n   * @param target - The radio element to update.\n   */\n  private updateRadioSelection = (target: HTMLBqRadioElement): void => {\n    // Only uncheck the previously checked radio if it's different\n    if (this.checkedRadio && this.checkedRadio !== target) {\n      this.checkedRadio.checked = false;\n      this.checkedRadio.tabIndex = -1;\n    }\n\n    target.checked = true;\n    target.tabIndex = 0;\n    target.vFocus();\n\n    this.checkedRadio = target;\n    this.value = target.value;\n    this.internals?.setFormValue(this.value ?? null);\n\n    this.updateRadioTabIndexes();\n  };\n\n  /**\n   * Synchronizes properties of child radio elements with the group's state.\n   */\n  private updateRadioProperties = (): void => {\n    if (this.cachedRadioElements.length === 0) return;\n\n    const { backgroundOnHover, disabled, name, required, value } = this;\n\n    for (const radio of this.cachedRadioElements) {\n      radio.backgroundOnHover = backgroundOnHover;\n      radio.checked = value === radio.value;\n      // This will allows us to force all radio elements to be disabled\n      // while keeping the disabled state of the radio element if it was set individually by the user\n      radio.forceDisabled = disabled;\n      radio.name = name;\n      radio.required = required;\n    }\n  };\n\n  /**\n   * Focuses the next/previous radio element in the group based on the current target.\n   * Handles circular navigation and skips disabled elements.\n   * @param currentTarget - The currently focused radio element\n   * @param direction - The navigation direction ('forward' | 'backward')\n   */\n  private focusRadioInputSibling = (currentTarget: HTMLBqRadioElement, direction: Direction): void => {\n    // If there is none or only one radio element, there will be no sibling to focus\n    if (this.cachedRadioElements.length <= 1) return;\n\n    const currentIndex = this.cachedRadioElements.indexOf(currentTarget);\n    // If the index of the radio element target is not found, it means that it's not part of the group\n    if (currentIndex === -1) return;\n\n    const nextElement = getNextElement(this.cachedRadioElements, currentIndex, direction);\n    this.updateRadioSelection(nextElement);\n  };\n\n  private updateFormValidity = async (): Promise<void> => {\n    const { internals, required, requiredValidationMessage, value } = this;\n    // Clear the validity state\n    internals?.states.clear();\n\n    if (!required || (required && !isNil(value))) {\n      // If the radio group is not required or has a value, set the validity state to valid\n      internals?.states.add('valid');\n      internals?.setValidity({});\n      return;\n    }\n\n    const firstRadio = this.cachedRadioElements[0];\n    if (!firstRadio) return;\n    // If the radio group is required and has no value, set the validity state to invalid\n    internals?.states.add('invalid');\n    // We need to pass the native input element to the setValidity method as anchor element\n    internals?.setValidity(\n      { valueMissing: true },\n      requiredValidationMessage ?? 'Please select an option',\n      await firstRadio.getNativeInput(),\n    );\n  };\n\n  /**\n   * Updates the custom states based on the component properties.\n   * The custom states can be used to style the component based on the component properties.\n   * The custom states are `disabled`, based on the component properties.\n   */\n  private updateCustomStates = (): void => {\n    const states = new Set<string>();\n\n    if (this.disabled) states.add('disabled');\n    if (this.orientation) states.add(this.orientation);\n\n    // Update states\n    this.internals?.states.clear();\n    states.forEach((state) => this.internals?.states.add(state));\n  };\n\n  private handleSlotChange = (): void => {\n    this.initializeRadioElements();\n    this.updateRadioProperties();\n  };\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    return (\n      <Host tabindex={this.tabIndex}>\n        <fieldset\n          class={{ 'bq-radio-group': true, 'has-fieldset': this.fieldset }}\n          aria-controls=\"bq-radiogroup\"\n          aria-labelledby=\"bq-radio-group__label\"\n          aria-disabled={this.disabled}\n          aria-required={this.required}\n          disabled={this.disabled}\n          role=\"radiogroup\"\n          part=\"base\"\n        >\n          <legend part=\"label\">\n            <slot id=\"bq-radiogroup__label\" name=\"label\" />\n          </legend>\n          <div class={`bq-radio-group--${this.orientation}`} part=\"group\">\n            <slot id=\"bq-radiogroup\" onSlotchange={this.handleSlotChange} />\n          </div>\n        </fieldset>\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAAO,MAAM,uBAAuB,GAAG,CAAC,YAAY,EAAE,UAAU,CAAU;;ACA1E,MAAM,eAAe,GAAG,womBAAwomB;;ACehqmB,MAAM,OAAO,GAAG;AACd,IAAA,SAAS,EAAE,SAAS;AACpB,IAAA,UAAU,EAAE,SAAS;AACrB,IAAA,OAAO,EAAE,UAAU;AACnB,IAAA,SAAS,EAAE,UAAU;CACb;MAmDG,YAAY,GAAA,MAAA;;;;;;;;;;;;;;;AAIf,IAAA,YAAY;AACZ,IAAA,iBAAiB;IACjB,cAAc,GAA8B,IAAI;AACvC,IAAA,gBAAgB,GAAG,IAAI,GAAG,EAAsB;IACzD,mBAAmB,GAAyB,EAAE;;;AAKnC,IAAA,SAAS;;;;;AAOnB,IAAA,YAAY;IACZ,QAAQ,GAAe,GAAG;;;;IAMV,iBAAiB,GAAG,KAAK;;IAGV,YAAY,GAAG,CAAC;;IAG/B,QAAQ,GAAG,KAAK;;IAGhB,QAAQ,GAAG,KAAK;;AAGhB,IAAA,IAAI;;IAGW,WAAW,GAA2B,UAAU;;IAG/D,QAAQ,GAAG,KAAK;;AAGhB,IAAA,yBAAyB;;AAGV,IAAA,KAAK;;;IAM7C,wBAAwB,GAAA;QACtB,MAAM,iBAAiB,GAAG,CAAC;AAC3B,QAAA,MAAM,sBAAsB,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,EAAE,IAAI,CAAC,YAAY,CAAC;AAE7E,QAAA,IAAI,sBAAsB,KAAK,IAAI,CAAC,YAAY,EAAE;AAChD,YAAA,IAAI,CAAC,YAAY,GAAG,sBAAsB;;AAG5C,QAAA,IAAI,CAAC,iBAAiB,EAAE,MAAM,EAAE;QAChC,IAAI,CAAC,iBAAiB,GAAG,QAAQ,CAAC,CAAC,KAAoD,KAAU;AAC/F,YAAA,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC;AAC5B,SAAC,EAAE,IAAI,CAAC,YAAY,CAAC;;IAIvB,oBAAoB,GAAA;AAClB,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,GAAG;QAC1C,IAAI,CAAC,qBAAqB,EAAE;;IAO9B,qBAAqB,GAAA;QACnB,IAAI,CAAC,qBAAqB,EAAE;;IAI9B,eAAe,GAAA;QACb,iBAAiB,CAAC,uBAAuB,EAAE,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE,aAAa,CAAC;;IAIhF,oBAAoB,GAAA;QAClB,IAAI,CAAC,kBAAkB,EAAE;;IAI3B,iBAAiB,GAAA;QACf,IAAI,CAAC,qBAAqB,EAAE;QAC5B,IAAI,CAAC,kBAAkB,EAAE;;QAGzB,MAAM,eAAe,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC;QAC5F,IAAI,eAAe,EAAE;AACnB,YAAA,IAAI,CAAC,YAAY,GAAG,eAAe;AACnC,YAAA,IAAI,CAAC,iBAAiB,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,eAAe,EAAE,CAAC;;aACnE;AACL,YAAA,IAAI,CAAC,YAAY,GAAG,SAAS;;;;;;;AASxB,IAAA,QAAQ;;AAGR,IAAA,MAAM;;;;IAMf,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK;QAC9B,IAAI,CAAC,wBAAwB,EAAE;QAC/B,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC;QAE/C,IAAI,CAAC,kBAAkB,EAAE;QACzB,IAAI,CAAC,kBAAkB,EAAE;;IAG3B,oBAAoB,GAAA;AAClB,QAAA,IAAI,CAAC,iBAAiB,EAAE,MAAM,EAAE;;IAGlC,sBAAsB,GAAA;QACpB,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC;QAC/C,IAAI,CAAC,kBAAkB,EAAE;;IAG3B,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY;QAC9B,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC;QAC/C,IAAI,CAAC,kBAAkB,EAAE;QACzB,IAAI,CAAC,kBAAkB,EAAE;;;;IAO3B,MAAM,SAAS,CAAC,KAAiE,EAAA;QAC/E,IAAI,CAAC,2BAA2B,CAAC,KAAK,EAAE,IAAI,CAAC,EAAE,CAAC;YAAE;QAElD,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC,MAAM;AACtC,QAAA,IAAI,KAAK,KAAK,IAAI,CAAC,KAAK;YAAE;QAE1B,qBAAqB,CAAC,MAAK;YACzB,IAAI,KAAK,CAAC,gBAAgB;gBAAE;AAC5B,YAAA,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC;AACnC,SAAC,CAAC;;AAIJ,IAAA,WAAW,CAAC,KAA+D,EAAA;QACzE,IAAI,CAAC,2BAA2B,CAAC,KAAK,EAAE,IAAI,CAAC,EAAE,CAAC;YAAE;QAElD,MAAM,SAAS,GAA0B,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC;AAClE,QAAA,IAAI,CAAC,SAAS;YAAE;QAEhB,IAAI,CAAC,sBAAsB,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC;;AAI7D,IAAA,SAAS,CAAC,KAAsC,EAAA;QAC9C,IAAI,CAAC,2BAA2B,CAAC,KAAK,EAAE,IAAI,CAAC,EAAE,CAAC;YAAE;QAElD,MAAM,qBAAqB,GAAG,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;AAC5D,QAAA,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,MAAM;QAElC,IAAI,qBAAqB,EAAE;YACzB,KAAK,CAAC,eAAe,EAAE;;;AAK3B,IAAA,QAAQ,CAAC,KAAsC,EAAA;QAC7C,IAAI,CAAC,2BAA2B,CAAC,KAAK,EAAE,IAAI,CAAC,EAAE,CAAC;YAAE;;AAGlD,QAAA,IAAI,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC;YAAE;QAEhC,KAAK,CAAC,eAAe,EAAE;QAEvB,qBAAqB,CAAC,MAAK;AACzB,YAAA,IAAI,IAAI,CAAC,cAAc,KAAK,KAAK,CAAC,MAAM;gBAAE;AAE1C,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI;YAC1B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;AAChC,SAAC,CAAC;;;;;;;;;;;;AAeJ;;;AAGG;IACK,uBAAuB,GAAG,MAAW;AAC3C,QAAA,IAAI,CAAC,gBAAgB,CAAC,KAAK,EAAE;QAC7B,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,KAAK,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;;QAEzF,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC;;QAE5D,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,mBAAmB,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,GAAG;;QAEnF,IAAI,CAAC,qBAAqB,EAAE;AAC9B,KAAC;AAED;;;AAGG;IACK,qBAAqB,GAAG,MAAW;AACzC,QAAA,IAAI,IAAI,CAAC,mBAAmB,CAAC,MAAM,KAAK,CAAC;YAAE;;AAG3C,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,YAAA,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC,KAAK,MAAM,KAAK,CAAC,QAAQ,GAAG,EAAE,CAAC,CAAC;YAClE;;;AAIF,QAAA,IAAI,cAA8C;;AAGlD,QAAA,cAAc,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,OAAO,CAAC;;AAGxE,QAAA,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK,EAAE;YACjC,cAAc,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC;;;QAIvF,IAAI,CAAC,cAAc,EAAE;AACnB,YAAA,cAAc,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC;;;QAI5E,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC,KAAK,KAAI;AACzC,YAAA,KAAK,CAAC,QAAQ,GAAG,KAAK,KAAK,cAAc,GAAG,CAAC,GAAG,EAAE;AACpD,SAAC,CAAC;AACJ,KAAC;AAED;;;AAGG;AACK,IAAA,oBAAoB,GAAG,CAAC,MAA0B,KAAU;;QAElE,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,KAAK,MAAM,EAAE;AACrD,YAAA,IAAI,CAAC,YAAY,CAAC,OAAO,GAAG,KAAK;AACjC,YAAA,IAAI,CAAC,YAAY,CAAC,QAAQ,GAAG,EAAE;;AAGjC,QAAA,MAAM,CAAC,OAAO,GAAG,IAAI;AACrB,QAAA,MAAM,CAAC,QAAQ,GAAG,CAAC;QACnB,MAAM,CAAC,MAAM,EAAE;AAEf,QAAA,IAAI,CAAC,YAAY,GAAG,MAAM;AAC1B,QAAA,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK;QACzB,IAAI,CAAC,SAAS,EAAE,YAAY,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC;QAEhD,IAAI,CAAC,qBAAqB,EAAE;AAC9B,KAAC;AAED;;AAEG;IACK,qBAAqB,GAAG,MAAW;AACzC,QAAA,IAAI,IAAI,CAAC,mBAAmB,CAAC,MAAM,KAAK,CAAC;YAAE;AAE3C,QAAA,MAAM,EAAE,iBAAiB,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI;AAEnE,QAAA,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,mBAAmB,EAAE;AAC5C,YAAA,KAAK,CAAC,iBAAiB,GAAG,iBAAiB;YAC3C,KAAK,CAAC,OAAO,GAAG,KAAK,KAAK,KAAK,CAAC,KAAK;;;AAGrC,YAAA,KAAK,CAAC,aAAa,GAAG,QAAQ;AAC9B,YAAA,KAAK,CAAC,IAAI,GAAG,IAAI;AACjB,YAAA,KAAK,CAAC,QAAQ,GAAG,QAAQ;;AAE7B,KAAC;AAED;;;;;AAKG;AACK,IAAA,sBAAsB,GAAG,CAAC,aAAiC,EAAE,SAAoB,KAAU;;AAEjG,QAAA,IAAI,IAAI,CAAC,mBAAmB,CAAC,MAAM,IAAI,CAAC;YAAE;QAE1C,MAAM,YAAY,GAAG,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,aAAa,CAAC;;QAEpE,IAAI,YAAY,KAAK,EAAE;YAAE;AAEzB,QAAA,MAAM,WAAW,GAAG,cAAc,CAAC,IAAI,CAAC,mBAAmB,EAAE,YAAY,EAAE,SAAS,CAAC;AACrF,QAAA,IAAI,CAAC,oBAAoB,CAAC,WAAW,CAAC;AACxC,KAAC;IAEO,kBAAkB,GAAG,YAA0B;QACrD,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,yBAAyB,EAAE,KAAK,EAAE,GAAG,IAAI;;AAEtE,QAAA,SAAS,EAAE,MAAM,CAAC,KAAK,EAAE;AAEzB,QAAA,IAAI,CAAC,QAAQ,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE;;AAE5C,YAAA,SAAS,EAAE,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC;AAC9B,YAAA,SAAS,EAAE,WAAW,CAAC,EAAE,CAAC;YAC1B;;QAGF,MAAM,UAAU,GAAG,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC;AAC9C,QAAA,IAAI,CAAC,UAAU;YAAE;;AAEjB,QAAA,SAAS,EAAE,MAAM,CAAC,GAAG,CAAC,SAAS,CAAC;;AAEhC,QAAA,SAAS,EAAE,WAAW,CACpB,EAAE,YAAY,EAAE,IAAI,EAAE,EACtB,yBAAyB,IAAI,yBAAyB,EACtD,MAAM,UAAU,CAAC,cAAc,EAAE,CAClC;AACH,KAAC;AAED;;;;AAIG;IACK,kBAAkB,GAAG,MAAW;AACtC,QAAA,MAAM,MAAM,GAAG,IAAI,GAAG,EAAU;QAEhC,IAAI,IAAI,CAAC,QAAQ;AAAE,YAAA,MAAM,CAAC,GAAG,CAAC,UAAU,CAAC;QACzC,IAAI,IAAI,CAAC,WAAW;AAAE,YAAA,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC;;AAGlD,QAAA,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,KAAK,EAAE;AAC9B,QAAA,MAAM,CAAC,OAAO,CAAC,CAAC,KAAK,KAAK,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;AAC9D,KAAC;IAEO,gBAAgB,GAAG,MAAW;QACpC,IAAI,CAAC,uBAAuB,EAAE;QAC9B,IAAI,CAAC,qBAAqB,EAAE;AAC9B,KAAC;;;;IAMD,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,EAC3B,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,EAAE,gBAAgB,EAAE,IAAI,EAAE,cAAc,EAAE,IAAI,CAAC,QAAQ,EAAE,mBAClD,eAAe,EAAA,iBAAA,EACb,uBAAuB,EACxB,eAAA,EAAA,IAAI,CAAC,QAAQ,mBACb,IAAI,CAAC,QAAQ,EAC5B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,YAAY,EACjB,IAAI,EAAC,MAAM,EAAA,EAEX,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,OAAO,EAAA,EAClB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,sBAAsB,EAAC,IAAI,EAAC,OAAO,GAAG,CACxC,EACT,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAmB,gBAAA,EAAA,IAAI,CAAC,WAAW,EAAE,EAAE,IAAI,EAAC,OAAO,EAAA,EAC7D,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,EAAE,EAAC,eAAe,EAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,EAAI,CAAA,CAC5D,CACG,CACN;;;;;;;;;;;;;;;;;;"}