@trendyol/baklava 3.3.0-beta.1 → 3.3.0-beta.10

package/dist/components/switch/bl-switch.js

@@ -1,2 +1,2 @@
-import{a,b}from"../../chunk-OUFOJQAS.js";import"../../chunk-IPYZIIRV.js";import"../../chunk-DINNT5P2.js";import"../../chunk-GRL4DWKG.js";import"../../chunk-5MOOXA2X.js";import"../../chunk-4OT5AMS5.js";import"../../chunk-IZ2LK5GK.js";export{a as blSwitchTag,b as default};
+import{a,b}from"../../chunk-J45OQI7D.js";import"../../chunk-IPYZIIRV.js";import"../../chunk-DINNT5P2.js";import"../../chunk-GRL4DWKG.js";import"../../chunk-5MOOXA2X.js";import"../../chunk-4OT5AMS5.js";import"../../chunk-IZ2LK5GK.js";export{a as blSwitchTag,b as default};
 //# sourceMappingURL=bl-switch.js.map

package/dist/components/table/table-cell/bl-table-cell.js

@@ -1,2 +1,2 @@
-import{a,b}from"../../../chunk-N4GAO7FQ.js";import"../../../chunk-JAZGOWKA.js";import"../../../chunk-VJRVHJVZ.js";import"../../../chunk-T5EQ4OXS.js";import"../../../chunk-STMCW2R6.js";import"../../../chunk-JCODVOWY.js";import"../../../chunk-EG7U7PM3.js";import"../../../chunk-XDUIVR6I.js";import"../../../chunk-HZ6A5QFC.js";import"../../../chunk-AYJMIZZ3.js";import"../../../chunk-6LT7O7T2.js";import"../../../chunk-DINNT5P2.js";import"../../../chunk-HYB2HRRX.js";import"../../../chunk-GRL4DWKG.js";import"../../../chunk-3USCFSFQ.js";import"../../../chunk-7GK5LKBV.js";import"../../../chunk-5MOOXA2X.js";import"../../../chunk-4OT5AMS5.js";import"../../../chunk-IZ2LK5GK.js";export{a as blTableCellTag,b as default};
+import{a,b}from"../../../chunk-N4GAO7FQ.js";import"../../../chunk-JAZGOWKA.js";import"../../../chunk-VJRVHJVZ.js";import"../../../chunk-T5EQ4OXS.js";import"../../../chunk-STMCW2R6.js";import"../../../chunk-FTQX7CEW.js";import"../../../chunk-EG7U7PM3.js";import"../../../chunk-XDUIVR6I.js";import"../../../chunk-HZ6A5QFC.js";import"../../../chunk-AYJMIZZ3.js";import"../../../chunk-6LT7O7T2.js";import"../../../chunk-DINNT5P2.js";import"../../../chunk-BH64QNLE.js";import"../../../chunk-GRL4DWKG.js";import"../../../chunk-3USCFSFQ.js";import"../../../chunk-7GK5LKBV.js";import"../../../chunk-5MOOXA2X.js";import"../../../chunk-4OT5AMS5.js";import"../../../chunk-IZ2LK5GK.js";export{a as blTableCellTag,b as default};
 //# sourceMappingURL=bl-table-cell.js.map

package/dist/components/table/table-header-cell/bl-table-header-cell.js

@@ -1,2 +1,2 @@
-import{a,b}from"../../../chunk-CAIHRZ24.js";import"../../../chunk-JAZGOWKA.js";import"../../../chunk-VJRVHJVZ.js";import"../../../chunk-T5EQ4OXS.js";import"../../../chunk-STMCW2R6.js";import"../../../chunk-JCODVOWY.js";import"../../../chunk-EG7U7PM3.js";import"../../../chunk-XDUIVR6I.js";import"../../../chunk-HZ6A5QFC.js";import"../../../chunk-AYJMIZZ3.js";import"../../../chunk-6LT7O7T2.js";import"../../../chunk-DINNT5P2.js";import"../../../chunk-HYB2HRRX.js";import"../../../chunk-GRL4DWKG.js";import"../../../chunk-3USCFSFQ.js";import"../../../chunk-7GK5LKBV.js";import"../../../chunk-5MOOXA2X.js";import"../../../chunk-4OT5AMS5.js";import"../../../chunk-IZ2LK5GK.js";export{a as blTableHeaderCellTag,b as default};
+import{a,b}from"../../../chunk-CAIHRZ24.js";import"../../../chunk-JAZGOWKA.js";import"../../../chunk-VJRVHJVZ.js";import"../../../chunk-T5EQ4OXS.js";import"../../../chunk-STMCW2R6.js";import"../../../chunk-FTQX7CEW.js";import"../../../chunk-EG7U7PM3.js";import"../../../chunk-XDUIVR6I.js";import"../../../chunk-HZ6A5QFC.js";import"../../../chunk-AYJMIZZ3.js";import"../../../chunk-6LT7O7T2.js";import"../../../chunk-DINNT5P2.js";import"../../../chunk-BH64QNLE.js";import"../../../chunk-GRL4DWKG.js";import"../../../chunk-3USCFSFQ.js";import"../../../chunk-7GK5LKBV.js";import"../../../chunk-5MOOXA2X.js";import"../../../chunk-4OT5AMS5.js";import"../../../chunk-IZ2LK5GK.js";export{a as blTableHeaderCellTag,b as default};
 //# sourceMappingURL=bl-table-header-cell.js.map

package/dist/components/table/table-row/bl-table-row.js

@@ -1,2 +1,2 @@
-import{a,b}from"../../../chunk-JAZGOWKA.js";import"../../../chunk-VJRVHJVZ.js";import"../../../chunk-T5EQ4OXS.js";import"../../../chunk-STMCW2R6.js";import"../../../chunk-JCODVOWY.js";import"../../../chunk-EG7U7PM3.js";import"../../../chunk-XDUIVR6I.js";import"../../../chunk-HZ6A5QFC.js";import"../../../chunk-AYJMIZZ3.js";import"../../../chunk-6LT7O7T2.js";import"../../../chunk-DINNT5P2.js";import"../../../chunk-HYB2HRRX.js";import"../../../chunk-GRL4DWKG.js";import"../../../chunk-3USCFSFQ.js";import"../../../chunk-7GK5LKBV.js";import"../../../chunk-5MOOXA2X.js";import"../../../chunk-4OT5AMS5.js";import"../../../chunk-IZ2LK5GK.js";export{a as blTableRowTag,b as default};
+import{a,b}from"../../../chunk-JAZGOWKA.js";import"../../../chunk-VJRVHJVZ.js";import"../../../chunk-T5EQ4OXS.js";import"../../../chunk-STMCW2R6.js";import"../../../chunk-FTQX7CEW.js";import"../../../chunk-EG7U7PM3.js";import"../../../chunk-XDUIVR6I.js";import"../../../chunk-HZ6A5QFC.js";import"../../../chunk-AYJMIZZ3.js";import"../../../chunk-6LT7O7T2.js";import"../../../chunk-DINNT5P2.js";import"../../../chunk-BH64QNLE.js";import"../../../chunk-GRL4DWKG.js";import"../../../chunk-3USCFSFQ.js";import"../../../chunk-7GK5LKBV.js";import"../../../chunk-5MOOXA2X.js";import"../../../chunk-4OT5AMS5.js";import"../../../chunk-IZ2LK5GK.js";export{a as blTableRowTag,b as default};
 //# sourceMappingURL=bl-table-row.js.map

