@niibase/uniwind 1.0.0

package/dist/module/hooks/useUniwind.js

@@ -0,0 +1,21 @@
+import { useEffect, useState } from "react";
+import { Uniwind } from "../core/index.js";
+import { UniwindListener } from "../core/listener.js";
+import { StyleDependency } from "../types.js";
+export const useUniwind = () => {
+  const [theme, setTheme] = useState(Uniwind.currentTheme);
+  const [hasAdaptiveThemes, setHasAdaptiveThemes] = useState(Uniwind.hasAdaptiveThemes);
+  useEffect(() => {
+    const dispose = UniwindListener.subscribe(() => {
+      setTheme(Uniwind.currentTheme);
+      setHasAdaptiveThemes(Uniwind.hasAdaptiveThemes);
+    }, [StyleDependency.Theme, StyleDependency.AdaptiveThemes]);
+    return () => {
+      dispose();
+    };
+  }, []);
+  return {
+    theme,
+    hasAdaptiveThemes
+  };
+};

package/dist/module/hooks/useUniwindAccent.d.ts

@@ -0,0 +1 @@
+export declare const useUniwindAccent: (className: string | undefined) => string | undefined;

package/dist/module/hooks/useUniwindAccent.js

@@ -0,0 +1,6 @@
+import { formatColor } from "../core/web/formatColor.js";
+import { useResolveClassNames } from "./useResolveClassNames.js";
+export const useUniwindAccent = (className) => {
+  const styles = useResolveClassNames(className ?? "");
+  return styles.accentColor !== void 0 ? formatColor(styles.accentColor) : void 0;
+};

package/dist/module/hooks/useUniwindAccent.native.d.ts

@@ -0,0 +1,2 @@
+import { ComponentState } from '../core/types';
+export declare const useUniwindAccent: (className: string | undefined, state?: ComponentState) => string | undefined;

package/dist/module/hooks/useUniwindAccent.native.js

@@ -0,0 +1,5 @@
+import { useResolveClassNames } from "./useResolveClassNames.native.js";
+export const useUniwindAccent = (className, state) => {
+  const styles = useResolveClassNames(className ?? "", state);
+  return styles.accentColor;
+};

package/dist/module/index.d.ts

@@ -0,0 +1,5 @@
+export { Uniwind } from './core';
+export { withUniwind } from './hoc';
+export type { ApplyUniwind, ApplyUniwindOptions } from './hoc/types';
+export { useCSSVariable, useResolveClassNames, useUniwind } from './hooks';
+export type { UniwindConfig } from './types';

package/dist/module/index.js

@@ -0,0 +1,3 @@
+export { Uniwind } from "./core/index.js";
+export { withUniwind } from "./hoc/index.js";
+export { useCSSVariable, useResolveClassNames, useUniwind } from "./hooks/index.js";

package/dist/module/types.d.ts

@@ -0,0 +1,21 @@
+export declare enum StyleDependency {
+    ColorScheme = 1,
+    Theme = 2,
+    Dimensions = 3,
+    Orientation = 4,
+    Insets = 5,
+    FontScale = 6,
+    Rtl = 7,
+    AdaptiveThemes = 8,
+    Variables = 9
+}
+export declare const enum Orientation {
+    Portrait = "portrait",
+    Landscape = "landscape"
+}
+export declare const enum ColorScheme {
+    Light = "light",
+    Dark = "dark"
+}
+export interface UniwindConfig {
+}

package/dist/module/types.js

