@six-group/ui-library 0.0.0-insider.012ddb2

package/dist/collection/components/six-checkbox/test/six-checkbox.spec.js

@@ -0,0 +1,83 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { SixCheckbox } from "../six-checkbox";
+describe('six-checkbox', () => {
+    it('default', async () => {
+        const page = await newSpecPage({
+            components: [SixCheckbox],
+            html: `<six-checkbox></six-checkbox>`,
+        });
+        expect(page.root).toEqualHtml(`
+       <six-checkbox>
+         <mock:shadow-root>
+           <div class="form-control form-control--medium" part="form-control">
+             <label aria-hidden="true" class="form-control__label" htmlfor="checkbox-1" id="checkbox-label-1" part="label">
+               <slot name="label"></slot>
+             </label>
+             <div class="form-control__input">
+               <label class="checkbox" htmlfor="checkbox-1" part="base">
+                 <span class="checkbox__control" part="control">
+                   <input aria-checked="false" aria-labelledby="checkbox-label-1" id="checkbox-1" role="checkbox" type="checkbox" value="on">
+                 </span>
+                 <span class="checkbox__text" id="checkbox-text-1" part="text">
+                   <slot></slot>
+                 </span>
+               </label>
+             </div>
+             <div aria-hidden="true" class="form-control__error-text" id="input-error-text-1" part="error-text">
+              <slot name="error-text"></slot>
+             </div>
+             <div aria-hidden="true" class="form-control__help-text" part="help-text">
+               <slot name="help-text"></slot>
+             </div>
+           </div>
+         </mock:shadow-root>
+       </six-checkbox>
+    `);
+    });
+    it('checked', async () => {
+        const page = await newSpecPage({
+            components: [SixCheckbox],
+            html: `<six-checkbox checked></six-checkbox>`,
+        });
+        expect(page.root).toEqualHtml(`
+      <six-checkbox checked="">
+        <mock:shadow-root>
+          <div class="form-control form-control--medium" part="form-control">
+            <label aria-hidden="true" class="form-control__label" htmlfor="checkbox-2" id="checkbox-label-2" part="label">
+                <slot name="label"></slot>
+            </label>
+            <div class="form-control__input">
+              <label class="checkbox checkbox--checked" htmlfor="checkbox-2" part="base">
+                <span part="control" class="checkbox__control">
+                  <span part="checked-icon" class="checkbox__icon">
+                    <svg viewBox="0 0 16 16">
+                      <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+                        <g stroke="currentColor" stroke-width="2">
+                          <g transform="translate(3.428571, 3.428571)">
+                            <path d="M0,5.71428571 L3.42857143,9.14285714"></path>
+                            <path d="M9.14285714,0 L3.42857143,9.14285714"></path>
+                          </g>
+                        </g>
+                      </g>
+                    </svg>
+                  </span>
+                  <input id="checkbox-2" type="checkbox" role="checkbox" aria-checked="true" aria-labelledby="checkbox-label-2" checked="" value="on">
+                </span>
+                <span part="text" id="checkbox-text-2" class="checkbox__text">
+                  <slot></slot>
+                </span>
+              </label>
+            </div>
+            <div aria-hidden="true" class="form-control__error-text" id="input-error-text-2" part="error-text">
+              <slot name="error-text"></slot>
+            </div>
+            <div aria-hidden="true" class="form-control__help-text" part="help-text">
+                <slot name="help-text"></slot>
+            </div>
+          </div>
+        </mock:shadow-root>
+    </six-checkbox>
+    `);
+    });
+});
+//# sourceMappingURL=six-checkbox.spec.js.map

