@tmorrow/cre8-wc 1.1.2 → 1.1.3

package/lib/components/danger-button/danger-button.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"danger-button.styles.js","sourceRoot":"","sources":["../../../components/danger-button/danger-button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,MAAM,GAAG,GAAG,CAAA,u4tBAAu4tB,CAAC;AAC15tB,eAAe,MAAM,CAAC","sourcesContent":["import { css } from 'lit';\nconst styles = css`*,::slotted(*),*:before,*:after{box-sizing:border-box}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{--cre8-z-index-1: 1;--cre8-z-index-50: 50;--cre8-z-index-100: 100;--cre8-z-index-200: 200;--cre8-z-index-1030: 1030;--cre8-anim-fade-quick: 0.35s;--cre8-anim-ease: ease}@keyframes fadeIn{100%{opacity:1}}@keyframes slideIn{100%{transform:translateX(0)}}@keyframes slideInFwd{100%{width:272px;height:272px}}@keyframes slideOutRight{100%{width:272px;height:272px}}@keyframes slideUp{100%{transform:translateY(0)}}@media(width >= 481px){@keyframes slideInFwd{100%{width:417px;height:417px}}@keyframes slideOutRight{100%{width:417px;height:417px}}}@media(width >= 48rem){@keyframes slideInFwd{100%{width:330px;height:330px}}@keyframes slideOutRight{100%{width:330px;height:330px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 60rem){@keyframes slideInFwd{100%{width:460px;height:460px}}@keyframes slideOutRight{100%{width:460px;height:460px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 75rem){@keyframes slideInFwd{100%{width:592px;height:591px}}@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 87.5rem){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 120px))}}}@media(width >= 2200px){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 592px))}}}span.ripple{position:absolute;border-radius:50%;transform:scale(0);animation:ripple 600ms linear;background-color:var(--ripple-bg-color)}@keyframes ripple{to{transform:scale(4);opacity:1}}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{display:inline-flex}:host([fullWidth]){display:flex}.cre8-c-danger-button{font-family:var(--cre8-typography-label-default-font-family);font-size:var(--cre8-typography-label-default-font-size);font-weight:var(--cre8-typography-label-default-font-weight);line-height:var(--cre8-typography-label-default-line-height);text-decoration:var(--cre8-typography-label-default-text-decoration);text-transform:var(--cre8-typography-label-default-text-transform);width:var(--cre8-button-width, auto);height:var(--cre8-button-height, auto);min-width:var(--cre8-button-min-width, auto);min-height:var(--cre8-button-min-height, auto);justify-content:center;text-align:center;margin-top:var(--cre8-button-margin-top, 0);margin-bottom:var(--cre8-button-margin-bottom, 0);margin-left:var(--cre8-button-margin-left, 0);margin-right:var(--cre8-button-margin-right, 0);display:inline-flex;align-items:center;border-width:var(--cre8-border-width-button-default);box-shadow:var(--cre8-shadow-button);padding-top:var(--cre8-button-padding-vertical-medium);padding-right:var(--cre8-button-padding-horizontal-medium);padding-bottom:var(--cre8-button-padding-vertical-medium);padding-left:var(--cre8-button-padding-horizontal-medium);margin:0;cursor:pointer;border-style:var(--cre8-border-style-default);transition:revert;transform:revert;white-space:nowrap}.cre8-c-danger-button:hover,.cre8-c-danger-button:focus,.cre8-c-danger-button:active,.cre8-c-danger-button:focus-visible{border-style:var(--cre8-border-style-default);box-shadow:none;transform:revert;transition:revert}.cre8-c-danger-button.cre8-c-danger-button--primary{background:var(--cre8-color-button-primary-danger-bg);border-width:var(--cre8-border-width-button-default);border-color:var(--cre8-color-button-primary-danger-border);border-radius:var(--cre8-border-radius-button);box-shadow:var(--cre8-shadow-button);color:var(--cre8-color-button-primary-danger-content);--cre8-icon-fill: var(--cre8-color-button-primary-danger-content)}.cre8-c-danger-button.cre8-c-danger-button--primary:hover,.cre8-c-danger-button.cre8-c-danger-button--primary:focus{box-shadow:none;--cre8-icon-fill: var(--cre8-color-button-primary-danger-content-hover);color:var(--cre8-color-button-primary-danger-content-hover);border-color:var(--cre8-color-button-primary-danger-border-hover);background:var(--cre8-color-button-primary-danger-bg-hover);text-decoration:none}.cre8-c-danger-button.cre8-c-danger-button--primary:hover:focus,.cre8-c-danger-button.cre8-c-danger-button--primary:focus:focus{outline:var(--cre8-border-width-focus) solid var(--cre8-color-border-active-outline);outline-offset:0.125rem}.cre8-c-danger-button.cre8-c-danger-button--primary:active,.cre8-c-danger-button.cre8-c-danger-button--primary.cre8-c-danger-button--loading{box-shadow:none;color:var(--cre8-color-button-primary-danger-content-active);--cre8-icon-fill: var(--cre8-color-button-primary-danger-content-active);border-color:var(--cre8-color-button-primary-danger-border-active);background-color:var(--cre8-color-button-primary-danger-bg-active)}.cre8-c-danger-button.cre8-c-danger-button--primary:focus-visible{outline:var(--cre8-border-width-focus) solid var(--cre8-color-border-active-outline);outline-offset:0.125rem}.cre8-c-danger-button.cre8-c-danger-button--primary.cre8-c-danger-button--loading{cursor:not-allowed}.cre8-c-danger-button.cre8-c-danger-button--primary:disabled{box-shadow:none;background-color:var(--cre8-color-button-primary-danger-bg-disabled);border-color:var(--cre8-color-button-primary-danger-border-disabled);color:var(--cre8-color-button-primary-danger-content-disabled);--cre8-icon-fill: var(--cre8-color-button-primary-danger-content-disabled);cursor:not-allowed;outline:none}.cre8-c-danger-button.cre8-c-danger-button--primary:disabled:hover,.cre8-c-danger-button.cre8-c-danger-button--primary:disabled:focus,.cre8-c-danger-button.cre8-c-danger-button--primary:disabled:active,.cre8-c-danger-button.cre8-c-danger-button--primary:disabled:focus-visible{outline:none;background-color:var(--cre8-color-button-primary-danger-bg-disabled);border-color:var(--cre8-color-button-primary-danger-border-disabled);color:var(--cre8-color-button-primary-danger-content-disabled);--cre8-icon-fill: var(--cre8-color-button-primary-danger-content-disabled)}.cre8-c-danger-button.cre8-c-danger-button--primary.cre8-c-danger-button--inverted{background-color:var(--cre8-color-button-primary-danger-inverse-bg);border-color:var(--cre8-color-button-primary-danger-inverse-border);color:var(--cre8-color-button-primary-danger-inverse-content)}.cre8-c-danger-button.cre8-c-danger-button--primary.cre8-c-danger-button--inverted:hover,.cre8-c-danger-button.cre8-c-danger-button--primary.cre8-c-danger-button--inverted:focus{background-color:var(--cre8-color-button-primary-danger-inverse-bg-hover);border-color:var(--cre8-color-button-primary-danger-inverse-border-hover);color:var(--cre8-color-button-primary-danger-inverse-content-hover)}.cre8-c-danger-button.cre8-c-danger-button--primary.cre8-c-danger-button--inverted:focus{outline-color:var(--cre8-color-button-primary-danger-inverse-outline)}.cre8-c-danger-button.cre8-c-danger-button--primary.cre8-c-danger-button--inverted:active{background-color:var(--cre8-color-button-primary-danger-inverse-bg-active);border-color:var(--cre8-color-button-primary-danger-inverse-border-active);color:var(--cre8-color-button-primary-danger-inverse-content-active)}.cre8-c-danger-button.cre8-c-danger-button--primary.cre8-c-danger-button--inverted:active.cre8-c-danger-button--loading{--cre8-icon-fill: var(--cre8-color-button-primary-danger-content-active)}.cre8-c-danger-button.cre8-c-danger-button--primary.cre8-c-danger-button--inverted:disabled{outline:none;cursor:not-allowed;background-color:var(--cre8-color-button-primary-danger-inverse-bg-disabled);border-color:var(--cre8-color-button-primary-danger-inverse-border-disabled);color:var(--cre8-color-button-primary-danger-inverse-content-disabled)}.cre8-c-danger-button.cre8-c-danger-button--secondary{background-color:var(--cre8-color-button-secondary-danger-bg);border-color:var(--cre8-color-button-secondary-danger-border);color:var(--cre8-color-button-secondary-danger-content);--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content);border-radius:var(--cre8-border-radius-button);border-width:var(--cre8-border-width-button-default)}.cre8-c-danger-button.cre8-c-danger-button--secondary:hover,.cre8-c-danger-button.cre8-c-danger-button--secondary:focus{background-color:var(--cre8-color-button-secondary-danger-bg-hover);border-color:var(--cre8-color-button-secondary-danger-border-hover);color:var(--cre8-color-button-secondary-danger-content-hover);--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content-hover)}.cre8-c-danger-button.cre8-c-danger-button--secondary:hover:focus,.cre8-c-danger-button.cre8-c-danger-button--secondary:focus:focus{outline:var(--cre8-border-width-focus) solid var(--cre8-color-border-active-outline);outline-offset:0.125rem}.cre8-c-danger-button.cre8-c-danger-button--secondary:active,.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--loading{transition:none;transform:none;background-color:var(--cre8-color-button-secondary-danger-bg-active);border-color:var(--cre8-color-button-secondary-danger-border-active);color:var(--cre8-color-button-secondary-danger-content-active);--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content-active)}.cre8-c-danger-button.cre8-c-danger-button--secondary:focus-visible{outline:var(--cre8-border-width-focus) solid var(--cre8-color-border-active-outline);outline-offset:0.125rem}.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--loading{cursor:not-allowed}.cre8-c-danger-button.cre8-c-danger-button--secondary:disabled{box-shadow:none;background-color:var(--cre8-color-button-secondary-danger-bg-disabled);border-color:var(--cre8-color-button-secondary-danger-border-disabled);color:var(--cre8-color-button-secondary-danger-content-disabled);--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content-disabled);outline:none;border-radius:var(--cre8-border-radius-button);border-width:var(--cre8-border-width-button-default);cursor:not-allowed}.cre8-c-danger-button.cre8-c-danger-button--secondary:disabled:hover,.cre8-c-danger-button.cre8-c-danger-button--secondary:disabled:focus,.cre8-c-danger-button.cre8-c-danger-button--secondary:disabled:active,.cre8-c-danger-button.cre8-c-danger-button--secondary:disabled:focus-visible{outline:none;background-color:var(--cre8-color-button-secondary-danger-bg-disabled);border-color:var(--cre8-color-button-secondary-danger-border-disabled);color:var(--cre8-color-button-secondary-danger-content-disabled);--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content-disabled)}.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--inverted{background-color:var(--cre8-color-button-secondary-danger-inverse-bg);border-color:var(--cre8-color-button-secondary-danger-inverse-border);color:var(--cre8-color-button-secondary-danger-inverse-content)}.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--inverted:hover,.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--inverted:focus{background-color:var(--cre8-color-button-secondary-danger-inverse-bg-hover);border-color:var(--cre8-color-button-secondary-danger-inverse-border-hover);color:var(--cre8-color-button-secondary-danger-inverse-content-hover)}.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--inverted:focus{outline-color:var(--cre8-color-button-secondary-danger-inverse-outline)}.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--inverted:active{background-color:var(--cre8-color-button-secondary-danger-inverse-bg-active);border-color:var(--cre8-color-button-secondary-danger-inverse-border-active);color:var(--cre8-color-button-secondary-danger-inverse-content-active)}.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--inverted:active.cre8-c-danger-button--loading{--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content-active)}.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--inverted:disabled{outline:none;cursor:not-allowed;background-color:var(--cre8-color-button-secondary-danger-inverse-bg-disabled);border-color:var(--cre8-color-button-secondary-danger-inverse-border-disabled);color:var(--cre8-color-button-secondary-danger-inverse-content-disabled)}.cre8-c-danger-button.cre8-c-danger-button--tertiary{border-radius:var(--cre8-border-radius-button);background-color:var(--cre8-color-button-tertiary-danger-bg);border-width:var(--cre8-border-width-button-default);border-color:var(--cre8-color-button-tertiary-danger-border);color:var(--cre8-color-button-tertiary-danger-content);--cre8-icon-fill: var(--cre8-color-button-tertiary-danger-content);box-shadow:none}.cre8-c-danger-button.cre8-c-danger-button--tertiary:hover,.cre8-c-danger-button.cre8-c-danger-button--tertiary:focus{border-radius:var(--cre8-border-radius-button);background-color:var(--cre8-color-button-tertiary-danger-bg-hover);border-width:var(--cre8-border-width-button-default, --cre8-border-width-none);border-color:var(--cre8-color-button-tertiary-danger-border-hover);color:var(--cre8-color-button-tertiary-danger-content-hover);--cre8-icon-fill: var(--cre8-color-button-tertiary-danger-content-hover)}.cre8-c-danger-button.cre8-c-danger-button--tertiary:hover:focus,.cre8-c-danger-button.cre8-c-danger-button--tertiary:focus:focus{outline:var(--cre8-border-width-focus) var(--cre8-border-style-button-tertiary-outline-focus) var(--cre8-color-border-active-outline);outline-offset:0.125rem}.cre8-c-danger-button.cre8-c-danger-button--tertiary:active,.cre8-c-danger-button.cre8-c-danger-button--tertiary.cre8-c-danger-button--loading{border-radius:var(--cre8-border-radius-button);background-color:var(--cre8-color-button-tertiary-danger-bg-active);border-color:var(--cre8-color-button-tertiary-danger-border-active);border-width:var(--cre8-border-width-button-default);color:var(--cre8-color-button-tertiary-danger-content-active);--cre8-icon-fill: var(--cre8-color-button-tertiary-danger-content-active)}.cre8-c-danger-button.cre8-c-danger-button--tertiary:focus-visible{outline:var(--cre8-border-width-focus) var(--cre8-border-style-button-tertiary-outline-focus) var(--cre8-color-border-active-outline);outline-offset:0.125rem}.cre8-c-danger-button.cre8-c-danger-button--tertiary.cre8-c-danger-button--loading{cursor:not-allowed}.cre8-c-danger-button.cre8-c-danger-button--tertiary:disabled{background-color:var(--cre8-color-button-tertiary-danger-bg-disabled);border-color:rgba(0,0,0,0);color:var(--cre8-color-button-tertiary-danger-content-disabled);--cre8-icon-fill: var(--cre8-color-button-tertiary-danger-content-disabled);outline:none;box-shadow:none;cursor:not-allowed}.cre8-c-danger-button.cre8-c-danger-button--tertiary:disabled:hover,.cre8-c-danger-button.cre8-c-danger-button--tertiary:disabled:focus{outline:none;box-shadow:none;background-color:var(--cre8-color-button-tertiary-danger-bg-disabled);color:var(--cre8-color-button-tertiary-danger-content-disabled);--cre8-icon-fill: var(--cre8-color-button-tertiary-danger-content-disabled)}.cre8-c-danger-button.cre8-c-danger-button--tertiary:disabled:active,.cre8-c-danger-button.cre8-c-danger-button--tertiary:disabled:focus-visible{outline:none;box-shadow:none;background-color:var(--cre8-color-button-tertiary-danger-bg-disabled);color:var(--cre8-color-button-tertiary-danger-content-disabled);--cre8-icon-fill: var(--cre8-color-button-tertiary-danger-content-disabled)}.cre8-c-danger-button.cre8-c-danger-button--tertiary.cre8-c-danger-button--inverted{background-color:var(--cre8-color-button-tertiary-danger-inverse-bg);border-color:var(--cre8-color-button-tertiary-danger-inverse-border);color:var(--cre8-color-button-tertiary-danger-inverse-content)}.cre8-c-danger-button.cre8-c-danger-button--tertiary.cre8-c-danger-button--inverted:hover,.cre8-c-danger-button.cre8-c-danger-button--tertiary.cre8-c-danger-button--inverted:focus{background-color:var(--cre8-color-button-tertiary-danger-inverse-bg-hover);border-color:var(--cre8-color-button-tertiary-danger-inverse-border-hover);color:var(--cre8-color-button-tertiary-danger-inverse-content-hover)}.cre8-c-danger-button.cre8-c-danger-button--tertiary.cre8-c-danger-button--inverted:focus{outline-color:var(--cre8-color-button-tertiary-danger-inverse-outline)}.cre8-c-danger-button.cre8-c-danger-button--tertiary.cre8-c-danger-button--inverted:active{background-color:var(--cre8-color-button-tertiary-danger-inverse-bg-active);border-color:var(--cre8-color-button-tertiary-danger-inverse-border-active);color:var(--cre8-color-button-tertiary-danger-inverse-content-active)}.cre8-c-danger-button.cre8-c-danger-button--tertiary.cre8-c-danger-button--inverted:active.cre8-c-danger-button--loading{--cre8-icon-fill: var(--cre8-color-button-tertiary-danger-content-active)}.cre8-c-danger-button.cre8-c-danger-button--tertiary.cre8-c-danger-button--inverted:disabled{outline:none;cursor:not-allowed;background-color:var(--cre8-color-button-tertiary-danger-inverse-bg-disabled);border-color:var(--cre8-color-button-tertiary-danger-inverse-border-disabled);color:var(--cre8-color-button-tertiary-danger-inverse-content-disabled)}.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--split-button-text{border-radius:var(--cre8-border-radius-button) var(--cre8-border-radius-none) var(--cre8-border-radius-none) var(--cre8-border-radius-button);border-color:var(--cre8-color-button-secondary-danger-border);border-width:var(--cre8-border-width-button-default);color:var(--cre8-color-button-secondary-danger-content)}.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--split-button-text:active,.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--split-button-text:focus-visible{outline:none}.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--split-button-text.cre8-c-danger-button--lg{padding:var(--cre8-button-padding-vertical-large) var(--cre8-button-padding-horizontal-large)}.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--secondary.cre8-c-danger-button--split-button-text.cre8-c-danger-button--sm{padding:var(--cre8-button-padding-vertical-small) var(--cre8-button-padding-horizontal-small)}.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--icon-only.cre8-c-danger-button--split-button-caret{padding:var(--cre8-button-padding-vertical-medium);border-radius:var(--cre8-border-radius-none) var(--cre8-border-radius-button) var(--cre8-border-radius-button) var(--cre8-border-radius-none);height:100%;border-left:none !important;border-collapse:collapse;background:var(--cre8-color-button-secondary-danger-bg);border-color:var(--cre8-color-button-secondary-danger-border);border-width:var(--cre8-border-width-button-default);color:var(--cre8-color-button-secondary-danger-content);--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content)}.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--icon-only.cre8-c-danger-button--split-button-caret:hover,.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--icon-only.cre8-c-danger-button--split-button-caret:focus{background:var(--cre8-color-button-secondary-danger-bg-hover);border-color:var(--cre8-color-button-secondary-danger-border-hover);--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content-hover);outline:none;border-left:none;border-collapse:collapse}.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--icon-only.cre8-c-danger-button--split-button-caret:active,.cre8-c-danger-button.cre8-c-danger-button.cre8-c-danger-button--icon-only.cre8-c-danger-button--split-button-caret:focus-visible{background:var(--cre8-color-button-secondary-danger-bg-active);border-color:var(--cre8-color-button-secondary-danger-border-active);--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content-active);outline:none;border-left:none;border-collapse:collapse}.cre8-c-danger-button--lg{padding:var(--cre8-button-padding-vertical-large)}.cre8-c-danger-button--sm{padding:var(--cre8-button-padding-vertical-small)}.cre8-c-danger-button--icon-only{padding:var(--cre8-button-padding-vertical-small);color:var(--cre8-icon-fill, currentColor)}.cre8-c-danger-button--full-width{width:100%;display:flex}.cre8-c-danger-button--sm{font-family:var(--cre8-typography-label-small-font-family);font-size:var(--cre8-typography-label-small-font-size);font-weight:var(--cre8-typography-label-small-font-weight);line-height:var(--cre8-typography-label-small-line-height);text-decoration:var(--cre8-typography-label-small-text-decoration);text-transform:var(--cre8-typography-label-small-text-transform);padding-top:var(--cre8-button-padding-vertical-small);padding-right:var(--cre8-button-padding-horizontal-small);padding-bottom:var(--cre8-button-padding-vertical-small);padding-left:var(--cre8-button-padding-horizontal-small)}.cre8-c-danger-button--lg{font-family:var(--cre8-typography-label-large-font-family);font-size:var(--cre8-typography-label-large-font-size);font-weight:var(--cre8-typography-label-large-font-weight);line-height:var(--cre8-typography-label-large-line-height);text-decoration:var(--cre8-typography-label-large-text-decoration);text-transform:var(--cre8-typography-label-large-text-transform);padding-top:var(--cre8-button-padding-vertical-large);padding-right:var(--cre8-button-padding-horizontal-large);padding-bottom:var(--cre8-button-padding-vertical-large);padding-left:var(--cre8-button-padding-horizontal-large)}.cre8-c-danger-button--sm cre8-icon{--cre8-icon-height: var(--cre8-icon-size-small);--cre8-icon-width: var(--cre8-icon-size-small)}.cre8-c-danger-button--lg cre8-icon{--cre8-icon-height: var(--cre8-icon-size-large);--cre8-icon-width: var(--cre8-icon-size-large)}::slotted(*){margin-right:0}cre8-icon+.cre8-c-danger-button__text:not(.cre8-u-is-vishidden){margin-left:0.5rem;display:inline-flex}.cre8-c-danger-button__text:not(.cre8-u-is-vishidden)+cre8-icon{margin-left:0.5rem;display:inline-flex}.cre8-c-danger-button:has(.cre8-c-danger-button__text.cre8-u-is-vishidden)+cre8-icon{border-radius:var(--cre8-border-radius-button)}.cre8-c-danger-button__text.cre8-u-is-vishidden+cre8-icon{margin-left:0px;margin-right:0px;display:flex}.cre8-c-danger-button__text.cre8-u-is-vishidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.cre8-c-danger-button--primary.cre8-c-danger-button--loading{--cre8-icon-fill: var(--cre8-color-content-knockout)}.cre8-c-danger-button--secondary.cre8-c-danger-button--loading,.cre8-c-danger-button--tertiary.cre8-c-danger-button--loading{--cre8-icon-fill: var(--cre8-color-button-secondary-danger-content-active)}.cre8-u-is-vishidden{--cre8-icon-height: 0px;--cre8-icon-width: 0px;max-width:fit-content;min-width:0px;width:auto;height:auto;max-height:fit-content;min-width:0px;border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}cre8-icon.cre8-u-is-vishidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}cre8-icon{display:flex;align-items:center;justify-content:center}span.cre8-c-danger-button__icon{margin-left:0.5rem;max-width:fit-content;min-width:0px;width:auto;height:auto;max-height:fit-content;min-width:0px}`;\nexport default styles;\n"]}