@@ -0,0 +1,22 @@
+export var StyleDependency = /* @__PURE__ */ ((StyleDependency2) => {
+  StyleDependency2[StyleDependency2["ColorScheme"] = 1] = "ColorScheme";
+  StyleDependency2[StyleDependency2["Theme"] = 2] = "Theme";
+  StyleDependency2[StyleDependency2["Dimensions"] = 3] = "Dimensions";
+  StyleDependency2[StyleDependency2["Orientation"] = 4] = "Orientation";
+  StyleDependency2[StyleDependency2["Insets"] = 5] = "Insets";
+  StyleDependency2[StyleDependency2["FontScale"] = 6] = "FontScale";
+  StyleDependency2[StyleDependency2["Rtl"] = 7] = "Rtl";
+  StyleDependency2[StyleDependency2["AdaptiveThemes"] = 8] = "AdaptiveThemes";
+  StyleDependency2[StyleDependency2["Variables"] = 9] = "Variables";
+  return StyleDependency2;
+})(StyleDependency || {});
+export var Orientation = /* @__PURE__ */ ((Orientation2) => {
+  Orientation2["Portrait"] = "portrait";
+  Orientation2["Landscape"] = "landscape";
+  return Orientation2;
+})(Orientation || {});
+export var ColorScheme = /* @__PURE__ */ ((ColorScheme2) => {
+  ColorScheme2["Light"] = "light";
+  ColorScheme2["Dark"] = "dark";
+  return ColorScheme2;
+})(ColorScheme || {});

package/dist/module/utils/buildDtsFile.d.ts

@@ -0,0 +1 @@
+export declare const buildDtsFile: (dtsPath: string, stringifiedThemes: string) => void;

package/dist/module/utils/buildDtsFile.js

@@ -0,0 +1,22 @@
+import fs from "fs";
+import { name } from "../../package.json";
+export const buildDtsFile = (dtsPath, stringifiedThemes) => {
+  const oldDtsContent = fs.existsSync(dtsPath) ? fs.readFileSync(dtsPath, "utf-8") : "";
+  const dtsContent = [
+    `// NOTE: This file is generated by ${name} and it should not be edited manually.`,
+    `/// <reference types="${name}/types" />`,
+    "",
+    `declare module '${name}' {`,
+    `    export interface UniwindConfig {`,
+    `        themes: readonly ${stringifiedThemes}`,
+    `    }`,
+    `}`,
+    "",
+    `export {}`,
+    ""
+  ].join("\n");
+  if (oldDtsContent === dtsContent) {
+    return;
+  }
+  fs.writeFileSync(dtsPath, dtsContent);
+};

package/dist/module/utils/stringifyThemes.d.ts

@@ -0,0 +1 @@
+export declare const stringifyThemes: (themes?: Array<string>) => string;

package/dist/module/utils/stringifyThemes.js

@@ -0,0 +1 @@
+export const stringifyThemes = (themes = []) => `[${themes.map((theme) => `'${theme}'`).join(", ")}]`;

package/dist/module/vite/index.d.ts

@@ -0,0 +1,9 @@
+import type { Plugin } from 'vite'
+
+type UniwindConfig = {
+    cssEntryFile: string
+    extraThemes?: Array<string>
+    dtsFile?: string
+}
+
+export declare function uniwind(config: UniwindConfig): Plugin

package/dist/module/vite/index.js

@@ -0,0 +1 @@
+export * from "./vite.js";

package/dist/module/vite/vite.d.ts

@@ -0,0 +1,8 @@
+import type { Plugin } from 'vite';
+type UniwindConfig = {
+    cssEntryFile: string;
+    extraThemes?: Array<string>;
+    dtsFile?: string;
+};
+export declare const uniwind: ({ cssEntryFile, extraThemes, dtsFile, }: UniwindConfig) => Plugin;
+export {};

package/dist/module/vite/vite.js

