@lapis-notes/search 0.1.0

package/dist/search-match-context.d.ts

@@ -0,0 +1,17 @@
+export interface SearchMatchContextWindow {
+    start: number;
+    end: number;
+    ranges: Array<{
+        start: number;
+        end: number;
+    }>;
+}
+export type SearchMatchContextDirection = "before" | "after";
+export declare function expandSearchMatchContext(source: string, window: SearchMatchContextWindow, direction: SearchMatchContextDirection, lineCount?: number): SearchMatchContextWindow;
+export declare function sliceSearchMatchContext(source: string, window: SearchMatchContextWindow): {
+    text: string;
+    ranges: Array<{
+        start: number;
+        end: number;
+    }>;
+};

package/dist/search-match-context.js

@@ -0,0 +1,45 @@
+function lineStartAt(source, offset) {
+    return source.lastIndexOf("\n", Math.max(0, offset - 1)) + 1;
+}
+function expandBefore(source, start, lineCount) {
+    let next = lineStartAt(source, start);
+    for (let index = 0; index < lineCount && next > 0; index += 1) {
+        next = lineStartAt(source, next - 1);
+    }
+    return next;
+}
+function expandAfter(source, end, lineCount) {
+    const currentLineEnd = source.indexOf("\n", Math.max(0, end));
+    let next = currentLineEnd === -1 ? source.length : currentLineEnd;
+    for (let index = 0; index < lineCount && next < source.length; index += 1) {
+        const followingLineEnd = source.indexOf("\n", next + 1);
+        next = followingLineEnd === -1 ? source.length : followingLineEnd;
+    }
+    return next;
+}
+export function expandSearchMatchContext(source, window, direction, lineCount = 2) {
+    const start = Math.max(0, Math.min(source.length, window.start));
+    const end = Math.max(start, Math.min(source.length, window.end));
+    return {
+        start: direction === "before"
+            ? expandBefore(source, start, Math.max(1, lineCount))
+            : start,
+        end: direction === "after"
+            ? expandAfter(source, end, Math.max(1, lineCount))
+            : end,
+        ranges: window.ranges.map((range) => ({ ...range })),
+    };
+}
+export function sliceSearchMatchContext(source, window) {
+    const start = Math.max(0, Math.min(source.length, window.start));
+    const end = Math.max(start, Math.min(source.length, window.end));
+    return {
+        text: source.slice(start, end),
+        ranges: window.ranges
+            .map((range) => ({
+            start: Math.max(0, range.start - start),
+            end: Math.min(end - start, range.end - start),
+        }))
+            .filter((range) => range.end > range.start),
+    };
+}

package/dist/search-panel.css

