@tmorrow/cre8-wc 1.0.14

package/lib/components/components/cre8-element/components/cre8-element.js

@@ -0,0 +1,58 @@
+import l from "/Users/tylersmbp/Projects/cre8-web-components/packages/cre8-wc/node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.js";
+import { LitElement as m, html as i } from "lit";
+class c extends m {
+  /**
+   * Abstraction of `classnames` that automatically includes any style modifier
+   * as well as any set variants.
+   *
+   * It is expected that `variant` would be overridden in a subclass with more
+   * specific types, `@property() variant?: 'foo' | 'bar'`
+   *
+   * @param baseClassName
+   */
+  componentClassNames(t, e = {}) {
+    return l(t, e);
+  }
+  /**
+   * Check if a slot is empty
+   *
+   * @param slotName
+   */
+  slotEmpty(t) {
+    return !this.querySelector(`[slot="${t}"]`);
+  }
+  /**
+   * Check if a slot is not empty
+   *
+   * @param slotName
+   */
+  slotNotEmpty(t) {
+    return this.slotEmpty(t) ? null : !this.slotEmpty(t);
+  }
+  /**
+  * Dispatch a custom event.
+  */
+  dispatch({
+    e: t,
+    eventName: e,
+    detailObj: r = {},
+    optionsObj: n = {}
+  }) {
+    const o = {
+      bubbles: !0,
+      composed: !0,
+      ...n,
+      detail: { ...t && { originalEvent: t }, ...r }
+    }, s = new CustomEvent(e, o);
+    return this.dispatchEvent(s), s;
+  }
+  /**
+   * Example render, should not be used
+   */
+  render() {
+    return i`<slot></slot>`;
+  }
+}
+export {
+  c as Cre8Element
+};

package/lib/components/components/cre8-form-element/components/cre8-form-element.js

@@ -0,0 +1,47 @@
+import { property as h } from "lit/decorators.js";
+import { Cre8Element as d } from "../../cre8-element/components/cre8-element.js";
+var p = Object.defineProperty, o = Object.getOwnPropertyDescriptor, f = (r, t, i, n) => {
+  for (var e = o(t, i), s = r.length - 1, u; s >= 0; s--)
+    (u = r[s]) && (e = u(t, i, e) || e);
+  return e && p(t, i, e), e;
+};
+const l = class l extends d {
+  get value() {
+    return this.internalValue;
+  }
+  /**
+   * Sets the value of the form field.
+   * 1. Stores the new value so it can be retrieved by the getter.
+   * 2. Sets the current value of the control.
+   * 3. Updates the actual field.
+   * 4. Rerenders the component.
+   */
+  set value(t) {
+    const i = this.value;
+    this.internalValue = t, this.type !== "checkbox" && this.type !== "radio" && this.internals.setFormValue(t), this.updateField(), this.requestUpdate("value", i);
+  }
+  /**
+   * update the actual field's value
+   */
+  updateField() {
+    this.field && (this.field.value = this.value !== void 0 ? this.value : "");
+  }
+  firstUpdated() {
+    this.type !== "checkbox" && this.type !== "radio" && (this.defaultValue = this.value || this.getAttribute("value") || ""), this.updateField();
+  }
+  formResetCallback() {
+    this.value = this.defaultValue, this.updateField();
+  }
+  constructor() {
+    super(), this.internals = this.attachInternals();
+  }
+};
+l.formAssociated = !0;
+let a = l;
+f([
+  h()
+], a.prototype, "value");
+export {
+  a as Cre8FormElement,
+  a as default
+};

package/lib/components/cre8-element.d.ts

