@supersoniks/concorde 5.1.1 → 5.1.3

package/src/docs/_getting-started/ai-agents.md

@@ -1,76 +0,0 @@
-# AI agents (skills & AGENTS.md)
-
-Concorde ships **skills**, **rules**, and a root **`AGENTS.md`** so Cursor, JetBrains AI Assistant, and other coding agents follow framework patterns (DataProvider, decorators, short imports, scope, theme, migrations).
-
-On a [starter](#docs/_getting-started/concorde-outside.md/concorde-outside) project, run `yarn ai:sync` after install. On a [manual / brownfield](#docs/_getting-started/concorde-manual-install.md/concorde-manual-install) project, install Concorde first, then use `ai-init` below.
-
-## Dedicated commands
-
-| Context | Command |
-|---------|---------|
-| [create-concorde-ts-starter](https://www.npmjs.com/package/@supersoniks/create-concorde-ts-starter) project | `yarn ai:sync` |
-| Any consumer app (after `yarn add @supersoniks/concorde`) | `node node_modules/@supersoniks/concorde/scripts/ai-init.mjs` |
-| Concorde repo (contributors) | `yarn ai-init` |
-
-<sonic-code language="shell">
-  <template>
-# Starter (from project root)
-yarn ai:sync
-
-# Manual / existing project
-node node_modules/@supersoniks/concorde/scripts/ai-init.mjs
-  </template>
-</sonic-code>
-
-## Useful flags
-
-| Flag | Effect |
-|------|--------|
-| `--skip-agents` | Never write `AGENTS.md` (skills / rules only) |
-| `--merge-agents` | Opt-in: keep the project preamble and append / refresh the Concorde block |
-| `--force-agents` | Opt-in: **replace** the whole `AGENTS.md` (destructive) |
-| `--overlay <dir>` | Extra rules/skills + optional `AGENTS.concorde.md` for project-only Concorde agent notes |
-| `--cursor-only` | Install only `.cursor/skills` and `.cursor/rules` |
-| `--jetbrains-only` | Install only `.aiassistant/rules/` |
-
-## `AGENTS.md` policy (non-invasive)
-
-| Situation | Default |
-|-----------|---------|
-| No `AGENTS.md` | Create the Concorde guide |
-| File with `<!-- concorde-ai -->` | Refresh the managed zone only |
-| File **without** marker (project notes) | **Left untouched** — skills / rules are enough |
-| `--merge-agents` / `--force-agents` / `--skip-agents` | See flags above |
-
-```text
-[optional project preamble — short, project-only]
-<!-- concorde-ai -->
-<package ai/AGENTS.md>
-[--- + overlay AGENTS.concorde.md]
-```
-
-Everything **after** `<!-- concorde-ai -->` is replaced on each `ai-init` run (idempotent). Do not paste a full copy of the Concorde guide above the marker — put project-specific notes in `AGENTS.concorde.md` (overlay). If the preamble duplicates package `AGENTS.md`, `ai-init` slims or drops it and prints a warning. Legacy filenames `AGENTS.overlay.md` / `AGENTS.starter.md` are still accepted with a deprecation warning.
-
-## What gets installed
-
-| Path | Role |
-|------|------|
-| `AGENTS.md` | Created only if missing; existing project-owned files are left alone unless `--merge-agents` / `--force-agents` |
-| `.cursor/skills/concorde/` | Core Lit + DataProvider patterns |
-| `.cursor/skills/concorde-imports/` | Short `@supersoniks/concorde/…` import paths |
-| `.cursor/skills/concorde-scope/` | `serviceURL`, `formDataProvider`, API configuration |
-| `.cursor/skills/concorde-theme/` | `sonic-theme` and `--sc-*` tokens |
-| `.cursor/skills/concorde-menu/` | `sonic-menu` navigation |
-| `.cursor/skills/concorde-get-set-dp/` | `get` / `set` / `dp` and `DataProviderKey` migration |
-| `.cursor/rules/concorde.mdc` | Cursor rules (always-on patterns) |
-| `.aiassistant/rules/concorde.md` | JetBrains AI Assistant rules |
-
-## Workflow
-
-1. **Starter project:** [Installation](#docs/_getting-started/concorde-outside.md/concorde-outside) — `yarn ai:sync` is wired in the kit.
-2. **Existing / manual Vite project:** [Manual installation](#docs/_getting-started/concorde-manual-install.md/concorde-manual-install), then **`ai-init`** after `yarn add @supersoniks/concorde`.
-3. Commit `.cursor/` and `.aiassistant/` (and `AGENTS.md` only if you opted in / it was created) if your team shares agent settings.
-4. Re-run the same command when you bump `@supersoniks/concorde` to refresh skills from `node_modules/@supersoniks/concorde/ai/`.
-5. In Cursor, skills under `.cursor/skills/` are picked up automatically; mention a skill in chat for focused tasks (e.g. migration → `concorde-get-set-dp`).
-
-Source files in the npm package: `node_modules/@supersoniks/concorde/ai/` (see also `ai/README.md` in the [Concorde repository](https://github.com/supersoniks/concorde)).

package/src/docs/_getting-started/concorde-manual-install.md

@@ -1,133 +0,0 @@
-# Manual installation (Vite)
-
-> **Legacy** — for brownfield apps or custom stacks. New projects should use the [starter](#docs/_getting-started/concorde-outside.md/concorde-outside).
-
-## Brand New Vite Project
-
-Tailwind configuration is not covered here yet.
-
-### Creating the Project
-
-<sonic-code language="shell">
-  <template>
-# Pure JavaScript project
-yarn create vite --template vanilla-js
-# TypeScript project
-# (it is recommended to use this approach, which installs Lit separately if needed, via "yarn add lit")
-yarn create vite --template vanilla-ts
-# TypeScript + Lit project
-# (creating new web components, for example, to extend the fetch or subscriber mixins)
-yarn create vite --template lit-ts
-  </template>
-</sonic-code>
-
-Using Lit with TypeScript requires the following configuration in the "compilerOptions" section of the `tsconfig.json` file:
-
-<sonic-code language="json">
-  <template>
-"experimentalDecorators": true,
-"useDefineForClassFields": false
-  </template>
-</sonic-code>
-
-### Installing Concorde
-
-Navigate to the project folder created and perform the installation:
-
-<sonic-code language="shell">
-  <template>
-yarn add @supersoniks/concorde
-  </template>
-</sonic-code>
-
-Agent skills (`AGENTS.md`, Cursor / JetBrains): see [AI agents](#docs/_getting-started/ai-agents.md/ai-agents) — run `node node_modules/@supersoniks/concorde/scripts/ai-init.mjs` after install.
-
-### Development / Build
-
-<sonic-code language="shell">
-  <template>
-# Development (you can add `--host` after the command chain in package.json's dev script instead of typing it each time as shown below)
-yarn dev --host
-# Build
-yarn build
-  </template>
-</sonic-code>
-
-## Shortcut Imports
-
-Shortcut imports work by default in JavaScript, but in TypeScript, they are activated by choice as they inject data into *tsconfig.json*. Here is the command:
-
-<sonic-code language="shell">
-  <template>
-npx concorde enable-short-paths
-  </template>
-</sonic-code>
-
-Shortcut imports replace the actual paths with aliases as follows:
-
-* `@supersoniks/concorde/core/components/functional_or_ui/component/component` becomes `@supersoniks/concorde/functional_or_ui/component`
-* `@supersoniks/concorde/core/mixins_or_utils/class_name` becomes `@supersoniks/concorde/mixins_or_utils/class_name`
-
-The original paths remain accessible. Shortcut imports are used for the examples later in this documentation.
-
-## Usage
-
-### Simple Integration in HTML
-
-Import needed component in `main.ts` or wherever you want to use it:
-
-<sonic-code language="typescript">
-  <template>
-import "@supersoniks/concorde/ui/button";
-  </template>
-</sonic-code>
-
-Then in the render function ofyour component or in the HTML of the web page that includes the compiled JS, use the component as follows:
-
-<sonic-code>
-  <template>
-<sonic-button variant="outline">My button</sonic-button>
-  </template>
-</sonic-code>
-
-### Using a Mixin to Create a New Lit Component
-
-For example, create a file `my-element.ts` at the root:
-
-<sonic-code language="typescript">
-  <template>
-import { html, LitElement } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import Fetcher from "@supersoniks/concorde/mixins/Fetcher";
-import Subscriber from "@supersoniks/concorde/mixins/Subscriber";
-
-@customElement("my-element")
-export class SonicComponent extends Fetcher(Subscriber(LitElement)) {
-  @property() email = "";
-  @property() first_name = "";
-  @property() last_name = "";
-
-  render() {
-    return html`<div>
-      ${this.first_name} ${this.last_name} : ${this.email}
-    </div>`;
-  }
-}
-  </template>
-</sonic-code>
-
-Import component `main.ts` or `main.js` or any other component that uses it to be compiled
-
-<sonic-code language="typescript">
-  <template>
-import "./my-element";
-  </template>
-</sonic-code>
-
-In the HTML of a JS or TS component or in the HTML of the web page containing the compiled JS:
-
-<sonic-code language="html">
-  <template>
-<my-element serviceURL="/docs-mock-api" dataProvider="api/users/2" key="data"></my-element>
-  </template>
-</sonic-code>

package/src/docs/_getting-started/concorde-outside.md

@@ -1,33 +0,0 @@
-# Installation
-
-<sonic-alert status="info" label="Recommended — use the starter" background>
-<p>For almost all new projects, use <a href="https://www.npmjs.com/package/@supersoniks/create-concorde-ts-starter">create-concorde-ts-starter</a></p>
-<p>You get Vite + TypeScript + Lit + Tailwind, an example component, <code>npx concorde enable-short-paths</code> ready to run, and <code>yarn ai:sync</code> for <a href="#docs/_getting-started/ai-agents.md/ai-agents">AI agent skills</a> (<code>AGENTS.md</code>, Cursor / JetBrains rules) without extra setup.</p>
-</sonic-alert>
-
-## Starter
-
-The following command creates a new Vite project in TypeScript mode with Tailwind and an example component to get started.
-
-<sonic-code language="shell">
-  <template>
-npx @supersoniks/create-concorde-ts-starter "project_name"
-  </template>
-</sonic-code>
-
-Then, from the project folder:
-
-<sonic-code language="shell">
-  <template>
-yarn install
-yarn dev --host
-  </template>
-</sonic-code>
-
-## Next steps
-
-| Step | Page |
-|------|------|
-| Learn patterns | [My first component](#docs/_getting-started/my-first-component.md/my-first-component) |
-| Agent skills | [AI agents (skills)](#docs/_getting-started/ai-agents.md/ai-agents) — `yarn ai:sync` on the starter |
-| Brownfield / manual Vite | [Legacy: Manual installation](#docs/_getting-started/concorde-manual-install.md/concorde-manual-install) |

package/src/docs/_getting-started/my-first-subscriber.md

@@ -1,120 +0,0 @@
-# Legacy: My first subscriber component
-
-> **New projects:** use [My first component](#docs/_getting-started/my-first-component.md/my-first-component) (`@ancestorAttribute`, `@subscribe` + `DataProviderKey`, `.items` on lists) and [Data flow](#docs/_core-concept/dataFlow.md/dataFlow). This page documents the **Subscriber mixin** used by older apps and core components.
-
-Learn how to build a component with the **Subscriber** mixin, styled with Tailwind, filled from a DataProvider via automatic property mapping.
-
-## Create a classic lit component
-
-<sonic-code language="javascript" >
-  <template>
-  import { html, LitElement, nothing } from "lit";
-  import { customElement, property } from "lit/decorators.js";
-  @customElement("docs-user")
-  export class user extends LitElement {
-    @property({ type: String }) first_name = "";
-    @property({ type: String }) last_name = "";
-    @property({ type: String }) avatar = "";
-    @property({ type: String }) email = "";
-    render() {
-      return html`
-        &lt;img src="${this.avatar}" /&gt; &lt;br&gt;
-        ${this.first_name} ${this.last_name} &lt;br&gt;
-        ${this.email}`;
-    }
-  }
-  </template>
-</sonic-code>
-
-### Style with tailwind and ui components
-
-<sonic-code language="javascript">
-  <template>
-  import { css, unsafeCSS } from "lit";
-  import tailwindImport from "./css/tailwind.css?inline";
-  export const tailwind = css`${unsafeCSS(tailwindImport)}`;
-  </template>
-</sonic-code>
-
-<sonic-code language="javascript">
-  <template>
-    import { html, LitElement } from "lit";
-    import { customElement, property } from "lit/decorators.js";
-    import { tailwind } from "../tailwind";
-    import '@supersoniks/concode/ui/image'
-    import '@supersoniks/concode/ui/button'
-    import '@supersoniks/concode/ui/icon'
-    @customElement("docs-user")
-    export class user extends LitElement {
-      static styles = [tailwind];
-      @property({ type: String }) first_name = "";
-      @property({ type: String }) last_name = "";
-      @property({ type: String }) avatar = "";
-      @property({ type: String }) email = "";
-      render() {
-        return html`&lt;div class="flex items-center gap-3 p-2"&gt;
-          &lt;sonic-image src=${this.avatar} rounded="md" ratio="1/1" class="w-16"&gt;&lt;/sonic-image&gt;
-          &lt;div&gt;${this.first_name} &lt;span class="font-bold"&gt;${this.last_name}&lt;/span&gt;&lt;/div&gt;
-          &lt;div class="text-sm text-neutral-400"&gt;${this.email}&lt;/div&gt;
-        &lt;/div&gt;`;
-      }
-    }
-  </template>
-</sonic-code>
-
-## Add Subscriber mixin
-
-<sonic-code language="javascript">
-  <template>
-    import Subscriber from "@supersoniks/concorde/core/mixins/Subscriber";
-    @customElement("docs-user")
-    export class user extends Subscriber(LitElement) {
-      // properties auto-filled from DataProvider when names match
-    }
-  </template>
-</sonic-code>
-
-See [Legacy: Subscriber mixin](#docs/_core-concept/subscriber.md/subscriber).
-
-## Autofill from a dataProvider
-
-<sonic-code >
-<template>
-<docs-demo-sources for="list-users-fetch"></docs-demo-sources>
-<div serviceURL="/docs-mock-api">
-<sonic-fetch 
-    serviceURL="/docs-mock-api"
-    dataProvider="api/users/3" 
-    key="data">
-     <docs-user></docs-user>
-</sonic-fetch>
-</div>
-</template>
-</sonic-code>
-
-<sonic-code >
-<template>
-<sonic-fetch 
-    serviceURL="/docs-mock-api"
-    dataProvider="api/users/2" 
-    key="data"></sonic-fetch>
-<docs-user dataProvider="api/users/2" ></docs-user>
-</template>
-</sonic-code>
-
-<sonic-code >
-<template>
-<div class="grid grid-cols-1 gap-4">
-<form formDataProvider="userPreview" class="grid grid-cols-4 gap-3" >
-  <sonic-input label="First name" type="text" name="first_name" value="Paul" size="sm"></sonic-input>
-  <sonic-input label="Last name" type="text" name="last_name" value="Metrand" size="sm"></sonic-input>
-  <sonic-input class="col-span-2" label="email" type="text" name="email" value="paul@example.com" size="sm"></sonic-input>
-  <sonic-input label="Image url" type="text" name="avatar" value="https://i.pravatar.cc/150?u=paul" size="sm"></sonic-input>
-</form>
-<sonic-divider align="left">Preview before submit</sonic-divider>
-<div dataProvider="userPreview">
-  <docs-user></docs-user>
-</div>
-</div>
-</template>
-</sonic-code>

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

@@ -1,37 +0,0 @@
-# Legacy: Sharing data
-
-> **New apps:** [Data flow](#docs/_core-concept/dataFlow.md/dataFlow) (`get` / `set` / `DataProviderKey`, decorators). This page documents the historical **Publisher** proxy API (`PublisherManager`, `publisher.set`, `onAssign`, …).
-
-This section describes how data is shared between graphical and non-graphical components.
-
-Graphical components should not reference each other directly — they stay decoupled via a **publish/subscribe** store.
-
-## The Publisher
-
-### Principle
-
-* The **publisher** is a [JavaScript proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy) that holds data.<br>
-  Example: `{foo:{hello:["world"]}, bar:"baz"}`
-
-* Accessing a property (`myPublisher.foo.hello`) returns another **publisher** for that segment.
-
-* Missing properties create a publisher with internal data `null`, filled later.
-
-* **Subscribers** listen via `onAssign`, `onInternalMutation`, template filling on the **Subscriber mixin**, etc.
-
-* Updates use `publisher.set(...)` or nested assignment; changes propagate to subscribers.
-
-❇️ Order of creation vs subscription theoretically does not matter.
-
-### Methods
-
-* **set** — replace internal value  
-  <sonic-code language="javascript"><template>publisher.set({foo:{hello:["world"]}, bar:"baz"});</template></sonic-code>
-
-* **get** — read internal value  
-  <sonic-code language="javascript"><template>publisher.get()</template></sonic-code>
-
-* **onAssign / offAssign** — react to `set`  
-  <sonic-code language="javascript"><template>publisher.a.b.onAssign(console.log);</template></sonic-code>
-
-Modern equivalent: `get` / `set` / `@handle` — see [Data flow](#docs/_core-concept/dataFlow.md/dataFlow).

package/src/docs/_misc/formelement-subscriber-removal.md

@@ -1,115 +0,0 @@
-# FormElement without Subscriber (REDMINE-79569)
-
-Form fields (`sonic-input`, `textarea`, `select`, `checkbox`, `radio`, `switch`, `button`, `input-autocomplete`) no longer inherit the **Subscriber** mixin.
-
-## Behaviour now
-
-| Before | After |
-|--------|--------|
-| Dual channel `dataProvider` (autofill) + `formDataProvider` | **`formDataProvider` + `name` only** |
-| Ancestor `dataProvider` auto-filled field props | Ignored by form fields |
-| `noAutoFill` on fields/buttons inside a `dataProvider` tree | Dead on form fields (attribute harmless; can be cleaned in apps) |
-
-Preview pattern still valid: form writes via `formDataProvider`, display card reads via `dataProvider` on a **Subscriber** (or `@subscribe`) sibling — not on the fields themselves.
-
-## Migration checklist (apps)
-
-1. Prefer `formDataProvider` alone on forms / fieldsets.
-2. Drop redundant `dataProvider={sameKey}` on form containers when it only existed for field autofill.
-3. Prefill edit forms with `set(formKey, row)` / `dp(formKey.field).set(...)` before mount — not field `dataProvider`.
-4. Remove `noAutoFill` on `sonic-button` / fields when it only blocked Subscriber autofill.
-5. `initFromPublisher` still works (form publisher only).
-
-## Billetterie collect — dual-channel risk
-
-Files under `la-billetterie/concorde` that mention both `formDataProvider` and `dataProvider=` (review; many are filter+queue, not field autofill):
-
-### High priority (same key on form container)
-
-- `la-billetterie/components/reservation-request/atoms/request-event-form.ts` — `form` / `fieldset` with both attrs equal
-- `la-billetterie/components/reservation/atoms/new-quote-form.ts`
-- `la-billetterie/components/stats/sales-summary/sales-summary.ts`
-- `la-billetterie/components/product/price-selection-form/price-selection-form.ts` — `formDataProvider` + `dataProvider="cart/editForm"`
-- `la-billetterie/components/user/account/link-ticket/link-ticket.ts` — distinct keys (API vs form) — keep `dataProvider` only if used by fetch/submit siblings
-
-### Filters + queue (usually OK)
-
-`formDataProvider` on filter bar, `dataProvider` on `sonic-queue` / list — no field autofill dependency:
-
-- `access-control/components/event/list/index.ts`
-- `access-control/components/control/search/views/list.ts`
-- `la-billetterie/components/event/form-event-filter/form-event-filter.ts`
-- `la-billetterie/components/counter/*` (agenda, store, reservation-request-treatment, …)
-- `widgets/agenda/agenda.ts`
-- … see full dual list in ticket notes / grep below
-
-### Full dual-channel file list (55)
-
-```
-concorde/src/access-control/components/control/search/views/list.ts
-concorde/src/access-control/components/event/list/index.ts
-concorde/src/la-billetterie/components/access-control-mobile/access-controller-picker.ts
-concorde/src/la-billetterie/components/accreditations-directory/accreditations-directory.ts
-concorde/src/la-billetterie/components/address/address-suggestion.ts
-concorde/src/la-billetterie/components/bulk/bulk.ts
-concorde/src/la-billetterie/components/campaign/campaign-content.ts
-concorde/src/la-billetterie/components/counter/agenda/agenda.ts
-concorde/src/la-billetterie/components/counter/event-selector/event-selector.ts
-concorde/src/la-billetterie/components/counter/order-validation/order-validation-settings.ts
-concorde/src/la-billetterie/components/counter/print/format-menu.ts
-concorde/src/la-billetterie/components/counter/reservation-request-treatment/reservation-request-treatment.ts
-concorde/src/la-billetterie/components/counter/store/counter-store.ts
-concorde/src/la-billetterie/components/counter/widgets-settings/widgets-settings-page.ts
-concorde/src/la-billetterie/components/custom-list/custom-list.ts
-concorde/src/la-billetterie/components/event/agenda/agenda.ts
-concorde/src/la-billetterie/components/event/atoms/buy-event-block/buy-event-block.ts
-concorde/src/la-billetterie/components/event/atoms/categorizedPrices/categorizedPrices.ts
-concorde/src/la-billetterie/components/event/event-store/event-store-content.ts
-concorde/src/la-billetterie/components/event/form-event-filter/form-event-filter.ts
-concorde/src/la-billetterie/components/form/event-selection/event-selection-filters.ts
-concorde/src/la-billetterie/components/form/event-selection/event-selection.ts
-concorde/src/la-billetterie/components/giftcards/giftcard-link.ts
-concorde/src/la-billetterie/components/layout/header.ts
-concorde/src/la-billetterie/components/orders/recover/recover.ts
-concorde/src/la-billetterie/components/placing/atoms/placement-choice/placement-choice.ts
-concorde/src/la-billetterie/components/placing/seatmap-view/seatmap-view.ts
-concorde/src/la-billetterie/components/product/price-selection-form/price-selection-form.ts
-concorde/src/la-billetterie/components/product/prices-form/price-button/price-button.ts
-concorde/src/la-billetterie/components/purchase/purchase-summary/complementary-info/complementary-info.ts
-concorde/src/la-billetterie/components/reservation-request/atoms/request-event-form.ts
-concorde/src/la-billetterie/components/reservation/atoms/new-quote-form.ts
-concorde/src/la-billetterie/components/reservation/reservation-content.ts
-concorde/src/la-billetterie/components/seatmap/seatmap.ts
-concorde/src/la-billetterie/components/shop/shop.ts
-concorde/src/la-billetterie/components/stats/dashboard/dashboard.ts
-concorde/src/la-billetterie/components/stats/event/event-stats-check.ts
-concorde/src/la-billetterie/components/stats/sales-summary/sales-summary.ts
-concorde/src/la-billetterie/components/subscription/atoms/quick-select-display-toggle/quick-select-display-toggle.ts
-concorde/src/la-billetterie/components/subscription/cart-quick-select.ts
-concorde/src/la-billetterie/components/subscription/edit/subscription-renew-form.ts
-concorde/src/la-billetterie/components/ticket/ticket-freeup.ts
-concorde/src/la-billetterie/components/tickets-app/default-router.ts
-concorde/src/la-billetterie/components/user/account/account-purchases.ts
-concorde/src/la-billetterie/components/user/account/account-tickets.ts
-concorde/src/la-billetterie/components/user/account/link-ticket/link-ticket.ts
-concorde/src/la-billetterie/components/user/form/login.ts
-concorde/src/la-billetterie/components/user/user-attach/buyer-attach-form.ts
-concorde/src/la-billetterie/components/user/user-attach/buyer-attach.ts
-concorde/src/la-billetterie/components/user/user-attach/owner-attach-form.ts
-concorde/src/la-billetterie/components/user/user-attach/subscription-attach-form.ts
-concorde/src/la-billetterie/components/user/user-attach/subscription-selector.ts
-concorde/src/la-billetterie/components/user/user-selector/user-selector.ts
-concorde/src/la-billetterie/components/user/user-suggest/user-suggest.ts
-concorde/src/widgets/agenda/agenda.ts
-```
-
-Re-run audit:
-
-```bash
-# from la-billetterie
-rg -l 'formDataProvider' concorde/src | while read f; do rg -q 'dataProvider\s*=' "$f" && echo "$f"; done
-```
-
-## Non-regression (Concorde docs)
-
-Smoke form demos: input, textarea, select, checkbox (incl. check-all), radio, switch, button form modes, queue + `dataFilterProvider`, submit, validation / sameValueAs, input-autocomplete.

package/src/docs/example/docs-input-autocomplete-demos.ts

@@ -1,110 +0,0 @@
-import { html, LitElement } from "lit";
-import { customElement } from "lit/decorators.js";
-import { DOCS_MOCK_GEO_SERVICE } from "../mock-api/urls";
-
-import "../../core/components/ui/form/input-autocomplete/input-autocomplete";
-import "../../core/components/ui/menu/menu-item";
-
-type CommuneRow = { nom: string; code: string };
-
-/** Ligne suggestion : pas de radio/name (évite d'écrire dans le form au render). */
-const communeItem =
-  (valueKey: "nom" | "code") => (item: CommuneRow) =>
-    html`<sonic-menu-item
-      data-autocomplete-value=${item[valueKey]}
-      data-autocomplete-label=${item.nom}
-      >${item.nom}</sonic-menu-item
-    >`;
-
-@customElement("docs-input-autocomplete-basic-demo")
-export class DocsInputAutocompleteBasicDemo extends LitElement {
-  private items = communeItem("nom");
-
-  render() {
-    return html`
-      <sonic-input-autocomplete
-        class="w-64"
-        label="Ville"
-        formDataProvider="autoComplete-example-base"
-        name="nom"
-        placeholder="Paris, Lyon, Tours, ..."
-        serviceURL=${DOCS_MOCK_GEO_SERVICE}
-        dataProviderExpression="communes?limit=5"
-        .items=${this.items}
-      ></sonic-input-autocomplete>
-    `;
-  }
-}
-
-@customElement("docs-input-autocomplete-code-demo")
-export class DocsInputAutocompleteCodeDemo extends LitElement {
-  private items = communeItem("code");
-
-  render() {
-    return html`
-      <sonic-input-autocomplete
-        class="w-64"
-        label="Ville (code INSEE)"
-        formDataProvider="autoComplete-example"
-        name="code"
-        value="13055"
-        placeholder="Paris, Lyon, Tours, ..."
-        serviceURL=${DOCS_MOCK_GEO_SERVICE}
-        dataProviderExpression="communes?limit=5"
-        searchParameter="nom"
-        .items=${this.items}
-      ></sonic-input-autocomplete>
-    `;
-  }
-}
-
-@customElement("docs-input-autocomplete-select-demo")
-export class DocsInputAutocompleteSelectDemo extends LitElement {
-  private items = communeItem("code");
-
-  render() {
-    return html`
-      <sonic-input-autocomplete
-        select
-        class="w-64"
-        label="Ville (select)"
-        formDataProvider="autoComplete-example2"
-        name="code"
-        value="69123"
-        placeholder="Paris, Lyon, Tours, ..."
-        serviceURL=${DOCS_MOCK_GEO_SERVICE}
-        dataProviderExpression="communes?limit=5"
-        searchParameter="nom"
-        .items=${this.items}
-      ></sonic-input-autocomplete>
-    `;
-  }
-}
-
-@customElement("docs-input-autocomplete-keyboard-demo")
-export class DocsInputAutocompleteKeyboardDemo extends LitElement {
-  private items = (item: CommuneRow) =>
-    html`<sonic-menu-item
-      data-keyboard-nav="nav-autocomplete"
-      data-autocomplete-value=${item.nom}
-      data-autocomplete-label=${item.nom}
-      >${item.nom}</sonic-menu-item
-    >`;
-
-  render() {
-    return html`
-      <sonic-input-autocomplete
-        class="w-64"
-        label="Ville"
-        formDataProvider="autoComplete-example-keyboard"
-        name="nom"
-        data-keyboard-nav="nav-autocomplete"
-        placeholder="Paris, Lyon, Tours, ..."
-        serviceURL=${DOCS_MOCK_GEO_SERVICE}
-        dataProviderExpression="communes?limit=60"
-        minSearchLength="1"
-        .items=${this.items}
-      ></sonic-input-autocomplete>
-    `;
-  }
-}