@flowstack-ui/brick 0.1.9 → 0.1.12

package/dist/agents/manifest.json

@@ -1,7 +1,7 @@
 {
   "schema": "flowstack.agent-manifest.v1",
   "package": "@flowstack-ui/brick",
-  "packageVersion": "0.1.9",
+  "packageVersion": "0.1.12",
   "components": [
     {
       "id": "accordion",
@@ -9,6 +9,12 @@
       "json": "./accordion.json",
       "markdown": "./accordion.md"
     },
+    {
+      "id": "alert-dialog",
+      "name": "AlertDialog",
+      "json": "./alert-dialog.json",
+      "markdown": "./alert-dialog.md"
+    },
     {
       "id": "app-bar",
       "name": "AppBar",
@@ -21,12 +27,42 @@
       "json": "./appearance.json",
       "markdown": "./appearance.md"
     },
+    {
+      "id": "aspect-ratio",
+      "name": "AspectRatio",
+      "json": "./aspect-ratio.json",
+      "markdown": "./aspect-ratio.md"
+    },
+    {
+      "id": "avatar",
+      "name": "Avatar",
+      "json": "./avatar.json",
+      "markdown": "./avatar.md"
+    },
     {
       "id": "badge",
       "name": "Badge",
       "json": "./badge.json",
       "markdown": "./badge.md"
     },
+    {
+      "id": "notification-badge",
+      "name": "NotificationBadge",
+      "json": "./notification-badge.json",
+      "markdown": "./notification-badge.md"
+    },
+    {
+      "id": "bleed",
+      "name": "Bleed",
+      "json": "./bleed.json",
+      "markdown": "./bleed.md"
+    },
+    {
+      "id": "blockquote",
+      "name": "Blockquote",
+      "json": "./blockquote.json",
+      "markdown": "./blockquote.md"
+    },
     {
       "id": "bottom-navigation",
       "name": "BottomNavigation",
@@ -57,24 +93,90 @@
       "json": "./carousel.json",
       "markdown": "./carousel.md"
     },
+    {
+      "id": "checkbox-group",
+      "name": "Checkbox Group",
+      "json": "./checkbox-group.json",
+      "markdown": "./checkbox-group.md"
+    },
     {
       "id": "checkbox",
       "name": "Checkbox",
       "json": "./checkbox.json",
       "markdown": "./checkbox.md"
     },
+    {
+      "id": "chip",
+      "name": "Chip",
+      "json": "./chip.json",
+      "markdown": "./chip.md"
+    },
+    {
+      "id": "code-block",
+      "name": "Code Block",
+      "json": "./code-block.json",
+      "markdown": "./code-block.md"
+    },
+    {
+      "id": "code",
+      "name": "Code",
+      "json": "./code.json",
+      "markdown": "./code.md"
+    },
     {
       "id": "collapsible",
       "name": "Collapsible",
       "json": "./collapsible.json",
       "markdown": "./collapsible.md"
     },
+    {
+      "id": "color-picker",
+      "name": "Color Picker",
+      "json": "./color-picker.json",
+      "markdown": "./color-picker.md"
+    },
+    {
+      "id": "color-swatch",
+      "name": "Color Swatch",
+      "json": "./color-swatch.json",
+      "markdown": "./color-swatch.md"
+    },
+    {
+      "id": "combobox",
+      "name": "Combobox",
+      "json": "./combobox.json",
+      "markdown": "./combobox.md"
+    },
     {
       "id": "container",
       "name": "Container",
       "json": "./container.json",
       "markdown": "./container.md"
     },
+    {
+      "id": "context-menu",
+      "name": "ContextMenu",
+      "json": "./context-menu.json",
+      "markdown": "./context-menu.md"
+    },
+    {
+      "id": "data-grid",
+      "name": "Data Grid",
+      "json": "./data-grid.json",
+      "markdown": "./data-grid.md"
+    },
+    {
+      "id": "data-list",
+      "name": "Data List",
+      "json": "./data-list.json",
+      "markdown": "./data-list.md"
+    },
+    {
+      "id": "dialog",
+      "name": "Dialog",
+      "json": "./dialog.json",
+      "markdown": "./dialog.md"
+    },
     {
       "id": "divider",
       "name": "Divider",
@@ -87,6 +189,24 @@
       "json": "./drawer.json",
       "markdown": "./drawer.md"
     },
+    {
+      "id": "dropdown-menu",
+      "name": "DropdownMenu",
+      "json": "./dropdown-menu.json",
+      "markdown": "./dropdown-menu.md"
+    },
+    {
+      "id": "em",
+      "name": "Em",
+      "json": "./em.json",
+      "markdown": "./em.md"
+    },
+    {
+      "id": "feed",
+      "name": "Feed",
+      "json": "./feed.json",
+      "markdown": "./feed.md"
+    },
     {
       "id": "field",
       "name": "Field",
@@ -99,6 +219,12 @@
       "json": "./fieldset.json",
       "markdown": "./fieldset.md"
     },
+    {
+      "id": "file-upload",
+      "name": "FileUpload",
+      "json": "./file-upload.json",
+      "markdown": "./file-upload.md"
+    },
     {
       "id": "form",
       "name": "Form",
@@ -117,12 +243,30 @@
       "json": "./grid.json",
       "markdown": "./grid.md"
     },
+    {
+      "id": "group",
+      "name": "Group",
+      "json": "./group.json",
+      "markdown": "./group.md"
+    },
     {
       "id": "hide",
       "name": "Hide",
       "json": "./hide.json",
       "markdown": "./hide.md"
     },
+    {
+      "id": "highlight",
+      "name": "Highlight",
+      "json": "./highlight.json",
+      "markdown": "./highlight.md"
+    },
+    {
+      "id": "hover-card",
+      "name": "HoverCard",
+      "json": "./hover-card.json",
+      "markdown": "./hover-card.md"
+    },
     {
       "id": "icon-button",
       "name": "IconButton",
@@ -147,6 +291,18 @@
       "json": "./input.json",
       "markdown": "./input.md"
     },
+    {
+      "id": "kbd",
+      "name": "Kbd",
+      "json": "./kbd.json",
+      "markdown": "./kbd.md"
+    },
+    {
+      "id": "link-box",
+      "name": "Link Box",
+      "json": "./link-box.json",
+      "markdown": "./link-box.md"
+    },
     {
       "id": "link",
       "name": "Link",
@@ -159,6 +315,24 @@
       "json": "./list.json",
       "markdown": "./list.md"
     },
+    {
+      "id": "mark",
+      "name": "Mark",
+      "json": "./mark.json",
+      "markdown": "./mark.md"
+    },
+    {
+      "id": "menubar",
+      "name": "Menubar",
+      "json": "./menubar.json",
+      "markdown": "./menubar.md"
+    },
+    {
+      "id": "multi-select",
+      "name": "MultiSelect",
+      "json": "./multi-select.json",
+      "markdown": "./multi-select.md"
+    },
     {
       "id": "nav-list",
       "name": "NavList",
@@ -171,12 +345,72 @@
       "json": "./navigation-menu.json",
       "markdown": "./navigation-menu.md"
     },
+    {
+      "id": "number-input",
+      "name": "NumberInput",
+      "json": "./number-input.json",
+      "markdown": "./number-input.md"
+    },
+    {
+      "id": "otp-field",
+      "name": "OTPField",
+      "json": "./otp-field.json",
+      "markdown": "./otp-field.md"
+    },
     {
       "id": "pagination",
       "name": "Pagination",
       "json": "./pagination.json",
       "markdown": "./pagination.md"
     },
+    {
+      "id": "password-toggle-field",
+      "name": "PasswordToggleField",
+      "json": "./password-toggle-field.json",
+      "markdown": "./password-toggle-field.md"
+    },
+    {
+      "id": "popover",
+      "name": "Popover",
+      "json": "./popover.json",
+      "markdown": "./popover.md"
+    },
+    {
+      "id": "progress-circle",
+      "name": "ProgressCircle",
+      "json": "./progress-circle.json",
+      "markdown": "./progress-circle.md"
+    },
+    {
+      "id": "progress",
+      "name": "Progress",
+      "json": "./progress.json",
+      "markdown": "./progress.md"
+    },
+    {
+      "id": "prose",
+      "name": "Prose",
+      "json": "./prose.json",
+      "markdown": "./prose.md"
+    },
+    {
+      "id": "radio-group",
+      "name": "RadioGroup",
+      "json": "./radio-group.json",
+      "markdown": "./radio-group.md"
+    },
+    {
+      "id": "rating",
+      "name": "Rating",
+      "json": "./rating.json",
+      "markdown": "./rating.md"
+    },
+    {
+      "id": "reorderable-list",
+      "name": "Reorderable List",
+      "json": "./reorderable-list.json",
+      "markdown": "./reorderable-list.md"
+    },
     {
       "id": "scroll-area",
       "name": "ScrollArea",
@@ -189,6 +423,18 @@
       "json": "./section.json",
       "markdown": "./section.md"
     },
+    {
+      "id": "segment-group",
+      "name": "SegmentGroup",
+      "json": "./segment-group.json",
+      "markdown": "./segment-group.md"
+    },
+    {
+      "id": "select",
+      "name": "Select",
+      "json": "./select.json",
+      "markdown": "./select.md"
+    },
     {
       "id": "show",
       "name": "Show",
@@ -201,24 +447,60 @@
       "json": "./sidebar.json",
       "markdown": "./sidebar.md"
     },
+    {
+      "id": "skeleton",
+      "name": "Skeleton",
+      "json": "./skeleton.json",
+      "markdown": "./skeleton.md"
+    },
     {
       "id": "skip-link",
       "name": "SkipLink",
       "json": "./skip-link.json",
       "markdown": "./skip-link.md"
     },
+    {
+      "id": "slider",
+      "name": "Slider",
+      "json": "./slider.json",
+      "markdown": "./slider.md"
+    },
     {
       "id": "stack",
       "name": "Stack",
       "json": "./stack.json",
       "markdown": "./stack.md"
     },
+    {
+      "id": "status",
+      "name": "Status",
+      "json": "./status.json",
+      "markdown": "./status.md"
+    },
     {
       "id": "surface",
       "name": "Surface",
       "json": "./surface.json",
       "markdown": "./surface.md"
     },
+    {
+      "id": "swipeable-item",
+      "name": "SwipeableItem",
+      "json": "./swipeable-item.json",
+      "markdown": "./swipeable-item.md"
+    },
+    {
+      "id": "switch",
+      "name": "Switch",
+      "json": "./switch.json",
+      "markdown": "./switch.md"
+    },
+    {
+      "id": "table",
+      "name": "Table",
+      "json": "./table.json",
+      "markdown": "./table.md"
+    },
     {
       "id": "tabs",
       "name": "Tabs",
@@ -237,12 +519,54 @@
       "json": "./textarea.json",
       "markdown": "./textarea.md"
     },
+    {
+      "id": "toast",
+      "name": "Toast",
+      "json": "./toast.json",
+      "markdown": "./toast.md"
+    },
+    {
+      "id": "toggle-group",
+      "name": "ToggleGroup",
+      "json": "./toggle-group.json",
+      "markdown": "./toggle-group.md"
+    },
+    {
+      "id": "toggle",
+      "name": "Toggle",
+      "json": "./toggle.json",
+      "markdown": "./toggle.md"
+    },
     {
       "id": "toolbar",
       "name": "Toolbar",
       "json": "./toolbar.json",
       "markdown": "./toolbar.md"
     },
+    {
+      "id": "tooltip",
+      "name": "Tooltip",
+      "json": "./tooltip.json",
+      "markdown": "./tooltip.md"
+    },
+    {
+      "id": "tree-grid",
+      "name": "TreeGrid",
+      "json": "./tree-grid.json",
+      "markdown": "./tree-grid.md"
+    },
+    {
+      "id": "tree",
+      "name": "Tree",
+      "json": "./tree.json",
+      "markdown": "./tree.md"
+    },
+    {
+      "id": "visually-hidden",
+      "name": "VisuallyHidden",
+      "json": "./visually-hidden.json",
+      "markdown": "./visually-hidden.md"
+    },
     {
       "id": "z-stack",
       "name": "ZStack",
@@ -263,5 +587,6 @@
       "json": "./layer-selection.json",
       "markdown": "./layer-selection.md"
     }
-  ]
+  ],
+  "coverage": "./coverage.json"
 }

