@photon-ai/pho-ui 4.6.0 → 4.7.0

package/dist/chunks/{filter-bar-BcpeTKCC.js.map → filter-bar-B-oYYBsU.js.map}

@@ -1 +1 @@
-{"version":3,"file":"filter-bar-BcpeTKCC.js","names":[],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.46.0_react@19.2.8/node_modules/@tabler/icons-react/dist/esm/icons/IconPlus.mjs","../../src/components/filter-bar/filter-bar.tsx"],"sourcesContent":["/**\n * @license @tabler/icons-react v3.46.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M12 5l0 14\", \"key\": \"svg-0\" }], [\"path\", { \"d\": \"M5 12l14 0\", \"key\": \"svg-1\" }]];\nconst IconPlus = createReactComponent(\"outline\", \"plus\", \"Plus\", __iconNode);\n\nexport { __iconNode, IconPlus as default };\n//# sourceMappingURL=IconPlus.mjs.map\n","import {\n  useRef,\n  useState,\n  type ComponentProps,\n  type ReactNode,\n  type Ref,\n  type RefObject,\n} from \"react\";\nimport { IconCheck, IconPlus, IconSearch, IconX } from \"@tabler/icons-react\";\nimport { Button } from \"../button\";\nimport { Command } from \"../command\";\nimport { InputGroup } from \"../input-group\";\nimport { Popover } from \"../popover\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Filter Bar — the row that pins above a log list: a search field for an\n * id, then one chip per filter. A chip with nothing chosen reads\n * `+ Status`; with a value it reads `Status: Failed` and carries its own\n * clear. Each chip opens a small popover: a keyboard-first list of\n * options (with a search field past eight of them), or presets and a\n * from / to pair for a date range.\n *\n * Design notes:\n * - Fully controlled. The page owns `filters` and `search` and hands\n *   them back changed; the bar keeps no state but which popover is open.\n *   That keeps the query in one place (the URL, a store) and lets the\n *   list refetch from it.\n * - Chips are real buttons (the trigger, and the clear beside it), so\n *   the bar is one tab stop per control and Escape closes a popover\n *   back onto its chip.\n * - No scroll container of its own: chips wrap. `sticky` pins it to the\n *   top of the nearest scroll pane on the surface it sits on.\n */\n\nexport interface FilterOption {\n  value: string;\n  label: string;\n  /**\n   * Rich option row (a badge, mono path). Search and the set chip still\n   * use `label` and `value` strings.\n   */\n  title?: ReactNode;\n}\n\ninterface FilterDefinitionBase {\n  /** The key in `filters` this chip reads and writes. */\n  key: string;\n  /** The chip's word — \"Status\", \"Event type\". Sentence case. */\n  label: string;\n}\n\nexport interface SelectFilterDefinition extends FilterDefinitionBase {\n  type?: \"select\";\n  options: readonly FilterOption[];\n  /** Several values at once (`string[]`); one at a time by default. */\n  multiple?: boolean;\n  /**\n   * A search field above the options. On by default past eight options,\n   * off below; say so to override.\n   */\n  searchable?: boolean;\n  /** The search field's placeholder. @default \"Search\" */\n  searchPlaceholder?: string;\n}\n\n/** A relative preset for a date-range filter — \"Last 7 days\" is 168 hours. */\nexport interface DateRangePreset {\n  label: string;\n  hours: number;\n}\n\nexport interface DateRangeFilterDefinition extends FilterDefinitionBase {\n  type: \"date-range\";\n  /** The relative presets listed above the from / to pair. */\n  presets?: readonly DateRangePreset[];\n}\n\nexport type FilterDefinition =\n  SelectFilterDefinition | DateRangeFilterDefinition;\n\n/**\n * A date-range value. A preset stores an absolute ISO timestamp in `from`\n * (computed when chosen) and its label in `preset`; the from / to pair\n * stores plain `YYYY-MM-DD` dates. Either side may be open (`null`).\n */\nexport interface DateRangeValue {\n  from: string | null;\n  to: string | null;\n  preset?: string;\n}\n\nexport type FilterValue = string | string[] | DateRangeValue;\n\n/** The page's filter state — one entry per definition key that is set. */\nexport type FilterValues = Record<string, FilterValue | undefined>;\n\n/** The relative presets a date-range chip lists when given none. */\nexport const FILTER_DATE_PRESETS: readonly DateRangePreset[] = [\n  { label: \"Last hour\", hours: 1 },\n  { label: \"Last 24 hours\", hours: 24 },\n  { label: \"Last 7 days\", hours: 24 * 7 },\n  { label: \"Last 30 days\", hours: 24 * 30 },\n];\n\n/** Past this many options a select chip shows a search field. */\nconst SEARCHABLE_PAST = 8;\n\n/** Whether a filter value counts as set — an empty string or list does not. */\nexport function isFilterSet(value: FilterValue | undefined): boolean {\n  if (value == null) return false;\n  if (typeof value === \"string\") return value !== \"\";\n  if (Array.isArray(value)) return value.length > 0;\n  return value.from != null || value.to != null;\n}\n\nconst DATE_ONLY = /^\\d{4}-\\d{2}-\\d{2}$/;\n\nfunction formatDay(value: string): string {\n  // A plain date is a calendar day: format it in UTC so the day survives\n  // every viewer timezone. A timestamp is a moment: format it locally.\n  const dateOnly = DATE_ONLY.test(value);\n  const date = new Date(dateOnly ? `${value}T00:00:00Z` : value);\n  if (Number.isNaN(date.getTime())) return value;\n  return new Intl.DateTimeFormat(\"en-US\", {\n    month: \"short\",\n    day: \"numeric\",\n    ...(dateOnly ? { timeZone: \"UTC\" } : {}),\n  }).format(date);\n}\n\n/** The words a set chip shows after its label. */\nexport function formatFilterValue(\n  definition: FilterDefinition,\n  value: FilterValue | undefined,\n): string {\n  if (!isFilterSet(value) || value == null) return \"\";\n  if (definition.type === \"date-range\") {\n    const range = value as DateRangeValue;\n    if (range.preset) return range.preset;\n    if (range.from && range.to) {\n      return `${formatDay(range.from)} to ${formatDay(range.to)}`;\n    }\n    if (range.from) return `From ${formatDay(range.from)}`;\n    if (range.to) return `Until ${formatDay(range.to)}`;\n    return \"\";\n  }\n  const labelOf = (item: string) =>\n    definition.options.find((option) => option.value === item)?.label ?? item;\n  if (Array.isArray(value)) return value.map(labelOf).join(\", \");\n  return typeof value === \"string\" ? labelOf(value) : \"\";\n}\n\n/* --------------------------------- chips -------------------------------- */\n\nconst CHIP_TRIGGER =\n  \"outline-pho-brand flex h-8 min-w-0 cursor-pointer items-center gap-1.5 rounded-full text-base transition-[color,background-color] duration-100 ease-linear focus-visible:outline-2 focus-visible:-outline-offset-2 [&>svg]:size-4 [&>svg]:shrink-0\";\n\nfunction FilterChip({\n  definition,\n  value,\n  onChange,\n}: {\n  definition: FilterDefinition;\n  value: FilterValue | undefined;\n  onChange: (next: FilterValue | undefined) => void;\n}) {\n  const [open, setOpen] = useState(false);\n  const focusRef = useRef<HTMLElement | null>(null);\n  const set = isFilterSet(value);\n  const display = formatFilterValue(definition, value);\n  return (\n    <Popover.Root open={open} onOpenChange={setOpen}>\n      <span\n        data-filter-chip={definition.key}\n        data-set={set || undefined}\n        className={cn(\n          \"ring-pho-primary inline-flex max-w-full shrink-0 items-stretch rounded-full ring-1 ring-inset\",\n          set ? \"bg-pho-secondary\" : \"bg-transparent\",\n        )}\n      >\n        <Popover.Trigger\n          aria-label={set ? undefined : `${definition.label} filter`}\n          className={cn(\n            CHIP_TRIGGER,\n            \"hover:bg-pho-ghost-hover\",\n            set ? \"pr-1.5 pl-3\" : \"pr-3 pl-2.5\",\n            set ? \"rounded-r-none\" : \"\",\n          )}\n        >\n          {set ? null : <IconPlus aria-hidden />}\n          {set ? (\n            <span className=\"flex min-w-0 items-baseline gap-1\">\n              <span className=\"text-pho-description shrink-0\">\n                {definition.label}:\n              </span>\n              <span className=\"text-pho-primary max-w-56 truncate font-medium\">\n                {display}\n              </span>\n            </span>\n          ) : (\n            <span className=\"text-pho-secondary\">{definition.label}</span>\n          )}\n        </Popover.Trigger>\n        {set ? (\n          <button\n            type=\"button\"\n            aria-label={`Clear ${definition.label.toLowerCase()} filter`}\n            onClick={() => onChange(undefined)}\n            className={cn(\n              CHIP_TRIGGER,\n              \"text-pho-secondary hover:bg-pho-ghost-hover hover:text-pho-secondary-hover rounded-l-none pr-2.5 pl-1 [&>svg]:size-3.5\",\n            )}\n          >\n            <IconX aria-hidden />\n          </button>\n        ) : null}\n      </span>\n      <Popover.Portal>\n        <Popover.Positioner align=\"start\" sideOffset={6}>\n          <Popover.Popup\n            aria-label={`${definition.label} filter`}\n            initialFocus={focusRef}\n            className={cn(\n              \"w-64 p-0\",\n              definition.type === \"date-range\" && \"w-72\",\n            )}\n          >\n            {definition.type === \"date-range\" ? (\n              <DateRangePanel\n                definition={definition}\n                value={value as DateRangeValue | undefined}\n                focusRef={focusRef}\n                onChange={(next) => {\n                  onChange(next);\n                  if (next?.preset) setOpen(false);\n                }}\n              />\n            ) : (\n              <OptionsPanel\n                definition={definition}\n                value={value as string | string[] | undefined}\n                focusRef={focusRef}\n                onChange={(next) => {\n                  onChange(next);\n                  if (!definition.multiple) setOpen(false);\n                }}\n              />\n            )}\n          </Popover.Popup>\n        </Popover.Positioner>\n      </Popover.Portal>\n    </Popover.Root>\n  );\n}\n\nfunction OptionsPanel({\n  definition,\n  value,\n  focusRef,\n  onChange,\n}: {\n  definition: SelectFilterDefinition;\n  value: string | string[] | undefined;\n  focusRef: RefObject<HTMLElement | null>;\n  onChange: (next: string | string[] | undefined) => void;\n}) {\n  const [query, setQuery] = useState(\"\");\n  const searchable =\n    definition.searchable ?? definition.options.length > SEARCHABLE_PAST;\n  const chosen = new Set(\n    value == null ? [] : Array.isArray(value) ? value : [value],\n  );\n  const needle = query.trim().toLowerCase();\n  const options = needle\n    ? definition.options.filter(\n        (option) =>\n          option.label.toLowerCase().includes(needle) ||\n          option.value.toLowerCase().includes(needle),\n      )\n    : definition.options;\n  const pick = (option: FilterOption) => {\n    if (definition.multiple) {\n      const next = new Set(chosen);\n      if (next.has(option.value)) next.delete(option.value);\n      else next.add(option.value);\n      // Keep the definition's order, so the chip reads the same way\n      // whatever order the values were chosen in.\n      const ordered = definition.options\n        .map((item) => item.value)\n        .filter((item) => next.has(item));\n      onChange(ordered.length > 0 ? ordered : undefined);\n      return;\n    }\n    onChange(chosen.has(option.value) ? undefined : option.value);\n  };\n  return (\n    <Command.Root\n      label={`${definition.label} options`}\n      // Without a search field the list itself takes focus, so the arrow\n      // keys work from the first frame.\n      ref={(node: HTMLDivElement | null) => {\n        if (!searchable) focusRef.current = node;\n      }}\n      className=\"rounded-base\"\n    >\n      {searchable ? (\n        <Command.InputGroup>\n          <IconSearch\n            aria-hidden\n            className=\"text-pho-description pointer-events-none absolute left-3 size-4\"\n          />\n          <Command.Input\n            ref={(node: HTMLInputElement | null) => {\n              focusRef.current = node;\n            }}\n            value={query}\n            onValueChange={setQuery}\n            placeholder={definition.searchPlaceholder ?? \"Search\"}\n            aria-label={`Search ${definition.label.toLowerCase()} options`}\n            className=\"py-2 pr-3 pl-9 text-base\"\n          />\n        </Command.InputGroup>\n      ) : null}\n      <Command.List>\n        <Command.Empty>Nothing matches.</Command.Empty>\n        {options.map((option) => (\n          <Command.Item\n            key={option.value}\n            value={option.value}\n            size=\"sm\"\n            title={option.title ?? option.label}\n            aria-checked={chosen.has(option.value)}\n            icon={chosen.has(option.value) ? <IconCheck aria-hidden /> : null}\n            onSelect={() => pick(option)}\n          />\n        ))}\n      </Command.List>\n    </Command.Root>\n  );\n}\n\nconst DATE_INPUT =\n  \"bg-pho-primary ring-pho-primary text-pho-primary focus-visible:ring-pho-brand w-full min-w-0 rounded-sm px-2 py-1 text-base ring-1 transition-shadow duration-100 ease-linear outline-none ring-inset focus-visible:ring-2\";\n\nfunction DateRangePanel({\n  definition,\n  value,\n  focusRef,\n  onChange,\n}: {\n  definition: DateRangeFilterDefinition;\n  value: DateRangeValue | undefined;\n  focusRef: RefObject<HTMLElement | null>;\n  onChange: (next: DateRangeValue | undefined) => void;\n}) {\n  const presets = definition.presets ?? FILTER_DATE_PRESETS;\n  // A preset's `from` is a timestamp; the day field shows its date.\n  const day = (side: string | null | undefined) =>\n    side == null ? \"\" : DATE_ONLY.test(side) ? side : side.slice(0, 10);\n  const setSide = (side: \"from\" | \"to\", next: string) => {\n    // Editing either day leaves a preset behind: the pair is the value now,\n    // and a preset's timestamp becomes the day it fell on.\n    const range: DateRangeValue = {\n      from: day(value?.from) || null,\n      to: day(value?.to) || null,\n      [side]: next || null,\n    };\n    onChange(range.from == null && range.to == null ? undefined : range);\n  };\n  return (\n    <div className=\"flex flex-col\">\n      <Command.Root\n        label={`${definition.label} presets`}\n        ref={(node: HTMLDivElement | null) => {\n          focusRef.current = node;\n        }}\n        className=\"rounded-t-[inherit]\"\n      >\n        <Command.List>\n          {presets.map((preset) => (\n            <Command.Item\n              key={preset.label}\n              value={preset.label}\n              size=\"sm\"\n              title={preset.label}\n              aria-checked={value?.preset === preset.label}\n              icon={\n                value?.preset === preset.label ? (\n                  <IconCheck aria-hidden />\n                ) : null\n              }\n              onSelect={() =>\n                onChange({\n                  from: new Date(\n                    Date.now() - preset.hours * 60 * 60 * 1000,\n                  ).toISOString(),\n                  to: null,\n                  preset: preset.label,\n                })\n              }\n            />\n          ))}\n        </Command.List>\n      </Command.Root>\n      {/* The day fields stand outside the command list: its arrow-key\n          handling would otherwise swallow the native date stepping. */}\n      <div className=\"border-pho-secondary grid grid-cols-2 gap-2 border-t p-2\">\n        <label className=\"text-pho-description flex min-w-0 flex-col gap-1 text-xs\">\n          From\n          <input\n            type=\"date\"\n            value={day(value?.from)}\n            max={day(value?.to) || undefined}\n            onChange={(event) => setSide(\"from\", event.target.value)}\n            className={DATE_INPUT}\n          />\n        </label>\n        <label className=\"text-pho-description flex min-w-0 flex-col gap-1 text-xs\">\n          To\n          <input\n            type=\"date\"\n            value={day(value?.to)}\n            min={day(value?.from) || undefined}\n            onChange={(event) => setSide(\"to\", event.target.value)}\n            className={DATE_INPUT}\n          />\n        </label>\n      </div>\n    </div>\n  );\n}\n\n/* ---------------------------------- bar --------------------------------- */\n\nexport interface FilterBarProps extends Omit<\n  ComponentProps<\"div\">,\n  \"children\"\n> {\n  /** One chip per definition, in this order. */\n  definitions: readonly FilterDefinition[];\n  /** The values, keyed by definition key. Absent or empty means unset. */\n  filters: FilterValues;\n  /** The whole map, changed — set, cleared, or cleared all. */\n  onFiltersChange: (next: FilterValues) => void;\n  /** The search field's text. The field renders only with `onSearchChange`. */\n  search?: string;\n  onSearchChange?: (value: string) => void;\n  /** A teaching phrase — \"Find an event by id\". @default \"Search\" */\n  searchPlaceholder?: string;\n  /** The field's accessible name when the placeholder is too short to be one. */\n  searchLabel?: string;\n  /**\n   * Pin the bar to the top of the nearest scroll pane. It paints the\n   * surface it sits on (`--pho-surface`) so rows scroll under it.\n   */\n  sticky?: boolean;\n  /** Controls after the chips — a range picker, an export button. */\n  children?: ReactNode;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function FilterBar({\n  definitions,\n  filters,\n  onFiltersChange,\n  search,\n  onSearchChange,\n  searchPlaceholder = \"Search\",\n  searchLabel,\n  sticky,\n  className,\n  children,\n  ...props\n}: FilterBarProps) {\n  const setCount = definitions.filter((definition) =>\n    isFilterSet(filters[definition.key]),\n  ).length;\n  const change = (key: string, next: FilterValue | undefined) => {\n    const rest = { ...filters };\n    if (next === undefined) delete rest[key];\n    else rest[key] = next;\n    onFiltersChange(rest);\n  };\n  return (\n    <div\n      data-filter-bar=\"\"\n      className={cn(\n        \"flex min-w-0 flex-wrap items-center gap-2\",\n        sticky &&\n          \"sticky top-0 z-10 bg-[var(--pho-surface,var(--background-color-pho-page))] py-3\",\n        className,\n      )}\n      {...props}\n    >\n      {onSearchChange != null ? (\n        <InputGroup.Root size=\"sm\" className=\"w-64 max-w-full\">\n          <InputGroup.Addon>\n            <IconSearch />\n          </InputGroup.Addon>\n          <InputGroup.Input\n            type=\"search\"\n            value={search ?? \"\"}\n            onChange={(event) => onSearchChange(event.target.value)}\n            onKeyDown={(event) => {\n              if (event.key !== \"Escape\") return;\n              event.preventDefault();\n              onSearchChange(\"\");\n            }}\n            placeholder={searchPlaceholder}\n            aria-label={searchLabel ?? searchPlaceholder}\n          />\n        </InputGroup.Root>\n      ) : null}\n      {definitions.map((definition) => (\n        <FilterChip\n          key={definition.key}\n          definition={definition}\n          value={filters[definition.key]}\n          onChange={(next) => change(definition.key, next)}\n        />\n      ))}\n      {setCount > 1 ? (\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          onClick={() => {\n            const rest = { ...filters };\n            for (const definition of definitions) delete rest[definition.key];\n            onFiltersChange(rest);\n          }}\n        >\n          Clear filters\n        </Button>\n      ) : null}\n      {children}\n    </div>\n  );\n}\n\nFilterBar.displayName = \"FilterBar\";\n"],"x_google_ignoreList":[0],"mappings":";;;;;;;;;;;;AASA,IAAM,IAAa,CAAC,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAc,KAAO;AAAQ,CAAC,GAAG,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAc,KAAO;AAAQ,CAAC,CAAC,GAC9G,IAAW,EAAqB,WAAW,QAAQ,QAAQ,CAAU,GCwF9D,IAAkD;AAAA,EAC7D;AAAA,IAAE,OAAO;AAAA,IAAa,OAAO;AAAA,EAAE;AAAA,EAC/B;AAAA,IAAE,OAAO;AAAA,IAAiB,OAAO;AAAA,EAAG;AAAA,EACpC;AAAA,IAAE,OAAO;AAAA,IAAe,OAAO;AAAA,EAAO;AAAA,EACtC;AAAA,IAAE,OAAO;AAAA,IAAgB,OAAO;AAAA,EAAQ;AAC1C,GAGM,IAAkB;AAGxB,SAAgB,EAAY,GAAyC;AACnE,SAAI,KAAS,OAAa,KACtB,OAAO,KAAU,WAAiB,MAAU,KAC5C,MAAM,QAAQ,CAAK,IAAU,EAAM,SAAS,IACzC,EAAM,QAAQ,QAAQ,EAAM,MAAM;AAC3C;AAEA,IAAM,IAAY;AAElB,SAAS,EAAU,GAAuB;AAGxC,QAAM,IAAW,EAAU,KAAK,CAAK,GAC/B,IAAO,IAAI,KAAK,IAAW,GAAG,CAAA,eAAoB,CAAK;AAC7D,SAAI,OAAO,MAAM,EAAK,QAAQ,CAAC,IAAU,IAClC,IAAI,KAAK,eAAe,SAAS;AAAA,IACtC,OAAO;AAAA,IACP,KAAK;AAAA,IACL,GAAI,IAAW,EAAE,UAAU,MAAM,IAAI,CAAC;AAAA,EACxC,CAAC,EAAE,OAAO,CAAI;AAChB;AAGA,SAAgB,EACd,GACA,GACQ;AACR,MAAI,CAAC,EAAY,CAAK,KAAK,KAAS,KAAM,QAAO;AACjD,MAAI,EAAW,SAAS,cAAc;AACpC,UAAM,IAAQ;AACd,WAAI,EAAM,SAAe,EAAM,SAC3B,EAAM,QAAQ,EAAM,KACf,GAAG,EAAU,EAAM,IAAI,CAAA,OAAQ,EAAU,EAAM,EAAE,CAAA,KAEtD,EAAM,OAAa,QAAQ,EAAU,EAAM,IAAI,CAAA,KAC/C,EAAM,KAAW,SAAS,EAAU,EAAM,EAAE,CAAA,KACzC;AAAA,EACT;AACA,QAAM,IAAA,CAAW,MACf,EAAW,QAAQ,KAAA,CAAM,MAAW,EAAO,UAAU,CAAI,GAAG,SAAS;AACvE,SAAI,MAAM,QAAQ,CAAK,IAAU,EAAM,IAAI,CAAO,EAAE,KAAK,IAAI,IACtD,OAAO,KAAU,WAAW,EAAQ,CAAK,IAAI;AACtD;AAIA,IAAM,IACJ;AAEF,SAAS,EAAW,EAClB,YAAA,GACA,OAAA,GACA,UAAA,EAAA,GAKC;AACD,QAAM,CAAC,GAAM,CAAA,IAAW,EAAS,EAAK,GAChC,IAAW,EAA2B,IAAI,GAC1C,IAAM,EAAY,CAAK,GACvB,IAAU,EAAkB,GAAY,CAAK;AACnD,SACE,gBAAA,EAAC,EAAQ,MAAT;AAAA,IAAoB,MAAA;AAAA,IAAM,cAAc;AAAA,IAAxC,UAAA,CACE,gBAAA,EAAC,QAAD;AAAA,MACE,oBAAkB,EAAW;AAAA,MAC7B,YAAU,KAAO;AAAA,MACjB,WAAW,EACT,iGACA,IAAM,qBAAqB,gBAC7B;AAAA,MANF,UAAA,CAQE,gBAAA,EAAC,EAAQ,SAAT;AAAA,QACE,cAAY,IAAM,SAAY,GAAG,EAAW,KAAA;AAAA,QAC5C,WAAW,EACT,GACA,4BACA,IAAM,gBAAgB,eACtB,IAAM,mBAAmB,EAC3B;AAAA,QAPF,UAAA,CASG,IAAM,OAAO,gBAAA,EAAC,GAAD,EAAU,eAAA,GAAa,CAAA,GACpC,IACC,gBAAA,EAAC,QAAD;AAAA,UAAM,WAAU;AAAA,UAAhB,UAAA,CACE,gBAAA,EAAC,QAAD;AAAA,YAAM,WAAU;AAAA,YAAhB,UAAA,CACG,EAAW,OAAM,GACd;AAAA,UACN,CAAA,GAAA,gBAAA,EAAC,QAAD;AAAA,YAAM,WAAU;AAAA,YACb,UAAA;AAAA,UACG,CAAA,CACF;AAAA,QAEN,CAAA,IAAA,gBAAA,EAAC,QAAD;AAAA,UAAM,WAAU;AAAA,UAAsB,UAAA,EAAW;AAAA,QAAY,CAAA,CAEhD;AAAA,MAChB,CAAA,GAAA,IACC,gBAAA,EAAC,UAAD;AAAA,QACE,MAAK;AAAA,QACL,cAAY,SAAS,EAAW,MAAM,YAAY,CAAA;AAAA,QAClD,SAAA,MAAe,EAAS,MAAS;AAAA,QACjC,WAAW,EACT,GACA,wHACF;AAAA,QAEA,UAAA,gBAAA,EAAC,GAAD,EAAO,eAAA,GAAa,CAAA;AAAA,MACd,CAAA,IACN,IACA;AAAA,IACN,CAAA,GAAA,gBAAA,EAAC,EAAQ,QAAT,EAAA,UACE,gBAAA,EAAC,EAAQ,YAAT;AAAA,MAAoB,OAAM;AAAA,MAAQ,YAAY;AAAA,MAC5C,UAAA,gBAAA,EAAC,EAAQ,OAAT;AAAA,QACE,cAAY,GAAG,EAAW,KAAA;AAAA,QAC1B,cAAc;AAAA,QACd,WAAW,EACT,YACA,EAAW,SAAS,gBAAgB,MACtC;AAAA,QAEC,UAAA,EAAW,SAAS,eACnB,gBAAA,EAAC,GAAD;AAAA,UACc,YAAA;AAAA,UACL,OAAA;AAAA,UACG,UAAA;AAAA,UACV,UAAA,CAAW,MAAS;AAClB,YAAA,EAAS,CAAI,GACT,GAAM,UAAQ,EAAQ,EAAK;AAAA,UACjC;AAAA,QACD,CAAA,IAED,gBAAA,EAAC,GAAD;AAAA,UACc,YAAA;AAAA,UACL,OAAA;AAAA,UACG,UAAA;AAAA,UACV,UAAA,CAAW,MAAS;AAClB,YAAA,EAAS,CAAI,GACR,EAAW,YAAU,EAAQ,EAAK;AAAA,UACzC;AAAA,QACD,CAAA;AAAA,MAEU,CAAA;AAAA,IACG,CAAA,EACN,CAAA,CACJ;AAAA;AAElB;AAEA,SAAS,EAAa,EACpB,YAAA,GACA,OAAA,GACA,UAAA,GACA,UAAA,EAAA,GAMC;AACD,QAAM,CAAC,GAAO,CAAA,IAAY,EAAS,EAAE,GAC/B,IACJ,EAAW,cAAc,EAAW,QAAQ,SAAS,GACjD,IAAS,IAAI,IACjB,KAAS,OAAO,CAAC,IAAI,MAAM,QAAQ,CAAK,IAAI,IAAQ,CAAC,CAAK,CAC5D,GACM,IAAS,EAAM,KAAK,EAAE,YAAY,GAClC,IAAU,IACZ,EAAW,QAAQ,OAAA,CAChB,MACC,EAAO,MAAM,YAAY,EAAE,SAAS,CAAM,KAC1C,EAAO,MAAM,YAAY,EAAE,SAAS,CAAM,CAC9C,IACA,EAAW,SACT,IAAA,CAAQ,MAAyB;AACrC,QAAI,EAAW,UAAU;AACvB,YAAM,IAAO,IAAI,IAAI,CAAM;AAC3B,MAAI,EAAK,IAAI,EAAO,KAAK,IAAG,EAAK,OAAO,EAAO,KAAK,IAC/C,EAAK,IAAI,EAAO,KAAK;AAG1B,YAAM,IAAU,EAAW,QACxB,IAAA,CAAK,MAAS,EAAK,KAAK,EACxB,OAAA,CAAQ,MAAS,EAAK,IAAI,CAAI,CAAC;AAClC,MAAA,EAAS,EAAQ,SAAS,IAAI,IAAU,MAAS;AACjD;AAAA,IACF;AACA,IAAA,EAAS,EAAO,IAAI,EAAO,KAAK,IAAI,SAAY,EAAO,KAAK;AAAA,EAC9D;AACA,SACE,gBAAA,EAAC,EAAQ,MAAT;AAAA,IACE,OAAO,GAAG,EAAW,KAAA;AAAA,IAGrB,KAAA,CAAM,MAAgC;AACpC,MAAK,MAAY,EAAS,UAAU;AAAA,IACtC;AAAA,IACA,WAAU;AAAA,IAPZ,UAAA,CASG,IACC,gBAAA,EAAC,EAAQ,YAAT,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,eAAA;AAAA,MACA,WAAU;AAAA,IACX,CAAA,GACD,gBAAA,EAAC,EAAQ,OAAT;AAAA,MACE,KAAA,CAAM,MAAkC;AACtC,QAAA,EAAS,UAAU;AAAA,MACrB;AAAA,MACA,OAAO;AAAA,MACP,eAAe;AAAA,MACf,aAAa,EAAW,qBAAqB;AAAA,MAC7C,cAAY,UAAU,EAAW,MAAM,YAAY,CAAA;AAAA,MACnD,WAAU;AAAA,IACX,CAAA,CACiB,EAAA,CAAA,IAClB,MACJ,gBAAA,EAAC,EAAQ,MAAT,EAAA,UAAA,CACE,gBAAA,EAAC,EAAQ,OAAT,EAAA,UAAe,mBAA+B,CAAA,GAC7C,EAAQ,IAAA,CAAK,MACZ,gBAAA,EAAC,EAAQ,MAAT;AAAA,MAEE,OAAO,EAAO;AAAA,MACd,MAAK;AAAA,MACL,OAAO,EAAO,SAAS,EAAO;AAAA,MAC9B,gBAAc,EAAO,IAAI,EAAO,KAAK;AAAA,MACrC,MAAM,EAAO,IAAI,EAAO,KAAK,IAAI,gBAAA,EAAC,GAAD,EAAW,eAAA,GAAa,CAAA,IAAI;AAAA,MAC7D,UAAA,MAAgB,EAAK,CAAM;AAAA,IAC5B,GAPM,EAAO,KAOb,CACF,CACW,EAAA,CAAA,CACF;AAAA;AAElB;AAEA,IAAM,IACJ;AAEF,SAAS,EAAe,EACtB,YAAA,GACA,OAAA,GACA,UAAA,GACA,UAAA,EAAA,GAMC;AACD,QAAM,IAAU,EAAW,WAAW,GAEhC,IAAA,CAAO,MACX,KAAQ,OAAO,KAAK,EAAU,KAAK,CAAI,IAAI,IAAO,EAAK,MAAM,GAAG,EAAE,GAC9D,IAAA,CAAW,GAAqB,MAAiB;AAGrD,UAAM,IAAwB;AAAA,MAC5B,MAAM,EAAI,GAAO,IAAI,KAAK;AAAA,MAC1B,IAAI,EAAI,GAAO,EAAE,KAAK;AAAA,MACrB,CAAA,CAAA,GAAO,KAAQ;AAAA,IAClB;AACA,IAAA,EAAS,EAAM,QAAQ,QAAQ,EAAM,MAAM,OAAO,SAAY,CAAK;AAAA,EACrE;AACA,SACE,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,IAAf,UAAA,CACE,gBAAA,EAAC,EAAQ,MAAT;AAAA,MACE,OAAO,GAAG,EAAW,KAAA;AAAA,MACrB,KAAA,CAAM,MAAgC;AACpC,QAAA,EAAS,UAAU;AAAA,MACrB;AAAA,MACA,WAAU;AAAA,MAEV,UAAA,gBAAA,EAAC,EAAQ,MAAT,EAAA,UACG,EAAQ,IAAA,CAAK,MACZ,gBAAA,EAAC,EAAQ,MAAT;AAAA,QAEE,OAAO,EAAO;AAAA,QACd,MAAK;AAAA,QACL,OAAO,EAAO;AAAA,QACd,gBAAc,GAAO,WAAW,EAAO;AAAA,QACvC,MACE,GAAO,WAAW,EAAO,QACvB,gBAAA,EAAC,GAAD,EAAW,eAAA,GAAa,CAAA,IACtB;AAAA,QAEN,UAAA,MACE,EAAS;AAAA,UACP,OAAM,oBAAI,KACR,KAAK,IAAI,IAAI,EAAO,QAAQ,KAAK,KAAK,GACxC,GAAE,YAAY;AAAA,UACd,IAAI;AAAA,UACJ,QAAQ,EAAO;AAAA,QACjB,CAAC;AAAA,MAEJ,GAnBM,EAAO,KAmBb,CACF,EACW,CAAA;AAAA,IACF,CAAA,GAGd,gBAAA,EAAC,OAAD;AAAA,MAAK,WAAU;AAAA,MAAf,UAAA,CACE,gBAAA,EAAC,SAAD;AAAA,QAAO,WAAU;AAAA,QAAjB,UAAA,CAA4E,QAE1E,gBAAA,EAAC,SAAD;AAAA,UACE,MAAK;AAAA,UACL,OAAO,EAAI,GAAO,IAAI;AAAA,UACtB,KAAK,EAAI,GAAO,EAAE,KAAK;AAAA,UACvB,UAAA,CAAW,MAAU,EAAQ,QAAQ,EAAM,OAAO,KAAK;AAAA,UACvD,WAAW;AAAA,QACZ,CAAA,CACI;AAAA,MACP,CAAA,GAAA,gBAAA,EAAC,SAAD;AAAA,QAAO,WAAU;AAAA,QAAjB,UAAA,CAA4E,MAE1E,gBAAA,EAAC,SAAD;AAAA,UACE,MAAK;AAAA,UACL,OAAO,EAAI,GAAO,EAAE;AAAA,UACpB,KAAK,EAAI,GAAO,IAAI,KAAK;AAAA,UACzB,UAAA,CAAW,MAAU,EAAQ,MAAM,EAAM,OAAO,KAAK;AAAA,UACrD,WAAW;AAAA,QACZ,CAAA,CACI;AAAA,MACJ,CAAA,CAAA;AAAA,IACF,CAAA,CAAA;AAAA;AAET;AA+BA,SAAgB,EAAU,EACxB,aAAA,GACA,SAAA,GACA,iBAAA,GACA,QAAA,GACA,gBAAA,GACA,mBAAA,IAAoB,UACpB,aAAA,GACA,QAAA,GACA,WAAA,GACA,UAAA,GACA,GAAG,EAAA,GACc;AACjB,QAAM,IAAW,EAAY,OAAA,CAAQ,MACnC,EAAY,EAAQ,EAAW,GAAA,CAAI,CACrC,EAAE,QACI,IAAA,CAAU,GAAa,MAAkC;AAC7D,UAAM,IAAO,EAAE,GAAG,EAAQ;AAC1B,IAAI,MAAS,SAAW,OAAO,EAAK,CAAA,IAC/B,EAAK,CAAA,IAAO,GACjB,EAAgB,CAAI;AAAA,EACtB;AACA,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,mBAAgB;AAAA,IAChB,WAAW,EACT,6CACA,KACE,mFACF,CACF;AAAA,IACA,GAAI;AAAA,IARN,UAAA;AAAA,MAUG,KAAkB,OACjB,gBAAA,EAAC,EAAW,MAAZ;AAAA,QAAiB,MAAK;AAAA,QAAK,WAAU;AAAA,QAArC,UAAA,CACE,gBAAA,EAAC,EAAW,OAAZ,EAAA,UACE,gBAAA,EAAC,GAAD,CAAa,CAAA,EACG,CAAA,GAClB,gBAAA,EAAC,EAAW,OAAZ;AAAA,UACE,MAAK;AAAA,UACL,OAAO,KAAU;AAAA,UACjB,UAAA,CAAW,MAAU,EAAe,EAAM,OAAO,KAAK;AAAA,UACtD,WAAA,CAAY,MAAU;AACpB,YAAI,EAAM,QAAQ,aAClB,EAAM,eAAe,GACrB,EAAe,EAAE;AAAA,UACnB;AAAA,UACA,aAAa;AAAA,UACb,cAAY,KAAe;AAAA,QAC5B,CAAA,CACc;AAAA,MACf,CAAA,IAAA;AAAA,MACH,EAAY,IAAA,CAAK,MAChB,gBAAA,EAAC,GAAD;AAAA,QAEc,YAAA;AAAA,QACZ,OAAO,EAAQ,EAAW,GAAA;AAAA,QAC1B,UAAA,CAAW,MAAS,EAAO,EAAW,KAAK,CAAI;AAAA,MAChD,GAJM,EAAW,GAIjB,CACF;AAAA,MACA,IAAW,IACV,gBAAA,EAAC,GAAD;AAAA,QACE,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,SAAA,MAAe;AACb,gBAAM,IAAO,EAAE,GAAG,EAAQ;AAC1B,qBAAW,KAAc,EAAa,QAAO,EAAK,EAAW,GAAA;AAC7D,UAAA,EAAgB,CAAI;AAAA,QACtB;AAAA,QACD,UAAA;AAAA,MAEO,CAAA,IACN;AAAA,MACH;AAAA,IACE;AAAA;AAET;AAEA,EAAU,cAAc"}
+{"version":3,"file":"filter-bar-B-oYYBsU.js","names":[],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.46.0_react@19.2.8/node_modules/@tabler/icons-react/dist/esm/icons/IconPlus.mjs","../../src/components/filter-bar/filter-bar.tsx"],"sourcesContent":["/**\n * @license @tabler/icons-react v3.46.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M12 5l0 14\", \"key\": \"svg-0\" }], [\"path\", { \"d\": \"M5 12l14 0\", \"key\": \"svg-1\" }]];\nconst IconPlus = createReactComponent(\"outline\", \"plus\", \"Plus\", __iconNode);\n\nexport { __iconNode, IconPlus as default };\n//# sourceMappingURL=IconPlus.mjs.map\n","import {\n  useRef,\n  useState,\n  type ComponentProps,\n  type ReactNode,\n  type Ref,\n  type RefObject,\n} from \"react\";\nimport { IconCheck, IconPlus, IconSearch, IconX } from \"@tabler/icons-react\";\nimport { Button } from \"../button\";\nimport { Command } from \"../command\";\nimport { InputGroup } from \"../input-group\";\nimport { Popover } from \"../popover\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Filter Bar — the row that pins above a log list: a search field for an\n * id, then one chip per filter. A chip with nothing chosen reads\n * `+ Status`; with a value it reads `Status: Failed` and carries its own\n * clear. Each chip opens a small popover: a keyboard-first list of\n * options (with a search field past eight of them), or presets and a\n * from / to pair for a date range.\n *\n * Design notes:\n * - Fully controlled. The page owns `filters` and `search` and hands\n *   them back changed; the bar keeps no state but which popover is open.\n *   That keeps the query in one place (the URL, a store) and lets the\n *   list refetch from it.\n * - Chips are real buttons (the trigger, and the clear beside it), so\n *   the bar is one tab stop per control and Escape closes a popover\n *   back onto its chip.\n * - No scroll container of its own: chips wrap. `sticky` pins it to the\n *   top of the nearest scroll pane on the surface it sits on.\n */\n\nexport interface FilterOption {\n  value: string;\n  label: string;\n  /**\n   * Rich option row (a badge, mono path). Search and the set chip still\n   * use `label` and `value` strings.\n   */\n  title?: ReactNode;\n}\n\ninterface FilterDefinitionBase {\n  /** The key in `filters` this chip reads and writes. */\n  key: string;\n  /** The chip's word — \"Status\", \"Event type\". Sentence case. */\n  label: string;\n}\n\nexport interface SelectFilterDefinition extends FilterDefinitionBase {\n  type?: \"select\";\n  options: readonly FilterOption[];\n  /** Several values at once (`string[]`); one at a time by default. */\n  multiple?: boolean;\n  /**\n   * A search field above the options. On by default past eight options,\n   * off below; say so to override.\n   */\n  searchable?: boolean;\n  /** The search field's placeholder. @default \"Search\" */\n  searchPlaceholder?: string;\n}\n\n/** A relative preset for a date-range filter — \"Last 7 days\" is 168 hours. */\nexport interface DateRangePreset {\n  label: string;\n  hours: number;\n}\n\nexport interface DateRangeFilterDefinition extends FilterDefinitionBase {\n  type: \"date-range\";\n  /** The relative presets listed above the from / to pair. */\n  presets?: readonly DateRangePreset[];\n}\n\nexport type FilterDefinition =\n  SelectFilterDefinition | DateRangeFilterDefinition;\n\n/**\n * A date-range value. A preset stores an absolute ISO timestamp in `from`\n * (computed when chosen) and its label in `preset`; the from / to pair\n * stores plain `YYYY-MM-DD` dates. Either side may be open (`null`).\n */\nexport interface DateRangeValue {\n  from: string | null;\n  to: string | null;\n  preset?: string;\n}\n\nexport type FilterValue = string | string[] | DateRangeValue;\n\n/** The page's filter state — one entry per definition key that is set. */\nexport type FilterValues = Record<string, FilterValue | undefined>;\n\n/** The relative presets a date-range chip lists when given none. */\nexport const FILTER_DATE_PRESETS: readonly DateRangePreset[] = [\n  { label: \"Last hour\", hours: 1 },\n  { label: \"Last 24 hours\", hours: 24 },\n  { label: \"Last 7 days\", hours: 24 * 7 },\n  { label: \"Last 30 days\", hours: 24 * 30 },\n];\n\n/** Past this many options a select chip shows a search field. */\nconst SEARCHABLE_PAST = 8;\n\n/** Whether a filter value counts as set — an empty string or list does not. */\nexport function isFilterSet(value: FilterValue | undefined): boolean {\n  if (value == null) return false;\n  if (typeof value === \"string\") return value !== \"\";\n  if (Array.isArray(value)) return value.length > 0;\n  return value.from != null || value.to != null;\n}\n\nconst DATE_ONLY = /^\\d{4}-\\d{2}-\\d{2}$/;\n\nfunction formatDay(value: string): string {\n  // A plain date is a calendar day: format it in UTC so the day survives\n  // every viewer timezone. A timestamp is a moment: format it locally.\n  const dateOnly = DATE_ONLY.test(value);\n  const date = new Date(dateOnly ? `${value}T00:00:00Z` : value);\n  if (Number.isNaN(date.getTime())) return value;\n  return new Intl.DateTimeFormat(\"en-US\", {\n    month: \"short\",\n    day: \"numeric\",\n    ...(dateOnly ? { timeZone: \"UTC\" } : {}),\n  }).format(date);\n}\n\n/** The words a set chip shows after its label. */\nexport function formatFilterValue(\n  definition: FilterDefinition,\n  value: FilterValue | undefined,\n): string {\n  if (!isFilterSet(value) || value == null) return \"\";\n  if (definition.type === \"date-range\") {\n    const range = value as DateRangeValue;\n    if (range.preset) return range.preset;\n    if (range.from && range.to) {\n      return `${formatDay(range.from)} to ${formatDay(range.to)}`;\n    }\n    if (range.from) return `From ${formatDay(range.from)}`;\n    if (range.to) return `Until ${formatDay(range.to)}`;\n    return \"\";\n  }\n  const labelOf = (item: string) =>\n    definition.options.find((option) => option.value === item)?.label ?? item;\n  if (Array.isArray(value)) return value.map(labelOf).join(\", \");\n  return typeof value === \"string\" ? labelOf(value) : \"\";\n}\n\n/* --------------------------------- chips -------------------------------- */\n\nconst CHIP_TRIGGER =\n  \"outline-pho-brand flex h-8 min-w-0 cursor-pointer items-center gap-1.5 rounded-full text-base transition-[color,background-color] duration-100 ease-linear focus-visible:outline-2 focus-visible:-outline-offset-2 [&>svg]:size-4 [&>svg]:shrink-0\";\n\nfunction FilterChip({\n  definition,\n  value,\n  onChange,\n}: {\n  definition: FilterDefinition;\n  value: FilterValue | undefined;\n  onChange: (next: FilterValue | undefined) => void;\n}) {\n  const [open, setOpen] = useState(false);\n  const focusRef = useRef<HTMLElement | null>(null);\n  const set = isFilterSet(value);\n  const display = formatFilterValue(definition, value);\n  return (\n    <Popover.Root open={open} onOpenChange={setOpen}>\n      <span\n        data-filter-chip={definition.key}\n        data-set={set || undefined}\n        className={cn(\n          \"ring-pho-primary inline-flex max-w-full shrink-0 items-stretch rounded-full ring-1 ring-inset\",\n          set ? \"bg-pho-secondary\" : \"bg-transparent\",\n        )}\n      >\n        <Popover.Trigger\n          aria-label={set ? undefined : `${definition.label} filter`}\n          className={cn(\n            CHIP_TRIGGER,\n            \"hover:bg-pho-ghost-hover\",\n            set ? \"pr-1.5 pl-3\" : \"pr-3 pl-2.5\",\n            set ? \"rounded-r-none\" : \"\",\n          )}\n        >\n          {set ? null : <IconPlus aria-hidden />}\n          {set ? (\n            <span className=\"flex min-w-0 items-baseline gap-1\">\n              <span className=\"text-pho-description shrink-0\">\n                {definition.label}:\n              </span>\n              <span className=\"text-pho-primary max-w-56 truncate font-medium\">\n                {display}\n              </span>\n            </span>\n          ) : (\n            <span className=\"text-pho-secondary\">{definition.label}</span>\n          )}\n        </Popover.Trigger>\n        {set ? (\n          <button\n            type=\"button\"\n            aria-label={`Clear ${definition.label.toLowerCase()} filter`}\n            onClick={() => onChange(undefined)}\n            className={cn(\n              CHIP_TRIGGER,\n              \"text-pho-secondary hover:bg-pho-ghost-hover hover:text-pho-secondary-hover rounded-l-none pr-2.5 pl-1 [&>svg]:size-3.5\",\n            )}\n          >\n            <IconX aria-hidden />\n          </button>\n        ) : null}\n      </span>\n      <Popover.Portal>\n        <Popover.Positioner align=\"start\" sideOffset={6}>\n          <Popover.Popup\n            aria-label={`${definition.label} filter`}\n            initialFocus={focusRef}\n            className={cn(\n              \"w-64 p-0\",\n              definition.type === \"date-range\" && \"w-72\",\n            )}\n          >\n            {definition.type === \"date-range\" ? (\n              <DateRangePanel\n                definition={definition}\n                value={value as DateRangeValue | undefined}\n                focusRef={focusRef}\n                onChange={(next) => {\n                  onChange(next);\n                  if (next?.preset) setOpen(false);\n                }}\n              />\n            ) : (\n              <OptionsPanel\n                definition={definition}\n                value={value as string | string[] | undefined}\n                focusRef={focusRef}\n                onChange={(next) => {\n                  onChange(next);\n                  if (!definition.multiple) setOpen(false);\n                }}\n              />\n            )}\n          </Popover.Popup>\n        </Popover.Positioner>\n      </Popover.Portal>\n    </Popover.Root>\n  );\n}\n\nfunction OptionsPanel({\n  definition,\n  value,\n  focusRef,\n  onChange,\n}: {\n  definition: SelectFilterDefinition;\n  value: string | string[] | undefined;\n  focusRef: RefObject<HTMLElement | null>;\n  onChange: (next: string | string[] | undefined) => void;\n}) {\n  const [query, setQuery] = useState(\"\");\n  const searchable =\n    definition.searchable ?? definition.options.length > SEARCHABLE_PAST;\n  const chosen = new Set(\n    value == null ? [] : Array.isArray(value) ? value : [value],\n  );\n  const needle = query.trim().toLowerCase();\n  const options = needle\n    ? definition.options.filter(\n        (option) =>\n          option.label.toLowerCase().includes(needle) ||\n          option.value.toLowerCase().includes(needle),\n      )\n    : definition.options;\n  const pick = (option: FilterOption) => {\n    if (definition.multiple) {\n      const next = new Set(chosen);\n      if (next.has(option.value)) next.delete(option.value);\n      else next.add(option.value);\n      // Keep the definition's order, so the chip reads the same way\n      // whatever order the values were chosen in.\n      const ordered = definition.options\n        .map((item) => item.value)\n        .filter((item) => next.has(item));\n      onChange(ordered.length > 0 ? ordered : undefined);\n      return;\n    }\n    onChange(chosen.has(option.value) ? undefined : option.value);\n  };\n  return (\n    <Command.Root\n      label={`${definition.label} options`}\n      // Without a search field the list itself takes focus, so the arrow\n      // keys work from the first frame.\n      ref={(node: HTMLDivElement | null) => {\n        if (!searchable) focusRef.current = node;\n      }}\n      className=\"rounded-base\"\n    >\n      {searchable ? (\n        <Command.InputGroup>\n          <IconSearch\n            aria-hidden\n            className=\"text-pho-description pointer-events-none absolute left-3 size-4\"\n          />\n          <Command.Input\n            ref={(node: HTMLInputElement | null) => {\n              focusRef.current = node;\n            }}\n            value={query}\n            onValueChange={setQuery}\n            placeholder={definition.searchPlaceholder ?? \"Search\"}\n            aria-label={`Search ${definition.label.toLowerCase()} options`}\n            className=\"py-2 pr-3 pl-9 text-base\"\n          />\n        </Command.InputGroup>\n      ) : null}\n      <Command.List>\n        <Command.Empty>Nothing matches.</Command.Empty>\n        {options.map((option) => (\n          <Command.Item\n            key={option.value}\n            value={option.value}\n            size=\"sm\"\n            title={option.title ?? option.label}\n            aria-checked={chosen.has(option.value)}\n            icon={chosen.has(option.value) ? <IconCheck aria-hidden /> : null}\n            onSelect={() => pick(option)}\n          />\n        ))}\n      </Command.List>\n    </Command.Root>\n  );\n}\n\nconst DATE_INPUT =\n  \"bg-pho-primary ring-pho-primary text-pho-primary focus-visible:ring-pho-brand w-full min-w-0 rounded-sm px-2 py-1 text-base ring-1 transition-shadow duration-100 ease-linear outline-none ring-inset focus-visible:ring-2\";\n\nfunction DateRangePanel({\n  definition,\n  value,\n  focusRef,\n  onChange,\n}: {\n  definition: DateRangeFilterDefinition;\n  value: DateRangeValue | undefined;\n  focusRef: RefObject<HTMLElement | null>;\n  onChange: (next: DateRangeValue | undefined) => void;\n}) {\n  const presets = definition.presets ?? FILTER_DATE_PRESETS;\n  // A preset's `from` is a timestamp; the day field shows its date.\n  const day = (side: string | null | undefined) =>\n    side == null ? \"\" : DATE_ONLY.test(side) ? side : side.slice(0, 10);\n  const setSide = (side: \"from\" | \"to\", next: string) => {\n    // Editing either day leaves a preset behind: the pair is the value now,\n    // and a preset's timestamp becomes the day it fell on.\n    const range: DateRangeValue = {\n      from: day(value?.from) || null,\n      to: day(value?.to) || null,\n      [side]: next || null,\n    };\n    onChange(range.from == null && range.to == null ? undefined : range);\n  };\n  return (\n    <div className=\"flex flex-col\">\n      <Command.Root\n        label={`${definition.label} presets`}\n        ref={(node: HTMLDivElement | null) => {\n          focusRef.current = node;\n        }}\n        className=\"rounded-t-[inherit]\"\n      >\n        <Command.List>\n          {presets.map((preset) => (\n            <Command.Item\n              key={preset.label}\n              value={preset.label}\n              size=\"sm\"\n              title={preset.label}\n              aria-checked={value?.preset === preset.label}\n              icon={\n                value?.preset === preset.label ? (\n                  <IconCheck aria-hidden />\n                ) : null\n              }\n              onSelect={() =>\n                onChange({\n                  from: new Date(\n                    Date.now() - preset.hours * 60 * 60 * 1000,\n                  ).toISOString(),\n                  to: null,\n                  preset: preset.label,\n                })\n              }\n            />\n          ))}\n        </Command.List>\n      </Command.Root>\n      {/* The day fields stand outside the command list: its arrow-key\n          handling would otherwise swallow the native date stepping. */}\n      <div className=\"border-pho-secondary grid grid-cols-2 gap-2 border-t p-2\">\n        <label className=\"text-pho-description flex min-w-0 flex-col gap-1 text-xs\">\n          From\n          <input\n            type=\"date\"\n            value={day(value?.from)}\n            max={day(value?.to) || undefined}\n            onChange={(event) => setSide(\"from\", event.target.value)}\n            className={DATE_INPUT}\n          />\n        </label>\n        <label className=\"text-pho-description flex min-w-0 flex-col gap-1 text-xs\">\n          To\n          <input\n            type=\"date\"\n            value={day(value?.to)}\n            min={day(value?.from) || undefined}\n            onChange={(event) => setSide(\"to\", event.target.value)}\n            className={DATE_INPUT}\n          />\n        </label>\n      </div>\n    </div>\n  );\n}\n\n/* ---------------------------------- bar --------------------------------- */\n\nexport interface FilterBarProps extends Omit<\n  ComponentProps<\"div\">,\n  \"children\"\n> {\n  /** One chip per definition, in this order. */\n  definitions: readonly FilterDefinition[];\n  /** The values, keyed by definition key. Absent or empty means unset. */\n  filters: FilterValues;\n  /** The whole map, changed — set, cleared, or cleared all. */\n  onFiltersChange: (next: FilterValues) => void;\n  /** The search field's text. The field renders only with `onSearchChange`. */\n  search?: string;\n  onSearchChange?: (value: string) => void;\n  /** A teaching phrase — \"Find an event by id\". @default \"Search\" */\n  searchPlaceholder?: string;\n  /** The field's accessible name when the placeholder is too short to be one. */\n  searchLabel?: string;\n  /**\n   * Pin the bar to the top of the nearest scroll pane. It paints the\n   * surface it sits on (`--pho-surface`) so rows scroll under it.\n   */\n  sticky?: boolean;\n  /** Controls after the chips — a range picker, an export button. */\n  children?: ReactNode;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function FilterBar({\n  definitions,\n  filters,\n  onFiltersChange,\n  search,\n  onSearchChange,\n  searchPlaceholder = \"Search\",\n  searchLabel,\n  sticky,\n  className,\n  children,\n  ...props\n}: FilterBarProps) {\n  const setCount = definitions.filter((definition) =>\n    isFilterSet(filters[definition.key]),\n  ).length;\n  const change = (key: string, next: FilterValue | undefined) => {\n    const rest = { ...filters };\n    if (next === undefined) delete rest[key];\n    else rest[key] = next;\n    onFiltersChange(rest);\n  };\n  return (\n    <div\n      data-filter-bar=\"\"\n      className={cn(\n        \"flex min-w-0 flex-wrap items-center gap-2\",\n        sticky &&\n          \"sticky top-0 z-10 bg-[var(--pho-surface,var(--background-color-pho-page))] py-3\",\n        className,\n      )}\n      {...props}\n    >\n      {onSearchChange != null ? (\n        <InputGroup.Root size=\"sm\" className=\"w-64 max-w-full\">\n          <InputGroup.Addon>\n            <IconSearch />\n          </InputGroup.Addon>\n          <InputGroup.Input\n            type=\"search\"\n            value={search ?? \"\"}\n            onChange={(event) => onSearchChange(event.target.value)}\n            onKeyDown={(event) => {\n              if (event.key !== \"Escape\") return;\n              event.preventDefault();\n              onSearchChange(\"\");\n            }}\n            placeholder={searchPlaceholder}\n            aria-label={searchLabel ?? searchPlaceholder}\n          />\n        </InputGroup.Root>\n      ) : null}\n      {definitions.map((definition) => (\n        <FilterChip\n          key={definition.key}\n          definition={definition}\n          value={filters[definition.key]}\n          onChange={(next) => change(definition.key, next)}\n        />\n      ))}\n      {setCount > 1 ? (\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          onClick={() => {\n            const rest = { ...filters };\n            for (const definition of definitions) delete rest[definition.key];\n            onFiltersChange(rest);\n          }}\n        >\n          Clear filters\n        </Button>\n      ) : null}\n      {children}\n    </div>\n  );\n}\n\nFilterBar.displayName = \"FilterBar\";\n"],"x_google_ignoreList":[0],"mappings":"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"}

