@supersoniks/concorde 4.4.2 → 4.5.1

package/docs/src/docs/_getting-started/theming.md

@@ -1,91 +0,0 @@
-# Adding styles
-
-## Normal Behavior
-
-No style crosses the shadow root of a component, except for inheritable properties (which have the "inherit" property possible) and CSS variables.
-Properties integrated via a "[slot](https://developer.mozilla.org/en/docs/Web/HTML/Element/slot)" remain stylizable in a conventional way.
-
-- **During creation / from the inside:**
-  - We edit the [static "styles" property of the lit component](https://lit.dev/docs/components/styles/), which can also reference shared and dynamic styles.
-    These styles are scoped and do not impact the outside.
-  - We use CSS variables as the value of properties intended to be customized from the outside.
-    For each variable, we define a default value to have a simple but consistent base style.
-  - We only rewrite inheritable properties with hard values if they are truly specific to the component.
-  - The `<style>` tag as a direct child can be used as a last resort, especially if there is a need for particularly dynamic customization. Performance is reduced.
-- **During use / from the outside:**
-  We define values for **inheritable CSS properties** (e.g., font-\_, color...) using tools like Tailwind.
-  We modify the value of **CSS variables** used by the component.
-
-## Choosing Style Presets via Reactive Properties:
-
-The declaration of reactive properties is useful for selecting a particular configuration that mostly affects a set of properties.
-
-For example, a `size` property (xs, sm, md, xl) will affect margins, font, line heights to align them with the corresponding CSS vars, which can be customized using the methods mentioned earlier if necessary.
-
-It is recommended to use the `{reflect: true}` property for reactive properties that have an associated style on the `:host()`. For example: `:host([type='primary']){...}`
-
-☢️ **Caution:** Passing class names via reactive properties / HTML attributes of the component should be avoided as it can quickly lead to difficult-to-manage situations.
-
-#### CSS "display" Property
-
-By default, the display property is `inline`.
-Therefore, be careful to define it according to the needs, as one might mistakenly expect it to be `block` as with a regular `<div>`.
-
-☢️ **Caution:** Defining the `display` property as `contents` may seem attractive at first, but:
-
-- It almost always leads to the creation of wrappers to style the content (instead of using `:host`).
-- It is no longer possible to directly add classes to the component or style it from the outside.
-  Ultimately, the amount of code to write increases significantly.
-
-## TAILWIND Functional Classes
-
-[tailwind](https://tailwindcss.com/) has been integrated into Concorde and is available in scoped components (with Shadow DOM).
-To use it, you need to import the following:
-
-<sonic-code language="javascript">
-  <template>
-import { tailwind } from "@supersoniks/concorde/la-billetterie/ui/theme/theme";
-  </template>
-</sonic-code>
-
-Then include the `tailwind` style in the static `styles` property of the component:
-
-<sonic-code language="javascript">
-  <template>
-static styles = [tailwind];
-  </template>
-</sonic-code>
-
-Finally, use it in the HTML within the render function:
-
-<sonic-code language="html">
-  <template>
-<p class="m-2">A paragraph with margin</p>
-  </template>
-</sonic-code>
-
-The colors from Concorde's theme are referenced in Tailwind's theme.
-
-## Operation without Shadow DOM
-
-### Usefulness
-
-This operation is particularly useful when it comes to **adding behavior to a simple existing element**.
-It may also become necessary to establish **compatibility with a traditional JS library**.
-
-For example, with a text input:
-
-- Trigger automatic data or filter update when typing text.
-- Automatic formatting.
-- Constraints that cannot be handled by native methods.
-
-### Consequences
-
-If there is no shadow DOM (see the **noShadowDom** property of **Subscriber**):
-
-- Styling using the static "styles" property of the lit component will not be applied.
-- The element and its content can be styled in a traditional manner.
-
-For example, the components `queue`, `list`, and `fetch` do not have a shadow DOM.
-
-ℹ️ **Note:** Specifically in this case, it may be useful to set the `display` property to `contents`.

package/docs/src/docs/_misc/dataProviderKey.md

@@ -1,135 +0,0 @@
-# DataProviderKey
-
-The `DataProviderKey<T>` utility provides type-safe navigation through composite data structures. Each property or index access extends the path, and the final key can be retrieved via `toString()` or the `path` property.
-
-For a **single HTTP path string** (no dot-syntax), see [Endpoint](#docs/_misc/endpoint.md/endpoint).
-
-## Principle
-
-`DataProviderKey` uses a Proxy to intercept property access and build a cumulative path string. TypeScript infers the nested type at each level, so `myKey.items[0]` is correctly typed as `DataProviderKey<Item>` when `items` is `Item[]`.
-
-## Usage
-
-### Import
-
-<sonic-code language="typescript">
-  <template>
-import { DataProviderKey } from "@supersoniks/concorde/dataProviderKey";
-  </template>
-</sonic-code>
-
-### Basic example
-
-<sonic-code language="typescript">
-  <template>
-type Item = { id: string; name: string };
-//
-type Data = {
-  items: Item[];
-  count: number;
-};
-//
-const myKey = new DataProviderKey&lt;Data&gt;("data").items[0];
-// Equivalent to: new DataProviderKey&lt;Item&gt;("data.items.0")
-myKey.toString();  // "data.items.0"
-myKey.path;        // same value
-// myKey is typed as DataProviderKey&lt;Item&gt;
-  </template>
-</sonic-code>
-
-### Object property access
-
-<sonic-code language="typescript">
-  <template>
-const key = new DataProviderKey&lt;Data&gt;("data");
-const countKey = key.count;
-countKey.path;        // "data.count"
-countKey.toString();  // "data.count"
-  </template>
-</sonic-code>
-
-### Array index access
-
-<sonic-code language="typescript">
-  <template>
-const itemsKey = new DataProviderKey&lt;Data&gt;("data").items;
-itemsKey.path;  // "data.items"
-// itemsKey is DataProviderKey&lt;Item[]&gt;
-//
-const firstItem = itemsKey[0];
-firstItem.path;  // "data.items.0"
-// firstItem is DataProviderKey&lt;Item&gt;
-  </template>
-</sonic-code>
-
-### Dynamic paths
-
-Use placeholders `${prop}` or `{$prop}` in the path string. The path is resolved at runtime from the component's properties. The type remains declarative:
-
-<sonic-code language="typescript">
-  <template>
-type User = { name: string; email: string };
-//
-// Path resolved from component.userIndex at runtime
-@subscribe(new DataProviderKey&lt;User&gt;("users.${userIndex}"))
-@state()
-user: User | null = null;
-  </template>
-</sonic-code>
-
-## Path retrieval
-
-The final path is built by concatenating each accessed property with a dot:
-
-- `new DataProviderKey<T>("base")` → `"base"`
-- `key.prop` → `"base.prop"`
-- `key.items[0]` → `"base.items.0"`
-
-Use `toString()` or `path` to get the full path string:
-
-<sonic-code language="typescript">
-  <template>
-const key = new DataProviderKey&lt;Data&gt;("data").count;
-const pathString = key.toString();  // "data.count"
-const pathProp = key.path;           // "data.count"
-  </template>
-</sonic-code>
-
-## Use cases
-
-- **Type-safe bindings**: paths for `@bind`, `@subscribe`, `@publish`
-- **Dynamic paths**: reusable keys with `${...}` placeholders
-- **Form fields**: form data paths with compile-time checking
-
-## Integration with @subscribe and @publish
-
-Use `DataProviderKey` with `@subscribe` (read-only) or `@publish` (write-only). The decorated property **must** match the key’s value type:
-
-<sonic-code language="typescript">
-  <template>
-import { subscribe } from "@supersoniks/concorde/decorators";
-import { DataProviderKey } from "@supersoniks/concorde/dataProviderKey";
-//
-type FormData = { email: string };
-const formKey = new DataProviderKey&lt;FormData&gt;("formData");
-//
-@customElement("user-form")
-export class UserForm extends LitElement {
-  @subscribe(formKey.email)
-  @state()
-  email = "";
-//
-  render() {
-    return html`&lt;input .value=${this.email} @input=${(e) => this.email = (e.target as HTMLInputElement).value}&gt;`;
-  }
-}
-  </template>
-</sonic-code>
-
-Both decorators support dynamic paths: `"base.${prop}"` in the constructor. A wrong property type (e.g. `number` for `DataProviderKey<string>`) is a TypeScript error.
-
-## Notes
-
-- Function properties are excluded from navigation (no `key.method()` chaining)
-- Primitives have no navigable properties
-- The `path` property and `toString()` are equivalent for retrieving the key

package/docs/src/docs/_misc/endpoint.md

@@ -1,42 +0,0 @@
-# Endpoint
-
-`Endpoint<T, U>` describes a single HTTP path (or a path accepted by `API.get`) and carries the expected response type `T`. Unlike [DataProviderKey](#docs/_misc/dataProviderKey.md/dataProviderKey), there is no dot-navigation: the path is one string.
-
-The optional second generic `U` (default `any`) describes host properties used to resolve dynamic segments in the path (`${…}` / `{$…}`), for example with the [@get](#docs/_decorators/get.md/get) decorator.
-
-## Import
-
-<sonic-code language="typescript">
-  <template>
-import { Endpoint } from "@supersoniks/concorde/utils/endpoint";
-  </template>
-</sonic-code>
-
-## Construction
-
-<sonic-code language="typescript">
-  <template>
-const users = new Endpoint&lt;User[]&gt;("users?limit=10");
-users.path; // "users?limit=10"
-//
-const one = new Endpoint&lt;User, { userId: string }&gt;("users/${userId}");
-// `userId` on the host class is observed when used with @get
-  </template>
-</sonic-code>
-
-## Normalization
-
-`Endpoint.normalizePath` trims the string, rejects an empty path, strips leading slashes for paths relative to `serviceURL`, collapses duplicate slashes, and validates absolute `http(s)://` URLs.
-
-## Publisher key for payloads
-
-`getDataProviderKey()` returns a typed publisher key whose `path` matches the endpoint path (payload typing follows `ApiGetResult` for this endpoint). Useful when pairing `@get` with `@publish` / `@subscribe` (see [@get](#docs/_decorators/get.md/get)).
-
-## Data-provider paths
-
-`Endpoint.looksLikeDataProviderPath(path)` returns true for strings shaped like `dataProvider(id)…`, which `API.get` can resolve without HTTP.
-
-## See also
-
-- [@get](#docs/_decorators/get.md/get) — decorator that uses `Endpoint<T>`
-- [DataProviderKey](#docs/_misc/dataProviderKey.md/dataProviderKey) — typed publisher paths (dot notation)

package/docs/src/docs/_misc/templates-demo.md

@@ -1,19 +0,0 @@
-# Templates Demo
-
-Some test/demos
-
-## States
-
-<sonic-states-demo></sonic-states-demo>
-
-## Queue
-
-
-<sonic-queue-demo></sonic-queue-demo>
-
-## Ressources liées
-
-- [Router](#core/components/functional/router/router.md/router)
-- [States](#core/components/functional/states/states.md/states)
-- [Queue](#core/components/functional/queue/queue.md/queue)
-