package/dist/agents/mark.json

@@ -0,0 +1,56 @@
+{
+  "schema": "flowstack.agent-component.v1",
+  "id": "mark",
+  "name": "Mark",
+  "package": "@flowstack-ui/brick",
+  "layer": "brick",
+  "kind": "component",
+  "purpose": "Render a semantically marked static passage with restrained theme-aware Brick paint.",
+  "useWhen": [
+    "Authored content needs a static marked passage whose relevance is already known."
+  ],
+  "avoidWhen": [
+    {
+      "condition": "Text must be matched from a query.",
+      "useInstead": "Highlight"
+    },
+    {
+      "condition": "Text needs stress emphasis.",
+      "useInstead": "Em"
+    }
+  ],
+  "composition": [
+    "Keep Mark inside the surrounding Text, heading, link, or Prose content owner."
+  ],
+  "rules": [
+    {
+      "id": "mark-static",
+      "level": "must",
+      "statement": "Use Mark for authored static relevance; do not pass a query or implement search matching inside it."
+    },
+    {
+      "id": "mark-native",
+      "level": "must",
+      "statement": "Preserve the one native mark host and select only the documented variant and tone recipes."
+    },
+    {
+      "id": "mark-css",
+      "level": "must",
+      "statement": "Load styles.css or core.css plus mark.css."
+    }
+  ],
+  "commonMistakes": [
+    {
+      "mistake": "Mapping every search result manually through Mark.",
+      "correction": "Use Highlight when Atom-owned matching must segment text."
+    }
+  ],
+  "validation": [
+    "Confirm native mark semantics, normal selection and copy, inherited typography, readable contrast, wrapping, forced colors, zoom, RTL, and CSS delivery."
+  ],
+  "related": [
+    "em",
+    "text",
+    "interface-composition"
+  ]
+}