@@ -0,0 +1,54 @@
+import { LitElement } from 'lit';
+export interface DetailObj {
+    [key: string]: unknown;
+}
+export interface Cre8DispatchProps {
+    e?: Event;
+    eventName: string;
+    detailObj?: DetailObj;
+    optionsObj?: {
+        [key: string]: unknown;
+    };
+}
+export interface Cre8Event extends Event {
+    detail: {
+        originalEvent: Event;
+        detailObj: DetailObj;
+    };
+}
+/**
+ * A base element.
+ */
+export declare class Cre8Element extends LitElement {
+    /**
+     * Abstraction of `classnames` that automatically includes any style modifier
+     * as well as any set variants.
+     *
+     * It is expected that `variant` would be overridden in a subclass with more
+     * specific types, `@property() variant?: 'foo' | 'bar'`
+     *
+     * @param baseClassName
+     */
+    componentClassNames(baseClassName: string, additionalClassNames?: {}): string;
+    /**
+     * Check if a slot is empty
+     *
+     * @param slotName
+     */
+    slotEmpty(slotName: string): boolean;
+    /**
+     * Check if a slot is not empty
+     *
+     * @param slotName
+     */
+    slotNotEmpty(slotName: string): boolean;
+    /**
+   * Dispatch a custom event.
+   */
+    dispatch({ e, eventName, detailObj, optionsObj, }: Cre8DispatchProps): CustomEvent;
+    /**
+     * Example render, should not be used
+     */
+    render(): import("lit-html").TemplateResult<1>;
+}
+//# sourceMappingURL=cre8-element.d.ts.map

package/lib/components/cre8-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cre8-element.d.ts","sourceRoot":"","sources":["../../components/cre8-element.ts"],"names":[],"mappings":"AACA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAEvC,MAAM,WAAW,SAAS;IACxB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,iBAAiB;IAChC,CAAC,CAAC,EAAE,KAAK,CAAC;IACV,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;KAAE,CAAC;CACzC;AAED,MAAM,WAAW,SAAU,SAAQ,KAAK;IACtC,MAAM,EAAE;QACN,aAAa,EAAE,KAAK,CAAC;QACrB,SAAS,EAAE,SAAS,CAAC;KACtB,CAAC;CACH;AAED;;GAEG;AACH,qBAAa,WAAY,SAAQ,UAAU;IACzC;;;;;;;;OAQG;IACD,mBAAmB,CAAC,aAAa,EAAE,MAAM,EAAE,oBAAoB,KAAK;IAItE;;;;OAIG;IACD,SAAS,CAAC,QAAQ,EAAE,MAAM;IAI5B;;;;OAIG;IACD,YAAY,CAAC,QAAQ,EAAE,MAAM;IAO7B;;KAEC;IACD,QAAQ,CAAC,EACL,CAAC,EAAE,SAAS,EAAE,SAAc,EAAE,UAAe,GAChD,EAAE,iBAAiB,GAAG,WAAW;IAYpC;;OAEG;IACD,MAAM;CAGT"}

package/lib/components/cre8-field/cre8-field.js

@@ -0,0 +1,10 @@
+import "lit";
+import "lit-html/directives/if-defined.js";
+import "lit/decorators.js";
+import "/Users/tylersmbp/Projects/cre8-web-components/packages/cre8-wc/node_modules/.pnpm/nanoid@5.1.6/node_modules/nanoid/index.browser.js";
+import "../components/cre8-form-element/components/cre8-form-element.js";
+import { a as e, a as d } from "../../field-J4OEwkTq.js";
+export {
+  e as Cre8Field,
+  d as default
+};

package/lib/components/cre8-form-element.d.ts

