@aquera/nile-elements 0.0.3-9 → 0.0.4-1
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/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/index.d.ts +1 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/index.js +1 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/index.js.map +1 -1
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-calendar/index.d.ts +1 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-calendar/index.js +2 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-calendar/index.js.map +1 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-calendar/nile-calendar.css.d.ts +12 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-calendar/nile-calendar.css.js +186 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-calendar/nile-calendar.css.js.map +1 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-calendar/nile-calendar.d.ts +70 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-calendar/nile-calendar.js +477 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-calendar/nile-calendar.js.map +1 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-date-picker/nile-date-picker.css.js +1 -1
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-date-picker/nile-date-picker.css.js.map +1 -1
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-date-picker/nile-date-picker.d.ts +1 -17
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-date-picker/nile-date-picker.js +13 -317
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-date-picker/nile-date-picker.js.map +1 -1
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-select/nile-select.js +1 -1
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-select/nile-select.js.map +1 -1
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.esm.js +1 -1
- package/dist/index.iife.js +332 -166
- package/dist/nile-calendar/index.cjs.js +2 -0
- package/dist/nile-calendar/index.cjs.js.map +1 -0
- package/dist/nile-calendar/index.esm.js +1 -0
- package/dist/nile-calendar/nile-calendar.cjs.js +2 -0
- package/dist/nile-calendar/nile-calendar.cjs.js.map +1 -0
- package/dist/nile-calendar/nile-calendar.css.cjs.js +2 -0
- package/dist/nile-calendar/nile-calendar.css.cjs.js.map +1 -0
- package/dist/nile-calendar/nile-calendar.css.esm.js +174 -0
- package/dist/nile-calendar/nile-calendar.esm.js +68 -0
- package/dist/nile-date-picker/nile-date-picker.cjs.js +1 -1
- package/dist/nile-date-picker/nile-date-picker.cjs.js.map +1 -1
- package/dist/nile-date-picker/nile-date-picker.css.cjs.js +1 -1
- package/dist/nile-date-picker/nile-date-picker.css.cjs.js.map +1 -1
- package/dist/nile-date-picker/nile-date-picker.css.esm.js +1 -1
- package/dist/nile-date-picker/nile-date-picker.esm.js +9 -83
- package/dist/nile-select/nile-select.cjs.js +1 -1
- package/dist/nile-select/nile-select.cjs.js.map +1 -1
- package/dist/nile-select/nile-select.esm.js +1 -1
- package/dist/src/index.d.ts +1 -0
- package/dist/src/index.js +1 -0
- package/dist/src/index.js.map +1 -1
- package/dist/src/nile-calendar/index.d.ts +1 -0
- package/dist/src/nile-calendar/index.js +2 -0
- package/dist/src/nile-calendar/index.js.map +1 -0
- package/dist/src/nile-calendar/nile-calendar.css.d.ts +12 -0
- package/dist/src/nile-calendar/nile-calendar.css.js +186 -0
- package/dist/src/nile-calendar/nile-calendar.css.js.map +1 -0
- package/dist/src/nile-calendar/nile-calendar.d.ts +70 -0
- package/dist/src/nile-calendar/nile-calendar.js +477 -0
- package/dist/src/nile-calendar/nile-calendar.js.map +1 -0
- package/dist/src/nile-date-picker/nile-date-picker.css.js +1 -1
- package/dist/src/nile-date-picker/nile-date-picker.css.js.map +1 -1
- package/dist/src/nile-date-picker/nile-date-picker.d.ts +1 -17
- package/dist/src/nile-date-picker/nile-date-picker.js +13 -317
- package/dist/src/nile-date-picker/nile-date-picker.js.map +1 -1
- package/dist/src/nile-select/nile-select.js +1 -1
- package/dist/src/nile-select/nile-select.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/index.ts +1 -0
- package/src/nile-calendar/index.ts +1 -0
- package/src/nile-calendar/nile-calendar.css.ts +188 -0
- package/src/nile-calendar/nile-calendar.ts +571 -0
- package/src/nile-date-picker/nile-date-picker.css.ts +1 -1
- package/src/nile-date-picker/nile-date-picker.ts +14 -381
- package/src/nile-select/nile-select.ts +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
System.register(["../index-adad7634.cjs.js"],function(_export,_context){"use strict";var e,_templateObject,a;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_index001CjsJs){e=_index001CjsJs.i;}],execute:function(){_export("s",a=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n :host {\n }\n\n .calendar-container {\n font-family: Colfax-regular;\n width: 365px;\n height: auto;\n text-align: center;\n background: white;\n }\n\n .calendar-container.with-margin {\n margin-right: 20px;\n}\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .divider {\n width: 100%;\n height: 1px;\n background: #c7ced4;\n }\n\n .day-names {\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n height: 50px;\n margin-top: 10px;\n }\n\n .day-names,\n .days {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-start;\n height: auto;\n align-items: center;\n }\n\n .days {\n height: auto;\n }\n\n .day {\n flex-basis: calc(100% / 7);\n box-sizing: border-box;\n width: 48px;\n align-items: center;\n padding: 10px;\n height: 32px;\n margin-top: 6px;\n margin-bottom: 6px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .filler {\n color: grey;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #a5d3f3;\n }\n\n\n\n.calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width:
|
|
1
|
+
System.register(["../index-adad7634.cjs.js"],function(_export,_context){"use strict";var e,_templateObject,a;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_index001CjsJs){e=_index001CjsJs.i;}],execute:function(){_export("s",a=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n :host {\n }\n\n .calendar-container {\n font-family: Colfax-regular;\n width: 365px;\n height: auto;\n text-align: center;\n background: white;\n }\n\n .calendar-container.with-margin {\n margin-right: 20px;\n}\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .divider {\n width: 100%;\n height: 1px;\n background: #c7ced4;\n }\n\n .day-names {\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n height: 50px;\n margin-top: 10px;\n }\n\n .day-names,\n .days {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-start;\n height: auto;\n align-items: center;\n }\n\n .days {\n height: auto;\n }\n\n .day {\n flex-basis: calc(100% / 7);\n box-sizing: border-box;\n width: 48px;\n align-items: center;\n padding: 10px;\n height: 32px;\n margin-top: 6px;\n margin-bottom: 6px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .filler {\n color: grey;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #a5d3f3;\n }\n\n\n\n.calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width: 730px;\n}\n\n.selected-date,\n.range-start,\n.range-end {\n border-radius: 4px;\n background: #a5d3f3;\n color: white;\n}\n\n\n.range-start {\n background: #a5d3f3;\n border-radius: 4px 0 0 4px;\n color: white;\n}\n\n.range-end {\n background: #a5d3f3;\n border-radius: 0 4px 4px 0;\n color: white;\n}\n\n.range-middle {\n background: #a5d3f3;\n color: white;\n border-radius: 0;\n}\n\n.day.selected {\n background: #a5d3f3;\n color: white;\n border-radius: 4px;\n}\n\n.day.in-range {\n background: #a5d3f3;\n color: white;\n}\n\n.selected-date {\n color: white;\n border-radius: 4px;\n background: #a5d3f3;\n}\n\n.base {\n background-color: white;\n border-radius: 4px;\n padding-bottom: 20px\n}\n\n.calender-input{\n padding: 20px;\n padding-bottom: 0px;\n}\n\n.from {\n display: flex;\n justify-content: space-between;\n gap: 20px;\n}\n\n.manual-input{\n width:100%;\n}\n\n.manual-input-label{\n font-size: 12px;\nfont-style: normal;\nfont-weight: 500;\n margin-bottom: 10px;\n}\n\n.apply-button {\n text-align: right;\n display: block;\n padding-top: 20px;\n}\n"]))));}};});
|
|
2
2
|
//# sourceMappingURL=nile-date-picker.css.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-date-picker.css.cjs.js","sources":["../../../src/nile-date-picker/nile-date-picker.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit-element';\n\n/**\n * DatePicker CSS\n */\nexport const styles = css`\n :host {\n }\n\n .calendar-container {\n font-family: Colfax-regular;\n width: 365px;\n height: auto;\n text-align: center;\n background: white;\n }\n\n .calendar-container.with-margin {\n margin-right: 20px;\n}\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .divider {\n width: 100%;\n height: 1px;\n background: #c7ced4;\n }\n\n .day-names {\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n height: 50px;\n margin-top: 10px;\n }\n\n .day-names,\n .days {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-start;\n height: auto;\n align-items: center;\n }\n\n .days {\n height: auto;\n }\n\n .day {\n flex-basis: calc(100% / 7);\n box-sizing: border-box;\n width: 48px;\n align-items: center;\n padding: 10px;\n height: 32px;\n margin-top: 6px;\n margin-bottom: 6px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .filler {\n color: grey;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #a5d3f3;\n }\n\n\n\n.calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width:
|
|
1
|
+
{"version":3,"file":"nile-date-picker.css.cjs.js","sources":["../../../src/nile-date-picker/nile-date-picker.css.ts"],"sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit-element';\n\n/**\n * DatePicker CSS\n */\nexport const styles = css`\n :host {\n }\n\n .calendar-container {\n font-family: Colfax-regular;\n width: 365px;\n height: auto;\n text-align: center;\n background: white;\n }\n\n .calendar-container.with-margin {\n margin-right: 20px;\n}\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .divider {\n width: 100%;\n height: 1px;\n background: #c7ced4;\n }\n\n .day-names {\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n height: 50px;\n margin-top: 10px;\n }\n\n .day-names,\n .days {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-start;\n height: auto;\n align-items: center;\n }\n\n .days {\n height: auto;\n }\n\n .day {\n flex-basis: calc(100% / 7);\n box-sizing: border-box;\n width: 48px;\n align-items: center;\n padding: 10px;\n height: 32px;\n margin-top: 6px;\n margin-bottom: 6px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .filler {\n color: grey;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #a5d3f3;\n }\n\n\n\n.calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width: 730px;\n}\n\n.selected-date,\n.range-start,\n.range-end {\n border-radius: 4px;\n background: #a5d3f3;\n color: white;\n}\n\n\n.range-start {\n background: #a5d3f3;\n border-radius: 4px 0 0 4px;\n color: white;\n}\n\n.range-end {\n background: #a5d3f3;\n border-radius: 0 4px 4px 0;\n color: white;\n}\n\n.range-middle {\n background: #a5d3f3;\n color: white;\n border-radius: 0;\n}\n\n.day.selected {\n background: #a5d3f3;\n color: white;\n border-radius: 4px;\n}\n\n.day.in-range {\n background: #a5d3f3;\n color: white;\n}\n\n.selected-date {\n color: white;\n border-radius: 4px;\n background: #a5d3f3;\n}\n\n.base {\n background-color: white;\n border-radius: 4px;\n padding-bottom: 20px\n}\n\n.calender-input{\n padding: 20px;\n padding-bottom: 0px;\n}\n\n.from {\n display: flex;\n justify-content: space-between;\n gap: 20px;\n}\n\n.manual-input{\n width:100%;\n}\n\n.manual-input-label{\n font-size: 12px;\nfont-style: normal;\nfont-weight: 500;\n margin-bottom: 10px;\n}\n\n.apply-button {\n text-align: right;\n display: block;\n padding-top: 20px;\n}\n`;\n\nexport default [styles];\n"],"names":["styles","css"],"mappings":"gXAYaA,CAAAA,CAASC,CAAG"}
|
|
@@ -1,85 +1,11 @@
|
|
|
1
|
-
import{__decorate as t}from"tslib";import{y as
|
|
2
|
-
<
|
|
3
|
-
<
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
${t}</span
|
|
9
|
-
>
|
|
10
|
-
<nile-icon name="arrowright" color="black" @click="${this.nextMonth}">
|
|
11
|
-
</nile-icon>
|
|
12
|
-
</div>
|
|
13
|
-
<div class="day-names">
|
|
14
|
-
<div class="day">Sun</div>
|
|
15
|
-
<div class="day">Mon</div>
|
|
16
|
-
<div class="day">Tue</div>
|
|
17
|
-
<div class="day">Wed</div>
|
|
18
|
-
<div class="day">Thu</div>
|
|
19
|
-
<div class="day">Fri</div>
|
|
20
|
-
<div class="day">Sat</div>
|
|
21
|
-
</div>
|
|
22
|
-
<div class="days">
|
|
23
|
-
${o.map(((n,a)=>{const h=a>=r.length&&a<r.length+e.length;return i` <div
|
|
24
|
-
class="day ${u(n,s,t,h)} ${c(n,s,t,h)?"in-range":""} ${h?"":"filler"}"
|
|
25
|
-
@click="${()=>{h&&this.selectDate(n,s,t)}}"
|
|
26
|
-
>
|
|
27
|
-
${n}
|
|
28
|
-
</div>`}))}
|
|
29
|
-
</div>
|
|
30
|
-
</div>
|
|
31
|
-
`}formatDate(t){if(!t)return"";return`${String(t.getDate()).padStart(2,"0")}/${String(t.getMonth()+1).padStart(2,"0")}/${t.getFullYear()}`}formatDateRange(t){return t?t.startDate&&t.endDate?`${this.formatDate(t.startDate)} - ${this.formatDate(t.endDate)}`:"":t}handleStartDateInput(t){const i=this.parseDate(t.detail.value);this.isValidDateInput(i)||(this.startDate=null),i&&(!this.endDate||i<=this.endDate)?this.startDate=i:(this.startDate=null,this.endDate=null),this.requestUpdate()}handleEndDateInput(t){const i=this.parseDate(t.detail.value);this.isValidDateInput(i)||(this.endDate=null),i&&(!this.startDate||i>=this.startDate)?this.endDate=i:this.endDate=null,this.requestUpdate()}parseDate(t){const[i,s,e]=t.split("/").map(Number),n=new Date(e,s-1,i);return isNaN(n.getTime())?null:n}isValidDateInput(t){return/^(0[1-9]|[12][0-9]|3[01])\/(0[1-9]|1[0-2])\/\d{4}$/.test(t)}formatTime(t){if(!t)return"";return`${String(t.getHours()).padStart(2,"0")}:${String(t.getMinutes()).padStart(2,"0")}:${String(t.getSeconds()).padStart(2,"0")}`}isValidTimeInput(t){return/^([0-1]?[0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]$/.test(t)}parseTime(t,i){if(!this.isValidTimeInput(t))return null;const[s,e,n]=t.split(":").map(Number),a=new Date(i.getTime());return a.setHours(s,e,n),a}handleStartTimeInput(t){if(!this.startDate)return void(this.startDate=null);const i=this.parseTime(t.detail.value,this.startDate);i?this.startDate=i:this.startDate.setHours(0,0,0),this.requestUpdate()}handleEndTimeInput(t){if(!this.endDate)return void(this.endDate=null);const i=this.parseTime(t.detail.value,this.endDate);i?this.endDate=i:this.endDate.setHours(0,0,0),this.requestUpdate()}render(){this.getDaysArray(this.currentYear,this.currentMonth);const t=(this.currentMonth+1)%12,s=11===this.currentMonth?this.currentYear+1:this.currentYear;return this.getDaysArray(s,t),i`
|
|
32
|
-
<nile-dropdown>
|
|
33
|
-
${this.range?i`
|
|
34
|
-
<nile-input
|
|
35
|
-
slot="trigger"
|
|
36
|
-
label="Choose a date range"
|
|
37
|
-
readonly
|
|
38
|
-
value="${this.formatDateRange(this.rangeValue)}"
|
|
39
|
-
>
|
|
40
|
-
<nile-icon name="calendar" slot="suffix"> </nile-icon>
|
|
41
|
-
</nile-input>
|
|
42
|
-
`:i`
|
|
43
|
-
<nile-input
|
|
44
|
-
slot="trigger"
|
|
45
|
-
label="Choose a date"
|
|
46
|
-
readonly
|
|
47
|
-
value="${this.formatDate(this.value)}"
|
|
48
|
-
>
|
|
49
|
-
<nile-icon name="calendar" slot="suffix"> </nile-icon>
|
|
50
|
-
</nile-input>
|
|
51
|
-
`}
|
|
1
|
+
import{__decorate as t}from"tslib";import{y as e}from"../index-f1b94546.esm.js";import{query as i,customElement as s}from"lit/decorators.js";import{s as n}from"./nile-date-picker.css.esm.js";import{w as a}from"../internal/watch.esm.js";import{N as r}from"../internal/nile-element.esm.js";import"../nile-popup/nile-popup.esm.js";import{e as l}from"../property-bf6307e2.esm.js";import"lit";import"lit/directives/class-map.js";import"../nile-popup/nile-popup.css.esm.js";let h=class extends r{constructor(){super(...arguments),this.currentMonth=(new Date).getMonth(),this.currentYear=(new Date).getFullYear(),this.dropDownOpened=!1,this.valueAttribute=null,this.formattedDate=null,this.startDate=null,this.endDate=null,this.isSelectingStart=!0,this.range=!1}static get styles(){return[n]}valueChanged(){if(this.range&&this.value)return this.rangeValue=this.value,void(this.value=null);if(this.value&&!isNaN(this.value.getTime())){const t=this.value.getTimezoneOffset(),e=new Date(this.value.getTime()-60*t*1e3);isNaN(e.getTime())||(this.valueAttribute=e.toISOString().split("T")[0],this.formattedDate=`${String(e.getDate()).padStart(2,"0")}/${String(e.getMonth()+1).padStart(2,"0")}/${e.getFullYear()}`)}}updated(t){if(super.updated(t),t.has("valueAttribute")){const t=new Date(this.valueAttribute||"");if(!isNaN(t.getTime())){const e=t.getTimezoneOffset();this.value=new Date(t.getTime()-60*e*1e3),this.currentMonth=this.value.getMonth(),this.currentYear=this.value.getFullYear()}}}static get observedAttributes(){return["value","range"]}attributeChangedCallback(t,e,i){"value"===t?(this.valueAttribute=i,this.initializeValue()):"range"===t&&(this.range=null!==i)}initializeValue(){if(this.range)try{const t=JSON.parse(this.valueAttribute||"");this.startDate=new Date(t.startDate),this.endDate=new Date(t.endDate),this.startDate=new Date(this.startDate.getTime()),this.endDate=new Date(this.endDate.getTime()),this.rangeValue={startDate:this.startDate,endDate:this.endDate},this.value=null}catch(t){console.error("Invalid range value")}else if(this.valueAttribute){let t;t=new Date(this.valueAttribute),t=new Date(t.getTime()-6e4*t.getTimezoneOffset()),isNaN(t.getTime())||(this.value=t,this.currentMonth=this.value.getMonth(),this.currentYear=this.value.getFullYear(),this.rangeValue=null)}this.requestUpdate()}handleChanged(t){this.emit("nile-changed",{value:t.detail.value}),this.dropdown&&this.dropdown.hide()}connectedCallback(){if(super.connectedCallback(),this.initializeValue(),this.valueAttribute){const t=new Date(this.valueAttribute);isNaN(t.getTime())||(this.value=t,this.currentMonth=this.value.getMonth(),this.currentYear=this.value.getFullYear())}}render(){return e`
|
|
2
|
+
<nile-dropdown .hoist="${!0}">
|
|
3
|
+
<slot
|
|
4
|
+
slot="trigger"
|
|
5
|
+
part="trigger"
|
|
6
|
+
name="trigger"
|
|
7
|
+
></slot>
|
|
52
8
|
|
|
53
|
-
|
|
54
|
-
<div class="calendar-wrapper">
|
|
55
|
-
<div class="calendar-container ${this.range?"with-margin":""}">
|
|
56
|
-
${this.renderMonth(this.currentYear,this.currentMonth,this.getDaysArray(this.currentYear,this.currentMonth))}
|
|
57
|
-
</div>
|
|
58
|
-
${this.range?i`
|
|
59
|
-
<div class="calendar-container">
|
|
60
|
-
${this.renderMonth(this.currentYear,(this.currentMonth+1)%12,this.getDaysArray(this.currentYear,(this.currentMonth+1)%12))}
|
|
61
|
-
</div>
|
|
62
|
-
`:""}
|
|
63
|
-
</div>
|
|
64
|
-
${this.range?i`
|
|
65
|
-
<div class="calender-input">
|
|
66
|
-
<span class="manual-input-label">From </span>
|
|
67
|
-
<div class="from">
|
|
68
|
-
<nile-input class="manual-input" value="${this.formatDate(this.startDate)}" placeholder="DD/MM/YYYY" @nile-change="${this.handleStartDateInput}"></nile-input>
|
|
69
|
-
<nile-input class="manual-input" value="${this.formatTime(this.startDate)}" placeholder="HH:MM:SS" @nile-change="${this.handleStartTimeInput}"> </nile-input>
|
|
70
|
-
|
|
71
|
-
</div>
|
|
72
|
-
<br>
|
|
73
|
-
<span class="manual-input-label">To </span>
|
|
74
|
-
<div class="from">
|
|
75
|
-
<nile-input class="manual-input" value="${this.formatDate(this.endDate)}" placeholder="DD/MM/YYYY" @nile-change="${this.handleEndDateInput}"></nile-input>
|
|
76
|
-
<nile-input class="manual-input" value="${this.formatTime(this.endDate)}" placeholder="HH:MM:SS" @nile-change="${this.handleEndTimeInput}"> </nile-input>
|
|
77
|
-
</div>
|
|
78
|
-
<nile-button class="apply-button" ?disabled="${!this.startDate||!this.endDate}" @click="${this.confimRange}"> Apply</nile-button>
|
|
79
|
-
|
|
80
|
-
</div>
|
|
81
|
-
</div>
|
|
82
|
-
`:""}
|
|
83
|
-
</div>
|
|
9
|
+
<nile-calendar .value="${this.range}" .range="${this.range}" @nile-changed="${this.handleChanged}"> </nile-calendar>
|
|
84
10
|
</nile-dropdown>
|
|
85
|
-
`}};t([
|
|
11
|
+
`}};t([i("nile-dropdown")],h.prototype,"dropdown",void 0),t([l({type:Boolean,reflect:!0})],h.prototype,"dropDownOpened",void 0),t([l({type:Object})],h.prototype,"value",void 0),t([l({type:Object})],h.prototype,"rangeValue",void 0),t([l({type:String,attribute:"value"})],h.prototype,"valueAttribute",void 0),t([l({type:String,attribute:"value"})],h.prototype,"formattedDate",void 0),t([l({type:Object})],h.prototype,"startDate",void 0),t([l({type:Object})],h.prototype,"endDate",void 0),t([l({type:Boolean})],h.prototype,"isSelectingStart",void 0),t([l({type:Boolean})],h.prototype,"range",void 0),t([a("value")],h.prototype,"valueChanged",null),h=t([s("nile-date-picker")],h);
|