@galaxy-io/dls 2.9.0 → 2.10.0

package/dist/vite/internal/themeBoot.d.ts

@@ -0,0 +1,25 @@
+/**
+ * @internal What `galaxyDls()` injects into `index.html` so the first paint is already in the
+ * right theme: one inline script that sets `data-gx-theme` on `<html>`, and one `<style>` that
+ * paints the canvas per theme. Private on purpose (an `internal/` module: built, never a package
+ * export).
+ *
+ * The script resolves the theme exactly as `GalaxyProvider` does on mount, so nothing flips when
+ * React takes over: a valid stored choice (`DARK`, `LIGHT` or `SYSTEM` under `storageKey`) wins
+ * over the configured `theme`; `SYSTEM` reads `prefers-color-scheme`, and falls back to dark where
+ * `matchMedia` is missing (the provider's default). It reads storage and never writes it, and any
+ * error leaves the page as the server sent it.
+ *
+ * The background is a `<style>` keyed off the attribute, never an inline `style` on `<html>`: an
+ * inline background would stay the boot theme after a runtime switch, because nothing removes it.
+ * Its values come from the token modules, so they are `background.base` in each theme.
+ */
+import { GalaxyTheme } from "../../theme/enums.js";
+/** @internal The provider's default storage key; the boot script must read the same one. */
+export declare const DEFAULT_THEME_STORAGE_KEY = "galaxy:theme";
+/** @internal The boot script's source: resolves the theme and sets `data-gx-theme`. */
+export declare function themeBootScript(theme: GalaxyTheme, storageKey: string): string;
+/** @internal The canvas per theme, keyed off the attribute the script (then the provider) sets. */
+export declare function themeBackgroundStyle(): string;
+/** @internal The themes `galaxyDls({ theme })` accepts. */
+export declare const BOOT_THEMES: readonly string[];

package/dist/vite/internal/themeBoot.js

@@ -0,0 +1,44 @@
+import { GalaxyTheme } from "../../theme/enums.js";
+import { DARK_THEME } from "../../theme/tokens/dark.js";
+import { LIGHT_THEME } from "../../theme/tokens/light.js";
+//#region src/vite/internal/themeBoot.ts
+/**
+* @internal What `galaxyDls()` injects into `index.html` so the first paint is already in the
+* right theme: one inline script that sets `data-gx-theme` on `<html>`, and one `<style>` that
+* paints the canvas per theme. Private on purpose (an `internal/` module: built, never a package
+* export).
+*
+* The script resolves the theme exactly as `GalaxyProvider` does on mount, so nothing flips when
+* React takes over: a valid stored choice (`DARK`, `LIGHT` or `SYSTEM` under `storageKey`) wins
+* over the configured `theme`; `SYSTEM` reads `prefers-color-scheme`, and falls back to dark where
+* `matchMedia` is missing (the provider's default). It reads storage and never writes it, and any
+* error leaves the page as the server sent it.
+*
+* The background is a `<style>` keyed off the attribute, never an inline `style` on `<html>`: an
+* inline background would stay the boot theme after a runtime switch, because nothing removes it.
+* Its values come from the token modules, so they are `background.base` in each theme.
+*/
+/** @internal The provider's default storage key; the boot script must read the same one. */
+var DEFAULT_THEME_STORAGE_KEY = "galaxy:theme";
+/** A JSON string literal that is also safe inside a `<script>` element (no `<\/script>` break-out). */
+var toScriptLiteral = (value) => JSON.stringify(value).replace(/</g, "\\u003c");
+/** @internal The boot script's source: resolves the theme and sets `data-gx-theme`. */
+function themeBootScript(theme, storageKey) {
+	return [
+		"(function(){",
+		`var t=${toScriptLiteral(theme)},s=null;`,
+		`try{s=window.localStorage.getItem(${toScriptLiteral(storageKey)})}catch(e){}`,
+		"if(s===\"DARK\"||s===\"LIGHT\"||s===\"SYSTEM\")t=s;",
+		"if(t===\"SYSTEM\"){t=\"DARK\";try{if(!window.matchMedia(\"(prefers-color-scheme: dark)\").matches)t=\"LIGHT\"}catch(e){}}",
+		"document.documentElement.setAttribute(\"data-gx-theme\",t===\"LIGHT\"?\"light\":\"dark\")",
+		"})();"
+	].join("");
+}
+/** @internal The canvas per theme, keyed off the attribute the script (then the provider) sets. */
+function themeBackgroundStyle() {
+	return [`html[data-gx-theme="dark"]{background:${DARK_THEME.color.background.base}}`, `html[data-gx-theme="light"]{background:${LIGHT_THEME.color.background.base}}`].join("");
+}
+/** @internal The themes `galaxyDls({ theme })` accepts. */
+var BOOT_THEMES = Object.values(GalaxyTheme);
+//#endregion
+export { BOOT_THEMES, DEFAULT_THEME_STORAGE_KEY, themeBackgroundStyle, themeBootScript };

