dash-startup-loading-plugin 0.2.0__tar.gz → 0.3.0__tar.gz

{dash_startup_loading_plugin-0.2.0/src/dash_startup_loading_plugin.egg-info → dash_startup_loading_plugin-0.3.0}/PKG-INFO

@@ -1,17 +1,19 @@
 Metadata-Version: 2.4
 Name: dash-startup-loading-plugin
-Version: 0.2.0
+Version: 0.3.0
 Summary: A configurable full-screen startup loading overlay for Dash apps, packaged as a Dash Hooks plugin.
 Author-email: Ethan Zhang <ethan.zhang2016@gmail.com>
 License-Expression: MIT
-Keywords: dash,plotly,loading,plugin,hooks
+Keywords: dash,plotly,loading,plugin
 Classifier: Framework :: Dash
 Requires-Python: >=3.9
 Description-Content-Type: text/markdown
 License-File: LICENSE
-Requires-Dist: dash>=3.0.3
+Requires-Dist: dash==4.4.1
 Provides-Extra: test
 Requires-Dist: pytest>=8; extra == "test"
+Provides-Extra: mantine
+Requires-Dist: dash-mantine-components>=2.6.0; extra == "mantine"
 Dynamic: license-file
 
 # dash-startup-loading-plugin
@@ -51,7 +53,7 @@ discovery, resource hooks, and the index hook described in the official
 ## Installation
 
 ```bash
-pip install "dash-startup-loading-plugin>=0.2.0"
+pip install "dash-startup-loading-plugin>=0.3.0"
 ```
 
 The package declares the following entry point:
@@ -66,6 +68,16 @@ package therefore enables the default startup overlay for Dash applications in
 that Python environment; an explicit import is only needed when changing its
 configuration or using its Python API.
 
+## What's new in 0.3.0
+
+- Adds `configure_antd()` with matching `#ffffff` and `#121212` loading
+  backgrounds plus explicit light/dark overrides.
+- Adds `configure_mantine()` with theme defaults sourced from Dash Mantine
+  Components and its pre-render color-scheme hook.
+- Updates the Dash Ant Design example for the structured
+  `ConfigProvider.theme.algorithm` API.
+- Adds a Dash Mantine Components example with persisted theme switching.
+
 ## What's new in 0.2.0
 
 - Resolves the loading background before first paint from a persisted
@@ -104,25 +116,33 @@ from dash import Dash, html
 from dash_startup_loading_plugin import configure
 
 configure(
-    required_selectors=["#page-header", "#sidebar-menu"],
+    required_selectors=["#usage-header", "#usage-sidebar-menu"],
     pending_selector="[data-dac-async-placeholder]",
     timeout_ms=6000,
-    minimum_display_ms=200,
     fade_duration_ms=160,
-    color="#1677ff",
-    dark_color="#4096ff",
 )
 
 app = Dash(__name__)
 app.layout = html.Div(
     [
-        html.Header("Dashboard", id="page-header"),
-        html.Nav("Navigation", id="sidebar-menu"),
+        html.Header("Dashboard", id="usage-header"),
+        html.Nav("Navigation", id="usage-sidebar-menu"),
     ]
 )
 ```
 
-See [`examples/basic.py`](examples/basic.py) for a runnable example.
+Runnable examples:
+
+- [`examples/basic.py`](examples/basic.py): Dash Ant Design theme persistence.
+- [`examples/mantine_theme.py`](examples/mantine_theme.py):
+  Dash Mantine Components with a persisted light/dark theme switch.
+
+Run the Mantine example with:
+
+```bash
+pip install -e ".[mantine]"
+python examples/mantine_theme.py
+```
 
 ## Readiness behavior
 
@@ -192,29 +212,105 @@ parsed. This isolates the overlay styling without changing classes or data
 attributes owned by Tailwind, Dash Mantine Components, or the application.
 The stylesheet also adjusts its animation for `prefers-reduced-motion`.
 
+### Dash Mantine Components
+
+Dash Mantine Components 2.6 and later includes `ColorSchemeToggle`, which
+switches the active color scheme without a callback and persists it in
+`mantine-color-scheme-value`. The startup plugin reads that value before Dash
+and React mount. To make the loading transition seamless, use Mantine's current
+default dark body color for the overlay:
+
+```python
+import dash_mantine_components as dmc
+from dash_startup_loading_plugin import configure_mantine
+
+configure_mantine()
+
+app.layout = dmc.MantineProvider(
+    [
+        dmc.ColorSchemeToggle(
+            lightIcon=dmc.Text("☀"),
+            darkIcon=dmc.Text("☾"),
+        ),
+        dmc.Text("Application content", id="app-ready"),
+    ],
+    defaultColorScheme="auto",
+)
+```
+
+See
+[`examples/mantine_theme.py`](examples/mantine_theme.py)
+for the complete runnable example.
+
+`configure_mantine()` keeps DMC optional. When used, it registers DMC's
+pre-render color-scheme hook, disables the Dash Ant Design placeholder check,
+and derives the light and dark loading backgrounds from DMC's active default
+theme. Any explicit configuration still takes precedence:
+
+```python
+configure_mantine(dark_background="#202020")
+```
+
 ### Dash Ant Design persistence
 
-`dash_antd_components.ConfigProvider` can persist its `theme` prop. The startup
-plugin reads that same Dash persistence record on the next page load:
+Current `dash_antd_components.ConfigProvider.theme` accepts a structured theme
+configuration whose `algorithm` is `"default"`, `"dark"`, `"compact"`, or an
+array of those values. Persist a user-facing system/light/dark selector, resolve
+the system preference in a clientside callback, and store the semantic choice
+in the small conventional `localStorage["theme"]` value that the startup plugin
+reads before Dash mounts:
 
 ```python
 import dash_antd_components as dac