@@ -0,0 +1,62 @@
+import { Cre8Element } from './cre8-element';
+export declare abstract class Cre8FormElement extends Cre8Element {
+    /**
+     * @internal
+     *
+     * Tells the browser to treat the element like a form field.
+     * Ties the element to the HTML form it is in.
+     *
+     */
+    static formAssociated: boolean;
+    abstract type: string;
+    /**
+     * @protected
+     * @internal
+     *
+     * An instance of element internals.
+     * Contains properties and methods that allows the element
+     * to participate fully in the HTML form it's in.
+     */
+    internals: ElementInternals;
+    /**
+     * @protected
+     * @internal
+     *
+     * Stores the value for the `value` getter and setter.
+     */
+    internalValue: string;
+    /**
+     * @internal
+     *
+     * Stores the intial value of the field so that it can be reset
+     */
+    protected defaultValue: string | boolean;
+    /**
+     * @internal
+     * The underlying HTML form field.
+     * This should be implemented with `@query`
+     * in the implementing class.
+     */
+    abstract field: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement | HTMLButtonElement;
+    /**
+     * The value of the form field.
+     */
+    get value(): string;
+    /**
+     * Sets the value of the form field.
+     * 1. Stores the new value so it can be retrieved by the getter.
+     * 2. Sets the current value of the control.
+     * 3. Updates the actual field.
+     * 4. Rerenders the component.
+     */
+    set value(newValue: string);
+    /**
+     * update the actual field's value
+     */
+    protected updateField(): void;
+    protected firstUpdated(): void;
+    formResetCallback(): void;
+    constructor();
+}
+export default Cre8FormElement;
+//# sourceMappingURL=cre8-form-element.d.ts.map

package/lib/components/cre8-form-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cre8-form-element.d.ts","sourceRoot":"","sources":["../../components/cre8-form-element.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAM7C,8BAAsB,eAAgB,SAAQ,WAAW;IACvD;;;;;;OAMG;IACD,MAAM,CAAC,cAAc,UAAQ;IAE/B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IAEtB;;;;;;;OAOG;IACH,SAAS,EAAE,gBAAgB,CAAC;IAE5B;;;;;OAKG;IACH,aAAa,EAAE,MAAM,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAAC;IAEzC;;;;;OAKG;IACH,QAAQ,CAAC,KAAK,EAAE,gBAAgB,GAAG,iBAAiB,GAAG,mBAAmB,GAAG,iBAAiB,CAAC;IAE/F;;OAEG;IACH,IACI,KAAK,IAWW,MAAM,CATzB;IAED;;;;;;OAMG;IACH,IAAI,KAAK,CAAC,QAAQ,EAAE,MAAM,EAYzB;IAED;;OAEG;IACH,SAAS,CAAC,WAAW;IAMrB,SAAS,CAAC,YAAY;IAOtB,iBAAiB;;CASlB;AAED,eAAe,eAAe,CAAC"}

package/lib/components/danger-button/danger-button.d.ts

