@six-group/ui-library 0.0.0-insider.e8b5a11 → 0.0.0-insider.eb446eb

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

@@ -6,6 +6,17 @@
   box-sizing: border-box;
 }
 
+/* Hides content visually while still making it available to screen readers */
+.sr-only {
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+}
+
 :host {
   display: inline-block;
   width: auto;

package/dist/collection/components/six-button/six-button.js

@@ -104,7 +104,7 @@ export class SixButton {
         const isLink = this.href != null;
         const isButton = !isLink;
         const Button = isLink ? 'a' : 'button';
-        return (h("div", { key: '2fd3a9c4f7711290465961099b245c323139b817', onClick: this.handleClick, class: { 'button-wrapper--disabled': this.disabled } }, h(Button, { key: '4330f6a6cb46d3f34db0870b420efecafdc9913c', ref: (el) => (this.nativeButton = el), part: "base", class: {
+        return (h("div", { key: '6eba8f1f34f9dfa51d29e4349870994acf7b89fb', onClick: this.handleClick, class: { 'button-wrapper--disabled': this.disabled } }, h(Button, { key: '77cd544148f4ea4dcf2c6b34c4c6d62d4372372d', ref: (el) => (this.nativeButton = el), part: "base", class: {
                 button: true,
                 // Types
                 'button--secondary': this.type === 'secondary',
@@ -129,7 +129,7 @@ export class SixButton {
                 'button--has-label': this.hasLabel,
                 'button--has-prefix': this.hasPrefix,
                 'button--has-suffix': this.hasSuffix,
-            }, disabled: isButton ? this.disabled : undefined, tabindex: this.disabled ? '-1' : undefined, type: isButton ? (this.submit ? 'submit' : this.reset ? 'reset' : 'button') : undefined, name: isButton ? this.name : undefined, value: isButton ? this.value : undefined, href: isLink ? this.href : undefined, target: isLink && this.target != null ? this.target : undefined, download: isLink && this.download != null ? this.download : undefined, rel: isLink && this.target != null ? 'noreferrer noopener' : undefined, onBlur: this.handleBlur, onFocus: this.handleFocus, "data-testid": "button" }, h("span", { key: 'd2cb3cd3d699da69e4f4db249d0a25fc0fc6a4cc', part: "prefix", class: "button__prefix" }, h("slot", { key: '537e43865e5ef8fc0a09ca66c262fdf722685037', onSlotchange: this.handleSlotChange, name: "prefix" })), h("span", { key: '965d7720a89a3a2af615a891454c6ba0ca890aa3', part: "label", class: "button__label" }, h("slot", { key: '1056dfc6a614f61187ffa2edcb7bfaba27680a3e', onSlotchange: this.handleSlotChange })), h("span", { key: 'cc1df5769286f43052402cee71d8a946ded3e790', part: "suffix", class: "button__suffix" }, h("slot", { key: 'eba52e13592610c85159892e60e343b06f6ca7c2', onSlotchange: this.handleSlotChange, name: "suffix" })), this.caret && (h("span", { key: 'f4f51eeb17b00099c6918a8a393f10984e24f809', part: "caret", class: "button__caret" }, h("svg", { key: 'bbdc4a79b99c3f93dabd76033d109f2cb020b29d', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: '953a8016733d8d8c7a9da3144fb46fe4602ceaea', points: "6 9 12 15 18 9" })))), this.loading && h("six-spinner", { key: '2a195cdb2583e91316f333fbb0c74d04ee9fa0c3' }))));
+            }, disabled: isButton ? this.disabled : undefined, tabindex: this.disabled ? '-1' : undefined, type: isButton ? (this.submit ? 'submit' : this.reset ? 'reset' : 'button') : undefined, name: isButton ? this.name : undefined, value: isButton ? this.value : undefined, href: isLink ? this.href : undefined, target: isLink && this.target != null ? this.target : undefined, download: isLink && this.download != null ? this.download : undefined, rel: isLink && this.target != null ? 'noreferrer noopener' : undefined, onBlur: this.handleBlur, onFocus: this.handleFocus, "data-testid": "button" }, h("span", { key: '0fb19c85adc826ed6e92b306f734185e3557e30f', part: "prefix", class: "button__prefix" }, h("slot", { key: '8223eb8644d495ef27cd175a905ab68c3d10f14f', onSlotchange: this.handleSlotChange, name: "prefix" })), h("span", { key: '00d407ea8d28b9e515992a872cc91705e2906a24', part: "label", class: "button__label" }, h("slot", { key: '28fb5d1061bfdf0f404e2241ccf6f16b4e113ba7', onSlotchange: this.handleSlotChange })), h("span", { key: '65e82de3e6851445627b31212bbbeccc8ca85d35', part: "suffix", class: "button__suffix" }, h("slot", { key: 'd9608fad50cafb5fcc14e1eecd9e47cf99edcb14', onSlotchange: this.handleSlotChange, name: "suffix" })), this.caret && (h("span", { key: '4c8b4ad77d69e4a189621f53e3c20dbb7504c4cb', part: "caret", class: "button__caret" }, h("svg", { key: '16b2146dd6bd99677cadb4b2fe5cf67a4e32a39d', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: '4cdd831978519dcb553a929fe54f6bd49b25fbc5', points: "6 9 12 15 18 9" })))), this.loading && h("six-spinner", { key: 'df087e05782f46995bdc6f6325b4a610f74ce971' }))));
     }
     static get is() { return "six-button"; }
     static get encapsulation() { return "shadow"; }
