@lostgradient/cinder 0.4.1 → 0.6.0

package/dist/cli/knowledge.d.ts

@@ -0,0 +1,23 @@
+import { CinderKnowledgeError, type BestPracticeSection, type BestPracticeTopic, type CinderManifest, type ComponentComparison, type ComponentDetail, type ComponentSummary, type ListOptions, type ManifestComponent, type PackageSummary, type SearchOptions, type SearchResult } from './types.ts';
+export type { BestPracticeSection, BestPracticeTopic, CinderManifest, ComponentComparison, ComponentDetail, ComponentSummary, ListOptions, ManifestComponent, PackageSummary, SearchOptions, SearchResult, };
+export { CinderKnowledgeError };
+export declare class CinderKnowledge {
+    readonly manifest: CinderManifest;
+    readonly package: PackageSummary;
+    private readonly packageRoot;
+    private readonly byId;
+    constructor(manifest: CinderManifest, packageRoot?: string);
+    list(options?: ListOptions): ComponentSummary[];
+    search(query: string, options?: SearchOptions): SearchResult[];
+    show(idOrName: string): Promise<ComponentDetail>;
+    compare(idsOrNames: string[]): ComponentComparison;
+    bestPractices(topic?: BestPracticeTopic): BestPracticeSection[];
+    artifact(idOrName: string, kind: 'schema' | 'variables' | 'examples' | 'constraints'): Promise<unknown>;
+    componentIds(): string[];
+    suggestComponentIds(value: string, limit?: number): string[];
+    private findComponent;
+    private validateFilters;
+    private matchesFilters;
+    private scoreComponent;
+}
+export declare function loadCinderKnowledge(packageRoot?: string): Promise<CinderKnowledge>;

package/dist/cli/manifest-validation.d.ts

@@ -0,0 +1,2 @@
+import { type CinderManifest } from './types.ts';
+export declare function validateManifest(value: unknown): CinderManifest;

package/dist/cli/mcp.d.ts

@@ -0,0 +1,2 @@
+export declare function createMcpServer(): Promise<import("@modelcontextprotocol/sdk/server/mcp.js").McpServer>;
+export declare function runMcpServer(): Promise<void>;

package/dist/cli/output.d.ts

@@ -0,0 +1,21 @@
+import type { BestPracticeSection, ComponentComparison, ComponentDetail, ComponentSummary, PackageSummary, SearchResult } from './types.ts';
+export type JsonEnvelope = {
+    package: PackageSummary;
+    command: string;
+    data: unknown;
+};
+export type JsonErrorEnvelope = {
+    error: {
+        code: string;
+        message: string;
+        suggestions: string[];
+    };
+};
+export declare function jsonEnvelope(packageSummary: PackageSummary, command: string, data: unknown): string;
+export declare function jsonError(code: string, message: string, suggestions?: string[]): string;
+export declare function formatList(components: ComponentSummary[]): string;
+export declare function formatSearch(results: SearchResult[]): string;
+export declare function formatDetail(detail: ComponentDetail): string;
+export declare function formatComparison(comparison: ComponentComparison): string;
+export declare function formatBestPractices(sections: BestPracticeSection[]): string;
+export declare function formatHelp(): string;

package/dist/cli/types.d.ts

@@ -0,0 +1,107 @@
+export type AvoidWhen = {
+    reason: string;
+    alternative?: string;
+};
+export type ManifestComponent = {
+    name: string;
+    id: string;
+    import: string;
+    exportName: string;
+    category: string;
+    status: string;
+    purpose: string;
+    tags: string[];
+    useWhen: string[];
+    avoidWhen: AvoidWhen[];
+    related: string[];
+    hasConstraints: boolean;
+    hasExamples: boolean;
+    artifacts: {
+        schema: string;
+        variables: string;
+        examples?: string;
+        constraints?: string;
+    };
+    a11y?: {
+        pattern?: string;
+        keyboard?: Array<{
+            keys: string;
+            action: string;
+        }>;
+        notes?: string[];
+    };
+};
+export type CinderManifest = {
+    manifestVersion: 1;
+    package: {
+        name: string;
+        version: string;
+        framework: string;
+        frameworkVersionRange: string;
+        stylesEntry: string;
+        schemaDialect: string;
+    };
+    categories: Record<string, {
+        label: string;
+        description: string;
+    }>;
+    statusLevels: Record<string, string>;
+    overlapFamilies: Record<string, string[]>;
+    components: ManifestComponent[];
+};
+export type PackageSummary = {
+    name: string;
+    version: string;
+};
+export type ListOptions = {
+    category?: string;
+    status?: string;
+    tag?: string;
+};
+export type SearchOptions = ListOptions & {
+    limit?: number;
+};
+export type ComponentSummary = {
+    id: string;
+    name: string;
+    exportName: string;
+    import: string;
+    category: string;
+    status: string;
+    purpose: string;
+    tags: string[];
+    useWhen: string[];
+    avoidWhen: AvoidWhen[];
+    related: string[];
+    overlapFamilies: string[];
+    hasExamples: boolean;
+    hasConstraints: boolean;
+};
+export type SearchResult = ComponentSummary & {
+    score: number;
+    matched: string[];
+};
+export type ComponentDetail = {
+    component: ManifestComponent;
+    overlapFamilies: string[];
+    schema: unknown;
+    variables: unknown;
+    examples?: unknown;
+    constraints?: unknown;
+};
+export type ComponentComparison = {
+    components: ComponentSummary[];
+    sharedOverlapFamilies: Record<string, string[]>;
+    guidance: string[];
+};
+export type BestPracticeTopic = 'imports' | 'styles' | 'metadata' | 'overlap' | 'all';
+export type BestPracticeSection = {
+    topic: Exclude<BestPracticeTopic, 'all'>;
+    title: string;
+    guidance: string[];
+};
+export declare class CinderKnowledgeError extends Error {
+    readonly code: string;
+    readonly suggestions: string[];
+    constructor(code: string, message: string, suggestions?: string[]);
+}