@@ -0,0 +1,208 @@
+import '../icon/icon';
+import '../loading-spinner/loading-spinner';
+import { Cre8FormElement } from '../cre8-form-element';
+/**
+     * The size and state of buttons on the screen serve as visual cues for the user
+     * about what they can do and what they should do next.
+     * They indicate the availability and priority of the action on the page.
+     *
+     * - Buttons are a single call-to-action where a single click performs that action
+     * - Use Danger Buttons when you are performing an action that is potentially dangerous,
+     * such as permanently deleting information
+     * - Use a link instead of a button when you're navigating to another place
+     *
+     * ## How to Use
+     *
+     * Danger Buttons are distinguished by three key properties:
+     *
+     * - **Visual Priority**: Style and size: Primary, Secondary, or Tertiary styles;
+     *   each with large and small variations
+     * - **State**: Interaction state: hover/click (press), focus, disabled,
+     *   and submitting/loading (only for large buttons)
+     * - **Brand**: Styles determined by the site or component theme
+     *
+     * ### Usage Guidelines
+     *
+     * Primary, Secondary and Tertiary styles emphasize or de-emphasize an action. They also define
+     * background, font style, and border colors. Large and small sizing assists with visual priority by defining button
+     * heights, left and right internal padding, and font-size.
+     *
+     * #### System Feedback
+     * Each button has a default and hover/click (press) state that give the user feedback
+     * that they have successfully interacted with a button.
+     * Button presses should always be combined with other types of timely system feedback.
+     * Examples of system feedback may be a page refresh, exposing additional controls or content,
+     * dialogs, alerts and notifications.
+     * If there is perceived a delay in system response, generally due to technical constraints,
+     * provide a progress or loading indicator.
+     *
+     * #### Button Text
+     *
+     * - Button text should be as short and simple as possible, ideally a maximum of 3 words.
+     * - Use Title Case for readability.
+     * - They should not include punctuation (exception: "Loading...").
+     * - They should not be used as an indicator of what happens on the next page, or as a substitute
+     * for a progress meter.
+     *
+     * #### Button Styling
+     *
+     * - DO use only the styles of the brand you are working on.
+     * - DO NOT combine styles, even if the page is co-branded.
+     *
+     * #### Button Sizes
+     * - DO always pair like sizes together and maintain the hierarchy of Primary and Secondary/Tertiary.
+     * - DO NOT mix sizes of buttons when they are used together as a group.
+     *
+     * #### Input Pairing
+     *
+     * Primary and Secondary buttons may be paired with input fields.
+     * Only one Primary button may appear on each screen.
+     * Use the Secondary button when there are multiple in-context buttons
+     * and/or when there is an emphasized page level button.
+     * When used in a form context, the button's `type` needs to be `submit` to pass along form data.
+     *
+     * - DO use only large buttons with input fields.
+     * - DO NOT use small buttons with input fields.
+     *
+     */
+export declare class Cre8DangerButton extends Cre8FormElement {
+    static styles: import("lit").CSSResult[];
+    /**
+     *
+     * The button text. Should be as short and simple as possible, ideally a maximum of 3 words.
+     * - Use Title Case for readability.
+     * - Should not include punctuation (exception: "Loading...").
+     * - Should not be used as an indicator of what happens on the next page, or as a substitute for a progress meter.
+     */
+    text?: string;
+    /**
+     * Style variant
+     * - **primary** renders the button used for primary actions. Presents highest visual priority.
+     *   When grouped with other buttons, only one primary is allowed
+     * - **secondary** renders a secondary button. Presents a lower visual priority
+     * - **tertiary** renders a tertiary button. Presents the lowest visual priority.
+     *   Should be used in limited amounts - consider if a link (`<a>`) would be more appropriate
+     */
+    variant?: 'primary' | 'secondary' | 'tertiary';
+    /**
+     * Disabled attribute
+     * @attr {boolean}
+     *
+     * **NOTE**: Disabled states are used to indicate that an action is temporarily unavailable.
+     * In general, using disabled states is NOT advised. It should be clear to the user what actions they must
+     * take to activate the button. Real-time, field-level validation can help provide clarity.
+     */
+    disabled?: boolean;
+    /**
+     *
+     * Provide this property if you intend to use button styles for an anchor tag (`<a>`).
+     * This changes the component markup from `<button>` usage to `<a>` instead.
+     */
+    href?: string;
+    /**
+     * Target attribute for a link if providing `href` to style a link as a button
+     * - **_blank** yields a link that opens in a new tab
+     * - **_self** yields a link that loads the URL into the same browsing context as the current one.
+     *   This is the default behavior
+     * - **_parent** yields a link that loads the URL into the parent browsing context of the current one.
+     *   If there is no parent, this behaves the same way as _self
+     * - **_top** yields a link that loads the URL into the top-level browsing context.
+     *   If there is no parent, this behaves the same way as _self.
+     */
+    target?: '_blank' | '_self' | '_parent' | '_top';
+    /**
+     * Type of button.
+     * - **button** (default) button has no default behavior and does nothing unless provided some sort
+     * of client-side trigger
+     * - **submit** button for submitting form data to a server
+     */
+    type: 'button' | 'submit' | 'reset';
+    /**
+     * Rel if this is an <a> element - this swaps <button> for <a>
+     */
+    rel?: string;
+    /**
+     * SVG raw string if including an icon within a button.
+     * Must include the icon's position with `iconPostion`. This prop is used for <cre8-icon>
+     */
+    svg?: string;
+    /**
+     * rotate is used for <cre8-icon> to set the arrow in the correct direction
+     */
+    iconRotateDegree?: number;
+    /**
+     * flip is used for <cre8-icon> to set the icon in the correct direction
+     */
+    iconFlipDirection?: string;
+    /**
+     * Icon position. Must include the name of the icon with `iconName`
+     *
+     * - **before** places the icon before the button text
+     * - **after** places the icon after the button text
+     */
+    iconPosition?: 'before' | 'after';
+    /**
+     * Size variants add another way to increase or decrease visual priority of a button.
+     * - **sm** shrinks the button typography and overall size from the default. Use when vertical space is constrained.
+     * - **lg** increases the button typography and overall size from the default.
+     */
+    size?: 'sm' | 'lg';
+    /**
+     * Visually hide button text. Text is still accessible to assistive technology.
+     * Use this for icon-only buttons for accessibility
+     */
+    hideText?: boolean;
+    /**
+     * Full width button
+     * @attr {boolean}
+     *
+     */
+    fullWidth?: boolean;
+    /**
+     * * Changes styling to an active state with a spinning icon.
+     * * Adds accessibility treatment by:
+     *   * announcing via voiceover when the loading success/error state via a aria-live region
+     *   * setting `aria-disabled`
+     * * Disables click events / form submitting while allowing focus (for accessibility)
+     * @attr {boolean}
+     *
+     */
+    loading?: boolean;
+    /**
+     * * Variant of the loading button that:
+     *   * Removes loading spinner
+     *   * Informs the SR user that the loading status is now complete, with visually hidden text in the live area
+     * @attr {boolean}
+     *
+     */
+    loadingComplete?: boolean;
+    /**
+     * Inverted colors Danger Button (onDark)
+     */
+    inverted?: boolean;
+    /**
+     * Controls whether your loading status update to voiceover users will occur
+     * immediately (used for more urgently needed updates) using `assertive` or at the next convenient
+     * pause in their navigation using `polite`.
+     */
+    ariaLive: 'polite' | 'assertive';
+    /**
+     * Button aria expanded attribute
+     */
+    buttonAriaExpanded?: boolean;
+    field: HTMLButtonElement;
+    formSubmit(): void;
+    formReset(): void;
+    private renderDangerButtonLink;
+    private renderDangerButtonIconography;
+    private renderDangerButtonLoading;
+    render(): import("lit-html").TemplateResult<1>;
+    _buttonClick(e: MouseEvent | KeyboardEvent): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cre8-danger-button': Cre8DangerButton;
+    }
+}
+export default Cre8DangerButton;
+//# sourceMappingURL=danger-button.d.ts.map

