@quaffui/quaff 0.1.0-prealpha2 → 0.1.0-prealpha20

package/dist/helpers/activationHandler.js

@@ -1,23 +0,0 @@
-export function activationHandler(node, { disable, callback }) {
-    function handleEvent(event) {
-        if (disable) {
-            event.preventDefault();
-            event.stopPropagation();
-            return;
-        }
-        if (event instanceof KeyboardEvent) {
-            if (!["Enter", "Space"].includes(event.code))
-                return;
-        }
-        event.preventDefault();
-        callback(event);
-    }
-    node.addEventListener("click", handleEvent);
-    node.addEventListener("keydown", handleEvent);
-    return {
-        destroy() {
-            node.removeEventListener("click", handleEvent);
-            node.removeEventListener("keydown", handleEvent);
-        },
-    };
-}

package/dist/stores/QTheme.d.ts

@@ -1,42 +0,0 @@
-/// <reference types="svelte" />
-interface IMaterialDynamicColorsThemeColorFormatted {
-    primary: string;
-    "on-primary": string;
-    "primary-container": string;
-    "on-primary-container": string;
-    secondary: string;
-    "on-secondary": string;
-    "secondary-container": string;
-    "on-secondary-container": string;
-    tertiary: string;
-    "on-tertiary": string;
-    "tertiary-container": string;
-    "on-tertiary-container": string;
-    error: string;
-    "error-container": string;
-    "on-error": string;
-    "on-error-container": string;
-    background: string;
-    "on-background": string;
-    surface: string;
-    "on-surface": string;
-    "surface-variant": string;
-    "on-surface-variant": string;
-    outline: string;
-    "inverse-on-surface": string;
-    "inverse-surface": string;
-    "inverse-primary": string;
-    shadow: string;
-}
-interface IMaterialDynamicColorsThemeFormatted {
-    light: IMaterialDynamicColorsThemeColorFormatted;
-    dark: IMaterialDynamicColorsThemeColorFormatted;
-}
-type CSSDynamicColor = `${keyof IMaterialDynamicColorsThemeColorFormatted}-${keyof IMaterialDynamicColorsThemeFormatted}`;
-export declare const QTheme: {
-    subscribe: (this: void, run: import("svelte/store").Subscriber<Record<"error-dark" | "error-light" | "outline-dark" | "outline-light" | "primary-dark" | "primary-light" | "secondary-dark" | "secondary-light" | "tertiary-dark" | "tertiary-light" | "surface-dark" | "surface-light" | "surface-variant-dark" | "surface-variant-light" | "on-primary-dark" | "on-primary-light" | "primary-container-dark" | "primary-container-light" | "on-primary-container-dark" | "on-primary-container-light" | "on-secondary-dark" | "on-secondary-light" | "secondary-container-dark" | "secondary-container-light" | "on-secondary-container-dark" | "on-secondary-container-light" | "on-tertiary-dark" | "on-tertiary-light" | "tertiary-container-dark" | "tertiary-container-light" | "on-tertiary-container-dark" | "on-tertiary-container-light" | "error-container-dark" | "error-container-light" | "on-error-dark" | "on-error-light" | "on-error-container-dark" | "on-error-container-light" | "background-dark" | "background-light" | "on-background-dark" | "on-background-light" | "on-surface-dark" | "on-surface-light" | "on-surface-variant-dark" | "on-surface-variant-light" | "inverse-on-surface-dark" | "inverse-on-surface-light" | "inverse-surface-dark" | "inverse-surface-light" | "inverse-primary-dark" | "inverse-primary-light" | "shadow-dark" | "shadow-light", string>>, invalidate?: import("svelte/store").Invalidator<Record<"error-dark" | "error-light" | "outline-dark" | "outline-light" | "primary-dark" | "primary-light" | "secondary-dark" | "secondary-light" | "tertiary-dark" | "tertiary-light" | "surface-dark" | "surface-light" | "surface-variant-dark" | "surface-variant-light" | "on-primary-dark" | "on-primary-light" | "primary-container-dark" | "primary-container-light" | "on-primary-container-dark" | "on-primary-container-light" | "on-secondary-dark" | "on-secondary-light" | "secondary-container-dark" | "secondary-container-light" | "on-secondary-container-dark" | "on-secondary-container-light" | "on-tertiary-dark" | "on-tertiary-light" | "tertiary-container-dark" | "tertiary-container-light" | "on-tertiary-container-dark" | "on-tertiary-container-light" | "error-container-dark" | "error-container-light" | "on-error-dark" | "on-error-light" | "on-error-container-dark" | "on-error-container-light" | "background-dark" | "background-light" | "on-background-dark" | "on-background-light" | "on-surface-dark" | "on-surface-light" | "on-surface-variant-dark" | "on-surface-variant-light" | "inverse-on-surface-dark" | "inverse-on-surface-light" | "inverse-surface-dark" | "inverse-surface-light" | "inverse-primary-dark" | "inverse-primary-light" | "shadow-dark" | "shadow-light", string>> | undefined) => import("svelte/store").Unsubscriber;
-    setThemeColors: (from: string) => Promise<void>;
-    updateThemeColor: (color: CSSDynamicColor, newValue: string) => void;
-    apply: () => void;
-};
-export {};

package/dist/stores/QTheme.js

