@pine-ds/core 3.21.0 → 3.22.0

package/dist/collection/components/pds-chip/pds-chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"pds-chip.js","sourceRoot":"","sources":["../../../../src/components/pds-chip/pds-chip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport type { ChipSentimentType, ChipSizeType, ChipVariantType } from '@utils/types';\n\n/**\n * @slot (default) - The chip's label text.\n */\n\n@Component({\n  tag: 'pds-chip',\n  styleUrls: ['pds-chip.tokens.scss', 'pds-chip.scss'],\n  shadow: true,\n})\nexport class PdsChip {\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether a dot should be displayed on the chip.\n   * Note: This prop is ignored when sentiment is 'brand'.\n   * @defaultValue false\n   */\n  @Prop() dot = false;\n\n  /**\n   * The name of the icon to display before the chip text.\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Determines whether the chip should be displayed in a larger size. DEPRECATED.\n   * @defaultValue false\n   * @deprecated Use `size` prop instead. Set `size=\"lg\"` for the large variant.\n   */\n  @Prop() large = false;\n\n  /**\n   * Sets the size of the chip.\n   * @defaultValue 'md'\n   */\n  @Prop() size?: ChipSizeType;\n\n  /**\n   * Defines the color scheme of the chip.\n   * @defaultValue 'neutral'\n   */\n  @Prop() sentiment: ChipSentimentType = 'neutral';\n\n  /**\n   * Sets the style variant of the chip.\n   * Note: This prop is ignored when sentiment is 'brand'.\n   * @defaultValue 'text'\n   */\n  @Prop() variant: ChipVariantType = 'text';\n\n  /**\n   * URL to navigate to when the remove button is clicked.\n   * When provided, renders the close button as a link instead of a button.\n   * Only applies to tag variant.\n   */\n  @Prop() removeUrl?: string;\n\n  /**\n   * HTTP method to use for the remove action.\n   * Adds data-method and data-turbo-method attributes for Rails/Turbo compatibility.\n   * Only applies when removeUrl is provided.\n   */\n  @Prop() removeHttpMethod?: 'get' | 'post' | 'put' | 'patch' | 'delete';\n\n  /**\n   * Specifies where to open the linked document when removeUrl is provided.\n   * Only applies when removeUrl is set.\n   */\n  @Prop() removeTarget?: '_blank' | '_self' | '_parent' | '_top';\n\n  /**\n   * Event emitted when the close button is clicked on a tag variant chip.\n   */\n  @Event() pdsTagCloseClick: EventEmitter<void>;\n\n  private handleCloseClick = () => {\n    this.pdsTagCloseClick.emit();\n  };\n\n  private get effectiveSize(): ChipSizeType {\n    if (this.size != null) return this.size;\n    if (this.large) return 'lg';\n    return 'md';\n  }\n\n  private classNames() {\n    const classNames = ['pds-chip'];\n\n    const size = this.effectiveSize;\n    if (size && size !== 'md') {\n      classNames.push('pds-chip--' + size);\n    }\n\n    // For brand sentiment, always use text variant\n    const effectiveVariant = this.sentiment === 'brand' ? 'text' : this.variant;\n    if (effectiveVariant) {\n      classNames.push('pds-chip--' + effectiveVariant);\n    }\n\n    if (this.sentiment) {\n      classNames.push('pds-chip--' + this.sentiment);\n    }\n\n    return classNames.join(' ');\n  }\n\n  private get effectiveVariant() {\n    // For brand sentiment, force text variant behavior\n    return this.sentiment === 'brand' ? 'text' : this.variant;\n  }\n\n  private get iconSize() {\n    switch (this.effectiveSize) {\n      case 'sm': return '10px';\n      case 'lg': return '14px';\n      default: return '12px';\n    }\n  }\n\n  private setChipContent() {\n    const isDropdown = this.effectiveVariant === 'dropdown';\n\n    // For brand sentiment, ignore dot prop\n    const showDot = this.sentiment === 'brand' ? false : this.dot;\n\n    const chipContent = isDropdown ? (\n      <button class=\"pds-chip__button\" type=\"button\">\n        {this.icon && <pds-icon icon={this.icon} size={this.iconSize} aria-hidden=\"true\"></pds-icon>}\n        {showDot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n        <slot></slot>\n        <pds-icon icon={downSmall} size={this.iconSize} aria-hidden=\"true\"></pds-icon>\n      </button>\n    ) : (\n      <span class=\"pds-chip__label\">\n        {this.icon && <pds-icon icon={this.icon} size={this.iconSize} aria-hidden=\"true\"></pds-icon>}\n        {showDot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n        <slot></slot>\n      </span>\n    );\n\n    return chipContent;\n  }\n\n  private renderCloseButton() {\n    const CloseElement = this.removeUrl ? 'a' : 'button';\n\n    const closeAttributes = () => {\n      if (this.removeUrl) {\n        // Link attributes\n        const linkAttrs: any = {\n          class: 'pds-chip__close',\n          href: this.removeUrl,\n          'aria-label': 'Remove',\n        };\n\n        // Add target if specified\n        if (this.removeTarget) {\n          linkAttrs.target = this.removeTarget;\n        }\n\n        // Add HTTP method attributes if specified\n        if (this.removeHttpMethod) {\n          linkAttrs['data-method'] = this.removeHttpMethod;\n          linkAttrs['data-turbo-method'] = this.removeHttpMethod;\n        }\n\n        // Build rel attribute by collecting all required values\n        const relValues = [];\n\n        // Add noopener noreferrer if target is _blank\n        if (this.removeTarget === '_blank') {\n          relValues.push('noopener', 'noreferrer');\n        }\n\n        // Add nofollow for non-GET methods (best practice)\n        if (this.removeHttpMethod && this.removeHttpMethod !== 'get') {\n          relValues.push('nofollow');\n        }\n\n        // Set rel attribute if we have any values\n        if (relValues.length > 0) {\n          linkAttrs.rel = relValues.join(' ');\n        }\n\n        return linkAttrs;\n      }\n\n      // Button attributes\n      return {\n        class: 'pds-chip__close',\n        type: 'button',\n        'aria-label': 'Remove',\n      };\n    };\n\n    return (\n      <CloseElement {...closeAttributes()} onClick={this.handleCloseClick}>\n        <pds-icon icon={remove} size={this.iconSize}></pds-icon>\n      </CloseElement>\n    );\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()} id={this.componentId}>\n        {this.setChipContent()}\n        {this.effectiveVariant === 'tag' && this.renderCloseButton()}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pds-chip.js","sourceRoot":"","sources":["../../../../src/components/pds-chip/pds-chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAG9E;;GAEG;AAOH,MAAM,OAAO,OAAO;IALpB;QAWE;;;;WAIG;QACK,QAAG,GAAG,KAAK,CAAC;QAOpB;;;;WAIG;QACK,UAAK,GAAG,KAAK,CAAC;QAQtB;;;WAGG;QACK,cAAS,GAAsB,SAAS,CAAC;QAEjD;;;;WAIG;QACK,YAAO,GAAoB,MAAM,CAAC;QA2BlC,qBAAgB,GAAG,GAAG,EAAE;YAC9B,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,CAAC;QAC/B,CAAC,CAAC;KAqIH;IAnIC,IAAY,aAAa;QACvB,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI;YAAE,OAAO,IAAI,CAAC,IAAI,CAAC;QACxC,IAAI,IAAI,CAAC,KAAK;YAAE,OAAO,IAAI,CAAC;QAC5B,OAAO,IAAI,CAAC;IACd,CAAC;IAEO,UAAU;QAChB,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC,CAAC;QAEhC,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC;QAChC,IAAI,IAAI,IAAI,IAAI,KAAK,IAAI,EAAE,CAAC;YAC1B,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;QACvC,CAAC;QAED,+CAA+C;QAC/C,MAAM,gBAAgB,GAAG,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;QAC5E,IAAI,gBAAgB,EAAE,CAAC;YACrB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,gBAAgB,CAAC,CAAC;QACnD,CAAC;QAED,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,UAAU,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC;QACjD,CAAC;QAED,OAAO,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC9B,CAAC;IAED,IAAY,gBAAgB;QAC1B,mDAAmD;QACnD,OAAO,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;IAC5D,CAAC;IAED,IAAY,QAAQ;QAClB,QAAQ,IAAI,CAAC,aAAa,EAAE,CAAC;YAC3B,KAAK,IAAI,CAAC,CAAC,OAAO,MAAM,CAAC;YACzB,KAAK,IAAI,CAAC,CAAC,OAAO,MAAM,CAAC;YACzB,OAAO,CAAC,CAAC,OAAO,MAAM,CAAC;QACzB,CAAC;IACH,CAAC;IAEO,cAAc;QACpB,MAAM,UAAU,GAAG,IAAI,CAAC,gBAAgB,KAAK,UAAU,CAAC;QAExD,uCAAuC;QACvC,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;QAE9D,MAAM,WAAW,GAAG,UAAU,CAAC,CAAC,CAAC,CAC/B,cAAQ,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ;YACzD,IAAI,CAAC,IAAI,IAAI,gBAAU,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,iBAAc,MAAM,GAAY;YAC3F,OAAO,IAAI,SAAG,KAAK,EAAC,eAAe,iBAAa,MAAM,GAAK;YAC5D,eAAa;YACb,gBAAU,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,iBAAc,MAAM,GAAY,CACvE,CACV,CAAC,CAAC,CAAC,CACF,YAAM,KAAK,EAAC,iBAAiB;YAC1B,IAAI,CAAC,IAAI,IAAI,gBAAU,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,iBAAc,MAAM,GAAY;YAC3F,OAAO,IAAI,SAAG,KAAK,EAAC,eAAe,iBAAa,MAAM,GAAK;YAC5D,eAAa,CACR,CACR,CAAC;QAEF,OAAO,WAAW,CAAC;IACrB,CAAC;IAEO,iBAAiB;QACvB,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC;QAErD,MAAM,eAAe,GAAG,GAAG,EAAE;YAC3B,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACnB,kBAAkB;gBAClB,MAAM,SAAS,GAAQ;oBACrB,KAAK,EAAE,iBAAiB;oBACxB,IAAI,EAAE,IAAI,CAAC,SAAS;oBACpB,YAAY,EAAE,QAAQ;iBACvB,CAAC;gBAEF,0BAA0B;gBAC1B,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;oBACtB,SAAS,CAAC,MAAM,GAAG,IAAI,CAAC,YAAY,CAAC;gBACvC,CAAC;gBAED,0CAA0C;gBAC1C,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;oBAC1B,SAAS,CAAC,aAAa,CAAC,GAAG,IAAI,CAAC,gBAAgB,CAAC;oBACjD,SAAS,CAAC,mBAAmB,CAAC,GAAG,IAAI,CAAC,gBAAgB,CAAC;gBACzD,CAAC;gBAED,wDAAwD;gBACxD,MAAM,SAAS,GAAG,EAAE,CAAC;gBAErB,8CAA8C;gBAC9C,IAAI,IAAI,CAAC,YAAY,KAAK,QAAQ,EAAE,CAAC;oBACnC,SAAS,CAAC,IAAI,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC;gBAC3C,CAAC;gBAED,mDAAmD;gBACnD,IAAI,IAAI,CAAC,gBAAgB,IAAI,IAAI,CAAC,gBAAgB,KAAK,KAAK,EAAE,CAAC;oBAC7D,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;gBAC7B,CAAC;gBAED,0CAA0C;gBAC1C,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;oBACzB,SAAS,CAAC,GAAG,GAAG,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;gBACtC,CAAC;gBAED,OAAO,SAAS,CAAC;YACnB,CAAC;YAED,oBAAoB;YACpB,OAAO;gBACL,KAAK,EAAE,iBAAiB;gBACxB,IAAI,EAAE,QAAQ;gBACd,YAAY,EAAE,QAAQ;aACvB,CAAC;QACJ,CAAC,CAAC;QAEF,OAAO,CACL,EAAC,YAAY,oBAAK,eAAe,EAAE,IAAE,OAAO,EAAE,IAAI,CAAC,gBAAgB;YACjE,gBAAU,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAa,CAC3C,CAChB,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,WAAW;YACjD,IAAI,CAAC,cAAc,EAAE;YACrB,IAAI,CAAC,gBAAgB,KAAK,KAAK,IAAI,IAAI,CAAC,iBAAiB,EAAE,CACvD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { downSmall, remove } from '@pine-ds/icons/icons';\nimport { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport type { ChipSentimentType, ChipSizeType, ChipVariantType } from '@utils/types';\n\n/**\n * @slot (default) - The chip's label text.\n */\n\n@Component({\n  tag: 'pds-chip',\n  styleUrls: ['pds-chip.tokens.scss', 'pds-chip.scss'],\n  shadow: true,\n})\nexport class PdsChip {\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether a dot should be displayed on the chip.\n   * Note: This prop is ignored when sentiment is 'brand'.\n   * @defaultValue false\n   */\n  @Prop() dot = false;\n\n  /**\n   * The name of the icon to display before the chip text.\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Determines whether the chip should be displayed in a larger size. DEPRECATED.\n   * @defaultValue false\n   * @deprecated Use `size` prop instead. Set `size=\"lg\"` for the large variant.\n   */\n  @Prop() large = false;\n\n  /**\n   * Sets the size of the chip.\n   * @defaultValue 'md'\n   */\n  @Prop() size?: ChipSizeType;\n\n  /**\n   * Defines the color scheme of the chip.\n   * @defaultValue 'neutral'\n   */\n  @Prop() sentiment: ChipSentimentType = 'neutral';\n\n  /**\n   * Sets the style variant of the chip.\n   * Note: This prop is ignored when sentiment is 'brand'.\n   * @defaultValue 'text'\n   */\n  @Prop() variant: ChipVariantType = 'text';\n\n  /**\n   * URL to navigate to when the remove button is clicked.\n   * When provided, renders the close button as a link instead of a button.\n   * Only applies to tag variant.\n   */\n  @Prop() removeUrl?: string;\n\n  /**\n   * HTTP method to use for the remove action.\n   * Adds data-method and data-turbo-method attributes for Rails/Turbo compatibility.\n   * Only applies when removeUrl is provided.\n   */\n  @Prop() removeHttpMethod?: 'get' | 'post' | 'put' | 'patch' | 'delete';\n\n  /**\n   * Specifies where to open the linked document when removeUrl is provided.\n   * Only applies when removeUrl is set.\n   */\n  @Prop() removeTarget?: '_blank' | '_self' | '_parent' | '_top';\n\n  /**\n   * Event emitted when the close button is clicked on a tag variant chip.\n   */\n  @Event() pdsTagCloseClick: EventEmitter<void>;\n\n  private handleCloseClick = () => {\n    this.pdsTagCloseClick.emit();\n  };\n\n  private get effectiveSize(): ChipSizeType {\n    if (this.size != null) return this.size;\n    if (this.large) return 'lg';\n    return 'md';\n  }\n\n  private classNames() {\n    const classNames = ['pds-chip'];\n\n    const size = this.effectiveSize;\n    if (size && size !== 'md') {\n      classNames.push('pds-chip--' + size);\n    }\n\n    // For brand sentiment, always use text variant\n    const effectiveVariant = this.sentiment === 'brand' ? 'text' : this.variant;\n    if (effectiveVariant) {\n      classNames.push('pds-chip--' + effectiveVariant);\n    }\n\n    if (this.sentiment) {\n      classNames.push('pds-chip--' + this.sentiment);\n    }\n\n    return classNames.join(' ');\n  }\n\n  private get effectiveVariant() {\n    // For brand sentiment, force text variant behavior\n    return this.sentiment === 'brand' ? 'text' : this.variant;\n  }\n\n  private get iconSize() {\n    switch (this.effectiveSize) {\n      case 'sm': return '10px';\n      case 'lg': return '14px';\n      default: return '12px';\n    }\n  }\n\n  private setChipContent() {\n    const isDropdown = this.effectiveVariant === 'dropdown';\n\n    // For brand sentiment, ignore dot prop\n    const showDot = this.sentiment === 'brand' ? false : this.dot;\n\n    const chipContent = isDropdown ? (\n      <button class=\"pds-chip__button\" type=\"button\" part=\"button\">\n        {this.icon && <pds-icon icon={this.icon} size={this.iconSize} aria-hidden=\"true\"></pds-icon>}\n        {showDot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n        <slot></slot>\n        <pds-icon icon={downSmall} size={this.iconSize} aria-hidden=\"true\"></pds-icon>\n      </button>\n    ) : (\n      <span class=\"pds-chip__label\">\n        {this.icon && <pds-icon icon={this.icon} size={this.iconSize} aria-hidden=\"true\"></pds-icon>}\n        {showDot && <i class=\"pds-chip__dot\" aria-hidden=\"true\"></i>}\n        <slot></slot>\n      </span>\n    );\n\n    return chipContent;\n  }\n\n  private renderCloseButton() {\n    const CloseElement = this.removeUrl ? 'a' : 'button';\n\n    const closeAttributes = () => {\n      if (this.removeUrl) {\n        // Link attributes\n        const linkAttrs: any = {\n          class: 'pds-chip__close',\n          href: this.removeUrl,\n          'aria-label': 'Remove',\n        };\n\n        // Add target if specified\n        if (this.removeTarget) {\n          linkAttrs.target = this.removeTarget;\n        }\n\n        // Add HTTP method attributes if specified\n        if (this.removeHttpMethod) {\n          linkAttrs['data-method'] = this.removeHttpMethod;\n          linkAttrs['data-turbo-method'] = this.removeHttpMethod;\n        }\n\n        // Build rel attribute by collecting all required values\n        const relValues = [];\n\n        // Add noopener noreferrer if target is _blank\n        if (this.removeTarget === '_blank') {\n          relValues.push('noopener', 'noreferrer');\n        }\n\n        // Add nofollow for non-GET methods (best practice)\n        if (this.removeHttpMethod && this.removeHttpMethod !== 'get') {\n          relValues.push('nofollow');\n        }\n\n        // Set rel attribute if we have any values\n        if (relValues.length > 0) {\n          linkAttrs.rel = relValues.join(' ');\n        }\n\n        return linkAttrs;\n      }\n\n      // Button attributes\n      return {\n        class: 'pds-chip__close',\n        type: 'button',\n        'aria-label': 'Remove',\n      };\n    };\n\n    return (\n      <CloseElement {...closeAttributes()} onClick={this.handleCloseClick}>\n        <pds-icon icon={remove} size={this.iconSize}></pds-icon>\n      </CloseElement>\n    );\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()} id={this.componentId}>\n        {this.setChipContent()}\n        {this.effectiveVariant === 'tag' && this.renderCloseButton()}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/pds-combobox/pds-combobox.js

@@ -629,6 +629,14 @@ export class PdsCombobox {
             this.optionEls.push(optionEl);
             this.allItems.push(optionEl);
         });
+        // Re-apply preselection if a value is set but no option has been selected yet.
+        // This handles the case where `value` is set before async options have loaded.
+        if (this.value && !this.selectedOption) {
+            const matchingOption = this.optionEls.find(opt => opt.value === this.value);
+            if (matchingOption) {
+                this.setSelectedOption(matchingOption);
+            }
+        }
         this.filterOptions();
     }
     updateOptions() {
@@ -1243,10 +1251,10 @@ export class PdsCombobox {
     }
     render() {
         const triggerClass = `pds-combobox__button-trigger pds-combobox__button-trigger--${this.triggerVariant}`;
-        return (h(Host, { key: '969d61af2b58a33d582259df5fe62a4d509a9f7b' }, h("div", { key: 'fd4fae653c654b4cdc582f6a7d51100844d5a050', class: "pds-combobox", tabIndex: -1, onFocusout: this.onComboboxFocusOut, part: "combobox" }, this.label && (h("label", { key: 'fc90ccdb48bc951873b92e6c315cecbbd74a52b5', htmlFor: this.componentId, class: "pds-combobox__label" }, h("span", { key: 'be72c23cc4759cf8dadbcdcb6121adf33cefc237', class: this.hideLabel ? 'visually-hidden' : '' }, this.label))), this.trigger === 'input' ? (h("div", { class: "pds-combobox__input-wrapper", style: { width: this.triggerWidth } }, h("input", { ref: el => {
+        return (h(Host, { key: '8972918e55f8c0fba10399d963a49ab31b49eeae' }, h("div", { key: '5f5782e3fb83c7ff3fea2d4344324d888110b8fc', class: "pds-combobox", tabIndex: -1, onFocusout: this.onComboboxFocusOut, part: "combobox" }, this.label && (h("label", { key: '286cab5baba38486c7e661384f0b5a6a38976891', htmlFor: this.componentId, class: "pds-combobox__label" }, h("span", { key: '3ccb30ead595d633bfe3ce624c99f9483c0d6265', class: this.hideLabel ? 'visually-hidden' : '' }, this.label))), this.trigger === 'input' ? (h("div", { class: "pds-combobox__input-wrapper", style: { width: this.triggerWidth } }, h("input", { ref: el => {
                 this.inputEl = el;
                 this.triggerEl = el;
-            }, class: "pds-combobox__input", type: "text", role: "combobox", "aria-autocomplete": "list", "aria-controls": "pds-combobox-listbox", "aria-activedescendant": this.isOpen && this.highlightedIndex >= 0 ? `pds-combobox-option-${this.highlightedIndex}` : undefined, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.hideLabel ? this.label : undefined, id: this.componentId, value: this.displayText, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput, onClick: this.handleInputClick, onKeyDown: this.handleKeyDown, autocomplete: "off", part: "input" }), h("pds-icon", { icon: "enlarge", "aria-hidden": "true", class: "pds-combobox__input-icon" }))) : this.trigger === 'chip' ? (h("div", { class: this.getChipTriggerClass(), style: { width: this.triggerWidth }, role: "combobox", "aria-haspopup": "listbox", "aria-controls": "pds-combobox-listbox", "aria-activedescendant": this.isOpen && this.highlightedIndex >= 0 ? `pds-combobox-option-${this.highlightedIndex}` : undefined, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.hideLabel ? this.label : undefined, id: this.componentId, tabIndex: this.disabled ? -1 : 0, onClick: this.onButtonTriggerClick, "data-layout": this.customTriggerContent, onKeyDown: this.onButtonTriggerKeyDown, onKeyUp: this.onButtonTriggerKeyUp, ref: el => (this.triggerEl = el), part: "chip-trigger" }, this.renderChipTriggerContent())) : (h("div", { class: triggerClass, style: { width: this.triggerWidth }, role: "combobox", "aria-haspopup": "listbox", "aria-controls": "pds-combobox-listbox", "aria-activedescendant": this.isOpen && this.highlightedIndex >= 0 ? `pds-combobox-option-${this.highlightedIndex}` : undefined, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.hideLabel ? this.label : undefined, id: this.componentId, tabIndex: this.disabled ? -1 : 0, onClick: this.onButtonTriggerClick, "data-layout": this.customTriggerContent, onKeyDown: this.onButtonTriggerKeyDown, onKeyUp: this.onButtonTriggerKeyUp, ref: el => (this.triggerEl = el), part: "button-trigger" }, this.renderButtonTriggerContent())), h("div", { key: 'db0c3c6aa9d332c2ab0d31e43afd499e604b5ce8', style: { display: 'none' } }, h("slot", { key: '3a9eef50b933e311222c0c067dfa29dc867b19cd', onSlotchange: () => this.updateOptions() })), this.renderDropdown())));
+            }, class: "pds-combobox__input", type: "text", role: "combobox", "aria-autocomplete": "list", "aria-controls": "pds-combobox-listbox", "aria-activedescendant": this.isOpen && this.highlightedIndex >= 0 ? `pds-combobox-option-${this.highlightedIndex}` : undefined, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.hideLabel ? this.label : undefined, id: this.componentId, value: this.displayText, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput, onClick: this.handleInputClick, onKeyDown: this.handleKeyDown, autocomplete: "off", part: "input" }), h("pds-icon", { icon: "enlarge", "aria-hidden": "true", class: "pds-combobox__input-icon" }))) : this.trigger === 'chip' ? (h("div", { class: this.getChipTriggerClass(), style: { width: this.triggerWidth }, role: "combobox", "aria-haspopup": "listbox", "aria-controls": "pds-combobox-listbox", "aria-activedescendant": this.isOpen && this.highlightedIndex >= 0 ? `pds-combobox-option-${this.highlightedIndex}` : undefined, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.hideLabel ? this.label : undefined, id: this.componentId, tabIndex: this.disabled ? -1 : 0, onClick: this.onButtonTriggerClick, "data-layout": this.customTriggerContent, onKeyDown: this.onButtonTriggerKeyDown, onKeyUp: this.onButtonTriggerKeyUp, ref: el => (this.triggerEl = el), part: "chip-trigger" }, this.renderChipTriggerContent())) : (h("div", { class: triggerClass, style: { width: this.triggerWidth }, role: "combobox", "aria-haspopup": "listbox", "aria-controls": "pds-combobox-listbox", "aria-activedescendant": this.isOpen && this.highlightedIndex >= 0 ? `pds-combobox-option-${this.highlightedIndex}` : undefined, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.hideLabel ? this.label : undefined, id: this.componentId, tabIndex: this.disabled ? -1 : 0, onClick: this.onButtonTriggerClick, "data-layout": this.customTriggerContent, onKeyDown: this.onButtonTriggerKeyDown, onKeyUp: this.onButtonTriggerKeyUp, ref: el => (this.triggerEl = el), part: "button-trigger" }, this.renderButtonTriggerContent())), h("div", { key: '02597d696490153015a5d41190598f24fa1b034e', style: { display: 'none' } }, h("slot", { key: '3bb35ff0c7cdde0cb3c4c0eeb9fc4879fcef62c6', onSlotchange: () => this.updateOptions() })), this.renderDropdown())));
     }
     static get is() { return "pds-combobox"; }
     static get encapsulation() { return "shadow"; }