package/lib/components/danger-button/danger-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"danger-button.d.ts","sourceRoot":"","sources":["../../../components/danger-button/danger-button.ts"],"names":[],"mappings":"AAGA,OAAO,cAAc,CAAC;AACtB,OAAO,oCAAoC,CAAC;AAG5C,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA+DO;AAEP,qBAAa,gBAAiB,SAAQ,eAAe;IACjD,MAAM,CAAC,MAAM,4BAAY;IAEzB;;;;;;OAMG;IAEC,IAAI,CAAC,SAAY;IAErB;;;;;;;OAOG;IAEC,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAa;IAE/D;;;;;;;OAOG;IAEC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;OAIG;IAEC,IAAI,CAAC,EAAE,MAAM,CAAC;IAElB;;;;;;;;;OASG;IAEC,MAAM,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;IAErD;;;;;OAKG;IAEC,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAY;IAEnD;;OAEG;IAEC,GAAG,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IAEC,GAAG,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IAEC,gBAAgB,CAAC,EAAE,MAAM,CAAK;IAElC;;OAEG;IAEC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE/B;;;;;OAKG;IAEC,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAa;IAElD;;;;OAIG;IAEC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAEvB;;;OAGG;IAEC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;OAIG;IAEC,SAAS,CAAC,EAAE,OAAO,CAAC;IAExB;;;;;;;;OAQG;IAEC,OAAO,CAAC,EAAE,OAAO,CAAC;IAEtB;;;;;;OAMG;IAEC,eAAe,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IAEC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;OAIG;IAEC,QAAQ,EAAE,QAAQ,GAAG,WAAW,CAAe;IAEnD;;OAEG;IAEC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAG7B,KAAK,EAAG,iBAAiB,CAAC;IAE9B,UAAU;IAOV,SAAS;IAOT,OAAO,CAAC,sBAAsB;IAyB9B,OAAO,CAAC,6BAA6B;IAMrC,OAAO,CAAC,yBAAyB;IAejC,MAAM;IAgDC,YAAY,CAAC,CAAC,EAAE,UAAU,GAAG,aAAa;CAepD;AAMD,OAAO,CAAC,MAAM,CAAC;IAAE,UAAU,qBAAqB;QAAG,oBAAoB,EAAE,gBAAgB,CAAC;KAAE;CAAE;AAE9F,eAAe,gBAAgB,CAAC"}

