@fragments-sdk/ui 0.13.0 → 0.15.1

package/dist/components/Grid/Grid.module.scss.cjs

@@ -1,62 +1,65 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const grid = "_grid_1ki22_1";
-const columns1 = "_columns1_1ki22_6";
-const columns2 = "_columns2_1ki22_10";
-const columns3 = "_columns3_1ki22_14";
-const columns4 = "_columns4_1ki22_18";
-const columns5 = "_columns5_1ki22_22";
-const columns6 = "_columns6_1ki22_26";
-const columns7 = "_columns7_1ki22_30";
-const columns8 = "_columns8_1ki22_34";
-const columns9 = "_columns9_1ki22_38";
-const columns10 = "_columns10_1ki22_42";
-const columns11 = "_columns11_1ki22_46";
-const columns12 = "_columns12_1ki22_50";
-const columnsAuto = "_columnsAuto_1ki22_54";
-const columnsResponsive = "_columnsResponsive_1ki22_58";
-const gapNone = "_gapNone_1ki22_83";
-const gapXs = "_gapXs_1ki22_87";
-const gapSm = "_gapSm_1ki22_91";
-const gapMd = "_gapMd_1ki22_95";
-const gapLg = "_gapLg_1ki22_99";
-const gapXl = "_gapXl_1ki22_103";
-const paddingNone = "_paddingNone_1ki22_107";
-const paddingSm = "_paddingSm_1ki22_111";
-const paddingMd = "_paddingMd_1ki22_115";
-const paddingLg = "_paddingLg_1ki22_119";
-const alignStart = "_alignStart_1ki22_123";
-const alignCenter = "_alignCenter_1ki22_127";
-const alignEnd = "_alignEnd_1ki22_131";
-const alignStretch = "_alignStretch_1ki22_135";
-const justifyStart = "_justifyStart_1ki22_139";
-const justifyCenter = "_justifyCenter_1ki22_143";
-const justifyEnd = "_justifyEnd_1ki22_147";
-const justifyStretch = "_justifyStretch_1ki22_151";
-const item = "_item_1ki22_155";
-const colSpan1 = "_colSpan1_1ki22_159";
-const colSpan2 = "_colSpan2_1ki22_163";
-const colSpan3 = "_colSpan3_1ki22_167";
-const colSpan4 = "_colSpan4_1ki22_171";
-const colSpan5 = "_colSpan5_1ki22_175";
-const colSpan6 = "_colSpan6_1ki22_179";
-const colSpan7 = "_colSpan7_1ki22_183";
-const colSpan8 = "_colSpan8_1ki22_187";
-const colSpan9 = "_colSpan9_1ki22_191";
-const colSpan10 = "_colSpan10_1ki22_195";
-const colSpan11 = "_colSpan11_1ki22_199";
-const colSpan12 = "_colSpan12_1ki22_203";
-const colSpanFull = "_colSpanFull_1ki22_207";
-const rowSpan1 = "_rowSpan1_1ki22_211";
-const rowSpan2 = "_rowSpan2_1ki22_215";
-const rowSpan3 = "_rowSpan3_1ki22_219";
-const rowSpan4 = "_rowSpan4_1ki22_223";
-const rowSpan5 = "_rowSpan5_1ki22_227";
-const rowSpan6 = "_rowSpan6_1ki22_231";
-const selfAlignStart = "_selfAlignStart_1ki22_235";
-const selfAlignCenter = "_selfAlignCenter_1ki22_239";
-const selfAlignEnd = "_selfAlignEnd_1ki22_243";
-const selfAlignStretch = "_selfAlignStretch_1ki22_247";
+const grid = "_grid_1jgik_1";
+const columns1 = "_columns1_1jgik_6";
+const columns2 = "_columns2_1jgik_10";
+const columns3 = "_columns3_1jgik_14";
+const columns4 = "_columns4_1jgik_18";
+const columns5 = "_columns5_1jgik_22";
+const columns6 = "_columns6_1jgik_26";
+const columns7 = "_columns7_1jgik_30";
+const columns8 = "_columns8_1jgik_34";
+const columns9 = "_columns9_1jgik_38";
+const columns10 = "_columns10_1jgik_42";
+const columns11 = "_columns11_1jgik_46";
+const columns12 = "_columns12_1jgik_50";
+const columnsAuto = "_columnsAuto_1jgik_54";
+const columnsResponsive = "_columnsResponsive_1jgik_58";
+const gapNone = "_gapNone_1jgik_83";
+const gapXs = "_gapXs_1jgik_87";
+const gapSm = "_gapSm_1jgik_91";
+const gapMd = "_gapMd_1jgik_95";
+const gapLg = "_gapLg_1jgik_99";
+const gapXl = "_gapXl_1jgik_103";
+const paddingNone = "_paddingNone_1jgik_107";
+const paddingSm = "_paddingSm_1jgik_111";
+const paddingMd = "_paddingMd_1jgik_115";
+const paddingLg = "_paddingLg_1jgik_119";
+const alignStart = "_alignStart_1jgik_123";
+const alignCenter = "_alignCenter_1jgik_127";
+const alignEnd = "_alignEnd_1jgik_131";
+const alignStretch = "_alignStretch_1jgik_135";
+const justifyStart = "_justifyStart_1jgik_139";
+const justifyCenter = "_justifyCenter_1jgik_143";
+const justifyEnd = "_justifyEnd_1jgik_147";
+const justifyStretch = "_justifyStretch_1jgik_151";
+const item = "_item_1jgik_155";
+const colSpan1 = "_colSpan1_1jgik_159";
+const colSpan2 = "_colSpan2_1jgik_163";
+const colSpan3 = "_colSpan3_1jgik_167";
+const colSpan4 = "_colSpan4_1jgik_171";
+const colSpan5 = "_colSpan5_1jgik_175";
+const colSpan6 = "_colSpan6_1jgik_179";
+const colSpan7 = "_colSpan7_1jgik_183";
+const colSpan8 = "_colSpan8_1jgik_187";
+const colSpan9 = "_colSpan9_1jgik_191";
+const colSpan10 = "_colSpan10_1jgik_195";
+const colSpan11 = "_colSpan11_1jgik_199";
+const colSpan12 = "_colSpan12_1jgik_203";
+const colSpanFull = "_colSpanFull_1jgik_207";
+const rowSpan1 = "_rowSpan1_1jgik_211";
+const rowSpan2 = "_rowSpan2_1jgik_215";
+const rowSpan3 = "_rowSpan3_1jgik_219";
+const rowSpan4 = "_rowSpan4_1jgik_223";
+const rowSpan5 = "_rowSpan5_1jgik_227";
+const rowSpan6 = "_rowSpan6_1jgik_231";
+const selfAlignStart = "_selfAlignStart_1jgik_235";
+const selfAlignCenter = "_selfAlignCenter_1jgik_239";
+const selfAlignEnd = "_selfAlignEnd_1jgik_243";
+const selfAlignStretch = "_selfAlignStretch_1jgik_247";
+const subgridRows = "_subgridRows_1jgik_251";
+const subgridColumns = "_subgridColumns_1jgik_256";
+const subgridBoth = "_subgridBoth_1jgik_261";
 const styles = {
   grid,
   columns1,
@@ -114,7 +117,10 @@ const styles = {
   selfAlignStart,
   selfAlignCenter,
   selfAlignEnd,
-  selfAlignStretch
+  selfAlignStretch,
+  subgridRows,
+  subgridColumns,
+  subgridBoth
 };
 exports.alignCenter = alignCenter;
 exports.alignEnd = alignEnd;
@@ -174,4 +180,6 @@ exports.selfAlignCenter = selfAlignCenter;
 exports.selfAlignEnd = selfAlignEnd;
 exports.selfAlignStart = selfAlignStart;
 exports.selfAlignStretch = selfAlignStretch;
-//# sourceMappingURL=Grid.module.scss.cjs.map
+exports.subgridBoth = subgridBoth;
+exports.subgridColumns = subgridColumns;
+exports.subgridRows = subgridRows;

package/dist/components/Grid/Grid.module.scss.js

@@ -1,60 +1,63 @@
-const grid = "_grid_1ki22_1";
-const columns1 = "_columns1_1ki22_6";
-const columns2 = "_columns2_1ki22_10";
-const columns3 = "_columns3_1ki22_14";
-const columns4 = "_columns4_1ki22_18";
-const columns5 = "_columns5_1ki22_22";
-const columns6 = "_columns6_1ki22_26";
-const columns7 = "_columns7_1ki22_30";
-const columns8 = "_columns8_1ki22_34";
-const columns9 = "_columns9_1ki22_38";
-const columns10 = "_columns10_1ki22_42";
-const columns11 = "_columns11_1ki22_46";
-const columns12 = "_columns12_1ki22_50";
-const columnsAuto = "_columnsAuto_1ki22_54";
-const columnsResponsive = "_columnsResponsive_1ki22_58";
-const gapNone = "_gapNone_1ki22_83";
-const gapXs = "_gapXs_1ki22_87";
-const gapSm = "_gapSm_1ki22_91";
-const gapMd = "_gapMd_1ki22_95";
-const gapLg = "_gapLg_1ki22_99";
-const gapXl = "_gapXl_1ki22_103";
-const paddingNone = "_paddingNone_1ki22_107";
-const paddingSm = "_paddingSm_1ki22_111";
-const paddingMd = "_paddingMd_1ki22_115";
-const paddingLg = "_paddingLg_1ki22_119";
-const alignStart = "_alignStart_1ki22_123";
-const alignCenter = "_alignCenter_1ki22_127";
-const alignEnd = "_alignEnd_1ki22_131";
-const alignStretch = "_alignStretch_1ki22_135";
-const justifyStart = "_justifyStart_1ki22_139";
-const justifyCenter = "_justifyCenter_1ki22_143";
-const justifyEnd = "_justifyEnd_1ki22_147";
-const justifyStretch = "_justifyStretch_1ki22_151";
-const item = "_item_1ki22_155";
-const colSpan1 = "_colSpan1_1ki22_159";
-const colSpan2 = "_colSpan2_1ki22_163";
-const colSpan3 = "_colSpan3_1ki22_167";
-const colSpan4 = "_colSpan4_1ki22_171";
-const colSpan5 = "_colSpan5_1ki22_175";
-const colSpan6 = "_colSpan6_1ki22_179";
-const colSpan7 = "_colSpan7_1ki22_183";
-const colSpan8 = "_colSpan8_1ki22_187";
-const colSpan9 = "_colSpan9_1ki22_191";
-const colSpan10 = "_colSpan10_1ki22_195";
-const colSpan11 = "_colSpan11_1ki22_199";
-const colSpan12 = "_colSpan12_1ki22_203";
-const colSpanFull = "_colSpanFull_1ki22_207";
-const rowSpan1 = "_rowSpan1_1ki22_211";
-const rowSpan2 = "_rowSpan2_1ki22_215";
-const rowSpan3 = "_rowSpan3_1ki22_219";
-const rowSpan4 = "_rowSpan4_1ki22_223";
-const rowSpan5 = "_rowSpan5_1ki22_227";
-const rowSpan6 = "_rowSpan6_1ki22_231";
-const selfAlignStart = "_selfAlignStart_1ki22_235";
-const selfAlignCenter = "_selfAlignCenter_1ki22_239";
-const selfAlignEnd = "_selfAlignEnd_1ki22_243";
-const selfAlignStretch = "_selfAlignStretch_1ki22_247";
+const grid = "_grid_1jgik_1";
+const columns1 = "_columns1_1jgik_6";
+const columns2 = "_columns2_1jgik_10";
+const columns3 = "_columns3_1jgik_14";
+const columns4 = "_columns4_1jgik_18";
+const columns5 = "_columns5_1jgik_22";
+const columns6 = "_columns6_1jgik_26";
+const columns7 = "_columns7_1jgik_30";
+const columns8 = "_columns8_1jgik_34";
+const columns9 = "_columns9_1jgik_38";
+const columns10 = "_columns10_1jgik_42";
+const columns11 = "_columns11_1jgik_46";
+const columns12 = "_columns12_1jgik_50";
+const columnsAuto = "_columnsAuto_1jgik_54";
+const columnsResponsive = "_columnsResponsive_1jgik_58";
+const gapNone = "_gapNone_1jgik_83";
+const gapXs = "_gapXs_1jgik_87";
+const gapSm = "_gapSm_1jgik_91";
+const gapMd = "_gapMd_1jgik_95";
+const gapLg = "_gapLg_1jgik_99";
+const gapXl = "_gapXl_1jgik_103";
+const paddingNone = "_paddingNone_1jgik_107";
+const paddingSm = "_paddingSm_1jgik_111";
+const paddingMd = "_paddingMd_1jgik_115";
+const paddingLg = "_paddingLg_1jgik_119";
+const alignStart = "_alignStart_1jgik_123";
+const alignCenter = "_alignCenter_1jgik_127";
+const alignEnd = "_alignEnd_1jgik_131";
+const alignStretch = "_alignStretch_1jgik_135";
+const justifyStart = "_justifyStart_1jgik_139";
+const justifyCenter = "_justifyCenter_1jgik_143";
+const justifyEnd = "_justifyEnd_1jgik_147";
+const justifyStretch = "_justifyStretch_1jgik_151";
+const item = "_item_1jgik_155";
+const colSpan1 = "_colSpan1_1jgik_159";
+const colSpan2 = "_colSpan2_1jgik_163";
+const colSpan3 = "_colSpan3_1jgik_167";
+const colSpan4 = "_colSpan4_1jgik_171";
+const colSpan5 = "_colSpan5_1jgik_175";
+const colSpan6 = "_colSpan6_1jgik_179";
+const colSpan7 = "_colSpan7_1jgik_183";
+const colSpan8 = "_colSpan8_1jgik_187";
+const colSpan9 = "_colSpan9_1jgik_191";
+const colSpan10 = "_colSpan10_1jgik_195";
+const colSpan11 = "_colSpan11_1jgik_199";
+const colSpan12 = "_colSpan12_1jgik_203";
+const colSpanFull = "_colSpanFull_1jgik_207";
+const rowSpan1 = "_rowSpan1_1jgik_211";
+const rowSpan2 = "_rowSpan2_1jgik_215";
+const rowSpan3 = "_rowSpan3_1jgik_219";
+const rowSpan4 = "_rowSpan4_1jgik_223";
+const rowSpan5 = "_rowSpan5_1jgik_227";
+const rowSpan6 = "_rowSpan6_1jgik_231";
+const selfAlignStart = "_selfAlignStart_1jgik_235";
+const selfAlignCenter = "_selfAlignCenter_1jgik_239";
+const selfAlignEnd = "_selfAlignEnd_1jgik_243";
+const selfAlignStretch = "_selfAlignStretch_1jgik_247";
+const subgridRows = "_subgridRows_1jgik_251";
+const subgridColumns = "_subgridColumns_1jgik_256";
+const subgridBoth = "_subgridBoth_1jgik_261";
 const styles = {
   grid,
   columns1,
@@ -112,7 +115,10 @@ const styles = {
   selfAlignStart,
   selfAlignCenter,
   selfAlignEnd,
-  selfAlignStretch
+  selfAlignStretch,
+  subgridRows,
+  subgridColumns,
+  subgridBoth
 };
 export {
   alignCenter,
@@ -172,6 +178,8 @@ export {
   selfAlignCenter,
   selfAlignEnd,
   selfAlignStart,
-  selfAlignStretch
+  selfAlignStretch,
+  subgridBoth,
+  subgridColumns,
+  subgridRows
 };
-//# sourceMappingURL=Grid.module.scss.js.map

package/dist/components/Grid/index.cjs

@@ -47,7 +47,8 @@ const Grid = React__namespace.forwardRef(
     justifyItems,
     padding = "none",
     className,
-    style
+    style,
+    ...htmlProps
   }, ref) {
     let columnsClass;
     let inlineStyle;
@@ -81,25 +82,35 @@ const Grid = React__namespace.forwardRef(
       className
     ].filter(Boolean).join(" ");
     const mergedStyle = inlineStyle ? { ...inlineStyle, ...style } : style;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: classes, style: mergedStyle, children });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlProps, ref, className: classes, style: mergedStyle, children });
   }
 );