package/dist/agents/mark.md

@@ -0,0 +1,38 @@
+# Mark agent guide
+
+## Purpose
+
+Render a semantically marked static passage with restrained theme-aware Brick paint.
+
+## Use when
+
+- Authored content needs a static marked passage whose relevance is already known.
+
+## Choose something else when
+
+- Text must be matched from a query. Use Highlight.
+- Text needs stress emphasis. Use Em.
+
+## Required composition
+
+- Keep Mark inside the surrounding Text, heading, link, or Prose content owner.
+
+## Rules
+
+- **MUST:** Use Mark for authored static relevance; do not pass a query or implement search matching inside it.
+- **MUST:** Preserve the one native mark host and select only the documented variant and tone recipes.
+- **MUST:** Load styles.css or core.css plus mark.css.
+
+## Common mistakes
+
+- **Avoid:** Mapping every search result manually through Mark. **Instead:** Use Highlight when Atom-owned matching must segment text.
+
+## Validation checklist
+
+- Confirm native mark semantics, normal selection and copy, inherited typography, readable contrast, wrapping, forced colors, zoom, RTL, and CSS delivery.
+
+## Related guidance
+
+- `em`
+- `text`
+- `interface-composition`

package/dist/agents/menubar.json

@@ -0,0 +1,109 @@
+{
+  "schema": "flowstack.agent-component.v1",
+  "id": "menubar",
+  "name": "Menubar",
+  "package": "@flowstack-ui/brick",
+  "layer": "brick",
+  "kind": "component",
+  "purpose": "Present a finished persistent application command strip with coordinated top-level menus while Atom owns menubar semantics, roving focus, adjacent-menu handoff, and shared Menu behavior.",
+  "useWhen": [
+    "A desktop-like application has several persistent command categories such as File, Edit, and View that must behave as one keyboard menubar."
+  ],
+  "avoidWhen": [
+    {
+      "condition": "There is one temporary command menu, ordinary website navigation, a route list, or a toolbar of immediately executable controls.",
+      "useInstead": "DropdownMenu, NavigationMenu or NavList, or Toolbar"
+    },
+    {
+      "condition": "The application needs responsive mobile replacement or overflow orchestration.",
+      "useInstead": "An application-owned composition using DropdownMenu, Drawer, or another appropriate command surface"
+    }
+  ],
+  "composition": [
+    "Give Menubar.Root an accessible name and compose one or more uniquely valued Menubar.Menu scopes, each containing Menubar.Trigger and portalled Menubar.Content. Build Content from the shared command, selection, grouping, separator, static row, and paired submenu anatomy.",
+    "Root owns sm, md, or lg density and horizontal or vertical orientation; Content and SubContent inherit that density. Reproduce any local Appearance scope on each portalled visual root."
+  ],
+  "rules": [
+    {
+      "id": "menubar-application-commands",
+      "level": "must",
+      "statement": "Use Menubar only for persistent application command categories, not website navigation, page tabs, route-current state, or a responsive application shell."
+    },
+    {
+      "id": "menubar-root-name",
+      "level": "must",
+      "statement": "Give the role=menubar Root an accessible name and keep every top-level Trigger as its role=menuitem child with one Atom-owned roving tab stop."
+    },
+    {
+      "id": "menubar-menu-scope",
+      "level": "must",
+      "statement": "Give every top-level Menu a unique value and keep its Trigger and Content within that Menu scope so controlled value and adjacent-menu handoff remain deterministic."
+    },
+    {
+      "id": "menubar-orientation",
+      "level": "must",
+      "statement": "Match orientation to the visible Root arrangement and preserve direction-aware Arrow movement, Home/End, first and last item opening, adjacent handoff, and nested submenu keys in LTR and RTL."
+    },
+    {
+      "id": "menubar-shared-menu-contract",
+      "level": "must",
+      "statement": "Preserve uniquely valued item roles, real focus, typeahead, disabled navigation, checkbox and radio state, closeOnSelect, paired submenus, whole-root Tab exit, Escape restoration, and parent-modal ownership."
+    },
+    {
+      "id": "menubar-row-anatomy",
+      "level": "must",
+      "statement": "Use Leading, ItemLabel, Description, Shortcut, ItemIndicator, and tone=danger for their documented jobs; shortcuts are visual hints and Menubar does not register global commands."
+    },
+    {
+      "id": "menubar-responsive",
+      "level": "must",
+      "statement": "Do not automatically wrap, collapse, or change Menubar semantics at a breakpoint; applications own an explicit scrolling region or a separately selected mobile command surface."
+    },
+    {
+      "id": "menubar-theme-scope",
+      "level": "must",
+      "statement": "When Content leaves a local Appearance scope through Portal, reproduce that scope on the portalled visual root or target a container inside it."
+    },
+    {
+      "id": "menubar-css",
+      "level": "must",
+      "statement": "Load styles.css or core.css plus menubar.css and every composed child component stylesheet."
+    }
+  ],
+  "commonMistakes": [
+    {
+      "mistake": "Using Menubar as styled website navigation, omitting Root's name, duplicating top-level values, or implementing each heading as an independent dropdown.",
+      "correction": "Use Menubar only for application commands and preserve its named, uniquely valued, orientation-aware top-level ownership."
+    },
+    {
+      "mistake": "Hiding or collapsing the command strip at a Brick breakpoint or treating Shortcut text as registered keyboard behavior.",
+      "correction": "Let the application select a responsive alternative and keep shortcut execution in application code."
+    }
+  ],
+  "validation": [
+    "Verify Root naming and orientation, unique Menu values, one top-level tab stop, Home/End, horizontal and vertical Arrow movement, LTR and RTL, pointer and touch opening, keyboard first and last opening, hover switching, controlled active value, disabled triggers, and adjacent-menu focus ownership.",
+    "Verify shared item focus and typeahead, checkbox mixed and radio state, submenus, selection close policy, whole-root Tab exit, top-layer Escape, focus return, portals, parent-modal ownership, and asChild or render composition.",
+    "Verify three densities, persistent Root and open-trigger paint, constrained popup scrolling, danger meaning, narrow overflow policy, zoom, long localization, reduced motion, forced colors, portalled appearance, and complete CSS."
+  ],
+  "related": [
+    {
+      "kind": "package",
+      "package": "@flowstack-ui/atom",
+      "id": "menubar",
+      "versionPolicy": "installed-exact"
+    },
+    {
+      "kind": "package",
+      "package": "@flowstack-ui/atom",
+      "id": "menu",
+      "versionPolicy": "installed-exact"
+    },
+    "dropdown-menu",
+    "context-menu",
+    "navigation-menu",
+    "nav-list",
+    "toolbar",
+    "drawer",
+    "appearance"
+  ]
+}