package/dist/components/access-gate/access-gate.css.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/access-gate/access-gate.schema.js

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -65,4 +95,4 @@ export {
   access_gate_schema_default as default
 };
 
-//# debugId=DA20DB3E51111EC064756E2164756E21
+//# debugId=00D8B37FB9D4248864756E2164756E21

package/dist/components/access-gate/access-gate.variables.js

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -28,4 +58,4 @@ export {
   access_gate_variables_default as default
 };
 
-//# debugId=BF7C9637796B04F564756E2164756E21
+//# debugId=10BBB12A18D6488B64756E2164756E21

package/dist/components/access-gate/index.js

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -1699,4 +1729,4 @@ export {
   Access_gate as AccessGate
 };
 
-//# debugId=D4E16A3DD68782B564756E2164756E21
+//# debugId=E14516CE366D33DA64756E2164756E21

package/dist/components/accordion/accordion.css.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/accordion/accordion.schema.js

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -53,4 +83,4 @@ export {
   accordion_schema_default as default
 };
 
-//# debugId=8FA0A43A4F49717964756E2164756E21
+//# debugId=524B3FC0E87404C664756E2164756E21

package/dist/components/accordion/accordion.variables.js

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -28,4 +58,4 @@ export {
   accordion_variables_default as default
 };
 
-//# debugId=05F26F54A3C4855764756E2164756E21
+//# debugId=70E3E9A83DC4B37364756E2164756E21

package/dist/components/accordion/index.js

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -179,4 +209,4 @@ export {
   Accordion2 as Accordion
 };
 
-//# debugId=2ED706B164A6EAB764756E2164756E21
+//# debugId=28041FF2439D92F064756E2164756E21

package/dist/components/accordion-item/accordion-item.css.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/accordion-item/accordion-item.schema.js

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -62,4 +92,4 @@ export {
   accordion_item_schema_default as default
 };
 
-//# debugId=AC3922922B4C904B64756E2164756E21
+//# debugId=CED71061F07864C964756E2164756E21

package/dist/components/accordion-item/accordion-item.variables.js

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -28,4 +58,4 @@ export {
   accordion_item_variables_default as default
 };
 
-//# debugId=D37A575CCECE10F764756E2164756E21
+//# debugId=24BF9D6EF0FBB68164756E2164756E21

package/dist/components/accordion-item/index.js

