This is an automated email from the ASF dual-hosted git repository.

rusackas pushed a commit to branch docs/federate-storybook
in repository https://gitbox.apache.org/repos/asf/superset.git


The following commit(s) were added to refs/heads/docs/federate-storybook by 
this push:
     new 7c2e3cc8a0 fix(docs): show both horizontal and vertical Divider 
examples
7c2e3cc8a0 is described below

commit 7c2e3cc8a0426d467a967b8234ce496802e8df8a
Author: Evan Rusackas <[email protected]>
AuthorDate: Tue Jan 20 19:33:53 2026 -0800

    fix(docs): show both horizontal and vertical Divider examples
    
    Vertical dividers need surrounding content to be visible (they're meant
    for inline separation). Instead of adding complex wrapper support,
    simplified the story to:
    - Show horizontal divider in interactive controls
    - Show both types in the liveExample with proper context
    
    Co-Authored-By: Claude Opus 4.5 <[email protected]>
---
 docs/developer_portal/components/ui/divider.mdx | 54 ++++++++++++-------------
 1 file changed, 27 insertions(+), 27 deletions(-)

diff --git a/docs/developer_portal/components/ui/divider.mdx 
b/docs/developer_portal/components/ui/divider.mdx
index f7abf1ee7a..5933e6d659 100644
--- a/docs/developer_portal/components/ui/divider.mdx
+++ b/docs/developer_portal/components/ui/divider.mdx
@@ -36,14 +36,14 @@ The Divider component from Superset's UI library.
   dashed: false,
   variant: "solid",
   orientation: "center",
-  plain: true,
-  type: "horizontal"
+  plain: true
 }}
   controls={[
   {
     name: "dashed",
     label: "Dashed",
-    type: "boolean"
+    type: "boolean",
+    description: "Whether line is dashed (deprecated, use variant)."
   },
   {
     name: "variant",
@@ -53,7 +53,8 @@ The Divider component from Superset's UI library.
       "dashed",
       "dotted",
       "solid"
-    ]
+    ],
+    description: "Line style of the divider."
   },
   {
     name: "orientation",
@@ -63,26 +64,20 @@ The Divider component from Superset's UI library.
       "left",
       "right",
       "center"
-    ]
+    ],
+    description: "Position of title inside divider."
   },
   {
     name: "plain",
     label: "Plain",
-    type: "boolean"
-  },
-  {
-    name: "type",
-    label: "Type",
-    type: "select",
-    options: [
-      "horizontal",
-      "vertical"
-    ]
+    type: "boolean",
+    description: "Use plain style without bold title."
   },
   {
     name: "orientationMargin",
     label: "Orientation Margin",
-    type: "text"
+    type: "text",
+    description: "Margin from divider edge to title."
   }
 ]}
 />
@@ -94,12 +89,18 @@ Edit the code below to experiment with the component:
 ```tsx live
 function Demo() {
   return (
-    <Divider
-      variant="solid"
-      orientation="center"
-      plain
-      type="horizontal"
-    />
+    <>
+      <p>Horizontal divider separates sections:</p>
+      <Divider />
+      <p>Vertical divider separates inline elements:</p>
+      <div style={{ display: 'flex', alignItems: 'center' }}>
+        <span>Link</span>
+        <Divider type="vertical" />
+        <span>Link</span>
+        <Divider type="vertical" />
+        <span>Link</span>
+      </div>
+    </>
   );
 }
 ```
@@ -108,11 +109,10 @@ function Demo() {
 
 | Prop | Type | Default | Description |
 |------|------|---------|-------------|
-| `dashed` | `boolean` | `false` | - |
-| `variant` | `string` | `"solid"` | - |
-| `orientation` | `string` | `"center"` | - |
-| `plain` | `boolean` | `true` | - |
-| `type` | `string` | `"horizontal"` | - |
+| `dashed` | `boolean` | `false` | Whether line is dashed (deprecated, use 
variant). |
+| `variant` | `string` | `"solid"` | Line style of the divider. |
+| `orientation` | `string` | `"center"` | Position of title inside divider. |
+| `plain` | `boolean` | `true` | Use plain style without bold title. |
 
 ## Import
 

Reply via email to