@blueprintui/cli 0.0.11 → 0.1.0

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/control/element.js

@@ -1,187 +0,0 @@
-import { __decorate } from "tslib";
-import { ContextConsumer } from '@lit-labs/context';
-import { html, LitElement } from 'lit';
-import { baseStyles, interactionResponsive, calculateOptimalLayout, syncUpdatedProps, attachInternals, stateControl, associateAriaDescribedBy } from '@blueprintui/components/internals';
-import { syncHTML5Validation } from '../utils/validate.js';
-import { associateInputToDatalist, formLayouts, defaultFormLayout, getStatusIcon, associateInputAndLabel, defaultControlWidth, setupControlMessageStatusUpdates } from '../utils/utils.js';
-import { controlGroupContext, formContext } from '../utils/context.js';
-import styles from './element.css' assert { type: 'css' };
-export var ControlLabelLayout;
-(function (ControlLabelLayout) {
-    ControlLabelLayout["default"] = "default";
-    ControlLabelLayout["ariaLabel"] = "aria-label";
-    ControlLabelLayout["inputGroup"] = "input-group";
-})(ControlLabelLayout || (ControlLabelLayout = {}));
-/**
- * Generic Control
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-control>
- *   <label>control</label>
- *   <input type="text" />
- * </bp-control>
- * ```
- * @element bp-control
- * @slot
- * @cssprop --background
- */
-let BpControl = class BpControl extends LitElement {
-    constructor() {
-        super(...arguments);
-        /** forms automatically collapse to layout that prevents overflow */
-        this.responsive = true;
-        /** default full width or the browser default width */
-        this.controlWidth = defaultControlWidth;
-        /** @private */
-        this.labelLayout = ControlLabelLayout.default;
-    }
-    /**
-     * @property
-     * @type { 'vertical' | 'horizontal' | 'compact' }
-     */
-    get layout() {
-        return this.#layout;
-    }
-    set layout(value) {
-        this.#layout = value ? value.replace('-inline', '') : defaultFormLayout; // auto convert any form-layouts from parent groups
-        this.setAttribute('layout', this.#layout);
-        this.requestUpdate('layout');
-        if (!this.#initialLayout) {
-            this.#initialLayout = this.#layout;
-        }
-    }
-    static get properties() {
-        return {
-            layout: { type: String, reflect: true },
-            responsive: { type: Boolean, reflect: true },
-            controlWidth: { type: String, reflect: true, attribute: 'control-width' },
-            labelLayout: { state: true }
-        };
-    }
-    #layout = defaultFormLayout;
-    #initialLayout;
-    /** @private */
-    get controlLabel() {
-        return this.renderRoot?.querySelector("bp-internal-control-label[action=primary]") ?? null;
-    }
-    get inputContainer() {
-        return this.renderRoot?.querySelector(".input-container") ?? null;
-    }
-    /** @private */
-    get inputControl() {
-        return this.querySelector('input, select, textarea, [bp-control]');
-    }
-    get #label() {
-        return this.querySelector('label');
-    }
-    get #datalist() {
-        return this.querySelector('datalist');
-    }
-    get messages() {
-        return this.querySelectorAll('bp-control-message');
-    }
-    static styles = [baseStyles, styles];
-    render() {
-        return html `
-      <div class="private-host ${this.layout}">
-        ${this.labelLayout === ControlLabelLayout.default ? html `
-        <div class="input-label-container">
-          <bp-internal-control-label>
-            <slot name="label"></slot>
-          </bp-internal-control-label>
-        </div>` : ''}
-        <div class="input-message-container">
-          <div class="input-status-icon-container">
-            <div class="input-container">
-              ${this.prefixTemplate}
-              <slot name="prefix"></slot>
-              ${this.inputTemplate}
-              <slot name="input"></slot>
-              <slot name="suffix"></slot>
-              ${this.suffixTemplate}
-            </div>
-            ${getStatusIcon()}
-          </div>
-          ${this.messages?.length ? html `<slot name="message"></slot>` : ''}
-          ${this.#datalist ? html `<slot name="datalist"></slot>` : ''}
-        </div>
-      </div>
-    `;
-    }
-    get inputTemplate() {
-        return html ``;
-    }
-    get prefixTemplate() {
-        return null;
-    }
-    get suffixTemplate() {
-        return null;
-    }
-    formContext = new ContextConsumer(this, formContext, (value) => syncUpdatedProps(this, value), true);
-    controlGroupContext = new ContextConsumer(this, controlGroupContext, (value) => syncUpdatedProps(this, value), true);
-    connectedCallback() {
-        super.connectedCallback();
-        this.setAttribute('bp-control', '');
-        attachInternals(this);
-    }
-    firstUpdated(props) {
-        super.firstUpdated(props);
-        this.inputControl.slot = 'input';
-        this.#label ? this.#label.slot = 'label' : null;
-        this.#datalist ? this.#datalist.slot = 'datalist' : null;
-        this.#setupResponsive();
-        this.#setupLabelLayout();
-        setupControlMessageStatusUpdates(Array.from(this.messages), this);
-        syncHTML5Validation(this, Array.from(this.messages));
-        this.shadowRoot.addEventListener('slotchange', (e) => {
-            const slotName = e.target.name;
-            if (slotName === 'label') {
-                associateInputAndLabel(this.inputControl, this.#label);
-            }
-            else if (slotName === 'datalist') {
-                associateInputToDatalist(this.inputControl, this.#datalist);
-            }
-            else if (slotName === 'message') {
-                associateAriaDescribedBy(this.inputControl, Array.from(this.messages));
-            }
-        });
-    }
-    /** @private */
-    get layoutStable() {
-        const messageBelowInput = this.shadowRoot.querySelector('.messages')?.getBoundingClientRect().top > this.inputContainer?.getBoundingClientRect().top;
-        const inputBelowLabel = this.inputContainer?.getBoundingClientRect().top > this.controlLabel?.getBoundingClientRect().top;
-        if (this.layout === 'compact' && messageBelowInput) {
-            return false;
-        }
-        if ((this.layout === 'compact' || this.layout === 'horizontal') && inputBelowLabel) {
-            return false;
-        }
-        return true;
-    }
-    #setupResponsive() {
-        if (this.responsive && this.labelLayout === ControlLabelLayout.default) {
-            this.addEventListener('bpResizeChange', () => {
-                calculateOptimalLayout(this, { layouts: formLayouts, initialLayout: this.#initialLayout }).then(updated => {
-                    if (updated) {
-                        this.dispatchEvent(new CustomEvent('layoutChange', { bubbles: true, detail: this.layout }));
-                    }
-                });
-            });
-        }
-    }
-    #setupLabelLayout() {
-        const hasAriaLabelType = this.inputControl.ariaLabel || this.inputControl.hasAttribute('aria-labelledby');
-        if (hasAriaLabelType && this.labelLayout !== ControlLabelLayout.inputGroup) {
-            this.labelLayout = ControlLabelLayout.ariaLabel;
-        }
-    }
-};
-BpControl = __decorate([
-    stateControl(),
-    interactionResponsive()
-], BpControl);
-export { BpControl };

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/control-group/element.d.ts

