@fluixi/core 1.0.0-alpha.100

package/dist/src/lib/theme/provider.mjs

@@ -0,0 +1,332 @@
+// src/lib/context/context.ts
+import { asProvider } from "@fluixi/dom";
+import {
+  createContext as createReactiveContext,
+  getOwner,
+  useContext as useReactiveContext
+} from "@fluixi/reactive/signal";
+function createContext(defaultValue, name) {
+  const context = createReactiveContext(defaultValue, name);
+  const Provider = (props) => (
+    // Children stay a getter: the reactive Provider reads them after stamping the value on
+    // its owner. Reading `props.children` here would render them, and any <Outlet/> in them,
+    // before the context exists.
+    context.Provider({
+      value: props.value,
+      get children() {
+        return props.children;
+      },
+      debug: props.debug
+    })
+  );
+  return {
+    id: context.id,
+    Provider: asProvider(Provider),
+    defaultValue
+  };
+}
+function useContext(context) {
+  const value = useReactiveContext(context);
+  return value !== void 0 ? value : context.defaultValue;
+}
+
+// src/lib/theme/color-scheme.ts
+import { getActiveHead as getActiveHead2, useHead as useHead2 } from "@fluixi/head";
+import { createEffect, createSignal as createSignal2, getOwner as getOwner3, onCleanup as onCleanup2 } from "@fluixi/reactive/signal";
+
+// src/lib/env/index.ts
+import { isServer } from "@fluixi/dom";
+import { isServer as onServer } from "@fluixi/dom";
+var env = {
+  get window() {
+    return typeof window !== "undefined" ? window : void 0;
+  },
+  get document() {
+    return typeof document !== "undefined" ? document : void 0;
+  }
+};
+
+// src/lib/storage/persisted.ts
+import { getOwner as getOwner2, onCleanup, signal, untrack } from "@fluixi/reactive/signal";
+var isAsync = (storage) => "encryption" in storage;
+function persisted(storage, key, options = {}) {
+  const fallback = options.fallback ?? null;
+  const name = options.name ?? `storage:${storage.keyPrefix}${key}`;
+  const state = signal(isAsync(storage) ? fallback : storage.get(key) ?? fallback, { name });
+  const put = (value) => state.set(() => value);
+  const resolve = (next) => typeof next === "function" ? next(untrack(state)) : next;
+  const writeOptions = (extra) => ({
+    ...options.ttl !== void 0 ? { ttl: options.ttl } : {},
+    ...options.encrypt ? { encrypt: true } : {},
+    ...extra
+  });
+  if (!isAsync(storage)) {
+    const off2 = storage.subscribe(key, (event) => {
+      if (event.type !== "set") return put(fallback);
+      if (event.value !== void 0) put(event.value);
+    });
+    if (getOwner2()) onCleanup(off2);
+    return Object.assign(() => state(), {
+      set(next, extra) {
+        const value = resolve(next);
+        storage.set(key, value, writeOptions(extra));
+        put(value);
+      },
+      remove() {
+        storage.remove(key);
+        put(fallback);
+      }
+    });
+  }
+  let written = false;
+  const reread = () => storage.get(key).then(
+    (value) => put(value ?? fallback),
+    () => void 0
+  );
+  const off = storage.subscribe(key, (event) => {
+    if (event.type !== "set") return put(fallback);
+    if (event.value !== void 0) put(event.value);
+    else void reread();
+  });
+  if (getOwner2()) onCleanup(off);
+  const ready = storage.get(key).then((value) => {
+    if (!written) put(value ?? fallback);
+  });
+  return Object.assign(() => state(), {
+    ready,
+    async set(next, extra) {
+      const previous = untrack(state);
+      const value = resolve(next);
+      written = true;
+      put(value);
+      try {
+        await storage.set(key, value, writeOptions(extra));
+      } catch (error) {
+        put(previous);
+        throw error;
+      }
+    },
+    async remove() {
+      written = true;
+      await storage.remove(key);
+      put(fallback);
+    }
+  });
+}
+
+// src/lib/theme/index.ts
+import { getActiveHead, useHead } from "@fluixi/head";
+import { createSignal } from "@fluixi/reactive/signal";
+import { StorageUnavailableError as StorageUnavailableError2 } from "@fluixi/storage";
+
+// src/lib/storage/index.ts
+import { appendResponseHeader, getRequestContext, getServerData } from "@fluixi/dom";
+import { createContext as createContext2, useContext as useContext2 } from "@fluixi/reactive/signal";
+import {
+  createAsyncStorage,
+  createSyncStorage,
+  memoryStorage,
+  StorageUnavailableError
+} from "@fluixi/storage";
+import { documentCookieAdapter, localStorageAdapter, sessionStorageAdapter } from "@fluixi/storage/browser";
+import { cookieStorage, requestStorage, toStorageRequest } from "@fluixi/storage/server";
+var StorageContext = createContext2(void 0, "storage");
+var AsyncStorageContext = createContext2(void 0, "asyncStorage");
+var isBrowser = () => typeof window !== "undefined" && typeof document !== "undefined";
+var perRequest = /* @__PURE__ */ new WeakMap();
+var perPage = /* @__PURE__ */ new Map();
+function cached(scope, id, make) {
+  let adapter = scope.get(id);
+  if (!adapter) scope.set(id, adapter = make());
+  return adapter;
+}
+function requestRequired(scope) {
+  throw new StorageUnavailableError(
+    `useStorage({ scope: '${scope}' }) on the server needs a request: call it during a render, a loader or a server function, or provide a storage with <StorageProvider>.`
+  );
+}
+function adapterFor(scope, cookie = {}) {
+  const ctx = getRequestContext();
+  const options = { httpOnly: false, ...cookie };
+  switch (scope) {
+    case "local":
+      return localStorageAdapter();
+    case "session":
+      return sessionStorageAdapter();
+    case "request":
+      if (isBrowser()) return cached(perPage, "request", memoryStorage);
+      if (!ctx) requestRequired(scope);
+      return cached(perRequest.get(ctx) ?? perRequest.set(ctx, /* @__PURE__ */ new Map()).get(ctx), "request", requestStorage);
+    case "cookie": {
+      const id = `cookie:${JSON.stringify(options)}`;
+      if (isBrowser()) {
+        const { httpOnly: _ignored, ...browser } = options;
+        return cached(perPage, id, () => documentCookieAdapter(browser));
+      }
+      if (!ctx) requestRequired(scope);
+      const raw = ctx.event.request;
+      const target = raw && typeof raw === "object" ? raw : void 0;
+      return cached(
+        perRequest.get(ctx) ?? perRequest.set(ctx, /* @__PURE__ */ new Map()).get(ctx),
+        id,
+        () => cookieStorage({
+          ...options,
+          request: raw && typeof raw === "object" && ("headers" in raw || "getHeader" in raw) ? toStorageRequest(raw) : void 0,
+          response: {
+            appendHeader(name, value) {
+              if (!appendResponseHeader(name, value, target)) {
+                throw new StorageUnavailableError("The response headers were already sent, so this cookie cannot reach the browser. Write it before the page head goes out: in middleware, a loader, a server function or the render before its first chunk.");
+              }
+            }
+          }
+        })
+      );
+    }
+  }
+}
+function useStorage(options = {}) {
+  const { scope = "auto", cookie, ...storageOptions } = options;
+  if (scope === "auto") {
+    const provided = useContext2(StorageContext);
+    if (provided) return options.namespace ? provided.namespace(options.namespace) : provided;
+  }
+  return createSyncStorage({ ...storageOptions, adapter: resolveAdapter(scope, cookie) });
+}
+function resolveAdapter(scope, cookie) {
+  if (scope !== "auto") return adapterFor(scope, cookie);
+  if (isBrowser()) return adapterFor("local");
+  if (!getRequestContext()) requestRequired(scope);
+  return adapterFor("request");
+}
+
+// src/lib/theme/index.ts
+var YEAR = 60 * 60 * 24 * 365;
+function defaultStorage() {
+  try {
+    return useStorage({ scope: "cookie", cookie: { maxAge: YEAR, sameSite: "lax" } });
+  } catch (error) {
+    if (error instanceof StorageUnavailableError2) return null;
+    throw error;
+  }
+}
+function storedLookup(storage, key) {
+  if (!storage) return null;
+  const full = storage.keyPrefix + key;
+  if (storage.scope === "cookie") {
+    return { from: "cookie", name: encodeURIComponent(full).replace(/[()]/g, (c) => `%${c.charCodeAt(0).toString(16).toUpperCase()}`) };
+  }
+  if (storage.scope === "local") return { from: "local", name: full };
+  return null;
+}
+
+// src/lib/theme/color-scheme.ts
+var CHOICES = ["system", "light", "dark"];
+var DARK = "(prefers-color-scheme: dark)";
+function createColorScheme(options = {}) {
+  const storageKey = options.storageKey ?? "color-scheme";
+  const attribute = options.attribute ?? "data-theme";
+  const systemAs = options.systemAs ?? "resolved";
+  const storage = options.storage === void 0 ? defaultStorage() : options.storage;
+  const saved = storage ? persisted(storage, storageKey) : null;
+  const [unsaved, setUnsaved] = createSignal2(null);
+  const value = () => {
+    const local = unsaved();
+    if (local) return local;
+    const stored = saved?.();
+    return CHOICES.includes(stored) ? stored : "system";
+  };
+  const media = env.window?.matchMedia?.(DARK);
+  const [osDark, setOsDark] = createSignal2(media?.matches ?? false);
+  if (media) {
+    const onChange = () => setOsDark(media.matches);
+    media.addEventListener?.("change", onChange);
+    if (getOwner3()) onCleanup2(() => media.removeEventListener?.("change", onChange));
+  }
+  const resolved = () => {
+    const choice = value();
+    return choice === "system" ? osDark() ? "dark" : "light" : choice;
+  };
+  const shown = () => systemAs === "system" && value() === "system" ? "system" : resolved();
+  const apply = () => {
+    env.document?.documentElement.setAttribute(attribute, shown());
+  };
+  const set = (choice) => {
+    if (!CHOICES.includes(choice)) return;
+    if (!saved) setUnsaved(choice);
+    else {
+      try {
+        saved.set(choice);
+        setUnsaved(null);
+      } catch {
+        setUnsaved(choice);
+      }
+    }
+    apply();
+    options.onChange?.(choice);
+  };
+  const scriptBody = () => {
+    const cfg = JSON.stringify({ s: storedLookup(storage, storageKey), a: attribute, sys: systemAs === "system", tc: options.themeColor ?? null, cs: options.colorSchemeMeta !== false }).replace(/</g, "\\u003c");
+    return `(function(){try{var c=${cfg},t=null,s=c.s,r=null;if(s&&s.from==='local')r=localStorage.getItem(s.name);if(s&&s.from==='cookie')document.cookie.split('; ').forEach(function(p){var i=p.indexOf('=');if(p.slice(0,i)===s.name)r=decodeURIComponent(p.slice(i+1));});if(r){var e=JSON.parse(r);t=e&&e.v===1?e.value:e;}var chosen=t==='light'||t==='dark'?t:null;if(!chosen)t=c.sys?'system':(matchMedia('${DARK}').matches?'dark':'light');document.documentElement.setAttribute(c.a,t);if(chosen&&c.tc)document.querySelectorAll('meta[name="theme-color"]').forEach(function(m){m.setAttribute('content',c.tc[chosen]);m.removeAttribute('media');});if(chosen&&c.cs){var m=document.querySelector('meta[name="color-scheme"]');if(m)m.setAttribute('content',chosen);}}catch(e){}})();`;
+  };
+  if (getActiveHead2()) {
+    const colors = options.themeColor;
+    useHead2({
+      htmlAttrs: { [attribute]: shown },
+      ...colors ? {
+        themeColor: () => value() === "system" ? [
+          { color: colors.light, media: "(prefers-color-scheme: light)" },
+          { color: colors.dark, media: DARK }
+        ] : colors[resolved()]
+      } : {},
+      ...options.colorSchemeMeta === false ? {} : { colorScheme: () => value() === "system" ? "light dark" : resolved() },
+      ...options.script === false ? {} : { script: [{ children: scriptBody() }] }
+    });
+  }
+  if (env.document && getOwner3()) createEffect(apply);
+  return {
+    value,
+    resolved,
+    set,
+    toggle: () => set(resolved() === "dark" ? "light" : "dark"),
+    init: apply,
+    headScript: () => `<script>${scriptBody()}<\/script>`
+  };
+}
+
+// src/lib/theme/provider.ts
+var ThemesContext = createContext(void 0, "themes");
+function ThemeProvider(props) {
+  const outer = useContext(ThemesContext);
+  return ThemesContext.Provider({
+    // A nested provider adds to the axes above it rather than hiding them.
+    value: outer ? { ...outer, ...props.themes } : props.themes,
+    get children() {
+      return props.children;
+    }
+  });
+}
+function useTheme(name) {
+  const themes = useContext(ThemesContext);
+  if (!themes || !(name in themes)) {
+    throw new Error(`[fluixi] No theme named "${name}" above this component: provide it with <ThemeProvider> or <ColorSchemeProvider>.`);
+  }
+  return themes[name];
+}
+function ColorSchemeProvider(props) {
+  const scheme = createColorScheme(props);
+  return ThemeProvider({
+    themes: { scheme },
+    get children() {
+      return props.children;
+    }
+  });
+}
+function useColorScheme() {
+  return useTheme("scheme");
+}
+export {
+  ColorSchemeProvider,
+  ThemeProvider,
+  useColorScheme,
+  useTheme
+};

