stylegallery 0.1.11 → 0.1.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AGENTS.md +2 -2
- package/DOMAINS.md +1 -1
- package/GOVERNANCE.md +2 -2
- package/README.md +67 -35
- package/consumer-reference/agent-native/README.md +5 -5
- package/consumer-reference/agent-native/v2/admission-policy.json +66 -1
- package/consumer-reference/agent-native/v2/material-registry.json +1 -1
- package/consumer-reference/agent-native/v2/schema/admission-policy.schema.json +2 -2
- package/design-engineering/evidence-patterns/autocomplete.md +83 -0
- package/design-engineering/evidence-patterns/bottom-navigation.md +78 -0
- package/design-engineering/evidence-patterns/breadcrumbs.md +78 -0
- package/design-engineering/evidence-patterns/dark-mode-contrast.md +83 -0
- package/design-engineering/evidence-patterns/data-tables.md +86 -0
- package/design-engineering/evidence-patterns/empty-states.md +80 -0
- package/design-engineering/evidence-patterns/error-recovery.md +84 -0
- package/design-engineering/evidence-patterns/faceted-filters.md +90 -0
- package/design-engineering/evidence-patterns/form-labels.md +82 -0
- package/design-engineering/evidence-patterns/index.md +69 -0
- package/design-engineering/evidence-patterns/inline-validation.md +94 -0
- package/design-engineering/evidence-patterns/input-masks.md +79 -0
- package/design-engineering/evidence-patterns/tabs-and-segmented-controls.md +81 -0
- package/design-engineering/index.md +17 -0
- package/design-engineering/loading-and-feedback.md +29 -1
- package/design-engineering/native-interaction-contracts.md +10 -0
- package/design-engineering/state-management/patterns/latest-request-wins.md +2 -0
- package/design-engineering/state-management/patterns/optimistic-overlay.md +1 -0
- package/design-engineering/state-management/patterns/single-flight.md +2 -0
- package/design-engineering/state-management/patterns/unsaved-navigation.md +2 -0
- package/design-engineering/state-management/patterns/url-state.md +1 -0
- package/design-engineering/state-management/recipes/delete-undo.md +7 -0
- package/design-engineering/text-input-and-internationalization.md +1 -0
- package/expression/directions/nocturne-editorial.md +1 -0
- package/expression/directions/warm-print.md +1 -0
- package/expression/techniques/gradient-atmosphere.md +1 -0
- package/expression/techniques/grain-and-texture.md +1 -0
- package/expression/techniques/webgl-hero.md +1 -0
- package/guides/decision-tree.md +2 -0
- package/guides/webpage-generation-workflow.md +2 -0
- package/log.md +22 -0
- package/motion/accessible-motion.md +2 -0
- package/motion/interruption-and-retargeting.md +2 -0
- package/motion/rendering-and-performance.md +1 -0
- package/motion/techniques/kinetic-type.md +1 -0
- package/motion/techniques/scroll-choreography.md +2 -0
- package/package.json +27 -8
- package/patterns/centering/center.md +1 -0
- package/patterns/centering/super-center.md +2 -0
- package/patterns/containment/box.md +1 -0
- package/patterns/containment/clamped-card.md +1 -0
- package/patterns/containment/content-limiter.md +2 -0
- package/patterns/containment/fluid-styles.md +1 -0
- package/patterns/grid-repetition/card-grid.md +2 -0
- package/patterns/grid-repetition/columns.md +1 -0
- package/patterns/grid-repetition/dense-grid.md +1 -0
- package/patterns/grid-repetition/grid-wrapper.md +1 -0
- package/patterns/grid-repetition/masonry-approx.md +1 -0
- package/patterns/grid-repetition/page-grid.md +1 -0
- package/patterns/grid-repetition/ram-grid.md +2 -0
- package/patterns/grid-repetition/twelve-span-grid.md +1 -0
- package/patterns/in-line-grouping/badge-list.md +1 -0
- package/patterns/in-line-grouping/breadcrumb.md +1 -0
- package/patterns/in-line-grouping/cluster.md +1 -0
- package/patterns/in-line-grouping/deconstructed-pancake.md +1 -0
- package/patterns/in-line-grouping/pagination.md +1 -0
- package/patterns/in-line-grouping/reel.md +2 -0
- package/patterns/in-line-grouping/split-nav.md +1 -0
- package/patterns/in-line-grouping/tab-strip.md +1 -0
- package/patterns/in-line-grouping/wrap-row.md +1 -0
- package/patterns/media-fit/frame.md +2 -0
- package/patterns/media-fit/icon-frame.md +1 -0
- package/patterns/overlay-exception/imposter.md +1 -0
- package/patterns/overlay-exception/overlay-stack.md +1 -0
- package/patterns/split-sidebar/list-detail.md +1 -0
- package/patterns/split-sidebar/main-with-rail.md +1 -0
- package/patterns/split-sidebar/media-object.md +1 -0
- package/patterns/split-sidebar/sidebar.md +2 -0
- package/patterns/split-sidebar/split-screen.md +1 -0
- package/patterns/split-sidebar/sticky-aside.md +2 -0
- package/patterns/split-sidebar/supporting-pane.md +1 -0
- package/patterns/split-sidebar/switcher.md +2 -0
- package/patterns/stacking/feed.md +1 -0
- package/patterns/stacking/line-up.md +2 -0
- package/patterns/stacking/stack.md +1 -0
- package/patterns/stacking/step-nav.md +1 -0
- package/patterns/viewport-shell/cover.md +1 -0
- package/patterns/viewport-shell/fixed-sidenav-shell.md +2 -0
- package/patterns/viewport-shell/holy-grail.md +2 -0
- package/patterns/viewport-shell/panel-layout.md +1 -0
- package/patterns/viewport-shell/scroll-body-shell.md +2 -0
- package/patterns/viewport-shell/sticky-footer.md +2 -0
- package/patterns/viewport-shell/sticky-header.md +2 -0
- package/platform-guides/input-and-focus.md +10 -0
- package/platform-guides/preferences-and-accessibility.md +1 -0
- package/recipes/article-page.md +1 -0
- package/recipes/command-surface.md +1 -0
- package/recipes/dashboard.md +1 -0
- package/recipes/form-flow.md +1 -0
- package/recipes/homepage.md +2 -0
- package/recipes/list-detail.md +1 -0
- package/recipes/saas-settings.md +1 -0
- package/scripts/agent-native/v2/material-cli-adapter.mjs +7 -5
- package/scripts/agent-native/v2/material-queries.mjs +21 -0
- package/scripts/agent-native/v2/material-search-v3.mjs +409 -0
- package/scripts/compiler/README.md +16 -16
- package/scripts/compiler/mcp.mjs +38 -2
- package/scripts/legacy-sg-material-mcp.mjs +9 -0
- package/scripts/legacy-sg-material.mjs +4 -0
- package/scripts/pattern-data.mjs +409 -0
- package/scripts/sg-entry.mjs +2 -2
- package/scripts/sg-material-mcp.mjs +1 -1
- package/scripts/stylegallery-cli.mjs +130 -0
- package/skills/stylegallery-search/SKILL.md +34 -0
|
@@ -0,0 +1,130 @@
|
|
|
1
|
+
// The single `stylegallery` command. search/read use search v3; context with
|
|
2
|
+
// --query uses material v2; retrieve uses the v1 registry; every other command
|
|
3
|
+
// (discover, resolve, claims, context <ref>, ops, registrar, conservator,
|
|
4
|
+
// compiler stages) goes to the existing governed CLI unchanged.
|
|
5
|
+
import fs from "node:fs";
|
|
6
|
+
import path from "node:path";
|
|
7
|
+
import { fileURLToPath } from "node:url";
|
|
8
|
+
|
|
9
|
+
const packageRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
|
|
10
|
+
|
|
11
|
+
export function packageVersion() {
|
|
12
|
+
return JSON.parse(fs.readFileSync(path.join(packageRoot, "package.json"), "utf8")).version;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
export const HELP_TEXT = `stylegallery - search and read the StyleGallery knowledge corpus, plus governed records and site compilation.
|
|
16
|
+
|
|
17
|
+
Usage: stylegallery <command> [options]
|
|
18
|
+
|
|
19
|
+
Find and read documents (offline, deterministic):
|
|
20
|
+
search <query...> Rank documents; prints JSON (schema 3.0).
|
|
21
|
+
--query-en <text> English rewrite of a non-English query. Agents: always pass one for Korean queries.
|
|
22
|
+
--limit <n> Results to return, 1-50 (default 5).
|
|
23
|
+
--paths-only Print repository-relative paths only.
|
|
24
|
+
--detailed Add scores, hash identities, and ranking terms.
|
|
25
|
+
read <id|path> Read one document by id (sg:layout/sticky-header), path, or StableRef.
|
|
26
|
+
--outline List headings with section slugs instead of the content.
|
|
27
|
+
--section <slug> Read one section only.
|
|
28
|
+
context --query <text> Build a bounded, provenance-linked material context package.
|
|
29
|
+
--budget-tokens <n> Token budget, 256-32768 (default 8192).
|
|
30
|
+
|
|
31
|
+
Governed records:
|
|
32
|
+
discover List interfaces, domains, and operations.
|
|
33
|
+
resolve <ref> Read one governed record.
|
|
34
|
+
claims <ref> List claims and evidence for a record.
|
|
35
|
+
context <ref> Build a governed record context package.
|
|
36
|
+
retrieve <query> Search governed records (v1 registry).
|
|
37
|
+
ops List operations.
|
|
38
|
+
registrar | conservator Check claim records | measure Layout patterns in Chromium.
|
|
39
|
+
|
|
40
|
+
Site compilation: compile, timeline, transcribe, sale, gate, build, shots, probe, workflow (see stylegallery workflow).
|
|
41
|
+
|
|
42
|
+
help, --help Show this help.
|
|
43
|
+
version, --version Show the package version.
|
|
44
|
+
|
|
45
|
+
Typical agent loop: stylegallery search "sticky header" -> stylegallery read <id> --outline -> stylegallery read <id> --section <slug>.
|
|
46
|
+
MCP server: stylegallery-mcp (tools: search, read, plus governed and compiler tools).
|
|
47
|
+
`;
|
|
48
|
+
|
|
49
|
+
function report(value) {
|
|
50
|
+
return { report: value, exitCode: value.ok ? 0 : 1, output: `${JSON.stringify(value, null, 2)}\n` };
|
|
51
|
+
}
|
|
52
|
+
function failure(operation, code, message) { return report({ ok: false, operation, failures: [{ code, message }] }); }
|
|
53
|
+
|
|
54
|
+
function parseOptions(command, args, specs) {
|
|
55
|
+
const values = {};
|
|
56
|
+
const positional = [];
|
|
57
|
+
for (let index = 0; index < args.length; index += 1) {
|
|
58
|
+
const argument = args[index];
|
|
59
|
+
if (!argument.startsWith("--")) { positional.push(argument); continue; }
|
|
60
|
+
const spec = specs[argument];
|
|
61
|
+
if (!spec) return { error: failure(command, "argument_unknown", `unknown option ${argument}; run stylegallery help`) };
|
|
62
|
+
if (Object.hasOwn(values, spec.field)) return { error: failure(command, "argument_duplicate", `${argument} was supplied more than once`) };
|
|
63
|
+
if (spec.flag) { values[spec.field] = true; continue; }
|
|
64
|
+
const value = args[index + 1];
|
|
65
|
+
if (value === undefined || value.startsWith("--")) return { error: failure(command, "argument_value_required", `${argument} requires a value`) };
|
|
66
|
+
if (spec.integer) {
|
|
67
|
+
if (!/^[0-9]+$/.test(value)) return { error: failure(command, "argument_integer_invalid", `${argument} must be an unsigned integer`) };
|
|
68
|
+
values[spec.field] = Number(value);
|
|
69
|
+
} else values[spec.field] = value;
|
|
70
|
+
index += 1;
|
|
71
|
+
}
|
|
72
|
+
return { values, positional };
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
async function runSearch(args) {
|
|
76
|
+
const parsed = parseOptions("search", args, {
|
|
77
|
+
"--query": { field: "query" }, "--query-en": { field: "query_en" }, "--limit": { field: "limit", integer: true },
|
|
78
|
+
"--paths-only": { field: "paths_only", flag: true }, "--detailed": { field: "detailed", flag: true },
|
|
79
|
+
});
|
|
80
|
+
if (parsed.error) return parsed.error;
|
|
81
|
+
const { values, positional } = parsed;
|
|
82
|
+
if (values.query !== undefined && positional.length > 0) return failure("search", "argument_inapplicable", "give the query as words or --query, not both");
|
|
83
|
+
const query = values.query ?? positional.join(" ");
|
|
84
|
+
if (!query) return failure("search", "argument_value_required", "a query is required: stylegallery search \"sticky header\"");
|
|
85
|
+
const { detailed, ...rest } = values;
|
|
86
|
+
const input = { ...rest, query, ...(detailed ? { response_format: "detailed" } : {}) };
|
|
87
|
+
const { invokeSearchOperation } = await import("./agent-native/v2/material-search-v3.mjs");
|
|
88
|
+
const { materialRuntimeOptions } = await import("./agent-native/v2/material-cli-adapter.mjs");
|
|
89
|
+
return report(invokeSearchOperation("search", input, materialRuntimeOptions()));
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
async function runRead(args) {
|
|
93
|
+
const parsed = parseOptions("read", args, { "--section": { field: "section" }, "--outline": { field: "outline", flag: true } });
|
|
94
|
+
if (parsed.error) return parsed.error;
|
|
95
|
+
if (parsed.positional.length !== 1) return failure("read", "argument_value_required", "give exactly one id, path, or StableRef: stylegallery read sg:layout/sticky-header");
|
|
96
|
+
const { invokeSearchOperation } = await import("./agent-native/v2/material-search-v3.mjs");
|
|
97
|
+
const { materialRuntimeOptions } = await import("./agent-native/v2/material-cli-adapter.mjs");
|
|
98
|
+
return report(invokeSearchOperation("read", { reference: parsed.positional[0], ...parsed.values }, materialRuntimeOptions()));
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
async function runRetrieve(args) {
|
|
102
|
+
const parsed = parseOptions("retrieve", args, { "--query": { field: "query" }, "--limit": { field: "limit", integer: true }, "--format": { field: "format" } });
|
|
103
|
+
if (parsed.error) return parsed.error;
|
|
104
|
+
const { format, ...values } = parsed.values;
|
|
105
|
+
if (format !== undefined && format !== "json") return failure("retrieve", "format_unsupported", "Only --format json is supported.");
|
|
106
|
+
const query = values.query ?? parsed.positional.join(" ");
|
|
107
|
+
if (!query) return failure("retrieve", "argument_value_required", "a query is required");
|
|
108
|
+
const { agentNativeRegistry } = await import("./agent-native/registry.mjs");
|
|
109
|
+
return report(agentNativeRegistry.invoke("retrieve", { ...values, query }));
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
export async function runStylegalleryCli(argv, config = {}) {
|
|
113
|
+
const [command, ...rest] = argv;
|
|
114
|
+
if (command === undefined || command === "help" || command === "--help" || command === "-h") {
|
|
115
|
+
return { exitCode: 0, output: HELP_TEXT, report: { ok: true, operation: "help" } };
|
|
116
|
+
}
|
|
117
|
+
if (command === "version" || command === "--version" || command === "-v") {
|
|
118
|
+
return { exitCode: 0, output: `${packageVersion()}\n`, report: { ok: true, operation: "version" } };
|
|
119
|
+
}
|
|
120
|
+
if (rest.includes("--help")) return { exitCode: 0, output: HELP_TEXT, report: { ok: true, operation: "help" } };
|
|
121
|
+
if (command === "search") return runSearch(rest);
|
|
122
|
+
if (command === "read") return runRead(rest);
|
|
123
|
+
if (command === "retrieve") return runRetrieve(rest);
|
|
124
|
+
if (command === "context" && rest.includes("--query")) {
|
|
125
|
+
const { runMaterialCli } = await import("./agent-native/v2/material-cli-adapter.mjs");
|
|
126
|
+
return runMaterialCli(["context", ...rest]);
|
|
127
|
+
}
|
|
128
|
+
const { runSgCli } = await import("./compiler/cli.mjs");
|
|
129
|
+
return runSgCli(argv, config);
|
|
130
|
+
}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
---
|
|
2
|
+
type: Agent Skill
|
|
3
|
+
name: stylegallery-search
|
|
4
|
+
description: Find and read StyleGallery guidance (layout patterns, recipes, motion, state management, platform guides, design terminology, expression) with the stylegallery CLI or the stylegallery-mcp search/read tools. Use when a UI task needs a layout pattern, recipe, or interaction contract and the right document is not already known.
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
# StyleGallery search
|
|
8
|
+
|
|
9
|
+
1. Search with a short task phrase. Pass an English rewrite when you ask in another language:
|
|
10
|
+
|
|
11
|
+
```sh
|
|
12
|
+
stylegallery search "sticky header"
|
|
13
|
+
stylegallery search "헤더 고정" --query-en "sticky header"
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
MCP: `search { "query": "헤더 고정", "query_en": "sticky header" }`.
|
|
17
|
+
|
|
18
|
+
2. Pick a result by `title`, `description`, and the verbatim `snippets`. Each result has a readable `id` such as `sg:layout/sticky-header` and a `next.read` command.
|
|
19
|
+
|
|
20
|
+
3. Read only what you need:
|
|
21
|
+
|
|
22
|
+
```sh
|
|
23
|
+
stylegallery read sg:layout/sticky-header --outline
|
|
24
|
+
stylegallery read sg:layout/sticky-header --section css
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
MCP: `read { "reference": "sg:layout/sticky-header", "section": "css" }`.
|
|
28
|
+
|
|
29
|
+
Notes:
|
|
30
|
+
|
|
31
|
+
- Results default to 5; use `--limit` (1-50) and `--paths-only` when you will open files yourself.
|
|
32
|
+
- `results: []` is a normal answer. Follow `hint`: add `--query-en`, use fewer words, or browse with `stylegallery discover`.
|
|
33
|
+
- `--detailed` (MCP `response_format: "detailed"`) adds scores and hash identities; you rarely need it.
|
|
34
|
+
- With the repository checked out, you can also read the returned `path` directly.
|