@@ -0,0 +1,73 @@
+import { normalizePath } from "@tailwindcss/node";
+import path from "path";
+import { name as UNIWIND_PACKAGE_NAME } from "../../package.json";
+import { buildCSS } from "../css/index.js";
+import { processFunctions } from "../css/processFunctions.js";
+import { uniq } from "../metro/utils";
+import { buildDtsFile } from "../utils/buildDtsFile.js";
+import { stringifyThemes } from "../utils/stringifyThemes.js";
+const dirname = typeof __dirname !== "undefined" ? __dirname : import.meta.dirname;
+const componentPath = path.resolve(
+  dirname,
+  "../module/components/web/index.js"
+);
+export const uniwind = ({
+  cssEntryFile,
+  extraThemes,
+  dtsFile = "uniwind-types.d.ts"
+}) => {
+  const themes = uniq([
+    "light",
+    "dark",
+    ...extraThemes ?? []
+  ]);
+  const stringifiedThemes = stringifyThemes(themes);
+  return {
+    name: "uniwind",
+    config: () => ({
+      css: {
+        transformer: "lightningcss",
+        lightningcss: {
+          visitor: {
+            Function: processFunctions
+          }
+        }
+      },
+      optimizeDeps: {
+        exclude: [UNIWIND_PACKAGE_NAME, "react-native"]
+      },
+      resolve: {
+        alias: [
+          {
+            find: /^react-native$/,
+            replacement: componentPath,
+            customResolver: {
+              resolveId(_, importer) {
+                if (importer !== void 0 && normalizePath(importer).includes(`${UNIWIND_PACKAGE_NAME}/dist`)) {
+                  return this.resolve("react-native-web");
+                }
+                return componentPath;
+              }
+            }
+          }
+        ]
+      }
+    }),
+    transform: (code, id) => {
+      const normalizedId = normalizePath(id);
+      if (normalizedId.includes(`${UNIWIND_PACKAGE_NAME}/dist`) && normalizedId.includes("config/config.js")) {
+        return {
+          code: `${code}Uniwind.__reinit(() => ({}), ${stringifiedThemes})`
+        };
+      }
+    },
+    buildStart: async () => {
+      await buildCSS(themes, cssEntryFile);
+      buildDtsFile(dtsFile, stringifiedThemes);
+    },
+    generateBundle: async () => {
+      await buildCSS(themes, cssEntryFile);
+      buildDtsFile(dtsFile, stringifiedThemes);
+    }
+  };
+};

package/dist/shared/uniwind.BZIuaszw.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+var Platform = /* @__PURE__ */ ((Platform2) => {
+  Platform2["Android"] = "android";
+  Platform2["iOS"] = "ios";
+  Platform2["Web"] = "web";
+  Platform2["Native"] = "native";
+  return Platform2;
+})(Platform || {});
+
+exports.Platform = Platform;

package/dist/shared/uniwind.BgZDHdUR.cjs

@@ -0,0 +1,81 @@
+'use strict';
+
+const name = "@niibase/uniwind";
+
+const isDefined = (value) => value !== null && value !== void 0;
+const toCamelCase = (str) => str.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
+const pipe = (data) => ((...fns) => fns.reduce((acc, fn) => fn(acc), data));
+const isNumber = (data) => {
+  if (typeof data === "number") {
+    return true;
+  }
+  if (typeof data === "string" && data !== "") {
+    return !isNaN(Number(data));
+  }
+  return false;
+};
+const smartSplit = (str, separator = " ") => {
+  const escaper = "&&&";
+  return pipe(str)(
+    (x) => x.replace(/\s\?\?\s/g, `${escaper}??${escaper}`),
+    (x) => x.replace(/\s([+\-*/])\s/g, `${escaper}$1${escaper}`),
+    (x) => x.split(separator),
+    (x) => x.map((token) => token.replace(new RegExp(escaper, "g"), " "))
+  );
+};
+const addMissingSpaces = (str) => pipe(str)(
+  (x) => x.trim(),
+  (x) => x.replace(/([^ {])this/g, "$1 this"),
+  (x) => x.replace(/\](?=\d)/g, "] "),
+  (x) => x.replace(/\)(?=\S)/g, ") "),
+  (x) => x.replace(/(?<!^)(?<!\s)"(?=\d)/g, '" ')
+);
+const uniq = (arr) => Array.from(new Set(arr));
+const isValidJSValue = (jsValueString) => {
+  try {
+    new Function(`const test = ${jsValueString}`);
+    return true;
+  } catch {
+    return false;
+  }
+};
+const shouldBeSerialized = (value) => {
+  if (value.includes("-")) {
+    return value.split("-").some(shouldBeSerialized);
+  }
+  return [
+    isNumber(value),
+    value.startsWith("this["),
+    value.startsWith("rt."),
+    /[*/+-]/.test(value),
+    value.includes('"'),
+    value.includes(" ")
+  ].some(Boolean);
+};
+const roundToPrecision = (value, precision) => parseFloat(value.toFixed(precision));
+const deepEqual = (a, b) => {
+  if (Object.is(a, b)) {
+    return true;
+  }
+  if (typeof a !== "object" || a === null || typeof b !== "object" || b === null) {
+    return false;
+  }
+  const keysA = Object.keys(a);
+  if (keysA.length !== Object.keys(b).length) {
+    return false;
+  }
+  return keysA.every((key) => deepEqual(a[key], b[key]) && Object.prototype.hasOwnProperty.call(b, key));
+};
+
+exports.addMissingSpaces = addMissingSpaces;
+exports.deepEqual = deepEqual;
+exports.isDefined = isDefined;
+exports.isNumber = isNumber;
+exports.isValidJSValue = isValidJSValue;
+exports.name = name;
+exports.pipe = pipe;
+exports.roundToPrecision = roundToPrecision;
+exports.shouldBeSerialized = shouldBeSerialized;
+exports.smartSplit = smartSplit;
+exports.toCamelCase = toCamelCase;
+exports.uniq = uniq;

