@trendyol/baklava 2.0.0-beta.93 → 2.0.0-beta.94

package/README.md

@@ -1,10 +1,8 @@
-![image](https://user-images.githubusercontent.com/127687/194415334-0dc8fbf2-3e87-44ed-b23a-0cc9da767b11.png)
+<p align="center"><img src="https://user-images.githubusercontent.com/127687/194415334-0dc8fbf2-3e87-44ed-b23a-0cc9da767b11.png" alt="Baklava Design System Logo" /></p>
 
-# Baklava Design System
+<h1 align="center">Baklava Design System</h1>
 
-[![npm package](https://img.shields.io/npm/v/@trendyol/baklava/beta.svg)](https://www.npmjs.com/package/@trendyol/baklava) [![jsDelivr hits (npm scoped)](https://img.shields.io/jsdelivr/npm/hm/@trendyol/baklava)](https://www.jsdelivr.com/package/npm/@trendyol/baklava) [![semantic-release: angular](https://img.shields.io/badge/semantic--release-angular-e10079?logo=semantic-release)](https://github.com/semantic-release/semantic-release)
-
-> This is a work-in-progress version. If you want to work on previous version (Grace) please check `main` branch.
+[![npm package stable](https://img.shields.io/npm/v/@trendyol/baklava.svg)](https://www.npmjs.com/package/@trendyol/baklava) [![npm package beta](https://img.shields.io/npm/v/@trendyol/baklava/beta.svg)](https://www.npmjs.com/package/@trendyol/baklava/v/beta) [![License](https://img.shields.io/github/license/trendyol/baklava)](https://github.com/Trendyol/baklava/blob/next/LICENSE) [![jsDelivr hits (npm scoped)](https://img.shields.io/jsdelivr/npm/hm/@trendyol/baklava)](https://www.jsdelivr.com/package/npm/@trendyol/baklava) [![semantic-release: angular](https://img.shields.io/badge/semantic--release-angular-e10079?logo=semantic-release)](https://github.com/semantic-release/semantic-release)
 
 Baklava is a design system provided by [Trendyol](https://github.com/trendyol) to create a consistent UI/UX for app users.
 
@@ -14,21 +12,25 @@ Web implementation of the design system is created as native web components so i
 
 Preferred way of using Baklava is using it via CDN. Just import library JS and CSS files to your main document like below:
 
-> **Since we are in beta version, there can be breaking changes in build. We don’t suggest you to use beta tag. Use versions instead.**
-
 ```html
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@trendyol/baklava@beta/dist/themes/default.css" />
-<script type="module" src="https://cdn.jsdelivr.net/npm/@trendyol/baklava@beta/dist/baklava.js"></script>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.0.0/dist/themes/default.css" />
+<script type="module" src="https://cdn.jsdelivr.net/npm/@trendyol/baklava@2.0.0/dist/baklava.js"></script>
 ```
 
 This way library will be served from a very high performant CDN and all of the Baklava web components will be ready to use inside your web project.
 
-> **⚠️ Because the scripts of the custom components are loaded into the DOM later, the baklava components may appear unstyled on the screen for a while. In order to avoid this 'FOUCE' effect, you can follow the instructions at this
- [link](https://www.abeautifulsite.net/posts/flash-of-undefined-custom-elements/).**
+```html
+<bl-button>Baklava works!</bl-button>
+```
+
+## How to contribute
+
+Baklava Design System is always open for direct contributions. Contributions can be in the form of design suggestions, documentation improvements, new component
+suggestions, code improvements, adding new features or fixing problems. For more information please check our [Contribution Guideline document](./CONTRIBUTING.md).
 
 ## Useful Links
 
-* [Storybook Documentation](https://trendyol.github.io/baklava/)
+* [Storybook Documentation](https://baklava.design/)
 * [Figma Design Document](https://www.figma.com/file/RrcLH0mWpIUy4vwuTlDeKN/Baklava-Design-Guide)
 * [Project Board](https://github.com/orgs/Trendyol/projects/4)
 * [Discussion Board](https://github.com/Trendyol/baklava/discussions)

package/dist/baklava-react.d.ts

@@ -1,114 +1,26 @@
-import React from "react";
-import { type EventName, ReactWebComponent } from "@lit-labs/react";
-import { ISelectOption } from "./components/select/bl-select";
-import type BlAlertType from "./components/alert/bl-alert";
-import type BlBadgeType from "./components/badge/bl-badge";
-import type BlButtonType from "./components/button/bl-button";
-import type BlCheckboxGroupType from "./components/checkbox-group/bl-checkbox-group";
-import type BlDialogType from "./components/dialog/bl-dialog";
-import type BlDrawerType from "./components/drawer/bl-drawer";
-import type BlDropdownType from "./components/dropdown/bl-dropdown";
-import type BlIconType from "./components/icon/bl-icon";
-import type BlInputType from "./components/input/bl-input";
-import type BlPaginationType from "./components/pagination/bl-pagination";
-import type BlPopoverType from "./components/popover/bl-popover";
-import type BlProgressIndicatorType from "./components/progress-indicator/bl-progress-indicator";
-import type BlRadioGroupType from "./components/radio-group/bl-radio-group";
-import type BlSelectType from "./components/select/bl-select";
-import type BlSwitchType from "./components/switch/bl-switch";
-import type BlTabGroupType from "./components/tab-group/bl-tab-group";
-import type BlTextareaType from "./components/textarea/bl-textarea";
-import type BlTooltipType from "./components/tooltip/bl-tooltip";
-import type BlCheckboxType from "./components/checkbox-group/checkbox/bl-checkbox";
-import type BlDropdownGroupType from "./components/dropdown/group/bl-dropdown-group";
-import type BlDropdownItemType from "./components/dropdown/item/bl-dropdown-item";
-import type BlRadioType from "./components/radio-group/radio/bl-radio";
-import type BlSelectOptionType from "./components/select/option/bl-select-option";
-import type BlTabType from "./components/tab-group/tab/bl-tab";
-import type BlTabPanelType from "./components/tab-group/tab-panel/bl-tab-panel";
-export declare const BlAlert: React.LazyExoticComponent<ReactWebComponent<BlAlertType, {
-    onBlClose: EventName<CustomEvent<boolean>>;
-}>>;
-export declare const BlBadge: React.LazyExoticComponent<ReactWebComponent<BlBadgeType, {}>>;
-export declare const BlButton: React.LazyExoticComponent<ReactWebComponent<BlButtonType, {
-    onBlClick: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlCheckboxGroup: React.LazyExoticComponent<ReactWebComponent<BlCheckboxGroupType, {
-    onBlCheckboxGroupChange: EventName<CustomEvent<string[]>>;
-}>>;
-export declare const BlDialog: React.LazyExoticComponent<ReactWebComponent<BlDialogType, {
-    onBlDialogOpen: EventName<CustomEvent<object>>;
-    onBlDialogClose: EventName<CustomEvent<object>>;
-}>>;
-export declare const BlDrawer: React.LazyExoticComponent<ReactWebComponent<BlDrawerType, {
-    onBlDrawerOpen: EventName<CustomEvent<string>>;
-    onBlDrawerClose: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlDropdown: React.LazyExoticComponent<ReactWebComponent<BlDropdownType, {
-    onBlDropdownOpen: EventName<CustomEvent<string>>;
-    onBlDropdownClose: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlIcon: React.LazyExoticComponent<ReactWebComponent<BlIconType, {
-    onBlLoad: EventName<CustomEvent<string>>;
-    onBlError: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlInput: React.LazyExoticComponent<ReactWebComponent<BlInputType, {
-    onBlChange: EventName<CustomEvent<string>>;
-    onBlInput: EventName<CustomEvent<string>>;
-    onBlInvalid: EventName<CustomEvent<ValidityState>>;
-}>>;
-export declare const BlPagination: React.LazyExoticComponent<ReactWebComponent<BlPaginationType, {
-    onBlChange: EventName<CustomEvent<{
-        selectedPage: number;
-        prevPage: number;
-        itemsPerPage: number;
-    }>>;
-}>>;
-export declare const BlPopover: React.LazyExoticComponent<ReactWebComponent<BlPopoverType, {
-    onBlPopoverShow: EventName<CustomEvent<string>>;
-    onBlPopoverHide: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlProgressIndicator: React.LazyExoticComponent<ReactWebComponent<BlProgressIndicatorType, {}>>;
-export declare const BlRadioGroup: React.LazyExoticComponent<ReactWebComponent<BlRadioGroupType, {
-    onBlRadioChange: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlSelect: React.LazyExoticComponent<ReactWebComponent<BlSelectType<string>, {
-    onBlSelect: EventName<CustomEvent<ISelectOption[]>>;
-}>>;
-export declare const BlSwitch: React.LazyExoticComponent<ReactWebComponent<BlSwitchType, {
-    onBlSwitchToggle: EventName<CustomEvent<boolean>>;
-}>>;
-export declare const BlTabGroup: React.LazyExoticComponent<ReactWebComponent<BlTabGroupType, {}>>;
-export declare const BlTextarea: React.LazyExoticComponent<ReactWebComponent<BlTextareaType, {
-    onBlInput: EventName<CustomEvent<string>>;
-    onBlChange: EventName<CustomEvent<string>>;
-    onBlInvalid: EventName<CustomEvent<ValidityState>>;
-}>>;
-export declare const BlTooltip: React.LazyExoticComponent<ReactWebComponent<BlTooltipType, {
-    onBlTooltipShow: EventName<CustomEvent<string>>;
-    onBlTooltipHide: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlCheckbox: React.LazyExoticComponent<ReactWebComponent<BlCheckboxType, {
-    onBlCheckboxChange: EventName<CustomEvent<boolean>>;
-    onBlFocus: EventName<CustomEvent<string>>;
-    onBlBlur: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlDropdownGroup: React.LazyExoticComponent<ReactWebComponent<BlDropdownGroupType, {}>>;
-export declare const BlDropdownItem: React.LazyExoticComponent<ReactWebComponent<BlDropdownItemType, {
-    onBlDropdownItemClick: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlRadio: React.LazyExoticComponent<ReactWebComponent<BlRadioType, {
-    onBlChecked: EventName<CustomEvent<string>>;
-    onBlFocus: EventName<CustomEvent<string>>;
-    onBlBlur: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlSelectOption: React.LazyExoticComponent<ReactWebComponent<BlSelectOptionType<string>, {
-    onBlSelectOption: EventName<CustomEvent<ValueType | string | null>>;
-    onBlFocus: EventName<CustomEvent<ValueType | string | null>>;
-    onBlBlur: EventName<CustomEvent<ValueType | string | null>>;
-}>>;
-export declare const BlTab: React.LazyExoticComponent<ReactWebComponent<BlTabType, {
-    onBlTabSelected: EventName<CustomEvent<string>>;
-}>>;
-export declare const BlTabPanel: React.LazyExoticComponent<ReactWebComponent<BlTabPanelType, {}>>;
+export declare const BlAlert: any;
+export declare const BlBadge: any;
+export declare const BlButton: any;
+export declare const BlCheckboxGroup: any;
+export declare const BlDialog: any;
+export declare const BlDrawer: any;
+export declare const BlDropdown: any;
+export declare const BlIcon: any;
+export declare const BlInput: any;
+export declare const BlPagination: any;
+export declare const BlPopover: any;
+export declare const BlProgressIndicator: any;
+export declare const BlRadioGroup: any;
+export declare const BlSelect: any;
+export declare const BlSwitch: any;
+export declare const BlTabGroup: any;
+export declare const BlTextarea: any;
+export declare const BlTooltip: any;
+export declare const BlCheckbox: any;
+export declare const BlDropdownGroup: any;
+export declare const BlDropdownItem: any;
+export declare const BlRadio: any;
+export declare const BlSelectOption: any;
+export declare const BlTab: any;
+export declare const BlTabPanel: any;
 //# sourceMappingURL=baklava-react.d.ts.map

package/dist/baklava-react.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"baklava-react.d.ts","sourceRoot":"","sources":["../src/baklava-react.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"baklava-react.d.ts","sourceRoot":"","sources":["../src/baklava-react.ts"],"names":[],"mappings":"AAmCA,eAAO,MAAM,OAAO,KAcnB,CAAC;AAEF,eAAO,MAAM,OAAO,KASnB,CAAC;AAEF,eAAO,MAAM,QAAQ,KAcpB,CAAC;AAEF,eAAO,MAAM,eAAe,KAiB3B,CAAC;AAEF,eAAO,MAAM,QAAQ,KA0BpB,CAAC;AAEF,eAAO,MAAM,QAAQ,KA0BpB,CAAC;AAEF,eAAO,MAAM,UAAU,KA0BtB,CAAC;AAEF,eAAO,MAAM,MAAM,KAuBlB,CAAC;AAEF,eAAO,MAAM,OAAO,KA6BnB,CAAC;AAEF,eAAO,MAAM,YAAY,KAiCxB,CAAC;AAEF,eAAO,MAAM,SAAS,KA0BrB,CAAC;AAEF,eAAO,MAAM,mBAAmB,KAW/B,CAAC;AAEF,eAAO,MAAM,YAAY,KAiBxB,CAAC;AAEF,eAAO,MAAM,QAAQ,KAiBpB,CAAC;AAEF,eAAO,MAAM,QAAQ,KAiBpB,CAAC;AAEF,eAAO,MAAM,UAAU,KAStB,CAAC;AAEF,eAAO,MAAM,UAAU,KA6BtB,CAAC;AAEF,eAAO,MAAM,SAAS,KA0BrB,CAAC;AAEF,eAAO,MAAM,UAAU,KA6BtB,CAAC;AAEF,eAAO,MAAM,eAAe,KAW3B,CAAC;AAEF,eAAO,MAAM,cAAc,KAiB1B,CAAC;AAEF,eAAO,MAAM,OAAO,KA6BnB,CAAC;AAEF,eAAO,MAAM,cAAc,KA6B1B,CAAC;AAEF,eAAO,MAAM,KAAK,KAiBjB,CAAC;AAEF,eAAO,MAAM,UAAU,KAStB,CAAC"}

package/dist/baklava.js

@@ -1,2 +1,2 @@
-import{b as S}from"./chunk-QV3A6DWH.js";import{a as b}from"./chunk-J73JZGIX.js";import{a as I}from"./chunk-MGQL62CQ.js";import{a as P}from"./chunk-JMV2HWKD.js";import{a as g}from"./chunk-UVCOTTG2.js";import{a as h}from"./chunk-72WMF254.js";import{b as T,d as G}from"./chunk-VQLW2744.js";import{b as D}from"./chunk-VYKKWEKI.js";import{a as B}from"./chunk-EMMMXLJJ.js";import{a as m}from"./chunk-GO4KZIGU.js";import{a as s}from"./chunk-4UWTC6BR.js";import{a as x}from"./chunk-QRR36YKM.js";import"./chunk-XQN3H7RG.js";import"./chunk-3B64VOWB.js";import{a as w}from"./chunk-SEMLCEAH.js";import"./chunk-ANYJUR6Q.js";import{a as n}from"./chunk-MU34JCL5.js";import{c,f as i}from"./chunk-HTIGXY2B.js";import{a as r}from"./chunk-6IV5ELOB.js";import{a}from"./chunk-TJ47AW2B.js";import{b as f,e as p}from"./chunk-OSIYJGJP.js";import"./chunk-EPJ347EQ.js";import"./chunk-DJOD4BTL.js";import{a as d}from"./chunk-XKX2GLBY.js";import{a as u}from"./chunk-W6FBJD54.js";import{b as l}from"./chunk-ZEBKUNFE.js";import"./chunk-OLPYXE2P.js";import"./chunk-KPAWUBRO.js";import{a as o,b as e,c as t}from"./chunk-F3ZH5IV7.js";import"./chunk-RLMJN536.js";import"./chunk-23UFIOHV.js";import"./chunk-57PTZNIL.js";import"./chunk-NZ3RGSR6.js";export{r as BlAlert,a as BlBadge,l as BlButton,f as BlCheckbox,p as BlCheckboxGroup,d as BlDialog,u as BlDrawer,G as BlDropdown,D as BlDropdownGroup,T as BlDropdownItem,t as BlIcon,x as BlInput,B as BlPagination,w as BlPopover,n as BlProgressIndicator,c as BlRadio,i as BlRadioGroup,m as BlSelect,s as BlSelectOption,S as BlSwitch,I as BlTab,b as BlTabGroup,P as BlTabPanel,g as BlTextarea,h as BlTooltip,e as getIconPath,o as setIconPath};
+import{b as S}from"./chunk-N53HXW4A.js";import{a as b}from"./chunk-TQBAGFBF.js";import{a as I}from"./chunk-YTUAZIEF.js";import{a as P}from"./chunk-6FK4ZU5B.js";import{a as g}from"./chunk-YMS5JP47.js";import{a as h}from"./chunk-32HGEMZF.js";import{b as T,d as G}from"./chunk-AXRP3K2X.js";import{b as D}from"./chunk-FSYC7NDP.js";import{a as B}from"./chunk-Y4UXIJSO.js";import{a as m}from"./chunk-QASRATPF.js";import{a as s}from"./chunk-MCS3XLXD.js";import{a as x}from"./chunk-PUNHEAEI.js";import"./chunk-XQN3H7RG.js";import"./chunk-3B64VOWB.js";import{a as w}from"./chunk-4PG6AOX7.js";import"./chunk-ANYJUR6Q.js";import{a as n}from"./chunk-RFAEPGC3.js";import{c,f as i}from"./chunk-VXGOQPWU.js";import{a as r}from"./chunk-6UPKDZRW.js";import{a}from"./chunk-5JHQZCHW.js";import{b as f,e as p}from"./chunk-5AIFOXPM.js";import"./chunk-EPJ347EQ.js";import"./chunk-DJOD4BTL.js";import{a as d}from"./chunk-CI65YME7.js";import{a as u}from"./chunk-AZ42S4YP.js";import{b as l}from"./chunk-KGIPG6EV.js";import"./chunk-OLPYXE2P.js";import"./chunk-KPAWUBRO.js";import{a as o,b as e,c as t}from"./chunk-3SON7X7S.js";import"./chunk-RLMJN536.js";import"./chunk-23UFIOHV.js";import"./chunk-57PTZNIL.js";import"./chunk-NZ3RGSR6.js";export{r as BlAlert,a as BlBadge,l as BlButton,f as BlCheckbox,p as BlCheckboxGroup,d as BlDialog,u as BlDrawer,G as BlDropdown,D as BlDropdownGroup,T as BlDropdownItem,t as BlIcon,x as BlInput,B as BlPagination,w as BlPopover,n as BlProgressIndicator,c as BlRadio,i as BlRadioGroup,m as BlSelect,s as BlSelectOption,S as BlSwitch,I as BlTab,b as BlTabGroup,P as BlTabPanel,g as BlTextarea,h as BlTooltip,e as getIconPath,o as setIconPath};
 //# sourceMappingURL=baklava.js.map

package/dist/chunk-32HGEMZF.js

@@ -0,0 +1,15 @@
+import{a as b,b as u,c as f,d as g,e as w,g as x,h as y}from"./chunk-ANYJUR6Q.js";import{a as m}from"./chunk-OLPYXE2P.js";import{a as r}from"./chunk-23UFIOHV.js";import{a as n,b as p,f as d,g as h,h as c,i as v,j as i}from"./chunk-57PTZNIL.js";import{a as e}from"./chunk-NZ3RGSR6.js";var z=n`.trigger{display:inline-block;cursor:pointer}.tooltip{position:fixed;box-sizing:border-box;border:0;background-color:var(--bl-color-neutral-darker);color:var(--bl-color-neutral-full);border-radius:var(--bl-size-3xs);pointer-events:none;font:var(--bl-font-title-3-regular);padding:var(--bl-size-m);z-index:var(--bl-index-tooltip);width:max-content;hyphens:auto;--max-viewport:calc(100vw - var(--bl-size-s));--tooltip-max-width:424px;max-width:min(var(--max-viewport),var(--tooltip-max-width))}.tooltip:not(.visible){visibility:hidden}.arrow{position:absolute;background-color:var(--bl-color-neutral-darker);width:var(--bl-size-2xs);height:var(--bl-size-2xs);transform:rotate(45deg)}`,E=z;var t=class extends d{constructor(){super(...arguments);this.placement="top";this._visible=!1}static get styles(){return[E]}connectedCallback(){super.connectedCallback(),this.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("keydown",this.handleKeyDown),this.popoverAutoUpdateCleanup&&this.popoverAutoUpdateCleanup()}setTooltip(){this.popoverAutoUpdateCleanup=x(this.trigger,this.tooltip,()=>{y(this.trigger,this.tooltip,{placement:this.placement,strategy:"fixed",middleware:[g(8),w({padding:5}),u(),f(),b({element:this.arrow,padding:5})]}).then(({x:o,y:k,placement:C,middlewareData:s})=>{if(Object.assign(this.tooltip.style,{left:`${o}px`,top:`${k}px`}),s.arrow){let{x:a,y:l}=s.arrow;Object.assign(this.arrow.style,{left:a!=null?`${a}px`:"",top:l!=null?`${l}px`:""});let $={top:"bottom",right:"left",bottom:"top",left:"right"},D=C.split("-")[0],S=$[D];this.arrow.style.setProperty(S,"-4px")}})})}show(){this._visible=!0,this.setTooltip(),this.onShow("Show event fired!")}hide(){this._visible=!1,this.onHide("Hide event fired!")}get visible(){return this._visible}handleKeyDown(o){this._visible&&o.key==="Escape"&&(o.stopPropagation(),this.hide())}render(){let o=m({tooltip:!0,visible:this._visible});return p`<slot
+        class="trigger"
+        name="tooltip-trigger"
+        aria-describedby="tooltip"
+        @focus=${{handleEvent:()=>this.show(),capture:!0}}
+        @blur=${{handleEvent:()=>this.hide(),capture:!0}}
+        @mouseover=${()=>this.show()}
+        @mouseleave=${()=>this.hide()}
+      >
+      </slot>
+      <div class=${o}>
+        <slot id="tooltip" role="tooltip" aria-live=${this._visible?"polite":"off"}></slot>
+        <div class="arrow" aria-hidden="true"></div>
+      </div>`}};e([i(".tooltip")],t.prototype,"tooltip",2),e([i(".trigger")],t.prototype,"trigger",2),e([i(".arrow")],t.prototype,"arrow",2),e([c({type:String})],t.prototype,"placement",2),e([v()],t.prototype,"_visible",2),e([r("bl-tooltip-show")],t.prototype,"onShow",2),e([r("bl-tooltip-hide")],t.prototype,"onHide",2),t=e([h("bl-tooltip")],t);export{t as a};
+//# sourceMappingURL=chunk-32HGEMZF.js.map

package/dist/chunk-32HGEMZF.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/tooltip/bl-tooltip.css", "../src/components/tooltip/bl-tooltip.ts"],
+  "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`.trigger{display:inline-block;cursor:pointer}.tooltip{position:fixed;box-sizing:border-box;border:0;background-color:var(--bl-color-neutral-darker);color:var(--bl-color-neutral-full);border-radius:var(--bl-size-3xs);pointer-events:none;font:var(--bl-font-title-3-regular);padding:var(--bl-size-m);z-index:var(--bl-index-tooltip);width:max-content;hyphens:auto;--max-viewport:calc(100vw - var(--bl-size-s));--tooltip-max-width:424px;max-width:min(var(--max-viewport),var(--tooltip-max-width))}.tooltip:not(.visible){visibility:hidden}.arrow{position:absolute;background-color:var(--bl-color-neutral-darker);width:var(--bl-size-2xs);height:var(--bl-size-2xs);transform:rotate(45deg)}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { computePosition, flip, shift, offset, arrow, inline, autoUpdate } from '@floating-ui/dom';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ReferenceElement } from '@floating-ui/core';\nimport style from './bl-tooltip.css';\nimport { event, EventDispatcher } from '../../utilities/event';\n\nexport type Placement =\n  | 'top-start'\n  | 'top'\n  | 'top-end'\n  | 'bottom-start'\n  | 'bottom'\n  | 'bottom-end'\n  | 'left-start'\n  | 'left'\n  | 'left-end'\n  | 'right-start'\n  | 'right'\n  | 'right-end';\n\n/**\n * @tag bl-tooltip\n * @summary Baklava Tooltip component\n *\n * @property {string} placement - Sets the tooltip placement\n */\n@customElement('bl-tooltip')\nexport default class BlTooltip extends LitElement {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n\n  @query('.tooltip') private tooltip: HTMLElement;\n  @query('.trigger') private trigger: ReferenceElement;\n  @query('.arrow') private arrow: HTMLElement;\n\n  /**\n   * Sets placement of the tooltip\n   */\n  @property({ type: String })\n  placement: Placement = 'top';\n\n  @state() private _visible = false;\n\n  /**\n   * Fires when hovering over a trigger\n   */\n  @event('bl-tooltip-show') private onShow: EventDispatcher<string>;\n\n  /**\n   * Fires when leaving over from trigger\n   */\n  @event('bl-tooltip-hide') private onHide: EventDispatcher<string>;\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    this.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.removeEventListener('keydown', this.handleKeyDown);\n\n    this.popoverAutoUpdateCleanup && this.popoverAutoUpdateCleanup();\n  }\n\n  private popoverAutoUpdateCleanup: () => void;\n\n  private setTooltip() {\n    this.popoverAutoUpdateCleanup = autoUpdate(this.trigger, this.tooltip, () => {\n      computePosition(this.trigger, this.tooltip, {\n        placement: this.placement,\n        strategy: 'fixed',\n        middleware: [\n          offset(8),\n          shift({ padding: 5 }),\n          flip(),\n          inline(),\n          arrow({ element: this.arrow, padding: 5 }),\n        ],\n      }).then(({ x, y, placement, middlewareData }) => {\n        Object.assign(this.tooltip.style, {\n          left: `${x}px`,\n          top: `${y}px`,\n        });\n\n        if (middlewareData.arrow) {\n          const { x: arrowX, y: arrowY } = middlewareData.arrow;\n\n          Object.assign(this.arrow.style, {\n            left: arrowX != null ? `${arrowX}px` : '',\n            top: arrowY != null ? `${arrowY}px` : '',\n          });\n\n          const arrowFlipDirections = {\n            top: 'bottom',\n            right: 'left',\n            bottom: 'top',\n            left: 'right',\n          };\n          const tooltipPlacement = placement.split('-')[0] as keyof typeof arrowFlipDirections;\n          const arrowDirection = arrowFlipDirections[tooltipPlacement];\n\n          this.arrow.style.setProperty(arrowDirection, '-4px');\n        }\n      });\n    });\n  }\n\n  /**\n   * Shows tooltip\n   */\n  show() {\n    this._visible = true;\n    this.setTooltip();\n    this.onShow('Show event fired!');\n  }\n\n  /**\n   * Hides tooltip\n   */\n  hide() {\n    this._visible = false;\n    this.onHide('Hide event fired!');\n  }\n\n  /**\n   * Gives the visibility status of the tooltip\n   */\n  get visible(): boolean {\n    return this._visible;\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    if (this._visible && event.key === 'Escape') {\n      event.stopPropagation();\n      this.hide();\n    }\n  }\n\n  render(): TemplateResult {\n    const classes = classMap({\n      tooltip: true,\n      visible: this._visible,\n    });\n\n    return html`<slot\n        class=\"trigger\"\n        name=\"tooltip-trigger\"\n        aria-describedby=\"tooltip\"\n        @focus=${{ handleEvent: () => this.show(), capture: true }}\n        @blur=${{ handleEvent: () => this.hide(), capture: true }}\n        @mouseover=${() => this.show()}\n        @mouseleave=${() => this.hide()}\n      >\n      </slot>\n      <div class=${classes}>\n        <slot id=\"tooltip\" role=\"tooltip\" aria-live=${this._visible ? 'polite' : 'off'}></slot>\n        <div class=\"arrow\" aria-hidden=\"true\"></div>\n      </div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bl-tooltip': BlTooltip;\n  }\n}\n"],
+  "mappings": "4RACO,IAAMA,EAASC,6qBACfC,EAAQF,EC2Bf,IAAqBG,EAArB,cAAuCC,CAAW,CAAlD,kCAaE,eAAuB,MAEd,KAAQ,SAAW,GAd5B,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CAwBA,mBAAoB,CAClB,MAAM,kBAAkB,EAExB,KAAK,iBAAiB,UAAW,KAAK,aAAa,CACrD,CAEA,sBAAuB,CACrB,MAAM,qBAAqB,EAE3B,KAAK,oBAAoB,UAAW,KAAK,aAAa,EAEtD,KAAK,0BAA4B,KAAK,yBAAyB,CACjE,CAIQ,YAAa,CACnB,KAAK,yBAA2BC,EAAW,KAAK,QAAS,KAAK,QAAS,IAAM,CAC3EC,EAAgB,KAAK,QAAS,KAAK,QAAS,CAC1C,UAAW,KAAK,UAChB,SAAU,QACV,WAAY,CACVC,EAAO,CAAC,EACRC,EAAM,CAAE,QAAS,CAAE,CAAC,EACpBC,EAAK,EACLC,EAAO,EACPC,EAAM,CAAE,QAAS,KAAK,MAAO,QAAS,CAAE,CAAC,CAC3C,CACF,CAAC,EAAE,KAAK,CAAC,CAAE,EAAAC,EAAG,EAAAC,EAAG,UAAAC,EAAW,eAAAC,CAAe,IAAM,CAM/C,GALA,OAAO,OAAO,KAAK,QAAQ,MAAO,CAChC,KAAM,GAAGH,MACT,IAAK,GAAGC,KACV,CAAC,EAEGE,EAAe,MAAO,CACxB,GAAM,CAAE,EAAGC,EAAQ,EAAGC,CAAO,EAAIF,EAAe,MAEhD,OAAO,OAAO,KAAK,MAAM,MAAO,CAC9B,KAAMC,GAAU,KAAO,GAAGA,MAAa,GACvC,IAAKC,GAAU,KAAO,GAAGA,MAAa,EACxC,CAAC,EAED,IAAMC,EAAsB,CAC1B,IAAK,SACL,MAAO,OACP,OAAQ,MACR,KAAM,OACR,EACMC,EAAmBL,EAAU,MAAM,GAAG,EAAE,CAAC,EACzCM,EAAiBF,EAAoBC,CAAgB,EAE3D,KAAK,MAAM,MAAM,YAAYC,EAAgB,MAAM,EAEvD,CAAC,CACH,CAAC,CACH,CAKA,MAAO,CACL,KAAK,SAAW,GAChB,KAAK,WAAW,EAChB,KAAK,OAAO,mBAAmB,CACjC,CAKA,MAAO,CACL,KAAK,SAAW,GAChB,KAAK,OAAO,mBAAmB,CACjC,CAKA,IAAI,SAAmB,CACrB,OAAO,KAAK,QACd,CAEQ,cAAcC,EAAsB,CACtC,KAAK,UAAYA,EAAM,MAAQ,WACjCA,EAAM,gBAAgB,EACtB,KAAK,KAAK,EAEd,CAEA,QAAyB,CACvB,IAAMC,EAAUC,EAAS,CACvB,QAAS,GACT,QAAS,KAAK,QAChB,CAAC,EAED,OAAOV;AAAA;AAAA;AAAA;AAAA,iBAIM,CAAE,YAAa,IAAM,KAAK,KAAK,EAAG,QAAS,EAAK;AAAA,gBACjD,CAAE,YAAa,IAAM,KAAK,KAAK,EAAG,QAAS,EAAK;AAAA,qBAC3C,IAAM,KAAK,KAAK;AAAA,sBACf,IAAM,KAAK,KAAK;AAAA;AAAA;AAAA,mBAGnBS;AAAA,sDACmC,KAAK,SAAW,SAAW;AAAA;AAAA,aAG/E,CACF,EAnI6BE,EAAA,CAA1B,EAAM,UAAU,GALEtB,EAKQ,uBACAsB,EAAA,CAA1B,EAAM,UAAU,GANEtB,EAMQ,uBACFsB,EAAA,CAAxB,EAAM,QAAQ,GAPItB,EAOM,qBAMzBsB,EAAA,CADCC,EAAS,CAAE,KAAM,MAAO,CAAC,GAZPvB,EAanB,yBAEiBsB,EAAA,CAAhBE,EAAM,GAfYxB,EAeF,wBAKiBsB,EAAA,CAAjCH,EAAM,iBAAiB,GApBLnB,EAoBe,sBAKAsB,EAAA,CAAjCH,EAAM,iBAAiB,GAzBLnB,EAyBe,sBAzBfA,EAArBsB,EAAA,CADCC,EAAc,YAAY,GACNvB",
+  "names": ["styles", "i", "bl_tooltip_default", "BlTooltip", "s", "bl_tooltip_default", "P", "z", "O", "D", "b", "T", "u", "x", "y", "placement", "middlewareData", "arrowX", "arrowY", "arrowFlipDirections", "tooltipPlacement", "arrowDirection", "event", "classes", "o", "__decorateClass", "e", "t"]
+}

package/dist/{chunk-F3ZH5IV7.js → chunk-3SON7X7S.js}

@@ -15,4 +15,4 @@ lit-html/directives/unsafe-svg.js:
    * SPDX-License-Identifier: BSD-3-Clause
    *)
 */
-//# sourceMappingURL=chunk-F3ZH5IV7.js.map
+//# sourceMappingURL=chunk-3SON7X7S.js.map

package/dist/{chunk-F3ZH5IV7.js.map → chunk-3SON7X7S.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../node_modules/lit-html/src/directives/unsafe-html.ts", "../node_modules/lit-html/src/directives/unsafe-svg.ts", "../src/utilities/asset-paths.ts", "../src/components/icon/bl-icon.css", "../src/components/icon/bl-icon.ts"],
-  "sourcesContent": ["/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport {nothing, TemplateResult, noChange} from '../lit-html.js';\nimport {directive, Directive, PartInfo, PartType} from '../directive.js';\n\nconst HTML_RESULT = 1;\n\nexport class UnsafeHTMLDirective extends Directive {\n  static directiveName = 'unsafeHTML';\n  static resultType = HTML_RESULT;\n\n  private _value: unknown = nothing;\n  private _templateResult?: TemplateResult;\n\n  constructor(partInfo: PartInfo) {\n    super(partInfo);\n    if (partInfo.type !== PartType.CHILD) {\n      throw new Error(\n        `${\n          (this.constructor as typeof UnsafeHTMLDirective).directiveName\n        }() can only be used in child bindings`\n      );\n    }\n  }\n\n  render(value: string | typeof nothing | typeof noChange | undefined | null) {\n    if (value === nothing || value == null) {\n      this._templateResult = undefined;\n      return (this._value = value);\n    }\n    if (value === noChange) {\n      return value;\n    }\n    if (typeof value != 'string') {\n      throw new Error(\n        `${\n          (this.constructor as typeof UnsafeHTMLDirective).directiveName\n        }() called with a non-string value`\n      );\n    }\n    if (value === this._value) {\n      return this._templateResult;\n    }\n    this._value = value;\n    const strings = [value] as unknown as TemplateStringsArray;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (strings as any).raw = strings;\n    // WARNING: impersonating a TemplateResult like this is extremely\n    // dangerous. Third-party directives should not do this.\n    return (this._templateResult = {\n      // Cast to a known set of integers that satisfy ResultType so that we\n      // don't have to export ResultType and possibly encourage this pattern.\n      // This property needs to remain unminified.\n      ['_$litType$']: (this.constructor as typeof UnsafeHTMLDirective)\n        .resultType as 1 | 2,\n      strings,\n      values: [],\n    });\n  }\n}\n\n/**\n * Renders the result as HTML, rather than text.\n *\n * The values `undefined`, `null`, and `nothing`, will all result in no content\n * (empty string) being rendered.\n *\n * Note, this is unsafe to use with any user-provided input that hasn't been\n * sanitized or escaped, as it may lead to cross-site-scripting\n * vulnerabilities.\n */\nexport const unsafeHTML = directive(UnsafeHTMLDirective);\n", "/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport {directive} from '../directive.js';\nimport {UnsafeHTMLDirective} from './unsafe-html.js';\n\nconst SVG_RESULT = 2;\n\nclass UnsafeSVGDirective extends UnsafeHTMLDirective {\n  static override directiveName = 'unsafeSVG';\n  static override resultType = SVG_RESULT;\n}\n\n/**\n * Renders the result as SVG, rather than text.\n *\n * The values `undefined`, `null`, and `nothing`, will all result in no content\n * (empty string) being rendered.\n *\n * Note, this is unsafe to use with any user-provided input that hasn't been\n * sanitized or escaped, as it may lead to cross-site-scripting\n * vulnerabilities.\n */\nexport const unsafeSVG = directive(UnsafeSVGDirective);\n\n/**\n * The type of the class that powers this directive. Necessary for naming the\n * directive's return type.\n */\nexport type {UnsafeSVGDirective};\n", "let iconPath = './assets';\n\nexport function setIconPath(path: string) {\n  iconPath = path;\n}\n\nexport function getIconPath() {\n  return iconPath;\n}\n\nconst modulePath = import.meta.url;\n\nif (modulePath) {\n  setIconPath(modulePath.split('/').slice(0, -1).concat('assets').join('/'));\n}\n", "import {css} from 'lit';\nexport const styles = css`:host{display:inline-block}:host div{display:flex;align-items:stretch;width:1em;height:1em;min-width:1em;min-height:1em;overflow:hidden;transform:translateZ(0)}:host svg{width:1em;height:1em}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { getIconPath } from '../../utilities/asset-paths';\nimport { event, EventDispatcher } from '../../utilities/event';\n\nimport style from './bl-icon.css';\n\nconst requestMap = new Map<string, Promise<Response>>();\n\n/**\n * @tag bl-icon\n * @summary Baklava Icon component\n *\n * @cssproperty font-size - Setting size of icon. Default is current font size in DOM place\n * @cssproperty color - Setting color of icon. Default is `currentColor`\n */\n@customElement('bl-icon')\nexport default class BlIcon extends LitElement {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n\n  private _iconName: string;\n\n  /**\n   * Name of the icon to show\n   */\n  @property()\n  get name(): string {\n    return this._iconName;\n  }\n\n  set name(value: string) {\n    if (value !== this._iconName) {\n      this._iconName = value;\n      this.load();\n    }\n  }\n\n  /**\n   * Fires when SVG icon loaded\n   */\n  @event('bl-load') private onLoad: EventDispatcher<string>;\n\n  /**\n   * Fires when SVG icon failed to load\n   */\n  @event('bl-error') private onError: EventDispatcher<string>;\n\n  @state() private svg: string;\n\n  async load() {\n    const iconPath = getIconPath();\n    const fileUrl = `${iconPath}/${this.name}.svg`;\n\n    if (!requestMap.has(fileUrl)) {\n      requestMap.set(fileUrl, fetch(fileUrl));\n    }\n\n    try {\n      const iconRequest = await requestMap.get(fileUrl);\n      const res = await iconRequest?.clone();\n\n      if (res?.ok) {\n        this.svg = await res.text();\n        this.onLoad(`${this.name} icon loaded`);\n        this.requestUpdate();\n      } else {\n        this.onError(`${this.name} icon failed to load`);\n      }\n    } catch (error) {\n      this.onError(`${this.name} icon failed to load [${error}]`);\n    }\n  }\n\n  render(): TemplateResult {\n    return html`<div aria-hidden=\"true\">${unsafeSVG(this.svg)}</div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bl-icon': BlIcon;\n  }\n}\n"],
+  "sourcesContent": ["/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport {nothing, TemplateResult, noChange} from '../lit-html.js';\nimport {directive, Directive, PartInfo, PartType} from '../directive.js';\n\nconst HTML_RESULT = 1;\n\nexport class UnsafeHTMLDirective extends Directive {\n  static directiveName = 'unsafeHTML';\n  static resultType = HTML_RESULT;\n\n  private _value: unknown = nothing;\n  private _templateResult?: TemplateResult;\n\n  constructor(partInfo: PartInfo) {\n    super(partInfo);\n    if (partInfo.type !== PartType.CHILD) {\n      throw new Error(\n        `${\n          (this.constructor as typeof UnsafeHTMLDirective).directiveName\n        }() can only be used in child bindings`\n      );\n    }\n  }\n\n  render(value: string | typeof nothing | typeof noChange | undefined | null) {\n    if (value === nothing || value == null) {\n      this._templateResult = undefined;\n      return (this._value = value);\n    }\n    if (value === noChange) {\n      return value;\n    }\n    if (typeof value != 'string') {\n      throw new Error(\n        `${\n          (this.constructor as typeof UnsafeHTMLDirective).directiveName\n        }() called with a non-string value`\n      );\n    }\n    if (value === this._value) {\n      return this._templateResult;\n    }\n    this._value = value;\n    const strings = [value] as unknown as TemplateStringsArray;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (strings as any).raw = strings;\n    // WARNING: impersonating a TemplateResult like this is extremely\n    // dangerous. Third-party directives should not do this.\n    return (this._templateResult = {\n      // Cast to a known set of integers that satisfy ResultType so that we\n      // don't have to export ResultType and possibly encourage this pattern.\n      // This property needs to remain unminified.\n      ['_$litType$']: (this.constructor as typeof UnsafeHTMLDirective)\n        .resultType as 1 | 2,\n      strings,\n      values: [],\n    });\n  }\n}\n\n/**\n * Renders the result as HTML, rather than text.\n *\n * The values `undefined`, `null`, and `nothing`, will all result in no content\n * (empty string) being rendered.\n *\n * Note, this is unsafe to use with any user-provided input that hasn't been\n * sanitized or escaped, as it may lead to cross-site-scripting\n * vulnerabilities.\n */\nexport const unsafeHTML = directive(UnsafeHTMLDirective);\n", "/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nimport {directive} from '../directive.js';\nimport {UnsafeHTMLDirective} from './unsafe-html.js';\n\nconst SVG_RESULT = 2;\n\nclass UnsafeSVGDirective extends UnsafeHTMLDirective {\n  static override directiveName = 'unsafeSVG';\n  static override resultType = SVG_RESULT;\n}\n\n/**\n * Renders the result as SVG, rather than text.\n *\n * The values `undefined`, `null`, and `nothing`, will all result in no content\n * (empty string) being rendered.\n *\n * Note, this is unsafe to use with any user-provided input that hasn't been\n * sanitized or escaped, as it may lead to cross-site-scripting\n * vulnerabilities.\n */\nexport const unsafeSVG = directive(UnsafeSVGDirective);\n\n/**\n * The type of the class that powers this directive. Necessary for naming the\n * directive's return type.\n */\nexport type {UnsafeSVGDirective};\n", "let iconPath = './assets';\n\nexport function setIconPath(path: string) {\n  iconPath = path;\n}\n\nexport function getIconPath() {\n  return iconPath;\n}\n\nconst modulePath = import.meta.url;\n\nif (modulePath) {\n  setIconPath(modulePath.split('/').slice(0, -1).concat('assets').join('/'));\n}\n", "import {css} from 'lit';\nexport const styles = css`:host{display:inline-block}:host div{display:flex;align-items:stretch;width:1em;height:1em;min-width:1em;min-height:1em;overflow:hidden;transform:translateZ(0)}:host svg{width:1em;height:1em}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { getIconPath } from '../../utilities/asset-paths';\nimport { event, EventDispatcher } from '../../utilities/event';\n\nimport style from './bl-icon.css';\n\nconst requestMap = new Map<string, Promise<Response>>();\n\n/**\n * @tag bl-icon\n * @summary Baklava Icon component\n *\n * @cssproperty [font-size] Setting size of icon. Default is current font size in DOM place\n * @cssproperty [color=currentColor] Setting color of icon\n */\n@customElement('bl-icon')\nexport default class BlIcon extends LitElement {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n\n  private _iconName: string;\n\n  /**\n   * Name of the icon to show\n   */\n  @property()\n  get name(): string {\n    return this._iconName;\n  }\n\n  set name(value: string) {\n    if (value !== this._iconName) {\n      this._iconName = value;\n      this.load();\n    }\n  }\n\n  /**\n   * Fires when SVG icon loaded\n   */\n  @event('bl-load') private onLoad: EventDispatcher<string>;\n\n  /**\n   * Fires when SVG icon failed to load\n   */\n  @event('bl-error') private onError: EventDispatcher<string>;\n\n  @state() private svg: string;\n\n  async load() {\n    const iconPath = getIconPath();\n    const fileUrl = `${iconPath}/${this.name}.svg`;\n\n    if (!requestMap.has(fileUrl)) {\n      requestMap.set(fileUrl, fetch(fileUrl));\n    }\n\n    try {\n      const iconRequest = await requestMap.get(fileUrl);\n      const res = await iconRequest?.clone();\n\n      if (res?.ok) {\n        this.svg = await res.text();\n        this.onLoad(`${this.name} icon loaded`);\n        this.requestUpdate();\n      } else {\n        this.onError(`${this.name} icon failed to load`);\n      }\n    } catch (error) {\n      this.onError(`${this.name} icon failed to load [${error}]`);\n    }\n  }\n\n  render(): TemplateResult {\n    return html`<div aria-hidden=\"true\">${unsafeSVG(this.svg)}</div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bl-icon': BlIcon;\n  }\n}\n"],
   "mappings": "+NAWM,IAAOA,EAAP,cAAmCC,CAAAA,CAOvCC,YAAYC,EAAAA,CAEV,GADAC,MAAMD,CAAAA,EAJAE,KAAMC,GAAYC,EAKpBJ,EAASK,OAASC,EAASC,MAC7B,MAAUC,MAELN,KAAKH,YAA2CU,cADnD,uCAAA,CAKL,CAEDC,OAAOC,EAAAA,CACL,GAAIA,IAAUP,GAAWO,GAAS,KAEhC,OADAT,KAAKU,GAAAA,OACGV,KAAKC,GAASQ,EAExB,GAAIA,IAAUE,EACZ,OAAOF,EAET,GAAoB,OAATA,GAAS,SAClB,MAAUH,MAELN,KAAKH,YAA2CU,cADnD,mCAAA,EAKJ,GAAIE,IAAUT,KAAKC,GACjB,OAAOD,KAAKU,GAEdV,KAAKC,GAASQ,EACd,IAAMG,EAAU,CAACH,CAAAA,EAKjB,OAHCG,EAAgBC,IAAMD,EAGfZ,KAAKU,GAAkB,CAI7BI,WAAiBd,KAAKH,YACnBkB,WACHH,QAAAA,EACAI,OAAQ,CAAA,CAAA,CAEX,CAAA,EAlDMrB,EAAaY,cAAG,aAChBZ,EAAUoB,WAJC,EAAA,IAkEPE,EAAaC,EAAUvB,CAAAA,EChEpC,IAAMwB,EAAN,cAAiCC,CAAAA,CAAAA,EACfD,EAAaE,cAAG,YAChBF,EAAUG,WAJT,EAAA,IAiBNC,EAAYC,EAAUL,CAAAA,EC1BnC,IAAIM,EAAW,WAER,SAASC,EAAYC,EAAc,CACxCF,EAAWE,CACb,CAEO,SAASC,GAAc,CAC5B,OAAOH,CACT,CAEA,IAAMI,EAAa,YAAY,IAE3BA,GACFH,EAAYG,EAAW,MAAM,GAAG,EAAE,MAAM,EAAG,EAAE,EAAE,OAAO,QAAQ,EAAE,KAAK,GAAG,CAAC,ECZpE,IAAMC,EAASC,mMACfC,EAAQF,ECMf,IAAMG,EAAa,IAAI,IAUFC,EAArB,cAAoCC,CAAW,CAC7C,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CAQA,IAAI,MAAe,CACjB,OAAO,KAAK,SACd,CAEA,IAAI,KAAKC,EAAe,CAClBA,IAAU,KAAK,YACjB,KAAK,UAAYA,EACjB,KAAK,KAAK,EAEd,CAcA,MAAM,MAAO,CAEX,IAAMC,EAAU,GADCC,EAAY,KACE,KAAK,WAE/BN,EAAW,IAAIK,CAAO,GACzBL,EAAW,IAAIK,EAAS,MAAMA,CAAO,CAAC,EAGxC,GAAI,CACF,IAAME,EAAc,MAAMP,EAAW,IAAIK,CAAO,EAC1CG,EAAM,MAAMD,GAAA,YAAAA,EAAa,SAE3BC,GAAA,MAAAA,EAAK,IACP,KAAK,IAAM,MAAMA,EAAI,KAAK,EAC1B,KAAK,OAAO,GAAG,KAAK,kBAAkB,EACtC,KAAK,cAAc,GAEnB,KAAK,QAAQ,GAAG,KAAK,0BAA0B,CAEnD,OAASC,EAAP,CACA,KAAK,QAAQ,GAAG,KAAK,6BAA6BA,IAAQ,CAC5D,CACF,CAEA,QAAyB,CACvB,OAAOC,4BAA+BC,EAAU,KAAK,GAAG,SAC1D,CACF,EAlDMC,EAAA,CADHC,EAAS,GAVSZ,EAWf,oBAcsBW,EAAA,CAAzBE,EAAM,SAAS,GAzBGb,EAyBO,sBAKCW,EAAA,CAA1BE,EAAM,UAAU,GA9BEb,EA8BQ,uBAEVW,EAAA,CAAhBG,EAAM,GAhCYd,EAgCF,mBAhCEA,EAArBW,EAAA,CADCC,EAAc,SAAS,GACHZ",
   "names": ["UnsafeHTMLDirective", "Directive", "constructor", "partInfo", "super", "this", "_value", "nothing", "type", "PartType", "CHILD", "Error", "directiveName", "render", "value", "_templateResult", "noChange", "strings", "raw", "_$litType$", "resultType", "values", "unsafeHTML", "directive", "UnsafeSVGDirective", "UnsafeHTMLDirective", "directiveName", "resultType", "unsafeSVG", "directive", "iconPath", "setIconPath", "path", "getIconPath", "modulePath", "styles", "i", "bl_icon_default", "requestMap", "BlIcon", "s", "bl_icon_default", "value", "fileUrl", "getIconPath", "iconRequest", "res", "error", "y", "o", "__decorateClass", "e", "event", "t"]
 }

package/dist/chunk-4PG6AOX7.js

@@ -0,0 +1,5 @@
+import{a as m,b as u,c as g,d as f,e as w,f as y,g as E,h as x}from"./chunk-ANYJUR6Q.js";import{a as b}from"./chunk-OLPYXE2P.js";import{a as n}from"./chunk-23UFIOHV.js";import{a as d,b as h,f as v,g as c,h as i,i as s,j as a}from"./chunk-57PTZNIL.js";import{a as r}from"./chunk-NZ3RGSR6.js";var O=d`.popover{--arrow-display:var(--bl-popover-arrow-display,none);--background-color:var(--bl-popover-background-color,var(--bl-color-neutral-full));--border-color:var(--bl-popover-border-color,var(--bl-color-primary-highlight));--padding:var(--bl-popover-padding,var(--bl-size-m));--border-radius:var(--bl-popover-border-radius,var(--bl-size-3xs));--position:var(--bl-popover-position,fixed);position:var(--position);box-sizing:border-box;border:1px solid var(--border-color);padding:var(--padding);border-radius:var(--border-radius);z-index:var(--bl-index-popover);width:max-content;hyphens:auto;background-color:var(--background-color);font:var(--bl-font-title-3-regular);color:var(--bl-color-neutral-darker)}.popover:not(.visible){visibility:hidden}.arrow{--arrow-rotation:45deg;box-sizing:border-box;display:var(--arrow-display);position:absolute;background-color:var(--background-color);width:var(--bl-size-2xs);height:var(--bl-size-2xs);transform:rotate(var(--arrow-rotation));border:1px solid var(--border-color);border-bottom:0;border-right:0}`,_=O;var t=class extends v{constructor(){super(...arguments);this.placement="bottom";this.fitSize=!1;this.offset=8;this._visible=!1;this._handleClickOutside=e=>{let o=e.composedPath();!o.includes(this._target)&&!o.includes(this)&&this.hide()}}static get styles(){return[_]}connectedCallback(){super.connectedCallback(),this._handlePopoverShowEvent=this._handlePopoverShowEvent.bind(this),this._handleKeyupEvent=this._handleKeyupEvent.bind(this),this._handleClickOutside=this._handleClickOutside.bind(this)}disconnectedCallback(){super.disconnectedCallback(),this.popoverAutoUpdateCleanup&&this.popoverAutoUpdateCleanup()}getMiddleware(){let e=[];return e.push(f(this.offset),g(),u(),w({padding:4})),this.fitSize&&e.push(y({apply(o){o.elements.floating&&o.elements.reference&&Object.assign(o.elements.floating.style,{"min-width":`${o.elements.reference.getBoundingClientRect().width}px`})}})),e.push(m({element:this.arrow,padding:5})),e}setPopover(){this.target&&(this.popoverAutoUpdateCleanup=E(this.target,this.popover,()=>{x(this.target,this.popover,{placement:this.placement,strategy:"fixed",middleware:this.getMiddleware()}).then(({x:e,y:o,placement:k,middlewareData:l})=>{if(Object.assign(this.popover.style,{left:`${e}px`,top:`${o}px`}),l.arrow){let{x:C,y:M}=l.arrow;Object.assign(this.arrow.style,{left:`${C}px`,top:`${M}px`});let S={top:"bottom",right:"left",bottom:"top",left:"right"},L={top:"225deg",right:"315deg",bottom:"45deg",left:"135deg"},p=k.split("-")[0],z=S[p];this.arrow.style.setProperty(z,"-5px"),this.arrow.style.setProperty("--arrow-rotation",L[p])}})}))}get target(){return this._target}set target(e){typeof e=="string"?this._target=document.getElementById(e):e instanceof Element?this._target=e:console.warn("BlPopover target only accepts an Element instance or a string id of a DOM element.")}show(){this._visible=!0,this.setPopover(),this.onBlPopoverShow(""),document.addEventListener("click",this._handleClickOutside),document.addEventListener("keyup",this._handleKeyupEvent),document.addEventListener("bl-popover-show",this._handlePopoverShowEvent)}hide(){this._visible=!1,document.removeEventListener("click",this._handleClickOutside),document.removeEventListener("keyup",this._handleKeyupEvent),document.removeEventListener("bl-popover-show",this._handlePopoverShowEvent),this.onBlPopoverHide("")}get visible(){return this._visible}_handlePopoverShowEvent(e){e.target!==this&&this.hide()}_handleKeyupEvent(e){e.key==="Escape"&&this.visible&&(this.hide(),e.preventDefault())}render(){let e=b({popover:!0,visible:this._visible});return h`<div class=${e}>
+      <slot id="popover" aria-live=${this._visible?"polite":"off"}></slot>
+      <div class="arrow" aria-hidden="true"></div>
+    </div>`}};r([a(".popover")],t.prototype,"popover",2),r([a(".arrow")],t.prototype,"arrow",2),r([i({type:String})],t.prototype,"placement",2),r([s()],t.prototype,"_target",2),r([i({type:Boolean,attribute:"fit-size"})],t.prototype,"fitSize",2),r([i({type:Number})],t.prototype,"offset",2),r([s()],t.prototype,"_visible",2),r([n("bl-popover-show")],t.prototype,"onBlPopoverShow",2),r([n("bl-popover-hide")],t.prototype,"onBlPopoverHide",2),r([i()],t.prototype,"target",1),t=r([c("bl-popover")],t);export{t as a};
+//# sourceMappingURL=chunk-4PG6AOX7.js.map

package/dist/chunk-4PG6AOX7.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/popover/bl-popover.css", "../src/components/popover/bl-popover.ts"],
+  "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`.popover{--arrow-display:var(--bl-popover-arrow-display,none);--background-color:var(--bl-popover-background-color,var(--bl-color-neutral-full));--border-color:var(--bl-popover-border-color,var(--bl-color-primary-highlight));--padding:var(--bl-popover-padding,var(--bl-size-m));--border-radius:var(--bl-popover-border-radius,var(--bl-size-3xs));--position:var(--bl-popover-position,fixed);position:var(--position);box-sizing:border-box;border:1px solid var(--border-color);padding:var(--padding);border-radius:var(--border-radius);z-index:var(--bl-index-popover);width:max-content;hyphens:auto;background-color:var(--background-color);font:var(--bl-font-title-3-regular);color:var(--bl-color-neutral-darker)}.popover:not(.visible){visibility:hidden}.arrow{--arrow-rotation:45deg;box-sizing:border-box;display:var(--arrow-display);position:absolute;background-color:var(--background-color);width:var(--bl-size-2xs);height:var(--bl-size-2xs);transform:rotate(var(--arrow-rotation));border:1px solid var(--border-color);border-bottom:0;border-right:0}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport {\n  computePosition,\n  flip,\n  shift,\n  offset,\n  arrow,\n  inline,\n  autoUpdate,\n  size,\n  Middleware,\n  MiddlewareState,\n} from '@floating-ui/dom';\nimport { classMap } from 'lit/directives/class-map.js';\nimport style from './bl-popover.css';\nimport { event, EventDispatcher } from '../../utilities/event';\n\nexport type Placement =\n  | 'top-start'\n  | 'top'\n  | 'top-end'\n  | 'bottom-start'\n  | 'bottom'\n  | 'bottom-end'\n  | 'left-start'\n  | 'left'\n  | 'left-end'\n  | 'right-start'\n  | 'right'\n  | 'right-end';\n\n/**\n * @tag bl-popover\n * @summary Baklava Popover component\n *\n * @cssproperty [--bl-popover-arrow-display=none] - Sets the display of popovers arrow. Set as `block` to make arrow visible.\n * @cssproperty [--bl-popover-background-color=--bl-color-neutral-full] - Sets the background color of popover.\n * @cssproperty [--bl-popover-border-color=--bl-color-primary-highlight] - Sets the border color of popover.\n * @cssproperty [--bl-popover-padding=--bl-size-m] - Sets the padding of popover.\n * @cssproperty [--bl-popover-border-radius=--bl-size-3xs] - Sets the border radius of popover.\n * @cssproperty [--bl-popover-position=fixed] - Sets the position of popover. You can set it to `absolute` if parent element is a fixed positioned element like drawer or dialog.\n */\n@customElement('bl-popover')\nexport default class BlPopover extends LitElement {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n\n  @query('.popover') private popover: HTMLElement;\n  @query('.arrow') private arrow: HTMLElement;\n\n  /**\n   * Sets placement of the popover\n   */\n  @property({ type: String })\n  placement: Placement = 'bottom';\n\n  /**\n   * Target elements state\n   */\n  @state() _target: string | Element;\n\n  /**\n   * Sets size of popover same as trigger element\n   */\n  @property({ type: Boolean, attribute: 'fit-size' })\n  fitSize = false;\n\n  /**\n   * Sets the distance between popover and target/trigger element\n   */\n  @property({ type: Number })\n  offset = 8;\n\n  /**\n   * Visibility state\n   */\n  @state() private _visible = false;\n\n  /**\n   * Fires when the popover is shown\n   */\n  @event('bl-popover-show') private onBlPopoverShow: EventDispatcher<string>;\n\n  /**\n   * Fires when popover becomes hidden\n   */\n  @event('bl-popover-hide') private onBlPopoverHide: EventDispatcher<string>;\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    this._handlePopoverShowEvent = this._handlePopoverShowEvent.bind(this);\n    this._handleKeyupEvent = this._handleKeyupEvent.bind(this);\n    this._handleClickOutside = this._handleClickOutside.bind(this);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.popoverAutoUpdateCleanup && this.popoverAutoUpdateCleanup();\n  }\n\n  private getMiddleware(): Middleware[] {\n    const middlewareParams: Middleware[] = [];\n    middlewareParams.push(offset(this.offset), inline(), flip(), shift({ padding: 4 }));\n\n    if (this.fitSize) {\n      middlewareParams.push(\n        size({\n          apply(args: MiddlewareState) {\n            if (args.elements.floating && args.elements.reference) {\n              Object.assign(args.elements.floating.style, {\n                'min-width': `${args.elements.reference.getBoundingClientRect().width}px`,\n              });\n            }\n          },\n        })\n      );\n    }\n\n    middlewareParams.push(arrow({ element: this.arrow, padding: 5 }));\n\n    return middlewareParams;\n  }\n\n  private _handleClickOutside = (event: MouseEvent) => {\n    const eventPath = event.composedPath() as HTMLElement[];\n    if (!eventPath.includes(this._target as HTMLElement) && !eventPath.includes(this)) {\n      this.hide();\n    }\n  };\n\n  private popoverAutoUpdateCleanup: () => void;\n\n  private setPopover() {\n    if (this.target) {\n      this.popoverAutoUpdateCleanup = autoUpdate(this.target as Element, this.popover, () => {\n        computePosition(this.target as Element, this.popover, {\n          placement: this.placement,\n          strategy: 'fixed',\n          middleware: this.getMiddleware(),\n        }).then(({ x, y, placement, middlewareData }) => {\n          Object.assign(this.popover.style, {\n            left: `${x}px`,\n            top: `${y}px`,\n          });\n\n          if (middlewareData.arrow) {\n            const { x: arrowX, y: arrowY } = middlewareData.arrow;\n\n            Object.assign(this.arrow.style, {\n              left: `${arrowX}px`,\n              top: `${arrowY}px`,\n            });\n\n            const arrowFlipDirections = {\n              top: 'bottom',\n              right: 'left',\n              bottom: 'top',\n              left: 'right',\n            };\n            const arrowRotateDegrees = {\n              top: '225deg',\n              right: '315deg',\n              bottom: '45deg',\n              left: '135deg',\n            };\n            const popoverPlacement = placement.split('-')[0] as keyof typeof arrowFlipDirections;\n            const arrowDirection = arrowFlipDirections[popoverPlacement];\n\n            this.arrow.style.setProperty(arrowDirection, '-5px');\n            this.arrow.style.setProperty('--arrow-rotation', arrowRotateDegrees[popoverPlacement]);\n          }\n        });\n      });\n    }\n  }\n\n  /**\n   * Sets the target element of the popover to align and trigger.\n   * It can be a string id of the target element or can be a direct Element reference of it.\n   */\n  @property()\n  get target(): string | Element {\n    return this._target;\n  }\n\n  set target(value: string | Element) {\n    if (typeof value === 'string') {\n      this._target = document.getElementById(value) as Element;\n    } else if (value instanceof Element) {\n      this._target = value;\n    } else {\n      console.warn(\n        'BlPopover target only accepts an Element instance or a string id of a DOM element.'\n      );\n    }\n  }\n\n  /**\n   * Shows popover\n   */\n  show() {\n    this._visible = true;\n    this.setPopover();\n    this.onBlPopoverShow('');\n    document.addEventListener('click', this._handleClickOutside);\n    document.addEventListener('keyup', this._handleKeyupEvent);\n    document.addEventListener('bl-popover-show', this._handlePopoverShowEvent);\n  }\n\n  /**\n   * Hides popover\n   */\n  hide() {\n    this._visible = false;\n    document.removeEventListener('click', this._handleClickOutside);\n    document.removeEventListener('keyup', this._handleKeyupEvent);\n    document.removeEventListener('bl-popover-show', this._handlePopoverShowEvent);\n    this.onBlPopoverHide('');\n  }\n\n  /**\n   * Gives the visibility status of the popover\n   */\n  get visible(): boolean {\n    return this._visible;\n  }\n\n  private _handlePopoverShowEvent(event: Event) {\n    if (event.target !== this) {\n      this.hide();\n    }\n  }\n\n  private _handleKeyupEvent(event: KeyboardEvent) {\n    if (event.key === 'Escape' && this.visible) {\n      this.hide();\n      event.preventDefault();\n    }\n  }\n\n  render(): TemplateResult {\n    const classes = classMap({\n      popover: true,\n      visible: this._visible,\n    });\n\n    return html`<div class=${classes}>\n      <slot id=\"popover\" aria-live=${this._visible ? 'polite' : 'off'}></slot>\n      <div class=\"arrow\" aria-hidden=\"true\"></div>\n    </div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bl-popover': BlPopover;\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["styles", "i", "bl_popover_default", "BlPopover", "s", "event", "eventPath", "bl_popover_default", "middlewareParams", "O", "T", "b", "D", "k", "args", "u", "P", "z", "x", "y", "placement", "middlewareData", "arrowX", "arrowY", "arrowFlipDirections", "arrowRotateDegrees", "popoverPlacement", "arrowDirection", "value", "classes", "o", "__decorateClass", "i", "e", "t"]
+}

package/dist/chunk-5AIFOXPM.js

@@ -0,0 +1,24 @@
+import{a as v}from"./chunk-EPJ347EQ.js";import{a as d}from"./chunk-DJOD4BTL.js";import{a as f}from"./chunk-KPAWUBRO.js";import{a as o}from"./chunk-23UFIOHV.js";import{a as n,b as a,f as s,g as c,h as l,j as m}from"./chunk-57PTZNIL.js";import{a as t}from"./chunk-NZ3RGSR6.js";var E=n`:host{display:inline-block;vertical-align:middle}:host *{outline:0}label{display:flex;gap:var(--bl-size-2xs);color:var(--bl-color-neutral-darker);font:var(--bl-font-title-3);cursor:pointer;user-select:none}.label{word-break:break-all}input{appearance:none;position:absolute}.check-mark{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--bl-size-m);height:var(--bl-size-m);min-width:var(--bl-size-m);min-height:var(--bl-size-m);max-width:var(--bl-size-m);max-height:var(--bl-size-m);border:1px solid var(--bl-color-neutral-lighter);border-radius:var(--bl-border-radius-xs);color:var(--bl-color-neutral-full);font-size:var(--bl-font-size-2xs);background-color:var(--bl-color-neutral-full)}:host([checked]) .label,:host(:hover) .label,:host(.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__) .label{color:var(--bl-color-primary)}:host(:is([checked],[indeterminate])) .check-mark{background-color:var(--bl-color-primary);border:0}:host([disabled]){cursor:not-allowed;pointer-events:none}:host([disabled]) .check-mark,:host([disabled]) .label{color:var(--bl-color-neutral-light)}:host([disabled]) .check-mark{background-color:var(--bl-color-neutral-lightest)}:host(:not([disabled])) input:focus-visible+.check-mark{box-shadow:0 0 0 1px white,0 0 0 3px var(--bl-color-primary)}`,g=E;var O=n`:host{display:flex;flex-direction:row}fieldset{border:0;padding:0}legend{font:var(--bl-font-title-3-medium);color:var(--bl-color-neutral-darker)}.options{display:flex;flex-flow:var(--bl-checkbox-direction,column) wrap;gap:var(--bl-size-m);margin-block:var(--bl-size-xs)}`,k=O;var u="bl-checkbox-group",p="bl-checkbox-group-change",r=class extends d(s){constructor(){super(...arguments);this.value=[];this.required=!1;this.focusedOptionIndex=0}static get styles(){return[k]}get options(){return[].slice.call(this.querySelectorAll(h))}get checkedOptions(){return this.options.filter(e=>e.checked).map(e=>e.value)}get availableOptions(){return this.options.filter(e=>!e.disabled)}connectedCallback(){super.connectedCallback(),this.tabIndex=0,this.addEventListener("focus",this.handleFocus),this.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("focus",this.handleFocus),this.removeEventListener("keydown",this.handleKeyDown)}updated(e){e.has("value")&&(this.setValue(this.checkedOptions.join(",")),this.onChange(this.value))}handleOptionChecked(){this.value=this.checkedOptions}handleKeyDown(e){if(["ArrowDown","ArrowRight"].includes(e.key))this.focusedOptionIndex++;else if(["ArrowUp","ArrowLeft"].includes(e.key))this.focusedOptionIndex--;else if(e.key==="Tab"){if(e.shiftKey?this.focusedOptionIndex--:this.focusedOptionIndex++,this.focusedOptionIndex===this.availableOptions.length){this.tabIndex=0,this.focusedOptionIndex=0;return}}else return;this.focusedOptionIndex=Math.max(0,Math.min(this.focusedOptionIndex,this.availableOptions.length-1)),this.availableOptions[this.focusedOptionIndex].focus(),e.preventDefault()}handleFocus(){this.availableOptions[this.focusedOptionIndex].focus()}render(){return a`<fieldset role="group" aria-labelledby="label" aria-required=${this.required}>
+      <legend id="label">${this.label}</legend>
+      <div class="options" @bl-checkbox-change=${this.handleOptionChecked}>
+        <slot></slot>
+      </div>
+    </fieldset>`}};t([l({type:String})],r.prototype,"label",2),t([l({type:Array,reflect:!0})],r.prototype,"value",2),t([l({type:Boolean,reflect:!0})],r.prototype,"required",2),t([o("bl-checkbox-group-change")],r.prototype,"onChange",2),r=t([c(u)],r);var h="bl-checkbox",i=class extends d(s){constructor(){super(...arguments);this.checked=!1;this.required=!1;this.disabled=!1;this.indeterminate=!1;this.handleFieldValueChange=e=>{this.checked=e.detail.includes(this.value)}}static get styles(){return[g]}connectedCallback(){var e;super.connectedCallback(),this.field=this.closest(u),(e=this.field)==null||e.addEventListener(p,this.handleFieldValueChange)}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this.field)==null||e.removeEventListener(p,this.handleFieldValueChange)}updated(e){e.has("checked")&&this.required&&this.checked&&this.setValue(this.value)}update(e){super.update(e),this.indeterminate&&this.checked&&(this.checked=!1,this.requestUpdate("checked",!0))}focus(){this.checkboxElement.tabIndex=0,this.checkboxElement.focus(),this.onFocus(this.value)}blur(){this.onBlur(this.value),this.field&&(this.checkboxElement.tabIndex=-1)}handleChange(e){let b=e.target;this.checked=b.checked,this.onChange(b.checked),this.indeterminate=!1}render(){let e="";return this.checked&&(e="check"),this.indeterminate&&(e="minus"),a`
+      <label>
+        <input
+          type="checkbox"
+          .checked=${v(this.checked)}
+          ?disabled=${this.disabled}
+          aria-required=${this.required}
+          aria-labelledby="label"
+          aria-readonly=${this.disabled}
+          .indeterminate=${this.indeterminate}
+          @change=${this.handleChange}
+          value=${f(this.value)}
+          @blur=${this.blur}
+        />
+        <div class="check-mark">${e?a`<bl-icon name="${e}"></bl-icon>`:null}</div>
+        <span class="label"><slot></slot></span>
+      </label>
+    `}};i.shadowRootOptions={...s.shadowRootOptions,delegatesFocus:!0},t([l({type:Boolean,reflect:!0})],i.prototype,"checked",2),t([l()],i.prototype,"value",2),t([l({type:Boolean,reflect:!0})],i.prototype,"required",2),t([l({type:Boolean,reflect:!0})],i.prototype,"disabled",2),t([l({type:Boolean,reflect:!0})],i.prototype,"indeterminate",2),t([o("bl-checkbox-change")],i.prototype,"onChange",2),t([o("bl-focus")],i.prototype,"onFocus",2),t([o("bl-blur")],i.prototype,"onBlur",2),t([m("[type=checkbox]")],i.prototype,"checkboxElement",2),i=t([c(h)],i);export{h as a,i as b,u as c,p as d,r as e};
+//# sourceMappingURL=chunk-5AIFOXPM.js.map

package/dist/chunk-5AIFOXPM.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/checkbox-group/checkbox/bl-checkbox.css", "../src/components/checkbox-group/bl-checkbox-group.css", "../src/components/checkbox-group/bl-checkbox-group.ts", "../src/components/checkbox-group/checkbox/bl-checkbox.ts"],
+  "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{display:inline-block;vertical-align:middle}:host *{outline:0}label{display:flex;gap:var(--bl-size-2xs);color:var(--bl-color-neutral-darker);font:var(--bl-font-title-3);cursor:pointer;user-select:none}.label{word-break:break-all}input{appearance:none;position:absolute}.check-mark{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--bl-size-m);height:var(--bl-size-m);min-width:var(--bl-size-m);min-height:var(--bl-size-m);max-width:var(--bl-size-m);max-height:var(--bl-size-m);border:1px solid var(--bl-color-neutral-lighter);border-radius:var(--bl-border-radius-xs);color:var(--bl-color-neutral-full);font-size:var(--bl-font-size-2xs);background-color:var(--bl-color-neutral-full)}:host([checked]) .label,:host(:hover) .label,:host(.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__) .label{color:var(--bl-color-primary)}:host(:is([checked],[indeterminate])) .check-mark{background-color:var(--bl-color-primary);border:0}:host([disabled]){cursor:not-allowed;pointer-events:none}:host([disabled]) .check-mark,:host([disabled]) .label{color:var(--bl-color-neutral-light)}:host([disabled]) .check-mark{background-color:var(--bl-color-neutral-lightest)}:host(:not([disabled])) input:focus-visible+.check-mark{box-shadow:0 0 0 1px white,0 0 0 3px var(--bl-color-primary)}`;\nexport default styles;\n", "import {css} from 'lit';\nexport const styles = css`:host{display:flex;flex-direction:row}fieldset{border:0;padding:0}legend{font:var(--bl-font-title-3-medium);color:var(--bl-color-neutral-darker)}.options{display:flex;flex-flow:var(--bl-checkbox-direction,column) wrap;gap:var(--bl-size-m);margin-block:var(--bl-size-xs)}`;\nexport default styles;\n", "import { FormControlMixin } from '@open-wc/form-control';\nimport { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport 'element-internals-polyfill';\nimport { event, EventDispatcher } from '../../utilities/event';\nimport style from './bl-checkbox-group.css';\nimport BlCheckbox, { blCheckboxTag } from './checkbox/bl-checkbox';\n\nexport const blCheckboxGroupTag = 'bl-checkbox-group';\n\nexport const blChangeEventName = 'bl-checkbox-group-change';\n\n/**\n * @tag bl-checkbox-group\n * @summary Baklava Button component\n *\n * @cssproperty [--bl-checkbox-direction=row] Can be used for showing checkbox options as columns instead of rows. Options are `row` or `column`\n */\n@customElement(blCheckboxGroupTag)\nexport default class BlCheckboxGroup extends FormControlMixin(LitElement) {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n\n  /**\n   * Sets the checkbox group label\n   */\n  @property({ type: String })\n  label: string;\n\n  /**\n   * Set and gets the actual value of the field\n   */\n  @property({ type: Array, reflect: true })\n  value: string[] = [];\n\n  /**\n   * Sets option as required\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  get options(): BlCheckbox[] {\n    return [].slice.call(this.querySelectorAll(blCheckboxTag));\n  }\n\n  get checkedOptions(): string[] {\n    return this.options.filter(opt => opt.checked).map(opt => opt.value);\n  }\n\n  get availableOptions(): BlCheckbox[] {\n    return this.options.filter(option => !option.disabled);\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n\n    this.tabIndex = 0;\n    this.addEventListener('focus', this.handleFocus);\n    this.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener('focus', this.handleFocus);\n    this.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  updated(changedProperties: Map<string, unknown>): void {\n    if (changedProperties.has('value')) {\n      this.setValue(this.checkedOptions.join(','));\n      this.onChange(this.value);\n    }\n  }\n\n  /**\n   * Fires when checkbox group value changed\n   */\n  @event('bl-checkbox-group-change') private onChange: EventDispatcher<string[]>;\n\n  private focusedOptionIndex = 0;\n\n  private handleOptionChecked() {\n    this.value = this.checkedOptions;\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    // Next option\n    if (['ArrowDown', 'ArrowRight'].includes(event.key)) {\n      this.focusedOptionIndex++;\n\n      // Previous option\n    } else if (['ArrowUp', 'ArrowLeft'].includes(event.key)) {\n      this.focusedOptionIndex--;\n\n      // next or previous option with tab / hold shift & tab\n    } else if (event.key === 'Tab') {\n      event.shiftKey ? this.focusedOptionIndex-- : this.focusedOptionIndex++;\n\n      if (this.focusedOptionIndex === this.availableOptions.length) {\n        this.tabIndex = 0;\n        this.focusedOptionIndex = 0;\n        return;\n      }\n    } else {\n      // Other keys are not our interest here\n      return;\n    }\n\n    // Don't exceed array indexes\n    this.focusedOptionIndex = Math.max(\n      0,\n      Math.min(this.focusedOptionIndex, this.availableOptions.length - 1)\n    );\n\n    this.availableOptions[this.focusedOptionIndex].focus();\n\n    event.preventDefault();\n  }\n\n  private handleFocus() {\n    this.availableOptions[this.focusedOptionIndex].focus();\n  }\n\n  render(): TemplateResult {\n    return html`<fieldset role=\"group\" aria-labelledby=\"label\" aria-required=${this.required}>\n      <legend id=\"label\">${this.label}</legend>\n      <div class=\"options\" @bl-checkbox-change=${this.handleOptionChecked}>\n        <slot></slot>\n      </div>\n    </fieldset>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    [blCheckboxGroupTag]: BlCheckboxGroup;\n  }\n  interface HTMLElementEventMap {\n    [blChangeEventName]: CustomEvent<string[]>;\n  }\n}\n", "import { FormControlMixin } from '@open-wc/form-control';\nimport { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { live } from 'lit/directives/live.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport 'element-internals-polyfill';\nimport { event, EventDispatcher } from '../../../utilities/event';\nimport '../../icon/bl-icon';\nimport type BlCheckboxGroup from '../bl-checkbox-group';\nimport style from './bl-checkbox.css';\nimport { blCheckboxGroupTag, blChangeEventName } from '../bl-checkbox-group';\n\nexport const blCheckboxTag = 'bl-checkbox';\n\n/**\n * @tag bl-checkbox\n * @summary Baklava Checkbox component\n */\n@customElement(blCheckboxTag)\nexport default class BlCheckbox extends FormControlMixin(LitElement) {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n  static shadowRootOptions = {...LitElement.shadowRootOptions, delegatesFocus: true};\n\n  /**\n   * Sets the checked state for checkbox\n   */\n  @property({ type: Boolean, reflect: true })\n  checked = false;\n\n  /**\n   * Sets the checkbox value\n   */\n  @property()\n  value: string;\n\n  /**\n   * Sets checkbox as required\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * Sets the disabled state for checkbox\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Sets the indeterminate state for checkbox\n   */\n  @property({ type: Boolean, reflect: true })\n  indeterminate = false;\n\n  /**\n   * Fires whenever user change the value of the checkbox.\n   */\n  @event('bl-checkbox-change') private onChange: EventDispatcher<boolean>;\n\n  /**\n   * Fires when checkbox is focused\n   */\n  @event('bl-focus') private onFocus: EventDispatcher<string>;\n\n  /**\n   * Fires when checkbox is blurred\n   */\n  @event('bl-blur') private onBlur: EventDispatcher<string>;\n\n  @query('[type=checkbox]') checkboxElement: HTMLElement;\n\n  protected field: BlCheckboxGroup | null;\n\n  connectedCallback(): void {\n    super.connectedCallback();\n\n    this.field = this.closest<BlCheckboxGroup>(blCheckboxGroupTag);\n    this.field?.addEventListener(blChangeEventName, this.handleFieldValueChange);\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.field?.removeEventListener(blChangeEventName, this.handleFieldValueChange);\n  }\n\n  updated(changedProperties: Map<string, unknown>): void {\n    if (changedProperties.has('checked') && this.required && this.checked) {\n      this.setValue(this.value);\n    }\n  }\n\n  update(changedProperties: Map<string, unknown>) {\n    super.update(changedProperties);\n    if (this.indeterminate && this.checked) {\n      this.checked = false;\n      this.requestUpdate('checked', true);\n    }\n  }\n\n  /**\n   * Focuses this option\n   */\n  focus() {\n    this.checkboxElement.tabIndex = 0;\n    this.checkboxElement.focus();\n    this.onFocus(this.value);\n  }\n\n  /**\n   * Blurs from this option\n   */\n  blur() {\n    this.onBlur(this.value);\n    if (!this.field) return;\n    this.checkboxElement.tabIndex = -1;\n  }\n\n  private handleChange(event: CustomEvent) {\n    const target = event.target as HTMLInputElement;\n    this.checked = target.checked;\n    this.onChange(target.checked);\n    this.indeterminate = false;\n  }\n\n  private handleFieldValueChange = (event: CustomEvent<Array<string>>) => {\n    this.checked = event.detail.includes(this.value);\n  };\n\n  render(): TemplateResult {\n    let icon = '';\n    if (this.checked) icon = 'check';\n    if (this.indeterminate) icon = 'minus';\n\n    return html`\n      <label>\n        <input\n          type=\"checkbox\"\n          .checked=${live(this.checked)}\n          ?disabled=${this.disabled}\n          aria-required=${this.required}\n          aria-labelledby=\"label\"\n          aria-readonly=${this.disabled}\n          .indeterminate=${this.indeterminate}\n          @change=${this.handleChange}\n          value=${ifDefined(this.value)}\n          @blur=${this.blur}\n        />\n        <div class=\"check-mark\">${icon ? html`<bl-icon name=\"${icon}\"></bl-icon>` : null}</div>\n        <span class=\"label\"><slot></slot></span>\n      </label>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    [blCheckboxTag]: BlCheckbox;\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["styles", "i", "bl_checkbox_default", "styles", "i", "bl_checkbox_group_default", "blCheckboxGroupTag", "blChangeEventName", "BlCheckboxGroup", "FormControlMixin", "bl_checkbox_group_default", "blCheckboxTag", "opt", "option", "changedProperties", "event", "y", "__decorateClass", "e", "blCheckboxTag", "BlCheckbox", "FormControlMixin", "event", "bl_checkbox_default", "_a", "blCheckboxGroupTag", "blChangeEventName", "changedProperties", "target", "icon", "y", "l", "__decorateClass", "e", "i"]
+}

package/dist/chunk-5JHQZCHW.js

@@ -0,0 +1,5 @@
+import{a as o,b as i,f as a,g as l,h as r}from"./chunk-57PTZNIL.js";import{a as t}from"./chunk-NZ3RGSR6.js";var c=o`:host{display:inline-block;max-width:100%}.badge{--bg-color:var(--bl-badge-bg-color,var(--bl-color-primary-contrast));--color:var(--bl-badge-color,var(--bl-color-primary));--font:var(--bl-font-title-4-medium);--padding-vertical:var(--bl-size-4xs);--padding-horizontal:var(--bl-size-3xs);--margin-icon:var(--bl-size-3xs);--icon-size:var(--bl-size-s);--height:var(--bl-size-xl);display:flex;gap:var(--margin-icon);justify-content:center;align-items:center;box-sizing:border-box;width:100%;border:0;border-radius:var(--bl-size-4xs);margin:0;padding:var(--padding-vertical) var(--padding-horizontal);background-color:var(--bg-color);color:var(--color,white);font:var(--font);font-kerning:none;height:var(--height)}:host([size='small']) .badge{--font:var(--bl-font-caption);--height:var(--bl-size-m)}:host([size='large']) .badge{--font:var(--bl-font-title-3-medium);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-2xs);--height:var(--bl-size-2xl);--icon-size:var(--bl-size-m)}:host ::slotted(bl-icon){font-size:var(--icon-size)}:host([size='small']) bl-icon{display:none}`,s=c;var e=class extends a{constructor(){super(...arguments);this.size="medium"}static get styles(){return[s]}render(){let n=this.icon?i`<bl-icon name=${this.icon}></bl-icon>`:"";return i`<span class="badge">
+      <slot name="icon">${n}</slot>
+      <slot></slot>
+    </span>`}};t([r({type:String,reflect:!0})],e.prototype,"size",2),t([r({type:String})],e.prototype,"icon",2),e=t([l("bl-badge")],e);export{e as a};
+//# sourceMappingURL=chunk-5JHQZCHW.js.map

package/dist/chunk-5JHQZCHW.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/badge/bl-badge.css", "../src/components/badge/bl-badge.ts"],
+  "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{display:inline-block;max-width:100%}.badge{--bg-color:var(--bl-badge-bg-color,var(--bl-color-primary-contrast));--color:var(--bl-badge-color,var(--bl-color-primary));--font:var(--bl-font-title-4-medium);--padding-vertical:var(--bl-size-4xs);--padding-horizontal:var(--bl-size-3xs);--margin-icon:var(--bl-size-3xs);--icon-size:var(--bl-size-s);--height:var(--bl-size-xl);display:flex;gap:var(--margin-icon);justify-content:center;align-items:center;box-sizing:border-box;width:100%;border:0;border-radius:var(--bl-size-4xs);margin:0;padding:var(--padding-vertical) var(--padding-horizontal);background-color:var(--bg-color);color:var(--color,white);font:var(--font);font-kerning:none;height:var(--height)}:host([size='small']) .badge{--font:var(--bl-font-caption);--height:var(--bl-size-m)}:host([size='large']) .badge{--font:var(--bl-font-title-3-medium);--padding-vertical:var(--bl-size-2xs);--padding-horizontal:var(--bl-size-2xs);--height:var(--bl-size-2xl);--icon-size:var(--bl-size-m)}:host ::slotted(bl-icon){font-size:var(--icon-size)}:host([size='small']) bl-icon{display:none}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport style from './bl-badge.css';\nimport '../icon/bl-icon';\n\nexport type BadgeSize = 'small' | 'medium' | 'large';\n\n/**\n * @tag bl-badge\n * @summary Baklava Badge component\n *\n * @cssproperty [--bl-badge-bg-color=--bl-color-primary-contrast] Sets the background color of badge\n * @cssproperty [--bl-badge-color=--bl-color-primary] Sets the color of badge\n */\n\n@customElement('bl-badge')\nexport default class BlBadge extends LitElement {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n\n  /**\n   * Sets the badge size\n   */\n  @property({ type: String, reflect: true })\n  size: BadgeSize = 'medium';\n\n  /**\n   * Sets the name of the icon\n   */\n  @property({ type: String })\n  icon?: string;\n\n  render(): TemplateResult {\n    const icon = this.icon ? html`<bl-icon name=${this.icon}></bl-icon>` : '';\n\n    return html`<span class=\"badge\">\n      <slot name=\"icon\">${icon}</slot>\n      <slot></slot>\n    </span>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bl-badge': BlBadge;\n  }\n}\n"],
+  "mappings": "4GACO,IAAMA,EAASC,ukCACfC,EAAQF,ECcf,IAAqBG,EAArB,cAAqCC,CAAW,CAAhD,kCASE,UAAkB,SARlB,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CAcA,QAAyB,CACvB,IAAMC,EAAO,KAAK,KAAOC,kBAAqB,KAAK,kBAAoB,GAEvE,OAAOA;AAAA,0BACeD;AAAA;AAAA,YAGxB,CACF,EAhBEE,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GARtBN,EASnB,oBAMAK,EAAA,CADCC,EAAS,CAAE,KAAM,MAAO,CAAC,GAdPN,EAenB,oBAfmBA,EAArBK,EAAA,CADCC,EAAc,UAAU,GACJN",
+  "names": ["styles", "i", "bl_badge_default", "BlBadge", "s", "bl_badge_default", "icon", "y", "__decorateClass", "e"]
+}

package/dist/chunk-6FK4ZU5B.js

@@ -0,0 +1,2 @@
+import{a as l,b as o,f as a,g as s,h as i,i as d}from"./chunk-57PTZNIL.js";import{a as r}from"./chunk-NZ3RGSR6.js";var u=l`div{padding:var(--bl-size-xl);background-color:var(--bl-color-neutral-full);border-radius:0 0 var(--bl-border-radius-m) var(--bl-border-radius-m)}div[hidden]{display:none}`,p=u;var t=class extends a{constructor(){super(...arguments);this.hidden=!0}static get styles(){return[p]}connectedCallback(){super.connectedCallback(),this.updateComplete.then(()=>{var e;this.tabGroup=this.closest("bl-tab-group"),(e=this.tabGroup)==null||e.registerTabPanel(this)})}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this.tabGroup)==null||e.unregisterTabPanel(this)}render(){return o`<div ?hidden=${this.hidden}><slot></slot></div>`}};r([d()],t.prototype,"hidden",2),r([i({type:String,reflect:!0})],t.prototype,"tab",2),t=r([s("bl-tab-panel")],t);export{t as a};
+//# sourceMappingURL=chunk-6FK4ZU5B.js.map

package/dist/chunk-6FK4ZU5B.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/tab-group/tab-panel/bl-tab-panel.css", "../src/components/tab-group/tab-panel/bl-tab-panel.ts"],
+  "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`div{padding:var(--bl-size-xl);background-color:var(--bl-color-neutral-full);border-radius:0 0 var(--bl-border-radius-m) var(--bl-border-radius-m)}div[hidden]{display:none}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport styles from './bl-tab-panel.css';\nimport type BlTabGroup from '../bl-tab-group';\n\n/**\n * @tag bl-tab-panel\n * @summary Baklava Tab panel component\n */\n@customElement('bl-tab-panel')\nexport default class BlTabPanel extends LitElement {\n  static get styles(): CSSResultGroup {\n    return [styles];\n  }\n\n  private tabGroup: BlTabGroup | null;\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    this.updateComplete.then(() => {\n      this.tabGroup = this.closest('bl-tab-group');\n      // FIXME: We need to warn if parent is not tab-group\n      this.tabGroup?.registerTabPanel(this);\n    });\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.tabGroup?.unregisterTabPanel(this);\n  }\n\n  /**\n   * This attribute set by `tab-group` to make panel visible or hidden.\n   */\n  @state()\n  hidden = true;\n\n  /**\n   * Name of the linked tab.\n   */\n  @property({ type: String, reflect: true })\n  tab: string;\n\n  render(): TemplateResult {\n    return html`<div ?hidden=${this.hidden}><slot></slot></div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bl-tab-panel': BlTabPanel;\n  }\n}\n"],
+  "mappings": "mHACO,IAAMA,EAASC,+KACfC,EAAQF,ECQf,IAAqBG,EAArB,cAAwCC,CAAW,CAAnD,kCA0BE,YAAS,GAzBT,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAM,CAChB,CAIA,mBAAoB,CAClB,MAAM,kBAAkB,EAExB,KAAK,eAAe,KAAK,IAAM,CApBnC,IAAAC,EAqBM,KAAK,SAAW,KAAK,QAAQ,cAAc,GAE3CA,EAAA,KAAK,WAAL,MAAAA,EAAe,iBAAiB,KAClC,CAAC,CACH,CAEA,sBAAuB,CA3BzB,IAAAA,EA4BI,MAAM,qBAAqB,GAC3BA,EAAA,KAAK,WAAL,MAAAA,EAAe,mBAAmB,KACpC,CAcA,QAAyB,CACvB,OAAOC,iBAAoB,KAAK,4BAClC,CACF,EAXEC,EAAA,CADCC,EAAM,GAzBYN,EA0BnB,sBAMAK,EAAA,CADCE,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GA/BtBP,EAgCnB,mBAhCmBA,EAArBK,EAAA,CADCE,EAAc,cAAc,GACRP",
+  "names": ["styles", "i", "bl_tab_panel_default", "BlTabPanel", "s", "bl_tab_panel_default", "_a", "y", "__decorateClass", "t", "e"]
+}

package/dist/chunk-6UPKDZRW.js

@@ -0,0 +1,32 @@
+import{a as v}from"./chunk-KPAWUBRO.js";import{a as m}from"./chunk-23UFIOHV.js";import{a as p,b as n,f as d,g as u,h as o}from"./chunk-57PTZNIL.js";import{a as e}from"./chunk-NZ3RGSR6.js";var y=p`:host{display:block}.alert{--padding:var(--bl-size-m);--main-color:var(--bl-color-primary);--main-bg-color:var(--bl-color-primary-contrast);position:relative;display:flex;align-items:flex-start;justify-content:space-between;background-color:var(--main-bg-color);color:var(--bl-color-neutral-darker);box-shadow:inset 0 0 0 1px var(--main-color);border-radius:var(--bl-border-radius-s);padding:calc(var(--padding) / 2) var(--padding);padding-right:calc(var(--padding) / 2)}.description{font:var(--bl-font-body-text-2)}.wrapper{display:flex;flex-flow:column;flex-wrap:wrap;justify-content:space-between;flex:auto}.content{display:flex;margin-right:var(--bl-size-2xs);flex:20 1 70%;padding:calc(var(--padding) / 2) 0}.icon{padding:calc(var(--padding) / 2) 0;margin-right:var(--bl-size-2xs);color:var(--main-color)}.text-content{display:flex;flex-direction:column}.caption{color:var(--bl-color-neutral-darker);font:var(--bl-font-title-3-medium)}.actions{display:none;flex-wrap:wrap;gap:var(--bl-size-m);padding:calc(var(--padding) / 2) 0}.close{--bl-color-neutral-lightest:transparent}.caption+.description{margin-top:var(--bl-size-2xs)}:host([closed]){display:none}:host([variant='success']) .alert{--main-color:var(--bl-color-success);--main-bg-color:var(--bl-color-success-contrast)}:host([variant='warning']) .alert{--main-color:var(--bl-color-warning);--main-bg-color:var(--bl-color-warning-contrast)}:host([variant='danger']) .alert{--main-color:var(--bl-color-danger);--main-bg-color:var(--bl-color-danger-contrast)}`,g=y;var b=()=>({fromAttribute:a=>!a||a==="true"?!0:a==="false"?!1:a});var t=class extends d{constructor(){super(...arguments);this.variant="info";this.closable=!1;this.closed=!1}static get styles(){return[g]}open(){this.closed=!1}close(){this.closed=!0}get _hasAlertCaptionSlot(){return this.querySelector(':scope > [slot="caption"]')!==null}_closeHandler(){this.closed=!0,this.onClose(!0)}_predefinedIcons(){switch(this.variant){case"success":return"check_fill";case"danger":return"close_fill";default:return this.variant}}_getIcon(){if(this.icon)return this.icon===!0?this._predefinedIcons():this.icon}_initAlertActionSlot(s){let i=s.target;i.assignedElements().forEach(r=>{var c;if(r.tagName!=="BL-BUTTON"){(c=r.parentNode)==null||c.removeChild(r);return}i.parentElement.style.display="flex";let f=r.slot==="action-secondary"?"secondary":"primary",h={info:"default",warning:"neutral",success:"success",danger:"danger"};r.setAttribute("variant",f),r.setAttribute("kind",h[this.variant]),r.setAttribute("size","medium"),r.removeAttribute("icon")})}render(){let s=this.caption||this._hasAlertCaptionSlot?n`<span class="caption">
+            <slot name="caption"> ${this.caption} </slot>
+          </span>`:null,i=this._getIcon()?n`<bl-icon class="icon" name=${v(this._getIcon())}></bl-icon>`:null,l=this.closable?n`<bl-button
+          class="close"
+          label="close"
+          variant="tertiary"
+          kind="neutral"
+          icon="close"
+          variant="secondary"
+          @click=${this._closeHandler}
+        ></bl-button>`:null,r=n`<span class="description">
+      <slot> ${this.description} </slot>
+    </span>`;return n`
+      <div class="alert">
+        ${i}
+        <div class="wrapper">
+          <div class="content">
+            <div class="text-content">${s} ${r}</div>
+          </div>
+          <div class="actions">
+            <slot class="action" name="action" @slotchange=${this._initAlertActionSlot}></slot>
+            <slot
+              class="action-secondary"
+              name="action-secondary"
+              @slotchange=${this._initAlertActionSlot}
+            ></slot>
+          </div>
+        </div>
+        ${l}
+      </div>
+    `}};e([o({reflect:!0})],t.prototype,"variant",2),e([o()],t.prototype,"description",2),e([o({converter:b()})],t.prototype,"icon",2),e([o({type:Boolean,reflect:!0})],t.prototype,"closable",2),e([o()],t.prototype,"caption",2),e([o({type:Boolean,reflect:!0})],t.prototype,"closed",2),e([m("bl-close")],t.prototype,"onClose",2),t=e([u("bl-alert")],t);export{t as a};
+//# sourceMappingURL=chunk-6UPKDZRW.js.map

package/dist/chunk-6UPKDZRW.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/alert/bl-alert.css", "../src/utilities/string-boolean.converter.ts", "../src/components/alert/bl-alert.ts"],
+  "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{display:block}.alert{--padding:var(--bl-size-m);--main-color:var(--bl-color-primary);--main-bg-color:var(--bl-color-primary-contrast);position:relative;display:flex;align-items:flex-start;justify-content:space-between;background-color:var(--main-bg-color);color:var(--bl-color-neutral-darker);box-shadow:inset 0 0 0 1px var(--main-color);border-radius:var(--bl-border-radius-s);padding:calc(var(--padding) / 2) var(--padding);padding-right:calc(var(--padding) / 2)}.description{font:var(--bl-font-body-text-2)}.wrapper{display:flex;flex-flow:column;flex-wrap:wrap;justify-content:space-between;flex:auto}.content{display:flex;margin-right:var(--bl-size-2xs);flex:20 1 70%;padding:calc(var(--padding) / 2) 0}.icon{padding:calc(var(--padding) / 2) 0;margin-right:var(--bl-size-2xs);color:var(--main-color)}.text-content{display:flex;flex-direction:column}.caption{color:var(--bl-color-neutral-darker);font:var(--bl-font-title-3-medium)}.actions{display:none;flex-wrap:wrap;gap:var(--bl-size-m);padding:calc(var(--padding) / 2) 0}.close{--bl-color-neutral-lightest:transparent}.caption+.description{margin-top:var(--bl-size-2xs)}:host([closed]){display:none}:host([variant='success']) .alert{--main-color:var(--bl-color-success);--main-bg-color:var(--bl-color-success-contrast)}:host([variant='warning']) .alert{--main-color:var(--bl-color-warning);--main-bg-color:var(--bl-color-warning-contrast)}:host([variant='danger']) .alert{--main-color:var(--bl-color-danger);--main-bg-color:var(--bl-color-danger-contrast)}`;\nexport default styles;\n", "import type { ComplexAttributeConverter } from 'lit';\n\nexport const stringBooleanConverter = (): ComplexAttributeConverter<string | boolean> => {\n  return {\n    fromAttribute: (value: string): string | boolean => {\n      if (!value || value === 'true') return true;\n      if (value === 'false') return false;\n      return value;\n    },\n  };\n};\n", "import { CSSResultGroup, html, LitElement, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { event, EventDispatcher } from '../../utilities/event';\nimport style from './bl-alert.css';\nimport '../icon/bl-icon';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { stringBooleanConverter } from '../../utilities/string-boolean.converter';\nimport { ButtonVariant, ButtonKind, ButtonSize } from '../button/bl-button';\n\nexport type AlertVariant = 'info' | 'warning' | 'success' | 'danger';\n\n/**\n * @tag bl-alert\n * @summary Baklava Alert component\n */\n\n@customElement('bl-alert')\nexport default class BlAlert extends LitElement {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n\n  /**\n   * Sets alert variant\n   */\n  @property({ reflect: true })\n  variant: AlertVariant = 'info';\n\n  /**\n   * Sets alert description\n   */\n  @property()\n  description?: 'string';\n\n  /**\n   * Allows to customize alert icon\n   */\n  @property({ converter: stringBooleanConverter() })\n  icon?: boolean | string;\n\n  /**\n   * Displays a close button.\n   */\n  @property({ type: Boolean, reflect: true })\n  closable = false;\n\n  /**\n   * Sets alert caption.\n   */\n  @property()\n  caption?: string;\n\n  /**\n   * Sets alert components display state.\n   */\n  @property({ type: Boolean, reflect: true })\n  closed = false;\n\n  /**\n   * Opens alert component.\n   */\n  public open() {\n    this.closed = false;\n  }\n\n  /**\n   * Closes alert component.\n   */\n  public close() {\n    this.closed = true;\n  }\n\n  /**\n   * Fires when close button clicked.\n   */\n  @event('bl-close') private onClose: EventDispatcher<boolean>;\n\n  private get _hasAlertCaptionSlot() {\n    return this.querySelector(':scope > [slot=\"caption\"]') !== null;\n  }\n\n  private _closeHandler() {\n    this.closed = true;\n    this.onClose(true);\n  }\n\n  private _predefinedIcons() {\n    switch (this.variant) {\n      case 'success':\n        return 'check_fill';\n      case 'danger':\n        return 'close_fill';\n      default:\n        return this.variant;\n    }\n  }\n\n  private _getIcon(): string | undefined {\n    if (!this.icon) return;\n    if (this.icon === true) return this._predefinedIcons();\n    return this.icon;\n  }\n\n  private _initAlertActionSlot(event: Event) {\n    const slotElement = event.target as HTMLSlotElement;\n    const slotElements = slotElement.assignedElements();\n\n    slotElements.forEach(element => {\n      if (element.tagName !== 'BL-BUTTON') {\n        element.parentNode?.removeChild(element);\n        return;\n      }\n\n      (slotElement.parentElement as HTMLElement).style.display = 'flex';\n\n      const variant = element.slot === 'action-secondary' ? 'secondary' : 'primary';\n      const buttonTypes: Record<AlertVariant, string> = {\n        info: 'default',\n        warning: 'neutral',\n        success: 'success',\n        danger: 'danger',\n      };\n\n      element.setAttribute('variant', variant as ButtonVariant);\n      element.setAttribute('kind', buttonTypes[this.variant] as ButtonKind);\n      element.setAttribute('size', 'medium' as ButtonSize);\n      element.removeAttribute('icon');\n    });\n  }\n\n  render(): TemplateResult {\n    const caption =\n      this.caption || this._hasAlertCaptionSlot\n        ? html`<span class=\"caption\">\n            <slot name=\"caption\"> ${this.caption} </slot>\n          </span>`\n        : null;\n    const icon = this._getIcon()\n      ? html`<bl-icon class=\"icon\" name=${ifDefined(this._getIcon())}></bl-icon>`\n      : null;\n\n    const closable = this.closable\n      ? html`<bl-button\n          class=\"close\"\n          label=\"close\"\n          variant=\"tertiary\"\n          kind=\"neutral\"\n          icon=\"close\"\n          variant=\"secondary\"\n          @click=${this._closeHandler}\n        ></bl-button>`\n      : null;\n    const description = html`<span class=\"description\">\n      <slot> ${this.description} </slot>\n    </span>`;\n\n    return html`\n      <div class=\"alert\">\n        ${icon}\n        <div class=\"wrapper\">\n          <div class=\"content\">\n            <div class=\"text-content\">${caption} ${description}</div>\n          </div>\n          <div class=\"actions\">\n            <slot class=\"action\" name=\"action\" @slotchange=${this._initAlertActionSlot}></slot>\n            <slot\n              class=\"action-secondary\"\n              name=\"action-secondary\"\n              @slotchange=${this._initAlertActionSlot}\n            ></slot>\n          </div>\n        </div>\n        ${closable}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bl-alert': BlAlert;\n  }\n}\n"],
+  "mappings": "4LACO,IAAMA,EAASC,k/CACfC,EAAQF,ECAR,IAAMG,EAAyB,KAC7B,CACL,cAAgBC,GACV,CAACA,GAASA,IAAU,OAAe,GACnCA,IAAU,QAAgB,GACvBA,CAEX,GCQF,IAAqBC,EAArB,cAAqCC,CAAW,CAAhD,kCASE,aAAwB,OAkBxB,cAAW,GAYX,YAAS,GAtCT,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CAyCO,MAAO,CACZ,KAAK,OAAS,EAChB,CAKO,OAAQ,CACb,KAAK,OAAS,EAChB,CAOA,IAAY,sBAAuB,CACjC,OAAO,KAAK,cAAc,2BAA2B,IAAM,IAC7D,CAEQ,eAAgB,CACtB,KAAK,OAAS,GACd,KAAK,QAAQ,EAAI,CACnB,CAEQ,kBAAmB,CACzB,OAAQ,KAAK,QAAS,CACpB,IAAK,UACH,MAAO,aACT,IAAK,SACH,MAAO,aACT,QACE,OAAO,KAAK,OAChB,CACF,CAEQ,UAA+B,CACrC,GAAK,KAAK,KACV,OAAI,KAAK,OAAS,GAAa,KAAK,iBAAiB,EAC9C,KAAK,IACd,CAEQ,qBAAqBC,EAAc,CACzC,IAAMC,EAAcD,EAAM,OACLC,EAAY,iBAAiB,EAErC,QAAQC,GAAW,CA3GpC,IAAAC,EA4GM,GAAID,EAAQ,UAAY,YAAa,EACnCC,EAAAD,EAAQ,aAAR,MAAAC,EAAoB,YAAYD,GAChC,OAGDD,EAAY,cAA8B,MAAM,QAAU,OAE3D,IAAMG,EAAUF,EAAQ,OAAS,mBAAqB,YAAc,UAC9DG,EAA4C,CAChD,KAAM,UACN,QAAS,UACT,QAAS,UACT,OAAQ,QACV,EAEAH,EAAQ,aAAa,UAAWE,CAAwB,EACxDF,EAAQ,aAAa,OAAQG,EAAY,KAAK,OAAO,CAAe,EACpEH,EAAQ,aAAa,OAAQ,QAAsB,EACnDA,EAAQ,gBAAgB,MAAM,CAChC,CAAC,CACH,CAEA,QAAyB,CACvB,IAAMI,EACJ,KAAK,SAAW,KAAK,qBACjBC;AAAA,oCAC0B,KAAK;AAAA,mBAE/B,KACAC,EAAO,KAAK,SAAS,EACvBD,+BAAkCE,EAAU,KAAK,SAAS,CAAC,eAC3D,KAEEC,EAAW,KAAK,SAClBH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAOW,KAAK;AAAA,uBAEhB,KACEI,EAAcJ;AAAA,eACT,KAAK;AAAA,aAGhB,OAAOA;AAAA;AAAA,UAEDC;AAAA;AAAA;AAAA,wCAG8BF,KAAWK;AAAA;AAAA;AAAA,6DAGU,KAAK;AAAA;AAAA;AAAA;AAAA,4BAItC,KAAK;AAAA;AAAA;AAAA;AAAA,UAIvBD;AAAA;AAAA,KAGR,CACF,EAtJEE,EAAA,CADCC,EAAS,CAAE,QAAS,EAAK,CAAC,GARRhB,EASnB,uBAMAe,EAAA,CADCC,EAAS,GAdShB,EAenB,2BAMAe,EAAA,CADCC,EAAS,CAAE,UAAWC,EAAuB,CAAE,CAAC,GApB9BjB,EAqBnB,oBAMAe,EAAA,CADCC,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GA1BvBhB,EA2BnB,wBAMAe,EAAA,CADCC,EAAS,GAhCShB,EAiCnB,uBAMAe,EAAA,CADCC,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAtCvBhB,EAuCnB,sBAmB2Be,EAAA,CAA1BZ,EAAM,UAAU,GA1DEH,EA0DQ,uBA1DRA,EAArBe,EAAA,CADCC,EAAc,UAAU,GACJhB",
+  "names": ["styles", "i", "bl_alert_default", "stringBooleanConverter", "value", "BlAlert", "s", "bl_alert_default", "event", "slotElement", "element", "_a", "variant", "buttonTypes", "caption", "y", "icon", "l", "closable", "description", "__decorateClass", "e", "stringBooleanConverter"]
+}