@@ -147,6 +147,7 @@ export class SixButton {
         return {
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "| 'secondary'\n    | 'primary'\n    | 'link'\n    | 'success'\n    | 'warning'\n    | 'danger'\n    | 'action'\n    | 'action-outline'",
@@ -161,12 +162,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "type",
                 "reflect": true,
                 "defaultValue": "'primary'"
             },
             "size": {
                 "type": "string",
+                "attribute": "size",
                 "mutable": false,
                 "complexType": {
                     "original": "'small' | 'medium' | 'large'",
@@ -181,12 +182,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "size",
                 "reflect": true,
                 "defaultValue": "'medium'"
             },
             "caret": {
                 "type": "boolean",
+                "attribute": "caret",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -201,12 +202,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "caret",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -221,12 +222,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "disabled",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "loading": {
                 "type": "boolean",
+                "attribute": "loading",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -241,12 +242,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "loading",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "pill": {
                 "type": "boolean",
+                "attribute": "pill",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -261,12 +262,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "pill",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "circle": {
                 "type": "boolean",
+                "attribute": "circle",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -281,12 +282,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "circle",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "submit": {
                 "type": "boolean",
+                "attribute": "submit",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -301,12 +302,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "submit",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "reset": {
                 "type": "boolean",
+                "attribute": "reset",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -321,12 +322,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "reset",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "name": {
                 "type": "string",
+                "attribute": "name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -341,12 +342,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "name",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "value": {
                 "type": "string",
+                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -361,12 +362,12 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "value",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "href": {
                 "type": "string",
+                "attribute": "href",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -381,11 +382,11 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "href",
                 "reflect": false
             },
             "target": {
                 "type": "string",
+                "attribute": "target",
                 "mutable": false,
                 "complexType": {
                     "original": "'_blank' | '_parent' | '_self' | '_top'",
@@ -400,11 +401,11 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "target",
                 "reflect": false
             },
             "download": {
                 "type": "string",
+                "attribute": "download",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -419,7 +420,6 @@ export class SixButton {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "download",
                 "reflect": false
             }
         };

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

@@ -6,6 +6,17 @@
   box-sizing: border-box;
 }
 
+/* Hides content visually while still making it available to screen readers */
+.sr-only {
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+}
+
 :host {
   display: inline-block;
   box-shadow: var(--six-shadow-medium);

package/dist/collection/components/six-card/six-card.js

@@ -7,7 +7,7 @@ import { h, Host } from "@stencil/core";
  */
 export class SixCard {
     render() {
-        return (h(Host, { key: 'd2459e12a9f8274f095a3d09a077c59a7f091dea' }, h("slot", { key: '1619a201af796250d6808a0974047644e7fb6a69' })));
+        return (h(Host, { key: '8ba5461ffe1740e8f2b7061701cf8f06e24adc25' }, h("slot", { key: '95fde97191f2c89fe76643450e6e9eb4dcbe9fa2' })));
     }
     static get is() { return "six-card"; }
     static get encapsulation() { return "shadow"; }

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

@@ -6,6 +6,17 @@
   box-sizing: border-box;
 }
 
+/* Hides content visually while still making it available to screen readers */
+.sr-only {
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  height: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  width: 1px;
+}
+
 .form-control .form-control__label {
   display: none;
 }

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

@@ -121,14 +121,14 @@ export class SixCheckbox {
         this.hasErrorSlot = hasSlot(this.host, 'error-text');
     }
     render() {
-        return (h(FormControl, { key: 'fb33e858f751205c8df374f3bcca37cec9f8203b', inputId: this.inputId, label: this.label, labelId: this.labelId, hasLabelSlot: this.hasLabelSlot, errorTextId: this.errorTextId, hasErrorTextSlot: this.hasErrorSlot, errorText: this.errorText, errorTextCount: this.errorTextCount, size: "medium", disabled: this.disabled, required: this.required, displayError: this.invalid }, h("label", { key: '35bfda441fe651af25cb45d75d003919c7869ae2', part: "base", class: {
+        return (h(FormControl, { key: 'cf87dbd9fbe4063c8579a41e729f06f6ea4ad41c', inputId: this.inputId, label: this.label, labelId: this.labelId, hasLabelSlot: this.hasLabelSlot, errorTextId: this.errorTextId, hasErrorTextSlot: this.hasErrorSlot, errorText: this.errorText, errorTextCount: this.errorTextCount, size: "medium", disabled: this.disabled, required: this.required, displayError: this.invalid }, h("label", { key: 'c3b2be07e9c25c226cac5d2d71d76e4096af15f8', part: "base", class: {
                 checkbox: true,
                 'checkbox--checked': this.checked,
                 'checkbox--disabled': this.disabled,
                 'checkbox--focused': this.hasFocus,
                 'checkbox--invalid': this.invalid,
                 'checkbox--indeterminate': this.indeterminate,
-            }, htmlFor: this.inputId, onMouseDown: this.handleMouseDown }, h("span", { key: '92d31ea45a0f1f45230def64e15bd0e81c4de140', part: "control", class: "checkbox__control" }, this.checked && (h("span", { key: '49501ea788463f4d39c5500349ace013c21d31c2', part: "checked-icon", class: "checkbox__icon" }, h("svg", { key: '8ae0e9bfe850b13a205722a5e17e90b21ad35f26', viewBox: "0 0 16 16" }, h("g", { key: '463b4761b130e5e9377efb7e26f57218ce5249ad', stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd", "stroke-linecap": "round" }, h("g", { key: '147d4348146dcace57835e436453bc834763c464', stroke: "currentColor", "stroke-width": "2" }, h("g", { key: '6596f4cd75b94d8ff3bef19698acc56a6eab847a', transform: "translate(3.428571, 3.428571)" }, h("path", { key: '453cfb8ae9d6d4e45f1b569e06ba79ac2a0d2b9c', d: "M0,5.71428571 L3.42857143,9.14285714" }), h("path", { key: 'b650801a5ae8fde8886b9e1fb4257eca704beabd', d: "M9.14285714,0 L3.42857143,9.14285714" }))))))), !this.checked && this.indeterminate && (h("span", { key: 'ab31b1999eae88b74c5bdeb1bbc1007b0459f8a8', part: "indeterminate-icon", class: "checkbox__icon" }, h("svg", { key: '8d5cf52fc16243531056ba760d9c770decd593e3', viewBox: "0 0 16 16" }, h("g", { key: 'fb8ee93f8ec5abc82f8d982cc2ad59c4ae77fb91', stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd", "stroke-linecap": "round" }, h("g", { key: '825161dbc71cfc395061b3ef485352762c8780c5', stroke: "currentColor", "stroke-width": "2" }, h("g", { key: 'c5541fd6e2d69a376278cd617447a8b9bfe6a0d6', transform: "translate(2.285714, 6.857143)" }, h("path", { key: '6c1f488d0572c2773b8497cd6214dcfdc64164ef', d: "M10.2857143,1.14285714 L1.14285714,1.14285714" }))))))), h("input", { key: '2e8ac6e459e47708116702585a5155ee4385d021', ref: (el) => (this.nativeInput = el), id: this.inputId, type: "checkbox", name: this.name, value: this.value, checked: this.checked, disabled: this.disabled, required: this.required, role: "checkbox", "aria-checked": this.checked ? 'true' : 'false', "aria-labelledby": this.labelId, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus })), h("span", { key: '817dae0dcffedf7de011d0fa68ce3a1ca45bbd3a', part: "text", id: this.textId, class: "checkbox__text" }, h("slot", { key: 'e0f9b77cf11c592efd6b312888491a3b5e84bb32' })))));
+            }, htmlFor: this.inputId, onMouseDown: this.handleMouseDown }, h("span", { key: '9c01a62b12b784e69e8ce7fd52f48aed3e86c278', part: "control", class: "checkbox__control" }, this.checked && (h("span", { key: '9d755d8a162152a268f8883abaeb15d33c3a48e7', part: "checked-icon", class: "checkbox__icon" }, h("svg", { key: 'ca598e4be471eb72eb0c416a2d2bf6d79fa51fe4', viewBox: "0 0 16 16" }, h("g", { key: 'dd4db42d3000bf096968520e15cc85f94140c7e3', stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd", "stroke-linecap": "round" }, h("g", { key: '8d83aa9af87622aaf724fa2ed91c18ac3df9cba6', stroke: "currentColor", "stroke-width": "2" }, h("g", { key: 'dd5d60bb007d3f493f7ab19b9fa8b2973a596707', transform: "translate(3.428571, 3.428571)" }, h("path", { key: '474b99c56df6507a6013ffbc3fcb5dab7479c79e', d: "M0,5.71428571 L3.42857143,9.14285714" }), h("path", { key: '2b8965fb78d5eed486589c93473d0e3ec2569a16', d: "M9.14285714,0 L3.42857143,9.14285714" }))))))), !this.checked && this.indeterminate && (h("span", { key: '860e7c9141f737a325bd95731fd8600e00c35db4', part: "indeterminate-icon", class: "checkbox__icon" }, h("svg", { key: 'ef9a9f0d090da9bb754e85a06652c00433fa90a9', viewBox: "0 0 16 16" }, h("g", { key: 'dc8235d73ef8b7658519f3acfb7fd56349801404', stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd", "stroke-linecap": "round" }, h("g", { key: '62987b29c7c3f6bbacf4feef4e4beaf31bf722ed', stroke: "currentColor", "stroke-width": "2" }, h("g", { key: '6be444ed0dd4cbae66f570afa0b85152b1f4da96', transform: "translate(2.285714, 6.857143)" }, h("path", { key: 'bcd6968d3eee416a62ad75570a0402654c2efc04', d: "M10.2857143,1.14285714 L1.14285714,1.14285714" }))))))), h("input", { key: '38c2532ca810970494543d5eca8927c26cf92e78', ref: (el) => (this.nativeInput = el), id: this.inputId, type: "checkbox", name: this.name, value: this.value, checked: this.checked, disabled: this.disabled, required: this.required, role: "checkbox", "aria-checked": this.checked ? 'true' : 'false', "aria-labelledby": this.labelId, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus })), h("span", { key: '1c12af81f2b724803cf2224d4ff8178774b4f7ea', part: "text", id: this.textId, class: "checkbox__text" }, h("slot", { key: '488fe82970614b07112449e67d4374b1cc186dfe' })))));
     }
     static get is() { return "six-checkbox"; }
     static get encapsulation() { return "shadow"; }
@@ -146,6 +146,7 @@ export class SixCheckbox {
         return {
             "name": {
                 "type": "string",
+                "attribute": "name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -160,12 +161,12 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "name",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "value": {
                 "type": "string",
+                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -180,12 +181,12 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "value",
                 "reflect": false,
                 "defaultValue": "'on'"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -200,12 +201,12 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "required": {
                 "type": "boolean",
+                "attribute": "required",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -220,12 +221,12 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "required",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "label": {
                 "type": "string",
+                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -240,12 +241,12 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "label",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "errorText": {
                 "type": "string",
+                "attribute": "error-text",
                 "mutable": false,
                 "complexType": {
                     "original": "string | string[]",
@@ -260,12 +261,12 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "error-text",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "errorTextCount": {
                 "type": "number",
+                "attribute": "error-text-count",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -280,11 +281,11 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "error-text-count",
                 "reflect": false
             },
             "invalid": {
                 "type": "boolean",
+                "attribute": "invalid",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -299,12 +300,12 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "invalid",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "checked": {
                 "type": "boolean",
+                "attribute": "checked",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -319,12 +320,12 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "checked",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "indeterminate": {
                 "type": "boolean",
+                "attribute": "indeterminate",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -339,7 +340,6 @@ export class SixCheckbox {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "indeterminate",
                 "reflect": true,
                 "defaultValue": "false"
             }

package/dist/collection/components/six-date/calendar-grid.js

@@ -0,0 +1,30 @@
+import { fromDate, today } from "./iso-date";
+import { eachDayOfInterval, endOfMonth, endOfWeek, formatDate, startOfWeek } from "date-fns";
+export function createCalendarGrid(options) {
+    const firstDayOfMonth = new Date(options.year, options.month - 1, 1);
+    const daysInCalendarMonth = eachDayOfInterval({
+        start: startOfWeek(firstDayOfMonth, { weekStartsOn: 1 }),
+        end: endOfWeek(endOfMonth(firstDayOfMonth), { weekStartsOn: 1 }),
+    });
+    const calendarGrid = [];
+    for (const day of daysInCalendarMonth) {
+        const isoDate = fromDate(day);
+        const isInMonth = day.getMonth() === options.month - 1;
+        const isBeforeMinDate = options.minDate == null ? false : isoDate < options.minDate;
+        const isAfterMaxDate = options.maxDate == null ? false : isoDate > options.maxDate;
+        const isDateAllowed = options.allowedDates === undefined ? true : options.allowedDates(isoDate);
+        const isDisabled = !isDateAllowed || isBeforeMinDate || isAfterMaxDate;
+        const isToday = isoDate === today();
+        calendarGrid.push({
+            date: fromDate(day),
+            label: day.getDate().toString(),
+            display: formatDate(day, options.dateFormat),
+            disabled: isDisabled,
+            outdated: !isInMonth,
+            selected: options.selected === isoDate,
+            today: isToday,
+        });
+    }
+    return calendarGrid;
+}
+//# sourceMappingURL=calendar-grid.js.map

package/dist/collection/components/six-date/calendar-grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-grid.js","sourceRoot":"","sources":["../../../src/components/six-date/calendar-grid.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAW,KAAK,EAAE,MAAM,YAAY,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAsB7F,MAAM,UAAU,kBAAkB,CAAC,OAA4B;IAC7D,MAAM,eAAe,GAAG,IAAI,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IACrE,MAAM,mBAAmB,GAAG,iBAAiB,CAAC;QAC5C,KAAK,EAAE,WAAW,CAAC,eAAe,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;QACxD,GAAG,EAAE,SAAS,CAAC,UAAU,CAAC,eAAe,CAAC,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC;KACjE,CAAC,CAAC;IACH,MAAM,YAAY,GAAmB,EAAE,CAAC;IAExC,KAAK,MAAM,GAAG,IAAI,mBAAmB,EAAE,CAAC;QACtC,MAAM,OAAO,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC;QAC9B,MAAM,SAAS,GAAG,GAAG,CAAC,QAAQ,EAAE,KAAK,OAAO,CAAC,KAAK,GAAG,CAAC,CAAC;QACvD,MAAM,eAAe,GAAG,OAAO,CAAC,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;QACpF,MAAM,cAAc,GAAG,OAAO,CAAC,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;QACnF,MAAM,aAAa,GAAG,OAAO,CAAC,YAAY,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QAChG,MAAM,UAAU,GAAG,CAAC,aAAa,IAAI,eAAe,IAAI,cAAc,CAAC;QACvE,MAAM,OAAO,GAAG,OAAO,KAAK,KAAK,EAAE,CAAC;QACpC,YAAY,CAAC,IAAI,CAAC;YAChB,IAAI,EAAE,QAAQ,CAAC,GAAG,CAAC;YACnB,KAAK,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC,QAAQ,EAAE;YAC/B,OAAO,EAAE,UAAU,CAAC,GAAG,EAAE,OAAO,CAAC,UAAU,CAAC;YAC5C,QAAQ,EAAE,UAAU;YACpB,QAAQ,EAAE,CAAC,SAAS;YACpB,QAAQ,EAAE,OAAO,CAAC,QAAQ,KAAK,OAAO;YACtC,KAAK,EAAE,OAAO;SACf,CAAC,CAAC;IACL,CAAC;IAED,OAAO,YAAY,CAAC;AACtB,CAAC","sourcesContent":["import { fromDate, IsoDate, today } from './iso-date';\nimport { eachDayOfInterval, endOfMonth, endOfWeek, formatDate, startOfWeek } from 'date-fns';\n\nexport interface CalendarCell {\n  date: IsoDate;\n  label: string;\n  display: string;\n  disabled: boolean;\n  outdated: boolean;\n  selected: boolean;\n  today: boolean;\n}\n\nexport interface CalendarGridOptions {\n  year: number;\n  month: number;\n  selected?: IsoDate;\n  minDate?: IsoDate;\n  maxDate?: IsoDate;\n  dateFormat: string;\n  allowedDates?: (date: IsoDate) => boolean;\n}\n\nexport function createCalendarGrid(options: CalendarGridOptions): CalendarCell[] {\n  const firstDayOfMonth = new Date(options.year, options.month - 1, 1);\n  const daysInCalendarMonth = eachDayOfInterval({\n    start: startOfWeek(firstDayOfMonth, { weekStartsOn: 1 }),\n    end: endOfWeek(endOfMonth(firstDayOfMonth), { weekStartsOn: 1 }),\n  });\n  const calendarGrid: CalendarCell[] = [];\n\n  for (const day of daysInCalendarMonth) {\n    const isoDate = fromDate(day);\n    const isInMonth = day.getMonth() === options.month - 1;\n    const isBeforeMinDate = options.minDate == null ? false : isoDate < options.minDate;\n    const isAfterMaxDate = options.maxDate == null ? false : isoDate > options.maxDate;\n    const isDateAllowed = options.allowedDates === undefined ? true : options.allowedDates(isoDate);\n    const isDisabled = !isDateAllowed || isBeforeMinDate || isAfterMaxDate;\n    const isToday = isoDate === today();\n    calendarGrid.push({\n      date: fromDate(day),\n      label: day.getDate().toString(),\n      display: formatDate(day, options.dateFormat),\n      disabled: isDisabled,\n      outdated: !isInMonth,\n      selected: options.selected === isoDate,\n      today: isToday,\n    });\n  }\n\n  return calendarGrid;\n}\n"]}

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

@@ -0,0 +1,16 @@
+import { h } from "@stencil/core";
+import { translateWeekday } from "../translations";
+export const DaySelection = (props) => {
+    return (h("div", { class: "day-selection" }, [1, 2, 3, 4, 5, 6, 7].map((day) => (h("div", { class: "cell--header" }, translateWeekday(day, props.language)))), props.calendarGrid.map((day) => (h("div", { "data-date": day.date, onClick: () => {
+            if (!day.disabled || day.outdated) {
+                props.dayClicked(day.date);
+            }
+        }, class: {
+            cell: true,
+            'cell--today': day.today,
+            'cell--selected': day.selected,
+            'cell--outdated': day.outdated,
+            'cell--disabled': day.disabled,
+        } }, h("span", { class: "label" }, day.label))))));
+};
+//# sourceMappingURL=day-selection.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"day-selection.js","sourceRoot":"","sources":["../../../../src/components/six-date/components/day-selection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAElC,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAInD,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAI5B,EAAE,EAAE;IACH,OAAO,CACL,WAAK,KAAK,EAAC,eAAe;QACvB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAClC,WAAK,KAAK,EAAC,cAAc,IAAE,gBAAgB,CAAC,GAAG,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAO,CACxE,CAAC;QACD,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAC/B,wBACa,GAAG,CAAC,IAAI,EACnB,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,CAAC,GAAG,CAAC,QAAQ,IAAI,GAAG,CAAC,QAAQ,EAAE,CAAC;oBAClC,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;gBAC7B,CAAC;YACH,CAAC,EACD,KAAK,EAAE;gBACL,IAAI,EAAE,IAAI;gBACV,aAAa,EAAE,GAAG,CAAC,KAAK;gBACxB,gBAAgB,EAAE,GAAG,CAAC,QAAQ;gBAC9B,gBAAgB,EAAE,GAAG,CAAC,QAAQ;gBAC9B,gBAAgB,EAAE,GAAG,CAAC,QAAQ;aAC/B;YAED,YAAM,KAAK,EAAC,OAAO,IAAE,GAAG,CAAC,KAAK,CAAQ,CAClC,CACP,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { Language } from '../../../utils/error-messages';\nimport { translateWeekday } from '../translations';\nimport { CalendarCell } from '../calendar-grid';\nimport { IsoDate } from '../iso-date';\n\nexport const DaySelection = (props: {\n  language: Language;\n  calendarGrid: CalendarCell[];\n  dayClicked: (cell: IsoDate) => void;\n}) => {\n  return (\n    <div class=\"day-selection\">\n      {[1, 2, 3, 4, 5, 6, 7].map((day) => (\n        <div class=\"cell--header\">{translateWeekday(day, props.language)}</div>\n      ))}\n      {props.calendarGrid.map((day) => (\n        <div\n          data-date={day.date}\n          onClick={() => {\n            if (!day.disabled || day.outdated) {\n              props.dayClicked(day.date);\n            }\n          }}\n          class={{\n            cell: true,\n            'cell--today': day.today,\n            'cell--selected': day.selected,\n            'cell--outdated': day.outdated,\n            'cell--disabled': day.disabled,\n          }}\n        >\n          <span class=\"label\">{day.label}</span>\n        </div>\n      ))}\n    </div>\n  );\n};\n"]}

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

@@ -0,0 +1,17 @@
+import { h } from "@stencil/core";
+import { getMonth, today } from "../iso-date";
+import { translateMonthShort } from "../translations";
+export const MonthSelection = (props) => {
+    const months = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].map((month) => ({
+        month,
+        label: translateMonthShort(month, props.language),
+        today: getMonth(today()) === month,
+        selected: props.selected === '' ? false : getMonth(props.selected) === month,
+    }));
+    return (h("div", { class: "month-selection" }, months.map((month) => (h("div", { class: {
+            cell: true,
+            'cell--today': month.today,
+            'cell--selected': month.selected,
+        }, onClick: () => props.monthClicked(month.month) }, h("span", { class: "label" }, month.label))))));
+};
+//# sourceMappingURL=month-selection.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"month-selection.js","sourceRoot":"","sources":["../../../../src/components/six-date/components/month-selection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAW,KAAK,EAAE,MAAM,aAAa,CAAC;AAEvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAEtD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAI9B,EAAE,EAAE;IACH,MAAM,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QACrE,KAAK;QACL,KAAK,EAAE,mBAAmB,CAAC,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC;QACjD,KAAK,EAAE,QAAQ,CAAC,KAAK,EAAE,CAAC,KAAK,KAAK;QAClC,QAAQ,EAAE,KAAK,CAAC,QAAQ,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,KAAK;KAC7E,CAAC,CAAC,CAAC;IAEJ,OAAO,CACL,WAAK,KAAK,EAAC,iBAAiB,IACzB,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACrB,WACE,KAAK,EAAE;YACL,IAAI,EAAE,IAAI;YACV,aAAa,EAAE,KAAK,CAAC,KAAK;YAC1B,gBAAgB,EAAE,KAAK,CAAC,QAAQ;SACjC,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,CAAC;QAE9C,YAAM,KAAK,EAAC,OAAO,IAAE,KAAK,CAAC,KAAK,CAAQ,CACpC,CACP,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { getMonth, IsoDate, today } from '../iso-date';\nimport { Language } from '../../../utils/error-messages';\nimport { translateMonthShort } from '../translations';\n\nexport const MonthSelection = (props: {\n  language: Language;\n  selected: IsoDate | '';\n  monthClicked: (month: number) => void;\n}) => {\n  const months = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].map((month) => ({\n    month,\n    label: translateMonthShort(month, props.language),\n    today: getMonth(today()) === month,\n    selected: props.selected === '' ? false : getMonth(props.selected) === month,\n  }));\n\n  return (\n    <div class=\"month-selection\">\n      {months.map((month) => (\n        <div\n          class={{\n            cell: true,\n            'cell--today': month.today,\n            'cell--selected': month.selected,\n          }}\n          onClick={() => props.monthClicked(month.month)}\n        >\n          <span class=\"label\">{month.label}</span>\n        </div>\n      ))}\n    </div>\n  );\n};\n"]}

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

@@ -0,0 +1,16 @@
+import { h } from "@stencil/core";
+import { getYear, today } from "../iso-date";
+export const YearSelection = (props) => {
+    const years = Array.from({ length: props.yearCount }, (_, i) => props.pointerYear - 12 + i);
+    const yearsToDisplay = years.map((year) => ({
+        year: year,
+        today: getYear(today()) === year,
+        selected: props.selected === '' ? false : getYear(props.selected) === year,
+    }));
+    return (h("div", { class: "year-selection" }, yearsToDisplay.map((year) => (h("div", { class: {
+            cell: true,
+            'cell--today': year.today,
+            'cell--selected': year.selected,
+        }, onClick: () => props.yearClicked(year.year) }, h("span", { class: "label" }, year.year))))));
+};
+//# sourceMappingURL=year-selection.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"year-selection.js","sourceRoot":"","sources":["../../../../src/components/six-date/components/year-selection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,OAAO,EAAW,KAAK,EAAE,MAAM,aAAa,CAAC;AAEtD,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAK7B,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,WAAW,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;IAC5F,MAAM,cAAc,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QAC1C,IAAI,EAAE,IAAI;QACV,KAAK,EAAE,OAAO,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI;QAChC,QAAQ,EAAE,KAAK,CAAC,QAAQ,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,IAAI;KAC3E,CAAC,CAAC,CAAC;IAEJ,OAAO,CACL,WAAK,KAAK,EAAC,gBAAgB,IACxB,cAAc,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC5B,WACE,KAAK,EAAE;YACL,IAAI,EAAE,IAAI;YACV,aAAa,EAAE,IAAI,CAAC,KAAK;YACzB,gBAAgB,EAAE,IAAI,CAAC,QAAQ;SAChC,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;QAE3C,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,IAAI,CAAQ,CAClC,CACP,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { getYear, IsoDate, today } from '../iso-date';\n\nexport const YearSelection = (props: {\n  selected: IsoDate | '';\n  pointerYear: number;\n  yearCount: number;\n  yearClicked: (year: number) => void;\n}) => {\n  const years = Array.from({ length: props.yearCount }, (_, i) => props.pointerYear - 12 + i);\n  const yearsToDisplay = years.map((year) => ({\n    year: year,\n    today: getYear(today()) === year,\n    selected: props.selected === '' ? false : getYear(props.selected) === year,\n  }));\n\n  return (\n    <div class=\"year-selection\">\n      {yearsToDisplay.map((year) => (\n        <div\n          class={{\n            cell: true,\n            'cell--today': year.today,\n            'cell--selected': year.selected,\n          }}\n          onClick={() => props.yearClicked(year.year)}\n        >\n          <span class=\"label\">{year.year}</span>\n        </div>\n      ))}\n    </div>\n  );\n};\n"]}