@@ -1,53 +0,0 @@
-import { writable } from "svelte/store";
-import materialDynamicColors from "material-dynamic-colors";
-import { convertCase } from "../utils/string";
-import QColors from "../utils/colors";
-async function prepareThemeColors(from) {
-    let theme = await materialDynamicColors(from);
-    //@ts-ignore
-    const themeColors = {};
-    let mode;
-    for (mode in theme) {
-        let color;
-        for (color in theme[mode]) {
-            let colorFormatted = convertCase(color, "camel", "kebab");
-            let cssColor = `${colorFormatted}-${mode}`;
-            themeColors[cssColor] = theme[mode][color];
-        }
-    }
-    return themeColors;
-}
-/* const defaultThemeColors = await prepareThemeColors("/cocktail.jpg"); */
-const defaultThemeColors = await prepareThemeColors("#3499E7");
-function themeBuilder() {
-    const { subscribe, set, update } = writable(defaultThemeColors);
-    const setThemeColors = async (from) => {
-        let newTheme = await prepareThemeColors(from);
-        set(newTheme);
-    };
-    const updateThemeColor = (color, newValue) => {
-        update(($themeColors) => {
-            $themeColors[color] = newValue;
-            return $themeColors;
-        });
-    };
-    const apply = () => {
-        let root = document.documentElement;
-        if (root === null)
-            return;
-        update(($themeColors) => {
-            let colorName;
-            for (colorName in $themeColors) {
-                root.style.setProperty(`--${colorName}`, QColors.hexToRgb($themeColors[colorName]).join(", "));
-            }
-            return $themeColors;
-        });
-    };
-    return {
-        subscribe,
-        setThemeColors,
-        updateThemeColor,
-        apply,
-    };
-}
-export const QTheme = themeBuilder();

package/dist/stores/Quaff.d.ts

@@ -1,32 +0,0 @@
-/// <reference types="svelte" />
-/// <reference types="@sveltejs/kit" />
-export declare const quaffStore: {
-    subscribe: (this: void, run: import("svelte/store").Subscriber<{
-        version: string;
-        dark: boolean;
-    }>, invalidate?: import("svelte/store").Invalidator<{
-        version: string;
-        dark: boolean;
-    }> | undefined) => import("svelte/store").Unsubscriber;
-    setDarkMode: (newVal: boolean) => void;
-    toggleDarkMode: () => void;
-};
-export declare const Quaff: import("svelte/store").Readable<{
-    version: string;
-    router: import("@sveltejs/kit").Page<Record<string, string>, string | null>;
-    dark: {
-        isActive: boolean;
-        toggle: () => void;
-        set: (newVal: boolean) => void;
-    };
-    subscribe: {
-        quaff: (this: void, run: import("svelte/store").Subscriber<{
-            version: string;
-            dark: boolean;
-        }>, invalidate?: import("svelte/store").Invalidator<{
-            version: string;
-            dark: boolean;
-        }> | undefined) => import("svelte/store").Unsubscriber;
-        page: (this: void, run: import("svelte/store").Subscriber<import("@sveltejs/kit").Page<Record<string, string>, string | null>>, invalidate?: import("svelte/store").Invalidator<import("@sveltejs/kit").Page<Record<string, string>, string | null>> | undefined) => import("svelte/store").Unsubscriber;
-    };
-}>;

package/dist/stores/Quaff.js

@@ -1,52 +0,0 @@
-import { writable, derived } from "svelte/store";
-import { page } from "$app/stores";
-function quaff() {
-    const { subscribe, set, update } = writable({
-        version: __QUAFF_VERSION__,
-        dark: false,
-        //TODO lang: {},
-        //TODO? iconSet: {},
-    });
-    const toggleDarkMode = () => {
-        return update((q) => {
-            q.dark = !q.dark;
-            let body = document.querySelector("body");
-            if (q.dark === true) {
-                body && body.classList.replace("light", "dark");
-            }
-            else {
-                body && body.classList.replace("dark", "light");
-            }
-            let mode = q.dark === true ? "dark" : "light";
-            document.cookie = `current_mode=${mode}; max-age=31536000; path="/"; SameSite=strict`;
-            return q;
-        });
-    };
-    const setDarkMode = (newVal) => {
-        return update((q) => {
-            q.dark = newVal;
-            return q;
-        });
-    };
-    return {
-        subscribe,
-        setDarkMode,
-        toggleDarkMode,
-    };
-}
-export const quaffStore = quaff();
-export const Quaff = derived([quaffStore, page], ([$quaff, $page]) => {
-    return {
-        version: $quaff.version,
-        router: $page,
-        dark: {
-            isActive: $quaff.dark,
-            toggle: quaffStore.toggleDarkMode,
-            set: quaffStore.setDarkMode,
-        },
-        subscribe: {
-            quaff: quaffStore.subscribe,
-            page: page.subscribe,
-        },
-    };
-});

package/dist/utils/fields.d.ts

@@ -1 +0,0 @@
-export declare function textWidth(element: HTMLElement, font: string): number;

package/dist/utils/fields.js

@@ -1,14 +0,0 @@
-export function textWidth(element, font) {
-    if (element.offsetWidth > 0)
-        return element.offsetWidth;
-    let _canvas = document.querySelector("canvas[data-quaff]")?.getContext("2d");
-    if (!_canvas) {
-        const canvasElement = document.createElement("canvas");
-        canvasElement.style.display = "none";
-        canvasElement.setAttribute("data-quaff", "");
-        document.body.append(canvasElement);
-        _canvas = canvasElement.getContext("2d");
-    }
-    _canvas.font = font;
-    return _canvas.measureText(element.textContent).width;
-}