@teipublisher/pb-components 2.26.1-next.3 → 3.0.0

package/src/assets/pb-styles.css

@@ -1,51 +0,0 @@
-:root {
-    --pb-dialog-box-shadow: 0 2px 16px rgba(0, 0, 0, 0.3);
-    --pb-dialog-backdrop-color: rgba(0, 0, 0, 0.4);
-    --pb-dialog-padding-horizontal: 1em;
-    --pb-dialog-padding-vertical: 1em;
-    --pb-dialog-border-color: #eee;
-    --pb-dialog-min-width: 300px;
-}
-
-pb-dialog dialog {
-    min-width: var(--pb-dialog-min-width);
-    max-width: 100vw;
-    max-height: 90vh;
-    border-radius: 6px;
-    box-shadow: var(--pb-dialog-box-shadow);
-    border: none;
-    padding: 0;
-}
-
-pb-dialog dialog::backdrop {
-    background: var(--pb-dialog-backdrop-color);
-}
-
-pb-dialog>dialog>article>* {
-    padding-left: var(--pb-dialog-padding-horizontal);
-    padding-right: var(--pb-dialog-padding-horizontal);
-}
-
-pb-dialog>dialog>article>header {
-    border-bottom: 1px solid var(--pb-dialog-border-color);
-    display: flex;
-    margin-bottom: var(--pb-dialog-padding-vertical);
-    justify-content: space-between;
-    align-items: center;
-}
-
-pb-dialog>dialog>article>footer {
-    display: flex;
-    justify-content: flex-end;
-    gap: 0.5rem;
-    padding-top: var(--pb-dialog-padding-vertical);
-    padding-bottom: var(--pb-dialog-padding-vertical);
-    border-top: 1px solid var(--pb-dialog-border-color);
-}
-
-pb-dialog [rel="prev"] {
-    background: none;
-    border: none;
-    font-size: 1.2em;
-    cursor: pointer;
-}

package/src/pb-light-dom.js

@@ -1,41 +0,0 @@
-export const pbLightDom = (superclass) => class PbLightDom extends superclass {
-
-    createRenderRoot() {
-        // Render in light DOM
-        return this;
-    }
-
-    connectedCallback() {
-        super.connectedCallback();
-        this._content = document.createElement('div');
-        this._content.innerHTML = this.innerHTML;
-    }
-
-    /**
-     * When the class is used without shadow DOM, use this method to find elements which should be
-     * rendered in the slot.
-     * 
-     * @param {string|undefined|null} slotName - name of the slot to fill, if its a named slot
-     * @returns {Array<Node>} an array of cloned nodes
-     */
-    fillSlot(slotName = null, fallback = null) {
-        if (!slotName) {
-            const slots = this._content.querySelectorAll(':scope > :not([slot])');
-            return Array.from(slots).map(node => {
-                const clone = node.cloneNode(true);
-                /** @type {Element} */ (clone).removeAttribute('slot');
-                return clone;
-            });
-        } else {
-            const slot = this._content.querySelectorAll(`:scope > [slot="${slotName}"]`);
-            if (slot.length > 0) {
-                return Array.from(slot).map(node => {
-                    const clone = node.cloneNode(true);
-                    /** @type {Element} */ (clone).removeAttribute('slot');
-                    return clone;
-                });
-            }
-            return fallback || [];
-        }
-    }
-};