package/dist/collection/components/six-checkbox/test/six-checkbox.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"six-checkbox.spec.js","sourceRoot":"","sources":["../../../../src/components/six-checkbox/test/six-checkbox.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE9C,QAAQ,CAAC,cAAc,EAAE,GAAG,EAAE;IAC5B,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,WAAW,CAAC;YACzB,IAAI,EAAE,+BAA+B;SACtC,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;KA0B7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,WAAW,CAAC;YACzB,IAAI,EAAE,uCAAuC;SAC9C,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAsC7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { SixCheckbox } from '../six-checkbox';\n\ndescribe('six-checkbox', () => {\n  it('default', async () => {\n    const page = await newSpecPage({\n      components: [SixCheckbox],\n      html: `<six-checkbox></six-checkbox>`,\n    });\n    expect(page.root).toEqualHtml(`\n       <six-checkbox>\n         <mock:shadow-root>\n           <div class=\"form-control form-control--medium\" part=\"form-control\">\n             <label aria-hidden=\"true\" class=\"form-control__label\" htmlfor=\"checkbox-1\" id=\"checkbox-label-1\" part=\"label\">\n               <slot name=\"label\"></slot>\n             </label>\n             <div class=\"form-control__input\">\n               <label class=\"checkbox\" htmlfor=\"checkbox-1\" part=\"base\">\n                 <span class=\"checkbox__control\" part=\"control\">\n                   <input aria-checked=\"false\" aria-labelledby=\"checkbox-label-1\" id=\"checkbox-1\" role=\"checkbox\" type=\"checkbox\" value=\"on\">\n                 </span>\n                 <span class=\"checkbox__text\" id=\"checkbox-text-1\" part=\"text\">\n                   <slot></slot>\n                 </span>\n               </label>\n             </div>\n             <div aria-hidden=\"true\" class=\"form-control__error-text\" id=\"input-error-text-1\" part=\"error-text\">\n              <slot name=\"error-text\"></slot>\n             </div>\n             <div aria-hidden=\"true\" class=\"form-control__help-text\" part=\"help-text\">\n               <slot name=\"help-text\"></slot>\n             </div>\n           </div>\n         </mock:shadow-root>\n       </six-checkbox>\n    `);\n  });\n\n  it('checked', async () => {\n    const page = await newSpecPage({\n      components: [SixCheckbox],\n      html: `<six-checkbox checked></six-checkbox>`,\n    });\n    expect(page.root).toEqualHtml(`\n      <six-checkbox checked=\"\">\n        <mock:shadow-root>\n          <div class=\"form-control form-control--medium\" part=\"form-control\">\n            <label aria-hidden=\"true\" class=\"form-control__label\" htmlfor=\"checkbox-2\" id=\"checkbox-label-2\" part=\"label\">\n                <slot name=\"label\"></slot>\n            </label>\n            <div class=\"form-control__input\">\n              <label class=\"checkbox checkbox--checked\" htmlfor=\"checkbox-2\" part=\"base\">\n                <span part=\"control\" class=\"checkbox__control\">\n                  <span part=\"checked-icon\" class=\"checkbox__icon\">\n                    <svg viewBox=\"0 0 16 16\">\n                      <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\" stroke-linecap=\"round\">\n                        <g stroke=\"currentColor\" stroke-width=\"2\">\n                          <g transform=\"translate(3.428571, 3.428571)\">\n                            <path d=\"M0,5.71428571 L3.42857143,9.14285714\"></path>\n                            <path d=\"M9.14285714,0 L3.42857143,9.14285714\"></path>\n                          </g>\n                        </g>\n                      </g>\n                    </svg>\n                  </span>\n                  <input id=\"checkbox-2\" type=\"checkbox\" role=\"checkbox\" aria-checked=\"true\" aria-labelledby=\"checkbox-label-2\" checked=\"\" value=\"on\">\n                </span>\n                <span part=\"text\" id=\"checkbox-text-2\" class=\"checkbox__text\">\n                  <slot></slot>\n                </span>\n              </label>\n            </div>\n            <div aria-hidden=\"true\" class=\"form-control__error-text\" id=\"input-error-text-2\" part=\"error-text\">\n              <slot name=\"error-text\"></slot>\n            </div>\n            <div aria-hidden=\"true\" class=\"form-control__help-text\" part=\"help-text\">\n                <slot name=\"help-text\"></slot>\n            </div>\n          </div>\n        </mock:shadow-root>\n    </six-checkbox>\n    `);\n  });\n});\n"]}

package/dist/collection/components/six-datepicker/components/day-selection.js