@@ -1,4 +1,34 @@
+var __create = Object.create;
+var __getProtoOf = Object.getPrototypeOf;
 var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+function __accessProp(key) {
+  return this[key];
+}
+var __toESMCache_node;
+var __toESMCache_esm;
+var __toESM = (mod, isNodeMode, target) => {
+  var canCache = mod != null && typeof mod === "object";
+  if (canCache) {
+    var cache = isNodeMode ? __toESMCache_node ??= new WeakMap : __toESMCache_esm ??= new WeakMap;
+    var cached = cache.get(mod);
+    if (cached)
+      return cached;
+  }
+  target = mod != null ? __create(__getProtoOf(mod)) : {};
+  const to = isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target;
+  for (let key of __getOwnPropNames(mod))
+    if (!__hasOwnProp.call(to, key))
+      __defProp(to, key, {
+        get: __accessProp.bind(mod, key),
+        enumerable: true
+      });
+  if (canCache)
+    cache.set(mod, to);
+  return to;
+};
+var __commonJS = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __returnValue = (v) => v;
 function __exportSetter(name, newValue) {
   this[name] = __returnValue.bind(null, newValue);
@@ -105,4 +135,4 @@ export {
   Accordion_item as AccordionItem
 };
 
-//# debugId=C9CC795B930A51A964756E2164756E21
+//# debugId=24027EA7A5E69C8364756E2164756E21

package/dist/components/action-row/action-row.css

@@ -0,0 +1,133 @@
+@layer cinder.tokens, cinder.foundation, cinder.components, cinder.utilities;
+@layer cinder.components {
+  .cinder-action-row {
+    display: block;
+    inline-size: 100%;
+    padding: var(--cinder-space-3) var(--cinder-space-4);
+    border: 0;
+    border-radius: var(--cinder-radius-md);
+    background: transparent;
+    color: var(--cinder-text);
+    font: inherit;
+    text-align: start;
+    cursor: pointer;
+  }
+
+  .cinder-action-row[data-cinder-density='condensed'] {
+    padding: var(--cinder-space-2) var(--cinder-space-3);
+  }
+
+  @media (hover: hover) {
+    .cinder-action-row:hover:not(:disabled) {
+      background: var(--cinder-surface-hover);
+    }
+  }
+
+  .cinder-action-row:focus-visible {
+    outline: var(--cinder-ring-width) solid transparent;
+    box-shadow: var(--_cinder-focus-ring-shadow);
+  }
+
+  .cinder-action-row:disabled {
+    color: var(--cinder-text-disabled);
+    cursor: not-allowed;
+  }
+
+  .cinder-action-row[data-cinder-selected] {
+    background: color-mix(in oklch, var(--cinder-accent), transparent 92%);
+    color: var(--cinder-accent-text);
+  }
+
+  @media (hover: hover) {
+    .cinder-action-row[data-cinder-selected]:hover:not(:disabled) {
+      background: color-mix(in oklch, var(--cinder-accent), transparent 88%);
+    }
+  }
+
+  @media (forced-colors: active) {
+    .cinder-action-row:focus-visible {
+      outline: var(--cinder-ring-width) solid ButtonText;
+      outline-offset: 2px;
+      box-shadow: none;
+    }
+
+    .cinder-action-row[data-cinder-selected] {
+      outline: 1px solid Highlight;
+      color: HighlightText;
+      background: Highlight;
+    }
+
+    .cinder-action-row[data-cinder-selected] .cinder-action-row__description,
+    .cinder-action-row[data-cinder-selected] .cinder-action-row__meta,
+    .cinder-action-row[data-cinder-selected] .cinder-action-row__trailing {
+      color: HighlightText;
+    }
+  }
+
+  .cinder-action-row__layout {
+    display: grid;
+    align-items: center;
+    column-gap: var(--cinder-space-3);
+    row-gap: var(--cinder-space-2);
+    grid-template-columns: 1fr;
+    grid-template-areas: 'body';
+  }
+
+  .cinder-action-row--has-leading .cinder-action-row__layout {
+    grid-template-columns: auto 1fr;
+    grid-template-areas: 'leading body';
+  }
+
+  .cinder-action-row--has-trailing .cinder-action-row__layout {
+    grid-template-columns: 1fr auto;
+    grid-template-areas: 'body trailing';
+  }
+
+  .cinder-action-row--has-leading.cinder-action-row--has-trailing .cinder-action-row__layout {
+    grid-template-columns: auto 1fr auto;
+    grid-template-areas: 'leading body trailing';
+  }
+
+  .cinder-action-row__leading {
+    grid-area: leading;
+    display: inline-flex;
+    align-items: center;
+  }
+
+  .cinder-action-row__body {
+    grid-area: body;
+    display: flex;
+    min-inline-size: 0;
+    flex-direction: column;
+    gap: var(--cinder-space-1);
+  }
+
+  .cinder-action-row__trailing {
+    grid-area: trailing;
+    display: inline-flex;
+    align-items: center;
+    gap: var(--cinder-space-2);
+    color: var(--cinder-text-muted);
+  }
+
+  .cinder-action-row__title {
+    color: inherit;
+    font-size: var(--cinder-text-sm);
+    line-height: var(--cinder-leading-snug);
+    overflow-wrap: anywhere;
+  }
+
+  .cinder-action-row__description {
+    color: var(--cinder-text-muted);
+    font-size: var(--cinder-text-sm);
+    line-height: var(--cinder-leading-snug);
+    overflow-wrap: anywhere;
+  }
+
+  .cinder-action-row__meta {
+    color: var(--cinder-text-muted);
+    font-size: var(--cinder-text-xs);
+    line-height: var(--cinder-leading-snug);
+    overflow-wrap: anywhere;
+  }
+}

package/dist/components/action-row/action-row.css.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/action-row/action-row.schema.d.ts

@@ -0,0 +1,3 @@
+import type { ComponentSchema } from '../../schema-types';
+declare const _default: ComponentSchema;
+export default _default;