package/dist/components/tooltip/bl-tooltip.js

@@ -1,2 +1,2 @@
-import{a}from"../../chunk-BJVM3LHO.js";import"../../chunk-OPTFSJFM.js";import"../../chunk-EZSEQHRH.js";import"../../chunk-6LT7O7T2.js";import"../../chunk-DINNT5P2.js";import"../../chunk-GRL4DWKG.js";import"../../chunk-7GK5LKBV.js";import"../../chunk-5MOOXA2X.js";import"../../chunk-4OT5AMS5.js";import"../../chunk-IZ2LK5GK.js";export{a as default};
+import{a}from"../../chunk-AW5LBSEM.js";import"../../chunk-47S2NIWC.js";import"../../chunk-EZSEQHRH.js";import"../../chunk-6LT7O7T2.js";import"../../chunk-DINNT5P2.js";import"../../chunk-GRL4DWKG.js";import"../../chunk-7GK5LKBV.js";import"../../chunk-5MOOXA2X.js";import"../../chunk-4OT5AMS5.js";import"../../chunk-IZ2LK5GK.js";export{a as default};
 //# sourceMappingURL=bl-tooltip.js.map

package/dist/custom-elements.json

@@ -456,77 +456,28 @@
           "kind": "class",
           "description": "",
           "name": "BlCalendar",
-          "events": [
+          "members": [
             {
+              "kind": "field",
+              "name": "_onBlCalendarChange",
               "type": {
-                "text": "CustomEvent<Date[]>"
+                "text": "EventDispatcher<Date[]>"
               },
-              "description": "Fires when date selection changes",
-              "name": "bl-calendar-change"
+              "description": "Fires when date selection changes"
             }
           ],
-          "attributes": [
-            {
-              "name": "type",
-              "type": {
-                "text": "CalendarType"
-              },
-              "description": "Defines the calendar types, available types are single, multiple and range",
-              "fieldName": "type"
-            },
-            {
-              "name": "min-date",
-              "type": {
-                "text": "Date"
-              },
-              "description": "Defines the minimum date value for the calendar",
-              "fieldName": "minDate"
-            },
-            {
-              "name": "max-date",
-              "type": {
-                "text": "Date"
-              },
-              "description": "Defines the maximum date value for the calendar",
-              "fieldName": "maxDate"
-            },
-            {
-              "name": "start-of-week",
-              "type": {
-                "text": "DayValues"
-              },
-              "default": "0",
-              "description": "Defines the start day of the calendar (1 defines monday)",
-              "fieldName": "startOfWeek"
-            },
-            {
-              "name": "disabled-dates",
-              "type": {
-                "text": "Date[]"
-              },
-              "description": "Defines the unselectable dates for calendar",
-              "fieldName": "disabledDates"
-            },
-            {
-              "name": "locale",
-              "type": {
-                "text": "string"
-              },
-              "description": "Defines the calendar language",
-              "fieldName": "locale"
-            },
+          "events": [
             {
-              "name": "default-value",
               "type": {
-                "text": "Date | Date[]"
+                "text": "CustomEvent<Date[]>"
               },
-              "description": "Defines the default selected date value for the calendar",
-              "fieldName": "defaultValue"
+              "description": "Fires when date selection changes",
+              "name": "bl-calendar-change"
             }
           ],
           "superclass": {
-            "name": "LitElement",
-            "package": "lit"
+            "name": "DatepickerCalendarMixin",
+            "module": "/src/mixins/datepicker-calendar-mixin/datepicker-calendar-mixin"
           },
           "tagName": "bl-calendar",
           "summary": [
@@ -721,6 +672,136 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/datepicker/bl-datepicker.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "BlDatepicker",
+          "cssProperties": [
+            {
+              "description": "Sets the width of datepicker input",
+              "name": "--bl-datepicker-input-width"
+            }
+          ],
+          "events": [
+            {
+              "type": {
+                "text": "CustomEvent<Date[]>"
+              },
+              "description": "Fires when date selection is changed",
+              "name": "bl-datepicker-change"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "placeholder",
+              "type": {
+                "text": "string"
+              },
+              "description": "Defines the datepicker input placeholder",
+              "fieldName": "placeholder"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "InputSize | undefined"
+              },
+              "default": "\"medium\"",
+              "description": "Sets input size.",
+              "fieldName": "size"
+            },
+            {
+              "name": "label-fixed",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes datepicker input label as fixed positioned",
+              "fieldName": "labelFixed"
+            },
+            {
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "description": "Defines the datepicker input label",
+              "fieldName": "label"
+            },
+            {
+              "name": "value-formatter",
+              "type": {
+                "text": "((dates: Date[]) => string) | null"
+              },
+              "default": "null",
+              "description": "Defines the custom formatter function",
+              "fieldName": "valueFormatter"
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Sets datepicker to disabled",
+              "fieldName": "disabled"
+            },
+            {
+              "name": "help-text",
+              "type": {
+                "text": "string"
+              },
+              "description": "Defines help text to datepicker input for users",
+              "fieldName": "helpText"
+            }
+          ],
+          "superclass": {
+            "name": "DatepickerCalendarMixin",
+            "module": "/src/mixins/datepicker-calendar-mixin/datepicker-calendar-mixin"
+          },
+          "tagName": "bl-datepicker",
+          "summary": [
+            {
+              "name": "Baklava",
+              "description": "DatePicker component"
+            }
+          ],
+          "jsDoc": "/**\n * @tag bl-datepicker\n * @summary Baklava DatePicker component\n *\n * @cssproperty [--bl-datepicker-input-width] - Sets the width of datepicker input\n **/",
+          "tag": [
+            {
+              "name": "bl-datepicker",
+              "description": ""
+            }
+          ],
+          "cssproperty": [
+            {
+              "name": "--bl-datepicker-input-width",
+              "description": "- Sets the width of datepicker input"
+            }
+          ],
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "BlDatepicker",
+            "module": "src/components/datepicker/bl-datepicker.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bl-datepicker",
+          "declaration": {
+            "name": "BlDatepicker",
+            "module": "src/components/datepicker/bl-datepicker.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/components/dialog/bl-dialog.ts",
@@ -1048,6 +1129,14 @@
               "default": "false",
               "description": "Sets button as disabled",
               "fieldName": "disabled"
+            },
+            {
+              "name": "icon",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Sets the icon name to be displayed on the left side of the button label",
+              "fieldName": "icon"
             }
           ],
           "superclass": {
@@ -1134,11 +1223,11 @@
           ],
           "attributes": [
             {
+              "description": "Name of the icon to show",
               "name": "name",
               "type": {
                 "text": "BaklavaIcon"
               },
-              "description": "Name of the icon to show",
               "fieldName": "name"
             }
           ],
@@ -1153,7 +1242,7 @@
               "description": "Icon component"
             }
           ],