package/lib/components/danger-button/danger-button.styles.d.ts

@@ -0,0 +1,3 @@
+declare const styles: import("lit").CSSResult;
+export default styles;
+//# sourceMappingURL=danger-button.styles.d.ts.map

package/lib/components/danger-button/danger-button.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"danger-button.styles.d.ts","sourceRoot":"","sources":["../../../components/danger-button/danger-button.styles.ts"],"names":[],"mappings":"AACA,QAAA,MAAM,MAAM,yBAihBX,CAAC;AACF,eAAe,MAAM,CAAC"}

package/lib/components/date-picker/calendar/calendar.d.ts

@@ -0,0 +1,115 @@
+import { TemplateResult } from 'lit';
+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 interface DateConfig {
+    locale: string;
+    today: Date;
+    weekInfo: {
+        firstDay: number;
+        weekend: Array<number>;
+    };
+}
+export interface DateFormatOptions {
+    weekday: string;
+    year: string;
+    month: string;
+    day: string;
+}
+export declare enum CalendarModal {
+    Month = "month",
+    Year = "year",
+    None = "none"
+}
+export declare class Cre8Calendar extends Cre8Element {
+    static styles: import("lit").CSSResult[];
+    /**
+     * Query the navigation wrapper
+     */
+    _navWrapper: HTMLElement;
+    hasShortcuts?: boolean;
+    _activeModal?: CalendarModal;
+    get activeModal(): CalendarModal;
+    set activeModal(activeModal: CalendarModal);
+    _fieldDate?: string;
+    get fieldDate(): string;
+    set fieldDate(newFieldDate: string);
+    _currentDate?: Date;
+    get currentDate(): Date;
+    set currentDate(newDate: Date);
+    locale: string;
+    weekDays: Array<string>;
+    dateConfig: DateConfig;
+    dateFormatOptions: DateFormatOptions;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _handleOnClickOutside;
+    private emitSelectedDate;
+    private changeYear;
+    private changeMonth;
+    private activateModal;
+    static formatMonthOrDayIndex(val: number): string;
+    static formatDate(val: number): string;
+    private numberOfDaysinMonth;
+    private getMonth;
+    private getMonthName;
+    private getYear;
+    static dateToString(date: Date): string;
+    private updateFocusForKeydown;
+    private _handleCalendarKeyDown;
+    private changeMonthFromNav;
+    private changeYearFromNav;
+    private getDaysOfWeekAbbreviations;
+    /**
+     * 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
+     * */
+    private getPreviousMonthDayButtons;
+    /**
+     * 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
+     * */
+    private getCurrentMonthDayButtons;
+    /**
+     * 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
+     * */
+    private getNextMonthDayButtons;
+    render(): TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cre8-calendar': Cre8Calendar;
+    }
+}
+//# sourceMappingURL=calendar.d.ts.map