package/dist/vite/internal/wywOptions.d.ts

@@ -0,0 +1,46 @@
+/**
+ * @internal The one class-name and compile config for Linaria (wyw-in-js), shared by the DLS's own
+ * build and Storybook (`wyw.config.ts`) and by the app preset (`galaxyDls()`), so a DLS class and
+ * an app class are named and emitted the same way. Private on purpose (an `internal/` module:
+ * built, never a package export). Each caller adds only what differs: its `include` / `exclude`,
+ * and how it resolves the Babel presets.
+ *
+ * Class names read `<prefix>-<Component>-<Part>-<hash>` (`gx-Button-Label-1a2b3c`); a styled root
+ * named `Root` drops the part (`gx-Button-1a2b3c`), so the inspector names the component.
+ */
+/** The DLS class prefix; also the default app prefix. */
+export declare const DLS_CLASS_PREFIX = "gx";
+/** What wyw passes the slug function besides the hash and the styled name. */
+interface SlugArgs {
+    name: string;
+}
+/** @internal The class-name slug for a prefix: `<prefix>-<Component>-<Part>-<hash>`, `Root` unnamed. */
+export declare function classNameSlug(prefix: string): (hash: string, title: string, { name }: SlugArgs) => string;
+/**
+ * @internal The options every caller shares, for a class prefix: the slug, no vendor prefixes,
+ * and the React import overrides.
+ *
+ * `prefixer: false`: every browser the DLS targets reads the unprefixed properties, and the stylis
+ * prefixer would add about 1,300 `-webkit-` declarations and duplicate every keyframe. Apps get
+ * the same, so their CSS and the DLS's match.
+ *
+ * React is reached while wyw evaluates `styled` components at build time; loading it as-is is
+ * expected, so the "unknown import reached during eval" warning is silenced for it (the dev
+ * runtime too, for an app's dev server).
+ */
+export declare function sharedWywOptions(prefix: string): {
+    readonly classNameSlug: (hash: string, title: string, { name }: SlugArgs) => string;
+    readonly prefixer: false;
+    readonly importOverrides: {
+        readonly react: {
+            readonly unknown: "allow";
+        };
+        readonly "react/jsx-runtime": {
+            readonly unknown: "allow";
+        };
+        readonly "react/jsx-dev-runtime": {
+            readonly unknown: "allow";
+        };
+    };
+};
+export {};

package/dist/vite/internal/wywOptions.js

@@ -0,0 +1,44 @@
+//#region src/vite/internal/wywOptions.ts
+/**
+* @internal The one class-name and compile config for Linaria (wyw-in-js), shared by the DLS's own
+* build and Storybook (`wyw.config.ts`) and by the app preset (`galaxyDls()`), so a DLS class and
+* an app class are named and emitted the same way. Private on purpose (an `internal/` module:
+* built, never a package export). Each caller adds only what differs: its `include` / `exclude`,
+* and how it resolves the Babel presets.
+*
+* Class names read `<prefix>-<Component>-<Part>-<hash>` (`gx-Button-Label-1a2b3c`); a styled root
+* named `Root` drops the part (`gx-Button-1a2b3c`), so the inspector names the component.
+*/
+/** The DLS class prefix; also the default app prefix. */
+var DLS_CLASS_PREFIX = "gx";
+/** The styled root's name; its class drops the part segment. */
+var ROOT_PART = "Root";
+/** @internal The class-name slug for a prefix: `<prefix>-<Component>-<Part>-<hash>`, `Root` unnamed. */
+function classNameSlug(prefix) {
+	return (hash, title, { name }) => `${prefix}-${name}${title === ROOT_PART ? "" : `-${title}`}-${hash}`;
+}
+/**
+* @internal The options every caller shares, for a class prefix: the slug, no vendor prefixes,
+* and the React import overrides.
+*
+* `prefixer: false`: every browser the DLS targets reads the unprefixed properties, and the stylis
+* prefixer would add about 1,300 `-webkit-` declarations and duplicate every keyframe. Apps get
+* the same, so their CSS and the DLS's match.
+*
+* React is reached while wyw evaluates `styled` components at build time; loading it as-is is
+* expected, so the "unknown import reached during eval" warning is silenced for it (the dev
+* runtime too, for an app's dev server).
+*/
+function sharedWywOptions(prefix) {
+	return {
+		classNameSlug: classNameSlug(prefix),
+		prefixer: false,
+		importOverrides: {
+			react: { unknown: "allow" },
+			"react/jsx-runtime": { unknown: "allow" },
+			"react/jsx-dev-runtime": { unknown: "allow" }
+		}
+	};
+}
+//#endregion
+export { DLS_CLASS_PREFIX, classNameSlug, sharedWywOptions };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@galaxy-io/dls",
-  "version": "2.9.0",
+  "version": "2.10.0",
   "description": "Galaxy Design Language System",
   "license": "UNLICENSED",
   "type": "module",