@@ -0,0 +1,460 @@
+.search-panel {
+  --search-panel-border: var(
+    --ui-workspace-border,
+    color-mix(in srgb, currentColor 14%, transparent)
+  );
+  --search-panel-muted: var(
+    --ui-workspace-muted-foreground,
+    var(--muted-foreground)
+  );
+
+  display: flex;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  min-width: 0;
+  min-height: 0;
+  flex-direction: column;
+  overflow: hidden;
+  color: var(--ui-workspace-view-foreground, inherit);
+  background: var(--ui-workspace-view-background, transparent);
+  font: inherit;
+}
+
+.search-panel__chrome {
+  position: relative;
+  z-index: 1;
+  flex: 0 0 auto;
+  padding: 0.75rem;
+  border-bottom: 1px solid var(--search-panel-border);
+  background: var(--ui-workspace-view-background, transparent);
+}
+
+.search-panel__query-row {
+  display: flex;
+  min-width: 0;
+  align-items: flex-start;
+  gap: 0.5rem;
+}
+
+.search-panel__query-row > .cv-search-filter-bar {
+  min-width: 0;
+  flex: 1 1 auto;
+  padding: 0;
+}
+
+.search-panel__filters {
+  display: flex;
+  width: 100%;
+  min-width: 0;
+  flex: 1 1 100%;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.4rem;
+}
+
+.search-panel__summary {
+  display: flex;
+  min-width: 0;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+  margin-top: 0.625rem;
+}
+
+.search-panel__summary button {
+  min-width: 0;
+}
+
+.search-panel__summary-control:hover,
+.search-panel__summary-control:focus-visible,
+.search-panel__summary-control[aria-expanded="true"] {
+  color: var(--ui-workspace-view-foreground, inherit);
+  background-color: var(
+    --ui-workspace-selection,
+    color-mix(in srgb, var(--ui-workspace-accent, #7c3aed) 14%, transparent)
+  );
+}
+
+.search-panel__summary button > svg,
+.search-panel__sort svg {
+  width: 0.875rem;
+  height: 0.875rem;
+}
+
+.search-panel__sort {
+  max-width: 12rem;
+}
+
+.search-panel__sort > span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.search-panel__sort-popover {
+  display: grid;
+  width: 15rem;
+  gap: 0.125rem;
+  padding: 0.25rem;
+}
+
+.search-panel__sort-option {
+  justify-content: flex-start;
+}
+
+.search-panel__explanation {
+  margin: 0.5rem 0 0;
+  color: var(--search-panel-muted);
+  font-size: 0.75rem;
+  line-height: 1.25rem;
+}
+
+.search-panel__settings {
+  display: grid;
+  width: 100%;
+  min-width: 0;
+  flex: 1 0 100%;
+  gap: 0.75rem;
+  margin-top: 0.25rem;
+  border: 1px solid var(--search-panel-border);
+  border-radius: var(--ui-workspace-radius-medium, var(--radius));
+  padding: 0.75rem;
+  background: var(--ui-workspace-panel-background, var(--card));
+}
+
+.search-panel__settings > label {
+  display: flex;
+  min-width: 0;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+  font-size: 0.75rem;
+}
+
+.search-panel__structured-semantic {
+  align-items: flex-start !important;
+}
+
+.search-panel__structured-semantic > span {
+  display: grid;
+  min-width: 0;
+  gap: 0.125rem;
+}
+
+.search-panel__structured-semantic strong {
+  font-weight: 500;
+}
+
+.search-panel__structured-semantic small {
+  color: var(--search-panel-muted);
+  font-size: 0.6875rem;
+  line-height: 1rem;
+}
+
+.search-panel__scroll-area {
+  width: 100%;
+  min-width: 0;
+  min-height: 0;
+  flex: 1 1 auto;
+}
+
+.search-panel
+  [data-ui-component="sidebar"][data-ui-part="sidebar-content"].search-panel__results {
+  box-sizing: border-box;
+  width: 100%;
+  min-width: 0;
+  padding: 0;
+  color: inherit;
+  background: var(--ui-workspace-view-background, transparent);
+}
+
+.search-panel__tree-inset {
+  box-sizing: border-box;
+  width: 100%;
+  min-width: 0;
+  padding: 0.375rem 0.5rem 0.75rem;
+}
+
+.search-panel__tree,
+.search-panel__match-list [data-ui-part="sidebar-menu-sub"] {
+  display: grid;
+  width: 100%;
+  min-width: 0;
+  gap: 0.125rem;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.search-panel__tree-item {
+  min-width: 0;
+  padding: 0;
+}
+
+.search-panel__result {
+  width: 100%;
+  min-width: 0;
+}
+
+.search-panel__file,
+.search-panel__match {
+  box-sizing: border-box;
+  width: 100%;
+  min-width: 0;
+  border: 0;
+  border-radius: var(--ui-workspace-radius-small, 0.25rem);
+  color: inherit;
+  background: transparent;
+  font: inherit;
+  text-align: start;
+  cursor: pointer;
+}
+
+.search-panel__file:hover,
+.search-panel__file:focus-visible,
+.search-panel__match:hover,
+.search-panel__match-shell:focus-visible .search-panel__match {
+  background: var(
+    --ui-workspace-explorer-row-hover-background,
+    var(--sidebar-accent)
+  );
+  outline: 2px solid transparent;
+}
+
+.search-panel__match-shell:focus-visible {
+  outline: 0;
+}
+
+.search-panel__file {
+  position: relative;
+  display: grid;
+  grid-template-columns: auto auto minmax(0, 1fr);
+  align-items: start;
+  gap: 0.375rem;
+  padding: 0.5rem 2.125rem 0.5rem 0.375rem;
+}
+
+.search-panel__disclosure,
+.search-panel__file-icon {
+  width: 0.875rem;
+  height: 0.875rem;
+  margin-top: 0.1875rem;
+  color: var(--search-panel-muted);
+}
+
+.search-panel__disclosure {
+  transition: transform 120ms ease;
+}
+
+.search-panel__file[aria-expanded="true"] .search-panel__disclosure {
+  transform: rotate(90deg);
+}
+
+.search-panel__file-label {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: 0.8125rem;
+  font-weight: 400;
+}
+
+.search-panel__match-meta {
+  display: flex;
+  min-width: 0;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 0.25rem;
+  padding-top: 0.125rem;
+}
+
+.search-panel__mode-badge,
+.search-panel__match-key {
+  min-width: 0;
+  padding-inline: 0.375rem;
+  font-family: var(--ui-workspace-font-mono, var(--font-monospace, monospace));
+  font-size: 0.625rem;
+  line-height: 1rem;
+}
+
+.search-panel__mode-badge {
+  border-color: var(--search-panel-border);
+  color: var(--ui-workspace-view-foreground, currentColor);
+  background: var(
+    --ui-workspace-view-background,
+    var(--ui-workspace-background, var(--background, #fff))
+  );
+}
+
+.search-panel__match-key {
+  border-color: var(--search-panel-border);
+  color: var(--ui-workspace-view-foreground, currentColor);
+  background: var(
+    --ui-workspace-view-background,
+    var(--ui-workspace-background, var(--background, #fff))
+  );
+}
+
+.search-panel [data-ui-part="sidebar-menu-badge"].search-panel__count-badge {
+  position: absolute;
+  top: 0.375rem;
+  right: 0.375rem;
+  display: grid;
+  width: 1.25rem;
+  min-width: 1.25rem;
+  height: 1.25rem;
+  padding: 0;
+  place-items: center;
+  transform: none;
+  border: 0;
+  border-radius: 999px;
+  color: color-mix(
+    in srgb,
+    var(--ui-workspace-view-foreground, currentColor) 52%,
+    transparent
+  );
+  background: transparent;
+  font-family: inherit;
+  font-size: 0.625rem;
+  line-height: 1;
+}
+
+.search-panel__match-list {
+  box-sizing: border-box;
+  width: 100%;
+  margin: 0.125rem 0 0.375rem;
+  border: 1px solid var(--search-panel-border);
+  border-radius: var(--ui-workspace-radius-small, 0.25rem);
+  background: var(
+    --ui-workspace-view-secondary-background,
+    var(--ui-workspace-secondary, var(--secondary))
+  );
+  overflow: hidden;
+}
+
+.search-panel__match-header {
+  display: flex;
+  min-width: 0;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+  border-bottom: 1px solid var(--search-panel-border);
+  padding: 0.375rem 0.625rem;
+}
+
+.search-panel__match-path {
+  min-width: 0;
+  flex: 1 1 auto;
+  overflow: hidden;
+  color: var(--search-panel-muted);
+  font-size: 0.6875rem;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.search-panel .search-panel__match-list > [data-ui-part="sidebar-menu-sub"] {
+  display: grid;
+  box-sizing: border-box;
+  width: 100%;
+  min-width: 0;
+  gap: 0;
+  margin: 0;
+  padding: 0;
+  translate: none;
+  border: 0;
+  background: var(
+    --ui-workspace-view-secondary-background,
+    var(--ui-workspace-secondary, var(--secondary))
+  );
+}
+
+.search-panel__match-list [data-ui-part="sidebar-menu-sub-item"] {
+  width: 100%;
+  min-width: 0;
+}
+
+.search-panel__match-shell {
+  position: relative;
+  width: 100%;
+  min-width: 0;
+}
+
+.search-panel__match {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 0.125rem;
+  border-radius: 0;
+  padding: 0.5rem 0.625rem;
+  font-size: 0.75rem;
+  line-height: 1.25rem;
+}
+
+.search-panel__match-shell[data-context-before="true"]
+  .search-panel__match-text {
+  padding-inline-end: 1.5rem;
+}
+
+.search-panel__context-control {
+  position: absolute;
+  z-index: 1;
+  width: 1.25rem;
+  min-width: 1.25rem;
+  height: 1.25rem;
+  border: 0;
+  border-radius: var(--ui-workspace-radius-small, 0.25rem);
+  padding: 0;
+  color: var(--search-panel-muted);
+  background: transparent;
+}
+
+.search-panel__context-control:hover,
+.search-panel__context-control:focus-visible {
+  color: var(--ui-workspace-view-foreground, currentColor);
+  background: var(--ui-workspace-selection);
+}
+
+.search-panel__context-control--before {
+  top: 0.375rem;
+  right: 0.375rem;
+}
+
+.search-panel__context-control--after {
+  bottom: 0.375rem;
+  right: 0.375rem;
+}
+
+.search-panel__context-control svg {
+  width: 0.875rem;
+  height: 0.875rem;
+}
+
+.search-panel__match-text {
+  display: block;
+  min-width: 0;
+  overflow-wrap: anywhere;
+  white-space: pre-wrap;
+}
+
+.search-panel__match-list li + li .search-panel__match-shell {
+  border-top: 1px solid var(--search-panel-border);
+}
+
+.search-panel mark {
+  border-radius: 0.125rem;
+  color: var(--ui-search-highlight-foreground, inherit);
+  background: var(
+    --ui-search-highlight-background,
+    color-mix(in srgb, #facc15 42%, transparent)
+  );
+}
+
+.search-panel__empty {
+  margin: 0;
+  padding: 1.5rem 0.75rem;
+  color: var(--search-panel-muted);
+  font-size: 0.8125rem;
+  text-align: center;
+}