package/lib/components/date-picker/calendar/calendar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../components/date-picker/calendar/calendar.ts"],"names":[],"mappings":"AAKA,OAAO,EACN,cAAc,EACd,MAAM,KAAK,CAAC;AAGb,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEjD,OAAO,iBAAiB,CAAC;AACzB,OAAO,8CAA8C,CAAC;AACtD,OAAO,4CAA4C,CAAC;AACpD,OAAO,4CAA4C,CAAC;AACpD,OAAO,qBAAqB,CAAC;AAE7B,MAAM,WAAW,UAAU;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,IAAI,CAAC;IACZ,QAAQ,EAAE;QACR,QAAQ,EAAE,MAAM,CAAC;QACjB,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;KACxB,CAAC;CACH;AAED,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;CACb;AAED,oBAAY,aAAa;IACvB,KAAK,UAAU;IACf,IAAI,SAAS;IACb,IAAI,SAAS;CACd;AAED,qBAAa,YAAa,SAAQ,WAAW;IAC3C,MAAM,CAAC,MAAM,4BAAY;IAGzB;;OAEG;IAEC,WAAW,EAAE,WAAW,CAAC;IAG7B,YAAY,CAAC,EAAE,OAAO,CAAC;IAEd,YAAY,CAAC,EAAE,aAAa,CAAsB;IAE3D,IACI,WAAW,IAIc,aAAa,CAFzC;IAED,IAAI,WAAW,CAAC,WAAW,EAAE,aAAa,EAEzC;IAEQ,UAAU,CAAC,EAAE,MAAM,CAAC;IAE7B,IACI,SAAS,IAIe,MAAM,CAFjC;IAED,IAAI,SAAS,CAAC,YAAY,EAAE,MAAM,EAUjC;IAEQ,YAAY,CAAC,EAAE,IAAI,CAAC;IAE7B,IACI,WAAW,IAIU,IAAI,CAF5B;IAED,IAAI,WAAW,CAAC,OAAO,EAAE,IAAI,EAI5B;IAEQ,MAAM,EAAE,MAAM,CAAC;IAEf,QAAQ,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAExB,UAAU,EAAE,UAAU,CAAC;IAEvB,iBAAiB,EAAE,iBAAiB,CAAC;;IAiC9C,iBAAiB;IAKjB,oBAAoB,IAAI,IAAI;IAM5B,OAAO,CAAC,qBAAqB;IAmB7B,OAAO,CAAC,gBAAgB;IAUxB,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,aAAa;IAKrB,MAAM,CAAC,qBAAqB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM;IAIjD,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM;IAItC,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,QAAQ;IAIhB,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,OAAO;IAIf,MAAM,CAAC,YAAY,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM;YAMzB,qBAAqB;IAWnC,OAAO,CAAC,sBAAsB;YAmDhB,kBAAkB;YAgBlB,iBAAiB;IAiB/B,OAAO,CAAC,0BAA0B;IAQlC;;;;;;;;;;;;;;SAcK;IACL,OAAO,CAAC,0BAA0B;IAoDlC;;;;;;;;SAQK;IACL,OAAO,CAAC,yBAAyB;IAqCjC;;;;;;;;;;;;;SAaK;IACL,OAAO,CAAC,sBAAsB;IA2D9B,MAAM;CAkFP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}

package/lib/components/date-picker/calendar/calendar.styles.d.ts

@@ -0,0 +1,3 @@
+declare const styles: import("lit").CSSResult;
+export default styles;
+//# sourceMappingURL=calendar.styles.d.ts.map

package/lib/components/date-picker/calendar/calendar.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.styles.d.ts","sourceRoot":"","sources":["../../../../components/date-picker/calendar/calendar.styles.ts"],"names":[],"mappings":"AACA,QAAA,MAAM,MAAM,yBA2GX,CAAC;AACF,eAAe,MAAM,CAAC"}

package/lib/components/date-picker/calendar-month-modal/calendar-month-modal.d.ts

@@ -0,0 +1,22 @@
+import { TemplateResult } from 'lit';
+import { Cre8Element } from '../../cre8-element';
+import '../../button/button';
+import '../../icon/icon';
+export declare class Cre8CalendarMonthModal extends Cre8Element {
+    static styles: import("lit").CSSResult[];
+    monthNames: Array<string>;
+    currentMonth: number;
+    constructor();
+    protected firstUpdated(): void;
+    private focusOnCurrentMonth;
+    private emitMonth;
+    getMonthListItems(): TemplateResult[];
+    render(): TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cre8-calendar-month-modal': Cre8CalendarMonthModal;
+    }
+}
+export default Cre8CalendarMonthModal;
+//# sourceMappingURL=calendar-month-modal.d.ts.map

