@class-kit/vue 0.1.0

package/dist/components/color-picker.js

@@ -0,0 +1,362 @@
+import { defineComponent, ref, watch, h, onMounted, onBeforeUnmount, Teleport, inject, shallowRef } from 'vue';
+import { ColorPickerController, getClassComponentsLocale, configureClassComponents } from '@class-kit/core';
+
+const formSymbol = /*#__PURE__*/ Symbol("ClassComponentsForm");
+const formInteractivitySymbol = /*#__PURE__*/ Symbol("ClassComponentsFormInteractivity");
+function resolveClassKitThemeName(theme) {
+    if (typeof theme === "string")
+        return theme;
+    return theme?.name ?? "minimal";
+}
+defineComponent({
+    name: "ClassConfigProvider",
+    props: {
+        class: {
+            type: String,
+            default: "",
+        },
+        locale: {
+            type: Object,
+            default: undefined,
+        },
+        style: {
+            type: [String, Object, Array],
+            default: undefined,
+        },
+        theme: {
+            type: [String, Object],
+            default: "minimal",
+        },
+    },
+    setup(props, { slots }) {
+        const version = ref(0);
+        const applyConfig = () => {
+            configureClassComponents({
+                locale: props.locale,
+                theme: props.theme,
+            });
+            version.value += 1;
+        };
+        watch(() => [props.locale, props.theme], applyConfig, {
+            deep: true,
+            immediate: true,
+        });
+        return () => h("div", {
+            class: ["cc-config-provider", props.class].filter(Boolean),
+            "data-cc-theme": resolveClassKitThemeName(props.theme),
+            style: props.style,
+        }, [
+            h("div", { key: version.value, class: "cc-config-provider__content" }, slots.default?.()),
+        ]);
+    },
+});
+function optionalBooleanProp() {
+    return { type: Boolean, default: undefined };
+}
+function useFormInteractivity() {
+    return inject(formInteractivitySymbol, {
+        disabled: ref(false),
+        readOnly: ref(false),
+    });
+}
+function resolveFieldInteractivity(form, disabled, readOnly) {
+    const resolvedDisabled = disabled ?? form.disabled.value;
+    return {
+        disabled: resolvedDisabled,
+        readOnly: !resolvedDisabled && (readOnly ?? form.readOnly.value),
+    };
+}
+function createEmptyFormState() {
+    return {
+        dirty: false,
+        errors: {},
+        fields: {},
+        submitCount: 0,
+        submitted: false,
+        submitting: false,
+        touched: false,
+        valid: true,
+        validating: false,
+        values: {},
+    };
+}
+function useOptionalField(name, options = {}) {
+    const form = inject(formSymbol, null);
+    const state = shallowRef(form?.getState() ?? createEmptyFormState());
+    const value = ref((name ? form?.getValue(name) : undefined) ?? options.initialValue ?? "");
+    let unsubscribeForm;
+    let unsubscribeField;
+    onMounted(() => {
+        if (!form || !name)
+            return;
+        unsubscribeForm = form.subscribe((nextState) => {
+            state.value = nextState;
+        });
+        unsubscribeField = form.registerField(name, options);
+        value.value = (form.getValue(name) ?? "");
+    });
+    onBeforeUnmount(() => {
+        unsubscribeField?.();
+        unsubscribeForm?.();
+    });
+    watch(() => (name ? state.value.fields[name]?.value : undefined), (nextValue) => {
+        if (!form || !name)
+            return;
+        value.value = (nextValue ?? "");
+    });
+    return {
+        value,
+        state,
+        setValue: async (nextValue) => {
+            if (form && name)
+                await form.setValue(name, nextValue);
+            else
+                value.value = nextValue;
+        },
+        blur: async () => {
+            if (form && name)
+                await form.blur(name);
+        },
+    };
+}
+const ClassColorPicker = /*#__PURE__*/ defineComponent({
+    name: "ClassColorPicker",
+    inheritAttrs: false,
+    props: {
+        name: String,
+        label: String,
+        disabled: optionalBooleanProp(),
+        readOnly: optionalBooleanProp(),
+        readonly: optionalBooleanProp(),
+        showInputSteppers: { type: Boolean, default: false },
+        fieldClass: { type: String, default: "cc-field cc-color-picker" },
+        rules: Array,
+    },
+    emits: ["change"],
+    setup(props, { attrs, emit }) {
+        const formInteractivity = useFormInteractivity();
+        const field = useOptionalField(props.name, {
+            rules: props.rules,
+        });
+        const rootRef = ref(null);
+        const panelRef = ref(null);
+        const triggerRef = ref(null);
+        const spectrumRef = ref(null);
+        const hueRef = ref(null);
+        const open = ref(false);
+        const panelStyle = ref({});
+        const updatePanelPosition = () => {
+            const trigger = triggerRef.value;
+            if (!trigger)
+                return;
+            const rect = trigger.getBoundingClientRect();
+            const gap = 8;
+            const width = Math.min(240, Math.max(220, rect.width));
+            const estimatedHeight = 292;
+            const openUp = window.innerHeight - rect.bottom < estimatedHeight + gap &&
+                rect.top > estimatedHeight + gap;
+            panelStyle.value = {
+                ...(openUp
+                    ? { bottom: `${window.innerHeight - rect.top + gap}px` }
+                    : {}),
+                left: `${Math.min(Math.max(8, rect.left), Math.max(8, window.innerWidth - width - 8))}px`,
+                ...(!openUp ? { top: `${rect.bottom + gap}px` } : {}),
+                transformOrigin: openUp ? "bottom left" : "top left",
+                width: `${width}px`,
+            };
+        };
+        const closeOnOutside = (event) => {
+            const target = event.target;
+            if (!rootRef.value?.contains(target) && !panelRef.value?.contains(target))
+                open.value = false;
+        };
+        watch(open, (value) => {
+            if (value)
+                requestAnimationFrame(updatePanelPosition);
+        });
+        onMounted(() => {
+            document.addEventListener("mousedown", closeOnOutside);
+            window.addEventListener("resize", updatePanelPosition);
+            window.addEventListener("scroll", updatePanelPosition, true);
+        });
+        onBeforeUnmount(() => {
+            document.removeEventListener("mousedown", closeOnOutside);
+            window.removeEventListener("resize", updatePanelPosition);
+            window.removeEventListener("scroll", updatePanelPosition, true);
+        });
+        return () => {
+            const interactivity = resolveFieldInteractivity(formInteractivity, props.disabled, props.readOnly ?? props.readonly);
+            const controller = new ColorPickerController(String(field.value.value || "#7c3aed"));
+            const state = controller.getState();
+            const commit = (value) => {
+                if (interactivity.disabled || interactivity.readOnly)
+                    return;
+                const next = controller.update(value).value;
+                void field.setValue(next);
+                emit("change", next);
+            };
+            const commitState = (next) => {
+                void field.setValue(next.value);
+                emit("change", next.value);
+            };
+            const updateSpectrum = (event) => {
+                if (interactivity.disabled ||
+                    interactivity.readOnly ||
+                    !spectrumRef.value)
+                    return;
+                const rect = spectrumRef.value.getBoundingClientRect();
+                const saturation = Math.min(1, Math.max(0, (event.clientX - rect.left) / rect.width));
+                const brightness = 1 -
+                    Math.min(1, Math.max(0, (event.clientY - rect.top) / rect.height));
+                commitState(controller.setSaturationBrightness(saturation, brightness));
+            };
+            const updateHue = (event) => {
+                if (interactivity.disabled || interactivity.readOnly || !hueRef.value)
+                    return;
+                const rect = hueRef.value.getBoundingClientRect();
+                const hue = Math.min(359, Math.max(0, ((event.clientX - rect.left) / rect.width) * 360));
+                commitState(controller.setHue(hue));
+            };
+            return h("div", {
+                ...attrs,
+                class: props.fieldClass,
+                "data-disabled": interactivity.disabled,
+                "data-open": open.value,
+                "data-readonly": interactivity.readOnly,
+                ref: rootRef,
+            }, [
+                props.label
+                    ? h("span", { class: "cc-field__label" }, props.label)
+                    : null,
+                h("div", { class: "cc-color-picker__body" }, [
+                    h("button", {
+                        "aria-expanded": open.value,
+                        class: "cc-field__control cc-color-picker__trigger",
+                        disabled: interactivity.disabled,
+                        ref: triggerRef,
+                        style: {
+                            "--cc-color-picker-contrast": state.contrastColor,
+                            "--cc-color-picker-current": state.value,
+                        },
+                        type: "button",
+                        onClick: () => {
+                            if (interactivity.readOnly)
+                                return;
+                            open.value = !open.value;
+                            requestAnimationFrame(updatePanelPosition);
+                        },
+                    }, h("span", { class: "cc-color-picker__value" }, state.value)),
+                    open.value
+                        ? h(Teleport, { to: "body" }, h("div", {
+                            class: "cc-color-picker__panel",
+                            ref: panelRef,
+                            style: panelStyle.value,
+                        }, [
+                            h("div", {
+                                "aria-label": `${props.name} color panel`,
+                                class: "cc-color-picker__spectrum",
+                                ref: spectrumRef,
+                                role: "slider",
+                                style: {
+                                    "--cc-color-picker-hue": state.hue,
+                                    "--cc-color-picker-saturation": `${state.saturation * 100}%`,
+                                    "--cc-color-picker-brightness": `${(1 - state.brightness) * 100}%`,
+                                },
+                                tabindex: interactivity.disabled ? -1 : 0,
+                                onPointerdown: (event) => {
+                                    updateSpectrum(event);
+                                    event.currentTarget.setPointerCapture(event.pointerId);
+                                },
+                                onPointermove: (event) => {
+                                    if (event.buttons > 0)
+                                        updateSpectrum(event);
+                                },
+                            }, h("span", { class: "cc-color-picker__thumb" })),
+                            h("div", {
+                                "aria-label": `${props.name} hue`,
+                                class: "cc-color-picker__hue",
+                                ref: hueRef,
+                                role: "slider",
+                                tabindex: interactivity.disabled ? -1 : 0,
+                                onPointerdown: (event) => {
+                                    updateHue(event);
+                                    event.currentTarget.setPointerCapture(event.pointerId);
+                                },
+                                onPointermove: (event) => {
+                                    if (event.buttons > 0)
+                                        updateHue(event);
+                                },
+                            }, h("span", { style: { left: `${state.hue / 3.6}%` } })),
+                            h("label", { class: "cc-color-picker__alpha" }, [
+                                h("span", null, getClassComponentsLocale().colorPickerAlphaLabel),
+                                h("input", {
+                                    disabled: interactivity.disabled || interactivity.readOnly,
+                                    max: 1,
+                                    min: 0,
+                                    step: 0.1,
+                                    type: "range",
+                                    value: Number(state.alpha.toFixed(1)),
+                                    onInput: (event) => {
+                                        const next = controller.setAlpha(Number(event.target.value)).value;
+                                        void field.setValue(next);
+                                        emit("change", next);
+                                    },
+                                }),
+                                h("output", null, state.alpha.toFixed(1)),
+                            ]),
+                            h("div", {
+                                class: "cc-color-picker__channels",
+                                "data-show-steppers": props.showInputSteppers,
+                            }, [
+                                ...["red", "green", "blue"].map((channel) => h("label", { key: channel }, [
+                                    h("span", null, channel.slice(0, 1).toUpperCase()),
+                                    h("input", {
+                                        class: "cc-field__control cc-number-input__control cc-color-picker__channel-input",
+                                        "data-readonly": interactivity.readOnly,
+                                        disabled: interactivity.disabled ||
+                                            interactivity.readOnly,
+                                        inputmode: "numeric",
+                                        max: 255,
+                                        min: 0,
+                                        readonly: interactivity.readOnly,
+                                        type: "number",
+                                        value: state[channel],
+                                        onInput: (event) => {
+                                            const value = Math.max(0, Math.min(255, Number(event.target
+                                                .value || 0)));
+                                            commit(`rgba(${channel === "red" ? value : state.red}, ${channel === "green" ? value : state.green}, ${channel === "blue" ? value : state.blue}, ${state.alpha})`);
+                                        },
+                                    }),
+                                ])),
+                                h("label", null, [
+                                    h("span", null, "A"),
+                                    h("input", {
+                                        class: "cc-field__control cc-number-input__control cc-color-picker__channel-input",
+                                        "data-readonly": interactivity.readOnly,
+                                        disabled: interactivity.disabled ||
+                                            interactivity.readOnly,
+                                        inputmode: "decimal",
+                                        max: 1,
+                                        min: 0,
+                                        readonly: interactivity.readOnly,
+                                        step: 0.1,
+                                        type: "number",
+                                        value: state.alpha.toFixed(1),
+                                        onInput: (event) => {
+                                            const value = Math.max(0, Math.min(1, Number(event.target
+                                                .value || 0)));
+                                            commit(`rgba(${state.red}, ${state.green}, ${state.blue}, ${value.toFixed(1)})`);
+                                        },
+                                    }),
+                                ]),
+                            ]),
+                        ]))
+                        : null,
+                ]),
+            ]);
+        };
+    },
+});
+
+export { ClassColorPicker };
+//# sourceMappingURL=color-picker.js.map

