@flowstack-ui/brick 0.1.3 → 0.1.4

package/dist/agents/text.json

@@ -0,0 +1,60 @@
+{
+  "schema": "flowstack.agent-component.v1",
+  "id": "text",
+  "name": "Text",
+  "package": "@flowstack-ui/brick",
+  "layer": "brick",
+  "kind": "component",
+  "purpose": "Apply Brick typography roles, sizes, tones, weight, alignment, and wrapping while preserving the chosen semantic text element.",
+  "useWhen": [
+    "Interface copy needs Brick typography, including headings, paragraphs, labels, captions, metadata, or inline text."
+  ],
+  "avoidWhen": [
+    {
+      "condition": "A component such as Button, Link, Field.Label, Card.Title, or Badge already owns the text role.",
+      "useInstead": "that component's named text part"
+    }
+  ],
+  "composition": [
+    "Choose the semantic element first, then select the closest Brick text role, size, and tone; use Stack for text layout rather than wrapper spans."
+  ],
+  "rules": [
+    {
+      "id": "text-semantics",
+      "level": "must",
+      "statement": "Do not choose heading or paragraph semantics solely from the desired font size."
+    },
+    {
+      "id": "text-brick-first",
+      "level": "must",
+      "statement": "Use Text for standalone styled interface copy instead of native spans plus duplicate typography CSS."
+    },
+    {
+      "id": "text-readable",
+      "level": "must",
+      "statement": "Preserve readable body sizing, line height, measure, contrast, and user font scaling."
+    },
+    {
+      "id": "text-css",
+      "level": "must",
+      "statement": "Load styles.css or core.css plus text.css."
+    }
+  ],
+  "commonMistakes": [
+    {
+      "mistake": "Using five spans to build brand text, selecting all-caps eyebrow styling for paragraph descriptions, or setting headings from appearance.",
+      "correction": "Use Text with semantic elements and reserve display treatments for their intended short roles."
+    }
+  ],
+  "validation": [
+    "Check heading order, semantics, line length, wrapping, truncation, user font scaling, zoom, contrast, themes, and RTL.",
+    "Confirm parent component text parts are not bypassed and CSS is loaded."
+  ],
+  "related": [
+    "stack",
+    "link",
+    "card",
+    "field",
+    "badge"
+  ]
+}

package/dist/agents/text.md

@@ -0,0 +1,41 @@
+# Text agent guide
+
+## Purpose
+
+Apply Brick typography roles, sizes, tones, weight, alignment, and wrapping while preserving the chosen semantic text element.
+
+## Use when
+
+- Interface copy needs Brick typography, including headings, paragraphs, labels, captions, metadata, or inline text.
+
+## Choose something else when
+
+- A component such as Button, Link, Field.Label, Card.Title, or Badge already owns the text role. Use that component's named text part.
+
+## Required composition
+
+- Choose the semantic element first, then select the closest Brick text role, size, and tone; use Stack for text layout rather than wrapper spans.
+
+## Rules
+
+- **MUST:** Do not choose heading or paragraph semantics solely from the desired font size.
+- **MUST:** Use Text for standalone styled interface copy instead of native spans plus duplicate typography CSS.
+- **MUST:** Preserve readable body sizing, line height, measure, contrast, and user font scaling.
+- **MUST:** Load styles.css or core.css plus text.css.
+
+## Common mistakes
+
+- **Avoid:** Using five spans to build brand text, selecting all-caps eyebrow styling for paragraph descriptions, or setting headings from appearance. **Instead:** Use Text with semantic elements and reserve display treatments for their intended short roles.
+
+## Validation checklist
+
+- Check heading order, semantics, line length, wrapping, truncation, user font scaling, zoom, contrast, themes, and RTL.
+- Confirm parent component text parts are not bypassed and CSS is loaded.
+
+## Related guidance
+
+- `stack`
+- `link`
+- `card`
+- `field`
+- `badge`

package/dist/agents/textarea.json

@@ -0,0 +1,48 @@
+{
+  "schema": "flowstack.agent-component.v1",
+  "id": "textarea",
+  "name": "Textarea",
+  "package": "@flowstack-ui/brick",
+  "layer": "brick",
+  "kind": "component",
+  "purpose": "Render finished native multi-line text entry with Brick sizing, states, resize policy, and Atom field integration.",
+  "useWhen": [
+    "The user enters sentences, paragraphs, notes, or other multi-line text."
+  ],
+  "avoidWhen": [
+    {
+      "condition": "The expected value is short and single-line.",
+      "useInstead": "Input"
+    }
+  ],
+  "composition": [
+    "Place Textarea inside one Field.Root after Field.Label and add description or character guidance when useful."
+  ],
+  "rules": [
+    {
+      "id": "textarea-label",
+      "level": "must",
+      "statement": "Use a persistent accessible label."
+    },
+    {
+      "id": "textarea-css",
+      "level": "must",
+      "statement": "Load styles.css or core.css plus textarea.css and field.css when composed with Field."
+    }
+  ],
+  "commonMistakes": [
+    {
+      "mistake": "Using a single-line Input for long freeform content.",
+      "correction": "Use Textarea and allow a usable multi-line measure."
+    }
+  ],
+  "validation": [
+    "Inspect label, name, and messaging relationships.",
+    "Test multi-line entry, resize policy, narrow widths, invalid/disabled states, and contrast."
+  ],
+  "related": [
+    "@flowstack-ui/atom/agents/textarea",
+    "field",
+    "input"
+  ]
+}

package/dist/agents/textarea.md

@@ -0,0 +1,37 @@
+# Textarea agent guide
+
+## Purpose
+
+Render finished native multi-line text entry with Brick sizing, states, resize policy, and Atom field integration.
+
+## Use when
+
+- The user enters sentences, paragraphs, notes, or other multi-line text.
+
+## Choose something else when
+
+- The expected value is short and single-line. Use Input.
+
+## Required composition
+
+- Place Textarea inside one Field.Root after Field.Label and add description or character guidance when useful.
+
+## Rules
+
+- **MUST:** Use a persistent accessible label.
+- **MUST:** Load styles.css or core.css plus textarea.css and field.css when composed with Field.
+
+## Common mistakes
+
+- **Avoid:** Using a single-line Input for long freeform content. **Instead:** Use Textarea and allow a usable multi-line measure.
+
+## Validation checklist
+
+- Inspect label, name, and messaging relationships.
+- Test multi-line entry, resize policy, narrow widths, invalid/disabled states, and contrast.
+
+## Related guidance
+
+- `@flowstack-ui/atom/agents/textarea`
+- `field`
+- `input`

package/dist/agents/toolbar.json

@@ -0,0 +1,55 @@
+{
+  "schema": "flowstack.agent-component.v1",
+  "id": "toolbar",
+  "name": "Toolbar",
+  "package": "@flowstack-ui/brick",
+  "layer": "brick",
+  "kind": "component",
+  "purpose": "Style one logical group of related commands with Atom toolbar semantics and roving keyboard focus.",
+  "useWhen": [
+    "Related editor or application controls should behave as one horizontal or vertical keyboard group."
+  ],
+  "avoidWhen": [
+    {
+      "condition": "The items are navigation destinations or unrelated standalone actions.",
+      "useInstead": "NavigationMenu/NavList or separate Button and IconButton controls"
+    }
+  ],
+  "composition": [
+    "Compose Button, Link, Separator, and ToggleGroup/ToggleItem parts inside a named Root; use Brick icons and concise visible or accessible labels."
+  ],
+  "rules": [
+    {
+      "id": "toolbar-owner",
+      "level": "must",
+      "statement": "Use Toolbar rather than adding manual arrow-key handlers or role=toolbar to an AppBar row."
+    },
+    {
+      "id": "toolbar-overflow",
+      "level": "must",
+      "statement": "Define a deliberate narrow-width wrap, scroll, or alternative composition without breaking roving focus order."
+    },
+    {
+      "id": "toolbar-css",
+      "level": "must",
+      "statement": "Load styles.css or core.css plus toolbar.css and any composed Icon stylesheet."
+    }
+  ],
+  "commonMistakes": [
+    {
+      "mistake": "Using AppBar.Toolbar as the behavior owner or placing unrelated page actions in one roving group.",
+      "correction": "Compose a named Toolbar only around logically related controls."
+    }
+  ],
+  "validation": [
+    "Test orientation, arrows, disabled items, links, toggles, separators, Tab entry/exit, focus rings, touch targets, overflow, themes, zoom, and RTL.",
+    "Confirm names and CSS delivery."
+  ],
+  "related": [
+    "app-bar",
+    "button",
+    "icon-button",
+    "toggle-group",
+    "divider"
+  ]
+}

package/dist/agents/toolbar.md

@@ -0,0 +1,40 @@
+# Toolbar agent guide
+
+## Purpose
+
+Style one logical group of related commands with Atom toolbar semantics and roving keyboard focus.
+
+## Use when
+
+- Related editor or application controls should behave as one horizontal or vertical keyboard group.
+
+## Choose something else when
+
+- The items are navigation destinations or unrelated standalone actions. Use NavigationMenu/NavList or separate Button and IconButton controls.
+
+## Required composition
+
+- Compose Button, Link, Separator, and ToggleGroup/ToggleItem parts inside a named Root; use Brick icons and concise visible or accessible labels.
+
+## Rules
+
+- **MUST:** Use Toolbar rather than adding manual arrow-key handlers or role=toolbar to an AppBar row.
+- **MUST:** Define a deliberate narrow-width wrap, scroll, or alternative composition without breaking roving focus order.
+- **MUST:** Load styles.css or core.css plus toolbar.css and any composed Icon stylesheet.
+
+## Common mistakes
+
+- **Avoid:** Using AppBar.Toolbar as the behavior owner or placing unrelated page actions in one roving group. **Instead:** Compose a named Toolbar only around logically related controls.
+
+## Validation checklist
+
+- Test orientation, arrows, disabled items, links, toggles, separators, Tab entry/exit, focus rings, touch targets, overflow, themes, zoom, and RTL.
+- Confirm names and CSS delivery.
+
+## Related guidance
+
+- `app-bar`
+- `button`
+- `icon-button`
+- `toggle-group`
+- `divider`

