Skip to content
This repository was archived by the owner on Dec 9, 2024. It is now read-only.

Commit 17e1053

Browse files
committed
feat: add small fixes of components
1 parent ff7be3d commit 17e1053

File tree

13 files changed

+154
-184
lines changed

13 files changed

+154
-184
lines changed

docs/src/content/docs/components/display-code.mdx

Lines changed: 28 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -90,29 +90,32 @@ Renders code within your Buttonize app with syntax highlighting.
9090
<Fragment slot="type">string</Fragment>
9191
<Fragment slot="description">
9292
The programming language of the code for proper syntax highlighting.
93-
</Fragment>
94-
</PropDescription>
95-
<PropDescription>
96-
<Fragment slot="title">
97-
{/* keep-good-prettier-formatting */}
98-
### title
99-
</Fragment>
100-
<PropMarker slot="markers" type="optional" />
101-
<Fragment slot="type">string</Fragment>
102-
<Fragment slot="description">Optional title for the code block.</Fragment>
103-
</PropDescription>
104-
<PropDescription>
105-
<Fragment slot="title">
106-
{/* keep-good-prettier-formatting */}
107-
### frame
108-
</Fragment>
109-
<PropMarker slot="markers" type="optional" />
110-
<Fragment slot="type">'code' | 'terminal' | 'none' | 'auto'</Fragment>
111-
<Fragment slot="description">
112-
Frame type for the code block. Default is 'code'.
113-
</Fragment>
114-
</PropDescription>
115-
<SpacingProps />
116-
<SizingProps />
117-
</Fragment>
93+
94+
[List of all available languages.](https://github.com/shikijs/textmate-grammars-themes/blob/main/packages/tm-grammars/README.md)
95+
</Fragment>
96+
</PropDescription>
97+
<PropDescription>
98+
<Fragment slot="title">
99+
{/* keep-good-prettier-formatting */}
100+
### title
101+
</Fragment>
102+
<PropMarker slot="markers" type="optional" />
103+
<Fragment slot="type">string</Fragment>
104+
<Fragment slot="description">Optional title for the code block.</Fragment>
105+
</PropDescription>
106+
<PropDescription>
107+
<Fragment slot="title">
108+
{/* keep-good-prettier-formatting */}
109+
### frame
110+
</Fragment>
111+
<PropMarker slot="markers" type="optional" />
112+
<Fragment slot="type">'code' | 'terminal' | 'none' | 'auto'</Fragment>
113+
<Fragment slot="description">
114+
Frame type for the code block. Default is `'code'`.
115+
</Fragment>
116+
</PropDescription>
117+
<SpacingProps />
118+
<SizingProps />
119+
</Fragment>
120+
118121
</FrameworkContent>

docs/src/content/docs/components/display-grid.mdx

Lines changed: 29 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,33 @@ Displays the given components with the specified, grid-based layout.
8888

8989
<FrameworkContent>
9090
<Fragment slot="cdk">
91-
<SpacingProps />
92-
</Fragment>
91+
<PropDescription>
92+
<Fragment slot="title">
93+
{/* keep-good-prettier-formatting */}
94+
### columns[].body
95+
</Fragment>
96+
<PropMarker slot="markers" type="required" />
97+
<Fragment slot="type">IComponent[]</Fragment>
98+
<Fragment slot="description">
99+
Body of the grid column.
100+
</Fragment>
101+
</PropDescription>
102+
<PropDescription>
103+
<Fragment slot="title">
104+
{/* keep-good-prettier-formatting */}
105+
### columns[].size
106+
</Fragment>
107+
<PropMarker slot="markers" type="optional" />
108+
<Fragment slot="type">1 | 2 | 3 | 4</Fragment>
109+
<Fragment slot="description">
110+
Width of the grid column.
111+
112+
Total sum of all sizes must be less or equal `4`.
113+
114+
Default is `1`.
115+
</Fragment>
116+
</PropDescription>
117+
<SpacingProps />
118+
119+
</Fragment>
93120
</FrameworkContent>

docs/src/content/docs/components/display-heading.mdx

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ import SizingProps from '../../../components/SizingProps.mdx'
2424
Displays bold heading with large font size.
2525

2626
```ansi frame="none"
27-
[38;5;39mDisplay.heading[0m(text, props)
27+
[38;5;39mDisplay.heading[0m(label, props)
2828
```
2929

3030
## Usage
@@ -62,6 +62,15 @@ Displays bold heading with large font size.
6262

6363
<FrameworkContent>
6464
<Fragment slot="cdk">
65+
<PropDescription>
66+
<Fragment slot="title">
67+
{/* keep-good-prettier-formatting */}
68+
### label
69+
</Fragment>
70+
<PropMarker slot="markers" type="required" />
71+
<Fragment slot="type">string</Fragment>
72+
<Fragment slot="description">The displayed text.</Fragment>
73+
</PropDescription>
6574
<PropDescription>
6675
<Fragment slot="title">
6776
{/* keep-good-prettier-formatting */}
@@ -79,7 +88,7 @@ Displays bold heading with large font size.
7988
### level
8089
</Fragment>
8190
<PropMarker slot="markers" type="optional" />
82-
<Fragment slot="type">2 | 3 | 4</Fragment>
91+
<Fragment slot="type">1 | 2 | 3 | 4</Fragment>
8392
<Fragment slot="description">
8493
Level of the heading. Default level is `1`.
8594
</Fragment>

docs/src/content/docs/components/display-json.mdx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,15 @@ Renders JSON data within a Buttonize page.
6363

6464
<FrameworkContent>
6565
<Fragment slot="cdk">
66+
<PropDescription>
67+
<Fragment slot="title">
68+
{/* keep-good-prettier-formatting */}
69+
### json
70+
</Fragment>
71+
<PropMarker slot="markers" type="required" />
72+
<Fragment slot="type">object</Fragment>
73+
<Fragment slot="description">The object to display.</Fragment>
74+
</PropDescription>
6675
<SpacingProps />
6776
<SizingProps />
6877
</Fragment>

docs/src/content/docs/components/display-markdown.mdx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,7 @@ Displays content formatted with Markdown.
3838
name: 'Demo App'
3939
}).page('DemoPage', {
4040
body: [
41-
Display.markdown('# Hello, *World*!', {
42-
})
41+
Display.markdown('# Hello, *World*!')
4342
]
4443
})
4544
```
@@ -64,6 +63,15 @@ Displays content formatted with Markdown.
6463

6564
<FrameworkContent>
6665
<Fragment slot="cdk">
66+
<PropDescription>
67+
<Fragment slot="title">
68+
{/* keep-good-prettier-formatting */}
69+
### markdown
70+
</Fragment>
71+
<PropMarker slot="markers" type="required" />
72+
<Fragment slot="type">string</Fragment>
73+
<Fragment slot="description">The markdown content to display.</Fragment>
74+
</PropDescription>
6775
<SpacingProps />
6876
<SizingProps />
6977
</Fragment>

docs/src/content/docs/components/display-section.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ Preview
105105
<PropMarker slot="markers" type="optional" />
106106
<Fragment slot="type">boolean</Fragment>
107107
<Fragment slot="description">
108-
Optional: Initial collapsed state of the section. Default is `false`.
108+
Initial collapsed state of the section. Default is `false`.
109109
</Fragment>
110110
</PropDescription>
111111
<SpacingProps />

docs/src/content/docs/components/display-text.mdx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@ Shows plain text on a Buttonize page.
4949
## Preview
5050

5151
<ComponentDemo
52+
height={100}
5253
components={[
5354
{
5455
typeName: 'display.text',
@@ -63,6 +64,15 @@ Shows plain text on a Buttonize page.
6364

6465
<FrameworkContent>
6566
<Fragment slot="cdk">
67+
<PropDescription>
68+
<Fragment slot="title">
69+
{/* keep-good-prettier-formatting */}
70+
### label
71+
</Fragment>
72+
<PropMarker slot="markers" type="required" />
73+
<Fragment slot="type">string</Fragment>
74+
<Fragment slot="description">The displayed text.</Fragment>
75+
</PropDescription>
6676
<SpacingProps />
6777
<SizingProps />
6878
</Fragment>

docs/src/content/docs/components/display-video.mdx

Lines changed: 25 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -27,10 +27,6 @@ Displays a video within your Buttonize app.
2727
Display.video(url, props)
2828
```
2929