@@ -0,0 +1,12 @@
+import { h } from "@stencil/core";
+export const DaySelection = (daySelectionParams) => {
+    return (h("table", { class: "datepicker-table", part: "day-selection" }, h("thead", { part: "weekday-header" }, daySelectionParams.locale.weekdaysMin.map((weekday) => (h("th", { class: "datepicker__cell" }, weekday)))), h("tbody", null, daySelectionParams.calendarGrid.map((row) => (h("tr", { class: "datepicker-table__row" }, row.map((cell) => (h("td", { "data-date": cell.dateString, onClick: () => daySelectionParams.onClickDateCell(cell), class: {
+            'datepicker-table__cell': true,
+            'datepicker-table__cell--is-today': cell.isToday,
+            'datepicker-table__cell--is-selected': cell.isSelected,
+            'datepicker-table__cell--is-outdated': cell.isOutdated,
+            'datepicker-table__cell--is-disabled': cell.isDisabled,
+            'datepicker-table__cell--is-selectable': !cell.isDisabled,
+        } }, cell.label)))))))));
+};
+//# sourceMappingURL=day-selection.js.map

package/dist/collection/components/six-datepicker/components/day-selection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"day-selection.js","sourceRoot":"","sources":["../../../../src/components/six-datepicker/components/day-selection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AASlC,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,kBAAsC,EAAE,EAAE;IACrE,OAAO,CACL,aAAO,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,eAAe;QAClD,aAAO,IAAI,EAAC,gBAAgB,IACzB,kBAAkB,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACtD,UAAI,KAAK,EAAC,kBAAkB,IAAE,OAAO,CAAM,CAC5C,CAAC,CACI;QACR,iBACG,kBAAkB,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAC5C,UAAI,KAAK,EAAC,uBAAuB,IAC9B,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACjB,uBACa,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,eAAe,CAAC,IAAI,CAAC,EACvD,KAAK,EAAE;gBACL,wBAAwB,EAAE,IAAI;gBAC9B,kCAAkC,EAAE,IAAI,CAAC,OAAO;gBAChD,qCAAqC,EAAE,IAAI,CAAC,UAAU;gBACtD,qCAAqC,EAAE,IAAI,CAAC,UAAU;gBACtD,qCAAqC,EAAE,IAAI,CAAC,UAAU;gBACtD,uCAAuC,EAAE,CAAC,IAAI,CAAC,UAAU;aAC1D,IAEA,IAAI,CAAC,KAAK,CACR,CACN,CAAC,CACC,CACN,CAAC,CACI,CACF,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { DateLocale } from '../../../utils/date-util';\nimport { CalendarCell } from '../six-datepicker';\n\ninterface DaySelectionParams {\n  locale: DateLocale;\n  calendarGrid: CalendarCell[][];\n  onClickDateCell: (cell: CalendarCell) => void;\n}\nexport const DaySelection = (daySelectionParams: DaySelectionParams) => {\n  return (\n    <table class=\"datepicker-table\" part=\"day-selection\">\n      <thead part=\"weekday-header\">\n        {daySelectionParams.locale.weekdaysMin.map((weekday) => (\n          <th class=\"datepicker__cell\">{weekday}</th>\n        ))}\n      </thead>\n      <tbody>\n        {daySelectionParams.calendarGrid.map((row) => (\n          <tr class=\"datepicker-table__row\">\n            {row.map((cell) => (\n              <td\n                data-date={cell.dateString}\n                onClick={() => daySelectionParams.onClickDateCell(cell)}\n                class={{\n                  'datepicker-table__cell': true,\n                  'datepicker-table__cell--is-today': cell.isToday,\n                  'datepicker-table__cell--is-selected': cell.isSelected,\n                  'datepicker-table__cell--is-outdated': cell.isOutdated,\n                  'datepicker-table__cell--is-disabled': cell.isDisabled,\n                  'datepicker-table__cell--is-selectable': !cell.isDisabled,\n                }}\n              >\n                {cell.label}\n              </td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n"]}

package/dist/collection/components/six-datepicker/components/month-selection.js

