bestax-mcp 0.0.0

package/data/components/Level.json

@@ -0,0 +1,332 @@
+{
+  "name": "Level",
+  "kind": "component",
+  "category": "layout",
+  "slug": "layout/level",
+  "docsUrl": "https://bestax.io/docs/api/layout/level",
+  "examples": [
+    {
+      "title": "Default Level",
+      "code": "<Level>\n  <Level.Left>\n    <Level.Item>\n      <SubTitle as=\"p\" size=\"5\">\n        <Strong>Favorite Posts</Strong>\n      </SubTitle>\n    </Level.Item>\n    <Level.Item>\n      <Field hasAddons>\n        <Control>\n          <Input type=\"text\" placeholder=\"Find a post\" />\n        </Control>\n        <Control>\n          <Button>Search</Button>\n        </Control>\n      </Field>\n    </Level.Item>\n  </Level.Left>\n  <Level.Right>\n    <Level.Item as=\"p\">\n      <Strong>All</Strong>\n    </Level.Item>\n    <Level.Item as=\"p\">\n      <Link>Published</Link>\n    </Level.Item>\n    <Level.Item as=\"p\">\n      <Link>Drafts</Link>\n    </Level.Item>\n    <Level.Item as=\"p\">\n      <Link>Deleted</Link>\n    </Level.Item>\n    <Level.Item as=\"p\">\n      <Button color=\"success\" as=\"a\">\n        New\n      </Button>\n    </Level.Item>\n  </Level.Right>\n</Level>"
+    },
+    {
+      "title": "Centered Level (Statistics)",
+      "code": "<Level>\n  <Level.Item hasTextCentered>\n    <Block>\n      <Paragraph className=\"heading\">Posts</Paragraph>\n      <Title as=\"p\">1,234</Title>\n    </Block>\n  </Level.Item>\n  <Level.Item hasTextCentered>\n    <Block>\n      <Paragraph className=\"heading\">Following</Paragraph>\n      <Title as=\"p\">6789</Title>\n    </Block>\n  </Level.Item>\n  <Level.Item hasTextCentered>\n    <Block>\n      <Paragraph className=\"heading\">Followers</Paragraph>\n      <Title as=\"p\">123K</Title>\n    </Block>\n  </Level.Item>\n  <Level.Item hasTextCentered>\n    <Block>\n      <Paragraph className=\"heading\">Likes</Paragraph>\n      <Title as=\"p\">9876</Title>\n    </Block>\n  </Level.Item>\n</Level>"
+    },
+    {
+      "title": "Centered Level Menu",
+      "code": "<Level>\n  <Level.Item as=\"p\" hasTextCentered>\n    <Link textColor=\"info\">Getting Started</Link>\n  </Level.Item>\n  <Level.Item as=\"p\" hasTextCentered>\n    <Link textColor=\"info\">APIs</Link>\n  </Level.Item>\n  <Level.Item as=\"p\" hasTextCentered>\n    <img src=\"/img/bestax-type.svg\" alt=\"Bestax\" style={{ height: 30 }} />\n  </Level.Item>\n  <Level.Item as=\"p\" hasTextCentered>\n    <Link textColor=\"info\">Versions</Link>\n  </Level.Item>\n  <Level.Item as=\"p\" hasTextCentered>\n    <Link textColor=\"info\">FAQ</Link>\n  </Level.Item>\n</Level>"
+    },
+    {
+      "title": "Mobile Level",
+      "code": "<Level isMobile>\n  <Level.Item hasTextCentered>\n    <Block>\n      <Paragraph className=\"heading\">Posts</Paragraph>\n      <Title as=\"p\">1,234</Title>\n    </Block>\n  </Level.Item>\n  <Level.Item hasTextCentered>\n    <Block>\n      <Paragraph className=\"heading\">Following</Paragraph>\n      <Title as=\"p\">4567</Title>\n    </Block>\n  </Level.Item>\n  <Level.Item hasTextCentered>\n    <Block>\n      <Paragraph className=\"heading\">Followers</Paragraph>\n      <Title as=\"p\">123K</Title>\n    </Block>\n  </Level.Item>\n  <Level.Item hasTextCentered>\n    <Block>\n      <Paragraph className=\"heading\">Likes</Paragraph>\n      <Title as=\"p\">9876</Title>\n    </Block>\n  </Level.Item>\n</Level>"
+    },
+    {
+      "title": "Compound (dot-notation) usage",
+      "code": "<Level>\n  <Level.Left>\n    <Level.Item>\n      <Title as=\"p\" size=\"5\">\n        <strong>All Posts</strong>\n      </Title>\n    </Level.Item>\n  </Level.Left>\n  <Level.Right>\n    <Level.Item as=\"p\">\n      <a>Published</a>\n    </Level.Item>\n    <Level.Item as=\"p\">\n      <Button color=\"success\" as=\"a\">\n        New\n      </Button>\n    </Level.Item>\n  </Level.Right>\n</Level>"
+    }
+  ],
+  "accessibility": "- The root `Level` renders as a semantic `<nav>` for grouping and navigation.\n- Items can be rendered as `<div>`, `<p>`, or `<a>`. Use `as=\"a\"` for links, and provide clear text or accessible labels.\n- Use Bulma helper props for spacing and color to improve contrast and readability.\n\n:::note\nFor best accessibility, use semantic elements for headings/content within items, and ensure interactive elements (like `Button` or links) are focusable and labeled.\n:::",
+  "related": ["Button", "Field", "Input", "Title", "useBulmaClasses"],
+  "storybook": "https://bestax.io/storybook/?path=/story/layout-level--default",
+  "summary": "The `Level` component provides a flexible horizontal layout for your Bulma React UI, perfect for aligning items on the left and right, distributing items evenly, or centering statistics and controls.",
+  "import": "import { Level } from '@allxsmith/bestax-bulma';",
+  "sourceFile": "bulma-ui/src/layout/Level.tsx",
+  "rootClass": "level",
+  "parts": [
+    {
+      "path": "Level",
+      "summary": "The `Level` component provides a flexible horizontal layout for your Bulma React UI, perfect for aligning items on the left and right, distributing items evenly, or centering statistics and controls.",
+      "component": null,
+      "props": [
+        {
+          "name": "isMobile",
+          "type": "boolean",
+          "default": "false",
+          "description": "Keeps the level horizontal on mobile (Bulma `is-mobile`). Without it the level stacks vertically below tablet.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "color",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Bulma color modifier for the level.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "bgColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Bulma background color helper.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "textColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Bulma text color helper.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "default": null,
+          "description": "Additional CSS classes.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "default": null,
+          "description": "Level content (`Level.Left`, `Level.Right`, `Level.Item`).",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        }
+      ],
+      "extraProps": [],
+      "catchAll": "All standard HTML attributes and Bulma helper props",
+      "types": []
+    },
+    {
+      "path": "Level.Left",
+      "summary": "Left-aligned content.",
+      "component": null,
+      "props": [
+        {
+          "name": "color",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Bulma color modifier.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "bgColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Background color.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "textColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Text color.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "default": null,
+          "description": "Additional CSS classes.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "default": null,
+          "description": "Content.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        }
+      ],
+      "extraProps": [],
+      "catchAll": "All standard <div> attributes and Bulma helper props",
+      "types": []
+    },
+    {
+      "path": "Level.Right",
+      "summary": "Right-aligned content.",
+      "component": null,
+      "props": [
+        {
+          "name": "color",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Bulma color modifier.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "bgColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Background color.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "textColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Text color.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "default": null,
+          "description": "Additional CSS classes.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "default": null,
+          "description": "Content.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        }
+      ],
+      "extraProps": [],
+      "catchAll": "All standard <div> attributes and Bulma helper props",
+      "types": []
+    },
+    {
+      "path": "Level.Item",
+      "summary": "Individual item, can be rendered as `div`, `p`, or `a`.",
+      "component": null,
+      "props": [
+        {
+          "name": "as",
+          "type": "'div' | 'p' | 'a'",
+          "default": "'div'",
+          "description": "Element type to render.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "hasTextCentered",
+          "type": "boolean",
+          "default": "false",
+          "description": "Center the text in the item.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "color",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Bulma color modifier.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "bgColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Background color.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "textColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Text color.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "default": null,
+          "description": "Additional CSS classes.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "default": null,
+          "description": "Content.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "href",
+          "type": "string",
+          "default": null,
+          "description": "Href for \"a\" tag.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "target",
+          "type": "string",
+          "default": null,
+          "description": "Target for \"a\" tag",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "rel",
+          "type": "string",
+          "default": null,
+          "description": "Rel for \"a\" tag",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        }
+      ],
+      "extraProps": [],
+      "catchAll": "All standard <div> attributes and Bulma helper props",
+      "types": []
+    }
+  ],
+  "cssVars": [
+    {
+      "css": "--bulma-level-item-spacing",
+      "sass": "$level-item-spacing",
+      "default": "calc(var(--bulma-block-spacing) * 0.5)",
+      "scope": "component"
+    }
+  ]
+}

package/data/components/Link.json

@@ -0,0 +1,154 @@
+{
+  "name": "Link",
+  "kind": "component",
+  "category": "elements",
+  "slug": "elements/link",
+  "docsUrl": "https://bestax.io/docs/api/elements/link",
+  "examples": [
+    { "title": "Default Link", "code": "<Link href=\"#\">Default Link</Link>" },
+    {
+      "title": "Primary Color Link",
+      "code": "<Link href=\"#\" textColor=\"primary\">\n  Primary Link\n</Link>"
+    },
+    {
+      "title": "Danger Color Link",
+      "code": "<Link href=\"#\" textColor=\"danger\">\n  Danger Link\n</Link>"
+    },
+    {
+      "title": "Active Link",
+      "code": "<Link href=\"#\" isActive>\n  Active Link\n</Link>"
+    },
+    {
+      "title": "External Link",
+      "code": "<Link href=\"https://bulma.io\" target=\"_blank\" rel=\"noopener noreferrer\">\n  Open Bulma Docs\n</Link>"
+    },
+    {
+      "title": "Link That Looks Like a Button",
+      "code": "<Button as=\"a\" href=\"#\" color=\"primary\">\n  Button Link\n</Button>"
+    },
+    {
+      "title": "Polymorphic `as` (Router Links)",
+      "code": "import { Link as RouterLink } from 'react-router-dom';\nimport { Link } from '@allxsmith/bestax-bulma';\n\n<Link as={RouterLink} to=\"/about\" textColor=\"primary\">\n  About\n</Link>;"
+    },
+    {
+      "title": "Large Text Link",
+      "code": "<Link href=\"#\" textSize=\"3\">\n  Large Link\n</Link>"
+    },
+    {
+      "title": "Bold Link",
+      "code": "<Link href=\"#\" textWeight=\"bold\">\n  Bold Link\n</Link>"
+    },
+    {
+      "title": "All Colors",
+      "code": "<Block display=\"flex\" flexDirection=\"column\" gap=\"2\">\n  <Link href=\"#\" textColor=\"primary\">\n    Primary Link\n  </Link>\n  <Link href=\"#\" textColor=\"link\">\n    Link Color Link\n  </Link>\n  <Link href=\"#\" textColor=\"info\">\n    Info Link\n  </Link>\n  <Link href=\"#\" textColor=\"success\">\n    Success Link\n  </Link>\n  <Link href=\"#\" textColor=\"warning\">\n    Warning Link\n  </Link>\n  <Link href=\"#\" textColor=\"danger\">\n    Danger Link\n  </Link>\n</Block>"
+    },
+    {
+      "title": "Inline Link",
+      "code": "<Paragraph>\n  This is a paragraph with an <Link href=\"#\">inline link</Link> in the middle of\n  the text.\n</Paragraph>"
+    }
+  ],
+  "accessibility": "- **Descriptive Text:** Use meaningful link text that describes the destination, not generic text like \"click here\".\n- **External Links:** When opening links in new tabs, consider informing users (e.g., with an icon or text like \"opens in new tab\").\n- **Focus States:** Links inherit browser focus styles. Customize with CSS if needed.\n- **Keyboard Navigation:** Links are naturally keyboard accessible via Tab and Enter keys.\n\n:::info\nFor navigation menus, consider using the `isActive` prop to indicate the current page.\n:::\n\n:::warning Links Are for Navigation, Buttons Are for Actions\nPer [Section 508](https://www.section508.gov/) and [eslint-plugin-jsx-a11y](https://github.com/jsx-eslint/eslint-plugin-jsx-a11y) best practices, links (`<a>`) should navigate to a URL — not trigger an action via `onClick` alone. If your element performs an action (opening a modal, submitting data, toggling state, etc.) without navigating, use a [`Button`](./button.md) or [`LinkButton`](./linkbutton.md) instead. A `<Link href=\"#\" onClick={handleClick}>` is an anti-pattern that confuses screen readers and fails accessibility audits.\n:::",
+  "related": ["Button", "Paragraph", "useBulmaClasses"],
+  "storybook": "https://bestax.io/storybook/?path=/story/elements-link--default",
+  "summary": "The `Link` component renders a styled anchor (`<a>`) element with Bulma helper class integration.",
+  "import": "import { Link } from '@allxsmith/bestax-bulma';",
+  "sourceFile": "bulma-ui/src/elements/Link.tsx",
+  "rootClass": null,
+  "parts": [
+    {
+      "path": "Link",
+      "summary": "The `Link` component renders a styled anchor (`<a>`) element with Bulma helper class integration.",
+      "component": null,
+      "props": [
+        {
+          "name": "className",
+          "type": "string",
+          "default": null,
+          "description": "Additional CSS classes to apply.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "textColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Text color helper.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "bgColor",
+          "type": "Bulma color | 'inherit' | 'current'",
+          "default": null,
+          "description": "Background color helper.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false,
+          "valuesRef": "helpers/valid-values"
+        },
+        {
+          "name": "isActive",
+          "type": "boolean",
+          "default": "false",
+          "description": "Whether the link appears active.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "as",
+          "type": "React.ElementType",
+          "default": "'a'",
+          "description": "Render as a custom component (e.g. a router `Link`) instead of `<a>`. Defaults to `'a'`.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "default": null,
+          "description": "Content to render inside the link.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        }
+      ],
+      "extraProps": [
+        {
+          "name": "href",
+          "type": "string",
+          "default": null,
+          "description": "The URL the link points to.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "target",
+          "type": "'_self' | '_blank' | '_parent' | '_top'",
+          "default": null,
+          "description": "Where to open the linked document.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        },
+        {
+          "name": "rel",
+          "type": "string",
+          "default": null,
+          "description": "Relationship between current and linked document.",
+          "required": false,
+          "inherited": false,
+          "deprecated": false
+        }
+      ],
+      "catchAll": "All standard <a> attributes and Bulma helper props",
+      "types": []
+    }
+  ],
+  "cssVars": []
+}