@@ -1,56 +0,0 @@
-import { ContextConsumer, ContextProvider } from '@lit-labs/context';
-import { LitElement, PropertyValues } from 'lit';
-import { BpControl } from '../control/element.js';
-import { FormLayout, ControlWidth } from '../utils/interfaces.js';
-import { BpInternalControlLabel } from '../control-label/element.js';
-/**
- * Internal Control Group
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-internal-control-group>
- *   <label>...</label>
- *   <bp-control>
- *     <label></label>
- *     <input ... />
- *   </bp-control>
- *   <bp-control>
- *     <label></label>
- *     <input ... />
- *   </bp-control>
- * </bp-internal-control-group>
- * ```
- *
- * @element bp-internal-control-group
- * @property layoutChange
- * @slot - For projecting control group
- */
-export declare class BpInternalControlGroup extends LitElement {
-    #private;
-    /** @type {horizontal | horizontal-inline | vertical | vertical-inline | compact} */
-    layout: FormLayout;
-    /** Adjust the control from the default full width or the browser default width */
-    controlWidth: ControlWidth;
-    responsive: boolean;
-    protected get controls(): NodeListOf<BpControl>;
-    /** @private */
-    controlLabel: BpInternalControlLabel;
-    protected formContext: ContextConsumer<{
-        __context__: import("../utils/context.js").FormContext;
-    }, this>;
-    protected controlGroupContext: ContextProvider<{
-        __context__: import("../utils/context.js").FormContext;
-    }>;
-    protected isInlineControlGroup: boolean;
-    /** @private */
-    _internals: ElementInternals;
-    static styles: CSSStyleSheet[];
-    render(): import("lit-html").TemplateResult<1>;
-    connectedCallback(): void;
-    firstUpdated(props: PropertyValues<this>): void;
-    updated(props: PropertyValues<any>): void;
-    get layoutStable(): boolean;
-}

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/control-group/element.js