@@ -0,0 +1,13 @@
+import { h } from "@stencil/core";
+import { now } from "../../../utils/date-util";
+export const MonthSelection = (monthSelectionParams) => {
+    const locale = monthSelectionParams.locale;
+    const isToday = (value) => locale.monthsShort[now().getMonth()] === value;
+    const isSelectedMonth = (value) => { var _a; return ((_a = monthSelectionParams.selectedDate) === null || _a === void 0 ? void 0 : _a.getMonth()) === locale.monthsShort.findIndex((m) => m === value); };
+    return (h("table", { class: "datepicker-table", part: "month-selection" }, h("tbody", null, locale.monthsShortGrouped.map((row) => (h("tr", { class: "datepicker-table__row" }, row.map((month) => (h("td", { onClick: () => monthSelectionParams.onClickMonthCell(month), class: {
+            'datepicker-table__cell': true,
+            'datepicker-table__cell--is-today': isToday(month),
+            'datepicker-table__cell--is-selected': isSelectedMonth(month),
+        } }, month)))))))));
+};
+//# sourceMappingURL=month-selection.js.map

package/dist/collection/components/six-datepicker/components/month-selection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"month-selection.js","sourceRoot":"","sources":["../../../../src/components/six-datepicker/components/month-selection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAc,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAO3D,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,oBAA0C,EAAE,EAAE;IAC3E,MAAM,MAAM,GAAG,oBAAoB,CAAC,MAAM,CAAC;IAC3C,MAAM,OAAO,GAAG,CAAC,KAAa,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,EAAE,CAAC,QAAQ,EAAE,CAAC,KAAK,KAAK,CAAC;IAElF,MAAM,eAAe,GAAG,CAAC,KAAa,EAAE,EAAE,WACxC,OAAA,CAAA,MAAA,oBAAoB,CAAC,YAAY,0CAAE,QAAQ,EAAE,MAAK,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAA,EAAA,CAAC;IAErG,OAAO,CACL,aAAO,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,iBAAiB;QACpD,iBACG,MAAM,CAAC,kBAAkB,CAAC,GAAG,CAAC,CAAC,GAAa,EAAE,EAAE,CAAC,CAChD,UAAI,KAAK,EAAC,uBAAuB,IAC9B,GAAG,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAClB,UACE,OAAO,EAAE,GAAG,EAAE,CAAC,oBAAoB,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAC3D,KAAK,EAAE;gBACL,wBAAwB,EAAE,IAAI;gBAC9B,kCAAkC,EAAE,OAAO,CAAC,KAAK,CAAC;gBAClD,qCAAqC,EAAE,eAAe,CAAC,KAAK,CAAC;aAC9D,IAEA,KAAK,CACH,CACN,CAAC,CACC,CACN,CAAC,CACI,CACF,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { DateLocale, now } from '../../../utils/date-util';\n\ninterface MonthSelectionParams {\n  locale: DateLocale;\n  selectedDate?: Date;\n  onClickMonthCell: (month: string) => void;\n}\nexport const MonthSelection = (monthSelectionParams: MonthSelectionParams) => {\n  const locale = monthSelectionParams.locale;\n  const isToday = (value: string) => locale.monthsShort[now().getMonth()] === value;\n\n  const isSelectedMonth = (value: string) =>\n    monthSelectionParams.selectedDate?.getMonth() === locale.monthsShort.findIndex((m) => m === value);\n\n  return (\n    <table class=\"datepicker-table\" part=\"month-selection\">\n      <tbody>\n        {locale.monthsShortGrouped.map((row: string[]) => (\n          <tr class=\"datepicker-table__row\">\n            {row.map((month) => (\n              <td\n                onClick={() => monthSelectionParams.onClickMonthCell(month)}\n                class={{\n                  'datepicker-table__cell': true,\n                  'datepicker-table__cell--is-today': isToday(month),\n                  'datepicker-table__cell--is-selected': isSelectedMonth(month),\n                }}\n              >\n                {month}\n              </td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n"]}

package/dist/collection/components/six-datepicker/components/year-selection.js

