@gridui/grid 2.3.6 → 3.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -1
- package/dist/frame-footer/style.d.ts +3 -2
- package/dist/frame-header/style.d.ts +9 -0
- package/dist/frame-rail/style.d.ts +3 -2
- package/dist/frame-section/style.d.ts +9 -0
- package/dist/grid/grid.d.ts +1 -1
- package/dist/grid/style.d.ts +2 -2
- package/dist/grid-item/style.d.ts +3 -1
- package/dist/index.js +156 -46
- package/dist/index.js.map +4 -4
- package/dist/row/style.d.ts +6 -1
- package/dist/shared/chrome.d.ts +1 -0
- package/dist/shared/frame-style.d.ts +3 -3
- package/dist/stack/style.d.ts +3 -1
- package/dist/styles.css +129 -1
- package/docs/README.md +8 -387
- package/docs/catalog.json +37 -3
- package/docs/guides/dashboard-frame.md +91 -0
- package/docs/guides/grid.md +126 -0
- package/docs/guides/page-frame.md +137 -0
- package/docs/guides/split.md +49 -0
- package/docs/reference/README.md +21 -0
- package/docs/reference/container.md +63 -0
- package/docs/reference/dashboard-frame.md +99 -0
- package/docs/reference/frame-boundary.md +63 -0
- package/docs/reference/frame-footer.md +96 -0
- package/docs/reference/frame-header.md +84 -0
- package/docs/reference/frame-rail-group.md +70 -0
- package/docs/reference/frame-rail.md +63 -0
- package/docs/reference/frame-region-row.md +69 -0
- package/docs/reference/frame-region.md +69 -0
- package/docs/reference/frame-section.md +97 -0
- package/docs/reference/frame-sections.md +55 -0
- package/docs/reference/frame-texture.md +25 -0
- package/docs/reference/grid-item.md +79 -0
- package/docs/reference/grid.md +91 -0
- package/docs/reference/page-frame.md +89 -0
- package/docs/reference/row.md +93 -0
- package/docs/reference/split.md +75 -0
- package/docs/reference/stack.md +75 -0
- package/package.json +5 -6
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
|
|
2
|
+
# FrameHeader
|
|
3
|
+
|
|
4
|
+
Compose FrameHeader with SiteNavigation inside the same @gridui/grid component family.
|
|
5
|
+
|
|
6
|
+
Import from ``@gridui/grid`` and load Theme before this family's stylesheet.
|
|
7
|
+
|
|
8
|
+
```tsx
|
|
9
|
+
import { FrameHeader } from "@gridui/grid";
|
|
10
|
+
import "@gridui/theme/styles.css";
|
|
11
|
+
import "@gridui/grid/styles.css";
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/README.md) for shared behavior and stylesheet dependencies.
|
|
15
|
+
|
|
16
|
+
The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-landing/site-navigation/stories/site-navigation.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
|
|
17
|
+
|
|
18
|
+
## API
|
|
19
|
+
|
|
20
|
+
The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
|
|
21
|
+
|
|
22
|
+
### children
|
|
23
|
+
|
|
24
|
+
``ReactNode`` · Optional
|
|
25
|
+
|
|
26
|
+
Content rendered inside the component.
|
|
27
|
+
|
|
28
|
+
### onFocus
|
|
29
|
+
|
|
30
|
+
``(event: FocusEvent<HTMLElement, Element>): void`` · Optional
|
|
31
|
+
|
|
32
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
33
|
+
|
|
34
|
+
### onBlur
|
|
35
|
+
|
|
36
|
+
``(event: FocusEvent<HTMLElement, Element>): void`` · Optional
|
|
37
|
+
|
|
38
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
39
|
+
|
|
40
|
+
### onChange
|
|
41
|
+
|
|
42
|
+
``(event: ChangeEvent<HTMLElement, Element>): void`` · Optional
|
|
43
|
+
|
|
44
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
45
|
+
|
|
46
|
+
### onSubmit
|
|
47
|
+
|
|
48
|
+
``(event: SubmitEvent<HTMLElement>): void`` · Optional
|
|
49
|
+
|
|
50
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
51
|
+
|
|
52
|
+
### onClick
|
|
53
|
+
|
|
54
|
+
``(event: MouseEvent<HTMLElement, MouseEvent>): void`` · Optional
|
|
55
|
+
|
|
56
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
57
|
+
|
|
58
|
+
### padding
|
|
59
|
+
|
|
60
|
+
``Responsive<Space> | undefined`` · Optional
|
|
61
|
+
|
|
62
|
+
Default: ``{
|
|
63
|
+
base: 16,
|
|
64
|
+
sm: 24,
|
|
65
|
+
}``
|
|
66
|
+
|
|
67
|
+
### wrap
|
|
68
|
+
|
|
69
|
+
``boolean | undefined`` · Optional
|
|
70
|
+
|
|
71
|
+
Default: ``true``
|
|
72
|
+
|
|
73
|
+
### gap
|
|
74
|
+
|
|
75
|
+
``Space | undefined`` · Optional
|
|
76
|
+
|
|
77
|
+
Default: ``16``
|
|
78
|
+
|
|
79
|
+
### justify
|
|
80
|
+
|
|
81
|
+
``"start" | "between" | undefined`` · Optional
|
|
82
|
+
|
|
83
|
+
Default: ``"between"``
|
|
84
|
+
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
|
|
2
|
+
# FrameRailGroup
|
|
3
|
+
|
|
4
|
+
Compose FrameRailGroup with PageFrame inside the same @gridui/grid component family.
|
|
5
|
+
|
|
6
|
+
Import from ``@gridui/grid`` and load Theme before this family's stylesheet.
|
|
7
|
+
|
|
8
|
+
```tsx
|
|
9
|
+
import { FrameRailGroup } from "@gridui/grid";
|
|
10
|
+
import "@gridui/theme/styles.css";
|
|
11
|
+
import "@gridui/grid/styles.css";
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/README.md) for shared behavior and stylesheet dependencies.
|
|
15
|
+
|
|
16
|
+
The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/stories/page-frame.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
|
|
17
|
+
|
|
18
|
+
## API
|
|
19
|
+
|
|
20
|
+
The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
|
|
21
|
+
|
|
22
|
+
### children
|
|
23
|
+
|
|
24
|
+
``ReactNode`` · Optional
|
|
25
|
+
|
|
26
|
+
Content rendered inside the component.
|
|
27
|
+
|
|
28
|
+
### onFocus
|
|
29
|
+
|
|
30
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
31
|
+
|
|
32
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
33
|
+
|
|
34
|
+
### onBlur
|
|
35
|
+
|
|
36
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
37
|
+
|
|
38
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
39
|
+
|
|
40
|
+
### onChange
|
|
41
|
+
|
|
42
|
+
``(event: ChangeEvent<HTMLDivElement, Element>): void`` · Optional
|
|
43
|
+
|
|
44
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
45
|
+
|
|
46
|
+
### onSubmit
|
|
47
|
+
|
|
48
|
+
``(event: SubmitEvent<HTMLDivElement>): void`` · Optional
|
|
49
|
+
|
|
50
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
51
|
+
|
|
52
|
+
### onClick
|
|
53
|
+
|
|
54
|
+
``(event: MouseEvent<HTMLDivElement, MouseEvent>): void`` · Optional
|
|
55
|
+
|
|
56
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
57
|
+
|
|
58
|
+
### rail
|
|
59
|
+
|
|
60
|
+
``ReactNode`` · Optional
|
|
61
|
+
|
|
62
|
+
### railWidth
|
|
63
|
+
|
|
64
|
+
``Responsive<Space> | undefined`` · Optional
|
|
65
|
+
|
|
66
|
+
Default: ``{
|
|
67
|
+
base: 0,
|
|
68
|
+
sm: 32,
|
|
69
|
+
}``
|
|
70
|
+
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
|
|
2
|
+
# FrameRail
|
|
3
|
+
|
|
4
|
+
Compose FrameRail with PageFrame inside the same @gridui/grid component family.
|
|
5
|
+
|
|
6
|
+
Import from ``@gridui/grid`` and load Theme before this family's stylesheet.
|
|
7
|
+
|
|
8
|
+
```tsx
|
|
9
|
+
import { FrameRail } from "@gridui/grid";
|
|
10
|
+
import "@gridui/theme/styles.css";
|
|
11
|
+
import "@gridui/grid/styles.css";
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/README.md) for shared behavior and stylesheet dependencies.
|
|
15
|
+
|
|
16
|
+
The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/stories/page-frame.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
|
|
17
|
+
|
|
18
|
+
## API
|
|
19
|
+
|
|
20
|
+
The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
|
|
21
|
+
|
|
22
|
+
### children
|
|
23
|
+
|
|
24
|
+
``ReactNode`` · Optional
|
|
25
|
+
|
|
26
|
+
Content rendered inside the component.
|
|
27
|
+
|
|
28
|
+
### onFocus
|
|
29
|
+
|
|
30
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
31
|
+
|
|
32
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
33
|
+
|
|
34
|
+
### onBlur
|
|
35
|
+
|
|
36
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
37
|
+
|
|
38
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
39
|
+
|
|
40
|
+
### onChange
|
|
41
|
+
|
|
42
|
+
``(event: ChangeEvent<HTMLDivElement, Element>): void`` · Optional
|
|
43
|
+
|
|
44
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
45
|
+
|
|
46
|
+
### onSubmit
|
|
47
|
+
|
|
48
|
+
``(event: SubmitEvent<HTMLDivElement>): void`` · Optional
|
|
49
|
+
|
|
50
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
51
|
+
|
|
52
|
+
### onClick
|
|
53
|
+
|
|
54
|
+
``(event: MouseEvent<HTMLDivElement, MouseEvent>): void`` · Optional
|
|
55
|
+
|
|
56
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
57
|
+
|
|
58
|
+
### placement
|
|
59
|
+
|
|
60
|
+
``"start" | "sticky-bottom" | undefined`` · Optional
|
|
61
|
+
|
|
62
|
+
Default: ``"start"``
|
|
63
|
+
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
|
|
2
|
+
# FrameRegionRow
|
|
3
|
+
|
|
4
|
+
Compose FrameRegionRow with DashboardFrame inside the same @gridui/grid component family.
|
|
5
|
+
|
|
6
|
+
Import from ``@gridui/grid`` and load Theme before this family's stylesheet.
|
|
7
|
+
|
|
8
|
+
```tsx
|
|
9
|
+
import { FrameRegionRow } from "@gridui/grid";
|
|
10
|
+
import "@gridui/theme/styles.css";
|
|
11
|
+
import "@gridui/grid/styles.css";
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/README.md) for shared behavior and stylesheet dependencies.
|
|
15
|
+
|
|
16
|
+
The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/stories/dashboard-frame.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
|
|
17
|
+
|
|
18
|
+
## API
|
|
19
|
+
|
|
20
|
+
The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
|
|
21
|
+
|
|
22
|
+
### children
|
|
23
|
+
|
|
24
|
+
``ReactNode`` · Optional
|
|
25
|
+
|
|
26
|
+
Content rendered inside the component.
|
|
27
|
+
|
|
28
|
+
### onFocus
|
|
29
|
+
|
|
30
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
31
|
+
|
|
32
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
33
|
+
|
|
34
|
+
### onBlur
|
|
35
|
+
|
|
36
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
37
|
+
|
|
38
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
39
|
+
|
|
40
|
+
### onChange
|
|
41
|
+
|
|
42
|
+
``(event: ChangeEvent<HTMLDivElement, Element>): void`` · Optional
|
|
43
|
+
|
|
44
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
45
|
+
|
|
46
|
+
### onSubmit
|
|
47
|
+
|
|
48
|
+
``(event: SubmitEvent<HTMLDivElement>): void`` · Optional
|
|
49
|
+
|
|
50
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
51
|
+
|
|
52
|
+
### onClick
|
|
53
|
+
|
|
54
|
+
``(event: MouseEvent<HTMLDivElement, MouseEvent>): void`` · Optional
|
|
55
|
+
|
|
56
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
57
|
+
|
|
58
|
+
### asChild
|
|
59
|
+
|
|
60
|
+
``boolean | undefined`` · Optional
|
|
61
|
+
|
|
62
|
+
Default: ``false``
|
|
63
|
+
|
|
64
|
+
### contentInset
|
|
65
|
+
|
|
66
|
+
``string | number | undefined`` · Optional
|
|
67
|
+
|
|
68
|
+
Default: ``0``
|
|
69
|
+
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
|
|
2
|
+
# FrameRegion
|
|
3
|
+
|
|
4
|
+
Compose FrameRegion with DashboardFrame inside the same @gridui/grid component family.
|
|
5
|
+
|
|
6
|
+
Import from ``@gridui/grid`` and load Theme before this family's stylesheet.
|
|
7
|
+
|
|
8
|
+
```tsx
|
|
9
|
+
import { FrameRegion } from "@gridui/grid";
|
|
10
|
+
import "@gridui/theme/styles.css";
|
|
11
|
+
import "@gridui/grid/styles.css";
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/README.md) for shared behavior and stylesheet dependencies.
|
|
15
|
+
|
|
16
|
+
The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/stories/dashboard-frame.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
|
|
17
|
+
|
|
18
|
+
## API
|
|
19
|
+
|
|
20
|
+
The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
|
|
21
|
+
|
|
22
|
+
### children
|
|
23
|
+
|
|
24
|
+
``ReactNode`` · Optional
|
|
25
|
+
|
|
26
|
+
Content rendered inside the component.
|
|
27
|
+
|
|
28
|
+
### onFocus
|
|
29
|
+
|
|
30
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
31
|
+
|
|
32
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
33
|
+
|
|
34
|
+
### onBlur
|
|
35
|
+
|
|
36
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
37
|
+
|
|
38
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
39
|
+
|
|
40
|
+
### onChange
|
|
41
|
+
|
|
42
|
+
``(event: ChangeEvent<HTMLDivElement, Element>): void`` · Optional
|
|
43
|
+
|
|
44
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
45
|
+
|
|
46
|
+
### onSubmit
|
|
47
|
+
|
|
48
|
+
``(event: SubmitEvent<HTMLDivElement>): void`` · Optional
|
|
49
|
+
|
|
50
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
51
|
+
|
|
52
|
+
### onClick
|
|
53
|
+
|
|
54
|
+
``(event: MouseEvent<HTMLDivElement, MouseEvent>): void`` · Optional
|
|
55
|
+
|
|
56
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
57
|
+
|
|
58
|
+
### asChild
|
|
59
|
+
|
|
60
|
+
``boolean | undefined`` · Optional
|
|
61
|
+
|
|
62
|
+
Default: ``false``
|
|
63
|
+
|
|
64
|
+
### edge
|
|
65
|
+
|
|
66
|
+
``"none" | "right" | "left" | "both" | undefined`` · Optional
|
|
67
|
+
|
|
68
|
+
Default: ``"none"``
|
|
69
|
+
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
|
|
2
|
+
# FrameSection
|
|
3
|
+
|
|
4
|
+
Creates a section within the shared page frame and its boundary system. Use it to compose aligned page regions.
|
|
5
|
+
|
|
6
|
+
Import from ``@gridui/grid`` and load Theme before this family's stylesheet.
|
|
7
|
+
|
|
8
|
+
```tsx
|
|
9
|
+
import { FrameSection } from "@gridui/grid";
|
|
10
|
+
import "@gridui/theme/styles.css";
|
|
11
|
+
import "@gridui/grid/styles.css";
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/README.md) for shared behavior and stylesheet dependencies.
|
|
15
|
+
|
|
16
|
+
The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/stories/frame-section.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
|
|
17
|
+
|
|
18
|
+
## API
|
|
19
|
+
|
|
20
|
+
The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
|
|
21
|
+
|
|
22
|
+
### children
|
|
23
|
+
|
|
24
|
+
``ReactNode`` · Optional
|
|
25
|
+
|
|
26
|
+
Content rendered inside the component.
|
|
27
|
+
|
|
28
|
+
### onFocus
|
|
29
|
+
|
|
30
|
+
``(event: FocusEvent<HTMLElement, Element>): void`` · Optional
|
|
31
|
+
|
|
32
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
33
|
+
|
|
34
|
+
### onBlur
|
|
35
|
+
|
|
36
|
+
``(event: FocusEvent<HTMLElement, Element>): void`` · Optional
|
|
37
|
+
|
|
38
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
39
|
+
|
|
40
|
+
### onChange
|
|
41
|
+
|
|
42
|
+
``(event: ChangeEvent<HTMLElement, Element>): void`` · Optional
|
|
43
|
+
|
|
44
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
45
|
+
|
|
46
|
+
### onSubmit
|
|
47
|
+
|
|
48
|
+
``(event: SubmitEvent<HTMLElement>): void`` · Optional
|
|
49
|
+
|
|
50
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
51
|
+
|
|
52
|
+
### onClick
|
|
53
|
+
|
|
54
|
+
``(event: MouseEvent<HTMLElement, MouseEvent>): void`` · Optional
|
|
55
|
+
|
|
56
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
57
|
+
|
|
58
|
+
### boundary
|
|
59
|
+
|
|
60
|
+
``FrameBoundaryStyle | undefined`` · Optional
|
|
61
|
+
|
|
62
|
+
Default: ``"line"``
|
|
63
|
+
|
|
64
|
+
### tone
|
|
65
|
+
|
|
66
|
+
``FrameTone | undefined`` · Optional
|
|
67
|
+
|
|
68
|
+
Default: ``"neutral"``
|
|
69
|
+
|
|
70
|
+
### decoration
|
|
71
|
+
|
|
72
|
+
``FrameDecorationStyle | undefined`` · Optional
|
|
73
|
+
|
|
74
|
+
### texture
|
|
75
|
+
|
|
76
|
+
``FrameTextureStyle | undefined`` · Optional
|
|
77
|
+
|
|
78
|
+
Default: ``"none"``
|
|
79
|
+
|
|
80
|
+
### edges
|
|
81
|
+
|
|
82
|
+
``"none" | "frame" | undefined`` · Optional
|
|
83
|
+
|
|
84
|
+
Default: ``"frame"``
|
|
85
|
+
|
|
86
|
+
### paddingInline
|
|
87
|
+
|
|
88
|
+
``Responsive<Space> | undefined`` · Optional
|
|
89
|
+
|
|
90
|
+
Default: ``0``
|
|
91
|
+
|
|
92
|
+
### paddingBlock
|
|
93
|
+
|
|
94
|
+
``Responsive<Space> | undefined`` · Optional
|
|
95
|
+
|
|
96
|
+
Default: ``0``
|
|
97
|
+
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
|
|
2
|
+
# FrameSections
|
|
3
|
+
|
|
4
|
+
Public FrameSections component from @gridui/grid. See the package guide for its composition contract.
|
|
5
|
+
|
|
6
|
+
Import from ``@gridui/grid`` and load Theme before this family's stylesheet.
|
|
7
|
+
|
|
8
|
+
```tsx
|
|
9
|
+
import { FrameSections } from "@gridui/grid";
|
|
10
|
+
import "@gridui/theme/styles.css";
|
|
11
|
+
import "@gridui/grid/styles.css";
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/README.md) for shared behavior and stylesheet dependencies.
|
|
15
|
+
|
|
16
|
+
## API
|
|
17
|
+
|
|
18
|
+
The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
|
|
19
|
+
|
|
20
|
+
### children
|
|
21
|
+
|
|
22
|
+
``ReactNode`` · Optional
|
|
23
|
+
|
|
24
|
+
Content rendered inside the component.
|
|
25
|
+
|
|
26
|
+
### onFocus
|
|
27
|
+
|
|
28
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
29
|
+
|
|
30
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
31
|
+
|
|
32
|
+
### onBlur
|
|
33
|
+
|
|
34
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
35
|
+
|
|
36
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
37
|
+
|
|
38
|
+
### onChange
|
|
39
|
+
|
|
40
|
+
``(event: ChangeEvent<HTMLDivElement, Element>): void`` · Optional
|
|
41
|
+
|
|
42
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
43
|
+
|
|
44
|
+
### onSubmit
|
|
45
|
+
|
|
46
|
+
``(event: SubmitEvent<HTMLDivElement>): void`` · Optional
|
|
47
|
+
|
|
48
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
49
|
+
|
|
50
|
+
### onClick
|
|
51
|
+
|
|
52
|
+
``(event: MouseEvent<HTMLDivElement, MouseEvent>): void`` · Optional
|
|
53
|
+
|
|
54
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
55
|
+
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
|
|
2
|
+
# FrameTexture
|
|
3
|
+
|
|
4
|
+
Compose FrameTexture with PageFrame inside the same @gridui/grid component family.
|
|
5
|
+
|
|
6
|
+
Import from ``@gridui/grid`` and load Theme before this family's stylesheet.
|
|
7
|
+
|
|
8
|
+
```tsx
|
|
9
|
+
import { FrameTexture } from "@gridui/grid";
|
|
10
|
+
import "@gridui/theme/styles.css";
|
|
11
|
+
import "@gridui/grid/styles.css";
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/README.md) for shared behavior and stylesheet dependencies.
|
|
15
|
+
|
|
16
|
+
The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/stories/page-frame.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
|
|
17
|
+
|
|
18
|
+
## API
|
|
19
|
+
|
|
20
|
+
The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
|
|
21
|
+
|
|
22
|
+
### texture
|
|
23
|
+
|
|
24
|
+
``FrameTextureStyle`` · Required
|
|
25
|
+
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
<!-- Generated from public Props and owned stories. Run pnpm docs:storybook. -->
|
|
2
|
+
# GridItem
|
|
3
|
+
|
|
4
|
+
Compose GridItem with RadioGroup inside the same @gridui/grid component family.
|
|
5
|
+
|
|
6
|
+
Import from ``@gridui/grid`` and load Theme before this family's stylesheet.
|
|
7
|
+
|
|
8
|
+
```tsx
|
|
9
|
+
import { GridItem } from "@gridui/grid";
|
|
10
|
+
import "@gridui/theme/styles.css";
|
|
11
|
+
import "@gridui/grid/styles.css";
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
Read the [package contract](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-layout/grid/README.md) for shared behavior and stylesheet dependencies.
|
|
15
|
+
|
|
16
|
+
The [working composition](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-core/radio-group/stories/radio-group.stories.tsx) demonstrates required context, state, and related components. Use View code in Storybook to inspect the actual implementation.
|
|
17
|
+
|
|
18
|
+
## API
|
|
19
|
+
|
|
20
|
+
The public Props type is the source of these signatures. Defaults below are explicit implementation defaults; story presets are separate. Native attributes remain available through the exported Props type.
|
|
21
|
+
|
|
22
|
+
### children
|
|
23
|
+
|
|
24
|
+
``ReactNode`` · Optional
|
|
25
|
+
|
|
26
|
+
Content rendered inside the component.
|
|
27
|
+
|
|
28
|
+
### onFocus
|
|
29
|
+
|
|
30
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
31
|
+
|
|
32
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
33
|
+
|
|
34
|
+
### onBlur
|
|
35
|
+
|
|
36
|
+
``(event: FocusEvent<HTMLDivElement, Element>): void`` · Optional
|
|
37
|
+
|
|
38
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
39
|
+
|
|
40
|
+
### onChange
|
|
41
|
+
|
|
42
|
+
``(event: ChangeEvent<HTMLDivElement, Element>): void`` · Optional
|
|
43
|
+
|
|
44
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
45
|
+
|
|
46
|
+
### onSubmit
|
|
47
|
+
|
|
48
|
+
``(event: SubmitEvent<HTMLDivElement>): void`` · Optional
|
|
49
|
+
|
|
50
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
51
|
+
|
|
52
|
+
### onClick
|
|
53
|
+
|
|
54
|
+
``(event: MouseEvent<HTMLDivElement, MouseEvent>): void`` · Optional
|
|
55
|
+
|
|
56
|
+
Called when the corresponding interaction occurs; inspect the arguments in Actions.
|
|
57
|
+
|
|
58
|
+
### asChild
|
|
59
|
+
|
|
60
|
+
``boolean | undefined`` · Optional
|
|
61
|
+
|
|
62
|
+
Default: ``false``
|
|
63
|
+
|
|
64
|
+
### span
|
|
65
|
+
|
|
66
|
+
``Responsive<Span> | undefined`` · Optional
|
|
67
|
+
|
|
68
|
+
Default: ``1``
|
|
69
|
+
|
|
70
|
+
### padding
|
|
71
|
+
|
|
72
|
+
``Responsive<Space> | undefined`` · Optional
|
|
73
|
+
|
|
74
|
+
Default: ``0``
|
|
75
|
+
|
|
76
|
+
### align
|
|
77
|
+
|
|
78
|
+
``"center" | "end" | undefined`` · Optional
|
|
79
|
+
|