@imfusion/web-ui 0.11.1-dev.33.gefbd75be → 0.11.1-dev.37.gdba3f9f4

package/src/docgen/doc.gen.json

@@ -8553,6 +8553,243 @@
       }
     ]
   },
+  "progress": {
+    "root": {
+      "name": "Progress.Root",
+      "description": "Progress.Root — completion of a running task, such as an upload or export.\n\n`value={null}` is indeterminate. Without a visible `Progress.Label`, name the bar with `aria-label`. Base UI hides\n`Progress.Value` from assistive tech, so custom Value text needs a matching `aria-valuetext`.",
+      "props": [
+        {
+          "name": "aria-valuetext",
+          "required": false,
+          "type": "string",
+          "defaultValue": null,
+          "description": "A string value that provides a user-friendly name for `aria-valuenow`, the current value of the progress bar."
+        },
+        {
+          "name": "className",
+          "required": false,
+          "type": "string | ((state: ProgressRootState) => string)",
+          "defaultValue": null,
+          "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
+        },
+        {
+          "name": "format",
+          "required": false,
+          "type": "NumberFormatOptions",
+          "defaultValue": null,
+          "description": "Options to format the value."
+        },
+        {
+          "name": "getAriaValueText",
+          "required": false,
+          "type": "(\n  formattedValue: string | null,\n  value: number | null\n) => string",
+          "defaultValue": null,
+          "description": "Accepts a function which returns a string value that provides a human-readable text alternative for the current value of the progress bar."
+        },
+        {
+          "name": "layout",
+          "required": false,
+          "type": "\"stacked\" | \"inline\" | null",
+          "defaultValue": "stacked",
+          "description": ""
+        },
+        {
+          "name": "locale",
+          "required": false,
+          "type": "LocalesArgument",
+          "defaultValue": null,
+          "description": "The locale used by `Intl.NumberFormat` when formatting the value.\nDefaults to the user's runtime locale."
+        },
+        {
+          "name": "max",
+          "required": false,
+          "type": "number",
+          "defaultValue": "100",
+          "description": "The maximum value."
+        },
+        {
+          "name": "min",
+          "required": false,
+          "type": "number",
+          "defaultValue": "0",
+          "description": "The minimum value."
+        },
+        {
+          "name": "ref",
+          "required": false,
+          "type": "Ref<HTMLDivElement>",
+          "defaultValue": null,
+          "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}"
+        },
+        {
+          "name": "render",
+          "required": false,
+          "type": "| ReactElement<\n    unknown,\n    string | JSXElementConstructor<any>\n  >\n| ComponentRenderFn<HTMLProps, ProgressRootState>",
+          "defaultValue": null,
+          "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
+        },
+        {
+          "name": "size",
+          "required": false,
+          "type": "\"xs\" | \"sm\" | \"md\" | \"lg\" | null",
+          "defaultValue": "md",
+          "description": ""
+        },
+        {
+          "name": "style",
+          "required": false,
+          "type": "| CSSProperties\n| ((state: ProgressRootState) => CSSProperties)",
+          "defaultValue": null,
+          "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
+        },
+        {
+          "name": "value",
+          "required": true,
+          "type": "number | null",
+          "defaultValue": "null",
+          "description": "The current value. The component is indeterminate when value is `null`."
+        }
+      ]
+    },
+    "subComponents": [
+      {
+        "name": "Progress.Indicator",
+        "description": "Progress.Indicator — filled portion of the track up to the value.",
+        "props": [
+          {
+            "name": "className",
+            "required": false,
+            "type": "| string\n| ((state: ProgressIndicatorState) => string)",
+            "defaultValue": null,
+            "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
+          },
+          {
+            "name": "ref",
+            "required": false,
+            "type": "Ref<HTMLDivElement>",
+            "defaultValue": null,
+            "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}"
+          },
+          {
+            "name": "render",
+            "required": false,
+            "type": "| ReactElement<\n    unknown,\n    string | JSXElementConstructor<any>\n  >\n| ComponentRenderFn<HTMLProps, ProgressIndicatorState>",
+            "defaultValue": null,
+            "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
+          },
+          {
+            "name": "style",
+            "required": false,
+            "type": "| CSSProperties\n| ((state: ProgressIndicatorState) => CSSProperties)",
+            "defaultValue": null,
+            "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
+          }
+        ]
+      },
+      {
+        "name": "Progress.Label",
+        "description": "Progress.Label — accessible label for the progress bar.",
+        "props": [
+          {
+            "name": "className",
+            "required": false,
+            "type": "string | ((state: ProgressLabelState) => string)",
+            "defaultValue": null,
+            "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
+          },
+          {
+            "name": "ref",
+            "required": false,
+            "type": "Ref<HTMLDivElement>",
+            "defaultValue": null,
+            "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}"
+          },
+          {
+            "name": "render",
+            "required": false,
+            "type": "| ReactElement<\n    unknown,\n    string | JSXElementConstructor<any>\n  >\n| ComponentRenderFn<HTMLProps, ProgressLabelState>",
+            "defaultValue": null,
+            "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
+          },
+          {
+            "name": "style",
+            "required": false,
+            "type": "| CSSProperties\n| ((state: ProgressLabelState) => CSSProperties)",
+            "defaultValue": null,
+            "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
+          }
+        ]
+      },
+      {
+        "name": "Progress.Track",
+        "description": "Progress.Track — the full range.",
+        "props": [
+          {
+            "name": "className",
+            "required": false,
+            "type": "string | ((state: ProgressTrackState) => string)",
+            "defaultValue": null,
+            "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
+          },
+          {
+            "name": "ref",
+            "required": false,
+            "type": "Ref<HTMLDivElement>",
+            "defaultValue": null,
+            "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}"
+          },
+          {
+            "name": "render",
+            "required": false,
+            "type": "| ReactElement<\n    unknown,\n    string | JSXElementConstructor<any>\n  >\n| ComponentRenderFn<HTMLProps, ProgressTrackState>",
+            "defaultValue": null,
+            "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
+          },
+          {
+            "name": "style",
+            "required": false,
+            "type": "| CSSProperties\n| ((state: ProgressTrackState) => CSSProperties)",
+            "defaultValue": null,
+            "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
+          }
+        ]
+      },
+      {
+        "name": "Progress.Value",
+        "description": "Progress.Value — formatted readout of the current value. Renders nothing while indeterminate.",
+        "props": [
+          {
+            "name": "className",
+            "required": false,
+            "type": "string | ((state: ProgressValueState) => string)",
+            "defaultValue": null,
+            "description": "CSS class applied to the element, or a function that\nreturns a class based on the component's state."
+          },
+          {
+            "name": "ref",
+            "required": false,
+            "type": "Ref<HTMLDivElement>",
+            "defaultValue": null,
+            "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}"
+          },
+          {
+            "name": "render",
+            "required": false,
+            "type": "| ReactElement<\n    unknown,\n    string | JSXElementConstructor<any>\n  >\n| ComponentRenderFn<HTMLProps, ProgressValueState>",
+            "defaultValue": null,
+            "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
+          },
+          {
+            "name": "style",
+            "required": false,
+            "type": "| CSSProperties\n| ((state: ProgressValueState) => CSSProperties)",
+            "defaultValue": null,
+            "description": "Style applied to the element, or a function that\nreturns a style object based on the component's state."
+          }
+        ]
+      }
+    ]
+  },
   "prose": {
     "root": {
       "name": "Prose",
@@ -10799,6 +11036,57 @@
       }
     ]
   },