package/lib/components/date-picker/calendar-month-modal/calendar-month-modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-month-modal.d.ts","sourceRoot":"","sources":["../../../../components/date-picker/calendar-month-modal/calendar-month-modal.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAU,MAAM,KAAK,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEjD,OAAO,qBAAqB,CAAC;AAC7B,OAAO,iBAAiB,CAAC;AAEzB,qBAAa,sBAAuB,SAAQ,WAAW;IACrD,MAAM,CAAC,MAAM,4BAAY;IAGhB,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAGjC,YAAY,EAAE,MAAM,CAAC;;IAoBrB,SAAS,CAAC,YAAY,IAAI,IAAI;YAIhB,mBAAmB;IASjC,OAAO,CAAC,SAAS;IASjB,iBAAiB,IAAI,cAAc,EAAE;IASvC,MAAM;CASP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,2BAA2B,EAAE,sBAAsB,CAAC;KACrD;CACF;AAED,eAAe,sBAAsB,CAAC"}

package/lib/components/date-picker/calendar-month-modal/calendar-month-modal.styles.d.ts

@@ -0,0 +1,3 @@
+declare const styles: import("lit").CSSResult;
+export default styles;
+//# sourceMappingURL=calendar-month-modal.styles.d.ts.map

package/lib/components/date-picker/calendar-month-modal/calendar-month-modal.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-month-modal.styles.d.ts","sourceRoot":"","sources":["../../../../components/date-picker/calendar-month-modal/calendar-month-modal.styles.ts"],"names":[],"mappings":"AACA,QAAA,MAAM,MAAM,yBAqBX,CAAC;AACF,eAAe,MAAM,CAAC"}

package/lib/components/date-picker/calendar-navigation/calendar-navigation.d.ts

@@ -0,0 +1,19 @@
+import { Cre8Element } from '../../cre8-element';
+import '../../button/button';
+import '../../icon/icon';
+export declare class Cre8CalendarNavigation extends Cre8Element {
+    static styles: import("lit").CSSResult[];
+    monthName: string;
+    year: number;
+    private activateModal;
+    private changeMonth;
+    private changeYear;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'cre8-calendar-navigation': Cre8CalendarNavigation;
+    }
+}
+export default Cre8CalendarNavigation;
+//# sourceMappingURL=calendar-navigation.d.ts.map

package/lib/components/date-picker/calendar-navigation/calendar-navigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-navigation.d.ts","sourceRoot":"","sources":["../../../../components/date-picker/calendar-navigation/calendar-navigation.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEjD,OAAO,qBAAqB,CAAC;AAC7B,OAAO,iBAAiB,CAAC;AAEzB,qBAAa,sBAAuB,SAAQ,WAAW;IACnD,MAAM,CAAC,MAAM,4BAAY;IAGvB,SAAS,EAAE,MAAM,CAAC;IAGlB,IAAI,EAAE,MAAM,CAAC;IAEjB,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,UAAU;IASlB,MAAM;CA8DP;AAMD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,0BAA0B,EAAE,sBAAsB,CAAC;KACpD;CACF;AAED,eAAe,sBAAsB,CAAC"}

package/lib/components/date-picker/calendar-navigation/calendar-navigation.styles.d.ts

@@ -0,0 +1,3 @@
+declare const styles: import("lit").CSSResult;
+export default styles;
+//# sourceMappingURL=calendar-navigation.styles.d.ts.map

package/lib/components/date-picker/calendar-navigation/calendar-navigation.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-navigation.styles.d.ts","sourceRoot":"","sources":["../../../../components/date-picker/calendar-navigation/calendar-navigation.styles.ts"],"names":[],"mappings":"AACA,QAAA,MAAM,MAAM,yBAaV,CAAC;AACH,eAAe,MAAM,CAAC"}