jebamo 0.0.1 → 0.0.2

package/dist/jebamo/p-ff27b55f.entry.js

@@ -0,0 +1,2 @@
+import{r as s,h as e,H as t}from"./p-456b52ee.js";const o=":host{display:block}";const c=o;const r=class{constructor(e){s(this,e)}render(){return e(t,{key:"8762022920e907b328a6e432e98d5d38054317d9"},e("slot",{key:"62fcd1082bd27c0dc86d80f417f4659227a78b97"}))}};r.style=c;export{r as je_tab};
+//# sourceMappingURL=p-ff27b55f.entry.js.map

package/dist/jebamo/p-ff27b55f.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["jeTabCss","JeTabStyle0","JeTab","render","h","Host","key"],"sources":["src/components/tabs/je-tab/je-tab.scss?tag=je-tab&encapsulation=shadow","src/components/tabs/je-tab/je-tab.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n","import { Component, Host, h } from '@stencil/core';\n\n@Component({\n  tag: 'je-tab',\n  styleUrl: 'je-tab.scss',\n  shadow: true,\n})\nexport class JeTab {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAW,uBACjB,MAAAC,EAAeD,E,MCMFE,EAAK,M,yBAChB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/types/components/checkbox-group/je-checkbox-group/je-checkbox-group.d.ts

@@ -0,0 +1,25 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+export declare class JeCheckboxGroup {
+    el: HTMLJeCheckboxGroupElement;
+    private originalValue?;
+    /**
+     * Label that shows above the controls
+     */
+    label?: string;
+    /**
+     * Current selected values
+     */
+    value: string[];
+    /**
+     * Emits the current selected values whenever they change
+     */
+    valueChange: EventEmitter<string[]>;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    formResetCallback(): void;
+    private getChecks;
+    handleValueChange(): void;
+    handleCheck(ev: CustomEvent<any>): void;
+    handleUncheck(ev: CustomEvent<any>): void;
+    render(): any;
+}

package/dist/types/components/checkbox-group/je-checkbox-option/je-checkbox-option.d.ts

@@ -0,0 +1,30 @@
+import { EventEmitter } from '../../../stencil-public-runtime';
+export declare class JeCheckboxOption {
+    el: HTMLElement;
+    /**
+     * Value of this option that the checkbox group will compare against
+     */
+    value: any;
+    /**
+     * Whether or not this option is currently checked
+     */
+    checked: boolean;
+    /**
+     * Shows readonly state and prevents changes to this option
+     */
+    readonly: boolean;
+    /**
+     * Shows disabled state and prevents changes to this option
+     */
+    disabled: boolean;
+    /**
+     * Emits the value whenever it is checked
+     */
+    check: EventEmitter<any>;
+    /**
+     * Emits the value whenever it is unchecked
+     */
+    uncheck: EventEmitter<any>;
+    onClick(): void;
+    render(): any;
+}

package/dist/types/components/column/je-column/je-column.d.ts

@@ -0,0 +1,31 @@
+export declare class JeColumn {
+    /**
+     * The size of the column, in terms of how many columns it should take up out of the total available.
+     */
+    size?: string;
+    /**
+     * The size of the column for xs screens, in terms of how many columns it should take up out of the total available.
+     */
+    sizeXs?: string;
+    /**
+     * The size of the column for sm screens, in terms of how many columns it should take up out of the total available.
+     */
+    sizeSm?: string;
+    /**
+     * The size of the column for md screens, in terms of how many columns it should take up out of the total available.
+     */
+    sizeMd?: string;
+    /**
+     * The size of the column for lg screens, in terms of how many columns it should take up out of the total available.
+     */
+    sizeLg?: string;
+    /**
+     * The size of the column for xl screens, in terms of how many columns it should take up out of the total available.
+     */
+    sizeXl?: string;
+    onResize(): void;
+    private matchBreakpoint;
+    private getColumns;
+    private calculateSize;
+    render(): any;
+}

package/dist/types/components/column/je-column-group/je-column-group.d.ts

@@ -0,0 +1,9 @@
+export declare class JeColumnGroup {
+    el: HTMLJeColumnGroupElement;
+    /**
+     * The number of columns the flex grid has.
+     */
+    columns?: number;
+    componentDidLoad(): void;
+    render(): any;
+}

package/dist/types/components/je-alert/je-alert.d.ts

@@ -0,0 +1,77 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { AsyncValidationFn, ValidationFn } from '../je-input/je-input';
+export type DialogButton = {
+    text: string;
+    color?: 'primary' | 'secondary' | 'tertiary' | 'success' | 'error' | 'warning' | 'light' | 'dark';
+    fill: 'solid' | 'outline' | 'clear';
+    handler: (dialog: HTMLJeAlertElement) => void | Promise<void>;
+    type?: string;
+};
+export type DialogControl = {
+    label?: string;
+    placeholder?: string;
+    validators?: (ValidationFn | AsyncValidationFn)[];
+    required?: boolean;
+    type?: string;
+};
+export declare class JeAlert {
+    el: HTMLJeAlertElement;
+    isOpen: boolean;
+    protected parentEl: HTMLElement;
+    protected triggerElement: HTMLElement;
+    protected contentEl: HTMLElement;
+    protected backdropEl: HTMLElement;
+    protected pageEl: HTMLElement;
+    /**
+     * Emitted when the dialog is presented
+     */
+    didPresent: EventEmitter;
+    /**
+     * Emitted when the dialog is dismissed
+     */
+    didDismiss: EventEmitter<{
+        role: string;
+        data: any;
+    }>;
+    /**
+     * Emitted when the inner form submission is triggered
+     */
+    didSubmit: EventEmitter<SubmitEvent>;
+    /**
+     * Title of the dialog
+     */
+    header?: string;
+    /**
+     * Message text below the title
+     */
+    message?: string;
+    /**
+     * Icon that goes to the left of the header
+     */
+    icon?: string;
+    /**
+     * Buttons for user interaction
+     */
+    buttons?: DialogButton[];
+    /**
+     * Controls that are wrapped in a form
+     */
+    controls?: DialogControl[];
+    /**
+     * Trigger element id
+     */
+    trigger?: string;
+    /**
+     * Whether or not to render the backdrop
+     */
+    showBackdrop: boolean;
+    /**
+     * Whether or not the user can close the dialog by clicking the backdrop
+     */
+    backdropClose: boolean;
+    componentDidLoad(): void;
+    present(): Promise<void>;
+    dismiss(role?: string, data?: any): Promise<void>;
+    private handleBackdropClick;
+    render(): any;
+}

package/dist/types/components/je-button/je-button.d.ts

@@ -0,0 +1,28 @@
+import { Color } from '../../utils/utils';
+export declare class JeButton {
+    el: HTMLJeButtonElement;
+    private formEl?;
+    private formButtonEl?;
+    /** Disables button */
+    disabled: boolean;
+    /** Can set to submit or reset to participate in forms */
+    type: string;
+    /** Expands the button to the full width of it's container */
+    expand: boolean;
+    /** Removes the padding, ideal for turning an icon or image into a button */
+    iconOnly: boolean;
+    /** Button fill */
+    fill: 'solid' | 'outline' | 'clear';
+    /** Button size */
+    size: 'md' | 'lg' | 'sm';
+    /** Predefined colors. Auto will switch between light and dark based on the closest je-page's theme. */
+    color: Color | 'auto';
+    /** Overrides what the light mode color will be when color is "auto". */
+    lightModeColor: Color;
+    /** Overrides what the dark mode color will be when color is "auto". */
+    darkModeColor: Color;
+    componentDidLoad(): void;
+    handleThemeChange(e: CustomEvent<'light' | 'dark'>): void;
+    handleClick(): void;
+    render(): any;
+}

package/dist/types/components/je-card/je-card.d.ts

@@ -0,0 +1,6 @@
+import { Color } from '../../utils/utils';
+export declare class JeCard {
+    color?: Color;
+    button?: boolean;
+    render(): any;
+}

package/dist/types/components/je-checkbox/je-checkbox.d.ts

@@ -0,0 +1,38 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class JeCheckbox {
+    internals: ElementInternals;
+    el: HTMLElement;
+    private originalValue?;
+    /**
+     * Whether or not the checkbox is active
+     */
+    value?: boolean;
+    /**
+     * Whether or not the label should go before or after the checkbox
+     */
+    labelPlacement: 'start' | 'end';
+    /**
+     * If the checkbox should contain a 3rd indeterminate state
+     */
+    indeterminate: boolean;
+    /**
+     * Will hide the checkbox and just display the label
+     */
+    labelOnly: boolean;
+    /**
+     * Shows the readonly state and prevents changes
+     */
+    readonly: boolean;
+    /**
+     * Shows the disabled state and prevents changes
+     */
+    disabled: boolean;
+    /**
+     * Emits the current value whenever it's state changes
+     */
+    valueChange: EventEmitter<boolean | undefined>;
+    componentWillLoad(): void;
+    formResetCallback(): void;
+    onClick(): void;
+    render(): any;
+}

package/dist/types/components/je-color/je-color.d.ts

@@ -0,0 +1,12 @@
+import { Color } from '../../components';
+export declare class JeColor {
+    el: HTMLJeColorElement;
+    /** Predefined colors. Auto will switch between light and dark based on the closest je-page's theme. */
+    color: Color | 'auto';
+    /** Overrides what the light mode color will be when color is "auto". */
+    lightModeColor: Color;
+    /** Overrides what the dark mode color will be when color is "auto". */
+    darkModeColor: Color;
+    handleThemeChange(e: CustomEvent<'light' | 'dark'>): void;
+    render(): any;
+}

package/dist/types/components/je-datepicker/je-datepicker.d.ts

@@ -0,0 +1,18 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class JeDatepicker {
+    el: HTMLJeDatepickerElement;
+    currentDate: Date;
+    value?: Date | string;
+    valueChange: EventEmitter<Date | undefined>;
+    isDark: boolean;
+    monthYearPicker: boolean;
+    handleThemeChange(e: CustomEvent<'light' | 'dark'>): void;
+    valueChangeHandler(): void;
+    getDaysInMonth(): import("date-fns").EachDayOfIntervalResult<{
+        start: Date;
+        end: Date;
+    }, undefined>;
+    nextMonth: () => void;
+    prevMonth: () => void;
+    render(): any;
+}

package/dist/types/components/je-details/je-details.d.ts

@@ -0,0 +1,6 @@
+export declare class JeDetails {
+    el: HTMLElement;
+    summary?: string;
+    state: 'open' | 'closed';
+    render(): any;
+}

package/dist/types/components/je-divider/je-divider.d.ts

@@ -0,0 +1,5 @@
+export declare class JeDivider {
+    type: 'horizontal' | 'vertical';
+    spacing: 'sm' | 'md' | 'lg' | 'none';
+    render(): any;
+}

package/dist/types/components/je-drawer/je-drawer.d.ts

@@ -0,0 +1,10 @@
+export type DrawerState = 'open' | 'closed';
+export declare class JeDrawer {
+    el: HTMLElement;
+    state: DrawerState;
+    private pageEl;
+    private parentEl;
+    componentDidLoad(): void;
+    stateChangeHandler(newValue: DrawerState): Promise<void>;
+    render(): any;
+}

package/dist/types/components/je-dropzone/je-dropzone.d.ts

@@ -0,0 +1,10 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class JeDropzone {
+    el: HTMLJeDropzoneElement;
+    dataDrop: EventEmitter<DataTransfer>;
+    handleThemeChange(e: CustomEvent<'light' | 'dark'>): void;
+    onDrop(e: DragEvent): void;
+    onDragOver(e: DragEvent): void;
+    onDragLeave(e: DragEvent): void;
+    render(): any;
+}

package/dist/types/components/je-form/je-form.d.ts

@@ -0,0 +1,12 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class JeForm {
+    private el;
+    formData: EventEmitter<FormData>;
+    /**
+     * Removes the default gap between elements passed in
+     */
+    gap: 'none' | 'default';
+    handleSubmit(event: SubmitEvent): Promise<void>;
+    handleKeyup(event: KeyboardEvent): void;
+    render(): any;
+}

package/dist/types/components/je-icon/je-icon.d.ts

@@ -0,0 +1,15 @@
+export declare class JeIcon {
+    el: HTMLJeIconElement;
+    /** Google material icon name */
+    icon: string;
+    /** Size of the icon */
+    size: 'sm' | 'md' | 'lg' | 'xl';
+    /** Whether or not the icon should be filled */
+    fill?: boolean;
+    /** Icon grade */
+    grade?: 'high' | 'low';
+    /** Icon weight */
+    weight?: number;
+    componentDidLoad(): void;
+    render(): any;
+}

package/dist/types/components/je-infinite/je-infinite.d.ts

@@ -0,0 +1,25 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class JeInfinite {
+    element: HTMLElement;
+    private observer;
+    private viewportEl;
+    /**
+     * This must be manually set to true/false to show/hide the intersecting content
+     */
+    loading: boolean;
+    /**
+     * Emitted when the bottom of the scroll container is in the viewport
+     */
+    intersect: EventEmitter<void>;
+    /**
+     * Threshold passed to observer api
+     */
+    threshold: number;
+    /**
+     * Passed to observer api
+     */
+    rootMargin: string;
+    componentDidLoad(): void;
+    private handleEntry;
+    render(): any;
+}

package/dist/types/components/je-input/je-input.d.ts

@@ -0,0 +1,155 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type FormatterFn = (newValue: string, oldValue?: string, ev?: InputEvent) => string;
+export type AsyncFormatterFn = (newValue: string, oldValue?: string, ev?: InputEvent) => Promise<string>;
+export type ValidationFn = (value: string) => string[];
+export type AsyncValidationFn = (value: string) => Promise<string[]>;
+export declare class JeInput {
+    hostEl: HTMLJeInputElement;
+    internals: ElementInternals;
+    isTouched: boolean;
+    private dropdownActive;
+    private containerEl;
+    private popoverEl;
+    private inputEl;
+    private showPassword;
+    private errors;
+    private originalValue;
+    /**
+     * Text above the control
+     */
+    label: string;
+    /**
+     * Renders input as disabled and prevents changes
+     */
+    disabled: boolean;
+    /**
+     * Passed to native input
+     */
+    autoCapitalize: string;
+    /**
+     * Passed to native input
+     */
+    autoComplete: string;
+    /**
+     * Passed to native input
+     */
+    autoCorrect: 'off' | 'on';
+    /**
+     * Passed to native input
+     */
+    autoFocus?: boolean;
+    /**
+     * Passed to native input
+     */
+    inputMode: string;
+    /**
+     * Passed to native input
+     */
+    min?: number | string;
+    /**
+     * Passed to native input
+     */
+    max?: number | string;
+    /**
+     * Passed to native input
+     */
+    minLength?: number;
+    /**
+     * Passed to native input
+     */
+    maxLength?: number;
+    /**
+     * Passed to native input
+     */
+    multiple: boolean;
+    /**
+     * Passed to native input
+     */
+    pattern?: string;
+    /**
+     * Renders input as read only and prevents changes
+     */
+    readOnly: boolean;
+    /**
+     * Marks as required in form and adds asterisk to the end of the label
+     */
+    required: boolean;
+    /**
+     * Passed to native input
+     */
+    spellcheck: boolean;
+    /**
+     * Passed to native input
+     */
+    step?: string;
+    /**
+     * Passed to native input
+     */
+    type: string;
+    /**
+     * Current value of the input
+     */
+    value: string;
+    /**
+     * Input placeholder text
+     */
+    placeholder: string;
+    /**
+     * Optional debounce of the didInput event
+     */
+    debounce: number;
+    /**
+     * Formatter function that gets applied as the user types
+     */
+    format?: FormatterFn | AsyncFormatterFn;
+    /**
+     * Custom validator functions for form participation
+     */
+    validators?: (ValidationFn | AsyncValidationFn)[];
+    /**
+     * Will prevent changes, does not change the input's state in any way
+     */
+    noTyping: boolean;
+    /**
+     * Helper text directly below the control
+     */
+    helperText?: string;
+    /**
+     * Whether or not to render a dropdown when input is focused
+     */
+    dropdown: boolean;
+    /**
+     * Whether or not the input should expand to the full width of it's container
+     */
+    expand?: boolean;
+    /**
+     * Whether or not the dropdown should dismiss itself on click
+     */
+    dismissOnClick?: boolean;
+    /**
+     * Emits as the user types
+     */
+    valueChange: EventEmitter<string>;
+    componentWillLoad(): void;
+    connectedCallback(): void;
+    componentDidLoad(): Promise<void>;
+    formResetCallback(): Promise<void>;
+    handleThemeChange(e: CustomEvent<'light' | 'dark'>): void;
+    handleFocus(): void;
+    handleBlur(): void;
+    validatorsChanged(): Promise<void>;
+    requiredChanged(): void;
+    valueChanged(): Promise<void>;
+    getInputElement(): Promise<HTMLInputElement>;
+    dismissDropdown(role?: string): Promise<void>;
+    markAsTouched(): Promise<void>;
+    hasError(): Promise<boolean>;
+    reset(): Promise<void>;
+    private togglePassword;
+    private formatInput;
+    private handleInput;
+    private setValidity;
+    private handleContainerClick;
+    private handleDismiss;
+    render(): any;
+}

package/dist/types/components/je-link/je-link.d.ts

@@ -0,0 +1,22 @@
+import { Color } from '../../components';
+export declare class JeLink {
+    /** Predefined colors. Auto will switch between light and dark based on the closest je-page's theme. */
+    color?: Color | 'auto';
+    /** Overrides what the light mode color will be when color is "auto". */
+    lightModeColor?: Color;
+    /** Overrides what the dark mode color will be when color is "auto". */
+    darkModeColor?: Color;
+    /** Underlines the text */
+    underline: boolean;
+    /** Makes text bold */
+    bold: boolean;
+    /** Passed to anchor */
+    href?: string;
+    /** Passed to anchor */
+    target?: string;
+    /** Passed to anchor */
+    rel?: string;
+    /** Passed to anchor */
+    download?: string;
+    render(): any;
+}

package/dist/types/components/je-loading/je-loading.d.ts

@@ -0,0 +1,22 @@
+export interface SpinnerConfig {
+    dur: number;
+    circles?: number;
+    lines?: number;
+    elmDuration?: boolean;
+    fn: (dur: number, index: number, total: number) => SpinnerData;
+}
+export interface SpinnerData {
+    r?: number;
+    y1?: number;
+    y2?: number;
+    cx?: number;
+    cy?: number;
+    style: {
+        [key: string]: string | undefined;
+    };
+    viewBox?: string;
+    transform?: string;
+}
+export declare class JeLoading {
+    render(): any;
+}

package/dist/types/components/je-modal/je-modal.d.ts

@@ -0,0 +1,28 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class JeModal {
+    el: HTMLJeModalElement;
+    /** The id of the element that will present the modal on click. If not provided, you will have to manually present the modal using openModal(). */
+    trigger?: string;
+    /** Whether or not the backdrop will be visible to the user */
+    showBackdrop: boolean;
+    /** Backdrop will close the modal on click when enabled */
+    backdropClose: boolean;
+    isOpen: boolean;
+    /** Emits whenever the modal has opened. Does not emit any data */
+    didPresent: EventEmitter;
+    /** Emits whenever the modal has finished closing. Emits the role and optional data object passed to the closeModal() method. */
+    didDismiss: EventEmitter<{
+        role: string;
+        data: any;
+    }>;
+    protected parentEl: HTMLElement;
+    protected triggerElement: HTMLElement;
+    protected contentEl: HTMLElement;
+    protected backdropEl: HTMLElement;
+    protected pageEl: HTMLElement;
+    componentDidLoad(): void;
+    present(): Promise<void>;
+    dismiss(role?: string, data?: any): Promise<void>;
+    private handleBackdropClick;
+    render(): any;
+}

package/dist/types/components/je-page/je-page.d.ts

@@ -0,0 +1,12 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export type PanelState = 'open' | 'closed' | 'minimized';
+export declare class JePage {
+    el: HTMLElement;
+    leftPanel: PanelState;
+    rightPanel: PanelState;
+    theme: 'light' | 'dark' | 'auto';
+    themeChange: EventEmitter<'light' | 'dark'>;
+    componentDidLoad(): void;
+    themeChangeHandler(newValue: 'light' | 'dark' | 'auto'): void;
+    render(): any;
+}

package/dist/types/components/je-pill/je-pill.d.ts

@@ -0,0 +1,6 @@
+export declare class JePill {
+    outline: boolean;
+    button: boolean;
+    disabled: boolean;
+    render(): any;
+}

package/dist/types/components/je-placeholder/je-placeholder.d.ts

@@ -0,0 +1,7 @@
+export declare class JePlaceholder {
+    /**
+     * Whether or not the component should have the animated "shimmer" effect
+     */
+    animated: boolean;
+    render(): any;
+}