package/dist/chunks/{log-list-Didt-MV4.js → log-list-tNuCFGlP.js}

@@ -3,7 +3,7 @@ import { t as a } from "./cn-ChIgwEl3.js";
 import { n as k } from "./link-provider-DXzDQ08N.js";
 import { n as j } from "./use-copy-D6JwKUll.js";
 import { n as O } from "./spinner-BzLUo4Xk.js";
-import { a as A } from "./button-CgUS0j3D.js";
+import { a as A } from "./button-C9VqBBIr.js";
 import { i as D } from "./status-view-C8tabjDu.js";
 import { t as g } from "./skeleton-DwjSl4vC.js";
 import { t as h } from "./tooltip-BTF7GChl.js";
@@ -241,4 +241,4 @@ export {
   pe as t
 };
 
-//# sourceMappingURL=log-list-Didt-MV4.js.map
+//# sourceMappingURL=log-list-tNuCFGlP.js.map

package/dist/chunks/{log-list-Didt-MV4.js.map → log-list-tNuCFGlP.js.map}

@@ -1 +1 @@
-{"version":3,"file":"log-list-Didt-MV4.js","names":[],"sources":["../../src/components/log-list/log-list.tsx"],"sourcesContent":["import {\n  useEffect,\n  useId,\n  useRef,\n  type ComponentProps,\n  type MouseEvent,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { Badge, type BadgeColor, type BadgeSize } from \"../badge\";\nimport { Button } from \"../button\";\nimport { Skeleton } from \"../skeleton\";\nimport { Spinner } from \"../spinner\";\nimport { StatusView } from \"../status-view\";\nimport { Tooltip } from \"../tooltip\";\nimport { cn } from \"../../utils/cn\";\nimport { useCopy } from \"../../utils/use-copy\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\n\n/**\n * Log List — rows of requests, deliveries, or messages, newest first,\n * each one line: a mono id you can copy, a status, the method, what\n * happened, and how long ago. Reach for it where a `DataTable` would be\n * columns of the same few fields: a log reads left to right as one line,\n * and the page filters it from a `FilterBar` pinned above.\n *\n * Design notes:\n * - The surface is `BasicPage.Card`'s: hairline border, `base` radius,\n *   hairline rules between rows. It sits in a `Stack` as any card does.\n * - The row is one link (or one button). It stretches over the row from\n *   the label, the way a `DataTable` row's does, so the whole row is one\n *   pointer target and one tab stop; the copy control sits above it.\n * - The id truncates in the middle, keeping the prefix that says what it\n *   is and the tail that tells it apart. The full id is a tooltip away,\n *   and one click copies it.\n * - `LoadMore` is the sentinel at the end: it asks for the next page as\n *   it scrolls into view, and offers a button for keyboards and for\n *   browsers without an observer.\n */\n\n/** Same chrome as `BasicPage.Card`. */\nconst LOG_LIST_SURFACE =\n  \"rounded-base border border-pho-secondary bg-pho-primary divide-y divide-pho-secondary\";\n\n/** Middle truncation: the prefix and this many after it, then the tail. */\nconst ID_HEAD = 12;\nconst ID_TAIL = 5;\n\n/**\n * Keep the start and the end of an id and fold the middle into an\n * ellipsis — `pho_req_01m04axjqrfzxv4xjet40a84gb` reads\n * `pho_req_01m0…a84gb`. Ids that fit are returned whole.\n */\nexport function truncateMiddle(\n  value: string,\n  head = ID_HEAD,\n  tail = ID_TAIL,\n): string {\n  if (value.length <= head + tail + 1) return value;\n  return `${value.slice(0, head)}…${value.slice(-tail)}`;\n}\n\n/* -------------------------------- status -------------------------------- */\n\nconst SUCCESS_WORDS = new Set([\n  \"success\",\n  \"succeeded\",\n  \"successful\",\n  \"delivered\",\n  \"ok\",\n  \"sent\",\n  \"received\",\n  \"completed\",\n  \"complete\",\n  \"done\",\n  \"active\",\n]);\nconst ERROR_WORDS = new Set([\n  \"failed\",\n  \"failure\",\n  \"error\",\n  \"errored\",\n  \"rejected\",\n  \"undelivered\",\n  \"timeout\",\n  \"timed_out\",\n  \"timed out\",\n  \"canceled\",\n  \"cancelled\",\n]);\nconst WARNING_WORDS = new Set([\n  \"pending\",\n  \"queued\",\n  \"retrying\",\n  \"processing\",\n  \"sending\",\n  \"in_progress\",\n  \"in progress\",\n  \"scheduled\",\n  \"waiting\",\n]);\n\n/**\n * The `Badge` color for a log status: an HTTP status code (2xx success,\n * 3xx gray, 4xx warning, 5xx error) or a word (`delivered` / `failed` /\n * `pending`). Anything else is gray.\n */\nexport function logStatusColor(status: number | string): BadgeColor {\n  if (typeof status === \"number\") {\n    if (status < 300) return \"success\";\n    if (status < 400) return \"gray\";\n    if (status < 500) return \"warning\";\n    return \"error\";\n  }\n  const word = status.trim().toLowerCase();\n  if (/^\\d{3}$/.test(word)) return logStatusColor(Number(word));\n  if (SUCCESS_WORDS.has(word)) return \"success\";\n  if (ERROR_WORDS.has(word)) return \"error\";\n  if (WARNING_WORDS.has(word)) return \"warning\";\n  return \"gray\";\n}\n\n/** A status word as a label: `timed_out` reads `Timed out`. */\nexport function logStatusLabel(status: number | string): string {\n  if (typeof status === \"number\") return String(status);\n  const word = status.trim().replace(/_/g, \" \");\n  return word.charAt(0).toUpperCase() + word.slice(1);\n}\n\nexport interface LogStatusProps extends Omit<\n  ComponentProps<\"span\">,\n  \"children\" | \"color\"\n> {\n  /** An HTTP status code or a status word. */\n  value: number | string;\n  /** Override the derived word. */\n  label?: ReactNode;\n  /** Badge size. @default \"sm\" */\n  size?: BadgeSize;\n}\n\n/** The status slot — a low-contrast `Badge` colored by `logStatusColor`. */\nfunction Status({\n  value,\n  label,\n  size = \"sm\",\n  className,\n  ...props\n}: LogStatusProps) {\n  return (\n    <Badge\n      color={logStatusColor(value)}\n      contrast=\"low\"\n      size={size}\n      className={cn(\"tabular-nums\", className)}\n      {...props}\n    >\n      {label ?? logStatusLabel(value)}\n    </Badge>\n  );\n}\n\n/** The method slot — `POST`, `GET` as a quiet mono chip. */\nfunction Method({\n  className,\n  ...props\n}: ComponentProps<\"span\"> & { ref?: Ref<HTMLSpanElement> }) {\n  return (\n    <span\n      className={cn(\n        \"bg-pho-secondary text-pho-secondary inline-flex h-5 min-w-12 shrink-0 items-center justify-center rounded-sm px-1.5 font-mono text-xs font-medium whitespace-nowrap\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/* ---------------------------------- id ---------------------------------- */\n\n/**\n * The id cell: a mono button that copies the full id, with a tooltip\n * holding the whole of it. The cell is a fixed width in characters so\n * ids line up down the list.\n */\nfunction IdCell({ id, cellId }: { id: string; cellId: string }) {\n  const { copied, copy } = useCopy();\n  return (\n    <Tooltip.Root>\n      <Tooltip.Trigger\n        id={cellId}\n        aria-label={copied ? `${id} copied` : `Copy ${id}`}\n        data-copied={copied || undefined}\n        onClick={() => void copy(id)}\n        className={cn(\n          \"text-pho-secondary outline-pho-brand hover:text-pho-primary relative z-10 -mx-1 w-[calc(18ch+0.5rem)] shrink-0 cursor-pointer truncate rounded-sm px-1 py-0.5 text-left font-mono text-xs transition-colors duration-100 ease-linear focus-visible:outline-2\",\n          \"data-[copied]:text-pho-success\",\n        )}\n      >\n        {copied ? \"Copied\" : truncateMiddle(id)}\n      </Tooltip.Trigger>\n      <output className=\"sr-only\" aria-live=\"polite\">\n        {copied ? \"Copied\" : \"\"}\n      </output>\n      <Tooltip.Portal>\n        <Tooltip.Positioner>\n          <Tooltip.Popup className=\"font-mono\">{id}</Tooltip.Popup>\n        </Tooltip.Positioner>\n      </Tooltip.Portal>\n    </Tooltip.Root>\n  );\n}\n\n/* ---------------------------------- row --------------------------------- */\n\nexport interface LogListRowProps extends Omit<\n  ComponentProps<\"div\">,\n  \"children\" | \"title\" | \"onClick\" | \"id\"\n> {\n  /** The record's id — mono, middle-truncated, copied on click. */\n  id?: string;\n  /** The status slot — usually `LogList.Status`. */\n  status?: ReactNode;\n  /** The method — `POST`, `GET`; rendered in `LogList.Method`. */\n  method?: string;\n  /** What happened — the route, the event type, the message. */\n  label: ReactNode;\n  /** The label in mono — for a route or an event type. */\n  code?: boolean;\n  /**\n   * The line under the label, with real content: who received what from\n   * whom, the destination that answered. A sentence, with its period.\n   */\n  description?: ReactNode;\n  /** Trailing: how long it took — \"59 ms\". */\n  duration?: ReactNode;\n  /** Trailing: when — \"2 min ago\". */\n  time?: ReactNode;\n  /** Trailing content before the duration and time. */\n  children?: ReactNode;\n  /** The row is a link to its page, through the host's `LinkProvider`. */\n  href?: string;\n  /** The row is a button. */\n  onClick?: (event: MouseEvent<HTMLElement>) => void;\n  /**\n   * Replace the row's link element — a router's `Link`, the way Base UI\n   * components take `render`. The row's classes and handlers merge in.\n   */\n  render?: useRender.RenderProp;\n  /** The row whose page is open beside the list — it keeps the wash. */\n  current?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\nfunction Row({\n  id,\n  status,\n  method,\n  label,\n  code,\n  description,\n  duration,\n  time,\n  children,\n  href,\n  onClick,\n  render,\n  current,\n  className,\n  ...props\n}: LogListRowProps) {\n  const Link = useLinkComponent();\n  const base = useId();\n  const interactive = href != null || onClick != null || render != null;\n  const cellIds = {\n    id: `${base}-id`,\n    status: `${base}-status`,\n    method: `${base}-method`,\n    meta: `${base}-meta`,\n  };\n  const hasMeta = children != null || duration != null || time != null;\n  const describedBy = [\n    id != null && cellIds.id,\n    status != null && cellIds.status,\n    method != null && cellIds.method,\n    hasMeta && cellIds.meta,\n  ]\n    .filter(Boolean)\n    .join(\" \");\n  const primary = useRender({\n    render: render ?? (href != null ? <Link href={href} /> : undefined),\n    defaultTagName: href != null ? \"a\" : onClick != null ? \"button\" : \"span\",\n    props: {\n      className: cn(\n        \"text-pho-primary block min-w-0 max-w-full truncate text-left text-base font-medium outline-none\",\n        code && \"font-mono text-xs\",\n        // The one link, stretched over the row; the ring is the row's.\n        interactive &&\n          \"cursor-pointer after:absolute after:inset-0 after:content-['']\",\n      ),\n      onClick,\n      type:\n        render == null && href == null && onClick != null\n          ? \"button\"\n          : undefined,\n      \"aria-current\": current ? \"page\" : undefined,\n      \"aria-describedby\": describedBy || undefined,\n      \"data-log-primary\": \"\",\n      children: label,\n    },\n  });\n  return (\n    <div\n      data-log-row=\"\"\n      data-current={current || undefined}\n      className={cn(\n        \"relative flex min-h-12 min-w-0 items-center gap-3 px-5 py-2.5\",\n        interactive &&\n          \"hover:bg-pho-primary-hover outline-pho-brand transition-colors has-[[data-log-primary]:focus-visible]:outline-2 has-[[data-log-primary]:focus-visible]:-outline-offset-2\",\n        current && \"bg-pho-primary-hover\",\n        // The wash follows the card's rounding (minus the 1px border).\n        \"first:rounded-t-[calc(var(--radius-base)-1px)] last:rounded-b-[calc(var(--radius-base)-1px)]\",\n        className,\n      )}\n      {...props}\n    >\n      {id != null ? <IdCell id={id} cellId={cellIds.id} /> : null}\n      {status != null ? (\n        <span id={cellIds.status} className=\"flex shrink-0 items-center\">\n          {status}\n        </span>\n      ) : null}\n      {method != null ? <Method id={cellIds.method}>{method}</Method> : null}\n      <div data-log-primary-cell=\"\" className=\"min-w-0 flex-1\">\n        {primary}\n        {description != null ? (\n          <p className=\"text-pho-description truncate text-xs\">{description}</p>\n        ) : null}\n      </div>\n      {hasMeta ? (\n        <div\n          id={cellIds.meta}\n          className=\"text-pho-description ml-auto flex shrink-0 items-center gap-3 text-xs whitespace-nowrap tabular-nums\"\n        >\n          {children}\n          {duration != null ? <span>{duration}</span> : null}\n          {time != null ? <span>{time}</span> : null}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\n/* -------------------------------- states -------------------------------- */\n\nexport interface LogListEmptyProps extends Omit<\n  ComponentProps<\"div\">,\n  \"title\" | \"children\"\n> {\n  /** One short line naming the state. @default \"Nothing here yet.\" */\n  title?: ReactNode;\n  /** What fills it, or why it is empty. */\n  description?: ReactNode;\n  /** An action, when there is one. */\n  children?: ReactNode;\n}\n\n/** The list with no rows — `StatusView` at card size. */\nfunction Empty({\n  title = \"Nothing here yet.\",\n  description,\n  children,\n  className,\n  ...props\n}: LogListEmptyProps) {\n  return (\n    <div className={cn(\"flex justify-center\", className)} {...props}>\n      <StatusView\n        size=\"sm\"\n        title={title}\n        description={description}\n        actions={children}\n      />\n    </div>\n  );\n}\n\n/** Bones in the rows' place while the first page is on its way. */\nfunction Loading({ rows = 5 }: { rows?: number }) {\n  return (\n    <>\n      {Array.from({ length: rows }, (_, index) => (\n        <div\n          key={index}\n          aria-hidden\n          className=\"flex min-h-12 items-center gap-3 px-5 py-2.5\"\n        >\n          <Skeleton className=\"h-3.5 w-32\" />\n          <Skeleton className=\"h-5 w-12 rounded-full\" />\n          <Skeleton className=\"h-3.5 w-48\" />\n          <Skeleton className=\"ml-auto h-3.5 w-16\" />\n        </div>\n      ))}\n    </>\n  );\n}\n\nexport interface LogListLoadMoreProps extends Omit<\n  ComponentProps<\"div\">,\n  \"children\"\n> {\n  /** Asked for as the sentinel scrolls into view, and on the button. */\n  onLoadMore: () => void;\n  /** The next page is on its way — the sentinel shows a spinner and waits. */\n  loading?: boolean;\n  /** Nothing left to load — renders nothing. @default true */\n  hasMore?: boolean;\n  /** How far ahead of the viewport to ask. @default \"200px\" */\n  rootMargin?: string;\n  /** The button's words. @default \"Load more\" */\n  label?: ReactNode;\n}\n\n/**\n * The sentinel at the end of the list. An `IntersectionObserver` asks for\n * the next page as it comes into view (`rootMargin` ahead of it); while\n * `loading` it shows a spinner and asks for nothing. The button is the\n * same request for keyboards and for a browser without the observer.\n * SSR-safe: the observer is created in an effect.\n */\nfunction LoadMore({\n  onLoadMore,\n  loading,\n  hasMore = true,\n  rootMargin = \"200px\",\n  label = \"Load more\",\n  className,\n  ...props\n}: LogListLoadMoreProps) {\n  const ref = useRef<HTMLDivElement | null>(null);\n  const latest = useRef(onLoadMore);\n  latest.current = onLoadMore;\n  useEffect(() => {\n    const el = ref.current;\n    if (!hasMore || loading || el == null) return;\n    if (typeof IntersectionObserver === \"undefined\") return;\n    const observer = new IntersectionObserver(\n      (entries) => {\n        if (entries.some((entry) => entry.isIntersecting)) latest.current();\n      },\n      { rootMargin },\n    );\n    observer.observe(el);\n    return () => observer.disconnect();\n  }, [hasMore, loading, rootMargin]);\n  if (!hasMore) return null;\n  return (\n    <div\n      ref={ref}\n      data-log-load-more=\"\"\n      aria-busy={loading || undefined}\n      className={cn(\n        \"flex min-h-12 items-center justify-center px-5 py-2\",\n        className,\n      )}\n      {...props}\n    >\n      {loading ? (\n        <Spinner aria-label=\"Loading more\" className=\"text-pho-secondary\" />\n      ) : (\n        <Button variant=\"ghost\" size=\"sm\" onClick={() => onLoadMore()}>\n          {label}\n        </Button>\n      )}\n    </div>\n  );\n}\n\n/* ---------------------------------- root -------------------------------- */\n\nexport interface LogListRootProps extends ComponentProps<\"div\"> {\n  ref?: Ref<HTMLDivElement>;\n}\n\n/** The card the rows stack in. Mark it `aria-busy` while bones show. */\nfunction Root({ className, ...props }: LogListRootProps) {\n  return (\n    <div\n      data-log-list=\"\"\n      className={cn(LOG_LIST_SURFACE, \"min-w-0\", className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Log List — a card of one-line log rows.\n *\n * ```tsx\n * <LogList.Root>\n *   <LogList.Row\n *     id=\"pho_req_01m04axjqrfzxv4xjet40a84gb\"\n *     status={<LogList.Status value={200} />}\n *     method=\"POST\"\n *     code\n *     label=\"/v1/messages\"\n *     description=\"+1 332 259 3374 received a message from +1 332 222 1111.\"\n *     duration=\"59 ms\"\n *     time=\"2 min ago\"\n *     href=\"/requests/pho_req_01m04axjqrfzxv4xjet40a84gb\"\n *   />\n *   <LogList.LoadMore onLoadMore={fetchNextPage} loading={isFetching} hasMore={hasNextPage} />\n * </LogList.Root>\n * ```\n */\nexport const LogList = {\n  Root,\n  Row,\n  Status,\n  Method,\n  Empty,\n  Loading,\n  LoadMore,\n};\n"],"mappings":"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"}
+{"version":3,"file":"log-list-tNuCFGlP.js","names":[],"sources":["../../src/components/log-list/log-list.tsx"],"sourcesContent":["import {\n  useEffect,\n  useId,\n  useRef,\n  type ComponentProps,\n  type MouseEvent,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { Badge, type BadgeColor, type BadgeSize } from \"../badge\";\nimport { Button } from \"../button\";\nimport { Skeleton } from \"../skeleton\";\nimport { Spinner } from \"../spinner\";\nimport { StatusView } from \"../status-view\";\nimport { Tooltip } from \"../tooltip\";\nimport { cn } from \"../../utils/cn\";\nimport { useCopy } from \"../../utils/use-copy\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\n\n/**\n * Log List — rows of requests, deliveries, or messages, newest first,\n * each one line: a mono id you can copy, a status, the method, what\n * happened, and how long ago. Reach for it where a `DataTable` would be\n * columns of the same few fields: a log reads left to right as one line,\n * and the page filters it from a `FilterBar` pinned above.\n *\n * Design notes:\n * - The surface is `BasicPage.Card`'s: hairline border, `base` radius,\n *   hairline rules between rows. It sits in a `Stack` as any card does.\n * - The row is one link (or one button). It stretches over the row from\n *   the label, the way a `DataTable` row's does, so the whole row is one\n *   pointer target and one tab stop; the copy control sits above it.\n * - The id truncates in the middle, keeping the prefix that says what it\n *   is and the tail that tells it apart. The full id is a tooltip away,\n *   and one click copies it.\n * - `LoadMore` is the sentinel at the end: it asks for the next page as\n *   it scrolls into view, and offers a button for keyboards and for\n *   browsers without an observer.\n */\n\n/** Same chrome as `BasicPage.Card`. */\nconst LOG_LIST_SURFACE =\n  \"rounded-base border border-pho-secondary bg-pho-primary divide-y divide-pho-secondary\";\n\n/** Middle truncation: the prefix and this many after it, then the tail. */\nconst ID_HEAD = 12;\nconst ID_TAIL = 5;\n\n/**\n * Keep the start and the end of an id and fold the middle into an\n * ellipsis — `pho_req_01m04axjqrfzxv4xjet40a84gb` reads\n * `pho_req_01m0…a84gb`. Ids that fit are returned whole.\n */\nexport function truncateMiddle(\n  value: string,\n  head = ID_HEAD,\n  tail = ID_TAIL,\n): string {\n  if (value.length <= head + tail + 1) return value;\n  return `${value.slice(0, head)}…${value.slice(-tail)}`;\n}\n\n/* -------------------------------- status -------------------------------- */\n\nconst SUCCESS_WORDS = new Set([\n  \"success\",\n  \"succeeded\",\n  \"successful\",\n  \"delivered\",\n  \"ok\",\n  \"sent\",\n  \"received\",\n  \"completed\",\n  \"complete\",\n  \"done\",\n  \"active\",\n]);\nconst ERROR_WORDS = new Set([\n  \"failed\",\n  \"failure\",\n  \"error\",\n  \"errored\",\n  \"rejected\",\n  \"undelivered\",\n  \"timeout\",\n  \"timed_out\",\n  \"timed out\",\n  \"canceled\",\n  \"cancelled\",\n]);\nconst WARNING_WORDS = new Set([\n  \"pending\",\n  \"queued\",\n  \"retrying\",\n  \"processing\",\n  \"sending\",\n  \"in_progress\",\n  \"in progress\",\n  \"scheduled\",\n  \"waiting\",\n]);\n\n/**\n * The `Badge` color for a log status: an HTTP status code (2xx success,\n * 3xx gray, 4xx warning, 5xx error) or a word (`delivered` / `failed` /\n * `pending`). Anything else is gray.\n */\nexport function logStatusColor(status: number | string): BadgeColor {\n  if (typeof status === \"number\") {\n    if (status < 300) return \"success\";\n    if (status < 400) return \"gray\";\n    if (status < 500) return \"warning\";\n    return \"error\";\n  }\n  const word = status.trim().toLowerCase();\n  if (/^\\d{3}$/.test(word)) return logStatusColor(Number(word));\n  if (SUCCESS_WORDS.has(word)) return \"success\";\n  if (ERROR_WORDS.has(word)) return \"error\";\n  if (WARNING_WORDS.has(word)) return \"warning\";\n  return \"gray\";\n}\n\n/** A status word as a label: `timed_out` reads `Timed out`. */\nexport function logStatusLabel(status: number | string): string {\n  if (typeof status === \"number\") return String(status);\n  const word = status.trim().replace(/_/g, \" \");\n  return word.charAt(0).toUpperCase() + word.slice(1);\n}\n\nexport interface LogStatusProps extends Omit<\n  ComponentProps<\"span\">,\n  \"children\" | \"color\"\n> {\n  /** An HTTP status code or a status word. */\n  value: number | string;\n  /** Override the derived word. */\n  label?: ReactNode;\n  /** Badge size. @default \"sm\" */\n  size?: BadgeSize;\n}\n\n/** The status slot — a low-contrast `Badge` colored by `logStatusColor`. */\nfunction Status({\n  value,\n  label,\n  size = \"sm\",\n  className,\n  ...props\n}: LogStatusProps) {\n  return (\n    <Badge\n      color={logStatusColor(value)}\n      contrast=\"low\"\n      size={size}\n      className={cn(\"tabular-nums\", className)}\n      {...props}\n    >\n      {label ?? logStatusLabel(value)}\n    </Badge>\n  );\n}\n\n/** The method slot — `POST`, `GET` as a quiet mono chip. */\nfunction Method({\n  className,\n  ...props\n}: ComponentProps<\"span\"> & { ref?: Ref<HTMLSpanElement> }) {\n  return (\n    <span\n      className={cn(\n        \"bg-pho-secondary text-pho-secondary inline-flex h-5 min-w-12 shrink-0 items-center justify-center rounded-sm px-1.5 font-mono text-xs font-medium whitespace-nowrap\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/* ---------------------------------- id ---------------------------------- */\n\n/**\n * The id cell: a mono button that copies the full id, with a tooltip\n * holding the whole of it. The cell is a fixed width in characters so\n * ids line up down the list.\n */\nfunction IdCell({ id, cellId }: { id: string; cellId: string }) {\n  const { copied, copy } = useCopy();\n  return (\n    <Tooltip.Root>\n      <Tooltip.Trigger\n        id={cellId}\n        aria-label={copied ? `${id} copied` : `Copy ${id}`}\n        data-copied={copied || undefined}\n        onClick={() => void copy(id)}\n        className={cn(\n          \"text-pho-secondary outline-pho-brand hover:text-pho-primary relative z-10 -mx-1 w-[calc(18ch+0.5rem)] shrink-0 cursor-pointer truncate rounded-sm px-1 py-0.5 text-left font-mono text-xs transition-colors duration-100 ease-linear focus-visible:outline-2\",\n          \"data-[copied]:text-pho-success\",\n        )}\n      >\n        {copied ? \"Copied\" : truncateMiddle(id)}\n      </Tooltip.Trigger>\n      <output className=\"sr-only\" aria-live=\"polite\">\n        {copied ? \"Copied\" : \"\"}\n      </output>\n      <Tooltip.Portal>\n        <Tooltip.Positioner>\n          <Tooltip.Popup className=\"font-mono\">{id}</Tooltip.Popup>\n        </Tooltip.Positioner>\n      </Tooltip.Portal>\n    </Tooltip.Root>\n  );\n}\n\n/* ---------------------------------- row --------------------------------- */\n\nexport interface LogListRowProps extends Omit<\n  ComponentProps<\"div\">,\n  \"children\" | \"title\" | \"onClick\" | \"id\"\n> {\n  /** The record's id — mono, middle-truncated, copied on click. */\n  id?: string;\n  /** The status slot — usually `LogList.Status`. */\n  status?: ReactNode;\n  /** The method — `POST`, `GET`; rendered in `LogList.Method`. */\n  method?: string;\n  /** What happened — the route, the event type, the message. */\n  label: ReactNode;\n  /** The label in mono — for a route or an event type. */\n  code?: boolean;\n  /**\n   * The line under the label, with real content: who received what from\n   * whom, the destination that answered. A sentence, with its period.\n   */\n  description?: ReactNode;\n  /** Trailing: how long it took — \"59 ms\". */\n  duration?: ReactNode;\n  /** Trailing: when — \"2 min ago\". */\n  time?: ReactNode;\n  /** Trailing content before the duration and time. */\n  children?: ReactNode;\n  /** The row is a link to its page, through the host's `LinkProvider`. */\n  href?: string;\n  /** The row is a button. */\n  onClick?: (event: MouseEvent<HTMLElement>) => void;\n  /**\n   * Replace the row's link element — a router's `Link`, the way Base UI\n   * components take `render`. The row's classes and handlers merge in.\n   */\n  render?: useRender.RenderProp;\n  /** The row whose page is open beside the list — it keeps the wash. */\n  current?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\nfunction Row({\n  id,\n  status,\n  method,\n  label,\n  code,\n  description,\n  duration,\n  time,\n  children,\n  href,\n  onClick,\n  render,\n  current,\n  className,\n  ...props\n}: LogListRowProps) {\n  const Link = useLinkComponent();\n  const base = useId();\n  const interactive = href != null || onClick != null || render != null;\n  const cellIds = {\n    id: `${base}-id`,\n    status: `${base}-status`,\n    method: `${base}-method`,\n    meta: `${base}-meta`,\n  };\n  const hasMeta = children != null || duration != null || time != null;\n  const describedBy = [\n    id != null && cellIds.id,\n    status != null && cellIds.status,\n    method != null && cellIds.method,\n    hasMeta && cellIds.meta,\n  ]\n    .filter(Boolean)\n    .join(\" \");\n  const primary = useRender({\n    render: render ?? (href != null ? <Link href={href} /> : undefined),\n    defaultTagName: href != null ? \"a\" : onClick != null ? \"button\" : \"span\",\n    props: {\n      className: cn(\n        \"text-pho-primary block min-w-0 max-w-full truncate text-left text-base font-medium outline-none\",\n        code && \"font-mono text-xs\",\n        // The one link, stretched over the row; the ring is the row's.\n        interactive &&\n          \"cursor-pointer after:absolute after:inset-0 after:content-['']\",\n      ),\n      onClick,\n      type:\n        render == null && href == null && onClick != null\n          ? \"button\"\n          : undefined,\n      \"aria-current\": current ? \"page\" : undefined,\n      \"aria-describedby\": describedBy || undefined,\n      \"data-log-primary\": \"\",\n      children: label,\n    },\n  });\n  return (\n    <div\n      data-log-row=\"\"\n      data-current={current || undefined}\n      className={cn(\n        \"relative flex min-h-12 min-w-0 items-center gap-3 px-5 py-2.5\",\n        interactive &&\n          \"hover:bg-pho-primary-hover outline-pho-brand transition-colors has-[[data-log-primary]:focus-visible]:outline-2 has-[[data-log-primary]:focus-visible]:-outline-offset-2\",\n        current && \"bg-pho-primary-hover\",\n        // The wash follows the card's rounding (minus the 1px border).\n        \"first:rounded-t-[calc(var(--radius-base)-1px)] last:rounded-b-[calc(var(--radius-base)-1px)]\",\n        className,\n      )}\n      {...props}\n    >\n      {id != null ? <IdCell id={id} cellId={cellIds.id} /> : null}\n      {status != null ? (\n        <span id={cellIds.status} className=\"flex shrink-0 items-center\">\n          {status}\n        </span>\n      ) : null}\n      {method != null ? <Method id={cellIds.method}>{method}</Method> : null}\n      <div data-log-primary-cell=\"\" className=\"min-w-0 flex-1\">\n        {primary}\n        {description != null ? (\n          <p className=\"text-pho-description truncate text-xs\">{description}</p>\n        ) : null}\n      </div>\n      {hasMeta ? (\n        <div\n          id={cellIds.meta}\n          className=\"text-pho-description ml-auto flex shrink-0 items-center gap-3 text-xs whitespace-nowrap tabular-nums\"\n        >\n          {children}\n          {duration != null ? <span>{duration}</span> : null}\n          {time != null ? <span>{time}</span> : null}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\n/* -------------------------------- states -------------------------------- */\n\nexport interface LogListEmptyProps extends Omit<\n  ComponentProps<\"div\">,\n  \"title\" | \"children\"\n> {\n  /** One short line naming the state. @default \"Nothing here yet.\" */\n  title?: ReactNode;\n  /** What fills it, or why it is empty. */\n  description?: ReactNode;\n  /** An action, when there is one. */\n  children?: ReactNode;\n}\n\n/** The list with no rows — `StatusView` at card size. */\nfunction Empty({\n  title = \"Nothing here yet.\",\n  description,\n  children,\n  className,\n  ...props\n}: LogListEmptyProps) {\n  return (\n    <div className={cn(\"flex justify-center\", className)} {...props}>\n      <StatusView\n        size=\"sm\"\n        title={title}\n        description={description}\n        actions={children}\n      />\n    </div>\n  );\n}\n\n/** Bones in the rows' place while the first page is on its way. */\nfunction Loading({ rows = 5 }: { rows?: number }) {\n  return (\n    <>\n      {Array.from({ length: rows }, (_, index) => (\n        <div\n          key={index}\n          aria-hidden\n          className=\"flex min-h-12 items-center gap-3 px-5 py-2.5\"\n        >\n          <Skeleton className=\"h-3.5 w-32\" />\n          <Skeleton className=\"h-5 w-12 rounded-full\" />\n          <Skeleton className=\"h-3.5 w-48\" />\n          <Skeleton className=\"ml-auto h-3.5 w-16\" />\n        </div>\n      ))}\n    </>\n  );\n}\n\nexport interface LogListLoadMoreProps extends Omit<\n  ComponentProps<\"div\">,\n  \"children\"\n> {\n  /** Asked for as the sentinel scrolls into view, and on the button. */\n  onLoadMore: () => void;\n  /** The next page is on its way — the sentinel shows a spinner and waits. */\n  loading?: boolean;\n  /** Nothing left to load — renders nothing. @default true */\n  hasMore?: boolean;\n  /** How far ahead of the viewport to ask. @default \"200px\" */\n  rootMargin?: string;\n  /** The button's words. @default \"Load more\" */\n  label?: ReactNode;\n}\n\n/**\n * The sentinel at the end of the list. An `IntersectionObserver` asks for\n * the next page as it comes into view (`rootMargin` ahead of it); while\n * `loading` it shows a spinner and asks for nothing. The button is the\n * same request for keyboards and for a browser without the observer.\n * SSR-safe: the observer is created in an effect.\n */\nfunction LoadMore({\n  onLoadMore,\n  loading,\n  hasMore = true,\n  rootMargin = \"200px\",\n  label = \"Load more\",\n  className,\n  ...props\n}: LogListLoadMoreProps) {\n  const ref = useRef<HTMLDivElement | null>(null);\n  const latest = useRef(onLoadMore);\n  latest.current = onLoadMore;\n  useEffect(() => {\n    const el = ref.current;\n    if (!hasMore || loading || el == null) return;\n    if (typeof IntersectionObserver === \"undefined\") return;\n    const observer = new IntersectionObserver(\n      (entries) => {\n        if (entries.some((entry) => entry.isIntersecting)) latest.current();\n      },\n      { rootMargin },\n    );\n    observer.observe(el);\n    return () => observer.disconnect();\n  }, [hasMore, loading, rootMargin]);\n  if (!hasMore) return null;\n  return (\n    <div\n      ref={ref}\n      data-log-load-more=\"\"\n      aria-busy={loading || undefined}\n      className={cn(\n        \"flex min-h-12 items-center justify-center px-5 py-2\",\n        className,\n      )}\n      {...props}\n    >\n      {loading ? (\n        <Spinner aria-label=\"Loading more\" className=\"text-pho-secondary\" />\n      ) : (\n        <Button variant=\"ghost\" size=\"sm\" onClick={() => onLoadMore()}>\n          {label}\n        </Button>\n      )}\n    </div>\n  );\n}\n\n/* ---------------------------------- root -------------------------------- */\n\nexport interface LogListRootProps extends ComponentProps<\"div\"> {\n  ref?: Ref<HTMLDivElement>;\n}\n\n/** The card the rows stack in. Mark it `aria-busy` while bones show. */\nfunction Root({ className, ...props }: LogListRootProps) {\n  return (\n    <div\n      data-log-list=\"\"\n      className={cn(LOG_LIST_SURFACE, \"min-w-0\", className)}\n      {...props}\n    />\n  );\n}\n\n/**\n * Log List — a card of one-line log rows.\n *\n * ```tsx\n * <LogList.Root>\n *   <LogList.Row\n *     id=\"pho_req_01m04axjqrfzxv4xjet40a84gb\"\n *     status={<LogList.Status value={200} />}\n *     method=\"POST\"\n *     code\n *     label=\"/v1/messages\"\n *     description=\"+1 332 259 3374 received a message from +1 332 222 1111.\"\n *     duration=\"59 ms\"\n *     time=\"2 min ago\"\n *     href=\"/requests/pho_req_01m04axjqrfzxv4xjet40a84gb\"\n *   />\n *   <LogList.LoadMore onLoadMore={fetchNextPage} loading={isFetching} hasMore={hasNextPage} />\n * </LogList.Root>\n * ```\n */\nexport const LogList = {\n  Root,\n  Row,\n  Status,\n  Method,\n  Empty,\n  Loading,\n  LoadMore,\n};\n"],"mappings":"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"}

