{"version":3,"sources":["components/button/button.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,OAAO,EAAiC,UAAU,EAAE,MAAM,aAAa,CAAC;AAGxE,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAC;AAKtE,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,kBAAkB,EAAE,CAAC;;;;;QAkEtD;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAhEL;;;;GAIG;AACH,cACM,QAAS,SAAQ,aAAyC;IAC9D;;OAEG;IACH,OAAO,CAAC,QAAQ,CAAS;IAEzB;;OAEG;IACH,OAAO,CAAC,eAAe,CAAS;IAEhC;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAWzB,OAAO,CAAC,oBAAoB;IAO5B;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,QAAQ,EAAG,MAAM,CAAC;IAElB;;OAEG;IAEH,IAAI,EAAG,MAAM,CAAC;IAEd;;OAEG;IAEH,QAAQ,EAAG,MAAM,CAAC;IAElB;;OAEG;IAEH,UAAU,qBAA8B;IAExC;;OAEG;IAEH,YAAY,UAAS;IAErB;;OAEG;IAEH,IAAI,cAAuB;IAE3B;;OAEG;IAEH,QAAQ,SAAY;IAEpB;;OAEG;IAEH,IAAI,EAAG,MAAM,CAAC;IAEd;;OAEG;IAEH,GAAG,EAAG,MAAM,CAAC;IAEb;;OAEG;IAEH,IAAI,cAAuB;IAE3B;;OAEG;IAEH,MAAM,EAAG,MAAM,CAAC;IAEhB;;OAEG;IAEH,IAAI,EAAG,MAAM,CAAC;IAEd,gBAAgB;IAOhB,MAAM;IAsEN,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,QAAQ,CAAC","file":"button.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2021\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport settings from 'carbon-components/es/globals/js/settings';\nimport { classMap } from 'lit-html/directives/class-map';\nimport { html, property, customElement, LitElement } from 'lit-element';\nimport ifNonNull from '../../globals/directives/if-non-null';\nimport FocusMixin from '../../globals/mixins/focus';\nimport { BUTTON_KIND, BUTTON_SIZE, BUTTON_ICON_LAYOUT } from './defs';\nimport styles from './button.scss';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\n\nexport { BUTTON_KIND, BUTTON_SIZE, BUTTON_ICON_LAYOUT };\n\nconst { prefix } = settings;\n\n/**\n * Button.\n * @element bx-btn\n * @csspart button The button.\n */\n@customElement(`${prefix}-btn`)\nclass BXButton extends HostListenerMixin(FocusMixin(LitElement)) {\n  /**\n   * `true` if there is an icon.\n   */\n  private _hasIcon = false;\n\n  /**\n   * `true` if there is a non-icon content.\n   */\n  private _hasMainContent = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  private _handleSlotChange({ target }: Event) {\n    const { name } = target as HTMLSlotElement;\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .some(node => node.nodeType !== Node.TEXT_NODE || node!.textContent!.trim());\n    this[name === 'icon' ? '_hasIcon' : '_hasMainContent'] = hasContent;\n    this.requestUpdate();\n  }\n\n  @HostListener('click', { capture: true })\n  // @ts-ignore\n  private _handleDisabledClick(event: Event) {\n    const { disabled } = this;\n    if (disabled) {\n      event.stopPropagation();\n    }\n  }\n\n  /**\n   * `true` if the button should have input focus when the page loads.\n   */\n  @property({ type: Boolean, reflect: true })\n  autofocus = false;\n\n  /**\n   * `true` if the button should be disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The default file name, used if this button is rendered as `<a>`.\n   */\n  @property({ reflect: true })\n  download!: string;\n\n  /**\n   * Link `href`. If present, this button is rendered as `<a>`.\n   */\n  @property({ reflect: true })\n  href!: string;\n\n  /**\n   * The language of what `href` points to, if this button is rendered as `<a>`.\n   */\n  @property({ reflect: true })\n  hreflang!: string;\n\n  /**\n   * Button icon layout.\n   */\n  @property({ reflect: true, attribute: 'icon-layout' })\n  iconLayout = BUTTON_ICON_LAYOUT.REGULAR;\n\n  /**\n   * `true` if expressive theme enabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  isExpressive = false;\n\n  /**\n   * Button kind.\n   */\n  @property({ reflect: true })\n  kind = BUTTON_KIND.PRIMARY;\n\n  /**\n   * The a11y role for `<a>`.\n   */\n  @property({ attribute: 'link-role' })\n  linkRole = 'button';\n\n  /**\n   * URLs to ping, if this button is rendered as `<a>`.\n   */\n  @property({ reflect: true })\n  ping!: string;\n\n  /**\n   * The link type, if this button is rendered as `<a>`.\n   */\n  @property({ reflect: true })\n  rel!: string;\n\n  /**\n   * Button size.\n   */\n  @property({ reflect: true })\n  size = BUTTON_SIZE.REGULAR;\n\n  /**\n   * The link target, if this button is rendered as `<a>`.\n   */\n  @property({ reflect: true })\n  target!: string;\n\n  /**\n   * The default behavior if the button is rendered as `<button>`. MIME type of the `target`if this button is rendered as `<a>`.\n   */\n  @property({ reflect: true })\n  type!: string;\n\n  createRenderRoot() {\n    return this.attachShadow({\n      mode: 'open',\n      delegatesFocus: Number((/Safari\\/(\\d+)/.exec(navigator.userAgent) ?? ['', 0])[1]) <= 537,\n    });\n  }\n\n  render() {\n    const {\n      autofocus,\n      disabled,\n      download,\n      href,\n      hreflang,\n      isExpressive,\n      linkRole,\n      kind,\n      ping,\n      rel,\n      size,\n      target,\n      type,\n      _hasIcon: hasIcon,\n      _hasMainContent: hasMainContent,\n      _handleSlotChange: handleSlotChange,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--btn`]: true,\n      [`${prefix}--btn--${kind}`]: kind,\n      [`${prefix}--btn--disabled`]: disabled,\n      [`${prefix}--btn--icon-only`]: hasIcon && !hasMainContent,\n      [`${prefix}--btn--sm`]: size === 'sm' && !isExpressive,\n      [`${prefix}--btn--xl`]: size === 'xl',\n      [`${prefix}--btn--field`]: size === 'field' && !isExpressive,\n      [`${prefix}-ce--btn--has-icon`]: hasIcon,\n      [`${prefix}--btn--expressive`]: isExpressive,\n    });\n    if (href) {\n      return disabled\n        ? html`\n            <p id=\"button\" part=\"button\" class=\"${classes}\">\n              <slot @slotchange=\"${handleSlotChange}\"></slot>\n              <slot name=\"icon\" @slotchange=\"${handleSlotChange}\"></slot>\n            </p>\n          `\n        : html`\n            <a\n              id=\"button\"\n              part=\"button\"\n              role=\"${ifNonNull(linkRole)}\"\n              class=\"${classes}\"\n              download=\"${ifNonNull(download)}\"\n              href=\"${ifNonNull(href)}\"\n              hreflang=\"${ifNonNull(hreflang)}\"\n              ping=\"${ifNonNull(ping)}\"\n              rel=\"${ifNonNull(rel)}\"\n              target=\"${ifNonNull(target)}\"\n              type=\"${ifNonNull(type)}\">\n              <slot @slotchange=\"${handleSlotChange}\"></slot>\n              <slot name=\"icon\" @slotchange=\"${handleSlotChange}\"></slot>\n            </a>\n          `;\n    }\n    return html`\n      <button\n        id=\"button\"\n        part=\"button\"\n        class=\"${classes}\"\n        ?autofocus=\"${autofocus}\"\n        ?disabled=\"${disabled}\"\n        type=\"${ifNonNull(type)}\">\n        <slot @slotchange=\"${handleSlotChange}\"></slot>\n        <slot name=\"icon\" @slotchange=\"${handleSlotChange}\"></slot>\n      </button>\n    `;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXButton;\n"]}