@@ -0,0 +1,13 @@
+import { now } from "../../../utils/date-util";
+import { h } from "@stencil/core";
+export const YearSelection = (yearSelectionParams) => {
+    return (h("table", { class: "datepicker-table", part: "year-selection" }, h("tbody", null, yearSelectionParams.yearSelection.map((row) => (h("tr", { class: "datepicker-table__row" }, row.map((year) => {
+        var _a;
+        return (h("td", { onClick: () => yearSelectionParams.onClickYearCell(year), class: {
+                'datepicker-table__cell': true,
+                'datepicker-table__cell--is-today': now().getFullYear() === year,
+                'datepicker-table__cell--is-selected': ((_a = yearSelectionParams.selectedDate) === null || _a === void 0 ? void 0 : _a.getFullYear()) === year,
+            } }, year));
+    })))))));
+};
+//# sourceMappingURL=year-selection.js.map

package/dist/collection/components/six-datepicker/components/year-selection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"year-selection.js","sourceRoot":"","sources":["../../../../src/components/six-datepicker/components/year-selection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOlC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,mBAAwC,EAAE,EAAE;IACxE,OAAO,CACL,aAAO,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,gBAAgB;QACnD,iBACG,mBAAmB,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAC9C,UAAI,KAAK,EAAC,uBAAuB,IAC9B,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;;YAAC,OAAA,CACjB,UACE,OAAO,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,eAAe,CAAC,IAAI,CAAC,EACxD,KAAK,EAAE;oBACL,wBAAwB,EAAE,IAAI;oBAC9B,kCAAkC,EAAE,GAAG,EAAE,CAAC,WAAW,EAAE,KAAK,IAAI;oBAChE,qCAAqC,EAAE,CAAA,MAAA,mBAAmB,CAAC,YAAY,0CAAE,WAAW,EAAE,MAAK,IAAI;iBAChG,IAEA,IAAI,CACF,CACN,CAAA;SAAA,CAAC,CACC,CACN,CAAC,CACI,CACF,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { now } from '../../../utils/date-util';\nimport { h } from '@stencil/core';\n\ninterface YearSelectionParams {\n  selectedDate?: Date;\n  yearSelection: number[][];\n  onClickYearCell: (year: number) => void;\n}\nexport const YearSelection = (yearSelectionParams: YearSelectionParams) => {\n  return (\n    <table class=\"datepicker-table\" part=\"year-selection\">\n      <tbody>\n        {yearSelectionParams.yearSelection.map((row) => (\n          <tr class=\"datepicker-table__row\">\n            {row.map((year) => (\n              <td\n                onClick={() => yearSelectionParams.onClickYearCell(year)}\n                class={{\n                  'datepicker-table__cell': true,\n                  'datepicker-table__cell--is-today': now().getFullYear() === year,\n                  'datepicker-table__cell--is-selected': yearSelectionParams.selectedDate?.getFullYear() === year,\n                }}\n              >\n                {year}\n              </td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n"]}

package/dist/collection/components/six-datepicker/six-date-formats.js

@@ -0,0 +1,25 @@
+// eslint-disable-next-line @stencil-community/ban-exported-const-enums
+export var SixDateFormats;
+(function (SixDateFormats) {
+    SixDateFormats["DDMMYYY_DOT"] = "dd.mm.yyyy";
+    SixDateFormats["YYYYMMDD_DASH"] = "yyyy-mm-dd";
+    SixDateFormats["DDMMYYYY_DASH"] = "dd-mm-yyyy";
+    SixDateFormats["DDMMYYYY_SLASH"] = "dd/mm/yyyy";
+    SixDateFormats["YYYYMMDD_SLASH"] = "yyyy/mm/dd";
+    SixDateFormats["DDMMYY_DOT"] = "dd.mm.yy";
+    SixDateFormats["YYMMDD_DASH"] = "yy-mm-dd";
+    SixDateFormats["DDMMYY_DASH"] = "dd-mm-yy";
+    SixDateFormats["DDMMYY_SLASH"] = "dd/mm/yy";
+    SixDateFormats["YYMMDD_SLASH"] = "yy/mm/dd";
+    SixDateFormats["DDMMYYY_DOT_TIME"] = "dd.mm.yyyy hh:MM:ss";
+    SixDateFormats["YYYYMMDD_DASH_TIME"] = "yyyy-mm-dd hh:MM:ss";
+    SixDateFormats["DDMMYYYY_DASH_TIME"] = "dd-mm-yyyy hh:MM:ss";
+    SixDateFormats["DDMMYYYY_SLASH_TIME"] = "dd/mm/yyyy hh:MM:ss";
+    SixDateFormats["YYYYMMDD_SLASH_TIME"] = "yyyy/mm/dd hh:MM:ss";
+    SixDateFormats["DDMMYY_DOT_TIME"] = "dd.mm.yy hh:MM:ss";
+    SixDateFormats["YYMMDD_DASH_TIME"] = "yy-mm-dd hh:MM:ss";
+    SixDateFormats["DDMMYY_DASH_TIME"] = "dd-mm-yy hh:MM:ss";
+    SixDateFormats["DDMMYY_SLASH_TIME"] = "dd/mm/yy hh:MM:ss";
+    SixDateFormats["YYMMDD_SLASH_TIME"] = "yy/mm/dd hh:MM:ss";
+})(SixDateFormats || (SixDateFormats = {}));
+//# sourceMappingURL=six-date-formats.js.map