30-
The video link must be a valid value for the `src` attribute of an HTML `<video>` tag.
31-
32-
Embeddable YouTube video links and other such `<iframe>`-based links will not work.
33-
3430
## Usage
3531

3632
<FrameworkContent>
@@ -70,15 +66,31 @@ Embeddable YouTube video links and other such `<iframe>`-based links will not wo
7066
<PropDescription>
7167
<Fragment slot="title">
7268
{/* keep-good-prettier-formatting */}
73-
### muted
69+
### url
7470
</Fragment>
75-
<PropMarker slot="markers" type="optional" />
76-
<Fragment slot="type">boolean</Fragment>
71+
<PropMarker slot="markers" type="required" />
72+
<Fragment slot="type">string</Fragment>
7773
<Fragment slot="description">
78-
Initial muted state of the video. Default is `false`.
79-
</Fragment>
80-
</PropDescription>
81-
<SpacingProps />
82-
<SizingProps />
83-
</Fragment>
74+
The source URL of the video.
75+
76+
The video URL must be a valid value for the `src` attribute of an HTML [`<video>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video) tag.
77+
78+
Embeddable YouTube video links and other such `<iframe>`-based links will not work.
79+
</Fragment>
80+
</PropDescription>
81+
<PropDescription>
82+
<Fragment slot="title">
83+
{/* keep-good-prettier-formatting */}
84+
### muted
85+
</Fragment>
86+
<PropMarker slot="markers" type="optional" />
87+
<Fragment slot="type">boolean</Fragment>
88+
<Fragment slot="description">
89+
Initial muted state of the video. Default is `false`.
90+
</Fragment>
91+
</PropDescription>
92+
<SpacingProps />
93+
<SizingProps />
94+
</Fragment>
95+
8496
</FrameworkContent>

docs/src/content/docs/components/input-button.mdx

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -147,17 +147,26 @@ The buttons are not interactable in this example.
147147
<PropMarker slot="markers" type="required" />
148148
<Fragment slot="type">function</Fragment>
149149
<Fragment slot="description">
150-
The function to call when the user clicks the button.
150+
The [Action](/core-concepts/actions/#available-actions) to call when the user clicks the button.
151151
</Fragment>
152152
</PropDescription>
153153
<PropDescription>
154154
<Fragment slot="title">
155155
{/* keep-good-prettier-formatting */}
156-
### variant
156+
### kind
157157
</Fragment>
158158
<PropMarker slot="markers" type="optional" />
159-
<Fragment slot="type">"primary" | "secondary" | "tertiary"</Fragment>
160-
<Fragment slot="description">The color variant for the button.</Fragment>
159+
<Fragment slot="type">'primary' | 'secondary' | 'tertiary'</Fragment>
160+
<Fragment slot="description">A variant of the button. Default is `primary`.</Fragment>
161+
</PropDescription>
162+
<PropDescription>
163+
<Fragment slot="title">
164+
{/* keep-good-prettier-formatting */}
165+
### intent
166+
</Fragment>
167+
<PropMarker slot="markers" type="optional" />
168+
<Fragment slot="type">'default' | 'positive' | 'negative'</Fragment>
169+
<Fragment slot="description">An intent of the button. Default is `default`.</Fragment>
161170
</PropDescription>
162171
<PropDescription>
163172
<Fragment slot="title">
@@ -167,7 +176,7 @@ The buttons are not interactable in this example.
167176
<PropMarker slot="markers" type="optional" />
168177
<Fragment slot="type">boolean</Fragment>
169178
<Fragment slot="description">
170-
Whether or not the button can be interacted with.
179+
Whether or not the button can be interacted with. Default is `false`.
171180
</Fragment>
172181
</PropDescription>
173182
<PropDescription>
@@ -181,7 +190,7 @@ The buttons are not interactable in this example.
181190
A callback that will be invoked when the `onClick` function is finished
182191
executing.
183192

184-
This is also often used to redirect to the next page via `Action.buttonize.app.changePage`.
193+
This is also often used to redirect to the next page via `Action.buttonize.app.changePage(...)`.
185194
</Fragment>
186195
</PropDescription>
187196
<SpacingProps />

0 commit comments

Comments
 (0)