+const subgridClasses = {
+  rows: Grid_module.default.subgridRows,
+  columns: Grid_module.default.subgridColumns,
+  both: Grid_module.default.subgridBoth
+};
 const GridItem = React__namespace.forwardRef(
   function GridItem2({
     children,
     colSpan,
     rowSpan,
     alignSelf,
-    className
+    subgrid,
+    className,
+    style,
+    ...htmlProps
   }, ref) {
+    const subgridClass = subgrid ? subgridClasses[subgrid === true ? "rows" : subgrid] : void 0;
     const classes = [
       Grid_module.default.item,
       colSpan && (colSpan === "full" ? Grid_module.default.colSpanFull : Grid_module.default[`colSpan${colSpan}`]),
       rowSpan && Grid_module.default[`rowSpan${rowSpan}`],
       alignSelf && Grid_module.default[`selfAlign${cap(alignSelf)}`],
+      subgridClass,
       className
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: classes, children });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlProps, ref, className: classes, style, children });
   }
 );
 function cap(s) {
@@ -107,4 +118,3 @@ function cap(s) {
 }
 Grid.Item = GridItem;
 exports.Grid = Grid;
-//# sourceMappingURL=index.cjs.map

package/dist/components/Grid/index.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 type ColumnCount = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+type GapScale = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
 /** Responsive value — either a single value or per-breakpoint overrides */
 export interface ResponsiveColumns {
     /** Default (mobile-first) */
@@ -17,7 +18,7 @@ export interface ResponsiveColumns {
  * CSS Grid layout component with responsive columns.
  * @see https://usefragments.com/components/grid
  */
-export interface GridProps {
+export interface GridProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'style' | 'className'> {
     children?: React.ReactNode;
     /**
      * Number of columns.
@@ -29,7 +30,7 @@ export interface GridProps {
     /** Minimum width for auto-fill columns (only used with columns="auto") */
     minChildWidth?: string;
     /** Gap between grid items. Accepts string tokens or numbers (1-8) mapping to the spacing scale */
-    gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
+    gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | GapScale;
     /** Vertical alignment of items within their cells */
     alignItems?: 'start' | 'center' | 'end' | 'stretch';
     /** Horizontal alignment of items within their cells */
@@ -41,7 +42,7 @@ export interface GridProps {
     /** Inline styles */
     style?: React.CSSProperties;
 }
-export interface GridItemProps {
+export interface GridItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'className'> {
     children?: React.ReactNode;
     /** Number of columns this item spans */
     colSpan?: ColumnCount | 'full';
@@ -49,8 +50,17 @@ export interface GridItemProps {
     rowSpan?: 1 | 2 | 3 | 4 | 5 | 6;
     /** Override alignment for this item */
     alignSelf?: 'start' | 'center' | 'end' | 'stretch';
+    /**
+     * Enable CSS subgrid so children align to parent grid tracks.
+     * - `true` or `"rows"` — children align to parent row tracks
+     * - `"columns"` — children align to parent column tracks
+     * - `"both"` — children align to both row and column tracks
+     * Requires the item to span multiple rows/columns for visible effect.
+     */
+    subgrid?: boolean | 'rows' | 'columns' | 'both';
     /** Additional class name */
     className?: string;
+    style?: React.CSSProperties;
 }
 export declare const Grid: GridComponent;
 declare const GridItem: React.ForwardRefExoticComponent<GridItemProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Grid/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Grid/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,KAAK,WAAW,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAEpE,2EAA2E;AAC3E,MAAM,WAAW,iBAAiB;IAChC,6BAA6B;IAC7B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,aAAa;IACb,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,aAAa;IACb,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,cAAc;IACd,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,cAAc;IACd,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB;AAED;;;GAGG;AACH,MAAM,WAAW,SAAS;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;;OAKG;IACH,OAAO,CAAC,EAAE,WAAW,GAAG,iBAAiB,GAAG,MAAM,CAAC;IACnD,0EAA0E;IAC1E,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kGAAkG;IAClG,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;IACzD,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IACpD,uDAAuD;IACvD,YAAY,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IACtD,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACtC,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,wCAAwC;IACxC,OAAO,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IAC/B,qCAAqC;IACrC,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAChC,uCAAuC;IACvC,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IACnD,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAgCD,eAAO,MAAM,IAAI,EA8DZ,aAAa,CAAC;AAMnB,QAAA,MAAM,QAAQ,sFA2Bb,CAAC;AAcF,UAAU,aACR,SAAQ,KAAK,CAAC,yBAAyB,CAAC,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;IACxF,IAAI,EAAE,OAAO,QAAQ,CAAC;CACvB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Grid/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,KAAK,WAAW,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AACpE,KAAK,QAAQ,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAE9C,2EAA2E;AAC3E,MAAM,WAAW,iBAAiB;IAChC,6BAA6B;IAC7B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,aAAa;IACb,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,aAAa;IACb,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,cAAc;IACd,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,cAAc;IACd,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB;AAED;;;GAGG;AACH,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,OAAO,GAAG,WAAW,CAAC;IAC/G,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;;OAKG;IACH,OAAO,CAAC,EAAE,WAAW,GAAG,iBAAiB,GAAG,MAAM,CAAC;IACnD,0EAA0E;IAC1E,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kGAAkG;IAClG,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,QAAQ,CAAC;IAC3D,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IACpD,uDAAuD;IACvD,YAAY,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IACtD,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACtC,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,WAAW,CAAC;IACzG,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,wCAAwC;IACxC,OAAO,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IAC/B,qCAAqC;IACrC,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAChC,uCAAuC;IACvC,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IACnD;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;IAChD,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAgCD,eAAO,MAAM,IAAI,EA+DZ,aAAa,CAAC;AAYnB,QAAA,MAAM,QAAQ,sFAmCb,CAAC;AAcF,UAAU,aACR,SAAQ,KAAK,CAAC,yBAAyB,CAAC,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;IACxF,IAAI,EAAE,OAAO,QAAQ,CAAC;CACvB"}

package/dist/components/Grid/index.js

@@ -28,7 +28,8 @@ const Grid = React.forwardRef(
     justifyItems,
     padding = "none",
     className,
-    style
+    style,
+    ...htmlProps
   }, ref) {
     let columnsClass;
     let inlineStyle;
@@ -62,25 +63,35 @@ const Grid = React.forwardRef(
       className
     ].filter(Boolean).join(" ");
     const mergedStyle = inlineStyle ? { ...inlineStyle, ...style } : style;
-    return /* @__PURE__ */ jsx("div", { ref, className: classes, style: mergedStyle, children });
+    return /* @__PURE__ */ jsx("div", { ...htmlProps, ref, className: classes, style: mergedStyle, children });
   }
 );
+const subgridClasses = {
+  rows: styles.subgridRows,
+  columns: styles.subgridColumns,
+  both: styles.subgridBoth
+};
 const GridItem = React.forwardRef(
   function GridItem2({
     children,
     colSpan,
     rowSpan,
     alignSelf,
-    className
+    subgrid,
+    className,
+    style,
+    ...htmlProps
   }, ref) {
+    const subgridClass = subgrid ? subgridClasses[subgrid === true ? "rows" : subgrid] : void 0;
     const classes = [
       styles.item,
       colSpan && (colSpan === "full" ? styles.colSpanFull : styles[`colSpan${colSpan}`]),
       rowSpan && styles[`rowSpan${rowSpan}`],
       alignSelf && styles[`selfAlign${cap(alignSelf)}`],
+      subgridClass,
       className
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsx("div", { ref, className: classes, children });
+    return /* @__PURE__ */ jsx("div", { ...htmlProps, ref, className: classes, style, children });
   }
 );
 function cap(s) {
@@ -90,4 +101,3 @@ Grid.Item = GridItem;
 export {
   Grid
 };
-//# sourceMappingURL=index.js.map

package/dist/components/Header/Header.module.scss.cjs

@@ -1,26 +1,26 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const header = "_header_8fsw3_1";
-const fixed = "_fixed_8fsw3_11";
-const sticky = "_sticky_8fsw3_18";
-const container = "_container_8fsw3_23";
-const brand = "_brand_8fsw3_36";
-const nav = "_nav_8fsw3_54";
-const navList = "_navList_8fsw3_64";
-const navItem = "_navItem_8fsw3_73";
-const navItemActive = "_navItemActive_8fsw3_121";
-const navMenuTrigger = "_navMenuTrigger_8fsw3_135";
-const navMenuChevron = "_navMenuChevron_8fsw3_140";
-const navMenuPositioner = "_navMenuPositioner_8fsw3_148";
-const navMenuPopup = "_navMenuPopup_8fsw3_153";
-const navMenuItem = "_navMenuItem_8fsw3_174";
-const navMenuItemActive = "_navMenuItemActive_8fsw3_210";
-const search = "_search_8fsw3_232";
-const searchExpandable = "_searchExpandable_8fsw3_242";
-const actions = "_actions_8fsw3_246";
-const trigger = "_trigger_8fsw3_253";
-const spacer = "_spacer_8fsw3_295";
-const skipLink = "_skipLink_8fsw3_299";
+const header = "_header_cs80v_1";
+const fixed = "_fixed_cs80v_13";
+const sticky = "_sticky_cs80v_20";
+const container = "_container_cs80v_25";
+const brand = "_brand_cs80v_38";
+const nav = "_nav_cs80v_56";
+const navList = "_navList_cs80v_66";
+const navItem = "_navItem_cs80v_75";
+const navItemActive = "_navItemActive_cs80v_123";
+const navMenuTrigger = "_navMenuTrigger_cs80v_137";
+const navMenuChevron = "_navMenuChevron_cs80v_142";
+const navMenuPositioner = "_navMenuPositioner_cs80v_150";
+const navMenuPopup = "_navMenuPopup_cs80v_155";
+const navMenuItem = "_navMenuItem_cs80v_176";
+const navMenuItemActive = "_navMenuItemActive_cs80v_212";
+const search = "_search_cs80v_234";
+const searchExpandable = "_searchExpandable_cs80v_244";
+const actions = "_actions_cs80v_248";
+const trigger = "_trigger_cs80v_255";
+const spacer = "_spacer_cs80v_297";
+const skipLink = "_skipLink_cs80v_301";
 const styles = {
   header,
   fixed,
@@ -66,4 +66,3 @@ exports.skipLink = skipLink;
 exports.spacer = spacer;
 exports.sticky = sticky;
 exports.trigger = trigger;
-//# sourceMappingURL=Header.module.scss.cjs.map

package/dist/components/Header/Header.module.scss.js

@@ -1,24 +1,24 @@
-const header = "_header_8fsw3_1";
-const fixed = "_fixed_8fsw3_11";
-const sticky = "_sticky_8fsw3_18";
-const container = "_container_8fsw3_23";
-const brand = "_brand_8fsw3_36";
-const nav = "_nav_8fsw3_54";
-const navList = "_navList_8fsw3_64";
-const navItem = "_navItem_8fsw3_73";
-const navItemActive = "_navItemActive_8fsw3_121";
-const navMenuTrigger = "_navMenuTrigger_8fsw3_135";
-const navMenuChevron = "_navMenuChevron_8fsw3_140";
-const navMenuPositioner = "_navMenuPositioner_8fsw3_148";
-const navMenuPopup = "_navMenuPopup_8fsw3_153";
-const navMenuItem = "_navMenuItem_8fsw3_174";
-const navMenuItemActive = "_navMenuItemActive_8fsw3_210";
-const search = "_search_8fsw3_232";
-const searchExpandable = "_searchExpandable_8fsw3_242";
-const actions = "_actions_8fsw3_246";
-const trigger = "_trigger_8fsw3_253";
-const spacer = "_spacer_8fsw3_295";
-const skipLink = "_skipLink_8fsw3_299";
+const header = "_header_cs80v_1";
+const fixed = "_fixed_cs80v_13";
+const sticky = "_sticky_cs80v_20";
+const container = "_container_cs80v_25";
+const brand = "_brand_cs80v_38";
+const nav = "_nav_cs80v_56";
+const navList = "_navList_cs80v_66";
+const navItem = "_navItem_cs80v_75";
+const navItemActive = "_navItemActive_cs80v_123";
+const navMenuTrigger = "_navMenuTrigger_cs80v_137";
+const navMenuChevron = "_navMenuChevron_cs80v_142";
+const navMenuPositioner = "_navMenuPositioner_cs80v_150";
+const navMenuPopup = "_navMenuPopup_cs80v_155";
+const navMenuItem = "_navMenuItem_cs80v_176";
+const navMenuItemActive = "_navMenuItemActive_cs80v_212";
+const search = "_search_cs80v_234";
+const searchExpandable = "_searchExpandable_cs80v_244";
+const actions = "_actions_cs80v_248";
+const trigger = "_trigger_cs80v_255";
+const spacer = "_spacer_cs80v_297";
+const skipLink = "_skipLink_cs80v_301";
 const styles = {
   header,
   fixed,
@@ -66,4 +66,3 @@ export {
   sticky,
   trigger
 };
-//# sourceMappingURL=Header.module.scss.js.map