-from dash_startup_loading_plugin import configure
+from dash import Input, Output, clientside_callback
+from dash_startup_loading_plugin import configure_antd
 
-configure(dash_theme_component_id="theme-provider")
+configure_antd()
 
 provider = dac.ConfigProvider(
-    app_content,
+    [
+        app_content,
+        dac.Segmented(
+            id="theme-mode",
+            options=["system", "light", "dark"],
+            value="system",
+            persistence=True,
+            persisted_props=["value"],
+            persistence_type="local",
+        ),
+    ],
     id="theme-provider",
-    persistence=True,
-    persisted_props=["theme"],
-    persistence_type="local",
+    theme={"algorithm": "default"},
+)
+
+clientside_callback(
+    """function(mode) {
+        localStorage.setItem("theme", JSON.stringify(mode));
+        const dark = mode === "dark" || (
+            mode === "system"
+            && window.matchMedia("(prefers-color-scheme: dark)").matches
+        );
+        return {algorithm: dark ? "dark" : "default"};
+    }""",
+    Output("theme-provider", "theme"),
+    Input("theme-mode", "value"),
+)
+```
+
+The selector owns the semantic `"system"` state; `ConfigProvider` receives only
+the algorithms allowed by its current API. `configure_antd()` uses `#ffffff`
+and `#121212`, matching the component library's default light and dark
+backgrounds. If the application customizes either background, pass the same
+values explicitly:
+
+```python
+configure_antd(
+    background="#f5f5f5",
+    dark_background="#202020",
 )
 ```
 
-Update `theme-provider.theme` from a regular or clientside callback. Dash stores
-the UI edit, `ConfigProvider` restores it after mount, and the startup plugin
-uses it for the loading background before mount. See
+See
 [`examples/basic.py`](examples/basic.py) for the complete switcher.
 
 ### Custom loader markup