package/dist/components/button/Button.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { Button as AtomButton, } from "@flowstack-ui/atom/button";
+import { ButtonRoot as AtomButtonRoot, } from "@flowstack-ui/atom/button";
 function mergeClassName(className) {
     return className ? `brick-button ${className}` : "brick-button";
 }
 export const Button = forwardRef(function Button({ variant = "solid", tone = "accent", size = "md", shape = "rounded", fullWidth = false, startIcon, endIcon, className, children, asChild = false, render, ...rootProps }, ref) {
     const content = asChild ? (children) : (_jsxs(_Fragment, { children: [startIcon !== undefined ? (_jsx("span", { "aria-hidden": "true", className: "brick-button__icon", "data-position": "start", children: startIcon })) : null, _jsx("span", { className: "brick-button__content", children: children }), endIcon !== undefined ? (_jsx("span", { "aria-hidden": "true", className: "brick-button__icon", "data-position": "end", children: endIcon })) : null] }));
-    return (_jsx(AtomButton.Root, { ...rootProps, asChild: asChild, className: mergeClassName(className), "data-full-width": fullWidth ? "" : undefined, "data-shape": shape, "data-size": size, "data-tone": tone, "data-variant": variant, ref: ref, render: render, children: content }));
+    return (_jsx(AtomButtonRoot, { ...rootProps, asChild: asChild, className: mergeClassName(className), "data-full-width": fullWidth ? "" : undefined, "data-shape": shape, "data-size": size, "data-tone": tone, "data-variant": variant, ref: ref, render: render, children: content }));
 });
 Button.displayName = "Button";
 //# sourceMappingURL=Button.js.map

package/dist/components/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAqC,MAAM,OAAO,CAAC;AACtE,OAAO,EACL,MAAM,IAAI,UAAU,GAErB,MAAM,2BAA2B,CAAC;AA+CnC,SAAS,cAAc,CAAC,SAA6B;IACnD,OAAO,SAAS,CAAC,CAAC,CAAC,gBAAgB,SAAS,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC;AAClE,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAA2B,SAAS,MAAM,CACxE,EACE,OAAO,GAAG,OAAO,EACjB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,SAAS,EACjB,SAAS,GAAG,KAAK,EACjB,SAAS,EACT,OAAO,EACP,SAAS,EACT,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,MAAM,EACN,GAAG,SAAS,EACb,EACD,GAAG;IAEH,MAAM,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,CACxB,QAAQ,CACT,CAAC,CAAC,CAAC,CACF,8BACG,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CACzB,8BAAkB,MAAM,EAAC,SAAS,EAAC,oBAAoB,mBAAe,OAAO,YAC1E,SAAS,GACL,CACR,CAAC,CAAC,CAAC,IAAI,EACR,eAAM,SAAS,EAAC,uBAAuB,YAAE,QAAQ,GAAQ,EACxD,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,CACvB,8BAAkB,MAAM,EAAC,SAAS,EAAC,oBAAoB,mBAAe,KAAK,YACxE,OAAO,GACH,CACR,CAAC,CAAC,CAAC,IAAI,IACP,CACJ,CAAC;IAEF,OAAO,CACL,KAAC,UAAU,CAAC,IAAI,OACV,SAAS,EACb,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,cAAc,CAAC,SAAS,CAAC,qBACnB,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,gBAC/B,KAAK,eACN,IAAI,eACJ,IAAI,kBACD,OAAO,EACrB,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,MAAM,YAEb,OAAO,GACQ,CACnB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC"}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAqC,MAAM,OAAO,CAAC;AACtE,OAAO,EACL,UAAU,IAAI,cAAc,GAE7B,MAAM,2BAA2B,CAAC;AA+CnC,SAAS,cAAc,CAAC,SAA6B;IACnD,OAAO,SAAS,CAAC,CAAC,CAAC,gBAAgB,SAAS,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC;AAClE,CAAC;AAED,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAA2B,SAAS,MAAM,CACxE,EACE,OAAO,GAAG,OAAO,EACjB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,SAAS,EACjB,SAAS,GAAG,KAAK,EACjB,SAAS,EACT,OAAO,EACP,SAAS,EACT,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,MAAM,EACN,GAAG,SAAS,EACb,EACD,GAAG;IAEH,MAAM,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,CACxB,QAAQ,CACT,CAAC,CAAC,CAAC,CACF,8BACG,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CACzB,8BAAkB,MAAM,EAAC,SAAS,EAAC,oBAAoB,mBAAe,OAAO,YAC1E,SAAS,GACL,CACR,CAAC,CAAC,CAAC,IAAI,EACR,eAAM,SAAS,EAAC,uBAAuB,YAAE,QAAQ,GAAQ,EACxD,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,CACvB,8BAAkB,MAAM,EAAC,SAAS,EAAC,oBAAoB,mBAAe,KAAK,YACxE,OAAO,GACH,CACR,CAAC,CAAC,CAAC,IAAI,IACP,CACJ,CAAC;IAEF,OAAO,CACL,KAAC,cAAc,OACT,SAAS,EACb,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,cAAc,CAAC,SAAS,CAAC,qBACnB,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,gBAC/B,KAAK,eACN,IAAI,eACJ,IAAI,kBACD,OAAO,EACrB,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,MAAM,YAEb,OAAO,GACO,CAClB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC"}

package/dist/components/chip/Chip.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { Badge as AtomBadge, } from "@flowstack-ui/atom/badge";
-import { Button as AtomButton, } from "@flowstack-ui/atom/button";
+import { BadgeRoot as AtomBadgeRoot, } from "@flowstack-ui/atom/badge";
+import { ButtonRoot as AtomButtonRoot, } from "@flowstack-ui/atom/button";
 function classes(base, className) {
     return className ? `${base} ${className}` : base;
 }
@@ -9,13 +9,13 @@ function DefaultRemoveIcon() {
     return (_jsx("svg", { "aria-hidden": "true", viewBox: "0 0 16 16", children: _jsx("path", { d: "m4 4 8 8M12 4l-8 8" }) }));
 }
 export const ChipRoot = forwardRef(function ChipRoot({ className, shape = "pill", size = "md", tone = "neutral", variant = "soft", ...props }, ref) {
-    return (_jsx(AtomBadge.Root, { ...props, className: classes("brick-chip", className), "data-shape": shape, "data-size": size, "data-tone": tone, "data-variant": variant, ref: ref }));
+    return (_jsx(AtomBadgeRoot, { ...props, className: classes("brick-chip", className), "data-shape": shape, "data-size": size, "data-tone": tone, "data-variant": variant, ref: ref }));
 });
 export const ChipLabel = forwardRef(function ChipLabel({ className, ...props }, ref) {
     return (_jsx("span", { ...props, className: classes("brick-chip__label", className), "data-slot": "chip-label", ref: ref }));
 });
 export const ChipRemoveTrigger = forwardRef(function ChipRemoveTrigger({ ariaLabel, children, className, disabled, "data-slot": dataSlot = "chip-remove-trigger", ...props }, ref) {
-    return (_jsx(AtomButton.Root, { ...props, "aria-label": ariaLabel, className: classes("brick-chip__remove-trigger", className), "data-disabled": disabled ? "" : undefined, "data-slot": dataSlot, disabled: disabled, ref: ref, children: children ?? _jsx(DefaultRemoveIcon, {}) }));
+    return (_jsx(AtomButtonRoot, { ...props, "aria-label": ariaLabel, className: classes("brick-chip__remove-trigger", className), "data-disabled": disabled ? "" : undefined, "data-slot": dataSlot, disabled: disabled, ref: ref, children: children ?? _jsx(DefaultRemoveIcon, {}) }));
 });
 ChipRoot.displayName = "Chip.Root";
 ChipLabel.displayName = "Chip.Label";

