@plusui/library 0.1.0

package/dist/base-BqsGesSl.js

@@ -0,0 +1,6 @@
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const e=(e,t,o)=>(o.configurable=!0,o.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,o),o);export{e};

package/dist/base-Cl6v8-BZ.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const e=(e,t,c)=>(c.configurable=true,c.enumerable=true,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,c),c);
+
+export { e };

package/dist/components/accordion/accordion.d.ts

@@ -0,0 +1,75 @@
+import Tailwind from '../base/tailwind-base';
+/**
+ * @tag plus-accordion
+ * @summary Accordion component for displaying collapsible content.
+ *
+ * @slot header - The header content of the accordion
+ * @slot helper - Optional helper text displayed next to the header
+ * @slot panel - The content that is shown when the accordion is expanded
+ *
+ * @csspart header - The header container
+ * @csspart panel - The panel container
+ * @csspart icon - The expand/collapse icon
+ * @csspart helper - The helper text container
+ *
+ * @event plus-accordion-toggle - Emitted when the accordion is toggled
+ * @eventDetail {boolean} expand - Whether the accordion is expanded
+ *
+ * @example
+ * ```html
+ * <plus-accordion>
+ *   <div slot="header">Header</div>
+ *   <div slot="helper">Helper text</div>
+ *   <div slot="panel">Content</div>
+ * </plus-accordion>
+ * ```
+ */
+export default class PlusAccordion extends Tailwind {
+    /**
+     * Whether the accordion is expanded
+     * @type {boolean}
+     * @default false
+     * @attr expand
+     */
+    expand: boolean;
+    /**
+     * Whether the accordion is part of a group
+     * @type {boolean}
+     * @default false
+     * @attr is-grouped
+     */
+    isGrouped: boolean;
+    /**
+     * Whether the accordion is the last item in a group
+     * @type {boolean}
+     * @default false
+     * @attr is-last
+     */
+    isLast: boolean;
+    /**
+     * Whether the accordion is the first item in a group
+     * @type {boolean}
+     * @default false
+     * @attr is-first
+     */
+    isFirst: boolean;
+    /**
+     * The size of the accordion
+     * @type {'sm' | 'md' | 'lg'}
+     * @default 'md'
+     * @attr size
+     */
+    size: 'sm' | 'md' | 'lg';
+    /**
+     * Whether the accordion is disabled
+     * @type {boolean}
+     * @default false
+     * @attr disabled
+     */
+    disabled: boolean;
+    static styles: import("lit").CSSResult[];
+    private toggleOpen;
+    render(): import("lit-html").TemplateResult<1>;
+}
+export { PlusAccordion };
+//# sourceMappingURL=accordion.d.ts.map

package/dist/components/accordion/accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/components/accordion/accordion.ts"],"names":[],"mappings":"AAGA,OAAO,QAAQ,MAAM,uBAAuB,CAAC;AAE7C;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,QAAQ;IACjD;;;;;OAKG;IAMH,MAAM,UAAS;IAEf;;;;;OAKG;IAEH,SAAS,UAAS;IAElB;;;;;OAKG;IAEH,MAAM,UAAS;IAEf;;;;;OAKG;IAEH,OAAO,UAAS;IAEhB;;;;;OAKG;IAEH,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAEhC;;;;;OAKG;IAEH,QAAQ,UAAS;IAWjB,OAAgB,MAAM,4BA2BpB;IAiBF,OAAO,CAAC,UAAU;IAOT,MAAM;CAoDhB;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/accordion/accordion.js