package/dist/chunks/{message-CTml-TrB.js → message-Dz2-numf.js}

@@ -1,17 +1,17 @@
 "use client";
 import { t as r } from "./cn-ChIgwEl3.js";
-import { createContext as l, useContext as d } from "react";
+import { createContext as f, useContext as m } from "react";
 import { jsx as s } from "react/jsx-runtime";
-var i = l("start");
-function m({ className: e, ...a }) {
+var u = f("start");
+function g({ className: e, ...a }) {
   return /* @__PURE__ */ s("div", {
     "data-message-group": "",
     className: r("flex min-w-0 flex-col gap-2", e),
     ...a
   });
 }
-function f({ align: e = "start", className: a, ...t }) {
-  return /* @__PURE__ */ s(i.Provider, {
+function c({ align: e = "start", className: a, ...t }) {
+  return /* @__PURE__ */ s(u.Provider, {
     value: e,
     children: /* @__PURE__ */ s("div", {
       "data-message": "",
@@ -21,69 +21,72 @@ function f({ align: e = "start", className: a, ...t }) {
     })
   });
 }
-function g({ className: e, ...a }) {
+function x({ className: e, ...a }) {
   return /* @__PURE__ */ s("div", {
     "data-message-avatar": "",
     className: r("flex shrink-0 self-end group-has-[[data-message-footer]]/message:-translate-y-[1.375rem]", e),
     ...a
   });
 }
-function c({ className: e, ...a }) {
-  const t = d(i);
+function p({ className: e, ...a }) {
+  const t = m(u);
   return /* @__PURE__ */ s("div", {
     "data-message-content": "",
     className: r("grid w-max max-w-full flex-none items-end gap-x-1.5 gap-y-1 break-words", "[&>[data-message-header]]:[grid-area:header]", "[&>[data-bubble]]:max-w-[80cqw] [&>[data-bubble]]:[grid-area:main]", "[&>[data-bubble-group]]:max-w-[80cqw] [&>[data-bubble-group]]:[grid-area:main]", "[&>[data-bubble][data-variant=ghost]]:max-w-full", "[&>[data-message-time]]:[grid-area:time]", "[&>[data-message-footer]]:[grid-area:status]", t === "end" ? "ml-auto grid-cols-[auto_minmax(0,max-content)] [grid-template-areas:'._header'_'time_main'_'._status'] [&>[data-bubble-group]]:justify-self-end [&>[data-bubble]]:justify-self-end [&>[data-message-header]]:justify-self-end" : "grid-cols-[minmax(0,max-content)_auto] [grid-template-areas:'header_.'_'main_time'_'status_.'] [&>[data-bubble-group]]:justify-self-start [&>[data-bubble]]:justify-self-start", e),
     ...a
   });
 }
-function p({ className: e, ...a }) {
+function b({ className: e, ...a }) {
   return /* @__PURE__ */ s("div", {
     "data-message-header": "",
     className: r("text-pho-secondary flex w-full max-w-full min-w-0 items-center gap-1.5 px-1 text-xs font-medium group-has-[[data-bubble][data-variant=ghost]]/message:px-0", e),
     ...a
   });
 }
-function x({ className: e, ...a }) {
+function h({ className: e, ...a }) {
   return /* @__PURE__ */ s("div", {
     "data-message-time": "",
     className: r("text-pho-description shrink-0 self-end text-xs whitespace-nowrap tabular-nums opacity-0 transition-opacity duration-100 ease-linear group-focus-within/message:opacity-100 group-hover/message:opacity-100", e),
     ...a
   });
 }
-function b({ className: e, ...a }) {
-  const t = d(i);
+function w({ className: e, ...a }) {
+  const t = m(u);
   return /* @__PURE__ */ s("div", {
     "data-message-footer": "",
     className: r("text-pho-description flex max-w-full min-w-0 items-center gap-1.5 px-1 text-xs group-has-[[data-bubble][data-variant=ghost]]/message:px-0", t === "end" && "justify-self-end", e),
     ...a
   });
 }
-var y = {
-  Root: f,
-  Group: m,
-  Avatar: g,
-  Content: c,
-  Header: p,
-  Time: x,
-  Footer: b
+var j = {
+  Root: c,
+  Group: g,
+  Avatar: x,
+  Content: p,
+  Header: b,
+  Time: h,
+  Footer: w
 };
-function u(e, a) {
+function d(e, a) {
   if (!e || a == null) return null;
   const t = a.trim().toLowerCase(), n = t.split(/[\s.]+/)[0];
   return n ? n === "failed" ? t : n : null;
 }
-function _(e, a) {
+function N(e, a) {
   const t = e[a];
   if (!t) return !1;
-  const n = u(t.outbound === !0, t.status);
+  const n = d(t.outbound === !0, t.status);
   if (n == null) return !1;
-  const o = e[a + 1];
-  return o ? u(o.outbound === !0, o.status) !== n : !0;
+  for (let o = a + 1; o < e.length; o++) {
+    const i = e[o], l = d(i?.outbound === !0, i?.status);
+    if (l != null) return l !== n;
+  }
+  return !0;
 }
 export {
-  _ as n,
-  y as r,
-  u as t
+  N as n,
+  j as r,
+  d as t
 };
 
-//# sourceMappingURL=message-CTml-TrB.js.map
+//# sourceMappingURL=message-Dz2-numf.js.map

package/dist/chunks/{message-CTml-TrB.js.map → message-Dz2-numf.js.map}

@@ -1 +1 @@
-{"version":3,"file":"message-CTml-TrB.js","names":[],"sources":["../../src/components/message/message.tsx","../../src/components/message/message-status.ts"],"sourcesContent":["import { createContext, useContext, type ComponentProps } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Message — one turn in a thread: the row that seats an avatar beside a\n * column of header, bubble, and footer, on the author's side. It owns the\n * row layout and nothing else: the surface is `Bubble`'s, the scrolling\n * and the composer are `Chat`'s.\n *\n * Design notes:\n * - `align=\"end\"` mirrors the row — avatar on the right, column\n *   right-aligned — for the reader's own messages.\n * - The avatar sits at the row's bottom, level with the bubble. When a\n *   `Footer` (status) sits under the bubble, the avatar shifts up by one\n *   line so it stays beside the surface.\n * - `Time` sits beside the bubble, last-line aligned — right of inbound,\n *   left of outbound — and is invisible until the row is hovered or\n *   focused. `Footer` is the status caption under the bubble (Delivered,\n *   Failed). Inbound has no status.\n */\n\nexport type MessageAlign = \"start\" | \"end\";\n\nconst MessageContext = createContext<MessageAlign>(\"start\");\n\n/* --------------------------------- group -------------------------------- */\n\n/** Consecutive messages from one author, spaced as one turn. */\nfunction Group({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-group=\"\"\n      className={cn(\"flex min-w-0 flex-col gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\n/* --------------------------------- root --------------------------------- */\n\nexport interface MessageRootProps extends ComponentProps<\"div\"> {\n  /** Which side the author sits on. @default \"start\" */\n  align?: MessageAlign;\n}\n\n/** The row: avatar beside the content column, mirrored for `end`. */\nfunction Root({ align = \"start\", className, ...props }: MessageRootProps) {\n  return (\n    <MessageContext.Provider value={align}>\n      <div\n        data-message=\"\"\n        data-align={align}\n        className={cn(\n          \"group/message @container relative flex w-full min-w-0 gap-2 text-base\",\n          align === \"end\" && \"flex-row-reverse\",\n          className,\n        )}\n        {...props}\n      />\n    </MessageContext.Provider>\n  );\n}\n\n/* -------------------------------- avatar -------------------------------- */\n\n/**\n * The avatar's seat — pass an `Avatar.Root`. Bottom-aligned with the\n * bubble; lifts by one footer line when the message has a `Footer`.\n */\nfunction Avatar({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-avatar=\"\"\n      className={cn(\n        // Footer line = xs line-height (18px) + the column's 4px gap.\n        \"flex shrink-0 self-end group-has-[[data-message-footer]]/message:-translate-y-[1.375rem]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/* -------------------------------- content ------------------------------- */\n\n/**\n * Header over the bubble; time beside it; status under it. Inbound is\n * `[bubble][time]`. Outbound is `[time][bubble]` with `Footer` below\n * the bubble column.\n */\nfunction Content({ className, ...props }: ComponentProps<\"div\">) {\n  const align = useContext(MessageContext);\n  return (\n    <div\n      data-message-content=\"\"\n      className={cn(\n        \"grid w-max max-w-full flex-none items-end gap-x-1.5 gap-y-1 break-words\",\n        \"[&>[data-message-header]]:[grid-area:header]\",\n        \"[&>[data-bubble]]:max-w-[80cqw] [&>[data-bubble]]:[grid-area:main]\",\n        \"[&>[data-bubble-group]]:max-w-[80cqw] [&>[data-bubble-group]]:[grid-area:main]\",\n        \"[&>[data-bubble][data-variant=ghost]]:max-w-full\",\n        \"[&>[data-message-time]]:[grid-area:time]\",\n        \"[&>[data-message-footer]]:[grid-area:status]\",\n        align === \"end\"\n          ? \"ml-auto grid-cols-[auto_minmax(0,max-content)] [grid-template-areas:'._header'_'time_main'_'._status'] [&>[data-bubble-group]]:justify-self-end [&>[data-bubble]]:justify-self-end [&>[data-message-header]]:justify-self-end\"\n          : \"grid-cols-[minmax(0,max-content)_auto] [grid-template-areas:'header_.'_'main_time'_'status_.'] [&>[data-bubble-group]]:justify-self-start [&>[data-bubble]]:justify-self-start\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Who — the sender's name over the bubble, secondary ink. */\nfunction Header({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-header=\"\"\n      className={cn(\n        \"text-pho-secondary flex w-full max-w-full min-w-0 items-center gap-1.5 px-1 text-xs font-medium group-has-[[data-bubble][data-variant=ghost]]/message:px-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Clock beside the bubble, last-line aligned. Description ink, tabular.\n * Inbound sits to the right; outbound to the left. The slot stays in\n * layout; the digits show when the row is hovered or focused.\n */\nfunction Time({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-time=\"\"\n      className={cn(\n        \"text-pho-description shrink-0 self-end text-xs whitespace-nowrap tabular-nums opacity-0 transition-opacity duration-100 ease-linear group-focus-within/message:opacity-100 group-hover/message:opacity-100\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Status under the bubble — Delivered, Failed. Inbound leaves it off.\n * Description ink.\n */\nfunction Footer({ className, ...props }: ComponentProps<\"div\">) {\n  const align = useContext(MessageContext);\n  return (\n    <div\n      data-message-footer=\"\"\n      className={cn(\n        \"text-pho-description flex max-w-full min-w-0 items-center gap-1.5 px-1 text-xs group-has-[[data-bubble][data-variant=ghost]]/message:px-0\",\n        align === \"end\" && \"justify-self-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * A turn in a thread. `Root` takes `align`; `Avatar` seats an\n * `Avatar.Root`; `Content` places `Header` over the bubble, `Time`\n * beside it, and `Footer` under it.\n *\n * ```tsx\n * <Message.Root align=\"end\">\n *   <Message.Content>\n *     <Bubble.Root variant=\"inverse\" align=\"end\">\n *       <Bubble.Content>On my way.</Bubble.Content>\n *     </Bubble.Root>\n *     <Message.Time>2:47 PM</Message.Time>\n *     <Message.Footer>Delivered.</Message.Footer>\n *   </Message.Content>\n * </Message.Root>\n * ```\n */\nexport const Message = { Root, Group, Avatar, Content, Header, Time, Footer };\n","/**\n * One row in a thread, enough to decide whether its outbound status\n * caption should show. Inbound rows leave `outbound` off.\n */\nexport interface MessageStatusItem {\n  outbound?: boolean;\n  /** Delivered, Sent, Failed — or a token like `delivered`. */\n  status?: string | null;\n}\n\n/**\n * The coalesce key for a row: outbound status word, lowercased. Inbound\n * and empty statuses are `null`, so they break a run. A failure keeps its\n * whole text (`failed. 30007`) so two different error codes never\n * collapse into one caption.\n */\nexport function messageStatusKey(\n  outbound: boolean,\n  status: string | null | undefined,\n): string | null {\n  if (!outbound || status == null) return null;\n  const text = status.trim().toLowerCase();\n  const word = text.split(/[\\s.]+/)[0];\n  if (!word) return null;\n  return word === \"failed\" ? text : word;\n}\n\n/**\n * Whether this row should render its outbound status (Delivered, Sent,\n * Failed). Only the last message in a consecutive same-status run shows\n * it. Inbound never does.\n */\nexport function shouldShowMessageStatus(\n  messages: readonly MessageStatusItem[],\n  index: number,\n): boolean {\n  const current = messages[index];\n  if (!current) return false;\n  const key = messageStatusKey(current.outbound === true, current.status);\n  if (key == null) return false;\n  const next = messages[index + 1];\n  if (!next) return true;\n  return messageStatusKey(next.outbound === true, next.status) !== key;\n}\n"],"mappings":";;;;AAuBA,IAAM,IAAiB,EAA4B,OAAO;AAK1D,SAAS,EAAM,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC7D,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,sBAAmB;AAAA,IACnB,WAAW,EAAG,+BAA+B,CAAS;AAAA,IACtD,GAAI;AAAA,EACL,CAAA;AAEL;AAUA,SAAS,EAAK,EAAE,OAAA,IAAQ,SAAS,WAAA,GAAW,GAAG,EAAA,GAA2B;AACxE,SACE,gBAAA,EAAC,EAAe,UAAhB;AAAA,IAAyB,OAAO;AAAA,IAC9B,UAAA,gBAAA,EAAC,OAAD;AAAA,MACE,gBAAa;AAAA,MACb,cAAY;AAAA,MACZ,WAAW,EACT,yEACA,MAAU,SAAS,oBACnB,CACF;AAAA,MACA,GAAI;AAAA,IACL,CAAA;AAAA,EACsB,CAAA;AAE7B;AAQA,SAAS,EAAO,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC9D,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,uBAAoB;AAAA,IACpB,WAAW,EAET,4FACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AASA,SAAS,EAAQ,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC/D,QAAM,IAAQ,EAAW,CAAc;AACvC,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,wBAAqB;AAAA,IACrB,WAAW,EACT,2EACA,gDACA,sEACA,kFACA,oDACA,4CACA,gDACA,MAAU,QACN,kOACA,kLACJ,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAGA,SAAS,EAAO,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC9D,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,uBAAoB;AAAA,IACpB,WAAW,EACT,8JACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAOA,SAAS,EAAK,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC5D,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,qBAAkB;AAAA,IAClB,WAAW,EACT,8MACA,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAMA,SAAS,EAAO,EAAE,WAAA,GAAW,GAAG,EAAA,GAAgC;AAC9D,QAAM,IAAQ,EAAW,CAAc;AACvC,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,uBAAoB;AAAA,IACpB,WAAW,EACT,6IACA,MAAU,SAAS,oBACnB,CACF;AAAA,IACA,GAAI;AAAA,EACL,CAAA;AAEL;AAmBA,IAAa,IAAU;AAAA,EAAE,MAAA;AAAA,EAAM,OAAA;AAAA,EAAO,QAAA;AAAA,EAAQ,SAAA;AAAA,EAAS,QAAA;AAAA,EAAQ,MAAA;AAAA,EAAM,QAAA;AAAO;ACrK5E,SAAgB,EACd,GACA,GACe;AACf,MAAI,CAAC,KAAY,KAAU,KAAM,QAAO;AACxC,QAAM,IAAO,EAAO,KAAK,EAAE,YAAY,GACjC,IAAO,EAAK,MAAM,QAAQ,EAAE,CAAA;AAClC,SAAK,IACE,MAAS,WAAW,IAAO,IADhB;AAEpB;AAOA,SAAgB,EACd,GACA,GACS;AACT,QAAM,IAAU,EAAS,CAAA;AACzB,MAAI,CAAC,EAAS,QAAO;AACrB,QAAM,IAAM,EAAiB,EAAQ,aAAa,IAAM,EAAQ,MAAM;AACtE,MAAI,KAAO,KAAM,QAAO;AACxB,QAAM,IAAO,EAAS,IAAQ,CAAA;AAC9B,SAAK,IACE,EAAiB,EAAK,aAAa,IAAM,EAAK,MAAM,MAAM,IAD/C;AAEpB"}
+{"version":3,"file":"message-Dz2-numf.js","names":[],"sources":["../../src/components/message/message.tsx","../../src/components/message/message-status.ts"],"sourcesContent":["import { createContext, useContext, type ComponentProps } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Message — one turn in a thread: the row that seats an avatar beside a\n * column of header, bubble, and footer, on the author's side. It owns the\n * row layout and nothing else: the surface is `Bubble`'s, the scrolling\n * and the composer are `Chat`'s.\n *\n * Design notes:\n * - `align=\"end\"` mirrors the row — avatar on the right, column\n *   right-aligned — for the reader's own messages.\n * - The avatar sits at the row's bottom, level with the bubble. When a\n *   `Footer` (status) sits under the bubble, the avatar shifts up by one\n *   line so it stays beside the surface.\n * - `Time` sits beside the bubble, last-line aligned — right of inbound,\n *   left of outbound — and is invisible until the row is hovered or\n *   focused. `Footer` is the status caption under the bubble (Delivered,\n *   Failed). Inbound has no status.\n */\n\nexport type MessageAlign = \"start\" | \"end\";\n\nconst MessageContext = createContext<MessageAlign>(\"start\");\n\n/* --------------------------------- group -------------------------------- */\n\n/** Consecutive messages from one author, spaced as one turn. */\nfunction Group({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-group=\"\"\n      className={cn(\"flex min-w-0 flex-col gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\n/* --------------------------------- root --------------------------------- */\n\nexport interface MessageRootProps extends ComponentProps<\"div\"> {\n  /** Which side the author sits on. @default \"start\" */\n  align?: MessageAlign;\n}\n\n/** The row: avatar beside the content column, mirrored for `end`. */\nfunction Root({ align = \"start\", className, ...props }: MessageRootProps) {\n  return (\n    <MessageContext.Provider value={align}>\n      <div\n        data-message=\"\"\n        data-align={align}\n        className={cn(\n          \"group/message @container relative flex w-full min-w-0 gap-2 text-base\",\n          align === \"end\" && \"flex-row-reverse\",\n          className,\n        )}\n        {...props}\n      />\n    </MessageContext.Provider>\n  );\n}\n\n/* -------------------------------- avatar -------------------------------- */\n\n/**\n * The avatar's seat — pass an `Avatar.Root`. Bottom-aligned with the\n * bubble; lifts by one footer line when the message has a `Footer`.\n */\nfunction Avatar({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-avatar=\"\"\n      className={cn(\n        // Footer line = xs line-height (18px) + the column's 4px gap.\n        \"flex shrink-0 self-end group-has-[[data-message-footer]]/message:-translate-y-[1.375rem]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/* -------------------------------- content ------------------------------- */\n\n/**\n * Header over the bubble; time beside it; status under it. Inbound is\n * `[bubble][time]`. Outbound is `[time][bubble]` with `Footer` below\n * the bubble column.\n */\nfunction Content({ className, ...props }: ComponentProps<\"div\">) {\n  const align = useContext(MessageContext);\n  return (\n    <div\n      data-message-content=\"\"\n      className={cn(\n        \"grid w-max max-w-full flex-none items-end gap-x-1.5 gap-y-1 break-words\",\n        \"[&>[data-message-header]]:[grid-area:header]\",\n        \"[&>[data-bubble]]:max-w-[80cqw] [&>[data-bubble]]:[grid-area:main]\",\n        \"[&>[data-bubble-group]]:max-w-[80cqw] [&>[data-bubble-group]]:[grid-area:main]\",\n        \"[&>[data-bubble][data-variant=ghost]]:max-w-full\",\n        \"[&>[data-message-time]]:[grid-area:time]\",\n        \"[&>[data-message-footer]]:[grid-area:status]\",\n        align === \"end\"\n          ? \"ml-auto grid-cols-[auto_minmax(0,max-content)] [grid-template-areas:'._header'_'time_main'_'._status'] [&>[data-bubble-group]]:justify-self-end [&>[data-bubble]]:justify-self-end [&>[data-message-header]]:justify-self-end\"\n          : \"grid-cols-[minmax(0,max-content)_auto] [grid-template-areas:'header_.'_'main_time'_'status_.'] [&>[data-bubble-group]]:justify-self-start [&>[data-bubble]]:justify-self-start\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Who — the sender's name over the bubble, secondary ink. */\nfunction Header({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-header=\"\"\n      className={cn(\n        \"text-pho-secondary flex w-full max-w-full min-w-0 items-center gap-1.5 px-1 text-xs font-medium group-has-[[data-bubble][data-variant=ghost]]/message:px-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Clock beside the bubble, last-line aligned. Description ink, tabular.\n * Inbound sits to the right; outbound to the left. The slot stays in\n * layout; the digits show when the row is hovered or focused.\n */\nfunction Time({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      data-message-time=\"\"\n      className={cn(\n        \"text-pho-description shrink-0 self-end text-xs whitespace-nowrap tabular-nums opacity-0 transition-opacity duration-100 ease-linear group-focus-within/message:opacity-100 group-hover/message:opacity-100\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Status under the bubble — Delivered, Failed. Inbound leaves it off.\n * Description ink.\n */\nfunction Footer({ className, ...props }: ComponentProps<\"div\">) {\n  const align = useContext(MessageContext);\n  return (\n    <div\n      data-message-footer=\"\"\n      className={cn(\n        \"text-pho-description flex max-w-full min-w-0 items-center gap-1.5 px-1 text-xs group-has-[[data-bubble][data-variant=ghost]]/message:px-0\",\n        align === \"end\" && \"justify-self-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * A turn in a thread. `Root` takes `align`; `Avatar` seats an\n * `Avatar.Root`; `Content` places `Header` over the bubble, `Time`\n * beside it, and `Footer` under it.\n *\n * ```tsx\n * <Message.Root align=\"end\">\n *   <Message.Content>\n *     <Bubble.Root variant=\"inverse\" align=\"end\">\n *       <Bubble.Content>On my way.</Bubble.Content>\n *     </Bubble.Root>\n *     <Message.Time>2:47 PM</Message.Time>\n *     <Message.Footer>Delivered.</Message.Footer>\n *   </Message.Content>\n * </Message.Root>\n * ```\n */\nexport const Message = { Root, Group, Avatar, Content, Header, Time, Footer };\n","/**\n * One row in a thread, enough to decide whether its outbound status\n * caption should show. Inbound rows leave `outbound` off.\n */\nexport interface MessageStatusItem {\n  outbound?: boolean;\n  /** Delivered, Sent, Failed — or a token like `delivered`. */\n  status?: string | null;\n}\n\n/**\n * The coalesce key for a row: outbound status word, lowercased. Inbound\n * and empty statuses are `null`: they carry no status and sit outside the\n * runs (see `shouldShowMessageStatus`). A failure keeps its\n * whole text (`failed. 30007`) so two different error codes never\n * collapse into one caption.\n */\nexport function messageStatusKey(\n  outbound: boolean,\n  status: string | null | undefined,\n): string | null {\n  if (!outbound || status == null) return null;\n  const text = status.trim().toLowerCase();\n  const word = text.split(/[\\s.]+/)[0];\n  if (!word) return null;\n  return word === \"failed\" ? text : word;\n}\n\n/**\n * Whether this row should render its outbound status (Delivered, Sent,\n * Failed). Only the last message in a same-status run shows it. Inbound\n * never does, and a reply in between does not break the run: the run is\n * over the outbound messages alone, so a conversation going back and forth\n * wears one Delivered, under the latest message it holds for, not one\n * under every turn.\n */\nexport function shouldShowMessageStatus(\n  messages: readonly MessageStatusItem[],\n  index: number,\n): boolean {\n  const current = messages[index];\n  if (!current) return false;\n  const key = messageStatusKey(current.outbound === true, current.status);\n  if (key == null) return false;\n  for (let at = index + 1; at < messages.length; at++) {\n    const next = messages[at];\n    const nextKey = messageStatusKey(next?.outbound === true, next?.status);\n    if (nextKey != null) return nextKey !== key;\n  }\n  return true;\n}\n"],"mappings":"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"}

package/dist/chunks/{sidebar-BmloUwJQ.js → sidebar-BP39w1iA.js}

@@ -3,7 +3,7 @@ import { t as n } from "./cn-ChIgwEl3.js";
 import { t as ee } from "./is-react-component-DSnjtBmo.js";
 import { n as te } from "./link-provider-DXzDQ08N.js";
 import { SPRING_PRESS as re } from "../motion.js";
-import { a as ae, u as ne } from "./button-CgUS0j3D.js";
+import { a as ae, u as ne } from "./button-C9VqBBIr.js";
 import { t as oe } from "./createReactComponent-BqCmnqfX.js";
 import { t as se } from "./IconArrowUpRight-DGgKzQwV.js";
 import { t as ie } from "./IconChevronRight-CzoJnYNI.js";
@@ -71,7 +71,7 @@ function Ne({ label: r = "Search", kbd: e = "⌘K", className: a, ...s }) {
       keys: e,
       className: "pointer-events-none"
     }),
-    className: n("hover:ring-pho-secondary min-h-9 w-full justify-start gap-2 rounded-sm px-2 py-1.5 has-[[data-icon=prefix]]:pl-2 has-[[data-icon=suffix]]:pr-2 [&>[data-text]]:min-w-0 [&>[data-text]]:flex-1 [&>[data-text]]:truncate [&>[data-text]]:px-0 [&>[data-text]]:text-left", a),
+    className: n("hover:ring-pho-secondary min-h-9 w-full justify-start gap-2 rounded-sm px-2 py-1.5 has-[[data-icon=prefix]]:pl-2 has-[[data-icon=suffix]]:pr-2 [&>[data-text]]:min-w-0 [&>[data-text]]:flex-1 [&>[data-text]]:truncate [&>[data-text]]:text-left", a),
     ...s,
     children: r
   });
@@ -303,4 +303,4 @@ export {
   We as u
 };
 
-//# sourceMappingURL=sidebar-BmloUwJQ.js.map
+//# sourceMappingURL=sidebar-BP39w1iA.js.map

package/dist/chunks/sidebar-BP39w1iA.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-BP39w1iA.js","names":[],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.46.0_react@19.2.8/node_modules/@tabler/icons-react/dist/esm/icons/IconDots.mjs","../../src/sections/sidebar/sidebar.tsx"],"sourcesContent":["/**\n * @license @tabler/icons-react v3.46.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M4 12a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\", \"key\": \"svg-0\" }], [\"path\", { \"d\": \"M11 12a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\", \"key\": \"svg-1\" }], [\"path\", { \"d\": \"M18 12a1 1 0 1 0 2 0a1 1 0 1 0 -2 0\", \"key\": \"svg-2\" }]];\nconst IconDots = createReactComponent(\"outline\", \"dots\", \"Dots\", __iconNode);\n\nexport { __iconNode, IconDots as default };\n//# sourceMappingURL=IconDots.mjs.map\n","import {\n  createContext,\n  isValidElement,\n  useCallback,\n  useContext,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n  type AnchorHTMLAttributes,\n  type ButtonHTMLAttributes,\n  type ComponentProps,\n  type ComponentType,\n  type FC,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport {\n  IconArrowUpRight,\n  IconChevronRight,\n  IconDots,\n} from \"@tabler/icons-react\";\nimport { Collapsible as BaseCollapsible } from \"@base-ui/react/collapsible\";\nimport { SPRING_PRESS } from \"../../motion\";\nimport { motion } from \"motion/react\";\nimport { IconSearch } from \"@tabler/icons-react\";\nimport { Button } from \"../../components/button\";\nimport { Collapsible } from \"../../components/collapsible\";\nimport { Kbd } from \"../../components/kbd\";\nimport { ScrollArea } from \"../../components/scroll-area\";\nimport { cn } from \"../../utils/cn\";\nimport { isReactComponent } from \"../../utils/is-react-component\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\nimport { Avatar } from \"../../components/avatar\";\nimport { buttonVariants } from \"../../components/button\";\n\n/** Same press compression as `Button` — transform-only, every interactive row. */\nconst SIDEBAR_PRESS_SCALE = 0.97;\n/** Framer source transition shared with `Button`: `spring-physics 200 30 0.1`. */\nconst SIDEBAR_PRESS_SPRING = SPRING_PRESS;\nconst SIDEBAR_PRESS_MOTION = {\n  initial: false as const,\n  whileTap: { scale: SIDEBAR_PRESS_SCALE },\n  transition: SIDEBAR_PRESS_SPRING,\n};\n\n/**\n * Sidebar — Pho's first SECTION: a composed app rail, not a micro component.\n * It encodes the navigation rail used across Photon surfaces (the Pho docs\n * site, the dashboard): a sticky full-height column with a brand header, a\n * scrollable stack of titled nav groups, and a pinned footer that usually\n * carries the account row.\n *\n * Sections stay presentational — no router, no data fetching, no theme\n * plumbing. Links render through the host's `LinkProvider` (same contract as\n * `ButtonLink`), state arrives via props (`active`), and interactive footers\n * compose with other Pho parts (e.g. wrap `Sidebar.AccountRow` in a\n * `Menu.Trigger render={...}` to open an account menu).\n *\n * `Root` takes `inset` (`base` | `sm`, default `base`) for the rail's outer\n * padding and header spacing — prefer that over host-app class overrides.\n */\n\n/* ------------------------------- class map ------------------------------- */\n\n/** The rail itself — sticky, full-height, hairline right edge (no inset). */\nexport const SIDEBAR_ROOT =\n  \"border-pho-secondary bg-pho-page sticky top-0 flex h-dvh w-64 shrink-0 flex-col border-r\";\n\n/** Outer inset on `Root` — `base` is the docs/default rail; `sm` is tighter. */\nexport const SIDEBAR_ROOT_INSET = {\n  base: \"px-4 pt-5 pb-4\",\n  sm: \"px-3 pt-4 pb-3\",\n} as const;\n\n/** `SIDEBAR_ROOT` with the default `base` inset — one string for docs chrome. */\nexport const SIDEBAR_ROOT_BASE = cn(SIDEBAR_ROOT, SIDEBAR_ROOT_INSET.base);\n\n/** Header spacing paired with `Root`'s `inset`. */\nexport const SIDEBAR_HEADER_INSET = {\n  base: \"mb-6 px-2\",\n  sm: \"mb-3 px-0\",\n} as const;\n\nexport type SidebarInset = keyof typeof SIDEBAR_ROOT_INSET;\n\n/** A nav row at rest and on hover. Active/inactive inks split below. */\nexport const SIDEBAR_ITEM =\n  \"outline-pho-brand flex min-h-9 w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-left text-base transition-colors focus-visible:outline-2 focus-visible:-outline-offset-1\";\n\n/**\n * Selected row — lifted onto the primary surface with the site hairline.\n * The icon carries the same ink as the label so the pair reads as one unit.\n */\nexport const SIDEBAR_ITEM_ACTIVE =\n  \"bg-pho-primary text-pho-primary ring-pho-secondary font-medium ring-1 ring-inset *:data-icon:text-pho-primary\";\n\n/**\n * Resting row — secondary ink (75%). Hover lifts onto the primary surface\n * (same plane as the active chip, without the ring) so the wash stays quiet\n * on `pho-page`. Icon tracks the label's ink at every state.\n */\nexport const SIDEBAR_ITEM_INACTIVE = cn(\n  \"text-pho-secondary *:data-icon:text-pho-secondary\",\n  \"hover:bg-pho-primary hover:text-pho-primary hover:*:data-icon:text-pho-primary\",\n);\n\n/**\n * A submenu's parent row while one of its children is the current page —\n * primary ink on label and icon, but no surface or ring: the child row\n * carries the full active chip, the parent only points at it.\n */\nexport const SIDEBAR_SUBMENU_TRIGGER_CHILD_ACTIVE =\n  \"text-pho-primary *:data-icon:text-pho-primary\";\n\n/**\n * The trailing chevron on a submenu row — points right at rest, rotates to\n * point down while the panel is open. Base UI sets `data-panel-open` on the\n * trigger; the global reduced-motion guard collapses the rotation.\n */\nexport const SIDEBAR_SUBMENU_CHEVRON =\n  \"ml-auto size-4 shrink-0 transition-transform duration-150 ease-out\";\n\n/**\n * Indent for a submenu's rows so their labels line up with the parent's\n * label: parent padding (8px) + icon (16px) + gap (8px) = 32px, minus the\n * child row's own 8px padding. Without a parent icon the label sits at 8px,\n * so children step in by one row padding only.\n */\nexport const SIDEBAR_SUBMENU_LIST_INDENT = {\n  withIcon: \"pl-6\",\n  withoutIcon: \"pl-4\",\n} as const;\n\nconst SidebarInsetContext = createContext<SidebarInset>(\"base\");\n\n/**\n * Rows inside a `Sidebar.Submenu` report their `active` flag here so the\n * parent can light up and auto-open. `null` outside a submenu.\n */\ninterface SidebarSubmenuContextValue {\n  reportActive: (rowId: string, active: boolean) => void;\n}\n\nconst SidebarSubmenuContext = createContext<SidebarSubmenuContextValue | null>(\n  null,\n);\n\n// React 18 warns that useLayoutEffect does nothing on the server (19 dropped\n// the warning); fall back to useEffect there so SSR'd docs stay quiet.\nconst useIsoLayoutEffect =\n  typeof window === \"undefined\" ? useEffect : useLayoutEffect;\n\n/* --------------------------------- frame --------------------------------- */\n\ninterface RootProps extends ComponentProps<\"aside\"> {\n  /** Outer padding + header spacing. Defaults to `base`. */\n  inset?: SidebarInset;\n  ref?: Ref<HTMLElement>;\n}\n\n/** The rail — a sticky, full-height `<aside>` with the hairline right edge. */\nfunction Root({ className, inset = \"base\", ...props }: RootProps) {\n  return (\n    <SidebarInsetContext.Provider value={inset}>\n      <aside\n        className={cn(SIDEBAR_ROOT, SIDEBAR_ROOT_INSET[inset], className)}\n        {...props}\n        data-inset={inset}\n      />\n    </SidebarInsetContext.Provider>\n  );\n}\n\n/** Brand slot at the top of the rail — logo, wordmark, workspace switcher. */\nfunction Header({ className, ...props }: ComponentProps<\"div\">) {\n  const inset = useContext(SidebarInsetContext);\n  return (\n    <div\n      className={cn(\n        \"flex items-center gap-2.5 [&:has(+nav)]:mb-0\",\n        SIDEBAR_HEADER_INSET[inset],\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * The rail's search row — an outlined button dressed to `Item` metrics so\n * its label lines up with the rows below, the shortcut at the trailing\n * edge. The press is the Button's own; wire `onClick` (and a global ⌘K)\n * to a `Command.Dialog`.\n */\nfunction Search({\n  label = \"Search\",\n  kbd = \"⌘K\",\n  className,\n  ...props\n}: Omit<ComponentProps<typeof Button>, \"children\" | \"variant\" | \"size\"> & {\n  label?: ReactNode;\n  kbd?: string;\n}) {\n  return (\n    <Button\n      variant=\"outlined\"\n      shape=\"square\"\n      size=\"md\"\n      aria-keyshortcuts={kbd === \"⌘K\" ? \"Meta+K Control+K\" : undefined}\n      prefix={<IconSearch aria-hidden />}\n      suffix={<Kbd keys={kbd} className=\"pointer-events-none\" />}\n      className={cn(\n        \"hover:ring-pho-secondary min-h-9 w-full justify-start gap-2 rounded-sm px-2 py-1.5 has-[[data-icon=prefix]]:pl-2 has-[[data-icon=suffix]]:pr-2 [&>[data-text]]:min-w-0 [&>[data-text]]:flex-1 [&>[data-text]]:truncate [&>[data-text]]:text-left\",\n        className,\n      )}\n      {...props}\n    >\n      {label}\n    </Button>\n  );\n}\n\n/**\n * The scrollable middle — a stack of `Sidebar.Group`s in a `ScrollArea`\n * (overlay scrollbar, edge fade). Pass `scroll={false}` where a parent\n * scrolls the whole rail as one column (a narrow-viewport drawer) — the\n * nav is then a plain stack at its natural height.\n *\n * The nav owns its breathing room toward its neighbors as a resting inset\n * (a scroll view's safe-area padding): 24px above, 16px below by default —\n * rows stand clear of the ends at rest and scroll through the gap, under\n * the edge fade, instead of clipping at a dead margin. `inset` /\n * `insetTop` / `insetBottom` override it; the same values become plain\n * padding when `scroll={false}`, so both modes keep one geometry. A\n * `Header` right before the nav and a `Footer` after it drop their own\n * margins — the gap lives here, not on the neighbors.\n */\nfunction Nav({\n  scroll = true,\n  inset,\n  insetTop = inset ?? 24,\n  insetBottom = inset ?? 16,\n  className,\n  style,\n  children,\n  ...props\n}: ComponentProps<\"nav\"> & {\n  scroll?: boolean;\n  inset?: number | string;\n  insetTop?: number | string;\n  insetBottom?: number | string;\n}) {\n  if (!scroll) {\n    return (\n      <nav\n        className={cn(\"flex flex-col gap-6\", className)}\n        style={{\n          paddingTop: insetTop ?? inset,\n          paddingBottom: insetBottom ?? inset,\n          ...style,\n        }}\n        {...props}\n      >\n        {children}\n      </nav>\n    );\n  }\n  return (\n    <nav\n      className={cn(\"flex min-h-0 flex-1 flex-col\", className)}\n      style={style}\n      {...props}\n    >\n      <ScrollArea.Root className=\"min-h-0 flex-1\">\n        <ScrollArea.Viewport>\n          <ScrollArea.Content\n            inset={inset}\n            insetTop={insetTop}\n            insetBottom={insetBottom}\n            className=\"flex flex-col gap-6\"\n          >\n            {children}\n          </ScrollArea.Content>\n        </ScrollArea.Viewport>\n        <ScrollArea.Scrollbar>\n          <ScrollArea.Thumb />\n        </ScrollArea.Scrollbar>\n      </ScrollArea.Root>\n    </nav>\n  );\n}\n\nfunction Group({ className, ...props }: ComponentProps<\"div\">) {\n  return <div className={className} {...props} />;\n}\n\n/** The cluster's caption — description ink, regular weight. */\nfunction GroupLabel({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\n        \"text-pho-description mb-2 px-2 text-xs font-normal\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\ninterface ListProps extends ComponentProps<\"ul\"> {\n  /** Lay the rows out in two columns — for long, flat registries. */\n  columns?: boolean;\n}\n\n/** The rows of a group. `columns` switches to a two-column grid. */\nfunction List({ className, columns, ...props }: ListProps) {\n  return (\n    <ul\n      className={cn(\n        // list-none/m-0/p-0 shield the rail from host prose styles.\n        \"m-0 list-none p-0 *:m-0\",\n        columns\n          ? \"grid grid-cols-2 gap-x-2 gap-y-0.5\"\n          : \"flex flex-col gap-0.5\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Pinned bottom cluster — docs link, account row, theme toggle. */\nfunction Footer({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\"mt-4 flex flex-col gap-0.5 [nav~&]:mt-0\", className)}\n      {...props}\n    />\n  );\n}\n\n/* --------------------------------- item ---------------------------------- */\n\n/** An icon slot — a component (`IconBook`) or element (`<IconBook />`). */\ntype Slottable = ReactNode | FC<{ className?: string }>;\n\nfunction renderIcon(icon: Slottable): ReactNode {\n  if (icon == null || icon === false) return null;\n  let content: ReactNode = null;\n  if (isReactComponent(icon)) {\n    const Icon = icon;\n    content = <Icon />;\n  } else if (isValidElement(icon)) {\n    content = icon;\n  }\n  if (content == null) return null;\n  return (\n    <span\n      data-icon\n      className=\"pointer-events-none inline-flex shrink-0 items-center [&>svg]:size-4 [&>svg]:shrink-0\"\n    >\n      {content}\n    </span>\n  );\n}\n\ninterface ItemBaseProps {\n  /** Slot before the label — a component (`IconBook`) or element. */\n  icon?: Slottable;\n  /** Marks the row as the current destination (adds `aria-current=\"page\"`). */\n  active?: boolean;\n  /**\n   * Let the label break onto two lines instead of truncating. Default\n   * rows stay a single truncated line so the rail keeps even height.\n   * The row still uses `min-h-9`; wrap only grows it when the text\n   * actually breaks. Caps at two lines.\n   */\n  wrap?: boolean;\n  children?: ReactNode;\n  className?: string;\n}\n\n/**\n * DOM handlers whose React signatures clash with Motion's gesture props.\n * Same omit list as `Button` — rows render through `motion.*`.\n */\ntype MotionHandlerConflicts =\n  | \"onAnimationStart\"\n  | \"onAnimationEnd\"\n  | \"onAnimationIteration\"\n  | \"onDrag\"\n  | \"onDragStart\"\n  | \"onDragEnd\"\n  | \"onDragEnter\"\n  | \"onDragExit\"\n  | \"onDragLeave\"\n  | \"onDragOver\"\n  | \"onDrop\";\n\nexport interface SidebarItemLinkProps\n  extends\n    ItemBaseProps,\n    Omit<\n      AnchorHTMLAttributes<HTMLAnchorElement>,\n      keyof ItemBaseProps | MotionHandlerConflicts\n    > {\n  /** Destination — rendered through the host's `LinkProvider`. */\n  href: string;\n  /** Leaves the app: opens in a new tab and renders a ↗ cue. */\n  external?: boolean;\n}\n\nexport interface SidebarItemButtonProps\n  extends\n    ItemBaseProps,\n    Omit<\n      ButtonHTMLAttributes<HTMLButtonElement>,\n      keyof ItemBaseProps | MotionHandlerConflicts\n    > {\n  href?: undefined;\n  external?: undefined;\n}\n\nexport type SidebarItemProps = SidebarItemLinkProps | SidebarItemButtonProps;\n\n/**\n * A nav row — a link when `href` is given (rendered through the host's\n * `LinkProvider`), otherwise a button. `active` lifts the row onto the\n * primary surface; `external` opens a new tab and appends a ↗ cue.\n * `wrap` drops the single-line truncate so a long product name can sit\n * on two lines; other rows stay one line.\n */\nfunction Item({\n  icon,\n  active,\n  wrap = false,\n  className,\n  children,\n  href,\n  external,\n  ...rest\n}: SidebarItemProps) {\n  const Link = useLinkComponent();\n  // Same bridge as `ButtonLink` — host `LinkProvider` + Motion press scale.\n  const MotionLink = useMemo(\n    () =>\n      motion.create(Link as unknown as ComponentType<Record<string, unknown>>),\n    [Link],\n  );\n  // Inside a `Submenu`, tell the parent row when this one is current so it\n  // can light up and auto-open. Layout effect: the parent reads the result\n  // before first paint, so a route-selected group opens without a flash.\n  const submenu = useContext(SidebarSubmenuContext);\n  const rowId = useId();\n  useIsoLayoutEffect(() => {\n    if (!submenu) return;\n    submenu.reportActive(rowId, Boolean(active));\n    return () => submenu.reportActive(rowId, false);\n  }, [submenu, rowId, active]);\n  const rowClass = cn(\n    SIDEBAR_ITEM,\n    active ? SIDEBAR_ITEM_ACTIVE : SIDEBAR_ITEM_INACTIVE,\n    className,\n  );\n  const label = (\n    <span\n      className={\n        wrap\n          ? \"line-clamp-2 min-w-0 flex-1 text-balance hyphens-none\"\n          : \"min-w-0 flex-1 truncate\"\n      }\n    >\n      {children}\n    </span>\n  );\n\n  if (href !== undefined) {\n    return (\n      <li>\n        <MotionLink\n          href={href}\n          aria-current={active ? \"page\" : undefined}\n          {...(external && { target: \"_blank\", rel: \"noopener noreferrer\" })}\n          {...(rest as AnchorHTMLAttributes<HTMLAnchorElement>)}\n          className={rowClass}\n          {...SIDEBAR_PRESS_MOTION}\n        >\n          {renderIcon(icon)}\n          {label}\n          {external && (\n            <>\n              {renderIcon(<IconArrowUpRight aria-hidden />)}\n              <span className=\"sr-only\">(opens in a new tab)</span>\n            </>\n          )}\n        </MotionLink>\n      </li>\n    );\n  }\n\n  return (\n    <li>\n      <motion.button\n        type=\"button\"\n        aria-current={active ? \"page\" : undefined}\n        {...(rest as Omit<\n          ButtonHTMLAttributes<HTMLButtonElement>,\n          MotionHandlerConflicts\n        >)}\n        className={rowClass}\n        {...SIDEBAR_PRESS_MOTION}\n      >\n        {renderIcon(icon)}\n        {label}\n      </motion.button>\n    </li>\n  );\n}\n\n/* -------------------------------- submenu -------------------------------- */\n\nexport interface SidebarSubmenuProps extends Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  \"children\" | MotionHandlerConflicts\n> {\n  /** The parent row's label. */\n  label: ReactNode;\n  /** Slot before the label — a component (`IconBook`) or element. */\n  icon?: Slottable;\n  /** Controlled open state. Pair with `onOpenChange`. */\n  open?: boolean;\n  /** Initial open state when uncontrolled. Defaults to `false`. */\n  defaultOpen?: boolean;\n  /** Called with the next open state on every toggle (user or auto-open). */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * Open the panel whenever a child row becomes `active`, so a route-based\n   * rail expands the right group on load and on navigation. Defaults to\n   * `true`. The user can still collapse the group afterwards.\n   */\n  openWhenChildActive?: boolean;\n  /**\n   * Force the parent's child-active ink. Normally derived from the\n   * children's `active` flags — set this when the current destination lives\n   * under the group but has no row of its own.\n   */\n  active?: boolean;\n  /** The nested rows — `Sidebar.Item`s, no icon needed. */\n  children: ReactNode;\n  ref?: Ref<HTMLButtonElement>;\n}\n\n/**\n * A nav row that folds open to reveal child rows — `<Item>` metrics on the\n * trigger, a trailing chevron that turns as the panel opens, and the nested\n * list indented to the parent's label. Built on `Collapsible`, so the\n * height animation (and its reduced-motion collapse) is the library's own.\n *\n * Children are ordinary `Sidebar.Item`s: they report `active` upward, so the\n * parent takes primary ink while a child is current and, with\n * `openWhenChildActive` (default), opens on load without a flash.\n *\n * ```tsx\n * <Sidebar.Submenu label=\"Platforms\" icon={IconMessage}>\n *   <Sidebar.Item href=\"/platforms/sms\" active>SMS</Sidebar.Item>\n *   <Sidebar.Item href=\"/platforms/imessage\">iMessage</Sidebar.Item>\n * </Sidebar.Submenu>\n * ```\n */\nfunction Submenu({\n  label,\n  icon,\n  open: openProp,\n  defaultOpen = false,\n  onOpenChange,\n  openWhenChildActive = true,\n  active: activeProp,\n  className,\n  children,\n  ...rest\n}: SidebarSubmenuProps) {\n  /* ---- open state: controlled when `open` is given, else internal ---- */\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n  const isControlled = openProp !== undefined;\n  const open = isControlled ? openProp : uncontrolledOpen;\n  const setOpen = useCallback(\n    (next: boolean) => {\n      if (!isControlled) setUncontrolledOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  /* ---- which child rows are current (reported by `Item`) ---- */\n  const [activeRowIds, setActiveRowIds] = useState<ReadonlySet<string>>(\n    () => new Set(),\n  );\n  const reportActive = useCallback((rowId: string, isActive: boolean) => {\n    setActiveRowIds((previous) => {\n      if (previous.has(rowId) === isActive) return previous;\n      const next = new Set(previous);\n      if (isActive) next.add(rowId);\n      else next.delete(rowId);\n      return next;\n    });\n  }, []);\n  const submenuContext = useMemo(() => ({ reportActive }), [reportActive]);\n  const childActive = activeProp ?? activeRowIds.size > 0;\n\n  /* ---- auto-open on an active child ---- */\n  // `true` once the browser has painted the first frame. An auto-open that\n  // happens before that (the route already sits under this group on load)\n  // must not animate — the rail should simply appear expanded.\n  const hasPaintedRef = useRef(false);\n  useEffect(() => {\n    const frame = requestAnimationFrame(() => {\n      hasPaintedRef.current = true;\n    });\n    return () => cancelAnimationFrame(frame);\n  }, []);\n  // While `true`, the panel's height transition runs at 0s so the pre-paint\n  // auto-open lands instantly. Cleared a frame later so the next toggle\n  // animates normally.\n  const [instantOpen, setInstantOpen] = useState(false);\n  // Read through refs so the effect fires only when the active children\n  // change — a user collapsing the group must not be undone by a re-render.\n  const latestOpenRef = useRef(open);\n  latestOpenRef.current = open;\n  const latestSetOpenRef = useRef(setOpen);\n  latestSetOpenRef.current = setOpen;\n  useIsoLayoutEffect(() => {\n    if (!openWhenChildActive || !childActive || latestOpenRef.current) return;\n    if (!hasPaintedRef.current) setInstantOpen(true);\n    latestSetOpenRef.current(true);\n  }, [activeRowIds, childActive, openWhenChildActive]);\n  useEffect(() => {\n    if (!instantOpen) return;\n    const frame = requestAnimationFrame(() => setInstantOpen(false));\n    return () => cancelAnimationFrame(frame);\n  }, [instantOpen]);\n\n  return (\n    <Collapsible.Root\n      open={open}\n      onOpenChange={(next) => setOpen(next)}\n      render={<li />}\n    >\n      <BaseCollapsible.Trigger\n        // Same press compression as `Item`; Base UI wires aria-expanded,\n        // aria-controls, and Enter / Space onto the native button.\n        render={<motion.button {...SIDEBAR_PRESS_MOTION} />}\n        className={cn(\n          SIDEBAR_ITEM,\n          SIDEBAR_ITEM_INACTIVE,\n          childActive && SIDEBAR_SUBMENU_TRIGGER_CHILD_ACTIVE,\n          // The chevron turns to point down while the panel is open.\n          \"data-[panel-open]:*:data-chevron:rotate-90\",\n          className,\n        )}\n        data-child-active={childActive || undefined}\n        {...rest}\n      >\n        {renderIcon(icon)}\n        <span className=\"min-w-0 flex-1 truncate\">{label}</span>\n        <IconChevronRight\n          aria-hidden\n          data-chevron\n          className={SIDEBAR_SUBMENU_CHEVRON}\n        />\n      </BaseCollapsible.Trigger>\n      {/* keepMounted: closed children stay mounted (hidden) so an active\n          child keeps reporting and the parent keeps its ink. */}\n      <Collapsible.Panel\n        keepMounted\n        style={instantOpen ? { transitionDuration: \"0s\" } : undefined}\n      >\n        <SidebarSubmenuContext.Provider value={submenuContext}>\n          {/* Indent and top gap live on a wrapper inside the panel: the\n              measured height includes them, so a closed group adds no height\n              and siblings never shift. (`List` resets its own padding.) */}\n          <div\n            data-submenu-list\n            className={cn(\n              \"pt-0.5\",\n              icon\n                ? SIDEBAR_SUBMENU_LIST_INDENT.withIcon\n                : SIDEBAR_SUBMENU_LIST_INDENT.withoutIcon,\n            )}\n          >\n            <List>{children}</List>\n          </div>\n        </SidebarSubmenuContext.Provider>\n      </Collapsible.Panel>\n    </Collapsible.Root>\n  );\n}\n\n/* ------------------------------ account row ------------------------------ */\n\n/**\n * Whole-row account trigger. The row itself stays visually quiet — it only\n * carries the `group` state (hover/press/popup-open) and the focus ring;\n * all visual feedback renders on the ⋯ circle via `group-*` classes.\n */\nconst ACCOUNT_ROW =\n  \"group outline-pho-brand flex w-full cursor-pointer items-center gap-2 rounded-base p-2 text-left focus-visible:outline-2 focus-visible:outline-offset-2\";\n\n/** Avatar initials: first + last word initial, else the first character. */\nfunction initialsFrom(name: string): string {\n  const words = name.split(/\\s+/).filter(Boolean);\n  const first = words[0]?.[0] ?? name[0] ?? \"?\";\n  const last = words.length >= 2 ? (words[words.length - 1]?.[0] ?? \"\") : \"\";\n  return (first + last).toUpperCase();\n}\n\nexport interface SidebarAccountRowProps extends Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  \"children\" | MotionHandlerConflicts\n> {\n  /** Display name — also the source for fallback initials. */\n  name: string;\n  /** Avatar image URL; falls back to initials while loading or on error. */\n  avatarSrc?: string;\n  /** Override the derived initials. */\n  initials?: string;\n  ref?: Ref<HTMLButtonElement>;\n}\n\n/**\n * The account chip pinned to the rail's footer — an xs avatar, the name, and\n * a decorative ⋯ circle. The WHOLE row is one button, but the row is only the\n * control — the circle is the indicator: hover, press, and menu-open feedback\n * all render on the ⋯ (a span wearing the stock secondary-circle button\n * classes), driven by the row's `group` state, so it reads as a button\n * without nesting one.\n *\n * It renders a plain `<button>` and forwards every prop, so it slots straight\n * into a menu: `<Menu.Trigger render={<Sidebar.AccountRow name=\"…\" />} />` —\n * Base UI's `data-popup-open` / `data-pressed` states light up the circle.\n */\nfunction AccountRow({\n  name,\n  avatarSrc,\n  initials,\n  className,\n  ...props\n}: SidebarAccountRowProps) {\n  return (\n    <motion.button\n      type=\"button\"\n      className={cn(ACCOUNT_ROW, className)}\n      {...props}\n      {...SIDEBAR_PRESS_MOTION}\n    >\n      <Avatar.Root size=\"xs\">\n        {avatarSrc && <Avatar.Image src={avatarSrc} alt=\"\" />}\n        <Avatar.Fallback>{initials ?? initialsFrom(name)}</Avatar.Fallback>\n      </Avatar.Root>\n      <span className=\"text-pho-primary min-w-0 flex-1 truncate text-base\">\n        {name}\n      </span>\n      <span\n        aria-hidden\n        className={buttonVariants({\n          variant: \"outlined\",\n          size: \"sm\",\n          shape: \"circle\",\n          // Hover / open washes stay on the ⋯; press scale lives on the row\n          // (same as Button / Sidebar.Item) so the circle does not double-scale.\n          className:\n            \"group-hover:bg-pho-primary-hover group-hover:text-pho-secondary-hover group-data-[popup-open]:bg-pho-primary-hover group-data-[popup-open]:text-pho-secondary-hover p-1\",\n        })}\n      >\n        <IconDots className=\"size-4\" />\n      </span>\n    </motion.button>\n  );\n}\n\n/* -------------------------------- assembly ------------------------------- */\n\n/**\n * The composed sidebar rail. Assemble the frame parts and fill them with\n * rows; wire interactivity by composing other Pho parts around them:\n *\n * ```tsx\n * <Sidebar.Root>\n *   <Sidebar.Header>…brand…</Sidebar.Header>\n *   <Sidebar.Nav>\n *     <Sidebar.Group>\n *       <Sidebar.GroupLabel>Pages</Sidebar.GroupLabel>\n *       <Sidebar.List>\n *         <Sidebar.Item href=\"/\" icon={IconHome} active>\n *           Overview\n *         </Sidebar.Item>\n *         <Sidebar.Submenu label=\"Platforms\" icon={IconMessage}>\n *           <Sidebar.Item href=\"/platforms/sms\">SMS</Sidebar.Item>\n *           <Sidebar.Item href=\"/platforms/email\">Email</Sidebar.Item>\n *         </Sidebar.Submenu>\n *       </Sidebar.List>\n *     </Sidebar.Group>\n *   </Sidebar.Nav>\n *   <Sidebar.Footer>\n *     <Menu.Root>\n *       <Menu.Trigger render={<Sidebar.AccountRow name=\"Ada Lovelace\" />} />\n *       …\n *     </Menu.Root>\n *   </Sidebar.Footer>\n * </Sidebar.Root>\n * ```\n */\nexport const Sidebar = {\n  Root,\n  Header,\n  Search,\n  Nav,\n  Group,\n  GroupLabel,\n  List,\n  Item,\n  Submenu,\n  Footer,\n  AccountRow,\n};\n"],"x_google_ignoreList":[0],"mappings":"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"}

package/dist/chunks/{toast-DUvjSZF7.js → toast-BACxYsv6.js}

@@ -2,7 +2,7 @@
 import { t as n } from "./cn-ChIgwEl3.js";
 import { FADE_SWAP as _ } from "../motion.js";
 import { n as y } from "./spinner-BzLUo4Xk.js";
-import { a as b } from "./button-CgUS0j3D.js";
+import { a as b } from "./button-C9VqBBIr.js";
 import { t as i } from "./createReactComponent-BqCmnqfX.js";
 import { t as w } from "./IconX-pZ9vrtSr.js";
 import { n as k } from "./scroll-area-DSwD9th7.js";
@@ -162,4 +162,4 @@ export {
   tt as t
 };
 
-//# sourceMappingURL=toast-DUvjSZF7.js.map
+//# sourceMappingURL=toast-BACxYsv6.js.map