package/lib/components/date-picker/calendar/calendar.js

@@ -0,0 +1,465 @@
+/* eslint-disable max-statements */
+/* eslint-disable indent */
+/* eslint-disable lit/no-template-arrow */
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/* TODO: remove eslint disable on no-template-arrow */
+import { html, nothing, } from 'lit';
+import { property, query, state } from 'lit/decorators.js';
+import styles from './calendar.styles.js';
+import { Cre8Element } from '../../cre8-element';
+import '../../icon/icon';
+import '../calendar-month-modal/calendar-month-modal';
+import '../calendar-year-modal/calendar-year-modal';
+import '../calendar-navigation/calendar-navigation';
+import '../../button/button';
+export var CalendarModal;
+(function (CalendarModal) {
+    CalendarModal["Month"] = "month";
+    CalendarModal["Year"] = "year";
+    CalendarModal["None"] = "none";
+})(CalendarModal || (CalendarModal = {}));
+export class Cre8Calendar extends Cre8Element {
+    get activeModal() {
+        return this._activeModal;
+    }
+    set activeModal(activeModal) {
+        this._activeModal = activeModal;
+    }
+    get fieldDate() {
+        return this._fieldDate;
+    }
+    set fieldDate(newFieldDate) {
+        const oldDate = this._fieldDate;
+        this.requestUpdate('fieldDate', oldDate);
+        const isNewDateValid = !!(newFieldDate && new Date(`${newFieldDate}T00:00`).getTime());
+        this.currentDate = isNewDateValid
+            ? new Date(`${newFieldDate}T00:00`)
+            : new Date();
+        this._fieldDate = isNewDateValid ? newFieldDate : '';
+    }
+    get currentDate() {
+        return this._currentDate;
+    }
+    set currentDate(newDate) {
+        const oldDate = this._currentDate;
+        this._currentDate = newDate;
+        this.requestUpdate('currentDate', oldDate);
+    }
+    constructor() {
+        super();
+        this._activeModal = CalendarModal.None;
+        this._handleOnClickOutside = this._handleOnClickOutside.bind(this);
+        this.currentDate = (this.fieldDate && new Date(`${this.fieldDate}T00:00`)) ?? new Date();
+        this.locale = document.documentElement.getAttribute('lang') || 'en-US';
+        this.dateConfig = {
+            locale: this.locale,
+            today: new Date(),
+            weekInfo: {
+                firstDay: 7,
+                weekend: [6, 7],
+            },
+        };
+        this.weekDays = [
+            'Sunday',
+            'Monday',
+            'Tuesday',
+            'Wednesday',
+            'Thursday',
+            'Friday',
+            'Saturday',
+        ];
+        this.dateFormatOptions = {
+            weekday: 'long',
+            year: 'numeric',
+            month: 'long',
+            day: 'numeric',
+        };
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        window.addEventListener('click', this._handleOnClickOutside, false);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        window.removeEventListener('click', this._handleOnClickOutside, false);
+    }
+    /* Click Event Functions */
+    _handleOnClickOutside(event) {
+        if (!this.shadowRoot?.host) {
+            throw Error('Could not determine navigation context during click handler');
+        }
+        const didClickInside = event.composedPath().includes(this.shadowRoot.host);
+        if (!didClickInside) {
+            const outsideClickEvent = new CustomEvent('outsideClick', {
+                detail: {
+                    composedPath: event.composedPath(),
+                },
+            });
+            this.dispatchEvent(outsideClickEvent);
+        }
+    }
+    emitSelectedDate(date) {
+        const event = new CustomEvent('dateSelect', {
+            detail: {
+                date,
+            },
+        });
+        this.currentDate = new Date(`${date}T00:00`);
+        this.dispatchEvent(event);
+    }
+    changeYear(year) {
+        const oldDate = this.currentDate;
+        const newDate = new Date(oldDate.setFullYear(year));
+        this.currentDate = newDate;
+        this.activeModal = CalendarModal.None;
+    }
+    changeMonth(month) {
+        const oldDate = this.currentDate;
+        const newDate = new Date(oldDate.setMonth(month));
+        this.currentDate = newDate;
+        this.activeModal = CalendarModal.None;
+    }
+    activateModal(modal) {
+        this.activeModal = modal;
+    }
+    /* Helper/Get Functions */
+    static formatMonthOrDayIndex(val) {
+        return (val + 1).toString().padStart(2, '0');
+    }
+    static formatDate(val) {
+        return val.toString().padStart(2, '0');
+    }
+    numberOfDaysinMonth() {
+        return new Date(this.getYear(), this.getMonth() + 1, 0).getDate();
+    }
+    getMonth() {
+        return this.currentDate.getMonth();
+    }
+    getMonthName() {
+        const monthName = new Intl.DateTimeFormat(this.locale, {
+            month: 'long',
+        }).format(this.currentDate);
+        return monthName;
+    }
+    getYear() {
+        return this.currentDate.getFullYear();
+    }
+    static dateToString(date) {
+        return `${date.getFullYear()}-${Cre8Calendar.formatMonthOrDayIndex(date.getMonth())}-${Cre8Calendar.formatDate(date.getDate())}`;
+    }
+    async updateFocusForKeydown(newDate) {
+        this.currentDate = newDate;
+        await this.updateComplete;
+        const newFocus = this.shadowRoot?.querySelector(`button[datetime="${Cre8Calendar.dateToString(newDate)}"]`);
+        newFocus.setAttribute('tabindex', '0');
+        newFocus.focus();
+    }
+    _handleCalendarKeyDown(e) {
+        const oldFocus = this.shadowRoot?.querySelector(`button[datetime="${Cre8Calendar.dateToString(this.currentDate)}"]`);
+        if (e.key === 'ArrowUp') {
+            const newDate = new Date(this.getYear(), this.getMonth(), this.currentDate.getDate() - 7);
+            this.updateFocusForKeydown(newDate);
+            oldFocus.setAttribute('tabindex', '-1');
+        }
+        if (e.key === 'ArrowDown') {
+            const newDate = new Date(this.getYear(), this.getMonth(), this.currentDate.getDate() + 7);
+            this.updateFocusForKeydown(newDate);
+            oldFocus.setAttribute('tabindex', '-1');
+        }
+        if (e.key === 'ArrowLeft') {
+            const newDate = new Date(this.getYear(), this.getMonth(), this.currentDate.getDate() - 1);
+            this.updateFocusForKeydown(newDate);
+            oldFocus.setAttribute('tabindex', '-1');
+        }
+        if (e.key === 'ArrowRight') {
+            const newDate = new Date(this.getYear(), this.getMonth(), this.currentDate.getDate() + 1);
+            this.updateFocusForKeydown(newDate);
+            oldFocus.setAttribute('tabindex', '-1');
+        }
+        if (e.key === 'Tab' && !e.shiftKey) {
+            const outsideClickEvent = new CustomEvent('outsideClick', {
+                detail: {
+                    composedPath: [],
+                },
+            });
+            // This allows the tab off to happen before the calendar closes
+            setTimeout(() => { this.dispatchEvent(outsideClickEvent); }, 20);
+        }
+    }
+    async changeMonthFromNav(month) {
+        this.changeMonth(month);
+        await this.updateComplete;
+        const nav = this.shadowRoot?.querySelector('cre8-calendar-navigation');
+        const monthPickerButton = nav.shadowRoot?.querySelector('.cre8-c-calendar-navigation__month-modal-button');
+        await this.updateComplete;
+        const button = monthPickerButton.shadowRoot.querySelector('button');
+        button.focus();
+    }
+    async changeYearFromNav(year) {
+        this.changeYear(year);
+        await this.updateComplete;
+        const nav = this.shadowRoot?.querySelector('cre8-calendar-navigation');
+        const yearPickerButton = nav.shadowRoot?.querySelector('.cre8-c-calendar-navigation__year-modal-button');
+        await this.updateComplete;
+        const button = yearPickerButton.shadowRoot.querySelector('button');
+        button.focus();
+    }
+    /* Template Map Functions */
+    getDaysOfWeekAbbreviations() {
+        return this.weekDays.map((day) => html ` <td>
+        <span aria-label="${day}">${day[0]}</span>
+      </td>`);
+    }
+    /**
+     * Create array of Day Buttons to fill in excess calendar space at the beginning of the month.
+     *
+     * 1. Map from empty array of length equal to the amount of access calendar "slots" in the beginning of the month.
+     * (i.e. if the month starts on Wednesday (getDay = 3), there are 3 days prior that week from last month.)
+     *
+     * 2. Based on the indice of array, get the given day button's date, where the date is
+     * the last day of last month minus the max of the array plus the indice plus one -> x = lastday - (max - (i + 1))
+     * (Note: (max - (i + 1) equals the keys of the array in reverse order:
+     * [max - i + 1] -> [3-1, 3-2, 3-3] -> [2,1,0] for an array of [3])
+     * (i.e. if the calendar is starting on Wednesday June 1st, the access days on the calendar will be
+     * Sunday May 29th (31 - (2)), Monday May 30th (31 - (1)), Tuesday May 31st (31 - (0)))
+     *
+     * 3. Build out day button with necessary props
+     * */
+    getPreviousMonthDayButtons() {
+        /* 1 */
+        return [
+            ...Array(new Date(this.getYear(), this.getMonth(), 1).getDay()).keys(),
+        ].map((i) => {
+            const priorMonthArrayLength = new Date(this.getYear(), this.getMonth(), 1).getDay();
+            const finalDayLastMonth = new Date(this.getYear(), this.getMonth(), 0);
+            const numberOfDaysinLastMonth = finalDayLastMonth.getDate();
+            /* 2 */
+            const priorMonthDay = new Date(finalDayLastMonth.getFullYear(), finalDayLastMonth.getMonth(), numberOfDaysinLastMonth - priorMonthArrayLength + (i + 1));
+            const isToday = this.dateConfig.today.getDate() === priorMonthDay.getDate()
+                && this.dateConfig.today.getMonth() === priorMonthDay.getMonth()
+                && this.dateConfig.today.getFullYear() === priorMonthDay.getFullYear();
+            const isSelected = new Date(`${this.fieldDate}T00:00`).getTime()
+                === priorMonthDay.getTime();
+            /* 3 */
+            return html ` <td>
+        <button
+          class="cre8-c-calendar__day-button cre8-c-calendar__different-month"
+          datetime="${Cre8Calendar.dateToString(priorMonthDay)}"
+          ?data-today="${isToday}"
+          ?data-selected="${isSelected}"
+          tabindex="-1"
+          aria-label="${new Intl.DateTimeFormat(this.locale, {
+                weekday: 'long',
+                year: 'numeric',
+                month: 'long',
+                day: 'numeric',
+            }).format(new Date(`${Cre8Calendar.dateToString(priorMonthDay)}T00:00`))}"
+          @click="${() => this.emitSelectedDate(Cre8Calendar.dateToString(priorMonthDay))}"
+        >
+          ${new Intl.NumberFormat(this.locale).format(priorMonthDay.getDate())}
+        </button>
+      </td>`;
+        });
+    }
+    /**
+     * Create array of Day Buttons to fill out current month
+     *
+     * 1. Map from empty array of length equal to the amount days in this month
+     *
+     * 2. Get the date of the current month based on indice of array (i.e. 0 -> 1st, 1 -> 2nd ...)
+     *
+     * 3. Build out day button with necessary props
+     * */
+    getCurrentMonthDayButtons() {
+        /* 1 */
+        return [...Array(this.numberOfDaysinMonth()).keys()].map((i) => {
+            const dayOfTheMonth = i + 1;
+            /* 2 */
+            const current = new Date(this.getYear(), this.getMonth(), dayOfTheMonth);
+            const isToday = this.dateConfig.today.getDate() === dayOfTheMonth
+                && this.dateConfig.today.getMonth() === this.getMonth()
+                && this.dateConfig.today.getFullYear() === this.getYear();
+            const isSelected = new Date(`${this.fieldDate}T00:00`).getTime() === current.getTime();
+            /* 3 */
+            return html ` <td>
+        <button
+          class="cre8-c-calendar__day-button"
+          datetime="${Cre8Calendar.dateToString(current)}"
+          ?data-today="${isToday}"
+          ?data-selected="${isSelected}"
+          tabindex="${dayOfTheMonth === this.currentDate.getDate()
+                ? '0'
+                : '-1'}"
+          aria-label="${new Intl.DateTimeFormat(this.locale, {
+                weekday: 'long',
+                year: 'numeric',
+                month: 'long',
+                day: 'numeric',
+            }).format(new Date(`${Cre8Calendar.dateToString(current)}T00:00`))}"
+          @click="${() => this.emitSelectedDate(Cre8Calendar.dateToString(current))}"
+        >
+          ${new Intl.NumberFormat(this.locale).format(i + 1)}
+        </button>
+      </td>`;
+        });
+    }
+    /**
+     * Create array of Day Buttons to fill in excess calendar space at the end of the month.
+     *
+     * 1. Map from empty array of length equal to the amount of access calendar "slots" at the end of the month.
+     * The array have an amount of slots equal to the number of days in a week minus how many days have already past
+     * and since getDay returns the index of the day of the week (Sunday = 0, Monday = 1 ...) our equations is
+     * x = 7 - (getDay() + 1)
+     * Note: (we need to add 1 because indexing starts at 0)
+     * so if the month ends on Monday (getDay() = 1), 5 = 7 - (1 + 1), there are 5 days that week from the new month
+     *
+     * 2. Get the date from the next month based on indice of array (i.e. 0 -> 1st, 1 -> 2nd ...)
+     *
+     * 3. Build out day button with necessary props
+     * */
+    getNextMonthDayButtons() {
+        /* 1 */
+        return [
+            ...Array(6
+                - new Date(this.getYear(), this.getMonth(), this.numberOfDaysinMonth()).getDay()).keys(),
+        ].map((i) => {
+            const lastDayThisMonth = new Date(this.getYear(), this.getMonth(), this.numberOfDaysinMonth());
+            const firstDayNextMonth = new Date(lastDayThisMonth.setDate(lastDayThisMonth.getDate() + 1));
+            /* 2 */
+            const nextMonthDay = new Date(firstDayNextMonth.getFullYear(), firstDayNextMonth.getMonth(), i + 1);
+            const isToday = this.dateConfig.today.getDate() === nextMonthDay.getDate()
+                && this.dateConfig.today.getMonth() === nextMonthDay.getMonth()
+                && this.dateConfig.today.getFullYear() === nextMonthDay.getFullYear();
+            const isSelected = new Date(`${this.fieldDate}T00:00`).getTime()
+                === nextMonthDay.getTime();
+            /* 3 */
+            return html ` <td>
+        <button
+          class="cre8-c-calendar__day-button cre8-c-calendar__different-month"
+          datetime="${Cre8Calendar.dateToString(nextMonthDay)}"
+          ?data-today="${isToday}"
+          ?data-selected="${isSelected}"
+          tabindex="-1"
+          aria-label="${new Intl.DateTimeFormat(this.locale, {
+                weekday: 'long',
+                year: 'numeric',
+                month: 'long',
+                day: 'numeric',
+            }).format(new Date(`${Cre8Calendar.dateToString(nextMonthDay)}T00:00`))}"
+          @click="${() => this.emitSelectedDate(Cre8Calendar.dateToString(nextMonthDay))}"
+        >
+          ${new Intl.NumberFormat(this.locale).format(nextMonthDay.getDate())}
+        </button>
+      </td>`;
+        });
+    }
+    render() {
+        const componentClassNames = this.componentClassNames('cre8-c-calendar', {});
+        return html ` <div class="${componentClassNames}">
+      ${this._activeModal === CalendarModal.Month
+            ? html `<cre8-calendar-month-modal
+            currentMonth="${this.getMonth()}"
+            @changeMonth="${(e) => this.changeMonthFromNav(e.detail.month)}"
+          ></cre8-calendar-month-modal>`
+            : nothing}
+      ${this._activeModal === CalendarModal.Year
+            ? html `<cre8-calendar-year-modal
+            currentYear="${this.getYear()}"
+            @changeYear="${(e) => this.changeYearFromNav(e.detail.year)}"
+          ></cre8-calendar-year-modal>`
+            : nothing}
+      ${this._activeModal === CalendarModal.None
+            ? html ` ${this.hasShortcuts
+                ? html `<div class="cre8-c-calendar__header-shortcuts">
+                    <cre8-button
+                      text="Today"
+                      variant="secondary"
+                      size="sm"
+                      @click="${() => this.emitSelectedDate(Cre8Calendar.dateToString(this.dateConfig.today))}"
+                    ></cre8-button>
+                    <cre8-button
+                      text="Tomorrow"
+                      variant="secondary"
+                      size="sm"
+                      @click="${() => this.emitSelectedDate(Cre8Calendar.dateToString(new Date(this.dateConfig.today.setDate(this.dateConfig.today.getDate() + 1))))}"
+                    ></cre8-button>
+                    <cre8-button
+                      text="In 2 days"
+                      variant="secondary"
+                      size="sm"
+                      @click="${() => this.emitSelectedDate(Cre8Calendar.dateToString(new Date(this.dateConfig.today.setDate(this.dateConfig.today.getDate() + 2))))}"
+                    ></cre8-button>
+                </div>`
+                : nothing}
+            <cre8-calendar-navigation
+              monthName="${this.getMonthName()}"
+              year="${this.getYear()}"
+              @activateModal="${(e) => this.activateModal(e.detail.modal)}"
+              @changeMonth="${(e) => this.changeMonth(this.getMonth() + e.detail.addend)}"
+              @changeYear="${(e) => this.changeYear(this.getYear() + e.detail.addend)}"
+            >
+            </cre8-calendar-navigation>
+            <table>
+              <thead>
+                <tr>
+                  ${this.getDaysOfWeekAbbreviations()}
+                </tr>
+              </thead>
+              <tbody>
+                <tr @keydown=${this._handleCalendarKeyDown}>
+                  ${this.getPreviousMonthDayButtons()}
+                  ${this.getCurrentMonthDayButtons()}
+                  ${this.getNextMonthDayButtons()}
+                </tr>
+              </tbody>
+            </table>`
+            : nothing}
+    </div>`;
+    }
+}
+Cre8Calendar.styles = [styles];
+__decorate([
+    query('.cre8-c-calendar__navigation-wrapper')
+], Cre8Calendar.prototype, "_navWrapper", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], Cre8Calendar.prototype, "hasShortcuts", void 0);
+__decorate([
+    state()
+], Cre8Calendar.prototype, "_activeModal", void 0);
+__decorate([
+    property({ reflect: true, type: String })
+], Cre8Calendar.prototype, "activeModal", null);
+__decorate([
+    state()
+], Cre8Calendar.prototype, "_fieldDate", void 0);
+__decorate([
+    property({ reflect: true, type: Date })
+], Cre8Calendar.prototype, "fieldDate", null);
+__decorate([
+    state()
+], Cre8Calendar.prototype, "_currentDate", void 0);
+__decorate([
+    property({ reflect: true, type: Date })
+], Cre8Calendar.prototype, "currentDate", null);
+__decorate([
+    state()
+], Cre8Calendar.prototype, "locale", void 0);
+__decorate([
+    state()
+], Cre8Calendar.prototype, "weekDays", void 0);
+__decorate([
+    state()
+], Cre8Calendar.prototype, "dateConfig", void 0);
+__decorate([
+    state()
+], Cre8Calendar.prototype, "dateFormatOptions", void 0);
+if (customElements.get('cre8-calendar') === undefined) {
+    customElements.define('cre8-calendar', Cre8Calendar);
+}
+//# sourceMappingURL=calendar.js.map