@@ -0,0 +1,206 @@
+import { _ as __decorate, n } from '../../property-DiPQx9S3.js';
+import { i, x } from '../../lit-element-ByzbtpGk.js';
+import { accordionStyle } from './accordion.style.js';
+import Tailwind from '../base/tailwind-base.js';
+import '../../index-B9iart53.js';
+import '../../styles/global.js';
+import '../../style-inject.es-tgCJW-Cu.js';
+
+/**
+ * @tag plus-accordion
+ * @summary Accordion component for displaying collapsible content.
+ *
+ * @slot header - The header content of the accordion
+ * @slot helper - Optional helper text displayed next to the header
+ * @slot panel - The content that is shown when the accordion is expanded
+ *
+ * @csspart header - The header container
+ * @csspart panel - The panel container
+ * @csspart icon - The expand/collapse icon
+ * @csspart helper - The helper text container
+ *
+ * @event plus-accordion-toggle - Emitted when the accordion is toggled
+ * @eventDetail {boolean} expand - Whether the accordion is expanded
+ *
+ * @example
+ * ```html
+ * <plus-accordion>
+ *   <div slot="header">Header</div>
+ *   <div slot="helper">Helper text</div>
+ *   <div slot="panel">Content</div>
+ * </plus-accordion>
+ * ```
+ */
+class PlusAccordion extends Tailwind {
+    constructor() {
+        super(...arguments);
+        /**
+         * Whether the accordion is expanded
+         * @type {boolean}
+         * @default false
+         * @attr expand
+         */
+        this.expand = false;
+        /**
+         * Whether the accordion is part of a group
+         * @type {boolean}
+         * @default false
+         * @attr is-grouped
+         */
+        this.isGrouped = false;
+        /**
+         * Whether the accordion is the last item in a group
+         * @type {boolean}
+         * @default false
+         * @attr is-last
+         */
+        this.isLast = false;
+        /**
+         * Whether the accordion is the first item in a group
+         * @type {boolean}
+         * @default false
+         * @attr is-first
+         */
+        this.isFirst = false;
+        /**
+         * The size of the accordion
+         * @type {'sm' | 'md' | 'lg'}
+         * @default 'md'
+         * @attr size
+         */
+        this.size = 'md';
+        /**
+         * Whether the accordion is disabled
+         * @type {boolean}
+         * @default false
+         * @attr disabled
+         */
+        this.disabled = false;
+    }
+    // private handleHeaderSlotChange(event: Event): void {
+    //   const slot = event.target as HTMLSlotElement;
+    //   this.hasHeaderSlot = slot.assignedNodes().length > 0;
+    // }
+    // private handleHelperSlotChange(event: Event): void {
+    //   const slot = event.target as HTMLSlotElement;
+    //   this.hasHelperSlot = slot.assignedNodes().length > 0;
+    // }
+    // private handlePanelSlotChange(event: Event): void {
+    //   const slot = event.target as HTMLSlotElement;
+    //   this.hasPanelSlot = slot.assignedNodes().length > 0;
+    // }
+    toggleOpen() {
+        if (this.disabled)
+            return;
+        this.expand = !this.expand;
+        this.emit('plus-accordion-toggle', { detail: { expand: this.expand } });
+    }
+    render() {
+        const { base, header, panel, icon, helper, headerContainer } = accordionStyle({
+            expand: this.expand,
+            isGrouped: this.isGrouped,
+            isLast: this.isLast,
+            isFirst: this.isFirst,
+            size: this.size,
+            disabled: this.disabled,
+            // hasHelper: this.hasHelperSlot,
+        });
+        return x `
+      <div
+        class=${base()}
+        role="region"
+        aria-expanded=${this.expand}
+        aria-disabled=${this.disabled}
+      >
+        <div
+          class=${header()}
+          @click=${this.toggleOpen}
+          role="button"
+          tabindex=${this.disabled ? '-1' : '0'}
+          aria-controls="panel"
+          @keydown=${(e) => {
+            if (e.key === 'Enter' || e.key === ' ') {
+                e.preventDefault();
+                this.toggleOpen();
+            }
+        }}
+        >
+          <div class=${headerContainer()}>
+            <slot name="header" part="header"></slot>
+            <span class=${helper()} part="helper">
+              <slot name="helper"></slot>
+            </span>
+          </div>
+          <i class=${icon()} part="icon" aria-hidden="true"></i>
+        </div>
+        <div
+          class=${panel()}
+          id="panel"
+          part="panel"
+          role="region"
+          aria-labelledby="header"
+        >
+          <slot name="panel"></slot>
+        </div>
+      </div>
+    `;
+    }
+}
+// @state()
+// private hasHeaderSlot = false;
+// @state()
+// private hasHelperSlot = false;
+// @state()
+// private hasPanelSlot = false;
+PlusAccordion.styles = [
+    ...Tailwind.styles,
+    i `
+      :host {
+        display: block;
+        width: 100%;
+      }
+
+      :host([is-grouped]) {
+        border-radius: 0;
+      }
+
+      :host([is-grouped][is-first]) .header {
+        border-top-left-radius: 5px;
+        border-top-right-radius: 5px;
+      }
+
+      :host([is-grouped][is-last]) .header {
+        border-bottom-left-radius: 5px;
+        border-bottom-right-radius: 5px;
+      }
+
+      :host([is-grouped][is-last][expand]) .header {
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 0;
+      }
+    `,
+];
+__decorate([
+    n({
+        type: Boolean,
+        converter: (expand) => expand != 'false',
+        reflect: true,
+    })
+], PlusAccordion.prototype, "expand", void 0);
+__decorate([
+    n({ type: Boolean, reflect: true, attribute: 'is-grouped' })
+], PlusAccordion.prototype, "isGrouped", void 0);
+__decorate([
+    n({ type: Boolean, reflect: true, attribute: 'is-last' })
+], PlusAccordion.prototype, "isLast", void 0);
+__decorate([
+    n({ type: Boolean, reflect: true, attribute: 'is-first' })
+], PlusAccordion.prototype, "isFirst", void 0);
+__decorate([
+    n({ type: String, reflect: true })
+], PlusAccordion.prototype, "size", void 0);
+__decorate([
+    n({ type: Boolean, reflect: true })
+], PlusAccordion.prototype, "disabled", void 0);
+
+export { PlusAccordion, PlusAccordion as default };

package/dist/components/accordion/accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.js","sourceRoot":"","sources":["../../../src/components/accordion/accordion.ts"],"names":[],"mappings":"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"}