package/dist/collection/components/six-datepicker/six-date-formats.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"six-date-formats.js","sourceRoot":"","sources":["../../../src/components/six-datepicker/six-date-formats.tsx"],"names":[],"mappings":"AAAA,uEAAuE;AACvE,MAAM,CAAN,IAAY,cAsBX;AAtBD,WAAY,cAAc;IACxB,4CAA0B,CAAA;IAC1B,8CAA4B,CAAA;IAC5B,8CAA4B,CAAA;IAC5B,+CAA6B,CAAA;IAC7B,+CAA6B,CAAA;IAC7B,yCAAuB,CAAA;IACvB,0CAAwB,CAAA;IACxB,0CAAwB,CAAA;IACxB,2CAAyB,CAAA;IACzB,2CAAyB,CAAA;IAEzB,0DAAwC,CAAA;IACxC,4DAA0C,CAAA;IAC1C,4DAA0C,CAAA;IAC1C,6DAA2C,CAAA;IAC3C,6DAA2C,CAAA;IAC3C,uDAAqC,CAAA;IACrC,wDAAsC,CAAA;IACtC,wDAAsC,CAAA;IACtC,yDAAuC,CAAA;IACvC,yDAAuC,CAAA;AACzC,CAAC,EAtBW,cAAc,KAAd,cAAc,QAsBzB","sourcesContent":["// eslint-disable-next-line @stencil-community/ban-exported-const-enums\nexport enum SixDateFormats {\n  DDMMYYY_DOT = 'dd.mm.yyyy',\n  YYYYMMDD_DASH = 'yyyy-mm-dd',\n  DDMMYYYY_DASH = 'dd-mm-yyyy',\n  DDMMYYYY_SLASH = 'dd/mm/yyyy',\n  YYYYMMDD_SLASH = 'yyyy/mm/dd',\n  DDMMYY_DOT = 'dd.mm.yy',\n  YYMMDD_DASH = 'yy-mm-dd',\n  DDMMYY_DASH = 'dd-mm-yy',\n  DDMMYY_SLASH = 'dd/mm/yy',\n  YYMMDD_SLASH = 'yy/mm/dd',\n\n  DDMMYYY_DOT_TIME = 'dd.mm.yyyy hh:MM:ss',\n  YYYYMMDD_DASH_TIME = 'yyyy-mm-dd hh:MM:ss',\n  DDMMYYYY_DASH_TIME = 'dd-mm-yyyy hh:MM:ss',\n  DDMMYYYY_SLASH_TIME = 'dd/mm/yyyy hh:MM:ss',\n  YYYYMMDD_SLASH_TIME = 'yyyy/mm/dd hh:MM:ss',\n  DDMMYY_DOT_TIME = 'dd.mm.yy hh:MM:ss',\n  YYMMDD_DASH_TIME = 'yy-mm-dd hh:MM:ss',\n  DDMMYY_DASH_TIME = 'dd-mm-yy hh:MM:ss',\n  DDMMYY_SLASH_TIME = 'dd/mm/yy hh:MM:ss',\n  YYMMDD_SLASH_TIME = 'yy/mm/dd hh:MM:ss',\n}\n"]}