package/dist/components/color-picker.js.map

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

package/dist/components/comic-reader.cjs

@@ -0,0 +1,166 @@
+'use strict';
+
+var vue = require('vue');
+var core = require('@class-kit/core');
+
+function resolveClassKitThemeName(theme) {
+    if (typeof theme === "string")
+        return theme;
+    return theme?.name ?? "minimal";
+}
+vue.defineComponent({
+    name: "ClassConfigProvider",
+    props: {
+        class: {
+            type: String,
+            default: "",
+        },
+        locale: {
+            type: Object,
+            default: undefined,
+        },
+        style: {
+            type: [String, Object, Array],
+            default: undefined,
+        },
+        theme: {
+            type: [String, Object],
+            default: "minimal",
+        },
+    },
+    setup(props, { slots }) {
+        const version = vue.ref(0);
+        const applyConfig = () => {
+            core.configureClassComponents({
+                locale: props.locale,
+                theme: props.theme,
+            });
+            version.value += 1;
+        };
+        vue.watch(() => [props.locale, props.theme], applyConfig, {
+            deep: true,
+            immediate: true,
+        });
+        return () => vue.h("div", {
+            class: ["cc-config-provider", props.class].filter(Boolean),
+            "data-cc-theme": resolveClassKitThemeName(props.theme),
+            style: props.style,
+        }, [
+            vue.h("div", { key: version.value, class: "cc-config-provider__content" }, slots.default?.()),
+        ]);
+    },
+});
+function readerIcon(name) {
+    const path = name === "chevronLeft" ? "m15 18-6-6 6-6" : "m9 18 6-6-6-6";
+    return vue.h("svg", {
+        "aria-hidden": "true",
+        class: "cc-reader-icon",
+        fill: "none",
+        focusable: "false",
+        stroke: "currentColor",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round",
+        "stroke-width": "2.4",
+        viewBox: "0 0 24 24",
+    }, [vue.h("path", { d: path })]);
+}
+const ClassComicReader = /*#__PURE__*/ vue.defineComponent({
+    name: "ClassComicReader",
+    props: {
+        pages: { type: Array, required: true },
+        current: Number,
+        defaultCurrent: { type: Number, default: 0 },
+        hasMore: { type: Boolean, default: false },
+        loading: { type: Boolean, default: false },
+        className: { type: String, default: "cc-comic-reader" },
+    },
+    emits: ["loadMore", "pageChange", "update:current"],
+    setup(props, { emit, attrs }) {
+        const innerCurrent = vue.ref(props.defaultCurrent);
+        const sentinel = vue.ref(null);
+        const pageRefs = vue.shallowRef([]);
+        let observer = null;
+        const activeCurrent = () => props.current ?? innerCurrent.value;
+        const commit = (index) => {
+            const next = new core.ComicReaderController({
+                current: activeCurrent(),
+                hasMore: props.hasMore,
+                loading: props.loading,
+                pages: props.pages,
+            }).goTo(index);
+            if (props.current === undefined)
+                innerCurrent.value = next.current;
+            emit("update:current", next.current);
+            emit("pageChange", next.current, next.page);
+            pageRefs.value[next.current]?.scrollIntoView({
+                behavior: "smooth",
+                block: "start",
+            });
+        };
+        vue.onMounted(() => {
+            if (!sentinel.value)
+                return;
+            observer = new IntersectionObserver((entries) => {
+                if (entries.some((entry) => entry.isIntersecting) &&
+                    props.hasMore &&
+                    !props.loading)
+                    emit("loadMore");
+            }, { rootMargin: "240px" });
+            observer.observe(sentinel.value);
+        });
+        vue.onBeforeUnmount(() => observer?.disconnect());
+        return () => {
+            const state = new core.ComicReaderController({
+                current: activeCurrent(),
+                hasMore: props.hasMore,
+                loading: props.loading,
+                pages: props.pages,
+            }).getState();
+            pageRefs.value = [];
+            return vue.h("div", { ...attrs, class: props.className }, [
+                vue.h("div", { class: "cc-comic-reader__toolbar" }, [
+                    vue.h("button", {
+                        "aria-label": core.getClassComponentsLocale().comicReaderPreviousLabel,
+                        title: core.getClassComponentsLocale().comicReaderPreviousLabel,
+                        type: "button",
+                        disabled: !state.canPrevious,
+                        onClick: () => commit(state.current - 1),
+                    }, [readerIcon("chevronLeft")]),
+                    vue.h("span", null, state.total ? `${state.current + 1} / ${state.total}` : "0 / 0"),
+                    vue.h("button", {
+                        "aria-label": core.getClassComponentsLocale().comicReaderNextLabel,
+                        title: core.getClassComponentsLocale().comicReaderNextLabel,
+                        type: "button",
+                        disabled: !state.canNext,
+                        onClick: () => commit(state.current + 1),
+                    }, [readerIcon("chevronRight")]),
+                ]),
+                vue.h("div", { class: "cc-comic-reader__pages" }, [
+                    ...state.pages.map((page, index) => vue.h("div", {
+                        key: page.id,
+                        class: "cc-comic-reader__page",
+                        "data-active": index === state.current,
+                        ref: (node) => {
+                            if (node)
+                                pageRefs.value[index] = node;
+                        },
+                    }, [
+                        vue.h("img", {
+                            alt: page.alt ?? "",
+                            loading: "lazy",
+                            src: page.src,
+                        }),
+                    ])),
+                    vue.h("div", { ref: sentinel, class: "cc-comic-reader__load" }, props.loading
+                        ? core.getClassComponentsLocale().comicReaderLoadingText
+                        : props.hasMore
+                            ? core.getClassComponentsLocale().comicReaderLoadMoreText
+                            : core.getClassComponentsLocale().comicReaderNoMoreText),
+                ]),
+            ]);
+        };
+    },
+});
+
+exports.ClassComicReader = ClassComicReader;
+//# sourceMappingURL=comic-reader.cjs.map

package/dist/components/comic-reader.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"comic-reader.cjs","sources":["../../src/index.ts"],"names":["defineComponent","ref","configureClassComponents","watch","h","shallowRef","ComicReaderController","onMounted","onBeforeUnmount","getClassComponentsLocale"],"mappings":"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"}

package/dist/components/comic-reader.d.ts

@@ -0,0 +1,2 @@
+export { ClassComicReader } from "../index";
+//# sourceMappingURL=comic-reader.d.ts.map

package/dist/components/comic-reader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"comic-reader.d.ts","sourceRoot":"","sources":["../../src/components/comic-reader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC"}