@supersoniks/concorde 2.0.2 → 2.0.3

package/core/components/ui/toast/message-subscriber.js

@@ -14,10 +14,6 @@ let MessageSubscriber = class MessageSubscriber extends Subscriber(LitElement, {
     constructor() {
         super(...arguments);
         this._messages = [];
-        this.success = null;
-        this.status = null;
-        this._message = "";
-        this._data = ""; //👍 quel plaisir mmmm.... 😭😭😭
     }
     get messages() {
         return this._messages;
@@ -31,55 +27,13 @@ let MessageSubscriber = class MessageSubscriber extends Subscriber(LitElement, {
                 SonicToast.add({ text: message.content || "", status: message.status });
         });
     }
-    get message() {
-        return this._message;
-    }
-    set message(value) {
-        this._message = value;
-        if (!this.message)
-            return;
-        if (this.props?.success !== false)
-            return;
-        if (this.props?.public_message)
-            return;
-        //OUi OUi il faut afficher "message" que si success est parfaitement égal à false et qu'il n'y a rien dans public_message.
-        SonicToast.add({ text: this.message, status: "error" });
-    }
-    get data() {
-        return this._data;
-    }
-    set data(value) {
-        this._data = value;
-        const toastOptions = { text: "Votre produit a bien été ajouté", status: "success" };
-        if (Array.isArray(this.data) && this.props?.success === true)
-            SonicToast.add(toastOptions);
-        if (this.data == "" && this.props?.status === true)
-            SonicToast.add(toastOptions);
-        if (this.props?.success !== false)
-            return;
-        if (this.props?.public_message)
-            return;
-        SonicToast.add({ text: this.data, status: "error" });
-    }
     render() {
         return nothing;
     }
 };
-__decorate([
-    property({ type: Boolean })
-], MessageSubscriber.prototype, "success", void 0);
-__decorate([
-    property({ type: Boolean })
-], MessageSubscriber.prototype, "status", void 0);
 __decorate([
     property({ type: Array })
 ], MessageSubscriber.prototype, "messages", null);
-__decorate([
-    property({ type: String })
-], MessageSubscriber.prototype, "message", null);
-__decorate([
-    property()
-], MessageSubscriber.prototype, "data", null);
 MessageSubscriber = __decorate([
     customElement(tagName)
 ], MessageSubscriber);

package/core/components/ui/toast/toast-item.js

@@ -26,13 +26,15 @@ let SonicToastItem = class SonicToastItem extends LitElement {
         this.ghost = false;
         this.preserve = false;
         this.dismissForever = false;
-        this.maxHeight = '10rem';
+        this.maxHeight = "10rem";
         this.visible = true;
     }
+    // @queryAssignedElements({flatten: true, slot: main"})
+    // textSlot!: HTMLElement[];
     render() {
         // check if the toast is dismissed
         if (this.dismissForever) {
-            const dismissed = localStorage.getItem('sonic-toast-dismissed') || '{}';
+            const dismissed = localStorage.getItem("sonic-toast-dismissed") || "{}";
             const dismissedObj = JSON.parse(dismissed);
             if (dismissedObj[this.id]) {
                 return nothing;
@@ -41,39 +43,32 @@ let SonicToastItem = class SonicToastItem extends LitElement {
         if (!this.visible) {
             return nothing;
         }
-        return html `<div
-      class="sonic-toast ${this.status} ${this.ghost ? "ghost" : ""}"
-    >
-    
-    <button aria-label="Close" class="sonic-toast-close" @click=${() => this.hide()}>
-      <sonic-icon  name="cancel" size="lg"></sonic-icon>
-    </button>
-    <div class="sonic-toast-content custom-scroll"  style="max-height: ${this.maxHeight} ;">
-      
-        ${this.status &&
-            html `<sonic-icon  name=${icon[this.status]} class="sonic-toast-icon" size="2xl"></sonic-icon>`}
-        
-          
-          <div class="sonic-toast-text">
-            ${this.title ? html `<div class="sonic-toast-title">${this.title}</div>` : ""}
-            ${this.text ? unsafeHTML(this.text) : ""}
+        return html `<div class="sonic-toast ${this.status} ${this.ghost ? "ghost" : ""}">
+      <button aria-label="Close" class="sonic-toast-close" @click=${() => this.hide()}>
+        <sonic-icon name="cancel" size="lg"></sonic-icon>
+      </button>
+      <div class="sonic-toast-content custom-scroll" style="max-height: ${this.maxHeight} ;">
+        ${this.status && html `<sonic-icon name=${icon[this.status]} class="sonic-toast-icon" size="2xl"></sonic-icon>`}
+
+        <div class="sonic-toast-text">
+          ${this.title ? html `<div class="sonic-toast-title">${this.title}</div>` : ""} ${this.text ? unsafeHTML(this.text) : ""}
           <slot></slot>
-          </div>
-          
-          ${!this.preserve ? this.autoHide() : ""}
         </div>
+
+        ${!this.preserve ? this.autoHide() : ""}
+      </div>
     </div>`;
     }
     hide() {
-        if (!this.closest('sonic-toast')) {
+        if (!this.closest("sonic-toast")) {
             this.visible = false;
         }
         if (this.dismissForever) {
             // set in local Storage an Object with the id as key and if it's dismissed as value
-            const dismissed = localStorage.getItem('sonic-toast-dismissed') || '{}';
+            const dismissed = localStorage.getItem("sonic-toast-dismissed") || "{}";
             const dismissedObj = JSON.parse(dismissed);
             dismissedObj[this.id] = true;
-            localStorage.setItem('sonic-toast-dismissed', JSON.stringify(dismissedObj));
+            localStorage.setItem("sonic-toast-dismissed", JSON.stringify(dismissedObj));
         }
         this.dispatchEvent(new CustomEvent("hide", { bubbles: true }));
     }
@@ -83,7 +78,7 @@ let SonicToastItem = class SonicToastItem extends LitElement {
     autoHide() {
         setTimeout(() => {
             this.hide();
-        }, 4200);
+        }, 6000);
     }
 };
 SonicToastItem.styles = [
@@ -115,7 +110,7 @@ SonicToastItem.styles = [
       .sonic-toast {
         position: relative;
         pointer-events: auto;
-        overflow:hidden;
+        overflow: hidden;
         line-height: 1.25;
         color: var(--sc-toast-color);
         box-shadow: var(--sc-toast-shadow);
@@ -128,14 +123,14 @@ SonicToastItem.styles = [
         display: flex;
         gap: 0.5rem;
         overflow: auto;
-        position:relative;
-      } 
+        position: relative;
+      }
 
       .sonic-toast-text {
         align-self: center;
         margin-top: auto;
         margin-bottom: auto;
-        max-width:70ch;
+        max-width: 70ch;
         line-height: 1.2;
       }
 
@@ -153,20 +148,19 @@ SonicToastItem.styles = [
 
       ::slotted(li),
       .sonic-toast-text li {
-        margin-bottom: .15em !important;
+        margin-bottom: 0.15em !important;
       }
 
-      ::slotted( :is(p, ul, ol, hr, h1, h2, h3, h4, h5, h6):last-child),
+      ::slotted(:is(p, ul, ol, hr, h1, h2, h3, h4, h5, h6):last-child),
       .sonic-toast-text > :is(p, ul, ol, hr, h1, h2, h3, h4, h5, h6):last-child {
         margin-bottom: 0 !important;
-      } 
-
+      }
 
       /*BUTTON CLOSE*/
       .sonic-toast-close {
         all: unset;
         position: absolute;
-        z-index:4;
+        z-index: 4;
         pointer-events: initial;
         right: 0.5em;
         top: 0.5em;
@@ -245,7 +239,7 @@ SonicToastItem.styles = [
         border-radius: var(--sc-toast-rounded);
         background-color: var(--sc-toast-status-color);
       }
-      
+
       .sonic-toast:hover:before {
         opacity: 0.025;
       }
@@ -258,17 +252,14 @@ SonicToastItem.styles = [
       }
 
       .sonic-toast-icon {
-        position:sticky;
-        top:0;
+        position: sticky;
+        top: 0;
       }
 
       .ghost {
         opacity: 0.85;
         pointer-events: none;
       }
-
-    
-
     `,
 ];
 __decorate([

package/core/components/ui/toast/toast.d.ts

@@ -4,9 +4,12 @@ import "@supersoniks/concorde/core/components/ui/toast/toast-item";
 import { Toast } from "@supersoniks/concorde/core/components/ui/toast/types";
 export declare class SonicToast extends LitElement {
     toasts: Toast[];
+    static delegateToasts: boolean;
     createRenderRoot(): this;
     render(): import("lit-html").TemplateResult<1> | typeof nothing;
     static removeAll(): void;
+    static instance?: SonicToast;
+    static getInstance(): SonicToast;
     static add(conf: Toast): {
         id: string | number;
         text: string;
@@ -15,7 +18,8 @@ export declare class SonicToast extends LitElement {
         preserve: boolean | undefined;
         ghost: boolean | undefined;
         dismissForever: boolean | undefined;
-    } | null;
+    } | null | undefined;
+    static handleExistingToastDelegation(): void;
     static removeItem(toastToRemove?: Toast): void;
     removeItem(toastToRemove?: Toast): void;
 }

package/core/components/ui/toast/toast.js

@@ -4,6 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
+var SonicToast_1;
 import { html, LitElement, nothing } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { repeat } from "lit/directives/repeat.js";
@@ -14,8 +15,9 @@ import { ifDefined } from "lit/directives/if-defined.js";
 import { unsafeHTML } from "lit/directives/unsafe-html.js";
 import { styleMap } from "lit/directives/style-map.js";
 import "@supersoniks/concorde/core/components/ui/toast/toast-item";
+import { Theme } from "@supersoniks/concorde/core/components/ui/theme/theme";
 const tagName = "sonic-toast";
-let SonicToast = class SonicToast extends LitElement {
+let SonicToast = SonicToast_1 = class SonicToast extends LitElement {
     constructor() {
         super(...arguments);
         this.toasts = [];
@@ -45,6 +47,7 @@ let SonicToast = class SonicToast extends LitElement {
             };
         }
         // ${window.parent == window ? "fixed-area" : ""}
+        SonicToast_1.handleExistingToastDelegation();
         if (!this.toasts)
             return nothing;
         return html `<div aria-live="polite" style=${styleMap(styles)}>
@@ -82,21 +85,32 @@ let SonicToast = class SonicToast extends LitElement {
     </div>`;
     }
     static removeAll() {
-        const toastComponent = document.querySelector("sonic-toast");
+        if (SonicToast_1.delegateToasts) {
+            SonicToast_1.handleExistingToastDelegation();
+            window.parent.postMessage({ type: "removeAllToasts" }, "*");
+            return;
+        }
+        const toastComponent = SonicToast_1.getInstance();
         if (!toastComponent)
             return;
         toastComponent.toasts = toastComponent.toasts.filter((item) => item.ghost);
     }
-    // ADD TOAST
+    static getInstance() {
+        if (SonicToast_1.instance)
+            return SonicToast_1.instance;
+        SonicToast_1.instance = document.createElement("sonic-toast");
+        Theme.getPopContainer().prepend(SonicToast_1.instance);
+        return SonicToast_1.instance;
+    }
     static add(conf) {
-        // Init toast area si absente (au <sonic-theme> ou <body< à défaut)
-        if (!document.querySelector("sonic-toast")) {
-            const toastComponent = document.createElement("sonic-toast");
-            const container = document.querySelector("sonic-theme") || document.body;
-            container.prepend(toastComponent);
+        if (SonicToast_1.delegateToasts) {
+            SonicToast_1.handleExistingToastDelegation();
+            window.parent.postMessage({ type: "addToast", toast: conf }, "*");
+            return;
         }
+        // Init toast area si absente (au <sonic-theme> ou <body< à défaut)
+        const toastComponent = SonicToast_1.getInstance();
         // Ajoute le toast à la liste
-        const toastComponent = document.querySelector("sonic-toast");
         const nextId = conf.id ?? new Date().valueOf();
         const interactiveRegExp = new RegExp("</a>|</.*?button>|</.*?input>|</.*?textarea>|</.*?select>");
         const hasInteractive = interactiveRegExp.test(conf.text);
@@ -117,7 +131,7 @@ let SonicToast = class SonicToast extends LitElement {
                 return null;
             }
         }
-        if (toastComponent.toasts.length > 0) {
+        if (toastComponent?.toasts.length) {
             const toastA = { ...currentToast };
             for (const toast of toastComponent.toasts) {
                 const toastB = { ...toast };
@@ -127,11 +141,25 @@ let SonicToast = class SonicToast extends LitElement {
                 }
             }
         }
-        toastComponent.toasts = [...toastComponent.toasts, currentToast];
+        if (toastComponent) {
+            toastComponent.toasts = [...toastComponent.toasts, currentToast];
+        }
         return currentToast;
     }
+    static handleExistingToastDelegation() {
+        if (!this.delegateToasts)
+            return;
+        const toastComponent = SonicToast_1.getInstance();
+        window.parent.postMessage({ type: "addToasts", toasts: toastComponent.toasts }, "*");
+        toastComponent.toasts = [];
+    }
     static removeItem(toastToRemove) {
-        const toastComponent = document.querySelector("sonic-toast");
+        if (SonicToast_1.delegateToasts) {
+            SonicToast_1.handleExistingToastDelegation();
+            window.parent.postMessage({ type: "removeToast", toast: toastToRemove }, "*");
+            return;
+        }
+        const toastComponent = SonicToast_1.getInstance();
         if (!toastComponent)
             return;
         toastComponent.removeItem(toastToRemove);
@@ -147,13 +175,52 @@ let SonicToast = class SonicToast extends LitElement {
         });
     }
 };
+SonicToast.delegateToasts = false;
 __decorate([
     property({ type: Array })
 ], SonicToast.prototype, "toasts", void 0);
-SonicToast = __decorate([
+SonicToast = SonicToast_1 = __decorate([
     customElement(tagName)
 ], SonicToast);
 export { SonicToast };
 if (typeof window !== "undefined") {
     window.SonicToast = SonicToast;
 }
+/**
+ * Handles the context of iframes and performs necessary actions based on received messages.
+ */
+function handleIframeContexts() {
+    const onPostMessage = (e) => {
+        if (e.data.type == "querySonicToastAvailability") {
+            e.source.postMessage({ type: "sonicToastAvailable" }, "*");
+        }
+        if (e.data.type == "sonicToastAvailable") {
+            SonicToast.delegateToasts = true;
+            SonicToast.handleExistingToastDelegation();
+        }
+        if (e.data.type == "addToasts") {
+            SonicToast.getInstance().toasts = [...SonicToast.getInstance().toasts, ...e.data.toasts];
+        }
+        if (e.data.type == "removeAllToasts") {
+            SonicToast.removeAll();
+        }
+        if (e.data.type == "removeToast") {
+            SonicToast.removeItem(e.data.toast);
+        }
+        if (e.data.type == "addToast") {
+            SonicToast.add(e.data.toast);
+        }
+    };
+    const isIframe = !(window.parent == window);
+    window.addEventListener("message", onPostMessage, false);
+    if (isIframe) {
+        window.parent.postMessage({ type: "querySonicToastAvailability" }, "*");
+    }
+    // tell iframes that sonic-toast is available
+    if (!isIframe) {
+        for (const iframe of document.querySelectorAll("iframe")) {
+            iframe.contentWindow?.postMessage({ type: "sonicToastAvailable" }, "*");
+        }
+    }
+}
+handleIframeContexts();

package/core/components/ui/tooltip/tooltip.d.ts

@@ -2,7 +2,9 @@ import { LitElement } from "lit";
 export declare class Tooltip extends LitElement {
     static styles: import("lit").CSSResult[];
     label: string;
-    placement?: "top" | "bottom" | "left" | "right";
+    placement?: "top" | "top-start" | "top-end" | "bottom" | "left" | "right";
     disabled: boolean;
+    focusable: boolean;
+    connectedCallback(): void;
     render(): import("lit-html").TemplateResult<1>;
 }

package/core/components/ui/tooltip/tooltip.js

@@ -12,6 +12,13 @@ let Tooltip = class Tooltip extends LitElement {
         super(...arguments);
         this.label = "";
         this.disabled = false;
+        this.focusable = false;
+    }
+    connectedCallback() {
+        if (this.focusable) {
+            this.setAttribute("tabindex", "0");
+        }
+        super.connectedCallback();
     }
     render() {
         const disabledClass = this.disabled || this.label == "" ? "disabled" : "";
@@ -49,6 +56,7 @@ Tooltip.styles = [
         white-space: pre-line;
         font-weight: var(--sc-tooltip-fw);
       }
+      :host(:focus-within) .tooltip:not(.disabled):before,
       .tooltip:not(.disabled):hover:before {
         opacity: 1;
         display: block;
@@ -61,6 +69,17 @@ Tooltip.styles = [
         transform: translateX(-50%);
       }
 
+      :host([placement="top-end"]) .tooltip:before {
+        bottom: calc(100% + 0.25rem);
+        right: 0;
+        transform: translateX(0);
+      }
+      :host([placement="top-start"]) .tooltip:before {
+        bottom: calc(100% + 0.25rem);
+        left: 0;
+        transform: translateX(0);
+      }
+
       :host([placement="bottom"]) .tooltip:before {
         top: calc(100% + 0.25rem);
         left: 50%;
@@ -89,6 +108,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], Tooltip.prototype, "disabled", void 0);
+__decorate([
+    property({ type: Boolean })
+], Tooltip.prototype, "focusable", void 0);
 Tooltip = __decorate([
     customElement(tagName)
 ], Tooltip);

package/core/decorators/Subscriber.d.ts

@@ -1,4 +1,4 @@
-export declare function bind(value: string): (target: any, propertyKey: string) => void;
-export declare function onAssign(values: Array<string>): (target: any, propertyKey: string, descriptor: PropertyDescriptor) => void;
+export declare function bind(value: string): (target: unknown, propertyKey: string) => void;
+export declare function onAssign(...values: Array<string>): (target: unknown, _propertyKey: string, descriptor: PropertyDescriptor) => void;
 export declare function autoSubscribe(): (target: any, propertyKey: string, descriptor: PropertyDescriptor) => void;
-export declare function autoFill(values: string[]): (target: any) => void;
+export declare function autoFill(values: string[]): (target: unknown) => void;

package/core/decorators/Subscriber.js

@@ -1,4 +1,38 @@
-import { Objects, PublisherManager } from "@supersoniks/concorde/utils";
+import { Objects } from "@supersoniks/concorde/utils";
+import { PublisherManager } from "../utils/PublisherProxy";
+function onConnected(callback) {
+    if (!this.__connectedCallbackCalls__)
+        this.__connectedCallbackCalls__ = new Set();
+    this.__connectedCallbackCalls__.add(callback);
+}
+function __onDisconnected__(callback) {
+    if (!this.__disconnectedCallbackCalls__)
+        this.__disconnectedCallbackCalls__ = new Set();
+    this.__disconnectedCallbackCalls__.add(callback);
+}
+function setSubscribable(target) {
+    if (target.__is__setSubscribable__)
+        return;
+    target.__is__setSubscribable__ = true;
+    target.__onConnected__ = onConnected;
+    target.__onDisconnected__ = __onDisconnected__;
+    // target.offConnected = onConnected;
+    // target.offDisconnected = __onDisconnected__;
+    const originalConnectedCallback = target.connectedCallback;
+    target.connectedCallback = function () {
+        originalConnectedCallback.call(this);
+        if (this.__connectedCallbackCalls__) {
+            this.__connectedCallbackCalls__.forEach((callback) => callback(this));
+        }
+    };
+    const originalDisconnectedCallback = target.disconnectedCallback;
+    target.disconnectedCallback = function () {
+        originalDisconnectedCallback.call(this);
+        if (this.__disconnectedCallbackCalls__) {
+            this.__disconnectedCallbackCalls__.forEach((callback) => callback(this));
+        }
+    };
+}
 export function bind(value) {
     const split = value.split(".");
     if (split.length == 0) {
@@ -10,19 +44,22 @@ export function bind(value) {
     let publisher = PublisherManager.get(dataProvider);
     publisher = Objects.traverse(publisher, split);
     return function (target, propertyKey) {
+        if (!target)
+            return;
         let onAssign;
-        target.onConnected((component) => {
+        setSubscribable(target);
+        target.__onConnected__((component) => {
             onAssign = (value) => {
                 component[propertyKey] = value;
             };
             publisher.onAssign(onAssign);
         });
-        target.onDisconnected(() => {
+        target.__onDisconnected__(() => {
             publisher.offAssign(onAssign);
         });
     };
 }
-export function onAssign(values) {
+export function onAssign(...values) {
     const onAssignValues = [];
     const confs = [];
     for (let i = 0; i < values.length; i++) {
@@ -42,17 +79,17 @@ export function onAssign(values) {
         };
         confs.push({ publisher, onAssign, callbacks });
     }
-    return function (target, propertyKey, descriptor) {
-        propertyKey;
+    return function (target, _propertyKey, descriptor) {
+        setSubscribable(target);
         let callback;
-        target.onConnected((component) => {
+        target.__onConnected__((component) => {
             for (const conf of confs) {
                 callback = descriptor.value.bind(component);
                 conf.callbacks.add(callback);
                 conf.publisher.onAssign(conf.onAssign);
             }
         });
-        target.onDisconnected(() => {
+        target.__onDisconnected__(() => {
             for (const conf of confs) {
                 conf.callbacks.delete(callback);
                 conf.publisher.offAssign(conf.onAssign);
@@ -62,21 +99,28 @@ export function onAssign(values) {
 }
 export function autoSubscribe() {
     return function (target, propertyKey, descriptor) {
-        target;
-        propertyKey;
-        if (propertyKey != "render")
-            throw new Error("autoSubscribe can only be used on render method");
+        let renderId = 0;
         const originalMethod = descriptor.value;
         const originalDC = target.constructor.prototype.disconnectedCallback;
         target.constructor.prototype.disconnectedCallback = function () {
             originalDC.apply(this);
             this.__removeAutoSubscribe__();
         };
+        const originalConnectedCallback = target.connectedCallback;
+        target.connectedCallback = function () {
+            originalConnectedCallback?.call(this);
+            this[propertyKey]();
+        };
         descriptor.value = function (...args) {
-            const subscriber = this;
             let publishers = new Set();
             const onAssign = () => {
-                subscriber.requestUpdate();
+                renderId++;
+                const id = renderId;
+                window.queueMicrotask(() => {
+                    if (id !== renderId)
+                        return;
+                    this[propertyKey]();
+                });
             };
             //on désabone les publishers du rendu précédant
             publishers.forEach((publisher) => {
@@ -100,6 +144,7 @@ export function autoSubscribe() {
 }
 export function autoFill(values) {
     return function (target) {
+        setSubscribable(target);
         for (const value of values) {
             const split = value.split(".");
             if (split.length == 0) {
@@ -108,15 +153,13 @@ export function autoFill(values) {
             const dataProvider = split.shift() || "";
             let publisher = PublisherManager.get(dataProvider);
             publisher = Objects.traverse(publisher, split);
-            if (!target.prototype.connectedCallbackCalls)
-                target.prototype.connectedCallbackCalls = new Set();
-            target.prototype.connectedCallbackCalls.add((component) => {
+            target.__onConnected__((component) => {
                 publisher.startTemplateFilling(component);
             });
-            if (!target.prototype.disconnectedCallbackCalls)
-                target.prototype.disconnectedCallbackCalls = new Set();
-            target.prototype.disconnectedCallbackCalls.add((component) => {
-                publisher.stopTemplateFilling(component);
+            target.__onDisconnected__(() => {
+                (component) => {
+                    publisher.stopTemplateFilling(component);
+                };
             });
         }
     };

package/core/directives/DataProvider.d.ts

@@ -1,18 +1,23 @@
 import { AsyncDirective } from "lit/async-directive.js";
-type Observable = any | string | (() => unknown);
+import { PublisherProxy } from "@supersoniks/concorde/core/utils/PublisherProxy";
+import { SearchableDomElement } from "../utils/HTML";
+type Observable = PublisherProxy | string | (() => unknown);
 declare class ObserveDirective extends AsyncDirective {
-    observables: Set<any>;
+    observables: Set<PublisherProxy>;
     unsubscribe(): void;
     observable?: Observable;
+    node?: SearchableDomElement;
+    constructor(partInfo: any);
     render(observable: Observable): symbol;
     onAssign: (v: unknown) => void;
     subscribe(observable: Observable): void;
     disconnected(): void;
     reconnected(): void;
 }
-export declare const subscribe: (observable: any) => import("lit-html/directive").DirectiveResult<typeof ObserveDirective>;
-export declare const sub: (observable: any) => import("lit-html/directive").DirectiveResult<typeof ObserveDirective>;
-export declare const get: (id: string | any) => any;
-export declare const dataProvider: (id: any) => any;
-export declare const dp: (id: any) => any;
+export declare const subscribe: (observable: Observable) => import("lit-html/directive").DirectiveResult<typeof ObserveDirective>;
+export declare const sub: (observable: Observable) => import("lit-html/directive").DirectiveResult<typeof ObserveDirective>;
+export declare const get: (id: Observable) => any;
+export declare const dataProvider: (id: Observable, defaultValue?: any) => any;
+export declare const dp: (id: Observable, defaultValue?: any) => any;
+export declare const set: (id: Observable, value: unknown) => void;
 export {};