package/dist/collection/components/six-datepicker/six-datepicker.css

@@ -0,0 +1,156 @@
+:host {
+  position: relative;
+  box-sizing: border-box;
+}
+:host *, :host *:before, :host *:after {
+  box-sizing: border-box;
+}
+
+:host {
+  display: block;
+  font-family: var(--six-font-family);
+}
+
+.datepicker__container {
+  position: relative;
+}
+.datepicker__popup {
+  min-width: 400px;
+  background-color: white;
+  padding: 0.5em 0.5em 1.5em;
+  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
+  user-select: none;
+  position: absolute;
+  z-index: var(--six-z-index-dropdown);
+  right: 0;
+  left: 0;
+}
+.datepicker__popup--is-up {
+  bottom: 100%;
+  min-height: 382px;
+}
+.datepicker__popup--is-inline {
+  position: initial;
+  box-shadow: none;
+  border: 1px solid var(--six-color-web-rock-400);
+}
+
+.datepicker-header {
+  display: flex;
+  justify-content: space-between;
+  border-bottom: 1px solid var(--six-color-web-rock-400);
+  padding: 0.5em;
+  margin-bottom: 1em;
+}
+.datepicker-header svg {
+  fill: var(--six-color-web-rock-900);
+  stroke: none;
+}
+.datepicker-header__btn {
+  cursor: pointer;
+  width: 2.5em;
+  height: 2.5em;
+  display: flex;
+  vertical-align: middle;
+  align-items: center;
+  justify-content: center;
+}
+.datepicker-header__btn:hover {
+  background-color: var(--six-color-web-rock-100);
+  border-radius: 100%;
+}
+.datepicker-header__label {
+  display: flex;
+}
+.datepicker-header__label > div {
+  cursor: pointer;
+  padding: 0.5em;
+  display: flex;
+  vertical-align: middle;
+  align-items: center;
+  justify-content: center;
+}
+.datepicker-header__label > div:hover {
+  background-color: var(--six-color-web-rock-100);
+}
+
+.datepicker-table {
+  width: 100%;
+}
+.datepicker-table__cell {
+  text-align: center;
+  width: 2.5rem;
+  height: 2.5rem;
+  cursor: pointer;
+}
+.datepicker-table__cell:hover {
+  background-color: var(--six-color-web-rock-100);
+}
+.datepicker-table__cell--is-today {
+  border: 1px solid var(--six-color-web-rock-400);
+}
+.datepicker-table__cell--is-selected {
+  background-color: var(--six-color-red);
+  color: var(--six-color-white);
+}
+.datepicker-table__cell--is-disabled {
+  background-color: var(--six-color-web-rock-200);
+  cursor: initial;
+}
+.datepicker-table__cell--is-disabled:hover {
+  background-color: var(--six-color-web-rock-200);
+}
+.datepicker-table__cell--is-outdated {
+  color: var(--six-color-web-rock-400);
+}
+
+.datepicker-clear {
+  display: inline-flex;
+  align-items: center;
+  font-size: inherit;
+  color: var(--six-input-icon-color);
+  border: none;
+  background: none;
+  padding: 0;
+  transition: var(--six-transition-fast) color;
+  cursor: pointer;
+}
+.datepicker-clear:hover {
+  color: var(--six-input-icon-color-hover);
+}
+.datepicker-clear:focus {
+  outline: none;
+}
+.datepicker-clear--right {
+  right: 0;
+  position: absolute;
+}
+.datepicker-clear--left {
+  right: 35px;
+  position: absolute;
+}
+
+.input--empty .datepicker-clear {
+  visibility: hidden;
+}
+
+.prefix {
+  cursor: pointer;
+}
+.prefix--right {
+  right: 0;
+  display: inline-flex;
+  position: absolute;
+  font-size: inherit;
+  color: var(--six-input-icon-color);
+  border: none;
+  background: none;
+  margin-right: var(--six-input-spacing-medium);
+  transition: var(--six-transition-fast) color;
+}
+
+six-timepicker::part(popup) {
+  border: none;
+  padding: 0.5em 0.5em 0;
+  min-height: 0;
+}