package/dist/shared/uniwind.Bt3kqZo6.mjs

@@ -0,0 +1,290 @@
+import fs from 'fs';
+import path from 'path';
+import { compile } from '@tailwindcss/node';
+import { transform } from 'lightningcss';
+import { n as name } from './uniwind.D3fvrgEG.mjs';
+
+const red = "\x1B[91m";
+const yellow = "\x1B[33m";
+const blue = "\x1B[36m";
+const reset = "\x1B[0m";
+class Logger {
+  constructor(name) {
+    this.name = name;
+  }
+  static debug = false;
+  static log(message, meta = "") {
+    if (!Logger.debug) {
+      return;
+    }
+    console.log(`${blue}Uniwind ${meta}- ${message}${reset}`);
+  }
+  static error(message, meta = "") {
+    console.log(`${red}Uniwind Error ${meta}- ${message}${reset}`);
+  }
+  static warn(message, meta = "") {
+    if (!Logger.debug) {
+      return;
+    }
+    console.log(`${yellow}Uniwind Warning ${meta}- ${message}${reset}`);
+  }
+  log(message) {
+    Logger.log(message, `[${this.name} Processor] `);
+  }
+  error(message) {
+    Logger.error(message, `[${this.name} Processor] `);
+  }
+  warn(message) {
+    Logger.warn(message, `[${this.name} Processor] `);
+  }
+}
+
+const ONE_PX = {
+  type: "token",
+  value: { type: "dimension", unit: "px", value: 1 }
+};
+const processFunctions = {
+  pixelRatio: (fn) => {
+    return {
+      type: "function",
+      value: {
+        name: "calc",
+        arguments: [
+          fn.arguments.at(0) ?? ONE_PX,
+          { type: "token", value: { type: "delim", value: "*" } },
+          ONE_PX
+        ]
+      }
+    };
+  },
+  fontScale: (fn) => {
+    return {
+      type: "function",
+      value: {
+        name: "calc",
+        arguments: [
+          fn.arguments.at(0) ?? ONE_PX,
+          { type: "token", value: { type: "delim", value: "*" } },
+          {
+            type: "token",
+            value: { type: "dimension", value: 1, unit: "rem" }
+          }
+        ]
+      }
+    };
+  },
+  hairlineWidth: () => ONE_PX
+};
+
+const types = ["m", "p"];
+const sides = ["", "x", "y", "t", "b", "l", "r"];
+const spacing = "--spacing(--value(integer))";
+const length = "--value([length])";
+const generateCSSForInsets = () => {
+  let css = `@utility h-screen-safe {
+    height: calc(100vh - (env(safe-area-inset-top) + env(safe-area-inset-bottom)));
+}
+`;
+  const getInsetsForSide = (side) => {
+    switch (side) {
+      case "t":
+        return ["top"];
+      case "b":
+        return ["bottom"];
+      case "l":
+        return ["left"];
+      case "r":
+        return ["right"];
+      case "x":
+        return ["left", "right"];
+      case "y":
+        return ["top", "bottom"];
+      default:
+        return ["top", "bottom", "left", "right"];
+    }
+  };
+  types.forEach((type) => {
+    sides.forEach((side) => {
+      const styleName = type === "m" ? "margin" : "padding";
+      const insets = getInsetsForSide(side);
+      const styles = insets.map((inset) => `${styleName}-${inset}: env(safe-area-inset-${inset});`);
+      const safeStyles = styles.flatMap((style) => {
+        const styleWithoutSemicolon = style.replace(";", "");
+        return [
+          styleWithoutSemicolon.replace(/: (env.*)/, (_, env) => `: max(${env}, ${spacing});`),
+          styleWithoutSemicolon.replace(/: (env.*)/, (_, env) => `: max(${env}, ${length});`)
+        ];
+      });
+      const safeOffsetStyles = styles.flatMap((style) => {
+        const styleWithoutSemicolon = style.replace(";", "");
+        return [
+          styleWithoutSemicolon.replace(/: (env.*)/, (_, env) => `: calc(${env} + ${spacing});`),
+          styleWithoutSemicolon.replace(/: (env.*)/, (_, env) => `: calc(${env} + ${length});`)
+        ];
+      });
+      css += `
+                @utility ${type}${side}-safe {
+                    ${styles.join("\n    ")}
+                }
+                
+                @utility ${type}${side}-safe-or-* {
+                    ${safeStyles.join("\n    ")}
+                }
+                
+                @utility ${type}${side}-safe-offset-* {
+                    ${safeOffsetStyles.join("\n    ")}
+                }
+            `;
+    });
+  });
+  return css.replaceAll("        ", "").trim() + "\n";
+};
+
+const readFileSafe = (filePath) => {
+  try {
+    return fs.readFileSync(filePath, "utf-8");
+  } catch {
+    return null;
+  }
+};
+const isExcludedDependency = (url) => [
+  url.includes("node_modules/tailwindcss"),
+  url.includes("node_modules/@tailwindcss"),
+  url.includes("node_modules/uniwind")
+].some(Boolean);
+const generateCSSForThemes = async (themes, input) => {
+  const themesVariables = Object.fromEntries(themes.map((theme) => [theme, /* @__PURE__ */ new Set()]));
+  const findVariantsRec = async (cssPath) => {
+    const css = readFileSafe(cssPath);
+    if (css === null) {
+      return;
+    }
+    const { dependencies } = transform({
+      code: Buffer.from(css),
+      filename: "uniwind.css",
+      analyzeDependencies: true,
+      visitor: {
+        Rule: (rule) => {
+          if (rule.type === "unknown" && rule.value.name === "variant") {
+            const [firstPrelude] = rule.value.prelude;
+            if (firstPrelude?.type !== "token" || firstPrelude.value.type !== "ident" || !themes.includes(firstPrelude.value.value)) {
+              return;
+            }
+            const theme = firstPrelude.value.value;
+            rule.value.block?.forEach((block) => {
+              if (block.type === "dashed-ident") {
+                themesVariables[theme]?.add(block.value);
+              }
+            });
+          }
+        }
+      }
+    });
+    if (!Array.isArray(dependencies)) {
+      return;
+    }
+    const importUrls = /* @__PURE__ */ new Set();
+    const importsCSS = dependencies.filter((dependency) => {
+      if (dependency.url.startsWith(".")) {
+        importUrls.add(path.resolve(path.dirname(cssPath), dependency.url));
+        return false;
+      }
+      return !isExcludedDependency(dependency.url);
+    }).map((dependency) => `@import "${dependency.url}";`).join("\n");
+    await compile(importsCSS, {
+      base: path.resolve(path.dirname(cssPath)),
+      onDependency: (dependency) => {
+        if (isExcludedDependency(dependency)) {
+          return;
+        }
+        importUrls.add(dependency);
+      }
+    });
+    for (const filePath of importUrls) {
+      await findVariantsRec(filePath);
+    }
+  };
+  await findVariantsRec(input);
+  let hasErrors = false;
+  const hasVariables = Object.values(themesVariables).some((variables) => variables.size > 0);
+  Object.values(themesVariables).forEach((variables) => {
+    Object.entries(themesVariables).forEach(([checkedTheme, checkedVariables]) => {
+      variables.forEach((variable) => {
+        if (!checkedVariables.has(variable)) {
+          Logger.error(`Theme ${checkedTheme} is missing variable ${variable}`);
+          hasErrors = true;
+        }
+      });
+    });
+  });
+  if (hasErrors) {
+    Logger.error("All themes must have the same variables");
+  }
+  const variablesCSS = hasVariables ? [
+    "",
+    "@theme {",
+    ...Array.from(Object.values(themesVariables).at(0) ?? []).map((variable) => `    ${variable}: unset;`),
+    "}"
+  ] : [];
+  const uniwindCSS = [
+    ...themes.map((theme) => `@custom-variant ${theme} (&:where(.${theme}, .${theme} *));`),
+    ...variablesCSS
+  ].join("\n");
+  return uniwindCSS;
+};
+
+const variants = ["ios", "android", "web", "native"];
+const generateCSSForVariants = () => {
+  let css = "";
+  variants.forEach((variant) => {
+    css += `@custom-variant ${variant} (${variant === "web" ? "html &" : `@media ${variant}`});
+`;
+  });
+  return css;
+};
+
+const dirname = typeof __dirname !== "undefined" ? __dirname : import.meta.dirname;
+const buildCSS = async (themes, input) => {
+  const variants = generateCSSForVariants();
+  const insets = generateCSSForInsets();
+  const themesCSS = await generateCSSForThemes(themes, input);
+  const cssFilePath = path.join(dirname, "../../uniwind.css");
+  const oldCSSFile = fs.existsSync(cssFilePath) ? fs.readFileSync(cssFilePath, "utf-8") : "";
+  const newCssFile = [
+    variants,
+    insets,
+    themesCSS
+  ].join("\n");
+  if (oldCSSFile === newCssFile) {
+    return;
+  }
+  fs.writeFileSync(
+    cssFilePath,
+    newCssFile
+  );
+};
+
+const buildDtsFile = (dtsPath, stringifiedThemes) => {
+  const oldDtsContent = fs.existsSync(dtsPath) ? fs.readFileSync(dtsPath, "utf-8") : "";
+  const dtsContent = [
+    `// NOTE: This file is generated by ${name} and it should not be edited manually.`,
+    `/// <reference types="${name}/types" />`,
+    "",
+    `declare module '${name}' {`,
+    `    export interface UniwindConfig {`,
+    `        themes: readonly ${stringifiedThemes}`,
+    `    }`,
+    `}`,
+    "",
+    `export {}`,
+    ""
+  ].join("\n");
+  if (oldDtsContent === dtsContent) {
+    return;
+  }
+  fs.writeFileSync(dtsPath, dtsContent);
+};
+
+const stringifyThemes = (themes = []) => `[${themes.map((theme) => `'${theme}'`).join(", ")}]`;
+
+export { Logger as L, buildCSS as a, buildDtsFile as b, processFunctions as p, stringifyThemes as s };

package/dist/shared/uniwind.CyoRUwOj.mjs

@@ -0,0 +1,9 @@
+var Platform = /* @__PURE__ */ ((Platform2) => {
+  Platform2["Android"] = "android";
+  Platform2["iOS"] = "ios";
+  Platform2["Web"] = "web";
+  Platform2["Native"] = "native";
+  return Platform2;
+})(Platform || {});
+
+export { Platform as P };