Metadata-Version: 2.5
Name: spaday-fluent
Version: 0.2.0
Summary: Fluent for spaday
Project-URL: Repository, https://github.com/1kbgz/spaday-fluent
Project-URL: Homepage, https://github.com/1kbgz/spaday-fluent
Author-email: 1kbgz <dev@1kbgz.com>
License: Apache-2.0
License-File: LICENSE
Classifier: Development Status :: 3 - Alpha
Classifier: Programming Language :: Python
Classifier: Programming Language :: Python :: 3
Classifier: Programming Language :: Python :: 3.11
Classifier: Programming Language :: Python :: 3.12
Classifier: Programming Language :: Python :: 3.13
Classifier: Programming Language :: Python :: 3.14
Classifier: Programming Language :: Python :: Implementation :: CPython
Classifier: Programming Language :: Python :: Implementation :: PyPy
Requires-Python: >=3.11
Requires-Dist: spaday<1.0,>=0.10.0
Provides-Extra: develop
Requires-Dist: build; extra == 'develop'
Requires-Dist: bump-my-version; extra == 'develop'
Requires-Dist: check-dist; extra == 'develop'
Requires-Dist: codespell; extra == 'develop'
Requires-Dist: hatch-js; extra == 'develop'
Requires-Dist: hatchling; extra == 'develop'
Requires-Dist: httpx; extra == 'develop'
Requires-Dist: mdformat; extra == 'develop'
Requires-Dist: mdformat-tables>=1; extra == 'develop'
Requires-Dist: pydantic>=2; extra == 'develop'
Requires-Dist: pytest; extra == 'develop'
Requires-Dist: pytest-cov; extra == 'develop'
Requires-Dist: ruff; extra == 'develop'
Requires-Dist: starlette; extra == 'develop'
Requires-Dist: transports; extra == 'develop'
Requires-Dist: twine; extra == 'develop'
Requires-Dist: ty; extra == 'develop'
Requires-Dist: uv; extra == 'develop'
Requires-Dist: uvicorn; extra == 'develop'
Requires-Dist: websockets; extra == 'develop'
Requires-Dist: wheel; extra == 'develop'
Provides-Extra: examples
Requires-Dist: pydantic>=2; extra == 'examples'
Requires-Dist: starlette; extra == 'examples'
Requires-Dist: transports; extra == 'examples'
Requires-Dist: uvicorn; extra == 'examples'
Requires-Dist: websockets; extra == 'examples'
Description-Content-Type: text/markdown

<a href="https://github.com/1kbgz/spaday-fluent">
  <picture>
    <source media="(prefers-color-scheme: dark)" srcset="https://github.com/1kbgz/spaday-fluent/raw/main/docs/img/logo-dark.webp?raw=true">
    <img alt="spaday-fluent logo, Fluent 2 mark inside a browser window" src="https://github.com/1kbgz/spaday-fluent/raw/main/docs/img/logo-light.webp?raw=true" width="700">
  </picture>
</a>

Typed [Fluent UI web components](https://github.com/microsoft/fluentui/tree/master/packages/web-components) and browser assets for [spaday](https://github.com/1kbgz/spaday).

[![Build Status](https://github.com/1kbgz/spaday-fluent/actions/workflows/build.yaml/badge.svg?branch=main&event=push)](https://github.com/1kbgz/spaday-fluent/actions/workflows/build.yaml)
[![codecov](https://codecov.io/gh/1kbgz/spaday-fluent/branch/main/graph/badge.svg)](https://codecov.io/gh/1kbgz/spaday-fluent)
[![License](https://img.shields.io/github/license/1kbgz/spaday-fluent)](https://github.com/1kbgz/spaday-fluent)
[![PyPI](https://img.shields.io/pypi/v/spaday-fluent.svg)](https://pypi.python.org/pypi/spaday-fluent)

[![Preview of Fluent components in spaday rendering a sprint hub](https://raw.githubusercontent.com/1kbgz/spaday-fluent/main/docs/img/preview.webp)](https://1kbgz.github.io/spaday-fluent/lite/)

## Overview

```python
from spaday import SetField, element, serve
from spaday_fluent import FluentBadge, FluentButton

page = element("div").child(
    FluentButton(appearance="primary").text("Approve").on("click", SetField("state", "approved")),
    FluentBadge(color="brand").bind("textContent", "state"),
)
serve(page, packages=["fluent"], store={"state": "pending"})
```

Every element of `@fluentui/web-components` has a typed class generated from its Custom Elements
Manifest, so props, events and slots are checked when you author the tree; enum props such as
`appearance` carry their choices. Installing the package does not inject assets; select it with
`packages=["fluent"]` or pass the exported `package` descriptor.

## Generic controls

Eleven of the 13 generic controls in `spaday.ui` render as Fluent elements when a page selects this
package. Fluent Web Components 3.1.3 has no number or date control, so `NumberInput` and `DateInput`
use spaday's marked native fallback. The mapping is exported as `DESIGN`; the shared conformance page
checks every control, value updates, visible radio labels, validation state, and dialog behavior in a
browser.

## Theming

Fluent's design tokens are CSS custom properties. The stylesheet carries Fluent's light and dark
themes and maps spaday's `--spa-*` shell palette onto them, so restyling Fluent restyles the shell
and every other spaday component package with it. `TOKENS` lists the Fluent tokens wired to the
palette, each settable through `css()`:

```python
App().css(colorBrandBackground="#0C4253")
```

The dark theme follows spaday's page mode: a `wa-dark` class on the root (for example
`App(...).bind_root_class("wa-dark", "dark")`) or on any island switches it, and `wa-light` flips a
nested island back. A theme applied with Fluent's own `setTheme()` takes precedence.

## Sharing Fluent with your own library

Fluent registers global custom element names, so a second copy on the page throws from
`customElements.define`. The package serves Fluent's modules under their own bare specifiers —
`@fluentui/web-components`, `@fluentui/web-components/button.js` and the rest of its exports — along
with `@microsoft/fast-element`, which a library extending Fluent's classes has to share, and
`@fluentui/tokens`, through the page's import map. A library built on Fluent that leaves those
imports out of its bundle (`external: ["@fluentui/web-components", "@microsoft/fast-element"]` with
esbuild) gets this copy, and nothing registers twice.

## Browser examples

- [Open the standard app](https://1kbgz.github.io/spaday-fluent/lite/) ([source](spaday_fluent/example.py)).
- [Open the complete component gallery](https://1kbgz.github.io/spaday-fluent/lite/?example=gallery) ([source](spaday_fluent/gallery.py)).

Both run Python locally through Pyodide; no install or server is required.

## Run examples locally

```bash
python -m pip install -e ".[examples]"
python -m spaday_fluent.example
python -m spaday_fluent.gallery
```

Open `http://127.0.0.1:8024` for the standard sprint-command-center app or `http://127.0.0.1:8025` for the
component gallery. The standard app includes a task board streamed from Python, endpoint-backed task
creation and completion, live activity and presence, bound forms, tabs, overlays, and shared dark-theme
state. The gallery includes every generated Fluent component and a highlighted Python snippet for each
component family.

Both pass the local package descriptor directly, so they do not install or resolve the integration from
GitHub.

> [!NOTE]
> This library was generated using [copier](https://copier.readthedocs.io/en/stable/) from the [Base Python Project Template repository](https://github.com/python-project-templates/base).