+  "tab-nav": {
+    "root": {
+      "name": "TabNav.Root",
+      "description": "TabNav.Root — a `<nav>` of links that draws the hairline under its items. Give it an `aria-label` that names the\nnavigation, such as \"Project\".\nNot based on any upstream component.",
+      "props": [
+        {
+          "name": "aria-label",
+          "required": true,
+          "type": "string",
+          "defaultValue": null,
+          "description": "Names the navigation for screen readers, such as \"Project\"."
+        },
+        {
+          "name": "ref",
+          "required": false,
+          "type": "Ref<HTMLElement>",
+          "defaultValue": null,
+          "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}"
+        }
+      ]
+    },
+    "subComponents": [
+      {
+        "name": "TabNav.Item",
+        "description": "TabNav.Item — a link in the row. Renders an `<a>`; pass a router link as `render` to navigate without a page load.",
+        "props": [
+          {
+            "name": "current",
+            "required": false,
+            "type": "boolean",
+            "defaultValue": "false",
+            "description": "Marks the item as the page the user is on: sets `aria-current=\"page\"` and `data-current`, and draws the bar."
+          },
+          {
+            "name": "ref",
+            "required": false,
+            "type": "Ref<HTMLElement>",
+            "defaultValue": null,
+            "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}"
+          },
+          {
+            "name": "render",
+            "required": false,
+            "type": "| ReactElement<\n    unknown,\n    string | JSXElementConstructor<any>\n  >\n| ComponentRenderFn<HTMLProps, {}>",
+            "defaultValue": null,
+            "description": "Allows you to replace the component's HTML element\nwith a different tag, or compose it with another component.\n\nAccepts a `ReactElement` or a function that returns the element to render."
+          }
+        ]
+      }
+    ]
+  },
   "table": {
     "root": {
       "name": "Table.Root",
@@ -10987,6 +11275,13 @@
       "name": "Tabs.Root",
       "description": "Tabs.Root — container that manages the active tab value and orientation context.",
       "props": [
+        {
+          "name": "appearance",
+          "required": false,
+          "type": "TabsAppearance",
+          "defaultValue": "boxed",
+          "description": "`\"boxed\"` outlines the active tab in a box that fuses into a framed panel. `\"underline\"` marks it with a bar under\nits label on a hairline rule, with an unframed panel. Underline is horizontal only: a vertical Tabs stays boxed."
+        },
         {
           "name": "className",
           "required": false,
@@ -11048,7 +11343,7 @@
     "subComponents": [
       {
         "name": "Tabs.Indicator",
-        "description": "Tabs.Indicator — the bordered box marking the active tab, positioned via\nthe `--active-tab-*` CSS custom properties Base UI writes onto it. Render\nonce per Tabs.List, after the Tabs.Tab list.",
+        "description": "Tabs.Indicator — the bordered box (boxed) or bar (underline) marking the active tab, positioned via\nthe `--active-tab-*` CSS custom properties Base UI writes onto it. Render\nonce per Tabs.List, after the Tabs.Tab list.",
         "props": [
           {
             "name": "className",
@@ -11192,7 +11487,7 @@
       },
       {
         "name": "Tabs.PanelViewport",
-        "description": "Tabs.PanelViewport — the shared frame Tabs.Panel elements render inside.\nNo Base UI equivalent exists; it's surfaced as a named part since its\nhairline border is what Tabs.Indicator visually fuses into.",
+        "description": "Tabs.PanelViewport — the shared frame Tabs.Panel elements render inside.\nNo Base UI equivalent exists; it's surfaced as a named part since its\nhairline border is what the boxed Tabs.Indicator visually fuses into. The underline appearance draws no frame.",
         "props": [
           {
             "name": "ref",

package/src/llms/llms.gen.txt

@@ -181,6 +181,12 @@ Floating panel anchored to a trigger for contextual content, quick forms, or act
 - props: node_modules/@imfusion/web-ui/src/docgen/doc.gen.json -> .popover (jq: jq '.popover' node_modules/@imfusion/web-ui/src/docgen/doc.gen.json)
 - further reading (usage/anatomy, not props): https://base-ui.com/react/components/popover.md
 
+## Progress
+- category: Display, status: experimental
+Bar for the completion of a running task, such as an upload or export. Also called a progress bar. Indeterminate when the amount is unknown. Use Meter for a static measure within a range.
+- props: node_modules/@imfusion/web-ui/src/docgen/doc.gen.json -> .progress (jq: jq '.progress' node_modules/@imfusion/web-ui/src/docgen/doc.gen.json)
+- further reading (usage/anatomy, not props): https://base-ui.com/react/components/progress.md
+
 ## Prose
 - category: Layout, status: experimental
 Flow container that spaces long-form text and the blocks inside it. Also called an article or rich-text container. Use Stack or Row for UI layout.
@@ -241,6 +247,11 @@ Two-state control for an on/off setting that takes effect immediately. Also call
 - props: node_modules/@imfusion/web-ui/src/docgen/doc.gen.json -> .switch (jq: jq '.switch' node_modules/@imfusion/web-ui/src/docgen/doc.gen.json)
 - further reading (usage/anatomy, not props): https://base-ui.com/react/components/switch.md
 
+## TabNav
+- category: Display, status: experimental
+Row of links to routes with a bar under the current one, such as the sections of a project. Also called route tabs or link tabs; use Tabs to switch panels on one page.
+- props: node_modules/@imfusion/web-ui/src/docgen/doc.gen.json -> .tab-nav (jq: jq '.tab-nav' node_modules/@imfusion/web-ui/src/docgen/doc.gen.json)
+
 ## Table
 - category: Display, status: stable
 Presentational table parts for static tabular data. Pair them with a headless table library for sorting, pagination, or selection.
@@ -248,7 +259,7 @@ Presentational table parts for static tabular data. Pair them with a headless ta
 
 ## Tabs
 - category: Display, status: stable
-Switches between related panels within one view. Also called a tab strip or tab bar; it supports horizontal and vertical layouts.
+Switches between related panels within one view. Also called a tab strip or tab bar; it supports horizontal and vertical layouts and a boxed or underline look. Use TabNav for links to routes.
 - props: node_modules/@imfusion/web-ui/src/docgen/doc.gen.json -> .tabs (jq: jq '.tabs' node_modules/@imfusion/web-ui/src/docgen/doc.gen.json)
 - further reading (usage/anatomy, not props): https://base-ui.com/react/components/tabs.md