package/lib/components/date-picker/calendar/calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.js","sourceRoot":"","sources":["../../../../components/date-picker/calendar/calendar.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable max-statements */\n/* eslint-disable indent */\n/* eslint-disable lit/no-template-arrow */\n\n/* TODO: remove eslint disable on no-template-arrow */\nimport {\n TemplateResult, html, nothing,\n} from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport styles from './calendar.styles.js';\nimport { Cre8Element } from '../../cre8-element';\n\nimport '../../icon/icon';\nimport '../calendar-month-modal/calendar-month-modal';\nimport '../calendar-year-modal/calendar-year-modal';\nimport '../calendar-navigation/calendar-navigation';\nimport '../../button/button';\n\nexport interface DateConfig {\n  locale: string;\n  today: Date;\n  weekInfo: {\n    firstDay: number;\n    weekend: Array<number>;\n  };\n}\n\nexport interface DateFormatOptions {\n  weekday: string;\n  year: string;\n  month: string;\n  day: string;\n}\n\nexport enum CalendarModal {\n  Month = 'month',\n  Year = 'year',\n  None = 'none',\n}\n\nexport class Cre8Calendar extends Cre8Element {\n  static styles = [styles];\n\n\n  /**\n   * Query the navigation wrapper\n   */\n  @query('.cre8-c-calendar__navigation-wrapper')\n      _navWrapper: HTMLElement;\n\n  @property({ type: Boolean, reflect: true })\n  hasShortcuts?: boolean;\n\n  @state() _activeModal?: CalendarModal = CalendarModal.None;\n\n  @property({ reflect: true, type: String })\n  get activeModal() {\n    return this._activeModal;\n  }\n\n  set activeModal(activeModal: CalendarModal) {\n    this._activeModal = activeModal;\n  }\n\n  @state() _fieldDate?: string;\n\n  @property({ reflect: true, type: Date })\n  get fieldDate() {\n    return this._fieldDate;\n  }\n\n  set fieldDate(newFieldDate: string) {\n    const oldDate = this._fieldDate;\n    this.requestUpdate('fieldDate', oldDate);\n    const isNewDateValid = !!(\n      newFieldDate && new Date(`${newFieldDate}T00:00`).getTime()\n    );\n    this.currentDate = isNewDateValid\n      ? new Date(`${newFieldDate}T00:00`)\n      : new Date();\n    this._fieldDate = isNewDateValid ? newFieldDate : '';\n  }\n\n  @state() _currentDate?: Date;\n\n  @property({ reflect: true, type: Date })\n  get currentDate() {\n    return this._currentDate;\n  }\n\n  set currentDate(newDate: Date) {\n    const oldDate = this._currentDate;\n    this._currentDate = newDate;\n    this.requestUpdate('currentDate', oldDate);\n  }\n\n  @state() locale: string;\n\n  @state() weekDays: Array<string>;\n\n  @state() dateConfig: DateConfig;\n\n  @state() dateFormatOptions: DateFormatOptions;\n\n  constructor() {\n    super();\n    this._handleOnClickOutside = this._handleOnClickOutside.bind(this);\n    this.currentDate = (this.fieldDate && new Date(`${this.fieldDate}T00:00`)) ?? new Date();\n\n    this.locale = document.documentElement.getAttribute('lang') || 'en-US';\n    this.dateConfig = {\n      locale: this.locale,\n      today: new Date(),\n      weekInfo: {\n        firstDay: 7,\n        weekend: [6, 7],\n      },\n    };\n    this.weekDays = [\n      'Sunday',\n      'Monday',\n      'Tuesday',\n      'Wednesday',\n      'Thursday',\n      'Friday',\n      'Saturday',\n    ];\n    this.dateFormatOptions = {\n      weekday: 'long',\n      year: 'numeric',\n      month: 'long',\n      day: 'numeric',\n    };\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    window.addEventListener('click', this._handleOnClickOutside, false);\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    window.removeEventListener('click', this._handleOnClickOutside, false);\n  }\n\n  /* Click Event Functions */\n  private _handleOnClickOutside(event: MouseEvent) {\n    if (!this.shadowRoot?.host) {\n      throw Error(\n        'Could not determine navigation context during click handler'\n      );\n    }\n\n    const didClickInside = event.composedPath().includes(this.shadowRoot.host);\n\n    if (!didClickInside) {\n      const outsideClickEvent = new CustomEvent('outsideClick', {\n        detail: {\n          composedPath: event.composedPath(),\n        },\n      });\n      this.dispatchEvent(outsideClickEvent);\n    }\n  }\n\n  private emitSelectedDate(date: string) {\n    const event = new CustomEvent('dateSelect', {\n      detail: {\n        date,\n      },\n    });\n    this.currentDate = new Date(`${date}T00:00`);\n    this.dispatchEvent(event);\n  }\n\n  private changeYear(year: number) {\n    const oldDate = this.currentDate;\n    const newDate = new Date(oldDate.setFullYear(year));\n    this.currentDate = newDate;\n    this.activeModal = CalendarModal.None;\n  }\n\n  private changeMonth(month: number) {\n    const oldDate = this.currentDate;\n    const newDate = new Date(oldDate.setMonth(month));\n    this.currentDate = newDate;\n    this.activeModal = CalendarModal.None;\n  }\n\n  private activateModal(modal: CalendarModal): void {\n    this.activeModal = modal;\n  }\n\n  /* Helper/Get Functions */\n  static formatMonthOrDayIndex(val: number): string {\n    return (val + 1).toString().padStart(2, '0');\n  }\n\n  static formatDate(val: number): string {\n    return val.toString().padStart(2, '0');\n  }\n\n  private numberOfDaysinMonth(): number {\n    return new Date(this.getYear(), this.getMonth() + 1, 0).getDate();\n  }\n\n  private getMonth(): number {\n    return this.currentDate.getMonth();\n  }\n\n  private getMonthName(): string {\n    const monthName = new Intl.DateTimeFormat(this.locale, {\n      month: 'long',\n    }).format(this.currentDate);\n    return monthName;\n  }\n\n  private getYear(): number {\n    return this.currentDate.getFullYear();\n  }\n\n  static dateToString(date: Date): string {\n    return `${date.getFullYear()}-${Cre8Calendar.formatMonthOrDayIndex(\n      date.getMonth()\n    )}-${Cre8Calendar.formatDate(date.getDate())}`;\n  }\n\n  private async updateFocusForKeydown(newDate: Date): Promise<void> {\n    this.currentDate = newDate;\n    await this.updateComplete;\n\n    const newFocus = this.shadowRoot?.querySelector<HTMLButtonElement>(\n      `button[datetime=\"${Cre8Calendar.dateToString(newDate)}\"]`\n    );\n    newFocus.setAttribute('tabindex', '0');\n    newFocus.focus();\n  }\n\n  private _handleCalendarKeyDown(e: KeyboardEvent) {\n    const oldFocus = this.shadowRoot?.querySelector<HTMLButtonElement>(\n      `button[datetime=\"${Cre8Calendar.dateToString(this.currentDate)}\"]`\n    );\n    if (e.key === 'ArrowUp') {\n      const newDate = new Date(\n        this.getYear(),\n        this.getMonth(),\n        this.currentDate.getDate() - 7\n      );\n      this.updateFocusForKeydown(newDate);\n      oldFocus.setAttribute('tabindex', '-1');\n    }\n    if (e.key === 'ArrowDown') {\n      const newDate = new Date(\n        this.getYear(),\n        this.getMonth(),\n        this.currentDate.getDate() + 7\n      );\n      this.updateFocusForKeydown(newDate);\n      oldFocus.setAttribute('tabindex', '-1');\n    }\n    if (e.key === 'ArrowLeft') {\n      const newDate = new Date(\n        this.getYear(),\n        this.getMonth(),\n        this.currentDate.getDate() - 1\n      );\n      this.updateFocusForKeydown(newDate);\n      oldFocus.setAttribute('tabindex', '-1');\n    }\n    if (e.key === 'ArrowRight') {\n      const newDate = new Date(\n        this.getYear(),\n        this.getMonth(),\n        this.currentDate.getDate() + 1\n      );\n      this.updateFocusForKeydown(newDate);\n      oldFocus.setAttribute('tabindex', '-1');\n    }\n    if (e.key === 'Tab' && !e.shiftKey) {\n      const outsideClickEvent = new CustomEvent('outsideClick', {\n        detail: {\n          composedPath: [],\n        },\n      });\n      // This allows the tab off to happen before the calendar closes\n      setTimeout(() => { this.dispatchEvent(outsideClickEvent); }, 20);\n    }\n  }\n\n  private async changeMonthFromNav(month: number): Promise<void> {\n    this.changeMonth(month);\n    await this.updateComplete;\n\n    const nav = this.shadowRoot?.querySelector(\n      'cre8-calendar-navigation'\n    );\n    const monthPickerButton = nav.shadowRoot?.querySelector(\n      '.cre8-c-calendar-navigation__month-modal-button'\n    );\n    await this.updateComplete;\n\n    const button = monthPickerButton.shadowRoot.querySelector<HTMLButtonElement>('button');\n    button.focus();\n  }\n\n  private async changeYearFromNav(year: number) {\n    this.changeYear(year);\n    await this.updateComplete;\n\n    const nav = this.shadowRoot?.querySelector(\n      'cre8-calendar-navigation'\n    );\n    const yearPickerButton = nav.shadowRoot?.querySelector(\n      '.cre8-c-calendar-navigation__year-modal-button'\n    );\n    await this.updateComplete;\n\n    const button = yearPickerButton.shadowRoot.querySelector<HTMLButtonElement>('button');\n    button.focus();\n  }\n\n  /* Template Map Functions */\n  private getDaysOfWeekAbbreviations(): TemplateResult[] {\n    return this.weekDays.map(\n      (day) => html` <td>\n        <span aria-label=\"${day}\">${day[0]}</span>\n      </td>`\n    );\n  }\n\n  /**\n   * Create array of Day Buttons to fill in excess calendar space at the beginning of the month.\n   *\n   * 1. Map from empty array of length equal to the amount of access calendar \"slots\" in the beginning of the month.\n   * (i.e. if the month starts on Wednesday (getDay = 3), there are 3 days prior that week from last month.)\n   *\n   * 2. Based on the indice of array, get the given day button's date, where the date is\n   * the last day of last month minus the max of the array plus the indice plus one -> x = lastday - (max - (i + 1))\n   * (Note: (max - (i + 1) equals the keys of the array in reverse order:\n   * [max - i + 1] -> [3-1, 3-2, 3-3] -> [2,1,0] for an array of [3])\n   * (i.e. if the calendar is starting on Wednesday June 1st, the access days on the calendar will be\n   * Sunday May 29th (31 - (2)), Monday May 30th (31 - (1)), Tuesday May 31st (31 - (0)))\n   *\n   * 3. Build out day button with necessary props\n   * */\n  private getPreviousMonthDayButtons(): TemplateResult[] {\n    /* 1 */\n    return [\n      ...Array(new Date(this.getYear(), this.getMonth(), 1).getDay()).keys(),\n    ].map((i) => {\n      const priorMonthArrayLength = new Date(\n        this.getYear(),\n        this.getMonth(),\n        1\n      ).getDay();\n\n      const finalDayLastMonth = new Date(this.getYear(), this.getMonth(), 0);\n      const numberOfDaysinLastMonth = finalDayLastMonth.getDate();\n\n      /* 2 */\n      const priorMonthDay = new Date(\n        finalDayLastMonth.getFullYear(),\n        finalDayLastMonth.getMonth(),\n        numberOfDaysinLastMonth - priorMonthArrayLength + (i + 1)\n      );\n\n      const isToday = this.dateConfig.today.getDate() === priorMonthDay.getDate()\n        && this.dateConfig.today.getMonth() === priorMonthDay.getMonth()\n        && this.dateConfig.today.getFullYear() === priorMonthDay.getFullYear();\n\n      const isSelected = new Date(`${this.fieldDate}T00:00`).getTime()\n        === priorMonthDay.getTime();\n\n      /* 3 */\n      return html` <td>\n        <button\n          class=\"cre8-c-calendar__day-button cre8-c-calendar__different-month\"\n          datetime=\"${Cre8Calendar.dateToString(priorMonthDay)}\"\n          ?data-today=\"${isToday}\"\n          ?data-selected=\"${isSelected}\"\n          tabindex=\"-1\"\n          aria-label=\"${new Intl.DateTimeFormat(this.locale, {\n            weekday: 'long',\n            year: 'numeric',\n            month: 'long',\n            day: 'numeric',\n          }).format(\n            new Date(`${Cre8Calendar.dateToString(priorMonthDay)}T00:00`)\n          )}\"\n          @click=\"${() => this.emitSelectedDate(Cre8Calendar.dateToString(priorMonthDay))}\"\n        >\n          ${new Intl.NumberFormat(this.locale).format(priorMonthDay.getDate())}\n        </button>\n      </td>`;\n    });\n  }\n\n  /**\n   * Create array of Day Buttons to fill out current month\n   *\n   * 1. Map from empty array of length equal to the amount days in this month\n   *\n   * 2. Get the date of the current month based on indice of array (i.e. 0 -> 1st, 1 -> 2nd ...)\n   *\n   * 3. Build out day button with necessary props\n   * */\n  private getCurrentMonthDayButtons(): TemplateResult[] {\n    /* 1 */\n    return [...Array(this.numberOfDaysinMonth()).keys()].map((i) => {\n      const dayOfTheMonth = i + 1;\n      /* 2 */\n      const current = new Date(this.getYear(), this.getMonth(), dayOfTheMonth);\n\n      const isToday = this.dateConfig.today.getDate() === dayOfTheMonth\n        && this.dateConfig.today.getMonth() === this.getMonth()\n        && this.dateConfig.today.getFullYear() === this.getYear();\n\n      const isSelected = new Date(`${this.fieldDate}T00:00`).getTime() === current.getTime();\n\n      /* 3 */\n      return html` <td>\n        <button\n          class=\"cre8-c-calendar__day-button\"\n          datetime=\"${Cre8Calendar.dateToString(current)}\"\n          ?data-today=\"${isToday}\"\n          ?data-selected=\"${isSelected}\"\n          tabindex=\"${dayOfTheMonth === this.currentDate.getDate()\n            ? '0'\n            : '-1'}\"\n          aria-label=\"${new Intl.DateTimeFormat(this.locale, {\n            weekday: 'long',\n            year: 'numeric',\n            month: 'long',\n            day: 'numeric',\n          }).format(new Date(`${Cre8Calendar.dateToString(current)}T00:00`))}\"\n          @click=\"${() => this.emitSelectedDate(Cre8Calendar.dateToString(current))}\"\n        >\n          ${new Intl.NumberFormat(this.locale).format(i + 1)}\n        </button>\n      </td>`;\n    });\n  }\n\n  /**\n   * Create array of Day Buttons to fill in excess calendar space at the end of the month.\n   *\n   * 1. Map from empty array of length equal to the amount of access calendar \"slots\" at the end of the month.\n   * The array have an amount of slots equal to the number of days in a week minus how many days have already past\n   * and since getDay returns the index of the day of the week (Sunday = 0, Monday = 1 ...) our equations is\n   * x = 7 - (getDay() + 1)\n   * Note: (we need to add 1 because indexing starts at 0)\n   * so if the month ends on Monday (getDay() = 1), 5 = 7 - (1 + 1), there are 5 days that week from the new month\n   *\n   * 2. Get the date from the next month based on indice of array (i.e. 0 -> 1st, 1 -> 2nd ...)\n   *\n   * 3. Build out day button with necessary props\n   * */\n  private getNextMonthDayButtons(): TemplateResult[] {\n    /* 1 */\n    return [\n      ...Array(\n        6\n          - new Date(\n            this.getYear(),\n            this.getMonth(),\n            this.numberOfDaysinMonth()\n          ).getDay()\n      ).keys(),\n    ].map((i) => {\n      const lastDayThisMonth = new Date(\n        this.getYear(),\n        this.getMonth(),\n        this.numberOfDaysinMonth()\n      );\n      const firstDayNextMonth = new Date(\n        lastDayThisMonth.setDate(lastDayThisMonth.getDate() + 1)\n      );\n\n      /* 2 */\n      const nextMonthDay = new Date(\n        firstDayNextMonth.getFullYear(),\n        firstDayNextMonth.getMonth(),\n        i + 1\n      );\n\n      const isToday = this.dateConfig.today.getDate() === nextMonthDay.getDate()\n        && this.dateConfig.today.getMonth() === nextMonthDay.getMonth()\n        && this.dateConfig.today.getFullYear() === nextMonthDay.getFullYear();\n\n      const isSelected = new Date(`${this.fieldDate}T00:00`).getTime()\n        === nextMonthDay.getTime();\n\n      /* 3 */\n      return html` <td>\n        <button\n          class=\"cre8-c-calendar__day-button cre8-c-calendar__different-month\"\n          datetime=\"${Cre8Calendar.dateToString(nextMonthDay)}\"\n          ?data-today=\"${isToday}\"\n          ?data-selected=\"${isSelected}\"\n          tabindex=\"-1\"\n          aria-label=\"${new Intl.DateTimeFormat(this.locale, {\n            weekday: 'long',\n            year: 'numeric',\n            month: 'long',\n            day: 'numeric',\n          }).format(\n            new Date(`${Cre8Calendar.dateToString(nextMonthDay)}T00:00`)\n          )}\"\n          @click=\"${() => this.emitSelectedDate(Cre8Calendar.dateToString(nextMonthDay))}\"\n        >\n          ${new Intl.NumberFormat(this.locale).format(nextMonthDay.getDate())}\n        </button>\n      </td>`;\n    });\n  }\n\n  render() {\n    const componentClassNames = this.componentClassNames('cre8-c-calendar', {});\n\n    return html` <div class=\"${componentClassNames}\">\n      ${this._activeModal === CalendarModal.Month\n        ? html`<cre8-calendar-month-modal\n            currentMonth=\"${this.getMonth()}\"\n            @changeMonth=\"${(e: CustomEvent) => this.changeMonthFromNav(e.detail.month)}\"\n          ></cre8-calendar-month-modal>`\n        : nothing}\n      ${this._activeModal === CalendarModal.Year\n        ? html`<cre8-calendar-year-modal\n            currentYear=\"${this.getYear()}\"\n            @changeYear=\"${(e: CustomEvent) => this.changeYearFromNav(e.detail.year)}\"\n          ></cre8-calendar-year-modal>`\n        : nothing}\n      ${this._activeModal === CalendarModal.None\n        ? html` ${this.hasShortcuts\n              ? html`<div class=\"cre8-c-calendar__header-shortcuts\">\n                    <cre8-button\n                      text=\"Today\"\n                      variant=\"secondary\"\n                      size=\"sm\"\n                      @click=\"${() => this.emitSelectedDate(\n                          Cre8Calendar.dateToString(this.dateConfig.today)\n                        )}\"\n                    ></cre8-button>\n                    <cre8-button\n                      text=\"Tomorrow\"\n                      variant=\"secondary\"\n                      size=\"sm\"\n                      @click=\"${() => this.emitSelectedDate(\n                          Cre8Calendar.dateToString(\n                            new Date(\n                              this.dateConfig.today.setDate(\n                                this.dateConfig.today.getDate() + 1\n                              )\n                            )\n                          )\n                        )}\"\n                    ></cre8-button>\n                    <cre8-button\n                      text=\"In 2 days\"\n                      variant=\"secondary\"\n                      size=\"sm\"\n                      @click=\"${() => this.emitSelectedDate(\n                          Cre8Calendar.dateToString(\n                            new Date(\n                              this.dateConfig.today.setDate(\n                                this.dateConfig.today.getDate() + 2\n                              )\n                            )\n                          )\n                        )}\"\n                    ></cre8-button>\n                </div>`\n              : nothing}\n            <cre8-calendar-navigation\n              monthName=\"${this.getMonthName()}\"\n              year=\"${this.getYear()}\"\n              @activateModal=\"${(e: CustomEvent) => this.activateModal(e.detail.modal)}\"\n              @changeMonth=\"${(e: CustomEvent) => this.changeMonth(this.getMonth() + e.detail.addend)}\"\n              @changeYear=\"${(e: CustomEvent) => this.changeYear(this.getYear() + e.detail.addend)}\"\n            >\n            </cre8-calendar-navigation>\n            <table>\n              <thead>\n                <tr>\n                  ${this.getDaysOfWeekAbbreviations()}\n                </tr>\n              </thead>\n              <tbody>\n                <tr @keydown=${this._handleCalendarKeyDown}>\n                  ${this.getPreviousMonthDayButtons()}\n                  ${this.getCurrentMonthDayButtons()}\n                  ${this.getNextMonthDayButtons()}\n                </tr>\n              </tbody>\n            </table>`\n        : nothing}\n    </div>`;\n  }\n}\n\nif (customElements.get('cre8-calendar') === undefined) {\n  customElements.define('cre8-calendar', Cre8Calendar);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cre8-calendar': Cre8Calendar;\n  }\n}\n"]}

package/lib/components/date-picker/calendar/calendar.styles.js

@@ -0,0 +1,4 @@
+import { css } from 'lit';
+const styles = css `*,::slotted(*),*:before,*:after{box-sizing:border-box}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{--cre8-z-index-1: 1;--cre8-z-index-50: 50;--cre8-z-index-100: 100;--cre8-z-index-200: 200;--cre8-z-index-1030: 1030;--cre8-anim-fade-quick: 0.35s;--cre8-anim-ease: ease}@keyframes fadeIn{100%{opacity:1}}@keyframes slideIn{100%{transform:translateX(0)}}@keyframes slideInFwd{100%{width:272px;height:272px}}@keyframes slideOutRight{100%{width:272px;height:272px}}@keyframes slideUp{100%{transform:translateY(0)}}@media(width >= 481px){@keyframes slideInFwd{100%{width:417px;height:417px}}@keyframes slideOutRight{100%{width:417px;height:417px}}}@media(width >= 48rem){@keyframes slideInFwd{100%{width:330px;height:330px}}@keyframes slideOutRight{100%{width:330px;height:330px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 60rem){@keyframes slideInFwd{100%{width:460px;height:460px}}@keyframes slideOutRight{100%{width:460px;height:460px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 75rem){@keyframes slideInFwd{100%{width:592px;height:591px}}@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 87.5rem){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 120px))}}}@media(width >= 2200px){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 592px))}}}span.ripple{position:absolute;border-radius:50%;transform:scale(0);animation:ripple 600ms linear;background-color:var(--ripple-bg-color)}@keyframes ripple{to{transform:scale(4);opacity:1}}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}.cre8-c-calendar{min-width:340px;border:var(--cre8-color-border-strong);border-radius:var(--cre8-border-radius-default);border-width:var(--cre8-border-width-default);border-style:var(--cre8-border-style-default);margin-top:0.25rem;background-color:var(--cre8-color-bg-default);position:absolute}.cre8-c-calendar__header-shortcuts{display:inline-flex;justify-content:center;width:100%;padding-top:1rem;padding-bottom:0.5rem}.cre8-c-calendar__header-shortcuts cre8-button+cre8-button{padding-left:0.5rem}.cre8-c-calendar__header-shortcuts cre8-button{max-height:32px}table{width:100%}tr{font-family:var(--cre8-typography-body-default-font-family);font-size:var(--cre8-typography-body-default-font-size);font-weight:var(--cre8-typography-body-default-font-weight);line-height:var(--cre8-typography-body-default-line-height);text-decoration:var(--cre8-typography-body-default-text-decoration);text-transform:var(--cre8-typography-body-default-text-transform);display:grid;grid-row-gap:.33em;grid-template-columns:repeat(7, 1fr);list-style:none;margin:unset;padding:unset;position:relative}td{align-items:center;display:flex;height:48px;justify-content:center;width:48px}.cre8-c-calendar :is(thead,tbody) :is(span,button){font-family:var(--cre8-typography-body-default-font-family);font-size:var(--cre8-typography-body-default-font-size);font-weight:var(--cre8-typography-body-default-font-weight);line-height:var(--cre8-typography-body-default-line-height);text-decoration:var(--cre8-typography-body-default-text-decoration);text-transform:var(--cre8-typography-body-default-text-transform);align-items:center;block-size:2em;border-radius:var(--cre8-border-radius-brand);display:flex;inline-size:2em;justify-content:center;margin-block:var(0, 0 0.33em);user-select:none}.cre8-c-calendar__day-button{border:none;background:none;margin:0;padding:0}.cre8-c-calendar__day-button:hover,.cre8-c-calendar__day-button:focus{background:var(--cre8-color-bg-default-hover)}.cre8-c-calendar__day-button.cre8-c-calendar__different-month{color:var(--cre8-color-content-subtle)}.cre8-c-calendar__day-button.cre8-c-calendar__different-month:hover,.cre8-c-calendar__day-button.cre8-c-calendar__different-month:focus{background:var(--cre8-color-bg-subtle)}.cre8-c-calendar__day-button[data-today]{color:var(--cre8-color-content-brand);border-color:var(--cre8-color-border-brand);border-width:var(--cre8-border-width-default);border-style:var(--cre8-border-style-default)}.cre8-c-calendar__day-button[data-selected]{background:var(--cre8-color-bg-brand-strong);color:var(--cre8-color-content-knockout)}.cre8-c-calendar__day-button[data-selected]:hover,.cre8-c-calendar__day-button[data-selected]:focus{background:var(--cre8-color-bg-brand-strong-hover)}`;
+export default styles;
+//# sourceMappingURL=calendar.styles.js.map

package/lib/components/date-picker/calendar/calendar.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.styles.js","sourceRoot":"","sources":["../../../../components/date-picker/calendar/calendar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,MAAM,GAAG,GAAG,CAAA,o7IAAo7I,CAAC;AACv8I,eAAe,MAAM,CAAC","sourcesContent":["import { css } from 'lit';\nconst styles = css`*,::slotted(*),*:before,*:after{box-sizing:border-box}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{--cre8-z-index-1: 1;--cre8-z-index-50: 50;--cre8-z-index-100: 100;--cre8-z-index-200: 200;--cre8-z-index-1030: 1030;--cre8-anim-fade-quick: 0.35s;--cre8-anim-ease: ease}@keyframes fadeIn{100%{opacity:1}}@keyframes slideIn{100%{transform:translateX(0)}}@keyframes slideInFwd{100%{width:272px;height:272px}}@keyframes slideOutRight{100%{width:272px;height:272px}}@keyframes slideUp{100%{transform:translateY(0)}}@media(width >= 481px){@keyframes slideInFwd{100%{width:417px;height:417px}}@keyframes slideOutRight{100%{width:417px;height:417px}}}@media(width >= 48rem){@keyframes slideInFwd{100%{width:330px;height:330px}}@keyframes slideOutRight{100%{width:330px;height:330px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 60rem){@keyframes slideInFwd{100%{width:460px;height:460px}}@keyframes slideOutRight{100%{width:460px;height:460px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 75rem){@keyframes slideInFwd{100%{width:592px;height:591px}}@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 87.5rem){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 120px))}}}@media(width >= 2200px){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 592px))}}}span.ripple{position:absolute;border-radius:50%;transform:scale(0);animation:ripple 600ms linear;background-color:var(--ripple-bg-color)}@keyframes ripple{to{transform:scale(4);opacity:1}}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}.cre8-c-calendar{min-width:340px;border:var(--cre8-color-border-strong);border-radius:var(--cre8-border-radius-default);border-width:var(--cre8-border-width-default);border-style:var(--cre8-border-style-default);margin-top:0.25rem;background-color:var(--cre8-color-bg-default);position:absolute}.cre8-c-calendar__header-shortcuts{display:inline-flex;justify-content:center;width:100%;padding-top:1rem;padding-bottom:0.5rem}.cre8-c-calendar__header-shortcuts cre8-button+cre8-button{padding-left:0.5rem}.cre8-c-calendar__header-shortcuts cre8-button{max-height:32px}table{width:100%}tr{font-family:var(--cre8-typography-body-default-font-family);font-size:var(--cre8-typography-body-default-font-size);font-weight:var(--cre8-typography-body-default-font-weight);line-height:var(--cre8-typography-body-default-line-height);text-decoration:var(--cre8-typography-body-default-text-decoration);text-transform:var(--cre8-typography-body-default-text-transform);display:grid;grid-row-gap:.33em;grid-template-columns:repeat(7, 1fr);list-style:none;margin:unset;padding:unset;position:relative}td{align-items:center;display:flex;height:48px;justify-content:center;width:48px}.cre8-c-calendar :is(thead,tbody) :is(span,button){font-family:var(--cre8-typography-body-default-font-family);font-size:var(--cre8-typography-body-default-font-size);font-weight:var(--cre8-typography-body-default-font-weight);line-height:var(--cre8-typography-body-default-line-height);text-decoration:var(--cre8-typography-body-default-text-decoration);text-transform:var(--cre8-typography-body-default-text-transform);align-items:center;block-size:2em;border-radius:var(--cre8-border-radius-brand);display:flex;inline-size:2em;justify-content:center;margin-block:var(0, 0 0.33em);user-select:none}.cre8-c-calendar__day-button{border:none;background:none;margin:0;padding:0}.cre8-c-calendar__day-button:hover,.cre8-c-calendar__day-button:focus{background:var(--cre8-color-bg-default-hover)}.cre8-c-calendar__day-button.cre8-c-calendar__different-month{color:var(--cre8-color-content-subtle)}.cre8-c-calendar__day-button.cre8-c-calendar__different-month:hover,.cre8-c-calendar__day-button.cre8-c-calendar__different-month:focus{background:var(--cre8-color-bg-subtle)}.cre8-c-calendar__day-button[data-today]{color:var(--cre8-color-content-brand);border-color:var(--cre8-color-border-brand);border-width:var(--cre8-border-width-default);border-style:var(--cre8-border-style-default)}.cre8-c-calendar__day-button[data-selected]{background:var(--cre8-color-bg-brand-strong);color:var(--cre8-color-content-knockout)}.cre8-c-calendar__day-button[data-selected]:hover,.cre8-c-calendar__day-button[data-selected]:focus{background:var(--cre8-color-bg-brand-strong-hover)}`;\nexport default styles;\n"]}