@sentropic/design-system-svelte 0.7.0 → 0.9.0

package/dist/LineChart.svelte

@@ -0,0 +1,397 @@
+<script lang="ts" module>
+  export type LineChartTone =
+    | "category1"
+    | "category2"
+    | "category3"
+    | "category4"
+    | "category5"
+    | "category6"
+    | "category7"
+    | "category8";
+
+  export type LineChartDatum = {
+    x: number | string;
+    y: number;
+  };
+</script>
+
+<script lang="ts">
+  type LineChartProps = {
+    data: LineChartDatum[];
+    width?: number;
+    height?: number;
+    tone?: LineChartTone;
+    smooth?: boolean;
+    area?: boolean;
+    label: string;
+    class?: string;
+  };
+
+  let {
+    data,
+    width = 480,
+    height = 240,
+    tone = "category1",
+    smooth = false,
+    area = false,
+    label,
+    class: className
+  }: LineChartProps = $props();
+
+  const MARGIN = { top: 12, right: 16, bottom: 32, left: 44 };
+
+  function niceTicks(min: number, max: number, target = 5): number[] {
+    if (!Number.isFinite(min) || !Number.isFinite(max) || min === max) {
+      const base = Number.isFinite(max) ? max : 0;
+      return [base];
+    }
+    const range = max - min;
+    const rough = range / Math.max(target - 1, 1);
+    const pow = Math.pow(10, Math.floor(Math.log10(rough)));
+    const norm = rough / pow;
+    let step: number;
+    if (norm < 1.5) step = 1 * pow;
+    else if (norm < 3) step = 2 * pow;
+    else if (norm < 7) step = 5 * pow;
+    else step = 10 * pow;
+    const start = Math.floor(min / step) * step;
+    const end = Math.ceil(max / step) * step;
+    const ticks: number[] = [];
+    for (let v = start; v <= end + step / 2; v += step) {
+      ticks.push(Number(v.toFixed(10)));
+    }
+    return ticks;
+  }
+
+  function scaleLinear(v: number, d0: number, d1: number, r0: number, r1: number) {
+    if (d1 === d0) return r0;
+    return r0 + ((v - d0) * (r1 - r0)) / (d1 - d0);
+  }
+
+  function formatTick(v: number): string {
+    if (Math.abs(v) >= 1000) return `${(v / 1000).toFixed(v % 1000 === 0 ? 0 : 1)}k`;
+    if (Number.isInteger(v)) return String(v);
+    return v.toFixed(1);
+  }
+
+  function isNumeric(x: number | string): x is number {
+    return typeof x === "number" && Number.isFinite(x);
+  }
+
+  let hoveredIndex: number | null = $state(null);
+
+  const plotWidth = $derived(Math.max(width - MARGIN.left - MARGIN.right, 1));
+  const plotHeight = $derived(Math.max(height - MARGIN.top - MARGIN.bottom, 1));
+
+  const xDomain = $derived.by(() => {
+    if (data.length === 0) return { kind: "ordinal" as const, values: [] as (number | string)[] };
+    const allNumeric = data.every((d) => isNumeric(d.x));
+    if (allNumeric) {
+      const xs = data.map((d) => d.x as number);
+      return { kind: "numeric" as const, min: Math.min(...xs), max: Math.max(...xs) };
+    }
+    return { kind: "ordinal" as const, values: data.map((d) => d.x) };
+  });
+
+  const yTicks = $derived.by(() => {
+    const ys = data.map((d) => d.y);
+    if (ys.length === 0) return [0];
+    const minRaw = Math.min(...ys);
+    const maxRaw = Math.max(...ys);
+    const padded = (maxRaw - minRaw) * 0.08 || Math.max(Math.abs(maxRaw), 1) * 0.1;
+    return niceTicks(minRaw - padded, maxRaw + padded, 5);
+  });
+
+  const yDomain = $derived.by(() => {
+    if (yTicks.length === 0) return { min: 0, max: 1 };
+    return { min: yTicks[0], max: yTicks[yTicks.length - 1] };
+  });
+
+  const points = $derived.by(() => {
+    if (data.length === 0) return [];
+    return data.map((d, i) => {
+      let x: number;
+      if (xDomain.kind === "numeric") {
+        x = scaleLinear(d.x as number, xDomain.min, xDomain.max, 0, plotWidth);
+      } else {
+        // ordinal: distribute evenly
+        const denom = Math.max(data.length - 1, 1);
+        x = data.length === 1 ? plotWidth / 2 : (i / denom) * plotWidth;
+      }
+      const y = scaleLinear(d.y, yDomain.min, yDomain.max, plotHeight, 0);
+      return {
+        x: MARGIN.left + x,
+        y: MARGIN.top + y,
+        datum: d,
+        index: i
+      };
+    });
+  });
+
+  function buildLinearPath(pts: { x: number; y: number }[]): string {
+    return pts.map((p, i) => `${i === 0 ? "M" : "L"}${p.x.toFixed(2)},${p.y.toFixed(2)}`).join(" ");
+  }
+
+  function buildSmoothPath(pts: { x: number; y: number }[]): string {
+    if (pts.length < 2) return buildLinearPath(pts);
+    const t = 0.18;
+    let d = `M${pts[0].x.toFixed(2)},${pts[0].y.toFixed(2)}`;
+    for (let i = 0; i < pts.length - 1; i++) {
+      const p0 = pts[i - 1] ?? pts[i];
+      const p1 = pts[i];
+      const p2 = pts[i + 1];
+      const p3 = pts[i + 2] ?? p2;
+      const c1x = p1.x + (p2.x - p0.x) * t;
+      const c1y = p1.y + (p2.y - p0.y) * t;
+      const c2x = p2.x - (p3.x - p1.x) * t;
+      const c2y = p2.y - (p3.y - p1.y) * t;
+      d += ` C${c1x.toFixed(2)},${c1y.toFixed(2)} ${c2x.toFixed(2)},${c2y.toFixed(2)} ${p2.x.toFixed(2)},${p2.y.toFixed(2)}`;
+    }
+    return d;
+  }
+
+  const linePath = $derived(
+    points.length === 0 ? "" : smooth ? buildSmoothPath(points) : buildLinearPath(points)
+  );
+
+  const areaPath = $derived.by(() => {
+    if (!area || points.length === 0) return "";
+    const base = MARGIN.top + plotHeight;
+    const first = points[0];
+    const last = points[points.length - 1];
+    return `${linePath} L${last.x.toFixed(2)},${base.toFixed(2)} L${first.x.toFixed(2)},${base.toFixed(2)} Z`;
+  });
+
+  const gridLines = $derived(
+    yTicks.map((tick) => ({
+      value: tick,
+      y: MARGIN.top + scaleLinear(tick, yDomain.min, yDomain.max, plotHeight, 0)
+    }))
+  );
+
+  const xTickEntries = $derived.by(() => {
+    if (data.length === 0) return [];
+    if (xDomain.kind === "ordinal") {
+      return points.map((p, i) => ({
+        x: p.x,
+        label: String(data[i].x)
+      }));
+    }
+    const target = Math.min(5, data.length);
+    const stride = Math.max(1, Math.round((data.length - 1) / (target - 1 || 1)));
+    const entries: { x: number; label: string }[] = [];
+    for (let i = 0; i < data.length; i += stride) {
+      entries.push({ x: points[i].x, label: String(data[i].x) });
+    }
+    const lastIdx = data.length - 1;
+    if (entries[entries.length - 1]?.label !== String(data[lastIdx].x)) {
+      entries.push({ x: points[lastIdx].x, label: String(data[lastIdx].x) });
+    }
+    return entries;
+  });
+
+  function handleEnter(i: number) {
+    hoveredIndex = i;
+  }
+  function handleLeave() {
+    hoveredIndex = null;
+  }
+
+  const classes = () =>
+    ["st-lineChart", `st-lineChart--${tone}`, className].filter(Boolean).join(" ");
+</script>
+
+<div class={classes()} role="img" aria-label={label}>
+  <svg
+    viewBox="0 0 {width} {height}"
+    preserveAspectRatio="xMidYMid meet"
+    width="100%"
+    height="100%"
+    focusable="false"
+    aria-hidden="true"
+  >
+    <!-- gridlines + Y axis ticks -->
+    {#each gridLines as g (g.value)}
+      <line
+        class="st-lineChart__grid"
+        x1={MARGIN.left}
+        x2={width - MARGIN.right}
+        y1={g.y}
+        y2={g.y}
+      />
+      <text
+        class="st-lineChart__tickLabel"
+        x={MARGIN.left - 6}
+        y={g.y}
+        text-anchor="end"
+        dominant-baseline="middle"
+      >
+        {formatTick(g.value)}
+      </text>
+    {/each}
+
+    <!-- axes -->
+    <line
+      class="st-lineChart__axis"
+      x1={MARGIN.left}
+      x2={MARGIN.left}
+      y1={MARGIN.top}
+      y2={height - MARGIN.bottom}
+    />
+    <line
+      class="st-lineChart__axis"
+      x1={MARGIN.left}
+      x2={width - MARGIN.right}
+      y1={height - MARGIN.bottom}
+      y2={height - MARGIN.bottom}
+    />
+
+    <!-- X tick labels -->
+    {#each xTickEntries as tick, i (i)}
+      <text
+        class="st-lineChart__tickLabel"
+        x={tick.x}
+        y={height - MARGIN.bottom + 16}
+        text-anchor="middle"
+      >
+        {tick.label}
+      </text>
+    {/each}
+
+    {#if area && areaPath}
+      <path class="st-lineChart__area" d={areaPath} />
+    {/if}
+    {#if linePath}
+      <path
+        class="st-lineChart__line"
+        d={linePath}
+        fill="none"
+        stroke-width="2"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+      />
+    {/if}
+
+    {#each points as p (p.index)}
+      <circle
+        class="st-lineChart__dot"
+        cx={p.x}
+        cy={p.y}
+        r="4"
+        tabindex="0"
+        role="img"
+        aria-label="{p.datum.x}: {p.datum.y}"
+        onmouseenter={() => handleEnter(p.index)}
+        onmouseleave={handleLeave}
+        onfocus={() => handleEnter(p.index)}
+        onblur={handleLeave}
+      />
+    {/each}
+  </svg>
+
+  {#if hoveredIndex !== null && points[hoveredIndex]}
+    {@const p = points[hoveredIndex]}
+    <div
+      class="st-lineChart__tooltip"
+      role="presentation"
+      style="left: {(p.x / width) * 100}%; top: {(p.y / height) * 100}%"
+    >
+      <span class="st-lineChart__tooltipLabel">{p.datum.x}</span>
+      <span class="st-lineChart__tooltipValue">{p.datum.y}</span>
+    </div>
+  {/if}
+</div>
+
+<style>
+  .st-lineChart {
+    color: var(--st-semantic-data-category1);
+    display: block;
+    font-family: inherit;
+    position: relative;
+    width: 100%;
+  }
+
+  .st-lineChart--category1 { color: var(--st-semantic-data-category1); }
+  .st-lineChart--category2 { color: var(--st-semantic-data-category2); }
+  .st-lineChart--category3 { color: var(--st-semantic-data-category3); }
+  .st-lineChart--category4 { color: var(--st-semantic-data-category4); }
+  .st-lineChart--category5 { color: var(--st-semantic-data-category5); }
+  .st-lineChart--category6 { color: var(--st-semantic-data-category6); }
+  .st-lineChart--category7 { color: var(--st-semantic-data-category7); }
+  .st-lineChart--category8 { color: var(--st-semantic-data-category8); }
+
+  .st-lineChart svg {
+    display: block;
+    overflow: visible;
+  }
+
+  .st-lineChart__grid {
+    stroke: var(--st-component-lineChart-gridStroke, var(--st-semantic-border-subtle));
+    stroke-dasharray: 2 3;
+    stroke-width: 1;
+    opacity: 0.7;
+  }
+
+  .st-lineChart__axis {
+    stroke: var(--st-component-lineChart-axisStroke, var(--st-semantic-border-subtle));
+    stroke-width: 1;
+  }
+
+  .st-lineChart__tickLabel {
+    fill: var(--st-component-lineChart-labelColor, var(--st-semantic-text-secondary));
+    font-size: 0.6875rem;
+  }
+
+  .st-lineChart__line {
+    stroke: currentColor;
+  }
+
+  .st-lineChart__area {
+    fill: currentColor;
+    opacity: 0.18;
+    stroke: none;
+  }
+
+  .st-lineChart__dot {
+    fill: currentColor;
+    stroke: var(--st-semantic-surface-default);
+    stroke-width: 1.5;
+    cursor: pointer;
+    transition: r 120ms ease;
+  }
+
+  .st-lineChart__dot:hover,
+  .st-lineChart__dot:focus-visible {
+    r: 5.5;
+  }
+
+  .st-lineChart__dot:focus-visible {
+    outline: 2px solid var(--st-semantic-border-interactive);
+    outline-offset: 1px;
+  }
+
+  .st-lineChart__tooltip {
+    background: var(--st-component-lineChart-tooltipBackground, var(--st-semantic-surface-inverse));
+    border-radius: var(--st-radius-sm, 0.25rem);
+    color: var(--st-component-lineChart-tooltipText, var(--st-semantic-text-inverse));
+    display: inline-flex;
+    flex-direction: column;
+    font-size: 0.75rem;
+    gap: 0.125rem;
+    line-height: 1.2;
+    padding: 0.375rem 0.5rem;
+    pointer-events: none;
+    position: absolute;
+    transform: translate(-50%, calc(-100% - 8px));
+    white-space: nowrap;
+    z-index: 1;
+  }
+
+  .st-lineChart__tooltipLabel {
+    font-weight: 600;
+  }
+
+  .st-lineChart__tooltipValue {
+    opacity: 0.85;
+  }
+</style>

package/dist/LineChart.svelte.d.ts

@@ -0,0 +1,19 @@
+export type LineChartTone = "category1" | "category2" | "category3" | "category4" | "category5" | "category6" | "category7" | "category8";
+export type LineChartDatum = {
+    x: number | string;
+    y: number;
+};
+type LineChartProps = {
+    data: LineChartDatum[];
+    width?: number;
+    height?: number;
+    tone?: LineChartTone;
+    smooth?: boolean;
+    area?: boolean;
+    label: string;
+    class?: string;
+};
+declare const LineChart: import("svelte").Component<LineChartProps, {}, "">;
+type LineChart = ReturnType<typeof LineChart>;
+export default LineChart;
+//# sourceMappingURL=LineChart.svelte.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LineChart.svelte.d.ts","sourceRoot":"","sources":["../src/lib/LineChart.svelte.ts"],"names":[],"mappings":"AAGE,MAAM,MAAM,aAAa,GACrB,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,CAAC;AAEhB,MAAM,MAAM,cAAc,GAAG;IAC3B,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACnB,CAAC,EAAE,MAAM,CAAC;CACX,CAAC;AAEF,KAAK,cAAc,GAAG;IACpB,IAAI,EAAE,cAAc,EAAE,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAkOJ,QAAA,MAAM,SAAS,oDAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}

package/dist/Menu.svelte

@@ -1,40 +1,133 @@
-<script lang="ts">
-  import type { HTMLAttributes } from "svelte/elements";
+<script lang="ts" module>
+  import type { Component } from "svelte";
+
+  export type MenuIconProps = {
+    size?: number | string;
+    strokeWidth?: number | string;
+    color?: string;
+    class?: string;
+  } & Record<`data-${string}`, unknown>;
+
+  export type MenuIcon = Component<MenuIconProps>;
 
-  export type MenuItem = {
+  export interface MenuActionItem {
+    kind?: "item";
     label: string;
     value: string;
     disabled?: boolean;
-  };
+    danger?: boolean;
+    icon?: MenuIcon;
+  }
+
+  export interface MenuDividerItem {
+    kind: "divider";
+  }
+
+  export interface MenuGroupItem {
+    kind: "group";
+    label: string;
+  }
+
+  export type MenuItem = MenuActionItem | MenuDividerItem | MenuGroupItem;
+
+  let groupIdCounter = 0;
+  function nextGroupId(): string {
+    groupIdCounter += 1;
+    return `st-menu-group-${groupIdCounter}`;
+  }
+</script>
+
+<script lang="ts">
+  import type { HTMLAttributes } from "svelte/elements";
 
   type MenuProps = Omit<HTMLAttributes<HTMLDivElement>, "class" | "onselect"> & {
     label: string;
     items: MenuItem[];
+    open?: boolean;
+    dismissOnSelect?: boolean;
     class?: string;
+    dense?: boolean;
     onselect?: (value: string) => void;
   };
 
-  let { label, items, class: className, onselect, ...rest }: MenuProps = $props();
-  const classes = () => ["st-menu", className].filter(Boolean).join(" ");
-  const selectItem = (item: MenuItem) => {
-    if (!item.disabled) onselect?.(item.value);
-  };
+  let {
+    label,
+    items,
+    open = $bindable(true),
+    dismissOnSelect = false,
+    class: className,
+    dense = false,
+    onselect,
+    ...rest
+  }: MenuProps = $props();
+
+  let host: HTMLDivElement | undefined = $state();
+
+  const classes = () =>
+    ["st-menu", dense ? "st-menu--dense" : null, className].filter(Boolean).join(" ");
+
+  function selectItem(item: MenuActionItem) {
+    if (item.disabled) return;
+    onselect?.(item.value);
+    if (dismissOnSelect) open = false;
+  }
+
+  function isAction(item: MenuItem): item is MenuActionItem {
+    return item.kind === undefined || item.kind === "item";
+  }
+
+  function onWindowKeydown(event: KeyboardEvent) {
+    if (event.key === "Escape" && open && dismissOnSelect) {
+      event.preventDefault();
+      open = false;
+    }
+  }
+
+  function onWindowPointerDown(event: MouseEvent) {
+    if (!open || !dismissOnSelect) return;
+    const target = event.target as Node | null;
+    if (host && target && !host.contains(target)) open = false;
+  }
 </script>
 
-<div {...rest} class={classes()} role="menu" aria-label={label}>
-  {#each items as item (item.value)}
-    <button
-      class="st-menu__item"
-      type="button"
-      role="menuitem"
-      aria-disabled={item.disabled ? "true" : undefined}
-      disabled={item.disabled}
-      onclick={() => selectItem(item)}
-    >
-      {item.label}
-    </button>
-  {/each}
-</div>
+<svelte:window onkeydown={onWindowKeydown} onpointerdown={onWindowPointerDown} />
+
+{#if open}
+  <div {...rest} bind:this={host} class={classes()} role="menu" aria-label={label}>
+    {#each items as item, index (index)}
+      {#if isAction(item)}
+        {@const Icon = item.icon}
+        <button
+          class="st-menu__item"
+          class:st-menu__item--danger={item.danger}
+          type="button"
+          role="menuitem"
+          aria-disabled={item.disabled ? "true" : undefined}
+          disabled={item.disabled}
+          onclick={() => selectItem(item)}
+        >
+          {#if Icon}
+            <span class="st-menu__itemIcon" aria-hidden="true">
+              <Icon size={16} strokeWidth={2} />
+            </span>
+          {/if}
+          <span class="st-menu__itemLabel">{item.label}</span>
+        </button>
+      {:else if item.kind === "divider"}
+        <div class="st-menu__divider" role="separator" aria-hidden="true"></div>
+      {:else}
+        {@const groupId = nextGroupId()}
+        <div
+          class="st-menu__group"
+          id={groupId}
+          role="presentation"
+        >
+          {item.label}
+        </div>
+      {/if}
+    {/each}
+  </div>
+{/if}
 
 <style>
   .st-menu {
@@ -44,19 +137,28 @@
     box-shadow: var(--st-component-menu-shadow, 0 8px 24px rgb(15 23 42 / 0.14));
     color: var(--st-component-menu-text, var(--st-semantic-text-primary));
     display: grid;
-    min-width: 12rem;
+    min-width: var(--st-component-menu-minWidth, 12rem);
+    max-width: var(--st-component-menu-maxWidth, 18rem);
     padding: var(--st-spacing-1, 0.25rem);
   }
 
   .st-menu__item {
+    align-items: center;
     background: transparent;
     border: 0;
     border-radius: var(--st-radius-small, 0.375rem);
     color: inherit;
     cursor: pointer;
+    display: flex;
     font: inherit;
+    gap: var(--st-spacing-2, 0.5rem);
     padding: var(--st-spacing-2, 0.5rem) var(--st-spacing-3, 0.75rem);
     text-align: left;
+    width: 100%;
+  }
+
+  .st-menu--dense .st-menu__item {
+    padding: 0.3rem 0.6rem;
   }
 
   .st-menu__item:hover:not(:disabled),
@@ -69,4 +171,42 @@
     color: var(--st-component-menu-disabledText, var(--st-semantic-text-muted));
     cursor: not-allowed;
   }
+
+  .st-menu__item--danger {
+    color: var(--st-component-menu-dangerText, var(--st-semantic-feedback-error, #b91c1c));
+  }
+
+  .st-menu__item--danger:hover:not(:disabled),
+  .st-menu__item--danger:focus-visible {
+    background: var(--st-component-menu-dangerHoverBackground, rgba(185, 28, 28, 0.08));
+  }
+
+  .st-menu__itemIcon {
+    align-items: center;
+    display: inline-flex;
+    flex: 0 0 auto;
+    justify-content: center;
+  }
+
+  .st-menu__itemLabel {
+    flex: 1 1 auto;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .st-menu__divider {
+    background: var(--st-component-menu-border, var(--st-semantic-border-subtle));
+    height: 1px;
+    margin: 0.25rem 0;
+  }
+
+  .st-menu__group {
+    color: var(--st-component-menu-groupText, var(--st-semantic-text-muted));
+    font-size: 0.72rem;
+    font-weight: 650;
+    letter-spacing: 0.04em;
+    padding: 0.45rem 0.75rem 0.25rem;
+    text-transform: uppercase;
+  }
 </style>

package/dist/Menu.svelte.d.ts

@@ -1,16 +1,38 @@
-import type { HTMLAttributes } from "svelte/elements";
-export type MenuItem = {
+import type { Component } from "svelte";
+export type MenuIconProps = {
+    size?: number | string;
+    strokeWidth?: number | string;
+    color?: string;
+    class?: string;
+} & Record<`data-${string}`, unknown>;
+export type MenuIcon = Component<MenuIconProps>;
+export interface MenuActionItem {
+    kind?: "item";
     label: string;
     value: string;
     disabled?: boolean;
-};
+    danger?: boolean;
+    icon?: MenuIcon;
+}
+export interface MenuDividerItem {
+    kind: "divider";
+}
+export interface MenuGroupItem {
+    kind: "group";
+    label: string;
+}
+export type MenuItem = MenuActionItem | MenuDividerItem | MenuGroupItem;
+import type { HTMLAttributes } from "svelte/elements";
 type MenuProps = Omit<HTMLAttributes<HTMLDivElement>, "class" | "onselect"> & {
     label: string;
     items: MenuItem[];
+    open?: boolean;
+    dismissOnSelect?: boolean;
     class?: string;
+    dense?: boolean;
     onselect?: (value: string) => void;
 };
-declare const Menu: import("svelte").Component<MenuProps, {}, "">;
+declare const Menu: Component<MenuProps, {}, "open">;
 type Menu = ReturnType<typeof Menu>;
 export default Menu;
 //# sourceMappingURL=Menu.svelte.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Menu.svelte.d.ts","sourceRoot":"","sources":["../src/lib/Menu.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD,MAAM,MAAM,QAAQ,GAAG;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,KAAK,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AAyBJ,QAAA,MAAM,IAAI,+CAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Menu.svelte.d.ts","sourceRoot":"","sources":["../src/lib/Menu.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAExC,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,MAAM,CAAC,QAAQ,MAAM,EAAE,EAAE,OAAO,CAAC,CAAC;AAEtC,MAAM,MAAM,QAAQ,GAAG,SAAS,CAAC,aAAa,CAAC,CAAC;AAEhD,MAAM,WAAW,cAAc;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,SAAS,CAAC;CACjB;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,QAAQ,GAAG,cAAc,GAAG,eAAe,GAAG,aAAa,CAAC;AAS1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGpD,KAAK,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AA8EJ,QAAA,MAAM,IAAI,kCAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}