@trendyol/baklava 2.0.0-beta.12 → 2.0.0-beta.13

package/dist/chunk-T7GSZTD6.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/components/button/bl-button.css", "../src/components/button/bl-button.ts"],
-  "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host {\n  display: var(--bl-button-display, inline-block);\n  max-width: 100%;\n  position: relative;\n\n  --bl-button-main-color: var(--bl-color-primary);\n  --bl-button-main-hover-color: var(--bl-color-primary-hover);\n  --bl-button-content-color: #fff;\n  --bl-button-bg-color: var(--bl-button-main-color);\n  --bl-button-border-color: var(--bl-button-main-color);\n  --bl-button-padding-vertical: var(--bl-size-2xs);\n  --bl-button-padding-horizontal: var(--bl-size-m);\n  --bl-button-margin-icon: var(--bl-button-padding-vertical);\n  --bl-button-icon-size: var(--bl-size-m);\n  --bl-button-font: var(--bl-font-title-3-medium);\n  --bl-button-height: var(--bl-size-2xl);\n}\n\n.button {\n  display: flex;\n  gap: var(--bl-button-margin-icon);\n  justify-content: center;\n  align-items: center;\n  box-sizing: border-box;\n  width: 100%;\n  height: var(--bl-button-height);\n  border: solid 1px var(--bl-button-border-color);\n  border-radius: 6px;\n  text-decoration: none;\n  padding: var(--bl-button-padding-vertical) var(--bl-button-padding-horizontal);\n  cursor: pointer;\n  background-color: var(--bl-button-bg-color);\n  color: var(--bl-button-content-color);\n  font: var(--bl-button-font);\n  font-kerning: none;\n  user-select: none;\n}\n\n.button:hover {\n  --bl-button-bg-color: var(--bl-button-main-hover-color);\n  --bl-button-border-color: var(--bl-button-main-hover-color);\n}\n\n.label {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n:host([size='small']) {\n  --bl-button-font: var(--bl-font-title-4-medium);\n  --bl-button-padding-vertical: var(--bl-size-3xs);\n  --bl-button-padding-horizontal: var(--bl-size-2xs);\n  --bl-button-icon-size: var(--bl-size-s);\n  --bl-button-height: var(--bl-size-xl);\n}\n\n:host([size='large']) {\n  --bl-button-font: var(--bl-font-title-3-medium);\n  --bl-button-padding-vertical: var(--bl-size-xs);\n  --bl-button-padding-horizontal: var(--bl-size-xl);\n  --bl-button-margin-icon: var(--bl-size-2xs);\n  --bl-button-height: var(--bl-size-3xl);\n}\n\n.button:focus {\n  outline: none;\n}\n\n:host ::slotted(bl-icon) {\n  font-size: var(--bl-button-icon-size);\n}\n\n.has-icon:not(.has-content) {\n  --bl-button-padding-horizontal: var(--bl-button-padding-vertical);\n  --bl-button-margin-icon: 0;\n}\n\n:host([secondary]) {\n  --bl-button-main-color: var(--bl-color-secondary);\n  --bl-button-main-hover-color: var(--bl-color-secondary-hover);\n}\n\n:host([success]) {\n  --bl-button-main-color: var(--bl-color-success);\n  --bl-button-main-hover-color: var(--bl-color-success-hover);\n}\n\n:host([danger]) {\n  --bl-button-main-color: var(--bl-color-danger);\n  --bl-button-main-hover-color: var(--bl-color-danger-hover);\n}\n\n:host([text]) {\n  --bl-button-content-color: var(--bl-button-main-color);\n  --bl-button-border-color: transparent;\n  --bl-button-bg-color: transparent;\n}\n\n:host([text]) .button {\n  text-decoration: underline;\n}\n\n:host([disabled]) {\n  cursor: not-allowed;\n\n  --bl-button-main-color: var(--bl-color-tertiary);\n  --bl-button-main-hover-color: var(--bl-color-tertiary);\n  --bl-button-content-color: var(--bl-color-content-passive);\n  --bl-button-bg-color: var(--bl-button-main-color);\n}\n\n:host([disabled]) .button {\n  pointer-events: none;\n  text-decoration: none;\n}\n\n:host([outline]) {\n  --bl-button-bg-color: transparent;\n}\n\n:host([outline]:not(:hover):not([disabled])) {\n  --bl-button-content-color: var(--bl-button-main-color);\n}\n\n:host([text]:not([disabled])) .button:hover {\n  --bl-button-content-color: var(--bl-button-main-hover-color);\n  --bl-button-border-color: transparent;\n  --bl-button-bg-color: transparent;\n}\n`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport style from './bl-button.css';\nimport '../icon/bl-icon';\n\nexport type ButtonSize = 'small' | 'medium' | 'large';\nexport type TargetType = '_blank' | '_parent' | '_self' | '_top';\n\n/**\n * @tag bl-button\n * @summary Baklava Button component\n *\n * @property {boolean} primary - Sets variant to primary\n * @property {boolean} secondary - Sets variant to secondary\n * @property {boolean} success - Sets variant to success\n * @property {boolean} danger - Sets variant to danger\n * @property {boolean} outline - Sets button version to outline\n * @property {boolean} text - Sets the button version to text\n * @property {boolean} disabled - Disables the button\n * @property {string} size - Sets the button size\n * @property {string} icon - Sets the name of the icon\n * @property {string} href - Sets link of the button\n * @property {string} target - Sets button target (should be defined with href)\n * @property {string} label - Sets the accessibility text for the button. Use it with icon-only buttons.\n *\n * @cssproperty --bl-button-display - Sets the display property of button. Default value is 'inline-block'.\n *\n * @event {CustomEvent} bl-click\n *\n */\n@customElement('bl-button')\nexport default class BlButton extends LitElement {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n\n  @property({ type: Boolean, reflect: true })\n  primary = false;\n\n  @property({ type: Boolean, reflect: true })\n  secondary = false;\n\n  @property({ type: Boolean, reflect: true })\n  success = false;\n\n  @property({ type: Boolean, reflect: true })\n  danger = false;\n\n  @property({ type: Boolean, reflect: true })\n  outline = false;\n\n  @property({ type: Boolean, reflect: true })\n  text = false;\n\n  @property({ type: String, reflect: true })\n  size: ButtonSize = 'medium';\n\n  @property({ type: String })\n  label: string;\n\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  @property({ type: String })\n  href?: string;\n\n  @property({ type: String })\n  icon?: string;\n\n  @property({ type: String })\n  target?: TargetType = '_self';\n\n  get _hasIconSlot() {\n    return this.querySelector(':scope > [slot=\"icon\"]') !== null;\n  }\n\n  get _hasDefaultSlot() {\n    const childNodes = [...this.childNodes];\n    return childNodes.some(node => {\n      const nodeType = node.nodeType;\n      // has only text node.\n      if (nodeType === node.TEXT_NODE && node.textContent?.trim() !== '') {\n        return true;\n      }\n      // has element node, it should not have slot attribute.\n      if (nodeType === node.ELEMENT_NODE) {\n        if (!(node as HTMLElement).hasAttribute('slot')) {\n          return true;\n        }\n      }\n      return false;\n    });\n  }\n\n  render(): TemplateResult {\n    const isAnchor = this.href ? true : false;\n    const icon = this.icon ? html`<bl-icon name=${this.icon}></bl-icon>` : '';\n    const slots = html`<slot name=\"icon\">${icon}</slot> <span class=\"label\"><slot></slot></span>`;\n    const classes = classMap({\n      'button': true,\n      'has-icon': this.icon || this._hasIconSlot,\n      'has-content': this._hasDefaultSlot,\n    });\n\n    return isAnchor\n      ? html`<a\n          class=${classes}\n          aria-disabled=\"${ifDefined(this.disabled)}\"\n          aria-label=\"${ifDefined(this.label)}\"\n          href=${ifDefined(this.href)}\n          target=${ifDefined(this.target)}\n          role=\"button\"\n          >${slots}</a\n        >`\n      : html`<button\n          class=${classes}\n          aria-disabled=\"${ifDefined(this.disabled)}\"\n          aria-label=\"${ifDefined(this.label)}\"\n          ?disabled=${this.disabled}\n          @click=\"${this._handleClick}\"\n        >\n          ${slots}\n        </button>`;\n  }\n\n  private _handleClick() {\n    this.event('bl-click', 'Click event fired!');\n  }\n\n  private event(name: string, detail: string) {\n    this.dispatchEvent(new CustomEvent(name, { detail, bubbles: true, composed: true }));\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bl-button': BlButton;\n  }\n}\n"],
-  "mappings": "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",
-  "names": []
-}