@@ -1,135 +0,0 @@
-import { __decorate } from "tslib";
-import { ContextConsumer, ContextProvider } from '@lit-labs/context';
-import { html, LitElement } from 'lit';
-import { baseStyles, calculateOptimalLayout, interactionResponsive, createId, syncUpdatedProps, associateAriaDescribedBy } from '@blueprintui/components/internals';
-import { getStatusIcon, formLayouts, defaultFormLayout, inlineControlListIsWrapped, setupControlMessageStatusUpdates } from '../utils/utils.js';
-import { controlGroupContext, formContext } from '../utils/context.js';
-import styles from './element.css' assert { type: 'css' };
-/**
- * Internal Control Group
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-internal-control-group>
- *   <label>...</label>
- *   <bp-control>
- *     <label></label>
- *     <input ... />
- *   </bp-control>
- *   <bp-control>
- *     <label></label>
- *     <input ... />
- *   </bp-control>
- * </bp-internal-control-group>
- * ```
- *
- * @element bp-internal-control-group
- * @property layoutChange
- * @slot - For projecting control group
- */
-let BpInternalControlGroup = class BpInternalControlGroup extends LitElement {
-    static properties = {
-        layout: { type: String, reflect: true },
-        controlWidth: { type: String, reflect: true, attribute: 'control-width' },
-        responsive: { type: Boolean, reflect: true }
-    };
-    constructor() {
-        super(...arguments);
-        /** @type {horizontal | horizontal-inline | vertical | vertical-inline | compact} */
-        this.layout = defaultFormLayout;
-        this.responsive = true;
-    }
-    get controls() {
-        return this.querySelectorAll('bp-control, [bp-control]');
-    }
-    get #label() {
-        return this.querySelector('label');
-    }
-    get #messages() {
-        return this.querySelectorAll('bp-control-message');
-    }
-    /** @private */
-    get controlLabel() {
-        return this.__controlLabel ??= this.renderRoot?.querySelector("bp-internal-control-label[action=primary]") ?? null;
-    }
-    formContext = new ContextConsumer(this, formContext, (value) => syncUpdatedProps(this, value), true);
-    controlGroupContext = new ContextProvider(this, controlGroupContext, {});
-    isInlineControlGroup = false;
-    /** @private */
-    _internals = this.attachInternals();
-    static styles = [baseStyles, styles];
-    render() {
-        return html `
-      <div class="private-host ${this.isInlineControlGroup ? 'inline-control-group' : ''}">
-        <div class="control-label-container">
-          <bp-internal-control-label action="primary">
-            <slot name="label"></slot>
-          </bp-internal-control-label>
-        </div>
-        <div class="control-message-container">
-          <div class="input-container">
-            <div class="controls">
-              <slot></slot>
-            </div>
-          </div>
-          <div ?hidden=${this.#messages.length === 0} class="messages-container">
-            ${getStatusIcon()}
-            <div class="messages">
-              <slot name="message" @slotchange=${() => associateAriaDescribedBy(this, Array.from(this.#messages))}></slot>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this._internals.role = 'group';
-        this.setAttribute('bp-control-group', '');
-    }
-    firstUpdated(props) {
-        super.firstUpdated(props);
-        this.#label ? this.#label.slot = 'label' : null;
-        this.#associateLabelAndGroup();
-        this.#setupResponsive();
-        setupControlMessageStatusUpdates(Array.from(this.#messages), this);
-    }
-    updated(props) {
-        super.updated(props);
-        this.controlGroupContext.setValue({ layout: this.layout, responsive: this.responsive, controlWidth: this.controlWidth });
-    }
-    get layoutStable() {
-        const messageBelowInput = this.shadowRoot.querySelector('.messages-container')?.getBoundingClientRect().top > this.shadowRoot.querySelector('.controls').getBoundingClientRect().top;
-        const inputBelowLabel = this.shadowRoot.querySelector('.controls').getBoundingClientRect().top > this.controlLabel?.getBoundingClientRect().top + 12;
-        if (this.layout === 'compact' && (messageBelowInput || inputBelowLabel)) {
-            return false;
-        }
-        if (this.layout === 'horizontal-inline' && inlineControlListIsWrapped(Array.from(this.controls), this.layout)) {
-            return false;
-        }
-        if (this.layout === 'horizontal' && inputBelowLabel) {
-            return false;
-        }
-        if (this.layout === 'vertical-inline' && inlineControlListIsWrapped(Array.from(this.controls), this.layout)) {
-            return false;
-        }
-        return true;
-    }
-    #associateLabelAndGroup() {
-        this.#label.id = this.#label.id?.length ? this.#label.id : createId();
-        this.setAttribute('aria-labelledby', this.#label.id);
-    }
-    #setupResponsive() {
-        if (this.responsive) {
-            const layoutConfig = { layouts: formLayouts, initialLayout: this.layout };
-            this.addEventListener('bpResizeChange', () => calculateOptimalLayout(this, layoutConfig).then(() => this.dispatchEvent(new CustomEvent('layoutChange', { bubbles: true, detail: this.layout }))));
-        }
-    }
-};
-BpInternalControlGroup = __decorate([
-    interactionResponsive()
-], BpInternalControlGroup);
-export { BpInternalControlGroup };

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/control-inline/element.d.ts

@@ -1,22 +0,0 @@
-import { BpControl } from '../control/element.js';
-/**
- * Internal Control Inline
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-internal-control-inline>
- *   <label>inline</label>
- *   <input type="radio" />
- * </bp-internal-control-inline>
- * ```
- * @element bp-internal-control-inline
- * @event checkedChange
- * @slot - For projecting inline input and label
- */
-export declare class BpInternalControlInline extends BpControl {
-    static get styles(): CSSStyleSheet[];
-    render(): import("lit-html").TemplateResult<1>;
-}

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/control-inline/element.js

@@ -1,44 +0,0 @@
-import { html } from 'lit';
-import { BpControl, ControlLabelLayout } from '../control/element.js';
-import { getStatusIcon } from '../utils/utils.js';
-import styles from './element.css' assert { type: 'css' };
-/**
- * Internal Control Inline
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-internal-control-inline>
- *   <label>inline</label>
- *   <input type="radio" />
- * </bp-internal-control-inline>
- * ```
- * @element bp-internal-control-inline
- * @event checkedChange
- * @slot - For projecting inline input and label
- */
-export class BpInternalControlInline extends BpControl {
-    static get styles() {
-        return [...super.styles, styles];
-    }
-    render() {
-        return html `
-      <div class="private-host">
-        <div class="control-inline-label-container">
-          <slot name="input"></slot>
-          ${this.labelLayout !== ControlLabelLayout.ariaLabel ? html `
-          <bp-internal-control-label action="secondary">
-            <slot name="label"></slot>
-          </bp-internal-control-label>` : ''}
-        </div>
-        ${this.messages?.length ? html `
-        <div class="control-inline-messages-container">
-          ${getStatusIcon()}
-          <slot name="message"></slot>
-        </div>` : ''}
-      </div>
-    `;
-    }
-}

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/control-label/element.d.ts

@@ -1,24 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * Label
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-internal-control-label status="primary | secondary">
- *   <label>...</label>
- * </bp-internal-control-label>
- * ```
- *
- * @element bp-internal-control-label
- * @slot - For projecting label text
- * @cssprop --label-width
- */
-export declare class BpInternalControlLabel extends LitElement {
-    action: 'primary' | 'secondary';
-    static styles: CSSStyleSheet[];
-    render(): import("lit-html").TemplateResult<1>;
-    connectedCallback(): void;
-}

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/control-label/element.js

@@ -1,42 +0,0 @@
-import { html, LitElement } from 'lit';
-import { baseStyles } from '@blueprintui/components/internals';
-import styles from './element.css' assert { type: 'css' };
-/**
- * Label
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-internal-control-label status="primary | secondary">
- *   <label>...</label>
- * </bp-internal-control-label>
- * ```
- *
- * @element bp-internal-control-label
- * @slot - For projecting label text
- * @cssprop --label-width
- */
-export class BpInternalControlLabel extends LitElement {
-    static properties = {
-        action: { type: String, reflect: true }
-    };
-    static styles = [baseStyles, styles];
-    //__BLANK_LINE_PLACEHOLDER_G1JVXUEBNCL6YN5NFE13MD1PT3H9OIHB__
-    constructor() {
-        super();
-        this.action = 'primary';
-    }
-    render() {
-        return html `
-      <div class="private-host">
-        <slot></slot>
-      </div>
-    `;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this.slot = 'message';
-    }
-}

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/control-message/element.d.ts

@@ -1,33 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * Control Message
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-control>
- *   <label>Test</label>
- *   <input type="text" />
- *   <bp-control-message>helper text</bp-control-message>
- * </bp-control>
- * ```
- *
- * @element bp-control-message
- * @slot - For projecting helper message text
- * @cssprop --color
- * @cssprop --font-size
- * @cssprop --font-weight
- * @cssprop --max-width
- * @cssprop --min-width
- */
-export declare class BpControlMessage extends LitElement {
-    /** Set the status of form control message validation */
-    status: 'neutral' | 'error' | 'success';
-    /** HTML5 ValidityState https://developer.mozilla.org/en-US/docs/Web/API/ValidityState */
-    error: keyof ValidityState;
-    static styles: CSSStyleSheet[];
-    render(): import("lit-html").TemplateResult<1>;
-    connectedCallback(): void;
-}

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/control-message/element.js

@@ -1,50 +0,0 @@
-import { html, LitElement } from 'lit';
-import { baseStyles } from '@blueprintui/components/internals';
-import styles from './element.css' assert { type: 'css' };
-/**
- * Control Message
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-control>
- *   <label>Test</label>
- *   <input type="text" />
- *   <bp-control-message>helper text</bp-control-message>
- * </bp-control>
- * ```
- *
- * @element bp-control-message
- * @slot - For projecting helper message text
- * @cssprop --color
- * @cssprop --font-size
- * @cssprop --font-weight
- * @cssprop --max-width
- * @cssprop --min-width
- */
-export class BpControlMessage extends LitElement {
-    static properties = {
-        status: { type: String },
-        error: { type: String, reflect: true }
-    };
-    static styles = [baseStyles, styles];
-    //__BLANK_LINE_PLACEHOLDER_G1JVXUEBNCL6YN5NFE13MD1PT3H9OIHB__
-    constructor() {
-        super();
-        /** Set the status of form control message validation */
-        this.status = 'neutral';
-    }
-    render() {
-        return html `
-      <div class="private-host">
-        <slot></slot>
-      </div>
-    `;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this.slot = 'message';
-    }
-}

package/src/.rollup.cache/@blueprintui/components/Users/coryrylan/Repos/blueprintui/components/dist/lib/forms/form-group/element.d.ts

@@ -1,39 +0,0 @@
-import { LitElement, PropertyValues } from 'lit';
-import { FormLayout, ControlWidth } from '../utils/interfaces.js';
-/**
- * Form
- *
- * ```typescript
- * import '@blueprintui/components/include/forms.js';
- * ```
- *
- * ```html
- * <bp-form-group layout="horizontal">
- *   <bp-input>
- *     <label>Test</label>
- *     <input type="text" />
- *   </bp-input>
- *
- *   <bp-input>
- *     <label>Test</label>
- *     <input type="text" />
- *   </bp-input>
- * </bp-form-group>
- * ```
- *
- * @element bp-form-group
- * @slot - For projecting input controls
- * @cssprop --label-width
- */
-export declare class BpFormGroup extends LitElement {
-    #private;
-    /** @type {horizontal | horizontal-inline | vertical | vertical-inline | compact} */
-    layout: FormLayout;
-    controlWidth: ControlWidth;
-    responsive: boolean;
-    static styles: CSSStyleSheet[];
-    render(): import("lit-html").TemplateResult<1>;
-    firstUpdated(props: PropertyValues<this>): void;
-    updated(props: PropertyValues<this>): void;
-    disconnectedCallback(): void;
-}