-          "jsDoc": "/**\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 */",
+          "jsDoc": "/**\n * @tag bl-icon\n * @summary Baklava Icon component\n *\n * @attr [name] Name of the icon to show\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 */",
           "tag": [
             {
               "name": "bl-icon",
@@ -1345,15 +1434,16 @@
             {
               "name": "autocomplete",
               "type": {
-                "text": "string"
+                "text": "HTMLInputElement[\"autocomplete\"]"
               },
+              "default": "\"on\"",
               "description": "Hints browser to autocomplete this field.",
               "fieldName": "autocomplete"
             },
             {
               "name": "inputmode",
               "type": {
-                "text": "\"none\" | \"text\" | \"decimal\" | \"numeric\" | \"tel\" | \"search\" | \"email\" | \"url\""
+                "text": "HTMLInputElement[\"inputMode\"]"
               },
               "description": "Sets the input mode of the field for asking browser to show the desired keyboard.",
               "fieldName": "inputmode"
@@ -1724,7 +1814,7 @@
             },
             {
               "description": "Sets the border radius of popover.",
-              "name": "--bl-popover-border-radius",
+              "name": "--bl-popbover-border-radius",
               "default": "--bl-size-3xs"
             },
             {
@@ -1802,7 +1892,7 @@
               "description": "Popover component"
             }
           ],
-          "jsDoc": "/**\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-border-size=1px] - Sets the border size of popover. You can set it to `0px` to not have a border (if you use a custom background color). Always use with a length unit.\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-max-width=100vw] - Sets the maximum width of the popover (including border and padding).\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 */",
+          "jsDoc": "/**\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-border-size=1px] - Sets the border size of popover. You can set it to `0px` to not have a border (if you use a custom background color). Always use with a length unit.\n * @cssproperty [--bl-popover-padding=--bl-size-m] - Sets the padding of popover.\n * @cssproperty [--bl-popbover-border-radius=--bl-size-3xs] - Sets the border radius of popover.\n * @cssproperty [--bl-popover-max-width=100vw] - Sets the maximum width of the popover (including border and padding).\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 */",
           "tag": [
             {
               "name": "bl-popover",
@@ -1831,7 +1921,7 @@
               "description": "- Sets the padding of popover."
             },
             {
-              "name": "--bl-popover-border-radius",
+              "name": "--bl-popbover-border-radius",
               "description": "- Sets the border radius of popover."
             },
             {

package/dist/mixins/datepicker-calendar-mixin/datepicker-calendar-mixin.d.ts

@@ -0,0 +1,46 @@
+import { LitElement } from "lit";
+import { CalendarType, DayValues } from "../../components/calendar/bl-calendar.types";
+export default class DatepickerCalendarMixin extends LitElement {
+    /**
+     * Defines the calendar types, available types are single, multiple and range
+     */
+    type: CalendarType;
+    /**
+     * Defines the start day of the calendar (1 defines monday)
+     */
+    startOfWeek: DayValues;
+    /**
+     * Defines the calendar language
+     */
+    locale: string;
+    _selectedDates: Date[];
+    /**
+     * Defines the unselectable dates for calendar
+     */
+    protected _disabledDates: Date[];
+    get disabledDates(): Date[];
+    set disabledDates(disabledDates: Date[] | string);
+    /**
+     * Defines the maximum date value for the calendar
+     */
+    _maxDate: Date;
+    get maxDate(): Date;
+    set maxDate(maxDate: Date);
+    /**
+     * Defines the minimum date value for the calendar
+     */
+    _minDate: Date;
+    get minDate(): Date;
+    set minDate(minDate: Date);
+    /**
+     * Target elements state
+     */
+    protected _value: Date | Date[] | string;
+    /**
+     * Sets the target element of the popover to align and trigger.
+     * It can be a string id of the target element or can be a direct Element reference of it.
+     */
+    get value(): string | Date | Date[];
+    set value(value: string | Date | Date[]);
+}
+//# sourceMappingURL=datepicker-calendar-mixin.d.ts.map

package/dist/mixins/datepicker-calendar-mixin/datepicker-calendar-mixin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datepicker-calendar-mixin.d.ts","sourceRoot":"","sources":["../../../src/mixins/datepicker-calendar-mixin/datepicker-calendar-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAGjC,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,6CAA6C,CAAC;AAGtF,MAAM,CAAC,OAAO,OAAO,uBAAwB,SAAQ,UAAU;IAC7D;;OAEG;IAEH,IAAI,EAAE,YAAY,CAAC;IACnB;;OAEG;IAEH,WAAW,EAAE,SAAS,CAAK;IAC3B;;OAEG;IAEH,MAAM,EAAE,MAAM,CAA4C;IAE1D,cAAc,EAAE,IAAI,EAAE,CAAM;IAE5B;;OAEG;IACH,SAAS,CAAC,cAAc,EAAE,IAAI,EAAE,CAAM;IAEtC,IAAI,aAAa,IAAI,IAAI,EAAE,CAE1B;IAED,IAKI,aAAa,CAAC,aAAa,EAAE,IAAI,EAAE,GAAG,MAAM,EAe/C;IAED;;OAEG;IACH,QAAQ,EAAE,IAAI,CAAC;IAEf,IAAI,OAAO,IAKU,IAAI,CAHxB;IAED,IACI,OAAO,CAAC,OAAO,EAAE,IAAI,EAMxB;IAED;;OAEG;IACH,QAAQ,EAAE,IAAI,CAAC;IAEf,IAAI,OAAO,IAKU,IAAI,CAHxB;IAED,IACI,OAAO,CAAC,OAAO,EAAE,IAAI,EAMxB;IAED;;OAEG;IACH,SAAS,CAAC,MAAM,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,MAAM,CAAC;IAEzC;;;OAGG;IACH,IAAI,KAAK,IAKQ,MAAM,GAAG,IAAI,GAAG,IAAI,EAAE,CAHtC;IAED,IACI,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,EAAE,EAgCtC;CACF"}

package/dist/mixins/datepicker-calendar-mixin/datepicker-calendar-mixin.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=datepicker-calendar-mixin.test.d.ts.map

package/dist/mixins/datepicker-calendar-mixin/datepicker-calendar-mixin.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datepicker-calendar-mixin.test.d.ts","sourceRoot":"","sources":["../../../src/mixins/datepicker-calendar-mixin/datepicker-calendar-mixin.test.ts"],"names":[],"mappings":""}

package/dist/utilities/string-to-date-converter.d.ts

@@ -0,0 +1,2 @@
+export declare function stringToDateArray(value: string): Date[];
+//# sourceMappingURL=string-to-date-converter.d.ts.map

package/dist/utilities/string-to-date-converter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"string-to-date-converter.d.ts","sourceRoot":"","sources":["../../src/utilities/string-to-date-converter.ts"],"names":[],"mappings":"AAAA,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAAE,CAYvD"}

package/dist/utilities/string-to-date-converter.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=string-to-date-converter.test.d.ts.map

package/dist/utilities/string-to-date-converter.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"string-to-date-converter.test.d.ts","sourceRoot":"","sources":["../../src/utilities/string-to-date-converter.test.ts"],"names":[],"mappings":""}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@trendyol/baklava",
   "type": "module",
-  "version": "3.3.0-beta.1",
+  "version": "3.3.0-beta.10",
   "description": "Trendyol Baklava Design System",
   "main": "dist/baklava.js",
   "module": "dist/baklava.js",
@@ -106,7 +106,7 @@
     "@web/dev-server-import-maps": "^0.0.7",
     "@web/dev-server-rollup": "^0.3.17",
     "@web/test-runner": "^0.15.2",
-    "@web/test-runner-playwright": "^0.9.0",
+    "@web/test-runner-playwright": "^0.11.0",
     "@web/test-runner-puppeteer": "^0.12.0",
     "@webcomponents/webcomponentsjs": "^2.7.0",
     "chromatic": "^6.17.1",
@@ -128,7 +128,9 @@
     "minimist": "^1.2.6",
     "npm-run-all": "^4.1.5",
     "pascal-case": "^3.1.2",
+    "playwright": "^1.49.1",
     "prettier": "^2.8.8",
+    "puppeteer": "^23.11.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "rollup-plugin-lit-css": "^4.0.0",

package/dist/chunk-7QNX2GPS.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/components/accordion-group/accordion/bl-accordion.css", "../src/components/accordion-group/accordion/bl-accordion.ts"],
-  "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{display:block}.accordion{--border:1px solid var(--bl-color-neutral-lighter);--default-radius:var(--bl-size-2xs);--radius-top-left:var(--bl-accordion-radius-top-left, var(--default-radius));--radius-top-right:var(--bl-accordion-radius-top-right, var(--default-radius));--radius-bottom-right:var(--bl-accordion-radius-bottom-right, var(--default-radius));--radius-bottom-left:var(--bl-accordion-radius-bottom-left, var(--default-radius));width:100%}.summary{list-style:none;user-select:none;cursor:pointer;font:var(--bl-font-title-3-medium);display:flex;align-items:center;justify-content:space-between;gap:var(--bl-size-2xs);padding:var(--bl-size-m);background:var(--bl-color-neutral-full);color:var(--bl-color-neutral-darker);border:var(--border);border-bottom:var(--bl-accordion-border-bottom, var(--border));border-radius:var(--radius-top-left) var(--radius-top-right) var(--radius-bottom-right) var(--radius-bottom-left);transition:background-color 200ms}.summary::-webkit-details-marker{display:none}.summary.__ONLY_FOR_STORYBOOK_DEMONSTRATION_HOVER__,.summary:hover{background:var(--bl-color-neutral-lightest)}.summary:focus-visible{outline:2px solid var(--bl-color-primary);outline-offset:-1px}.indicator{transition:transform 200ms}.accordion[open] .indicator{transform:rotate(180deg)}.accordion[open] .summary{border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.caption{flex:1}.accordion-content{padding:var(--bl-size-m);background:var(--bl-color-neutral-full);border:var(--border);border-top:0;border-bottom:var(--bl-accordion-border-bottom, var(--border));border-bottom-left-radius:var(--radius-bottom-left);border-bottom-right-radius:var(--radius-bottom-right);font:var(--bl-font-body-text-2-regular)}.disabled .summary{cursor:not-allowed;background:var(--bl-color-neutral-lightest);color:var(--bl-color-neutral-light)}`;\nexport default styles;\n", "import { html, LitElement, PropertyValues, TemplateResult } from \"lit\";\nimport { customElement, property, query } from \"lit/decorators.js\";\nimport { CSSResultGroup } from \"lit/development\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { event, EventDispatcher } from \"../../../utilities/event\";\nimport { stringBooleanConverter } from \"../../../utilities/string-boolean.converter\";\nimport \"../../icon/bl-icon\";\nimport { BaklavaIcon } from \"../../icon/icon-list\";\nimport style from \"./bl-accordion.css\";\n\nenum AnimationStatus {\n  EXPANDING,\n  COLLAPSING,\n}\n\n@customElement(\"bl-accordion\")\nexport default class BlAccordion extends LitElement {\n  /**\n   * Whether the accordion is expanded\n   */\n  @property({ reflect: true, type: Boolean })\n  open = false;\n\n  /**\n   * Sets accordion caption.\n   */\n  @property({ reflect: true })\n  caption?: string;\n\n  /**\n   * Add icon to beginning of the title\n   */\n  @property({ converter: stringBooleanConverter() })\n  icon?: boolean | BaklavaIcon;\n\n  /**\n   * Whether the accordion is disabled\n   */\n  @property({ reflect: true, type: Boolean })\n  disabled = false;\n\n  /**\n   * Fires when accordion open state change.\n   */\n  @event(\"bl-toggle\") private _onToggle: EventDispatcher<boolean>;\n\n  @property({ type: Number })\n  animationDuration = 250;\n\n  private _animation: Animation | null;\n  private _animationStatus: AnimationStatus | null = null;\n\n  @query(\"details\")\n  detailsEl: HTMLDetailsElement;\n\n  @query(\"summary\")\n  summaryEl: HTMLElement;\n\n  @query(\".accordion-content\")\n  contentEl: HTMLElement;\n\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n\n  _animate(isExpanding: boolean) {\n    this._animationStatus = isExpanding ? AnimationStatus.EXPANDING : AnimationStatus.COLLAPSING;\n\n    const startHeight = `${this.detailsEl.offsetHeight}px`;\n    const endHeight = isExpanding\n      ? `${this.summaryEl.offsetHeight + this.contentEl.offsetHeight}px`\n      : `${this.summaryEl.offsetHeight}px`;\n\n    if (this._animation) {\n      this._animation.cancel();\n    }\n\n    this._animation = this.detailsEl.animate(\n      {\n        height: [startHeight, endHeight],\n      },\n      {\n        duration: this.animationDuration,\n        easing: \"ease-out\",\n      }\n    );\n\n    this._animation.onfinish = () => this._onAnimationFinish(isExpanding);\n    this._animation.oncancel = () => (this._animationStatus = null);\n  }\n\n  private _onAnimationFinish(open: boolean) {\n    this.open = open;\n    this._animation = null;\n    this._animationStatus = null;\n    this.detailsEl.style.height = this.detailsEl.style.overflow = \"\";\n  }\n\n  expand() {\n    this.detailsEl.style.overflow = \"hidden\";\n    this.detailsEl.style.height = `${this.detailsEl.offsetHeight}px`;\n    this.open = true;\n    this._animate(true);\n  }\n\n  collapse() {\n    this._animate(false);\n  }\n\n  private _clickHandler(e: Event) {\n    e.preventDefault();\n\n    if (this.disabled) return;\n\n    if (this._animationStatus === AnimationStatus.COLLAPSING || !this.open) {\n      this.expand();\n    } else if (this._animationStatus === AnimationStatus.EXPANDING || this.open) {\n      this.collapse();\n    }\n  }\n\n  protected updated(_changedProperties: PropertyValues) {\n    if (_changedProperties.has(\"open\")) {\n      if (this.disabled && this.open) {\n        this._onAnimationFinish(false);\n        return;\n      }\n\n      this._onToggle(this.open);\n    }\n  }\n\n  render(): TemplateResult {\n    const icon = this.icon\n      ? html`<bl-icon class=\"icon\" name=${this.icon === true ? \"info\" : this.icon}></bl-icon>`\n      : null;\n\n    return html`<details\n      ?open=${this.open}\n      class=${classMap({\n        accordion: true,\n        disabled: this.disabled,\n      })}\n    >\n      <summary\n        class=\"summary\"\n        @click=\"${this._clickHandler}\"\n        aria-expanded=${this.open ? \"true\" : \"false\"}\n        aria-controls=\"content\"\n        aria-disabled=${this.disabled ? \"true\" : \"false\"}\n        tabindex=${this.disabled ? \"-1\" : \"0\"}\n      >\n        ${icon}\n        <slot name=\"caption\">\n          <span class=\"caption\"> ${this.caption} </span>\n        </slot>\n        <bl-icon name=\"arrow_down\" class=\"indicator\"></bl-icon>\n      </summary>\n\n      <div class=\"accordion-content\" role=\"region\" aria-labelledby=\"header\" id=\"content\">\n        <slot></slot>\n      </div>\n    </details>`;\n  }\n}\n"],
-  "mappings": "4QACO,IAAMA,EAASC,q0DACfC,EAAQF,ECcf,IAAqBG,EAArB,cAAyCC,CAAW,CAApD,kCAKE,UAAO,GAkBP,cAAW,GAQX,uBAAoB,IAGpB,KAAQ,iBAA2C,KAWnD,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CAEA,SAASC,EAAsB,CAC7B,KAAK,iBAAmBA,EAAc,EAA4B,EAElE,IAAMC,EAAc,GAAG,KAAK,UAAU,iBAChCC,EAAYF,EACd,GAAG,KAAK,UAAU,aAAe,KAAK,UAAU,iBAChD,GAAG,KAAK,UAAU,iBAElB,KAAK,YACP,KAAK,WAAW,OAAO,EAGzB,KAAK,WAAa,KAAK,UAAU,QAC/B,CACE,OAAQ,CAACC,EAAaC,CAAS,CACjC,EACA,CACE,SAAU,KAAK,kBACf,OAAQ,UACV,CACF,EAEA,KAAK,WAAW,SAAW,IAAM,KAAK,mBAAmBF,CAAW,EACpE,KAAK,WAAW,SAAW,IAAO,KAAK,iBAAmB,IAC5D,CAEQ,mBAAmBG,EAAe,CACxC,KAAK,KAAOA,EACZ,KAAK,WAAa,KAClB,KAAK,iBAAmB,KACxB,KAAK,UAAU,MAAM,OAAS,KAAK,UAAU,MAAM,SAAW,EAChE,CAEA,QAAS,CACP,KAAK,UAAU,MAAM,SAAW,SAChC,KAAK,UAAU,MAAM,OAAS,GAAG,KAAK,UAAU,iBAChD,KAAK,KAAO,GACZ,KAAK,SAAS,EAAI,CACpB,CAEA,UAAW,CACT,KAAK,SAAS,EAAK,CACrB,CAEQ,cAAcC,EAAU,CAC9BA,EAAE,eAAe,EAEb,MAAK,WAEL,KAAK,mBAAqB,GAA8B,CAAC,KAAK,KAChE,KAAK,OAAO,GACH,KAAK,mBAAqB,GAA6B,KAAK,OACrE,KAAK,SAAS,EAElB,CAEU,QAAQC,EAAoC,CACpD,GAAIA,EAAmB,IAAI,MAAM,EAAG,CAClC,GAAI,KAAK,UAAY,KAAK,KAAM,CAC9B,KAAK,mBAAmB,EAAK,EAC7B,OAGF,KAAK,UAAU,KAAK,IAAI,EAE5B,CAEA,QAAyB,CACvB,IAAMC,EAAO,KAAK,KACdC,+BAAkC,KAAK,OAAS,GAAO,OAAS,KAAK,kBACrE,KAEJ,OAAOA;AAAA,cACG,KAAK;AAAA,cACLC,EAAS,CACf,UAAW,GACX,SAAU,KAAK,QACjB,CAAC;AAAA;AAAA;AAAA;AAAA,kBAIW,KAAK;AAAA,wBACC,KAAK,KAAO,OAAS;AAAA;AAAA,wBAErB,KAAK,SAAW,OAAS;AAAA,mBAC9B,KAAK,SAAW,KAAO;AAAA;AAAA,UAEhCF;AAAA;AAAA,mCAEyB,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAStC,CACF,EA/IEG,EAAA,CADCL,EAAS,CAAE,QAAS,GAAM,KAAM,OAAQ,CAAC,GAJvBP,EAKnB,oBAMAY,EAAA,CADCL,EAAS,CAAE,QAAS,EAAK,CAAC,GAVRP,EAWnB,uBAMAY,EAAA,CADCL,EAAS,CAAE,UAAWM,EAAuB,CAAE,CAAC,GAhB9Bb,EAiBnB,oBAMAY,EAAA,CADCL,EAAS,CAAE,QAAS,GAAM,KAAM,OAAQ,CAAC,GAtBvBP,EAuBnB,wBAK4BY,EAAA,CAA3BE,EAAM,WAAW,GA5BCd,EA4BS,yBAG5BY,EAAA,CADCL,EAAS,CAAE,KAAM,MAAO,CAAC,GA9BPP,EA+BnB,iCAMAY,EAAA,CADC,EAAM,SAAS,GApCGZ,EAqCnB,yBAGAY,EAAA,CADC,EAAM,SAAS,GAvCGZ,EAwCnB,yBAGAY,EAAA,CADC,EAAM,oBAAoB,GA1CRZ,EA2CnB,yBA3CmBA,EAArBY,EAAA,CADCL,EAAc,cAAc,GACRP",
-  "names": ["styles", "i", "bl_accordion_default", "BlAccordion", "s", "bl_accordion_default", "isExpanding", "startHeight", "endHeight", "open", "e", "_changedProperties", "icon", "x", "o", "__decorateClass", "stringBooleanConverter", "event"]
-}

