@trendyol/baklava 3.3.0-beta.12 → 3.3.0-beta.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/baklava.js +1 -1
- package/dist/{chunk-UBN4DMBO.js → chunk-BTBBREKR.js} +2 -2
- package/dist/chunk-BTBBREKR.js.map +7 -0
- package/dist/components/datepicker/bl-datepicker.d.ts +2 -1
- package/dist/components/datepicker/bl-datepicker.d.ts.map +1 -1
- package/dist/components/datepicker/bl-datepicker.js +1 -1
- package/package.json +1 -1
- package/dist/chunk-UBN4DMBO.js.map +0 -7
package/dist/baklava.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{b as z}from"./chunk-N4GAO7FQ.js";import{b as q}from"./chunk-CAIHRZ24.js";import{b as j}from"./chunk-JAZGOWKA.js";import{b as O}from"./chunk-VJRVHJVZ.js";import{b as y}from"./chunk-T5EQ4OXS.js";import{d as v}from"./chunk-STMCW2R6.js";import{a as I}from"./chunk-GQXMNZFC.js";import{a as t}from"./chunk-X73CSBRO.js";import{b as N}from"./chunk-UZJOCLOO.js";import{a as b}from"./chunk-GMVJABPT.js";import{c as T,f as P}from"./chunk-FVBGMXMC.js";import{b as R}from"./chunk-J45OQI7D.js";import{a as D}from"./chunk-5TPDRTCU.js";import{a as w}from"./chunk-YZRAUVUQ.js";import{a as C}from"./chunk-QF4LGACD.js";import{a as s}from"./chunk-FCEMOH4J.js";import{b as G,d as k,f as A}from"./chunk-43SCA2ZJ.js";import{b as S}from"./chunk-73RGV4UX.js";import{b as H}from"./chunk-75V3FKJS.js";import{a as c}from"./chunk-5VEXMTA4.js";import{a as i}from"./chunk-OAF3R4PW.js";import{a as n}from"./chunk-WXWKIQAK.js";import"./chunk-IPYZIIRV.js";import{b as u,e as x}from"./chunk-FTQX7CEW.js";import{a as F}from"./chunk-
|
|
1
|
+
import{b as z}from"./chunk-N4GAO7FQ.js";import{b as q}from"./chunk-CAIHRZ24.js";import{b as j}from"./chunk-JAZGOWKA.js";import{b as O}from"./chunk-VJRVHJVZ.js";import{b as y}from"./chunk-T5EQ4OXS.js";import{d as v}from"./chunk-STMCW2R6.js";import{a as I}from"./chunk-GQXMNZFC.js";import{a as t}from"./chunk-X73CSBRO.js";import{b as N}from"./chunk-UZJOCLOO.js";import{a as b}from"./chunk-GMVJABPT.js";import{c as T,f as P}from"./chunk-FVBGMXMC.js";import{b as R}from"./chunk-J45OQI7D.js";import{a as D}from"./chunk-5TPDRTCU.js";import{a as w}from"./chunk-YZRAUVUQ.js";import{a as C}from"./chunk-QF4LGACD.js";import{a as s}from"./chunk-FCEMOH4J.js";import{b as G,d as k,f as A}from"./chunk-43SCA2ZJ.js";import{b as S}from"./chunk-73RGV4UX.js";import{b as H}from"./chunk-75V3FKJS.js";import{a as c}from"./chunk-5VEXMTA4.js";import{a as i}from"./chunk-OAF3R4PW.js";import{a as n}from"./chunk-WXWKIQAK.js";import"./chunk-IPYZIIRV.js";import{b as u,e as x}from"./chunk-FTQX7CEW.js";import{a as F}from"./chunk-BTBBREKR.js";import{a as h}from"./chunk-AW5LBSEM.js";import{b as g}from"./chunk-47S2NIWC.js";import"./chunk-EZSEQHRH.js";import{a as m}from"./chunk-2I4NXKV5.js";import"./chunk-MND5TXTF.js";import{b as E}from"./chunk-IEFNMLBZ.js";import"./chunk-WEEGH2F4.js";import"./chunk-EG7U7PM3.js";import"./chunk-XDUIVR6I.js";import"./chunk-HZ6A5QFC.js";import"./chunk-AYJMIZZ3.js";import{a as B}from"./chunk-GXDVWGFU.js";import{b as d}from"./chunk-VU6LRFZR.js";import{b as p}from"./chunk-IGNJQVQF.js";import"./chunk-6LT7O7T2.js";import"./chunk-HBPBDC7T.js";import{a as o}from"./chunk-NGJM4NWA.js";import{a as l}from"./chunk-4QFXDW3W.js";import"./chunk-ECPWEUBG.js";import"./chunk-DINNT5P2.js";import{a as f}from"./chunk-4BZSILLM.js";import{a as e,b as a,c as r}from"./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{t as BlAccordion,o as BlAccordionGroup,l as BlAlert,f as BlBadge,d as BlButton,E as BlCalendar,u as BlCheckbox,x as BlCheckboxGroup,F as BlDatePicker,B as BlDialog,s as BlDrawer,A as BlDropdown,S as BlDropdownGroup,k as BlDropdownItem,r as BlIcon,m as BlInput,H as BlNotification,N as BlNotificationCard,c as BlPagination,g as BlPopover,b as BlProgressIndicator,T as BlRadio,P as BlRadioGroup,i as BlSelect,n as BlSelectOption,p as BlSpinner,G as BlSplitButton,R as BlSwitch,w as BlTab,D as BlTabGroup,C as BlTabPanel,v as BlTable,O as BlTableBody,z as BlTableCell,y as BlTableHeader,q as BlTableHeaderCell,j as BlTableRow,I as BlTextarea,h as BlTooltip,a as getIconPath,e as setIconPath};
|
|
2
2
|
//# sourceMappingURL=baklava.js.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as f}from"./chunk-IEFNMLBZ.js";import{a as m}from"./chunk-GRL4DWKG.js";import{a as v,b as n,c as p,e as u}from"./chunk-5MOOXA2X.js";import{a as d,b as r}from"./chunk-4OT5AMS5.js";import{d as i}from"./chunk-IZ2LK5GK.js";var _=d`:host{width:fit-content;display:block}.datepicker-content{--bl-input-cursor:pointer;--icon-size:var(--line-height);--icon-color:var(--bl-color-neutral-light);--datepicker-width:314px;display:flex;flex-direction:column;gap:var(--bl-size-2xs);width:fit-content}.datepicker-input{width:var(--bl-datepicker-input-width, var(--datepicker-width));white-space:nowrap;text-overflow:ellipsis}.icon-container{display:flex;gap:var(--bl-size-3xs);align-items:center}.calendar-icon{display:flex;align-items:center;gap:var(--icon-gap);flex-basis:var(--icon-size);align-self:center;margin-right:var(--label-padding);font-size:var(--icon-size);color:var(--icon-color);height:var(--icon-size)}.action-divider{display:block;height:var(--bl-size-m);width:1px;background-color:var(--bl-color-neutral-lighter);margin-right:var(--bl-size-3xs)}bl-popover{--bl-popover-padding:0;--bl-popover-background-color:transparent}`,b=_;var e=class extends f{constructor(){super(...arguments);this.size="medium";this.labelFixed=!1;this.valueFormatter=null;this._inputValue="";this._selectedDates=[];this._floatingDateCount=0;this._fittingDateCount=0}static get styles(){return[b]}defaultInputValueFormatter(){if(this.type==="single")this._inputValue=this.formatDate(this._selectedDates[0]),this.closePopoverWithTimeout();else if(this.type==="multiple"){this.setFloatingDates();let t=this._selectedDates.slice(0,this._fittingDateCount).map(s=>this.formatDate(s));this._inputValue=t.join(",")+(this._floatingDateCount>0?" ,...":"")}else this.type==="range"&&(this._selectedDates[0]&&(this._inputValue=this.formatDate(this._selectedDates[0])),this._selectedDates[1]&&(this._inputValue=`${this._inputValue}-${this.formatDate(this._selectedDates[1])}`),this._selectedDates[0]&&this._selectedDates[1]&&this.closePopoverWithTimeout())}closePopoverWithTimeout(){setTimeout(()=>{this.closePopover(),this._inputEl.blur()},200)}setFloatingDates(){var a,l;let t=(a=this.shadowRoot)==null?void 0:a.getElementById("datepicker-input"),s=(l=this.shadowRoot)==null?void 0:l.getElementById("icon-container"),o=t.offsetWidth-s.offsetWidth;this._fittingDateCount=Math.floor(o/90),this._floatingDateCount=this._selectedDates.length-this._fittingDateCount}setDatePickerInput(t){t.length?(this._selectedDates=t,this.valueFormatter?this._inputValue=this.valueFormatter(this._selectedDates):this.defaultInputValueFormatter()):this._inputValue="",this._onBlDatepickerChange(this._selectedDates)}formatDate(t){return`${String(t==null?void 0:t.getDate()).padStart(2,"0")}/${String((t==null?void 0:t.getMonth())+1).padStart(2,"0")}/${t==null?void 0:t.getFullYear()}`}clearDatepicker(){this._selectedDates=[],this._inputValue="",this._floatingDateCount=0,this._calendarEl.handleClearSelectedDates()}openPopover(){this._popoverEl.target=this._inputEl,this._popoverEl.show()}closePopover(){this._popoverEl.hide()}_togglePopover(){this._popoverEl.visible?this.closePopover():this.openPopover()}formatAdditionalDates(t){let s=t.split(",");return s.reduce((o,a,l)=>(l>0&&l%3===0&&o.push(r`<br />`),o.push(r`<span>${a.trim()}${l<s.length-1?", ":""}</span>`),o),[])}async firstUpdated(){var t,s;this._onCalendarMouseDown=o=>{var a;o.preventDefault(),(a=this._inputEl)==null||a.focus()},this._onInputMouseDown=o=>{var a;o.preventDefault(),(a=this._inputEl)==null||a.focus()},(t=this._calendarEl)==null||t.addEventListener("mousedown",this._onCalendarMouseDown),(s=this._inputEl)==null||s.addEventListener("mousedown",this._onInputMouseDown),this._selectedDates&&this.setDatePickerInput(this._selectedDates)}disconnectedCallback(){var t,s;super.disconnectedCallback(),(t=this._calendarEl)==null||t.removeEventListener("mousedown",this._onCalendarMouseDown),(s=this._inputEl)==null||s.removeEventListener("mousedown",this._onInputMouseDown)}render(){var c;let t=r`
|
|
1
|
+
import{a as f}from"./chunk-IEFNMLBZ.js";import{a as m}from"./chunk-GRL4DWKG.js";import{a as v,b as n,c as p,e as u}from"./chunk-5MOOXA2X.js";import{a as d,b as r}from"./chunk-4OT5AMS5.js";import{d as i}from"./chunk-IZ2LK5GK.js";var _=d`:host{width:fit-content;display:block}.datepicker-content{--bl-input-cursor:pointer;--icon-size:var(--line-height);--icon-color:var(--bl-color-neutral-light);--datepicker-width:314px;display:flex;flex-direction:column;gap:var(--bl-size-2xs);width:fit-content}.datepicker-input{width:var(--bl-datepicker-input-width, var(--datepicker-width));white-space:nowrap;text-overflow:ellipsis}.icon-container{display:flex;gap:var(--bl-size-3xs);align-items:center}.calendar-icon{display:flex;align-items:center;gap:var(--icon-gap);flex-basis:var(--icon-size);align-self:center;margin-right:var(--label-padding);font-size:var(--icon-size);color:var(--icon-color);height:var(--icon-size)}.action-divider{display:block;height:var(--bl-size-m);width:1px;background-color:var(--bl-color-neutral-lighter);margin-right:var(--bl-size-3xs)}bl-popover{--bl-popover-padding:0;--bl-popover-background-color:transparent}`,b=_;var e=class extends f{constructor(){super(...arguments);this.size="medium";this.labelFixed=!1;this.valueFormatter=null;this._inputValue="";this._selectedDates=[];this._floatingDateCount=0;this._fittingDateCount=0}static get styles(){return[b]}defaultInputValueFormatter(){if(this.type==="single")this._inputValue=this.formatDate(this._selectedDates[0]),this.closePopoverWithTimeout();else if(this.type==="multiple"){this.setFloatingDates();let t=this._selectedDates.slice(0,this._fittingDateCount).map(s=>this.formatDate(s));this._inputValue=t.join(",")+(this._floatingDateCount>0?" ,...":"")}else this.type==="range"&&(this._selectedDates[0]&&(this._inputValue=this.formatDate(this._selectedDates[0])),this._selectedDates[1]&&(this._inputValue=`${this._inputValue}-${this.formatDate(this._selectedDates[1])}`),this._selectedDates[0]&&this._selectedDates[1]&&this.closePopoverWithTimeout())}closePopoverWithTimeout(){setTimeout(()=>{this.closePopover(),this._inputEl.blur()},200)}setFloatingDates(){var a,l;let t=(a=this.shadowRoot)==null?void 0:a.getElementById("datepicker-input"),s=(l=this.shadowRoot)==null?void 0:l.getElementById("icon-container"),o=t.offsetWidth-s.offsetWidth;this._fittingDateCount=Math.floor(o/90),this._floatingDateCount=this._selectedDates.length-this._fittingDateCount}setDatePickerInput(t){t.length?(this._selectedDates=t,this.valueFormatter?this._inputValue=this.valueFormatter(this._selectedDates):this.defaultInputValueFormatter()):this._inputValue="",this._onBlDatepickerChange(this._selectedDates)}formatDate(t){return`${String(t==null?void 0:t.getDate()).padStart(2,"0")}/${String((t==null?void 0:t.getMonth())+1).padStart(2,"0")}/${t==null?void 0:t.getFullYear()}`}clearDatepicker(){this._selectedDates=[],this._inputValue="",this._floatingDateCount=0,this._calendarEl.handleClearSelectedDates()}openPopover(){this._popoverEl.target=this._inputEl,this._popoverEl.show()}closePopover(){this._popoverEl.hide()}_togglePopover(){this._popoverEl.visible?this.closePopover():this.openPopover()}formatAdditionalDates(t){let s=t.split(",");return s.reduce((o,a,l)=>(l>0&&l%3===0&&o.push(r`<br />`),o.push(r`<span>${a.trim()}${l<s.length-1?", ":""}</span>`),o),[])}async firstUpdated(){var t,s;this._onCalendarMouseDown=o=>{var a;o.preventDefault(),(a=this._inputEl)==null||a.focus()},this._onInputMouseDown=o=>{var a;o.preventDefault(),(a=this._inputEl)==null||a.focus()},(t=this._calendarEl)==null||t.addEventListener("mousedown",this._onCalendarMouseDown),(s=this._inputEl)==null||s.addEventListener("mousedown",this._onInputMouseDown),this._selectedDates&&this.setDatePickerInput(this._selectedDates)}updated(t){t.has("_selectedDates")&&this.setDatePickerInput(this._selectedDates)}disconnectedCallback(){var t,s;super.disconnectedCallback(),(t=this._calendarEl)==null||t.removeEventListener("mousedown",this._onCalendarMouseDown),(s=this._inputEl)==null||s.removeEventListener("mousedown",this._onInputMouseDown)}render(){var c;let t=r`
|
|
2
2
|
<bl-popover target="datepicker-content" placement="bottom-start">
|
|
3
3
|
<bl-calendar
|
|
4
4
|
type=${this.type}
|
|
@@ -47,4 +47,4 @@ import{a as f}from"./chunk-IEFNMLBZ.js";import{a as m}from"./chunk-GRL4DWKG.js";
|
|
|
47
47
|
${t}
|
|
48
48
|
</div>
|
|
49
49
|
`}};i([n({type:String,attribute:"placeholder",reflect:!0})],e.prototype,"placeholder",2),i([n({type:String,reflect:!0})],e.prototype,"size",2),i([n({type:Boolean,attribute:"label-fixed",reflect:!0})],e.prototype,"labelFixed",2),i([n({type:String,attribute:"label",reflect:!0})],e.prototype,"label",2),i([n({type:Function,attribute:"value-formatter"})],e.prototype,"valueFormatter",2),i([n({type:Boolean})],e.prototype,"disabled",2),i([n({type:String,attribute:"help-text",reflect:!0})],e.prototype,"helpText",2),i([p()],e.prototype,"_inputValue",2),i([p()],e.prototype,"_selectedDates",2),i([p()],e.prototype,"_floatingDateCount",2),i([p()],e.prototype,"_fittingDateCount",2),i([u("bl-calendar")],e.prototype,"_calendarEl",2),i([u("bl-popover")],e.prototype,"_popoverEl",2),i([u("bl-input")],e.prototype,"_inputEl",2),i([m("bl-datepicker-change")],e.prototype,"_onBlDatepickerChange",2),e=i([v("bl-datepicker")],e);export{e as a};
|
|
50
|
-
//# sourceMappingURL=chunk-
|
|
50
|
+
//# sourceMappingURL=chunk-BTBBREKR.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/components/datepicker/bl-datepicker.css", "../src/components/datepicker/bl-datepicker.ts"],
|
|
4
|
+
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{width:fit-content;display:block}.datepicker-content{--bl-input-cursor:pointer;--icon-size:var(--line-height);--icon-color:var(--bl-color-neutral-light);--datepicker-width:314px;display:flex;flex-direction:column;gap:var(--bl-size-2xs);width:fit-content}.datepicker-input{width:var(--bl-datepicker-input-width, var(--datepicker-width));white-space:nowrap;text-overflow:ellipsis}.icon-container{display:flex;gap:var(--bl-size-3xs);align-items:center}.calendar-icon{display:flex;align-items:center;gap:var(--icon-gap);flex-basis:var(--icon-size);align-self:center;margin-right:var(--label-padding);font-size:var(--icon-size);color:var(--icon-color);height:var(--icon-size)}.action-divider{display:block;height:var(--bl-size-m);width:1px;background-color:var(--bl-color-neutral-lighter);margin-right:var(--bl-size-3xs)}bl-popover{--bl-popover-padding:0;--bl-popover-background-color:transparent}`;\nexport default styles;\n", "import { CSSResultGroup, html, PropertyValues, TemplateResult } from \"lit\";\nimport { customElement, property, query, state } from \"lit/decorators.js\";\nimport { BlCalendar, BlPopover } from \"../../baklava\";\nimport DatepickerCalendarMixin from \"../../mixins/datepicker-calendar-mixin/datepicker-calendar-mixin\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport \"../calendar/bl-calendar\";\nimport { CALENDAR_TYPES } from \"../calendar/bl-calendar.constant\";\nimport \"../input/bl-input\";\nimport BlInput, { InputSize } from \"../input/bl-input\";\nimport \"../tooltip/bl-tooltip\";\nimport style from \"./bl-datepicker.css\";\n\n/**\n * @tag bl-datepicker\n * @summary Baklava DatePicker component\n *\n * @cssproperty [--bl-datepicker-input-width] - Sets the width of datepicker input\n **/\n@customElement(\"bl-datepicker\")\nexport default class BlDatepicker extends DatepickerCalendarMixin {\n /**\n * Defines the datepicker input placeholder\n */\n @property({ type: String, attribute: \"placeholder\", reflect: true })\n placeholder: string;\n /**\n * Sets input size.\n */\n @property({ type: String, reflect: true })\n size?: InputSize = \"medium\";\n\n /**\n * Makes datepicker input label as fixed positioned\n */\n @property({ type: Boolean, attribute: \"label-fixed\", reflect: true })\n labelFixed = false;\n /**\n * Defines the datepicker input label\n */\n @property({ type: String, attribute: \"label\", reflect: true })\n label: string;\n /**\n * Defines the custom formatter function\n */\n @property({ type: Function, attribute: \"value-formatter\" })\n valueFormatter: ((dates: Date[]) => string) | null = null;\n /**\n * Sets datepicker to disabled\n */\n @property({ type: Boolean })\n disabled: boolean;\n /**\n * Defines help text to datepicker input for users\n */\n @property({ type: String, attribute: \"help-text\", reflect: true })\n helpText: string;\n\n @state()\n _inputValue = \"\";\n\n @state()\n _selectedDates: Date[] = [];\n\n @state()\n _floatingDateCount: number = 0;\n\n @state()\n _fittingDateCount: number = 0;\n\n @query(\"bl-calendar\")\n _calendarEl: BlCalendar;\n\n @query(\"bl-popover\")\n _popoverEl: BlPopover;\n\n @query(\"bl-input\")\n _inputEl!: BlInput;\n\n private _onCalendarMouseDown!: (event: MouseEvent) => void;\n private _onInputMouseDown!: (event: MouseEvent) => void;\n\n /**\n * Fires when date selection is changed\n */\n @event(\"bl-datepicker-change\") private _onBlDatepickerChange: EventDispatcher<Date[]>;\n\n static get styles(): CSSResultGroup {\n return [style];\n }\n\n defaultInputValueFormatter() {\n if (this.type === CALENDAR_TYPES.SINGLE) {\n this._inputValue = this.formatDate(this._selectedDates[0]);\n this.closePopoverWithTimeout();\n } else if (this.type === CALENDAR_TYPES.MULTIPLE) {\n this.setFloatingDates();\n const values = this._selectedDates\n .slice(0, this._fittingDateCount)\n .map(date => this.formatDate(date));\n\n this._inputValue = values.join(\",\") + (this._floatingDateCount > 0 ? \" ,...\" : \"\");\n } else if (this.type === CALENDAR_TYPES.RANGE) {\n if (this._selectedDates[0]) this._inputValue = this.formatDate(this._selectedDates[0]);\n if (this._selectedDates[1])\n this._inputValue = `${this._inputValue}-${this.formatDate(this._selectedDates[1])}`;\n if (this._selectedDates[0] && this._selectedDates[1]) this.closePopoverWithTimeout();\n }\n }\n\n closePopoverWithTimeout() {\n setTimeout(() => {\n this.closePopover();\n this._inputEl.blur();\n }, 200);\n }\n\n setFloatingDates() {\n const datepickerInput = this.shadowRoot?.getElementById(\"datepicker-input\");\n const iconsContainer = this.shadowRoot?.getElementById(\"icon-container\");\n const datesTextTotalWidth = datepickerInput!.offsetWidth! - iconsContainer!.offsetWidth!;\n\n this._fittingDateCount = Math.floor(datesTextTotalWidth / 90);\n\n this._floatingDateCount = this._selectedDates.length - this._fittingDateCount;\n }\n\n setDatePickerInput(dates: Date[] | []) {\n if (!dates.length) {\n this._inputValue = \"\";\n } else {\n this._selectedDates = dates;\n if (this.valueFormatter) {\n this._inputValue = this.valueFormatter(this._selectedDates);\n } else {\n this.defaultInputValueFormatter();\n }\n }\n\n this._onBlDatepickerChange(this._selectedDates);\n }\n\n formatDate(date: Date): string {\n return `${String(date?.getDate()).padStart(2, \"0\")}/${String(date?.getMonth() + 1).padStart(\n 2,\n \"0\"\n )}/${date?.getFullYear()}`;\n }\n\n clearDatepicker() {\n this._selectedDates = [];\n this._inputValue = \"\";\n this._floatingDateCount = 0;\n this._calendarEl.handleClearSelectedDates();\n }\n\n openPopover() {\n this._popoverEl.target = this._inputEl;\n this._popoverEl.show();\n }\n\n closePopover() {\n this._popoverEl.hide();\n }\n\n _togglePopover() {\n this._popoverEl.visible ? this.closePopover() : this.openPopover();\n }\n\n formatAdditionalDates(str: string): TemplateResult[] {\n const parts = str.split(\",\");\n\n return parts.reduce<TemplateResult[]>((acc, part, index) => {\n if (index > 0 && index % 3 === 0) {\n acc.push(html`<br />`);\n }\n acc.push(html`<span>${part.trim()}${index < parts.length - 1 ? \", \" : \"\"}</span>`);\n return acc;\n }, []);\n }\n\n async firstUpdated() {\n this._onCalendarMouseDown = event => {\n event.preventDefault();\n this._inputEl?.focus();\n };\n\n this._onInputMouseDown = event => {\n event.preventDefault();\n this._inputEl?.focus();\n };\n\n this._calendarEl?.addEventListener(\"mousedown\", this._onCalendarMouseDown);\n this._inputEl?.addEventListener(\"mousedown\", this._onInputMouseDown);\n\n if (this._selectedDates) {\n this.setDatePickerInput(this._selectedDates);\n }\n }\n\n updated(changedProperties: PropertyValues) {\n if (changedProperties.has(\"_selectedDates\")) {\n this.setDatePickerInput(this._selectedDates);\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this._calendarEl?.removeEventListener(\"mousedown\", this._onCalendarMouseDown);\n this._inputEl?.removeEventListener(\"mousedown\", this._onInputMouseDown);\n }\n\n render() {\n const renderCalendar = html`\n <bl-popover target=\"datepicker-content\" placement=\"bottom-start\">\n <bl-calendar\n type=${this.type}\n .minDate=${this.minDate}\n .maxDate=${this.maxDate}\n .startOfWeek=${this.startOfWeek}\n .disabledDates=${this.disabledDates}\n .value=${this.value}\n .locale=${this.locale}\n @bl-calendar-change=\"${(event: CustomEvent) => this.setDatePickerInput(event.detail)}\"\n ></bl-calendar>\n </bl-popover>\n `;\n const additionalDates = this._selectedDates\n ?.slice(this._fittingDateCount)\n .map(date => {\n return this.formatDate(date);\n })\n .join(\",\");\n\n const formattedAdditionalDates = this.formatAdditionalDates(additionalDates);\n\n const additionalDatesView =\n this._floatingDateCount > 0\n ? html` <bl-tooltip>\n <span slot=\"tooltip-trigger\">+${this._floatingDateCount}</span>\n <div>${formattedAdditionalDates}</div>\n </bl-tooltip>`\n : \"\";\n\n const clearDatepickerButton =\n this._selectedDates.length > 0\n ? html` <bl-button\n size=\"small\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"close\"\n @click=${this.clearDatepicker}\n ></bl-button>\n <div class=\"action-divider\"></div>`\n : \"\";\n\n return html`\n <div class=\"datepicker-content\" id=\"datepicker-content\" tabindex=\"-1\">\n <bl-input\n .value=\"${this._inputValue}\"\n label=\"${this.label}\"\n placeholder=\"${this.placeholder}\"\n class=\"datepicker-input\"\n role=\"button\"\n id=\"datepicker-input\"\n aria-haspopup=\"listbox\"\n aria-labelledby=\"label\"\n @click=${this._togglePopover}\n help-text=${this.helpText}\n ?disabled=${this.disabled}\n .size=${this.size}\n .labelFixed=${this.labelFixed}\n readonly\n >\n <div slot=\"icon\" class=\"icon-container\" id=\"icon-container\">\n ${additionalDatesView} ${clearDatepickerButton}\n <bl-icon name=\"calendar\" size=\"small\" class=\"calendar-icon\"></bl-icon>\n </div>\n </bl-input>\n ${renderCalendar}\n </div>\n `;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["styles", "i", "bl_datepicker_default", "BlDatepicker", "DatepickerCalendarMixin", "bl_datepicker_default", "values", "date", "_a", "_b", "datepickerInput", "iconsContainer", "datesTextTotalWidth", "dates", "str", "parts", "acc", "part", "index", "x", "event", "changedProperties", "renderCalendar", "additionalDates", "formattedAdditionalDates", "additionalDatesView", "clearDatepickerButton", "__decorateClass", "e", "t", "i"]
|
|
7
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { CSSResultGroup, TemplateResult } from "lit";
|
|
1
|
+
import { CSSResultGroup, PropertyValues, TemplateResult } from "lit";
|
|
2
2
|
import { BlCalendar, BlPopover } from "../../baklava";
|
|
3
3
|
import DatepickerCalendarMixin from "../../mixins/datepicker-calendar-mixin/datepicker-calendar-mixin";
|
|
4
4
|
import "../calendar/bl-calendar";
|
|
@@ -65,6 +65,7 @@ export default class BlDatepicker extends DatepickerCalendarMixin {
|
|
|
65
65
|
_togglePopover(): void;
|
|
66
66
|
formatAdditionalDates(str: string): TemplateResult[];
|
|
67
67
|
firstUpdated(): Promise<void>;
|
|
68
|
+
updated(changedProperties: PropertyValues): void;
|
|
68
69
|
disconnectedCallback(): void;
|
|
69
70
|
render(): TemplateResult<1>;
|
|
70
71
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bl-datepicker.d.ts","sourceRoot":"","sources":["../../../src/components/datepicker/bl-datepicker.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"bl-datepicker.d.ts","sourceRoot":"","sources":["../../../src/components/datepicker/bl-datepicker.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAQ,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAE3E,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,uBAAuB,MAAM,kEAAkE,CAAC;AAEvG,OAAO,yBAAyB,CAAC;AAEjC,OAAO,mBAAmB,CAAC;AAC3B,OAAO,OAAO,EAAE,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,uBAAuB,CAAC;AAG/B;;;;;IAKI;AAEJ,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,uBAAuB;IAC/D;;OAEG;IAEH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IAEH,IAAI,CAAC,EAAE,SAAS,CAAY;IAE5B;;OAEG;IAEH,UAAU,UAAS;IACnB;;OAEG;IAEH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IAEH,cAAc,EAAE,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,MAAM,CAAC,GAAG,IAAI,CAAQ;IAC1D;;OAEG;IAEH,QAAQ,EAAE,OAAO,CAAC;IAClB;;OAEG;IAEH,QAAQ,EAAE,MAAM,CAAC;IAGjB,WAAW,SAAM;IAGjB,cAAc,EAAE,IAAI,EAAE,CAAM;IAG5B,kBAAkB,EAAE,MAAM,CAAK;IAG/B,iBAAiB,EAAE,MAAM,CAAK;IAG9B,WAAW,EAAE,UAAU,CAAC;IAGxB,UAAU,EAAE,SAAS,CAAC;IAGtB,QAAQ,EAAG,OAAO,CAAC;IAEnB,OAAO,CAAC,oBAAoB,CAA+B;IAC3D,OAAO,CAAC,iBAAiB,CAA+B;IAExD;;OAEG;IAC4B,OAAO,CAAC,qBAAqB,CAA0B;IAEtF,MAAM,KAAK,MAAM,IAAI,cAAc,CAElC;IAED,0BAA0B;IAmB1B,uBAAuB;IAOvB,gBAAgB;IAUhB,kBAAkB,CAAC,KAAK,EAAE,IAAI,EAAE,GAAG,EAAE;IAerC,UAAU,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;IAO9B,eAAe;IAOf,WAAW;IAKX,YAAY;IAIZ,cAAc;IAId,qBAAqB,CAAC,GAAG,EAAE,MAAM,GAAG,cAAc,EAAE;IAY9C,YAAY;IAmBlB,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAMzC,oBAAoB;IAMpB,MAAM;CAuEP"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a}from"../../chunk-
|
|
1
|
+
import{a}from"../../chunk-BTBBREKR.js";import"../../chunk-AW5LBSEM.js";import"../../chunk-47S2NIWC.js";import"../../chunk-EZSEQHRH.js";import"../../chunk-2I4NXKV5.js";import"../../chunk-MND5TXTF.js";import"../../chunk-IEFNMLBZ.js";import"../../chunk-WEEGH2F4.js";import"../../chunk-EG7U7PM3.js";import"../../chunk-XDUIVR6I.js";import"../../chunk-HZ6A5QFC.js";import"../../chunk-AYJMIZZ3.js";import"../../chunk-VU6LRFZR.js";import"../../chunk-IGNJQVQF.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 default};
|
|
2
2
|
//# sourceMappingURL=bl-datepicker.js.map
|
package/package.json
CHANGED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../src/components/datepicker/bl-datepicker.css", "../src/components/datepicker/bl-datepicker.ts"],
|
|
4
|
-
"sourcesContent": ["import {css} from 'lit';\nexport const styles = css`:host{width:fit-content;display:block}.datepicker-content{--bl-input-cursor:pointer;--icon-size:var(--line-height);--icon-color:var(--bl-color-neutral-light);--datepicker-width:314px;display:flex;flex-direction:column;gap:var(--bl-size-2xs);width:fit-content}.datepicker-input{width:var(--bl-datepicker-input-width, var(--datepicker-width));white-space:nowrap;text-overflow:ellipsis}.icon-container{display:flex;gap:var(--bl-size-3xs);align-items:center}.calendar-icon{display:flex;align-items:center;gap:var(--icon-gap);flex-basis:var(--icon-size);align-self:center;margin-right:var(--label-padding);font-size:var(--icon-size);color:var(--icon-color);height:var(--icon-size)}.action-divider{display:block;height:var(--bl-size-m);width:1px;background-color:var(--bl-color-neutral-lighter);margin-right:var(--bl-size-3xs)}bl-popover{--bl-popover-padding:0;--bl-popover-background-color:transparent}`;\nexport default styles;\n", "import { CSSResultGroup, html, TemplateResult } from \"lit\";\nimport { customElement, property, query, state } from \"lit/decorators.js\";\nimport { BlCalendar, BlPopover } from \"../../baklava\";\nimport DatepickerCalendarMixin from \"../../mixins/datepicker-calendar-mixin/datepicker-calendar-mixin\";\nimport { event, EventDispatcher } from \"../../utilities/event\";\nimport \"../calendar/bl-calendar\";\nimport { CALENDAR_TYPES } from \"../calendar/bl-calendar.constant\";\nimport \"../input/bl-input\";\nimport BlInput, { InputSize } from \"../input/bl-input\";\nimport \"../tooltip/bl-tooltip\";\nimport style from \"./bl-datepicker.css\";\n\n/**\n * @tag bl-datepicker\n * @summary Baklava DatePicker component\n *\n * @cssproperty [--bl-datepicker-input-width] - Sets the width of datepicker input\n **/\n@customElement(\"bl-datepicker\")\nexport default class BlDatepicker extends DatepickerCalendarMixin {\n /**\n * Defines the datepicker input placeholder\n */\n @property({ type: String, attribute: \"placeholder\", reflect: true })\n placeholder: string;\n /**\n * Sets input size.\n */\n @property({ type: String, reflect: true })\n size?: InputSize = \"medium\";\n\n /**\n * Makes datepicker input label as fixed positioned\n */\n @property({ type: Boolean, attribute: \"label-fixed\", reflect: true })\n labelFixed = false;\n /**\n * Defines the datepicker input label\n */\n @property({ type: String, attribute: \"label\", reflect: true })\n label: string;\n /**\n * Defines the custom formatter function\n */\n @property({ type: Function, attribute: \"value-formatter\" })\n valueFormatter: ((dates: Date[]) => string) | null = null;\n /**\n * Sets datepicker to disabled\n */\n @property({ type: Boolean })\n disabled: boolean;\n /**\n * Defines help text to datepicker input for users\n */\n @property({ type: String, attribute: \"help-text\", reflect: true })\n helpText: string;\n\n @state()\n _inputValue = \"\";\n\n @state()\n _selectedDates: Date[] = [];\n\n @state()\n _floatingDateCount: number = 0;\n\n @state()\n _fittingDateCount: number = 0;\n\n @query(\"bl-calendar\")\n _calendarEl: BlCalendar;\n\n @query(\"bl-popover\")\n _popoverEl: BlPopover;\n\n @query(\"bl-input\")\n _inputEl!: BlInput;\n\n private _onCalendarMouseDown!: (event: MouseEvent) => void;\n private _onInputMouseDown!: (event: MouseEvent) => void;\n\n /**\n * Fires when date selection is changed\n */\n @event(\"bl-datepicker-change\") private _onBlDatepickerChange: EventDispatcher<Date[]>;\n\n static get styles(): CSSResultGroup {\n return [style];\n }\n\n defaultInputValueFormatter() {\n if (this.type === CALENDAR_TYPES.SINGLE) {\n this._inputValue = this.formatDate(this._selectedDates[0]);\n this.closePopoverWithTimeout();\n } else if (this.type === CALENDAR_TYPES.MULTIPLE) {\n this.setFloatingDates();\n const values = this._selectedDates\n .slice(0, this._fittingDateCount)\n .map(date => this.formatDate(date));\n\n this._inputValue = values.join(\",\") + (this._floatingDateCount > 0 ? \" ,...\" : \"\");\n } else if (this.type === CALENDAR_TYPES.RANGE) {\n if (this._selectedDates[0]) this._inputValue = this.formatDate(this._selectedDates[0]);\n if (this._selectedDates[1])\n this._inputValue = `${this._inputValue}-${this.formatDate(this._selectedDates[1])}`;\n if (this._selectedDates[0] && this._selectedDates[1]) this.closePopoverWithTimeout();\n }\n }\n\n closePopoverWithTimeout() {\n setTimeout(() => {\n this.closePopover();\n this._inputEl.blur();\n }, 200);\n }\n\n setFloatingDates() {\n const datepickerInput = this.shadowRoot?.getElementById(\"datepicker-input\");\n const iconsContainer = this.shadowRoot?.getElementById(\"icon-container\");\n const datesTextTotalWidth = datepickerInput!.offsetWidth! - iconsContainer!.offsetWidth!;\n\n this._fittingDateCount = Math.floor(datesTextTotalWidth / 90);\n\n this._floatingDateCount = this._selectedDates.length - this._fittingDateCount;\n }\n\n setDatePickerInput(dates: Date[] | []) {\n if (!dates.length) {\n this._inputValue = \"\";\n } else {\n this._selectedDates = dates;\n if (this.valueFormatter) {\n this._inputValue = this.valueFormatter(this._selectedDates);\n } else {\n this.defaultInputValueFormatter();\n }\n }\n\n this._onBlDatepickerChange(this._selectedDates);\n }\n\n formatDate(date: Date): string {\n return `${String(date?.getDate()).padStart(2, \"0\")}/${String(date?.getMonth() + 1).padStart(\n 2,\n \"0\"\n )}/${date?.getFullYear()}`;\n }\n\n clearDatepicker() {\n this._selectedDates = [];\n this._inputValue = \"\";\n this._floatingDateCount = 0;\n this._calendarEl.handleClearSelectedDates();\n }\n\n openPopover() {\n this._popoverEl.target = this._inputEl;\n this._popoverEl.show();\n }\n\n closePopover() {\n this._popoverEl.hide();\n }\n\n _togglePopover() {\n this._popoverEl.visible ? this.closePopover() : this.openPopover();\n }\n\n formatAdditionalDates(str: string): TemplateResult[] {\n const parts = str.split(\",\");\n\n return parts.reduce<TemplateResult[]>((acc, part, index) => {\n if (index > 0 && index % 3 === 0) {\n acc.push(html`<br />`);\n }\n acc.push(html`<span>${part.trim()}${index < parts.length - 1 ? \", \" : \"\"}</span>`);\n return acc;\n }, []);\n }\n\n async firstUpdated() {\n this._onCalendarMouseDown = event => {\n event.preventDefault();\n this._inputEl?.focus();\n };\n\n this._onInputMouseDown = event => {\n event.preventDefault();\n this._inputEl?.focus();\n };\n\n this._calendarEl?.addEventListener(\"mousedown\", this._onCalendarMouseDown);\n this._inputEl?.addEventListener(\"mousedown\", this._onInputMouseDown);\n\n if (this._selectedDates) {\n this.setDatePickerInput(this._selectedDates);\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this._calendarEl?.removeEventListener(\"mousedown\", this._onCalendarMouseDown);\n this._inputEl?.removeEventListener(\"mousedown\", this._onInputMouseDown);\n }\n\n render() {\n const renderCalendar = html`\n <bl-popover target=\"datepicker-content\" placement=\"bottom-start\">\n <bl-calendar\n type=${this.type}\n .minDate=${this.minDate}\n .maxDate=${this.maxDate}\n .startOfWeek=${this.startOfWeek}\n .disabledDates=${this.disabledDates}\n .value=${this.value}\n .locale=${this.locale}\n @bl-calendar-change=\"${(event: CustomEvent) => this.setDatePickerInput(event.detail)}\"\n ></bl-calendar>\n </bl-popover>\n `;\n const additionalDates = this._selectedDates\n ?.slice(this._fittingDateCount)\n .map(date => {\n return this.formatDate(date);\n })\n .join(\",\");\n\n const formattedAdditionalDates = this.formatAdditionalDates(additionalDates);\n\n const additionalDatesView =\n this._floatingDateCount > 0\n ? html` <bl-tooltip>\n <span slot=\"tooltip-trigger\">+${this._floatingDateCount}</span>\n <div>${formattedAdditionalDates}</div>\n </bl-tooltip>`\n : \"\";\n\n const clearDatepickerButton =\n this._selectedDates.length > 0\n ? html` <bl-button\n size=\"small\"\n variant=\"tertiary\"\n kind=\"neutral\"\n icon=\"close\"\n @click=${this.clearDatepicker}\n ></bl-button>\n <div class=\"action-divider\"></div>`\n : \"\";\n\n return html`\n <div class=\"datepicker-content\" id=\"datepicker-content\" tabindex=\"-1\">\n <bl-input\n .value=\"${this._inputValue}\"\n label=\"${this.label}\"\n placeholder=\"${this.placeholder}\"\n class=\"datepicker-input\"\n role=\"button\"\n id=\"datepicker-input\"\n aria-haspopup=\"listbox\"\n aria-labelledby=\"label\"\n @click=${this._togglePopover}\n help-text=${this.helpText}\n ?disabled=${this.disabled}\n .size=${this.size}\n .labelFixed=${this.labelFixed}\n readonly\n >\n <div slot=\"icon\" class=\"icon-container\" id=\"icon-container\">\n ${additionalDatesView} ${clearDatepickerButton}\n <bl-icon name=\"calendar\" size=\"small\" class=\"calendar-icon\"></bl-icon>\n </div>\n </bl-input>\n ${renderCalendar}\n </div>\n `;\n }\n}\n"],
|
|
5
|
-
"mappings": "oOACO,IAAMA,EAASC,q4BACfC,EAAQF,ECiBf,IAAqBG,EAArB,cAA0CC,CAAwB,CAAlE,kCAUE,UAAmB,SAMnB,gBAAa,GAUb,oBAAqD,KAarD,iBAAc,GAGd,oBAAyB,CAAC,EAG1B,wBAA6B,EAG7B,uBAA4B,EAmB5B,WAAW,QAAyB,CAClC,MAAO,CAACC,CAAK,CACf,CAEA,4BAA6B,CAC3B,GAAI,KAAK,gBACP,KAAK,YAAc,KAAK,WAAW,KAAK,eAAe,CAAC,CAAC,EACzD,KAAK,wBAAwB,UACpB,KAAK,kBAAkC,CAChD,KAAK,iBAAiB,EACtB,IAAMC,EAAS,KAAK,eACjB,MAAM,EAAG,KAAK,iBAAiB,EAC/B,IAAIC,GAAQ,KAAK,WAAWA,CAAI,CAAC,EAEpC,KAAK,YAAcD,EAAO,KAAK,GAAG,GAAK,KAAK,mBAAqB,EAAI,QAAU,SACtE,KAAK,iBACV,KAAK,eAAe,CAAC,IAAG,KAAK,YAAc,KAAK,WAAW,KAAK,eAAe,CAAC,CAAC,GACjF,KAAK,eAAe,CAAC,IACvB,KAAK,YAAc,GAAG,KAAK,eAAe,KAAK,WAAW,KAAK,eAAe,CAAC,CAAC,KAC9E,KAAK,eAAe,CAAC,GAAK,KAAK,eAAe,CAAC,GAAG,KAAK,wBAAwB,EAEvF,CAEA,yBAA0B,CACxB,WAAW,IAAM,CACf,KAAK,aAAa,EAClB,KAAK,SAAS,KAAK,CACrB,EAAG,GAAG,CACR,CAEA,kBAAmB,CApHrB,IAAAE,EAAAC,EAqHI,IAAMC,GAAkBF,EAAA,KAAK,aAAL,YAAAA,EAAiB,eAAe,oBAClDG,GAAiBF,EAAA,KAAK,aAAL,YAAAA,EAAiB,eAAe,kBACjDG,EAAsBF,EAAiB,YAAeC,EAAgB,YAE5E,KAAK,kBAAoB,KAAK,MAAMC,EAAsB,EAAE,EAE5D,KAAK,mBAAqB,KAAK,eAAe,OAAS,KAAK,iBAC9D,CAEA,mBAAmBC,EAAoB,CAChCA,EAAM,QAGT,KAAK,eAAiBA,EAClB,KAAK,eACP,KAAK,YAAc,KAAK,eAAe,KAAK,cAAc,EAE1D,KAAK,2BAA2B,GANlC,KAAK,YAAc,GAUrB,KAAK,sBAAsB,KAAK,cAAc,CAChD,CAEA,WAAWN,EAAoB,CAC7B,MAAO,GAAG,OAAOA,GAAA,YAAAA,EAAM,SAAS,EAAE,SAAS,EAAG,GAAG,KAAK,QAAOA,GAAA,YAAAA,EAAM,YAAa,CAAC,EAAE,SACjF,EACA,GACF,KAAKA,GAAA,YAAAA,EAAM,eACb,CAEA,iBAAkB,CAChB,KAAK,eAAiB,CAAC,EACvB,KAAK,YAAc,GACnB,KAAK,mBAAqB,EAC1B,KAAK,YAAY,yBAAyB,CAC5C,CAEA,aAAc,CACZ,KAAK,WAAW,OAAS,KAAK,SAC9B,KAAK,WAAW,KAAK,CACvB,CAEA,cAAe,CACb,KAAK,WAAW,KAAK,CACvB,CAEA,gBAAiB,CACf,KAAK,WAAW,QAAU,KAAK,aAAa,EAAI,KAAK,YAAY,CACnE,CAEA,sBAAsBO,EAA+B,CACnD,IAAMC,EAAQD,EAAI,MAAM,GAAG,EAE3B,OAAOC,EAAM,OAAyB,CAACC,EAAKC,EAAMC,KAC5CA,EAAQ,GAAKA,EAAQ,IAAM,GAC7BF,EAAI,KAAKG,SAAY,EAEvBH,EAAI,KAAKG,UAAaF,EAAK,KAAK,IAAIC,EAAQH,EAAM,OAAS,EAAI,KAAO,WAAW,EAC1EC,GACN,CAAC,CAAC,CACP,CAEA,MAAM,cAAe,CApLvB,IAAAR,EAAAC,EAqLI,KAAK,qBAAuBW,GAAS,CArLzC,IAAAZ,EAsLMY,EAAM,eAAe,GACrBZ,EAAA,KAAK,WAAL,MAAAA,EAAe,OACjB,EAEA,KAAK,kBAAoBY,GAAS,CA1LtC,IAAAZ,EA2LMY,EAAM,eAAe,GACrBZ,EAAA,KAAK,WAAL,MAAAA,EAAe,OACjB,GAEAA,EAAA,KAAK,cAAL,MAAAA,EAAkB,iBAAiB,YAAa,KAAK,uBACrDC,EAAA,KAAK,WAAL,MAAAA,EAAe,iBAAiB,YAAa,KAAK,mBAE9C,KAAK,gBACP,KAAK,mBAAmB,KAAK,cAAc,CAE/C,CAEA,sBAAuB,CAvMzB,IAAAD,EAAAC,EAwMI,MAAM,qBAAqB,GAC3BD,EAAA,KAAK,cAAL,MAAAA,EAAkB,oBAAoB,YAAa,KAAK,uBACxDC,EAAA,KAAK,WAAL,MAAAA,EAAe,oBAAoB,YAAa,KAAK,kBACvD,CAEA,QAAS,CA7MX,IAAAD,EA8MI,IAAMa,EAAiBF;AAAA;AAAA;AAAA,iBAGV,KAAK;AAAA,qBACD,KAAK;AAAA,qBACL,KAAK;AAAA,yBACD,KAAK;AAAA,2BACH,KAAK;AAAA,mBACb,KAAK;AAAA,oBACJ,KAAK;AAAA,iCACSC,GAAuB,KAAK,mBAAmBA,EAAM,MAAM;AAAA;AAAA;AAAA,MAInFE,GAAkBd,EAAA,KAAK,iBAAL,YAAAA,EACpB,MAAM,KAAK,mBACZ,IAAID,GACI,KAAK,WAAWA,CAAI,GAE5B,KAAK,KAEFgB,EAA2B,KAAK,sBAAsBD,CAAe,EAErEE,EACJ,KAAK,mBAAqB,EACtBL;AAAA,4CACkC,KAAK;AAAA,mBAC9BI;AAAA,yBAET,GAEAE,EACJ,KAAK,eAAe,OAAS,EACzBN;AAAA;AAAA;AAAA;AAAA;AAAA,uBAKa,KAAK;AAAA;AAAA,gDAGlB,GAEN,OAAOA;AAAA;AAAA;AAAA,oBAGS,KAAK;AAAA,mBACN,KAAK;AAAA,yBACC,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAMX,KAAK;AAAA,sBACF,KAAK;AAAA,sBACL,KAAK;AAAA,kBACT,KAAK;AAAA,wBACC,KAAK;AAAA;AAAA;AAAA;AAAA,cAIfK,KAAuBC;AAAA;AAAA;AAAA;AAAA,UAI3BJ;AAAA;AAAA,KAGR,CACF,EA5PEK,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,UAAW,cAAe,QAAS,EAAK,CAAC,GAJhDxB,EAKnB,2BAKAuB,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GATtBxB,EAUnB,oBAMAuB,EAAA,CADCC,EAAS,CAAE,KAAM,QAAS,UAAW,cAAe,QAAS,EAAK,CAAC,GAfjDxB,EAgBnB,0BAKAuB,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,UAAW,QAAS,QAAS,EAAK,CAAC,GApB1CxB,EAqBnB,qBAKAuB,EAAA,CADCC,EAAS,CAAE,KAAM,SAAU,UAAW,iBAAkB,CAAC,GAzBvCxB,EA0BnB,8BAKAuB,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,CAAC,GA9BRxB,EA+BnB,wBAKAuB,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,UAAW,YAAa,QAAS,EAAK,CAAC,GAnC9CxB,EAoCnB,wBAGAuB,EAAA,CADCE,EAAM,GAtCYzB,EAuCnB,2BAGAuB,EAAA,CADCE,EAAM,GAzCYzB,EA0CnB,8BAGAuB,EAAA,CADCE,EAAM,GA5CYzB,EA6CnB,kCAGAuB,EAAA,CADCE,EAAM,GA/CYzB,EAgDnB,iCAGAuB,EAAA,CADCG,EAAM,aAAa,GAlDD1B,EAmDnB,2BAGAuB,EAAA,CADCG,EAAM,YAAY,GArDA1B,EAsDnB,0BAGAuB,EAAA,CADCG,EAAM,UAAU,GAxDE1B,EAyDnB,wBAQuCuB,EAAA,CAAtCN,EAAM,sBAAsB,GAjEVjB,EAiEoB,qCAjEpBA,EAArBuB,EAAA,CADCC,EAAc,eAAe,GACTxB",
|
|
6
|
-
"names": ["styles", "i", "bl_datepicker_default", "BlDatepicker", "DatepickerCalendarMixin", "bl_datepicker_default", "values", "date", "_a", "_b", "datepickerInput", "iconsContainer", "datesTextTotalWidth", "dates", "str", "parts", "acc", "part", "index", "x", "event", "renderCalendar", "additionalDates", "formattedAdditionalDates", "additionalDatesView", "clearDatepickerButton", "__decorateClass", "e", "t", "i"]
|
|
7
|
-
}
|