@gridui/grid 2.3.0 → 2.3.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 +4 -4
- package/dist/index.js +31 -31
- package/dist/index.js.map +2 -2
- package/dist/styles.css +61 -70
- package/docs/README.md +398 -0
- package/package.json +4 -3
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Grid foundation
|
|
2
2
|
|
|
3
|
-
See the [usage handbook](
|
|
3
|
+
See the [usage handbook](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/docs/usage/README.md) and
|
|
4
4
|
[Grid contract](docs/README.md) for practical usage.
|
|
5
5
|
|
|
6
6
|
`@gridui/grid` owns Container, Grid, GridItem, Split, Stack, Row,
|
|
@@ -51,7 +51,7 @@ At a section seam, a non-neutral tone takes precedence over neutral; between
|
|
|
51
51
|
two non-neutral tones, the lower section supplies the color. The lower section
|
|
52
52
|
still draws the only separator. This works across React section groups without
|
|
53
53
|
changing either region's content palette. Astro host elements require an
|
|
54
|
-
[application-owned adapter](
|
|
54
|
+
[application-owned adapter](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/docs/usage/framework-adapters.md). The page filler uses
|
|
55
55
|
the final section's tone for its leading line.
|
|
56
56
|
Grid `frame="cells"` owns outer and cell edges; `frame="internal"` owns seams
|
|
57
57
|
inside an existing frame. Use `fillLastRow` with direct GridItem children to
|
|
@@ -85,11 +85,11 @@ Unit tests mirror these owners under `test/unit/primitives/` and
|
|
|
85
85
|
`test/unit/frame/`. Tests can combine public primitives to protect their
|
|
86
86
|
collaboration. Keep ordinary presentation in the owner's CVA `style.ts`. Retain
|
|
87
87
|
track resolution, seams, and decorative geometry in colocated CSS imported by
|
|
88
|
-
the root stylesheet. See the [source conventions](
|
|
88
|
+
the root stylesheet. See the [source conventions](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/docs/development/typescript-conventions.md#component-directories).
|
|
89
89
|
Consumers use the package root and explicit stylesheet export; internal file
|
|
90
90
|
paths are private.
|
|
91
91
|
|
|
92
|
-
See [quarterly release history](.changeset/history
|
|
92
|
+
See [quarterly release history](https://github.com/sudo-ui/GridUI-React-Monorepo/tree/main/packages-layout/grid/.changeset/history) for prepared release notes and consumption records.
|
|
93
93
|
|
|
94
94
|
`DashboardFrame` supplies full-height workspace gutters and structural edges without
|
|
95
95
|
creating a main landmark. See [dashboard frames](docs/README.md#dashboard-frames).
|
package/dist/index.js
CHANGED
|
@@ -70,28 +70,28 @@ import { cva as cva2 } from "class-variance-authority";
|
|
|
70
70
|
var dashboardFrameVariants = cva2("gridui-dashboard-frame", {
|
|
71
71
|
variants: {
|
|
72
72
|
startSize: {
|
|
73
|
-
none: "[--gridui-dashboard-start:0px] [--gridui-dashboard-start-minimum:0px]",
|
|
74
|
-
small: "[--gridui-dashboard-start:var(--gridui-space-8)]",
|
|
75
|
-
medium: "[--gridui-dashboard-start:var(--gridui-space-16)]",
|
|
76
|
-
large: "[--gridui-dashboard-start:var(--gridui-space-24)]"
|
|
73
|
+
none: "gridui-u-[--gridui-dashboard-start:0px] gridui-u-[--gridui-dashboard-start-minimum:0px]",
|
|
74
|
+
small: "gridui-u-[--gridui-dashboard-start:var(--gridui-space-8)]",
|
|
75
|
+
medium: "gridui-u-[--gridui-dashboard-start:var(--gridui-space-16)]",
|
|
76
|
+
large: "gridui-u-[--gridui-dashboard-start:var(--gridui-space-24)]"
|
|
77
77
|
},
|
|
78
78
|
endSize: {
|
|
79
|
-
none: "[--gridui-dashboard-end:0px] [--gridui-dashboard-end-minimum:0px]",
|
|
80
|
-
small: "[--gridui-dashboard-end:var(--gridui-space-8)]",
|
|
81
|
-
medium: "[--gridui-dashboard-end:var(--gridui-space-16)]",
|
|
82
|
-
large: "[--gridui-dashboard-end:var(--gridui-space-24)]"
|
|
79
|
+
none: "gridui-u-[--gridui-dashboard-end:0px] gridui-u-[--gridui-dashboard-end-minimum:0px]",
|
|
80
|
+
small: "gridui-u-[--gridui-dashboard-end:var(--gridui-space-8)]",
|
|
81
|
+
medium: "gridui-u-[--gridui-dashboard-end:var(--gridui-space-16)]",
|
|
82
|
+
large: "gridui-u-[--gridui-dashboard-end:var(--gridui-space-24)]"
|
|
83
83
|
},
|
|
84
84
|
compactStartSize: {
|
|
85
|
-
none: "[--gridui-dashboard-compact-start:0px] [--gridui-dashboard-compact-start-minimum:0px]",
|
|
86
|
-
small: "[--gridui-dashboard-compact-start:var(--gridui-space-8)]",
|
|
87
|
-
medium: "[--gridui-dashboard-compact-start:var(--gridui-space-16)]",
|
|
88
|
-
large: "[--gridui-dashboard-compact-start:var(--gridui-space-24)]"
|
|
85
|
+
none: "gridui-u-[--gridui-dashboard-compact-start:0px] gridui-u-[--gridui-dashboard-compact-start-minimum:0px]",
|
|
86
|
+
small: "gridui-u-[--gridui-dashboard-compact-start:var(--gridui-space-8)]",
|
|
87
|
+
medium: "gridui-u-[--gridui-dashboard-compact-start:var(--gridui-space-16)]",
|
|
88
|
+
large: "gridui-u-[--gridui-dashboard-compact-start:var(--gridui-space-24)]"
|
|
89
89
|
},
|
|
90
90
|
compactEndSize: {
|
|
91
|
-
none: "[--gridui-dashboard-compact-end:0px] [--gridui-dashboard-compact-end-minimum:0px]",
|
|
92
|
-
small: "[--gridui-dashboard-compact-end:var(--gridui-space-8)]",
|
|
93
|
-
medium: "[--gridui-dashboard-compact-end:var(--gridui-space-16)]",
|
|
94
|
-
large: "[--gridui-dashboard-compact-end:var(--gridui-space-24)]"
|
|
91
|
+
none: "gridui-u-[--gridui-dashboard-compact-end:0px] gridui-u-[--gridui-dashboard-compact-end-minimum:0px]",
|
|
92
|
+
small: "gridui-u-[--gridui-dashboard-compact-end:var(--gridui-space-8)]",
|
|
93
|
+
medium: "gridui-u-[--gridui-dashboard-compact-end:var(--gridui-space-16)]",
|
|
94
|
+
large: "gridui-u-[--gridui-dashboard-compact-end:var(--gridui-space-24)]"
|
|
95
95
|
}
|
|
96
96
|
},
|
|
97
97
|
defaultVariants: {
|
|
@@ -213,17 +213,17 @@ var frameToneStyles = (options = {}) => {
|
|
|
213
213
|
};
|
|
214
214
|
var frameContentStyles = cva5(cn4(
|
|
215
215
|
"gridui-frame-content",
|
|
216
|
-
"border-x border-solid border-border wrap-anywhere"
|
|
216
|
+
"gridui-u-border-x gridui-u-border-solid gridui-u-border-border gridui-u-wrap-anywhere"
|
|
217
217
|
));
|
|
218
218
|
|
|
219
219
|
// src/frame-footer/style.ts
|
|
220
220
|
import { cn as cn5 } from "@gridui/style-utils";
|
|
221
221
|
import { cva as cva6 } from "class-variance-authority";
|
|
222
222
|
var frameSignatureStyles = cva6(cn5(
|
|
223
|
-
"gridui-frame-signature flex min-w-0 items-center justify-center gap-gridui-24 py-gridui-32 px-gridui-24 overflow-hidden border-t border-solid border-border bg-transparent",
|
|
224
|
-
"[&>svg]:h-auto [&>svg]:opacity-30 [&>span]:font-display [&>span]:leading-none [&>span]:text-transparent"
|
|
223
|
+
"gridui-frame-signature gridui-u-flex gridui-u-min-w-0 gridui-u-items-center gridui-u-justify-center gridui-u-gap-gridui-24 gridui-u-py-gridui-32 gridui-u-px-gridui-24 gridui-u-overflow-hidden gridui-u-border-t gridui-u-border-solid gridui-u-border-border gridui-u-bg-transparent",
|
|
224
|
+
"gridui-u-[&>svg]:h-auto gridui-u-[&>svg]:opacity-30 gridui-u-[&>span]:font-display gridui-u-[&>span]:leading-none gridui-u-[&>span]:text-transparent"
|
|
225
225
|
));
|
|
226
|
-
var frameSignatureCroppedStyles = cva6("gridui-frame-signature-cropped block pb-0
|
|
226
|
+
var frameSignatureCroppedStyles = cva6("gridui-frame-signature-cropped gridui-u-block gridui-u-pb-0 gridui-u-@container gridui-u-[&>span]:block gridui-u-[&>span]:text-center gridui-u-[&>span]:whitespace-nowrap");
|
|
227
227
|
|
|
228
228
|
// src/frame-footer/frame-footer.tsx
|
|
229
229
|
import { cn as cn6 } from "@gridui/style-utils";
|
|
@@ -311,9 +311,9 @@ var FrameHeader = (props) => {
|
|
|
311
311
|
|
|
312
312
|
// src/frame-rail/style.ts
|
|
313
313
|
import { cva as cva7 } from "class-variance-authority";
|
|
314
|
-
var frameRailStyles = cva7("gridui-frame-rail flex h-full box-border flex-col py-gridui-24 text-muted");
|
|
315
|
-
var frameRailContentStyles = cva7("gridui-frame-rail-content relative z-(--gridui-z-interaction) min-w-0 type-eyebrow bg-inherit");
|
|
316
|
-
var frameRailStickyBottomStyles = cva7("gridui-frame-rail-sticky-bottom justify-end [&>.gridui-frame-rail-content]:sticky");
|
|
314
|
+
var frameRailStyles = cva7("gridui-frame-rail gridui-u-flex gridui-u-h-full gridui-u-box-border gridui-u-flex-col gridui-u-py-gridui-24 gridui-u-text-muted");
|
|
315
|
+
var frameRailContentStyles = cva7("gridui-frame-rail-content gridui-u-relative gridui-u-z-(--gridui-z-interaction) gridui-u-min-w-0 gridui-u-type-eyebrow gridui-u-bg-inherit");
|
|
316
|
+
var frameRailStickyBottomStyles = cva7("gridui-frame-rail-sticky-bottom gridui-u-justify-end gridui-u-[&>.gridui-frame-rail-content]:sticky");
|
|
317
317
|
|
|
318
318
|
// src/frame-rail/frame-rail.tsx
|
|
319
319
|
import { cn as cn8 } from "@gridui/style-utils";
|
|
@@ -472,7 +472,7 @@ var FrameSection = (props) => {
|
|
|
472
472
|
/* @__PURE__ */ jsxs5(
|
|
473
473
|
"div",
|
|
474
474
|
{
|
|
475
|
-
className: cn12(frameContentStyles(), "gridui-frame-surface", edges === "none" && "border-x-0"),
|
|
475
|
+
className: cn12(frameContentStyles(), "gridui-frame-surface", edges === "none" && "gridui-u-border-x-0"),
|
|
476
476
|
style: {
|
|
477
477
|
...spacingVariables("section-padding-inline", paddingInline),
|
|
478
478
|
...spacingVariables("section-padding-block", paddingBlock)
|
|
@@ -523,7 +523,7 @@ import { cn as cn14 } from "@gridui/style-utils";
|
|
|
523
523
|
import { cva as cva8 } from "class-variance-authority";
|
|
524
524
|
var gridItemStyles = cva8(cn14(
|
|
525
525
|
"gridui-grid-item",
|
|
526
|
-
"min-w-0 wrap-anywhere"
|
|
526
|
+
"gridui-u-min-w-0 gridui-u-wrap-anywhere"
|
|
527
527
|
));
|
|
528
528
|
|
|
529
529
|
// src/grid-item/grid-item.tsx
|
|
@@ -572,15 +572,15 @@ import { cn as cn16 } from "@gridui/style-utils";
|
|
|
572
572
|
import { cva as cva9 } from "class-variance-authority";
|
|
573
573
|
var gridStyles = cva9(cn16(
|
|
574
574
|
"gridui-grid",
|
|
575
|
-
"grid min-w-0"
|
|
575
|
+
"gridui-u-grid gridui-u-min-w-0"
|
|
576
576
|
));
|
|
577
577
|
var gridCellsStyles = cva9(cn16(
|
|
578
578
|
"gridui-grid-cells",
|
|
579
|
-
"border-t border-solid border-border border-l border-solid border-border"
|
|
579
|
+
"gridui-u-border-t gridui-u-border-solid gridui-u-border-border gridui-u-border-l gridui-u-border-solid gridui-u-border-border"
|
|
580
580
|
));
|
|
581
581
|
var gridInternalStyles = cva9(cn16(
|
|
582
582
|
"gridui-grid-internal",
|
|
583
|
-
"bg-border"
|
|
583
|
+
"gridui-u-bg-border"
|
|
584
584
|
));
|
|
585
585
|
var gridVariants = cva9(gridStyles(), {
|
|
586
586
|
variants: {
|
|
@@ -750,7 +750,7 @@ var Grid = (props) => {
|
|
|
750
750
|
|
|
751
751
|
// src/page-frame/style.ts
|
|
752
752
|
import { cva as cva10 } from "class-variance-authority";
|
|
753
|
-
var pageFrameVariants = cva10("gridui-page-frame min-h-svh", {
|
|
753
|
+
var pageFrameVariants = cva10("gridui-page-frame gridui-u-min-h-svh", {
|
|
754
754
|
variants: {
|
|
755
755
|
width: {
|
|
756
756
|
narrow: "gridui-container-narrow",
|
|
@@ -843,7 +843,7 @@ import { cn as cn19 } from "@gridui/style-utils";
|
|
|
843
843
|
import { cva as cva11 } from "class-variance-authority";
|
|
844
844
|
var rowStyles = cva11(cn19(
|
|
845
845
|
"gridui-row",
|
|
846
|
-
"min-w-0"
|
|
846
|
+
"gridui-u-min-w-0"
|
|
847
847
|
));
|
|
848
848
|
|
|
849
849
|
// src/row/row.tsx
|
|
@@ -909,7 +909,7 @@ import { cn as cn22 } from "@gridui/style-utils";
|
|
|
909
909
|
import { cva as cva12 } from "class-variance-authority";
|
|
910
910
|
var stackStyles = cva12(cn22(
|
|
911
911
|
"gridui-stack",
|
|
912
|
-
"flex min-w-0 flex-col"
|
|
912
|
+
"gridui-u-flex gridui-u-min-w-0 gridui-u-flex-col"
|
|
913
913
|
));
|
|
914
914
|
|
|
915
915
|
// src/stack/stack.tsx
|
package/dist/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/container/style.ts", "../src/container/container.tsx", "../src/shared/decoration.tsx", "../src/dashboard-frame/style.ts", "../src/dashboard-frame/dashboard-frame.tsx", "../src/frame-boundary/style.ts", "../src/frame-boundary/frame-boundary.tsx", "../src/shared/chrome.ts", "../src/shared/chrome-style.ts", "../src/shared/frame-style.ts", "../src/frame-footer/style.ts", "../src/frame-footer/frame-footer.tsx", "../src/frame-header/frame-header.tsx", "../src/frame-rail/style.ts", "../src/frame-rail/frame-rail.tsx", "../src/frame-rail-group/frame-rail-group.tsx", "../src/frame-region/frame-region.tsx", "../src/frame-region-row/frame-region-row.tsx", "../src/frame-texture/frame-texture.tsx", "../src/frame-section/frame-section.tsx", "../src/frame-sections/frame-sections.tsx", "../src/grid-item/responsive.ts", "../src/grid-item/style.ts", "../src/grid-item/grid-item.tsx", "../src/grid/style.ts", "../src/grid/tracks.ts", "../src/grid/grid.tsx", "../src/page-frame/style.ts", "../src/page-frame/page-frame.tsx", "../src/row/style.ts", "../src/row/row.tsx", "../src/split/split.tsx", "../src/stack/style.ts", "../src/stack/stack.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * @author WMXPY\n * @package Grid\n * @namespace Container\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const containerVariants = cva(\"gridui-container\", {\n variants: {\n width: {\n narrow: \"gridui-container-narrow\",\n standard: \"gridui-container-standard\",\n wide: \"gridui-container-wide\",\n },\n },\n defaultVariants: { width: \"standard\" },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Container\n * @description Container\n */\n\nimport type { ElementProps } from \"../shared/types\";\nimport { containerVariants } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { FC } from \"react\";\n\nexport type ContainerProps = ElementProps & {\n readonly width?: \"narrow\" | \"standard\" | \"wide\";\n};\n\nexport const Container: FC<ContainerProps> = (props: ContainerProps) => {\n const { width = \"standard\", className, ...restProps } = props;\n return (<div\n {...restProps}\n className={cn(containerVariants({ width }), className)}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Shared\n * @description Decoration\n */\n\nimport type { FrameBoundaryStyle } from \"../frame-boundary/frame-boundary\";\nimport type { FC } from \"react\";\n\nexport type FrameDecorationStyle = \"none\" | \"nodes\" | \"marks\" | \"corners\" | \"ticks\";\n\nexport const resolveFrameDecoration = (\n boundary: FrameBoundaryStyle,\n decoration?: FrameDecorationStyle,\n): FrameDecorationStyle => {\n return decoration ?? (boundary === \"band\" ? \"nodes\" : \"none\");\n};\n\nexport type FrameDecorationProps = {\n readonly decoration: FrameDecorationStyle;\n readonly side?: \"start\" | \"end\";\n};\n\nexport const FrameDecoration: FC<FrameDecorationProps> = (props: FrameDecorationProps) => {\n const { decoration, side } = props;\n if (decoration === \"none\") {\n return null;\n }\n if (!side) {\n return (<>\n <FrameDecoration\n decoration={decoration}\n side=\"start\"\n />\n <FrameDecoration\n decoration={decoration}\n side=\"end\"\n />\n </>);\n }\n return (<div\n className=\"gridui-frame-decoration\"\n data-decoration={decoration}\n data-side={side}\n aria-hidden=\"true\"\n inert\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace DashboardFrame\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const dashboardFrameVariants = cva(\"gridui-dashboard-frame\", {\n variants: {\n startSize: {\n none: \"[--gridui-dashboard-start:0px] [--gridui-dashboard-start-minimum:0px]\",\n small: \"[--gridui-dashboard-start:var(--gridui-space-8)]\",\n medium: \"[--gridui-dashboard-start:var(--gridui-space-16)]\",\n large: \"[--gridui-dashboard-start:var(--gridui-space-24)]\",\n },\n endSize: {\n none: \"[--gridui-dashboard-end:0px] [--gridui-dashboard-end-minimum:0px]\",\n small: \"[--gridui-dashboard-end:var(--gridui-space-8)]\",\n medium: \"[--gridui-dashboard-end:var(--gridui-space-16)]\",\n large: \"[--gridui-dashboard-end:var(--gridui-space-24)]\",\n },\n compactStartSize: {\n none: \"[--gridui-dashboard-compact-start:0px] [--gridui-dashboard-compact-start-minimum:0px]\",\n small: \"[--gridui-dashboard-compact-start:var(--gridui-space-8)]\",\n medium: \"[--gridui-dashboard-compact-start:var(--gridui-space-16)]\",\n large: \"[--gridui-dashboard-compact-start:var(--gridui-space-24)]\",\n },\n compactEndSize: {\n none: \"[--gridui-dashboard-compact-end:0px] [--gridui-dashboard-compact-end-minimum:0px]\",\n small: \"[--gridui-dashboard-compact-end:var(--gridui-space-8)]\",\n medium: \"[--gridui-dashboard-compact-end:var(--gridui-space-16)]\",\n large: \"[--gridui-dashboard-compact-end:var(--gridui-space-24)]\",\n },\n },\n defaultVariants: {\n startSize: \"medium\",\n endSize: \"medium\",\n compactStartSize: \"small\",\n compactEndSize: \"small\",\n },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace DashboardFrame\n * @description Dashboard Frame\n */\n\nimport { FrameDecoration, type FrameDecorationStyle } from \"../shared/decoration\";\nimport { dashboardFrameVariants } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DashboardFrameSize = NonNullable<VariantProps<typeof dashboardFrameVariants>[\"startSize\"]>;\n\nexport type DashboardFrameProps = ComponentPropsWithRef<\"div\"> & {\n readonly decoration?: FrameDecorationStyle;\n readonly startDecoration?: FrameDecorationStyle;\n readonly endDecoration?: FrameDecorationStyle;\n readonly startSize?: DashboardFrameSize;\n readonly endSize?: DashboardFrameSize;\n readonly compactStartSize?: DashboardFrameSize;\n readonly compactEndSize?: DashboardFrameSize;\n};\n\nexport const DashboardFrame: FC<DashboardFrameProps> = (props: DashboardFrameProps) => {\n const {\n startSize,\n endSize,\n compactStartSize,\n compactEndSize,\n decoration = \"none\",\n startDecoration = decoration,\n endDecoration = decoration,\n children,\n className,\n ...restProps\n } = props;\n\n return (<div\n {...restProps}\n className={cn(dashboardFrameVariants({\n startSize,\n endSize,\n compactStartSize,\n compactEndSize,\n }), className)}\n >\n <div\n className=\"gridui-dashboard-frame-body\"\n >\n {children}\n <FrameDecoration\n decoration={startDecoration}\n side=\"start\"\n />\n <FrameDecoration\n decoration={endDecoration}\n side=\"end\"\n />\n </div>\n </div>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameBoundary\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const frameBoundaryStyles = cva(\"gridui-frame-boundary\", {\n variants: {\n boundary: {\n none: \"\",\n line: \"\",\n band: \"gridui-frame-divider\",\n stripe: \"gridui-frame-divider gridui-frame-stripe\",\n space: \"gridui-frame-space\",\n },\n },\n defaultVariants: { boundary: \"line\" },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameBoundary\n * @description Frame Boundary\n */\n\nimport { frameBoundaryStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameBoundaryStyle = NonNullable<VariantProps<typeof frameBoundaryStyles>[\"boundary\"]>;\n\nexport type FrameBoundaryProps = Omit<ComponentPropsWithRef<\"div\">, \"children\"> & {\n readonly boundary?: FrameBoundaryStyle;\n readonly extent?: \"content\" | \"frame\";\n};\n\nexport const FrameBoundary: FC<FrameBoundaryProps> = (props: FrameBoundaryProps) => {\n const { boundary = \"line\", extent = \"content\", className, ...restProps } = props;\n return boundary === \"none\" ? null : (<div\n {...restProps}\n className={cn(frameBoundaryStyles({ boundary }), className)}\n data-boundary={boundary}\n data-boundary-extent={extent}\n aria-hidden=\"true\"\n inert\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Shared\n * @description Chrome\n */\n\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { CSSProperties } from \"react\";\n\nexport type ChromeProps = {\n readonly padding?: Responsive<Space>;\n};\n\nexport const chromeStyle = (padding: Responsive<Space>): CSSProperties & {\n \"--gridui-chrome-padding\": string;\n \"--gridui-chrome-padding-md\": string;\n \"--gridui-chrome-padding-lg\": string;\n} => {\n const values = resolveResponsive(padding);\n return {\n \"--gridui-chrome-padding\": spaceValue(values.base),\n \"--gridui-chrome-padding-md\": spaceValue(values.md),\n \"--gridui-chrome-padding-lg\": spaceValue(values.lg),\n };\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Shared\n * @description Chrome Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const frameChromeStyles = cva(\"gridui-frame-chrome\");\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Shared\n * @description Frame Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { paletteClass } from \"@gridui/theme\";\nimport { cva } from \"class-variance-authority\";\n\nexport type FrameTone = \"neutral\" | \"brand\" | \"warning\" | \"danger\";\n\nexport const frameToneStyles = (options: {\n readonly tone?: FrameTone;\n} = {}): string => {\n const { tone = \"neutral\" } = options;\n return tone === \"neutral\" ? \"\" : `gridui-frame-${tone} ${paletteClass(tone)}`;\n};\n\nexport const frameContentStyles = cva(cn(\n \"gridui-frame-content\",\n \"border-x border-solid border-border wrap-anywhere\",\n));\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameFooter\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const frameSignatureStyles = cva(cn(\n \"gridui-frame-signature flex min-w-0 items-center justify-center gap-gridui-24 py-gridui-32 px-gridui-24 overflow-hidden border-t border-solid border-border bg-transparent\",\n \"[&>svg]:h-auto [&>svg]:opacity-30 [&>span]:font-display [&>span]:leading-none [&>span]:text-transparent\",\n));\n\nexport const frameSignatureCroppedStyles = cva(\"gridui-frame-signature-cropped block pb-0 @container [&>span]:block [&>span]:text-center [&>span]:whitespace-nowrap\");\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameFooter\n * @description Frame Footer\n */\n\nimport { FrameBoundary, type FrameBoundaryStyle } from \"../frame-boundary/frame-boundary\";\nimport { type ChromeProps, chromeStyle } from \"../shared/chrome\";\nimport { frameChromeStyles } from \"../shared/chrome-style\";\nimport { FrameDecoration, type FrameDecorationStyle, resolveFrameDecoration } from \"../shared/decoration\";\nimport { frameContentStyles, type FrameTone, frameToneStyles } from \"../shared/frame-style\";\nimport { frameSignatureCroppedStyles, frameSignatureStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type FrameFooterProps = ComponentPropsWithRef<\"footer\"> & ChromeProps & {\n readonly contentLayout?: \"flex\" | \"block\";\n readonly tone?: FrameTone;\n readonly boundary?: FrameBoundaryStyle;\n readonly decoration?: FrameDecorationStyle;\n readonly signature?: ReactNode;\n readonly signatureAppearance?: \"standard\" | \"cropped\";\n};\n\nexport const FrameFooter: FC<FrameFooterProps> = (props: FrameFooterProps) => {\n const { padding = {\n base: 16,\n md: 24,\n }, contentLayout = \"flex\", tone = \"neutral\", boundary = \"line\", decoration, signature, signatureAppearance = \"standard\", className, children, ...restProps } = props;\n return (<footer\n {...restProps}\n className={cn(\"gridui-container gridui-frame-footer\", frameToneStyles({\n tone,\n }), className)}\n >\n <FrameBoundary\n boundary={boundary}\n />\n <div\n className={cn(frameContentStyles(), frameChromeStyles(), \"gridui-frame-surface\")}\n data-content-layout={contentLayout}\n style={chromeStyle(padding)}\n >\n {children}\n <FrameDecoration\n decoration={resolveFrameDecoration(boundary, decoration)}\n />\n </div>\n {signature ? (<div\n className={cn(frameContentStyles(), frameSignatureStyles(), signatureAppearance === \"cropped\" && frameSignatureCroppedStyles())}\n aria-hidden=\"true\"\n inert\n >\n {signature}\n </div>) : null}\n </footer>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameHeader\n * @description Frame Header\n */\n\nimport { type ChromeProps, chromeStyle } from \"../shared/chrome\";\nimport { frameChromeStyles } from \"../shared/chrome-style\";\nimport { frameContentStyles } from \"../shared/frame-style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameHeaderProps = ComponentPropsWithRef<\"header\"> & ChromeProps & {\n readonly wrap?: boolean;\n readonly gap?: Space;\n readonly justify?: \"start\" | \"between\";\n};\n\nexport const FrameHeader: FC<FrameHeaderProps> = (props: FrameHeaderProps) => {\n const { padding = {\n base: 16,\n md: 24,\n }, wrap = true, gap = 16, justify = \"between\", className, children, ...restProps } = props;\n return (<header\n {...restProps}\n className={cn(\"gridui-container gridui-frame-header\", className)}\n >\n <div\n className={cn(frameContentStyles(), frameChromeStyles())}\n data-justify={justify}\n style={{\n ...chromeStyle(padding),\n flexWrap: wrap ? \"wrap\" : \"nowrap\",\n gap: spaceValue(gap),\n }}\n >\n {children}\n </div>\n </header>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRail\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const frameRailStyles = cva(\"gridui-frame-rail flex h-full box-border flex-col py-gridui-24 text-muted\");\n\nexport const frameRailContentStyles = cva(\"gridui-frame-rail-content relative z-(--gridui-z-interaction) min-w-0 type-eyebrow bg-inherit\");\n\nexport const frameRailStickyBottomStyles = cva(\"gridui-frame-rail-sticky-bottom justify-end [&>.gridui-frame-rail-content]:sticky\");\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRail\n * @description Frame Rail\n */\n\nimport { frameRailContentStyles, frameRailStickyBottomStyles, frameRailStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameRailProps = ComponentPropsWithRef<\"div\"> & {\n readonly placement?: \"start\" | \"sticky-bottom\";\n};\n\nexport const FrameRail: FC<FrameRailProps> = (props: FrameRailProps) => {\n const {\n placement = \"start\",\n children,\n className,\n ...restProps\n } = props;\n return (<div\n {...restProps}\n className={cn(frameRailStyles(), placement === \"sticky-bottom\" && frameRailStickyBottomStyles(), className)}\n >\n <div\n className={frameRailContentStyles()}\n >\n {children}\n </div>\n </div>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRailGroup\n * @description Frame Rail Group\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { ComponentPropsWithRef, CSSProperties, FC, ReactNode } from \"react\";\n\nexport type FrameRailGroupProps = ComponentPropsWithRef<\"div\"> & {\n readonly rail?: ReactNode;\n readonly railWidth?: Responsive<Space>;\n};\n\nexport const FrameRailGroup: FC<FrameRailGroupProps> = (props: FrameRailGroupProps) => {\n const { rail, railWidth = {\n base: 0,\n md: 32,\n }, children, className, style, ...restProps } = props;\n const hasRail = rail !== undefined && rail !== null && rail !== false;\n const width = resolveResponsive(hasRail ? railWidth : 0);\n const layoutStyle: CSSProperties & {\n [key: `--gridui-${string}`]: string | number;\n } = {\n \"--gridui-rail-width-base\": spaceValue(width.base),\n \"--gridui-rail-width-md\": spaceValue(width.md),\n \"--gridui-rail-width-lg\": spaceValue(width.lg),\n \"--gridui-rail-display-base\": width.base === 0 ? \"none\" : \"block\",\n \"--gridui-rail-display-md\": width.md === 0 ? \"none\" : \"block\",\n \"--gridui-rail-display-lg\": width.lg === 0 ? \"none\" : \"block\",\n ...style,\n };\n return (<div\n {...restProps}\n className={cn(\"gridui-frame-rail-group\", className)}\n style={layoutStyle}\n >\n {hasRail ? (<div\n className=\"gridui-frame-rail-track\"\n >\n {rail}\n </div>) : null}\n <div\n className=\"gridui-frame-rail-body\"\n >\n {children}\n </div>\n </div>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRegion\n * @description Frame Region\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameRegionProps = ComponentPropsWithRef<\"div\"> & {\n readonly asChild?: boolean;\n readonly edge?: \"none\" | \"left\" | \"right\" | \"both\";\n};\n\nexport const FrameRegion: FC<FrameRegionProps> = (props: FrameRegionProps) => {\n const { asChild = false, edge = \"none\", className, ...restProps } = props;\n const Component = asChild ? Slot : \"div\";\n return (<Component\n {...restProps}\n className={cn(\"gridui-frame-region\", className)}\n data-frame-edge={edge}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRegionRow\n * @description Frame Region Row\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { ComponentPropsWithRef, CSSProperties, FC } from \"react\";\n\nexport type FrameRegionRowProps = ComponentPropsWithRef<\"div\"> & {\n readonly asChild?: boolean;\n readonly contentInset?: number | string;\n};\n\nexport const FrameRegionRow: FC<FrameRegionRowProps> = (props: FrameRegionRowProps) => {\n const { asChild = false, contentInset = 0, className, style, ...restProps } = props;\n const Component = asChild ? Slot : \"div\";\n return (<Component\n {...restProps}\n className={cn(\"gridui-frame-region-row\", className)}\n style={{\n \"--gridui-frame-region-inset\": typeof contentInset === \"number\" ? `${contentInset}px` : contentInset,\n ...style,\n } as CSSProperties}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameTexture\n * @description Frame Texture\n */\n\nimport type { FrameTextureStyle } from \"../shared/texture-types\";\nimport type { FC } from \"react\";\n\nexport type FrameTextureProps = {\n readonly texture: FrameTextureStyle;\n};\n\nexport const FrameTexture: FC<FrameTextureProps> = (props: FrameTextureProps) => {\n const { texture } = props;\n return texture === \"none\" ? null : (<div\n className=\"gridui-frame-texture\"\n data-texture={texture}\n aria-hidden=\"true\"\n inert\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameSection\n * @description Frame Section\n */\n\nimport { FrameBoundary, type FrameBoundaryStyle } from \"../frame-boundary/frame-boundary\";\nimport { FrameTexture } from \"../frame-texture/frame-texture\";\nimport { FrameDecoration, type FrameDecorationStyle, resolveFrameDecoration } from \"../shared/decoration\";\nimport { frameContentStyles, type FrameTone, frameToneStyles } from \"../shared/frame-style\";\nimport type { FrameTextureStyle } from \"../shared/texture-types\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type Responsive, type Space, spacingVariables } from \"@gridui/style-utils/responsive\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameSectionProps = ComponentPropsWithRef<\"section\"> & {\n readonly tone?: FrameTone;\n readonly boundary?: FrameBoundaryStyle;\n readonly decoration?: FrameDecorationStyle;\n readonly texture?: FrameTextureStyle;\n readonly edges?: \"frame\" | \"none\";\n readonly paddingInline?: Responsive<Space>;\n readonly paddingBlock?: Responsive<Space>;\n};\n\nexport const FrameSection: FC<FrameSectionProps> = (props: FrameSectionProps) => {\n const {\n tone = \"neutral\",\n boundary = \"line\",\n decoration,\n texture = \"none\",\n edges = \"frame\",\n paddingInline = 0,\n paddingBlock = 0,\n className,\n children,\n ...restProps\n } = props;\n return (<section\n {...restProps}\n className={cn(\"gridui-container gridui-frame-section\", frameToneStyles({ tone }), className)}\n data-edges={edges}\n >\n <FrameBoundary\n boundary={boundary}\n />\n <div\n className={cn(frameContentStyles(), \"gridui-frame-surface\", edges === \"none\" && \"border-x-0\")}\n style={{\n ...spacingVariables(\"section-padding-inline\", paddingInline),\n ...spacingVariables(\"section-padding-block\", paddingBlock),\n }}\n >\n <FrameTexture\n texture={texture}\n />\n {children}\n <FrameDecoration\n decoration={resolveFrameDecoration(boundary, decoration)}\n />\n </div>\n </section>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameSections\n * @description Frame Sections\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameSectionsProps = ComponentPropsWithRef<\"div\">;\n\nexport const FrameSections: FC<FrameSectionsProps> = (props: FrameSectionsProps) => {\n const { className, ...restProps } = props;\n return (<div\n {...restProps}\n className={cn(\"gridui-frame-sections\", className)}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace GridItem\n * @description Responsive\n */\n\nimport type { Span } from \"../shared/responsive-types\";\n\nexport const spanValue = (value: Span): string => {\n return value === \"full\" ? \"1 / -1\" : `span ${value} / span ${value}`;\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace GridItem\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const gridItemStyles = cva(cn(\n \"gridui-grid-item\",\n \"min-w-0 wrap-anywhere\",\n));\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace GridItem\n * @description Grid Item\n */\n\nimport type { Span } from \"../shared/responsive-types\";\nimport type { ElementProps, LayoutStyle } from \"../shared/types\";\nimport { spanValue } from \"./responsive\";\nimport { gridItemStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { FC } from \"react\";\n\nexport type GridItemProps = ElementProps & {\n readonly asChild?: boolean;\n readonly span?: Responsive<Span>;\n readonly padding?: Responsive<Space>;\n readonly align?: \"end\" | \"center\";\n};\n\nexport const GridItem: FC<GridItemProps> = (props: GridItemProps) => {\n const {\n asChild = false,\n span = 1,\n padding = 0,\n align,\n className,\n style,\n ...restProps\n } = props;\n const size = resolveResponsive(span);\n const inset = resolveResponsive(padding);\n const layoutStyle: LayoutStyle = {\n \"--gridui-span\": spanValue(size.base),\n \"--gridui-span-md\": spanValue(size.md),\n \"--gridui-span-lg\": spanValue(size.lg),\n \"--gridui-padding\": spaceValue(inset.base),\n \"--gridui-padding-md\": spaceValue(inset.md),\n \"--gridui-padding-lg\": spaceValue(inset.lg),\n ...(align ? {\n display: \"flex\",\n alignItems: align,\n } : {}),\n ...style,\n };\n\n const Component = asChild ? Slot : \"div\";\n return (<Component\n {...restProps}\n className={cn(gridItemStyles(), className)}\n style={layoutStyle}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Grid\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const gridStyles = cva(cn(\n \"gridui-grid\",\n \"grid min-w-0\",\n));\n\nexport const gridCellsStyles = cva(cn(\n \"gridui-grid-cells\",\n \"border-t border-solid border-border border-l border-solid border-border\",\n));\n\nexport const gridInternalStyles = cva(cn(\n \"gridui-grid-internal\",\n \"bg-border\",\n));\n\nexport const gridVariants = cva(gridStyles(), {\n variants: {\n frame: {\n none: \"\",\n cells: gridCellsStyles(),\n internal: gridInternalStyles(),\n },\n },\n defaultVariants: { frame: \"none\" },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Grid\n * @description Tracks\n */\n\nimport type { GridColumns } from \"./responsive\";\n\nexport const gridColumnCount = (columns: GridColumns): number => {\n return typeof columns === \"number\" ? columns : columns.length;\n};\n\nexport const gridTemplate = (columns: GridColumns): string => {\n if (typeof columns === \"number\") {\n return `repeat(${columns}, minmax(0, 1fr))`;\n }\n return columns.map((track) => {\n return track === \"1fr\" ? \"minmax(0, 1fr)\" : track;\n }).join(\" \");\n};\n\nexport const adaptiveGridTemplate = (minItemWidth: string | number): string => {\n if ((typeof minItemWidth === \"number\" && (!Number.isFinite(minItemWidth) || minItemWidth <= 0))\n || (typeof minItemWidth === \"string\" && !minItemWidth.trim())) {\n throw new RangeError(\"Adaptive Grid minItemWidth must be a positive number or a nonempty CSS length.\");\n }\n const minimum = typeof minItemWidth === \"number\" ? `${minItemWidth}px` : minItemWidth;\n return `repeat(auto-fit, minmax(min(100%, ${minimum}), 1fr))`;\n};\n\n// Fill incomplete rows before the next item wraps or starts a full-width row.\nexport const fillGridRowSpans = (columns: number, spans: readonly number[]): number[] => {\n let occupied = 0;\n return spans.map((span, index) => {\n if (span < 1 || span > columns) {\n throw new RangeError(\"Grid item spans must fit within the grid columns.\");\n }\n if (occupied + span > columns) {\n occupied = 0;\n }\n occupied += span;\n const next = spans[index + 1];\n if (next === undefined || occupied + next > columns) {\n const filled = span + columns - occupied;\n occupied = 0;\n return filled;\n }\n if (occupied === columns) {\n occupied = 0;\n }\n return span;\n });\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Grid\n * @description Grid\n */\n\nimport { GridItem, type GridItemProps } from \"../grid-item/grid-item\";\nimport type { ElementProps, LayoutStyle } from \"../shared/types\";\nimport type { GridColumns } from \"./responsive\";\nimport { gridVariants } from \"./style\";\nimport { adaptiveGridTemplate, fillGridRowSpans, gridColumnCount, gridTemplate } from \"./tracks\";\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { Children, cloneElement, type FC, Fragment, isValidElement, type ReactElement } from \"react\";\n\ntype GridFrameOptions = {\n readonly frame?: \"none\";\n readonly gap?: Responsive<Space>;\n} | {\n readonly frame: \"none\" | \"cells\" | \"internal\";\n readonly gap?: never;\n};\n\ntype GridLayoutOptions = ({\n readonly columns?: Responsive<GridColumns>;\n readonly minItemWidth?: never;\n} & GridFrameOptions) | {\n readonly columns: \"auto\";\n readonly minItemWidth: Responsive<string | number>;\n readonly frame?: \"none\";\n readonly gap?: Responsive<Space>;\n readonly fillLastRow?: false;\n};\n\nexport type GridProps = ElementProps & GridLayoutOptions & ({\n readonly asChild?: false;\n readonly fillLastRow?: boolean;\n} | {\n readonly asChild: true;\n readonly children: ReactElement;\n readonly fillLastRow?: false;\n});\n\nexport const Grid: FC<GridProps> = (props: GridProps) => {\n const {\n columns = 1,\n minItemWidth,\n asChild = false,\n frame = \"none\",\n gap = 16,\n fillLastRow = false,\n className,\n style,\n children,\n ...restProps\n } = props;\n if (fillLastRow && (asChild || columns === \"auto\")) {\n throw new TypeError(\"Grid fillLastRow requires fixed columns and direct GridItem children, without asChild.\");\n }\n if (columns === \"auto\" && frame !== \"none\") {\n throw new TypeError(\"Adaptive Grid does not support framed cells.\");\n }\n if (asChild && (!isValidElement(children) || children.type === Fragment)) {\n throw new TypeError(\"Grid asChild requires one element that forwards props and refs to its root.\");\n }\n let geometry: LayoutStyle;\n let count: {\n base: number;\n md: number;\n lg: number;\n } | null = null;\n if (columns === \"auto\") {\n if (minItemWidth === undefined) {\n throw new TypeError(\"Adaptive Grid requires minItemWidth.\");\n }\n const minimum = resolveResponsive(minItemWidth);\n geometry = {\n \"--gridui-grid-template\": adaptiveGridTemplate(minimum.base),\n \"--gridui-grid-template-md\": adaptiveGridTemplate(minimum.md),\n \"--gridui-grid-template-lg\": adaptiveGridTemplate(minimum.lg),\n };\n } else {\n if (minItemWidth !== undefined) {\n throw new TypeError(\"Grid minItemWidth requires columns=auto.\");\n }\n const tracks = resolveResponsive(columns);\n count = {\n base: gridColumnCount(tracks.base),\n md: gridColumnCount(tracks.md),\n lg: gridColumnCount(tracks.lg),\n };\n geometry = {\n \"--gridui-columns\": count.base,\n \"--gridui-columns-md\": count.md,\n \"--gridui-columns-lg\": count.lg,\n \"--gridui-grid-template\": gridTemplate(tracks.base),\n \"--gridui-grid-template-md\": gridTemplate(tracks.md),\n \"--gridui-grid-template-lg\": gridTemplate(tracks.lg),\n };\n }\n const spacing = resolveResponsive(frame === \"none\" ? gap : 0);\n const layoutStyle: LayoutStyle = {\n ...geometry,\n \"--gridui-gap\": frame === \"internal\" ? \"1px\" : spaceValue(spacing.base),\n \"--gridui-gap-md\": frame === \"internal\" ? \"1px\" : spaceValue(spacing.md),\n \"--gridui-gap-lg\": frame === \"internal\" ? \"1px\" : spaceValue(spacing.lg),\n ...style,\n };\n let content = children;\n if (fillLastRow && count) {\n const items = Children.toArray(children).map((child) => {\n if (!isValidElement<GridItemProps>(child) || child.type !== GridItem) {\n throw new TypeError(\"Grid fillLastRow requires direct GridItem children.\");\n }\n return child;\n });\n const spans = items.map((item) => {\n return resolveResponsive(item.props.span ?? 1);\n });\n const filled = {\n base: fillGridRowSpans(count.base, spans.map((span) => {\n return span.base === \"full\" ? count.base : span.base;\n })),\n md: fillGridRowSpans(count.md, spans.map((span) => {\n return span.md === \"full\" ? count.md : span.md;\n })),\n lg: fillGridRowSpans(count.lg, spans.map((span) => {\n return span.lg === \"full\" ? count.lg : span.lg;\n })),\n };\n content = items.map((item, index) => {\n const itemStyle: LayoutStyle = {\n \"--gridui-span\": `span ${filled.base[index]} / span ${filled.base[index]}`,\n \"--gridui-span-md\": `span ${filled.md[index]} / span ${filled.md[index]}`,\n \"--gridui-span-lg\": `span ${filled.lg[index]} / span ${filled.lg[index]}`,\n ...item.props.style,\n };\n return cloneElement(item, {\n style: itemStyle,\n });\n });\n }\n const Component = asChild ? Slot : \"div\";\n return (<Component\n {...restProps}\n className={cn(gridVariants({ frame }), className)}\n style={layoutStyle}\n >\n {content}\n </Component>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace PageFrame\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const pageFrameVariants = cva(\"gridui-page-frame min-h-svh\", {\n variants: {\n width: {\n narrow: \"gridui-container-narrow\",\n standard: \"gridui-container-standard\",\n wide: \"gridui-container-wide\",\n },\n },\n defaultVariants: { width: \"standard\" },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace PageFrame\n * @description Page Frame\n */\n\nimport type { ContainerProps } from \"../container/container\";\nimport { FrameRailGroup, type FrameRailGroupProps } from \"../frame-rail-group/frame-rail-group\";\nimport { FrameSections } from \"../frame-sections/frame-sections\";\nimport { frameContentStyles } from \"../shared/frame-style\";\nimport { pageFrameVariants } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type Responsive, type Space, spacingVariables } from \"@gridui/style-utils/responsive\";\nimport type { FC, ReactNode } from \"react\";\n\nexport type PageFrameProps = FrameRailGroupProps & {\n readonly width?: ContainerProps[\"width\"];\n readonly header?: ReactNode;\n readonly footer?: ReactNode;\n readonly railScope?: \"page\" | \"main\";\n readonly mainGutterStart?: Responsive<Space>;\n};\n\nexport const PageFrame: FC<PageFrameProps> = (props: PageFrameProps) => {\n const {\n width = \"standard\",\n header,\n footer,\n rail,\n railWidth,\n railScope = \"page\",\n mainGutterStart,\n children,\n className,\n ...restProps\n } = props;\n const railOptions = railWidth === undefined ? {} : { railWidth };\n const content = (<>\n <FrameSections>\n {children}\n </FrameSections>\n <div\n className=\"gridui-container gridui-frame-fill\"\n aria-hidden=\"true\"\n >\n <div\n className={cn(frameContentStyles())}\n />\n </div>\n </>);\n return (<FrameRailGroup\n {...restProps}\n rail={railScope === \"page\" ? rail : undefined}\n {...railOptions}\n className={cn(pageFrameVariants({ width }), className)}\n >\n {header ? (<div\n className=\"gridui-frame-page-header\"\n >\n {header}\n </div>) : null}\n <main\n className=\"gridui-frame-main\"\n style={mainGutterStart === undefined ? undefined : spacingVariables(\"main-gutter-start\", mainGutterStart)}\n >\n {railScope === \"main\" && rail !== undefined && rail !== null && rail !== false ? (<FrameRailGroup\n rail={rail}\n {...railOptions}\n className=\"gridui-frame-main-rail-group\"\n >\n {content}\n </FrameRailGroup>) : content}\n </main>\n {footer ? (<div\n className=\"gridui-frame-page-footer\"\n >\n {footer}\n </div>) : null}\n </FrameRailGroup>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Row\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const rowStyles = cva(cn(\n \"gridui-row\",\n \"min-w-0\",\n));\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Row\n * @description Row\n */\n\nimport { rowStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type RowProps = ComponentPropsWithRef<\"div\"> & {\n readonly gap?: Space;\n readonly rowGap?: Space;\n readonly align?: \"stretch\" | \"center\" | \"baseline\" | \"end\";\n readonly justify?: \"start\" | \"between\";\n readonly wrap?: boolean;\n readonly inline?: boolean;\n};\n\nexport const Row: FC<RowProps> = (props: RowProps) => {\n const {\n gap = 16,\n rowGap = gap,\n align = \"stretch\",\n justify = \"start\",\n wrap = true,\n inline = false,\n className,\n style,\n ...restProps\n } = props;\n return (<div\n {...restProps}\n className={cn(rowStyles(), className)}\n data-inline={inline}\n style={{\n display: inline ? \"inline-flex\" : \"flex\",\n alignItems: align,\n justifyContent: justify === \"between\" ? \"space-between\" : \"flex-start\",\n flexWrap: wrap ? \"wrap\" : \"nowrap\",\n gap: `${spaceValue(rowGap)} ${spaceValue(gap)}`,\n ...style,\n }}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Split\n * @description Split\n */\n\nimport type { ElementProps } from \"../shared/types\";\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive } from \"@gridui/style-utils/responsive\";\nimport type { FC } from \"react\";\n\nexport type SplitDirection = \"row\" | \"column\" | \"row-reverse\" | \"column-reverse\";\n\nexport type SplitProps = ElementProps & {\n readonly direction?: Responsive<SplitDirection>;\n readonly order?: \"logical\" | \"physical\";\n readonly seam?: Responsive<\"line\" | \"none\">;\n};\n\nexport const Split: FC<SplitProps> = (props: SplitProps) => {\n const { direction = \"row\", order = \"logical\", seam = \"line\", className, ...restProps } = props;\n const directions = resolveResponsive(direction);\n const seams = resolveResponsive(seam);\n return (<div\n {...restProps}\n className={cn(\"gridui-split\", className)}\n data-order={order}\n data-direction={directions.base}\n data-direction-md={directions.md}\n data-direction-lg={directions.lg}\n data-seam={seams.base}\n data-seam-md={seams.md}\n data-seam-lg={seams.lg}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Stack\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const stackStyles = cva(cn(\n \"gridui-stack\",\n \"flex min-w-0 flex-col\",\n));\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Stack\n * @description Stack\n */\n\nimport type { ElementProps, LayoutStyle } from \"../shared/types\";\nimport { stackStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { CSSProperties, FC } from \"react\";\n\nexport type StackProps = ElementProps & {\n readonly gap?: Responsive<Space>;\n readonly width?: \"full\";\n readonly maxWidth?: CSSProperties[\"maxWidth\"];\n readonly paddingStart?: Space;\n};\n\nexport const Stack: FC<StackProps> = (props: StackProps) => {\n const {\n gap = 16,\n width,\n maxWidth,\n paddingStart,\n className,\n style,\n ...restProps\n } = props;\n const spacing = resolveResponsive(gap);\n const layoutStyle: LayoutStyle = {\n \"--gridui-gap\": spaceValue(spacing.base),\n \"--gridui-gap-md\": spaceValue(spacing.md),\n \"--gridui-gap-lg\": spaceValue(spacing.lg),\n width: width === \"full\" ? \"100%\" : undefined,\n maxWidth,\n paddingTop: paddingStart === undefined ? undefined : spaceValue(paddingStart),\n ...style,\n };\n return (<div\n {...restProps}\n className={cn(stackStyles(), className)}\n style={layoutStyle}\n />);\n};\n"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"sourcesContent": ["/**\n * @author WMXPY\n * @package Grid\n * @namespace Container\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const containerVariants = cva(\"gridui-container\", {\n variants: {\n width: {\n narrow: \"gridui-container-narrow\",\n standard: \"gridui-container-standard\",\n wide: \"gridui-container-wide\",\n },\n },\n defaultVariants: { width: \"standard\" },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Container\n * @description Container\n */\n\nimport type { ElementProps } from \"../shared/types\";\nimport { containerVariants } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { FC } from \"react\";\n\nexport type ContainerProps = ElementProps & {\n readonly width?: \"narrow\" | \"standard\" | \"wide\";\n};\n\nexport const Container: FC<ContainerProps> = (props: ContainerProps) => {\n const { width = \"standard\", className, ...restProps } = props;\n return (<div\n {...restProps}\n className={cn(containerVariants({ width }), className)}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Shared\n * @description Decoration\n */\n\nimport type { FrameBoundaryStyle } from \"../frame-boundary/frame-boundary\";\nimport type { FC } from \"react\";\n\nexport type FrameDecorationStyle = \"none\" | \"nodes\" | \"marks\" | \"corners\" | \"ticks\";\n\nexport const resolveFrameDecoration = (\n boundary: FrameBoundaryStyle,\n decoration?: FrameDecorationStyle,\n): FrameDecorationStyle => {\n return decoration ?? (boundary === \"band\" ? \"nodes\" : \"none\");\n};\n\nexport type FrameDecorationProps = {\n readonly decoration: FrameDecorationStyle;\n readonly side?: \"start\" | \"end\";\n};\n\nexport const FrameDecoration: FC<FrameDecorationProps> = (props: FrameDecorationProps) => {\n const { decoration, side } = props;\n if (decoration === \"none\") {\n return null;\n }\n if (!side) {\n return (<>\n <FrameDecoration\n decoration={decoration}\n side=\"start\"\n />\n <FrameDecoration\n decoration={decoration}\n side=\"end\"\n />\n </>);\n }\n return (<div\n className=\"gridui-frame-decoration\"\n data-decoration={decoration}\n data-side={side}\n aria-hidden=\"true\"\n inert\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace DashboardFrame\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const dashboardFrameVariants = cva(\"gridui-dashboard-frame\", {\n variants: {\n startSize: {\n none: \"gridui-u-[--gridui-dashboard-start:0px] gridui-u-[--gridui-dashboard-start-minimum:0px]\",\n small: \"gridui-u-[--gridui-dashboard-start:var(--gridui-space-8)]\",\n medium: \"gridui-u-[--gridui-dashboard-start:var(--gridui-space-16)]\",\n large: \"gridui-u-[--gridui-dashboard-start:var(--gridui-space-24)]\",\n },\n endSize: {\n none: \"gridui-u-[--gridui-dashboard-end:0px] gridui-u-[--gridui-dashboard-end-minimum:0px]\",\n small: \"gridui-u-[--gridui-dashboard-end:var(--gridui-space-8)]\",\n medium: \"gridui-u-[--gridui-dashboard-end:var(--gridui-space-16)]\",\n large: \"gridui-u-[--gridui-dashboard-end:var(--gridui-space-24)]\",\n },\n compactStartSize: {\n none: \"gridui-u-[--gridui-dashboard-compact-start:0px] gridui-u-[--gridui-dashboard-compact-start-minimum:0px]\",\n small: \"gridui-u-[--gridui-dashboard-compact-start:var(--gridui-space-8)]\",\n medium: \"gridui-u-[--gridui-dashboard-compact-start:var(--gridui-space-16)]\",\n large: \"gridui-u-[--gridui-dashboard-compact-start:var(--gridui-space-24)]\",\n },\n compactEndSize: {\n none: \"gridui-u-[--gridui-dashboard-compact-end:0px] gridui-u-[--gridui-dashboard-compact-end-minimum:0px]\",\n small: \"gridui-u-[--gridui-dashboard-compact-end:var(--gridui-space-8)]\",\n medium: \"gridui-u-[--gridui-dashboard-compact-end:var(--gridui-space-16)]\",\n large: \"gridui-u-[--gridui-dashboard-compact-end:var(--gridui-space-24)]\",\n },\n },\n defaultVariants: {\n startSize: \"medium\",\n endSize: \"medium\",\n compactStartSize: \"small\",\n compactEndSize: \"small\",\n },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace DashboardFrame\n * @description Dashboard Frame\n */\n\nimport { FrameDecoration, type FrameDecorationStyle } from \"../shared/decoration\";\nimport { dashboardFrameVariants } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DashboardFrameSize = NonNullable<VariantProps<typeof dashboardFrameVariants>[\"startSize\"]>;\n\nexport type DashboardFrameProps = ComponentPropsWithRef<\"div\"> & {\n readonly decoration?: FrameDecorationStyle;\n readonly startDecoration?: FrameDecorationStyle;\n readonly endDecoration?: FrameDecorationStyle;\n readonly startSize?: DashboardFrameSize;\n readonly endSize?: DashboardFrameSize;\n readonly compactStartSize?: DashboardFrameSize;\n readonly compactEndSize?: DashboardFrameSize;\n};\n\nexport const DashboardFrame: FC<DashboardFrameProps> = (props: DashboardFrameProps) => {\n const {\n startSize,\n endSize,\n compactStartSize,\n compactEndSize,\n decoration = \"none\",\n startDecoration = decoration,\n endDecoration = decoration,\n children,\n className,\n ...restProps\n } = props;\n\n return (<div\n {...restProps}\n className={cn(dashboardFrameVariants({\n startSize,\n endSize,\n compactStartSize,\n compactEndSize,\n }), className)}\n >\n <div\n className=\"gridui-dashboard-frame-body\"\n >\n {children}\n <FrameDecoration\n decoration={startDecoration}\n side=\"start\"\n />\n <FrameDecoration\n decoration={endDecoration}\n side=\"end\"\n />\n </div>\n </div>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameBoundary\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const frameBoundaryStyles = cva(\"gridui-frame-boundary\", {\n variants: {\n boundary: {\n none: \"\",\n line: \"\",\n band: \"gridui-frame-divider\",\n stripe: \"gridui-frame-divider gridui-frame-stripe\",\n space: \"gridui-frame-space\",\n },\n },\n defaultVariants: { boundary: \"line\" },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameBoundary\n * @description Frame Boundary\n */\n\nimport { frameBoundaryStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameBoundaryStyle = NonNullable<VariantProps<typeof frameBoundaryStyles>[\"boundary\"]>;\n\nexport type FrameBoundaryProps = Omit<ComponentPropsWithRef<\"div\">, \"children\"> & {\n readonly boundary?: FrameBoundaryStyle;\n readonly extent?: \"content\" | \"frame\";\n};\n\nexport const FrameBoundary: FC<FrameBoundaryProps> = (props: FrameBoundaryProps) => {\n const { boundary = \"line\", extent = \"content\", className, ...restProps } = props;\n return boundary === \"none\" ? null : (<div\n {...restProps}\n className={cn(frameBoundaryStyles({ boundary }), className)}\n data-boundary={boundary}\n data-boundary-extent={extent}\n aria-hidden=\"true\"\n inert\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Shared\n * @description Chrome\n */\n\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { CSSProperties } from \"react\";\n\nexport type ChromeProps = {\n readonly padding?: Responsive<Space>;\n};\n\nexport const chromeStyle = (padding: Responsive<Space>): CSSProperties & {\n \"--gridui-chrome-padding\": string;\n \"--gridui-chrome-padding-md\": string;\n \"--gridui-chrome-padding-lg\": string;\n} => {\n const values = resolveResponsive(padding);\n return {\n \"--gridui-chrome-padding\": spaceValue(values.base),\n \"--gridui-chrome-padding-md\": spaceValue(values.md),\n \"--gridui-chrome-padding-lg\": spaceValue(values.lg),\n };\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Shared\n * @description Chrome Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const frameChromeStyles = cva(\"gridui-frame-chrome\");\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Shared\n * @description Frame Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { paletteClass } from \"@gridui/theme\";\nimport { cva } from \"class-variance-authority\";\n\nexport type FrameTone = \"neutral\" | \"brand\" | \"warning\" | \"danger\";\n\nexport const frameToneStyles = (options: {\n readonly tone?: FrameTone;\n} = {}): string => {\n const { tone = \"neutral\" } = options;\n return tone === \"neutral\" ? \"\" : `gridui-frame-${tone} ${paletteClass(tone)}`;\n};\n\nexport const frameContentStyles = cva(cn(\n \"gridui-frame-content\",\n \"gridui-u-border-x gridui-u-border-solid gridui-u-border-border gridui-u-wrap-anywhere\",\n));\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameFooter\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const frameSignatureStyles = cva(cn(\n \"gridui-frame-signature gridui-u-flex gridui-u-min-w-0 gridui-u-items-center gridui-u-justify-center gridui-u-gap-gridui-24 gridui-u-py-gridui-32 gridui-u-px-gridui-24 gridui-u-overflow-hidden gridui-u-border-t gridui-u-border-solid gridui-u-border-border gridui-u-bg-transparent\",\n \"gridui-u-[&>svg]:h-auto gridui-u-[&>svg]:opacity-30 gridui-u-[&>span]:font-display gridui-u-[&>span]:leading-none gridui-u-[&>span]:text-transparent\",\n));\n\nexport const frameSignatureCroppedStyles = cva(\"gridui-frame-signature-cropped gridui-u-block gridui-u-pb-0 gridui-u-@container gridui-u-[&>span]:block gridui-u-[&>span]:text-center gridui-u-[&>span]:whitespace-nowrap\");\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameFooter\n * @description Frame Footer\n */\n\nimport { FrameBoundary, type FrameBoundaryStyle } from \"../frame-boundary/frame-boundary\";\nimport { type ChromeProps, chromeStyle } from \"../shared/chrome\";\nimport { frameChromeStyles } from \"../shared/chrome-style\";\nimport { FrameDecoration, type FrameDecorationStyle, resolveFrameDecoration } from \"../shared/decoration\";\nimport { frameContentStyles, type FrameTone, frameToneStyles } from \"../shared/frame-style\";\nimport { frameSignatureCroppedStyles, frameSignatureStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC, ReactNode } from \"react\";\n\nexport type FrameFooterProps = ComponentPropsWithRef<\"footer\"> & ChromeProps & {\n readonly contentLayout?: \"flex\" | \"block\";\n readonly tone?: FrameTone;\n readonly boundary?: FrameBoundaryStyle;\n readonly decoration?: FrameDecorationStyle;\n readonly signature?: ReactNode;\n readonly signatureAppearance?: \"standard\" | \"cropped\";\n};\n\nexport const FrameFooter: FC<FrameFooterProps> = (props: FrameFooterProps) => {\n const { padding = {\n base: 16,\n md: 24,\n }, contentLayout = \"flex\", tone = \"neutral\", boundary = \"line\", decoration, signature, signatureAppearance = \"standard\", className, children, ...restProps } = props;\n return (<footer\n {...restProps}\n className={cn(\"gridui-container gridui-frame-footer\", frameToneStyles({\n tone,\n }), className)}\n >\n <FrameBoundary\n boundary={boundary}\n />\n <div\n className={cn(frameContentStyles(), frameChromeStyles(), \"gridui-frame-surface\")}\n data-content-layout={contentLayout}\n style={chromeStyle(padding)}\n >\n {children}\n <FrameDecoration\n decoration={resolveFrameDecoration(boundary, decoration)}\n />\n </div>\n {signature ? (<div\n className={cn(frameContentStyles(), frameSignatureStyles(), signatureAppearance === \"cropped\" && frameSignatureCroppedStyles())}\n aria-hidden=\"true\"\n inert\n >\n {signature}\n </div>) : null}\n </footer>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameHeader\n * @description Frame Header\n */\n\nimport { type ChromeProps, chromeStyle } from \"../shared/chrome\";\nimport { frameChromeStyles } from \"../shared/chrome-style\";\nimport { frameContentStyles } from \"../shared/frame-style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameHeaderProps = ComponentPropsWithRef<\"header\"> & ChromeProps & {\n readonly wrap?: boolean;\n readonly gap?: Space;\n readonly justify?: \"start\" | \"between\";\n};\n\nexport const FrameHeader: FC<FrameHeaderProps> = (props: FrameHeaderProps) => {\n const { padding = {\n base: 16,\n md: 24,\n }, wrap = true, gap = 16, justify = \"between\", className, children, ...restProps } = props;\n return (<header\n {...restProps}\n className={cn(\"gridui-container gridui-frame-header\", className)}\n >\n <div\n className={cn(frameContentStyles(), frameChromeStyles())}\n data-justify={justify}\n style={{\n ...chromeStyle(padding),\n flexWrap: wrap ? \"wrap\" : \"nowrap\",\n gap: spaceValue(gap),\n }}\n >\n {children}\n </div>\n </header>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRail\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const frameRailStyles = cva(\"gridui-frame-rail gridui-u-flex gridui-u-h-full gridui-u-box-border gridui-u-flex-col gridui-u-py-gridui-24 gridui-u-text-muted\");\n\nexport const frameRailContentStyles = cva(\"gridui-frame-rail-content gridui-u-relative gridui-u-z-(--gridui-z-interaction) gridui-u-min-w-0 gridui-u-type-eyebrow gridui-u-bg-inherit\");\n\nexport const frameRailStickyBottomStyles = cva(\"gridui-frame-rail-sticky-bottom gridui-u-justify-end gridui-u-[&>.gridui-frame-rail-content]:sticky\");\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRail\n * @description Frame Rail\n */\n\nimport { frameRailContentStyles, frameRailStickyBottomStyles, frameRailStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameRailProps = ComponentPropsWithRef<\"div\"> & {\n readonly placement?: \"start\" | \"sticky-bottom\";\n};\n\nexport const FrameRail: FC<FrameRailProps> = (props: FrameRailProps) => {\n const {\n placement = \"start\",\n children,\n className,\n ...restProps\n } = props;\n return (<div\n {...restProps}\n className={cn(frameRailStyles(), placement === \"sticky-bottom\" && frameRailStickyBottomStyles(), className)}\n >\n <div\n className={frameRailContentStyles()}\n >\n {children}\n </div>\n </div>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRailGroup\n * @description Frame Rail Group\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { ComponentPropsWithRef, CSSProperties, FC, ReactNode } from \"react\";\n\nexport type FrameRailGroupProps = ComponentPropsWithRef<\"div\"> & {\n readonly rail?: ReactNode;\n readonly railWidth?: Responsive<Space>;\n};\n\nexport const FrameRailGroup: FC<FrameRailGroupProps> = (props: FrameRailGroupProps) => {\n const { rail, railWidth = {\n base: 0,\n md: 32,\n }, children, className, style, ...restProps } = props;\n const hasRail = rail !== undefined && rail !== null && rail !== false;\n const width = resolveResponsive(hasRail ? railWidth : 0);\n const layoutStyle: CSSProperties & {\n [key: `--gridui-${string}`]: string | number;\n } = {\n \"--gridui-rail-width-base\": spaceValue(width.base),\n \"--gridui-rail-width-md\": spaceValue(width.md),\n \"--gridui-rail-width-lg\": spaceValue(width.lg),\n \"--gridui-rail-display-base\": width.base === 0 ? \"none\" : \"block\",\n \"--gridui-rail-display-md\": width.md === 0 ? \"none\" : \"block\",\n \"--gridui-rail-display-lg\": width.lg === 0 ? \"none\" : \"block\",\n ...style,\n };\n return (<div\n {...restProps}\n className={cn(\"gridui-frame-rail-group\", className)}\n style={layoutStyle}\n >\n {hasRail ? (<div\n className=\"gridui-frame-rail-track\"\n >\n {rail}\n </div>) : null}\n <div\n className=\"gridui-frame-rail-body\"\n >\n {children}\n </div>\n </div>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRegion\n * @description Frame Region\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameRegionProps = ComponentPropsWithRef<\"div\"> & {\n readonly asChild?: boolean;\n readonly edge?: \"none\" | \"left\" | \"right\" | \"both\";\n};\n\nexport const FrameRegion: FC<FrameRegionProps> = (props: FrameRegionProps) => {\n const { asChild = false, edge = \"none\", className, ...restProps } = props;\n const Component = asChild ? Slot : \"div\";\n return (<Component\n {...restProps}\n className={cn(\"gridui-frame-region\", className)}\n data-frame-edge={edge}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameRegionRow\n * @description Frame Region Row\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { ComponentPropsWithRef, CSSProperties, FC } from \"react\";\n\nexport type FrameRegionRowProps = ComponentPropsWithRef<\"div\"> & {\n readonly asChild?: boolean;\n readonly contentInset?: number | string;\n};\n\nexport const FrameRegionRow: FC<FrameRegionRowProps> = (props: FrameRegionRowProps) => {\n const { asChild = false, contentInset = 0, className, style, ...restProps } = props;\n const Component = asChild ? Slot : \"div\";\n return (<Component\n {...restProps}\n className={cn(\"gridui-frame-region-row\", className)}\n style={{\n \"--gridui-frame-region-inset\": typeof contentInset === \"number\" ? `${contentInset}px` : contentInset,\n ...style,\n } as CSSProperties}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameTexture\n * @description Frame Texture\n */\n\nimport type { FrameTextureStyle } from \"../shared/texture-types\";\nimport type { FC } from \"react\";\n\nexport type FrameTextureProps = {\n readonly texture: FrameTextureStyle;\n};\n\nexport const FrameTexture: FC<FrameTextureProps> = (props: FrameTextureProps) => {\n const { texture } = props;\n return texture === \"none\" ? null : (<div\n className=\"gridui-frame-texture\"\n data-texture={texture}\n aria-hidden=\"true\"\n inert\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameSection\n * @description Frame Section\n */\n\nimport { FrameBoundary, type FrameBoundaryStyle } from \"../frame-boundary/frame-boundary\";\nimport { FrameTexture } from \"../frame-texture/frame-texture\";\nimport { FrameDecoration, type FrameDecorationStyle, resolveFrameDecoration } from \"../shared/decoration\";\nimport { frameContentStyles, type FrameTone, frameToneStyles } from \"../shared/frame-style\";\nimport type { FrameTextureStyle } from \"../shared/texture-types\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type Responsive, type Space, spacingVariables } from \"@gridui/style-utils/responsive\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameSectionProps = ComponentPropsWithRef<\"section\"> & {\n readonly tone?: FrameTone;\n readonly boundary?: FrameBoundaryStyle;\n readonly decoration?: FrameDecorationStyle;\n readonly texture?: FrameTextureStyle;\n readonly edges?: \"frame\" | \"none\";\n readonly paddingInline?: Responsive<Space>;\n readonly paddingBlock?: Responsive<Space>;\n};\n\nexport const FrameSection: FC<FrameSectionProps> = (props: FrameSectionProps) => {\n const {\n tone = \"neutral\",\n boundary = \"line\",\n decoration,\n texture = \"none\",\n edges = \"frame\",\n paddingInline = 0,\n paddingBlock = 0,\n className,\n children,\n ...restProps\n } = props;\n return (<section\n {...restProps}\n className={cn(\"gridui-container gridui-frame-section\", frameToneStyles({ tone }), className)}\n data-edges={edges}\n >\n <FrameBoundary\n boundary={boundary}\n />\n <div\n className={cn(frameContentStyles(), \"gridui-frame-surface\", edges === \"none\" && \"gridui-u-border-x-0\")}\n style={{\n ...spacingVariables(\"section-padding-inline\", paddingInline),\n ...spacingVariables(\"section-padding-block\", paddingBlock),\n }}\n >\n <FrameTexture\n texture={texture}\n />\n {children}\n <FrameDecoration\n decoration={resolveFrameDecoration(boundary, decoration)}\n />\n </div>\n </section>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace FrameSections\n * @description Frame Sections\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type FrameSectionsProps = ComponentPropsWithRef<\"div\">;\n\nexport const FrameSections: FC<FrameSectionsProps> = (props: FrameSectionsProps) => {\n const { className, ...restProps } = props;\n return (<div\n {...restProps}\n className={cn(\"gridui-frame-sections\", className)}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace GridItem\n * @description Responsive\n */\n\nimport type { Span } from \"../shared/responsive-types\";\n\nexport const spanValue = (value: Span): string => {\n return value === \"full\" ? \"1 / -1\" : `span ${value} / span ${value}`;\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace GridItem\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const gridItemStyles = cva(cn(\n \"gridui-grid-item\",\n \"gridui-u-min-w-0 gridui-u-wrap-anywhere\",\n));\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace GridItem\n * @description Grid Item\n */\n\nimport type { Span } from \"../shared/responsive-types\";\nimport type { ElementProps, LayoutStyle } from \"../shared/types\";\nimport { spanValue } from \"./responsive\";\nimport { gridItemStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { FC } from \"react\";\n\nexport type GridItemProps = ElementProps & {\n readonly asChild?: boolean;\n readonly span?: Responsive<Span>;\n readonly padding?: Responsive<Space>;\n readonly align?: \"end\" | \"center\";\n};\n\nexport const GridItem: FC<GridItemProps> = (props: GridItemProps) => {\n const {\n asChild = false,\n span = 1,\n padding = 0,\n align,\n className,\n style,\n ...restProps\n } = props;\n const size = resolveResponsive(span);\n const inset = resolveResponsive(padding);\n const layoutStyle: LayoutStyle = {\n \"--gridui-span\": spanValue(size.base),\n \"--gridui-span-md\": spanValue(size.md),\n \"--gridui-span-lg\": spanValue(size.lg),\n \"--gridui-padding\": spaceValue(inset.base),\n \"--gridui-padding-md\": spaceValue(inset.md),\n \"--gridui-padding-lg\": spaceValue(inset.lg),\n ...(align ? {\n display: \"flex\",\n alignItems: align,\n } : {}),\n ...style,\n };\n\n const Component = asChild ? Slot : \"div\";\n return (<Component\n {...restProps}\n className={cn(gridItemStyles(), className)}\n style={layoutStyle}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Grid\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const gridStyles = cva(cn(\n \"gridui-grid\",\n \"gridui-u-grid gridui-u-min-w-0\",\n));\n\nexport const gridCellsStyles = cva(cn(\n \"gridui-grid-cells\",\n \"gridui-u-border-t gridui-u-border-solid gridui-u-border-border gridui-u-border-l gridui-u-border-solid gridui-u-border-border\",\n));\n\nexport const gridInternalStyles = cva(cn(\n \"gridui-grid-internal\",\n \"gridui-u-bg-border\",\n));\n\nexport const gridVariants = cva(gridStyles(), {\n variants: {\n frame: {\n none: \"\",\n cells: gridCellsStyles(),\n internal: gridInternalStyles(),\n },\n },\n defaultVariants: { frame: \"none\" },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Grid\n * @description Tracks\n */\n\nimport type { GridColumns } from \"./responsive\";\n\nexport const gridColumnCount = (columns: GridColumns): number => {\n return typeof columns === \"number\" ? columns : columns.length;\n};\n\nexport const gridTemplate = (columns: GridColumns): string => {\n if (typeof columns === \"number\") {\n return `repeat(${columns}, minmax(0, 1fr))`;\n }\n return columns.map((track) => {\n return track === \"1fr\" ? \"minmax(0, 1fr)\" : track;\n }).join(\" \");\n};\n\nexport const adaptiveGridTemplate = (minItemWidth: string | number): string => {\n if ((typeof minItemWidth === \"number\" && (!Number.isFinite(minItemWidth) || minItemWidth <= 0))\n || (typeof minItemWidth === \"string\" && !minItemWidth.trim())) {\n throw new RangeError(\"Adaptive Grid minItemWidth must be a positive number or a nonempty CSS length.\");\n }\n const minimum = typeof minItemWidth === \"number\" ? `${minItemWidth}px` : minItemWidth;\n return `repeat(auto-fit, minmax(min(100%, ${minimum}), 1fr))`;\n};\n\n// Fill incomplete rows before the next item wraps or starts a full-width row.\nexport const fillGridRowSpans = (columns: number, spans: readonly number[]): number[] => {\n let occupied = 0;\n return spans.map((span, index) => {\n if (span < 1 || span > columns) {\n throw new RangeError(\"Grid item spans must fit within the grid columns.\");\n }\n if (occupied + span > columns) {\n occupied = 0;\n }\n occupied += span;\n const next = spans[index + 1];\n if (next === undefined || occupied + next > columns) {\n const filled = span + columns - occupied;\n occupied = 0;\n return filled;\n }\n if (occupied === columns) {\n occupied = 0;\n }\n return span;\n });\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Grid\n * @description Grid\n */\n\nimport { GridItem, type GridItemProps } from \"../grid-item/grid-item\";\nimport type { ElementProps, LayoutStyle } from \"../shared/types\";\nimport type { GridColumns } from \"./responsive\";\nimport { gridVariants } from \"./style\";\nimport { adaptiveGridTemplate, fillGridRowSpans, gridColumnCount, gridTemplate } from \"./tracks\";\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { Children, cloneElement, type FC, Fragment, isValidElement, type ReactElement } from \"react\";\n\ntype GridFrameOptions = {\n readonly frame?: \"none\";\n readonly gap?: Responsive<Space>;\n} | {\n readonly frame: \"none\" | \"cells\" | \"internal\";\n readonly gap?: never;\n};\n\ntype GridLayoutOptions = ({\n readonly columns?: Responsive<GridColumns>;\n readonly minItemWidth?: never;\n} & GridFrameOptions) | {\n readonly columns: \"auto\";\n readonly minItemWidth: Responsive<string | number>;\n readonly frame?: \"none\";\n readonly gap?: Responsive<Space>;\n readonly fillLastRow?: false;\n};\n\nexport type GridProps = ElementProps & GridLayoutOptions & ({\n readonly asChild?: false;\n readonly fillLastRow?: boolean;\n} | {\n readonly asChild: true;\n readonly children: ReactElement;\n readonly fillLastRow?: false;\n});\n\nexport const Grid: FC<GridProps> = (props: GridProps) => {\n const {\n columns = 1,\n minItemWidth,\n asChild = false,\n frame = \"none\",\n gap = 16,\n fillLastRow = false,\n className,\n style,\n children,\n ...restProps\n } = props;\n if (fillLastRow && (asChild || columns === \"auto\")) {\n throw new TypeError(\"Grid fillLastRow requires fixed columns and direct GridItem children, without asChild.\");\n }\n if (columns === \"auto\" && frame !== \"none\") {\n throw new TypeError(\"Adaptive Grid does not support framed cells.\");\n }\n if (asChild && (!isValidElement(children) || children.type === Fragment)) {\n throw new TypeError(\"Grid asChild requires one element that forwards props and refs to its root.\");\n }\n let geometry: LayoutStyle;\n let count: {\n base: number;\n md: number;\n lg: number;\n } | null = null;\n if (columns === \"auto\") {\n if (minItemWidth === undefined) {\n throw new TypeError(\"Adaptive Grid requires minItemWidth.\");\n }\n const minimum = resolveResponsive(minItemWidth);\n geometry = {\n \"--gridui-grid-template\": adaptiveGridTemplate(minimum.base),\n \"--gridui-grid-template-md\": adaptiveGridTemplate(minimum.md),\n \"--gridui-grid-template-lg\": adaptiveGridTemplate(minimum.lg),\n };\n } else {\n if (minItemWidth !== undefined) {\n throw new TypeError(\"Grid minItemWidth requires columns=auto.\");\n }\n const tracks = resolveResponsive(columns);\n count = {\n base: gridColumnCount(tracks.base),\n md: gridColumnCount(tracks.md),\n lg: gridColumnCount(tracks.lg),\n };\n geometry = {\n \"--gridui-columns\": count.base,\n \"--gridui-columns-md\": count.md,\n \"--gridui-columns-lg\": count.lg,\n \"--gridui-grid-template\": gridTemplate(tracks.base),\n \"--gridui-grid-template-md\": gridTemplate(tracks.md),\n \"--gridui-grid-template-lg\": gridTemplate(tracks.lg),\n };\n }\n const spacing = resolveResponsive(frame === \"none\" ? gap : 0);\n const layoutStyle: LayoutStyle = {\n ...geometry,\n \"--gridui-gap\": frame === \"internal\" ? \"1px\" : spaceValue(spacing.base),\n \"--gridui-gap-md\": frame === \"internal\" ? \"1px\" : spaceValue(spacing.md),\n \"--gridui-gap-lg\": frame === \"internal\" ? \"1px\" : spaceValue(spacing.lg),\n ...style,\n };\n let content = children;\n if (fillLastRow && count) {\n const items = Children.toArray(children).map((child) => {\n if (!isValidElement<GridItemProps>(child) || child.type !== GridItem) {\n throw new TypeError(\"Grid fillLastRow requires direct GridItem children.\");\n }\n return child;\n });\n const spans = items.map((item) => {\n return resolveResponsive(item.props.span ?? 1);\n });\n const filled = {\n base: fillGridRowSpans(count.base, spans.map((span) => {\n return span.base === \"full\" ? count.base : span.base;\n })),\n md: fillGridRowSpans(count.md, spans.map((span) => {\n return span.md === \"full\" ? count.md : span.md;\n })),\n lg: fillGridRowSpans(count.lg, spans.map((span) => {\n return span.lg === \"full\" ? count.lg : span.lg;\n })),\n };\n content = items.map((item, index) => {\n const itemStyle: LayoutStyle = {\n \"--gridui-span\": `span ${filled.base[index]} / span ${filled.base[index]}`,\n \"--gridui-span-md\": `span ${filled.md[index]} / span ${filled.md[index]}`,\n \"--gridui-span-lg\": `span ${filled.lg[index]} / span ${filled.lg[index]}`,\n ...item.props.style,\n };\n return cloneElement(item, {\n style: itemStyle,\n });\n });\n }\n const Component = asChild ? Slot : \"div\";\n return (<Component\n {...restProps}\n className={cn(gridVariants({ frame }), className)}\n style={layoutStyle}\n >\n {content}\n </Component>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace PageFrame\n * @description Style\n */\n\nimport { cva } from \"class-variance-authority\";\n\nexport const pageFrameVariants = cva(\"gridui-page-frame gridui-u-min-h-svh\", {\n variants: {\n width: {\n narrow: \"gridui-container-narrow\",\n standard: \"gridui-container-standard\",\n wide: \"gridui-container-wide\",\n },\n },\n defaultVariants: { width: \"standard\" },\n});\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace PageFrame\n * @description Page Frame\n */\n\nimport type { ContainerProps } from \"../container/container\";\nimport { FrameRailGroup, type FrameRailGroupProps } from \"../frame-rail-group/frame-rail-group\";\nimport { FrameSections } from \"../frame-sections/frame-sections\";\nimport { frameContentStyles } from \"../shared/frame-style\";\nimport { pageFrameVariants } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type Responsive, type Space, spacingVariables } from \"@gridui/style-utils/responsive\";\nimport type { FC, ReactNode } from \"react\";\n\nexport type PageFrameProps = FrameRailGroupProps & {\n readonly width?: ContainerProps[\"width\"];\n readonly header?: ReactNode;\n readonly footer?: ReactNode;\n readonly railScope?: \"page\" | \"main\";\n readonly mainGutterStart?: Responsive<Space>;\n};\n\nexport const PageFrame: FC<PageFrameProps> = (props: PageFrameProps) => {\n const {\n width = \"standard\",\n header,\n footer,\n rail,\n railWidth,\n railScope = \"page\",\n mainGutterStart,\n children,\n className,\n ...restProps\n } = props;\n const railOptions = railWidth === undefined ? {} : { railWidth };\n const content = (<>\n <FrameSections>\n {children}\n </FrameSections>\n <div\n className=\"gridui-container gridui-frame-fill\"\n aria-hidden=\"true\"\n >\n <div\n className={cn(frameContentStyles())}\n />\n </div>\n </>);\n return (<FrameRailGroup\n {...restProps}\n rail={railScope === \"page\" ? rail : undefined}\n {...railOptions}\n className={cn(pageFrameVariants({ width }), className)}\n >\n {header ? (<div\n className=\"gridui-frame-page-header\"\n >\n {header}\n </div>) : null}\n <main\n className=\"gridui-frame-main\"\n style={mainGutterStart === undefined ? undefined : spacingVariables(\"main-gutter-start\", mainGutterStart)}\n >\n {railScope === \"main\" && rail !== undefined && rail !== null && rail !== false ? (<FrameRailGroup\n rail={rail}\n {...railOptions}\n className=\"gridui-frame-main-rail-group\"\n >\n {content}\n </FrameRailGroup>) : content}\n </main>\n {footer ? (<div\n className=\"gridui-frame-page-footer\"\n >\n {footer}\n </div>) : null}\n </FrameRailGroup>);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Row\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const rowStyles = cva(cn(\n \"gridui-row\",\n \"gridui-u-min-w-0\",\n));\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Row\n * @description Row\n */\n\nimport { rowStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type RowProps = ComponentPropsWithRef<\"div\"> & {\n readonly gap?: Space;\n readonly rowGap?: Space;\n readonly align?: \"stretch\" | \"center\" | \"baseline\" | \"end\";\n readonly justify?: \"start\" | \"between\";\n readonly wrap?: boolean;\n readonly inline?: boolean;\n};\n\nexport const Row: FC<RowProps> = (props: RowProps) => {\n const {\n gap = 16,\n rowGap = gap,\n align = \"stretch\",\n justify = \"start\",\n wrap = true,\n inline = false,\n className,\n style,\n ...restProps\n } = props;\n return (<div\n {...restProps}\n className={cn(rowStyles(), className)}\n data-inline={inline}\n style={{\n display: inline ? \"inline-flex\" : \"flex\",\n alignItems: align,\n justifyContent: justify === \"between\" ? \"space-between\" : \"flex-start\",\n flexWrap: wrap ? \"wrap\" : \"nowrap\",\n gap: `${spaceValue(rowGap)} ${spaceValue(gap)}`,\n ...style,\n }}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Split\n * @description Split\n */\n\nimport type { ElementProps } from \"../shared/types\";\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive } from \"@gridui/style-utils/responsive\";\nimport type { FC } from \"react\";\n\nexport type SplitDirection = \"row\" | \"column\" | \"row-reverse\" | \"column-reverse\";\n\nexport type SplitProps = ElementProps & {\n readonly direction?: Responsive<SplitDirection>;\n readonly order?: \"logical\" | \"physical\";\n readonly seam?: Responsive<\"line\" | \"none\">;\n};\n\nexport const Split: FC<SplitProps> = (props: SplitProps) => {\n const { direction = \"row\", order = \"logical\", seam = \"line\", className, ...restProps } = props;\n const directions = resolveResponsive(direction);\n const seams = resolveResponsive(seam);\n return (<div\n {...restProps}\n className={cn(\"gridui-split\", className)}\n data-order={order}\n data-direction={directions.base}\n data-direction-md={directions.md}\n data-direction-lg={directions.lg}\n data-seam={seams.base}\n data-seam-md={seams.md}\n data-seam-lg={seams.lg}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Stack\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const stackStyles = cva(cn(\n \"gridui-stack\",\n \"gridui-u-flex gridui-u-min-w-0 gridui-u-flex-col\",\n));\n", "/**\n * @author WMXPY\n * @package Grid\n * @namespace Stack\n * @description Stack\n */\n\nimport type { ElementProps, LayoutStyle } from \"../shared/types\";\nimport { stackStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport { resolveResponsive, type Responsive, type Space, spaceValue } from \"@gridui/style-utils/responsive\";\nimport type { CSSProperties, FC } from \"react\";\n\nexport type StackProps = ElementProps & {\n readonly gap?: Responsive<Space>;\n readonly width?: \"full\";\n readonly maxWidth?: CSSProperties[\"maxWidth\"];\n readonly paddingStart?: Space;\n};\n\nexport const Stack: FC<StackProps> = (props: StackProps) => {\n const {\n gap = 16,\n width,\n maxWidth,\n paddingStart,\n className,\n style,\n ...restProps\n } = props;\n const spacing = resolveResponsive(gap);\n const layoutStyle: LayoutStyle = {\n \"--gridui-gap\": spaceValue(spacing.base),\n \"--gridui-gap-md\": spaceValue(spacing.md),\n \"--gridui-gap-lg\": spaceValue(spacing.lg),\n width: width === \"full\" ? \"100%\" : undefined,\n maxWidth,\n paddingTop: paddingStart === undefined ? undefined : spaceValue(paddingStart),\n ...style,\n };\n return (<div\n {...restProps}\n className={cn(stackStyles(), className)}\n style={layoutStyle}\n />);\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["jsx", "cva", "cn", "jsx", "jsxs", "cva", "cn", "jsx", "cva", "cn", "cva", "cn", "cva", "cn", "jsx", "jsxs", "cn", "spaceValue", "jsx", "cva", "cn", "jsx", "cn", "resolveResponsive", "spaceValue", "jsx", "jsxs", "cn", "jsx", "cn", "Slot", "jsx", "jsx", "cn", "jsx", "jsxs", "cn", "jsx", "cn", "cva", "cn", "resolveResponsive", "spaceValue", "Slot", "jsx", "cn", "cva", "cn", "resolveResponsive", "spaceValue", "Slot", "Fragment", "jsx", "cva", "cn", "spacingVariables", "Fragment", "jsx", "jsxs", "cn", "cva", "cn", "spaceValue", "jsx", "cn", "resolveResponsive", "jsx", "cn", "cva", "cn", "resolveResponsive", "spaceValue", "jsx"]
|
|
7
7
|
}
|
package/dist/styles.css
CHANGED
|
@@ -2,203 +2,194 @@
|
|
|
2
2
|
@layer properties;
|
|
3
3
|
@layer theme, base, components, utilities;
|
|
4
4
|
@layer utilities {
|
|
5
|
-
|
|
5
|
+
.gridui-u-\@container {
|
|
6
6
|
container-type: inline-size;
|
|
7
7
|
}
|
|
8
|
-
.
|
|
9
|
-
position: fixed;
|
|
10
|
-
}
|
|
11
|
-
.relative {
|
|
8
|
+
.gridui-u-relative {
|
|
12
9
|
position: relative;
|
|
13
10
|
}
|
|
14
|
-
.z-\(--gridui-z-interaction\) {
|
|
11
|
+
.gridui-u-z-\(--gridui-z-interaction\) {
|
|
15
12
|
z-index: var(--gridui-z-interaction);
|
|
16
13
|
}
|
|
17
|
-
.box-border {
|
|
14
|
+
.gridui-u-box-border {
|
|
18
15
|
box-sizing: border-box;
|
|
19
16
|
}
|
|
20
|
-
.block {
|
|
17
|
+
.gridui-u-block {
|
|
21
18
|
display: block;
|
|
22
19
|
}
|
|
23
|
-
.flex {
|
|
20
|
+
.gridui-u-flex {
|
|
24
21
|
display: flex;
|
|
25
22
|
}
|
|
26
|
-
.grid {
|
|
23
|
+
.gridui-u-grid {
|
|
27
24
|
display: grid;
|
|
28
25
|
}
|
|
29
|
-
.
|
|
30
|
-
display: inline;
|
|
31
|
-
}
|
|
32
|
-
.inline-flex {
|
|
33
|
-
display: inline-flex;
|
|
34
|
-
}
|
|
35
|
-
.h-full {
|
|
26
|
+
.gridui-u-h-full {
|
|
36
27
|
height: 100%;
|
|
37
28
|
}
|
|
38
|
-
.min-h-svh {
|
|
29
|
+
.gridui-u-min-h-svh {
|
|
39
30
|
min-height: 100svh;
|
|
40
31
|
}
|
|
41
|
-
.min-w-0 {
|
|
32
|
+
.gridui-u-min-w-0 {
|
|
42
33
|
min-width: 0px;
|
|
43
34
|
}
|
|
44
|
-
.flex-col {
|
|
35
|
+
.gridui-u-flex-col {
|
|
45
36
|
flex-direction: column;
|
|
46
37
|
}
|
|
47
|
-
.items-center {
|
|
38
|
+
.gridui-u-items-center {
|
|
48
39
|
align-items: center;
|
|
49
40
|
}
|
|
50
|
-
.justify-center {
|
|
41
|
+
.gridui-u-justify-center {
|
|
51
42
|
justify-content: center;
|
|
52
43
|
}
|
|
53
|
-
.justify-end {
|
|
44
|
+
.gridui-u-justify-end {
|
|
54
45
|
justify-content: flex-end;
|
|
55
46
|
}
|
|
56
|
-
.gap-gridui-24 {
|
|
47
|
+
.gridui-u-gap-gridui-24 {
|
|
57
48
|
gap: var(--gridui-space-24);
|
|
58
49
|
}
|
|
59
|
-
.overflow-hidden {
|
|
50
|
+
.gridui-u-overflow-hidden {
|
|
60
51
|
overflow: hidden;
|
|
61
52
|
}
|
|
62
|
-
.border-x {
|
|
53
|
+
.gridui-u-border-x {
|
|
63
54
|
border-inline-style: var(--tw-border-style);
|
|
64
55
|
border-inline-width: 1px;
|
|
65
56
|
}
|
|
66
|
-
.border-x-0 {
|
|
57
|
+
.gridui-u-border-x-0 {
|
|
67
58
|
border-inline-style: var(--tw-border-style);
|
|
68
59
|
border-inline-width: 0px;
|
|
69
60
|
}
|
|
70
|
-
.border-t {
|
|
61
|
+
.gridui-u-border-t {
|
|
71
62
|
border-top-style: var(--tw-border-style);
|
|
72
63
|
border-top-width: 1px;
|
|
73
64
|
}
|
|
74
|
-
.border-l {
|
|
65
|
+
.gridui-u-border-l {
|
|
75
66
|
border-left-style: var(--tw-border-style);
|
|
76
67
|
border-left-width: 1px;
|
|
77
68
|
}
|
|
78
|
-
.border-solid {
|
|
69
|
+
.gridui-u-border-solid {
|
|
79
70
|
--tw-border-style: solid;
|
|
80
71
|
border-style: solid;
|
|
81
72
|
}
|
|
82
|
-
.border-border {
|
|
73
|
+
.gridui-u-border-border {
|
|
83
74
|
border-color: var(--gridui-border);
|
|
84
75
|
}
|
|
85
|
-
.bg-border {
|
|
76
|
+
.gridui-u-bg-border {
|
|
86
77
|
background-color: var(--gridui-border);
|
|
87
78
|
}
|
|
88
|
-
.bg-inherit {
|
|
79
|
+
.gridui-u-bg-inherit {
|
|
89
80
|
background-color: inherit;
|
|
90
81
|
}
|
|
91
|
-
.bg-transparent {
|
|
82
|
+
.gridui-u-bg-transparent {
|
|
92
83
|
background-color: transparent;
|
|
93
84
|
}
|
|
94
|
-
.px-gridui-24 {
|
|
85
|
+
.gridui-u-px-gridui-24 {
|
|
95
86
|
padding-inline: var(--gridui-space-24);
|
|
96
87
|
}
|
|
97
|
-
.py-gridui-24 {
|
|
88
|
+
.gridui-u-py-gridui-24 {
|
|
98
89
|
padding-block: var(--gridui-space-24);
|
|
99
90
|
}
|
|
100
|
-
.py-gridui-32 {
|
|
91
|
+
.gridui-u-py-gridui-32 {
|
|
101
92
|
padding-block: var(--gridui-space-32);
|
|
102
93
|
}
|
|
103
|
-
.pb-0 {
|
|
94
|
+
.gridui-u-pb-0 {
|
|
104
95
|
padding-bottom: 0px;
|
|
105
96
|
}
|
|
106
|
-
.type-eyebrow {
|
|
97
|
+
.gridui-u-type-eyebrow {
|
|
107
98
|
font: var(--gridui-type-eyebrow);
|
|
108
99
|
letter-spacing: 0.08em;
|
|
109
100
|
}
|
|
110
|
-
.wrap-anywhere {
|
|
101
|
+
.gridui-u-wrap-anywhere {
|
|
111
102
|
overflow-wrap: anywhere;
|
|
112
103
|
}
|
|
113
|
-
.text-muted {
|
|
104
|
+
.gridui-u-text-muted {
|
|
114
105
|
color: var(--gridui-muted);
|
|
115
106
|
}
|
|
116
|
-
|
|
107
|
+
.gridui-u-\[--gridui-dashboard-compact-end-minimum\:0px\] {
|
|
117
108
|
--gridui-dashboard-compact-end-minimum: 0px;
|
|
118
109
|
}
|
|
119
|
-
|
|
110
|
+
.gridui-u-\[--gridui-dashboard-compact-end\:0px\] {
|
|
120
111
|
--gridui-dashboard-compact-end: 0px;
|
|
121
112
|
}
|
|
122
|
-
|
|
113
|
+
.gridui-u-\[--gridui-dashboard-compact-end\:var\(--gridui-space-8\)\] {
|
|
123
114
|
--gridui-dashboard-compact-end: var(--gridui-space-8);
|
|
124
115
|
}
|
|
125
|
-
|
|
116
|
+
.gridui-u-\[--gridui-dashboard-compact-end\:var\(--gridui-space-16\)\] {
|
|
126
117
|
--gridui-dashboard-compact-end: var(--gridui-space-16);
|
|
127
118
|
}
|
|
128
|
-
|
|
119
|
+
.gridui-u-\[--gridui-dashboard-compact-end\:var\(--gridui-space-24\)\] {
|
|
129
120
|
--gridui-dashboard-compact-end: var(--gridui-space-24);
|
|
130
121
|
}
|
|
131
|
-
|
|
122
|
+
.gridui-u-\[--gridui-dashboard-compact-start-minimum\:0px\] {
|
|
132
123
|
--gridui-dashboard-compact-start-minimum: 0px;
|
|
133
124
|
}
|
|
134
|
-
|
|
125
|
+
.gridui-u-\[--gridui-dashboard-compact-start\:0px\] {
|
|
135
126
|
--gridui-dashboard-compact-start: 0px;
|
|
136
127
|
}
|
|
137
|
-
|
|
128
|
+
.gridui-u-\[--gridui-dashboard-compact-start\:var\(--gridui-space-8\)\] {
|
|
138
129
|
--gridui-dashboard-compact-start: var(--gridui-space-8);
|
|
139
130
|
}
|
|
140
|
-
|
|
131
|
+
.gridui-u-\[--gridui-dashboard-compact-start\:var\(--gridui-space-16\)\] {
|
|
141
132
|
--gridui-dashboard-compact-start: var(--gridui-space-16);
|
|
142
133
|
}
|
|
143
|
-
|
|
134
|
+
.gridui-u-\[--gridui-dashboard-compact-start\:var\(--gridui-space-24\)\] {
|
|
144
135
|
--gridui-dashboard-compact-start: var(--gridui-space-24);
|
|
145
136
|
}
|
|
146
|
-
|
|
137
|
+
.gridui-u-\[--gridui-dashboard-end-minimum\:0px\] {
|
|
147
138
|
--gridui-dashboard-end-minimum: 0px;
|
|
148
139
|
}
|
|
149
|
-
|
|
140
|
+
.gridui-u-\[--gridui-dashboard-end\:0px\] {
|
|
150
141
|
--gridui-dashboard-end: 0px;
|
|
151
142
|
}
|
|
152
|
-
|
|
143
|
+
.gridui-u-\[--gridui-dashboard-end\:var\(--gridui-space-8\)\] {
|
|
153
144
|
--gridui-dashboard-end: var(--gridui-space-8);
|
|
154
145
|
}
|
|
155
|
-
|
|
146
|
+
.gridui-u-\[--gridui-dashboard-end\:var\(--gridui-space-16\)\] {
|
|
156
147
|
--gridui-dashboard-end: var(--gridui-space-16);
|
|
157
148
|
}
|
|
158
|
-
|
|
149
|
+
.gridui-u-\[--gridui-dashboard-end\:var\(--gridui-space-24\)\] {
|
|
159
150
|
--gridui-dashboard-end: var(--gridui-space-24);
|
|
160
151
|
}
|
|
161
|
-
|
|
152
|
+
.gridui-u-\[--gridui-dashboard-start-minimum\:0px\] {
|
|
162
153
|
--gridui-dashboard-start-minimum: 0px;
|
|
163
154
|
}
|
|
164
|
-
|
|
155
|
+
.gridui-u-\[--gridui-dashboard-start\:0px\] {
|
|
165
156
|
--gridui-dashboard-start: 0px;
|
|
166
157
|
}
|
|
167
|
-
|
|
158
|
+
.gridui-u-\[--gridui-dashboard-start\:var\(--gridui-space-8\)\] {
|
|
168
159
|
--gridui-dashboard-start: var(--gridui-space-8);
|
|
169
160
|
}
|
|
170
|
-
|
|
161
|
+
.gridui-u-\[--gridui-dashboard-start\:var\(--gridui-space-16\)\] {
|
|
171
162
|
--gridui-dashboard-start: var(--gridui-space-16);
|
|
172
163
|
}
|
|
173
|
-
|
|
164
|
+
.gridui-u-\[--gridui-dashboard-start\:var\(--gridui-space-24\)\] {
|
|
174
165
|
--gridui-dashboard-start: var(--gridui-space-24);
|
|
175
166
|
}
|
|
176
|
-
|
|
167
|
+
.gridui-u-\[\&\>\.gridui-frame-rail-content\]\:sticky > .gridui-frame-rail-content {
|
|
177
168
|
position: sticky;
|
|
178
169
|
}
|
|
179
|
-
|
|
170
|
+
.gridui-u-\[\&\>span\]\:block > span {
|
|
180
171
|
display: block;
|
|
181
172
|
}
|
|
182
|
-
|
|
173
|
+
.gridui-u-\[\&\>span\]\:text-center > span {
|
|
183
174
|
text-align: center;
|
|
184
175
|
}
|
|
185
|
-
|
|
176
|
+
.gridui-u-\[\&\>span\]\:font-display > span {
|
|
186
177
|
font-family: var(--gridui-font-display);
|
|
187
178
|
}
|
|
188
|
-
|
|
179
|
+
.gridui-u-\[\&\>span\]\:leading-none > span {
|
|
189
180
|
--tw-leading: 1;
|
|
190
181
|
line-height: 1;
|
|
191
182
|
}
|
|
192
|
-
|
|
183
|
+
.gridui-u-\[\&\>span\]\:whitespace-nowrap > span {
|
|
193
184
|
white-space: nowrap;
|
|
194
185
|
}
|
|
195
|
-
|
|
186
|
+
.gridui-u-\[\&\>span\]\:text-transparent > span {
|
|
196
187
|
color: transparent;
|
|
197
188
|
}
|
|
198
|
-
|
|
189
|
+
.gridui-u-\[\&\>svg\]\:h-auto > svg {
|
|
199
190
|
height: auto;
|
|
200
191
|
}
|
|
201
|
-
|
|
192
|
+
.gridui-u-\[\&\>svg\]\:opacity-30 > svg {
|
|
202
193
|
opacity: 30%;
|
|
203
194
|
}
|
|
204
195
|
}
|
package/docs/README.md
ADDED
|
@@ -0,0 +1,398 @@
|
|
|
1
|
+
# Grid contract
|
|
2
|
+
|
|
3
|
+
See the [shared UI index](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/docs/README.md) for
|
|
4
|
+
cross-package ownership, style organization, and verification.
|
|
5
|
+
|
|
6
|
+
## Grid foundation
|
|
7
|
+
|
|
8
|
+
Theme's `src/tokens.css`, loaded through `@gridui/theme/styles.css`, owns spacing, content widths, and semantic
|
|
9
|
+
colors. Spacing values are `0 / 4 / 8 / 16 / 24 / 32 / 48 / 64`, expressed in rem
|
|
10
|
+
except zero. The page gutter is 16 at the base breakpoint and 24 from 40rem.
|
|
11
|
+
Sites may override tokens at their root; components do not add external margins.
|
|
12
|
+
|
|
13
|
+
`@gridui/grid` exports grid primitives and page frame components;
|
|
14
|
+
its `styles.css` is a separate explicit export. Follow the shared
|
|
15
|
+
[stylesheet integration order](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/docs/usage/integration.md). Geometry
|
|
16
|
+
uses owned component CSS alongside generated utility classes. Class composition
|
|
17
|
+
uses clsx and tailwind-merge;
|
|
18
|
+
container width and grid framing use typed CVA variants.
|
|
19
|
+
|
|
20
|
+
- `Container` defines `full-start`, `content-start`, `content-end`, and
|
|
21
|
+
`full-end` lines. Direct children align to content by default; a direct child
|
|
22
|
+
with `data-width="full"` spans the whole container. Its `width` selects
|
|
23
|
+
`narrow` (48rem), `standard` (72rem), or `wide` (90rem).
|
|
24
|
+
- `Grid` owns columns and gap. Supported column counts are 1, 2, 3, 4, 6, and
|
|
25
|
+
12. A nonempty track array combines `"1fr"` and `"auto"` tracks, for example
|
|
26
|
+
`["1fr", "1fr", "1fr", "1fr", "auto"]` for four equal fields and an
|
|
27
|
+
automatic-width action. Counts and track arrays support the same responsive
|
|
28
|
+
breakpoints. The default is one column with gap 16. `frame="cells"` creates shared
|
|
29
|
+
cell boundaries, sets gap to zero, and disallows a gap prop. Its direct
|
|
30
|
+
children must be `GridItem` components. `frame="internal"` also disallows
|
|
31
|
+
a gap prop but draws internal seams with a 1px gap and the grid's border-color
|
|
32
|
+
background. Its `GridItem` children have an opaque `--gridui-background` surface;
|
|
33
|
+
consumer background styles can override it. It does not clip content or
|
|
34
|
+
interaction outlines and needs no selectors that assume item order or spans.
|
|
35
|
+
Hovered items paint above ordinary neighbors. Items with visible focus on
|
|
36
|
+
themselves or a descendant paint above hovered items; retained pointer focus
|
|
37
|
+
alone does not raise an item. This priority uses the existing local content
|
|
38
|
+
and interaction layers, independently of selection state. Frame surfaces
|
|
39
|
+
containing an active internal grid paint above frame boundaries. Keep rows filled, using
|
|
40
|
+
spans where appropriate: unoccupied cells expose the grid's border-color
|
|
41
|
+
background. Menus continue to use portals for viewport positioning.
|
|
42
|
+
Optional `fillLastRow` expands the final item in each incomplete row, including
|
|
43
|
+
a row preceding a full-width item. It plans spans for every breakpoint from
|
|
44
|
+
rendered direct `GridItem` children, excluding null children. It requires
|
|
45
|
+
direct items with valid spans; wrappers whose rendered spans are unknown are
|
|
46
|
+
rejected. No browser measurement or business item-count calculation is needed.
|
|
47
|
+
Explicit item style overrides still take precedence.
|
|
48
|
+
- `Grid columns="auto"` selects adaptive, unframed tracks. Required `minItemWidth`
|
|
49
|
+
accepts a positive number in pixels or a CSS length such as `"14rem"`, including
|
|
50
|
+
responsive values. The template uses `auto-fit` and caps its minimum at 100%
|
|
51
|
+
of the available space, so a narrow container never needs a wider track.
|
|
52
|
+
Gap retains its usual responsive behavior. Fixed/adaptive planning modes cannot
|
|
53
|
+
be mixed at breakpoints; change the adaptive minimum width instead.
|
|
54
|
+
Adaptive columns do not support `frame="cells"`, `frame="internal"`, or
|
|
55
|
+
`fillLastRow`: their track count is resolved by CSS, without measuring in JS.
|
|
56
|
+
- `Grid asChild` merges its geometry, classes, styles, native props, handlers,
|
|
57
|
+
and refs onto one prop-forwarding child through Radix Slot. Use native `ul` or
|
|
58
|
+
`ol` roots with `GridItem asChild` and `li` children to retain list semantics.
|
|
59
|
+
Place host-specific attributes and refs on the child. Child styles take
|
|
60
|
+
precedence; child handlers run before Grid handlers. This does not introduce
|
|
61
|
+
cancellation or routing behavior. `asChild` cannot be combined with
|
|
62
|
+
`fillLastRow`, whose span planner requires direct React GridItem children.
|
|
63
|
+
Unsupported combinations fail at the type boundary and throw for JS callers.
|
|
64
|
+
- `GridItem asChild` applies its geometry, native props, and merged refs to its
|
|
65
|
+
single child through Radix Slot. This supports interactive cells such as
|
|
66
|
+
SortableItem without adding a DOM layer. Keep GridItem as the direct React
|
|
67
|
+
child when using `fillLastRow`; the child must forward props and refs to its
|
|
68
|
+
root element. Grid does not own or import the child's interaction behavior.
|
|
69
|
+
- `GridItem` owns its column span and internal padding. Span defaults to 1,
|
|
70
|
+
padding to 0. `span="full"` spans the explicitly defined columns. Numeric
|
|
71
|
+
spans must not exceed the parent column count at any breakpoint, or CSS
|
|
72
|
+
Grid will create implicit columns.
|
|
73
|
+
- `Stack` owns vertical gap (default 16), without adding external margins
|
|
74
|
+
or changing the margins of children. Consumers own text resets.
|
|
75
|
+
|
|
76
|
+
Responsive props accept a scalar or `{ base, md?, lg? }`. `md` starts at
|
|
77
|
+
40rem and `lg` at 64rem. Missing values inherit from the preceding breakpoint.
|
|
78
|
+
Import the shared `Space`, `Responsive<T>`, `resolveResponsive`, `spaceValue`,
|
|
79
|
+
and `spacingVariables` from `@gridui/style-utils/responsive`. Grid exports its
|
|
80
|
+
geometry types (`Columns`, `GridColumns`, `GridTrack`, and `Span`) and components.
|
|
81
|
+
Columns, spans, gap, and padding are resolved through CSS, with no viewport
|
|
82
|
+
JavaScript. Grid and GridItem render divs by default; use their `asChild` prop
|
|
83
|
+
when retaining a semantic host. Other primitives follow their documented native
|
|
84
|
+
hosts. Components forward native props, styles, and refs.
|
|
85
|
+
|
|
86
|
+
```tsx
|
|
87
|
+
<Container>
|
|
88
|
+
<div data-width="full" className="site-rule" />
|
|
89
|
+
<Grid columns={{ base: 1, md: 4 }} frame="cells">
|
|
90
|
+
<GridItem span={{ base: 1, md: 3 }} padding={{ base: 16, md: 24 }}>
|
|
91
|
+
<Stack gap={16}>...</Stack>
|
|
92
|
+
</GridItem>
|
|
93
|
+
<GridItem padding={16}>...</GridItem>
|
|
94
|
+
</Grid>
|
|
95
|
+
</Container>
|
|
96
|
+
```
|
|
97
|
+
|
|
98
|
+
|
|
99
|
+
### Adaptive native lists
|
|
100
|
+
|
|
101
|
+
```tsx
|
|
102
|
+
<Grid asChild columns="auto" minItemWidth="14rem" gap={16}>
|
|
103
|
+
<ul aria-label="Resources" className="m-0 list-none p-0">
|
|
104
|
+
{resources.map((resource) => (
|
|
105
|
+
<GridItem key={resource.href} asChild padding={16}>
|
|
106
|
+
<li><a href={resource.href}>{resource.label}</a></li>
|
|
107
|
+
</GridItem>
|
|
108
|
+
))}
|
|
109
|
+
</ul>
|
|
110
|
+
</Grid>
|
|
111
|
+
```
|
|
112
|
+
|
|
113
|
+
The server output already contains the native list and CSS track plan. No
|
|
114
|
+
hydration or viewport measurement is needed. `auto-fit` collapses unused tracks;
|
|
115
|
+
this is distinct from filling the last row of a fixed-column plan. Adaptive
|
|
116
|
+
items normally use the default span of one. Explicit numeric spans must fit the
|
|
117
|
+
number of tracks available in their container or CSS can create implicit tracks.
|
|
118
|
+
The application owns list markers/margins, labels, links, and data.
|
|
119
|
+
|
|
120
|
+
## Linear regions
|
|
121
|
+
|
|
122
|
+
Import `Split`, `SplitProps`, and `SplitDirection` from `@gridui/grid`.
|
|
123
|
+
Split renders one div and lays out its direct children as a single flex sequence.
|
|
124
|
+
It does not wrap the sequence or add wrappers around individual children.
|
|
125
|
+
Use direct child region elements such as `section`, `nav`, or `div`; place
|
|
126
|
+
buttons, inputs, tables, and other components with functional borders inside
|
|
127
|
+
those regions. Split owns region edge styles and must not be applied directly
|
|
128
|
+
to those components' bordered roots.
|
|
129
|
+
|
|
130
|
+
| Prop | Values | Default |
|
|
131
|
+
| --- | --- | --- |
|
|
132
|
+
| `direction` | `row`, `column`, `row-reverse`, `column-reverse`, or responsive values | `row` |
|
|
133
|
+
| `seam` | `line`, `none`, or responsive values | `line` |
|
|
134
|
+
|
|
135
|
+
Both use `{ base, md?, lg? }` with 40rem and 64rem breakpoints and preceding-value
|
|
136
|
+
fallback. A line is one logical edge between visible sibling regions, without
|
|
137
|
+
an outer frame. Reversed directions move the seam to the corresponding edge;
|
|
138
|
+
they change visual order, not DOM, reading, or keyboard order. Regions with the
|
|
139
|
+
native `hidden` attribute do not contribute seams. CSS-only responsive hiding
|
|
140
|
+
is not detectable by sibling selectors: when only one region remains visible,
|
|
141
|
+
set the owning Split to `seam={{ base: "none", lg: "line" }}` (using the same
|
|
142
|
+
breakpoint as visibility). Keep the DOM order meaningful.
|
|
143
|
+
|
|
144
|
+
```tsx
|
|
145
|
+
import { Split } from "@gridui/grid";
|
|
146
|
+
|
|
147
|
+
<Split
|
|
148
|
+
direction={{ base: "column", md: "row" }}
|
|
149
|
+
seam={{ base: "none", md: "line" }}
|
|
150
|
+
>
|
|
151
|
+
<section aria-label="Overview">...</section>
|
|
152
|
+
<section aria-label="Details">...</section>
|
|
153
|
+
</Split>
|
|
154
|
+
```
|
|
155
|
+
|
|
156
|
+
Children control their content size and flex sizing; Split does not assign equal
|
|
157
|
+
widths. Use Grid/GridItem for two-dimensional tracks or wrapping rows. A parent
|
|
158
|
+
frame supplies outer edges. Layout compositions choose these primitives instead
|
|
159
|
+
of drawing duplicate seams.
|
|
160
|
+
|
|
161
|
+
## Page frames
|
|
162
|
+
|
|
163
|
+
Named areas such as `filters`, `results`, or `methodology` belong in site CSS,
|
|
164
|
+
where their responsive order can be defined. The shared package owns geometry
|
|
165
|
+
and never imports or names business regions. The page shell is shared rather
|
|
166
|
+
than implemented in website CSS:
|
|
167
|
+
|
|
168
|
+
- `PageFrame` takes optional `header` and `footer` slots, a content width, and any number
|
|
169
|
+
of sections as children. It renders one main landmark and a flexible framed
|
|
170
|
+
filler inside main before the footer. Main fills the remaining page height.
|
|
171
|
+
Short pages fill at least 100svh without stretching
|
|
172
|
+
content sections. On longer pages the filler shrinks to zero.
|
|
173
|
+
- `FrameHeader` and `FrameFooter` render native landmarks with a full-width
|
|
174
|
+
boundary and an aligned inner region. Their padding defaults to 16 at base
|
|
175
|
+
and 24 at md/lg; `padding` accepts the same responsive values as GridItem.
|
|
176
|
+
Chrome children wrap instead of overflowing narrow screens. `FrameHeader`
|
|
177
|
+
defaults to `justify="between"`; use `justify="start"` for an adjacent brand
|
|
178
|
+
and navigation row. `FrameFooter` defaults to `contentLayout="flex"`; use
|
|
179
|
+
`contentLayout="block"` when its children own their internal layout.
|
|
180
|
+
Its `signatureAppearance="cropped"` selects the cropped signature treatment
|
|
181
|
+
through a public prop; the default is `standard`.
|
|
182
|
+
- `FrameSection` renders a semantic section, full-width leading boundary, and
|
|
183
|
+
aligned vertical edges. Compose it with `Grid frame="internal"` so the
|
|
184
|
+
section owns the outer borders and the grid owns internal seams.
|
|
185
|
+
`paddingInline` and `paddingBlock` accept responsive spacing tokens and default
|
|
186
|
+
to zero. They pad the inner content surface without moving its leading boundary
|
|
187
|
+
or inline edges. Use these props instead of targeting private frame elements.
|
|
188
|
+
- `FrameSections` groups sections from a dynamic React view and forwards native
|
|
189
|
+
div props. It inherits page tracks without adding a landmark. The shared
|
|
190
|
+
stylesheet supports React section groups. Framework host elements require an
|
|
191
|
+
application-owned adapter; see the [Astro migration example](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/docs/usage/framework-adapters.md).
|
|
192
|
+
|
|
193
|
+
Keep inline-size containment, including `container-type: inline-size`, off roots
|
|
194
|
+
that propagate the frame's column subgrid. Applying it to `FrameSections` or a
|
|
195
|
+
`FrameSection` breaks inherited track sizing. Put query containers on
|
|
196
|
+
application-owned content wrappers inside the section instead; tune Grid tracks
|
|
197
|
+
with the public responsive props. See
|
|
198
|
+
[narrative pages and artwork](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/docs/usage/narrative-pages.md#keep-query-containers-inside-the-frame)
|
|
199
|
+
for a complete composition and the corresponding browser fixture.
|
|
200
|
+
|
|
201
|
+
`FrameRail` supplies the narrow surface and forwards native div props, including
|
|
202
|
+
accessible labels or `aria-hidden` for decorative content. Its default
|
|
203
|
+
`placement="start"` keeps content at the top. Callers own text direction and
|
|
204
|
+
control layout; the shared rail does not force vertical text.
|
|
205
|
+
`placement="sticky-bottom"` places content at the natural bottom and uses CSS
|
|
206
|
+
sticky with a viewport-bottom inset and safe-area allowance. The control stays
|
|
207
|
+
inside its group's bounds. The rail does not clip focus outlines or create a
|
|
208
|
+
scroll container.
|
|
209
|
+
|
|
210
|
+
`FrameRailGroup` scopes a rail to consecutive children. Multiple sibling groups
|
|
211
|
+
describe disjoint ranges without adding landmarks, querying positions, or
|
|
212
|
+
measuring heights. Each group defines gutter, rail, and content columns once.
|
|
213
|
+
The rail track is a normal-flow grid item beside the content column, spanning
|
|
214
|
+
the group's body row. The body uses column subgrid so sections inherit the same
|
|
215
|
+
tracks, including full-width boundaries that cross the rail and both gutters.
|
|
216
|
+
Boundary layers paint above the rail surface; controls retain native focus.
|
|
217
|
+
|
|
218
|
+
`PageFrame` accepts the same `rail` and `railWidth` props. Its default
|
|
219
|
+
`railScope="page"` covers header through footer. `railScope="main"` covers main's
|
|
220
|
+
content and filler, excluding header and footer. Page rows allocate natural
|
|
221
|
+
header/footer heights and remaining space to main. Main separates natural-height
|
|
222
|
+
sections from a flexible filler, which collapses to zero on long pages.
|
|
223
|
+
No viewport/chrome measurements are needed. A main without a rail does not add a
|
|
224
|
+
second rail group. Choose a page or main rail, or local section groups; do not
|
|
225
|
+
nest rail-bearing groups. Group width comes from the surrounding frame, falling
|
|
226
|
+
back to the standard content width.
|
|
227
|
+
|
|
228
|
+
`railWidth` accepts responsive spacing tokens and defaults to `{ base: 0, md: 32 }`.
|
|
229
|
+
Zero hides the rail, including its contents, and reserves no space. Missing
|
|
230
|
+
breakpoints inherit. The rail column sits inside the existing content boundary,
|
|
231
|
+
reducing content width while retaining outer gutters, right alignment, full-width
|
|
232
|
+
bands, and exterior marks. Column subgrid is part of the modern CSS baseline for
|
|
233
|
+
the frame. No hydration or measurement is required. FrameRail owns surface and
|
|
234
|
+
placement; the group owns width and range.
|
|
235
|
+
`--gridui-page-gutter-start` optionally overrides only the start gutter; the end
|
|
236
|
+
gutter continues to use `--gridui-page-gutter`. Sites can make small-screen rails
|
|
237
|
+
flush with the viewport without changing header/footer gutters.
|
|
238
|
+
|
|
239
|
+
```tsx
|
|
240
|
+
<PageFrame header={header} footer={footer}>
|
|
241
|
+
<FrameRailGroup
|
|
242
|
+
rail={<FrameRail><span className="site-vertical-label">Research</span></FrameRail>}
|
|
243
|
+
railWidth={{ base: 0, md: 24, lg: 32 }}
|
|
244
|
+
>
|
|
245
|
+
<FrameSection>Overview</FrameSection>
|
|
246
|
+
<FrameSection>Resources</FrameSection>
|
|
247
|
+
</FrameRailGroup>
|
|
248
|
+
<FrameSection>Outside the rail range</FrameSection>
|
|
249
|
+
</PageFrame>
|
|
250
|
+
```
|
|
251
|
+
|
|
252
|
+
`FrameBoundary` is a public primitive from `@gridui/grid`. It accepts `boundary`
|
|
253
|
+
(default `line`), native div props and a ref; it has no children. Its CVA variants
|
|
254
|
+
own only appearance and normal-flow height. Parent layouts choose its width and
|
|
255
|
+
Grid span. It is inert, hidden from assistive technology and pointer-transparent.
|
|
256
|
+
Landing sections and Sidebar regions use this same renderer; no package-private
|
|
257
|
+
imports or duplicate line implementations are needed.
|
|
258
|
+
|
|
259
|
+
Each section and footer own their leading boundary through FrameBoundary. A line
|
|
260
|
+
uses one top rule; a band adds its tint and bottom rule in normal flow. A stripe
|
|
261
|
+
uses the same band height and rules with a repeating brand-colored diagonal pattern.
|
|
262
|
+
Space reserves `--gridui-boundary-space-size` (40px) without a rule or fill; none
|
|
263
|
+
renders no boundary and reserves no space. These choices do not change content
|
|
264
|
+
padding or inline edges. Stripe and space default to no decoration. The header
|
|
265
|
+
has no trailing rule. The filler paints a top rule only when it has visible
|
|
266
|
+
height, so a collapsed filler contributes no extra seam. No negative margin,
|
|
267
|
+
rail-bottom correction, or last-section selector is needed. Vertical edges stay
|
|
268
|
+
with each content surface. Websites own copy, semantic heading levels, and
|
|
269
|
+
responsive column/span choices. The frame owns alignment, chrome padding,
|
|
270
|
+
boundaries, and footer placement.
|
|
271
|
+
|
|
272
|
+
`src/shared/page.css` owns page rows, subgrid propagation, and remaining height.
|
|
273
|
+
`src/shared/rail.css` owns rail tracks, surfaces, and sticky placement. Boundary,
|
|
274
|
+
decoration, and texture keep their own styles. The public stylesheet imports
|
|
275
|
+
these owners; sites do not depend on private paths.
|
|
276
|
+
|
|
277
|
+
```tsx
|
|
278
|
+
<PageFrame
|
|
279
|
+
header={<FrameHeader>Site name</FrameHeader>}
|
|
280
|
+
footer={<FrameFooter>Source notes</FrameFooter>}
|
|
281
|
+
>
|
|
282
|
+
<FrameSection aria-label="Overview">
|
|
283
|
+
<Grid columns={{ base: 1, md: 2 }} frame="internal">
|
|
284
|
+
<GridItem padding={{ base: 16, md: 24 }}>...</GridItem>
|
|
285
|
+
<GridItem padding={{ base: 16, md: 24 }}>...</GridItem>
|
|
286
|
+
</Grid>
|
|
287
|
+
</FrameSection>
|
|
288
|
+
</PageFrame>
|
|
289
|
+
```
|
|
290
|
+
|
|
291
|
+
SSR tests cover breakpoint inheritance, prop forwarding, framed gaps, and
|
|
292
|
+
class overrides. Browser checks must confirm actual alignment and reflow;
|
|
293
|
+
serialized styles alone do not prove the grid works.
|
|
294
|
+
|
|
295
|
+
## Segmented filter bars
|
|
296
|
+
|
|
297
|
+
Keep framed filter cells stretched to the same row height so seams remain
|
|
298
|
+
continuous. Bottom-align their contents with `flex flex-col justify-end` on
|
|
299
|
+
`GridItem`; do not bottom-align the grid items themselves. Fields keep their
|
|
300
|
+
full available width. This aligns controls and action rows when labels wrap.
|
|
301
|
+
Use equal fractional tracks for fields and an automatic track for actions,
|
|
302
|
+
stacking or spanning the action cell at smaller breakpoints.
|
|
303
|
+
|
|
304
|
+
Within a table cell, pair primary content and a trailing action with a full-width
|
|
305
|
+
flex row, centered cross-axis alignment, `justify-between`, and a spacing-token
|
|
306
|
+
gap. Keep icon actions non-shrinking and retain the cell's existing padding.
|
|
307
|
+
|
|
308
|
+
## Dashboard frames
|
|
309
|
+
|
|
310
|
+
`DashboardFrame` is a full-height, full-width page host with inline gutters and
|
|
311
|
+
structural edges. Unlike `PageFrame`, it renders no `main`; the composed workspace
|
|
312
|
+
owns that landmark. Give its parent a definite height. Four independent CVA
|
|
313
|
+
variants configure its logical start and end gutters:
|
|
314
|
+
|
|
315
|
+
| Prop | Applies to | Default |
|
|
316
|
+
| --- | --- | --- |
|
|
317
|
+
| `startSize` | Start gutter from 40rem | `medium` |
|
|
318
|
+
| `endSize` | End gutter from 40rem | `medium` |
|
|
319
|
+
| `compactStartSize` | Start gutter below 40rem | `small` |
|
|
320
|
+
| `compactEndSize` | End gutter below 40rem | `small` |
|
|
321
|
+
|
|
322
|
+
Every option accepts `none`, `small`, `medium`, or `large`. `none` is exactly 0px;
|
|
323
|
+
the other options use spacing tokens 8, 16, and 24. Start/end mean left/right in LTR and right/left in RTL. Configure both
|
|
324
|
+
wide-screen options for symmetric gutters; compact defaults remain independent.
|
|
325
|
+
The breakpoint is viewport-based, like the other Grid frame styles. Nonzero size
|
|
326
|
+
options retain at least the theme hover/focus outline extent, even when spacing
|
|
327
|
+
tokens are reduced. `none` bypasses that minimum and disables ornaments on that
|
|
328
|
+
edge; the structural border remains. `DashboardFrameSize` exports the common size
|
|
329
|
+
type.
|
|
330
|
+
|
|
331
|
+
### Composed frame regions
|
|
332
|
+
|
|
333
|
+
`FrameRegion` declares which physical frame edge a composition touches through
|
|
334
|
+
`edge="left" | "right" | "both" | "none"` (default `none`). It does not change
|
|
335
|
+
its host's layout. Use `asChild` to retain a semantic element. Grid resolves the
|
|
336
|
+
adjacent gutter and structural-border distances; consumers do not calculate
|
|
337
|
+
negative offsets or read frame capacity variables. Nested regions start with no
|
|
338
|
+
outer-frame capacity unless a new `DashboardFrame` establishes it.
|
|
339
|
+
|
|
340
|
+
`FrameRegionRow` is a grid canvas within that region. It extends through the
|
|
341
|
+
selected outer gutter and owns these public grid lines:
|
|
342
|
+
|
|
343
|
+
| Lines | Purpose |
|
|
344
|
+
| --- | --- |
|
|
345
|
+
| `frame-left / frame-right` (or `1 / -1`) | Entire canvas, including the gutter |
|
|
346
|
+
| `surface-left / surface-right` | Original composition surface |
|
|
347
|
+
| `content-left / content-right` | Default child content column |
|
|
348
|
+
| `accessory-left / surface-right` | Intrinsic column at the physical right edge |
|
|
349
|
+
|
|
350
|
+
`contentInset` accepts a CSS length or pixel number (default 0). It reserves a
|
|
351
|
+
right content inset before the accessory column and any left inset that the
|
|
352
|
+
outer gutter cannot supply. An accessory such as a scrollbar sizes its column
|
|
353
|
+
intrinsically. Row text keeps its inherited direction; physical line names and
|
|
354
|
+
accessory placement stay stable in RTL. Rows support `asChild`, including a
|
|
355
|
+
scroll-area root, and nested CSS subgrids can reuse these lines.
|
|
356
|
+
|
|
357
|
+
`FrameBoundary extent="frame"` spans the full row. Its default `"content"`
|
|
358
|
+
uses the content column. These are normal-flow grid spans, not translated
|
|
359
|
+
pseudo-elements. Sidebar composes these primitives for fixed and scrolling
|
|
360
|
+
boundaries and uses an unframed region for its Drawer and main content.
|
|
361
|
+
|
|
362
|
+
`Split order="physical"` keeps row/row-reverse ordering and seams at the same
|
|
363
|
+
physical edges in RTL; its default `"logical"` follows writing direction.
|
|
364
|
+
Column ordering is unaffected. Sidebar uses physical ordering because its
|
|
365
|
+
`side="left" | "right"` API describes physical positions.
|
|
366
|
+
|
|
367
|
+
`decoration` accepts `none` (default), `nodes`, `marks`, `corners`, or `ticks`
|
|
368
|
+
and supplies the default for both edges. `startDecoration` and `endDecoration`
|
|
369
|
+
accept the same styles and override only their logical edge; an explicit `none`
|
|
370
|
+
hides that edge's ornament without changing its gutter width or structural border.
|
|
371
|
+
Omitted overrides inherit `decoration`. Start/end follow the same LTR/RTL mapping
|
|
372
|
+
as the size options. Both sides still hide their ornaments below 40rem.
|
|
373
|
+
Dashboard and Landing frames use the same package-local single-edge decoration
|
|
374
|
+
renderer and styles. Each ornament paints only its own edge; zero-width gutters
|
|
375
|
+
produce a zero-width ornament. Dashboard constrains their outsets to its gutter width and viewport
|
|
376
|
+
height, including small, asymmetric gutters; it hides ornaments below 40rem while preserving
|
|
377
|
+
outline clearance. Decorations are inert and never intercept pointer events.
|
|
378
|
+
|
|
379
|
+
It owns no navigation, collapse state, scroll region, or application header.
|
|
380
|
+
|
|
381
|
+
```tsx
|
|
382
|
+
<DashboardFrame
|
|
383
|
+
startSize="large"
|
|
384
|
+
endSize="small"
|
|
385
|
+
compactStartSize="small"
|
|
386
|
+
compactEndSize="medium"
|
|
387
|
+
decoration="ticks"
|
|
388
|
+
endDecoration="corners"
|
|
389
|
+
>
|
|
390
|
+
<SidebarLayout>
|
|
391
|
+
<Sidebar>{navigation}</Sidebar>
|
|
392
|
+
<SidebarMain>{content}</SidebarMain>
|
|
393
|
+
</SidebarLayout>
|
|
394
|
+
</DashboardFrame>
|
|
395
|
+
```
|
|
396
|
+
|
|
397
|
+
Import `DashboardFrame` from `@gridui/grid`; Sidebar components belong to
|
|
398
|
+
`@gridui/sidebar`. Sidebar and main scroll independently inside the fixed frame.
|
package/package.json
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gridui/grid",
|
|
3
|
-
"version": "2.3.
|
|
3
|
+
"version": "2.3.1",
|
|
4
4
|
"description": "GridUI React grid",
|
|
5
5
|
"license": "UNLICENSED",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"files": [
|
|
8
8
|
"dist",
|
|
9
|
+
"docs",
|
|
9
10
|
"README.md"
|
|
10
11
|
],
|
|
11
12
|
"sideEffects": [
|
|
@@ -22,8 +23,8 @@
|
|
|
22
23
|
"access": "public"
|
|
23
24
|
},
|
|
24
25
|
"dependencies": {
|
|
25
|
-
"@gridui/style-utils": "^2.1.
|
|
26
|
-
"@gridui/theme": "^2.3.
|
|
26
|
+
"@gridui/style-utils": "^2.1.4",
|
|
27
|
+
"@gridui/theme": "^2.3.2",
|
|
27
28
|
"@radix-ui/react-slot": "1.5.0",
|
|
28
29
|
"class-variance-authority": "0.7.1"
|
|
29
30
|
},
|