package/dist/chunk-BCXEI2IY.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/components/input/bl-input.css", "../src/components/input/bl-input.ts"],
-  "sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{display:inline-block;width:200px;position:relative}.wrapper{--border-color:var(--bl-color-neutral-lighter);--icon-color:var(--bl-color-neutral-light);--text-color:var(--bl-color-neutral-darker);--height:var(--bl-size-2xl);--input-font:var(--bl-font-body-text-2);--line-height:var(--bl-font-body-text-2-line-height);--icon-size:var(--line-height);--icon-gap:var(--bl-size-xs);--padding-vertical:calc((var(--height) - var(--line-height)) / 2);--padding-horizontal:var(--bl-size-xs);--autofill-bg-color:var(--bl-color-primary-contrast);--label-padding:var(--bl-size-3xs);--background-color:var(--bl-color-neutral-full);display:grid;position:relative;gap:var(--bl-size-3xs)}.wrapper:focus-within{--border-color:var(--bl-color-primary);--icon-color:var(--bl-color-primary)}.wrapper.dirty.invalid{--border-color:var(--bl-color-danger);--icon-color:var(--bl-color-danger)}:host([size=\"large\"]) .wrapper{--height:var(--bl-size-3xl);--padding-vertical:var(--bl-size-xs);--padding-horizontal:var(--bl-size-m);--icon-gap:var(--bl-size-m)}:host([size=\"small\"]) .wrapper{--height:var(--bl-size-xl);--input-font:var(--bl-font-body-text-3);--padding-vertical:var(--bl-size-3xs);--icon-size:var(--bl-font-body-text-3-line-height);--icon-gap:var(--bl-size-2xs)}.input-wrapper{--border-size:1px;outline:none;display:flex;box-sizing:border-box;gap:var(--padding-vertical);height:var(--height);border:solid var(--border-size) var(--border-color);padding:0 calc(\n      var(--bl-input-padding-end, var(--padding-horizontal)) - var(--label-padding) -\n        var(--border-size)\n    ) 0 calc(\n      var(--bl-input-padding-start, var(--padding-horizontal)) - var(--label-padding) -\n        var(--border-size)\n    );background-color:var(--background-color);border-radius:var(--bl-size-3xs);margin:0;width:0;min-width:100%}:host([disabled]) .wrapper{cursor:not-allowed;--background-color:var(--bl-color-neutral-lightest);--text-color:var(--bl-color-neutral-light)}.wrapper:has(input:autofill){--background-color:var(--autofill-bg-color)}.wrapper:has(input:-webkit-autofill){--background-color:var(--autofill-bg-color)}.input-wrapper legend,label{padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}label{position:absolute;max-width:max-content;transition:all ease-in 0.1s;font:var(--input-font);top:var(--padding-vertical);inset-inline-start:var(--bl-input-padding-start, var(--padding-horizontal));inset-inline-end:var(--bl-input-padding-end, var(--padding-horizontal));pointer-events:none;color:var(--bl-color-neutral-light)}.has-icon label{inset-inline-end:calc(\n    var(--bl-input-padding-end, var(--padding-horizontal)) + var(--icon-size) +\n      var(--padding-vertical)\n  )}.input-wrapper legend{height:0;visibility:hidden;display:none}.input-wrapper legend span{padding:0 var(--label-padding);display:inline-block;opacity:0;visibility:visible}input{width:100%;align-self:stretch;outline:0;border:0;padding:0 0 0 var(--label-padding);font:var(--input-font);color:var(--text-color);-webkit-text-fill-color:var(--text-color);background-color:transparent}input::-webkit-credentials-auto-fill-button{color:red}:where(.wrapper:focus-within, .wrapper.has-value) input{padding-inline-start:var(--label-padding)}input:disabled{cursor:not-allowed}input::-webkit-calendar-picker-indicator{display:none}input::-moz-calendar-picker-indicator{display:none}input:autofill{background-color:var(--autofill-bg-color);/**\n   * Some browsers doesn't allow setting background-color\n   * https://developer.mozilla.org/en-US/docs/Web/CSS/:autofill\n   */box-shadow:0 0 0 40rem var(--autofill-bg-color) inset}input:-webkit-autofill{background-color:var(--autofill-bg-color);/**\n   * Some browsers doesn't allow setting background-color\n   * https://developer.mozilla.org/en-US/docs/Web/CSS/:autofill\n   */box-shadow:0 0 0 40rem var(--autofill-bg-color) inset}.icon{display:flex;align-items:center;gap:var(--icon-gap);flex-basis:var(--icon-size);align-self:center;height:var(--icon-size);margin-inline-end:var(--label-padding)}bl-icon:not(.reveal-icon),::slotted(bl-icon){font-size:var(--icon-size);color:var(--icon-color);height:var(--icon-size)}.reveal-button bl-icon{display:none}bl-icon[name=\"eye_on\"]{display:inline-block}.password-visible bl-icon[name=\"eye_on\"]{display:none}.password-visible bl-icon[name=\"eye_off\"]{display:inline-block}.wrapper:not(.has-icon) .icon{display:none}.hint{display:none;font:var(--bl-font-body-text-3)}.hint p{padding:0;margin:0}::placeholder{color:var(--bl-color-neutral-light);-webkit-text-fill-color:var(--bl-color-neutral-light)}:host([label]) ::placeholder{color:transparent;-webkit-text-fill-color:transparent;transition:color ease-out 0.4s}:host([label-fixed]) ::placeholder,:host :focus-within ::placeholder{color:var(--bl-color-neutral-light);-webkit-text-fill-color:var(--bl-color-neutral-light)}:host([label-fixed]) label{position:static;transition:none;transform:none;pointer-events:initial;font:var(--bl-font-caption);color:var(--bl-color-neutral-dark);padding:0}:host([label-fixed]) legend{display:none}:host(:not([label-fixed])) :focus-within label,:host(:not([label-fixed])) .has-value label{top:0;inset-inline-start:calc(\n    var(--bl-input-padding-start, var(--padding-horizontal)) - var(--label-padding)\n  );inset-inline-end:calc(\n    var(--bl-input-padding-end, var(--padding-horizontal)) - var(--label-padding)\n  );transform:translateY(-50%);font:var(--bl-font-caption);color:var(--bl-color-neutral-dark);padding:0 var(--label-padding);pointer-events:initial;z-index:var(--bl-index-base)}:host([label]:not([label-fixed])) :where(:focus-within, .has-value) legend{max-width:100%;font:var(--bl-font-caption);display:block}.error-icon,.invalid-text{display:none}.dirty.invalid label,.invalid-text,.error-icon{color:var(--bl-color-danger)}.help-text{color:var(--bl-color-neutral-dark)}:host([help-text]) .hint,.dirty.invalid .hint{display:block}.dirty.invalid .invalid-text{display:block}.dirty.invalid .help-text{display:none}.dirty.invalid .error-icon{display:inline-block}`;\nexport default styles;\n", "import { CSSResultGroup, html, LitElement, TemplateResult, PropertyValues } from \"lit\";\nimport { customElement, property, query, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { live } from \"lit/directives/live.js\";\nimport { FormControlMixin } from \"@open-wc/form-control\";\nimport { submit } from \"@open-wc/form-helpers\";\nimport \"element-internals-polyfill\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport { innerInputValidators } from \"../../utilities/form-control\";\nimport \"../button/bl-button\";\nimport \"../icon/bl-icon\";\nimport { BaklavaIcon } from \"../icon/icon-list\";\nimport style from \"./bl-input.css\";\n\nexport type InputType =\n  | \"text\"\n  | \"email\"\n  | \"date\"\n  | \"time\"\n  | \"datetime-local\"\n  | \"month\"\n  | \"week\"\n  | \"password\"\n  | \"number\"\n  | \"tel\"\n  | \"url\"\n  | \"search\";\n\nconst inputTypeIcons: Partial<Record<InputType, BaklavaIcon>> = {\n  \"date\": \"calendar\",\n  \"datetime-local\": \"calendar\",\n  \"month\": \"calendar\",\n  \"week\": \"calendar\",\n  \"time\": \"clock\",\n  \"search\": \"search\",\n};\n\nexport type InputSize = \"small\" | \"medium\" | \"large\";\n/**\n * @tag bl-input\n * @summary Baklava Input component\n *\n * @cssproperty [--bl-input-padding-start] Sets the padding start\n * @cssproperty [--bl-input-padding-end] Sets the padding end\n */\n@customElement(\"bl-input\")\nexport default class BlInput extends FormControlMixin(LitElement) {\n  static get styles(): CSSResultGroup {\n    return [style];\n  }\n  static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n  static formControlValidators = innerInputValidators;\n\n  @query(\"input\")\n  validationTarget: HTMLInputElement;\n\n  /**\n   * Sets name of the input\n   */\n  @property({ reflect: true })\n  name?: string;\n\n  /**\n   * Type of the input. It's used to set `type` attribute of native input inside.\n   */\n  @property({ reflect: true })\n  type: InputType = \"text\";\n\n  /**\n   * Sets label of the input\n   */\n  @property({ reflect: true })\n  label?: string;\n\n  /**\n   * Sets placeholder of the input\n   */\n  @property({ reflect: true })\n  placeholder?: string;\n\n  /**\n   * Sets initial value of the input\n   */\n  @property({ reflect: true })\n  value = \"\";\n\n  /**\n   * Makes input a mandatory field\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * Sets minimum length of the input\n   */\n  @property({ type: Number, reflect: true })\n  minlength?: number;\n\n  /**\n   * Sets maximum length of the input\n   */\n  @property({ type: Number, reflect: true })\n  maxlength?: number;\n\n  /**\n   * Sets the minimum acceptable value for the input\n   */\n  @property({ reflect: true })\n  min?: number | string;\n\n  /**\n   * Sets the loading value for the input\n   */\n  @property({ type: Boolean, reflect: true })\n  loading = false;\n\n  /**\n   * Sets the maximum acceptable value for the input\n   */\n  @property({ reflect: true })\n  max?: number | string;\n\n  /**\n   * Sets a regex pattern form the input validation\n   */\n  @property({ type: String, reflect: true })\n  pattern?: string;\n\n  /**\n   * Sets the increase and decrease step to a `number` input\n   */\n  @property({ type: Number, reflect: true })\n  step?: number;\n\n  /**\n   * Hints browser to autocomplete this field.\n   */\n  @property({ type: String, reflect: true })\n  autocomplete: string;\n\n  /**\n   * Sets the input mode of the field for asking browser to show the desired keyboard.\n   */\n  @property({ type: String, reflect: true })\n  inputmode: \"none\" | \"text\" | \"decimal\" | \"numeric\" | \"tel\" | \"search\" | \"email\" | \"url\";\n\n  /**\n   * Sets input to get keyboard focus automatically\n   */\n  @property({ type: Boolean, reflect: true })\n  autofocus = false;\n\n  /**\n   * Sets the custom icon name. `bl-icon` component is used to show an icon\n   */\n  @property({ type: String, reflect: true })\n  icon?: BaklavaIcon;\n\n  /**\n   * Sets input size.\n   */\n  @property({ type: String, reflect: true })\n  size?: InputSize = \"medium\";\n\n  /**\n   * Disables the input\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Makes the input readonly.\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * Makes label as fixed positioned\n   */\n  @property({ type: Boolean, attribute: \"label-fixed\", reflect: true })\n  labelFixed = false;\n\n  /**\n   * Overrides error message. This message will override default error messages\n   */\n  @property({ type: String, attribute: \"invalid-text\", reflect: true })\n  set customInvalidText(value: string) {\n    this._customInvalidText = value;\n    this.setValue(this.value);\n  }\n\n  get customInvalidText(): string {\n    return this._customInvalidText;\n  }\n\n  private _customInvalidText: string;\n\n  /**\n   * Adds help text\n   */\n  @property({ type: String, attribute: \"help-text\", reflect: true })\n  helpText?: string;\n\n  /**\n   * Fires when an alteration to the element's value is committed by the user. Unlike the input event, the change event is not necessarily fired for each alteration to an element's value.\n   */\n  @event(\"bl-change\") private onChange: EventDispatcher<string>;\n\n  /**\n   * Fires when the value of an input element has been changed.\n   */\n  @event(\"bl-input\") private onInput: EventDispatcher<string>;\n\n  /**\n   * Fires when the value of an input element has been changed.\n   */\n  @event(\"bl-invalid\") private onInvalid: EventDispatcher<ValidityState>;\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.addEventListener(\"keydown\", this.onKeydown);\n\n    this.form?.addEventListener(\"submit\", () => {\n      this.reportValidity();\n    });\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener(\"keydown\", this.onKeydown);\n  }\n\n  private onKeydown = (event: KeyboardEvent): void => {\n    if (event.code === \"Enter\" && this.form) {\n      setTimeout(() => {\n        if (!event.defaultPrevented) {\n          submit(this.form);\n        }\n      });\n    }\n  };\n\n  @state() private dirty = false;\n\n  @state() private passwordVisible = false;\n\n  private textVisibilityToggle() {\n    this.passwordVisible = !this.passwordVisible;\n  }\n\n  showPicker() {\n    if (\"showPicker\" in HTMLInputElement.prototype) {\n      this.validationTarget.showPicker();\n    }\n  }\n\n  validityCallback(): string | void {\n    this.onInvalid(this.internals.validity);\n    return this.customInvalidText || this.validationTarget?.validationMessage;\n  }\n\n  /**\n   * Force to set input as in invalid state.\n   */\n  async forceCustomError() {\n    await this.updateComplete;\n    this.validationTarget.setCustomValidity(this.customInvalidText || \"An error occurred\");\n    this.setValue(this.value);\n    this.reportValidity();\n  }\n\n  /**\n   * Clear forced invalid state\n   */\n  async clearCustomError() {\n    await this.updateComplete;\n    this.validationTarget.setCustomValidity(\"\");\n    this.setValue(this.value);\n    this.reportValidity();\n  }\n\n  reportValidity() {\n    this.dirty = true;\n    this.requestUpdate();\n    return this.checkValidity();\n  }\n\n  private inputHandler(event: Event) {\n    const value = (event.target as HTMLInputElement).value;\n\n    this.value = value;\n    this.onInput(value);\n  }\n\n  private changeHandler(event: Event) {\n    const value = (event.target as HTMLInputElement).value;\n\n    this.dirty = true;\n    this.value = value;\n    this.onChange(value);\n  }\n\n  firstUpdated() {\n    this.setValue(this.value);\n    if (!this.icon) this.icon = inputTypeIcons[this.type];\n  }\n\n  protected async updated(changedProperties: PropertyValues) {\n    if (changedProperties.size > 0) {\n      this.setValue(this.value);\n\n      await this.validationComplete;\n\n      this.requestUpdate();\n    }\n  }\n\n  private inputId = Math.random().toString(36).substring(2);\n\n  private get _hasIconSlot() {\n    return this.querySelector(':scope > [slot=\"icon\"]') !== null;\n  }\n\n  render(): TemplateResult {\n    const invalidMessage = !this.checkValidity()\n      ? html`<p id=\"errorMessage\" aria-live=\"polite\" class=\"invalid-text\">\n          ${this.validationMessage}\n        </p>`\n      : \"\";\n    const helpMessage = this.helpText\n      ? html`<p id=\"helpText\" class=\"help-text\">${this.helpText}</p>`\n      : \"\";\n\n    const icon = html`\n      <slot name=\"icon\">\n        ${this.loading && this.type === \"search\" && this.value !== \"\" && this.value !== null\n          ? html`<bl-spinner></bl-spinner>`\n          : this.icon\n          ? html`<bl-icon name=\"${this.icon}\"></bl-icon>`\n          : html`<bl-icon class=\"error-icon\" name=\"alert\"></bl-icon>`}\n      </slot>\n    `;\n\n    const label = this.label ? html`<label for=${this.inputId}>${this.label}</label>` : \"\";\n    const passwordInput = this.type === \"password\";\n\n    const revealButton = passwordInput\n      ? html`<bl-button\n          size=\"small\"\n          kind=\"neutral\"\n          variant=\"tertiary\"\n          class=\"${classMap({\n            \"reveal-button\": true,\n            \"password-visible\": this.passwordVisible,\n          })}\"\n          aria-label=\"Toggle password reveal\"\n          @bl-click=\"${this.textVisibilityToggle}\"\n        >\n          <bl-icon class=\"reveal-icon\" slot=\"icon\" name=\"eye_on\"></bl-icon>\n          <bl-icon class=\"reveal-icon\" slot=\"icon\" name=\"eye_off\"></bl-icon>\n        </bl-button>`\n      : \"\";\n\n    const hasCustomIcon = this.icon || this._hasIconSlot;\n    const classes = {\n      \"wrapper\": true,\n      \"dirty\": this.dirty,\n      \"invalid\": !this.checkValidity(),\n      \"has-icon\": passwordInput || hasCustomIcon || (this.dirty && !this.checkValidity()),\n      \"has-value\": this.value !== null && this.value !== \"\",\n    };\n\n    const passwordType = this.passwordVisible ? \"text\" : \"password\";\n    const inputType = passwordInput ? passwordType : this.type;\n\n    return html`<div class=${classMap(classes)}>\n      ${label}\n      <fieldset class=\"input-wrapper\">\n        <legend><span>${this.label}</span></legend>\n        <input\n          id=${this.inputId}\n          type=${inputType}\n          .value=${live(this.value)}\n          inputmode=\"${ifDefined(this.inputmode)}\"\n          ?autofocus=${this.autofocus}\n          autocomplete=\"${ifDefined(this.autocomplete)}\"\n          placeholder=\"${ifDefined(this.placeholder)}\"\n          minlength=\"${ifDefined(this.minlength)}\"\n          maxlength=\"${ifDefined(this.maxlength)}\"\n          min=\"${ifDefined(this.min)}\"\n          max=\"${ifDefined(this.max)}\"\n          pattern=\"${ifDefined(this.pattern)}\"\n          step=\"${ifDefined(this.step)}\"\n          ?required=${this.required}\n          ?disabled=${this.disabled}\n          ?readonly=${this.readonly}\n          @change=${this.changeHandler}\n          @input=${this.inputHandler}\n          aria-invalid=${this.checkValidity() ? \"false\" : \"true\"}\n          aria-describedby=${ifDefined(this.helpText ? \"helpText\" : undefined)}\n          aria-errormessage=${ifDefined(this.checkValidity() ? undefined : \"errorMessage\")}\n        />\n        <div class=\"icon\">${revealButton} ${icon}</div>\n      </fieldset>\n      <div class=\"hint\">${invalidMessage} ${helpMessage}</div>\n    </div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"bl-input\": BlInput;\n  }\n}\n"],
-  "mappings": "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",
-  "names": ["styles", "i", "bl_input_default", "inputTypeIcons", "BlInput", "FormControlMixin", "s", "event", "submit", "bl_input_default", "value", "_a", "changedProperties", "invalidMessage", "x", "helpMessage", "icon", "label", "passwordInput", "revealButton", "o", "hasCustomIcon", "classes", "passwordType", "inputType", "l", "innerInputValidators", "__decorateClass", "i", "e", "t"]
-}