@@ -242,12 +338,18 @@ configuration. Never populate it with user input.
 from dash_startup_loading_plugin import (
     StartupLoadingConfig,
     configure,
+    configure_antd,
+    configure_mantine,
     get_config,
     reset_config,
 )
 ```
 
 - `configure(**changes)` validates and applies a partial configuration update.
+- `configure_antd(**changes)` matches the loading backgrounds to Dash Ant
+  Design's light and dark themes and accepts explicit overrides.
+- `configure_mantine(**changes)` applies DMC theme defaults and registers DMC's
+  pre-render color-scheme hook.
 - `get_config()` returns the current immutable configuration.
 - `reset_config()` restores all defaults. It is primarily useful in tests.
 - `StartupLoadingConfig` is the frozen dataclass containing all options.
@@ -345,120 +447,6 @@ This is expected with automatic `dash_hooks` discovery. Use a dedicated virtual
 environment, uninstall the package where it is not wanted, or call
 `configure(enabled=False)` before constructing those Dash apps.
 
-## Development
-
-Clone the repository, then install the project and test dependencies:
-
-```bash
-uv sync --extra test
-```
-
-Run the tests and example:
-
-```bash
-uv run pytest
-uv run --with dash-ant-design python examples/basic.py
-```
-
-The example uses `dash_antd_components.ConfigProvider` to demonstrate native
-theme persistence, so `dash-ant-design` is an example-only dependency rather
-than a runtime dependency of the plugin.
-
-Build the source distribution and wheel:
-
-```bash
-uv build
-```
-
-## Publishing to PyPI
-
-PyPI does not allow replacing an existing distribution file. Confirm that the
-version in `pyproject.toml` is new before building, then create the artifacts
-from a clean `dist/` directory:
-
-```bash
-rm -rf build dist src/*.egg-info
-uv lock
-uv run --extra test pytest
-uvx ruff check src tests examples
-uv build
-uvx twine check dist/*
-```
-
-Inspect the resulting files before upload:
-
-```bash
-ls -lh dist/
-unzip -l dist/dash_startup_loading_plugin-0.2.0-py3-none-any.whl
-tar -tzf dist/dash_startup_loading_plugin-0.2.0.tar.gz
-uv publish --dry-run dist/*
-```
-
-### TestPyPI
-
-Create a TestPyPI API token, then upload to its legacy upload endpoint:
-
-```bash
-export UV_PUBLISH_TOKEN="pypi-your-test-token"
-uv publish \
-  --publish-url https://test.pypi.org/legacy/ \
-  --check-url https://test.pypi.org/simple/ \
-  dist/*
-unset UV_PUBLISH_TOKEN
-```
-
-Test installation in an isolated environment:
-
-```bash
-uv run --isolated \
-  --index-url https://test.pypi.org/simple/ \
-  --extra-index-url https://pypi.org/simple/ \
-  --with dash-startup-loading-plugin==0.2.0 \
-  python -c "import dash_startup_loading_plugin; print('import ok')"
-```
-
-The extra PyPI index is needed because TestPyPI may not contain the plugin's
-runtime dependencies.
-
-### PyPI with an API token
-
-Create a project-scoped PyPI token and publish the checked artifacts:
-
-```bash
-export UV_PUBLISH_TOKEN="pypi-your-project-token"
-uv publish dist/*
-unset UV_PUBLISH_TOKEN
-```
-
-Do not place tokens in `pyproject.toml`, shell history, source control, or CI
-logs.
-
-### PyPI Trusted Publishing
-
-For CI releases, configure the repository and workflow as a Trusted Publisher
-in the PyPI project settings. The publishing job needs the
-`id-token: write` permission and can upload without a long-lived token:
-
-```yaml
-permissions:
-  contents: read
-  id-token: write
-
-steps:
-  - uses: actions/checkout@v4
-  - uses: astral-sh/setup-uv@v8
-  - run: uv build
-  - run: uv publish --trusted-publishing always
-```
-
-After publishing, verify the release:
-
-```bash
-uv run --isolated \
-  --with dash-startup-loading-plugin==0.2.0 \
-  python -c "import dash_startup_loading_plugin; print('import ok')"
-```
-
 ## License
 
 MIT. See [`LICENSE`](LICENSE).

{dash_startup_loading_plugin-0.2.0 → dash_startup_loading_plugin-0.3.0}/README.md

@@ -35,7 +35,7 @@ discovery, resource hooks, and the index hook described in the official
 ## Installation
 
 ```bash
-pip install "dash-startup-loading-plugin>=0.2.0"
+pip install "dash-startup-loading-plugin>=0.3.0"
 ```
 
 The package declares the following entry point:
@@ -50,6 +50,16 @@ package therefore enables the default startup overlay for Dash applications in
 that Python environment; an explicit import is only needed when changing its
 configuration or using its Python API.
 
+## What's new in 0.3.0
+
+- Adds `configure_antd()` with matching `#ffffff` and `#121212` loading
+  backgrounds plus explicit light/dark overrides.
+- Adds `configure_mantine()` with theme defaults sourced from Dash Mantine
+  Components and its pre-render color-scheme hook.
+- Updates the Dash Ant Design example for the structured
+  `ConfigProvider.theme.algorithm` API.
+- Adds a Dash Mantine Components example with persisted theme switching.
+
 ## What's new in 0.2.0
 
 - Resolves the loading background before first paint from a persisted
@@ -88,25 +98,33 @@ from dash import Dash, html
 from dash_startup_loading_plugin import configure
 
 configure(
-    required_selectors=["#page-header", "#sidebar-menu"],
+    required_selectors=["#usage-header", "#usage-sidebar-menu"],
     pending_selector="[data-dac-async-placeholder]",
     timeout_ms=6000,
-    minimum_display_ms=200,
     fade_duration_ms=160,
-    color="#1677ff",
-    dark_color="#4096ff",
 )
 
 app = Dash(__name__)
 app.layout = html.Div(
     [
-        html.Header("Dashboard", id="page-header"),
-        html.Nav("Navigation", id="sidebar-menu"),
+        html.Header("Dashboard", id="usage-header"),
+        html.Nav("Navigation", id="usage-sidebar-menu"),
     ]
 )
 ```
 
-See [`examples/basic.py`](examples/basic.py) for a runnable example.
+Runnable examples:
+
+- [`examples/basic.py`](examples/basic.py): Dash Ant Design theme persistence.
+- [`examples/mantine_theme.py`](examples/mantine_theme.py):
+  Dash Mantine Components with a persisted light/dark theme switch.
+
+Run the Mantine example with:
+
+```bash
+pip install -e ".[mantine]"
+python examples/mantine_theme.py
+```
 
 ## Readiness behavior
 
@@ -176,29 +194,105 @@ parsed. This isolates the overlay styling without changing classes or data
 attributes owned by Tailwind, Dash Mantine Components, or the application.
 The stylesheet also adjusts its animation for `prefers-reduced-motion`.
 
+### Dash Mantine Components
+
+Dash Mantine Components 2.6 and later includes `ColorSchemeToggle`, which
+switches the active color scheme without a callback and persists it in
+`mantine-color-scheme-value`. The startup plugin reads that value before Dash
+and React mount. To make the loading transition seamless, use Mantine's current
+default dark body color for the overlay:
+
+```python
+import dash_mantine_components as dmc
+from dash_startup_loading_plugin import configure_mantine
+
+configure_mantine()
+
+app.layout = dmc.MantineProvider(
+    [
+        dmc.ColorSchemeToggle(
+            lightIcon=dmc.Text("☀"),
+            darkIcon=dmc.Text("☾"),
+        ),
+        dmc.Text("Application content", id="app-ready"),
+    ],
+    defaultColorScheme="auto",
+)
+```
+
+See
+[`examples/mantine_theme.py`](examples/mantine_theme.py)
+for the complete runnable example.
+
+`configure_mantine()` keeps DMC optional. When used, it registers DMC's
+pre-render color-scheme hook, disables the Dash Ant Design placeholder check,
+and derives the light and dark loading backgrounds from DMC's active default
+theme. Any explicit configuration still takes precedence:
+
+```python
+configure_mantine(dark_background="#202020")
+```
+
 ### Dash Ant Design persistence
 
-`dash_antd_components.ConfigProvider` can persist its `theme` prop. The startup
-plugin reads that same Dash persistence record on the next page load:
+Current `dash_antd_components.ConfigProvider.theme` accepts a structured theme
+configuration whose `algorithm` is `"default"`, `"dark"`, `"compact"`, or an
+array of those values. Persist a user-facing system/light/dark selector, resolve
+the system preference in a clientside callback, and store the semantic choice
+in the small conventional `localStorage["theme"]` value that the startup plugin
+reads before Dash mounts:
 
 ```python
 import dash_antd_components as dac
-from dash_startup_loading_plugin import configure
+from dash import Input, Output, clientside_callback
+from dash_startup_loading_plugin import configure_antd
 
-configure(dash_theme_component_id="theme-provider")
+configure_antd()
 
 provider = dac.ConfigProvider(
-    app_content,
+    [
+        app_content,
+        dac.Segmented(
+            id="theme-mode",
+            options=["system", "light", "dark"],
+            value="system",
+            persistence=True,
+            persisted_props=["value"],
+            persistence_type="local",
+        ),
+    ],
     id="theme-provider",
-    persistence=True,
-    persisted_props=["theme"],
-    persistence_type="local",
+    theme={"algorithm": "default"},
+)
+
+clientside_callback(
+    """function(mode) {
+        localStorage.setItem("theme", JSON.stringify(mode));
+        const dark = mode === "dark" || (
+            mode === "system"
+            && window.matchMedia("(prefers-color-scheme: dark)").matches
+        );
+        return {algorithm: dark ? "dark" : "default"};
+    }""",
+    Output("theme-provider", "theme"),
+    Input("theme-mode", "value"),
+)
+```
+
+The selector owns the semantic `"system"` state; `ConfigProvider` receives only
+the algorithms allowed by its current API. `configure_antd()` uses `#ffffff`
+and `#121212`, matching the component library's default light and dark
+backgrounds. If the application customizes either background, pass the same
+values explicitly:
+
+```python
+configure_antd(
+    background="#f5f5f5",
+    dark_background="#202020",
 )
 ```
 
-Update `theme-provider.theme` from a regular or clientside callback. Dash stores
-the UI edit, `ConfigProvider` restores it after mount, and the startup plugin
-uses it for the loading background before mount. See
+See
 [`examples/basic.py`](examples/basic.py) for the complete switcher.
 
 ### Custom loader markup
@@ -226,12 +320,18 @@ configuration. Never populate it with user input.
 from dash_startup_loading_plugin import (
     StartupLoadingConfig,
     configure,
+    configure_antd,
+    configure_mantine,
     get_config,
     reset_config,
 )
 ```
 
 - `configure(**changes)` validates and applies a partial configuration update.
+- `configure_antd(**changes)` matches the loading backgrounds to Dash Ant
+  Design's light and dark themes and accepts explicit overrides.
+- `configure_mantine(**changes)` applies DMC theme defaults and registers DMC's
+  pre-render color-scheme hook.
 - `get_config()` returns the current immutable configuration.
 - `reset_config()` restores all defaults. It is primarily useful in tests.
 - `StartupLoadingConfig` is the frozen dataclass containing all options.
@@ -329,120 +429,6 @@ This is expected with automatic `dash_hooks` discovery. Use a dedicated virtual
 environment, uninstall the package where it is not wanted, or call
 `configure(enabled=False)` before constructing those Dash apps.
 
-## Development
-
-Clone the repository, then install the project and test dependencies:
-
-```bash
-uv sync --extra test
-```
-
-Run the tests and example:
-
-```bash
-uv run pytest
-uv run --with dash-ant-design python examples/basic.py
-```
-
-The example uses `dash_antd_components.ConfigProvider` to demonstrate native
-theme persistence, so `dash-ant-design` is an example-only dependency rather
-than a runtime dependency of the plugin.
-
-Build the source distribution and wheel:
-
-```bash
-uv build
-```
-
-## Publishing to PyPI
-
-PyPI does not allow replacing an existing distribution file. Confirm that the
-version in `pyproject.toml` is new before building, then create the artifacts
-from a clean `dist/` directory:
-
-```bash
-rm -rf build dist src/*.egg-info
-uv lock
-uv run --extra test pytest
-uvx ruff check src tests examples
-uv build
-uvx twine check dist/*
-```
-
-Inspect the resulting files before upload:
-
-```bash
-ls -lh dist/
-unzip -l dist/dash_startup_loading_plugin-0.2.0-py3-none-any.whl
-tar -tzf dist/dash_startup_loading_plugin-0.2.0.tar.gz
-uv publish --dry-run dist/*
-```
-
-### TestPyPI
-
-Create a TestPyPI API token, then upload to its legacy upload endpoint:
-
-```bash
-export UV_PUBLISH_TOKEN="pypi-your-test-token"
-uv publish \
-  --publish-url https://test.pypi.org/legacy/ \
-  --check-url https://test.pypi.org/simple/ \
-  dist/*
-unset UV_PUBLISH_TOKEN
-```
-
-Test installation in an isolated environment:
-
-```bash
-uv run --isolated \
-  --index-url https://test.pypi.org/simple/ \
-  --extra-index-url https://pypi.org/simple/ \
-  --with dash-startup-loading-plugin==0.2.0 \
-  python -c "import dash_startup_loading_plugin; print('import ok')"
-```
-
-The extra PyPI index is needed because TestPyPI may not contain the plugin's
-runtime dependencies.
-
-### PyPI with an API token
-
-Create a project-scoped PyPI token and publish the checked artifacts:
-
-```bash
-export UV_PUBLISH_TOKEN="pypi-your-project-token"
-uv publish dist/*
-unset UV_PUBLISH_TOKEN
-```
-
-Do not place tokens in `pyproject.toml`, shell history, source control, or CI
-logs.
-
-### PyPI Trusted Publishing
-
-For CI releases, configure the repository and workflow as a Trusted Publisher
-in the PyPI project settings. The publishing job needs the
-`id-token: write` permission and can upload without a long-lived token:
-
-```yaml
-permissions:
-  contents: read
-  id-token: write
-
-steps:
-  - uses: actions/checkout@v4
-  - uses: astral-sh/setup-uv@v8
-  - run: uv build
-  - run: uv publish --trusted-publishing always
-```
-
-After publishing, verify the release:
-
-```bash
-uv run --isolated \
-  --with dash-startup-loading-plugin==0.2.0 \
-  python -c "import dash_startup_loading_plugin; print('import ok')"
-```
-
 ## License
 
 MIT. See [`LICENSE`](LICENSE).

{dash_startup_loading_plugin-0.2.0 → dash_startup_loading_plugin-0.3.0}/pyproject.toml

@@ -4,25 +4,28 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "dash-startup-loading-plugin"
-version = "0.2.0"
+version = "0.3.0"
 description = "A configurable full-screen startup loading overlay for Dash apps, packaged as a Dash Hooks plugin."
 readme = "README.md"
 requires-python = ">=3.9"
 authors = [
       { name = "Ethan Zhang", email = "ethan.zhang2016@gmail.com" }
 ]
-keywords = ["dash", "plotly", "loading", "plugin", "hooks"]
+keywords = ["dash", "plotly", "loading", "plugin"]
 classifiers = ["Framework :: Dash"]
 license = "MIT"
 license-files = ["LICENSE"]
 dependencies = [
-    "dash>=3.0.3",
+    "dash==4.4.1",
 ]
 
 [project.optional-dependencies]
 test = [
     "pytest>=8",
 ]
+mantine = [
+    "dash-mantine-components>=2.6.0",
+]
 
 [project.entry-points."dash_hooks"]
 dash_startup_loading_plugin = "dash_startup_loading_plugin"

{dash_startup_loading_plugin-0.2.0 → dash_startup_loading_plugin-0.3.0}/src/dash_startup_loading_plugin/__init__.py

@@ -5,11 +5,13 @@ from importlib.metadata import PackageNotFoundError, version
 try:
     __version__ = version("dash-startup-loading-plugin")
 except PackageNotFoundError:  # pragma: no cover - source tree fallback
-    __version__ = "0.2.0"
+    __version__ = "0.3.0"
 
-from .plugin import (  # noqa: E402
+from .plugin import (
     StartupLoadingConfig,
     configure,
+    configure_antd,
+    configure_mantine,
     get_config,
     reset_config,
 )
@@ -18,6 +20,8 @@ __all__ = [
     "StartupLoadingConfig",
     "__version__",
     "configure",
+    "configure_antd",
+    "configure_mantine",
     "get_config",
     "reset_config",
 ]

{dash_startup_loading_plugin-0.2.0 → dash_startup_loading_plugin-0.3.0}/src/dash_startup_loading_plugin/plugin.py

@@ -4,12 +4,13 @@ from __future__ import annotations
 
 import json
 import re
+from collections.abc import Iterable
 from dataclasses import asdict, dataclass, fields, replace
 from functools import lru_cache
 from html import escape
 from importlib.resources import files
 from threading import RLock
-from typing import Any, Iterable
+from typing import Any
 
 from dash import hooks
 
@@ -17,6 +18,9 @@ _OVERLAY_MARKER = "data-dash-startup-loading"
 _BODY_PATTERN = re.compile(r"<body(?:\s[^>]*)?>", flags=re.IGNORECASE)
 _HEAD_END_PATTERN = re.compile(r"</head\s*>", flags=re.IGNORECASE)
 _CONFIG_LOCK = RLock()
+_ANTD_LIGHT_BACKGROUND = "#ffffff"
+_ANTD_DARK_BACKGROUND = "#121212"
+_mantine_prerender_registered = False
 
 
 @dataclass(frozen=True)
@@ -78,8 +82,7 @@ def _validate(config: StartupLoadingConfig) -> StartupLoadingConfig:
     if config.theme_mode not in {"auto", "light", "dark"}:
         raise ValueError("theme_mode must be 'auto', 'light', or 'dark'")
     if config.dash_theme_component_id is not None and (
-        not isinstance(config.dash_theme_component_id, str)
-        or not config.dash_theme_component_id.strip()
+        not isinstance(config.dash_theme_component_id, str) or not config.dash_theme_component_id.strip()
     ):
         raise ValueError("dash_theme_component_id must be None or a non-empty string")
     for name in ("minimum_display_ms", "fade_duration_ms", "spinner_size_px", "spinner_stroke_px"):
@@ -109,6 +112,54 @@ def configure(**changes: Any) -> StartupLoadingConfig:
         return _config
 
 
+def configure_mantine(**changes: Any) -> StartupLoadingConfig:
+    """Configure seamless startup colors for Dash Mantine Components.
+
+    Dash Mantine Components remains an optional dependency. This helper reads
+    its active default theme and registers its pre-render color-scheme hook.
+    Explicit keyword arguments override all integration defaults.
+    """
+
+    try:
+        import dash_mantine_components as dmc
+    except ImportError as error:
+        raise RuntimeError(
+            "configure_mantine requires dash-mantine-components>=2.6.0"
+        ) from error
+
+    pre_render_color_scheme = getattr(dmc, "pre_render_color_scheme", None)
+    if pre_render_color_scheme is None:
+        raise RuntimeError(
+            "configure_mantine requires dash-mantine-components>=2.6.0"
+        )
+
+    theme = dmc.DEFAULT_THEME
+    changes.setdefault("background", theme["white"])
+    changes.setdefault("dark_background", theme["colors"]["dark"][7])
+    changes.setdefault("pending_selector", None)
+
+    global _mantine_prerender_registered
+    with _CONFIG_LOCK:
+        if not _mantine_prerender_registered:
+            pre_render_color_scheme()
+            _mantine_prerender_registered = True
+
+    return configure(**changes)
+
+
+def configure_antd(**changes: Any) -> StartupLoadingConfig:
+    """Configure startup colors for Dash Ant Design.
+
+    Explicit keyword arguments override the integration defaults, including
+    ``background`` and ``dark_background`` when the application's Ant Design
+    theme customizes its light or dark background token.
+    """
+
+    changes.setdefault("background", _ANTD_LIGHT_BACKGROUND)
+    changes.setdefault("dark_background", _ANTD_DARK_BACKGROUND)
+    return configure(**changes)
+
+
 def get_config() -> StartupLoadingConfig:
     """Return the active immutable configuration."""
 
@@ -181,12 +232,7 @@ def _overlay_html(config: StartupLoadingConfig) -> str:
 
 @lru_cache(maxsize=2)
 def _resource_text(name: str) -> str:
-    return (
-        files("dash_startup_loading_plugin")
-        .joinpath("resources", name)
-        .read_text(encoding="utf-8")
-        .strip()
-    )
+    return files("dash_startup_loading_plugin").joinpath("resources", name).read_text(encoding="utf-8").strip()
 
 
 def _inline_head_resources(app_index: str, config: StartupLoadingConfig) -> str:
@@ -218,11 +264,7 @@ def _inject_overlay(app_index: str) -> str:
     body_match = _BODY_PATTERN.search(app_index)
     assert body_match is not None
     position = body_match.end()
-    script = (
-        '<script data-dash-startup-loading-resource="script">'
-        f"{_resource_text('startup-loading.js')}"
-        "</script>"
-    )
+    script = f'<script data-dash-startup-loading-resource="script">{_resource_text("startup-loading.js")}</script>'
     return app_index[:position] + _overlay_html(config) + script + app_index[position:]
 
 

{dash_startup_loading_plugin-0.2.0 → dash_startup_loading_plugin-0.3.0/src/dash_startup_loading_plugin.egg-info}/PKG-INFO

@@ -1,17 +1,19 @@
 Metadata-Version: 2.4
 Name: dash-startup-loading-plugin
-Version: 0.2.0
+Version: 0.3.0
 Summary: A configurable full-screen startup loading overlay for Dash apps, packaged as a Dash Hooks plugin.
 Author-email: Ethan Zhang <ethan.zhang2016@gmail.com>
 License-Expression: MIT
-Keywords: dash,plotly,loading,plugin,hooks
+Keywords: dash,plotly,loading,plugin
 Classifier: Framework :: Dash
 Requires-Python: >=3.9
 Description-Content-Type: text/markdown
 License-File: LICENSE
-Requires-Dist: dash>=3.0.3
+Requires-Dist: dash==4.4.1
 Provides-Extra: test
 Requires-Dist: pytest>=8; extra == "test"
+Provides-Extra: mantine
+Requires-Dist: dash-mantine-components>=2.6.0; extra == "mantine"
 Dynamic: license-file
 
 # dash-startup-loading-plugin
@@ -51,7 +53,7 @@ discovery, resource hooks, and the index hook described in the official
 ## Installation
 
 ```bash
-pip install "dash-startup-loading-plugin>=0.2.0"
+pip install "dash-startup-loading-plugin>=0.3.0"
 ```
 
 The package declares the following entry point:
@@ -66,6 +68,16 @@ package therefore enables the default startup overlay for Dash applications in
 that Python environment; an explicit import is only needed when changing its
 configuration or using its Python API.
 
+## What's new in 0.3.0
+
+- Adds `configure_antd()` with matching `#ffffff` and `#121212` loading
+  backgrounds plus explicit light/dark overrides.
+- Adds `configure_mantine()` with theme defaults sourced from Dash Mantine
+  Components and its pre-render color-scheme hook.
+- Updates the Dash Ant Design example for the structured
+  `ConfigProvider.theme.algorithm` API.
+- Adds a Dash Mantine Components example with persisted theme switching.
+
 ## What's new in 0.2.0
 
 - Resolves the loading background before first paint from a persisted
@@ -104,25 +116,33 @@ from dash import Dash, html
 from dash_startup_loading_plugin import configure
 
 configure(
-    required_selectors=["#page-header", "#sidebar-menu"],
+    required_selectors=["#usage-header", "#usage-sidebar-menu"],
     pending_selector="[data-dac-async-placeholder]",
     timeout_ms=6000,
-    minimum_display_ms=200,
     fade_duration_ms=160,
-    color="#1677ff",
-    dark_color="#4096ff",
 )
 
 app = Dash(__name__)
 app.layout = html.Div(
     [
-        html.Header("Dashboard", id="page-header"),
-        html.Nav("Navigation", id="sidebar-menu"),
+        html.Header("Dashboard", id="usage-header"),
+        html.Nav("Navigation", id="usage-sidebar-menu"),
     ]
 )
 ```
 
-See [`examples/basic.py`](examples/basic.py) for a runnable example.
+Runnable examples:
+
+- [`examples/basic.py`](examples/basic.py): Dash Ant Design theme persistence.
+- [`examples/mantine_theme.py`](examples/mantine_theme.py):
+  Dash Mantine Components with a persisted light/dark theme switch.
+
+Run the Mantine example with:
+
+```bash
+pip install -e ".[mantine]"
+python examples/mantine_theme.py
+```
 
 ## Readiness behavior
 
@@ -192,29 +212,105 @@ parsed. This isolates the overlay styling without changing classes or data
 attributes owned by Tailwind, Dash Mantine Components, or the application.
 The stylesheet also adjusts its animation for `prefers-reduced-motion`.
 
+### Dash Mantine Components
+
+Dash Mantine Components 2.6 and later includes `ColorSchemeToggle`, which
+switches the active color scheme without a callback and persists it in
+`mantine-color-scheme-value`. The startup plugin reads that value before Dash
+and React mount. To make the loading transition seamless, use Mantine's current
+default dark body color for the overlay:
+
+```python
+import dash_mantine_components as dmc
+from dash_startup_loading_plugin import configure_mantine
+
+configure_mantine()
+
+app.layout = dmc.MantineProvider(
+    [
+        dmc.ColorSchemeToggle(
+            lightIcon=dmc.Text("☀"),
+            darkIcon=dmc.Text("☾"),
+        ),
+        dmc.Text("Application content", id="app-ready"),
+    ],
+    defaultColorScheme="auto",
+)
+```
+
+See
+[`examples/mantine_theme.py`](examples/mantine_theme.py)
+for the complete runnable example.
+
+`configure_mantine()` keeps DMC optional. When used, it registers DMC's
+pre-render color-scheme hook, disables the Dash Ant Design placeholder check,
+and derives the light and dark loading backgrounds from DMC's active default
+theme. Any explicit configuration still takes precedence:
+
+```python
+configure_mantine(dark_background="#202020")
+```
+
 ### Dash Ant Design persistence
 
-`dash_antd_components.ConfigProvider` can persist its `theme` prop. The startup
-plugin reads that same Dash persistence record on the next page load:
+Current `dash_antd_components.ConfigProvider.theme` accepts a structured theme
+configuration whose `algorithm` is `"default"`, `"dark"`, `"compact"`, or an
+array of those values. Persist a user-facing system/light/dark selector, resolve
+the system preference in a clientside callback, and store the semantic choice
+in the small conventional `localStorage["theme"]` value that the startup plugin
+reads before Dash mounts:
 
 ```python
 import dash_antd_components as dac
-from dash_startup_loading_plugin import configure
+from dash import Input, Output, clientside_callback
+from dash_startup_loading_plugin import configure_antd
 
-configure(dash_theme_component_id="theme-provider")
+configure_antd()
 
 provider = dac.ConfigProvider(
-    app_content,
+    [
+        app_content,
+        dac.Segmented(
+            id="theme-mode",
+            options=["system", "light", "dark"],
+            value="system",
+            persistence=True,
+            persisted_props=["value"],
+            persistence_type="local",
+        ),
+    ],
     id="theme-provider",
-    persistence=True,
-    persisted_props=["theme"],
-    persistence_type="local",
+    theme={"algorithm": "default"},
+)
+
+clientside_callback(
+    """function(mode) {
+        localStorage.setItem("theme", JSON.stringify(mode));
+        const dark = mode === "dark" || (
+            mode === "system"
+            && window.matchMedia("(prefers-color-scheme: dark)").matches
+        );
+        return {algorithm: dark ? "dark" : "default"};
+    }""",
+    Output("theme-provider", "theme"),
+    Input("theme-mode", "value"),
+)
+```
+
+The selector owns the semantic `"system"` state; `ConfigProvider` receives only
+the algorithms allowed by its current API. `configure_antd()` uses `#ffffff`
+and `#121212`, matching the component library's default light and dark
+backgrounds. If the application customizes either background, pass the same
+values explicitly:
+
+```python
+configure_antd(
+    background="#f5f5f5",
+    dark_background="#202020",
 )
 ```
 
-Update `theme-provider.theme` from a regular or clientside callback. Dash stores
-the UI edit, `ConfigProvider` restores it after mount, and the startup plugin
-uses it for the loading background before mount. See
+See
 [`examples/basic.py`](examples/basic.py) for the complete switcher.
 
 ### Custom loader markup
@@ -242,12 +338,18 @@ configuration. Never populate it with user input.
 from dash_startup_loading_plugin import (
     StartupLoadingConfig,
     configure,
+    configure_antd,
+    configure_mantine,
     get_config,
     reset_config,
 )
 ```
 
 - `configure(**changes)` validates and applies a partial configuration update.
+- `configure_antd(**changes)` matches the loading backgrounds to Dash Ant
+  Design's light and dark themes and accepts explicit overrides.
+- `configure_mantine(**changes)` applies DMC theme defaults and registers DMC's
+  pre-render color-scheme hook.
 - `get_config()` returns the current immutable configuration.
 - `reset_config()` restores all defaults. It is primarily useful in tests.
 - `StartupLoadingConfig` is the frozen dataclass containing all options.
@@ -345,120 +447,6 @@ This is expected with automatic `dash_hooks` discovery. Use a dedicated virtual
 environment, uninstall the package where it is not wanted, or call
 `configure(enabled=False)` before constructing those Dash apps.
 
-## Development
-
-Clone the repository, then install the project and test dependencies:
-
-```bash
-uv sync --extra test
-```
-
-Run the tests and example:
-
-```bash
-uv run pytest
-uv run --with dash-ant-design python examples/basic.py
-```
-
-The example uses `dash_antd_components.ConfigProvider` to demonstrate native
-theme persistence, so `dash-ant-design` is an example-only dependency rather
-than a runtime dependency of the plugin.
-
-Build the source distribution and wheel:
-
-```bash
-uv build
-```
-
-## Publishing to PyPI
-
-PyPI does not allow replacing an existing distribution file. Confirm that the
-version in `pyproject.toml` is new before building, then create the artifacts
-from a clean `dist/` directory:
-
-```bash
-rm -rf build dist src/*.egg-info
-uv lock
-uv run --extra test pytest
-uvx ruff check src tests examples
-uv build
-uvx twine check dist/*
-```
-
-Inspect the resulting files before upload:
-
-```bash
-ls -lh dist/
-unzip -l dist/dash_startup_loading_plugin-0.2.0-py3-none-any.whl
-tar -tzf dist/dash_startup_loading_plugin-0.2.0.tar.gz
-uv publish --dry-run dist/*
-```
-
-### TestPyPI
-
-Create a TestPyPI API token, then upload to its legacy upload endpoint:
-
-```bash
-export UV_PUBLISH_TOKEN="pypi-your-test-token"
-uv publish \
-  --publish-url https://test.pypi.org/legacy/ \
-  --check-url https://test.pypi.org/simple/ \
-  dist/*
-unset UV_PUBLISH_TOKEN
-```
-
-Test installation in an isolated environment:
-
-```bash
-uv run --isolated \
-  --index-url https://test.pypi.org/simple/ \
-  --extra-index-url https://pypi.org/simple/ \
-  --with dash-startup-loading-plugin==0.2.0 \
-  python -c "import dash_startup_loading_plugin; print('import ok')"
-```
-
-The extra PyPI index is needed because TestPyPI may not contain the plugin's
-runtime dependencies.
-
-### PyPI with an API token
-
-Create a project-scoped PyPI token and publish the checked artifacts:
-
-```bash
-export UV_PUBLISH_TOKEN="pypi-your-project-token"
-uv publish dist/*
-unset UV_PUBLISH_TOKEN
-```
-
-Do not place tokens in `pyproject.toml`, shell history, source control, or CI
-logs.
-
-### PyPI Trusted Publishing
-
-For CI releases, configure the repository and workflow as a Trusted Publisher
-in the PyPI project settings. The publishing job needs the
-`id-token: write` permission and can upload without a long-lived token:
-
-```yaml
-permissions:
-  contents: read
-  id-token: write
-
-steps:
-  - uses: actions/checkout@v4
-  - uses: astral-sh/setup-uv@v8
-  - run: uv build
-  - run: uv publish --trusted-publishing always
-```
-
-After publishing, verify the release:
-
-```bash
-uv run --isolated \
-  --with dash-startup-loading-plugin==0.2.0 \
-  python -c "import dash_startup_loading_plugin; print('import ok')"
-```
-
 ## License
 
 MIT. See [`LICENSE`](LICENSE).

dash_startup_loading_plugin-0.3.0/src/dash_startup_loading_plugin.egg-info/requires.txt

@@ -0,0 +1,7 @@
+dash==4.4.1
+
+[mantine]
+dash-mantine-components>=2.6.0
+
+[test]
+pytest>=8

{dash_startup_loading_plugin-0.2.0 → dash_startup_loading_plugin-0.3.0}/tests/test_plugin.py

@@ -1,12 +1,21 @@
 import html
 import json
 import re
+import sys
 from importlib.resources import files
+from types import SimpleNamespace
 
 import pytest
 from dash import Dash
 from dash import html as dash_html
-from dash_startup_loading_plugin import configure, get_config, reset_config
+
+from dash_startup_loading_plugin import (
+    configure,
+    configure_antd,
+    configure_mantine,
+    get_config,
+    reset_config,
+)
 from dash_startup_loading_plugin.plugin import _inject_overlay
 
 
@@ -99,6 +108,40 @@ def test_configuration_validation():
     assert get_config().required_selectors == ("#react-entry-point",)
 
 
+def test_mantine_configuration_uses_semantic_theme_defaults(monkeypatch):
+    calls = []
+    fake_dmc = SimpleNamespace(
+        DEFAULT_THEME={
+            "white": "#fff",
+            "colors": {"dark": [""] * 7 + ["#242424"]},
+        },
+        pre_render_color_scheme=lambda: calls.append("registered"),
+    )
+    monkeypatch.setitem(sys.modules, "dash_mantine_components", fake_dmc)
+    monkeypatch.setattr(
+        "dash_startup_loading_plugin.plugin._mantine_prerender_registered",
+        False,
+    )
+
+    config = configure_mantine(minimum_display_ms=200)
+
+    assert config.background == "#fff"
+    assert config.dark_background == "#242424"
+    assert config.pending_selector is None
+    assert config.minimum_display_ms == 200
+    assert calls == ["registered"]
+
+
+def test_antd_configuration_matches_library_backgrounds_and_allows_overrides():
+    config = configure_antd()
+    assert config.background == "#ffffff"
+    assert config.dark_background == "#121212"
+
+    config = configure_antd(background="#f5f5f5", dark_background="#202020")
+    assert config.background == "#f5f5f5"
+    assert config.dark_background == "#202020"
+
+
 def test_resolved_startup_theme_controls_overlay_colors():
     css = (
         files("dash_startup_loading_plugin")

dash_startup_loading_plugin-0.2.0/src/dash_startup_loading_plugin.egg-info/requires.txt

@@ -1,4 +0,0 @@
-dash>=3.0.3
-
-[test]
-pytest>=8