mirror of
https://github.com/apache/superset.git
synced 2026-08-04 13:02:41 +00:00
feat(build): migrate from Prettier to Oxfmt for performant code formatting (#42434)
This commit is contained in:
Đỗ Trọng Hải
@@ -33,107 +33,90 @@ A navigation component for guiding users through multi-step workflows. Supports
|
||||
<StoryWithControls
|
||||
component="Steps"
|
||||
props={{
|
||||
direction: "horizontal",
|
||||
current: 1,
|
||||
labelPlacement: "horizontal",
|
||||
progressDot: false,
|
||||
size: "default",
|
||||
status: "process",
|
||||
type: "default",
|
||||
title: "Step 3",
|
||||
description: "Description 3",
|
||||
items: [
|
||||
{
|
||||
title: "Connect Database",
|
||||
description: "Configure the connection"
|
||||
},
|
||||
{
|
||||
title: "Create Dataset",
|
||||
description: "Select tables and columns"
|
||||
},
|
||||
{
|
||||
title: "Build Chart",
|
||||
description: "Choose visualization type"
|
||||
}
|
||||
]
|
||||
}}
|
||||
direction: 'horizontal',
|
||||
current: 1,
|
||||
labelPlacement: 'horizontal',
|
||||
progressDot: false,
|
||||
size: 'default',
|
||||
status: 'process',
|
||||
type: 'default',
|
||||
title: 'Step 3',
|
||||
description: 'Description 3',
|
||||
items: [
|
||||
{
|
||||
title: 'Connect Database',
|
||||
description: 'Configure the connection',
|
||||
},
|
||||
{
|
||||
title: 'Create Dataset',
|
||||
description: 'Select tables and columns',
|
||||
},
|
||||
{
|
||||
title: 'Build Chart',
|
||||
description: 'Choose visualization type',
|
||||
},
|
||||
],
|
||||
}}
|
||||
controls={[
|
||||
{
|
||||
name: "direction",
|
||||
label: "Direction",
|
||||
type: "select",
|
||||
options: [
|
||||
"horizontal",
|
||||
"vertical"
|
||||
],
|
||||
description: "Layout direction of the steps."
|
||||
},
|
||||
{
|
||||
name: "current",
|
||||
label: "Current",
|
||||
type: "number",
|
||||
description: "Index of the current step (zero-based)."
|
||||
},
|
||||
{
|
||||
name: "labelPlacement",
|
||||
label: "Label Placement",
|
||||
type: "select",
|
||||
options: [
|
||||
"horizontal",
|
||||
"vertical"
|
||||
],
|
||||
description: "Position of step labels relative to the step icon."
|
||||
},
|
||||
{
|
||||
name: "progressDot",
|
||||
label: "Progress Dot",
|
||||
type: "boolean",
|
||||
description: "Whether to use a dot style instead of numbered icons."
|
||||
},
|
||||
{
|
||||
name: "size",
|
||||
label: "Size",
|
||||
type: "select",
|
||||
options: [
|
||||
"default",
|
||||
"small"
|
||||
],
|
||||
description: "Size of the step icons and text."
|
||||
},
|
||||
{
|
||||
name: "status",
|
||||
label: "Status",
|
||||
type: "select",
|
||||
options: [
|
||||
"wait",
|
||||
"process",
|
||||
"finish",
|
||||
"error"
|
||||
],
|
||||
description: "Status of the current step."
|
||||
},
|
||||
{
|
||||
name: "type",
|
||||
label: "Type",
|
||||
type: "select",
|
||||
options: [
|
||||
"default",
|
||||
"navigation",
|
||||
"inline"
|
||||
],
|
||||
description: "Visual style: default numbered, navigation breadcrumb, or inline compact."
|
||||
},
|
||||
{
|
||||
name: "title",
|
||||
label: "Title",
|
||||
type: "text"
|
||||
},
|
||||
{
|
||||
name: "description",
|
||||
label: "Description",
|
||||
type: "text"
|
||||
}
|
||||
]}
|
||||
{
|
||||
name: 'direction',
|
||||
label: 'Direction',
|
||||
type: 'select',
|
||||
options: ['horizontal', 'vertical'],
|
||||
description: 'Layout direction of the steps.',
|
||||
},
|
||||
{
|
||||
name: 'current',
|
||||
label: 'Current',
|
||||
type: 'number',
|
||||
description: 'Index of the current step (zero-based).',
|
||||
},
|
||||
{
|
||||
name: 'labelPlacement',
|
||||
label: 'Label Placement',
|
||||
type: 'select',
|
||||
options: ['horizontal', 'vertical'],
|
||||
description: 'Position of step labels relative to the step icon.',
|
||||
},
|
||||
{
|
||||
name: 'progressDot',
|
||||
label: 'Progress Dot',
|
||||
type: 'boolean',
|
||||
description: 'Whether to use a dot style instead of numbered icons.',
|
||||
},
|
||||
{
|
||||
name: 'size',
|
||||
label: 'Size',
|
||||
type: 'select',
|
||||
options: ['default', 'small'],
|
||||
description: 'Size of the step icons and text.',
|
||||
},
|
||||
{
|
||||
name: 'status',
|
||||
label: 'Status',
|
||||
type: 'select',
|
||||
options: ['wait', 'process', 'finish', 'error'],
|
||||
description: 'Status of the current step.',
|
||||
},
|
||||
{
|
||||
name: 'type',
|
||||
label: 'Type',
|
||||
type: 'select',
|
||||
options: ['default', 'navigation', 'inline'],
|
||||
description:
|
||||
'Visual style: default numbered, navigation breadcrumb, or inline compact.',
|
||||
},
|
||||
{
|
||||
name: 'title',
|
||||
label: 'Title',
|
||||
type: 'text',
|
||||
},
|
||||
{
|
||||
name: 'description',
|
||||
label: 'Description',
|
||||
type: 'text',
|
||||
},
|
||||
]}
|
||||
/>
|
||||
|
||||
## Try It
|
||||
@@ -164,7 +147,10 @@ function VerticalSteps() {
|
||||
direction="vertical"
|
||||
current={1}
|
||||
items={[
|
||||
{ title: 'Upload CSV', description: 'Select a file from your computer' },
|
||||
{
|
||||
title: 'Upload CSV',
|
||||
description: 'Select a file from your computer',
|
||||
},
|
||||
{ title: 'Configure Columns', description: 'Set data types and names' },
|
||||
{ title: 'Review', description: 'Verify the data looks correct' },
|
||||
{ title: 'Import', description: 'Save the dataset' },
|
||||
@@ -231,11 +217,7 @@ function DotAndSmall() {
|
||||
<Steps
|
||||
size="small"
|
||||
current={2}
|
||||
items={[
|
||||
{ title: 'Login' },
|
||||
{ title: 'Verify' },
|
||||
{ title: 'Done' },
|
||||
]}
|
||||
items={[{ title: 'Login' }, { title: 'Verify' }, { title: 'Done' }]}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -245,18 +227,18 @@ function DotAndSmall() {
|
||||
|
||||
## Props
|
||||
|
||||
| Prop | Type | Default | Description |
|
||||
|------|------|---------|-------------|
|
||||
| `direction` | `string` | `"horizontal"` | Layout direction of the steps. |
|
||||
| `current` | `number` | `1` | Index of the current step (zero-based). |
|
||||
| `labelPlacement` | `string` | `"horizontal"` | Position of step labels relative to the step icon. |
|
||||
| `progressDot` | `boolean` | `false` | Whether to use a dot style instead of numbered icons. |
|
||||
| `size` | `string` | `"default"` | Size of the step icons and text. |
|
||||
| `status` | `string` | `"process"` | Status of the current step. |
|
||||
| `type` | `string` | `"default"` | Visual style: default numbered, navigation breadcrumb, or inline compact. |
|
||||
| `title` | `string` | `"Step 3"` | - |
|
||||
| `description` | `string` | `"Description 3"` | - |
|
||||
| `items` | `any` | `[{"title":"Connect Database","description":"Configure the connection"},{"title":"Create Dataset","description":"Select tables and columns"},{"title":"Build Chart","description":"Choose visualization type"}]` | - |
|
||||
| Prop | Type | Default | Description |
|
||||
| ---------------- | --------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------- |
|
||||
| `direction` | `string` | `"horizontal"` | Layout direction of the steps. |
|
||||
| `current` | `number` | `1` | Index of the current step (zero-based). |
|
||||
| `labelPlacement` | `string` | `"horizontal"` | Position of step labels relative to the step icon. |
|
||||
| `progressDot` | `boolean` | `false` | Whether to use a dot style instead of numbered icons. |
|
||||
| `size` | `string` | `"default"` | Size of the step icons and text. |
|
||||
| `status` | `string` | `"process"` | Status of the current step. |
|
||||
| `type` | `string` | `"default"` | Visual style: default numbered, navigation breadcrumb, or inline compact. |
|
||||
| `title` | `string` | `"Step 3"` | - |
|
||||
| `description` | `string` | `"Description 3"` | - |
|
||||
| `items` | `any` | `[{"title":"Connect Database","description":"Configure the connection"},{"title":"Create Dataset","description":"Select tables and columns"},{"title":"Build Chart","description":"Choose visualization type"}]` | - |
|
||||
|
||||
## Import
|
||||
|
||||
|
||||
Reference in New Issue
Block a user