package/dist/components/chip/Chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../src/components/chip/Chip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAiD,MAAM,OAAO,CAAC;AAClF,OAAO,EACL,KAAK,IAAI,SAAS,GAEnB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,MAAM,IAAI,UAAU,GAErB,MAAM,2BAA2B,CAAC;AAuBnC,SAAS,OAAO,CAAC,IAAY,EAAE,SAAkB;IAC/C,OAAO,SAAS,CAAC,CAAC,CAAC,GAAG,IAAI,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;AACnD,CAAC;AAED,SAAS,iBAAiB;IACxB,OAAO,CACL,6BAAiB,MAAM,EAAC,OAAO,EAAC,WAAW,YACzC,eAAM,CAAC,EAAC,oBAAoB,GAAG,GAC3B,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,SAAS,QAAQ,CACf,EACE,SAAS,EACT,KAAK,GAAG,MAAM,EACd,IAAI,GAAG,IAAI,EACX,IAAI,GAAG,SAAS,EAChB,OAAO,GAAG,MAAM,EAChB,GAAG,KAAK,EACT,EACD,GAAG;IAEH,OAAO,CACL,KAAC,SAAS,CAAC,IAAI,OACT,KAAK,EACT,SAAS,EAAE,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC,gBAC/B,KAAK,eACN,IAAI,eACJ,IAAI,kBACD,OAAO,EACrB,GAAG,EAAE,GAAG,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,SAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG;IAC7C,OAAO,CACL,kBACM,KAAK,EACT,SAAS,EAAE,OAAO,CAAC,mBAAmB,EAAE,SAAS,CAAC,eACxC,YAAY,EACtB,GAAG,EAAE,GAAG,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,UAAU,CACzC,SAAS,iBAAiB,CACxB,EACE,SAAS,EACT,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,WAAW,EAAE,QAAQ,GAAG,qBAAqB,EAC7C,GAAG,KAAK,EACT,EACD,GAAG;IAEH,OAAO,CACL,KAAC,UAAU,CAAC,IAAI,OACV,KAAK,gBACG,SAAS,EACrB,SAAS,EAAE,OAAO,CAAC,4BAA4B,EAAE,SAAS,CAAC,mBAC5C,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,eAC7B,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,GAAG,YAEP,QAAQ,IAAI,KAAC,iBAAiB,KAAG,GAClB,CACnB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,QAAQ,CAAC,WAAW,GAAG,WAAW,CAAC;AACnC,SAAS,CAAC,WAAW,GAAG,YAAY,CAAC;AACrC,iBAAiB,CAAC,WAAW,GAAG,oBAAoB,CAAC;AAErD,MAAM,CAAC,MAAM,IAAI,GAAG;IAClB,IAAI,EAAE,QAAQ;IACd,KAAK,EAAE,SAAS;IAChB,aAAa,EAAE,iBAAiB;CACxB,CAAC"}
+{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../src/components/chip/Chip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAiD,MAAM,OAAO,CAAC;AAClF,OAAO,EACL,SAAS,IAAI,aAAa,GAE3B,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,UAAU,IAAI,cAAc,GAE7B,MAAM,2BAA2B,CAAC;AAuBnC,SAAS,OAAO,CAAC,IAAY,EAAE,SAAkB;IAC/C,OAAO,SAAS,CAAC,CAAC,CAAC,GAAG,IAAI,IAAI,SAAS,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;AACnD,CAAC;AAED,SAAS,iBAAiB;IACxB,OAAO,CACL,6BAAiB,MAAM,EAAC,OAAO,EAAC,WAAW,YACzC,eAAM,CAAC,EAAC,oBAAoB,GAAG,GAC3B,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,SAAS,QAAQ,CACf,EACE,SAAS,EACT,KAAK,GAAG,MAAM,EACd,IAAI,GAAG,IAAI,EACX,IAAI,GAAG,SAAS,EAChB,OAAO,GAAG,MAAM,EAChB,GAAG,KAAK,EACT,EACD,GAAG;IAEH,OAAO,CACL,KAAC,aAAa,OACR,KAAK,EACT,SAAS,EAAE,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC,gBAC/B,KAAK,eACN,IAAI,eACJ,IAAI,kBACD,OAAO,EACrB,GAAG,EAAE,GAAG,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,SAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG;IAC7C,OAAO,CACL,kBACM,KAAK,EACT,SAAS,EAAE,OAAO,CAAC,mBAAmB,EAAE,SAAS,CAAC,eACxC,YAAY,EACtB,GAAG,EAAE,GAAG,GACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,UAAU,CACzC,SAAS,iBAAiB,CACxB,EACE,SAAS,EACT,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,WAAW,EAAE,QAAQ,GAAG,qBAAqB,EAC7C,GAAG,KAAK,EACT,EACD,GAAG;IAEH,OAAO,CACL,KAAC,cAAc,OACT,KAAK,gBACG,SAAS,EACrB,SAAS,EAAE,OAAO,CAAC,4BAA4B,EAAE,SAAS,CAAC,mBAC5C,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,eAC7B,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,GAAG,YAEP,QAAQ,IAAI,KAAC,iBAAiB,KAAG,GACnB,CAClB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,QAAQ,CAAC,WAAW,GAAG,WAAW,CAAC;AACnC,SAAS,CAAC,WAAW,GAAG,YAAY,CAAC;AACrC,iBAAiB,CAAC,WAAW,GAAG,oBAAoB,CAAC;AAErD,MAAM,CAAC,MAAM,IAAI,GAAG;IAClB,IAAI,EAAE,QAAQ;IACd,KAAK,EAAE,SAAS;IAChB,aAAa,EAAE,iBAAiB;CACxB,CAAC"}

package/dist/components/icon-button/IconButton.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-import { Button as AtomButton, } from "@flowstack-ui/atom/button";
+import { ButtonRoot as AtomButtonRoot, } from "@flowstack-ui/atom/button";
 function mergeClassName(className) {
     return className ? `brick-icon-button ${className}` : "brick-icon-button";
 }
 export const IconButton = forwardRef(function IconButton({ variant = "ghost", tone = "neutral", size = "md", shape = "rounded", className, children, asChild = false, render, ...rootProps }, ref) {
     const content = asChild ? children : (_jsx("span", { "aria-hidden": "true", className: "brick-icon-button__icon", children: children }));
-    return (_jsx(AtomButton.Root, { ...rootProps, asChild: asChild, className: mergeClassName(className), "data-shape": shape, "data-size": size, "data-tone": tone, "data-variant": variant, ref: ref, render: render, children: content }));
+    return (_jsx(AtomButtonRoot, { ...rootProps, asChild: asChild, className: mergeClassName(className), "data-shape": shape, "data-size": size, "data-tone": tone, "data-variant": variant, ref: ref, render: render, children: content }));
 });
 IconButton.displayName = "IconButton";
 //# sourceMappingURL=IconButton.js.map

package/dist/components/icon-button/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../src/components/icon-button/IconButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAqC,MAAM,OAAO,CAAC;AACtE,OAAO,EACL,MAAM,IAAI,UAAU,GAErB,MAAM,2BAA2B,CAAC;AAsCnC,SAAS,cAAc,CAAC,SAA6B;IACnD,OAAO,SAAS,CAAC,CAAC,CAAC,qBAAqB,SAAS,EAAE,CAAC,CAAC,CAAC,mBAAmB,CAAC;AAC5E,CAAC;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,SAAS,UAAU,CACjB,EACE,OAAO,GAAG,OAAO,EACjB,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,SAAS,EACjB,SAAS,EACT,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,MAAM,EACN,GAAG,SAAS,EACb,EACD,GAAG;IAEH,MAAM,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CACnC,8BAAkB,MAAM,EAAC,SAAS,EAAC,yBAAyB,YACzD,QAAQ,GACJ,CACR,CAAC;IAEF,OAAO,CACL,KAAC,UAAU,CAAC,IAAI,OACV,SAAS,EACb,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,cAAc,CAAC,SAAS,CAAC,gBACxB,KAAK,eACN,IAAI,eACJ,IAAI,kBACD,OAAO,EACrB,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,MAAM,YAEb,OAAO,GACQ,CACnB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC"}
+{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../src/components/icon-button/IconButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAqC,MAAM,OAAO,CAAC;AACtE,OAAO,EACL,UAAU,IAAI,cAAc,GAE7B,MAAM,2BAA2B,CAAC;AAsCnC,SAAS,cAAc,CAAC,SAA6B;IACnD,OAAO,SAAS,CAAC,CAAC,CAAC,qBAAqB,SAAS,EAAE,CAAC,CAAC,CAAC,mBAAmB,CAAC;AAC5E,CAAC;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,SAAS,UAAU,CACjB,EACE,OAAO,GAAG,OAAO,EACjB,IAAI,GAAG,SAAS,EAChB,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,SAAS,EACjB,SAAS,EACT,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,MAAM,EACN,GAAG,SAAS,EACb,EACD,GAAG;IAEH,MAAM,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CACnC,8BAAkB,MAAM,EAAC,SAAS,EAAC,yBAAyB,YACzD,QAAQ,GACJ,CACR,CAAC;IAEF,OAAO,CACL,KAAC,cAAc,OACT,SAAS,EACb,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,cAAc,CAAC,SAAS,CAAC,gBACxB,KAAK,eACN,IAAI,eACJ,IAAI,kBACD,OAAO,EACrB,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,MAAM,YAEb,OAAO,GACO,CAClB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC"}

package/dist/navigation-menu.d.ts

@@ -1,2 +1,3 @@
 export * from "./components/navigation-menu/index.js";
+export { NavigationMenuRoot as Root, NavigationMenuSub as Sub, NavigationMenuList as List, NavigationMenuItem as Item, NavigationMenuTrigger as Trigger, NavigationMenuContent as Content, NavigationMenuLink as Link, NavigationMenuIndicator as Indicator, NavigationMenuIndicatorArrow as IndicatorArrow, NavigationMenuViewport as Viewport, } from "./components/navigation-menu/NavigationMenu.js";
 //# sourceMappingURL=navigation-menu.d.ts.map

package/dist/navigation-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu.d.ts","sourceRoot":"","sources":["../src/navigation-menu.ts"],"names":[],"mappings":"AAAA,cAAc,uCAAuC,CAAC"}
+{"version":3,"file":"navigation-menu.d.ts","sourceRoot":"","sources":["../src/navigation-menu.ts"],"names":[],"mappings":"AAAA,cAAc,uCAAuC,CAAC;AAEtD,OAAO,EACL,kBAAkB,IAAI,IAAI,EAC1B,iBAAiB,IAAI,GAAG,EACxB,kBAAkB,IAAI,IAAI,EAC1B,kBAAkB,IAAI,IAAI,EAC1B,qBAAqB,IAAI,OAAO,EAChC,qBAAqB,IAAI,OAAO,EAChC,kBAAkB,IAAI,IAAI,EAC1B,uBAAuB,IAAI,SAAS,EACpC,4BAA4B,IAAI,cAAc,EAC9C,sBAAsB,IAAI,QAAQ,GACnC,MAAM,gDAAgD,CAAC"}

package/dist/navigation-menu.js

@@ -1,2 +1,3 @@
 export * from "./components/navigation-menu/index.js";
+export { NavigationMenuRoot as Root, NavigationMenuSub as Sub, NavigationMenuList as List, NavigationMenuItem as Item, NavigationMenuTrigger as Trigger, NavigationMenuContent as Content, NavigationMenuLink as Link, NavigationMenuIndicator as Indicator, NavigationMenuIndicatorArrow as IndicatorArrow, NavigationMenuViewport as Viewport, } from "./components/navigation-menu/NavigationMenu.js";
 //# sourceMappingURL=navigation-menu.js.map

package/dist/navigation-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu.js","sourceRoot":"","sources":["../src/navigation-menu.ts"],"names":[],"mappings":"AAAA,cAAc,uCAAuC,CAAC"}
+{"version":3,"file":"navigation-menu.js","sourceRoot":"","sources":["../src/navigation-menu.ts"],"names":[],"mappings":"AAAA,cAAc,uCAAuC,CAAC;AAEtD,OAAO,EACL,kBAAkB,IAAI,IAAI,EAC1B,iBAAiB,IAAI,GAAG,EACxB,kBAAkB,IAAI,IAAI,EAC1B,kBAAkB,IAAI,IAAI,EAC1B,qBAAqB,IAAI,OAAO,EAChC,qBAAqB,IAAI,OAAO,EAChC,kBAAkB,IAAI,IAAI,EAC1B,uBAAuB,IAAI,SAAS,EACpC,4BAA4B,IAAI,cAAc,EAC9C,sBAAsB,IAAI,QAAQ,GACnC,MAAM,gDAAgD,CAAC"}

package/dist/styles/code-block.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":null,"mappings":"ACAA,sCAAA,wBCCE,+cAcA,4HAKA,uCACE,sFAKF,8BACE,qIAMF,iIAUA,mIG1CA,0tEAwDA,iEAIA,yJAKA,+JAKA,wMAKA,gGAIA,oLAOA,wDAKA,wCAIA,0GAIA,yCAIA,4FAOA,uHAKA,gDAIA,wDAIA,8EAIA,6SASA,0SASA,8SASA,0SASA,osBAiBA,gqBAaA,0oBAaA,2qBAaA,2qBAaA,gqBAaA,4VAQA,kUAQA,4SAQA,wCACE,0JAKA,sMAKA,gGAKF,uCACE,sCAKF,8BACE,6EAMA,oDAIA,6EF9SF,ixCA8BA,kKAOA,oEACA,gKAIA,gKAKA,8BACE,oHChDF,2KAQA,6OAUA,4EACA,8EACA,iEAEA,qGACA,8HACA,gIACA,wHACA,8HACA,iNAIA,gLAKA,8BACE,uIAEA,mEEvCF,0yCA2BA,iKAKA,+GAKA,2jBAUA,gPASA,qSASA,8NAKA,4GAOA,mDAEA,+FAKA,uZAcA,8HAMA,0FAMA,6IAKA,6SAOA,6EAEA,8BACE,+SL9HJ","sources":["home/runner/work/brick/brick/.brick-cache/production/code-block.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-spinner/action-spinner.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code/code.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code-block/code-block.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/button/button.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/scroll-area/scroll-area.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-spinner/action-spinner.css\";\n@import \"../../src/components/button/button.css\";\n@import \"../../src/components/code/code.css\";\n@import \"../../src/components/scroll-area/scroll-area.css\";\n@import \"../../src/components/code-block/code-block.css\";","@layer brick.tokens, brick.foundations, brick.components, brick.effects;\n","@layer brick.components {\n  :where(.brick-button, .brick-icon-button)[data-loading]::after {\n    position: absolute;\n    inset-block-start: 50%;\n    inset-inline-start: 50%;\n    inline-size: var(--brick-action-spinner-size);\n    block-size: var(--brick-action-spinner-size);\n    border: 0.125rem solid transparent;\n    border-block-start-color: var(--brick-action-spinner-color);\n    border-inline-end-color: var(--brick-action-spinner-color);\n    border-radius: var(--brick-radius-full);\n    content: \"\";\n    animation: brick-action-spinner-spin 700ms linear infinite;\n  }\n\n  :where([dir=\"rtl\"])\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n    animation-name: brick-action-spinner-spin-rtl;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n      animation-duration: 1400ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n      border-block-start-color: ButtonText;\n      border-inline-end-color: ButtonText;\n    }\n  }\n\n  @keyframes brick-action-spinner-spin {\n    from {\n      transform: translate(-50%, -50%) rotate(0deg);\n    }\n\n    to {\n      transform: translate(-50%, -50%) rotate(360deg);\n    }\n  }\n\n  @keyframes brick-action-spinner-spin-rtl {\n    from {\n      transform: translate(50%, -50%) rotate(0deg);\n    }\n\n    to {\n      transform: translate(50%, -50%) rotate(360deg);\n    }\n  }\n}\n","@layer brick.components {\n  .brick-code {\n    --brick-code-foreground: var(--brick-color-text-primary);\n    --brick-code-background: var(--brick-color-surface-subtle);\n    --brick-code-border-color: var(--brick-color-border-subtle);\n    --brick-code-border-width: var(--brick-border-width);\n    --brick-code-radius: var(--brick-radius-subtle);\n    --brick-code-padding-block: 0.0625em;\n    --brick-code-padding-inline: 0.3em;\n    --brick-code-font-family: var(--brick-typography-code-inline-font-family);\n    --brick-code-font-size: var(--brick-typography-code-inline-font-size);\n    --brick-code-font-weight: var(--brick-typography-code-inline-font-weight);\n    --brick-code-line-height: var(--brick-typography-code-inline-line-height);\n    --brick-code-letter-spacing: var(--brick-typography-code-inline-letter-spacing);\n\n    box-decoration-break: clone;\n    padding: var(--brick-code-padding-block) var(--brick-code-padding-inline);\n    border: var(--brick-code-border-width) solid var(--brick-code-border-color);\n    border-radius: var(--brick-code-radius);\n    background: var(--brick-code-background);\n    color: var(--brick-code-foreground);\n    font-family: var(--brick-code-font-family);\n    font-size: var(--brick-code-font-size);\n    font-weight: var(--brick-code-font-weight);\n    letter-spacing: var(--brick-code-letter-spacing);\n    line-height: var(--brick-code-line-height);\n    overflow-wrap: anywhere;\n    white-space: normal;\n    -webkit-box-decoration-break: clone;\n  }\n\n  .brick-code[data-variant=\"plain\"] {\n    --brick-code-background: transparent;\n    --brick-code-border-width: 0rem;\n    --brick-code-padding-block: 0em;\n    --brick-code-padding-inline: 0em;\n  }\n\n  .brick-code[data-tone=\"inherit\"] { --brick-code-foreground: currentColor; }\n  .brick-code[data-size=\"sm\"] {\n    --brick-code-font-size: var(--brick-typography-body-sm-font-size);\n    --brick-code-line-height: var(--brick-typography-body-sm-line-height);\n  }\n  .brick-code[data-size=\"md\"] {\n    --brick-code-font-size: var(--brick-typography-body-md-font-size);\n    --brick-code-line-height: var(--brick-typography-body-md-line-height);\n  }\n\n  @media (forced-colors: active) {\n    .brick-code {\n      --brick-code-foreground: CanvasText;\n      --brick-code-background: Canvas;\n      --brick-code-border-color: CanvasText;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-code-block {\n    --brick-code-block-background: var(--brick-color-surface-subtle);\n    --brick-code-block-foreground: var(--brick-color-text-primary);\n    --brick-code-block-border-color: var(--brick-color-border-subtle);\n    --brick-code-block-border-width: 0rem;\n    --brick-code-block-radius: var(--brick-radius-surface);\n    --brick-code-block-header-padding: var(--brick-space-3) var(--brick-space-4);\n    --brick-code-block-content-padding: var(--brick-space-4);\n    --brick-code-block-gap: var(--brick-space-2);\n    --brick-code-block-font-family: var(--brick-typography-code-block-md-font-family);\n    --brick-code-block-font-size: var(--brick-typography-code-block-md-font-size);\n    --brick-code-block-font-weight: var(--brick-typography-code-block-md-font-weight);\n    --brick-code-block-line-height: var(--brick-typography-code-block-md-line-height);\n    --brick-code-block-letter-spacing: var(--brick-typography-code-block-md-letter-spacing);\n    --brick-code-block-selection-background: var(--brick-color-accent-surface);\n    --brick-code-block-selection-foreground: var(--brick-color-accent-text);\n\n    box-sizing: border-box;\n    min-inline-size: 0;\n    max-inline-size: 100%;\n    overflow: clip;\n    border: var(--brick-code-block-border-width) solid var(--brick-code-block-border-color);\n    border-radius: var(--brick-code-block-radius);\n    background: var(--brick-code-block-background);\n    color: var(--brick-code-block-foreground);\n  }\n\n  .brick-code-block[data-variant=\"bordered\"] {\n    --brick-code-block-background: var(--brick-color-surface-base);\n    --brick-code-block-border-width: var(--brick-border-width);\n  }\n\n  .brick-code-block[data-variant=\"plain\"] {\n    --brick-code-block-background: transparent;\n    --brick-code-block-radius: 0rem;\n  }\n\n  .brick-code-block[data-size=\"sm\"] {\n    --brick-code-block-header-padding: var(--brick-space-2) var(--brick-space-3);\n    --brick-code-block-content-padding: var(--brick-space-3);\n    --brick-code-block-font-family: var(--brick-typography-code-block-sm-font-family);\n    --brick-code-block-font-size: var(--brick-typography-code-block-sm-font-size);\n    --brick-code-block-font-weight: var(--brick-typography-code-block-sm-font-weight);\n    --brick-code-block-line-height: var(--brick-typography-code-block-sm-line-height);\n    --brick-code-block-letter-spacing: var(--brick-typography-code-block-sm-letter-spacing);\n  }\n\n  .brick-code-block-header {\n    display: flex;\n    align-items: center;\n    min-inline-size: 0;\n    gap: var(--brick-code-block-gap);\n    padding: var(--brick-code-block-header-padding);\n    border-block-end: var(--brick-border-width) solid var(--brick-code-block-border-color);\n  }\n\n  .brick-code-block-title {\n    min-inline-size: 0;\n    overflow: hidden;\n    color: var(--brick-color-text-primary);\n    font: var(--brick-font-weight-medium) var(--brick-typography-body-sm-font-size) / var(--brick-typography-body-sm-line-height) var(--brick-font-family-body);\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .brick-code-block-language {\n    color: var(--brick-color-text-secondary);\n    font: var(--brick-font-weight-medium) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-font-family-mono);\n  }\n\n  .brick-code-block-actions {\n    display: flex;\n    align-items: center;\n    gap: var(--brick-space-1);\n    margin-inline-start: auto;\n  }\n\n  .brick-code-block-scroll-area { max-inline-size: 100%; }\n\n  .brick-code-block-content {\n    max-inline-size: 100%;\n    padding: var(--brick-code-block-content-padding);\n  }\n\n  .brick-code-block-pre {\n    min-inline-size: max-content;\n    margin: 0;\n    -webkit-text-size-adjust: none;\n    text-size-adjust: none;\n    font-family: var(--brick-code-block-font-family);\n    font-size: var(--brick-code-block-font-size);\n    font-weight: var(--brick-code-block-font-weight);\n    letter-spacing: var(--brick-code-block-letter-spacing);\n    line-height: var(--brick-code-block-line-height);\n    tab-size: 2;\n    white-space: pre;\n  }\n\n  .brick-code-block-content[data-wrap=\"wrap\"] .brick-code-block-pre {\n    min-inline-size: 0;\n    white-space: pre-wrap;\n    overflow-wrap: anywhere;\n  }\n\n  .brick-code-block-pre > .brick-code {\n    font: inherit;\n    letter-spacing: inherit;\n    white-space: inherit;\n  }\n\n  .brick-code-block-pre ::selection {\n    background: var(--brick-code-block-selection-background);\n    color: var(--brick-code-block-selection-foreground);\n  }\n\n  .brick-code-block-copy-status {\n    display: block;\n    padding-inline: var(--brick-space-4);\n    color: var(--brick-color-text-secondary);\n    font: var(--brick-typography-caption-font-weight) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-typography-caption-font-family);\n  }\n\n  .brick-code-block-copy-status:not(:empty) { padding-block: var(--brick-space-2); }\n\n  @media (forced-colors: active) {\n    .brick-code-block {\n      --brick-code-block-background: Canvas;\n      --brick-code-block-foreground: CanvasText;\n      --brick-code-block-border-color: CanvasText;\n      --brick-code-block-border-width: var(--brick-border-width);\n      --brick-code-block-selection-background: Highlight;\n      --brick-code-block-selection-foreground: HighlightText;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-button {\n    --brick-button-background: var(--brick-button-tone-solid);\n    --brick-button-background-hover: var(--brick-button-tone-solid-hover);\n    --brick-button-background-pressed: var(--brick-button-tone-solid-pressed);\n    --brick-button-foreground: var(--brick-button-tone-on-solid);\n    --brick-button-border-color: var(--brick-button-background);\n    --brick-button-focus-ring: var(--brick-color-focus-ring);\n    --brick-button-min-block-size: var(--brick-control-min-block-size-md);\n    --brick-button-padding-block: 0.5rem;\n    --brick-button-padding-inline: 1rem;\n    --brick-button-gap: 0.5rem;\n    --brick-button-radius: var(--brick-radius-control);\n    --brick-button-font-family: var(--brick-typography-control-md-font-family);\n    --brick-button-font-size: var(--brick-typography-control-md-font-size);\n    --brick-button-font-weight: var(--brick-typography-control-md-font-weight);\n    --brick-button-line-height: var(--brick-typography-control-md-line-height);\n    --brick-button-letter-spacing: var(--brick-typography-control-md-letter-spacing);\n    --brick-button-icon-size: 1.125rem;\n    --brick-action-spinner-size: 1em;\n    --brick-action-spinner-color: var(\n      --brick-button-spinner-color,\n      var(--brick-button-foreground)\n    );\n\n    position: relative;\n    display: inline-flex;\n    box-sizing: border-box;\n    min-inline-size: 0;\n    max-inline-size: 100%;\n    min-block-size: var(--brick-button-min-block-size);\n    align-items: center;\n    justify-content: center;\n    gap: var(--brick-button-gap);\n    padding-block: var(--brick-button-padding-block);\n    padding-inline: var(--brick-button-padding-inline);\n    border: var(--brick-border-width) solid var(--brick-button-border-color);\n    border-radius: var(--brick-button-radius);\n    appearance: none;\n    background: var(--brick-button-background);\n    color: var(--brick-button-foreground);\n    font-family: var(--brick-button-font-family);\n    font-size: var(--brick-button-font-size);\n    font-weight: var(--brick-button-font-weight);\n    letter-spacing: var(--brick-button-letter-spacing);\n    line-height: var(--brick-button-line-height);\n    text-align: center;\n    text-decoration: none;\n    overflow-wrap: anywhere;\n    user-select: none;\n    vertical-align: middle;\n    transition:\n      background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n  }\n\n  .brick-button:not([data-disabled], [data-loading]) {\n    cursor: pointer;\n  }\n\n  .brick-button:focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-button-focus-ring);\n    outline-offset: var(--brick-border-focus-offset);\n  }\n\n  .brick-button:not([data-disabled], [data-loading]):active {\n    background: var(--brick-button-background-pressed);\n    border-color: var(--brick-button-background-pressed);\n  }\n\n  .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):active,\n  .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):active {\n    border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):active {\n    border-color: transparent;\n  }\n\n  .brick-button[data-disabled] {\n    border-color: var(--brick-color-border-default);\n    background: var(--brick-color-surface-subtle);\n    color: var(--brick-color-text-secondary);\n    cursor: not-allowed;\n  }\n\n  .brick-button[data-loading] {\n    cursor: progress;\n    color: transparent;\n  }\n\n  .brick-button[data-loading] > * {\n    opacity: 0;\n  }\n\n  .brick-button[data-disabled][data-loading] {\n    --brick-button-spinner-color: var(--brick-color-text-secondary);\n  }\n\n  .brick-button__content {\n    min-inline-size: 0;\n  }\n\n  .brick-button__icon {\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    justify-content: center;\n  }\n\n  .brick-button__icon > :where(svg, img) {\n    inline-size: var(--brick-button-icon-size);\n    block-size: var(--brick-button-icon-size);\n  }\n\n  .brick-button[data-full-width] {\n    inline-size: 100%;\n  }\n\n  .brick-button[data-shape=\"sharp\"] {\n    --brick-button-radius: 0;\n  }\n\n  .brick-button[data-shape=\"pill\"] {\n    --brick-button-radius: var(--brick-radius-full);\n  }\n\n  .brick-button[data-size=\"xs\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-xs);\n    --brick-button-padding-block: 0.25rem;\n    --brick-button-padding-inline: 0.625rem;\n    --brick-button-gap: 0.375rem;\n    --brick-button-font-size: var(--brick-typography-control-xs-font-size);\n    --brick-button-icon-size: 0.875rem;\n  }\n\n  .brick-button[data-size=\"sm\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-sm);\n    --brick-button-padding-block: 0.375rem;\n    --brick-button-padding-inline: 0.75rem;\n    --brick-button-gap: 0.375rem;\n    --brick-button-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-button-icon-size: 1rem;\n  }\n\n  .brick-button[data-size=\"lg\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-lg);\n    --brick-button-padding-block: 0.625rem;\n    --brick-button-padding-inline: 1.25rem;\n    --brick-button-gap: 0.625rem;\n    --brick-button-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-button-icon-size: 1.25rem;\n  }\n\n  .brick-button[data-size=\"xl\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-xl);\n    --brick-button-padding-block: 0.75rem;\n    --brick-button-padding-inline: 1.5rem;\n    --brick-button-gap: 0.75rem;\n    --brick-button-font-size: var(--brick-typography-control-xl-font-size);\n    --brick-button-icon-size: 1.5rem;\n  }\n\n  .brick-button[data-tone=\"neutral\"] {\n    --brick-button-tone-solid: var(--brick-color-text-primary);\n    --brick-button-tone-solid-hover: var(--brick-color-text-secondary);\n    --brick-button-tone-solid-pressed: color-mix(\n      in srgb,\n      var(--brick-color-text-primary),\n      var(--brick-color-text-secondary) 35%\n    );\n    --brick-button-tone-on-solid: var(--brick-color-text-inverse);\n    --brick-button-tone-soft: var(--brick-color-surface-subtle);\n    --brick-button-tone-soft-hover: var(--brick-color-surface-base);\n    --brick-button-tone-soft-pressed: var(--brick-color-border-subtle);\n    --brick-button-tone-on-soft: var(--brick-color-text-primary);\n    --brick-button-tone-border: var(--brick-color-border-strong);\n    --brick-button-tone-text: var(--brick-color-text-primary);\n  }\n\n  .brick-button[data-tone=\"accent\"] {\n    --brick-button-tone-solid: var(--brick-color-accent-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-accent-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-accent-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-accent-on-solid);\n    --brick-button-tone-soft: var(--brick-color-accent-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-accent-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-accent-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-accent-on-soft);\n    --brick-button-tone-border: var(--brick-color-accent-border);\n    --brick-button-tone-text: var(--brick-color-accent-text);\n  }\n\n  .brick-button[data-tone=\"info\"] {\n    --brick-button-tone-solid: var(--brick-color-info-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-info-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-info-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-info-on-solid);\n    --brick-button-tone-soft: var(--brick-color-info-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-info-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-info-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-info-on-soft);\n    --brick-button-tone-border: var(--brick-color-info-border);\n    --brick-button-tone-text: var(--brick-color-info-text);\n  }\n\n  .brick-button[data-tone=\"success\"] {\n    --brick-button-tone-solid: var(--brick-color-success-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-success-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-success-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-success-on-solid);\n    --brick-button-tone-soft: var(--brick-color-success-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-success-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-success-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-success-on-soft);\n    --brick-button-tone-border: var(--brick-color-success-border);\n    --brick-button-tone-text: var(--brick-color-success-text);\n  }\n\n  .brick-button[data-tone=\"warning\"] {\n    --brick-button-tone-solid: var(--brick-color-warning-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-warning-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-warning-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-warning-on-solid);\n    --brick-button-tone-soft: var(--brick-color-warning-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-warning-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-warning-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-warning-on-soft);\n    --brick-button-tone-border: var(--brick-color-warning-border);\n    --brick-button-tone-text: var(--brick-color-warning-text);\n  }\n\n  .brick-button[data-tone=\"danger\"] {\n    --brick-button-tone-solid: var(--brick-color-danger-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-danger-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-danger-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-danger-on-solid);\n    --brick-button-tone-soft: var(--brick-color-danger-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-danger-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-danger-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-danger-on-soft);\n    --brick-button-tone-border: var(--brick-color-danger-border);\n    --brick-button-tone-text: var(--brick-color-danger-text);\n  }\n\n  .brick-button[data-variant=\"soft\"] {\n    --brick-button-background: var(--brick-button-tone-soft);\n    --brick-button-background-hover: var(--brick-button-tone-soft-hover);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-pressed);\n    --brick-button-foreground: var(--brick-button-tone-on-soft);\n    --brick-button-border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"outline\"] {\n    --brick-button-background: transparent;\n    --brick-button-background-hover: var(--brick-button-tone-soft);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n    --brick-button-foreground: var(--brick-button-tone-text);\n    --brick-button-border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"ghost\"] {\n    --brick-button-background: transparent;\n    --brick-button-background-hover: var(--brick-button-tone-soft);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n    --brick-button-foreground: var(--brick-button-tone-text);\n    --brick-button-border-color: transparent;\n  }\n\n  @media (hover: hover) and (pointer: fine) {\n    .brick-button:not([data-disabled], [data-loading]):hover {\n      background: var(--brick-button-background-hover);\n      border-color: var(--brick-button-background-hover);\n    }\n\n    .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):hover,\n    .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):hover {\n      border-color: var(--brick-button-tone-border);\n    }\n\n    .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):hover {\n      border-color: transparent;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .brick-button {\n      transition-duration: 0ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    .brick-button {\n      border-color: ButtonText;\n      background: ButtonFace;\n      color: ButtonText;\n    }\n\n    .brick-button:focus-visible {\n      outline-color: Highlight;\n    }\n\n    .brick-button[data-disabled] {\n      border-color: GrayText;\n      color: GrayText;\n      opacity: 1;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-scroll-area {\n    --brick-scroll-area-scrollbar-thumb: var(--brick-color-border-strong);\n    --brick-scroll-area-scrollbar-track: transparent;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n  }\n\n  .brick-scroll-area-viewport {\n    box-sizing: border-box;\n    inline-size: 100%;\n    block-size: 100%;\n    min-inline-size: 0;\n    min-block-size: 0;\n    scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n    scrollbar-width: auto;\n  }\n\n  .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-x: hidden; overflow-y: auto; }\n  .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: auto; overflow-y: hidden; }\n  .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: auto; }\n\n  .brick-scroll-area[data-scrollbar-gutter=\"stable\"] > .brick-scroll-area-viewport { scrollbar-gutter: stable; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-y: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: transparent transparent; }\n  .brick-scroll-area[data-scrollbar-visibility=\"interaction\"]:is(:hover, :focus-within) > .brick-scroll-area-viewport {\n    scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n  }\n\n  .brick-scroll-area-viewport:focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n    outline-offset: calc(-1 * var(--brick-border-focus-width));\n  }\n\n  @media (forced-colors: active) {\n    .brick-scroll-area-viewport,\n    .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: auto; }\n    .brick-scroll-area-viewport:focus-visible { outline-color: Highlight; }\n  }\n}\n"],"names":[]}
+{"version":3,"sourceRoot":null,"mappings":"ACAA,sCAAA,wBCCE,+cAcA,4HAKA,uCACE,sFAKF,8BACE,qIAMF,iIAUA,mIE1CA,0tEAwDA,iEAIA,yJAKA,+JAKA,wMAKA,gGAIA,oLAOA,wDAKA,wCAIA,0GAIA,yCAIA,4FAOA,uHAKA,gDAIA,wDAIA,8EAIA,6SASA,0SASA,8SASA,0SASA,osBAiBA,gqBAaA,0oBAaA,2qBAaA,2qBAaA,gqBAaA,4VAQA,kUAQA,4SAQA,wCACE,0JAKA,sMAKA,gGAKF,uCACE,sCAKF,8BACE,6EAMA,oDAIA,6ED9SF,ixCA8BA,kKAOA,oEACA,gKAIA,gKAKA,8BACE,oHEhDF,2KAQA,6OAUA,4EACA,8EACA,iEAEA,qGACA,8HACA,gIACA,wHACA,8HACA,iNAIA,gLAKA,8BACE,uIAEA,mECvCF,0yCA2BA,iKAKA,+GAKA,2jBAUA,gPASA,qSASA,8NAKA,4GAOA,mDAEA,+FAKA,uZAcA,8HAMA,0FAMA,6IAKA,6SAOA,6EAEA,8BACE,+SL9HJ","sources":["home/runner/work/brick/brick/.brick-cache/production/code-block.source.css","home/runner/work/brick/brick/.brick-cache/production/../../src/styles/layers.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/_action-spinner/action-spinner.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code/code.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/button/button.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/scroll-area/scroll-area.css","home/runner/work/brick/brick/.brick-cache/production/../../src/components/code-block/code-block.css"],"sourcesContent":["@import \"../../src/styles/layers.css\";\n@import \"../../src/components/_action-spinner/action-spinner.css\";\n@import \"../../src/components/button/button.css\";\n@import \"../../src/components/code/code.css\";\n@import \"../../src/components/scroll-area/scroll-area.css\";\n@import \"../../src/components/code-block/code-block.css\";","@layer brick.tokens, brick.foundations, brick.components, brick.effects;\n","@layer brick.components {\n  :where(.brick-button, .brick-icon-button)[data-loading]::after {\n    position: absolute;\n    inset-block-start: 50%;\n    inset-inline-start: 50%;\n    inline-size: var(--brick-action-spinner-size);\n    block-size: var(--brick-action-spinner-size);\n    border: 0.125rem solid transparent;\n    border-block-start-color: var(--brick-action-spinner-color);\n    border-inline-end-color: var(--brick-action-spinner-color);\n    border-radius: var(--brick-radius-full);\n    content: \"\";\n    animation: brick-action-spinner-spin 700ms linear infinite;\n  }\n\n  :where([dir=\"rtl\"])\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n    animation-name: brick-action-spinner-spin-rtl;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n      animation-duration: 1400ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    :where(.brick-button, .brick-icon-button)[data-loading]::after {\n      border-block-start-color: ButtonText;\n      border-inline-end-color: ButtonText;\n    }\n  }\n\n  @keyframes brick-action-spinner-spin {\n    from {\n      transform: translate(-50%, -50%) rotate(0deg);\n    }\n\n    to {\n      transform: translate(-50%, -50%) rotate(360deg);\n    }\n  }\n\n  @keyframes brick-action-spinner-spin-rtl {\n    from {\n      transform: translate(50%, -50%) rotate(0deg);\n    }\n\n    to {\n      transform: translate(50%, -50%) rotate(360deg);\n    }\n  }\n}\n","@layer brick.components {\n  .brick-code {\n    --brick-code-foreground: var(--brick-color-text-primary);\n    --brick-code-background: var(--brick-color-surface-subtle);\n    --brick-code-border-color: var(--brick-color-border-subtle);\n    --brick-code-border-width: var(--brick-border-width);\n    --brick-code-radius: var(--brick-radius-subtle);\n    --brick-code-padding-block: 0.0625em;\n    --brick-code-padding-inline: 0.3em;\n    --brick-code-font-family: var(--brick-typography-code-inline-font-family);\n    --brick-code-font-size: var(--brick-typography-code-inline-font-size);\n    --brick-code-font-weight: var(--brick-typography-code-inline-font-weight);\n    --brick-code-line-height: var(--brick-typography-code-inline-line-height);\n    --brick-code-letter-spacing: var(--brick-typography-code-inline-letter-spacing);\n\n    box-decoration-break: clone;\n    padding: var(--brick-code-padding-block) var(--brick-code-padding-inline);\n    border: var(--brick-code-border-width) solid var(--brick-code-border-color);\n    border-radius: var(--brick-code-radius);\n    background: var(--brick-code-background);\n    color: var(--brick-code-foreground);\n    font-family: var(--brick-code-font-family);\n    font-size: var(--brick-code-font-size);\n    font-weight: var(--brick-code-font-weight);\n    letter-spacing: var(--brick-code-letter-spacing);\n    line-height: var(--brick-code-line-height);\n    overflow-wrap: anywhere;\n    white-space: normal;\n    -webkit-box-decoration-break: clone;\n  }\n\n  .brick-code[data-variant=\"plain\"] {\n    --brick-code-background: transparent;\n    --brick-code-border-width: 0rem;\n    --brick-code-padding-block: 0em;\n    --brick-code-padding-inline: 0em;\n  }\n\n  .brick-code[data-tone=\"inherit\"] { --brick-code-foreground: currentColor; }\n  .brick-code[data-size=\"sm\"] {\n    --brick-code-font-size: var(--brick-typography-body-sm-font-size);\n    --brick-code-line-height: var(--brick-typography-body-sm-line-height);\n  }\n  .brick-code[data-size=\"md\"] {\n    --brick-code-font-size: var(--brick-typography-body-md-font-size);\n    --brick-code-line-height: var(--brick-typography-body-md-line-height);\n  }\n\n  @media (forced-colors: active) {\n    .brick-code {\n      --brick-code-foreground: CanvasText;\n      --brick-code-background: Canvas;\n      --brick-code-border-color: CanvasText;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-button {\n    --brick-button-background: var(--brick-button-tone-solid);\n    --brick-button-background-hover: var(--brick-button-tone-solid-hover);\n    --brick-button-background-pressed: var(--brick-button-tone-solid-pressed);\n    --brick-button-foreground: var(--brick-button-tone-on-solid);\n    --brick-button-border-color: var(--brick-button-background);\n    --brick-button-focus-ring: var(--brick-color-focus-ring);\n    --brick-button-min-block-size: var(--brick-control-min-block-size-md);\n    --brick-button-padding-block: 0.5rem;\n    --brick-button-padding-inline: 1rem;\n    --brick-button-gap: 0.5rem;\n    --brick-button-radius: var(--brick-radius-control);\n    --brick-button-font-family: var(--brick-typography-control-md-font-family);\n    --brick-button-font-size: var(--brick-typography-control-md-font-size);\n    --brick-button-font-weight: var(--brick-typography-control-md-font-weight);\n    --brick-button-line-height: var(--brick-typography-control-md-line-height);\n    --brick-button-letter-spacing: var(--brick-typography-control-md-letter-spacing);\n    --brick-button-icon-size: 1.125rem;\n    --brick-action-spinner-size: 1em;\n    --brick-action-spinner-color: var(\n      --brick-button-spinner-color,\n      var(--brick-button-foreground)\n    );\n\n    position: relative;\n    display: inline-flex;\n    box-sizing: border-box;\n    min-inline-size: 0;\n    max-inline-size: 100%;\n    min-block-size: var(--brick-button-min-block-size);\n    align-items: center;\n    justify-content: center;\n    gap: var(--brick-button-gap);\n    padding-block: var(--brick-button-padding-block);\n    padding-inline: var(--brick-button-padding-inline);\n    border: var(--brick-border-width) solid var(--brick-button-border-color);\n    border-radius: var(--brick-button-radius);\n    appearance: none;\n    background: var(--brick-button-background);\n    color: var(--brick-button-foreground);\n    font-family: var(--brick-button-font-family);\n    font-size: var(--brick-button-font-size);\n    font-weight: var(--brick-button-font-weight);\n    letter-spacing: var(--brick-button-letter-spacing);\n    line-height: var(--brick-button-line-height);\n    text-align: center;\n    text-decoration: none;\n    overflow-wrap: anywhere;\n    user-select: none;\n    vertical-align: middle;\n    transition:\n      background-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      border-color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard),\n      color var(--brick-motion-duration-fast) var(--brick-motion-easing-standard);\n  }\n\n  .brick-button:not([data-disabled], [data-loading]) {\n    cursor: pointer;\n  }\n\n  .brick-button:focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-button-focus-ring);\n    outline-offset: var(--brick-border-focus-offset);\n  }\n\n  .brick-button:not([data-disabled], [data-loading]):active {\n    background: var(--brick-button-background-pressed);\n    border-color: var(--brick-button-background-pressed);\n  }\n\n  .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):active,\n  .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):active {\n    border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):active {\n    border-color: transparent;\n  }\n\n  .brick-button[data-disabled] {\n    border-color: var(--brick-color-border-default);\n    background: var(--brick-color-surface-subtle);\n    color: var(--brick-color-text-secondary);\n    cursor: not-allowed;\n  }\n\n  .brick-button[data-loading] {\n    cursor: progress;\n    color: transparent;\n  }\n\n  .brick-button[data-loading] > * {\n    opacity: 0;\n  }\n\n  .brick-button[data-disabled][data-loading] {\n    --brick-button-spinner-color: var(--brick-color-text-secondary);\n  }\n\n  .brick-button__content {\n    min-inline-size: 0;\n  }\n\n  .brick-button__icon {\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    justify-content: center;\n  }\n\n  .brick-button__icon > :where(svg, img) {\n    inline-size: var(--brick-button-icon-size);\n    block-size: var(--brick-button-icon-size);\n  }\n\n  .brick-button[data-full-width] {\n    inline-size: 100%;\n  }\n\n  .brick-button[data-shape=\"sharp\"] {\n    --brick-button-radius: 0;\n  }\n\n  .brick-button[data-shape=\"pill\"] {\n    --brick-button-radius: var(--brick-radius-full);\n  }\n\n  .brick-button[data-size=\"xs\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-xs);\n    --brick-button-padding-block: 0.25rem;\n    --brick-button-padding-inline: 0.625rem;\n    --brick-button-gap: 0.375rem;\n    --brick-button-font-size: var(--brick-typography-control-xs-font-size);\n    --brick-button-icon-size: 0.875rem;\n  }\n\n  .brick-button[data-size=\"sm\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-sm);\n    --brick-button-padding-block: 0.375rem;\n    --brick-button-padding-inline: 0.75rem;\n    --brick-button-gap: 0.375rem;\n    --brick-button-font-size: var(--brick-typography-control-sm-font-size);\n    --brick-button-icon-size: 1rem;\n  }\n\n  .brick-button[data-size=\"lg\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-lg);\n    --brick-button-padding-block: 0.625rem;\n    --brick-button-padding-inline: 1.25rem;\n    --brick-button-gap: 0.625rem;\n    --brick-button-font-size: var(--brick-typography-control-lg-font-size);\n    --brick-button-icon-size: 1.25rem;\n  }\n\n  .brick-button[data-size=\"xl\"] {\n    --brick-button-min-block-size: var(--brick-control-min-block-size-xl);\n    --brick-button-padding-block: 0.75rem;\n    --brick-button-padding-inline: 1.5rem;\n    --brick-button-gap: 0.75rem;\n    --brick-button-font-size: var(--brick-typography-control-xl-font-size);\n    --brick-button-icon-size: 1.5rem;\n  }\n\n  .brick-button[data-tone=\"neutral\"] {\n    --brick-button-tone-solid: var(--brick-color-text-primary);\n    --brick-button-tone-solid-hover: var(--brick-color-text-secondary);\n    --brick-button-tone-solid-pressed: color-mix(\n      in srgb,\n      var(--brick-color-text-primary),\n      var(--brick-color-text-secondary) 35%\n    );\n    --brick-button-tone-on-solid: var(--brick-color-text-inverse);\n    --brick-button-tone-soft: var(--brick-color-surface-subtle);\n    --brick-button-tone-soft-hover: var(--brick-color-surface-base);\n    --brick-button-tone-soft-pressed: var(--brick-color-border-subtle);\n    --brick-button-tone-on-soft: var(--brick-color-text-primary);\n    --brick-button-tone-border: var(--brick-color-border-strong);\n    --brick-button-tone-text: var(--brick-color-text-primary);\n  }\n\n  .brick-button[data-tone=\"accent\"] {\n    --brick-button-tone-solid: var(--brick-color-accent-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-accent-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-accent-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-accent-on-solid);\n    --brick-button-tone-soft: var(--brick-color-accent-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-accent-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-accent-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-accent-on-soft);\n    --brick-button-tone-border: var(--brick-color-accent-border);\n    --brick-button-tone-text: var(--brick-color-accent-text);\n  }\n\n  .brick-button[data-tone=\"info\"] {\n    --brick-button-tone-solid: var(--brick-color-info-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-info-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-info-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-info-on-solid);\n    --brick-button-tone-soft: var(--brick-color-info-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-info-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-info-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-info-on-soft);\n    --brick-button-tone-border: var(--brick-color-info-border);\n    --brick-button-tone-text: var(--brick-color-info-text);\n  }\n\n  .brick-button[data-tone=\"success\"] {\n    --brick-button-tone-solid: var(--brick-color-success-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-success-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-success-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-success-on-solid);\n    --brick-button-tone-soft: var(--brick-color-success-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-success-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-success-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-success-on-soft);\n    --brick-button-tone-border: var(--brick-color-success-border);\n    --brick-button-tone-text: var(--brick-color-success-text);\n  }\n\n  .brick-button[data-tone=\"warning\"] {\n    --brick-button-tone-solid: var(--brick-color-warning-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-warning-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-warning-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-warning-on-solid);\n    --brick-button-tone-soft: var(--brick-color-warning-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-warning-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-warning-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-warning-on-soft);\n    --brick-button-tone-border: var(--brick-color-warning-border);\n    --brick-button-tone-text: var(--brick-color-warning-text);\n  }\n\n  .brick-button[data-tone=\"danger\"] {\n    --brick-button-tone-solid: var(--brick-color-danger-solid);\n    --brick-button-tone-solid-hover: var(--brick-color-danger-solid-hover);\n    --brick-button-tone-solid-pressed: var(--brick-color-danger-solid-pressed);\n    --brick-button-tone-on-solid: var(--brick-color-danger-on-solid);\n    --brick-button-tone-soft: var(--brick-color-danger-soft);\n    --brick-button-tone-soft-hover: var(--brick-color-danger-soft-hover);\n    --brick-button-tone-soft-pressed: var(--brick-color-danger-soft-pressed);\n    --brick-button-tone-on-soft: var(--brick-color-danger-on-soft);\n    --brick-button-tone-border: var(--brick-color-danger-border);\n    --brick-button-tone-text: var(--brick-color-danger-text);\n  }\n\n  .brick-button[data-variant=\"soft\"] {\n    --brick-button-background: var(--brick-button-tone-soft);\n    --brick-button-background-hover: var(--brick-button-tone-soft-hover);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-pressed);\n    --brick-button-foreground: var(--brick-button-tone-on-soft);\n    --brick-button-border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"outline\"] {\n    --brick-button-background: transparent;\n    --brick-button-background-hover: var(--brick-button-tone-soft);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n    --brick-button-foreground: var(--brick-button-tone-text);\n    --brick-button-border-color: var(--brick-button-tone-border);\n  }\n\n  .brick-button[data-variant=\"ghost\"] {\n    --brick-button-background: transparent;\n    --brick-button-background-hover: var(--brick-button-tone-soft);\n    --brick-button-background-pressed: var(--brick-button-tone-soft-hover);\n    --brick-button-foreground: var(--brick-button-tone-text);\n    --brick-button-border-color: transparent;\n  }\n\n  @media (hover: hover) and (pointer: fine) {\n    .brick-button:not([data-disabled], [data-loading]):hover {\n      background: var(--brick-button-background-hover);\n      border-color: var(--brick-button-background-hover);\n    }\n\n    .brick-button[data-variant=\"soft\"]:not([data-disabled], [data-loading]):hover,\n    .brick-button[data-variant=\"outline\"]:not([data-disabled], [data-loading]):hover {\n      border-color: var(--brick-button-tone-border);\n    }\n\n    .brick-button[data-variant=\"ghost\"]:not([data-disabled], [data-loading]):hover {\n      border-color: transparent;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .brick-button {\n      transition-duration: 0ms;\n    }\n  }\n\n  @media (forced-colors: active) {\n    .brick-button {\n      border-color: ButtonText;\n      background: ButtonFace;\n      color: ButtonText;\n    }\n\n    .brick-button:focus-visible {\n      outline-color: Highlight;\n    }\n\n    .brick-button[data-disabled] {\n      border-color: GrayText;\n      color: GrayText;\n      opacity: 1;\n    }\n  }\n}\n","@layer brick.components {\n  .brick-scroll-area {\n    --brick-scroll-area-scrollbar-thumb: var(--brick-color-border-strong);\n    --brick-scroll-area-scrollbar-track: transparent;\n\n    min-inline-size: 0;\n    min-block-size: 0;\n  }\n\n  .brick-scroll-area-viewport {\n    box-sizing: border-box;\n    inline-size: 100%;\n    block-size: 100%;\n    min-inline-size: 0;\n    min-block-size: 0;\n    scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n    scrollbar-width: auto;\n  }\n\n  .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-x: hidden; overflow-y: auto; }\n  .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: auto; overflow-y: hidden; }\n  .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: auto; }\n\n  .brick-scroll-area[data-scrollbar-gutter=\"stable\"] > .brick-scroll-area-viewport { scrollbar-gutter: stable; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"vertical\"] { overflow-y: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"horizontal\"] { overflow-x: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"always\"] > .brick-scroll-area-viewport[data-orientation=\"both\"] { overflow: scroll; }\n  .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: transparent transparent; }\n  .brick-scroll-area[data-scrollbar-visibility=\"interaction\"]:is(:hover, :focus-within) > .brick-scroll-area-viewport {\n    scrollbar-color: var(--brick-scroll-area-scrollbar-thumb) var(--brick-scroll-area-scrollbar-track);\n  }\n\n  .brick-scroll-area-viewport:focus-visible {\n    outline: var(--brick-border-focus-width) solid var(--brick-color-focus-ring);\n    outline-offset: calc(-1 * var(--brick-border-focus-width));\n  }\n\n  @media (forced-colors: active) {\n    .brick-scroll-area-viewport,\n    .brick-scroll-area[data-scrollbar-visibility=\"interaction\"] > .brick-scroll-area-viewport { scrollbar-color: auto; }\n    .brick-scroll-area-viewport:focus-visible { outline-color: Highlight; }\n  }\n}\n","@layer brick.components {\n  .brick-code-block {\n    --brick-code-block-background: var(--brick-color-surface-subtle);\n    --brick-code-block-foreground: var(--brick-color-text-primary);\n    --brick-code-block-border-color: var(--brick-color-border-subtle);\n    --brick-code-block-border-width: 0rem;\n    --brick-code-block-radius: var(--brick-radius-surface);\n    --brick-code-block-header-padding: var(--brick-space-3) var(--brick-space-4);\n    --brick-code-block-content-padding: var(--brick-space-4);\n    --brick-code-block-gap: var(--brick-space-2);\n    --brick-code-block-font-family: var(--brick-typography-code-block-md-font-family);\n    --brick-code-block-font-size: var(--brick-typography-code-block-md-font-size);\n    --brick-code-block-font-weight: var(--brick-typography-code-block-md-font-weight);\n    --brick-code-block-line-height: var(--brick-typography-code-block-md-line-height);\n    --brick-code-block-letter-spacing: var(--brick-typography-code-block-md-letter-spacing);\n    --brick-code-block-selection-background: var(--brick-color-accent-surface);\n    --brick-code-block-selection-foreground: var(--brick-color-accent-text);\n\n    box-sizing: border-box;\n    min-inline-size: 0;\n    max-inline-size: 100%;\n    overflow: clip;\n    border: var(--brick-code-block-border-width) solid var(--brick-code-block-border-color);\n    border-radius: var(--brick-code-block-radius);\n    background: var(--brick-code-block-background);\n    color: var(--brick-code-block-foreground);\n  }\n\n  .brick-code-block[data-variant=\"bordered\"] {\n    --brick-code-block-background: var(--brick-color-surface-base);\n    --brick-code-block-border-width: var(--brick-border-width);\n  }\n\n  .brick-code-block[data-variant=\"plain\"] {\n    --brick-code-block-background: transparent;\n    --brick-code-block-radius: 0rem;\n  }\n\n  .brick-code-block[data-size=\"sm\"] {\n    --brick-code-block-header-padding: var(--brick-space-2) var(--brick-space-3);\n    --brick-code-block-content-padding: var(--brick-space-3);\n    --brick-code-block-font-family: var(--brick-typography-code-block-sm-font-family);\n    --brick-code-block-font-size: var(--brick-typography-code-block-sm-font-size);\n    --brick-code-block-font-weight: var(--brick-typography-code-block-sm-font-weight);\n    --brick-code-block-line-height: var(--brick-typography-code-block-sm-line-height);\n    --brick-code-block-letter-spacing: var(--brick-typography-code-block-sm-letter-spacing);\n  }\n\n  .brick-code-block-header {\n    display: flex;\n    align-items: center;\n    min-inline-size: 0;\n    gap: var(--brick-code-block-gap);\n    padding: var(--brick-code-block-header-padding);\n    border-block-end: var(--brick-border-width) solid var(--brick-code-block-border-color);\n  }\n\n  .brick-code-block-title {\n    min-inline-size: 0;\n    overflow: hidden;\n    color: var(--brick-color-text-primary);\n    font: var(--brick-font-weight-medium) var(--brick-typography-body-sm-font-size) / var(--brick-typography-body-sm-line-height) var(--brick-font-family-body);\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .brick-code-block-language {\n    color: var(--brick-color-text-secondary);\n    font: var(--brick-font-weight-medium) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-font-family-mono);\n  }\n\n  .brick-code-block-actions {\n    display: flex;\n    align-items: center;\n    gap: var(--brick-space-1);\n    margin-inline-start: auto;\n  }\n\n  .brick-code-block-scroll-area { max-inline-size: 100%; }\n\n  .brick-code-block-content {\n    max-inline-size: 100%;\n    padding: var(--brick-code-block-content-padding);\n  }\n\n  .brick-code-block-pre {\n    min-inline-size: max-content;\n    margin: 0;\n    -webkit-text-size-adjust: none;\n    text-size-adjust: none;\n    font-family: var(--brick-code-block-font-family);\n    font-size: var(--brick-code-block-font-size);\n    font-weight: var(--brick-code-block-font-weight);\n    letter-spacing: var(--brick-code-block-letter-spacing);\n    line-height: var(--brick-code-block-line-height);\n    tab-size: 2;\n    white-space: pre;\n  }\n\n  .brick-code-block-content[data-wrap=\"wrap\"] .brick-code-block-pre {\n    min-inline-size: 0;\n    white-space: pre-wrap;\n    overflow-wrap: anywhere;\n  }\n\n  .brick-code-block-pre > .brick-code {\n    font: inherit;\n    letter-spacing: inherit;\n    white-space: inherit;\n  }\n\n  .brick-code-block-pre ::selection {\n    background: var(--brick-code-block-selection-background);\n    color: var(--brick-code-block-selection-foreground);\n  }\n\n  .brick-code-block-copy-status {\n    display: block;\n    padding-inline: var(--brick-space-4);\n    color: var(--brick-color-text-secondary);\n    font: var(--brick-typography-caption-font-weight) var(--brick-typography-caption-font-size) / var(--brick-typography-caption-line-height) var(--brick-typography-caption-font-family);\n  }\n\n  .brick-code-block-copy-status:not(:empty) { padding-block: var(--brick-space-2); }\n\n  @media (forced-colors: active) {\n    .brick-code-block {\n      --brick-code-block-background: Canvas;\n      --brick-code-block-foreground: CanvasText;\n      --brick-code-block-border-color: CanvasText;\n      --brick-code-block-border-width: var(--brick-border-width);\n      --brick-code-block-selection-background: Highlight;\n      --brick-code-block-selection-foreground: HighlightText;\n    }\n  }\n}\n"],"names":[]}