@@ -69,6 +69,10 @@
       "types": "./dist/brand/GalaxyWordmark.d.ts",
       "import": "./dist/brand/GalaxyWordmark.js"
     },
+    "./brand/PoweredBy": {
+      "types": "./dist/brand/PoweredBy.d.ts",
+      "import": "./dist/brand/PoweredBy.js"
+    },
     "./brand/brandMark": {
       "types": "./dist/brand/brandMark.d.ts",
       "import": "./dist/brand/brandMark.js"
@@ -297,6 +301,10 @@
       "types": "./dist/hooks/useElementWidth.d.ts",
       "import": "./dist/hooks/useElementWidth.js"
     },
+    "./hooks/useEndReached": {
+      "types": "./dist/hooks/useEndReached.d.ts",
+      "import": "./dist/hooks/useEndReached.js"
+    },
     "./hooks/useField": {
       "types": "./dist/hooks/useField.d.ts",
       "import": "./dist/hooks/useField.js"
@@ -441,6 +449,10 @@
       "types": "./dist/json/JsonViewer.d.ts",
       "import": "./dist/json/JsonViewer.js"
     },
+    "./layout/AppFrame": {
+      "types": "./dist/layout/AppFrame.d.ts",
+      "import": "./dist/layout/AppFrame.js"
+    },
     "./layout/Box": {
       "types": "./dist/layout/Box.d.ts",
       "import": "./dist/layout/Box.js"
@@ -449,6 +461,14 @@
       "types": "./dist/layout/Divider.d.ts",
       "import": "./dist/layout/Divider.js"
     },
+    "./layout/EmptyLayout": {
+      "types": "./dist/layout/EmptyLayout.d.ts",
+      "import": "./dist/layout/EmptyLayout.js"
+    },
+    "./layout/ErrorLayout": {
+      "types": "./dist/layout/ErrorLayout.d.ts",
+      "import": "./dist/layout/ErrorLayout.js"
+    },
     "./layout/Flex": {
       "types": "./dist/layout/Flex.d.ts",
       "import": "./dist/layout/Flex.js"
@@ -461,6 +481,14 @@
       "types": "./dist/layout/Grid.d.ts",
       "import": "./dist/layout/Grid.js"
     },
+    "./layout/PageLayout": {
+      "types": "./dist/layout/PageLayout.d.ts",
+      "import": "./dist/layout/PageLayout.js"
+    },
+    "./layout/PendingLayout": {
+      "types": "./dist/layout/PendingLayout.d.ts",
+      "import": "./dist/layout/PendingLayout.js"
+    },
     "./layout/Portal": {
       "types": "./dist/layout/Portal.d.ts",
       "import": "./dist/layout/Portal.js"
@@ -757,6 +785,10 @@
       "types": "./dist/utils/format.d.ts",
       "import": "./dist/utils/format.js"
     },
+    "./utils/search": {
+      "types": "./dist/utils/search.d.ts",
+      "import": "./dist/utils/search.js"
+    },
     "./vite": {
       "types": "./dist/vite/index.d.ts",
       "import": "./dist/vite/index.js"
@@ -946,6 +978,7 @@
     "d3-scale": "^4.0.2",
     "d3-shape": "^3.2.0",
     "glob": "^13.0.6",
+    "happy-dom": "20.10.2",
     "lottie-react": "^2.4.1",
     "publint": "^0.3.25",
     "react": "^18.3.1",