@sentropic/design-system-svelte 0.34.49 → 0.34.51

package/dist/ListReportPage.svelte

@@ -0,0 +1,184 @@
+<script lang="ts" module>
+  import type { SideNavItem } from "./SideNav.svelte";
+
+  export interface ListReportPageNavItem extends SideNavItem {}
+
+  export interface ListReportPageColumn {
+    key: string;
+    label: string;
+    sortable?: boolean;
+    align?: "start" | "center" | "end";
+    width?: string;
+  }
+
+  export interface ListReportPageRow {
+    id: string;
+    [key: string]: unknown;
+  }
+
+  export interface ListReportPageFilter {
+    field: string;
+    value: string;
+    operator?: string;
+  }
+
+  export interface ListReportPageAction {
+    value: string;
+    label: string;
+    danger?: boolean;
+  }
+
+  export type ListReportPageProps = {
+    appTitle: string;
+    navItems?: ListReportPageNavItem[];
+    pageTitle: string;
+    primaryAction?: string;
+    secondaryAction?: string;
+    searchLabel?: string;
+    searchPlaceholder?: string;
+    filterBarLabel?: string;
+    filters?: ListReportPageFilter[];
+    columns: ListReportPageColumn[];
+    rows: ListReportPageRow[];
+    pageSize?: number;
+    rowActions?: ListReportPageAction[];
+    rowActionsLabel?: string;
+    onprimaryaction?: () => void;
+    onsearch?: (q: string) => void;
+  };
+</script>
+
+<script lang="ts">
+  import SideNav from "./SideNav.svelte";
+  import DataTable from "./DataTable.svelte";
+  import Search from "./Search.svelte";
+  import FilterBar from "./FilterBar.svelte";
+  import FilterPill from "./FilterPill.svelte";
+  import Button from "./Button.svelte";
+
+  let {
+    appTitle,
+    navItems = [],
+    pageTitle,
+    primaryAction,
+    secondaryAction,
+    searchLabel,
+    searchPlaceholder = "Rechercher…",
+    filterBarLabel = "Filtres actifs",
+    filters = [],
+    columns,
+    rows,
+    pageSize = 10,
+    rowActions = [],
+    rowActionsLabel,
+    onprimaryaction,
+    onsearch,
+  }: ListReportPageProps = $props();
+
+  let searchValue = $state("");
+
+  function handleSearch(q: string) {
+    searchValue = q;
+    onsearch?.(q);
+  }
+</script>
+
+<div class="st-lrp">
+  <header class="st-lrp__header">
+    <span class="st-lrp__appTitle">{appTitle}</span>
+  </header>
+  <div class="st-lrp__body">
+    {#if navItems.length > 0}
+      <aside class="st-lrp__aside">
+        <SideNav items={navItems} />
+      </aside>
+    {/if}
+    <main class="st-lrp__main">
+      <div class="st-lrp__titlebar">
+        <h1 class="st-lrp__pageTitle">{pageTitle}</h1>
+        <div class="st-lrp__titleActions">
+          {#if secondaryAction}
+            <Button variant="secondary">{secondaryAction}</Button>
+          {/if}
+          {#if primaryAction}
+            <Button variant="primary" onclick={onprimaryaction}>{primaryAction}</Button>
+          {/if}
+        </div>
+      </div>
+      <div class="st-lrp__toolbar">
+        <Search
+          label={searchLabel}
+          placeholder={searchPlaceholder}
+          value={searchValue}
+          fluid
+          oninput={(e) => handleSearch((e.target as HTMLInputElement).value)}
+        />
+        {#if filters.length > 0}
+          <FilterBar label={filterBarLabel}>
+            {#each filters as f}
+              <FilterPill field={f.field} value={f.value} operator={f.operator} />
+            {/each}
+          </FilterBar>
+        {/if}
+      </div>
+      <DataTable {columns} {rows} />
+    </main>
+  </div>
+</div>
+
+<style>
+  .st-lrp {
+    display: grid;
+    grid-template-rows: auto 1fr;
+    min-block-size: 100vh;
+    background: var(--st-semantic-surface-default);
+    color: var(--st-semantic-text-primary);
+  }
+  .st-lrp__header {
+    border-block-end: 1px solid var(--st-semantic-border-subtle);
+    padding: var(--st-spacing-3, 0.75rem) var(--st-spacing-6, 1.5rem);
+    display: flex;
+    align-items: center;
+  }
+  .st-lrp__appTitle {
+    font-weight: 700;
+    font-size: 1rem;
+  }
+  .st-lrp__body {
+    display: grid;
+    grid-template-columns: 220px 1fr;
+  }
+  .st-lrp__aside {
+    border-inline-end: 1px solid var(--st-semantic-border-subtle);
+    background: var(--st-semantic-surface-raised);
+    overflow-y: auto;
+  }
+  .st-lrp__main {
+    display: flex;
+    flex-direction: column;
+    gap: var(--st-spacing-4, 1rem);
+    padding: var(--st-spacing-6, 1.5rem);
+    overflow: auto;
+  }
+  .st-lrp__titlebar {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--st-spacing-3, 0.75rem);
+  }
+  .st-lrp__pageTitle {
+    font-size: 1.5rem;
+    font-weight: 700;
+    margin: 0;
+    color: var(--st-semantic-text-primary);
+  }
+  .st-lrp__titleActions {
+    display: flex;
+    gap: var(--st-spacing-2, 0.5rem);
+  }
+  .st-lrp__toolbar {
+    display: flex;
+    flex-direction: column;
+    gap: var(--st-spacing-2, 0.5rem);
+  }
+</style>

package/dist/ListReportPage.svelte.d.ts

@@ -0,0 +1,46 @@
+import type { SideNavItem } from "./SideNav.svelte";
+export interface ListReportPageNavItem extends SideNavItem {
+}
+export interface ListReportPageColumn {
+    key: string;
+    label: string;
+    sortable?: boolean;
+    align?: "start" | "center" | "end";
+    width?: string;
+}
+export interface ListReportPageRow {
+    id: string;
+    [key: string]: unknown;
+}
+export interface ListReportPageFilter {
+    field: string;
+    value: string;
+    operator?: string;
+}
+export interface ListReportPageAction {
+    value: string;
+    label: string;
+    danger?: boolean;
+}
+export type ListReportPageProps = {
+    appTitle: string;
+    navItems?: ListReportPageNavItem[];
+    pageTitle: string;
+    primaryAction?: string;
+    secondaryAction?: string;
+    searchLabel?: string;
+    searchPlaceholder?: string;
+    filterBarLabel?: string;
+    filters?: ListReportPageFilter[];
+    columns: ListReportPageColumn[];
+    rows: ListReportPageRow[];
+    pageSize?: number;
+    rowActions?: ListReportPageAction[];
+    rowActionsLabel?: string;
+    onprimaryaction?: () => void;
+    onsearch?: (q: string) => void;
+};
+declare const ListReportPage: import("svelte").Component<ListReportPageProps, {}, "">;
+type ListReportPage = ReturnType<typeof ListReportPage>;
+export default ListReportPage;
+//# sourceMappingURL=ListReportPage.svelte.d.ts.map

package/dist/ListReportPage.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListReportPage.svelte.d.ts","sourceRoot":"","sources":["../src/lib/ListReportPage.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEpD,MAAM,WAAW,qBAAsB,SAAQ,WAAW;CAAG;AAE7D,MAAM,WAAW,oBAAoB;IACnC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACnC,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACjC,OAAO,EAAE,oBAAoB,EAAE,CAAC;IAChC,IAAI,EAAE,iBAAiB,EAAE,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACpC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC,CAAC;AAwFJ,QAAA,MAAM,cAAc,yDAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/MasterDetail.svelte

@@ -0,0 +1,267 @@
+<script lang="ts" module>
+  import type { SideNavItem } from "./SideNav.svelte";
+
+  export interface MasterDetailNavItem extends SideNavItem {}
+
+  export type MasterDetailStatusTone = "neutral" | "info" | "success" | "warning" | "error";
+
+  export interface MasterDetailItem {
+    id: string;
+    primary: string;
+    secondary?: string;
+    statusLabel?: string;
+    statusTone?: MasterDetailStatusTone;
+    active?: boolean;
+  }
+
+  export interface MasterDetailField {
+    key: string;
+    value: string;
+  }
+
+  export type MasterDetailProps = {
+    appTitle?: string;
+    navItems?: MasterDetailNavItem[];
+    listTitle: string;
+    searchPlaceholder?: string;
+    listItems: MasterDetailItem[];
+    detailTitle: string;
+    detailStatus?: { label: string; tone: MasterDetailStatusTone };
+    detailActions?: string[];
+    detailFields: MasterDetailField[];
+    onlistitemclick?: (id: string) => void;
+  };
+</script>
+
+<script lang="ts">
+  import SideNav from "./SideNav.svelte";
+  import Badge from "./Badge.svelte";
+  import Button from "./Button.svelte";
+  import Search from "./Search.svelte";
+
+  let {
+    appTitle,
+    navItems = [],
+    listTitle,
+    searchPlaceholder = "Rechercher…",
+    listItems,
+    detailTitle,
+    detailStatus,
+    detailActions = [],
+    detailFields,
+    onlistitemclick,
+  }: MasterDetailProps = $props();
+
+  let searchValue = $state("");
+</script>
+
+<div class="st-md">
+  {#if appTitle}
+    <header class="st-md__header">
+      <span class="st-md__appTitle">{appTitle}</span>
+    </header>
+  {/if}
+  <div class="st-md__body">
+    {#if navItems.length > 0}
+      <aside class="st-md__aside">
+        <SideNav items={navItems} />
+      </aside>
+    {/if}
+    <div class="st-md__split">
+      <aside class="st-md__list" aria-label={listTitle}>
+        <div class="st-md__listHeader">
+          <h2 class="st-md__listTitle">{listTitle}</h2>
+          <Search
+            placeholder={searchPlaceholder}
+            value={searchValue}
+            fluid
+            oninput={(e) => (searchValue = (e.target as HTMLInputElement).value)}
+          />
+        </div>
+        <ul class="st-md__listItems">
+          {#each listItems as item (item.id)}
+            <li>
+              <button
+                class="st-md__listItem"
+                class:st-md__listItem--active={item.active}
+                onclick={() => onlistitemclick?.(item.id)}
+                type="button"
+              >
+                <span class="st-md__itemPrimary">{item.primary}</span>
+                {#if item.secondary}
+                  <span class="st-md__itemSecondary">{item.secondary}</span>
+                {/if}
+                {#if item.statusLabel}
+                  <Badge tone={item.statusTone ?? "neutral"}>{item.statusLabel}</Badge>
+                {/if}
+              </button>
+            </li>
+          {/each}
+        </ul>
+      </aside>
+      <main class="st-md__detail">
+        <div class="st-md__detailHeader">
+          <div class="st-md__detailTitleRow">
+            <h1 class="st-md__detailTitle">{detailTitle}</h1>
+            {#if detailStatus}
+              <Badge tone={detailStatus.tone}>{detailStatus.label}</Badge>
+            {/if}
+          </div>
+          {#if detailActions.length > 0}
+            <div class="st-md__detailActions">
+              {#each detailActions as action, i}
+                <Button variant={i === 0 ? "primary" : "secondary"}>{action}</Button>
+              {/each}
+            </div>
+          {/if}
+        </div>
+        <dl class="st-md__fields">
+          {#each detailFields as field}
+            <div class="st-md__fieldRow">
+              <dt class="st-md__fieldKey">{field.key}</dt>
+              <dd class="st-md__fieldValue">{field.value}</dd>
+            </div>
+          {/each}
+        </dl>
+      </main>
+    </div>
+  </div>
+</div>
+
+<style>
+  .st-md {
+    display: grid;
+    grid-template-rows: auto 1fr;
+    min-block-size: 100vh;
+    background: var(--st-semantic-surface-default);
+    color: var(--st-semantic-text-primary);
+  }
+  .st-md__header {
+    border-block-end: 1px solid var(--st-semantic-border-subtle);
+    padding: var(--st-spacing-3, 0.75rem) var(--st-spacing-6, 1.5rem);
+    display: flex;
+    align-items: center;
+  }
+  .st-md__appTitle {
+    font-weight: 700;
+    font-size: 1rem;
+  }
+  .st-md__body {
+    display: grid;
+    grid-template-columns: 220px 1fr;
+    overflow: hidden;
+  }
+  .st-md__aside {
+    border-inline-end: 1px solid var(--st-semantic-border-subtle);
+    background: var(--st-semantic-surface-raised);
+    overflow-y: auto;
+  }
+  .st-md__split {
+    display: grid;
+    grid-template-columns: 320px 1fr;
+    overflow: hidden;
+  }
+  .st-md__list {
+    border-inline-end: 1px solid var(--st-semantic-border-subtle);
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+  }
+  .st-md__listHeader {
+    padding: var(--st-spacing-4, 1rem);
+    display: flex;
+    flex-direction: column;
+    gap: var(--st-spacing-2, 0.5rem);
+    border-block-end: 1px solid var(--st-semantic-border-subtle);
+  }
+  .st-md__listTitle {
+    font-size: 1rem;
+    font-weight: 650;
+    margin: 0;
+  }
+  .st-md__listItems {
+    list-style: none;
+    margin: 0;
+    padding: var(--st-spacing-2, 0.5rem);
+    overflow-y: auto;
+    flex: 1;
+  }
+  .st-md__listItem {
+    width: 100%;
+    text-align: start;
+    background: transparent;
+    border: none;
+    border-radius: var(--st-radius-md, 0.375rem);
+    padding: var(--st-spacing-3, 0.75rem);
+    cursor: pointer;
+    display: flex;
+    flex-direction: column;
+    gap: var(--st-spacing-1, 0.25rem);
+    color: var(--st-semantic-text-primary);
+  }
+  .st-md__listItem:hover {
+    background: var(--st-semantic-surface-subtle, #f1f5f9);
+  }
+  .st-md__listItem--active {
+    background: var(--st-semantic-surface-selected, #eff6ff);
+  }
+  .st-md__itemPrimary {
+    font-size: 0.875rem;
+    font-weight: 600;
+  }
+  .st-md__itemSecondary {
+    font-size: 0.75rem;
+    color: var(--st-semantic-text-secondary);
+  }
+  .st-md__detail {
+    display: flex;
+    flex-direction: column;
+    gap: var(--st-spacing-6, 1.5rem);
+    padding: var(--st-spacing-6, 1.5rem);
+    overflow-y: auto;
+  }
+  .st-md__detailHeader {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: var(--st-spacing-4, 1rem);
+    flex-wrap: wrap;
+  }
+  .st-md__detailTitleRow {
+    display: flex;
+    align-items: center;
+    gap: var(--st-spacing-3, 0.75rem);
+    flex-wrap: wrap;
+  }
+  .st-md__detailTitle {
+    font-size: 1.5rem;
+    font-weight: 700;
+    margin: 0;
+  }
+  .st-md__detailActions {
+    display: flex;
+    gap: var(--st-spacing-2, 0.5rem);
+    flex-shrink: 0;
+  }
+  .st-md__fields {
+    margin: 0;
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
+    gap: var(--st-spacing-3, 0.75rem) var(--st-spacing-6, 1.5rem);
+  }
+  .st-md__fieldRow {
+    display: flex;
+    flex-direction: column;
+    gap: 0.2rem;
+  }
+  .st-md__fieldKey {
+    font-size: 0.75rem;
+    color: var(--st-semantic-text-secondary);
+    font-weight: 500;
+  }
+  .st-md__fieldValue {
+    margin: 0;
+    font-size: 0.875rem;
+    color: var(--st-semantic-text-primary);
+  }
+</style>

package/dist/MasterDetail.svelte.d.ts

@@ -0,0 +1,35 @@
+import type { SideNavItem } from "./SideNav.svelte";
+export interface MasterDetailNavItem extends SideNavItem {
+}
+export type MasterDetailStatusTone = "neutral" | "info" | "success" | "warning" | "error";
+export interface MasterDetailItem {
+    id: string;
+    primary: string;
+    secondary?: string;
+    statusLabel?: string;
+    statusTone?: MasterDetailStatusTone;
+    active?: boolean;
+}
+export interface MasterDetailField {
+    key: string;
+    value: string;
+}
+export type MasterDetailProps = {
+    appTitle?: string;
+    navItems?: MasterDetailNavItem[];
+    listTitle: string;
+    searchPlaceholder?: string;
+    listItems: MasterDetailItem[];
+    detailTitle: string;
+    detailStatus?: {
+        label: string;
+        tone: MasterDetailStatusTone;
+    };
+    detailActions?: string[];
+    detailFields: MasterDetailField[];
+    onlistitemclick?: (id: string) => void;
+};
+declare const MasterDetail: import("svelte").Component<MasterDetailProps, {}, "">;
+type MasterDetail = ReturnType<typeof MasterDetail>;
+export default MasterDetail;
+//# sourceMappingURL=MasterDetail.svelte.d.ts.map

package/dist/MasterDetail.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MasterDetail.svelte.d.ts","sourceRoot":"","sources":["../src/lib/MasterDetail.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEpD,MAAM,WAAW,mBAAoB,SAAQ,WAAW;CAAG;AAE3D,MAAM,MAAM,sBAAsB,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAE1F,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,sBAAsB,CAAC;IACpC,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,iBAAiB;IAChC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,EAAE,gBAAgB,EAAE,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,sBAAsB,CAAA;KAAE,CAAC;IAC/D,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,YAAY,EAAE,iBAAiB,EAAE,CAAC;IAClC,eAAe,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,CAAC;AAmGJ,QAAA,MAAM,YAAY,uDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/dist/NavDrawer.svelte

@@ -0,0 +1,46 @@
+<script lang="ts" module>
+  import type { Snippet } from "svelte";
+  import type { NavShellSide } from "./NavShell.svelte";
+
+  export interface NavDrawerProps {
+    title?: string;
+    subtitle?: string;
+    label?: string;
+    search?: Snippet;
+    footer?: Snippet;
+    children: Snippet;
+    open?: boolean;
+    side?: NavShellSide;
+    class?: string;
+  }
+</script>
+
+<script lang="ts">
+  import NavShell from "./NavShell.svelte";
+
+  let {
+    title,
+    subtitle,
+    label,
+    search,
+    footer,
+    children,
+    open = $bindable(false),
+    side = "left",
+    class: className
+  }: NavDrawerProps = $props();
+</script>
+
+<NavShell
+  bind:open
+  variant="drawer"
+  {title}
+  {subtitle}
+  {label}
+  {search}
+  {footer}
+  {side}
+  class={["st-navDrawer", className].filter(Boolean).join(" ")}
+>
+  {@render children()}
+</NavShell>

package/dist/NavDrawer.svelte.d.ts

@@ -0,0 +1,17 @@
+import type { Snippet } from "svelte";
+import type { NavShellSide } from "./NavShell.svelte";
+export interface NavDrawerProps {
+    title?: string;
+    subtitle?: string;
+    label?: string;
+    search?: Snippet;
+    footer?: Snippet;
+    children: Snippet;
+    open?: boolean;
+    side?: NavShellSide;
+    class?: string;
+}
+declare const NavDrawer: import("svelte").Component<NavDrawerProps, {}, "open">;
+type NavDrawer = ReturnType<typeof NavDrawer>;
+export default NavDrawer;
+//# sourceMappingURL=NavDrawer.svelte.d.ts.map

package/dist/NavDrawer.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavDrawer.svelte.d.ts","sourceRoot":"","sources":["../src/lib/NavDrawer.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA6BH,QAAA,MAAM,SAAS,wDAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}

package/dist/NavItem.svelte

@@ -69,10 +69,8 @@
   //
   // a11y : NavItem N'INTRODUIT AUCUN interactif dans la rangée — pastille, badge
   // et caption sont décoratifs/textuels. Le href passe par l'ancre native de
-  // SelectableRow… mais SelectableRow rend un <div role=button/option> : pour un
-  // lien réel on enveloppe via la tête. Ici `href` est exposé comme intention de
-  // navigation transmise au consommateur (onselect) — la rangée reste UN seul
-  // tab stop, conforme au rôle « option » dérivé du conteneur.
+  // SelectableRow en standalone ; dans une SelectableList, la liste garde son
+  // rôle option/roving-tabindex. La rangée reste UN seul tab stop.
   import SelectableRow from "./SelectableRow.svelte";
   import ColorSwatch from "./ColorSwatch.svelte";
   import StatusDot from "./StatusDot.svelte";
@@ -147,8 +145,8 @@
   <SelectableRow
     bind:selected
     {value}
+    {href}
     {disabled}
-    role={href ? "link" : undefined}
     caption={caption ? captionSnippet : undefined}
   >
     {#snippet leading()}

package/dist/NavItem.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavItem.svelte.d.ts","sourceRoot":"","sources":["../src/lib/NavItem.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEtC;;uDAEuD;AACvD,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEzC;2DAC2D;AAC3D,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAEjF,MAAM,MAAM,aAAa,GAAG;IAC1B,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0EAA0E;IAC1E,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAC5D,qEAAqE;IACrE,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qCAAqC;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,qEAAqE;IACrE,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,gEAAgE;IAChE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mCAAmC;IACnC,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mFAAmF;IACnF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mFAAmF;IACnF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mDAAmD;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAoKJ,QAAA,MAAM,OAAO,0DAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}
+{"version":3,"file":"NavItem.svelte.d.ts","sourceRoot":"","sources":["../src/lib/NavItem.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAEtC;;uDAEuD;AACvD,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEzC;2DAC2D;AAC3D,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAEjF,MAAM,MAAM,aAAa,GAAG;IAC1B,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0EAA0E;IAC1E,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAC5D,qEAAqE;IACrE,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qCAAqC;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,qEAAqE;IACrE,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,gEAAgE;IAChE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mCAAmC;IACnC,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mFAAmF;IACnF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mFAAmF;IACnF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mDAAmD;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAgKJ,QAAA,MAAM,OAAO,0DAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}