@vandenberghinc/volt 1.1.4 → 1.1.6

package/frontend/dist/ui/popup.js

@@ -36,10 +36,6 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     }
     return useValue ? value : void 0;
 };
-var __setFunctionName = (this && this.__setFunctionName) || function (f, name, prefix) {
-    if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
-    return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
-};
 // Imports.
 import { Elements } from "../elements/module.js";
 import { Mutex } from "../modules/mutex";
@@ -50,22 +46,54 @@ import { LoaderButton } from "./loader_button";
 import { ImageMask } from "./image";
 // RingLoader.
 // - The width and height must be in pixels.
-let PopupElement = (() => {
-    var _a;
-    let _classDecorators = [(_a = Elements).register.bind(_a)];
+let YesNoPopupElement = (() => {
+    let _classDecorators = [Elements.create({
+            name: "YesNoPopupElement",
+        })];
     let _classDescriptor;
     let _classExtraInitializers = [];
     let _classThis;
     let _classSuper = VStackElement;
-    var PopupElement = _classThis = class extends _classSuper {
+    var YesNoPopupElement = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            YesNoPopupElement = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+        // Attributes.
+        p_mutex;
+        p_auto_hide;
+        p_auto_remove;
+        p_animation_duration;
+        p_blur;
+        p_on_no_handler;
+        p_on_yes_handler;
+        p_on_popup_handler;
+        p_escape_handler;
+        image;
+        // @ts-ignore
+        title;
+        // @ts-ignore
+        text;
+        no_button;
+        yes_button;
+        buttons;
+        // @ts-ignore
+        content;
+        widget;
+        _on_no_called = false;
         constructor({ title, text, no = "No", yes = "Yes", image = false, image_color = "white", content = [], auto_hide = true, auto_remove = false, animation_duration = 0, // in ms.
         blur = 0, on_no = () => { }, on_yes = () => { }, on_popup = () => { }, }) {
             // Initialize base class.
             super();
-            this._on_no_called = false;
-            this._init_derived({ derived: PopupElement });
+            this._init({
+                derived: YesNoPopupElement,
+            });
             // Mutex.
-            this.p_mutex = Mutex();
+            this.p_mutex = new Mutex();
             // Args.
             this.p_auto_hide = auto_hide;
             this.p_auto_remove = auto_remove;
@@ -204,7 +232,7 @@ let PopupElement = (() => {
         }
         // Set default since it inherits HStackElement.
         set_default() {
-            return super.set_default(PopupElement);
+            return super.set_default(YesNoPopupElement);
         }
         // Await the previous popup.
         async await() {
@@ -316,16 +344,147 @@ let PopupElement = (() => {
             document.body.addEventListener("keydown", this.p_escape_handler); // for some reason on_key_down on main element is not catched.
         }
     };
-    __setFunctionName(_classThis, "PopupElement");
-    (() => {
-        const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
-        __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
-        PopupElement = _classThis = _classDescriptor.value;
-        if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
-        __runInitializers(_classThis, _classExtraInitializers);
-    })();
-    return PopupElement = _classThis;
+    return YesNoPopupElement = _classThis;
 })();
-export { PopupElement };
-export const Popup = Elements.wrapper(PopupElement);
-export const NullPopup = Elements.create_null(PopupElement);
+export { YesNoPopupElement };
+export const YesNoPopup = Elements.wrapper(YesNoPopupElement);
+export const NullYesNoPopup = Elements.create_null(YesNoPopupElement);
+// /** Custom popup */
+// @Elements.create({
+//     name: "CustomPopupElement",
+// })
+// export class CustomPopupElement extends (VStackElement as any as VElementBaseSignature) {
+//     public content: FrameElement;
+//     public close: 
+//     close_border(...args) {
+//         this.close.border(...args);
+//         return this;
+//     }
+//     constructor(...children: AppendType[]) {
+//         // Initialize base class.
+//         super();
+//         this._init({
+//             derived: CustomPopupElement,
+//         })
+//         const close_handler = (event) => {
+//             if (event.key === "Escape") {
+//                 popup.close();
+//             }
+//         }
+//         this.append(
+//             this.content = UI.Widget(...children)
+//                 .background(Theme.bg_1)
+//                 .max_width(400)
+//                 .parent(this),
+//             Frame(
+//                 close = ImageMask("/static/icons/close.webp")
+//                     .frame(10, 10)
+//                     .flex(0)
+//                     .transition_mask("background 300ms ease-in-out")
+//                     .color(Theme.bg),
+//             )
+//                 .background(Theme.auto_darken_lighten("fg", 0.5))
+//                 .border_radius("50%")
+//                 .border(1, Theme.div_bg)
+//                 .frame(30, 30)
+//                 .center().center_vertical()
+//                 .position(25, 25, null, null)
+//                 .on_click(() => popup.close())
+//                 .hover_transitions([
+//                     { target: "this", selected: Theme.auto_darken_lighten("fg", 0.6), unselected: Theme.auto_darken_lighten("fg", 0.5), methods: ["background"] },
+//                     { target: close, selected: Theme.bg_hover, unselected: Theme.bg, methods: ["color"] },
+//                     // { target: "this", selected: Theme.fg, unselected: Theme.fg_2, methods: ["color"] },
+//                     // { target: "this", selected: Theme.fg, unselected: Theme.fg_2, methods: ["color"] },
+//                 ])
+//         )
+//             .position(0, 0, 0, 0)
+//             .center()
+//             .center_vertical()
+//             .background("#00000008")
+//             .padding(25)
+//             .background_blur(5)
+//             .transition("opacity 300ms ease-in-out")
+//             .on_click((e, event) => {
+//                 if (event.target === content || content.is_nested_child(event.target)) {
+//                     return;
+//                 }
+//                 e.close()
+//             })
+//         }
+//     // Set width on content instead of parent.
+//     width(): string | number;
+//     width(value: string | number, check_attribute?: boolean): this;
+//     width(value?: string | number, check_attribute: boolean = true): this | number | string {
+//         if (this._e === undefined) {
+//             return super.width(value as any, check_attribute);
+//         }
+//         if (value == null) {
+//             return this._e.width.toString();
+//         }
+//         // Assign percentage values to the root.
+//         if (typeof value === "string" && value.includes("%")) {
+//             super.width(value as any, false);
+//         } else {
+//             this._e.style.width = this.pad_numeric(value, "px");
+//             this._e.width = value as any;
+//         }
+//         return this;
+//     }
+//     min_width(): string | number
+//     min_width(value: string | number): this;
+//     min_width(value?: string | number): this | string | number {
+//         if (this._e === undefined) {
+//             return super.min_width(value as any);
+//         }
+//         if (value == null) {
+//             return this._e.style.minWidth;
+//         }
+//         // Assign percentage values to the root.
+//         if (typeof value === "string" && value.includes("%")) {
+//             super.min_width(value as any);
+//         } else {
+//             this._e.style.minWidth = this.pad_numeric(value, "px");
+//         }
+//         return this;
+//     }
+//     max_width(): string | number
+//     max_width(value: string | number): this;
+//     max_width(value?: string | number): this | string | number {
+//         if (this._e === undefined) {
+//             return super.max_width(value as any);
+//         }
+//         if (value == null) {
+//             return this._e.style.maxWidth;
+//         }
+//         // Assign percentage values to the root.
+//         if (typeof value === "string" && value.includes("%")) {
+//             super.max_width(value as any);
+//         } else {
+//             this._e.style.maxWidth = this.pad_numeric(value, "px");
+//         }
+//         return this;
+//     }
+//         max_width(value: number) {
+//             content.max_width(value);
+//             return this;
+//         }
+//         open() {
+//             document.body.addEventListener("keydown", close_handler);
+//             UI.view.append(this);
+//             this.opacity(0)
+//             this.show();
+//             this.getBoundingClientRect();
+//             this.opacity(1);
+//             return this;
+//         }
+//         close() {
+//             document.body.removeEventListener("keydown", close_handler);
+//             this.opacity(0)
+//             setTimeout(() => this.remove(), 300)
+//             return this;
+//         }
+//     }
+// }
+// export const CustomPopup = Elements.wrapper(CustomPopupElement);
+// export const NullCustomPopup = Elements.create_null(CustomPopupElement);
+// declare module './any_element.d.ts' { interface AnyElementMap { CustomPopupElement: CustomPopupElement } }

package/frontend/dist/ui/pseudo.d.ts

@@ -1,13 +1,13 @@
-import { VElement, VElementTagMap } from "../elements/module.js";
+import { VElement, VElementTagMap, AppendType } from "../elements/module.js";
 export declare class PseudoElement extends VElementTagMap.div {
     added_to_elements: {
         node: VElement;
         type: string;
     }[];
-    constructor(...children: any[]);
+    constructor(...children: AppendType[]);
     update(): this;
 }
-export declare const Pseudo: <Extensions extends object = {}>(...args: any[]) => PseudoElement & Extensions;
+export declare const Pseudo: <Extensions extends object = {}>(...args: AppendType[]) => PseudoElement & Extensions;
 export declare const NullPseudo: <Extensions extends object = {}>() => PseudoElement & Extensions;
 declare module './any_element.d.ts' {
     interface AnyElementMap {

package/frontend/dist/ui/pseudo.js

@@ -36,25 +36,30 @@ var __runInitializers = (this && this.__runInitializers) || function (thisArg, i
     }
     return useValue ? value : void 0;
 };
-var __setFunctionName = (this && this.__setFunctionName) || function (f, name, prefix) {
-    if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
-    return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
-};
 // Imports.
 import { Elements, VElementTagMap } from "../elements/module.js";
 // Divider.
 let PseudoElement = (() => {
-    var _a;
-    let _classDecorators = [(_a = Elements).register.bind(_a)];
+    let _classDecorators = [Elements.create({
+            name: "PseudoElement",
+        })];
     let _classDescriptor;
     let _classExtraInitializers = [];
     let _classThis;
     let _classSuper = VElementTagMap.div;
-    var PseudoElement = _classThis = class extends _classSuper {
+    var PseudoElement = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            PseudoElement = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+        // Attributes.
+        added_to_elements = [];
         constructor(...children) {
             super({ derived: PseudoElement, });
-            // Attributes.
-            this.added_to_elements = [];
             // Append.
             this.append(...children);
         }
@@ -66,14 +71,6 @@ let PseudoElement = (() => {
             return this;
         }
     };
-    __setFunctionName(_classThis, "PseudoElement");
-    (() => {
-        const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
-        __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
-        PseudoElement = _classThis = _classDescriptor.value;
-        if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
-        __runInitializers(_classThis, _classExtraInitializers);
-    })();
     return PseudoElement = _classThis;
 })();
 export { PseudoElement };

package/frontend/dist/ui/scroller.d.ts

@@ -1,4 +1,5 @@
-import { VElementTagMap } from "../elements/module.js";
+import { VElementBaseSignature, VElement, VElementTagMap, AppendType } from "../elements/module.js";
+import { AnyElement } from "./any_element.js";
 import { VStackElement } from "./stack";
 type OnScrollCallback = ((element: ScrollerElement, event: Event) => any);
 interface ScrollCallbackItem {
@@ -6,19 +7,6 @@ interface ScrollCallbackItem {
     user_callback: OnScrollCallback;
 }
 export declare class ScrollerElement extends VElementTagMap.div {
-    static default_style: {
-        position: string;
-        margin: string;
-        padding: string;
-        display: string;
-        overflow: string;
-        "align-content": string;
-        "flex-direction": string;
-        "scroll-behavior": string;
-        "overscroll-behavior": string;
-        height: string;
-        "content-visibility": string;
-    };
     content: VStackElement;
     thumb: VStackElement & {
         dragging: boolean;
@@ -37,10 +25,10 @@ export declare class ScrollerElement extends VElementTagMap.div {
     _alignment_callback_activated: boolean;
     _alignment_callback: any;
     _fadeout_timeout: any;
-    constructor(...children: any[]);
+    constructor(...children: AppendType[]);
     is_scrollable(): boolean;
     remove_children(): this;
-    append(...children: any): this;
+    append(...children: AppendType[]): this;
     child(index: number): any;
     overflow(): string;
     overflow(value: string): this;
@@ -82,46 +70,20 @@ export declare class ScrollerElement extends VElementTagMap.div {
     leading_vertical(): this;
     trailing_vertical(): this;
 }
-export declare const Scroller: <Extensions extends object = {}>(...args: any[]) => ScrollerElement & Extensions;
+export declare const Scroller: <Extensions extends object = {}>(...args: AppendType[]) => ScrollerElement & Extensions;
 export declare const NullScroller: <Extensions extends object = {}>() => ScrollerElement & Extensions;
 declare module './any_element.d.ts' {
     interface AnyElementMap {
         ScrollerElement: ScrollerElement;
     }
 }
-export declare class VirtualScrollerElement extends ScrollerElement {
-    _v_children: any[];
-    top_diff: number;
-    scroll_top_value: number;
-    _last_v_children: number;
-    visible_container: VStackElement;
-    height_measurer: any;
-    constructor(...children: any[]);
-    set_default(): this;
-    overflow(): string;
-    overflow(value: string): this;
-    overflow_x(): string;
-    overflow_x(value: string): this;
-    remove_children(): this;
-    render(): this;
-    update_heights(): this;
-    update_height(child: any): this;
-    get_height(element: any, fixed?: boolean): number;
-    append(...children: any[]): this;
-}
-export declare const VirtualScroller: <Extensions extends object = {}>(...args: any[]) => VirtualScrollerElement & Extensions;
-export declare const NullVirtualScroller: <Extensions extends object = {}>() => VirtualScrollerElement & Extensions;
-declare module './any_element.d.ts' {
-    interface AnyElementMap {
-        VirtualScrollerElement: VirtualScrollerElement;
-    }
-}
-export declare class SnapScrollerElement extends VStackElement {
-    constructor(...children: any[]);
-    append(...children: any[]): this;
+declare const SnapScrollerElement_base: VElementBaseSignature;
+export declare class SnapScrollerElement extends SnapScrollerElement_base {
+    constructor(...children: VElement[]);
+    append(...children: AnyElement[]): this;
     scroll_into_child(index: number, behaviour?: string): this;
 }
-export declare const SnapScroller: <Extensions extends object = {}>(...args: any[]) => SnapScrollerElement & Extensions;
+export declare const SnapScroller: <Extensions extends object = {}>(...args: VElement[]) => SnapScrollerElement & Extensions;
 export declare const NullSnapScroller: <Extensions extends object = {}>() => SnapScrollerElement & Extensions;
 declare module './any_element.d.ts' {
     interface AnyElementMap {