package/dist/src/lib/utils/index.cjs

@@ -0,0 +1,209 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/lib/utils/index.ts
+var index_exports = {};
+__export(index_exports, {
+  camelCase: () => camelCase,
+  capitalize: () => capitalize,
+  clamp: () => clamp,
+  debounce: () => debounce,
+  deepClone: () => deepClone,
+  deepMerge: () => deepMerge,
+  formatBytes: () => formatBytes,
+  formatNumber: () => formatNumber,
+  groupBy: () => groupBy,
+  isDefined: () => isDefined,
+  isEmpty: () => isEmpty,
+  kebabCase: () => kebabCase,
+  memoize: () => memoize,
+  omit: () => omit,
+  pick: () => pick,
+  pipe: () => pipe,
+  random: () => random,
+  range: () => range,
+  retry: () => retry,
+  sleep: () => sleep,
+  throttle: () => throttle,
+  uniqueId: () => uniqueId
+});
+module.exports = __toCommonJS(index_exports);
+function debounce(fn, delay) {
+  let timeoutId;
+  return (...args) => {
+    clearTimeout(timeoutId);
+    timeoutId = setTimeout(() => fn(...args), delay);
+  };
+}
+function throttle(fn, limit) {
+  let inThrottle;
+  return (...args) => {
+    if (!inThrottle) {
+      fn(...args);
+      inThrottle = true;
+      setTimeout(() => inThrottle = false, limit);
+    }
+  };
+}
+function memoize(fn) {
+  const cache = /* @__PURE__ */ new Map();
+  return ((...args) => {
+    const key = JSON.stringify(args);
+    if (cache.has(key)) {
+      return cache.get(key);
+    }
+    const result = fn(...args);
+    cache.set(key, result);
+    return result;
+  });
+}
+function deepClone(obj) {
+  if (obj === null || typeof obj !== "object") {
+    return obj;
+  }
+  if (obj instanceof Date) {
+    return new Date(obj.getTime());
+  }
+  if (obj instanceof Array) {
+    return Array.from(obj).map((item) => deepClone(item));
+  }
+  if (obj instanceof Set) {
+    return new Set(Array.from(obj).map((item) => deepClone(item)));
+  }
+  if (obj instanceof Map) {
+    return new Map(
+      Array.from(obj.entries()).map(([key, value]) => [
+        deepClone(key),
+        deepClone(value)
+      ])
+    );
+  }
+  const clonedObj = {};
+  for (const key in obj) {
+    if (obj.hasOwnProperty(key)) {
+      clonedObj[key] = deepClone(obj[key]);
+    }
+  }
+  return clonedObj;
+}
+function deepMerge(...objects) {
+  const result = {};
+  for (const obj of objects) {
+    for (const key in obj) {
+      if (obj.hasOwnProperty(key)) {
+        const value = obj[key];
+        if (value !== null && typeof value === "object" && !Array.isArray(value)) {
+          result[key] = deepMerge(
+            result[key] || {},
+            value
+          );
+        } else {
+          result[key] = value;
+        }
+      }
+    }
+  }
+  return result;
+}
+function uniqueId(prefix = "") {
+  return prefix + Math.random().toString(36).substr(2, 9);
+}
+function formatNumber(num) {
+  return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+}
+function formatBytes(bytes, decimals = 2) {
+  if (bytes === 0) return "0 Bytes";
+  const k = 1024;
+  const dm = decimals < 0 ? 0 : decimals;
+  const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
+}
+function capitalize(str) {
+  return str.charAt(0).toUpperCase() + str.slice(1);
+}
+function kebabCase(str) {
+  return str.replace(/([a-z])([A-Z])/g, "$1-$2").replace(/[\s_]+/g, "-").toLowerCase();
+}
+function camelCase(str) {
+  return str.replace(/[-_\s](.)/g, (_, char) => char.toUpperCase());
+}
+function clamp(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+function random(min, max) {
+  return Math.floor(Math.random() * (max - min + 1)) + min;
+}
+function isEmpty(value) {
+  if (value === null || value === void 0) return true;
+  if (typeof value === "string") return value.trim().length === 0;
+  if (Array.isArray(value)) return value.length === 0;
+  if (typeof value === "object") return Object.keys(value).length === 0;
+  return false;
+}
+function pick(obj, ...keys) {
+  const result = {};
+  keys.forEach((key) => {
+    if (key in obj) {
+      result[key] = obj[key];
+    }
+  });
+  return result;
+}
+function omit(obj, ...keys) {
+  const result = { ...obj };
+  keys.forEach((key) => {
+    delete result[key];
+  });
+  return result;
+}
+function groupBy(array, fn) {
+  return array.reduce((acc, item) => {
+    const key = fn(item);
+    const group = acc.get(key) || [];
+    group.push(item);
+    acc.set(key, group);
+    return acc;
+  }, /* @__PURE__ */ new Map());
+}
+function range(start, end, step = 1) {
+  const result = [];
+  for (let i = start; i <= end; i += step) {
+    result.push(i);
+  }
+  return result;
+}
+async function retry(fn, retries = 3, delay = 1e3) {
+  try {
+    return await fn();
+  } catch (error) {
+    if (retries <= 0) throw error;
+    await new Promise((resolve) => setTimeout(resolve, delay));
+    return retry(fn, retries - 1, delay);
+  }
+}
+function sleep(ms) {
+  return new Promise((resolve) => setTimeout(resolve, ms));
+}
+function isDefined(value) {
+  return value !== null && value !== void 0;
+}
+function pipe(...fns) {
+  return (arg) => fns.reduce((acc, fn) => fn(acc), arg);
+}